:root{
--mcolor:#f17022;
--scolor:#069f8f;
--bgcolor:#ededed;
}
*, *:before, *:after {
box-sizing: border-box;
padding: 0;
margin: 0;
}
html{
-webkit-font-smoothing: antialiased;
-webkit-tap-highlight-color: transparent;
scroll-behavior: smooth;
}
body{
line-height: 1.5;
margin: 0;
box-sizing:border-box;
font-family: Tahoma, sans-serif;
color:var(--scolor);
font-size:16px;
font-weight:normal;
background-color: var(--bgcolor);
}
header{
position: sticky;
top: 0;
width:100%;
-webkit-box-shadow: 0px 11px 31px -19px rgba(0,0,0,0.68);
-moz-box-shadow: 0px 11px 31px -19px rgba(0,0,0,0.68);
box-shadow: 0px 11px 31px -19px rgba(0,0,0,0.68);
background-color: #f5f5f5;
z-index:2;
}
header section{
max-width:1300px;
margin:auto;
}
a {
color: var(--mcolor);
text-decoration: none;
background-color: transparent;
-webkit-text-decoration-skip: objects;
}
h1.title, h2.title{
text-align:center;
font-size:22px;
margin:30px 0;
font-weight:normal;
letter-spacing: 1px;
color: var(--scolor);
}
.main{
font-size:14px;
font-weight:normal;
line-height:1.5;
margin: auto;
margin-bottom:30px;
min-height:400px;
}
.pinner{
max-width:1300px;
}
/* Grid styles */
.grid_wrap{
display:grid;
grid-gap: 30px;
max-width:1300px;
margin: 50px auto;
}
.g1{
grid-template-columns: 100%;
}
.g2{
grid-template-columns: repeat(2, 1fr);
}
.g3{
grid-template-columns: repeat(3, 1fr);
}
.g4{
grid-template-columns: repeat(4, 1fr);
}
.g5{
grid-template-columns: repeat(5, 1fr);
}
.g6{
grid-template-columns: repeat(6, 1fr);
}

.gwrapper{
display:grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 50px;
max-width:1300px;
margin:auto;
}
.gwrapper div{
-webkit-box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.06);
-moz-box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.06);
box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.06);
transition: .5s ease-in-out;
}
.gwrapper div:hover{
-webkit-box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.16);
-moz-box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.16);
box-shadow: -1px 4px 14px 3px rgba(0,0,0,0.16);
}
.gwrapper div p{
padding:10px;
text-align: center;
font-size: 15px;
color: var(--mcolor);
}
.gwrapper div img{
width:100%;
height:250px;
object-fit: cover;
display: block;
}

.gallery_wrapper{
list-style: none;
}
.gallery_wrapper img{
width:100%;
height: 200px;
object-fit: cover;
display:block;
}
/* Blog grid */
.blog_wrapper{
list-style: none;
}
.blog_wrapper li{
position: relative;
background-color:#fff;
}
.blog_wrapper p{
font-size:15px;
padding:20px;
line-height:1.5;
position: relative;
}
.blog_wrapper a{
position: absolute;
top:0;
bottom:0;
left:0;
right: 0;
z-index:1;
}
.blog_wrapper span{
text-align:left;
font-size:13px;
display:block;
margin:20px 0 15px 0;
}
.blog_wrapper time, .blog_view div:first-child time{
text-align:right;
font-size:12px;
display:block;
color:var(--mcolor);
font-style:italic;
}
.blog_wrapper img:not(.views){
width:100%;
height: 250px;
object-fit: cover;
display:block;
-webkit-box-shadow: 0px 9px 27px -18px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 9px 27px -18px rgba(0,0,0,0.75);
box-shadow: 0px 9px 27px -18px rgba(0,0,0,0.75);
}
.blog_wrapper li em{
position:absolute;
top:7px;
right:7px;
padding:5px 10px;
font-size:12px;
background-color: rgba(255,255,255, 0.6);
border-radius: 7px;
}
.blog_wrapper li em img{
width:17px;
vertical-align: center;
}
.blog_view{
max-width:1300px;
display:grid;
grid-template-columns: 60% auto;
grid-gap: 30px;
}
.blog_view div:first-child p{
line-height: 1.6;
}
.blog_view div:first-child img{
width: 100%;
display: block;
margin-top: 50px;
margin-bottom: 30px;
}
/* Cooperation */
.cooperation_wrap{
width: 100%;
max-width: 1300px;
margin: 30px auto;
display: grid;
grid-template-columns: 52% auto;
grid-gap: 30px;
}
.cooperation_image img{
width:100%;
height: 100%;
object-fit: cover;
}
.cooperation_form{
padding: 30px;
}
.cooperation_text{
margin-bottom:25px;
}
.cooperation_text h1{
font-size:28px;
margin-bottom:25px;
}
.cooperation_text p{
font-size:14px;
line-height: 1.5;
}
/* Info page */
.info_wrap{
max-width:1300px;
margin: 30px auto;
display: grid;
grid-template-columns: 30% auto;
grid-gap: 50px;
}
.info_wrap .info_wrap_image img{
width: 100%;
height: auto;
}
.info_wrap .info_wrap_text h1{
color: var(--scolor);
font-size: 22px;
margin-bottom: 25px;
text-align: right;
}
.info_wrap .info_wrap_text p{
color: var(--scolor);
font-size: 15px;
line-height: 1.5;
}
.info_just_text{
max-width:1300px;
margin: 30px auto;
}
/* Form elements */
form input[type='text']{
width: 100%;
padding:10px;
font-size: 15px;
margin-bottom: 15px;
outline: none;
border: 1px solid var(--scolor);
}
textarea{
width: 100%;
padding:10px;
font-size: 15px;
font-family: inherit;
outline: none;
border: 1px solid var(--scolor);
}
form input[type='text']::placeholder, textarea::placeholder{
font-size:14px;
color: var(--scolor);
}
#respc, #respv, #respct{
margin-bottom:20px;
font-size: 13px;
}
/* Masonry GALLERY grid */
.masonry_wrap {
column-count: 3;
column-gap: 30px;
}
.masonry_wrap .mitem {
display: inline-block;
margin-bottom: 30px;
width: 100%;
}
.masonry_wrap .mitem img {
width: 100%;
}
/* DESIGN BLOCKS */
.bs1{
position:relative;
max-width:1000px;
margin:50px auto;
border:1px solid transparent;
}
.bs1::after{
content:"";
display:block;
position:absolute;
bottom:0;
right:15%;
width:45%;
height:100px;
background-color: var(--scolor);
z-index:-1;
}
.bs1 img{
width:60%;
height:380px;
object-fit:cover;
display:block;
margin-bottom:30px;
border:5px solid var(--bgcolor);
}
.bs1_texts{
background-color:#fff;
padding:35px 25px;
width:53%;
right:0;
position:absolute;
bottom:20%;
}
.bs1_texts h2{
font-size:19px;
margin-bottom:15px;
color: var(--scolor);
}
.bs1_texts p{
font-size:13px;
line-height:1.5;
color: var(--scolor);
}
.bs1 .bs1_texts a{
font-size:13px;
line-height:1.5;
display:block;
text-decoration: underline;
margin-top: 15px;
color: var(--scolor);
}

.bs2{
position:relative;
max-width:800px;
margin:30px auto;
margin-bottom:120px;
border:1px solid transparent;
}
.bs2::after{
content:"";
display:block;
position:absolute;
top:0;
bottom:0;
right:0;
width:40%;
height:100%;
background-color: var(--scolor);
z-index:-1;
}
.bs2 img{
width:60%;
height:380px;
object-fit:cover;
display:block;
margin:30px 30px 30px auto;
border:5px solid var(--bgcolor);
}
.bs2_texts{
position:absolute;
background-color:#fff;
padding:35px 25px;
width:45%;
bottom:-80px;
}
.bs2_texts h2{
font-size:19px;
margin-bottom:15px;
color: var(--mcolor);
}
.bs2_texts p{
font-size:13px;
line-height:1.5;
color: var(--mcolor);
}

.bs3{
position:relative;
max-width:1000px;
margin:50px auto;
border:1px solid transparent;
}
.bs3::before{
content:"";
display:block;
position:absolute;
top:35%;
bottom:0;
left:0;
right:0;
width:90%;
height:40%;
background-color: var(--mcolor);
z-index:-1;
}
.bs3::after{
content:"";
display:block;
position:absolute;
top:auto;
bottom:0;
left:30%;
right:0;
width:40%;
height:90%;
background-color: #d8dde3;
z-index:-2;
}
.bs3 img{
width:550px;
height:500px;
object-fit:cover;
display:block;
margin:15% auto 50px 50px;
-webkit-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
}
.bs3_texts{
position:absolute;
background-color:#fff;
padding:35px;
width:50%;
right:0;
top:0;
-webkit-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
}
.bs3_texts h2{
font-size:19px;
margin-bottom:15px;
color: var(--scolor);
}
.bs3_texts p{
font-size:13px;
line-height:1.5;
color: var(--scolor);
}

.bs4_wrapper{
position:relative;
max-width:1300px;
display:grid;
grid-template-columns: 48% auto;
grid-gap:30px;
margin:30px auto;
background: #7ffdef;
background: -moz-linear-gradient(45deg, #7ffdef 0%, var(--scolor) 100%);
background: -webkit-linear-gradient(45deg, #7ffdef 0%, var(--scolor) 100%);
}
.bs4_image{
position:relative;
padding:30px;
min-height:450px;
}
.bs4_image h2{
position:absolute;
width:calc(100% - 200px);
height:90px;
top:30px;
right:30px;
bottom:70px;
left:170px;
text-transform: uppercase;
color:#fff;
letter-spacing: 1px;
box-sizing: border-box;
display:flex;
align-items: center;
font-size:calc(9px + 1vw);
font-weight: normal;
overflow: hidden;
}
.bs4_image img{
width:calc(100% - 80px);
height:250px;
object-fit:cover;
position:absolute;
top:auto;
right:30px;
bottom:70px;
left:80px;
z-index:1;
}
.bs4_image::before{
content:"";
display:block;
position:absolute;
top:auto;
bottom:30px;
left:30px;
right:auto;
width:120px;
height: calc(100% - 60px);
background-color: var(--scolor);
z-index:0;
}
.bs4_image::after{
content:"";
display:block;
position:absolute;
top:auto;
bottom:30px;
left:30px;
right:auto;
width:50%;
height:40%;
background-color: var(--scolor);
z-index:0;
}
.bs4_texts{
position:relative;
background-color:#fff;
padding:35px;
display:flex;
justify-content: center;
flex-direction: column;
}
.bs4_texts h2{
font-size:19px;
margin-bottom:15px;
color: var(--scolor);
}
.bs4_texts p{
font-size:13px;
line-height:1.5;
letter-spacing: 1px;
color: var(--scolor);
}
.bs4_texts a{
align-self: flex-start;
}

.bs5_wrapper{
position: relative;
width:100%;
margin:50px 0 50px 0;
}
.bs5_wrapper:after{
content: "";
display: block;
position: absolute;
width:100%;
height:150px;
background-color: var(--mcolor);
bottom:50px;
right: 0;
z-index: -1;
}
.bs5_image{
position: relative;
width:50%;
min-width: 350px;
margin:auto;
}
.bs5_image img{
width:90%;
height:450px;
object-fit: cover;
}
.bs5_texts{
width:65%;
min-width:250px;
position:absolute;
background-color:var(--bgcolor);
padding:0 35px 35px 35px;
display:flex;
justify-content: center;
flex-direction: column;
left:-100px;
top:0;
z-index: 1;
}
.bs5_texts h2{
font-size:28px;
margin-bottom:15px;
color: var(--scolor);
}
.bs5_texts p{
font-size:15px;
line-height:1.5;
letter-spacing: 1px;
color: var(--scolor);
}
.bs5_texts a{
font-size:13px;
line-height:1.5;
display:block;
text-decoration: underline;
margin-top: 15px;
color: var(--scolor);
}

.fpo_wrapper{
position:relative;
max-width:1000px;
margin:50px auto;
display:grid;
grid-template-columns: repeat(2, 1fr);
grid-gap:30px;
}
.fpo_wrapper div img{
width:100%;
height:300px;
object-fit: cover;
display:block;
}
.fpo_wrapper .fpo_texts{
position:absolute;
width:200px;
height:200px;
padding:30px;
background-color:var(--bgcolor);
top:calc(50% - 100px);
left:calc(50% - 100px);
display: flex;
align-items: center;
justify-content: center;
text-transform: uppercase;
font-size: 20px;
letter-spacing: 1px;
text-align: center;
line-height: 1.8;
}

.fpot_wrapper{
position:relative;
max-width:1300px;
margin:30px auto;
display:grid;
grid-template-columns: 40% auto;
grid-gap:30px;
}
.fpot_images{
position:relative;
display:grid;
grid-template-columns: repeat(2, 1fr);
grid-gap:30px;
}
.fpot_images div img{
width:100%;
height:220px;
object-fit: cover;
display:block;
}
.fpot_images div:first-child img{
border-radius: 50% 0 0 0;
}
.fpot_images div:last-child img{
border-radius: 0 0 50% 0;
}
.fpot_wrapper .fpot_texts{
position:relative;
padding:30px;
background-color:var(--bgcolor);
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
letter-spacing: 1px;
line-height: 1.8;
}
.fpot_texts h2{
width: 100%;
font-size: 28px;
text-align: left;
margin-bottom: 30px;
color: var(--scolor);
}
.fpot_texts p{
font-size:14px;
color: var(--scolor);
}
.fpot_texts a{
align-self: flex-start;
}
#dr{
color:var(--mcolor);
}
.rBlock{
max-width:1300px;
margin: 50px auto;
border-radius: 25px 25px 0 0;
background: #7ffdef;
background: -moz-linear-gradient(45deg, #7ffdef 0%, var(--scolor) 100%);
background: -webkit-linear-gradient(45deg, #7ffdef 0%, var(--scolor) 100%);
color: #fff;
position:relative;
}
.rBlock_top {
width: 200px;
padding: 10px 15px;
display: block;
margin: 0 auto;
position: relative;
background-color: var(--bgcolor);
border-radius: 0 0 20px 20px;
}
.rBlock_top img {
display: block;
margin: 0 auto;
padding: 5px;
max-width: 170px;
}
.rBlock_top::before {
content: "";
position: absolute;
top: 0px;
height: 50px;
left: -25px;
width: 25px;
border-top-right-radius: 25px;
box-shadow: 0 -25px 0 0 var(--bgcolor);
}
.rBlock_top::after {
content: "";
position: absolute;
top: 0px;
height: 50px;
right: -25px;
width: 25px;
border-top-left-radius: 25px;
box-shadow: 0 -25px 0 0 var(--bgcolor);
}
.rBlock_content{
text-align:center;
position:relative;
padding:45px;
}
.rBlock_content h2{
font-size: 35px;
font-weight: normal;
letter-spacing: 1px;
margin-bottom:25px;
text-transform: uppercase;
line-height: 1.5;
}
.rBlock_content p{
font-size: 16px;
line-height: 1.5;
letter-spacing: 1px;
}
.rBlock img.apbg1{
position:absolute;
width:200px;
top:35px;
right:45px;
opacity:0.1;
}
.rBlock img.apbg2{
position:absolute;
width:150px;
bottom:25px;
left:85px;
opacity:0.2;
}

.fives_container{
max-width:1300px;
margin:30px auto;
display: grid; 
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; 
grid-template-rows: 1fr; 
grid-gap: 30px; 
grid-template-areas: 
"one one two two three three"
"four four four five five five"; 
}
.one { 
grid-area: one; 
position:relative;
}
.two { 
grid-area: two; 
position:relative;
}
.three { 
grid-area: three; 
position:relative; 
}
.four { 
grid-area: four; 
position:relative; 
}
.five { 
grid-area: five; 
position:relative; 
}
.fives_texts{
position:absolute;
top:auto;
bottom:30px;
left:50px;
right:50px;
background-color: rgba(255,255,255, 0.88);
padding:25px;
}
.fives_texts:before{
content: "";
position:absolute;
width:80%;
height:10px;
background-color: rgba(255,255,255, 0.7);
top:-10px;
left:10%;
}
.fives_texts:after{
content: "";
position:absolute;
width:60%;
height:10px;
background-color: rgba(255,255,255, 0.5);
top:-20px;
left:20%;
}
.one, .two, .three{
width:100%;	
height:450px;
background-size: cover;
background-position: top center;
}
.four, .five{
width:100%;	
height:350px;
background-size: cover;
background-position: top center;
}
.fives_texts h2{
font-size: 17px;
margin-bottom: 15px;
text-align: center;
line-height:1.5;
}
.fives_texts p{
font-size: 13px;
text-align: center;
line-height:1.5;
}
.fives_texts a{
position:absolute;
top:0;
bottom:0;
left:0;
right:0;
}

.blocks_wrapper{
display:grid;
grid-template-columns: repeat(4, 1fr);
grid-gap: 30px;
max-width:1300px;
margin:30px auto;
list-style: none;
}
.blocks_wrapper img{
width:100%;
height: 250px;
object-fit: cover;
display:block;
}
.blocks_wrapper p{
padding:15px;
text-align: center;
background-color: #fff;
}
/* Grid styles */
/* Carousel */
.main .swiperc {
width: 100%;
text-align:center;
margin:50px auto;
}
.swiperc .swiper-slide {
/* border:1px solid #ddd;
background-color:rgba(255,255,255, 0.9); */
display: flex;
justify-content: center;
align-items: center;
box-sizing:border-box;
flex-direction: column;
}
.swiperc .swiper-slide img{
width:100%;
display:block;
object-fit:contain;
border-radius: 50%;
aspect-ratio:1/1;
}
.swiperc .swiper-slide p{
font-size:16px;
padding:10px;
text-transform: uppercase;
}
.swiperc .swiper-pagination{
position:relative;
margin-top:15px;
}
.swiperc .swiper-pagination .swiper-pagination-bullet
{
width: 10px;
height: 5px;
border-radius: 0;
transition: 0.8s;
margin: 1px;
background-color: #888;
}
.swiperc .swiper-pagination .swiper-pagination-bullet:hover
{
background-color: #555;
}
.swiperc .swiper-pagination .swiper-pagination-bullet-active{
width: 20px;
transition: 0.8s;
}
/* Accordion */
.accordion { 
padding-bottom: 1px; 
width: 70%; 
margin: auto;
}
.accord-header { 
position:relative;
background-color: #f8f8f8; 
padding:10px 45px 12px 20px;
text-align:left;
margin-bottom:10px;
font-weight:normal;
font-size:17px;
color:var(--scolor);
border:1px solid #fff;
transition:0.5s;
cursor:pointer;
user-select:none;
}
.accord-header:after { 
position:absolute;
content: url(/img/icons/ar-d.svg);
width:25px;
right:20px;
top:12px;
}
.accord-opened:after { 
content: url(/img/icons/ar-uw.svg);
position: absolute;
width: 25px;
right: 20px;
top: 12px;
}
.accord-header.accord-opened, .accord-header:hover {
background-color: var(--scolor); 
color:#fff;
}
.accord-header:hover:after { 
content: url(/img/icons/ar-dw.svg);
}
.accord-opened:hover:after { 
content: url(/img/icons/ar-uw.svg);
top:12px;
}
.accord-content { 
display: none; 
padding:25px;
font-size:14px;
background-color:#f8f8f8;
margin-bottom:30px;
border-bottom:3px solid var(--scolor);
color:var(--scolor);
}
.accord-content a{
color:var(--mcolor);
text-decoration:underline;
}
/* Slider */
.swipers{
height: calc(100vh - 120px);
width:100%;
}
.swipers .swiper-slide {
overflow: hidden;
}
.swipers .slide-inner {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background-size: cover;
background-position: center;
}

.swipers .swiper-slide .caption {
position: absolute;
bottom: 10%;
left:10%;
text-align: left;
margin: 0;
width:35%;
z-index: 1;
transition: 0.8s;
background-color:rgba(255,255,255, 0.5);
border: 1px solid rgba(255,255,255, 0.7);
padding:40px;
backdrop-filter: blur(7px);
transform:translateX(-50px);
}
.swipers .swiper-slide .caption h2 {
color: var(--scolor);
display: block;
font-weight:normal;
font-size: 25px;
font-weight:normal;
box-sizing:border-box;
padding:15px 0;
margin:0;
text-transform:uppercase;
position:relative;
text-shadow: 1px 1px 1px #fff;
}
.swipers .swiper-slide .caption h2:before {
content: "";
position:absolute;
top:0;
width:30px;
height:3px;
background-color: rgba(241, 112, 34, 0.5);
}
.swipers .swiper-slide .caption{
overflow:hidden;
height:auto;
margin-bottom:10px;
}
.swipers .swiper-slide .caption p {
color: var(--scolor);
display: block;
font-size: 15px;
line-height:1.5;
padding:15px 0;
margin:0;
font-weight: normal;
}
.swipers .swiper-slide .caption hr {
border: none;
height: 1px;
background-color: rgba(255,255,255,0.5);
margin: 0;
width: 0;
transition: 0.8s ease;
}
/* Pagination styles */
ul.pagination {
text-align:center;
margin:30px 0;
}
ul.pagination li {
display:inline;
padding:0 3px;
}
ul.pagination a {
color:var(--mcolor);
display:inline-block;
padding:5px 10px;
border:1px solid #cde0dc;
text-decoration:none;
}
ul.pagination a:hover,
ul.pagination a.current {
background-color:var(--mcolor);
color:#fff;
}
/* Pagination styles */
.fade-in {
animation: fadeIn ease 0.8s;
-webkit-animation: fadeIn ease 0.8s;
-moz-animation: fadeIn ease 0.8s;
}
.rsuccess{
color:green;
}
.rerror{
color:red;
}
.wrap{
width:35%;
min-width:350px;
margin:auto;
}
@keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}
@-moz-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}
@-webkit-keyframes fadeIn {
0% {opacity:0;}
100% {opacity:1;}
}
.footer{
background-color:var(--scolor);
}
.footeri{
max-width:1300px;
margin:auto;
padding:35px;
color:#fff;
display: grid;
grid-template-columns: 40% 20% auto;
grid-gap: 50px;
}
.footeri div:first-child img.flogo{
display: block;
margin-bottom:25px;
width: 250px;
}
.footeri div:first-child p, .footeri div:last-child p{
font-size:13px;
line-height: 1.5;
}
.footeri a{
color:#fff;
}
.footeri ul.sLang{
margin: 25px 0;
list-style: none;
}
.footeri ul.sLang li{
display: inline-block;
margin-right:10px;
text-transform: uppercase;
}
ul.fvertical{
margin: 25px 0;
}
ul.fvertical li{
list-style: none;
margin-bottom: 15px;
font-size:14px;
}
ul.fvertical li:last-child{
margin-bottom: 0;
}
ul.fvertical li img{
width: 20px;
height: 20px;
object-fit: contain;
display: inline;
margin-right: 15px;
vertical-align:text-bottom;
}
ul.fhorizontal{
margin: 25px 0;
}
ul.fhorizontal li{
list-style: none;
margin-bottom: 15px;
font-size:14px;
display: inline;
}
ul.fhorizontal li:last-child{
margin-bottom: 0;
}
ul.fhorizontal li img{
width: 30px;
height: 30px;
object-fit: contain;
display: inline;
margin-right: 15px;
vertical-align:text-bottom;
}
ul.flist{
margin: 25px 0;
}
ul.flist li{
list-style: square;
list-style-position: inside;
line-height: 1.8;
font-size:14px;
}
ul.flist li a{
text-decoration: underline;
}
/* Search */
#search input[type="text"]{
margin: 30px auto;
padding:10px 15px;
width:200px;
outline:none;
border:1px solid transparent;
border-bottom:2px solid var(--scolor);
background-color:rgba(255,255,255, 0.8);
transition:0.8s;
font-size:17px;
color: var(--scolor);
background-image: url("/img/icons/search.svg");
background-position: 97% center;
background-repeat: no-repeat;
background-size: 30px 30px;
}
#search input[type="text"]:focus{
width:100%;
background-color:rgba(255,255,255, 1);
}
ol.search_results{
width:50%;
min-width:390px;
margin:30px auto;
list-style-position: inside;
background-color: #f2f2f2;
border: 1px solid #ccc;
padding: 30px;
}
ol.search_results li{
line-height: 2;
text-align: left;
color: #aaa;
}
ol.search_results li a{
text-decoration: underline;
color: var(--scolor);
margin-left: 5px;
}
ol.search_results li a:hover{
color: var(--mcolor);
}
/* Contact form */
.contact_wrapper{
max-width: 1300px;
margin: auto;
display: grid;
grid-template-columns: 25% 40% auto;
grid-gap:50px;
}
.contact_wrapper_info{
background-image: url("/img/other/contact.png");
background-size: contain;
background-position: center bottom;
background-repeat:no-repeat;
}
/* Box Shadows */
.bsh{
-webkit-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
box-shadow: 0px 0px 25px -11px rgba(0,0,0,0.5);
}
/* Buttons */
.msbuttonl {
display:inline-block;
margin:20px 0;
color: #fff;
transition: 0.8s;
position: relative;
padding:10px 25px;
text-align:center;
background-color:transparent;
text-transform:uppercase;
font-size:13px;
letter-spacing:1px;
outline:none;
cursor:pointer;
border:1px solid #fff;
z-index: 0;
transition:0.3s ease-in;
}
a.msbuttonl{
color: #fff!important;	
}
.msbuttonl::before{
height:0;
content: "";
position: absolute;
top: auto;
left: 0;
bottom: 0;
right: 0;
background-color:#fff;
transition:0.3s ease-in;
z-index:-1;
}
.msbuttonl:hover{
color:var(--scolor)!important;
}
.msbuttonl:hover::before {
height:100%;
}

.msbuttond {
display:inline-block;
margin:20px 0;
color: var(--scolor);
transition: 0.8s;
position: relative;
padding:10px 25px;
text-align:center;
background-color:transparent;
text-transform:uppercase;
font-size:13px;
letter-spacing:1px;
outline:none;
cursor:pointer;
border:1px solid var(--scolor);
z-index: 0;
transition:0.3s ease-in;
}
a.msbuttond{
color: var(--scolor)!important;	
}
.msbuttond::before{
height:0;
content: "";
position: absolute;
top: auto;
left: 0;
bottom: 0;
right: 0;
background-color:var(--scolor);
transition:0.3s ease-in;
z-index:-1;
}
.msbuttond:hover{
color:#fff!important;
}
.msbuttond:hover::before {
height:100%;
}
@-webkit-keyframes closeLetter {
50% {transform: rotateX(-90deg);}
100% {transform: rotateX(-180deg);}
}
@keyframes closeLetter {
50% {transform: rotateX(-90deg);}
100% {transform: rotateX(-180deg);}
}
@-webkit-keyframes fadeOutText {
49% {opacity: 1;}
50% {opacity: 0;}
100% {opacity: 0;}
}
@keyframes fadeOutText {
49% {opacity: 1;}
50% {opacity: 0;}
100% {opacity: 0;}
}
@-webkit-keyframes fadeInEnvelope {
0% {opacity: 0; transform: translateY(8rem);}
/*90% {opacity: 1; transform: translateY(4rem);}*/
100% {opacity: 1; transform: translateY(4.5rem);}
}
@keyframes fadeInEnvelope {
0% {opacity: 0; transform: translateY(8rem);}
/*90% {opacity: 1; transform: translateY(4rem);}*/
100% {opacity: 1; transform: translateY(4.5rem);}
}
@-webkit-keyframes scaleLetter {
66% {transform: translateY(-8rem) scale(0.5, 0.5);}
75% {transform: translateY(-8rem) scale(0.5, 0.5);}
90% {transform: translateY(-8rem) scale(0.3, 0.5);}
97% {transform: translateY(-8rem) scale(0.33, 0.5);}
100%{transform: translateY(-8rem) scale(0.3, 0.5);}
}
@keyframes scaleLetter {
66% {transform: translateY(-8rem) scale(0.5, 0.5);}
75% {transform: translateY(-8rem) scale(0.5, 0.5);}
90% {transform: translateY(-8rem) scale(0.3, 0.5);}
97% {transform: translateY(-8rem) scale(0.33, 0.5);}
100%{transform: translateY(-8rem) scale(0.3, 0.5);}
}
@keyframes pushLetter {
0% {transform: translateY(-8rem) scale(0.3, 0.5);}
50% {transform: translateY(-8rem) scale(0.3, 0.5);}
90% {transform: translateY(-8.5rem) scale(0.3, 0.5);}
100% {transform: translateY(-8rem) scale(0.3, 0.5);}
}
.nothing{
background-color: #eee;
border:1px solid #ddd;
width:300px;
margin:auto;
color:#bbb;
padding:15px 25px;
box-sizing: border-box;
text-align: center;
text-shadow: 1px 1px 1px #fff;
}
img.i404{
width:150px;
display: block;
margin: auto;
}
/* Donation */
.donation_wrap{
max-width:800px;
margin:30px auto;
display:grid;
grid-template-columns: auto 200px 200px;
grid-gap:30px;
}
.donation_wrap div label{
display:block;
font-size:15px;
margin-bottom:15px;
}
.donation_wrap div input[type='number'], .donation_wrap div input[type='text']{
padding:15px;
margin:0;
border:1px solid #ccc;
border-radius:5px;
background-color:#fff;
width:100%;
font-size:18px;
outline:none;
color: #069f8f;
}
.donation_wrap div input[type='number']:focus, .donation_wrap div input[type='text']:focus{
border:1px solid var(--mcolor);
}
.donation_wrap div:nth-child(1){
display:flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-start;
}
.donation_wrap div:nth-child(2){
display:flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-start;
}
.donation_wrap div:nth-child(3){
display:flex;
justify-content: flex-end;
align-items: flex-end;
}
.donation_wrap div:nth-child(3) button{
padding:15px 25px;
border:1px solid #ccc;
border-radius:5px;
background-color:#fff;
color:var(--scolor);
width:100%;
cursor:pointer;
font-size:18px;
letter-spacing: 1px;
text-transform: uppercase;
transition:0.8s;
}
.donation_wrap div:last-child button:hover{
background-color:var(--mcolor);
color:#fff;
}
ul.sLang{
display: flex;
align-items: center;
margin:0!important;
}
ul.sLang li{
list-style-type:none;
display:inline-block;
}
ul.sLang li img{
width:25px;
display:block;
margin-left:8px;
}
/* MEDIA QUERIES */
@media screen and (max-width: 1300px) {
	.main, header section{
	/*.main, .grid_wrap, .bs1, .bs2, .bs3, .fives_container, .bs4_wrapper{*/
	width:95%;
	}
}
@media screen and (max-width: 1200px) {
	.g6{
	grid-template-columns: repeat(5, 1fr);
	}
}
@media screen and (max-width: 1100px) {
	.g6, .g5{
	grid-template-columns: repeat(4, 1fr);
	}
	.masonry_wrap{
	column-count: 3;
	}
}
@media screen and (max-width: 1000px) {
	.g6, .g5, .g4{
	grid-template-columns: repeat(3, 1fr);
	}
    .accordion{
    width:100%;
    }
	.swipers{
    height: 60vh;
    width:100%;
    }
    .swipers .swiper-slide .caption {
	width:70%;
	padding:20px;
	}
	.swipers .swiper-slide .caption h2 {
	font-size: 15px;
	}
	.swipers .swiper-slide .caption p {
	font-size: 12px;
	}
}
@media (min-width: 992px){
	.site-menu {
	display: block !important;
	}
	.mtoggle{
	display:none;
	}
}
@media screen and (max-width: 1281px) {
	.mtoggle{
	display:block!important;
	}
	.site-menu {
	display: none !important;
	}
	.site-navbar .site-navigation {
	text-align: right !important;
	}
}
@media screen and (max-width: 900px) {
	.masonry_wrap{
	column-count: 2;
	}
	.fives_texts{
	bottom:20px;
	left:20px;
	right:20px;
	padding:20px;
	}
	.fives_texts h2{
	font-size:15px;
	}
	.fives_texts p{
	font-size:12px;
	}
	.bs5_image {
	width: 70%;
	}
	.fpot_images div img{
	height:100%;
	}
	.footeri{
	grid-template-columns: 100%;
	grid-gap: 0;
	}
	.contact_wrapper {
	grid-template-columns: 100%;
	grid-gap: 20px;
	}
}
@media screen and (max-width: 800px) {
	.g6, .g5, .g4, .g3{
	grid-template-columns: repeat(2, 1fr);
	}
	.blog_view{
	grid-template-columns: 100%;
	}
	.blocks_wrapper{
	grid-template-columns: repeat(2, 1fr);
	}
    .cooperation_wrap{
    grid-template-columns: 100%;
    grid-gap:0;
    }
}
@media screen and (max-width: 700px) {
	.masonry_wrap {
	column-count: 1;
	}
	.fives_container{
	grid-template-columns: 1fr 1fr;
	grid-template-areas: 
	"one two"
	"three four"
	"five ."; 
	}
	.one, .two, .three, .four, .five{
	height:350px;
	}
	.bs4_wrapper{
	grid-template-columns: 100%;
	}
	.bs5_image{
	width:100%;
	display: flex;
	flex-direction: column;
	order:1;
	}
	.bs5_image img{
	width:100%;
	height:300px;
	}
	.bs5_texts{
	width:100%;
	left:0;
	padding:35px;
	position:relative;
	background-color:#fff;
	order:2;
	}
	.bs5_texts h2{
	font-size: 20px;
	}
	.bs5_texts p{
	font-size: 14px;	
	}
	.fpot_wrapper{
	grid-template-columns: 100%;
	grid-gap:0;
	}
	.fpot_images div:first-child img, .fpot_images div:last-child img {
	border-radius: 0;
	}
	.fpot_images{
	grid-gap:5px;
	}
	.info_wrap{
	grid-template-columns: 100%;
	grid-gap: 30px;
	}
}
@media screen and (max-width: 600px) {
	.g6, .g5, .g4, .g3, .g2{
	grid-template-columns: 100%;
	}
	.bs1 img, .bs2 img, .bs3 img{
	width:100%;
	height:380px;
	margin-bottom:0;
	margin-left:0;
	margin-top:0;
	}
	.bs1_texts, .bs2_texts, .bs3_texts{
	position:relative;
	width:100%;
	left:0;
	bottom:5px;
	}
	.fives_container{
	grid-template-columns: 100%;
	grid-template-areas: 
	"one"
	"two"
	"three"
	"four"
	"five";
	}
	.one, .two, .three, .four, .five{
	height:350px;
	}
	.fpo_wrapper div img{
	height:200px;
	}
	.blocks_wrapper{
	grid-template-columns: 100%;
	}
	.swipers{
    height: 50vh;
    width:100%;
    }
}
@media screen and (max-width: 500px) {

}
@media screen and (max-width: 400px) {

}