@charset "utf-8";

html, body{font-family: 'Ubuntu', sans-serif;font-size: 100%;line-height: 1.75;font-weight: 400;letter-spacing: -.022em;background-color: #f9f9f9;color: #1d1d1f;font-style: normal}
.headerBehind{height: 44px;}
:root {--default: hsl(221, 39%, 14%); --black: hsl(240, 14%, 1%); --white: hsl(180, 4%, 95%); --yellow: hsl(44, 98%, 49%);}
*:focus {outline: none;}

small, .text_small {font-size: 0.8rem;}
h1{font-size:inherit; line-height:inherit; font-weight:inherit; margin:inherit; padding:inherit;}
.h1 {font-size: 38px;color: var(--default);font-weight: 400;line-height: 1;margin: 30px 0 60px 0;padding: 0;text-align: center;display: grid;position: relative;}
h1.categoryTitle{font-size: 28px; color: var(--default); font-weight: bold; margin-bottom: 10px;}
h2{font-size:inherit; line-height:inherit; font-weight:inherit; margin:inherit;}
a{text-decoration:none; color:inherit; outline:none;}
p{margin-bottom: 1rem;}
p:last-child{margin:0;}
input:focus {outline:none;}
strong{color: #1d1d1f;}
body.doNotScroll{overflow:hidden; height:100vh;}
.flex{display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
.centerFlex{place-content: center;}
.flexHeader{display: flex; align-items: center; justify-content: space-between; padding: 10px 0;}
.align-items-start{-ms-flex-align: start; align-items: flex-start;}
.align-items-center{-ms-flex-align: center; align-items: center;}
.align-items-end{-ms-flex-align: end; align-items: flex-end;}
.transition2s{transition:all 0.2s linear 0s; -webkit-transition:all 0.2s linear 0s; -moz-transition:all 0.2s linear 0s; -o-transition:all 0.2s linear 0s; -ms-transition:all 0.2s linear 0s;}
.transition3s{transition:all 0.3s linear 0s; -webkit-transition:all 0.3s linear 0s; -moz-transition:all 0.3s linear 0s; -o-transition:all 0.3s linear 0s; -ms-transition:all 0.3s linear 0s;}
.nonMobile{display: block;}
.mobile {display:none;}
b{padding:0 4px;display:inline-block}

header {background: #fff;position: fixed;top: 0;left: 0;right: 0;color: #333;z-index: 101;-webkit-box-shadow: 0px 0px 10px 0px rgb(50 50 50 / 50%);-moz-box-shadow: 0px 0px 10px 0px rgba(50, 50, 50, 0.5);box-shadow: 0px 0px 10px 0px rgb(50 50 50 / 50%);}
header .flexHeader img{width: 180px;}
header .flexHeader .info{display: flex;gap: 20px;}
header .flexHeader .info a {background: #85c557;padding: 5px 35px;border-radius: 5px;color: #f9f9f9;}
.headerBehind{height: 84px;}

.mainBannerHolder{margin:0; position: relative;padding:20px 0;overflow: hidden;display: flex;min-height: 60vh;align-items: center;}
.mainBannerHolder .singleBannerHolder .bannerTextHolder {max-width: 50%;}
.mainBannerHolder .singleBannerHolder .imageHolder {position: absolute;right: -130px;border: 100px solid #efefef;border-radius: 50%;}
.mainBannerHolder .singleBannerHolder .imageHolder img {border-radius: 50%;}
.mainBannerHolder .bannerTextHolder .smallTitle{font-size: 20px; text-transform: uppercase; margin: 0 0 20px 0;}
.mainBannerHolder .bannerTextHolder .mainTitle{font-size: 54px; line-height:60px; text-transform: uppercase; margin: 0 0 20px 0;font-weight: 700;}
.mainBannerHolder .bannerTextHolder .mainTitle p span{color: #00a8e5;}
.mainBannerHolder .bannerTextHolder .mainTitleDesc{margin: 0 0 30px 0;font-weight: 500;}
.mainBannerHolder .bannerTextHolder .button{display:inline-block; font-size: 16px; line-height: 38px; text-align: center; padding: 0 22px; border: 2px solid #85c557; color: #fff; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; font-weight: 400; background: #85c557;border-radius: 5px;}
.mainBannerHolder .bannerTextHolder .button:hover{background: #222; color: #fff; border-color: #222;}
.mainBannerHolder .singleBannerHolder {display: flex;justify-content: space-between;flex-flow: row;align-items: center;}

.plan{margin: 100px 0;}
.plan .con-items{display:flex;align-items:stretch;justify-content:center;}
.plan .item{width:100%;background:#fff;box-shadow:0 5px 30px 0 rgba(0,0,0,.05);border-radius:40px;margin:0;padding:10px;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:all .25s ease;position:relative}
.plan .item:not(.color):hover{transform:scale(1.05)}
.plan .item.color:hover,.item:hover .con-img{transform:scale(1.15)}
.plan .con-img{display:flex;align-items:center;justify-content:center;transition:all .25s ease}
.plan .con-img img{width:130px}
.plan .item1{padding-right:45px}
.plan .item2{z-index:100}
.plan .item3{padding-left:45px}
.plan .item.color{background:#00a8e5;color:#fff;transform:scale(1.1)}
.plan .item.color li{color:rgba(255,255,255,.75);opacity: 1;}
.plan .item.color li b,.item.color li i{color:rgba(255,255,255,1)}
.plan .item .headerItem{display:flex;align-items:center;justify-content:center;flex-direction:column;position:relative;width:100%}
.plan .item .headerItem h3{font-size:2rem; margin-bottom: 0;}
.plan .item .headerItem h4{margin-top: 5px;text-align: center;}
.plan .item .headerItem p{font-size:1.2rem}
.plan .badge{position:absolute;top:20px;right:20px;background:#fff;padding:5px 10px;border-radius:12px;color:#00a8e5;font-weight:700;font-size:.85rem}
.plan .item ul {padding: 0;flex: 1;width: 100%;display: flex;flex-flow: column;place-content: center;margin: 0 auto auto auto;}
.plan .item ul li{width:100%;padding:5px;display:flex;align-items:center;justify-content:flex-start;text-align:left;opacity: 60%;}
.plan .item ul li b{color:rgb(var(--color),1)}
.plan .item ul li i{font-size:1.6rem;margin-right:15px;color:rgb(var(--color),1)}
.plan .item button{padding:14px 20px;width:100%;background:#00a8e5;border:3px solid transparent;border-radius:20px;color:#fff;font-weight:700;font-size:1.1rem;box-shadow:0 10px 25px 0 rgba(61,203,171,.35);cursor:pointer;transition:all .25s ease}
.plan .item button:not(.border):hover{transform:translate(0,5px);box-shadow:0 0 rgba(61,203,171,.35)}
.plan .item button.border{border:3px solid #fff}
.plan .item button.border:hover{background:#fff;color:#00a8e5}

.text01 {background: #e8f2fb;padding: 70px 0;}
.text01 span{font-size: 14px;color: #00a8e5;font-weight: 400;position: relative;}
.text01 span::after {content: "";position: absolute;width: 30px;height: 1px;background-color: #00a8e5;bottom: 3px;right: -40px;}
.text01 h2{font-size: 32px;color: #000;font-weight: 600;margin: 20px 0 30px 0;}
.text01 p{font-weight: 400;}

.whyUs{margin-top:50px;padding:50px 0}
.whyUs h2{text-align:center;font-size:32px;font-weight:700;margin-bottom:20px;margin-top:0}
.whyUs .text{text-align:center;font-size:18px}
.whyUs .itemsHolder{display:flex;flex-wrap: wrap;place-content: center;}
.whyUs .itemsHolder .singleItem {width: calc(calc(100% - 160px)/4);text-align: center;padding: 10px 50px;border: 1px solid #efefef;margin: 20px;border-radius: 20px;transition: .3s ease-in-out;cursor: pointer;}
.whyUs .itemsHolder .singleItem:hover{border: 1px solid #b6d8f5;border-radius: 5px;background: #e8f2fb;}
.whyUs .itemsHolder .singleItem:hover img{border-radius: 10px;transform: scale(1.08);}
.whyUs .itemsHolder .singleItem img{background:#00a8e5;border-radius:25px;padding:25px;width:110px;margin:0 auto 20px;transition: .3s ease-in-out;cursor: pointer;}
.whyUs .itemsHolder .singleItem h4 {height: 75px;font-size: 20px;display: flex;align-items: center;place-content: center;font-weight: 500;}
.whyUs .itemsHolder .singleItem p{opacity: 70%;}

.text02 {background: #e8f2fb;padding: 70px 0;margin-top: 50px;}
.text02 span{font-size: 14px;color: #00a8e5;font-weight: 400;position: relative;}
.text02 span::after {content: "";position: absolute;width: 30px;height: 1px;background-color: #00a8e5;bottom: 3px;right: -40px;}
.text02 h2{font-size: 32px;color: #000;font-weight: 600;margin: 20px 0 30px 0;}
.text02 p{font-weight: 400;}

.contact {padding: 0 0 50px 0;position: relative;top: -45px;}
.contact button::selection,h2::selection,label::selection{-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}
.contact .wrapper{width:90%;padding:2rem;background:#fff;box-shadow:0 0 2.2px rgba(0,0,0,.028),0 0 5.3px rgba(0,0,0,.04),0 0 10px rgba(0,0,0,.05),0 0 17.9px rgba(0,0,0,.06),0 0 33.4px rgba(0,0,0,.072),0 0 80px rgba(0,0,0,.1);margin: 0 auto;}
.contact .wrapper h2{background:#00a8e5;letter-spacing:.1rem;padding:1rem;cursor:default;color: #fff;}
.contact button,form,input,textarea{font-family:inherit;font-size:initial}
.contact .form-group label{display:block;margin:2rem 0 .5rem}
.contact .form-group input[type=email],.form-group input[type=text],.form-group textarea{width:100%;padding:1rem .8rem;border:1px solid rgba(0,0,0,.2);outline:0;transition:border .15s}
.contact .form-group textarea{resize:vertical}
.contact .submit{font-weight:700;display:block;width:50%;margin:1rem auto 0 auto;padding:1rem 1.5rem;border:none;background:#00a8e5;cursor:pointer;transition:background .15s;color: #fff;}
.contact i{margin-right:.5rem}
.contact .submit:hover{background:rgba(173,216,230,1)}
.contact .form-group input[type=email]:focus,.form-group input[type=text]:focus,.form-group textarea:focus{border:1px solid #222}
.half{display: flex;gap: 20px;}
.half .form-group{width: 100%;}
@media screen and (min-width:576px){.contact .wrapper{width:70%}}
@media screen and (min-width:768px){.contact .wrapper{width:55%}}
@media screen and (min-width:992px){.contact .wrapper{width:45%}}
@media screen and (min-width:1200px){.contact .wrapper{width:65%}}

footer {background: #fff;padding: 50px 0;}