@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

*{font-family:'Rubik',Arial;direction:rtl}
.wpcf7 input[type="url"], .wpcf7 input[type="email"], .wpcf7 input[type="tel"]{font-family:'Rubik',Arial;direction:rtl!important}
html{direction:rtl}
body{margin:0;padding:0}
.bg {background-image: url(../img/bg2.jpg);;position: fixed;top: 0;left: 0;bottom: 0;right: 0;z-index: -1;background-position: center;background-size: cover;/* background-color: #181818; *//* background: #f5f5f5; *//* background: linear-gradient(180deg, #F5F5F4, #fff); */}
.content{
    color: #333;
    font-size: 18px;
}
.header{position: relative;overflow: hidden;text-align: center;height: 100vw;}
.header .logo{padding-top: 3vw;padding-bottom: 4vw;position: absolute;z-index:1;width: 100%;background: linear-gradient(180deg, rgba(0,0,0,0.7) 30%, rgba(0,0,0,0));}
.header .logo img{width: 40%;margin: 0 auto;display: block;max-width: 260px;}
.header .hero-pic{margin:0 auto;position: absolute;left: -200vw;right: -200vw;background-image: url('../img/hero-pic.jpg');width: 140vw;height: 100vw;background-size: cover;background-position: center;/*animation:2s big_small forwards*//* animation-delay: 5s*/transition: 0.1s transform;transition-delay: 1s;}
.header.inview .hero-pic{transform: scale(3.5) translate(18%, 6.5%);transition-delay: 3s;transition-duration: 1.5s;}
.hero-pic .vid {width: 36%;position: absolute;/* height: 0; *//* overflow: hidden; */border: 1px black solid;left: 14%;top: 29%;display: block;background-image: url(../img/red-bull-racing-with-badge.webp);background-size: cover;background-position: center;}
.hero-pic::after{position:absolute;left:0;right:0;top:0;bottom:0;content:""}
.hero-pic .vid::before {content: "";padding-bottom: 57%;display: block;position: static;}
.hero-pic .vid .videotop {position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;height: 100%;}
.header .slogen{text-align: center;font-size: 4vw;color: #333;padding: 0 2vw;font-weight: 300;position: absolute;bottom: 0;color: white;left: 0;right: 0;text-shadow: 0 0 2px black;background: linear-gradient(0deg, rgba(0,0,0,0.7) 30%, rgba(0,0,0,0));}
.header .slogen::before{content:"...";font-size: 200%;line-height: 0;}
.header .slogen::after{content:"...";font-size: 200%;line-height: 0;}
.wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.payment-required .wpcf7-response-output {display: block;width: 100%;position: absolute;top: 100%;}

.form-wrapper{margin: 40px 20px;}
.form-wrapper form{display: flex;position: relative;justify-content: center;}
.form-wrapper form .form-inputs{width: calc(100% - 40px);border-radius: 30px;border: 1px solid #81b4e7;overflow: hidden;background: #fff;color: #3e3e3e;font-weight: 100;}.form-wrapper form .form-inputs .input-wrap{height: 60px;border-bottom: 1px solid;position: relative;border: 0;}
.form-wrapper form .form-inputs .input-wrap:not(:nth-child(4)){border-bottom: 1px #bcd6ef solid;}
.form-wrapper form .form-inputs .input-wrap:last-child{border:0}
.form-wrapper form .form-inputs .input-wrap img{position: absolute;height: 24px;top: 0;bottom: 0;margin: auto;right: 17px;z-index: 1;}
.form-wrapper form .form-inputs .input-wrap input{background: transparent;border: 0;position: absolute;top: 0;left: 0;right: 0;bottom: 0;box-sizing: border-box;padding-right: 60px;font-size: 20px;color: black;font-weight: 200;z-index: 2;outline: none;width:100%;height:100%;}
.form-wrapper form .form-inputs .input-wrap span {width: 100%;height: 100%;display: block;}
.form-wrapper form .form-inputs .input-wrap label{position: absolute;top: 0;left: 0;right: 0;bottom: 0;padding-right: 60px;line-height: 60px;font-size: 20px;transition: 0.2s all;background: linear-gradient(-90deg, #f1f6fb, transparent);}
.form-wrapper form .form-inputs .input-wrap input.notEmpty + label,
.form-wrapper form .form-inputs .input-wrap input:focus + label{line-height: 18px;font-size: 14px;background: linear-gradient(-90deg, #9ed0ff, transparent);}
.form-wrapper form .submit{background: linear-gradient(0deg, #ff3600, #fb8f72);width: 80px;height: 80px;position: absolute;left: -10px;top: 0;bottom: 0;margin: auto;border-radius: 50%;box-shadow: 0px 0 0px 2px #81b4e7;}
.form-wrapper form .submit::after{content:"";position: absolute;border-right: 24px solid white;top: 0;bottom: 0;left: 0;right: 8px;height: 0px;margin: auto;width: 0;border-top: 15px solid transparent;border-bottom: 15px solid transparent;}
.top-text {margin: 0 auto;max-width: 1200px;margin-bottom: 60px;padding:0 20px;text-align: center;}
.sections{margin: auto;padding: 20px;}
.sections section{overflow: hidden;padding-bottom: 40px;border-radius: 28px;}
.sections section .vid{border: 1px solid white;padding-bottom: 56%;border-radius: 30px;overflow: hidden;background-image: url(https://blogs.poly.com/wp-content/uploads/2021/09/MicrosoftTeams-image-28.png);;background-size: cover;background-position: center;position: relative;z-index: 1;;;;;;;background-color: white;;;;;;;}
.sections section .vid::after{content:"";position: absolute;top: 0;bottom: 0;left: 0;right: 0;background: rgba(0,0,0,0.6);transition: 0.5s all;z-index: 1;}
.sections section .vid.inview::after{background: rgba(0,0,0,0.1);}
.sections section .vid .play{position: absolute;width: 60px;height: 60px;top: 0;left: 0;bottom: 0;right: 0;background: rgb(0 16 32 / 75%);margin: auto;border-radius: 50%;z-index: 3;}
.sections section .vid .play::after{content:"";position: absolute;border-right: 20px solid white;top: 0;bottom: 0;left: 0;right: 8px;height: 0px;margin: auto;width: 0;border-top: 12px solid transparent;border-bottom: 12px solid transparent;}
.sections section .text-wrap{/* border: 1px solid; */border-radius: 30px;padding: 20px;font-size: 18px;padding-top: 80px;margin-top: -60px;background: linear-gradient(-45deg, #fff, transparent);background: rgb(255 255 255 / 70%);transform: translateY(-100%);transition: 2s all;box-shadow: 0 10px 10px -10px #ccc;}
.sections section .text-wrap.inview{transform: none !important;}
.sections section .text-wrap .text-title{font-size: 28px;font-weight: 500;margin-bottom: 10px;}
.sections section .text-wrap .text{
    font-weight: 100;
}
.form-wrapper form .submit input {position: absolute;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;border: 0;font-size: 0;border-radius: 50%;z-index: 9999;background: transparent!important}

.text-wrap-middle{max-width: 800px;margin: 0 auto 40px;padding: 20px;}
.text-wrap-middle .text-middle-title{text-align: center;font-size: 28px;font-weight: 500;margin-bottom: 10px;color: #333;}
.text-wrap-middle .text-middle{
    font-weight: 100;
}


.logos .owl-item img {max-height: 110px;vertical-align: middle;width: auto;max-width: calc(100% - 40px);margin: 0 auto;}
.logos .owl-item .item {height: 150px;display: flex;align-items: center;background: white;border-radius: 40px;border: 1px solid #ccc;}

.logos-title {font-size: 18px;margin: 20px 0;text-align: center;font-weight: bold;}
.logos-wrap{}
.logos-wrap .logo{}
.logos-wrap .logo .item{}


@keyframes big_small{
    from {transform:none}
    to {transform: scale(3.5) translate(18%, 6.5%);}
}

@media(min-width: 992px){
.header{height: 37vw;margin-bottom: 60px;overflow: hidden;}
.header.inview .hero-pic{transform: scale(5.5) translate(9.4%, 5%);}

.header .logo{margin: 0;padding-top: 20px;padding-bottom: 20px;}
.header .logo img{}
.header .slogen{padding-bottom: 20px;font-size: 40px;padding-top: 20px;}
.header .hero-pic {width: 100vw;height: 37vw;}
.hero-pic .vid {width: 18.6%;left: 31.1%;}

@keyframes big_small{
    from {transform:none}
    to {transform: scale(5.5) translate(9.4%, 5%);}
}


.form-wrapper{margin: 20px 10px 100px;position: sticky;top: 10px;z-index: 100;background: rgb(245 245 245 / 90%);box-shadow: 0 0 0 10px rgb(245 245 245 / 90%);}
.form-wrapper form{display: flex;position: relative;max-width: 1200px;margin: 0 auto;justify-content: start;}
.form-wrapper form .form-inputs{width: calc(100% - 106px);display: flex;border-radius: 0 40px 40px 0;}.form-wrapper form .form-inputs .input-wrap{height: 74px;border-bottom: 0 !important;position: relative;width: 22%;margin: 2px;}
.form-wrapper form .form-inputs .input-wrap:nth-child(4) {width: 32%;}
.form-wrapper form .form-inputs .input-wrap img{height: 24px;}
.form-wrapper form .form-inputs .input-wrap input{padding-right: 60px;font-size: 24px;}
.form-wrapper form .form-inputs .input-wrap label{padding-right: 60px;line-height: 74px;font-size: 24px;border-radius: 0  37px 37px 0;}
.form-wrapper form .form-inputs .input-wrap input.notEmpty + label,
.form-wrapper form .form-inputs .input-wrap input:focus + label{line-height: 24px;font-size: 16px;}

.form-wrapper form .submit{background: linear-gradient(0deg, #ff3600, #fb8f72);width: 120px;height: 120px;left: 0px;}
.form-wrapper form .submit::after{border-right: 35px solid white;border-top: 22px solid transparent;border-bottom: 22px solid transparent;}
.sections{max-width: 1420px;}
.sections section{overflow: hidden;padding-bottom: 60px;border-radius: 38px;display: flex;position: relative;}
.sections section .vid{border: 3px solid white;border-radius: 40px;min-width: 48%;padding-bottom: 27%;box-sizing: border-box;}
.sections section .vid::after{}
.sections section .vid.inview::after{}
.sections section .vid .play{position: absolute;width: 80px;height: 80px;top: 0;left: 0;bottom: 0;right: 0;background: rgb(255 54 0 / 80%);margin: auto;border-radius: 50%;z-index: 3;}
.sections section .vid .play::after{content:"";position: absolute;border-right: 20px solid white;top: 0;bottom: 0;left: 0;right: 8px;height: 0px;margin: auto;width: 0;border-top: 12px solid transparent;border-bottom: 12px solid transparent;}
.sections section .text-wrap{border-radius: 40px;padding: 30px;font-size: 18px;line-height: 1.2;transform: translateX(100%);transition: 2s all;margin-top: 30px;margin-bottom: 30px;margin-right: -60px;padding-right: 100px;display: flex;flex-direction: column;justify-content: center;}
.sections section .text-wrap.inview{}
.sections section .text-wrap .text-title{font-size: 30px;margin-bottom: 10px;/* color: rgba(255,255,255,0.8); */}
.sections section .text-wrap .text{}
.sections section:nth-child(odd){flex-direction: row-reverse;}
.sections section:nth-child(odd) .vid{}
.sections section:nth-child(odd) .text-wrap{margin-right: auto;margin-left: -60px;padding-left: 100px;padding-right: 40px;transform: translateX(-100%);background: linear-gradient(45deg, #fff, transparent);background: rgb(255 255 255 / 70%);}
.text-wrap-middle{max-width: 800px;margin: 40px auto 80px;padding: 20px;}
.text-wrap-middle .text-middle-title{font-size: 36px;}
.text-wrap-middle .text-middle{font-size: 20px;}

.logos-wrap{}
.logos-wrap .logo{}
.logos-wrap .logo .item{}
}

@media(min-width: 1300px){
.header .slogen{font-size:54px}
.form-wrapper{margin:20px 0 100px}
}
@media(max-width: 992px){
.header .slogen{line-height: 1;padding-bottom: 3vw;font-size: 7vw;}
.header .slogen .s1{font-size: 6vw;}
.header .slogen .s2{font-size: 9vw;}
.header .slogen .break{display: block;font-size: 0;line-height: 0;}
.header .slogen::before{position: absolute;right: 3vw;top: 4vw;}
.header .slogen::after{position: absolute;left: 3vw;top: 4vw;}
.form-wrapper form .form-inputs{box-shadow: 0 10px 10px -10px black;}
}

.sections section .text-wrap .text::after {content: ". . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";height: 0;overflow: hidden;display: block;}