/* Lawyer Justice HTML5 Template */


/************ TABLE OF CONTENTS ***************
1. Fonts
2. Reset
3. Global
4. Main Header
5. Main Slider
6. Services Section
7. About Company
8. Company History
9. Two Column Fluid
10. Our Team
11. Consultation Section
12. Featured News / Blog Section
13. Sponsors Section
14. Info Section
15. Map Section
16. Main Footer
17. Page Title
18. Breadcrumb
19. Welcome Section
20. Our Experience
21. Awards Section
22. Our Gallery
23. Gallery Details / Portfolio Details
25. 404 Page
26. Practice Areas
27. Single Law Page
28. Team Details / Single Attorney
29. Faqs Page
30. Blog Grid View
31. Blog List View
32. Blog Classic View
33. Sponsors Style TwoBlog Single Post
34. Shop
35. Shop Single Item
36. Contact Section
37. Register / Login 
38. Shopping Cart
39. Checkout
40. Styled Pagination

**********************************************/


@import url('font-awesome.css');
@import url('flaticon.css');
@import url('animate.css');
@import url('owl.css');
@import url('jquery.mCustomScrollbar.min.css');
@import url('jquery.fancybox.css');
@import url('hover.css');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Mulish:wght@300;400;600&display=swap');
/*** 

====================================================================
	Reset
====================================================================

 ***/
* {
	margin:0px;
	padding:0px;
	border:none;
	outline:none;
}

:root {
	/* --- 🎨 COLORS (Палітра) --- */

	/* Основні кольори бренду */
	--color-primary: #0b6971;       /* Глибокий морський */
	--color-primary-hover: #085259; /* Темніша версія для ховерів */
	--color-accent: #4db0d9;        /* Небесний акцент */

	/* Текст та Нейтральні кольори (для мінімалізму) */
	--color-text-main: #1a1a1a;     /* Майже чорний, м'якший для очей */
	--color-text-secondary: #5f6368; /* Сірий для мета-даних (дати, автори) */
	--color-border: #e0e0e0;        /* Легкі лінії */

	/* Фони */
	--color-bg-body: #ffffff;
	--color-bg-light: #f8f9fa;      /* Для секцій або карток */

	/* Додаємо колір помилки: Fashion Red (стриманий, але чіткий) */
	--color-error: #b00020;

	/* --- ✍️ TYPOGRAPHY (Типографіка) --- */

	--font-family-heading: 'Lora', serif;
	--font-family-body: 'Mulish', sans-serif;

	/* Розмірна сітка шрифтів (Rem based) */
	font-size: 16px;
	--font-size-xs: 0.75rem;  /* 12px */
	--font-size-sm: 0.875rem; /* 14px */
	--font-size-base: 1rem;   /* 16px */
	--font-size-lg: 1.125rem; /* 18px */
	--font-size-xl: 1.5rem;   /* 24px */
	--font-size-2xl: 2rem;    /* 32px - H2 */
	--font-size-3xl: 3rem;    /* 48px - H1 Hero */

	/* --- 📐 LAYOUT & SPACING (Відступи та сітка) --- */

	--container-width: 1200px;
	--spacing-unit: 8px; /* Базова одиниця */

	/* Відступи (для підтримки "повітря" в макеті) */
	--space-xs: calc(var(--spacing-unit) * 1);  /* 8px */
	--space-sm: calc(var(--spacing-unit) * 2);  /* 16px */
	--space-md: calc(var(--spacing-unit) * 4);  /* 32px */
	--space-lg: calc(var(--spacing-unit) * 8);  /* 64px */
	--space-xl: calc(var(--spacing-unit) * 12); /* 96px */

	/* --- 💅 UI ELEMENTS (Елементи інтерфейсу) --- */

	--border-radius-sm: 4px;
	--border-radius-md: 8px; /* Трохи м'які кути, але не надто круглі */
	--transition-base: all 0.3s ease; /* Плавна анімація для всього */
	--shadow-soft: 0 4px 20px rgba(0, 0, 0, 0.05); /* Легка тінь для "піднятих" елементів */
	--utility-height: 40px;
}

/*** 

====================================================================
	Global Settings
====================================================================

 ***/

/* Базове скидання для body, щоб одразу бачити результат */
body {
	font-family: var(--font-family-body);
	color: var(--color-text-main);
	background-color: var(--color-bg-body);
	line-height: 1.6;
	margin: 0;
	-webkit-font-smoothing: antialiased; /* Робить шрифти чіткішими на Mac */
}

a{
	text-decoration:none;
	cursor:pointer;
	color:#0b6971;
}

a:hover,a:focus,a:visited{
	text-decoration:none;
	outline:none;
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-family-heading);
	font-weight: 700;
	line-height: 1.2;
	margin-bottom: var(--space-sm);
	color: var(--color-primary); /* Заголовки у брендовому кольорі */
}

input,button,select,textarea{
	font-family: 'Inter', sans-serif;
}

p{
	position:relative;
	line-height:1.7em;
	font-family: 'Inter', sans-serif;	
}

.strike-through{
	text-decoration:line-through;	
}

.auto-container{
	position:static;
	max-width:1200px;
	padding:0px 15px;
	margin:0 auto;
}

.page-wrapper{
	position:relative;
	margin:0 auto;
	width:100%;
	background:#ffffff;
}

.page-outer-container{
	position:relative;
	width:100%;
	padding:0px 0px;
}

.boxed-layout .page-outer-container{
	padding:0px 20px;	
}

ul,li{
	list-style:none;
	padding:0px;
	margin:0px;	
}

.theme-btn{
	display:inline-block;
	transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	font-family: 'Inter', sans-serif;
}

.centered{
	text-align:center;	
}

/* --- MAIN BUTTON STYLE (.btn-style-one) --- */

.btn-style-one {
	/* 1. Геометрія та Позиціювання */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 12px 35px;       /* Широкі, зручні відступи */
	border-radius: 50px;      /* Повністю круглі краї */
	border: 1px solid transparent; /* Для можливих бордерів */

	/* 2. Типографіка */
	font-family: var(--font-family-body); /* Основний шрифт сайту */
	font-size: 0.9rem;
	font-weight: 700;         /* Жирний */
	text-transform: uppercase;
	letter-spacing: 0.08em;   /* Розрядка літер для читабельності */
	line-height: 1.2;
	text-decoration: none !important; /* Прибираємо підкреслення посилань */

	/* 3. Кольори (Primary) */
	background-color: var(--color-primary);
	color: #ffffff !important; /* Текст завжди білий */

	/* 4. Ефекти */
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* М'яка тінь знизу */
	cursor: pointer;
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); /* Пружиниста анімація */
	z-index: 1;
	overflow: hidden;
}

/* --- HOVER STATE (Наведення) --- */
.btn-style-one:hover {
	background-color: var(--color-accent); /* Світліший/Яскравіший колір */
	transform: translateY(-3px);           /* Кнопка "злітає" вгору */
	box-shadow: 0 8px 25px rgba(11, 105, 113, 0.25); /* Кольорова тінь (під колір бренду) */
	color: #ffffff;
}

/* --- ACTIVE STATE (Клік) --- */
.btn-style-one:active,
.btn-style-one:focus {
	transform: translateY(-1px);
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	outline: none;
}

/* --- ICONS INSIDE BUTTON --- */
/* Якщо всередині кнопки є іконка (наприклад, fa-download) */
.btn-style-one i,
.btn-style-one span {
	margin-right: 10px; /* Відступ між іконкою і текстом */
	font-size: 1.1em;   /* Іконка трохи більша за текст */
	transition: transform 0.3s ease;
}

/* При наведенні іконка може трохи рухатись */
.btn-style-one:hover i {
	transform: translateX(3px); /* Рух вправо */
}

/* --- DISABLED STATE (Неактивна) --- */
.btn-style-one.disabled,
.btn-style-one:disabled {
	background-color: #e0e0e0;
	color: #999 !important;
	cursor: not-allowed;
	transform: none;
	box-shadow: none;
}

/* --- SECONDARY BUTTON (.btn-style-two) --- */
/* Це кнопка "Outline" - прозора з рамкою */

.btn-style-two {
	/* 1. Геометрія (така ж як у style-one) */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 35px;
	border-radius: 50px;

	/* 2. Стиль (Рамка) */
	background-color: transparent;
	border: 2px solid var(--color-primary); /* Товста рамка */
	color: var(--color-primary) !important;

	/* 3. Типографіка */
	font-family: var(--font-family-body);
	font-size: 0.9rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	text-decoration: none !important;
	cursor: pointer;
	transition: all 0.3s ease;
}

/* Hover ефект */
.btn-style-two:hover {
	background-color: var(--color-primary);
	color: #ffffff !important;
	transform: translateY(-3px);
	box-shadow: 0 5px 15px rgba(11, 105, 113, 0.2);
}

.btn-style-two i {
	margin-right: 10px;
	font-size: 1.1em;
}

.theme-btn .icon{
	font-size:16px;	
}

.theme-btn .icon-left{
	padding-right:50px;
}

.theme-btn .icon-right{
	padding-left:50px;
}

.bold-font{
	font-weight:700;	
}

.exbold-font{
	font-weight:900;	
}

.normal-font{
	font-weight:400;	
}

.light-font{
	font-weight:300;	
}

.semibold-font{
	font-weight:600;	
}

.white_color{
	color:#ffffff !important;	
}

.theme_color{
	color:#4db0d9 !important;
}

.bg_theme_color{
	background:#4db0d9 !important;
}

.theme_green_color{
	color:#0b6971 !important;
}

.bg_green_color{
	background:#0b6971 !important;
}

.padd-top-20{
	padding-top:20px !important;	
}

.padd-top-10{
	padding-top:10px !important;	
}

.padd-top-30{
	padding-top:30px !important;	
}

.padd-top-40{
	padding-top:40px !important;	
}

.padd-top-50{
	padding-top:50px !important;	
}

.padd-top-90{
	padding-top:90px !important;	
}

.padd-bott-8{
	padding-bottom:8px !important;	
}

.padd-right-20{
	padding-right:20px !important;	
}

.padd-bott-20{
	padding-bottom:20px !important;	
}

.padd-bott-10{
	padding-bottom:10px !important;	
}

.padd-bott-30{
	padding-bottom:30px !important;	
}

.padd-bott-40{
	padding-bottom:40px !important;	
}

.padd-bott-50{
	padding-bottom:50px !important;	
}

.padd-bott-70{
	padding-bottom:70px !important;	
}

.padd-top-70{
	padding-top:70px !important;	
}

.margin-top-20{
	margin-top:20px !important;	
}

.margin-top-30{
	margin-top:30px !important;	
}

.margin-top-40{
	margin-top:40px !important;	
}

.margin-top-50{
	margin-top:50px !important;	
}

.margin-right-20{
	margin-right:20px !important;	
}

.margin-right-30{
	margin-right:30px !important;	
}

.margin-right-40{
	margin-right:40px !important;	
}

.margin-right-50{
	margin-right:50px !important;	
}

.margin-right-60{
	margin-right:60px !important;	
}

.margin-right-80{
	margin-right:80px !important;	
}

.margin-left-20{
	margin-left:20px !important;	
}

.margin-left-30{
	margin-left:30px !important;	
}

.margin-left-40{
	margin-left:40px !important;	
}

.margin-left-50{
	margin-left:50px !important;	
}

.margin-left-60{
	margin-left:60px !important;	
}

.margin-left-80{
	margin-left:80px !important;	
}

.margin-bott-20{
	margin-bottom:20px !important;	
}

.margin-bott-30{
	margin-bottom:30px !important;	
}

.margin-bott-40{
	margin-bottom:40px !important;	
}

.margin-bott-50{
	margin-bottom:50px !important;	
}

.margin-bott-70{
	margin-bottom:50px !important;	
}

.margin-bott-80{
	margin-bottom:50px !important;	
}

.no-padd-bottom{
	padding-bottom:0px !important;	
}

.no-padd-top{
	padding-top:0px !important;	
}

.no-margin-bottom{
	margin-bottom:0px !important;	
}

.no-margin-top{
	margin-top:0px !important;	
}

.no-bg{
	background:none !important;	
}

.bg-light-grey{
	background:#f9f9f9;	
}

.text-uppercase{
	text-transform:uppercase !important;	
}

.preloader{ position:fixed; left:0px; top:0px; width:100%; height:100%; z-index:999999; background-color:#ffffff; background-position:center center; background-repeat:no-repeat; background-image:url(../images/icons/preloader.GIF);}

/*** 

====================================================================
	Scroll To Top style
====================================================================

***/

.scroll-to-top{
	position:fixed;
	bottom:15px;
	right:15px;
	width:40px;
	height:40px;
	color:#ffffff;
	font-size:12px;
	line-height:38px;
	text-align:center;
	background:#0b6971;
	border:1px solid #0b6971;
	border-radius:50%;
	z-index:100;
	cursor:pointer;
	display:none;
}

.scroll-to-top:hover{
	border-color:#4db0d9;
	background:#4db0d9;
}


/*** 

====================================================================
	Main Header style
====================================================================

***/

.main-header{
	position:relative;
	left:0px;
	top:0px;
	z-index:999;
	width:100%;
	font-size:13px;
}

.main-header .top-bar{
	position:relative;
	background:#4db0d9;
	color:#ffffff;
	font-family: 'Inter', sans-serif;
}

.main-header .top-bar .top-left{
	position:relative;
	float:left;
	padding:10px 0px;
	line-height:24px;
	color:#ffffff;
	font-weight:700;
}

.main-header .top-bar .top-left a{
	color:#0b6971;
}

.main-header .top-bar .top-right{
	position:relative;
	float:right;
	max-height: 44px;
}

.main-header .top-bar .lang-box,
.main-header .top-bar .fb-box {
	position:relative;
	float:left;
	margin-left:15px;
}
.main-header .top-bar .fb-box a {
	padding:10px 20px;
	line-height:24px;
	padding-left:24px;
	font-weight:700;
	color: #0b6971;
}
.main-header .top-bar .fb-box a:hover {
	color: #ffffff;
}
.main-header .top-bar .lang-box .selected-btn{
	position:relative;
	cursor:pointer;
	padding:10px 20px;
	line-height:24px;
	padding-left:24px;
	font-weight:700;
}

.main-header .top-bar .lang-box .selected-btn .flag-icon{
	position:absolute;
	left:0px;
	top:0px;
	width:20px;
	height:100%;
	background-repeat:no-repeat;
	background-position:left center;
}

.main-header .top-bar .lang-box .selected-btn .icon{
	position:absolute;
	right:0px;
	top:50%;
	font-weight:normal;
	margin-top:-10px;
	line-height:24px;
	text-align:right;	
}

.main-header .top-bar .lang-box .lang-list{
	position:absolute;
	left:0px;
	top:100%;
	width:100%;
	min-width:180px;
	background:#ffffff;
	border:1px solid #4db0d9;
	border-top-color:#ffffff;
	z-index:5;
	border-radius:0px 0px 3px 3px;
	display:none;
}

.main-header .top-bar .lang-box .lang-list:before{
	content:'';
	position:absolute;
	left:25px;
	top:-13px;
	width:0px;
	border:7px solid transparent;
	border-bottom:7px solid #ffffff;
	z-index:10;	
}

.main-header .top-bar .lang-box .lang-list li{
	position:relative;
	border-bottom:1px solid #4db0d9;
}

.main-header .top-bar .lang-box .lang-list li:last-child{
	border:none;	
}

.main-header .top-bar .lang-box .lang-list li a{
	display:block;
	line-height:24px;
	padding:5px 15px;
	color:#4db0d9;
	font-size:13px;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.main-header .top-bar .lang-box .lang-list li a:hover{
	background:#4db0d9;
	color:#ffffff;	
}

.main-header .top-bar .search-box{
	position:relative;
	float:left;	
}

.main-header .top-bar .search-box .form-group{
	position:relative;
	margin-bottom:0px;	
}

.main-header .top-bar .search-box input[type="text"],
.main-header .top-bar .search-box input[type="search"]{
	position:relative;
	display:block;
	height:44px;
	line-height:24px;
	padding:10px 40px 10px 15px;
	color:#ffffff;
	background:none;
	min-width:220px;
	font-weight:700;
	border: none;
}

.main-header .top-bar .search-box #searchForm .help-block {
	position: absolute;
	bottom: -15px;
}
.main-header .top-bar .search-box #searchForm .field-searchform-type {
	display: none;
}
.main-header .top-bar ::-webkit-input-placeholder { color:rgba(255,255,255,1);}
.main-header .top-bar ::-moz-placeholder { color:rgba(255,255,255,1) ;}
.main-header .top-bar :-ms-input-placeholder { color:rgba(255,255,255,1) ;}
.main-header .top-bar input:-moz-placeholder { color:rgba(255,255,255,1) ;}

.main-header .top-bar .has-error ::-webkit-input-placeholder { color:rgba(255,0,0,1);}
.main-header .top-bar .has-error ::-moz-placeholder { color:rgba(255,0,0,1) ;}
.main-header .top-bar .has-error :-ms-input-placeholder { color:rgba(255,0,0,1) ;}
.main-header .top-bar .has-error input:-moz-placeholder { color:rgba(255,0,0,1) ;}

.main-header .top-bar .search-box input[type="text"]:focus,
.main-header .top-bar .search-box input[type="search"]:focus{
	background:rgba(0,0,0,0.05);	
}

.main-header .top-bar .search-box button{
	position:absolute;
	right:0px;
	top:0px;
	width:40px;
	text-align:center;
	height:44px;
	line-height:24px;
	padding:10px 0px;
	background:none;
	color:#0b6971;
}

.main-header .middle-bar{
	position:relative;
	padding:15px 0px 20px;
	background:#ffffff;	
}

.main-header .middle-bar .info-column{
	position:relative;
	color:#2f2f31;
	padding:12px 0px 10px;
}

.main-header .middle-bar .info-column p{
	margin-bottom:0px;	
}

.main-header .middle-bar .info-column h3{
	font-size:30px;
	font-weight:700;
	color:#4db0d9;
}

.main-header .middle-bar .logo-column{
	/*position:absolute;*/
	left:0px;
	top:0px;
	padding:10px 0px;
	width:100%;
	text-align:center;
	text-transform: uppercase;
}
.main-header .middle-bar .logo-column h1 {
	color: #0b6971;
	font-weight: 700;
	font-size: 30px;

}
.main-header .middle-bar .logo-column .logo img{
	display:inline-block;
	max-width:100%;	
}

.main-header .top-bar .search-box button:hover,
.main-header .top-bar .search-box input:focus+button{
	color:#ffffff;	
}


.main-header .lower-section{
	position:relative;
	padding:0px 0px;
	width:100%;
	left:0px;
	top:0px;
	background:none;
}
.main-header .lower-section .auto-container {
	width: 100%;
	max-width: 100%;
}


.fixed-header .lower-section{
	position:fixed;
	background:#0b6971;
	height:auto;
}

.lower-section .nav-toggler{
	position:absolute;
	right:15px;
	top:50%;
	margin-top:-20px;
	display:none;
}

.lower-section .nav-toggler button{
	position:relative;
	display:block;
	height:40px;
	width:40px;
	background:#4db0d9;
	color:#ffffff;
	text-align:center;
	font-size:20px;
	line-height:38px;
	border:1px solid #4db0d9;
}

.main-header .lower-section .outer-box{
	position:relative;
	background:#0b6971;
	padding:0px 210px 0px 50px;
	border-radius:3px;
}

.main-header .link-box{
	position:absolute;
	right:50px;
	top:20px;
}

.main-header .link-box .theme-btn{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:13px 25px;
	border-radius:5px;
	background:#ffffff;
	text-transform:uppercase;
	
	color:#303030;
	font-size:14px;
	font-weight:700;	
}

.main-header .link-box .theme-btn:hover{
	background:#4db0d9;
	color:#ffffff;	
}

.main-menu{
	position:relative;
	padding:0px 0px;	
}

.main-menu .navbar-collapse{
	padding:0px;	
}

.main-menu .navigation{
	position:relative;
	float:left;
	margin:0px;
	font-weight:400;
	font-family: 'Inter', sans-serif;
}

.main-menu .navigation > li{
	position:relative;
	float:left;
	padding:20px 0px;
	margin-right:20px;	
}

.fixed-header .main-menu .navigation > li{
	padding:20px 0px;	
}

.main-menu .navigation > li:last-child{
	margin-right:0px;	
}

.main-menu .navigation > li > a{
	position:relative;
	display:block;
	padding:10px 5px;
	font-size:16px;
	color:#ffffff;
	line-height:30px;
	font-weight:700;
	opacity:1;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.main-header.style-two .main-menu .navigation > li > a{
	color:#ffffff;	
}

.main-menu .navigation > li:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:4px;
	background:#4db0d9;
	opacity:0;
	-webkit-transition: all 500ms ease;
	-ms-transition: all 500ms ease;
	-o-transition: all 500ms ease;
	-moz-transition: all 500ms ease;
	transition: all 500ms ease;
}

.main-menu .navigation > li:hover > a,
.main-menu .navigation > li.current > a,
.main-menu .navigation > li.current-menu-item > a{
	opacity:1;
}

.main-menu .navigation > li:hover:before,
.main-menu .navigation > li.current:before,
.main-menu .navigation > li.current-menu-item:before{
	color:#4db0d9 !important;
	opacity:1;
}

.main-menu .navigation > li > ul{
	position:absolute;
	left:-20px;
	top:100%;
	width:270px;
	padding:0px;
	z-index:100;
	display:none;
	visibility:hidden;
	background:#4db0d9;
	opacity:0;
	border:1px solid rgba(0,0,0,0.20);
}

.main-menu .navigation > li:hover > ul{
	left:0px;
	display:block;
	opacity:1;
	visibility:visible;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;	
}

.main-menu .navigation > li > ul > li{
	position:relative;
	width:100%;
	display:block;
	border-bottom:1px solid rgba(0,0,0,0.10);
}

.main-menu .navigation > li > ul > li:last-child{
	border:none;	
}

.main-menu .navigation > li > ul > li > a{
	position:relative;
	display:block;
	padding:8px 20px;
	line-height:26px;
	font-weight:700;
	font-size:16px;
	color:#ffffff;
	transition:all 200ms ease;
	-moz-transition:all 200ms ease;
	-webkit-transition:all 200ms ease;
	-ms-transition:all 200ms ease;
	-o-transition:all 200ms ease;
}

.main-menu .navigation > li > ul > li:hover > a{
	background:#0b6971;
}

.main-menu .navigation > li > ul > li > ul{
	position:absolute;
	left:120%;
	top:0px;
	width:220px;
	padding:0px;
	z-index:100;
	display:none;
	visibility:hidden;
	background:#4db0d9;
	opacity:0;
	border:1px solid rgba(0,0,0,0.20);
}

.main-menu .navigation > li > ul > li > ul > li{
	position:relative;
	width:100%;
	display:block;
	border-bottom:1px solid rgba(0,0,0,0.10);
}

.main-menu .navigation > li > ul > li > ul > li:last-child{
	border:none;	
}

.main-menu .navigation > li > ul > li > ul > li > a{
	position:relative;
	display:block;
	padding:8px 20px;
	line-height:26px;
	font-weight:700;
	font-size:16px;
	text-transform:capitalize;
	color:#ffffff;
	transition:all 200ms ease;
	-moz-transition:all 200ms ease;
	-webkit-transition:all 200ms ease;
	-ms-transition:all 200ms ease;
	-o-transition:all 200ms ease;
}

.main-menu .navigation > li > ul > li > ul > li:hover > a{
	background:#0b6971;
}

.main-menu .navigation > li > ul > li:hover > ul{
	left:100%;
	display:block;
	opacity:1;
	visibility:visible;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;	
}

.main-menu .navigation li.dropdown .dropdown-btn{
	position:absolute;
	right:10px;
	top:6px;
	width:34px;
	height:30px;
	border:1px solid #ffffff;
	background:url(../images/icons/submenu-icon.png) center center no-repeat;
	background-size:20px;
	cursor:pointer;
	z-index:5;
	display:none;
	-webkit-border-radius:3px;
	-ms-border-radius:3px;
	-o-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;
}

/*** 

====================================================================
	Hidden Sidebar style
====================================================================

***/

.hidden-bar{
	position: fixed;
	top: 0;
	width: 305px;
	height: 100%;
	background: #0b6971;
	z-index: 9999;
	transition: all 700ms ease;
	-webkit-transition: all 700ms ease;
	-ms-transition: all 700ms ease;
	-o-transition: all 700ms ease;
	-moz-transition: all 700ms ease;
}

.hidden-bar .mCSB_inside > .mCSB_container{
	margin-right:0px;	
}

.hidden-bar.right-align {
	right: -400px;
}

.hidden-bar.right-align.visible-sidebar{
	right:0px;	
}

.hidden-bar.right-align .hidden-bar-closer {
	left: -20px;
}

.hidden-bar.left-align {
	left: -400px;
}

.hidden-bar.left-align.visible-sidebar {
	left: 0px;
}

.hidden-bar.left-align .hidden-bar-closer {
	right: -20px;
}

.hidden-bar .hidden-bar-closer {
	width: 40px;
	height: 40px;
	position: absolute;
	top: 0;
	background: #000;
	color: #fff;
	border-radius: 50%;
	text-align: center;
	line-height: 38px;
	transition: all 300ms ease;
	-webkit-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	z-index: 999999;
}

.hidden-bar .hidden-bar-closer:hover {
	background: #fff;
}

.hidden-bar .hidden-bar-closer:hover .btn {
	color: #0b6971;
}

.hidden-bar .hidden-bar-closer .btn {
	background-color: transparent;
	border: none;
	outline: none;
	font-size: 14px;
}

.hidden-bar .social-icons {
	text-align: center;
	margin: 50px 0px 30px;
}

.hidden-bar .social-icons ul {
	font-size: 0;
	margin-left: -5px;
	margin-right: -5px;
}

.hidden-bar .social-icons ul li {
	display: inline-block;
	padding: 0 5px;
}

.hidden-bar .social-icons ul li a {
	display: block;
	width: 36px;
	height: 36px;
	font-size: 16px;
	line-height: 36px;
	text-align: center;
	background: #4db0d9;
	color: #ffffff;
	border-radius: 5px;
	transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}

.hidden-bar .social-icons ul li a:hover {
	background: #ffffff;
	color:#4db0d9;
}

.hidden-bar-wrapper {
	height: 100%;
}

.hidden-bar .logo {
	padding: 30px 0px;
	background: #0b6971;
}
.hidden-bar .logo a {
	color: #4db0d9;

}
.hidden-bar .side-menu {
	background-color: transparent;
	padding: 0;
	font-family: 'Montserrat', sans-serif;
	font-size:12px;
	letter-spacing:1px;
}

.hidden-bar .side-menu ul li ul a {
	background: transparent;
}

.hidden-bar .side-menu ul li ul li ul li a {
	background: transparent;
}

.hidden-bar .side-menu a.current {
	color: #fff;
}

.hidden-bar .side-menu li.current > a {
	color: #fff;
}

.hidden-bar .side-menu ul li a {
	background: transparent;
	color: #ffffff;
	display: block;
	font-weight: 500;
	text-transform: uppercase;
	border-top: 1px solid rgba(255,255,255,0.30);
	border-bottom: 1px solid rgba(255,255,255,0.30);
	padding: 10px 15px 10px 20px;
	position: relative;
	transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
}

.hidden-bar .side-menu ul li a:hover {
	background: transparent;
	color: #4db0d9;
}

.hidden-bar .side-menu ul li a .btn.expander {
	background: none;
	color: #ffffff;
	border: 1px solid rgba(255,255,255,0.80);
	padding: 5px 10px;
	font-size: 14px;
	border-radius: 0px;
	position: absolute;
	top: 6px;
	right: 20px;
	outline: none;
}


/*** 

====================================================================
	Main Slider style
====================================================================

***/

.main-slider{
	position:relative;
	width:100%;
	color:#ffffff;
	font-size:15px;
	line-height:2em;
	margin-top:-45px !important;
}

.main-slider .tp-bannertimer{
	display:none;	
}

.main-slider h1{
	font-weight:400;
	font-size:60px;
	color:#2f2f31;
	line-height:1.2em;
}

.main-slider .text{
	font-size:16px;
	color:#999999;
	
}

.main-slider .phone-no{
	font-size:24px;
	font-weight:700;
	color:#0b6971;
}

.main-slider .smaller-title{
	font-size:24px;
	font-weight:700;
	
	color:#2f2f31;	
}

.main-slider .theme-btn{
	font-weight:700;
	padding:11px 60px;	
}

.main-slider .normal-link{
	color:#2f2f31;
	padding:11px 60px;
	line-height:24px;
	
}

.main-slider .normal-link .icon{
	padding-right:5px;	
}

.main-slider .tparrows.preview3{
	background:none !important;	
}

.main-slider .tparrows.preview3::after{
	background:#0b6971;
	color:#ffffff;
	font-size:24px;
	border-radius:5px;	
}

.main-slider .tparrows.preview3.tp-leftarrow{
	left:20px !important;	
}

.main-slider .tparrows.preview3.tp-rightarrow{
	right:20px !important;	
}

.main-slider .tparrows.preview3:hover::after{
	background-color:#4db0d9;
	color:#ffffff !important;
}

.main-slider .tparrows.preview3 .tp-arr-iwrapper{
	visibility:hidden;
	opacity:0;	
}

/*** 

====================================================================
	Services Style One
====================================================================

***/

.services-style-one{
	position:relative;
	padding:70px 0px 0px;
}

.default-service-column{
	position:relative;
}

.services-style-one .default-service-column{
	margin-bottom:70px;	
}

.default-service-column .inner-box{
	position:relative;	
}

.default-service-column .service-header{
	position:relative;
	padding-left:70px;
	min-height:80px;
	padding-bottom:20px;
	border-bottom:1px solid #e0e0e0;
}

.default-service-column .service-header .icon{
	position:absolute;
	left:0px;
	top:0px;
	width:70px;
	line-height:70px;
	font-size:48px;
	color:#4db0d9;
	margin-bottom:20px;	
}

.default-service-column .service-header h4{
	font-size:18px;
	color:#999999;
	font-weight:700;
	margin-bottom:7px;
}

.default-service-column .service-header h3{
	font-size:18px;
	color:#2f2f31;
	font-weight:700;
}

.default-service-column .text-content{
	position:relative;
	padding-top:15px;
}

.default-service-column .text-content .text{
	font-size:16px;
	margin-bottom:20px;	
}

.services-style-one hr{
	margin:0px;	
}

.styled-heading{
	position:relative;
	margin-bottom:30px;
	padding-bottom:22px;
}

.styled-heading:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 4px;
	width: 150px;
	height: 6px;
	border-top: 1px solid #0b6971;
	border-bottom: 1px solid #0b6971;
}
.styled-heading:after{
	content: '//';
	position: absolute;
	font-size: 21px;
	letter-spacing: -2px;
	left: 25px;
	bottom: -4px;
	padding: 0 5px;
	background: #fff;
	color: #0b6971;
}

.styled-heading h2{
	font-size:30px;
	font-weight:700;
	color:#2f2f31;	
}

.line-styled-heading{
	position:relative;
	margin-bottom:30px;
	padding-bottom:10px;
}

.line-styled-heading:after{
	content:'';
	position:absolute;
	left:0px;
	bottom:0;
	width:50px;
	height:1px;
	background:#4db0d9;
}

.line-styled-heading h2{
	font-size:24px;
	font-weight:700;
	color:#4db0d9;
}

/*** 

====================================================================
	About Section
====================================================================

***/

.about-section{
	position:relative;
	padding:40px 0px ;
}

.about-section .default-column{
	position:relative;
	margin-bottom:50px;
}

.default-text-box{
	margin-bottom:25px;
	text-align: justify;
}

.about-section .columns-outer{
	position:relative;
	margin-left:-4px;
	margin-right:-4px;	
}

.about-section .columns-outer .column{
	padding:0px 4px !important;
	margin-bottom:30px;
}

.about-section .image-box{
	position:relative;
	display:block;	
}

.about-section .image-box img{
	display:block;
	width:100%;	
}

.default-overlay-outer{
	position:absolute;
	display:block;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	padding:10px;
	transition:all 700ms ease;
	-webkit-transition:all 700ms ease;
	-ms-transition:all 700ms ease;
	-o-transition:all 700ms ease;
	-moz-transition:all 700ms ease;
}

.default-overlay-outer .inner{
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	display:table;
	vertical-align:middle;
	text-align:center;
}

.default-overlay-outer .inner .content-layer{
	position:relative;
	display:table-cell;
	vertical-align:middle;
	color:#ffffff;
}

.about-section .image-box .content-layer .icon{
	font-size:24px;
	margin-bottom:10px;	
}

.about-section .image-box .content-layer h3{
	font-size:18px;
	font-weight:700;	
}

.quote-text{
	position:relative;
	font-size:18px;
	font-family:'Inter', sans-serif;
	color:#2f2f31;	
}

.about-section .quote-text{
	margin-bottom:40px;	
}

.about-section .phone-info{
	line-height:36px;	
}

.about-section .phone-info .phone{
	position:relative;
	padding-left:10px;
	top:5px;
	color:#4db0d9;
	font-family:'Inter', sans-serif;
	font-size:30px;
	font-weight:700;	
}

/*** 

====================================================================
	Company Timeline
====================================================================

***/

.company-timeline{
	position:relative;
}

.about-section .timeline-column{
	position:relative;
	margin-bottom:30px;	
}

.company-timeline .timeline-block{
	position:relative;
	margin-bottom:20px;
	padding-left:100px;	
}

.company-timeline .timeline-block:last-child{
	margin-bottom:0px;	
}

.company-timeline .timeline-block .year{
	position:absolute;
	left:0px;
	top:0px;
	display:inline-block;
	max-width:100%;
	padding:5px 15px;
	color:#ffffff;
	background:#4db0d9;
	text-align:center;
	font-size:20px;
	line-height:24px;
	font-weight:700;
	font-family:'Inter', sans-serif;
	border-radius:5px;
}

.company-timeline .timeline-block .year .curve{
	position:absolute;
	bottom:-13px;
	left:0px;
	width:100%;
	color:#4db0d9;
}

.company-timeline .timeline-block h3{
	font-size:18px;
	margin-bottom:10px;
	color:#2f2f31;
	font-weight:700;	
}

.about-section .carousel-outer{
	position:relative;	
}

.about-section .carousel-outer img{
	display:block;
	width:100%;
	height:auto;	
}

.about-section .carousel-outer .owl-controls{
	margin:0px;	
}

.about-section .carousel-outer .owl-nav{
	display:none;	
}

.about-section .carousel-outer .owl-dots{
	position:absolute;
	left:0px;
	bottom:5px;
	width:100%;
	z-index:20;	
}

.about-section .carousel-outer .owl-dots .owl-dot span{
	border:1px solid #ffffff;
	background:none;
	margin:0px 5px;	
}

.about-section .carousel-outer .owl-dots .owl-dot.active span,
.about-section .carousel-outer .owl-dots .owl-dot:hover span{
	background:#ffffff;	
}

.about-section .graph-outer{
	position:relative;
	padding:30px 0px;
	text-align:center;
	border:1px solid #e0e0e0;
}

.about-section .graph-outer .chart-outer {
	position:relative;
	width:222px;
	height:222px;
	margin:0 auto;
	background:url(../images/background/graph-image.png) center center no-repeat;
}							

.about-section .graph-outer img{
	display:inline-block;
	max-width:100%;	
}

.about-section .graph-outer .chart-outer .progress-text{
	position:absolute;
	text-align:center;
	width:70px;
	height:40px;
	color:#ffffff;
	line-height:20px;
	font-size:16px;
	font-weight:400;
	
}

.about-section .graph-outer .chart-outer .center-text{
	left:50%;
	margin-left:-35px;
	top:50%;
	margin-top:-20px;	
}

.about-section .graph-outer .chart-outer .won-text{
	left:3%;
	top:25%;
}

.about-section .graph-outer .chart-outer .hold-text{
	right:3%;
	top:25%;
}

.about-section .graph-outer .chart-outer .running-text{
	left:50%;
	margin-left:-25px;
	bottom:7%;
}

.about-section .graph-outer .chart-outer .progress-text .count{
	font-family:'Inter', sans-serif;
	font-size:18px;
	font-weight:700;	
}


/*** 

====================================================================
	Two Column Fluid
====================================================================

***/

.two-column-fluid{
	position:relative;
	background:#f5f5f5;	
}

.two-column-fluid .testimonial-column{
	position:relative;
	background-size:cover;
	background-position:right center;
	background-repeat:no-repeat;	
}

.two-column-fluid .testimonial-column .bg-color-layer{
	position:absolute;
	right:0px;
	top:0px;
	width:2000px;
	height:100%;
	background:#0b6971;
	opacity:0.95;
	z-index:3;
}

.two-column-fluid .testimonial-column .bg-image-layer{
	position:absolute;
	right:0px;
	top:0px;
	width:2000px;
	height:100%;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:right center;
	z-index:1;
}

.two-column-fluid .testimonial-column .inner-box{
	position:relative;
	padding:70px 15px 70px 0px;
	z-index:5;
}

.two-column-fluid .testimonial-column .carousel-box{
	position:relative;
	padding:0px 100px 0px 110px;	
}

.two-column-fluid .testimonial-column .quote-icon{
	position:absolute;
	left:0px;
	top:0px;
	width:80px;
	height:80px;
	line-height:76px;
	border:2px solid #ffffff;
	text-align:center;
	color:#ffffff;
	font-size:30px;
	border-radius:50%;
}

.two-column-fluid .testimonial-column .styled-heading h2{
	color:#ffffff;	
}

.testimonial-carousel .slide-text{
	position:relative;
	margin-bottom:80px;
	color:#ffffff;
	font-size:18px;	
}

.testimonial-carousel .slide-info{
	position:relative;
	padding-left:80px;
	padding:15px 15px 44px 100px;	
}

.testimonial-carousel .slide-info .image-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:80px;
	height:80px;	
}

.testimonial-carousel .slide-info .image-thumb:before{
	content:'';
	position:absolute;
	left:0px;
	top:-44px;
	height:1px;
	width:100%;
	background:#ffffff;
}

.testimonial-carousel .slide-info .image-thumb img{
	display:block;
	width:80px;	
}

.testimonial-carousel .slide-info h3{
	font-size:18px;
	font-weight:700;
	margin-bottom:2px;
	color:#ffffff;
}

.testimonial-carousel .slide-info p{
	margin-bottom:5px;
	color:#ffffff;
	font-style:italic;
}

.testimonial-carousel .signature img{
	position:relative;
	margin-top:20px;
	display:inline-block;
	max-width:100%;	
}

.testimonial-carousel .owl-controls{
	margin:0px;	
}

.testimonial-carousel .owl-nav{
	display:none;	
}

.testimonial-carousel .owl-dots{
	position:relative;
	text-align:left;
}

.testimonial-carousel .owl-dots .owl-dot span{
	border:3px solid #ffffff;
	background:none;
	margin:0px 5px;	
}

.testimonial-carousel .owl-dots .owl-dot.active span,
.testimonial-carousel .owl-dots .owl-dot:hover span{
	background:#ffffff;	
}

.two-column-fluid .whyus-column .inner-box{
	position:relative;
	padding:70px 15px 70px 60px;
	z-index:5;
}

.two-column-fluid .whyus-column .icon-block{
	position:relative;
	margin-bottom:34px;
}

.two-column-fluid .whyus-column .icon-block:last-child{
	margin-bottom:0px;	
}

.two-column-fluid .whyus-column .icon-block .icon{
	position:absolute;
	left:-110px;
	top:5px;
	width:70px;
	height:70px;
	line-height:66px;
	text-align:center;
	background:#4db0d9;
	border:2px solid #4db0d9;
	color:#ffffff;
	font-size:30px;
	border-radius:50%;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
}

.two-column-fluid .whyus-column .icon-block:hover .icon{
	background:#ffffff;
	color:#4db0d9;
	-webkit-transform:scale(1.1,1.1);
	-ms-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	transform:scale(1.1,1.1);
}

.two-column-fluid .whyus-column .icon-block h3{
	font-size:18px;
	font-weight:700;
	margin-bottom:10px;
	color:#2f2f31;
}

/*** 

====================================================================
	Team Section
====================================================================

***/

.team-section{
	position:relative;
	background:#ffffff;
	padding:10px 0px ;
}

.team-section.extended{
	padding:80px 0px 20px;
}

.team-section .team-member{
	position:relative;
	margin-bottom:50px;	
}

.team-section.extended .team-member{
	margin-bottom:60px;	
}

.team-section.extended .separator{
	margin:0px 0px 60px;
}

.team-section .team-member .inner-box{
	position:relative;
	max-width:500px;
	display:block;
	background:#ffffff;
	margin:0 auto;
}

.team-section .team-member .image{
	position:relative;	
}

.team-section .team-member .image img{
	position:relative;
	display:block;
	width:100%;	
}

.team-section .team-member .member-info{
	position:relative;
	padding:20px 0px;
	border-bottom:1px solid #e0e0e0; 
}

.team-section .team-member h3{
	font-size:18px;
	color:#2f2f31;
	font-weight:700;
	text-transform:capitalize;
}

.team-section .team-member .designation{
	font-size:16px;
	line-height:20px;
	color:#4db0d9;
	text-transform:capitalize;
	font-style:italic;
	font-family: 'Inter', serif;
}

.team-section .team-member .social-links{
	position:relative;
}

.team-section .team-member .social-links a{
	position:relative;
	display:inline-block;
	width:34px;
	height:34px;
	font-size:14px;
	margin:0px 3px 5px;
	line-height:32px;
	border-radius:5px;
	text-align:center;
	border:1px solid #e1e1e1;
	color:#909090;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	padding: 3px;
}

.team-section .team-member .social-links a:hover{
	background-color:#4db0d9;
	color:#ffffff;
	border-color:#4db0d9;
}

.team-section .team-member .contact-info{
	position:relative;
	padding:25px 0px;
	
}

.team-section .team-member .contact-info li{
	position:relative;
	padding-left:30px;
	line-height:24px;
	margin-bottom:5px;
}

.team-section .team-member .contact-info a{
	color:#999999;
	font-size:16px;	
}

.team-section .team-member .contact-info li .icon{
	position:absolute;
	left:0px;
	top:0px;
	line-height:24px;
	color:#4db0d9;
	width: 20px;
}


/*** 

====================================================================
	Conultation Section
====================================================================

***/

.consult-section{
	position:relative;
	background:#ffffff;
	padding:60px 0px 0px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	overflow:hidden;
}

.consult-section:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background:#f5f5f5;
	opacity:0.80;	
}

.consult-section .auto-container{
	position:relative;
	padding-left:440px;
	z-index:1;	
}

.default-form{
	position:relative;	
}

.consult-section .default-form{
	padding-bottom:50px;
}

.consult-section .man-image{
	position:absolute;
	left:15px;
	bottom:0px;
	width:400px;
}

.consult-section .man-image img{
	position:relative;
	display:block;
	max-width:100%;
}

.default-form .form-group{
	position:relative;
	margin-bottom:30px;	
}

.default-form input[type="text"],
.default-form input[type="email"],
.default-form input[type="password"],
.default-form input[type="tel"],
.default-form input[type="number"],
.default-form input[type="url"],
.default-form select,
.default-form textarea,
.default-form .select2-container--krajee .select2-selection--single {
	position:relative;
	display:block;
	background:#ffffff;
	line-height:30px;
	padding:10px 20px;
	height:52px;
	border:1px solid #e0e0e0;
	border-radius:5px;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}
.default-form .select2-container--krajee .select2-selection--single .select2-selection__arrow {
	border: none;
	height: 100%;
	right: 15px;
	display: none;
}
.default-form select,
.default-form .select2-container--krajee .select2-selection--single {
	-webkit-appearance:none;
	-ms-appearance:none;
	-moz-appearance:none;
	-o-appearance:none;
	background:#ffffff url(../images/icons/icon-dropdown.png) right center no-repeat;
	cursor:pointer;
}
.default-form .iti.iti--allow-dropdown {
	width: 100%;
}
.default-form input[type="tel"] {
	text-indent: 30px;
}
.default-form .file-caption.form-control.kv-fileinput-caption {
	height: 52px;
}
.default-form select option{
	text-indent:20px;	
}

.default-form textarea{
	resize:none;
	height:110px;	
}

.default-form-section .default-form textarea,
.default-form.comment-form textarea{
	resize:none;
	height:150px;	
}

.default-form input:focus,
.default-form select:focus,
.default-form textarea:focus{
	border-color:#4db0d9;
}

/*** 

====================================================================
	News Section
====================================================================

***/

.news-section{
	position:relative;
	background:#ffffff;
	padding:70px 0px 10px;
}

.news-section.extended{
	padding:70px 0px;	
}

.featured-news-column{
	position:relative;
	margin-bottom:20px;
}

.featured-news-column .inner-box{
	position:relative;
	background:#f5f5f5;
}

.featured-news-column .image-box{
	position:relative;
	overflow:hidden;
}

.list-view .featured-news-column .image-box{
	float:left;
	width:42%;	
}

.featured-news-column .image-box img{
	display:block;
	width:100%;	
}

.featured-news-column .image-box .default-overlay-outer{
	background:rgba(67,165,204,0.9);
	opacity:0;
	left:-100%;
}

.featured-news-column:hover .image-box .default-overlay-outer{
	left:0px;
	opacity:1;	
}

.featured-news-column .image-box .link-icon{
	position:relative;
	display:inline-block;
	line-height:53px;
	width:52px;
	height:52px;
	background:#ffffff;
	border-radius:5px;
	font-size:18px;
	color:#0b6971;
}

.featured-news-column .content{
	position:relative;
	padding:10px;
}

.list-view .featured-news-column .right-content{
	float:left;
	width:58%;
}

.list-view .featured-news-column .content{
	padding:30px 20px 30px 50px;	
}

.featured-news-column .date{
	position:relative;
	width:30px;
	height:40px;
	margin-top:-30px;
	line-height:25px;
	float: right;
	padding:5px;
	margin-bottom:30px;
	font-size:18px;
	color:#ffffff;
	background:#0b6971;
	font-weight:700;
	text-align:center;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;	
}

.classic-view .featured-news-column .date{
	position:absolute;
	left:25px;
	top:25px;
	z-index:3;
	margin:0px;	
}

.featured-news-column:hover .date{
	background:#4db0d9;
}

.list-view .featured-news-column .date{
	position:absolute;
	left:-30px;
	top:35px;
	margin-top:0px;
}

.featured-news-column .tags{
	position:relative;
	margin-bottom:10px;
	color:#2f2f31;	
}

.featured-news-column .tags a{
	color:#999999;
	font-size:14px;
		
}

.featured-news-column h3{
	font-size:14px;
	font-weight:700;
	color:#2f2f31;	
}

.classic-view .featured-news-column h3{
	font-size:24px;	
}

.featured-news-column h3 a{
	color:#2f2f31;	
}

.featured-news-column a:hover{
	color:#4db0d9;
}

.featured-news-column .text{
	margin-bottom:10px;	
}

.list-view .featured-news-column .text{
	margin-bottom:20px;	
}

.featured-news-column .read-more{
	color:#0b6971;
	text-transform:uppercase;
	font-size:14px;
	font-weight:700;
}

.featured-news-column:hover .read-more{
	color:#4db0d9;
}

.featured-news-column .post-info{
	position:relative;
	border-top:1px solid #e1e1e1;
	padding:5px 1px;
	
	font-size:14px;
}

.featured-news-column .post-info li{
	position:relative;
	float:left;
	margin-left:15px;
	font-size: 12px;
	color:#999999;	
}

.featured-news-column .post-info li a{
	color:#999999;	
}

.featured-news-column .post-info li .fa,
.featured-news-column .post-info li .author-thumb{
	padding-right:5px;	
}

.blog-details blockquote{
	position:relative;
	padding:25px;
	border:1px solid #e0e0e0;
	border-left:3px solid #e0e0e0;
	background:#ffffff;
	margin:30px 0px;
	font-size:16px;
	font-style:italic;
	font-family:'Inter', sans-serif;
}

.blog-details .styled-heading{
	margin-bottom:20px;	
}

.blog-details .styled-heading h2{
	font-size:24px;	
}

.blog-details .image-block .image-column,
.blog-details .image-block .text-column{
	margin-bottom:30px;	
}

.blog-details .image-block img{
	display:block;
	max-width:100%;	
}

.blog-details .post-bottom{
	background:#ffffff;
	padding:10px 0px;
	border-top:1px solid #e0e0e0;	
	border-bottom:1px solid #e0e0e0;	
}

.blog-details .post-bottom .post-info{
	border:none;
	padding:0px;	
}

.blog-details .post-bottom .post-info li{
	line-height:34px;
}



.social-links-one a{
	position:relative;
	display:inline-flex;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	align-items: center;
	font-size:14px;
/*	width:34px;
	height:34px;*/
	padding: 3px 7px;
	line-height:32px;
	border:1px solid #e9e9e9;
	text-align:center;
	color:#999999;
	margin:0px 10px 7px 0px;
	border-radius:5px;
	transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
}
.social-links-one a span {
	width: 20px;
	height: 20px;
	margin-right: 10px;
}
.social-links-one a span svg {
	width: 100%
}
.social-links-one a:hover{
	color:#ffffff;
	background:#4db0d9;
}

.blog-details .post-author{
	position:relative;
	color:#777777;
	border-bottom:1px solid #e0e0e0;
	padding-bottom:10px;
	margin-bottom:10px;
}


.blog-details .post-author .inner-box{
	position:relative;
	padding:15px;
	min-height:80px;
}

.blog-details .post-author .inner-box .author-thumb{
	position:absolute;
	left:0px;
	top:10px;
	width:110px;
	height:110px;
	border-radius:5px;
}

.blog-details .post-author .inner-box .author-thumb img{
	display:block;
	width:110px;	
}

.blog-details .post-author h4{
	margin-bottom:10px;
	font-family:'Inter', sans-serif;
	font-size:18px;
	text-transform:uppercase;
	font-weight:700;
	color:#1a1a1a;	
}

.blog-details .post-author h4 .author-occ{
	position:relative;
	left:10px;
	padding:5px 10px;
	font-size:10px;
	background:#1cbefe;
	border-radius:5px;
	color:#ffffff;
}

/*** 

====================================================================
	Comments Area
====================================================================

 ***/

.blog-details .comments-area{
	position:relative;
	margin-bottom:70px;	
}

.blog-details .comments-area .comment-box{
	position:relative;	
}

.blog-details .comments-area .comment{
	position:relative;
	margin:0px 0px 40px 0px;
	padding:0px 0px 40px 110px;
	border-bottom:1px solid #e0e0e0;	
}

.blog-details .comments-area .reply-comment{
	margin-left:50px;	
}

.blog-details .comments-area .comment-box .author-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:78px;
	height:78px;
}

.blog-details .comments-area .comment-box .author-thumb img{
	width:100%;
	display:block;
	border-radius:5px;
}

.blog-details .comments-area .comment-info{
	margin-bottom:15px;
	color:#4db0d9;
	font-size:16px;
}

.blog-details .comments-area .comment-info .time{
	color:#4db0d9;
	font-size:16px;
		
}

.blog-details .comments-area .comment-box strong{
	color:#2f2f31;
	font-size:18px;
	font-weight:700;	
}

.blog-details .comments-area .comment-option{
	color:#e0e0e0;
	padding-top:10px;
		
}

.blog-details .comments-area .comment-option .up-link,
.blog-details .comments-area .comment-option .down-link{
	color:#999999;
	line-height:24px;
	font-size:18px;
	padding:0px 10px;	
}

.blog-details .comments-area .comment-option .reply-link{
	position:relative;
	margin:0px 10px;
	font-weight:700;	
}

.blog-details .comments-area .comment-option .share-link{
	position:relative;
	margin:0px 10px;
	font-weight:700;
	color:#2f2f31;	
}

/*** 

====================================================================
	Sponsors Section Style
====================================================================

***/

.sponsors-section{
	position:relative;
	padding:0px 0px 100px;
	background:#ffffff;
}

.sponsors-section .slider-outer{
	position:relative;
	border:1px solid #e0e0e0;
	margin:0px 0px;
}

.sponsors-section .sponsors-slider{
	position:relative;
}
.sponsors-section .sponsors-slider li a {
	height: 80px;
	display: flex;
	display: -webkit-flex;
	display: -o-flex;
	display: -ms-flex;
	display: -moz-flex;
	justify-content: center;
	-webkit-justify-content: center;
	-webkit-align-items: center;
	align-items: center;
}
.sponsors-section .sponsors-slider li img{
	position:relative;
	right:-1px;
	border-right:1px solid #e0e0e0;
	width: 90%;
}

.sponsors-section .owl-controls{
	margin:0px !important;	
}

.sponsors-section .owl-nav .owl-prev{
	position:absolute;
	left:0px;
	top:50%;
	margin:-25px 0px 0px -25px !important;
	line-height:48px;
	width:50px;
	height:50px;
	border:1px solid #e0e0e0;
	text-align:center;
	color:#cccccc;
	background:#ffffff !important;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	transition:all 300ms ease;
}

.sponsors-section .owl-nav .owl-next{
	position:absolute;
	right:0px;
	top:50%;
	margin:-25px -25px 0px 0px !important;
	line-height:48px;
	width:50px;
	height:50px;
	border:1px solid #e0e0e0;
	text-align:center;
	color:#cccccc;
	background:#ffffff !important;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	transition:all 300ms ease;
}

.sponsors-section .owl-nav .owl-prev .fa:before,
.sponsors-section .owl-nav .owl-next .fa:before{
	font-size:24px;
	color:#0b6971;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	transition:all 300ms ease;	
}

.sponsors-section .owl-nav .owl-prev:hover .fa:before,
.sponsors-section .owl-nav .owl-next:hover .fa:before{
	color:#ffffff;	
}

.sponsors-section .owl-nav .owl-prev:hover,
.sponsors-section .owl-nav .owl-next:hover{
	background:#0b6971 !important;
}

.sponsors-section .owl-dots{
	display:none !important;	
}

/*** 

====================================================================
	Info Section Style
====================================================================

***/

.info-section{
	position:relative;
	background:#0b6971;
	color:#ffffff;
}

.info-section .info-column{
	position:relative;
	margin-bottom:50px;	
}

.info-section .info-column .inner-box{
	max-width:320px;
	margin:0 auto;
	text-align:center;
}	

.info-section .info-column .icon{
	position:relative;
	width:70px;
	height:70px;
	line-height:70px;
	margin:-30px auto 40px;
	color:#ffffff;
	font-size:24px;
	text-align:center;
	background:#4db0d9;
}

.info-section .info-column h3{
	font-size:24px;
	font-weight:700;
	margin-bottom:30px;	
}

.info-section .info-column h3:after{
	content:'';
	position:relative;
	display:block;
	width:70px;
	height:1px;
	margin:20px auto;
	background:#ffffff;
}

.info-section .info-column .text{
	font-size:16px;
	color:#f5f5f5;
}

/*** 

====================================================================
	Map Section Style
====================================================================

***/

.map-section{
	position:relative;
}

.map-section .map-container{
	position:relative;
	height:450px;	
}

.map-section.extended .map-container{
	height:500px;	
}

.map-section .map-data{
	text-align:center;
	font-size:16px;
	font-weight:700;
		
}

.map-section .map-data h6{
	font-size:16px;
	text-align:center;
	margin-bottom:5px;
	color:#2e2e2e;	
}

/*** 

====================================================================
	Main Footer
====================================================================

***/

.main-footer{
	position:relative;
	color:#999999;
	background:#505050;
	
}

.main-footer p{
	margin-bottom:20px;
}

.main-footer .footer-upper{
	position:relative;
	padding:70px 0px 30px;
	color:#999999;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
}

.main-footer .footer-upper:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background:#030303;
	opacity:0.92;	
}

.main-footer .footer-upper .column{
	position:relative;
	margin-bottom:30px;	
}

.footer-upper .column h3{
	position:relative;
	font-size:24px;
	font-weight:700;
	margin-bottom:30px;
	padding-bottom:22px;
	color:#ffffff;
}

.footer-upper .column h3:before {
	content: '';
	position: absolute;
	left: 0;
	bottom: 4px;
	width: 150px;
	height: 6px;
	border-top: 1px solid #0b6971;
	border-bottom: 1px solid #0b6971;
}
.footer-upper .column h3:after{
	content: '//';
	position: absolute;
	font-size: 21px;
	letter-spacing: -2px;
	font-weight: 400;
	left: 25px;
	bottom: -9px;
	padding: 0 5px;
	color: #0b6971;
}

.main-footer .about-widget{
	font-size:16px;
}

.main-footer .footer-upper a{
	transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
}

.main-footer .footer-upper a:hover{
	color:#ffffff;	
}

.footer-upper .links-widget li{
	position:relative;
	margin-bottom:15px;
}

.footer-upper .links-widget li a{
	position:relative;
	display:block;
	font-size:16px;
	color:#999999;
	line-height:24px;
	padding-left:15px;
}

.footer-upper .links-widget li a:before{
	content:'\f105';
	font-family: 'FontAwesome';
	position:absolute;
	left:0px;
	top:0px;
	font-size:16px;
	line-height:24px;	
}

.footer-upper .links-widget li a:hover{
	color:#ffffff;	
}

.main-footer .social-links a{
	position:relative;
	display:inline-block;
	font-size:16px;
	width:48px;
	height:48px;
	line-height:46px;
	border:1px solid rgba(255,255,255,0.05);
	text-align:center;
	margin:0px 2px 10px 0px;
	color:#999999;
	background:#10100f;
	border-radius:5px;
	transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
}

.main-footer .social-links a:hover{
	color:#ffffff;
	background:#0b6971;
}

.footer-upper .twitter-feeds .feed{
	position:relative;
	padding:0px 0px 0px 30px;
	margin-bottom:20px;
	color:#aaaaaa;
}

.footer-upper .twitter-feeds .feed:last-child{
	margin:0px;	
}

.footer-upper .twitter-feeds .feed-content{
	margin-bottom:5px;
	line-height:1.6em;	
}

.footer-upper .twitter-feeds .feed a{
	position:relative;
	color:#4db0d9;
}

.footer-upper .twitter-feeds .feed .time{
	position:relative;
	color:#ffffff;
	font-size:14px;
	font-family:'Inter', sans-serif;
	text-transform:capitalize;
	font-weight:700;
}

.footer-upper .twitter-feeds .feed strong{
	font-weight:400;	
}

.footer-upper .twitter-feeds .feed .icon{
	position:absolute;
	width:30px;
	height:20px;
	left:0px;
	top:5px;
	line-height:20px;
	font-size:18px;
	color:#999999;	
}

.main-footer .newsletter-widget .form-group{
	position:relative;
	margin-bottom:10px;
}

.main-footer .newsletter-widget input[type="text"],
.main-footer .newsletter-widget input[type="email"]{
	position:relative;
	display:block;
	width:100%;
	line-height:26px;
	padding:11px 50px 11px 10px;
	background:#10100f;
	border:1px solid rgba(255,255,255,0.05);
	border-radius:5px;	
}

.main-footer .newsletter-widget input[type="text"]:focus,
.main-footer .newsletter-widget input[type="email"]:focus{
	background:#202020;	
}

.main-footer .newsletter-widget input[type="submit"],
.main-footer .newsletter-widget button{
	position:absolute;
	right:0px;
	top:0px;
	width:50px;
	height:50px;
	line-height:50px;
	text-align:center;
	font-size:18px;
	font-weight:700;
	font-family:'Inter', sans-serif;
	color:#ffffff;
	background:#0b6971;
	border-radius:0px 5px 5px 0px;	
}

.main-footer .newsletter-widget input:focus+button,
.main-footer .newsletter-widget button:hover{
	background:#4db0d9;
}

.main-footer h4{
	position:relative;
	font-size:18px;
	color:#ffffff;
	font-weight:700;
	padding-top:25px;
	margin-bottom:20px;
}

.main-footer h4:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:50px;
	height:1px;
	background:rgba(255,255,255,0.05);	
}

.footer-bottom{
	position:relative;
	padding:25px 0px;
	font-family:'Inter', sans-serif;
	line-height:24px;
	color:#999999;
	background:#1e1e1e;
}

.footer-bottom .footer-nav{
	position:relative;
}

.footer-bottom .footer-nav li{
	position:relative;
	float:left;
	margin-left:25px;	
}

.footer-bottom .footer-nav li a{
	color:#999999;	
}

.footer-bottom .footer-nav li a:hover{
	color:#ffffff;	
}

/*** 

====================================================================
	Page Title Style
====================================================================

***/

.page-title{
	position:relative;
	padding:165px 0px 115px;
	background-size:cover;
	background-position:center center;
	background-repeat:no-repeat;
	margin-top:-45px;
}

.page-title h1{
	position:relative;
	font-size:36px;
	font-weight:700;
	color:#ffffff;
	padding-bottom:30px;
	line-height:50px;
	text-align:center;
	text-transform:uppercase;
}

.page-title h1:after{
	content:'';
	position:absolute;
	left:0px;
	bottom:0;
	width:100%;
	height:30px;
	background:url(../images/icons/title-line-image-2.png) center bottom no-repeat;	
}

.page-info{
	position:relative;
	padding:15px 0px;
	border-bottom:1px solid #e0e0e0;	
}

.page-info h2{
	font-size:18px;
	color:#2f2f31;
	line-height:24px;
	font-weight:700;
}

.page-info .bread-crumb{
	position:relative;
	font-family:'Inter',samns-serif;	
}

.page-info .bread-crumb li{
	position:relative;
	float:left;
	margin-right:40px;
	color:#999999;
	line-height:24px;
}

.page-info .bread-crumb li:last-child{
	margin-right:0px;
}

.page-info .bread-crumb li:after{
	content:'\f0da';
	font-family: 'FontAwesome';
	position:absolute;
	right:-30px;
	width:10px;
	line-height:28px;
	color:#0b6971;
	font-size:14px;
}

.page-info .bread-crumb li:last-child:after{
	display:none;	
}

.page-info .bread-crumb li a{
	color:#999999;	
}

.page-info .bread-crumb li a:hover{
	color:#4db0d9;
}

/*** 

====================================================================
	Welcome Section
====================================================================

***/

.welcome-section{
	position:relative;
	padding:70px 0px 0px;
}

.welcome-section .column{
	margin-bottom:40px;	
}

.welcome-section .text{
	margin-bottom:25px;	
}

.welcome-section .text-header{
	position:relative;
	padding-bottom:20px;
	border-bottom:1px solid #e0e0e0;
	margin-bottom:30px;	
}

.welcome-section .text-header h2{
	font-size:30px;
	font-weight:700;
	color:#2f2f31;	
}

.text-carousel-outer{
	position:relative;
	padding-left:20px;
	border-left:4px solid #0b6971;
	color:#2f2f31;
}

.text-carousel h3{
	font-size:30px;
	line-height:40px;
	font-weight:700;
	color:#2f2f31;
	margin-bottom:5px;
}

.text-carousel-outer .owl-dots{
	display:none !important;	
}

.text-carousel-outer .owl-controls{
	text-align:left;
	margin:0px;	
}

.text-carousel-outer .owl-prev,
.text-carousel-outer .owl-next{
	width:30px;
	height:30px;
	font-size:18px;
	padding:0px !important;
	background:#ffffff !important;
	border:1px solid #e0e0e0;
	line-height:28px !important;
	color:#909090 !important;
	text-align:center;
	margin:0px 10px 0px 0px !important;
}

.text-carousel-outer .owl-prev .fa:before,
.text-carousel-outer .owl-next .fa:before{
	line-height:28px;	
}

.text-carousel-outer .owl-prev:hover,
.text-carousel-outer .owl-next:hover{
	background:#0b6971 !important;
	color:#ffffff !important;
	border-color:#0b6971;
}

.welcome-section .image-column{
	position:relative;
	margin-bottom:30px;	
}

.welcome-section .image-box{
	position:relative;	
}

.welcome-section .image-box img{
	display:block;
	width:100%;	
}

.welcome-section .image-box .icon{
	font-size:48px;
	margin-bottom:20px;	
}

.welcome-section .image-box h3{
	font-size:20px;
	font-weight:700;	
}

.welcome-section .image-box .default-overlay-outer{
	background:rgba(34,53,85,0.90);	
}

.welcome-section .image-box:hover .default-overlay-outer{
	background:rgba(184,155,94,0.90);	
}


/*** 

====================================================================
	Default Section
====================================================================

***/

.default-section{
	position:relative;
	padding:70px 0px 20px;
}

.default-section .default-column{
	margin-bottom:50px;	
}

/*** 

====================================================================
	Our Experience Section
====================================================================

***/

.our-experience .desc-text{
	position:relative;
	margin-bottom:30px;	
}

.our-experience .timeline-outer{
	position:relative;
	padding:20px 0px 0px;
	padding-left:140px;	
}

.our-experience .timeline-outer .left-line{
	position:absolute;
	left:67px;
	top:0px;
	height:100%;
	width:3px;
	background:#e0e0e0;
		
}

.our-experience .timeline-outer .left-line:before{
	content:'';
	position:absolute;
	display:block;
	left:50%;
	top:0px;
	margin-left:-8px;
	width:16px;
	height:16px;
	background:#e0e0e0;
	border-radius:50%;	
}

.our-experience .timeline-outer .left-line:after{
	content:'';
	position:absolute;
	display:block;
	left:50%;
	bottom:0px;
	margin-left:-8px;
	width:16px;
	height:16px;
	background:#e0e0e0;
	border-radius:50%;	
}

.our-experience .experience-block{
	position:relative;
	padding-left:130px;
	min-height:110px;
	margin-bottom:40px;
}

.our-experience .experience-block:last-child{
	margin-bottom:0px;	
}

.our-experience .experience-block .image-box{
	position:absolute;
	left:0px;
	top:0px;
	width:110px;
}

.our-experience .experience-block .image-box img{
	display:block;
	width:100%;
	border-radius:5px;	
}

.our-experience .experience-block h3{
	font-size:18px;
	font-weight:700;
	margin-bottom:15px;
	color:#2f2f31;	
}

.our-experience .experience-block .content{
}

.our-experience .experience-block .date{
	position:absolute;
	left:-135px;
	top:50%;
	margin-top:-22px;
	width:120px;
	line-height:24px;
	padding:10px;
	color:#0b6971;
	text-align:center;
	font-size:24px;
	font-weight:700;
	border:2px solid #e0e0e0;
	border-radius:5px;
	background:#ffffff;	
}


/*** 

====================================================================
	Accord Style
====================================================================

***/

.accordion-box{
	position:relative;
	margin-right:0px;	
}

.accordion-box .accordion{
	position:relative;
	margin-bottom:12px;
}

.accordion-box.style-two .accordion{
	margin-bottom:5px;	
}

.accordion-box .accordion .accord-btn{
	position:relative;
	display:block;
	min-height:60px;
	line-height:30px;
	padding:15px 50px 15px 20px;
	border:1px solid #e0e0e0;
	background:#ffffff;
	color:#2f2f31;
	cursor:pointer;
}

.accordion-box.style-two .accordion .accord-btn{
	padding:10px 30px 10px 15px;
	min-height:50px;	
}

.accordion-box.style-three .accordion .accord-btn{
	padding:7px 30px 7px 70px;
	min-height:50px;	
}

.accordion-box.style-three .accordion .accord-btn .icon-box{
	position:absolute;
	left:0px;
	top:0px;
	width:54px;
	height:100%;
	border-right:1px solid #e0e0e0;
	text-align:center;
}

.accordion-box.style-three .accordion .accord-btn .icon-box .icon{
	position:absolute;
	left:0px;
	top:50%;
	margin-top:-15px;
	width:100%;
	line-height:30px;
	height:30px;
	font-size:18px;
}

.accordion-box.style-three .accordion .accord-btn.active .icon-box{
	color:#4db0d9;
	border-color:#4db0d9;
}

.accordion-box .accordion .accord-btn h4{
	position:relative;
	font-size:18px;
	line-height:30px;
	font-weight:700;
	transition:all 0.3s ease;
	-moz-transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
	-ms-transition:all 0.3s ease;
	-o-transition:all 0.3s ease;
}

.accordion-box.style-two .accordion .accord-btn h4{
	font-size:16px;	
}

.accordion-box .accordion .accord-btn:after{
	content:'\f067';
	font-family: 'FontAwesome';
	position:absolute;
	right:10px;
	top:50%;
	margin-top:-15px;
	width:30px;
	height:30px;
	line-height:30px;
	font-size:18px;
	font-weight:normal;
}

.accordion-box.style-two .accordion .accord-btn:after{
	content:'\f18e';
	right:0px;
	width:25px;
}

.accordion-box .accordion .accord-btn.active:after{
	content:'\f068';
}

.accordion-box.style-two .accordion .accord-btn.active:after{
	content:'\f01a'	;
}

.accordion-box .accordion .accord-btn.active{
	color:#4db0d9;
	border-color:#4db0d9;
}

.accordion-box.style-two .accordion .accord-btn.active{
	color:#ffffff;
	background:#4db0d9;
	border-color:#4db0d9;
}

.accordion-box .accordion .accord-content{
	position:relative;
	padding:30px 20px 20px 20px;
	border:1px solid #e0e0e0;
	border-top:none;
	display:none;
	background:#ffffff;
}

.accordion-box.style-two .accordion .accord-content{
	padding:10px 10px 0px;	
}

.accordion-box .accordion .accord-content.collapsed{
	display:block;	
}

.accordion-box .accordion .accord-content p{
	position:relative;
}

.accordion-box .image-box{
	position:relative;
	float:left;
	margin:0px 15px 15px 0px;
	z-index:3;	
}

.accordion-box .image-box img{
	display:block;
	width:100%;	
}

.accordion-box .image-box .default-overlay-outer{
	opacity:0;
	background:rgba(34,53,85,0.90);	
}

.accordion-box .image-box:hover .default-overlay-outer{
	opacity:1;
}

/*** 

====================================================================
	Awards Section
====================================================================

***/

.awards-section{
	position:relative;
	padding:70px 0px 20px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	background-attachment:fixed;
	color:#ffffff;
}

.awards-section:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background:#0b6971;
	opacity:0.90;
}

.awards-section .styled-heading h2{
	color:#ffffff;	
}

.awards-section .award-column{
	position:relative;
	text-align:center;
	margin-bottom:50px;	
}

.awards-section .award-column .image-box{
	position:relative;
	margin-bottom:25px;	
}

.awards-section .award-column .image-box img{
	display:inline-block;
	max-width:100%;	
}

.awards-section .award-column h3{
	font-size:18px;
	font-weight:700;
	color:#ffffff;
	margin-bottom:5px;	
}

.awards-section .award-column p{
	margin-bottom:0px;
	color:#999999;
}


/*** 

====================================================================
	Testimonials Section
====================================================================

***/

.testimonials-section{
	position:relative;
	padding:70px 0px;
}

.testimonial-block{
	position:relative;
	margin-bottom:60px;	
}

.testimonial-block .text-content{
	position:relative;
	padding:25px 30px;
	background:#f5f5f5;
	border-radius:10px;
	margin-bottom:40px;
	
}

.testimonial-block .text-content:after{
	content:'';
	position:absolute;
	left:60px;
	bottom:-31px;
	width:24px;
	height:32px;
	background:url(../images/icons/curve.png) left top no-repeat;	
}

.testimonial-block .info{
	position:relative;
	margin-left:90px;
	padding-left:80px;	
}

.testimonial-block .info .author-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:50px;
	height:50px;
}

.testimonial-block .info .author-thumb img{
	display:block;
	width:50px;	
}

.testimonial-block .info h4{
	font-size:18px;
	font-weight:700;
	color:#2f2f31;	
}

.testimonial-block .info p{
	font-size:16px;
	color:#4db0d9;
	font-style:italic;
	margin-bottom:0px;
}

.loadmore-outer{
	position:relative;
	text-align:center;	
}

.loadmore-outer:before{
	content:'';
	position:absolute;
	left:0px;
	top:50%;
	height:1px;
	width:100%;
	background:#e0e0e0;	
}

.loadmore-outer .button-outer{
	position:relative;
	display:inline-block;
	padding:0px 15px;
	background:#ffffff;	
}

/*** 

====================================================================
	Styled Pagination
====================================================================

***/

.styled-pagination{
	position:relative;
	font-family:'Lora',sans-serif;
}

.styled-pagination:before{
	content:'';
	position:absolute;
	left:0px;
	top:50%;
	height:1px;
	width:100%;
	background:#e0e0e0;	
}

.styled-pagination ul{
	position:relative;
	display:inline-block;
	padding:0px 10px;
	background:#ffffff;	
}

.styled-pagination li{
	position:relative;
	display:inline-block;
	margin:5px 4px;	
}

.styled-pagination li a{
	position:relative;
	display:block;
	line-height:32px;
	padding:5px;
	font-size:18px;
	width:44px;
	height:44px;
	text-transform:uppercase;
	color:#999999;
	border:1px solid #e0e0e0;
	text-align:center;
	border-radius:5px;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
}

.styled-pagination li a:hover,
.styled-pagination li.active a{
	color:#ffffff;
	border-color:#4db0d9;
	background:#4db0d9;
}

/*** 

====================================================================
	Gallery Section
====================================================================

***/

.gallery-section{
	position:relative;
	padding:70px 0px;
}

.gallery-section .filter-list .portfolio-item{
	display:none;	
}

.filter-btns{
	position:relative;
	margin-bottom:50px;
		
}

.filter-btns li{
	position:relative;
	display:inline-block;
	padding:8px 20px;
	line-height:24px;
	border:1px solid #d0d0d0;
	color:#808080;
	cursor:pointer;
	text-transform:capitalize;
	font-size:16px;
	margin:0px 7px 10px;
	border-radius:5px;
}

.filter-btns li:hover,
.filter-btns li.active{
	border-color:#4db0d9;
	color:#ffffff;
	background:#4db0d9;
}

.portfolio-item{
	position:relative;
	margin-bottom:40px;
}

.portfolio-item .inner-box{
	position:relative;
	border-radius:5px;
	border:1px solid #e0e0e0;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	-webkit-box-shadow:0px 0px 7px 0px rgba(0,0,0,0.10);
	-ms-box-shadow:0px 0px 7px 0px rgba(0,0,0,0.10);
	-o-box-shadow:0px 0px 7px 0px rgba(0,0,0,0.10);
	-moz-box-shadow:0px 0px 7px 0px rgba(0,0,0,0.10);
	box-shadow:0px 0px 7px 0px rgba(0,0,0,0.10);
}

.portfolio-item .image-box{
	position:relative;
	overflow:hidden;
	background:#4db0d9;
}

.portfolio-item .image-box img{
	display:block;
	width:100%;
	-webkit-transform:scale(1.1,1.1);
	-ms-transform:scale(1.1,1.1);
	-o-transform:scale(1.1,1.1);
	-moz-transform:scale(1.1,1.1);
	transform:scale(1.1,1.1);
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	border-radius:5px 5px 0px 0px;	
}

.portfolio-item .inner-box:hover .image-box img{
	-webkit-transform:scale(1,1);
	-ms-transform:scale(1,1);
	-o-transform:scale(1,1);
	-moz-transform:scale(1,1);
	transform:scale(1,1);
	opacity:0.70;	
}

.portfolio-item .lower-content{
	position:relative;
	padding:15px 20px;
	border-radius:0px 0px 5px 5px;
	min-height: 112px;
	text-align: center;
	display: flex;
	display: -webkit-flex;
	display: -o-flex;
	display: -moz-flex;
	display: -ms-flex;
	justify-content: center;
	-webkit-justify-content: center;
	align-items: center;
	-webkit-align-items: center;
}

.portfolio-item .lower-content h3{
	font-size:18px;
	font-weight:700;
	color:#1a1a1a;
	margin-bottom:5px;
}

.portfolio-item .lower-content h3 a{
	color:#1a1a1a;
	transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.portfolio-item .lower-content .desc{
	color:#4db0d9;
	
	text-transform:capitalize;
}

.portfolio-item .lower-content .zoom-btn{
	position:absolute;
	right:20px;
	top:50%;
	margin-top:-10px;
	width:20px;
	height:20px;
	text-align:center;
	color:#1a1a1a;
	font-size:14px;
}

.portfolio-item .lower-content h3 a:hover,
.portfolio-item .lower-content .zoom-btn:hover{
	color:#4db0d9;
}

/**** 

====================================================================
	Portfolio Details
====================================================================

***/

.portfolio-details{
	position:relative;
	padding:70px 0px 0px;
}

.portfolio-details .image-carousel-outer{
	position:relative;
	margin-bottom:70px;	
}

.image-carousel-outer .owl-dots{
	display:none !important;	
}

.image-carousel-outer .owl-controls{
	margin:0px;	
}

.image-carousel-outer .owl-prev{
	position:absolute;
	left:10px;
	top:50%;
	margin-top:-25px;
	width:50px;
	height:50px;
	padding:0px !important;
	background:none !important;
	line-height:50px !important;
	color:#ffffff !important;
	text-align:center;
	margin:0px 0px 0px 0px !important;
}

.image-carousel-outer .owl-next{
	position:absolute;
	right:10px;
	top:50%;
	margin-top:-25px;
	width:50px;
	height:50px;
	padding:0px !important;
	background:none !important;
	line-height:50px !important;
	color:#ffffff !important;
	text-align:center;
	margin:0px 0px 0px 0px !important;
}

.image-carousel-outer .owl-prev .fa:before,
.image-carousel-outer .owl-next .fa:before{
	line-height:50px;
	font-size:48px;	
}

.image-carousel-outer .owl-prev:hover,
.image-carousel-outer .owl-next:hover{
	color:#0b6971 !important;
}

.image-carousel-outer .post-option{
	position:absolute;
	left:25px;
	top:25px;
	width:66px;
	text-align:center;
	z-index:6;
}

.image-carousel-outer .post-option .theme-btn{
	position:relative;
	display:block;
	padding:12px 10px;
	line-height:20px;
	color:#ffffff;	
}

.image-carousel-outer .post-option .theme-btn .fa{
	font-size:18px;	
}

.image-carousel-outer .post-option .add-fav{
	background:#4db0d9;
}

.image-carousel-outer .post-option .share-btn{
	background:#0b6971;
}

.portfolio-details .post-content{
	position:relative;	
}

.portfolio-details .post-content .text{
	margin-bottom:50px;	
}

.portfolio-details .post-content .text p{
	margin-bottom:20px;	
}

.portfolio-details .post-content .post-info{
	margin-bottom:70px;
	
}

.portfolio-details .post-info li{
	position:relative;
	border-bottom:1px solid #e0e0e0;
	padding:14px 0px 14px 30px;
	line-height:30px;
}

.portfolio-details .post-info li:last-child{
	border-bottom:none;	
}

.portfolio-details .post-info li .icon{
	position:absolute;
	left:0px;
	top:50%;
	margin-top:-15px;
	line-height:30px;
	font-size:14px;
	color:#4db0d9;
}

.portfolio-details .post-info li .pull-left{
	position:relative;
	color:#2f2f31;	
}

.portfolio-details .post-controls{
	position:relative;
	text-align:center;
	padding:25px 0px;
	border-top:1px solid #e0e0e0;
	border-bottom:1px solid #e0e0e0;
	
}

.portfolio-details .post-controls ul{
	position:relative;
	line-height:30px;
	padding:0px 90px;
	text-align:center;	
}

.portfolio-details .post-controls ul li{
	display:inline-block;	
}

.portfolio-details .post-controls ul li a{
	color:#0b6971;
	line-height:30px;	
}

.portfolio-details .post-controls .prev{
	position:absolute;
	left:0px;
	top:0px;
	line-height:30px;
	color:#0b6971;
}

.portfolio-details .post-controls .next{
	position:absolute;
	right:0px;
	top:0px;
	line-height:30px;
	color:#0b6971;
}

.portfolio-details .post-controls .icon{
	font-size:24px;
	line-height:30px;	
}

.portfolio-details .post-controls ul li a:hover{
	color:#4db0d9;
}

.related-cases{
	position:relative;
	padding:70px 0px 40px;	
}

/**** 

====================================================================
	Error Section
====================================================================

***/

.error-section{
	position:relative;
	padding:80px 0px 0px;
}

.error-section .text-content{
	position:relative;
	padding:80px 0px 100px;
	max-width:480px;
		
}

.error-section .auto-container{
	position:relative;	
}

.error-section .image-box{
	position:absolute;
	right:15px;
	bottom:0px;
	text-align:right;
}

.error-section .image-box img{
	display:inline-block;
	max-width:100%;	
}

.error-section .bigger-text{
	font-size:200px;
	margin-bottom:20px;
	line-height:200px;
	font-weight:700;
	color:#2f2f31;
}

.error-section .medium-text{
	font-size:30px;
	margin-bottom:20px;
	line-height:40px;
	color:#2f2f31;
	font-weight:700;
}

.error-section .text{
	margin-bottom:40px;
}

/*** 

====================================================================
	Sidebar
====================================================================

***/

.sidebar-page-container{
	position:relative;
	padding:70px 0px 0px;
}

.sidebar-page-container .sidebar{
	margin-bottom:30px;	
}

.sidebar .styled-heading h2{
	font-size:24px;	
}

.sidebar .sidebar-widget{
	position:relative;
	margin-bottom:50px;	
}

.sidebar .boxed-nav{
	position:relative;
}

.sidebar .boxed-nav .nav-outer{
	position:relative;
	border:1px solid #e0e0e0;
	
	border-radius:5px;	
}

.sidebar .boxed-nav ul li{
	position:relative;	
}

.sidebar .boxed-nav ul li:last-child a{
	border:none;	
}

.sidebar .boxed-nav li a{
	position:relative;
	display:block;
	line-height:30px;
	padding:10px 15px;
	text-transform:uppercase;
	color:#2f2f31;
	font-size:14px;
	font-weight:700;
	border-bottom:1px solid #e0e0e0;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-o-transition:all 300ms ease;	
}

.sidebar .boxed-nav li:hover a,
.sidebar .boxed-nav li.current a{
	background:#4db0d9;
	color:#ffffff;
	border-color:#4db0d9;
}

.sidebar .downloads li{
	position:relative;
	margin-bottom:12px;
		
}

.sidebar .downloads li a{
	position:relative;
	display:block;
	padding:10px 10px 10px 70px;
	color:#999999;
	border:1px solid #e0e0e0;
	line-height:30px;
}

.sidebar .downloads li a:hover{
	background:#f5f5f5;
	color:#4db0d9;
}

.sidebar .downloads li a .icon{
	position:absolute;
	left:0px;
	top:0px;
	width:50px;
	height:50px;
	line-height:50px;
	text-align:center;
	font-size:18px;
	border-right:1px solid #e0e0e0;	
}

.sidebar .styled-nav{
	position:relative;
}

.sidebar .styled-nav .nav-outer{
	position:relative;
	
}

.sidebar .styled-nav ul li{
	position:relative;
	margin-bottom:2px;	
}

.sidebar .styled-nav ul li:last-child {
	margin-bottom:0px;	
}

.sidebar .styled-nav li a{
	position:relative;
	display:block;
	line-height:30px;
	padding:10px 15px;
	text-transform:capitalize;
	color:#2f2f31;
	background:#f5f5f5;
	font-size:14px;
	font-weight:700;
	border:1px solid #e0e0e0;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
	-o-transition:all 300ms ease;	
}

.sidebar .styled-nav li:hover a,
.sidebar .styled-nav li.current a{
	color:#4db0d9;
	background:#ffffff;
}

.sidebar .search-box .form-group{
	position:relative;
	margin:0px;	
}

.sidebar .search-box .form-group input[type="text"],
.sidebar .search-box .form-group input[type="search"]{
	height: 50px;
	position:relative;
	line-height:26px;
	padding:10px 30px 10px 15px;
	border:1px solid #e0e0e0;
	background:#ffffff;
	color:#3a3a3a;
	display:block;
	width:100%;
	border-radius:3px;
	transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
}

.sidebar .search-box .form-group input:focus{
	border-color:#4db0d9;
}

.sidebar .search-box .form-group button{
	position:absolute;
	right:0px;
	top:0px;
	height:48px;
	width:30px;
	line-height:48px;
	text-align:left;
	display:block;
	font-size:14px;
	color:#cccccc;
	background:none;
}

.sidebar .search-box .form-group input:focus + button,
.sidebar .search-box .form-group button:hover{
	color:#4db0d9;
}

.sidebar .recent-posts .post{
	position:relative;
	font-size:14px;
	margin-bottom:20px;
	min-height:60px;
	padding:0px 0px 0px 80px;
	color:#cccccc;
}

.sidebar .recent-posts .post .post-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:64px;
	height:64px;	
}

.sidebar .recent-posts .post .post-thumb img{
	width:100%;
	display:block;
	border-radius:5px;	
}

.sidebar .recent-posts .post h4{
	font-size:14px;
	font-weight:500;
	margin:0px 0px 5px;
	line-height:1.4em;
	color:#292929;
	font-family:'Inter', sans-serif;
}

.sidebar .recent-posts .post a,
.sidebar .recent-posts .post a:hover{
	color:#4db0d9;
}

.sidebar .recent-posts .post h4 a{
	color:#777777;	
}

.sidebar .recent-posts .post-info{
	color:#4db0d9;
			
}

.sidebar .recent-posts .post-info .icon{
	padding-right:5px;	
}

.sidebar .popular-tags a{
	position:relative;
	display:inline-block;
	line-height:24px;
		
	padding:7px 15px;
	margin:0px 5px 12px 0px;
	border:1px solid rgba(0,0,0,0.10);	
	background:#ffffff;
	color:#1a1a1a;
	font-size:13px;
	font-weight:700;
	text-transform:uppercase;
	text-align:center;
	border-radius:3px;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.sidebar .popular-tags a:hover{
	background-color:#f5f5f5;
	border-color:#f5f5f5;
	color:#4db0d9;
}

.sidebar .list{
	position:relative;
	
}

.sidebar .list li{
	position:relative;
	margin-bottom:10px;
	line-height:32px;	
}

.sidebar .list.style-two li{
	border-bottom:1px solid #e0e0e0;
	margin-bottom:0px;
}

.sidebar .list.style-two li a{
	margin:10px 0px;
}

.sidebar .list li .count{
	position:relative;
}

.sidebar .list li a{
	position:relative;
	display:block;
	color:#3d3d3d;
	font-size:16px;
	font-weight:400;
	padding-left:20px;
}


.sidebar .list li:before{
	font-family: 'FontAwesome';
	content:'\f105';
	position:absolute;
	left:0px;
	top:0px;
	display:block;
	font-size:18px;
	line-height:32px;
	color:#4db0d9;

}

.sidebar .list li a:hover{
	color:#4db0d9;
}

.sidebar .instagram-gallery{
	position:relative;
}

.sidebar .instagram-gallery .images-outer{
	position:relative;
	margin-left:-5px;
	margin-right:-5px;	
}

.sidebar .instagram-gallery .image{
	position:relative;
	float:left;
	width:33.333%;
	padding:5px;	
}

.sidebar .instagram-gallery .image img{
	position:relative;
	display:block;
	width:100%;
	border-radius:3px;	
}

.sidebar .latest-tweets{
	position:relative;
		
}

.sidebar .latest-tweets .owl-dots{
	display:none !important;	
}

.sidebar .latest-tweets .owl-nav{
	position:absolute;
	right:0px;
	bottom:-50px;	
}

.sidebar .latest-tweets .widget-bottom{
	padding:10px 0px;
	border-top:1px solid #e0e0e0;	
}

.sidebar .latest-tweets .widget-bottom a{
	color:#707070;	
}

.sidebar .latest-tweets .time{
	color:#4db0d9;
	margin-bottom:5px;
}

.sidebar .latest-tweets .owl-prev{
	width:20px;
	height:20px;
	padding:0px !important;
	background:none !important;
	line-height:20px !important;
	color:#707070 !important;
	text-align:center;
	margin:0px 0px 0px 0px !important;
}

.sidebar .latest-tweets .owl-next{
	width:20px;
	height:20px;
	padding:0px !important;
	background:none !important;
	line-height:20px !important;
	color:#707070 !important;
	text-align:center;
	margin:0px 0px 0px 0px !important;
}

.sidebar .latest-tweets .owl-prev .fa:before,
.sidebar .latest-tweets .owl-next .fa:before{
	line-height:24px;
	font-size:24px;	
}

.sidebar .latest-tweets .owl-prev:hover,
.sidebar .latest-tweets .owl-next:hover{
	color:#4db0d9 !important;
}


.rangeslider-widget .val-box{
	position:relative;
	display:inline-block;
	margin:7px 5px 7px 0px;
	line-height:24px;
	font-size:14px;
	border:1px solid #dadada;
	padding:8px 10px;
	width:80px;
	text-align:center;
}

.rangeslider-widget button{
	position:relative;
	display:inline-block;
	line-height:24px;
	border:1px solid #0b6971;
	padding:8px 25px;
	background:#0b6971;
	color:#ffffff;
	border-radius:5px;
		
}

.rangeslider-widget .noUi-connect{
	background:#4db0d9 !important;
}

.rangeslider-widget .noUi-background{
	background:#ededed !important;	
}

.rangeslider-widget .noUi-handle{
	background:#f4f4f4 !important;
	border-radius:5px !important;
	box-shadow:none;
	border-color:#e0e0e0;
	cursor:pointer;
}

.sidebar .best-sellers .item{
	position:relative;
	font-size:16px;
	margin-bottom:30px;
	min-height:90px;
	padding:0px 0px 0px 90px;
	color:#cccccc;
}

.sidebar .best-sellers .item .post-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:72px;
	height:90px;	
}

.sidebar .best-sellers .item .post-thumb img{
	width:100%;
	display:block;
}

.sidebar .best-sellers .item h4{
	font-size:18px;
	font-weight:700;
	margin:0px 0px;
	line-height:1.4em;
	color:#2f2f31;
	font-family:'Inter', sans-serif;
}

.sidebar .best-sellers .item a,
.sidebar .best-sellers .item a:hover{
	color:#4db0d9;
}

.sidebar .best-sellers .item h4 a{
	color:#2f2f31;	
}

.sidebar .best-sellers .item .rating{
	font-size:11px;
	color:#0b6971;
}

.sidebar .best-sellers .item .item-price{
	font-size:18px;
	font-weight:700;
	color:#4db0d9;
}


/*** 

====================================================================
	Law Section / Details
====================================================================

***/

.law-section .carousel-outer{
	position:relative;	
}

.law-section .carousel-outer img{
	display:block;
	width:100%;
	height:auto;	
}

.law-section .carousel-outer .owl-controls{
	margin:0px;	
}

.law-section .carousel-outer .owl-nav{
	display:none;	
}

.law-section .carousel-outer .owl-dots{
	position:absolute;
	left:0px;
	bottom:5px;
	width:100%;
	z-index:20;	
}

.law-section .carousel-outer .owl-dots .owl-dot span{
	border:1px solid #ffffff;
	background:none;
	margin:0px 5px;	
}

.law-section .carousel-outer .owl-dots .owl-dot.active span,
.law-section .carousel-outer .owl-dots .owl-dot:hover span{
	background:#ffffff;	
}

.law-section .law-upper{
	position:relative;
	margin-bottom:50px;
	background:#0b6971;
}

.law-section .law-upper .specs-box{
	position:relative;
	padding:40px 0px 20px;
	color:#ffffff;
	font-size:18px;
}

.law-section p{
	margin-bottom:20px;	
}

.law-section .about-law{
	margin-bottom:50px;	
}

.law-section .law-upper .specs-box h2{
	font-size:24px;
	font-weight:700;
	color:#ffffff;
	margin-bottom:25px;
}	

.styled-list-one{
	position:relative;
	
}

.styled-list-one li{
	position:relative;
	padding-left:35px;
	margin-bottom:14px;
	line-height:30px;
}

.styled-list-one li:last-child{
	margin-bottom:0px;	
}

.styled-list-one li:before{
	font-family: 'FontAwesome';
	content:'\f178';
	position:absolute;
	left:0px;
	top:0px;
	display:block;
	line-height:30px;
	color:#4db0d9;
}

.styled-list-two{
	position:relative;
	
}

.styled-list-two li{
	position:relative;
	padding-left:25px;
	margin-bottom:10px;
	line-height:30px;
}

.styled-list-two li:last-child{
	margin-bottom:0px;	
}

.styled-list-two li:before{
	font-family: 'FontAwesome';
	content:'\f0da';
	position:absolute;
	left:5px;
	top:0px;
	display:block;
	font-size:14px;
	line-height:30px;
}

.law-section .default-two-column{
	margin-bottom:50px;	
}

.boxed-column{
	position:relative;
	border:1px solid #e0e0e0;
	padding:0px 10px 15px;
	margin-bottom:30px;
}

.boxed-column h4{
	position:relative;
	font-size:18px;
	font-weight:700;
	top:-15px;
	margin-left:-5px;
	background:#ffffff;
	display:inline-block;
	padding:0px 10px;
	color:#2f2f31;
	margin-bottom:0px;	
}

/*** 

====================================================================
	Parctice Areas Section
====================================================================

***/

.practice-areas{
	position:relative;
	padding-bottom:30px;
}

.practice-column{
	position:relative;
	margin-bottom:50px;
	text-align:center;
}

.practice-column .inner-box{
	position:relative;
	background:#f5f5f5;
	border:1px solid #e0e0e0;	
}

.practice-column .image-box{
	position:relative;	
}

.practice-column .image-box img{
	display:block;
	width:100%;	
}

.practice-column .icon-box{
	position:relative;
	width:72px;
	height:72px;
	background:#ffffff;
	font-size:36px;
	line-height:68px;
	margin:-37px auto 10px;
	color:#4db0d9;
	border:2px solid #4db0d9;
	border-radius:50%;
	-ms-border-radius:50%;
	z-index:1;
}

.practice-column .lower-content{
	position:relative;
	padding:0px 8px 20px;
	min-height:260px;	
}

.practice-column h3{
	font-size:18px;
	color:#2f2f31;
	font-weight:700;
	margin-bottom:12px;	
}

.practice-column h3 a{
	color:#2f2f31;
}

.practice-column h3 a:hover{
	color:#4db0d9;
}

/*** 

====================================================================
	Single Attorney Section
====================================================================

***/

.attorney-single{
	position:relative;
	padding-bottom:40px;
}

.attorney-single .basic-details{
	position:relative;
	margin-bottom:40px;
}

.attorney-single .image-column,
.attorney-single .info-column{
	margin-bottom:20px;
}

.attorney-single .basic-details .info-header{
	position:relative;
	border-bottom:1px solid #e0e0e0;
	margin-bottom:15px;
	padding-bottom:15px;	
}

.attorney-single .styled-heading h2{
	font-size:24px;	
}

.attorney-single .basic-details .text{
	margin-bottom:20px;
}

.attorney-single .basic-details .info-header h3{
	font-size:18px;
	color:#2f2f31;
	font-weight:700;
	text-transform:uppercase;
}

.attorney-single .basic-details .info-header .designation{
	font-size:16px;
	line-height:20px;
	color:#4db0d9;
	text-transform:capitalize;
	font-style:italic;
	font-family: 'Inter', serif;
}

.attorney-single .basic-details .social-links{
	position:relative;
}

.attorney-single .basic-details .social-links a{
	position:relative;
	display:inline-block;
	width:44px;
	height:44px;
	font-size:14px;
	margin:0px 3px 5px;
	line-height:42px;
	border-radius:5px;
	text-align:center;
	border:1px solid #e1e1e1;
	color:#909090;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.attorney-single .basic-details .social-links a:hover{
	background-color:#4db0d9;
	color:#ffffff;
	border-color:#4db0d9;
}

.attorney-single .basic-details .contact-info{
	position:relative;
	
}

.attorney-single .basic-details .contact-info li{
	position:relative;
	padding-left:30px;
	line-height:20px;
}

.attorney-single .basic-details .contact-info a{
	color:#0b6971;
	text-decoration:underline;
	font-size:16px;	
}

.attorney-single .basic-details .contact-info li .icon{
	position:absolute;
	left:0px;
	top:0px;
	line-height:20px;
	color:#4db0d9;
	width: 20px;
}

.attorney-single .education-info,
.attorney-single .court-info,
.attorney-single .awards-info,
.attorney-single .professional-info,
.attorney-single .bars-info{
	margin-bottom:40px;	
}


.styled-list-three{
	position:relative;
	
}

.styled-list-three li{
	position:relative;
	padding-left:40px;
	margin-bottom:7px;
	line-height:30px;
}

.attorney-single .styled-list-three li{
	margin-bottom:15px;	
}

.attorney-single .professional-info .styled-list-three li{
	margin-bottom:5px;	
}

.attorney-single .styled-list-three li strong{
	font-family:'Inter', sans-serif;
	color:#2f2f31;	
}

.styled-list-three li:last-child{
	margin-bottom:0px;	
}

.styled-list-three li:before{
	font-family: 'FontAwesome';
	content:'\f27e';
	position:absolute;
	left:5px;
	top:0px;
	display:block;
	font-size:18px;
	line-height:30px;
	color:#4db0d9;
}

/*** 

====================================================================
	Tabs Style
====================================================================

***/

.tabs-section{
	position:relative;
	padding:70px 0px;	
}

.tabs-box{
	position:relative;	
}

.tabs-box .tab-buttons{
	position:relative;
}

.tabs-box.style-one .tab-buttons{
	margin-bottom:50px;	
}

.tabs-box.style-one .tab-buttons .tab-btn{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:12px 25px;
	margin:0px 5px 10px;
	background:#f5f5f5;
	border-radius:5px;
	font-weight:700;
	font-size:16px;
	cursor:pointer;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.tabs-box.style-one .tab-buttons .tab-btn:hover,
.tabs-box.style-one .tab-buttons .tab-btn.active-btn{
	background:#0b6971;
	color:#ffffff;	
}

.tabs-box .tab{
	display:none;	
}

.tabs-box .tab.active-tab{
	display:block;	
}

/*** 

====================================================================
	Default Form Section
====================================================================

***/

.default-form-section{
	position:relative;
	background:#ffffff;
	padding:70px 0px 50px;
	background-size:cover;
	background-repeat:no-repeat;
	background-position:center center;
	overflow:hidden;
}

.default-form-section:before{
	content:'';
	position:absolute;
	left:0px;
	top:0px;
	width:100%;
	height:100%;
	background:#f5f5f5;
	opacity:0.80;	
}

.default-form-section .auto-container{
	position:relative;
	z-index:1;	
}

/*** 

====================================================================
	Products Section style
====================================================================

***/

.products-section{
	position:relative;
	background:#ffffff;
	padding:70px 0px;
}

.products-section .shop-upper-box{
	position:relative;
	margin-bottom:40px;
	
}

.products-section .shop-upper-box .items-label{
	position:relative;
	padding:7px 0px;
	line-height:30px;	
}

.products-section .shop-upper-box .sort-by select{
	position:relative;
	display:block;
	line-height:24px;
	padding:9px 10px;
	width:240px;
	cursor:pointer;
	border:1px solid #dadada;
	background:#ffffff url(../images/icons/icon-dropdown.png) right center no-repeat;
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
	-o-appearance:none;	
}

.products-section .shop-upper-box .sort-by select option{
	text-indent:10px;
}

.default-product-item{
	position:relative;
	margin-bottom:40px;	
}

.default-product-item .image-box{
	position:relative;
	overflow:hidden;
	margin-bottom:20px;	
}

.default-product-item .image-box img{
	display:block;
	width:100%;	
}

.default-product-item .default-overlay-outer{
	opacity:0;
	top:-100%;
	background:rgba(54,53,85,0.90);	
}

.default-product-item:hover .default-overlay-outer{
	top:0;
	opacity:1;	
}

.default-product-item .content-box{
	position:relative;	
}

.default-product-item .content-box h4{
	font-size:18px;
	font-weight:700;
	margin:0px 0px;
	line-height:1.4em;
	color:#2f2f31;
	font-family:'Inter', sans-serif;
	margin-bottom:3px;	
}

.default-product-item .content-box a,
.default-product-item .content-boxa:hover{
	color:#4db0d9;
}

.default-product-item .content-box h4 a{
	color:#2f2f31;	
}

.default-product-item .content-box .rating{
	font-size:11px;
	color:#0b6971;
	margin-bottom:15px;
}

.default-product-item .content-box .item-price{
	font-size:18px;
	font-weight:700;
	color:#4db0d9;
	line-height:24px;
}

.default-product-item .content-box .item-price .strike-through{
	color:#999999;
	font-weight:normal;
	font-size:14px;
	padding-left:10px;
	line-height:20px;
	
}

/*** 

====================================================================
	Products Details style
====================================================================

***/

.product-details .basic-details{
	position:relative;
	margin-bottom:50px;
}

.product-details .image-column,
.product-details .info-column{
	margin-bottom:20px;
}

.product-details .basic-details .details-header{
	position:relative;
	border-bottom:1px solid #e0e0e0;
	margin-bottom:20px;
	padding-bottom:20px;
	text-align: justify;
}

.product-details .basic-details .details-header h4{
	font-size:24px;
	font-weight:700;
	margin:0px 0px;
	line-height:1.4em;
	color:#2f2f31;
	font-family:'Inter', sans-serif;
	margin-bottom:3px;	
}

.product-details .basic-details .details-header h4 a{
	color:#2f2f31;	
}

.product-details .basic-details .details-header .rating{
	font-size:11px;
	color:#0b6971;
	margin-bottom:15px;
}

.product-details .basic-details .details-header .rating .txt{
	font-size:14px;
	padding-left:10px;	
}

.product-details .basic-details .details-header .item-price{
	font-size:24px;
	font-weight:700;
	color:#4db0d9;
	line-height:24px;
}

.product-details .basic-details .text{
	margin-bottom:20px;	
}

.product-details .basic-details .check-delivery{
	position:relative;
	margin-bottom:30px;	
}

.product-details .basic-details .check-delivery h4{
	font-size:14px;
	color:#2f2f31;
	font-weight:700;
	margin-bottom:15px;	
}

.product-details .basic-details .check-delivery .form-group{
	position:relative;
	float:left;
	margin-right:10px;	
}

.product-details .basic-details .check-delivery .form-group input[type="text"]{
	display:block;
	line-height:24px;
	padding:7px 10px;
	border:1px solid #e0e0e0;
	border-radius:3px;
	width:170px;
	background:none;	
}

.product-details .basic-details .check-delivery .form-group button{
	display:block;
	line-height:24px;
	padding:7px 20px;
	border:1px solid #e0e0e0;
	background:#f5f5f5;
	color:#777777;
	font-size:14px;
	border-radius:5px;	
}

.product-details .basic-details .item-quantity{
	position:relative;
	top:4px;
	width:120px;	
}

.product-details .basic-details .item-quantity input[type="text"]{
	position:relative;
	line-height:40px;	
}

.product-details .basic-details .check-delivery .field-label{
	font-weight:700;
	font-size:14px;
	line-height:40px;
	color:#4db0d9;
}

/*** 

====================================================================
	Product Tabs Style
====================================================================

***/

.prod-tabs{
	position:relative;	
}

.prod-tabs .tab-btns{
	position:relative;
	top:1px;
	z-index:1;	
}

.prod-tabs .tab-btns .tab-btn{
	position:relative;
	display:block;
	float:left;
	font-size:15px;
	color:#3d3d3d;
	text-transform:uppercase;
	font-weight:600;
	padding:10px 30px;
	border:1px solid transparent;
	border-top-width:3px;
	margin-right:3px;
}

.prod-tabs .tab-btns .tab-btn:hover,
.prod-tabs .tab-btns .tab-btn.active-btn{
	border-color:#e0e0e0;
	border-top-color:#4db0d9;
	border-bottom-color:#ffffff;
	color:#4db0d9;
}

.prod-tabs .tabs-container{
	position:relative;
	border:1px solid #e0e0e0;
	color:#000000;	
}

.prod-tabs .tabs-container .tab{
	position:relative;
	padding:40px 25px;
	display:none;
	
}

.prod-tabs .tabs-container .tab.active-tab{
	display:block;	
}

.prod-tabs .tabs-container .tab p,
.prod-tabs .tabs-container .tab h2,
.prod-tabs .tabs-container .tab h3,
.prod-tabs .tabs-container .tab h4,
.prod-tabs .tabs-container .tab h5,
.prod-tabs .tabs-container .tab h6{
	margin-bottom:15px;	
}


.prod-tabs .tabs-container .tab h3{
	font-size:18px;
	font-weight:700;
	
}

.prod-tabs .tabs-container .tab h4{
	font-size:16px;
	font-weight:700;
	
}

.prod-tabs .reviews-container{
	position:relative;	
}

.prod-tabs .reviews-container .review-box{
	position:relative;
	margin-bottom:30px;
	padding-left:100px;
	min-height:100px;
}

.prod-tabs .reviews-container .rev-thumb{
	position:absolute;
	left:0px;
	top:0px;
	width:82px;
	height:82px;
	border:1px solid #e0e0e0;
	background:#ffffff;
}

.prod-tabs .reviews-container .rev-thumb img{
	display:block;
	width:80px;
	height:80px;	
}

.prod-tabs .reviews-container .rev-content{
	position:relative;
	padding:15px;
	border:1px solid #e0e0e0;
	background:#ffffff;	
}

.prod-tabs .reviews-container .rating{
	color:#ffa500;
	font-size:14px;
	margin-bottom:5px;
}

.prod-tabs .reviews-container .rev-info{
	font-size:12px;
	letter-spacing:1px;
	margin-bottom:10px;
}

.prod-tabs .reviews-container .rev-text{
	font-size:14px;
}

.prod-tabs .add-review{
	position:relative;
	margin:30px 0px 20px;
	font-size:14px;
}

.prod-tabs .add-review .rating{
	position:relative;	
}

.prod-tabs .add-review .rating .rate-box{
	position:relative;
	display:inline-block;
	margin-right:10px;
	font-size:14px;
	color:#5a5a5a;	
}

.prod-tabs .add-review .rating .rate-box:hover,
.prod-tabs .add-review .rating .rate-box:focus,
.prod-tabs .add-review .rating .rate-box:active{
	color:#ffa500;	
}

.prod-tabs .add-review label{
	position:relative;
	display:block;
	font-size:14px;
	margin-bottom:5px;
	font-weight:400;
	color:#303030;	
}

.prod-tabs .add-review h3{
	margin-bottom:20px;	
}

.prod-tabs .add-review .form-group{
	position:relative;
	margin-bottom:20px;	
}

.prod-tabs .add-review .form-group input[type="text"],
.prod-tabs .add-review .form-group input[type="password"],
.prod-tabs .add-review .form-group input[type="tel"],
.prod-tabs .add-review .form-group input[type="email"],
.prod-tabs .add-review .form-group select{
	position:relative;
	display:block;
	width:100%;
	line-height:22px;
	padding:9px 15px;
	color:#222222;
	border:1px solid #e0e0e0;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.prod-tabs .add-review .form-group textarea{
	position:relative;
	display:block;
	width:100%;
	line-height:22px;
	padding:8px 15px;
	color:#222222;
	border:1px solid #e0e0e0;
	height:200px;
	resize:none;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.prod-tabs .add-review button{
	position:relative;
	display:inline-block;
	background:#3d3d3d;
	color:#ffffff;
	padding:7px 32px;
	line-height:24px;
	font-size:14px;
	font-weight:500;
}

.prod-tabs .add-review button:before{
	background:#4db0d9;
}

.related-products{
	position:relative;
	padding:70px 0px 40px;	
}

/*** 

====================================================================
	Contact Section
====================================================================

***/

.contact-section{
	position:relative;
	padding:70px 0px 0px;
}

.contact-section .column{
	position:relative;
	margin-bottom:50px;
}

.contact-section .default-form button{
	padding:10px 30px;	
}

.contact-form .form-group{
	margin-bottom:30px;	
}
.has-error .form-control,
.contact-form .form-group.has-error,
#openFormId .form-group.has-error input,
.contact-form .form-group.has-error input,
.has-error .select2-container--krajee .select2-selection--single {
	border-color: #ff0000!important;
	color: #ff0000!important;
}
.btn.btn-primary.btn-file {
	background: #0b6971;
	line-height: 38px;
}
.contact-section .contact-info{
	position:relative;
	margin-bottom:30px;
}

.contact-section .contact-info h3{
	font-size:18px;
	font-weight:700;
	margin-bottom:15px;
	color:#2f2f31;
}

.contact-section .contact-info .icon{
	font-size:18px;
	font-weight:normal;
	padding-right:7px;
	color:#4db0d9;
}

.contact-section .contact-info .info-block{
	margin-bottom:25px;	
}

.contact-section .contact-info .text{
	position:relative;
		
	margin-bottom:10px;
	color:#999999;
}

.contact-section .contact-info .hours-list li{
	position:relative;
	margin-bottom:4px;
		
}

.contact-section .contact-info .hours-list .col{
	position:relative;
	display:block;
	float:left;
	width:50%;	
}

/*** 

====================================================================
	Login / Register Section
====================================================================

***/

.register-section{
	position:relative;
	padding:70px 0px 20px;
}

.register-section .form-column{
	margin-bottom:50px;	
}

.styled-form{
	position:relative;	
}

.styled-form .form-group{
	position:relative;
	margin-bottom:30px;
	font-size:14px;	
}

.styled-form .pull-left label,
.styled-form .pull-right label{
	cursor:pointer;
}

.styled-form .form-group .adon-icon{
	position:absolute;
	top:50%;
	margin-top:-10px;
	right:10px;
	width:20px;
	height:20px;
	line-height:20px;
	font-size:14px;
	color:#999999;
	z-index:2;
}

.styled-form input[type="text"],
.styled-form input[type="email"],
.styled-form input[type="password"],
.styled-form input[type="tel"],
.styled-form input[type="number"],
.styled-form input[type="url"],
.styled-form select,
.styled-form textarea{
	position:relative;
	display:block;
	width:100%;
	background:#ffffff;
	line-height:30px;
	padding:8px 20px;
	height:48px;
	border:1px solid #e0e0e0;
	border-radius:5px;
	transition:all 300ms ease;
	-webkit-transition:all 300ms ease;
	-ms-transition:all 300ms ease;
	-o-transition:all 300ms ease;
	-moz-transition:all 300ms ease;
}

.styled-form select{
	-webkit-appearance:none;
	-ms-appearance:none;
	-moz-appearance:none;
	-o-appearance:none;
	background:#ffffff url(../images/icons/icon-dropdown.png) right center no-repeat;
	cursor:pointer;
}

.styled-form select option{
	text-indent:20px;	
}

.styled-form textarea{
	resize:none;
	height:110px;	
}

.styled-form input:focus,
.styled-form select:focus,
.styled-form textarea:focus{
	border-color:#4db0d9;
}

.styled-form .forgot{
	font-size:14px;	
}

.social-links-two a{
	position:relative;
	display:inline-block;
	font-size:14px;
	width:42px;
	height:42px;
	line-height:42px;
	text-align:center;
	color:#ffffff;
	background:#0b6971;
	margin:0px 0px 0px 15px;
	transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
}

.social-links-two a:hover{
	opacity:0.80;
}

.social-links-two .facebook{
	background:#3b5998;	
}

.social-links-two .twitter{
	background:#33ccfe;	
}

.social-links-two .google-plus{
	background:#dd4b39;	
}


/*** 

====================================================================
	Cart Section style
====================================================================

***/

.cart-section{
	position:relative;
	padding:70px 0px;
}

.cart-section .cart-outer{
	position:relative;	
}

.cart-section .table-outer{
	position:relative;
	width:100%;
	overflow-x:	auto;
}

.cart-section .cart-table{
	width:100%;
	min-width:900px;	
}

.cart-table .cart-header{
	position:relative;
	width:100%;
	font-family:'Lora',sans-serif;
	text-transform:uppercase;
	font-size:16px;
	border-radius:7px;
	background:#f5f5f5;
	color:#2f2f31;
}

.cart-table thead tr th{
	line-height:24px;
	padding:20px 15px;
	min-width:120px;
	font-weight:700;
}

.cart-table thead tr th.prod-column{
	text-align:left;
	padding-left:40px;	
}

.cart-table tbody tr td{
	line-height:24px;
	padding:30px 10px 20px;
	min-width:100px;
	
}

.cart-table tbody tr .qty{
	width:120px;
	padding-right:20px;
}

.cart-table tbody tr .qty .quantity-spinner{
	background:#f5f5f5;	
}

.cart-table tbody tr .prod-column .column-box{
	position:relative;
	min-height:90px;
	padding-left:100px;
	padding-top:15px;
	text-align:left;
}

.cart-table tbody tr .prod-column .column-box .prod-thumb{
	position:absolute;
	left:0px;
	top:0px;	
}

.cart-table tbody tr .prod-column .column-box .prod-thumb img{
	 display:block;
	 max-width:100%;
}

.cart-table tbody tr .prod-column .column-box h3{
	font-size:18px;
	color:#2f2f31;
	font-weight:700;
	margin-bottom:5px;	
}

.cart-table tbody tr .sub-total{
	font-weight:700;
	color:#0b6971;
}

.cart-table tbody tr .remove-btn{
	position:relative;
	font-size:16px;
	color:#282828;
	line-height:30px;
	-webkit-transition:all 500ms ease;
	-ms-transition:all 500ms ease;
	-o-transition:all 500ms ease;
	-moz-transition:all 500ms ease;
	transition:all 500ms ease;
}

.cart-table tbody tr .remove-btn .fa{
	position:relative;
	top:2px;
	padding-right:10px;
	font-size:24px;
	line-height:30px;
}

.cart-table tbody tr .remove-btn:hover{
	color:#ec1c33;
}

.cart-table tbody tr{
	border-bottom:1px solid #e9e9e9;	
}

.cart-table tbody tr td{
	vertical-align:middle;	
}

.cart-table tbody tr td .quantity-spinner{
	padding:5px 0px 5px 20px;
	line-height:24px;
	height:34px;
	display:block;
	width:100%;
	position:relative;
}

.cart-table tbody .available-info{
	position:relative;
	padding-left:50px;	
}

.cart-table tbody .available-info .icon{
	position:absolute;
	left:0px;
	top:5px;
	width:40px;
	height:40px;
	line-height:40px;
	text-align:center;
	font-size:18px;
	color:#ffffff;
	background:#0b6971;
	border-radius:50%;
}

.cart-section .apply-coupon{
	position:relative;
}

.cart-section .apply-coupon .form-group{
	position:relative;
	float:left;
	margin-right:10px;	
}

.cart-section .apply-coupon .form-group input[type="text"]{
	display:block;
	line-height:24px;
	padding:9px 10px;
	border:1px solid #e0e0e0;
	border-radius:3px;
	width:230px;
	background:none;	
}

.cart-section .estimate-form{
	position:relative;
}

.cart-section h3{
	font-size:24px;
	font-weight:700;
	color:#2f2f31;
	margin-bottom:30px;	
}

.cart-section .estimate-form .row{
	margin-left:-7px;
	margin-right:-7px;	
}

.cart-section .estimate-form .row .form-group{
	padding:0px 7px !important;
	margin-bottom:30px;
}

.cart-section .totals-table{
	position:relative;
	border:1px solid #e0e0e0;
	
	border-radius:5px;	
}

.cart-section .totals-table .col{
	position:relative;
	display:block;
	float:left;
	padding:10px 15px;
	line-height:24px;
	width:50%;	
}

.cart-section .totals-table .col-title{
	font-family:'Inter', sans-serif;
	font-size:14px;
	color:#353535;
	border-right:1px solid #e0e0e0;
	font-weight:700;	
}

.cart-section .totals-table li{
	position:relative;
	border-bottom:1px solid #e0e0e0;	
}

.cart-section .totals-table li:last-child{
	border-bottom:none;	
}


/*** 

====================================================================
	Checkout Style
====================================================================

***/

.checkout-section{
	position:relative;
	padding:70px 0px;
}

.checkout-section .cart-table{
	width:100%;
	min-width:500px;	
}

.checkout-section .form-column{
	margin-bottom:50px;	
}

.checkout-section .default-form .form-group{
	margin-bottom:20px;	
}

.checkout-section .default-form .form-group .field-label{
	margin-bottom:10px;
	font-weight:700;
}

.checkout-section .default-form .form-group input,
.checkout-section .default-form .form-group select,
.checkout-section .default-form .form-group textarea{
	border-radius:3px;
	height:48px;
	padding:8px 15px;
	line-height:30px;	
}

.checkout-section .default-form .form-group textarea{
	height:154px;	
}

.checkout-section .totals-table{
	margin-bottom:30px;	
}

.checkout-section .payment-options{
	position:relative;	
}

.checkout-section .payment-options .option-block{
	position:relative;
	margin-bottom:10px;
}

.checkout-section .payment-options .text{
	position:relative;
	padding-left:30px;
	margin-bottom:20px;
	font-size:16px;	
}

.checkout-section .payment-options .option-block .radio-block{
	position:relative;	
}

.checkout-section .payment-options .option-block .radio-block input[type="radio"]{
	position:absolute;
	left:0px;
	top:7px;
	opacity:0;	
}

.checkout-section .payment-options .option-block .radio-label{
	position:relative;
	display:block;
	padding-left:30px;
	line-height:30px;
	font-size:16px;
	font-weight:700;
	color:#2f2f31;
	text-transform:capitalize;
	cursor:pointer;
}

.checkout-section .payment-options .option-block .radio-label:before{
	content:'';
	position:absolute;
	left:0px;
	top:7px;
	display:block;
	width:16px;
	height:16px;
	border:1px solid #e0e0e0;
	background:#ffffff;	
}

.checkout-section .payment-options .option-block .radio-block input[type="radio"]:checked+.radio-label:before{
	border-color:#4db0d9;
}

.checkout-section .payment-options .option-block .radio-label:after{
	content:'';
	position:absolute;
	top:11px;
	left:4px;
	display:block;
	width:8px;
	height:8px;
	background:#0b6971;
	opacity:0;
}

.checkout-section .payment-options .option-block .radio-block input[type="radio"]:checked+.radio-label:after{
	opacity:1;
}



.google-map-wrapper {
  position: relative;
  min-height: 550px;
}
.google-map-wrapper .over-map {
  z-index: 10;
  position: relative;
}

#home-google-map {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9;
}

/* CUSTOM*/
.tp-banner {
	padding: 70px 0 30px 0;
	text-align: center;
}
.tp-banner:after {
	width: 100%;
	content: "";
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	-webkit-filter: blur(3px) grayscale(90%);
	-moz-filter: blur(3px) grayscale(90%);
	-o-filter: blur(3px) grayscale(90%);
	-ms-filter: blur(3px) grayscale(90%);
	filter: blur(3px) grayscale(90%);
	background-image: url('../images/main-slider/2.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.tp-caption {
	margin: 30px auto;
}
.cover-image {
	position: relative;
	z-index: 1;
}
.cover-image img {
	max-width: 300px;
}
.language-flag {
	width: 20px;
}
.default-text-box p a {
 color: #0b6971!important;
}
.default-text-box p a.btn {
	color: #fff!important;
}
.iframe-responsive {
	width: 100%;
	max-width: 100%;
	height: 500px;
	box-shadow: 0px 0px 10px #0b6971;
	margin-bottom: 15px;
}
.social-links li {
	position: relative;
	display: inline-block;
	/* width: 44px; */
	/* height: 44px; */
	padding: 2px 10px;
	font-size: 14px;
	margin: 0px 3px 5px;
	line-height: 42px;
	border-radius: 5px;
	text-align: center;
	border: 1px solid #e1e1e1;
	color: #909090;
	transition: all 300ms ease;
	-webkit-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
}
.post-info li>span::before,
.social-links li>span::before {
	margin-right: 5px;
}
.one-article {
	padding-top: 0;
}
.one-article .featured-news-column .content{
	position:relative;
	padding:30px;
}
.one-article .featured-news-column h3 {
	font-size: 20px;
	margin-bottom: 15px;
}
.author-name-coma {
	position: relative;
	margin-right: 10px;
}
.author-name-coma:after {
	position: absolute;
	content: ",";
	font-size: inherit;
	bottom: -4px;
	right: -4px;
}
.author-name-coma:last-of-type {
	margin-right: 0;
}
.author-name-coma:last-of-type:after {
	content: none;
}
.how-to-cite {
	padding: 5px 7px;
	font-size: 12px;
	background: #fff;
}
.how-to-cite:hover {
	cursor: copy;
}
.margin-top-20>a>b,
.how-to-cite a {
	word-break: break-all;
}
.editorial-flex {
	display: flex;
	display: -ms-flex;
	display: -moz-flex;
	display: -o-flex;
	display: -webkit-flex;
	align-items: center;
	flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}
.editorial-flex h4 {
	margin: 5px 10px 5px 0;
}
.general-keywords {
	overflow: hidden;
}
.soft-hide {
	height: 50px;
	overflow: hidden;
	/*position: absolute;*/
	left: 0;
	right: 0;
	/*z-index: -1;*/
	/*visibility: hidden;*/
}
.btn-full {
	position: relative;
	/*bottom: -4px;*/
	width: 100%;
	margin: 10px 0 20px 0;
	text-align: center;
}
.btn-full .btn-link {
	color: #ffffff;
}
.btn-full:hover {
	cursor: pointer;
	text-decoration: none;
}
.btn-full:after {
	position: absolute;
	left: 0;
	bottom: 100%;
	width: 100%;
	height: 150px;
	content: "";
	background: -moz-linear-gradient(top, rgba(255,255,255,0.2) 0%, rgba(255,255,255,1) 85%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.6)), color-stop(85%,rgba(255,255,255,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,0.2) 0%,rgba(255,255,255,1) 85%);
	background: -ms-linear-gradient(top, rgba(255,255,255,0.2) 0%,rgba(255,255,255,1) 85%);
	background: linear-gradient(to bottom, rgba(255,255,255,0.2) 0%,rgba(255,255,255,1) 85%);
}
.btn-full.no-after:after {
	height: 0;
}
.social-links-one a:hover span svg path,
.social-links-one a:hover span svg circle,
.social-links a:hover span svg path,
.social-links a:hover span svg circle {
	fill: #ffffff;
}
.social-links-one a:hover span svg .st0,
.social-links a:hover span svg .st0 {
	fill: #0b6971;
}
.main-menu .navigation > li > ul > li.current {
	background: #0b6971;
}
.default-text-box ul,
.default-text-box ol {
	padding-left:30px ;
	margin-bottom: 20px;

}
.default-text-box ol li,
.default-text-box li ol li {
	list-style: inherit;
}
.default-text-box ul li,
.default-text-box li ul li {
	list-style: initial;
}

.share-options li{
	line-height:34px;
	margin-right:10px;
	float:left;
	margin-bottom: 15px;
}

.share-options li a{
	position:relative;
	display:inline-block;
	font-size:14px;
	width:34px;
	height:34px;
	line-height:32px;
	border:1px solid #e9e9e9;
	text-align:center;
	color:#999999;
	border-radius:5px;
	transition:all 0.5s ease;
	-moz-transition:all 0.5s ease;
	-webkit-transition:all 0.5s ease;
	-ms-transition:all 0.5s ease;
	-o-transition:all 0.5s ease;
}
.share-options li a:hover{
	color:#ffffff;
	background:#4db0d9;
}
.share-wrapper {
	margin-bottom: 25px;
}
.share-wrapper .icon{
	position: relative;
	background-color: #ffffff;
	border-radius: 5px;
	margin: 10px 15px 10px 0;;
	width: 30px;
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	display: inline-block;
	align-items: center;
	box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
	cursor: pointer;
	transition: all 0.2s cubic-bezier(0.68, -0.55, 0.265, 1.55);
	color: #999999;
	text-align: center;
	text-decoration: none;
}
.share-wrapper .icon.not-link {
	width: auto;
	padding: 0 10px;
}
.share-wrapper .icon.not-link:hover {
	cursor: context-menu;
}
.share-wrapper .tooltip {
	position: absolute;
	top: 0;
	line-height: 1.5;
	font-size: 14px;
	background-color: #ffffff;
	color: #ffffff;
	padding: 5px 8px;
	border-radius: 5px;
	box-shadow: 0 10px 10px rgba(0, 0, 0, 0.1);
	opacity: 0;
	pointer-events: none;
	transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.share-wrapper .tooltip::before {
	position: absolute;
	content: "";
	height: 8px;
	width: 8px;
	background-color: #ffffff;
	bottom: -3px;
	left: 50%;
	transform: translate(-50%) rotate(45deg);
	transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}
.share-wrapper .icon:hover .tooltip {
	top: -45px;
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.share-wrapper .icon:hover span,
.share-wrapper .icon:hover .tooltip {
	text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.1);
}
.share-wrapper .facebook:hover,
.share-wrapper .facebook:hover .tooltip,
.share-wrapper .facebook:hover .tooltip::before {
	background-color: #3b5999;
	color: #ffffff;
}
.share-wrapper .twitter:hover,
.share-wrapper .twitter:hover .tooltip,
.share-wrapper .twitter:hover .tooltip::before {
	background-color: #46c1f6;
	color: #ffffff;
}
.share-wrapper .linkedin:hover,
.share-wrapper .linkedin:hover .tooltip,
.share-wrapper .linkedin:hover .tooltip::before {
	background-color: #0077b5;
	color: #ffffff;
}
.share-wrapper .telegram:hover,
.share-wrapper .telegram:hover .tooltip,
.share-wrapper .telegram:hover .tooltip::before {
	background-color: #0088cc;
	color: #ffffff;
}
.share-wrapper .email:hover,
.share-wrapper .email:hover .tooltip,
.share-wrapper .email:hover .tooltip::before {
	background-color: #ffb607;
	color: #ffffff;
}
.share-wrapper .viber:hover,
.share-wrapper .viber:hover .tooltip,
.share-wrapper .viber:hover .tooltip::before {
	background-color: #7360f2;
	color: #ffffff;
}
.share-wrapper .whatsapp:hover,
.share-wrapper .whatsapp:hover .tooltip,
.share-wrapper .whatsapp:hover .tooltip::before {
	background-color: #25D366;
	color: #ffffff;
}
.requirements .table > thead > tr > th,
.requirements .table > tbody > tr > th,
.requirements .table > tfoot > tr > th,
.requirements .table > thead > tr > td,
.requirements .table > tbody > tr > td,
.requirements .table > tfoot > tr > td {
	padding: 12px;
	border: none;
	border-bottom: 1px solid #ddd;
}

input.file-caption-name.form-control.kv-fileinput-caption,
.input-group-btn.input-group-append button {
	height: 52px;
	z-index: 1;
}
.main-header .top-bar .search-box .form-group.field-searchform-type {
	display: none;
}
.product-details .styled-heading.margin-bott-20 h5 {
	font-weight: 700;
}
.author-block {
	padding: 20px;
	box-shadow:  0 1px 4px rgba(0, 0, 0, .3),
	-23px 0 20px -23px rgba(0, 0, 0, .6),
	23px 0 20px -23px rgba(0, 0, 0, .6),
	inset 0 0 40px rgba(0, 0, 0, .1);
	margin-bottom: 30px;
}
#authors-form label {
	font-size: 11px;
	line-height: 1;
}
#authors-form.form-control {
	font-size: 12px;
}
#authors-form .iti.iti--allow-dropdown {
	width: 100%;
}
#authors-form h3 {
	font-size: 20px;
}
#authors-form .styled-heading {
	margin-bottom: 10px;
	padding-bottom: 15px;
}
#authors-form .styled-heading:before {
	width: 70px;
	height: 4px;
}
#authors-form .styled-heading:after {
	font-size: 16px;
	left: 10px;
}
.attention-text {
	text-align: center;
	padding: 25px 15px;
	margin-bottom: 25px;
	font-weight: 500;
	box-shadow: 0 1px 4px rgba(248, 130, 169, .7), -23px 0 20px -23px rgba(248, 130, 169, .9), 23px 0 20px -23px rgba(248, 130, 169, .9), inset 0 0 40px rgba(248, 130, 169, .1);
}
#authors-form textarea {
	width: 100%;
	height: 80px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}
.iti__country-list {
	z-index: 3;
}
.attorney-single .info-column ul {
	padding-left: 25px;
}
.attorney-single .info-column li {
	list-style: initial;
}

.references-list ol {
	list-style-type: none; /* Убираем стандартные маркеры */
	padding: 0;
}

.references-list ol li {
	counter-increment: item; /* Увеличиваем счетчик */
	position: relative;
	padding-left: 37px; /* Отступ для текста */
}

.references-list ol li::before {
	content: "[" counter(item) "]"; /* Вставляем счетчик в формате [X] */
	position: absolute;
	left: 0;
	top: 0;
}

/* --- 🏛 SCAFFOLDING (Structure) --- */

/* Оболонка на всю висоту */
.acj-shell {
	display: flex;
	flex-direction: column;
	min-height: 100vh; /* Sticky Footer trick */
	background-color: var(--color-bg-body);
	width: 100%;
	position: relative;
	overflow: visible;
	overflow-x: clip; /* Захист від горизонтального скролу */
}

/* Обмежувач контенту (замість container) */
.acj-limit {
	width: 100%;
	max-width: var(--container-width); /* 1200px */
	margin: 0 auto;
	padding: 0 var(--space-sm);
	position: relative;
	z-index: 1;
}

/* --- 📰 JOURNAL SECTIONS --- */

/* MASTHEAD (Header) */
/* --- MASTHEAD (Header) ANIMATION --- */

/* 1. Головний Хедер - Фіксований */
/* --- DYNAMIC HEADER ANIMATION --- */

.acj-masthead {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;

	background-color: #ffffff;
	border-bottom: 1px solid var(--color-border);

	/* Анімація */
	transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
	box-shadow 0.3s ease;
	will-change: transform;

	/* Ініціалізуємо змінну нулем, щоб не було помилок, доки JS не завантажиться */
	--scroll-offset: 0px;
}

/* СТАН ПРИ СКРОЛЛІ */
.acj-masthead.is-scrolled {
	/* Використовуємо змінну, яку вирахує JS */
	/* Множимо на -1, щоб рухати вгору */
	transform: translateY(calc(var(--scroll-offset) * -1));

	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
	border-bottom-color: transparent;
}

/* 2. Верхня смужка (Utility Bar) */
.acj-utility-bar {
	background-color: var(--color-bg-light);
	border-bottom: 1px solid var(--color-border);
}

.acj-utility-content {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

/* 3. Основна смужка (Main Bar) */
.acj-main-bar {
	background-color: #ffffff;
	position: relative;
	z-index: 1001; /* Щоб перекривати верхню, якщо треба */
}

/* CANVAS (Main) */
.acj-canvas {
	flex: 1; /* Займає вільне місце */
	display: flex;
	flex-direction: column;
	padding: var(--space-md) 0;
}

/* --- HEADER: Utility Bar (Top Strip) --- */
.acj-utility-bar {
	background-color: var(--color-bg-light);
	border-bottom: 1px solid var(--color-border);
	padding: 15px 0;
	font-family: var(--font-family-body);
	font-size: var(--font-size-xs);
	color: var(--color-text-secondary);
	position: relative;
	z-index: 1002;
}


.acj-utility-content {
	display: flex;
	justify-content: space-between; /* Все притиснуто вправо */
	align-items: center;
	gap: var(--space-md);
}

.acj-issn .divider {
	margin: 0 4px;
	color: var(--color-accent);
}

/* --- HEADER: Main Bar --- */
.acj-main-content {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-sm) 0;
	min-height: 80px; /* Висота шапки */
}

/* Logo */
.acj-brand {
	flex-shrink: 0;
	margin-right: var(--space-md);
}

.acj-logo-link {
	font-family: var(--font-family-heading);
	font-weight: 700;
	font-size: var(--font-size-xl);
	color: var(--color-primary);
	text-decoration: none;
	text-transform: uppercase; /* Журнальний стиль */
	letter-spacing: 0.02em;
	line-height: 1;
}

/* Navigation (Desktop) */
.acj-nav {
	flex-grow: 1;
}

.acj-menu {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: var(--space-md);
	flex-wrap: wrap;
}

.acj-menu-item {
	position: relative; /* Для позиціонування дропдауна */
}

.acj-link {
	display: block;
	font-family: var(--font-family-body);
	font-size: var(--font-size-sm);
	font-weight: 600;
	color: var(--color-text-main);
	text-decoration: none;
	padding: 10px 0;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	transition: color 0.3s ease;
}

.acj-link:hover {
	color: var(--color-accent);
}

/* --- DROPDOWNS (Pure CSS) --- */
.acj-dropdown {
	position: absolute;
	top: 100%;
	left: 0;
	width: 240px;
	background: #ffffff;
	list-style: none;
	padding: var(--space-sm) 0;
	margin: 0;
	box-shadow: var(--shadow-soft);
	border-radius: var(--border-radius-sm);
	border-top: 2px solid var(--color-primary);

	/* Animation state */
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: all 0.3s ease;
	z-index: 100;
}

.acj-dropdown li a {
	display: block;
	padding: 8px 20px;
	font-family: var(--font-family-body);
	font-size: var(--font-size-sm);
	color: var(--color-text-secondary);
	text-decoration: none;
	transition: background 0.2s, color 0.2s;
}

.acj-dropdown li a:hover {
	background-color: var(--color-bg-light);
	color: var(--color-primary);
}

/* Show Dropdown on Hover */
.acj-menu-item:hover .acj-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* --- ACTIONS (Right side) --- */
.acj-actions {
	display: flex;
	align-items: center;
	gap: var(--space-sm);
}

.acj-btn-primary {
	display: inline-block;
	background-color: var(--color-accent); /* Акцентний колір для кнопки */
	color: #ffffff;
	padding: 10px 24px;
	border-radius: 50px; /* Pill shape */
	font-family: var(--font-family-body);
	font-size: var(--font-size-sm);
	font-weight: 600;
	text-decoration: none;
	transition: background 0.3s ease, transform 0.2s;
}

.acj-btn-primary:hover {
	background-color: var(--color-primary);
	transform: translateY(-1px);
	color: #fff;
}

/* Search widget fix (сховати дефолтні стилі форми, якщо вони криві) */
.acj-mini-search form {
	margin: 0;
	display: flex;
	align-items: center;
}
.acj-mini-search input {
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	padding: 6px 10px;
	font-size: 13px;
	outline: none;
}

/* Mobile Toggle (Placeholder) */
.acj-mobile-toggle {
	display: none; /* Показуємо тільки на мобільних */
	background: none;
	border: none;
	cursor: pointer;
	flex-direction: column;
	gap: 4px;
}
.acj-mobile-toggle span {
	display: block;
	width: 24px;
	height: 2px;
	background-color: var(--color-text-main);
}

/* --- RESPONSIVE (Simple check) --- */
@media (max-width: 992px) {
	.acj-nav { display: none; } /* Сховаємо меню на планшетах */
	.acj-mobile-toggle { display: flex; }
	.acj-mini-search { display: none; } /* Сховаємо пошук, щоб не заважав */
}

/* --- BUTTON TRIGGER --- */
.acj-search-trigger {
	background: none;
	border: none;
	cursor: pointer;
	color: var(--color-text-main);
	padding: 8px;
	transition: color 0.3s ease;
	display: flex;
	align-items: center;
	justify-content: center;
}

.acj-search-trigger:hover {
	color: var(--color-accent);
}

/* --- BACKDROP (Затемнення фону) --- */
.acj-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(26, 26, 26, 0.6); /* Темний напівпрозорий */
	z-index: 1000; /* Під панеллю пошуку, але над сайтом */

	/* Анімація появи */
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	backdrop-filter: blur(2px); /* Легке розмиття контенту під низом */
}

.acj-backdrop.is-active {
	opacity: 1;
	visibility: visible;
}

/* --- DRAWER (Панель пошуку) --- */
.acj-search-drawer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	z-index: 1001; /* Найвищий пріоритет */
	box-shadow: 0 10px 30px rgba(0,0,0,0.1);

	/* Анімація виїзду зверху */
	transform: translateY(-100%);
	transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1); /* Дуже плавна "дорога" анімація */
}

.acj-search-drawer.is-active {
	transform: translateY(0);
}

.acj-drawer-inner {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 30px 0; /* Висота панелі */
	gap: var(--space-md);
}

/* Label */
.acj-search-label {
	font-family: var(--font-family-heading);
	color: var(--color-primary);
	font-size: var(--font-size-lg);
	font-weight: 600;
	white-space: nowrap;
}

/* Close Button */
.acj-drawer-close {
	position: absolute;
	top: 0;
	right: 0;
	background: none;
	border: none;
	cursor: pointer;
	color: var(--color-text-secondary);
	padding: 8px;
	transition: color 0.3s, transform 0.3s;
	display: flex;
	align-items: center;
}

.acj-drawer-close:hover {
	color: var(--color-accent);
	transform: rotate(90deg);
}

/* --- FORM STYLING INSIDE DRAWER --- */
.acj-drawer-form-wrapper {
	flex-grow: 1;
	max-width: 800px;
}

/* Стилізація інпуту Yii */
.acj-drawer-form-wrapper form {
	margin: 0;
	position: relative;
}

.acj-drawer-form-wrapper input[type="text"],
.acj-drawer-form-wrapper input[type="search"] {
	width: 100%;
	background-color: var(--color-bg-light) !important;
	border: 1px solid transparent !important;
	border-radius: var(--border-radius-md) !important;
	padding: 12px 20px !important;
	font-family: var(--font-family-body) !important;
	font-size: var(--font-size-lg) !important; /* Крупний текст 18px */
	color: var(--color-text-main) !important;
	outline: none !important;
	transition: all 0.3s ease;
}

.acj-drawer-form-wrapper input:focus {
	background-color: #ffffff !important;
	border-color: var(--color-accent) !important;
	box-shadow: 0 0 0 3px rgba(77, 176, 217, 0.1);
}

/* Ховаємо кнопку сабміту, працює по Enter (або стилізуємо її, якщо треба) */
.acj-drawer-form-wrapper button[type="submit"] {
	display: none;
}

.form-group {
	margin: 0;
}

/* --- ERROR STATES (Validation) --- */

/* 1. Стилізація поля вводу при помилці */
.acj-drawer-form-wrapper .has-error input[type="text"],
.acj-drawer-form-wrapper .has-error input[type="search"] {
	border-color: var(--color-error) !important;
	background-color: rgba(176, 0, 32, 0.03) !important; /* Дуже легкий червоний тінт */
	color: var(--color-error) !important;

	/* Додаємо анімацію "трусіння" (Shake), щоб привернути увагу */
	animation: shake 0.4s cubic-bezier(.36,.07,.19,.97) both;
}

/* Прибираємо фокус-ефект акцентного кольору, якщо є помилка */
.acj-drawer-form-wrapper .has-error input:focus {
	box-shadow: 0 0 0 3px rgba(176, 0, 32, 0.1) !important;
	border-color: var(--color-error) !important;
}

/* 2. Стилізація тексту помилки (help-block) */
.acj-drawer-form-wrapper .help-block {
	display: block;
	margin-top: 8px;
	font-family: var(--font-family-body);
	font-size: var(--font-size-xs); /* Дрібний текст (12px) */
	font-weight: 600;
	color: var(--color-error);
	text-transform: uppercase; /* Стилістичний хід */
	letter-spacing: 0.05em;

	/* Анімація появи тексту */
	animation: fadeInUp 0.3s ease-out forwards;
}

/* --- ANIMATIONS --- */

/* Ефект "Ні" (струшування головою) */
@keyframes shake {
	10%, 90% { transform: translate3d(-1px, 0, 0); }
	20%, 80% { transform: translate3d(2px, 0, 0); }
	30%, 50%, 70% { transform: translate3d(-4px, 0, 0); }
	40%, 60% { transform: translate3d(4px, 0, 0); }
}

/* Ефект появи знизу */
@keyframes fadeInUp {
	from {
		opacity: 0;
		transform: translateY(-5px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* --- RADIO BUTTONS STYLING --- */

/* Контейнер для групи радіо-кнопок (Yii зазвичай дає йому ID, але ми знайдемо його по контексту) */
.acj-drawer-form-wrapper .form-group > div[id$="type"] {
	/* id$="type" означає "id, що закінчується на type", наприклад searchform-type */
	display: flex;
	justify-content: center; /* По центру під полем вводу */
	gap: var(--space-md);    /* Відступ між варіантами */
	margin-top: var(--space-sm);
	flex-wrap: wrap;
}

/* Самі лейбли (обгортки) */
.acj-drawer-form-wrapper label {
	display: flex;
	align-items: center;
	gap: 8px; /* Відстань від кружечка до тексту */
	cursor: pointer;
	font-family: var(--font-family-body);
	font-size: var(--font-size-xs); /* 12px */
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--color-text-secondary);
	transition: color 0.3s ease;
}

/* Ховер ефект на текст */
.acj-drawer-form-wrapper label:hover {
	color: var(--color-primary);
}

/* --- CUSTOM RADIO INPUT --- */
.acj-drawer-form-wrapper input[type="radio"] {
	/* Скидаємо стандартний вигляд браузера */
	-webkit-appearance: none;
	appearance: none;

	/* Малюємо власний кружечок */
	width: 16px;
	height: 16px;
	border: 1px solid var(--color-border); /* Сірий обідок */
	border-radius: 50%;
	outline: none;
	position: relative;
	cursor: pointer;
	background-color: transparent;
	transition: all 0.3s ease;
	margin: 0; /* Прибираємо дефолтні марджини */
}

/* Стан: Активний (Checked) - Кружечок */
.acj-drawer-form-wrapper input[type="radio"]:checked {
	border-color: var(--color-accent); /* Акцентний колір обідка */
}

/* Стан: Активний (Checked) - Крапка всередині */
.acj-drawer-form-wrapper input[type="radio"]:checked::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 8px;
	height: 8px;
	background-color: var(--color-accent); /* Акцентна крапка */
	border-radius: 50%;
	animation: popIn 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Якщо радіо вибрано, підсвічуємо і текст поруч (Modern CSS :has) */
/* Підтримка для сучасних браузерів */
.acj-drawer-form-wrapper label:has(input:checked) {
	color: var(--color-text-main);
	font-weight: 600;
}

/* Анімація появи крапки */
@keyframes popIn {
	from { width: 0; height: 0; opacity: 0; }
	to { width: 8px; height: 8px; opacity: 1; }
}

/* --- LANGUAGE WIDGET --- */

.acj-lang-widget {
	position: relative; /* Щоб дропдаун позиціонувався відносно цього блоку */
	display: inline-block;
	font-family: var(--font-family-body);
}

/* Кнопка (видима частина) */
.acj-lang-toggle {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 6px; /* Відстань між текстом і стрілкою */

	color: var(--color-text-secondary);
	font-size: var(--font-size-xs); /* 12px */
	font-weight: 600;
	text-transform: uppercase; /* Тільки великі літери (EN / UA) */
	letter-spacing: 0.05em;
	transition: color 0.3s ease;
}

/* Ховер на кнопку */
.acj-lang-widget.is-active .acj-lang-dropdown {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Стрілочка (SVG) */
.acj-chevron {
	transition: transform 0.3s ease;
	opacity: 0.7;
}

/* Обертання стрілочки при кліку на віджет */
.acj-lang-widget.is-active .acj-chevron {
	transform: rotate(180deg);
	opacity: 1;
}

.acj-lang-widget.is-active .acj-lang-toggle {
	color: var(--color-primary);
}

/* --- DROPDOWN LIST --- */

.acj-lang-dropdown {
	position: absolute;
	top: 100%;
	right: 0; /* Вирівнювання по правому краю */
	background-color: #ffffff;

	list-style: none;
	margin: 8px 0 0 0; /* Відступ зверху */
	padding: 8px 0;

	border-radius: var(--border-radius-sm);
	box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Легка тінь */
	border: 1px solid var(--color-border);

	/* Анімація появи */
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
	z-index: 2000;
}

/* Елементи списку */
.acj-lang-dropdown li {
	display: block;
}

/* Посилання в списку */
.acj-lang-link {
	display: block;
	padding: 8px 16px;

	font-size: var(--font-size-xs);
	color: var(--color-text-secondary);
	text-decoration: none;
	text-transform: uppercase;
	text-align: right; /* Текст праворуч */
	transition: background 0.2s, color 0.2s;
}

/* Ховер на пункти списку */
.acj-lang-link:hover {
	background-color: var(--color-bg-light);
	color: var(--color-primary);
}

/* Додатковий трикутничок зверху дропдауна (опціонально, додає шарму) */
.acj-lang-dropdown::before {
	content: '';
	position: absolute;
	top: -5px;
	right: 10px;
	width: 10px;
	height: 10px;
	background: #ffffff;
	border-top: 1px solid var(--color-border);
	border-left: 1px solid var(--color-border);
	transform: rotate(45deg);
}

.acj-utility-meta {
	display: flex;
	gap: 10px;
}

/* --- FOOTER (COLOPHON) STYLES --- */

/* Перевизначаємо/доповнюємо базовий клас з лейауту */
.acj-colophon {
	background-color: var(--color-primary); /* Глибокий морський */
	color: #ffffff;
	padding-top: var(--space-xl);
	padding-bottom: var(--space-lg);
	font-family: var(--font-family-body);
}

/* Сітка для колонок */
.acj-footer-grid {
	display: grid;
	/* 1 колонка велика (для бренду), 3 рівні (для лінків) */
	grid-template-columns: 1.5fr 1fr 1fr 1fr;
	gap: var(--space-lg);
	margin-bottom: var(--space-xl);
}

/* --- BRAND COLUMN --- */
.acj-footer-logo {
	font-family: var(--font-family-heading); /* Lora */
	font-size: var(--font-size-xl);
	font-weight: 400; /* Lora красива і в звичайній вазі */
	margin-top: 0;
	margin-bottom: var(--space-md);
	color: #ffffff;
	line-height: 1.1;
}

.acj-footer-address {
	font-style: normal;
	color: rgba(255, 255, 255, 0.6); /* Напівпрозорий білий */
	font-size: var(--font-size-sm);
	line-height: 1.6;
	margin-bottom: var(--space-md);
}

.acj-footer-address p {
	margin: 0;
}

.acj-footer-email a {
	color: var(--color-accent); /* Небесний колір для пошти */
	text-decoration: none;
	font-weight: 600;
	font-size: var(--font-size-sm);
	transition: color 0.3s ease;
}

.acj-footer-email a:hover {
	color: #ffffff;
	text-decoration: underline;
}

/* --- LINKS COLUMNS --- */
.acj-footer-heading {
	font-family: var(--font-family-body); /* Сан-сериф для заголовків груп */
	font-size: var(--font-size-xs);      /* Дрібний текст */
	text-transform: uppercase;           /* Верхній регістр */
	letter-spacing: 0.1em;               /* Розрядка */
	font-weight: 700;
	color: rgba(255, 255, 255, 0.4);     /* Дуже тьмяний колір (стильно) */
	margin-bottom: var(--space-md);
	margin-top: 0;
}

.acj-footer-links {
	list-style: none;
	padding: 0;
	margin: 0;
}

.acj-footer-links li {
	margin-bottom: 12px;
}

.acj-footer-links a {
	color: rgba(255, 255, 255, 0.8);
	text-decoration: none;
	font-size: var(--font-size-sm);
	transition: all 0.3s ease;
	display: inline-block;
}

.acj-footer-links a:hover {
	color: #ffffff; /* Повний білий при наведенні */
	transform: translateX(5px); /* Легкий зсув вправо */
}

/* --- COPYRIGHT --- */
.acj-copyright {
	border-top: 1px solid rgba(255, 255, 255, 0.1); /* Дуже тонка лінія */
	padding-top: var(--space-md);
	text-align: center; /* Або left, як більше подобається */
	color: rgba(255, 255, 255, 0.4);
	font-size: var(--font-size-xs);
}

.acj-copyright p {
	margin: 0;
}

/* --- RESPONSIVE (Mobile) --- */
@media (max-width: 992px) {
	.acj-footer-grid {
		/* На планшетах - 2 колонки */
		grid-template-columns: 1fr 1fr;
	}

	.brand-col {
		grid-column: span 2; /* Бренд займає всю ширину */
		margin-bottom: var(--space-sm);
	}
}

@media (max-width: 576px) {
	.acj-footer-grid {
		/* На мобільних - 1 колонка */
		grid-template-columns: 1fr;
		gap: var(--space-md);
		text-align: center; /* Центруємо на мобільному */
	}

	.brand-col {
		grid-column: span 1;
	}
}

/* --- BACK TO TOP BUTTON --- */

.acj-back-to-top {
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 990; /* Трохи нижче за модальні вікна/хедер (1000+) */

	width: 50px;
	height: 50px;
	border-radius: 50%; /* Ідеальне коло */

	background-color: var(--color-accent); /* Небесний колір */
	color: #ffffff;
	border: none;
	cursor: pointer;

	display: flex;
	align-items: center;
	justify-content: center;

	box-shadow: 0 4px 15px rgba(77, 176, 217, 0.4); /* Кольорова тінь */

	/* Стан "Сховано" */
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px); /* Трохи опущена вниз */
	transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/* Ховер ефект */
.acj-back-to-top:hover {
	background-color: var(--color-primary); /* Темніє при наведенні */
	transform: translateY(-5px); /* Легкий "підйом" */
	box-shadow: 0 8px 25px rgba(11, 105, 113, 0.3);
}

/* Стан "Видимо" (додається через JS) */
.acj-back-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* --- HERO SECTION --- */
.acj-hero {
	background-color: var(--color-bg-light); /* Світло-сірий фон */
	padding: var(--space-xl) 0;
	overflow: hidden;
	position: relative;
}

.acj-hero-content {
	display: grid;
	grid-template-columns: 1fr 1fr; /* Дві рівні колонки */
	align-items: center;
	gap: var(--space-lg);
}

/* Text Side */
.acj-label-tag {
	display: inline-block;
	font-family: var(--font-family-body);
	font-size: var(--font-size-xs);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-accent);
	margin-bottom: var(--space-sm);
	font-weight: 700;
}

.acj-hero-title {
	font-family: var(--font-family-heading); /* Lora */
	font-size: var(--font-size-3xl); /* Великий заголовок */
	color: var(--color-primary);
	margin-top: 0;
	margin-bottom: var(--space-md);
	max-width: 90%;
}

.acj-btn-outline {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 30px;
	border: 1px solid var(--color-primary);
	color: var(--color-primary);
	text-decoration: none;
	font-family: var(--font-family-body);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	font-size: var(--font-size-sm);
	transition: all 0.3s ease;
}

.acj-btn-outline:hover {
	background-color: var(--color-primary);
	color: #ffffff;
}

.acj-cover-card {
	position: relative;
	display: block;
	width: 300px; /* Фіксована ширина обкладинки */
	transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.acj-cover-image-wrapper {
	position: relative;
	z-index: 2;
	border-radius: 2px;
	overflow: hidden;
	box-shadow: 0 15px 35px rgba(0,0,0,0.15); /* Тінь "польоту" */
}

.acj-cover-image-wrapper img {
	display: block;
	width: 100%;
	height: auto;
}

/* Ефект наведення: обкладинка "підлітає" */
.acj-cover-card:hover {
	transform: translateY(-10px) rotateY(-5deg);
}

/* --- EDITORIAL SECTION (Text) --- */
.acj-section {
	padding: var(--space-xl) 0;
}

.acj-section-header {
	text-align: center;
	margin-bottom: var(--space-lg);
}

.acj-section-title {
	font-size: var(--font-size-2xl);
	color: var(--color-text-main);
}

.acj-divider {
	width: 60px;
	height: 3px;
	background-color: var(--color-accent);
	margin: var(--space-sm) auto 0;
}

/* Типографіка тексту */
.acj-text-body {
	max-width: 800px; /* Вузька колонка для читабельності */
	margin: 0 auto;
	font-size: 1.1rem; /* Трохи більший шрифт */
	color: #333;
	text-align: justify; /* Журнальна виключка */
}

/* Перша літера тексту (Буквиця) - опціонально */
.acj-text-body p:first-of-type::first-letter {
	font-family: var(--font-family-heading);
	font-size: 3.5rem;
	float: left;
	line-height: 0.8;
	margin-right: 10px;
	color: var(--color-primary);
}

/* --- INDEXING SECTION --- */
.acj-indexing {
	border-top: 1px solid var(--color-border);
	padding-bottom: var(--space-xl);
}

.acj-indexing-header {
	display: flex;
	align-items: center;
	gap: var(--space-md);
	margin-bottom: var(--space-md);
	opacity: 0.6;
}

.acj-small-title {
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 0.1em;
	margin: 0;
	white-space: nowrap;
}

.acj-line-grow {
	height: 1px;
	background-color: var(--color-border);
	width: 100%;
}

/* Grid для логотипів */
.acj-logo-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center; /* Центруємо лого */
	gap: 40px;
	align-items: center;
}

.acj-logo-item {
	display: block;
	opacity: 0.5; /* Напівпрозорі */
	filter: grayscale(100%); /* Чорно-білі */
	transition: all 0.3s ease;
	max-width: 150px; /* Обмеження ширини */
}

.acj-logo-item img {
	max-width: 100%;
	height: auto;
	max-height: 60px; /* Однакової висоти */
	object-fit: contain;
}

.acj-logo-item:hover {
	opacity: 1;
	filter: grayscale(0%); /* Колір при наведенні */
	transform: scale(1.05);
}

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
	.acj-hero-content {
		grid-template-columns: 1fr; /* Одна колонка */
		text-align: center;
		gap: var(--space-md);
	}

	.acj-hero-content {
		/* Змінюємо порядок: спочатку обкладинка, потім текст */
		display: flex;
		flex-direction: column-reverse;
	}

	.acj-cover-card {
		margin: 0 auto;
		width: 220px;
	}

	.acj-hero-title {
		font-size: var(--font-size-xl);
	}

	.acj-logo-grid {
		gap: 20px;
	}

	.acj-logo-item {
		max-width: 100px;
	}
}

/* --- 1. HERO CARD (Всередині контейнера) --- */
.acj-hero-card {
	border-radius: var(--border-radius-md); /* Заокруглені кути */
	padding: var(--space-lg) 0; /* Внутрішні відступи */

	display: grid;
	grid-template-columns: 1.2fr 0.8fr; /* Тексту більше місця */
	align-items: center;
	gap: var(--space-lg);
}

.acj-label-tag {
	display: inline-block;
	font-size: var(--font-size-xs);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--color-accent);
	margin-bottom: var(--space-sm);
	letter-spacing: 1px;
}

.acj-hero-title {
	font-family: var(--font-family-heading);
	font-size: 2.5rem; /* Великий, але не гігантський */
	color: var(--color-primary);
	line-height: 1.2;
	margin-top: 0;
	margin-bottom: var(--space-md);
}

.acj-btn-outline {
	display: inline-block;
	padding: 10px 24px;
	border: 1px solid var(--color-primary);
	border-radius: 50px; /* Пігулка */
	color: var(--color-primary);
	text-decoration: none;
	font-weight: 600;
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	transition: all 0.3s ease;
}

.acj-btn-outline:hover {
	background-color: var(--color-primary);
	color: #ffffff;
}

/* Візуальна частина (Обкладинка) */
.acj-hero-visual {
	display: flex;
	justify-content: flex-end;
	position: relative;
}

.acj-cover-link {
	display: block;
	position: relative;
	width: 260px; /* Фіксуємо ширину обкладинки */
	transform-style: preserve-3d;
	transition: transform 0.4s ease;
}

.acj-cover-wrapper {
	position: relative;
	z-index: 2;
	border-radius: 4px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0,0,0,0.15); /* Тінь */
}

.acj-cover-wrapper img {
	display: block;
	width: 100%;
	height: auto;
}

/* Ефект наведення */
.acj-cover-link:hover {
	transform: translateY(-5px) rotateY(-5deg);
}

/* --- 2. EDITORIAL BLOCK --- */
.acj-editorial-block {
	margin-bottom: var(--space-xl);
	text-align: center;
}

.acj-header-center {
	margin-bottom: var(--space-md);
}

.acj-heading-title {
	font-family: var(--font-family-heading);
	font-size: var(--font-size-2xl);
	color: var(--color-text-main);
	margin: 0;
	text-align: center;
}

.acj-divider-center {
	width: 50px;
	height: 3px;
	background-color: var(--color-accent);
	margin: 10px auto 0;
}

.acj-text-content {
	font-size: 1.1rem;
	line-height: 1.8;
	color: #444;
	text-align: justify;
}

/* --- 3. INDEXING BLOCK --- */
.acj-indexing-block {
	padding-top: var(--space-lg);
	border-top: 1px solid var(--color-border);
}

.acj-indexing-label {
	display: flex;
	align-items: center;
	gap: 15px;
	margin-bottom: var(--space-md);
	color: var(--color-text-secondary);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 700;
}

.acj-line-decor {
	flex-grow: 1;
	height: 1px;
	background-color: var(--color-border);
}

.acj-partners-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	justify-content: center; /* Центр */
	align-items: center;
}

.acj-partner-item {
	opacity: 0.6;
	filter: grayscale(100%);
	transition: all 0.3s ease;
}

.acj-partner-item:hover {
	opacity: 1;
	filter: grayscale(0%);
	transform: scale(1.05);
}

.acj-partner-item img {
	max-height: 50px; /* Обмеження висоти лого */
	width: auto;
}

/* --- RESPONSIVE --- */
@media (max-width: 768px) {
	.acj-hero-card {
		grid-template-columns: 1fr; /* Одна колонка */
		text-align: center;
		padding: var(--space-md);
	}

	.acj-hero-content {
		/* Змінюємо порядок: Картинка перша, потім текст */
		display: flex;
		flex-direction: column-reverse;
	}

	.acj-hero-text {
		padding-left: 0;
	}

	.acj-cover-link {
		margin: 0 auto 20px; /* Центруємо картинку */
		width: 200px;
	}

	.acj-hero-title {
		font-size: 1.8rem;
	}
}

/* --- ARCHIVE PAGE LAYOUT --- */
.acj-archive-page {
	padding-bottom: var(--space-xl);
}

.acj-archive-container {
	margin-top: var(--space-lg);
}

/* --- YEAR SECTION (Timeline style) --- */
.acj-year-group {
	margin-bottom: var(--space-xl); /* Відступ між роками */
}

.acj-year-header {
	display: flex;
	align-items: center;
	gap: var(--space-md);
	margin-bottom: var(--space-md);
}

.acj-year-number {
	font-family: var(--font-family-heading); /* Lora */
	font-size: 2.5rem; /* Великий рік */
	font-weight: 700;
	color: var(--color-primary); /* Акцентний рік */
	opacity: 0.2; /* Напівпрозорий для стилю */
	margin: 0;
	line-height: 1;
}

.acj-year-line {
	flex-grow: 1;
	height: 1px;
	background: linear-gradient(to right, var(--color-border), transparent);
}

/* --- ISSUES GRID (CSS Grid замість Bootstrap) --- */
.acj-issues-grid {
	display: grid;
	/* Адаптивна сітка: мінімум 240px ширина картки, інакше перенос */
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 40px; /* Повітря між журналами */
	row-gap: 50px;
}

/* --- ISSUE CARD --- */
.acj-issue-card {
	position: relative;
	perspective: 1000px; /* Для 3D ефектів */
}

.acj-issue-link {
	text-decoration: none;
	display: block;
	group: issue-hover; /* Іменуємо групу для ховера */
}

/* Обкладинка */
.acj-issue-cover-wrapper {
	position: relative;
	border-radius: 2px;
	overflow: hidden;
	background-color: #f0f0f0; /* Плейсхолдер */
	box-shadow: 0 10px 20px rgba(0,0,0,0.1); /* Тінь */
	transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
	aspect-ratio: 3 / 4.2; /* Фіксуємо пропорції журналу (A4-ish) */
}

.acj-issue-cover-wrapper img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform 0.5s ease;
}

/* Ефекти при наведенні на КАРТКУ */
.acj-issue-card:hover .acj-issue-cover-wrapper {
	transform: translateY(-8px); /* Піднімається вгору */
	box-shadow: 0 20px 40px rgba(11, 105, 113, 0.2); /* Кольорова глибока тінь */
}

.acj-issue-card:hover img {
	transform: scale(1.05); /* Легкий зум картинки */
}

/* Оверлей (Кнопка) */
.acj-issue-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(11, 105, 113, 0.7); /* Напівпрозорий бренд колір */
	display: flex;
	align-items: center;
	justify-content: center;

	opacity: 0; /* Сховано */
	transition: opacity 0.3s ease;
}

.acj-issue-card:hover .acj-issue-overlay {
	opacity: 1; /* Показати */
}

.acj-view-btn {
	color: #ffffff;
	font-family: var(--font-family-body);
	font-size: var(--font-size-sm);
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: 600;
	border: 1px solid rgba(255,255,255,0.5);
	padding: 10px 20px;
	border-radius: 30px;
	background: rgba(255,255,255,0.1);
	backdrop-filter: blur(4px);
	transform: translateY(10px);
	transition: transform 0.3s ease;
}

.acj-issue-card:hover .acj-view-btn {
	transform: translateY(0);
}

/* --- INFO & META --- */
.acj-issue-info {
	margin-top: 15px;
	text-align: center;
}

.acj-issue-title {
	font-family: var(--font-family-heading);
	font-size: 1.1rem;
	color: var(--color-text-main);
	margin: 0 0 8px 0;
	line-height: 1.3;
	transition: color 0.3s ease;
}

.acj-issue-card:hover .acj-issue-title {
	color: var(--color-primary);
}

.acj-issue-meta {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
	font-family: var(--font-family-body);
	font-size: 0.8rem; /* Дуже дрібний, акуратний текст */
	color: var(--color-text-secondary);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* Іконки через CSS (щоб не вантажити FontAwesome зайвий раз, або стилізація поточних) */
.acj-icon-file::before { content: '📄'; margin-right: 4px; opacity: 0.7; }
.acj-icon-users::before { content: '👥'; margin-right: 4px; opacity: 0.7; }

.acj-meta-item {
	display: flex;
	align-items: center;
}

.acj-meta-dot {
	color: var(--color-border);
}

/* --- ISSUE PAGE LAYOUT (GRID) --- */
.acj-issue-layout {
	display: grid;
	/* Ліва колонка 350px, права - все інше */
	grid-template-columns: 350px 1fr;
	gap: 60px; /* Великий відступ між колонками */
	padding-bottom: var(--space-xl);
}

/* --- 1. SIDEBAR STYLES --- */
.acj-issue-sidebar {
	height: 100%;
	position: relative;
}

/* Липкий контейнер */
.acj-sidebar-sticky {
	background-color: var(--color-bg-light);
	padding: 30px;
	border-radius: var(--border-radius-md);
}

/* Обкладинка */
.acj-pdf-wrapper {
	background: #fff;
	border: 1px solid var(--color-border);
	margin-bottom: 20px;
	height: 400px; /* Фіксована висота для прев'ю */
	overflow: hidden;
	position: relative;
}

.acj-pdf-frame {
	width: 100%;
	height: 100%;
	border: none;
}

/* Кнопка скачування */
.acj-btn-primary.full-width {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	width: 100%;
	background-color: var(--color-primary);
	color: #fff;
	padding: 12px;
	border-radius: var(--border-radius-sm);
	text-decoration: none;
	font-weight: 600;
	text-transform: uppercase;
	font-size: var(--font-size-sm);
	transition: background 0.3s;
}

.acj-btn-primary:hover {
	background-color: var(--color-accent);
}

/* Інфо випуску */
.acj-issue-title {
	font-family: var(--font-family-heading);
	font-size: 1.5rem;
	margin: 20px 0 10px;
	color: var(--color-text-main);
	line-height: 1.2;
}

.acj-issue-date, .acj-issue-doi {
	font-size: var(--font-size-sm);
	color: var(--color-text-secondary);
	margin-bottom: 5px;
}

.acj-issue-desc {
	margin-top: 15px;
	font-size: 0.95rem;
	line-height: 1.5;
	color: #555;
	border-top: 1px solid var(--color-border);
	padding-top: 15px;
}

/* Статистика (рядком) */
.acj-stats-list {
	display: flex;
	gap: 20px;
	list-style: none;
	padding: 0;
	margin: 20px 0;
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 20px;
}

.acj-stat-value {
	display: block;
	font-size: 1.2rem;
	font-weight: 700;
	color: var(--color-primary);
}

.acj-stat-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
}

/* Share Icons */
.acj-share-block {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.acj-share-label {
	font-size: var(--font-size-xs);
	font-weight: 700;
	text-transform: uppercase;
}

.acj-social-icons {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.acj-social-icons a {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background-color: #fff;
	border: 1px solid var(--color-border);
	color: var(--color-text-secondary);
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s;
}

.acj-social-icons a:hover {
	background-color: var(--color-primary);
	color: #fff;
	border-color: var(--color-primary);
}


/* --- 2. ARTICLE FEED STYLES --- */

.acj-feed-header {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-bottom: 40px;
}

.acj-feed-title {
	font-family: var(--font-family-heading);
	font-size: 1.8rem;
	color: var(--color-text-main);
	margin: 0;
	white-space: nowrap;
}

.acj-feed-line {
	width: 100%;
	height: 1px;
	background-color: var(--color-border);
}

/* Картка статті */
.acj-article-item {
	background-color: #fff;
	margin-bottom: 40px;
	padding-bottom: 40px;
	border-bottom: 1px solid var(--color-border); /* Журнальний стиль */
}

/* Верхній рядок */
.acj-article-top {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
	font-size: var(--font-size-xs);
}

.acj-access-badge {
	color: #e67e22; /* Золотистий для Open Access */
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

.acj-article-date {
	color: var(--color-text-secondary);
}

/* Заголовок статті */
.acj-article-title {
	font-family: var(--font-family-heading);
	font-size: 1.4rem;
	line-height: 1.3;
	margin: 0 0 10px 0;
}

.acj-article-title a {
	color: var(--color-text-main);
	text-decoration: none;
	transition: color 0.3s;
}

.acj-article-title a:hover {
	color: var(--color-accent);
}

/* Автори */
.acj-article-authors {
	font-family: var(--font-family-body);
	font-size: 0.95rem;
	color: var(--color-text-main);
	margin-bottom: 15px;
}

.acj-author-link {
	color: var(--color-text-main);
	text-decoration: none;
	font-weight: 500;
}

.acj-author-link:hover {
	text-decoration: underline;
}

/* Keywords */
.acj-article-keywords {
	font-size: 0.85rem;
	color: var(--color-text-secondary);
	margin-bottom: 15px;
}

.acj-article-keywords i {
	margin-right: 5px;
	opacity: 0.5;
}

/* DOI */
.acj-article-doi a {
	color: var(--color-accent);
	font-size: 0.9rem;
	font-weight: 600;
	text-decoration: none;
}

/* Блок цитування */
.acj-citation-box {
	background-color: var(--color-bg-light);
	padding: 15px;
	border-radius: var(--border-radius-sm);
	margin: 20px 0;
	font-size: 0.85rem;
	color: #555;
}

.acj-citation-label {
	display: block;
	font-weight: 700;
	margin-bottom: 5px;
	text-transform: uppercase;
	font-size: 0.7rem;
	color: var(--color-text-secondary);
}

/* Footer картки */
.acj-article-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
}

.acj-btn-text {
	color: var(--color-primary);
	font-weight: 700;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 0.85rem;
	letter-spacing: 0.05em;
	transition: color 0.3s;
}

.acj-btn-text:hover {
	color: var(--color-accent);
	margin-left: 5px; /* Ефект руху */
}

.acj-article-stats {
	color: var(--color-text-secondary);
	font-size: 0.9rem;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-issue-layout {
		grid-template-columns: 1fr; /* Одна колонка на планшетах/мобільних */
		gap: 40px;
	}

	.acj-sidebar-sticky {
		position: static; /* Сайдбар перестає бути липким, стає звичайним блоком зверху */
	}
}

/* --- CITATION CARD (SNIPPET STYLE) --- */

.acj-cite-card {
	position: relative;
	background-color: #f8f9fa; /* Дуже світлий сірий */
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	padding: 0; /* Паддінги задаємо внутрішнім елементам */
	margin-top: 20px;
	cursor: pointer;
	overflow: hidden; /* Щоб ефекти не вилазили */

	display: flex;
	align-items: stretch; /* Розтягуємо елементи на всю висоту */
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

/* Ефект наведення на всю картку */
.acj-cite-card:hover {
	border-color: var(--color-primary);
	box-shadow: 0 8px 20px rgba(0,0,0,0.06);
	transform: translateY(-2px);
}

/* Декоративна лінія зліва */
.acj-cite-line {
	width: 4px;
	background-color: var(--color-border);
	transition: background-color 0.3s ease;
}

.acj-cite-card:hover .acj-cite-line {
	background-color: var(--color-primary);
}

/* Тіло картки */
.acj-cite-body {
	flex-grow: 1;
	padding: 16px 20px;
}

/* Лейбл зверху (дрібний текст) */
.acj-cite-label {
	font-family: var(--font-family-body);
	font-size: 0.7rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	letter-spacing: 0.1em;
	margin-bottom: 8px;
	opacity: 0.6;
}

/* Сам текст цитати */
.acj-cite-content {
	font-family: 'Consolas', 'Monaco', 'Courier New', monospace; /* Кодинговий шрифт */
	font-size: 0.7rem;
	line-height: 1.6;
	color: var(--color-text-main);
}

/* Стилізація частин цитати */
.acj-cite-journal {
	font-style: italic;
	font-weight: 600;
	color: var(--color-primary);
}

.acj-cite-doi {
	color: var(--color-accent);
	text-decoration: underline;
	word-break: break-all;
}

/* Права колонка з кнопкою */
.acj-cite-action {
	background-color: #ffffff;
	border-left: 1px solid var(--color-border);
	padding: 0 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 6px;
	color: var(--color-text-secondary);
	transition: all 0.3s ease;
	min-width: 80px;
}

.acj-cite-card:hover .acj-cite-action {
	background-color: var(--color-bg-light);
	color: var(--color-primary);
}

.acj-action-icon {
	font-size: 1.2rem;
}

.acj-action-text {
	font-size: 0.65rem;
	font-weight: 800;
	letter-spacing: 0.05em;
}

/* --- SUCCESS STATE (COPIED) --- */
/* Клас, який додає JS */
.acj-cite-card.is-copied .acj-cite-success {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* --- ARTICLE PAGE WRAPPER --- */
.acj-article-page {
	background-color: #fff;
	padding-bottom: var(--space-xl);
}

/* --- HERO HEADER --- */
.acj-article-header {
	padding: 80px 0 60px;
	text-align: justify;
	border-bottom: 1px solid var(--color-border);
}

.acj-article-context {
	font-size: var(--font-size-xs);
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: 20px;
	letter-spacing: 1px;
}

.acj-context-link {
	color: var(--color-primary);
	text-decoration: none;
	font-weight: 700;
}

.acj-article-title {
	font-family: var(--font-family-heading); /* Lora */
	font-size: 1.5rem; /* Дуже великий заголовок */
	line-height: 1.2;
	color: var(--color-text-main);
	margin-bottom: 30px;
}

.acj-article-title.article-page {
	font-size: 3rem;
}

/* Authors Chips */
.acj-article-authors-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin-bottom: 40px;
}

.acj-author-chip {
	display: inline-block;
	padding: 8px 16px;
	border: 1px solid var(--color-border);
	border-radius: 50px;
	background: #fff;
	color: var(--color-text-main);
	text-decoration: none;
	font-size: 0.9rem;
	font-weight: 500;
	transition: all 0.3s ease;
}

.acj-author-chip:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
	transform: translateY(-2px);
}

/* Timeline */
.acj-article-timeline {
	display: flex;
	justify-content: center;
	gap: 30px;
	border-top: 1px solid rgba(0,0,0,0.05);
	padding-top: 20px;
	max-width: 600px;
	margin: 0 auto;
}

.acj-timeline-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	font-size: 0.8rem;
	color: var(--color-text-secondary);
}

.acj-timeline-item.highlight {
	color: var(--color-primary);
}

.acj-timeline-item .label {
	text-transform: uppercase;
	font-size: 0.7rem;
	margin-bottom: 4px;
	opacity: 0.7;
	color: var(--color-accent);
}

.acj-keywords-list .keywords-label {
	color: var(--color-accent);
	font-weight: 600;
}

.acj-timeline-item .date {
	font-weight: 700;
}

/* --- LAYOUT GRID --- */
.acj-article-body {
	max-width: 1200px; /* Загальний контейнер */
	margin: 0 auto;
	padding: 0 var(--space-md);
}

.acj-article-grid {
	display: grid;
	grid-template-columns: 320px 1fr;
	gap: 80px;
	margin-top: 60px;
}

/* --- SIDEBAR --- */
.acj-article-sidebar {
	position: relative;
}

.acj-sidebar-inner {
	position: sticky;
	top: 120px;
}

/* Media Card (PDF) */
.acj-media-card {
	margin-bottom: 30px;
}

.acj-media-preview {
	position: relative;
	height: 200px; /* Невелика висота для прев'ю */
	border: 1px solid var(--color-border);
	background: #f0f0f0;
	border-radius: var(--border-radius-sm);
	overflow: hidden;
	margin-bottom: 10px;
}

.acj-mini-frame {
	width: 100%;
	height: 100%;
	border: none;
	pointer-events: none; /* Забороняємо взаємодію з iframe тут */
	opacity: 0.6;
}

.acj-read-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(11, 105, 113, 0.2);
	display: flex;
	align-items: center;
	justify-content: center;
	text-decoration: none;
	opacity: 0;
	transition: opacity 0.3s;
}

.acj-read-overlay span {
	background: #fff;
	padding: 8px 16px;
	border-radius: 4px;
	font-weight: 700;
	color: var(--color-primary);
	font-size: 0.8rem;
	box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.acj-media-preview:hover .acj-read-overlay {
	opacity: 1;
}

.acj-sidebar-block {
	margin-bottom: 30px;
}

.acj-block-label {
	display: block;
	font-size: 0.75rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: 8px;
	font-weight: 700;
}

.acj-doi-link {
	word-break: break-all;
	color: var(--color-text-main);
	text-decoration: underline;
}

/* Share Icons Grid */
.acj-share-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 8px;
}

.share-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	border-radius: 4px;
	background: #f4f6f7;
	color: #555;
	transition: all 0.3s;
}

.share-btn:hover {
	background: var(--color-primary);
	color: #fff;
}

/* --- MAIN CONTENT --- */
.acj-article-content {
	min-width: 0; /* Fix for grid overflow */
}

.acj-content-section {
	margin-bottom: 60px;
	scroll-margin-top: 120px; /* Відступ для sticky header при скролі */
}

.acj-section-heading {
	font-family: var(--font-family-body);
	font-size: 0.9rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-text-secondary);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 10px;
	margin-bottom: 20px;
}

.acj-abstract-text {
	font-family: var(--font-family-heading); /* Lora для читання */
	line-height: 1.8;
	color: var(--color-text-main);
}

/* References Styling */
.acj-ref-list p {
	margin-bottom: 12px;
	font-size: 0.95rem;
	line-height: 1.6;
	color: #444;
	padding-left: 20px;
	text-indent: -20px; /* Hanging indent для літератури */
}

/* --- READING PROGRESS BAR --- */
.acj-read-progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 4px;
	background: var(--color-accent);
	width: 0%; /* Змінюється JS */
	z-index: 1003; /* Поверх хедера */
	transition: width 0.1s linear;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-article-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.acj-article-sidebar {
		order: 2; /* Сайдбар вниз на мобільному */
	}

	.acj-article-title {
		font-size: 2rem;
	}
}

/* --- CIRCULAR PROGRESS INDICATOR --- */

.acj-progress-circle {
	position: fixed;
	/* Розміщення зліва знизу (класика для індикаторів читання) */
	bottom: 30px;
	left: 30px;
	z-index: 1005; /* Поверх усього */

	width: 50px;
	height: 50px;
	cursor: pointer;

	/* Ховаємо, якщо сторінка не прокручена (JS додасть клас visible) */
	opacity: 0;
	visibility: hidden;
	transform: translateY(20px);
	transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.acj-progress-circle.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Ховер ефект */
.acj-progress-circle:hover {
	transform: scale(1.1); /* Трохи збільшується */
}

/* --- SVG STYLES --- */
.acj-progress-circle svg {
	display: block;
	transform: rotate(-90deg); /* Повертаємо, щоб старт був зверху (на 12 годин) */
}

/* Спільні стилі для кілець */
.acj-progress-circle circle {
	fill: none; /* Без заливки всередині */
	stroke-width: 3; /* Товщина лінії */
	stroke-linecap: round; /* Заокруглені кінці лінії */
}

/* Фонове кільце */
.bg-ring {
	stroke: #e0e0e0; /* Світло-сірий */
}

/* Кільце прогресу */
.progress-ring {
	stroke: var(--color-accent); /* Твій блакитний #4db0d9 */

	/* МАТЕМАТИКА КОЛА:
       Довжина кола (L) = 2 * Pi * R
       R = 23 (бо width 50, stroke 3, отже 25 - 1.5 = 23.5, округлимо до 23 для зручності)
       L ≈ 144.5
    */
	stroke-dasharray: 144.5;
	stroke-dashoffset: 144.5; /* Початково сховане (повністю зсунуте) */
	transition: stroke-dashoffset 0.1s linear; /* Плавність заповнення */
}

/* --- ICON INSIDE --- */
.progress-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);

	font-size: 14px;
	color: var(--color-text-secondary);
	transition: color 0.3s;
	pointer-events: none; /* Клік проходить крізь іконку на дів */
}

.acj-progress-circle:hover .progress-icon {
	color: var(--color-primary); /* Темнішає при наведенні */
}

/* --- AUTHOR PAGE LAYOUT --- */
.acj-author-page {
	padding-bottom: var(--space-xl);
}

.acj-author-layout {
	display: grid;
	/* Ліва колонка 320px, права - все інше */
	grid-template-columns: 320px 1fr;
	gap: 80px;
	margin-top: 60px;
	align-items: start;
}

/* --- SIDEBAR: AUTHOR PROFILE --- */
.acj-author-sidebar {
	height: 100%;
	position: relative;
}

.acj-author-sticky {
	position: sticky;
	top: 120px;
	background-color: var(--color-bg-light);
	padding: 40px 30px;
	border-radius: var(--border-radius-md);
	text-align: center;
}

/* Avatar Initials */
.acj-author-avatar {
	width: 100px;
	height: 100px;
	background-color: #fff;
	border: 1px solid var(--color-border);
	border-radius: 50%;
	margin: 0 auto 25px;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.acj-author-avatar span {
	font-family: var(--font-family-heading);
	font-size: 2rem;
	color: var(--color-primary);
	font-weight: 700;
	letter-spacing: -1px;
}

/* Profile Text */
.acj-profile-name {
	font-family: var(--font-family-heading);
	font-size: 1.6rem;
	line-height: 1.2;
	margin: 0 0 15px;
	color: var(--color-text-main);
}

.acj-profile-bio {
	font-family: var(--font-family-body);
	font-size: 0.95rem;
	line-height: 1.6;
	color: var(--color-text-secondary);
	margin-bottom: 30px;
}

/* Profile Stats Grid */
.acj-profile-stats {
	display: flex;
	justify-content: center;
	gap: 20px;
	border-top: 1px solid var(--color-border);
	padding-top: 20px;
}

.acj-stat-box {
	display: flex;
	flex-direction: column;
}

.acj-stat-box .value {
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--color-primary);
}

.acj-stat-box .label {
	font-size: 0.7rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	letter-spacing: 0.05em;
}


/* --- FEED ADJUSTMENTS --- */

/* Badge for Journal Name */
.acj-journal-badge {
	font-weight: 700;
	color: var(--color-text-secondary);
	text-transform: uppercase;
	font-size: 0.75rem;
	letter-spacing: 0.05em;
}

/* Highlight Current Author in List */
.author-name.current-author {
	font-weight: 700;
	color: var(--color-text-main);
	text-decoration: underline;
	text-decoration-color: var(--color-accent);
}

.acj-article-meta-row {
	margin-bottom: 12px;
	font-size: 0.85rem;
	color: var(--color-text-secondary);
}

.acj-keywords-inline {
	font-style: italic;
}

.acj-meta-divider {
	margin: 0 8px;
	color: var(--color-border);
}

.acj-article-authors-inline {
	margin-bottom: 15px;
	font-size: 0.95rem;
	color: #555;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-author-layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.acj-author-sticky {
		position: static; /* На мобільному не липне */
		display: flex;
		flex-direction: column;
		align-items: center;
	}
}

/* --- CONTACT PAGE LAYOUT --- */
.acj-contact-page {
	padding-bottom: var(--space-xl);
}

.acj-contact-layout {
	display: grid;
	/* Ліва колонка (інфо) 350px, права (форма) - решта */
	grid-template-columns: 350px 1fr;
	gap: 80px;
	margin-top: 60px;
	align-items: start;
}

/* --- SIDEBAR: INFO CARDS --- */
.acj-contact-sidebar {
	height: 100%;
	position: relative;
}

/* Використовуємо той самий клас для липкості, що і раніше */
.acj-sidebar-sticky {
	position: sticky;
	top: 120px;
	background-color: var(--color-bg-light); /* Світло-сірий фон плашки */
	padding: 40px 30px;
	border-radius: var(--border-radius-md);
}

.acj-info-card {
	display: flex;
	gap: 20px;
	margin-bottom: 30px;
	padding-bottom: 30px;
	border-bottom: 1px solid rgba(0,0,0,0.05);
}

.acj-info-card:last-child {
	border-bottom: none;
	margin-bottom: 0;
	padding-bottom: 0;
}

.acj-info-icon {
	width: 40px;
	height: 40px;
	background-color: #fff;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-primary);
	border: 1px solid var(--color-border);
	flex-shrink: 0;
}

.acj-info-content {
	flex-grow: 1;
}

.acj-info-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin: 0 0 5px 0;
	letter-spacing: 0.05em;
	font-weight: 700;
}

.acj-info-text {
	font-style: normal;
	font-size: 0.95rem;
	color: var(--color-text-main);
	line-height: 1.5;
}

.acj-info-link {
	font-size: 1rem;
	font-weight: 600;
	color: var(--color-primary);
	text-decoration: none;
	border-bottom: 1px solid transparent;
	transition: all 0.3s;
}

.acj-info-link:hover {
	border-color: var(--color-primary);
	color: var(--color-accent);
}

/* Editors Block */
.acj-editors-block {
	margin-top: 10px;
	background: #fff;
	padding: 20px;
	border-radius: var(--border-radius-sm);
	border: 1px solid var(--color-border);
}

.acj-editors-title {
	font-size: 0.8rem;
	text-transform: uppercase;
	margin: 0 0 15px 0;
	color: var(--color-text-main);
}

.acj-editors-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.acj-editors-list li {
	font-size: 0.9rem;
	color: #555;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	gap: 10px;
}

.acj-editors-list li i {
	color: var(--color-text-secondary);
	opacity: 0.5;
}

/* --- MAIN CONTENT (FORM) --- */

.acj-contact-intro {
	font-family: var(--font-family-heading); /* Lora */
	font-size: 1.2rem;
	line-height: 1.8;
	color: var(--color-text-main);
	margin-bottom: 50px;
	padding-bottom: 30px;
	border-bottom: 1px solid var(--color-border);
}

.acj-form-container {
	background-color: #fff;
}

.acj-form-title {
	font-family: var(--font-family-heading);
	font-size: 1.8rem;
	margin-bottom: 30px;
	color: var(--color-text-main);
}

/* Стилізація Yii2 форми всередині обгортки */
.acj-yii-form-wrapper .form-group {
	margin-bottom: 25px;
}

.acj-yii-form-wrapper label {
	display: block;
	margin-bottom: 8px;
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	letter-spacing: 0.05em;
}

.acj-yii-form-wrapper .form-control {
	width: 100%;
	padding: 15px;
	border: 1px solid var(--color-border);
	border-radius: 4px; /* Трохи м'якіші кути */
	background-color: #f9f9f9;
	font-family: var(--font-family-body);
	font-size: 1rem;
	transition: all 0.3s;
}

.acj-yii-form-wrapper .form-control:focus {
	background-color: #fff;
	border-color: var(--color-primary);
	outline: none;
	box-shadow: 0 0 0 3px rgba(11, 105, 113, 0.1); /* Легке світіння брендовим кольором */
}

.acj-yii-form-wrapper textarea.form-control {
	min-height: 150px;
	resize: vertical;
}

/* Кнопка відправки (Yii Button) */
.acj-yii-form-wrapper button[type="submit"] {
	background-color: var(--color-primary);
	color: #fff;
	padding: 15px 40px;
	border: none;
	border-radius: 50px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	cursor: pointer;
	transition: background 0.3s;
	margin-top: 10px;
}

.acj-yii-form-wrapper button[type="submit"]:hover {
	background-color: var(--color-accent);
	transform: translateY(-2px);
	box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-contact-layout {
		grid-template-columns: 1fr; /* Одна колонка */
		gap: 50px;
	}

	.acj-contact-sidebar {
		order: 2; /* Контакти вниз */
	}

	.acj-sidebar-sticky {
		position: static;
	}
}

/* --- EDITORIAL BOARD LAYOUT --- */
.acj-board-page {
	padding-bottom: var(--space-xl);
}

.acj-board-layout {
	display: grid;
	/* Сайдбар 280px, контент - решта */
	grid-template-columns: 280px 1fr;
	gap: 60px;
	margin-top: 60px;
	align-items: start;
}

/* --- SIDEBAR NAVIGATION --- */
.acj-board-sidebar {
	height: 100%;
	position: relative;
}

.acj-sidebar-sticky {
	position: sticky;
	top: 120px; /* Враховуємо висоту хедера */
}

.acj-nav-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: 15px;
	font-weight: 700;
	letter-spacing: 0.05em;
}

.acj-anchor-nav ul {
	list-style: none;
	padding: 0;
	margin: 0;
	border-left: 2px solid var(--color-border);
}

.acj-anchor-nav li {
	margin-bottom: 0;
}

.acj-anchor-link {
	display: block;
	padding: 8px 0 8px 20px;
	font-size: 0.95rem;
	color: var(--color-text-secondary);
	text-decoration: none;
	border-left: 2px solid transparent;
	margin-left: -2px; /* Накладання на лінію батька */
	transition: all 0.3s;
}

.acj-anchor-link:hover,
.acj-anchor-link.active {
	color: var(--color-primary);
	border-left-color: var(--color-primary);
	background: linear-gradient(90deg, rgba(11, 105, 113, 0.05), transparent);
}

/* --- CHIEF EDITOR CARD (HERO) --- */
.acj-section-anchor {
	scroll-margin-top: 140px; /* Щоб хедер не перекривав заголовок при кліку */
}

.acj-chief-card {
	background: #fff;
	border-radius: var(--border-radius-md);
	box-shadow: 0 10px 30px rgba(0,0,0,0.05);
	overflow: hidden;
	margin-bottom: 60px;
	border: 1px solid var(--color-border);
	border-left: 5px solid var(--color-primary); /* Акцент */
}

.acj-chief-header {
	background-color: var(--color-bg-light);
	padding: 15px 30px;
	border-bottom: 1px solid var(--color-border);
}

.acj-role-badge {
	font-size: 0.75rem;
	text-transform: uppercase;
	font-weight: 700;
	color: var(--color-primary);
	letter-spacing: 0.1em;
}

.acj-chief-body {
	padding: 30px;
}

.acj-chief-name {
	margin: 0 0 15px;
}

.acj-chief-name a {
	font-family: var(--font-family-heading);
	font-size: 2rem;
	color: var(--color-text-main);
	text-decoration: none;
	transition: color 0.3s;
}

.acj-chief-name a:hover {
	color: var(--color-accent);
}

.acj-chief-bio {
	font-size: 1.05rem;
	line-height: 1.7;
	color: #555;
	margin-bottom: 25px;
}

/* Social Pills for Chief */
.acj-social-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.acj-social-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 14px;
	border: 1px solid var(--color-border);
	border-radius: 50px;
	text-decoration: none;
	font-size: 0.85rem;
	color: var(--color-text-main);
	transition: all 0.3s;
	background: #fff;
}

.acj-social-pill:hover {
	border-color: var(--color-primary);
	color: var(--color-primary);
	transform: translateY(-2px);
}

.acj-social-pill .icon-wrap {
	display: flex; /* Щоб іконка центрувалася */
	font-size: 1.1em;
}

/* --- MEMBER GROUPS --- */
.acj-group-section {
	margin-bottom: 60px;
}

.acj-group-title {
	font-family: var(--font-family-heading);
	font-size: 1.4rem;
	color: var(--color-text-main);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 10px;
	margin-bottom: 30px;
}

.acj-members-grid {
	display: grid;
	/* Автоматична сітка: картки не менше 300px */
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 30px;
}

/* Member Card */
.acj-member-card {
	background: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	padding: 25px;
	transition: all 0.3s;
}

.acj-member-card:hover {
	border-color: var(--color-accent);
	box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.acj-member-name {
	font-family: var(--font-family-heading);
	font-size: 1.1rem;
	margin: 0 0 10px;
	color: var(--color-text-main);
	line-height: 1.3;
}

.acj-member-bio {
	font-size: 0.9rem;
	color: var(--color-text-secondary);
	line-height: 1.5;
	margin-bottom: 15px;
}

/* Mini Links for Members */
.acj-mini-links {
	display: flex;
	gap: 12px;
	border-top: 1px solid rgba(0,0,0,0.05);
	padding-top: 15px;
	margin-top: auto; /* Притиснути до низу картки, якщо flex */
}

.acj-mini-links a {
	color: var(--color-text-secondary);
	font-size: 1.1rem;
	transition: color 0.3s;
	text-decoration: none;
	opacity: 0.7;
}

.acj-mini-links a:hover {
	color: var(--color-primary);
	opacity: 1;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-board-layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.acj-board-sidebar {
		display: none; /* На мобільному можна сховати навігацію або зробити її зверху */
	}
}

/* --- SVG & WIDGET FIXES --- */

/* 1. Задаємо розмір для іконок у картках (Editorial Board) */
.acj-social-pill svg,
.acj-social-pill img,
.acj-mini-links svg,
.acj-mini-links img {
	width: 25px !important;  /* Примусова ширина */
	height: 25px !important; /* Примусова висота */
	display: inline-block;
	vertical-align: middle;

	/* Магія кольору: */
	fill: var(--color-primary);      /* Щоб SVG приймав колір тексту */
	color: inherit;
}

/* 2. Для старих блоків (якщо десь лишилися) */
.social-links-one a span svg,
.social-links-one a span img {
	width: 25px;
	height: 25px;
	display: inline-block;
	vertical-align: middle;
	margin-right: 5px;
}

/* 3. Виправляємо можливі проблеми з кольором всередині SVG */
/* Деякі SVG мають hardcoded fill="white", тому їх не видно на білому */
.acj-social-pill svg path,
.acj-mini-links svg path {
	fill: #000 !important; /* Перефарбовуємо шлях у колір тексту */
}

/* --- EDITOR IN CHIEF PAGE --- */
.acj-editor-page {
	padding-bottom: var(--space-xl);
}

.acj-editor-layout {
	display: grid;
	/* Сайдбар 300px, Контент - решта */
	grid-template-columns: 300px 1fr;
	gap: 80px;
	margin-top: 60px;
	align-items: start;
}

/* --- SIDEBAR --- */
.acj-editor-sidebar {
	height: 100%;
	position: relative;
}

.acj-sidebar-sticky {
	position: sticky;
	top: 120px;
}

/* Photo Wrapper */
.acj-editor-photo-wrapper {
	width: 100%;
	aspect-ratio: 1 / 1; /* Квадратне фото */
	border-radius: var(--border-radius-md);
	overflow: hidden;
	margin-bottom: 30px;
	background-color: #f0f0f0;
	box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

.acj-editor-photo {
	width: 100%;
	height: 100%;
	object-fit: cover; /* Щоб фото не сплющувалось */
	display: block;
}

/* Avatar Placeholder (якщо немає фото) */
.acj-editor-avatar-placeholder {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #fff;
	border: 1px solid var(--color-border);
}

.acj-editor-avatar-placeholder span {
	font-size: 4rem;
	font-weight: 700;
	color: var(--color-primary);
	font-family: var(--font-family-heading);
}

/* IDs List */
.acj-ids-title {
	font-size: 0.8rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 10px;
	margin-bottom: 15px;
	letter-spacing: 0.05em;
}

.acj-id-link {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 0;
	color: var(--color-text-main);
	text-decoration: none;
	font-size: 0.95rem;
	border-bottom: 1px solid rgba(0,0,0,0.03);
	transition: all 0.3s;
}

.acj-id-link:last-child {
	border-bottom: none;
}

.acj-id-link:hover {
	color: var(--color-primary);
	padding-left: 5px; /* Легкий зсув вправо */
}

.acj-id-link .label {
	font-weight: 500;
	color: var(--color-text-main);
}

/* --- FIX FOR WIDGET ICONS (SVG) --- */
/* Це критично для відображення іконок */
.acj-icon-wrap {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 24px;
	height: 24px;
	flex-shrink: 0;
	color: var(--color-text-secondary); /* Базовий колір іконок */
}

.acj-icon-wrap svg,
.acj-icon-wrap img {
	width: 100% !important;
	height: 100% !important;
	fill: currentColor; /* SVG приймає колір батька */
	display: block;
}

.acj-id-link:hover .acj-icon-wrap {
	color: var(--color-primary);
}


/* --- MAIN CONTENT --- */
.acj-editor-name {
	font-family: var(--font-family-heading);
	font-size: 2.5rem;
	line-height: 1.2;
	color: var(--color-text-main);
	margin: 0 0 20px;
}

.acj-editor-intro {
	font-size: 1.2rem;
	line-height: 1.6;
	color: #555;
	font-style: italic;
	border-left: 4px solid var(--color-accent);
	padding-left: 20px;
	margin-bottom: 40px;
}

.acj-editor-bio-section {
	margin-top: 40px;
}

.acj-bio-heading {
	font-family: var(--font-family-body);
	font-size: 1rem;
	text-transform: uppercase;
	letter-spacing: 0.1em;
	color: var(--color-text-secondary);
	margin-bottom: 20px;
	font-weight: 700;
}

.acj-bio-text {
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--color-text-main);
	text-align: justify;
}

.acj-bio-text p {
	margin-bottom: 15px;
}

/* --- EMPTY STATE --- */
.acj-empty-state {
	text-align: center;
	padding: 100px 0;
	color: var(--color-text-secondary);
	font-size: 1.2rem;
}

/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.acj-editor-layout {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.acj-editor-photo-wrapper {
		max-width: 300px; /* Обмежуємо розмір фото на мобільному */
		margin: 0 auto 30px;
	}

	.acj-editor-name {
		text-align: center;
		font-size: 2rem;
	}
}

/* --- NEW LABEL STYLE (CHIPS) --- */

.label {
	/* 1. Геометрія */
	display: inline-flex;       /* Краще ніж inline для вирівнювання */
	align-items: center;
	justify-content: center;
	padding: 6px 12px;          /* Більше "повітря" */
	border-radius: 50px;        /* Повністю кругла "пігулка" */

	/* 2. Типографіка */
	font-family: var(--font-family-body);
	font-size: 0.75rem;         /* ~12px, акуратно */
	font-weight: 700;           /* Жирний, але не товстий */
	text-transform: uppercase;  /* Верхній регістр для статусності */
	letter-spacing: 0.08em;     /* Розрядка літер */
	line-height: 1;

	/* 3. Кольори за замовчуванням (Нейтральний сірий) */
	color: var(--color-text-secondary);
	background-color: #f4f6f7;  /* Дуже світлий сірий фон */
	border: 1px solid transparent; /* Готуємо місце під бордер */

	/* Скидаємо старі тіні тексту, якщо були */
	text-shadow: none;
	vertical-align: middle;
	transition: all 0.2s ease;
}

/* --- ВАРІАНТИ (CONTEXT CLASSES) --- */
/* Ми робимо їх не суцільними, а "тінтовими" (світлий фон + темний текст) - це виглядає дорожче */

/* Primary (Брендовий) */
.label-primary {
	background-color: rgba(11, 105, 113, 0.1); /* Прозорий Primary */
	color: var(--color-primary);
}

/* Success (наприклад, для OPEN ACCESS) */
.label-success {
	background-color: rgba(39, 174, 96, 0.1);
	color: #27ae60;
}

/* Info (наприклад, для тегів) */
.label-info {
	background-color: rgba(77, 176, 217, 0.1);
	color: #2980b9;
}

/* Warning (Увага) */
.label-warning {
	background-color: rgba(243, 156, 18, 0.1);
	color: #d35400;
}

/* Danger (Важливо) */
.label-danger {
	background-color: rgba(231, 76, 60, 0.1);
	color: #c0392b;
}

/* --- HOVER EFFECT (Опціонально, якщо це посилання) --- */
a.label:hover {
	transform: translateY(-1px);
	text-decoration: none;
	filter: brightness(0.95); /* Трохи темніше при наведенні */
}

/* --- STATIC PAGES (Policies, Rules, etc.) --- */

.acj-static-page {

}

/* --- TYPOGRAPHY & ELEMENTS INSIDE ADMIN CONTENT --- */
.acj-static-content {
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--color-text-main);
}

/* Параграфи */
.acj-static-content p {
	margin-bottom: 20px;
	text-align: justify; /* Журнальний вигляд */
}

/* Заголовки всередині тексту (h3, h4, h5) */
.acj-static-content h1,
.acj-static-content h2,
.acj-static-content h3,
.acj-static-content h4 {
	font-family: var(--font-family-heading);
	color: var(--color-text-main);
	margin-top: 40px;
	margin-bottom: 15px;
	line-height: 1.3;
}

.acj-static-content h3 { font-size: 1.4rem; border-bottom: 1px solid var(--color-border); padding-bottom: 10px; }
.acj-static-content h4 { font-size: 1.2rem; font-weight: 700; }
.acj-static-content strong, .acj-static-content b { font-weight: 700; color: #000; }

/* Списки (ul, ol) */
.acj-static-content ul,
.acj-static-content ol {
	margin-bottom: 20px;
	padding-left: 20px;
}

.acj-static-content ul li {
	margin-bottom: 8px;
	list-style-type: disc;
}

.acj-static-content ol li {
	margin-bottom: 8px;
	list-style-type: decimal;
}

/* Посилання */
.acj-static-content a {
	color: var(--color-primary);
	text-decoration: underline;
	transition: color 0.3s;
}
.acj-static-content a:hover {
	color: var(--color-accent);
}

/* --- TABLES (Найскладніша частина) --- */
/* Робимо таблиці красивими і адаптивними */

.acj-static-content table {
	width: 100%;
	max-width: 100%;
	margin-bottom: 30px;
	border-collapse: collapse;
	background-color: #fff;
	font-size: 0.9rem;
	border: 1px solid var(--color-border);
}

.acj-static-content th,
.acj-static-content td {
	padding: 12px 15px;
	border: 1px solid var(--color-border);
	text-align: left;
	vertical-align: top;
}

/* Шапка таблиці */
.acj-static-content th {
	background-color: #f8f9fa;
	font-weight: 700;
	color: var(--color-text-main);
	text-transform: uppercase;
	font-size: 0.8rem;
	letter-spacing: 0.05em;
}

/* Смугасті рядки (Zebra striping) для кращого читання */
.acj-static-content tr:nth-child(even) {
	background-color: #fcfcfc;
}

/* Hover ефект на рядок */
.acj-static-content tr:hover {
	background-color: rgba(11, 105, 113, 0.03);
}

/* Адаптивність таблиць (щоб не ламали сайт на мобільному) */
@media (max-width: 768px) {
	.acj-static-content table {
		display: block;
		overflow-x: auto; /* Горизонтальний скрол */
		white-space: nowrap;
	}
}

/* Картинки */
.acj-static-content img {
	max-width: 100%;
	height: auto;
	border-radius: 4px;
	margin: 20px 0;
}

/* --- ERROR PAGE (404) --- */

.acj-error-page {
	padding: 80px 0 100px;
	min-height: 60vh; /* Щоб займало більшу частину екрану */
	display: flex;
	align-items: center;
	justify-content: center;
}

.acj-error-content {
	text-align: center;
	max-width: 700px;
	margin: 0 auto;
}

/* Гігантські цифри */
.acj-error-code {
	font-family: var(--font-family-heading);
	font-size: 10rem; /* Дуже великий розмір */
	font-weight: 700;
	line-height: 1;
	color: var(--color-primary);
	opacity: 0.15; /* Напівпрозорий "водяний знак" */
	margin: 0;
	user-select: none; /* Щоб не виділялось мишкою */
}

/* Заголовок помилки */
.acj-error-heading {
	font-family: var(--font-family-heading);
	font-size: 2rem;
	color: var(--color-text-main);
	margin: -40px 0 20px; /* Підтягуємо вгору, на цифри */
	position: relative; /* Щоб було поверх цифр */
}

/* Опис */
.acj-error-desc {
	font-size: 1.1rem;
	color: var(--color-text-secondary);
	line-height: 1.6;
	margin-bottom: 40px;
}

/* Група кнопок */
.acj-error-actions {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

/* --- LOGIN PAGE (AUTH CARD) --- */

.acj-login-page {
	/* Робимо сторінку на весь екран по висоті */
	min-height: 80vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
}

.acj-login-overlay {
	width: 100%;
	max-width: 450px; /* Оптимальна ширина для форми входу */
}

/* Картка */
.acj-auth-card {
	background: #ffffff;
	padding: 40px;
	border-radius: var(--border-radius-md); /* Округлені кути */
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.08); /* Глибока м'яка тінь */
	border: 1px solid var(--color-border);
	position: relative;
	overflow: hidden;
}

/* Декоративна смужка зверху */
.acj-auth-card::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background: var(--color-primary);
}

/* Хедер картки */
.acj-auth-header {
	text-align: center;
	margin-bottom: 30px;
}

.acj-auth-title {
	font-family: var(--font-family-heading);
	font-size: 2rem;
	color: var(--color-text-main);
	margin: 0 0 10px;
}

.acj-auth-subtitle {
	color: var(--color-text-secondary);
	font-size: 0.95rem;
}

/* Стилізація полів (схоже на Contact Form, але більш компактно) */
.acj-yii-form .form-group {
	margin-bottom: 20px;
}

.acj-form-label {
	display: block;
	margin-bottom: 8px;
	font-size: 0.8rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	letter-spacing: 0.05em;
}

.acj-form-control {
	width: 100%;
	padding: 12px 15px;
	border: 1px solid var(--color-border);
	border-radius: 4px;
	background-color: #f9f9f9;
	font-size: 1rem;
	transition: all 0.3s;
	outline: none;
}

.acj-form-control:focus {
	background-color: #fff;
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(11, 105, 113, 0.1);
}

/* Повідомлення про помилку (Yii error) */
.acj-form-error {
	font-size: 0.85rem;
	color: #e74c3c; /* Червоний */
	margin-top: 5px;
}

/* Кнопка на всю ширину */
.btn-style-one.full-width {
	width: 100%;
	justify-content: center;
}

/* Footer (Back link) */
.acj-auth-footer {
	text-align: center;
	margin-top: 25px;
	border-top: 1px solid rgba(0,0,0,0.05);
	padding-top: 20px;
}

.acj-back-link {
	font-size: 0.9rem;
	color: var(--color-text-secondary);
	text-decoration: none;
	transition: color 0.3s;
}

.acj-back-link:hover {
	color: var(--color-primary);
}

/* --- INDEXING PAGE --- */

.acj-indexing-page {
	padding-bottom: var(--space-xl);
}

/* Сітка */
.acj-indexing-grid {
	display: grid;
	/* Адаптивно: колонки мінімум 220px, заповнюють ширину */
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 30px;
	margin-top: 40px;
}

/* Картка */
.acj-index-card {
	display: flex;
	flex-direction: column;
	background-color: #fff;
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-sm);
	text-decoration: none;
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
	overflow: hidden;
	height: 100%; /* Щоб усі картки були однієї висоти */
}

/* Ховер ефект для картки */
.acj-index-card:hover {
	transform: translateY(-5px);
	box-shadow: 0 10px 30px rgba(0,0,0,0.08);
	border-color: var(--color-primary);
}

/* Контейнер для логотипу */
.acj-logo-box {
	height: 160px; /* Фіксована висота області логотипу */
	padding: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #ffffff;
	border-bottom: 1px solid rgba(0,0,0,0.03);
}

/* Саме зображення */
.acj-logo-box img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain; /* Картинка впишеться в блок, не обрізаючись */

	/* Ефект: чорно-білий за замовчуванням (опціонально) */
	filter: grayscale(100%);
	opacity: 0.8;
	transition: all 0.4s ease;
}

/* При наведенні робимо кольоровим */
.acj-index-card:hover .acj-logo-box img {
	filter: grayscale(0%);
	opacity: 1;
	transform: scale(1.05); /* Легкий зум */
}

/* Footer картки (Назва) */
.acj-index-footer {
	padding: 15px 20px;
	background-color: #fcfcfc;
	flex-grow: 1; /* Притискає футер вниз */
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.acj-index-name {
	margin: 0;
	font-family: var(--font-family-body);
	font-size: 0.95rem;
	font-weight: 600;
	color: var(--color-text-main);
	line-height: 1.3;
}

.acj-link-arrow {
	color: var(--color-primary);
	font-weight: bold;
	opacity: 0;
	transform: translateX(-10px);
	transition: all 0.3s ease;
}

/* Стрілочка з'являється при наведенні */
.acj-index-card:hover .acj-link-arrow {
	opacity: 1;
	transform: translateX(0);
}

/* --- SEARCH RESULTS PAGE --- */

.acj-search-page {
	padding-bottom: var(--space-xl);
}

/* 1. SEARCH HERO (Form Container) */
.acj-search-hero {
	background-color: #f8f9fa; /* Світло-сірий фон для блоку пошуку */
	border: 1px solid var(--color-border);
	border-radius: var(--border-radius-md);
	padding: 30px;
	margin-bottom: 50px;
	text-align: center;
}

.acj-search-label {
	font-size: 0.9rem;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	margin-bottom: 20px;
	font-weight: 700;
	letter-spacing: 0.05em;
}

/* Override styles for the included search form widget */
/* Ми додаємо ці стилі, щоб інпути всередині віджета виглядали сучасно, навіть якщо там старі класи */
.acj-form-override input[type="text"],
.acj-form-override .form-control {
	width: 100%;
	height: 50px;
	padding: 10px 20px;
	border: 1px solid var(--color-border);
	border-radius: 50px; /* Круглий інпут пошуку */
	font-size: 1rem;
	transition: all 0.3s;
	box-shadow: 0 2px 10px rgba(0,0,0,0.03);
}

.acj-form-override input[type="text"]:focus {
	border-color: var(--color-primary);
	outline: none;
	box-shadow: 0 5px 15px rgba(11, 105, 113, 0.15);
}

.acj-form-override button {
	margin-top: 15px; /* Якщо кнопка окремо */
}


/* 2. RESULTS STATS */
.acj-results-count {
	margin-bottom: 30px;
	font-family: var(--font-family-body);
	font-size: 1rem;
	color: var(--color-text-secondary);
	border-bottom: 1px solid var(--color-border);
	padding-bottom: 15px;
}

.acj-results-count strong {
	color: var(--color-primary);
	font-size: 1.2rem;
}


/* 3. EMPTY STATE (No Results) */
.acj-empty-search {
	text-align: center;
	padding: 60px 0;
	color: var(--color-text-secondary);
}

.acj-empty-icon {
	font-size: 4rem;
	color: var(--color-border); /* Блідий колір */
	margin-bottom: 20px;
}

.acj-empty-title {
	font-family: var(--font-family-heading);
	font-size: 1.5rem;
	color: var(--color-text-main);
	margin-bottom: 10px;
}

.acj-empty-desc {
	font-size: 1rem;
	max-width: 400px;
	margin: 0 auto;
}


/* --- ARTICLE ITEM RE-USE (Minor adjustments) --- */
/* Тут ми використовуємо вже існуючі класи .acj-article-item */
/* Якщо треба специфічні правки для пошуку: */

.acj-search-results .acj-article-item {
	/* Наприклад, трохи менший відступ, ніж у Issue Page */
	margin-bottom: 30px;
	padding-bottom: 30px;
}

.acj-journal-badge {
	font-weight: 700;
	color: var(--color-text-secondary);
	font-size: 0.75rem;
	text-transform: uppercase;
}

/* --- SEARCH FORM STYLING --- */

/* 1. ХОВАЄМО КНОПКУ ПОШУКУ */
.acj-form-override button[type="submit"],
.acj-form-override input[type="submit"] {
	display: none !important;
}

/* 2. СТИЛІЗАЦІЯ РАДІО-КНОПОК (SEGMENTED CONTROL) */

/* Контейнер для радіо-кнопок */
.acj-radio-group {
	display: flex;
	justify-content: center;
	gap: 5px; /* Відступ між кнопками */
	background-color: #f0f0f0; /* Світло-сірий фон контейнера */
	padding: 5px;
	border-radius: 50px; /* Кругла форма контейнера */
	display: inline-flex; /* Щоб не розтягувалось на всю ширину */
	margin-bottom: 20px; /* Відступ до інпуту пошуку */
}

/* Ховаємо стандартні кружечки радіо */
.acj-radio-group input[type="radio"] {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}

/* Стиль лейбла (це буде наша кнопка) */
.acj-radio-group label {
	cursor: pointer;
	padding: 8px 20px;
	border-radius: 40px;
	font-size: 0.85rem;
	font-weight: 600;
	color: var(--color-text-secondary); /* Колір неактивного тексту */
	transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
	user-select: none;
	margin: 0; /* Прибираємо стандартні марджини */
	text-transform: uppercase;
	letter-spacing: 0.05em;
	display: flex;
	align-items: center;
}

/* --- СТАН: ACTIVE (Коли радіо вибрано) --- */
/* Тут магія: ми знаходимо лейбл, який йде одразу після вибраного інпута */
.acj-radio-group input[type="radio"]:checked + label {
	background-color: #ffffff; /* Білий фон для активного */
	color: var(--color-primary); /* Акцентний колір тексту */
	box-shadow: 0 2px 10px rgba(0,0,0,0.1); /* Тінь */
	transform: scale(1.05); /* Легке збільшення */
}

/* Ховер ефект для неактивних */
.acj-radio-group label:hover {
	color: var(--color-primary);
}

/* --- SEARCH AUTHOR SPECIFIC --- */

/* Група автора (обгортка) */
.acj-author-result-group {
	background-color: #fff;
	margin-bottom: 60px; /* Великий відступ між авторами */
	border-bottom: 4px solid var(--color-bg-light); /* Візуальний роздільник */
	padding-bottom: 40px;
}

.acj-author-result-group:last-child {
	border-bottom: none;
}

/* Заголовок групи (Ім'я автора) */
.acj-author-group-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 30px;
	padding-bottom: 15px;
	border-bottom: 1px solid var(--color-border);
}

.acj-group-author-name {
	margin: 0;
}

.acj-group-author-name a {
	font-family: var(--font-family-heading);
	font-size: 1.8rem;
	color: var(--color-text-main);
	text-decoration: none;
	transition: color 0.3s;
	display: flex;
	align-items: center;
	gap: 12px;
}

.acj-group-author-name i {
	color: var(--color-primary);
	opacity: 0.8;
	font-size: 0.9em;
}

.acj-group-author-name a:hover {
	color: var(--color-accent);
}

.acj-view-profile-link {
	font-size: 0.9rem;
	font-weight: 700;
	text-transform: uppercase;
	color: var(--color-primary);
	text-decoration: none;
	letter-spacing: 0.05em;
}

.acj-view-profile-link:hover {
	text-decoration: underline;
}

/* Якщо немає публікацій */
.acj-no-publications {
	color: var(--color-text-secondary);
	font-style: italic;
	padding: 20px;
	background: #f9f9f9;
	border-radius: 4px;
}

/* --- CITATION WIDGET --- */
/* --- CITATION LIST STYLE --- */

.acj-citation-list {
	display: flex;
	flex-direction: column;
	gap: 15px; /* Відступ між блоками APA і Vancouver */
	margin-top: 20px;
	width: 100%;
}

/* Окремий рядок цитування */
.acj-cite-row {
	position: relative;
	background-color: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	padding: 20px;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Hover ефект */
.acj-cite-row:hover {
	border-color: var(--color-primary);
	box-shadow: 0 4px 12px rgba(0,0,0,0.05);
	background-color: #fcfcfc;
}

/* Лейбл (APA / Vancouver) */
.acj-cite-label {
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	background-color: #f0f0f0;
	padding: 4px 10px;
	border-radius: 4px;
	align-self: flex-start; /* Притиснути вліво */
	margin-bottom: 5px;
	letter-spacing: 0.05em;
}

.acj-cite-row:hover .acj-cite-label {
	background-color: var(--color-primary);
	color: #fff;
}

/* Текст цитати */
.acj-cite-text {
	font-family: "Georgia", serif; /* Академічний шрифт */
	font-size: 0.95rem;
	line-height: 1.5;
	color: #333;
	padding-right: 60px; /* Місце для кнопки COPY */
}

/* Стилі всередині тексту */
.cite-journal { font-style: italic; }
.cite-vol { font-style: italic; }
.cite-journal-van { font-style: normal; }

/* Кнопка COPY (справа) */
.acj-copy-btn {
	position: absolute;
	right: 5px;
	top: 15%;
	transform: translateY(-50%);
	background: none;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 0.75rem;
	font-weight: 700;
	color: #777;
	cursor: pointer;
	transition: all 0.2s;
	display: flex;
	align-items: center;
	gap: 6px;
}

.acj-cite-row:hover .acj-copy-btn {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* Успішне копіювання (Overlay) */
.acj-cite-success {
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	background: rgba(255,255,255,0.95);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #27ae60; /* Зелений */
	font-weight: bold;
	font-size: 1.1rem;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.3s;
	border-radius: 6px;
	gap: 8px;
}

.acj-cite-row.copied .acj-cite-success {
	opacity: 1;
}

/* Мобільна адаптація */
@media (max-width: 500px) {
	.acj-copy-btn {
		position: static;
		transform: none;
		margin-top: 10px;
		justify-content: center;
		width: 100%;
	}
	.acj-cite-text {
		padding-right: 0;
	}
}

/* --- CITATION LIST STYLES (UPDATED) --- */

.acj-citation-list {
	display: flex;
	flex-direction: column;
	gap: 15px;
	margin-top: 20px;
	width: 100%;
}

.acj-cite-row {
	position: relative; /* Важливо для позиціонування повідомлення */
	background-color: #fff;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	padding: 20px;
	cursor: pointer;
	transition: all 0.2s ease;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.acj-cite-row:hover {
	border-color: var(--color-primary);
	box-shadow: 0 4px 12px rgba(0,0,0,0.05);
	background-color: #fcfcfc;
}

/* Лейбл */
.acj-cite-label {
	font-size: 0.75rem;
	font-weight: 800;
	text-transform: uppercase;
	color: var(--color-text-secondary);
	background-color: #f0f0f0;
	padding: 4px 10px;
	border-radius: 4px;
	align-self: flex-start;
	margin-bottom: 5px;
}

.acj-cite-row:hover .acj-cite-label {
	background-color: var(--color-primary);
	color: #fff;
}

/* Текст */
.acj-cite-text {
	font-family: "Georgia", serif;
	font-size: 0.95rem;
	line-height: 1.5;
	color: #333;
	padding-right: 70px; /* Місце для кнопки */
}

/* Стилі тексту */
.cite-journal, .cite-vol { font-style: italic; }
.cite-journal-van { font-style: normal; }

/* --- КНОПКА COPY --- */
.acj-copy-btn {
	position: absolute;
	right: 5px;
	top: 15%;
	transform: translateY(-50%);
	background: #fff;
	border: 1px solid #ddd;
	border-radius: 4px;
	padding: 8px 14px;
	font-size: 0.75rem;
	font-weight: 700;
	color: #777;
	cursor: pointer;
	transition: all 0.2s;
	display: flex;
	align-items: center;
	gap: 6px;
	z-index: 5; /* Щоб була над текстом */
}

.acj-cite-row:hover .acj-copy-btn {
	border-color: var(--color-primary);
	color: var(--color-primary);
}

/* Стан "УСПІХ" для кнопки */
.acj-cite-row.copied .acj-copy-btn {
	border-color: #27ae60 !important;
	background-color: #27ae60 !important;
	color: #fff !important;
}

/* Показуємо повідомлення, коли є клас .copied */
.acj-cite-row.copied .acj-cite-success {
	opacity: 1;
	visibility: visible;
}

/* Адаптив */
@media (max-width: 500px) {
	.acj-copy-btn {
		position: static;
		transform: none;
		margin-top: 10px;
		width: 100%;
		justify-content: center;
	}
	.acj-cite-text { padding-right: 0; }
}

.acj-ref-list ol {
	list-style-type: none; /* Убираем стандартные маркеры */
	padding: 0;
}

.acj-ref-list ol li {
	counter-increment: item; /* Увеличиваем счетчик */
	position: relative;
	padding-left: 37px; /* Отступ для текста */
}

.acj-ref-list ol li::before {
	content: "[" counter(item) "]"; /* Вставляем счетчик в формате [X] */
	position: absolute;
	left: 0;
	top: 0;
}

@media (max-width: 476px) {
	.acj-canvas {
		padding: 0;
	}
	.acj-utility-content {
		flex-direction: column;
		gap: 20px;
	}
	.acj-brand {
		text-align: center;
		margin: 0;
	}
	.acj-nav.is-open {
		display: flex;
		position: absolute;
		background: #fff;
		top: 85px;
		left: 0;
		width: 100%;
		padding: 20px;
	}
	.acj-menu {
		flex-direction: column;
	}
	.acj-actions {
		justify-content: space-between;
		flex-grow: 1;
	}
	.acj-static-page {
		margin-top: 20px;
	}
	.acj-colophon {
		padding: 30px 0;
	}
	.acj-footer-grid {
		margin-bottom: 0;
	}
	.acj-issue-layout {
		display: flex;
		flex-direction: column;
	}
	.acj-board-layout {
		display: block;
		margin-top: 20px;
	}
	.acj-board-page {
		margin-top: 30px;
	}
	.btn-style-one {
		text-wrap: auto;
	}
	.acj-article-title {
		text-wrap: auto;
		hyphens: auto;
		margin-bottom: 15px;
		font-size: 28px;
	}
	.acj-article-header {
		padding: 40px 0 30px;
	}
	.acj-article-grid {
		margin-top: 30px;
	}
	.acj-article-authors-list {
		margin-bottom: 15px;
	}
	.acj-article-body {
		padding: 0 var(--space-sm);
		text-align: justify;
	}
	.acj-sidebar-sticky {
		padding: 20px 15px;
	}
}