/** Cassiopeia SCHOOL Template
*
* Author: Dmitry Karev (dmitry@karev.ca)
* License: (c) 2023 - All rights reserved
*/

@import url('https://fonts.googleapis.com/css2?family=Rajdhani:wght@200;300;400;500;600;700;800&family=Roboto+Condensed:wght@300;400;500;600;700;800&display=swap');

:root {
	
	/* ЦВЕТА */
	--karev-color-blue: #2c659c;	/* Синий лого */
	--karev-color-excel: #5CBA3C;	/* Зеленый Logo */
	--karev-color-violet: #8D99FF; 	/* Сиреневый */
	--sbs-body-text-color: #222;
	--sbs-accent: #ff991C;
	--sbs-accent-light: #333;
	--sbs-accent-4dark: #ff991C;
	--sbs-bg-tone: #f7f8f9;
	--sbs-mod-bg: #dddddd;
	--sbs-color-blue: #113353;
	--sbs-header-bg: #fffffff0;
	--sbs-light-bg-3: hsl(var(--hue), 40%, 97%);


	/* ШРИФТЫ */
	--font-headings: Rajdhani, 'Roboto Condensed', sans-serif; 
	--font-text: 'Roboto Condensed', sans-serif;
	--font-size-small: 16px;
	--body-font-size: 1.1rem;
	--body-font-weight: 400;
	--body-line-height: 1.3;
	
	--h1-size: 32px;
	--h1-weight: 700;
	--h1-font-family: var(--font-headings);
	
	--h2-font-family: var(--font-headings);
	--h2-size: 1.4rem;
	--h2-weight: 700;
	
	--h3-font-family: var(--font-headings);
	--h3-size: 1.2rem;
	--h3-weight: 600;
	
	--sbs-input-font-size: 1.2rem;

	/* ТЕКСТ */
	--btn-line-height: 1.5;
	
	--sbs-sides: 15%;
}	
	
/* HEADER */	
.container-header {
	background-color: var(--sbs-header-bg);
	background-image: none;
	box-shadow: 0 5px 5px rgba(0,0,0,.15);
	margin: 0;
	margin-inline-end: 0;
	width: 100%;
	
	.brand-logo {
		text-decoration: none;
		display: flex;
		flex-direction: row;
	}
		
	.container-nav {
		background: var(--sbs-header-bg);
		height: auto;
		margin-inline-start: 0;
		padding-top: 1rem;
        padding-bottom: 1rem;
	}
	
		
	.metismenu.mod-menu .metismenu-item {
		font-size: var(--body-font-size);
	}
	.metismenu.mod-menu .metismenu-item > a:focus {
		outline: none;
	}
	.mod-menu {
		background: inherit;
		color: #333;
	}
	.mod-languages {
		background: var(--sbs-header-bg);
		display: flex;
		flex-direction: row;
		margin: 0;
		
		.dropdown-toggle {
			background: #fff;
			border: none;
			color: #333;
			font-size: var(--body-font-size);
			margin: 0;
		}
		.dropdown-toggle:hover, .dropdown-toggle:focus {
			color: var(--sbs-accent);
		}
	}
	
	.navbar-brand {
		background: inherit;
		display: flex;
		margin-inline-end: 0;
		padding: 0;
	}
	.navbar-expand-lg {
		background: inherit;
	}
	.navbar-toggler {
		border: none;
		border: 1px solid #ccc;
		color: var(--sbs-body-text-color);
		cursor: pointer;
		margin-top: 0;
	}
	.navbar-toggler:focus {
		box-shadow: none;
	}
	.navbar {
		margin-inline-start: auto;
        margin-inline-end: 2rem;
		margin-top: 0;
		padding: 0;
		font-weight: 500;
        font-family: system-ui;
        text-transform: capitalize;		
	}
	.navbar a:hover {
		color: var(--sbs-accent);			
	}
	
	.logo {
		position: relative;
		float: left;
		padding-right: 15px;
	}
	.siteTitle {
		color: #333333;
		display: flex;
		flex-direction: column;
		font-family: var(--font-headings);
		font-size: var(--h2-size);
		font-size:25px;
		font-weight: 600;
		letter-spacing: -0.3px;
		line-height: 1.1;
		text-shadow: 1px 1px 2px #d7d7d7;
	}
	.siteDescription {
		color: #333333;
		font-family: var(--font-text);
		font-size: var(--body-font-size);
		font-weight: var(--body-font-weight);
		letter-spacing: normal;
		text-shadow: none;
	}
	
	@media (max-width: 992.98px) { /* Планшет */
	
		.container-nav nav {
			margin-top: 0;
			margin-inline-start: auto;
			margin-inline-end: auto;
		}
		
		.logo {
			width: 50px;
		}
		
		.navbar-toggler.collapsed {
			margin-top: 0;
			margin-left: 0;
		}
		.navbar-toggler {
			margin-top: 0;
			margin-left: 0;
		}
		
		.siteTitle {
			line-height: normal;
			zoom: 0.8;
		}
	}
	
	@media (max-width: 499.98px) {
		.siteTitle {
			display: none;
		}
	}
		
	@media (max-width: 399.98px) { /* Телефон */
	
		.container-nav nav {
			margin-top: 0;
			margin-inline-start: 0;
			margin-inline-end: 0;
			padding:15px 0;
		}
		.logo {
			width: 65px;
            padding: 10px 15px;
		}
		.siteTitle {
			display: none;
		}
	}
}
.container-banner {
	margin: auto 0;
}


/* POSITION TOP-A */
.container-top-a, .container-top-b, .container-top-c {
	grid-column: full-start / full-end;
}
.container-top-a > *, .container-top-b > *, .container-top-c > *, .container-bottom-a > *, .container-bottom-b > * {
    flex: 1;
    margin: 0;
}
.container-top-a .card-body, .container-top-b .card-body, .container-top-c .card-body {
	padding: 0;
}
.container-top-a .card, .container-top-b .card, .container-top-c .card {
	border: none;
	margin: 0;
}
@media (max-width: 499.98px) {
	.top-a .point5-container {
		display: none;
	}
	.module-358, .module-358>.filter {
        height: 750px !important;
    }
}


/* POSITION TOP-B */
.container-top-b {
	grid-column: full-start / full-end;
}
.container-top-b .card-body {
	padding: 0;
}
.container-top-b .card {
	border: none;
	margin: 0;
}


/* POSITION TOP-C */
.container-top-c {
	grid-column: full-start / full-end;
}
.container-top-c .card-body {
	padding: 0;
}
.container-top-c .card {
	border: none;
	margin: 0;
}


/* MAIN */
.container-component {
	grid-column: full-start / full-end !important;
	padding: 2rem var(--sbs-sides);
}
.container-component > * {
    margin-bottom: 0;
	margin-top: 0;
}
.blog-featured {
	.blog-items[class*=" masonry-"], .blog-items[class^=masonry-] {
		display: flex;
		column-gap: 3em;
		row-gap: 1em;
	}
	
	.blog-items {
		display: flex;
		flex-direction: row;				
	}
	
	.blog-item {
		flex-direction: column;
		margin: 0;
		width: 30%;
		
		li {
			line-height: var(--body-line-height);
			padding-bottom: 5px;
		}

		.item-image {
			margin-bottom: 2rem;
			margin-top:0;
			overflow: hidden;
			width: fit-content;
		}
		.item-title a {
			text-decoration: none;
			text-transform: uppercase;
            font-size: 20px;
		}
		.item-image img:hover {
			scale: 1.05;
		}
	}
}

div.in-article {
    display: inline-flex;
    margin: 3rem auto;
    padding: 0;
}
.mod-custom .offer-container {
    border: 1px solid var(--sbs-accent);
}

@media (max-width: 1299.98px) {
	.blog-featured {column-gap: 2rem;}
	.blog-featured .blog-items {flex-direction: column;}
	.blog-featured .blog-item { width: 100%;}
}
@media (max-width: 499.98px) {
	/* .blog-featured .blog-items {flex-direction: column;} */
	/* .blog-featured .blog-item { width: 100%;} */
}

.com-content-article figure {
	margin: 0 2em 2em 0;
}
.com-content-article__body {
	/* padding-top:3rem; */
	padding-bottom:2rem;
}
.com-content-category-blog {
	grid-column: full-start / full-end;
	display: flex;
    flex-direction: column;
}
.com-content-category-blog .blog-items {
	display: flex;
	column-gap: 3rem;
	row-gap: 2rem;
}
.com-content-category-blog .blog-item {
	width: 30%;
}
@media (max-width: 998.98px) {
	.com-content-category-blog .blog-item {
		width: 100%;
	}
}
.com-content-category-blog .blog-item .fields-container {display:none;}


/* POSITION BOTTOM-A */
.container-bottom-a {
	grid-column: full-start / full-end;
	display: flex;
    flex-direction: column;
}
.container-bottom-a .card {
	border: none;
	margin: 0;
}
.module-429 div.link-more {
    text-align: center;
    width: 100% !important;
    font-size: 32px;
    font-family: 'Rajdhani';
    font-weight: 600;
}

/* POSITION BOTTOM-B */
.module-404, 
.module-439 {
    margin-top: 0 !important;
}


/* ERROR PAGE */
.error_site .header {
	box-shadow: 0 5px 5px rgba(0,0,0,.15);
	height: 5rem;
	position: sticky!important;
}
	
body {
	color: var(--sbs-body-text-color);
	font-family: var(--font-text);
	font-size: var(--body-font-size);
	font-weight: var(--body-font-weight);
}
a {
    color: #333;
}
p {
	font-family: var(--font-text);
	font-size: var(--body-font-size);
	font-weight: var(--body-font-weight);
    line-height: var(--body-line-height);
	margin: 0 !important;
    padding-bottom: 1rem;
}
h1 {
	font-family: var(--font-headings);
	font-size: var(--h1-size);
	font-weight: var(--h1-weight);
	margin: 0;
    line-height: 0.85;
	padding: 2rem 1rem;
	padding-left: 0;
	text-transform: uppercase;
}
h2 {
	font-family: var(--font-headings);
	font-size: var(--h2-size);
	font-weight: var(--h2-weight);
	/*line-height: 0.9;*/
	text-transform: uppercase;
}
h2.start {
    padding: 10px 10px;
    border: 1px solid var(--karev-color-blue);
    color:var(--sbs-accent);
    width: fit-content;
    display: flex;
    float: left;
    line-height: 1;
    margin-right: 1rem;
}

h3 {
	font-family: var(--font-headings);
    font-size: var(--h3-size);
    font-weight: var(--h3-weight);
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    text-transform: uppercase;
}

b, strong {
    font-weight: 700;
}
.back-to-top-link {
	background-color: var(--white,#fff);
    border: 1px solid var(--cassiopeia-color-primary,#112855);
    border-radius: 0.25rem;
    bottom: 5rem;
    color: var(--cassiopeia-color-primary,#112855);
    inset-inline-end: 1rem;
    position: fixed;
	opacity: 0;
    -o-transition: opacity .2s ease-in;
    padding: 0.5em;
    pointer-events: all;
    text-decoration: none;
    transition: opacity .2s ease-in;
    -webkit-transition: opacity .2s ease-in;
    z-index: 10000;
}


body .clearfix {
    clear: none;
    margin-right: 1rem;
}
.btn {
    --btn-font-size: calc(var(--body-font-size) - 0.2rem);
    --btn-font-weight: 500;
    --btn-color: #22262a;
    --btn-bg: var(--light-grey);
    --btn-border-width: 1px;
    --btn-border-color: #ccc;
    --btn-border-radius: 0.25rem;
    --btn-hover-border-color: #ccc;
    --btn-box-shadow: inset 0 1px 0 hsla(0,0%,100%,.15),0 1px 1px rgba(0,0,0,.075);
    --btn-disabled-opacity: 0.65;
    --btn-focus-box-shadow: 0 0 0 0.25rem rgba(var(--btn-focus-shadow-rgb),.5);
    background-color: var(--btn-bg);
    border: var(--btn-border-width) solid var(--btn-border-color);
    border-radius: var(--btn-border-radius);
    color: var(--btn-color);
    cursor: pointer;
    display: inline-block;
    font-family: var(--btn-font-family);
    font-size: var(--btn-font-size);
    font-weight: var(--btn-font-weight);
    line-height: var(--btn-line-height);
    padding: var(--btn-padding-y) var(--btn-padding-x);
    text-align: center;
    text-decoration: none;
    -webkit-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    -o-transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out,-webkit-box-shadow .15s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
}
.btn-primary {
    background: var(--sbs-accent);
    border: 3px solid var(--sbs-accent-4dark);
	/* color: var(--sbs-color-blue); */
	color: #fff;
    font-weight: 500;
    font-size: var(--font-size-small);
}
.btn-primary:hover {
	background-color: var(--light-grey);
	border: 3px solid var(--sbs-accent);
    color: #333;
}
.btn-secondary {
	/* background-color: transparent; */
	
    background: var(--sbs-accent);
    border: 1px solid var(--sbs-accent-4dark);
	color: var(--sbs-color-blue);
    font-weight: 500;
    font-size: var(--font-size-small);
}
.btn-secondary.dropdown-toggle {
	color: var(--light-grey);
}
.btn-secondary.dropdown-toggle:hover, .btn-secondary.dropdown-toggle:focus {
	color: #333;
}

.card-body {
	padding: 0;
}
.course-fields ul li {
	list-style: none;
}
.course-fields .fields-container {
	padding-left: 0;
}
.course-fields .field-label i {
	padding-right: 1rem;
}
.custom.testimon {
	background: var(--sbs-bg-tone);
	display: block;
	float: left;
	padding: 1rem 10%;
	width: auto;
}

.description p {
	padding-bottom: 0;
}
div.input-group-append.input-group-prepend {
	/*display: contents;*/
	display:none;
}

.fa, .fa-brands, .fa-classic, .fa-regular, .fa-sharp, .fa-solid, .fab, .far, .fas {
	font-size: 40px;
}
.fields-container {
	margin: 0 0 1rem;
	padding: 0;
	
	
	li {
		background-color: var(--light-grey);
		background-color: var(--karev-color-blue);
		border-radius: 5px;
		border: 1px solid #ccc;
		color: #333;
		color: #fff;
		list-style: none;
		margin: 5px 0;
		font-size: 0.9rem;
		padding: 5px 9px;
		width: -webkit-fill-available;
		max-width: 235px;
		
		.field-label {
			font-weight: 600;
		}
	}
}
.form-control {
	padding: 5px;
    text-align: left;
}
.footer {
	background: var(--sbs-color-blue);
	padding: 0;
    margin: auto 0;
    text-align: center;
}
.footer .grid-child {
	align-items: flex-start;
    justify-content: center;
    padding: 0.5rem 0.5em;
    text-align: left;
}
.footer .mod-menu, .footer .mod-footer {
	margin: auto;
	display: contents;
}
.footer .nav-header {
	font-weight:500;
}
.footer .nav-item {
	padding-right: 2rem;
}
.footer .mod-list li .mod-menu__sub {
    padding-left: 0;
}
.footer1 {
	/* font-size: var(--karev-font-smaller); */
	text-align: center;
	width: -webkit-fill-available;
}
.footer a:hover {
	text-decoration:underline;
	color: var(--white);
}

.grid_v {
    display: flex;
    flex-direction: column;
	padding-left: 10rem;
	padding-top: 3rem;
	width: 50%;
}

.horizontal.small-db.top_right, .horizontal.big-db.top_right {
	right: 1% !important;
    top: 1% !important;
}
.horizontal.small-db.top_left, .horizontal.big-db.top_left {
    left: 10px !important;
    top: 10px !important;
    padding: 5px 10px;
    font-size: small;
}
.hovered {
	z-index: 9;
}
.hovered:hover {
	/* opacity: 0; */
	/* z-index:5; */
	animation-name: hide;
	animation-duration: 4s;
    animation-timing-function: ease-in-out;
}

.item-content h2 a {
    text-decoration: none;
    text-transform: uppercase;
    font-size: 20px;
}

.mod-languages a {
    padding: 0.25rem;
    text-decoration: none;
}
.mod-languages .btn-secondary {
	border: none;
}
.mod-languages li.lang-active a {
	font-weight: 600;
}
.mod-languages li.lang-active img {
    border: none;
	border-bottom: 2px solid var(--white);
    display: inline-block;
}
.mod-languages li {
    margin: 0;
}
.mod-languages ul li.lang-active {
    background-color: transparent;
}

.offer-container {
    background: var(--sbs-bg-tone);
	display: flex;
	flex-direction: column;
    flex-wrap: wrap;
    justify-content: space-between;
	padding: 3rem 10%;
	text-align: center;
	
	a.call2action {
		align-content: center;
		background-color: var(--sbs-accent-4dark);
		border-radius: 5px;
		color: #ffffff;
		display: inline-flex;
		font-size: 26px;
		font-weight: 500;
		margin: auto;
		padding: 15px 20px;
		text-decoration: none;
		/* width: 285px; */
	}
	
	.offer-text {
		text-transform: uppercase;
		/* width: 70%; */
		
		h2 {color: var(--sbs-accent)};
	}
		
	
	.offer-price {
		font-family: var(--font-headings);
		font-weight: 700;
		
		.old {
			color: #ccc;
            font-size: 4rem;
            text-decoration: line-through;            
		}
		
		.actual {
			color: var(--sbs-accent);
			color: var(--karev-color-blue);
			font-size: 4rem;
			line-height: 1;
            padding-bottom: 2rem;
		}
	}
}

.radio {
	padding: 0.3rem;
    padding-left: 2rem;
	font-size: var(--body-font-size);
	font-weight: 600;
}
.red {
	color: var(--sbs-accent);
}

.shorts {
	font-size: 21px;
    padding: 1rem 10%;
    text-align: center;
}
.social a {
	color: var(--light-grey);
	/*margin-left: 7px;*/
}
.social a:not(.btn):focus {
    color: var(--light-grey) !important;
}

.trans {
	margin-top: -318px;
}
.trans .callback-container {
	background: transparent !important;
	z-index:1000;
}
.trans .callback {
	display: none;
}

ul.pointer li {
    display: list-item;
    list-style-type: "👉";
    padding-left: 1rem;
	padding-top: 0.3rem;
	padding-bottom:0.3rem;
    line-height: var(--body-line-height);
}
[class^="point-"], [class*=" point-"] {
    display: flex;
}
ul.point-duration li {
    display: list-item;
    list-style-type: "⌛";
    padding-left: 0.5rem;
	padding-top: 1rem;
	padding-bottom:0.3rem;
    line-height: var(--body-line-height);
}
ul.point-start li {
    display: list-item;
    list-style-type: "🕓";
    padding-left: 0.5rem;
	padding-top: 0rem;
	padding-bottom:0.3rem;
    line-height: var(--body-line-height);
}

video {
/*
    float:left;
    margin: 0 2rem 1rem 0;
    width: auto;
*/    
}

.w100 {
	width:100%;
}

body.wrapper-fluid .site-grid {
    grid-gap: 0 0em;
}


@supports (display:grid) {
	.site-grid {
		grid-template-areas:
			". banner banner banner banner ."
			". top-a top-a top-a top-a ."
			". top-b top-b top-b top-b ."
			". top-c top-c top-c top-c ."
			". top-d top-d top-d top-d ."
			". side-l comp comp side-r ."
			". bot-a bot-a bot-a bot-a ."
			". bot-b bot-b bot-b bot-b .";
	}
}

@supports (display:grid) {
	.blog-items {
		grid-gap: 0em;
		display: grid;
		grid-auto-flow: row;
		grid-template-columns: 1fr;
		margin: 0 0 1em;
	}
}
.fa-canadian-maple-leaf {
	background: #fff;
    color: red;
    padding-left: 2px;
    padding-right: 0px;
    border-right: 4px solid red;
    border-left: 5px solid red;
    margin-right: 7px;
}


@media (max-width: 1399.98px) {
	
	.container-component>* {
		padding: 0;
		overflow: auto;
	}
	
	.shadowed {
		font-size: 5rem;
		margin-bottom: -2rem;
	}

	.top-banner-bg {
		background-image: url(/images/template/1400x400-bg.jpg);
		height: 400px;
	}
	.top-banner-text {
		background-image: url(/images/template/1400x400-top.png);
	}
}

@media (max-width: 992px) {
	:root {
		--h1-size: 27px;
		--body-font-size: 18px;
		--font-size-small: 14px;
	}
	p {
		/* text-align: left; */
	}
	
	.fa, .fa-brands, .fa-classic, .fa-regular, .fa-sharp, .fa-solid, .fab, .far, .fas {
		font-size: 33px;
	}
	
	.shorts {
		font-size: var(--body-font-size);
		padding: 1rem 20px;
		text-align: left;
	}
}

@media (max-width: 499.98px) { 
	
	:root {
		--sbs-sides: 2rem;
	}
}

@media (max-width: 399.98px) { /* Телефон */
	
	:root {
		--sbs-sides: 2rem;
	}
	
	h1 {
		font-size: 2.5rem;
	}
	h2 {
		font-size: 1.8rem;
	}
	h3 {
		font-size: 1.7rem;
	}
	
	.block-3 {width:100%;}
	.blog-items {
		display: flex;
		flex-direction: column;
	}
	.blog-featured {
		padding: 3rem 2rem;
	}
	.brand {
		display: none;
	}
	.btn-register {
	    zoom: 0.8;
	}
	.built-in {
		padding:0;
	}
	
	.over .card-body {
		margin-top: 0;
		/* background: #cccccc75; */
		background: #a0a7b8b5;
	}
	.card {
		word-wrap: inherit;
		margin: 0;
	}
	body .clearfix {
		clear: none;
		margin-right: 0;
	}
	body.wrapper-fluid header>.grid-child, body.wrapper-fluid footer>.grid-child {
		padding: 0;
		flex-wrap: nowrap;
	}
	
	.col-md-4 {
		width:auto;
	}
	.com-content-article__body {
		display: flex;
		flex-direction: column;
		padding: 2rem 0;
		width: 100%;
	}
	.com-content-article__body .float-left {
        float: none;
        position: relative;
        display: flex;
        flex-direction: row;
        padding-right: 0;
        padding-bottom: 2rem;
        width: inherit;
    }
	.com-content-article figure {
		display: flex;
		margin: 0 0 2rem;
		flex-direction: column;
	}
	
	.fields-container {
		margin-left: 1rem;
		
		li {
			background: var(--karev-color-blue);
			color: white;
		}
	}
	.footer .parent {
		padding-top: 1rem;
	}
	.header-5 .hot-card {
		margin-bottom: -2.5rem;
		width: 99.99%
	}
	
	.items-leading .item-content {
		margin: auto;
		padding-right: 1rem;
		width: 100%;
	}
	
	
	.container-nav {
		margin: 0;
		padding-left: 2rem;
	}
	.container-component>* {
		margin: 0;
		overflow: auto;
		padding: 0;
	}
	
	.grid-child {
		/* padding: 0; */
	}
	.grid-child li {
		padding-left: 0.5rem;
	}
	
	.header-5 .hot-card .shadowed {
		margin-bottom: -3.5rem;
	}
	.hot-card {
		height: 15rem;
		padding-left: 5rem;
		width: -webkit-fill-available;
	}

	.masonry-3 .blog-item {
		width: auto;
	}
	
	.pagination {
		padding: 0 1rem !important;
	}
	
	video {
        margin: 0;
        width: 100%;
    }
}


