@import url('https://fonts.googleapis.com/css2?family=Albert+Sans:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
    font-family: 'icons';
    src: url('icons.ttf') format('truetype')
}


*{margin:0;box-sizing: border-box}
body, input, select, textarea{font-family: 'Albert Sans', sans-serif;}

.flex{display: flex;justify-content: space-between}
.c{margin: 0 auto;width:1200px}
.cc{margin: 0 auto;width:1000px}

.logo{height: 45px;display: block;}
.logo-big{height: 70px;display: block;}
.logo img, .logo-big img{height: 100%;}

header{position: relative;z-index: 9000;}

header nav .c{position: relative}
header nav ul{display: flex;justify-content: flex-start;position: relative;padding: 0}
header nav ul li a{padding: 10px 30px;display: inline-block;text-transform: uppercase;font-size: .9em;}
header nav ul li a .icon{font-size: .8em;transform: rotate(90deg);display: inline-block}
header nav ul li a:first-child{padding-left: 0}
header nav ul ul{position: absolute;top: 100%;padding: 15px;display: none;min-width: 300px;}
header nav ul ul a{padding: 8px 25px;}
header nav ul li:hover ul{display: block}
header nav .card{position: absolute;right: 0;top: 13px;font-size: .8em;text-transform: uppercase;}
header nav .card:after{display: block;content: "";height: 1px;}

header nav li a{color: var(--cl2)}
header nav li a:hover{color: var(--cl3)}
header nav ul ul{background-color:var(--cl2)}
header nav ul ul a{color:var(--cl1)}
header nav ul ul a:hover{color:var(--cl3)}

.caroussel{width: 100%;height: 700;z-index: 6000;position: relative;overflow: hidden;}
.caroussel .child{margin: 0!important}
.caroussel .child img, .caroussel video{width:100%;height:700px;object-fit: cover;object-position: center center;position: relative;}
.caroussel .gla_slider .slider_btn{background-color: var(--cl1);}
.masq{padding: 40px;padding-top: 130px;position: absolute;top: 0;left: 0;width: 100%;height:700px;display: flex;flex-direction: row;justify-content: start;align-items: center;background-color: var(--cl2-light);}

.btn{padding: 12px 25px;cursor: pointer;display: inline-block;border-radius: 6px;}
header .btn{padding: 20px 25px;border-radius: 0;}
.btn2{padding: 15px 25px;cursor: pointer;border-width: 1px; border-style: solid;background-color: 'transparent';display: inline-block;}

.service{height: 450px;position: relative;border-radius: 10px;overflow: hidden;cursor: pointer;}
.service img{width: 100%;height: 460px;object-fit: cover;}
.service .cnt{position: absolute;top: 0;bottom: 0;width: 100%; padding: 15px; display: flex;flex-direction: column;justify-content: flex-end;background: var(--cl2-light);}
.service .cnt div{height: 15%;width: 100%; padding: 15px; display: flex;flex-direction: column;justify-content: flex-end;align-items: flex-start;transition: .6s ease-in-out;}
.service:hover .cnt div, .service:focus .cnt div{height:100%;justify-content: center}
.service .title{font-size: 1.7em;color: var(--cl1);}
.service p{font-size: 1.2em;color: var(--cl1);margin: 20px 0;font-weight: 200;display: none;transition: .8s ease;}
.service:hover p{display: block;}
.service .btn{color: var(--cl1);display: none;transition: 1s ease; margin-top: 20px;}
.service:hover .btn{display: flex;align-items: center;}
.service .btn:hover{border-color: var(--cl3);color: var(--cl3);background-color: var(--cl1);}
.service .btn .icon{text-transform: lowercase;margin-left: 20px;line-height: 1.3em;}


.c0 img, .c4 img{width: 100%;height: 600px;object-fit: cover;border-radius: 10px;}
.c4 .box {background-color: var(--cl5);padding: 20px;border-radius: 10px;}
.c4 .box span{font-weight: 500; font-size: 1.1em; margin-bottom: 10px;display: block;}
.c4 .box p{font-size: .9em;}
.c4 .box img{width: 50px;height: 50px; margin-bottom: 10px;}

.c2{background-size: cover;background-position: center;background-attachment: fixed;}

table{border-collapse: collapse;border-radius: 8px;overflow: auto}
table{margin:30px 0;color:#111214;border-collapse: collapse; border:0}
table{border-spacing: 1;border-collapse: collapse; background:white;border-radius:6px;max-width:1200px; width:100%;margin:0 auto;border: 1px solid #40bd6e40;}
table tr{border-bottom:1px solid #40bd6e40!important}
table th{width:20%!important; padding: 15px;background-color: #40bd6e40!important;font-weight: 700;font-size: 1.1em;text-transform: uppercase; }
table td{padding: 15px;text-align: left;vertical-align:middle;font-weight: 300;font-size: .9em;}

.more-img img{width:100%;height: 330px;object-fit: cover;cursor: pointer; transition: 2s ease;}
.more-img img:hover{transform: scale(110%);}
.more_services a{display: block;margin-top: 10px; font-size: 1.2em;}

.content{color: var(--cl2);}
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6{color: var(--cl3);margin-bottom: 20px;}
.content h2{font-size: 1.8em;}
.content h3{font-size: 1.5em;color: var(--cl2)}
.content li{margin-bottom: 10px}
.content img{width: 100%;min-height: 400px;object-fit: contain;}
.image-p{width: 100%;height: 350px;object-fit: cover;border-radius: 10px;cursor: pointer;}
.image-p:hover{opacity: 0.8;}

.infos{background-color: var(--cl3-light);background-size: cover;background-position: center;}

aside ul{padding: 0;}
aside ul li{list-style: none;font-weight: 500;}

footer{background-color: var(--cl5);}
footer ul { padding: 0; display: flex; flex-wrap: wrap; justify-content: flex-end; margin-right: 15px;}
footer ul li{margin-right: 15px; padding: 5px 0;}
footer ul li a{font-size: 1.3em;color: var(--cl2);}
footer ul li:hover a{color: var(--cl3);}
footer ul li ul{display: none;}
footer .social .icon{color: var(--cl3);}

.social{display: flex;flex-wrap: wrap;}
header .social{border-left: 1px solid var(--cl7); margin-left: 20px;padding-left: 20px;}
.social .icon{font-size: 1.2em;color: var(--cl1);}
.social .icon:hover{color: var(--cl4);}

.facebook{background-color: #4267B2}
.twitter{background-color: #1DA1F2}
.instagram{background-color: #e95950}
.kiuper{background-color: #6F9C00}

.contact p{margin-bottom: 10px;}
.contact-img {height: 650px;width: 100%;}
.contact iframe{width: 100%; height: 300px;}
.gla-pagination a,.gla-pagination .btn{padding: 8px 15px;margin-right: 5px}
.gla-pagination{text-align: right}


.car-slide{overflow: hidden;margin: 40px 0;position: relative;}
.car-slide .slide{display: flex;justify-content: flex-start;transition: 0.1s linear;padding: 0 20px;}
.car-slide .article{margin-right: 20px}
.btn.sld{position: absolute;top: 50%;padding:12px 15px;text-align: center;}
.btn.sld#nx{right: 0;cursor: pointer}
.btn.sld#pr{transform: rotate(180deg)}


.gla-form input:not([type=submit]),.gla-form textarea,.gla-form select{padding-bottom: 20px; }
.gla-form input[type=text],.gla-form input[type=email], .gla-form textarea,.gla-form select{outline: none;width: 100%;color: var(--cl2);font-size: 1.2em;margin-bottom: 35px;background-color: transparent;border: none;border-bottom: 1px solid var(--cl2); }
.gla-form input[type=submit]{border: none}
.gla-form textarea{height: 130px}
.gla-form input::placeholder, .gla-form textarea::placeholder{color: var(--cl2);}
.gla-cptch input{width: 60px !important;}

.gla-form label{margin: 10px 20px;font-weight: bold;display: block}

.mask{position: fixed;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.4);display: flex;align-items: center;justify-content: center;padding:20px;z-index: 9999}
.mask img{max-width: 100%;max-height: 100%;background: rgba(255,255,255,0.5);border-radius:3px;box-shadow: 0 0 6px #444;transition: 0.14s linear}
.mask .exit, .mask .btn{position: absolute;text-align: center;font-size: 2em;cursor: pointer;opacity: 0.7;padding: 10px 10px; border-radius: 50%;}
.mask .exit{right: 10px;top: 10px !important;background-color: white; color: var(--cl3);}
.mask .btn{top: 48%;transition: 0.14s linear;background: transparent;vertical-align: middle; background-color: white; color: var(--cl3);}
.mask .btn:hover, .mask .exit:hover{border: 1px solid var(--cl3); background-color: var(--cl3);color: white;}
.mask .btn-next{right: 20px;}
.mask .btn-prev{left: 20px}
.mask .btn-next:hover,.mask .btn-prev:hover,.mask .exit:hover{opacity: 1}

.succes, .error{display:block;margin: 20px 0;padding:10px;}
.succes{background: rgba(0,255,0,0.2);color: rgba(0,200,0,0.9)}
.error{background: rgba(255,0,0,0.3);color: rgba(255,0,0,0.9)}

.rem{font-size: 0.9em !important;color: #666;font-style: italic}
a{text-decoration: none;}
footer li,header li,.contact li{list-style: none;margin-left: 0}


.icon{font-family: 'icons' !important;line-height: 1;}


/* GLA Slider ---------- */

.gla_slider{position: relative;overflow: hidden;padding: 0 0 40px 0;}
.gla_slider .gla_slider_slider{width:100%;display: flex;transition: 0.4s ease;flex-wrap: nowrap}

.gla_slider .slider_btn{position: absolute;color:var(--cl2);bottom:0;padding: 5px 0;cursor: pointer;transition: 0.2s ease;font-size: 1.5em;background-color: var(--cl2-light);width: 40px;height: 40px;border-radius: 50%;display: flex;align-items: center;justify-content: center;}
.gla_slider .slider_btn:hover{opacity: 1;}
.gla_slider .next_btn{right: 10px;left: auto;}
.gla_slider .previos_btn{left: auto; right: 57px;}

.caroussel .gla_slider{padding: 0;}
.caroussel .gla_slider .slider_btn{top: auto; bottom: 10px;z-index: 9999}


/* GLA Alert ---------- */

.mask{display: flex;align-items: center;justify-content: center;}

.gla_alert{width: 400px;background: #fff;box-shadow: 0 0 20px rgba(0,0,0,0.3);}
.gla_alert p{padding: 20px;}
.gla_alert .gla_btns{padding: 10px;background: rgba(0,0,0,0.04);border-top: 1px solid rgba(0,0,0,0.1);display: flex;justify-content: flex-end;}
.gla_alert .gla_btns span{margin-right: 20px;font-weight: bold;text-transform: uppercase;cursor: pointer;}


/* GLA Captcha ---------- */

.gla_captcha{background: #eee;border:1px solid rgb(223, 222, 222);border-radius: 8px;padding: 10px;}
.gla_captcha h3{font-weight: normal;margin-bottom: 10px;}
.gla_captcha span{background: #fff;padding: 5px;color: #333;width: 30px;text-align: center;cursor: pointer;opacity: 0.7;border-radius: 8px;}
.gla_captcha span:hover{opacity: 1;}
.gla_captcha input{width: 100px;height: 30px;}
