@charset "UTF-8";

*,*:before,*:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box }
html, body{ font: 100% 'Poppins', sans-serif; font-weight: 400; line-height: normal; color: #282828; background: #f5f5f5;}
h1, h2, h3, h4, h5, h6 {font-family: 'Poppins', sans-serif;font-weight: 600;font-style: normal;font-stretch: normal;line-height: normal;letter-spacing: normal;color: #282828;}

.container {width: 100%;max-width: 1000px;margin: 0 auto;position: relative;}
.container .right{float: right !important;}

@media screen and (max-width: 1024px) {
  .container {max-width: 500px !important;padding: 0 20px;}
}


.style-1{padding: 80px 0;margin: 0;outline: none;background: #303031;background: linear-gradient(0deg, rgba(48,48,49,1) 20%, rgba(19,19,19,1) 80%);text-align: center;}
.style-1 h1{margin: 40px 0 10px;padding: 0;font-size: 40px;color: #fff;font-weight: 700;}
.style-1 h1 b{color: #cad431}
.style-1 p{font-size: 20px;color: #fff;max-width: 900px;margin: 0 auto;}
.style-1 .list{margin: 40px 0;}
.style-1 .list span{color: #fff;font-size: 20px;padding: 0 20px;margin: 0;overflow: hidden;position: relative;}
.style-1 .list span::before{content: ">";color: #cad431;font-weight: 600;margin: 0;font-size: 26px;line-height: 18px;position: absolute;left: 0;top: 7px;}
.style-1 .box{border: 2px solid #cad431;padding: 18px;border-radius: 20px;text-align: left;}
.style-1 .box h2{color: #cad431;font-size: 22px;}
.style-1 .box p{color: #fff;font-size: 16px;}

@media screen and (max-width: 1024px) {
  .style-1 h1{font-size: 32px;}
  .style-1 .box{min-height: 175px;}
  .style-1 .box p{font-size: 18px;}
}


.style-2{position: relative;padding: 0 0 40px;margin: 0;outline: none;background: #131313;text-align: center;background: linear-gradient(180deg, rgba(48,48,49,1) 20%, rgba(19,19,19,1) 80%);}
.style-2 .splash{background-image: url(../img/bg.webp);background-position: 50% 0%;background-size: auto;background-repeat: no-repeat;position: absolute;top: 100px;left: 0;right: 0;bottom: 0;opacity: 0.5;}
.style-2 .box{background-image: url(../img/mockup.webp);background-position: 50% 0%;background-size: contain;background-repeat: no-repeat;padding: 23px 0;height: 622px;margin: 0;}
.style-2 .box video{width: 772px;height: 435px;margin: 0;border-radius: 4px;}
.style-2 .box .bt{position: absolute;top: 40%;left: calc(50% - 50px);opacity: .5;width: 100px;cursor: pointer;z-index: 999;}
.style-2 .box .bt.hidden{display: none;}
.style-2 .selo{margin: 0;padding: 0;position: absolute;top: -70px;right: 40px;max-width: 150px;}

@media screen and (max-width: 1024px) {
  .style-2 .box{padding: 8px 0;height: 220px;margin: 50px auto;}
  .style-2 .box video{width: 306px;height: 175px;}
  .style-2 .box .bt{width: 50px;left: calc(50% - 25px);}
  .style-2 .selo{max-width: 100px;right: calc(50% - 50px);}
  .style-2 .splash{background-size: cover;}
}


.style-3{padding: 40px 0 0;margin: 0;outline: none;background: #303031;background: linear-gradient(0deg, rgba(48,48,49,1) 20%, rgba(19,19,19,1) 80%);text-align: center;}
.style-3 h1{margin: 0 0 40px;padding: 0;font-size: 40px;color: #fff;font-weight: 700;line-height: 50px;}
.style-3 h1 b{color: #cad431}
.style-3 .list{border: 2px solid #cad431;padding: 10px 20px;border-radius: 20px;text-align: left;max-width: 560px;margin: 0 auto 20px;}
.style-3 .list h2{color: #fff;font-size: 22px;text-align: center;margin: 20px auto;}
.style-3 .list h2 b{color: #cad431}
.style-3 .list p{color: #fff;font-size: 18px;padding: 0 0 10px 20px;margin: 0;overflow: hidden;position: relative;}
.style-3 .list p::before{content: ">";color: #cad431;font-weight: 600;margin: 0;font-size: 26px;line-height: 18px;position: absolute;left: 0;top: 5px;}

.style-3 .flex {display: flex;flex-direction: column;margin: 0 auto;max-width: 700px;}
.style-3 .flex .block{display: flex;flex-direction: row;}
.style-3 .flex .block .box{border: 2px solid #cad431;padding: 10px 20px;border-radius: 15px;text-align: center;margin: 20px 10px;color: #fff;width: 310px;font-size: 24px;}
.style-3 .flex .block .box b {display: block;color: #cad431;}
.style-3 .flex .full{border: 2px solid #cad431;padding: 10px 0 10px 10px;border-radius: 15px;text-align: center;letter-spacing: 13px;margin: 0 10px;color: #1d1d1d;font-size: 24px;font-weight: 600;background: #cad431;}
.style-3 .slider{margin: 50px 0 0 0;max-width: 550px;display: none;}

@media screen and (max-width: 1024px) {
  .style-3 h1{font-size: 34px;}
  .style-3 .list h2{font-size: 19px;}
  .style-3 .list p{font-size: 16px;}
  .style-3 .flex .block{display: flex;flex-direction: column;align-items: center;}
  .style-3 .flex .block .box{margin: 0 0 20px 0;width: 100%;}
  .style-3 .flex .block .box b{display: inline-block;}
  .style-3 .flex .full{margin:0;}
}


.style-4{padding: 80px 0;margin: 0;outline: none;background: #303031;text-align: center;}
.style-4 .container{max-width: 890px;}
.style-4 .box{border: 2px solid #cad431;padding: 20px 30px 0 30px;border-radius: 20px;text-align: left;min-height: 460px;margin: 15px auto;}
.style-4 .box h2{color: #fff;font-size: 20px;margin: 0 0 20px 0;}
.style-4 .box h2 b{color: #cad431;}
.style-4 .box li{color: #fff;font-size: 17px;padding: 0;margin: 0;}
.style-4 .box li b{color: #cad431;font-size: 14px;font-weight: 500;padding: 0;margin: 0 0 0 -20px;}
.style-4 .box li:last-child{list-style: none;}

.style-4 .box.two{min-height: 430px;}

@media screen and (max-width: 1024px) {

}


.style-5{padding: 60px 0 40px 0;margin: 0;outline: none;background: #101010;background: radial-gradient(circle, rgb(39 39 39) 0%, rgba(19,19,19,1) 50%);text-align: left;}
.style-5 h1{color: #ddd;text-align: center;margin: 0;}
.style-5 p{color: #ddd;text-align: center;margin: 0 10px 60px 10px;}

.style-5 .block-left .text{color: #ddd;margin: 20px 0;text-align: left;}
.style-5 .block-left .title{color: #fff;margin: 0 0 10px 0;text-align: left;}
.style-5 .block-left .title b{color: #cad431;}

.style-5 .block-center {border: 2px solid #cad431;text-align: center;border-radius: 15px;padding: 30px 10px;max-width: 400px;margin: 0 auto;}
.style-5 .block-center h1{color: #fff;font-size: 32px;margin: 0;line-height: 40px;}
.style-5 .block-center h2{color: #ddd;margin: 0;font-size: 18px;font-weight: 400;letter-spacing: 5px;}
.style-5 .block-center hr{opacity: .5;border: solid #747747;border-width: 1px 0 0;}
.style-5 .block-center .price{margin: 30px 0;}
.style-5 .block-center .price .box{display: flex;justify-content: center;flex-direction: row;align-items: center;height: 50px;}
.style-5 .block-center .price .box .par{color: #ddd;font-size: 46px;margin: 0 10px 0 0;}
.style-5 .block-center .price .box .val{color: #e4f11c;font-size: 56px;font-weight: 700;}
.style-5 .block-center .price .box .val small{float: left;}
.style-5 .block-center .price p{margin: 0;color: #ddd;line-height: 20px;font-size: 16px;}
.style-5 .block-center a{background: #cad431;padding: 8px 36px;border-radius: 36px;color: #000;font-weight: 700;margin: 5px 0;display: inline-block;}
.style-5 .block-center a:hover{background: #efff00;}
.style-5 .block-center img{max-width: 250px;}
.style-5 .block-center .selo1{position: absolute;top: -40px;right: 10px;}
.style-5 .block-center .selo1 img{max-width: 110px;}

.style-5 .block-right b{color: #ddd;font-size: 26px;}
.style-5 .block-right ul{text-align: left;list-style: none;margin: 20px 0 0 30px;}
.style-5 .block-right ul li{font-size: 16px;color: #ddd;font-weight: 500;margin: 20px 0 0 0;position: relative;}
.style-5 .block-right ul li::before{content: "";background-image:url(../img/check.png);background-position: 50% 50%;background-size: cover;background-repeat: no-repeat;width: 20px;height: 15px;position: absolute;left: -30px;top: 5px;}

@media screen and (max-width: 1024px) {
  .style-5{text-align: center;}
  .style-5 .block-left .text{text-align: center;}
  .style-5 .block-left .title{text-align: center;}
  .style-5 .block-center{margin: 40px auto;}
  .style-5 .block-center .selo1{top: 0;right: -20px;}
  .style-5 .block-right{text-align: left;}
}



.style-6{padding: 40px 0 100px;margin: 0;outline: none;background: #101010;background: radial-gradient(circle, rgb(39 39 39) 0%, rgba(19,19,19,1) 50%);text-align: center;}
.style-6 h1{color: #fff;font-size: 32px;margin: 0;line-height: 40px;}

.style-6 .block {border: 2px solid #ddd;text-align: center;border-radius: 15px;padding: 20px 10px;margin: 50px 10px;}
.style-6 .block h2{margin: 0;font-size: 20px;color: #cad431;}
.style-6 .block h3{margin: 0;font-size: 18px;color: #fff;font-weight: 400;}
.style-6 .block .price{margin: 20px 0;text-align: center;}
.style-6 .block .price .box{display: flex;justify-content: center;flex-direction: row;align-items: center;height: 50px;}
.style-6 .block .price .box .par{color: #fff;font-size: 32px;margin: 0 10px 0 0;}
.style-6 .block .price .box .val{color: #e4f11c;font-size: 32px;font-weight: 700;}
.style-6 .block .price .box .val small{float: left;}
.style-6 .block .price p{margin: 0;color: #ddd;line-height: 10px;font-size: 14px;}

.style-6 .selo2{position: absolute;top: 20px;right: -10px;}
.style-6 .selo2 img{max-width: 110px;}

.style-6 a{background: #cad431;padding: 8px;border-radius: 36px;color: #000;font-size: 14px;font-weight: 700;margin: 0 auto;margin-top: -72px;display: block;max-width: 190px;}
.style-6 a:hover{background: #efff00;}

@media screen and (max-width: 1024px) {
  .style-6 .selo1{left: 0;}
  .style-6 .selo2{right: 0;}
}


.style-7{padding: 80px 0;margin: 0;outline: none;background: #fff;text-align: center;}
.style-7 .container {max-width: 780px;}
.style-7 .box{border: 4px solid #cad431;padding: 40px;border-radius: 20px;text-align: left;margin: 15px auto;}
.style-7 .box h1{color: #383838;font-size: 36px;margin: 0 0 10px 0;line-height: 30px;display: inline-block;position: relative;}
.style-7 .box h1::before{content:"";height: 25px;background: #cad431;position: absolute;top: 8px;left: -3px;right: -4px;}
.style-7 .box h1 span{position: relative;z-index: 9;}

.style-7 .box h2{color: #383838;font-size: 20px;margin: 0;line-height: 25px;font-weight: 400;}
.style-7 .box p{color: #383838;font-size: 16px;padding: 0;margin: 15px 0;line-height: 23px;}
.style-7 .box img{float: right;margin: 20px;margin-right: -80px;max-width: 320px;border-radius: 50%;border: 4px solid #cad431;}



@media screen and (max-width: 1024px) {
  .style-7 .box{text-align: center;padding: 20px;}
  .style-7 .box h1{font-size: 28px;}
  .style-7 .box img{float: initial;margin: 0 auto 30px;max-width: 200px;}
}



.style-8{padding: 80px 0;margin: 0;outline: none;background: #303031;background: linear-gradient(180deg, rgba(48,48,49,1) 20%, rgba(19,19,19,1) 80%);text-align: center;}
.style-8 .container {max-width: 650px;}
.style-8 h1{margin: 0px auto 50px;padding: 0;font-size: 30px;text-align: center;color: #fff;}
.style-8 .toggle-container .border{border: 2px solid #ddd;margin: 0px auto 20px !important;padding: 0;border-radius: 20px;text-align: left;}
.style-8 .toggle-container .toggle-head{font-size: 17px;font-weight: 700;color: #cad431;cursor: pointer;padding: 20px 50px 20px 20px;position: relative;}
.style-8 .toggle-container .toggle-head.active{background-image: url(../img/up.png);background-position: 98% 50%;background-size: initial;background-repeat: no-repeat;}
.style-8 .toggle-container .toggle-head .plusminus{background-image: url(../img/down.png) !important;background-position: 50% 50%;background-size: contain;background-repeat: no-repeat;height: 20px;width: 25px;display: block;position: absolute;right: 20px;top: 20px;}
.style-8 .toggle-container .toggle-head .plusminus.active{background-image: url(../img/up.png) !important;}
.style-8 .toggle-container .toggle-body{padding: 0px 20px 20px;}
.style-8 .toggle-container .toggle-body p{font-size: 14px;color: #fff;margin: 0;outline: none;}
.style-8 .toggle-container .toggle-body > a{background: rgb(115 0 163);font-size: 17px;font-weight: 600;padding: 12px 36px;border-radius: 35px;outline: none;color: #fff;margin: 20px 0 0 0;display: inline-block;text-align: center;box-shadow: 0 20px 50px 10px rgb(0 0 0 / 0.08);}
.style-8 .toggle-container .toggle-body > a:hover {background: #31c2c3;}
.style-8 .toggle-container .toggle-body > small{display: block;font-size: 13px;color: #282928;margin: 15px auto 0;font-lgpd: italic;}

@media screen and (max-width: 1024px) {
  .style-8 h1{font-size: 26px;}
}



.style-9{padding: 60px 0;margin: 0;outline: none;background: #303031;text-align: center;}
.style-9 p{margin: 0 auto;padding: 0;font-size: 18px;text-align: center;color: #fff;}
.style-9 .mail{color: #cad431;display: block;margin: 10px auto 50px;font-size: 20px;font-weight: 600;}
.style-9 .mail:hover {color: #efff00;}
.style-9 ul{list-style: none;margin: 0 auto;display: inline-block;overflow: hidden;}
.style-9 ul li{float: left;}
.style-9 ul li img{margin: 0 10px;max-width: 40px;}
.style-9 img{width: 100%;max-width: 560px;display: block;margin: 50px auto 0;}


@media screen and (max-width: 1024px) {

}




.style-10{padding: 60px 0;margin: 0;outline: none;background: #000;text-align: center;}
.style-10 h4{margin: 0 auto 10px;padding: 0;font-size: 14px;text-align: center;color: #ddd;}
.style-10 p{margin: 0 auto;padding: 0;font-size: 10px;text-align: center;color: #ddd;}

@media screen and (max-width: 1024px) {

}

/* END */
