/* 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=Noto+Sans:wght@400;500;700&family=Noto+Serif:wght@500;600;700&display=swap');

/*** 

====================================================================
	Reset
====================================================================

 ***/
* {
	margin:0px;
	padding:0px;
	border:none;
	outline:none;
	box-sizing: border-box;
}

:root {
	/* --- КОЛЬОРОВА ПАЛІТРА --- */

	/* Основні кольори (з твого запиту) */
	--clr-primary: #4d9cc8;       /* Основний блакитний */
	--clr-accent: #353171;        /* Акцентний темно-синій */

	/* Відтінки для взаємодії (Hovers/Active) */
	--clr-primary-dark: #3b7ca3;  /* Трохи темніший для ховера */
	--clr-accent-dark: #262352;   /* Глибокий темний для ховера */

	/* Фонове середовище */
	--clr-bg-body: #ffffff;       /* Основний фон */
	--clr-bg-light: #f4f6f8;      /* Фон для секцій або сайдбарів (світло-сірий) */
	--clr-bg-input: #ffffff;

	/* Типографіка (Текст) */
	--clr-text-main: #1a1a1a;     /* Майже чорний для контрасту */
	--clr-text-secondary: #555555;/* Сірий для мета-даних (дати, автори) */
	--clr-text-inverse: #ffffff;  /* Текст на кольорових кнопках */

	/* Декоративні елементи */
	--clr-border: #dde1e6;        /* Тонкі рамки */
	--clr-border-focus: #4d9cc8;  /* Рамка при фокусі */

	/* --- ТИПОГРАФІКА --- */
	--font-main: 'Noto Sans', sans-serif;
	--font-heading: 'Noto Serif', serif;

	/* Розмірна сітка шрифтів (Scale) */
	font-size: 16px;
	--fs-xs: 0.75rem;   /* 12px - дрібні підписи */
	--fs-sm: 0.875rem;  /* 14px - мета-дані */
	--fs-base: 1rem;    /* 16px - основний текст статті */
	--fs-md: 1.125rem;  /* 18px - вступний текст */
	--fs-lg: 1.5rem;    /* 24px - H3 */
	--fs-xl: 2rem;      /* 32px - H2 */
	--fs-xxl: 2.5rem;   /* 40px - H1 */

	/* --- ГЕОМЕТРІЯ (Строгий стиль) --- */
	--radius: 0px;                /* Ніяких заокруглень */
	--shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
	--shadow-md: 0 4px 6px rgba(0,0,0,0.1);

	/* --- ВІДСТУПИ (Spacing) --- */
	--gap-xs: 4px;
	--gap-sm: 8px;
	--gap-md: 16px;
	--gap-lg: 24px;
	--gap-xl: 32px;
	--gap-section: 64px;          /* Відступи між великими блоками */

	/* --- СІТКА --- */
	--container-width: 1200px;
	--transition-base: 0.2s ease-in-out;

	/* ... твої інші змінні ... */
	--clr-error: #d32f2f;       /* Строгий червоний */
	--clr-bg-error: #fff5f5;    /* Дуже світлий червоний фон для полів */

}


/*** 

====================================================================
	Global Settings
====================================================================

 ***/
html {
	scroll-behavior: smooth;
}
body {
	font-family: var(--font-main);
	background-color: var(--clr-bg-body);
	color: var(--clr-text-main);
	line-height: 1.6;
	margin: 0;
	-webkit-font-smoothing: antialiased; /* Для чіткості шрифтів */
}

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-heading);
	color: var(--clr-accent); /* Заголовки акцентним кольором для строгості */
	font-weight: 700;
	line-height: 1.3;
	margin-top: 0;
	margin-bottom: var(--gap-md);
}


a{
	text-decoration:none;
	cursor:pointer;
	color:#4d9cc8;
}

a:hover,a:focus,a:visited{
	text-decoration:none;
	outline:none;
}

input,button,select,textarea{
	font-family: 'Inter', sans-serif;
}

p{
	position:relative;
	line-height:1.7em;
	font-family: 'Inter', sans-serif;	
}

/* --- LABEL RESET & RESTYLING --- */

/* Перевизначаємо глобальний клас .label */
.label {
	/* 1. АГРЕСИВНЕ СКИДАННЯ старих стилів ("бульбашки") */
	background-color: transparent !important; /* Прибираємо сірий фон */
	border-radius: 0 !important;              /* Жодних заокруглень */
	padding: 0 !important;                    /* Прибираємо внутрішні відступи */
	border: none !important;
	text-shadow: none !important;
	box-shadow: none !important;

	/* 2. НАШ НОВИЙ СТИЛЬ (Текстовий заголовок) */
	display: inline-block;
	font-family: var(--font-main);
	font-size: 0.7rem;          /* ~11-12px, дрібний шрифт */
	font-weight: 700;           /* Жирний */
	text-transform: uppercase;  /* Усі літери великі */
	color: var(--clr-text-secondary) !important; /* Сірий колір тексту */
	letter-spacing: 0.5px;
	line-height: 1.2;
	margin-bottom: 4px;         /* Відступ знизу до контенту */
	vertical-align: baseline;
	white-space: normal;        /* Дозволяємо перенос тексту, якщо треба */
	text-align: left;
}

/* Якщо .label використовується всередині посилання, додаємо ховер */
a .label {
	cursor: pointer;
	transition: color 0.2s;
}

a:hover .label {
	color: var(--clr-primary) !important;
}

/* --- ВАРІАЦІЯ: ЯКЩО ТРЕБА САМЕ БЕЙДЖ (Кольорова плашка) --- */
/* Використовуй клас: class="label badge-tag" */

.label.badge-tag {
	background-color: var(--clr-bg-light) !important;
	color: var(--clr-text-main) !important;
	padding: 4px 8px !important;
	border: 1px solid var(--clr-border) !important;
	font-size: 10px;
}

.label.badge-tag.primary {
	background-color: var(--clr-primary) !important;
	color: #ffffff !important;
	border-color: var(--clr-primary) !important;
}

.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;	
}

.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;	
}

.btn-style-one{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:10px 30px;
	font-size:14px;
	font-weight:700;
	text-transform:uppercase;
	background:#4d9cc8;
	color:#ffffff !important;
	border-radius:5px;
}

.btn-style-one:hover{
	background:#353171;
	color:#ffffff !important;	
}

.btn-style-two{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:10px 30px;
	font-size:14px;
	font-weight:700;
	text-transform:uppercase;
	background:#353171;
	color:#ffffff !important;
	border-radius:5px;
}

.btn-style-two:hover{
	background:#4d9cc8;
	color:#ffffff !important;	
}

.btn-style-three{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:10px 30px;
	font-size:14px;
	font-weight:700;
	text-transform:uppercase;
	background:#ffffff;
	color:#4d9cc8 !important;
	border-radius:5px;
}

.btn-style-three:hover{
	background:#353171;
	color:#ffffff !important;	
}

.btn-style-four{
	position:relative;
	display:inline-block;
	line-height:24px;
	padding:10px 32px;
	font-size:12px;
	text-transform:uppercase;
	background:none;
	border:2px solid #ffffff !important;
	color:#ffffff !important;
	border-radius:3px;
}

.btn-style-four:hover{
	background:#ffffff;
	color:#353171 !important;
}

.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:#353171 !important;
}

.bg_theme_color{
	background:#353171 !important;
}

.theme_green_color{
	color:#4d9cc8 !important;
}

.bg_green_color{
	background:#4d9cc8 !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:#4d9cc8;
	border:1px solid #4d9cc8;
	border-radius:50%;
	z-index:100;
	cursor:pointer;
	display:none;
}

.scroll-to-top:hover{
	border-color:#353171;
	background:#353171;
}


/*** 

====================================================================
	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:#353171;
	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:#4d9cc8;
}

.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: #4d9cc8;
}
.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 #353171;
	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 #353171;
}

.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:#353171;
	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:#353171;
	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:#4d9cc8;
}

.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:#353171;
}

.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: #4d9cc8;
	font-weight: 700;

}
.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:#4d9cc8;
	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:#353171;
	color:#ffffff;
	text-align:center;
	font-size:20px;
	line-height:38px;
	border:1px solid #353171;
}

.main-header .lower-section .outer-box{
	position:relative;
	background:#4d9cc8;
	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:#353171;
	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:#353171;
	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:#353171 !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:#353171;
	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:#4d9cc8;
}

.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:#353171;
	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:#4d9cc8;
}

.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: #4d9cc8;
	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: #4d9cc8;
}

.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: #353171;
	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:#353171;
}

.hidden-bar-wrapper {
	height: 100%;
}

.hidden-bar .logo {
	padding: 30px 0px;
	background: #4d9cc8;
}
.hidden-bar .logo a {
	color: #353171;

}
.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: #353171;
}

.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:#4d9cc8;
}

.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:#4d9cc8;
	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:#353171;
	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:#353171;
	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 #4d9cc8;
	border-bottom: 1px solid #4d9cc8;
}
.styled-heading:after{
	content: '//';
	position: absolute;
	font-size: 21px;
	letter-spacing: -2px;
	left: 25px;
	bottom: -4px;
	padding: 0 5px;
	background: #fff;
	color: #4d9cc8;
}

.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:#353171;
}

.line-styled-heading h2{
	font-size:24px;
	font-weight:700;
	color:#353171;
}

/*** 

====================================================================
	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:#353171;
	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:#353171;
	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:#353171;
}

.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:#4d9cc8;
	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:#353171;
	border:2px solid #353171;
	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:#353171;
	-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:#353171;
	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:#353171;
	color:#ffffff;
	border-color:#353171;
}

.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:#353171;
	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:#353171;
}

/*** 

====================================================================
	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(77,156,200,0.90);
	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:#4d9cc8;
}

.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:#4d9cc8;
	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:#353171;
}

.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:#353171;
}

.featured-news-column .text{
	margin-bottom:10px;	
}

.list-view .featured-news-column .text{
	margin-bottom:20px;	
}

.featured-news-column .read-more{
	color:#4d9cc8;
	text-transform:uppercase;
	font-size:14px;
	font-weight:700;
}

.featured-news-column:hover .read-more{
	color:#353171;
}

.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:#353171;
}

.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:#353171;
	font-size:16px;
}

.blog-details .comments-area .comment-info .time{
	color:#353171;
	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:#4d9cc8;
	-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:#4d9cc8 !important;
}

.sponsors-section .owl-dots{
	display:none !important;	
}

/*** 

====================================================================
	Info Section Style
====================================================================

***/

.info-section{
	position:relative;
	background:#4d9cc8;
	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:#353171;
}

.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 #4d9cc8;
	border-bottom: 1px solid #4d9cc8;
}
.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: #4d9cc8;
}

.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:#4d9cc8;
}

.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:#353171;
}

.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:#4d9cc8;
	border-radius:0px 5px 5px 0px;	
}

.main-footer .newsletter-widget input:focus+button,
.main-footer .newsletter-widget button:hover{
	background:#353171;
}

.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-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:#4d9cc8;
	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:#353171;
}

/*** 

====================================================================
	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 #4d9cc8;
	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:#4d9cc8 !important;
	color:#ffffff !important;
	border-color:#4d9cc8;
}

.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:#4d9cc8;
	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:#353171;
	border-color:#353171;
}

.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:#353171;
	border-color:#353171;
}

.accordion-box.style-two .accordion .accord-btn.active{
	color:#ffffff;
	background:#353171;
	border-color:#353171;
}

.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:#4d9cc8;
	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:#353171;
	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:#353171;
	background:#353171;
}

/*** 

====================================================================
	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:#353171;
	color:#ffffff;
	background:#353171;
}

.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:#353171;
}

.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:#353171;
	
	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:#353171;
}

/**** 

====================================================================
	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:#4d9cc8 !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:#353171;
}

.image-carousel-outer .post-option .share-btn{
	background:#4d9cc8;
}

.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:#353171;
}

.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:#4d9cc8;
	line-height:30px;	
}

.portfolio-details .post-controls .prev{
	position:absolute;
	left:0px;
	top:0px;
	line-height:30px;
	color:#4d9cc8;
}

.portfolio-details .post-controls .next{
	position:absolute;
	right:0px;
	top:0px;
	line-height:30px;
	color:#4d9cc8;
}

.portfolio-details .post-controls .icon{
	font-size:24px;
	line-height:30px;	
}

.portfolio-details .post-controls ul li a:hover{
	color:#353171;
}

.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:#353171;
	color:#ffffff;
	border-color:#353171;
}

.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:#353171;
}

.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:#353171;
	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:#353171;
}

.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:#353171;
}

.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:#353171;
}

.sidebar .recent-posts .post h4 a{
	color:#777777;	
}

.sidebar .recent-posts .post-info{
	color:#353171;
			
}

.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:#353171;
}

.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:#353171;

}

.sidebar .list li a:hover{
	color:#353171;
}

.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:#353171;
	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:#353171 !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 #4d9cc8;
	padding:8px 25px;
	background:#4d9cc8;
	color:#ffffff;
	border-radius:5px;
		
}

.rangeslider-widget .noUi-connect{
	background:#353171 !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:#353171;
}

.sidebar .best-sellers .item h4 a{
	color:#2f2f31;	
}

.sidebar .best-sellers .item .rating{
	font-size:11px;
	color:#4d9cc8;
}

.sidebar .best-sellers .item .item-price{
	font-size:18px;
	font-weight:700;
	color:#353171;
}


/*** 

====================================================================
	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:#4d9cc8;
}

.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:#353171;
}

.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:#353171;
	border:2px solid #353171;
	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:#353171;
}

/*** 

====================================================================
	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:#353171;
	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:#353171;
	color:#ffffff;
	border-color:#353171;
}

.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:#4d9cc8;
	text-decoration:underline;
	font-size:16px;	
}

.attorney-single .basic-details .contact-info li .icon{
	position:absolute;
	left:0px;
	top:0px;
	line-height:20px;
	color:#353171;
	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:#353171;
}

/*** 

====================================================================
	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:#4d9cc8;
	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:#353171;
}

.default-product-item .content-box h4 a{
	color:#2f2f31;	
}

.default-product-item .content-box .rating{
	font-size:11px;
	color:#4d9cc8;
	margin-bottom:15px;
}

.default-product-item .content-box .item-price{
	font-size:18px;
	font-weight:700;
	color:#353171;
	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:#4d9cc8;
	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:#353171;
	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:#353171;
}

/*** 

====================================================================
	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:#353171;
	border-bottom-color:#ffffff;
	color:#353171;
}

.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:#353171;
}

.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: #4d9cc8;
	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:#353171;
}

.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:#353171;
}

.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:#4d9cc8;
	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:#4d9cc8;
}

.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:#4d9cc8;
	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:#353171;
}

.checkout-section .payment-options .option-block .radio-label:after{
	content:'';
	position:absolute;
	top:11px;
	left:4px;
	display:block;
	width:8px;
	height:8px;
	background:#4d9cc8;
	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);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	filter: blur(3px);
	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: #4d9cc8!important;
}
.default-text-box p a.btn {
	color: #fff!important;
}
.iframe-responsive {
	width: 100%;
	max-width: 100%;
	height: 500px;
	box-shadow: 0px 0px 10px #4d9cc8;
	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: #4d9cc8;
}
.main-menu .navigation > li > ul > li.current {
	background: #4d9cc8;
}
.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:#353171;
}
.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;
}
#searchform-type label {
	display: block;
}
.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;
}

/* --- LAYOUT STRUCTURE --- */

/* Робимо так, щоб футер завжди був притиснутий до низу,
   навіть якщо контенту мало */
.journal-app {
	display: flex;
	flex-direction: column;
	min-height: 100vh; /* Висота на весь екран */
	background-color: var(--clr-bg-light); /* Загальний світлий фон */
}

/* Обмежувач ширини (наприклад, 1200px по центру) */
.layout-container {
	width: 100%;
	max-width: var(--container-width);
	margin: 0 auto;
	padding: 0 var(--gap-md); /* Відступи з боків для мобільних */
}

/* --- GRID SYSTEM (Контент + Сайдбар) --- */
.layout-grid {
	display: grid;
	/* Основна магія:
       1fr (вся доступна ширина) для статті
       300px (фіксована ширина) для сайдбару */
	grid-template-columns: 1fr 300px;
	gap: var(--gap-xl); /* Відступ між статтею і сайдбаром */
	margin-top: var(--gap-section);
	margin-bottom: var(--gap-section);
}

/* --- REGIONS STUB (Заглушки для візуалізації структури) --- */

.journal-header {
	background-color: var(--clr-bg-body);
	border-bottom: 1px solid var(--clr-border);
	/* Тіні немає, бо стиль строгий */
}

.content-area {
	background-color: var(--clr-bg-body);
	border: 1px solid var(--clr-border);
	min-height: 400px; /* Тимчасово, щоб бачити блок */
	/* Padding будемо додавати внутрішнім елементам, а не блоку layout */
}

.sidebar-area {
	/* Сайдбар часто роблять прозорим або з окремими картками */
	display: flex;
	flex-direction: column;
	gap: var(--gap-md);
}

.journal-footer {
	margin-top: auto; /* Притискає футер вниз */
	background-color: var(--clr-accent); /* Темно-синій фон */
	color: var(--clr-text-inverse);
	padding: var(--gap-section) 0;
}

/* --- MEDIA QUERIES (Адаптивність) --- */
/* Якщо екран менше 900px, сайдбар падає під контент */
@media (max-width: 900px) {
	.layout-grid {
		grid-template-columns: 1fr; /* Одна колонка */
	}
}

/* --- HEADER: TOP BAR --- */
.header-top-bar {
	background-color: var(--clr-accent); /* Темно-синій */
	color: var(--clr-text-inverse);
	padding: var(--gap-xs) 0;
	font-size: var(--fs-xs);
	font-weight: 500;
}

.top-bar-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.issn-info span {
	margin-right: var(--gap-md);
	opacity: 0.9;
}

.top-utilities {
	display: flex;
	align-items: center;
	gap: var(--gap-md);
}

/* --- HEADER: BRANDING --- */
.header-branding {
	background-color: var(--clr-bg-body);
	padding: var(--gap-lg) 0;
	border-bottom: 1px solid var(--clr-border);
}

.brand-link {
	text-decoration: none;
	color: var(--clr-accent);
}

.journal-title {
	font-family: var(--font-heading);
	font-size: var(--fs-xl);
	margin: 0;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	line-height: 1.2;
}

/* --- HEADER: NAVIGATION --- */
.header-nav-wrapper {
	background-color: var(--clr-primary); /* Головний блакитний */
	border-bottom: 4px solid var(--clr-accent); /* Акцентна лінія знизу */
}

.nav-flex {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.nav-list {
	display: flex;
	list-style: none;
	margin: 0;
	padding: 0;
	gap: 1px; /* Мікро-відступи для розділювачів, якщо треба */
}

.nav-item {
	position: relative;
}

.nav-link,
.nav-link-wrapper {
	display: block;
	padding: var(--gap-md) var(--gap-md);
	color: #ffffff;
	font-weight: 600;
	text-decoration: none;
	font-size: var(--fs-sm);
	text-transform: uppercase;
	cursor: pointer;
	transition: background 0.2s;
}

.nav-link:hover,
.nav-item:hover > .nav-link-wrapper {
	background-color: var(--clr-primary-dark);
}

/* --- DROPDOWNS (Суворі квадрати) --- */
.dropdown-menu {
	position: absolute;
	top: 100%;
	left: 0;
	background-color: #ffffff;
	list-style: none;
	padding: 0;
	margin: 0;
	min-width: 250px;
	box-shadow: var(--shadow-md);
	border: 1px solid var(--clr-accent); /* Темна рамка */
	display: none; /* JS або CSS hover покаже це */
	z-index: 100;
}

/* Показуємо при наведенні (CSS-only рішення) */
.nav-item:hover .dropdown-menu {
	display: block;
}

.dropdown-menu li {
	border-bottom: 1px solid var(--clr-border);
}

.dropdown-menu > li > a {
	padding: 5px 20px;
}

.dropdown-menu li:last-child {
	border-bottom: none;
}

.dropdown-menu a {
	display: block;
	padding: 10px 15px;
	color: var(--clr-text-main);
	font-size: var(--fs-md);
	text-decoration: none;
	transition: background 0.2s;
}

.dropdown-menu a:hover {
	background-color: var(--clr-bg-light);
	color: var(--clr-primary);
	padding-left: 20px; /* Ефект зсуву при наведенні */
}

/* --- BUTTON: SUBMIT (Прямокутна кнопка) --- */
.btn-primary-rect {
	display: inline-block;
	background-color: var(--clr-accent);
	color: #ffffff;
	padding: 10px 24px;
	font-weight: 700;
	text-transform: uppercase;
	font-size: var(--fs-xs);
	letter-spacing: 1px;
	transition: all 0.2s;
	border: 1px solid var(--clr-accent);
}

.btn-primary-rect:hover {
	background-color: #ffffff;
	color: var(--clr-accent);
	text-decoration: none;
}

/* --- MOBILE TOGGLE (Базовий стиль) --- */
.mobile-menu-btn {
	display: none;
	background: none;
	border: none;
	cursor: pointer;
}

/* Адаптивність */
@media (max-width: 992px) {
	.journal-title {
		font-size: var(--fs-md);
	}

	.mobile-menu-btn {
		display: block;
		color: white;
	}

	.journal-nav {
		display: none; /* Треба буде JS для відкриття */
		position: absolute;
		top: 100%;
		left: 0;
		width: 100%;
		background-color: var(--clr-primary);
	}

	.nav-list {
		flex-direction: column;
	}

	.dropdown-menu {
		position: static;
		box-shadow: none;
		border: none;
		background-color: rgba(0,0,0,0.1);
	}

	.header-cta {
		display: none; /* На мобільному можна сховати або перенести в меню */
	}
}

/* --- LANGUAGE WIDGET --- */

/* Контейнер: потрібен для position: relative, щоб список "прилип" до нього */
.lang-widget-wrapper {
	position: relative;
	display: inline-block;
	height: 100%;
}

/* Кнопка вибору (видима частина) */
.selected-btn {
	display: flex;
	align-items: center;
	gap: 8px; /* Відступ між текстом і стрілкою */
	cursor: pointer;
	color: rgba(255, 255, 255, 0.85); /* Трохи приглушений білий */
	font-family: var(--font-main);
	font-size: var(--fs-xs);
	font-weight: 500;
	text-transform: uppercase;
	padding: 5px 10px;
	border: 1px solid transparent; /* Резервуємо місце під рамку */
	transition: all 0.2s ease;
}

/* Ховер на кнопку */
.lang-widget-wrapper:hover .selected-btn {
	background-color: rgba(255, 255, 255, 0.1);
	color: #ffffff;
	border: 1px solid rgba(255, 255, 255, 0.2); /* Тонка рамка при наведенні */
}

/* Анімація стрілки */
.selected-btn .icon {
	font-size: 10px;
	transition: transform 0.2s ease;
}

/* Повертаємо стрілку при наведенні */
.lang-widget-wrapper:hover .selected-btn .icon {
	transform: rotate(180deg);
}

/* --- ВИПАДАЮЧИЙ СПИСОК --- */
.lang-list {
	display: none; /* Приховано за замовчуванням */
	position: absolute;
	top: 100%;    /* Одразу під кнопкою */
	right: 0;     /* Вирівнювання по правому краю */
	min-width: 140px;
	background-color: #ffffff;
	list-style: none;
	padding: 0;
	margin: 0;
	z-index: 1000;

	/* Строгий стиль рамки */
	border: 1px solid var(--clr-accent);
	border-top: none; /* Щоб не дублювати лінію, якщо стикається щільно */
	box-shadow: var(--shadow-md);
}

/* Показуємо список при наведенні на контейнер */
.lang-widget-wrapper:hover .lang-list {
	display: block;
}

/* Елементи списку */
.lang-list li {
	border-bottom: 1px solid var(--clr-border);
	margin: 0;
}

.lang-list li:last-child {
	border-bottom: none;
}

/* Посилання в списку */
.lang-list a {
	display: block;
	padding: 10px 15px;
	color: var(--clr-text-main);
	font-size: var(--fs-xs);
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 500;
	transition: background 0.2s, color 0.2s;
}

/* Ховер на елемент списку */
.lang-list a:hover {
	background-color: var(--clr-bg-light);
	color: var(--clr-primary);
	padding-left: 20px; /* Ефект мікро-зсуву вправо */
}

/* --- HEADER SEARCH FORM (FIXED) --- */

/* 1. Жорстко задаємо розміри контейнера форми */
.header-search {
	height: 32px; /* Фіксована висота для всього блоку */
	display: flex;
	align-items: center;
}

/* 2. Налаштування самої форми і скидання відступів Yii2 */
.header-search form {
	display: flex;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	gap: 25px;
}

/* 3. Скидання обгорток Yii2 (.form-group) */
.header-search .form-group {
	margin: 0 !important;
	padding: 0 !important;
	display: flex; /* Щоб інпут всередині розтягувався */
	flex-grow: 1;  /* Займає всю вільну ширину */
}

/* 5. Стилізація поля вводу */
.header-search input[type="text"],
.header-search input[type="search"],
.header-search .form-control { /* Клас Bootstrap, якщо є */
	height: 100% !important;   /* На всю висоту батька */
	border-radius: 0 !important;
	border: none !important;   /* Прибираємо рамки */
	box-shadow: none !important;
	background-color: #ffffff;
	color: var(--clr-text-main);
	font-size: var(--fs-xs);
	padding: 0 12px;
	margin: 0;
	width: 100%;
	min-width: 200px; /* Мінімальна ширина */
}

/* 6. Стилізація кнопки */
.header-search button,
.header-search input[type="submit"] {
	height: 100% !important;   /* На всю висоту батька */
	border-radius: 0 !important;
	border: none !important;
	background-color: var(--clr-primary);
	color: #ffffff;
	padding: 0 15px;
	margin: 0;
	cursor: pointer;
	line-height: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.2s;
}

.header-search button:hover {
	background-color: var(--clr-primary-dark);
}

/* Вирівнювання іконки всередині кнопки */
.header-search button i,
.header-search button span {
	vertical-align: middle;
}

/* --- ЗАГАЛЬНІ СТИЛІ ПОМИЛОК (Yii2 ActiveForm) --- */

/* 1. Контейнер з помилкою */
.form-group.has-error {
	margin-bottom: var(--gap-md); /* Зберігаємо відступи */
}

/* 2. Поле вводу при помилці */
.form-group.has-error .form-control,
.form-group.has-error input[type="text"],
.form-group.has-error input[type="password"],
.form-group.has-error textarea {
	border-color: var(--clr-error) !important;
	background-color: var(--clr-bg-error) !important;
	color: var(--clr-error) !important;
	/* Прибираємо стандартне світіння bootstrap/browser */
	box-shadow: none !important;
}

/* 3. Текст помилки (.help-block) */
.form-group.has-error .help-block {
	color: var(--clr-error);
	font-size: var(--fs-xs);
	font-family: var(--font-main);
	margin-top: 4px;
	margin-bottom: 0;
	font-weight: 500;
	display: block;
}

/* --- СПЕЦИФІКА ДЛЯ ХЕДЕРА (.header-search) --- */

/* У хедері місця мало (32px висоти).
   Якщо вилізе текст помилки — верстка "поїде".
   Тому там ми тільки червонимо рамку.
*/

.header-search .has-error input {
	border: 2px solid var(--clr-error) !important; /* Товстіша рамка, щоб помітили */
	background-color: var(--clr-bg-error) !important;
	color: var(--clr-text-main) !important;
}

/* Примусово ховаємо текст помилки саме в хедері, навіть якщо є помилка */
.header-search .has-error .help-block {
	display: none !important;
}

/* --- FOOTER STYLES --- */

.journal-footer {
	background-color: var(--clr-accent); /* Темно-синій фон */
	color: var(--clr-text-inverse);      /* Білий текст */
	padding: var(--gap-section) 0;       /* Великі відступи зверху/знизу */
	border-top: 4px solid var(--clr-primary); /* Блакитна лінія зверху */
	margin-top: auto; /* Sticky footer (притискає до низу) */
}

/* Сітка футера: 2 колонки */
.footer-grid {
	display: grid;
	grid-template-columns: 1.2fr 0.8fr; /* Назва ширша, контакти вужчі */
	gap: var(--gap-xl);
	align-items: start;
}

/* --- ЛІВА КОЛОНКА (Брендинг) --- */
.footer-journal-title {
	font-family: var(--font-heading);
	font-size: var(--fs-lg);
	font-weight: 700;
	line-height: 1.3;
	margin-bottom: var(--gap-md);
	color: #ffffff;
	text-transform: uppercase;
	letter-spacing: 0.5px;
}

.footer-issn {
	font-family: var(--font-main);
	font-size: var(--fs-sm);
	opacity: 0.7;
	margin-bottom: var(--gap-lg);
	font-weight: 500;
	display: flex;
	flex-direction: column;
}

.footer-copyright {
	font-size: var(--fs-xs);
	opacity: 0.5;
	padding-top: var(--gap-lg);
	border-top: 1px solid rgba(255,255,255, 0.1); /* Тонка лінія розділювач */
	max-width: 400px;
}

/* --- ПРАВА КОЛОНКА (Контакти) --- */
.footer-contacts {
	display: flex;
	flex-direction: column;
	gap: var(--gap-lg); /* Відступ між Адресою та Email */
}

.contact-block {
	display: flex;
	gap: var(--gap-md);
	align-items: flex-start;
}

/* Стиль іконки */
.contact-icon {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	background-color: rgba(255,255,255, 0.1); /* Напівпрозорий квадрат */
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	color: var(--clr-primary); /* Блакитна іконка */
	/* border-radius: 0; -> Вже за замовчуванням 0, але для певності */
}

.contact-text {
	font-family: var(--font-main);
}

.contact-label {
	display: block;
	text-transform: uppercase;
	font-size: var(--fs-xs);
	font-weight: 700;
	color: var(--clr-primary); /* Заголовки (Адреса, Email) блакитні */
	margin-bottom: 4px;
}

.contact-text p {
	margin: 0;
	font-size: var(--fs-sm);
	color: rgba(255,255,255, 0.9);
	line-height: 1.5;
}

/* --- АДАПТИВНІСТЬ --- */
@media (max-width: 768px) {
	.footer-grid {
		grid-template-columns: 1fr; /* Одна колонка на мобільному */
		gap: var(--gap-section);
	}

	.footer-journal-title {
		font-size: var(--fs-md);
	}
}

/* --- MAIN CONTENT WRAPPER --- */

.main-content-section {
	background-color: var(--clr-bg-light); /* Світло-сірий фон навколо */
	padding: var(--gap-section) 0;         /* Відступи зверху/знизу від хедера/футера */
	min-height: 60vh;                      /* Щоб футер не "стрибав" на пустих сторінках */
}

.content-wrapper {
	background-color: #ffffff;             /* Білий фон контенту */
	border: 1px solid var(--clr-border);   /* Тонка сіра рамка */
	padding: var(--gap-xl);                /* Внутрішні відступи (32px), щоб контент не лип до країв */
	width: 100%;                           /* Займає всю доступну ширину контейнера */

	/* Геометрія */
	border-radius: 0;                      /* СТРОГО: Прямі кути */
	box-shadow: var(--shadow-sm);          /* Легка тінь для об'єму (можна прибрати для плоского дизайну) */
}

/* --- БАЗОВА ТИПОГРАФІКА ВСЕРЕДИНІ (Щоб текст не виглядав зламаним) --- */

/* Ці стилі застосуються до тексту, якщо він не обгорнутий у специфічні класи */
.content-wrapper h1,
.content-wrapper h2,
.content-wrapper h3 {
	color: var(--clr-accent);
	font-family: var(--font-heading);
	margin-top: 0;
}

.content-wrapper p {
	margin-bottom: 1rem;
	color: var(--clr-text-main);
}

/* Адаптивність */
@media (max-width: 768px) {
	.content-wrapper {
		padding: var(--gap-md); /* Менші відступи на мобільному (16px) */
	}

	.main-content-section {
		padding: var(--gap-lg) 0; /* Менші відступи секції */
	}
}

/* --- RADICAL GRID LAYOUT --- */

/* 1. Сітка сторінки */
.journal-home-grid {
	display: grid;
	/* Ліва колонка фіксована (360px), права займає все інше */
	grid-template-columns: 360px 1fr;
	gap: 60px; /* Великий простір між колонками (повітря) */
	align-items: start; /* Вирівнювання по верху */
}

/* --- LEFT SIDEBAR (Sticky Card) --- */
.home-sidebar {
	position: relative;
	/* Це робить колонку "липкою" при скролі */
	height: 100%;
}

.sidebar-sticky-content {
	position: sticky;
	top: 40px; /* Відступ від верху екрану при скролі */
	border: 1px solid var(--clr-border);
	background-color: #fff;
	padding: 30px;
	/* Строгий стиль */
	border-radius: 0;
	box-shadow: var(--shadow-md);
}

/* Картка випуску */
.card-header {
	margin-bottom: 20px;
	border-bottom: 2px solid var(--clr-primary);
	padding-bottom: 10px;
}

.badge-new {
	background-color: var(--clr-accent);
	color: #fff;
	padding: 4px 12px;
	font-size: var(--fs-xs);
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
}

.issue-cover-frame {
	margin-bottom: 25px;
	background-color: var(--clr-bg-light);
	padding: 10px; /* Ефект паспарту */
	border: 1px solid var(--clr-border);
}

.cover-img {
	width: 100%;
	height: auto;
	display: block;
	border: 1px solid rgba(0,0,0,0.1);
}

/* Мета-дані (ISSN) */
.issue-meta {
	margin-bottom: 25px;
	font-family: var(--font-main);
	font-size: var(--fs-sm);
	color: var(--clr-text-secondary);
	border-bottom: 1px solid var(--clr-border);
	padding-bottom: 20px;
}

.meta-row {
	display: flex;
	justify-content: space-between;
	margin-bottom: 8px;
}

/* Кнопки в сайдбарі */
.issue-actions {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.btn-primary-block,
.btn-secondary-block {
	display: block;
	text-align: center;
	padding: 12px;
	text-transform: uppercase;
	font-weight: 700;
	font-size: var(--fs-xs);
	text-decoration: none;
	transition: all 0.2s;
	border: 1px solid transparent;
}

.btn-primary-block {
	background-color: var(--clr-primary);
	color: #fff;
}
.btn-primary-block:hover {
	background-color: var(--clr-primary-dark);
	color: #fff;
}

.btn-secondary-block {
	background-color: transparent;
	border-color: var(--clr-accent);
	color: var(--clr-accent);
}
.btn-secondary-block:hover {
	background-color: var(--clr-accent);
	color: #fff;
}

/* --- RIGHT MAIN CONTENT (Editorial Style) --- */

.content-header {
	margin-bottom: 40px;
}

.main-title {
	font-family: var(--font-heading);
	font-size: var(--fs-xxl); /* Великий заголовок */
	color: var(--clr-accent);
	line-height: 1.2;
	margin-bottom: 20px;
}

.title-decoration {
	width: 100px;
	height: 6px;
	background-color: var(--clr-primary);
}

/* Типографіка тексту (editorial) */
.editorial-text {
	font-family: var(--font-heading); /* Serif для основного тексту, як у книзі */
	font-size: 1.125rem; /* Трохи більший шрифт (18px) */
	line-height: 1.8;
	color: var(--clr-text-main);
	text-align: justify;
}

/* Відступи для абзаців з адмінки */
.editorial-text p {
	margin-bottom: 1.5em;
}

/* АДАПТИВНІСТЬ */
@media (max-width: 900px) {
	.journal-home-grid {
		grid-template-columns: 1fr; /* Одна колонка */
		gap: 40px;
	}

	.home-sidebar {
		order: -1; /* Сайдбар зверху */
		height: auto;
	}

	.sidebar-sticky-content {
		position: static; /* На мобільному не липне */
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.issue-cover-frame {
		max-width: 200px; /* Менша картинка на мобільному */
		margin: 0 auto 20px auto;
	}
}

/* --- ARCHIVE PAGE STYLES --- */

.archive-main-section {
	min-height: 80vh;
}

.archive-header {
	margin-bottom: var(--gap-xl);
	border-bottom: 1px solid var(--clr-border);
	padding-bottom: var(--gap-md);
}

/* --- YEAR DIVIDER (Рок) --- */
.year-shelf-section {
	margin-bottom: 60px; /* Відступ між роками */
}

.year-divider {
	display: flex;
	align-items: center;
	margin-bottom: var(--gap-lg);
}

.year-number {
	font-family: var(--font-heading);
	font-size: var(--fs-xxl); /* Дуже великий рік (наприклад, 40px) */
	font-weight: 700;
	color: var(--clr-primary); /* Блакитний колір року */
	margin-right: var(--gap-md);
	line-height: 1;
}

.year-line {
	flex-grow: 1;
	height: 1px;
	background-color: var(--clr-border); /* Лінія на всю ширину */
}

/* --- ISSUES GRID (Сітка карток) --- */
.issues-grid {
	display: grid;
	/* Автоматична сітка: картки не менше 220px шириною */
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: var(--gap-lg); /* 24px відступ між картками */
}

/* --- ISSUE CARD (Картка) --- */
.issue-card {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	border: 1px solid var(--clr-border);
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	height: 100%; /* Щоб всі картки в ряду були однакової висоти */
}

/* Ефект при наведенні на картку */
.issue-card:hover {
	border-color: var(--clr-primary);
	transform: translateY(-4px); /* Легкий підйом вгору */
	box-shadow: var(--shadow-md);
	text-decoration: none; /* Прибираємо підкреслення */
}

/* Обкладинка */
.card-cover-wrapper {
	padding: 20px;
	background-color: #f9f9f9;
	border-bottom: 1px solid var(--clr-border);
	display: flex;
	justify-content: center;
	align-items: center;
}

.card-cover-img {
	max-width: 100%;
	height: auto;
	max-height: 240px; /* Обмеження висоти обкладинки */
	box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* Тінь тільки для книжки */
	/* Важливо: зберігаємо пропорції */
	object-fit: contain;
}

/* Тіло картки */
.card-body {
	padding: 15px;
	display: flex;
	flex-direction: column;
	flex-grow: 1; /* Розтягує цей блок, щоб футер притиснувся вниз */
}

.issue-card:hover .card-title {
	color: var(--clr-primary); /* Заголовок синіє при наведенні */
}

/* Мета-дані (статистика) */
.card-meta {
	margin-top: auto; /* Притискає статистику до низу картки */
	display: flex;
	gap: 15px;
	padding-top: 10px;
	border-top: 1px solid var(--clr-bg-light);
	color: var(--clr-text-secondary);
	font-size: var(--fs-xs);
	font-family: var(--font-main);
}

.meta-item {
	display: flex;
	align-items: center;
	gap: 6px;
}

.meta-item .fa {
	color: var(--clr-primary); /* Іконки блакитні */
}

.meta-item.disabled {
	opacity: 0.4;
}

.meta-value {
	font-weight: 600;
}

/* Адаптивність */
@media (max-width: 600px) {
	.issues-grid {
		grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); /* Менші картки на мобільному */
		gap: var(--gap-md);
	}

	.card-cover-wrapper {
		padding: 10px;
	}
}

/* --- ISSUE PAGE GRID --- */
.issue-archive-grid {
	display: grid;
	grid-template-columns: 300px 1fr; /* Фіксований сайдбар, гнучкий контент */
	gap: 60px;
	align-items: stretch;
}

/* --- SIDEBAR (PASSPORT) --- */
.issue-passport {
	/* Сайдбар займає всю висоту сітки, але фон прозорий (білий) */
	height: 100%;
	border-right: 1px solid var(--clr-border); /* Розділювач праворуч замість рамки навколо */
	padding-right: 20px; /* Відступ від лінії розділювача */
}

/* --- STICKY BLOCK (Внутрішній блок, що липне) --- */
.passport-sticky {
	/* Магія липкості */
	position: -webkit-sticky; /* Для Safari */
	position: sticky;
	top: 50px; /* Відступ від верху екрану, коли елемент залипає */

	/* Якщо сайдбар вищий за екран, додаємо скрол всередині нього */
	max-height: calc(100vh - 40px);
	overflow-y: auto;

	/* Стиль */
	background-color: #fff;
}

.passport-cover {
	margin-bottom: 20px;
	border: 1px solid var(--clr-border);
	padding: 5px; /* Рамка */
	background-color: var(--clr-bg-light);
}

.passport-cover img {
	display: block;
	width: 100%;
	height: auto;
}

/* Metadata Table Look */
.passport-data {
	margin-bottom: 20px;
	font-size: var(--fs-sm);
	border-top: 1px solid var(--clr-border);
}

.data-row {
	display: flex;
	justify-content: space-between;
	padding: 10px 0;
	border-bottom: 1px solid var(--clr-border);
}

.data-row .lbl {
	font-weight: 600;
	color: var(--clr-text-secondary);
}

.data-row .val {
	color: var(--clr-text-main);
	text-align: right;
}

.data-row .link {
	color: var(--clr-primary);
	text-decoration: underline;
}

/* Stats Block */
.passport-stats {
	display: flex;
	justify-content: space-around;
	background-color: var(--clr-bg-light);
	padding: 15px 0;
	margin-bottom: 20px;
	border: 1px solid var(--clr-border);
}

.stat-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	color: var(--clr-accent);
}

.stat-num {
	font-weight: 700;
	font-size: var(--fs-md);
	line-height: 1.2;
}

.stat-lbl {
	font-size: 10px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
}

/* Button */
.btn-primary-rect.full-width {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	width: 100%;
	text-align: center;
}

/* --- MAIN CONTENT --- */

.issue-main-title {
	font-family: var(--font-heading);
	font-size: var(--fs-xl);
	color: var(--clr-accent);
	margin-top: 0;
	margin-bottom: 20px;
}

.issue-description {
	margin-bottom: 40px;
	color: var(--clr-text-secondary);
}

/* Section Divider */
.section-divider {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}

.divider-label {
	font-size: var(--fs-lg);
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--clr-text-main);
	margin-right: 15px;
	white-space: nowrap;
}

.divider-line {
	flex-grow: 1;
	height: 4px; /* Жирна лінія */
	background-color: var(--clr-primary);
}

/* --- ARTICLES REGISTRY (LIST) --- */

.registry-item {
	background-color: #fff;
	border: 1px solid var(--clr-border);
	padding: 25px;
	margin-bottom: -1px; /* Щоб границі зливалися (collapsed borders) */
	transition: background-color 0.2s;
}

.registry-item:hover {
	background-color: #fcfcfc;
	border-color: var(--clr-primary); /* Підсвітка рамки при наведенні */
	z-index: 1; /* Піднімаємо над сусідами */
	position: relative;
}

/* Top Meta */
.item-top-meta {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	margin-bottom: 10px;
}

.access-badge.open { color: #2e7d32; font-weight: 700; }
.access-badge.closed { color: var(--clr-text-secondary); opacity: 0.5; }

/* Title & Authors */
.item-title {
	font-family: var(--font-heading);
	font-size: var(--fs-md);
	margin: 0 0 8px 0;
}

.item-title a {
	color: var(--clr-accent);
	text-decoration: none;
}

.item-title a:hover {
	color: var(--clr-primary);
}

.item-authors {
	font-family: var(--font-main);
	color: var(--clr-text-main);
	font-size: var(--fs-sm);
	margin-bottom: 15px;
}

.author-link {
	color: var(--clr-text-main);
	border-bottom: 1px dotted var(--clr-text-secondary);
}

/* Tech Info Row */
.item-tech-info {
	display: flex;
	gap: 20px;
	font-size: var(--fs-xs);
	color: var(--clr-text-secondary);
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 1px solid var(--clr-bg-light);
}

.tech-doi a { color: var(--clr-primary); }

/* Actions Bar */
.item-actions-bar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
}

.actions-left {
	display: flex;
	gap: 15px;
}

/* Details/Summary styling (HTML5 Accordion) */
.meta-details summary {
	cursor: pointer;
	font-size: var(--fs-xs);
	font-weight: 600;
	color: var(--clr-primary);
	list-style: none; /* Ховаємо стандартний трикутник */
	user-select: none;
}

.meta-details summary:hover {
	text-decoration: underline;
}

/* Кастомний контент, що випадає */
.details-content {
	margin-top: 10px;
	padding: 10px;
	background-color: var(--clr-bg-light);
	border: 1px solid var(--clr-border);
	font-size: var(--fs-xs);
	color: var(--clr-text-main);
}

.citation-box {
	font-family: monospace; /* Для цитування часто зручніше моноширинний */
}

/* Кнопки */
.actions-right {
	display: flex;
	gap: 10px;
}

.btn-text {
	font-size: var(--fs-xs);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	padding: 6px 12px;
}

.btn-pdf-ghost {
	font-size: var(--fs-xs);
	font-weight: 700;
	text-transform: uppercase;
	color: var(--clr-error); /* PDF червонуватий колір, або Primary */
	border: 1px solid var(--clr-border);
	padding: 6px 12px;
	transition: all 0.2s;
}

.btn-pdf-ghost:hover {
	border-color: var(--clr-error);
	background-color: var(--clr-error);
	color: #fff;
	text-decoration: none;
}

/* MOBILE */
@media (max-width: 900px) {
	.issue-archive-grid {
		grid-template-columns: 1fr;
	}

	.passport-sticky {
		position: static;
	}

	.item-actions-bar {
		flex-direction: column;
		align-items: flex-start;
	}
}

.passport-data,
.passport-stats {
	border: none;
	border-bottom: 1px solid var(--clr-border);
	padding: 15px 0;
	margin: 0;
	background-color: transparent; /* Ніякого сірого фону */
}

.passport-cover {
	border: 1px solid var(--clr-border);
	padding: 5px;
	margin-bottom: 20px;
	background-color: #fff; /* Білий фон під картинкою */
}

/* --- MOBILE ADAPTATION --- */
@media (max-width: 900px) {
	.issue-archive-grid {
		grid-template-columns: 1fr;
		padding-top: 10px;
		gap: 30px;
	}

	.issue-passport {
		border-right: none; /* Прибираємо лінію збоку */
		border-bottom: 1px solid var(--clr-border); /* Додаємо лінію знизу */
		padding-right: 0;
		padding-bottom: 30px;
		height: auto;
	}

	.passport-sticky {
		position: static; /* На мобільному не липне */
		max-height: none;
	}
}

/* --- ARTICLE HEADER HERO --- */
.article-header-section {
	background-color: var(--clr-accent); /* Темно-синій, як у футера */
	color: #ffffff;
	padding: 20px 0;
	margin-bottom: 40px; /* Відступ до контенту */
	border-bottom: 4px solid var(--clr-primary);
}

.article-badges {
	display: flex;
	gap: 15px;
	margin-bottom: 20px;
	font-size: var(--fs-xs);
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
}

.article-type {
	color: var(--clr-primary);
}

.access-badge.open {
	color: #4caf50; /* Зелений для Open Access */
	background-color: rgba(255,255,255,0.1);
	padding: 2px 8px;
}

.article-main-title {
	font-family: var(--font-heading);
	font-size: 2.5rem; /* Великий заголовок */
	line-height: 1.2;
	margin: 0 0 20px 0;
	color: #ffffff;
}

.article-authors-block {
	font-family: var(--font-main);
	font-size: var(--fs-md);
	margin-bottom: 25px;
	line-height: 1.6;
}

.author-name {
	color: #ffffff;
	text-decoration: none;
	border-bottom: 1px dotted rgba(255,255,255,0.5);
	margin-right: 5px;
}
.author-name:hover {
	color: var(--clr-primary);
	border-bottom-color: var(--clr-primary);
}

.article-meta-line {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	font-size: var(--fs-sm);
	color: rgba(255,255,255, 0.7);
	border-top: 1px solid rgba(255,255,255, 0.1);
	padding-top: 15px;
}

.meta-item a { color: #fff; text-decoration: underline; }

/* --- PAGE GRID --- */
.article-page-grid {
	display: grid;
	/* 1fr (Контент) + 320px (Сайдбар) */
	grid-template-columns: 1fr 320px;
	gap: 60px;
	max-width: var(--container-width);
	margin: 0 auto;
	align-items: start;
}

/* --- MAIN CONTENT (LEFT) --- */
.article-section {
	margin-bottom: 50px;
	padding-bottom: 30px;
	border-bottom: 1px solid var(--clr-border);
	text-align: justify;
}
.article-section:last-child { border-bottom: none; }

.section-heading {
	font-family: var(--font-heading);
	color: var(--clr-accent);
	font-size: var(--fs-xl);
	margin-bottom: 20px;
	position: relative;
	display: inline-block;
}
/* Декоративний квадрат під заголовком */
.section-heading::after {
	content: '';
	display: block;
	width: 40px;
	height: 3px;
	background-color: var(--clr-primary);
	margin-top: 8px;
}

/* Ключові слова */
.mini-heading {
	font-size: var(--fs-sm);
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	margin-bottom: 10px;
}
.keywords-list {
	font-style: italic;
	color: var(--clr-text-main);
}

/* REFERENCES STYLING (Bibliography style) */
.references-list {
	font-size: var(--fs-sm);
}

/* Робимо висячий відступ для літератури (Hanging Indent) */
.references-list p,
.references-list div,
.references-list li {
	padding-left: 2em;
	margin-bottom: 0.8em;
	line-height: 1.5;
}

/* --- SIDEBAR (RIGHT) --- */
.sidebar-sticky-wrapper {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.sidebar-card {
	background-color: #fff;
	border: 1px solid var(--clr-border);
	padding: 20px;
}

.card-title {
	font-family: var(--font-heading);
	font-size: var(--fs-md);
	color: var(--clr-accent);
	margin-bottom: 15px;
	font-weight: 700;
	border-bottom: 1px solid var(--clr-bg-light);
	padding-bottom: 10px;
}

/* Action Buttons */
.action-buttons {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.btn-secondary-rect.full-width {
	display: block;
	width: 100%;
	text-align: center;
	padding: 12px;
	border: 1px solid var(--clr-accent);
	color: var(--clr-accent);
	font-weight: 700;
	text-transform: uppercase;
	font-size: var(--fs-xs);
	transition: 0.2s;
}
.btn-secondary-rect.full-width:hover {
	background-color: var(--clr-accent);
	color: #fff;
	text-decoration: none;
}

/* Journal Info */
.journal-name-link {
	font-family: var(--font-heading);
	font-size: var(--fs-md);
	font-weight: 700;
	color: var(--clr-primary);
	display: block;
	margin-bottom: 5px;
	line-height: 1.3;
}
.journal-details {
	font-size: var(--fs-sm);
	color: var(--clr-text-secondary);
}

/* History List */
.history-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.history-list li {
	display: flex;
	justify-content: space-between;
	font-size: var(--fs-xs);
	padding: 5px 0;
	border-bottom: 1px solid var(--clr-bg-light);
}
.history-list .lbl { color: var(--clr-text-secondary); }
.history-list .val { font-weight: 600; color: var(--clr-text-main); }

/* Citation Tool styling overrides */
.citation-tool {
	font-size: var(--fs-xs);
	word-break: break-word;
}

/* MOBILE ADAPTATION */
@media (max-width: 900px) {
	.article-page-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.article-main-title {
		font-size: 1.8rem;
	}

	.sidebar-sticky-wrapper {
		position: static;
	}

	/* Move sidebar below content or above? Usually Actions go first on mobile */
	.article-sidebar {
		order: -1; /* Actions first */
	}
	.info-card, .citation-card, .history-card {
		order: 10; /* Less important info later */
	}
}

/* Явно вказуємо, що будь-який H1 всередині цього блоку має бути білим */
.article-header-section h1,
.article-header-section .article-main-title {
	color: #ffffff !important; /* !important гарантує, що глобальний стиль перекриється */
	font-family: var(--font-heading);
	font-size: 2.5rem;
	line-height: 1.2;
	margin: 0 0 20px 0;
}

.article-badges {
	display: flex;
	gap: 15px;
	margin-bottom: 20px;
	font-size: var(--fs-xs);
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 1px;
}

/* Колір бейджів теж треба контролювати на темному фоні */
.article-type {
	color: var(--clr-primary); /* Світло-блакитний добре видно на темному */
}

.access-badge.open {
	color: #4caf50;
	background-color: rgba(255,255,255,0.1);
	padding: 2px 8px;
}

/* Автори на темному фоні */
.article-authors-block {
	font-family: var(--font-main);
	font-size: var(--fs-md);
	margin-bottom: 25px;
	line-height: 1.6;
}

/* Мета-дані (DOI, Дата) */
.article-meta-line {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	font-size: var(--fs-sm);
	color: rgba(255,255,255, 0.7); /* Напівпрозорий білий */
	border-top: 1px solid rgba(255,255,255, 0.1);
	padding-top: 15px;
}

.meta-item a {
	color: #ffffff;
	text-decoration: underline;
}

.meta-item a:hover {
	color: var(--clr-primary);
}

/* --- STATIC PAGES (Policies, About, etc.) --- */

.static-page-section {
	background-color: #ffffff; /* Чистий білий фон */
}
/* Заголовок сторінки */
.page-header {
	margin-top: 0;
	margin-bottom: 40px;
	border-bottom: 4px solid var(--clr-primary); /* Акцентна лінія */
	padding-bottom: 10px;
}

.page-title {
	font-family: var(--font-heading);
	font-size: 2.5rem; /* ~40px */
	color: var(--clr-accent);
	margin: 0;
	line-height: 1.2;
}

/* --- STATIC PAGES --- */

.static-page-section {
	background-color: #ffffff;
}

.page-title {
	font-family: var(--font-heading);
	font-size: 2.5rem;
	color: var(--clr-accent);
	margin: 0;
	line-height: 1.2;
}

/* --- JOURNAL TYPOGRAPHY (GLOBAL CONTENT STYLES) --- */
/* Цей клас застосовується до блоків з контентом: статті, сторінки "Про нас" тощо */

.journal-typography {
	font-family: var(--font-main);
	color: var(--clr-text-main);
	font-size: 1rem; /* 16px */
	line-height: 1.75; /* Комфортний інтервал для читання */
	text-align: justify; /* Академічний стандарт */
}

/* --- ЗАГОЛОВКИ (H1-H6) --- */
.journal-typography h1,
.journal-typography h2,
.journal-typography h3,
.journal-typography h4,
.journal-typography h5,
.journal-typography h6 {
	font-family: var(--font-heading);
	color: var(--clr-accent);
	font-weight: 700;
	margin-top: 1.8em;
	margin-bottom: 0.8em;
	line-height: 1.3;
}

/* Перший елемент не повинен мати відступу зверху */
.journal-typography > *:first-child {
	margin-top: 0;
}

.journal-typography h2 {
	font-size: 1.75rem;
	border-bottom: 1px solid var(--clr-border); /* Розділювач секцій */
	padding-bottom: 0.3em;
}

.journal-typography h3 {
	font-size: 1.4rem;
}

.journal-typography h4 {
	font-size: 1.2rem;
	text-transform: uppercase; /* Для підзаголовків */
	letter-spacing: 0.5px;
}

/* --- ТЕКСТ ТА ПОСИЛАННЯ --- */
.journal-typography p {
	margin-bottom: 1.5em;
}

.journal-typography a {
	color: var(--clr-primary);
	text-decoration-skip-ink: auto; /* Покращує читабельність підкреслення */
}

.journal-typography a:hover {
	color: var(--clr-accent);
}

.journal-typography strong,
.journal-typography b {
	font-weight: 700;
	color: #000; /* Чорніший для контрасту */
}
/* Невпорядкований список (Bullets) */
.journal-typography ul {
	/* СТРОГИЙ СТИЛЬ: Тільки квадрати, жодних кругів */
	list-style-type: square;
}

/* Вкладені списки (рівень 2) */
.journal-typography ul ul,
.journal-typography ol ul,
.journal-typography ul ol,
.journal-typography ol ol {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	padding-left: 25px; /* Більший відступ для вкладеності */
	font-size: 0.95em;  /* Трохи менший шрифт */
}

/* Вкладений bullet теж робимо квадратним (або можна пустим квадратом) */
.journal-typography ul ul {
	list-style-type: square;
	/* Можна зробити list-style-type: disclosure-closed; для трикутничка, якщо браузер підтримує */
}

/* --- ТАБЛИЦІ (TABLES) --- */
/* Наукові таблиці мають бути чіткими */
.journal-typography table {
	width: 100%;
	max-width: 100%;
	border-collapse: collapse; /* Склеюємо рамки */
	margin: 2em 0;
	font-size: 0.9em; /* Трохи менший шрифт для даних */
	font-family: var(--font-main);
}

.journal-typography th,
.journal-typography td {
	padding: 12px 15px;
	border: 1px solid var(--clr-border);
	text-align: left;
	vertical-align: top;
}

/* Шапка таблиці */
.journal-typography th {
	background-color: var(--clr-accent);
	color: #ffffff;
	font-weight: 600;
	text-transform: uppercase;
	font-size: 0.85em;
	letter-spacing: 0.5px;
	border-color: var(--clr-accent);
}

/* Зебра (смугасті рядки) для кращого сприйняття даних */
.journal-typography tr:nth-child(even) {
	background-color: #f8f9fa; /* Дуже світлий сірий */
}

.journal-typography tr:hover {
	background-color: rgba(77, 156, 200, 0.05); /* Підсвітка при наведенні */
}

/* Якщо таблиця занадто широка (для мобільних) */
.table-responsive {
	overflow-x: auto;
	margin-bottom: 1.5em;
	border: 1px solid var(--clr-border);
}

/* --- ЗОБРАЖЕННЯ (IMAGES) --- */
.journal-typography img {
	max-width: 100%;
	height: auto;
	border: 1px solid var(--clr-border); /* Рамка для фото */
	margin: 1.5em 0;
	display: inline-block;
}

/* Вирівнювання, які часто дає адмінка (alignleft, alignright) */
.journal-typography .alignleft {
	float: left;
	margin-right: 20px;
	margin-bottom: 20px;
}

.journal-typography .alignright {
	float: right;
	margin-left: 20px;
	margin-bottom: 20px;
}

.journal-typography .aligncenter {
	display: block;
	margin: 0 auto 20px auto;
}

/* Підписи до фото (Figcaption) */
.journal-typography figcaption {
	font-size: 0.85em;
	color: var(--clr-text-secondary);
	text-align: center;
	margin-top: -1em;
	margin-bottom: 2em;
	font-style: italic;
}

/* --- ЦИТАТИ (BLOCKQUOTES) --- */
.journal-typography blockquote {
	margin: 2em 0;
	padding: 1em 20px 1em 30px;
	border-left: 5px solid var(--clr-primary); /* Акцентна лінія зліва */
	background-color: #f9f9f9;
	font-family: var(--font-heading);
	font-style: italic;
	color: #555;
	position: relative;
}

/* Декоративна лапка (за бажанням) */
.journal-typography blockquote::before {
	content: '\201C'; /* Відкриваюча лапка */
	font-family: serif;
	font-size: 4em;
	color: rgba(0,0,0,0.1);
	position: absolute;
	left: 5px;
	top: -10px;
}

/* --- ДОДАТКОВІ ЕЛЕМЕНТИ --- */

/* Лінія (HR) */
.journal-typography hr {
	border: 0;
	border-top: 1px solid var(--clr-border);
	margin: 3em 0;
}

/* Верхній/Нижній індекс (sup/sub) - важливо для формул */
.journal-typography sup,
.journal-typography sub {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

.journal-typography sup {
	top: -0.5em;
}

.journal-typography sub {
	bottom: -0.25em;
}

/* Код (якщо буде) */
.journal-typography pre {
	background: #f4f4f4;
	padding: 15px;
	overflow-x: auto;
	border: 1px solid var(--clr-border);
	font-family: monospace;
	font-size: 0.9em;
}

/* --- BUTTON STYLE ONE (Primary Action) --- */

.btn-style-one {
	/* Геометрія та позиціонування */
	display: inline-flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 12px 30px; /* Достатньо простора кнопка */

	/* Кольори */
	background-color: var(--clr-primary); /* #4d9cc8 */
	border: 1px solid var(--clr-primary);
	color: #ffffff !important; /* Текст завжди білий */

	/* Типографіка */
	font-family: var(--font-main);
	font-size: 0.85rem; /* ~13-14px */
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	line-height: 1.2;
	text-decoration: none;

	/* Стиль */
	border-radius: 0; /* СТРОГО: Прямі кути */
	cursor: pointer;
	transition: all 0.3s ease;
	box-shadow: none;
	overflow: hidden;
	z-index: 1;
}

/* Ефект при наведенні (Hover) */
.btn-style-one:hover {
	background-color: var(--clr-accent); /* Стає темно-синім #353171 */
	border-color: var(--clr-accent);
	color: #ffffff !important;
	text-decoration: none;
	transform: translateY(-1px); /* Ледь помітний підйом */
}

/* Ефект натискання (Active) */
.btn-style-one:active,
.btn-style-one:focus {
	background-color: var(--clr-accent-dark);
	border-color: var(--clr-accent-dark);
	transform: translateY(0);
}

/* Якщо всередині кнопки є іконка (наприклад, <span class="fa fa-download">) */
.btn-style-one i,
.btn-style-one span.fa,
.btn-style-one span.fab {
	margin-right: 8px; /* Відступ іконки від тексту */
	font-size: 1.1em;
}

/* --- CONTACT PAGE GRID --- */

.contact-page-grid {
	display: grid;
	grid-template-columns: 350px 1fr; /* Широкий сайдбар для адреси */
	gap: 60px;
	align-items: center;
}

/* --- LEFT SIDEBAR (Info) --- */
.contact-sidebar {
	background-color: var(--clr-bg-light); /* Світло-сіра плашка */
	padding: 30px;
	border: 1px solid var(--clr-border);
	height: 100%;
}

.sidebar-header {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	color: var(--clr-accent);
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--clr-primary);
	text-transform: uppercase;
	letter-spacing: 1px;
}

/* Info Item (Icon + Text) */
.info-item {
	display: flex;
	gap: 20px;
	margin-bottom: 30px;
}

.icon-box {
	flex-shrink: 0;
	width: 40px;
	height: 40px;
	background-color: var(--clr-primary); /* Синій квадрат */
	color: #ffffff;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 18px;
	/* border-radius: 0; -> Квадрат за замовчуванням */
}

.info-content {
	display: flex;
	flex-direction: column;
}

.info-content .label {
	font-size: 10px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	font-weight: 700;
	margin-bottom: 5px;
}

.info-content .value {
	font-size: var(--fs-base);
	color: var(--clr-text-main);
	line-height: 1.4;
	margin: 0;
}

.info-content .link {
	color: var(--clr-accent);
	text-decoration: underline;
}

/* Editors Block */
.editors-block {
	margin-top: 40px;
	border-top: 1px solid var(--clr-border);
	padding-top: 20px;
}

.block-title {
	font-size: 10px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	font-weight: 700;
	margin-bottom: 15px;
}

.editors-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.editors-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 10px;
	font-size: var(--fs-sm);
	color: var(--clr-text-main);
	font-weight: 600;
}

.editors-list li .fa {
	color: var(--clr-primary);
}


/* --- RIGHT MAIN (Form area) --- */

.contact-header {
	margin-bottom: 50px;
}

.contact-header .page-title {
	font-family: var(--font-heading);
	font-size: 2.5rem;
	color: var(--clr-accent);
	margin: 0 0 20px 0;
}

.contact-intro {
	font-size: 1.1rem;
	color: var(--clr-text-secondary);
	max-width: 800px;
}

/* --- FORM STYLING (Overriding Yii2 defaults) --- */

.contact-form-wrapper {
	max-width: 700px; /* Обмежуємо ширину форми, щоб не була гігантською */
}

.form-title-small {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	color: var(--clr-accent);
	margin-bottom: 25px;
}

/* Стилізація полів (Inputs) під "Бланк" */
/* Важливо: ці стилі застосуються до форми, яку рендерить Yii2 */
.contact-form-wrapper input[type="text"],
.contact-form-wrapper input[type="email"],
.contact-form-wrapper textarea,
.contact-form-wrapper .form-control {
	width: 100%;
	background-color: transparent;
	border: none;
	border-bottom: 1px solid var(--clr-border); /* Тільки нижня лінія */
	border-radius: 0;
	padding: 15px 0; /* Відступи зверху/знизу */
	font-family: var(--font-main);
	font-size: var(--fs-base);
	color: var(--clr-text-main);
	transition: border-color 0.3s;
	box-shadow: none;
}

.contact-form-wrapper input:focus,
.contact-form-wrapper textarea:focus,
.contact-form-wrapper .form-control:focus {
	border-bottom-color: var(--clr-primary); /* Синя лінія при фокусі */
	outline: none;
	box-shadow: none;
}

/* Лейбли форми */
.contact-form-wrapper label {
	font-size: 11px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	font-weight: 700;
	margin-top: 20px;
	margin-bottom: 0;
	display: block;
}

/* Кнопка відправки (Submit) */
.contact-form-wrapper button[type="submit"],
.contact-form-wrapper .btn-submit {
	margin-top: 30px;
	/* Використовуємо стиль .btn-style-one, що ми робили раніше,
       або прописуємо тут, якщо кнопка має інший клас */
	display: inline-flex;
	padding: 12px 40px;
	background-color: var(--clr-accent);
	color: #fff;
	border: none;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.9rem;
	letter-spacing: 1px;
	cursor: pointer;
	transition: background 0.3s;
}

.contact-form-wrapper button[type="submit"]:hover {
	background-color: var(--clr-primary);
}

/* Captcha styling fixes (якщо є) */
.contact-form-wrapper .captcha-img {
	margin-top: 10px;
	border: 1px solid var(--clr-border);
}

/* MOBILE */
@media (max-width: 900px) {
	.contact-page-grid {
		grid-template-columns: 1fr;
		gap: 50px;
	}

	.contact-sidebar {
		order: 10; /* На мобільному контакти знизу, форма зверху?
                      Або навпаки. Зазвичай контакти шукають одразу.
                      Залишимо зверху (стандартний порядок) */
	}
}

/* --- ERROR PAGE (404) --- */

.error-page-section {
	min-height: 70vh; /* Займає більшу частину екрану */
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Картка повідомлення */
.error-notice-card {
	background-color: #ffffff;
	max-width: 600px;
	width: 100%;
	margin: 0 auto;
	padding: 60px 40px;
	text-align: center;
	position: relative;
}
/* Іконка */
.error-icon {
	position: relative;
	display: inline-block;
	color: var(--clr-border); /* Блідий колір */
	margin-bottom: 20px;
}

.error-icon .fa-file-o {
	font-size: 80px;
	opacity: 0.5;
}

.error-icon .overlay-icon {
	position: absolute;
	bottom: -5px;
	right: -10px;
	font-size: 30px;
	color: var(--clr-primary); /* Яскравий акцент */
	background-color: #ffffff;
	border-radius: 50%; /* Тут можна лишити коло для іконки, або зробити квадрат */
}

/* Типографіка */
.error-code {
	font-family: var(--font-heading);
	font-size: 6rem; /* Велетенські цифри */
	font-weight: 700;
	line-height: 1;
	color: var(--clr-accent);
	margin: 0;
	letter-spacing: -2px;
}

.error-divider {
	width: 60px;
	height: 4px;
	background-color: var(--clr-primary);
	margin: 30px auto;
}

.error-name {
	font-family: var(--font-heading);
	font-size: 1.2rem;
	color: var(--clr-text-secondary);
	text-transform: uppercase;
	letter-spacing: 1px;
	margin-bottom: 15px;
}

.error-message {
	color: var(--clr-text-main);
	font-size: 1.1rem;
	margin-bottom: 40px;
	max-width: 80%;
	margin-left: auto;
	margin-right: auto;
}

/* Кнопки */
.error-actions {
	display: flex;
	justify-content: center;
	gap: 20px;
	flex-wrap: wrap;
}

/* Додатковий стиль для другорядної кнопки (Ghost Button) */
.btn-ghost-rect {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 30px;
	background-color: transparent;
	border: 1px solid var(--clr-accent);
	color: var(--clr-accent);
	font-family: var(--font-main);
	font-size: 0.85rem;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-decoration: none;
	transition: all 0.3s ease;
}

.btn-ghost-rect:hover {
	background-color: var(--clr-accent);
	color: #ffffff;
	text-decoration: none;
}

.btn-ghost-rect span {
	margin-right: 8px;
}

/* Мобільна адаптація */
@media (max-width: 600px) {
	.error-notice-card {
		padding: 40px 20px;
		margin: 0 15px;
	}

	.error-code {
		font-size: 4rem;
	}

	.error-actions {
		flex-direction: column;
	}

	.btn-style-one,
	.btn-ghost-rect {
		width: 100%;
	}
}

/* --- INDEXING PAGE --- */
.intro-text {
	margin-bottom: 40px;
	color: var(--clr-text-secondary);
}

/* --- GRID SYSTEM --- */
.indexing-grid {
	display: grid;
	/* Автоматичне заповнення: колонки не вужчі за 240px */
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 30px; /* Відступ між картками */
}

/* --- INDEX CARD --- */
.index-card {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	border: 1px solid var(--clr-border);
	text-decoration: none;
	transition: all 0.2s ease;
	height: 100%; /* Щоб усі картки в ряду були однієї висоти */
}

/* Ховер ефект */
.index-card:hover {
	border-color: var(--clr-primary); /* Рамка синіє */
	transform: translateY(-3px);      /* Легкий підйом */
	box-shadow: var(--shadow-sm);
	text-decoration: none;
}

/* Область логотипу */
.card-logo-wrapper {
	height: 160px; /* Фіксована висота для лого */
	padding: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #ffffff;
	border-bottom: 1px solid var(--clr-bg-light); /* Легка лінія розділювач */
}

.card-logo-wrapper img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain; /* Логотип вписується в блок, не обрізаючись */
	filter: grayscale(100%); /* Стильний ефект: ЧБ логотипи за замовчуванням */
	opacity: 0.8;
	transition: all 0.2s;
}

/* При наведенні логотип стає кольоровим */
.index-card:hover .card-logo-wrapper img {
	filter: grayscale(0%);
	opacity: 1;
}

/* Підвал картки (Назва) */
.card-footer {
	padding: 15px 20px;
	background-color: var(--clr-bg-light); /* Світлий фон підвалу */
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-grow: 1; /* Розтягує підвал, якщо треба вирівняти висоту */
	border-top: 1px solid transparent;
	transition: border-color 0.2s;
}

.index-card:hover .card-footer {
	background-color: var(--clr-primary); /* Синій фон при наведенні */
	border-top-color: var(--clr-primary);
}

.db-name {
	font-family: var(--font-heading);
	font-weight: 700;
	color: var(--clr-accent);
	font-size: 0.95rem;
	line-height: 1.2;
	transition: color 0.2s;
}

.icon-link {
	font-size: 12px;
	color: var(--clr-border); /* Майже непомітна іконка */
	transition: color 0.2s;
}

/* Зміна кольору тексту при наведенні на картку */
.index-card:hover .db-name {
	color: #ffffff;
}

.index-card:hover .icon-link {
	color: rgba(255, 255, 255, 0.7);
}

/* --- EDITORIAL BOARD LAYOUT --- */

.editorial-board-grid {
	display: grid;
	grid-template-columns: 260px 1fr; /* Сайдбар навігації + Контент */
	gap: 60px;
	align-items: start;
}

/* --- SIDEBAR NAV (Sticky) --- */
.board-sidebar {
	height: 100%;
	border-right: 1px solid var(--clr-border);
	padding-right: 20px;
}

.sidebar-sticky-wrapper {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
}

.nav-title {
	font-family: var(--font-heading);
	font-size: 1.2rem;
	color: var(--clr-accent);
	margin-bottom: 20px;
	padding-bottom: 10px;
	border-bottom: 2px solid var(--clr-primary);
}

.board-nav {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

/* --- CHIEF EDITOR (Hero Block) --- */
.chief-editor-section {
	margin-bottom: 60px;
}

.chief-card {
	background-color: #ffffff;
	border: 1px solid var(--clr-primary); /* Синя рамка навколо головного */
	padding: 40px;
	position: relative;
	box-shadow: var(--shadow-md);
}

/* Бейдж посади */
.chief-header {
	margin-bottom: 20px;
}
.role-badge {
	background-color: var(--clr-primary);
	color: #ffffff;
	padding: 6px 12px;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.8rem;
	letter-spacing: 1px;
}

.chief-name {
	font-family: var(--font-heading);
	font-size: 1.7rem;
	margin: 0 0 20px 0;
	line-height: 1.2;
}
.chief-name a {
	color: var(--clr-accent);
	text-decoration: none;
}
.chief-name a:hover {
	color: var(--clr-primary);
}

.chief-bio {
	font-size: 1.05rem;
	color: var(--clr-text-main);
}

/* --- BOARD GROUPS (Sections) --- */
.board-group-section {
	margin-bottom: 60px;
}

.group-title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	color: var(--clr-accent);
	margin-bottom: 30px;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--clr-border);
}

/* Grid System for Members */
.members-grid {
	display: grid;
	/* За замовчуванням 2 колонки */
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 30px;
}

/* Для звичайних членів (compact) можна 3 колонки */
.members-grid.compact {
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
}

/* --- MEMBER CARD --- */
.member-card {
	background-color: #fff;
	border: 1px solid var(--clr-border);
	padding: 25px;
	transition: all 0.2s;
	display: flex;
	flex-direction: column;
}

.member-card:hover {
	border-color: var(--clr-primary);
	transform: translateY(-3px);
}

.member-name {
	font-family: var(--font-heading);
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--clr-accent);
	margin-bottom: 10px;
	line-height: 1.3;
}

.member-bio {
	font-size: 0.9rem;
	color: var(--clr-text-secondary);
	margin-bottom: 20px;
	flex-grow: 1; /* Розтягує контент, притискаючи соцмережі вниз */
	line-height: 1.5;
}

/* --- SOCIAL LINKS (Shared) --- */
.member-links {
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	margin-top: auto; /* Притиснути до низу картки */
	padding-top: 15px;
	border-top: 1px solid var(--clr-bg-light);
}

.link-item {
	font-size: 0.9rem;
	color: var(--clr-text-secondary);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-weight: 600;
	transition: color 0.2s;
}

.link-item:hover {
	color: var(--clr-primary);
}

.link-item i {
	font-size: 1.1em; /* Трохи збільшуємо іконки */
}

.nav-link.active {
	color: var(--clr-primary);          /* Синій текст */
	border-left-color: var(--clr-primary); /* Синя лінія зліва */
	background-color: var(--clr-bg-light); /* Легкий фон */
	font-weight: 700;                   /* Жирний шрифт для активного пункту */
}


/* MOBILE */
@media (max-width: 900px) {
	.editorial-board-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.board-sidebar {
		border-right: none;
		border-bottom: 1px solid var(--clr-border);
		padding-right: 0;
		padding-bottom: 20px;
	}

	.sidebar-sticky-wrapper {
		position: static;
	}

	.board-nav {
		flex-direction: row;
		overflow-x: auto; /* Горизонтальний скрол для меню */
		padding-bottom: 5px;
	}

	.nav-link {
		white-space: nowrap;
		border-left: none;
		border-bottom: 2px solid transparent;
	}

	.nav-link:hover, .nav-link.active {
		border-left: none;
		border-bottom-color: var(--clr-primary);
	}
}

/* --- EDITOR PROFILE LAYOUT --- */

.editor-profile-grid {
	display: grid;
	grid-template-columns: 280px 1fr; /* Сайдбар 280px, Біографія - решта */
	gap: 60px;
	align-items: start;
}

/* --- SIDEBAR --- */
.profile-sidebar {
	height: 100%;
	border-right: 1px solid var(--clr-border);
	padding-right: 20px;
}

.sidebar-sticky-wrapper {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
}

/* Photo */
.profile-photo-frame {
	width: 100%;
	margin-bottom: 30px;
	border: 1px solid var(--clr-border);
	padding: 5px; /* Ефект паспарту */
	background-color: #fff;
}

.editor-img {
	width: 100%;
	height: auto;
	display: block;
	filter: grayscale(100%); /* Строгий ЧБ стиль */
	transition: filter 0.3s;
}

.profile-photo-frame:hover .editor-img {
	filter: grayscale(0%); /* Колір при наведенні */
}

/* Placeholder якщо фото немає */
.profile-photo-placeholder {
	width: 100%;
	padding-top: 100%; /* Квадрат */
	background-color: var(--clr-bg-light);
	position: relative;
	margin-bottom: 30px;
}
.profile-photo-placeholder .fa {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 50px;
	color: var(--clr-border);
}

/* Sidebar Blocks */
.sidebar-block {
	margin-bottom: 30px;
}

.block-label {
	font-size: 10px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	font-weight: 700;
	margin-bottom: 10px;
	letter-spacing: 0.5px;
}

/* Contact Link */
.contact-link {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--clr-text-main);
	font-size: 0.9rem;
	text-decoration: none;
	word-break: break-all;
}
.contact-link:hover {
	color: var(--clr-primary);
}

/* Scientific IDs List */
.science-ids-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.science-ids-list li {
	margin-bottom: 8px;
	border-bottom: 1px solid var(--clr-bg-light);
	padding-bottom: 8px;
}
.science-ids-list li:last-child {
	border-bottom: none;
}

.id-link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	text-decoration: none;
	color: var(--clr-text-main);
	font-size: 0.9rem;
	transition: color 0.2s;
}

.id-link:hover {
	color: var(--clr-primary);
}

.id-icon {
	font-size: 1.1em;
	color: var(--clr-text-secondary);
	width: 24px;
}
.id-link:hover .id-icon {
	color: var(--clr-primary);
}

/* --- MAIN CONTENT --- */
.profile-header {
	margin-bottom: 40px;
}

.role-badge {
	display: inline-block;
	background-color: var(--clr-primary);
	color: #ffffff;
	padding: 4px 10px;
	text-transform: uppercase;
	font-weight: 700;
	font-size: 0.75rem;
	letter-spacing: 1px;
	margin-bottom: 15px;
}

.profile-name {
	font-family: var(--font-heading);
	font-size: 2.5rem;
	color: var(--clr-accent);
	margin: 0 0 20px 0;
	line-height: 1.1;
}

.profile-affiliation {
	font-size: 1.2rem;
	color: var(--clr-text-secondary);
	font-family: var(--font-main);
	line-height: 1.5;
	max-width: 800px;
}

/* Розділювач */
.section-divider {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}

.divider-label {
	font-weight: 700;
	font-family: var(--font-heading);
	font-size: 1.2rem;
	margin-right: 15px;
	white-space: nowrap;
	color: var(--clr-accent);
}

.divider-line {
	flex-grow: 1;
	height: 1px;
	background-color: var(--clr-border);
}

/* MOBILE */
@media (max-width: 900px) {
	.editor-profile-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.profile-sidebar {
		border-right: none;
		border-bottom: 1px solid var(--clr-border);
		padding-right: 0;
		padding-bottom: 30px;
	}

	.sidebar-sticky-wrapper {
		position: static;
		display: flex;
		flex-direction: column;
		align-items: center;
		text-align: center;
	}

	.profile-photo-frame {
		max-width: 250px;
	}

	.id-link {
		justify-content: center; /* Центруємо посилання на мобільному */
		gap: 10px;
	}
}

/* --- AUTHOR PAGE LAYOUT --- */

.author-page-grid {
	display: grid;
	grid-template-columns: 280px 1fr; /* Вузький сайдбар, широкий список */
	gap: 60px;
	padding-top: 40px;
	padding-bottom: 80px;
	align-items: start;
}

/* --- SIDEBAR (AUTHOR PASSPORT) --- */
.author-sidebar {
	height: 100%;
	border-right: 1px solid var(--clr-border);
	padding-right: 20px;
}

.sidebar-sticky-wrapper {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
}

.author-passport-card {
	background-color: #ffffff;
	/* Без рамок, просто чистий блок */
}

/* Аватар (Заглушка) */
.author-avatar-placeholder {
	font-size: 60px;
	color: var(--clr-primary);
	margin-bottom: 15px;
	opacity: 0.8;
}

/* Stats */
.author-stats {
	background-color: var(--clr-bg-light);
	padding: 15px;
	margin-bottom: 25px;
	border: 1px solid var(--clr-border);
}

.stat-row {
	display: flex;
	justify-content: space-between;
	margin-bottom: 8px;
	font-size: 0.9rem;
}
.stat-row:last-child { margin-bottom: 0; }

.stat-row .lbl { color: var(--clr-text-secondary); }
.stat-row .val { font-weight: 700; color: var(--clr-accent); }

.author-bio {
	font-size: 0.95rem;
	color: var(--clr-text-main);
	line-height: 1.6;
}

/* --- MAIN CONTENT (ARTICLES REGISTRY) --- */

.content-header {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}

.section-title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	color: var(--clr-accent);
	margin: 0 20px 0 0;
	white-space: nowrap;
}

.section-line {
	flex-grow: 1;
	height: 1px;
	background-color: var(--clr-border);
}

/* REGISTRY ITEMS RE-USE & EXTENSIONS */
/* (Базові стилі для .registry-item вже є з минулого запиту, тут додаємо специфіку) */

.item-context-meta {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	margin-bottom: 10px;
	letter-spacing: 0.5px;
}

.journal-ref {
	font-weight: 600;
	color: var(--clr-primary);
}

/* Виділення поточного автора в списку авторів */
.author-link.current-author {
	color: var(--clr-accent);
	font-weight: 700;
	border-bottom-color: var(--clr-accent);
	background-color: rgba(77, 156, 200, 0.1); /* Легка підсвітка */
}

/* MOBILE */
@media (max-width: 900px) {
	.author-page-grid {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.author-sidebar {
		border-right: none;
		border-bottom: 1px solid var(--clr-border);
		padding-right: 0;
		padding-bottom: 30px;
	}

	.author-passport-card {
		text-align: center;
	}

	.author-stats {
		max-width: 300px;
		margin: 0 auto 20px auto;
		text-align: left;
	}
}

/* --- HERO SEARCH SECTION --- */
.search-hero-section {
	margin-bottom: 50px;
	border-bottom: 1px solid var(--clr-border);
}

.search-hero-inner .page-title {
	font-family: var(--font-heading);
	color: var(--clr-accent);
	font-size: 2rem;
	margin: 0 0 20px 0;
	text-align: center;
}

/* --- STYLING THE SEARCH FORM (Wrapper) --- */
/* Цей блок впливає на інпути, які генерує ваш _render/search-form */
.search-box-styled {
	background: #ffffff;
	padding: 20px;
	border: 1px solid var(--clr-primary);
	box-shadow: var(--shadow-sm);
}

/* Примусова стилізація інпутів всередині форми */
.search-box-styled input[type="text"],
.search-box-styled select,
.search-box-styled .form-control {
	height: 45px;
	border-radius: 0 !important; /* Квадратні кути */
	border: 1px solid var(--clr-border);
	font-family: var(--font-main);
	box-shadow: none;
	font-size: 0.95rem;
}

.search-box-styled input:focus,
.search-box-styled select:focus {
	border-color: var(--clr-primary);
	outline: none;
}

/* Кнопка пошуку всередині форми */
.search-box-styled button[type="submit"],
.search-box-styled .btn-submit {
	height: 45px;
	border-radius: 0 !important;
	background-color: var(--clr-primary);
	color: #ffffff;
	border: none;
	text-transform: uppercase;
	font-weight: 700;
	padding: 0 30px;
	transition: background 0.3s;
}

.search-box-styled button[type="submit"]:hover {
	background-color: var(--clr-accent);
}

/* Якщо форма використовує Flexbox/Grid - підправити тут за потребою */
/* Наприклад, якщо поля в рядку: */
.search-box-styled form {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
/* Розтягуємо інпут на максимум */
.search-box-styled .form-group {
	flex-grow: 1;
	margin-bottom: 0;
}

/* Header */
.results-header {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
}

.results-count {
	font-family: var(--font-heading);
	font-size: 1.25rem;
	color: var(--clr-accent);
	margin: 0 20px 0 0;
	white-space: nowrap;
}

.header-line {
	flex-grow: 1;
	height: 1px;
	background-color: var(--clr-border);
}

/* --- EMPTY STATE --- */
.empty-search-state {
	text-align: center;
	padding: 60px 0;
	color: var(--clr-text-secondary);
}

.empty-icon {
	font-size: 60px;
	margin-bottom: 20px;
	opacity: 0.3;
}

.empty-title {
	font-family: var(--font-heading);
	font-size: 1.5rem;
	color: var(--clr-text-main);
	margin-bottom: 10px;
}

.empty-hint {
	font-size: 1rem;
}

/* --- REUSING REGISTRY STYLES --- */
/* (Ці стилі вже є у вас для .registry-item,
   але тут переконайтеся, що item-context-meta працює) */

.item-context-meta {
	display: flex;
	justify-content: space-between;
	font-size: 11px;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	margin-bottom: 10px;
	letter-spacing: 0.5px;
}

.journal-ref {
	color: var(--clr-primary);
	font-weight: 600;
}

/* MOBILE */
@media (max-width: 768px) {
	.search-box-styled form {
		flex-direction: column;
	}

	.search-box-styled button[type="submit"] {
		width: 100%;
	}
}

/* --- SEARCH PAGE LAYOUT --- */
.search-page-layout {
	background-color: #ffffff;
	min-height: 80vh;
}

/* --- HERO SECTION --- */
.search-hero-area {
	padding: 60px 0;
}

.hero-title {
	font-family: var(--font-heading);
	font-size: 2.5rem;
	color: var(--clr-accent);
	margin-bottom: 30px;
	text-align: center;
}

/* --- HEADER STYLE SEARCH FORM (Yii2 Compatible) --- */

.header-style-form {
	max-width: 100%;
	position: relative;
}

/* 1. ГРУПА: ІНПУТ + КНОПКА */
.header-style-form .search-input-group {
	display: flex; /* Робимо їх в один рядок */
	align-items: stretch;
	margin-bottom: 15px;
	position: relative;
}

/* Обгортка, яку генерує Yii2 (field-searchform-search) */
.header-style-form .search-field-wrapper {
	flex-grow: 1; /* Розтягуємо на всю ширину */
	margin-bottom: 0; /* Прибираємо відступ Yii */
}

/* Сам інпут */
.header-style-form .search-input {
	height: 45px;
	border: 1px solid var(--clr-border);
	border-right: none; /* Прибираємо праву рамку, щоб злити з кнопкою */
	border-radius: 0;   /* Квадрат */
	box-shadow: none;
	padding-left: 15px;
	width: 100%;
}

.header-style-form .search-input:focus {
	border-color: var(--clr-primary);
	outline: none;
	position: relative;
	z-index: 2;
}

/* Кнопка пошуку */
.header-style-form .search-btn {
	height: 45px; /* Така ж висота як у інпуту */
	width: 50px;
	background-color: var(--clr-primary);
	color: #ffffff;
	border: 1px solid var(--clr-primary);
	border-radius: 0;
	padding: 0;
	cursor: pointer;
	transition: background 0.3s;
}

.header-style-form .search-btn:hover {
	background-color: var(--clr-accent);
	border-color: var(--clr-accent);
}


/* 2. ПОМИЛКИ ВАЛІДАЦІЇ */
/* Yii генерує div.help-block всередині .search-field-wrapper */
.header-style-form .help-block {
	position: absolute;
	top: 100%;
	left: 0;
	margin-top: 5px;
	font-size: 0.8rem;
	color: #e74c3c; /* Червоний */
	white-space: nowrap;
}

/* Підсвітка рамки при помилці */
.header-style-form .has-error .search-input {
	border-color: #e74c3c;
	background-color: #fff9f9;
}


/* 3. РАДІО КНОПКИ (Стилізуємо стандартний список Yii) */
.header-style-form .search-radios {
	margin-top: 10px;
}

/* Контейнер радіо-списку */
.header-style-form .search-radios div[id$="type"] { /* Селектор по ID, що закінчується на type */
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}

/* Стилізуємо лейбли, які генерує Yii */
.header-style-form .search-radios label {
	font-size: 0.85rem;
	text-transform: uppercase;
	color: var(--clr-text-secondary);
	font-weight: 600;
	cursor: pointer;
	position: relative;
	padding-left: 20px; /* Місце під кастомну крапку */
	margin-right: 0;
	transition: color 0.2s;
	user-select: none;
}

/* Ховаємо стандартний інпут браузера, але залишаємо його в DOM */
.header-style-form .search-radios input[type="radio"] {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

/* Малюємо власну крапку (псевдоелемент) */
.header-style-form .search-radios label::before {
	content: '';
	position: absolute;
	left: 0;
	top: 2px;
	width: 14px;
	height: 14px;
	border: 1px solid var(--clr-border);
	border-radius: 50%; /* Кругла */
	background: #fff;
	transition: all 0.2s;
}

.header-style-form .search-radios label::after {
	content: '';
	position: absolute;
	left: 4px; /* Центруємо всередині before */
	top: 6px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--clr-primary);
	opacity: 0; /* Схована за замовчуванням */
	transform: scale(0);
	transition: all 0.2s;
}

/* Ховер ефект */
.header-style-form .search-radios label:hover {
	color: var(--clr-primary);
}
.header-style-form .search-radios label:hover::before {
	border-color: var(--clr-primary);
}

/* АКТИВНИЙ СТАН (Коли інпут вибраний) */
/* Використовуємо :checked + label, оскільки Yii ставить input перед label */
.header-style-form .search-radios input[type="radio"]:checked + label {
	color: var(--clr-primary);
}

.header-style-form .search-radios input[type="radio"]:checked + label::before {
	border-color: var(--clr-primary);
}

.header-style-form .search-radios input[type="radio"]:checked + label::after {
	opacity: 1;
	transform: scale(1);
}

.help-block {
	margin: 0;
	padding: 0;
}

.search-field-wrapper {
	flex-grow: 1;
}

.search-input-group {
	border: 1px solid;
}

/* --- AUTHOR SEARCH RESULTS --- */

/* Відступ між блоками різних авторів */
.author-result-block {
	margin-bottom: 60px;
	padding-bottom: 40px;
	border-bottom: 1px solid var(--clr-border);
}

.author-result-block:last-child {
	border-bottom: none;
	margin-bottom: 0;
}

/* Заголовок блоку автора */
.author-block-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 25px;
	background-color: var(--clr-bg-light); /* Світла підкладка */
	padding: 15px 20px;
	border-left: 4px solid var(--clr-primary);
}

.author-title {
	margin: 0;
	font-family: var(--font-heading);
	font-size: 1.5rem;
}

.author-title a {
	color: var(--clr-accent);
	text-decoration: none;
	display: flex;
	align-items: center;
	gap: 10px;
}

.author-title a:hover {
	color: var(--clr-primary);
}

.author-title i {
	opacity: 0.5; /* Іконка трохи блідіша */
}

/* Лічильник статей справа */
.author-pubs-count {
	font-size: 0.9rem;
	color: var(--clr-text-secondary);
	text-transform: uppercase;
}

.author-pubs-count b {
	color: var(--clr-primary);
	font-size: 1.1rem;
}

/* Виділення знайденого автора у списку співавторів */
.author-link.highlighted {
	font-weight: 700;
	color: var(--clr-accent);
	background-color: rgba(255, 235, 59, 0.2); /* Легка жовта підсвітка */
	padding: 0 3px;
}

/* Якщо немає статей */
.no-articles-msg {
	padding: 20px;
	font-style: italic;
	color: var(--clr-text-secondary);
}

/* DOI в списку (опціонально, щоб не зливався) */
.doi-item {
	font-family: monospace;
	font-size: 0.8em;
	background: #f5f5f5;
	padding: 2px 5px;
	border-radius: 3px;
}

/* Мобільна адаптація */
@media (max-width: 768px) {
	.author-block-header {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}
}

.editorial-link {
	color: var(--clr-primary);
}

.issn-info {
	display: flex;
	flex-direction: column;
}