@charset "UTF-8";
@import "../fonts/fonts.css";

body{
  box-sizing: border-box;
  font-family: 'Notosans', sans-serif;
  color: white;
  margin: 0;
  padding: 0;
  font-size: 14px;
  line-height: 1.2;
  background: var(--black);
  overflow-x: hidden;
  --black: #1e2529;
  --black2: #1d2428;
  --green: #28d697;
}
.body-wrapper {overflow: hidden;}
div, h1, h2, h3, h4, p, ul, ol, li, a, input, textarea, label, button, span{
	box-sizing: border-box;
}

.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.container{
	width: 100%;
	padding-right: 15px;
	padding-left: 15px;
	margin-right: auto;
	margin-left: auto;
}
@media (min-width: 576px){.container{max-width: 540px;}}
@media (min-width: 768px){.container{max-width: 720px;}}
@media (min-width: 992px){.container{max-width: 960px;}}
@media (min-width: 1200px){.container{max-width: 1140px;}}
@media (min-width: 1300px){.container{max-width: 1230px;}}
@media (min-width: 1500px){.container{max-width: 1400px;}}
.col-xl-3, .col-lg-4, .col-lg-6 {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}
@media (min-width: 992px) {
    .col-lg-4 {
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%
    }

    .col-lg-6 {
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%
    }
}
@media (min-width: 1230px) {
    .col-xl-3 {
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%
    }
}
a, a:hover{
  text-decoration: none;
  transition: 0.5s;
  cursor: pointer;
}
a {
	color: white;
}
a:hover{
	color: var(--green);
}

h1, h2, h3, h4, p, ul, ol{
  margin: 0;
}

ul, ol{
  list-style: none;
  margin: 0;
  padding: 0;
}
ul.list, ol.list{
  list-style: inherit;
  margin: 10px 0;
  padding-left: 20px;
}
ul.list li, ol.list li{
	margin: 5px 0;
}

img{
  max-width: 100%;
}

::-webkit-scrollbar {width: 6px;}
::-webkit-scrollbar-track {background: var(--black);}
::-webkit-scrollbar-thumb {
    background-color: var(--green);
    border-radius: 0px;
}
html, body, div, * {
    scrollbar-width: thin;
    scrollbar-color: var(--gold), var(--black);
}
.centered{
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.flex{
  display: flex;
}
.between{
  justify-content: space-between;
}
.align-center{align-items: center;}
.section {
	padding: 90px 0;
	position: relative;
}
.bf {background: #fff;}
.text {
	line-height: 1.5;
	font-size: 20px;
}
.bf .ttl {color: var(--black2);}
.bf .text {color: var(--black2);}
.fs img {
	filter: drop-shadow(2px 4px 6px black);
}
.btn {
	display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgb(40, 214, 151);
    width: 190px;
    height: 45px;
    color: white !important;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase;
    padding: 10px;
}
.btn img {
	margin-left: 20px;
	transition: all 0.3s;
}
.btn:hover {box-shadow: 0 0px 10px #28d697;}
.btn:hover img {transform: rotate(-135deg);}
.btn.two {
    background-color: #0f0f0f;
}
.ttl {
	font-size: 36px;
	font-weight: bold;
	text-transform: uppercase;
	line-height: 1.5;
	margin-bottom: 20px;
	width: 100%;
}
.ttl span {
	color: var(--green);
}
.padding-section {
	padding: 100px 0;    
	position: relative;
}
.mod-languages {
	margin-left: 15px;
	font-weight: bold;
	position: relative;
}
.caret::after {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 0.255em;
    vertical-align: 0.255em;
    content: "";
    border-top: 0.3em solid;
    border-right: 0.3em solid transparent;
    border-bottom: 0;
    border-left: 0.3em solid transparent;
}
.dropdown-menu {
	position: absolute;
	top: 20px;
	right: 5px;
	z-index: 1000;
	display: none;
	float: left;
	min-width: 20px;
	text-align: left;
	list-style: none;
	padding: 0px 10px;
}
.dropdown-menu li {
	margin: 5px 0; 
}
.dropdown-menu.show {
    display: block;
}
.header {
	margin-top: 60px;
}
.cat:not(.st2) .header {    
	margin: 0;
    padding: 30px 0 20px;
    box-shadow: 0 0 5px var(--black2);
    position: relative;
    z-index: 1;
}
.logo {width: 240px;}
.menu a {    
	font-weight: bold;
	text-transform: uppercase;    
	padding: 0 15px;
}
.but_sw {
    background-color: var(--green);
    width: 50px;
    height: 50px;
    margin: 0 5px;
    cursor: pointer;
    transition: all 0.3s;
	position: relative;
}
.but_sw:before {
	content: '';
    background-repeat: no-repeat;
    background-position: center;
	background-size: 20px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	transition: all 0.3s;
}
.but_sw.swiper-prev:before {
    background-image: url(../img/sleft.png);
}
.but_sw.swiper-next:before {
    background-image: url(../img/sright.png);
}
.but_sw:hover {
	box-shadow: 0 0px 10px #28d697;
}
.swiper-wrapper {transform: translateZ(0);}
.swiper-slide {overflow: hidden;}
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
	width: 22px;
	height: 22px;
	margin: 0 10px;
	border: 2px solid var(--green);
	opacity: inherit;
	background: transparent;
}
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet-active {background: var(--green);}

.dowlands {
    background-image: -moz-linear-gradient( -45deg, rgb(23,220,208) 0%, rgb(40,214,151) 100%);
    background-image: -webkit-linear-gradient( -45deg, rgb(23,220,208) 0%, rgb(40,214,151) 100%);
    background-image: -ms-linear-gradient( -45deg, rgb(23,220,208) 0%, rgb(40,214,151) 100%);
    max-width: 1170px;
    margin: auto;
    padding: 30px;
	font-size: 24px;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;    
	margin-bottom: -90px;
    position: relative;
    z-index: 1;
}
.dowlands .title {margin-bottom: 30px}
.dowlands .btns {justify-content:center;}
.dowlands .btn {margin: 0 5px 5px;background: var(--black)}
.dowlands .btn:hover {box-shadow: 0 0px 10px var(--black);}

.main {
	background: #fff;
	color: var(--black);   
}
.main .ttl {
	margin-bottom: 35px;
}
[itemprop="articleBody"] {line-height: 1.5}
[itemprop="articleBody"] h2 {margin-bottom: 10px;}
[itemprop="articleBody"] p {margin-bottom: 20px;}

.footer {
    padding: 80px 0 50px;
	position: relative;
    background: var(--black2);
}
.footer .logo {margin-bottom: 15px;}
.footer .title {
	font-size: 16px;
	color: rgb(40, 214, 151);
	font-weight: bold;
	text-transform: uppercase;
	margin-bottom: 20px;
}
.menu-items {margin: 0 -5px;}
.menu-f a {
    padding: 0 5px 10px;    
	display: inline-block;
}
.footer span {color: var(--green);font-weight: bold;}
.socials {margin: 0 -5px;}
.socials a {
	margin-bottom: 10px;
	display: inline-flex;
	align-items: center;
	width: 115px;
	padding: 0 5px;
}
.socials img {width: 20px;margin-right: 10px;}
.footer .info {
    display: flex;
    justify-content: space-between;
    margin: 0 -15px;
}
.footer .copy {
	text-transform: uppercase;    
	line-height: 1.8;
}
.footer .txt {   
	line-height: 1.8;
}
.footer .item {
    width: 33.3%;
    padding: 0 15px;
    margin-bottom: 20px;
}
.hidden {display: none !important;}
ul.pagin-list {
    display: flex;
    align-items: center;
    justify-content: center;
}
.pagenav img {width: 20px;}
.pagenav {
    display: inline-block;
    margin: 0 5px;
}
a.pagenav {color: var(--green);}
.pagenav.active {font-weight:bold;}
@media (min-width: 992px) {
	.main:before,
	.main:after {
		content: '';
		position: absolute;
		background-size: contain;
		background-repeat: no-repeat;
		width: 280px;
		height: 280px;  
		background-image: url(../img/graphic.png);
		z-index: 1;
	}
	.main:before {
		right: -165px;
		top: -140px;
	}
	.main:after {
		left: -165px;
		bottom: -140px;
	}
}
@media (max-width: 991.9px) {
	.section {padding: 60px 0;}
	.header .menu {
		position: absolute;
		left: -100%;
		top: 0;
		display: block;
		text-align: left;
		padding: 70px 30px;
		height: 100vh;
		background: #0f0f0f;
		transition: all 0.3s;
		width: 250px;
		z-index: 5;
	}
	.header .nav-icon.open+.lang_menu .menu{
		left: 0;
	}
	.header .nav-icon {
		 width: 30px;
		 height: 10px;
		 position: relative;
		 cursor: pointer;
		 z-index: 6;
		 margin-right: 15px;
		 margin-top: -9px;
	}
	.header .nav-icon span {
		 width: 100%;
		 height: 3px;
		 position: absolute;
		 display: block;
		 opacity: 1;
		 background-color: #fff;
		 transform: rotate(0deg);
		 transform-origin: center;
		 transition: all 0.3s ease-in-out;
		 cursor: pointer;
	}
	.header .nav-icon span:nth-child(2), .nav-icon span:nth-child(3) {
		 top: 8px;
		 width: 40%;
	}
	.header .nav-icon span:nth-child(4) {
		 top: 16px;
	}
	.header .nav-icon.open span:nth-child(1) {
		 opacity: 0;
		 transform: translate3d(0, -20px, 0);
		 background-color: #fff;
	}
	.header .nav-icon.open span:nth-child(2) {
		 opacity: 1;
		 transform: rotate(45deg);
	}
	.header .nav-icon.open span:nth-child(3) {
		 opacity: 1;
		 transform: rotate(-45deg);
	}
	.header .nav-icon.open span:nth-child(4) {
		 opacity: 0;
		 transform: translate3d(0, 20px, 0);
		 background-color: #fff;
	}
	.header .nav-icon:hover span:nth-child(2), 
	.header .nav-icon:hover span:nth-child(3),
	.header .nav-icon.open span:nth-child(2), 
	.header .nav-icon.open span:nth-child(3) {
		 width: 100%;
	}
	.header .link{width: 100%;margin: 0 0 10px;display: block;}
    .footer .info {flex-wrap: wrap;}
    .footer .item {width: 50%;}
}
@media (max-width: 767.9px) {
	.socials a {width: auto;}
}
@media (max-width: 639.9px) {
	.ttl {font-size: 28px;}
	.padding-section {padding: 50px 0;}
	.btn {    
		width: 45%;
		font-size: 18px;
		height: 45px;
	}
	.flex {flex-wrap: wrap;}
	.logo {width: 190px;}
    .footer .item {width: 100%;}
}
@media (max-width: 439.9px) {
	#intro .btn {
		margin-bottom: 10px;
	}
	.btn {
		width: 100% !important;
		margin-right: 0 !important;
	}
}