.navbar .navbar-collapse { flex-grow: 0; } .header { margin-top: 77px; padding-top: 6.5rem; height: 75vh; position: relative; padding-bottom: 3rem; } *{ margin: 0; padding: 0; box-sizing: border-box; } .Contact_Us{ position: relative; .banner{ width:100%; height: 300px; position: relative; z-index: -1; margin-top: -19vw; h2{ position: absolute; color:#fff; top:7vw; left: 50%; transform:translate(-50%,-50%); text-transform: uppercase; letter-spacing: 2px; text-shadow: 0px 1px 2px rgba(black,0.1); font-size: 3vw; } } .slick-next::before{ content: ""; } .slick-prev::before{ content: ""; } .slick-dots li{ border-radius: 50%; } .slick-dots li button::before{ font-size: 10px; } .slick-dots li.slick-active button:before{ color:#EA5413; opacity: 1; border-radius: 50%; border:1px solid #EA5413 } .text-title{ margin-top: -90px; @media screen and(max-width:576px) { margin-top: -45px; } } h1{ font-weight: 600; font-size: 32px; text-align: center; } hr{ width: 5vw; margin: 0 auto; height: 6px; opacity: 1 !important; background: #000; @media screen and(max-width:576px) { width: 15vw; } } p{ margin-top: 15px; text-align: center; color:#888888; } .contact_us_title{ width: 80vw; margin: 0 auto; text-align: center; @media screen and(max-width:576px) { width: 100vw; } } .service_info{ // height: 100vh; // background: #FFEBE2; padding-top: 100px; background-color: #FFEBE2; // padding-bottom: 130px; position: relative; .circle-orange{ bottom: 10px; right:80px; width: 180px; } .content-service{ margin-top: 50px; h2{ font-weight: 600; color:#EA5413; font-size: 28px; } ul{ margin-top: 15px; color:#888888; padding-left: 1rem; } } .learn-more{ margin-top: 50px; padding: 5px 15px; border:1px solid #EA5413; border-radius: 30px; background: #EA5413; color: #fff; transition: 0.3s; &:hover{ color:#EA5413; background: #fff; } @media screen and(max-width:576px) { margin-top: 15px; } } .service_slider_Box-m{ width: 80vw; margin: 0 auto; .slick-dots{ bottom:270px; left:50px; } .slick-prev{ position: absolute; left:-20px; z-index: 100; top:130px; } .slick-next{ position: absolute; right:-10px; z-index: 100; top:130px; } } .service_slider_Box{ width: 85vw; margin: 0 auto; height: 400px; // padding-bottom:150px; .slick-dots{ bottom:40px; width: 20%; left:90px !important; } .service_slider{ height: 450px; position: relative; } .slick-prev{ position: absolute; left: 5px; top:350px; z-index: 100; width: 60px; height: 60px; } .slick-next{ position: absolute; left: 350px; top:350px; z-index: 100; width: 60px; height: 60px; } .service_Img_Box{ position: relative; margin-top: 50px; .service_Img_seo{ width: 280px; position: absolute; left:-180px; bottom:180px; object-fit: cover; } .service_Img_video{ position: absolute; width: 360px; left:-250px; bottom:50px; object-fit: cover; } .service_Img_developmentimg{ position: absolute; bottom:100px; left:-180px; width: 280px; object-fit: cover; } .service_Img_spiderimg{ position: absolute; bottom:80px; left:-180px; width: 280px; object-fit: cover; } .service_Img_bigdataimg{ position: absolute; bottom:-10px; width: 400px; left:-200px; object-fit: cover; } .service_Img_googleads{ position: absolute; bottom:10px; left:-150px; width: 280px; object-fit: cover; } .service_Img6{ position: relative; bottom:50px; } .service_Img1 { position: relative; left:15px; bottom:120px; object-fit: cover; } .service_Img2 { position: relative; bottom:50px; object-fit: cover; } .service_Img3 { position: relative; left:15px; bottom:100px; object-fit: cover; } .service_Img4 { position: relative; bottom:80px; object-fit: cover; } } } } #contact_box{ overflow: hidden; background: #fff; // margin-top: -10vw; } .Contact_Information{ width: 90vw; margin: 0 auto; position: relative; padding-bottom: 130px; @media screen and(max-width:576px) { width: 100vw; } .Contact_Information_title{ text-align: center; .choozmo{ width: 640px; @media screen and(max-width:576px) { width: 90vw; } } .text-title{ margin-top: -100px; @media screen and(max-width:576px) { margin-top: -60px; } } .qrcode{ width: 350px; } } .contact-text{ margin-top: -50px; } } .circle{ position: absolute; bottom: -300px; left: -350px; } @keyframes drift { 0%{ transform: rotate(0deg); } 100% { transform: rotate(360deg); } } }