html { color: #030303; font-size: 1em; line-height: 1.4; font-family: 'Montserrat', sans-serif; background: #0c1e2c; }
.alert-ss{
text-align: center;
padding: 10px;
background-color: #3d3d3d;
color: #3bcf2a;
}
::-moz-selection {
background: #0c1e2c;
text-shadow: none;
}
::selection { background: #0c1e2c; text-shadow: none; }
/*
* A better looking default horizontal rule
*/
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
/*
* Remove the gap between audio, canvas, iframes,
* images, videos and the bottom of their containers:
* https://github.com/h5bp/html5-boilerplate/issues/440
*/
audio,
canvas,
iframe,
img,
svg,
video { vertical-align: middle; }
/*
* Remove default fieldset styles.
*/
fieldset { border: 0; margin: 0; padding: 0; }
/*
* Allow only vertical resizing of textareas.
*/
textarea { resize: vertical; }
/* ==========================================================================
Browser Upgrade Prompt
========================================================================== */
.browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; }
/* ==========================================================================
Author's custom styles
========================================================================== */
body { /*-webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: perspective(800px); transform: perspective(800px); */ }
#wrapper { width: 100%; height: auto; float: left; min-height: 100%; height: 100%; }
.main-warp { width: 100%; height: auto; float: left; min-height: 100%; }
.page { width: 100%; height: auto; float: left; }
.container { width: 100%; height: auto; max-width: 1350px; margin: 0px auto; position: relative; padding: 0 20px; }
header { width: 100%; float: left; height: auto; position: fixed; z-index: 9999; padding: 40px 0; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.head-cont { width: 100%; height: auto; float: left; }
.logo-sec { width: 40%; max-width: 265px; height: 77px; float: none; background: url(../images/logo.png) no-repeat;
text-align: center; position: absolute; left: -45px; top: 0px; background-size: contain; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
.logo-sec a { width: 100%; height: 77px; float: left; }
.midd-wrap { width: 100%; height: auto; float: left; }
.inner-wrap { width: 100%; height: auto; float: left; background: url(../images/back.html); background-attachment: fixed; }
.midd-wrap h1 { width: 100%; height: auto; float: left; font-size: 40px; color: #FFF; font-weight: 700; }
.midd-wrap h1 span { font-weight: 300; }
/* ----------------- Navigation ----------------- */
.main-nav nav { float: right; width: auto; height: auto; position: relative; top: 10px; }
nav ul { list-style: none; width: 100%; }
nav ul li { float: left; }
nav ul li a { display: inline-block; padding: 15px 15px; text-align: center; color: #FFFFFF; font-size: 16px; text-decoration: none; text-transform: uppercase; font-weight: 500; font-family: 'Montserrat', sans-serif; }
nav ul li.current { background: #fec524; }
.menu { width: auto; float: right; height: auto; margin-top: -25px; }
/* Menu */
.menu-left a { display: inline-block; position: relative; transition: color .35s ease; }
.menu-left a:before { content: ''; display: block; position: absolute; left: 0; bottom: 0; height: 2px; width: 0; transition: width 0s ease, background .35s ease; }
.menu-left a:after { content: ''; display: block; position: absolute; right: 0; bottom: 0; height: 2px; width: 0; background: #fec524; transition: width .35s ease; }
.menu-left a:hover:before { width: 100%; background: #fec524; transition: width .35s ease; }
.menu-left a:hover:after { width: 100%; background: transparent; transition: all 0s ease; }
header { will-change: transform; transition: background 0.3s, -webkit-transform 0.5s cubic-bezier(0.694, 0.048, 0.335, 1); transition: transform 0.5s cubic-bezier(0.694, 0.048, 0.335, 1), background 0.3s; transition: transform 0.5s cubic-bezier(0.694, 0.048, 0.335, 1), background 0.3s, -webkit-transform 0.5s cubic-bezier(0.694, 0.048, 0.335, 1); transform: translateY(0); -webkit-transform: translateY(0); }
header nav ul li a { display: block; }
@media (min-width: 576px) {
header nav ul li a { display: block;}
}
@media (max-width: 768px) {
ul { clear: both; }
ul li { 0 }
}
.hide-nav {
transform: translateY(-120% !important); -webkit-transform: translateY(-120%) !important; }
ul.menu-left { display: block; max-height: 0; overflow: hidden; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; z-index: 10; }
@media (min-width: 1025px) {
ul.menu-left { display: block !important; float: right; max-height: none; }
}
ul.menu-left:before { content: ''; display: table; clear: both; }
ul.menu-left.collapse { max-height: 15em !important; }
.nav-toggle { display: block; border-radius: 50px; background-color:#fec524; float: right; height:40px; width: 40px; cursor: pointer; padding: 9px 8px; margin-top:-15px; }
.nav-toggle.open span:first-child { transform: rotate(45deg) translate(4.4px, 4.4px); }
.nav-toggle.open span:nth-child(2) { width: 0%; opacity: 0; }
.nav-toggle.open span:last-child { transform: rotate(-45deg) translate(4.4px, -4.4px); }
@media (min-width: 1025px) {
.nav-toggle { display: none; }
}
.nav-toggle span { position: relative; display: block; height: 2px; width: 100%; margin-top: 4px; background-color: #000; transition: all .25s; }
.signature { position: fixed; font-weight: 100; bottom: 10px; color: #000; left: 0; letter-spacing: 4px; font-size: 10px; width: 100vw; text-align: center; text-transform: uppercase; text-decoration: none; }
header.is-sticky { position: fixed;z-index:99999; background: #0c1e2c; padding: 20px; transition: all 0.3s ease-out 0s; -moz-transition: all 0.3s ease-out 0s; -webkit-transition: all 0.3s ease-out 0s; -o-transition: all 0.3s ease-out 0s; }
header.is-sticky .logo-sec { height: 50px; }
header.is-sticky nav ul li a { font-size: 15px; font-weight: 500px; padding: 10px 15px; }
.cd-nav-trigger { display: none; }
/* ----------------- Section ----------------- */
section { width: 100%; height: auto; padding: 0 0px; color: #FFFFFF; font-family: 'Montserrat', sans-serif; }
.main-cont { width: 100%; height: auto; float: left; position: relative; overflow: hidden; }
.banner-part { width: 100%; height: auto; float: left; position: relative; min-height: 900px; background: url(../images/bg-top.png) no-repeat top 0 left 0; background-position: center; background-size: cover; }
.about-part { width: 100%; height: auto; float: left; position: relative; min-height: 700px; padding-top: 100px; }
section h1 { padding: 35px 0; font-weight: 300; }
/* ----------------- Utils ----------------- */
.clearfix:after { content: ""; display: table; clear: both; }
.page h2 { width: 100%; float: left; height: auto; color: #FFF; font-weight: 700; font-size: 50px; line-height: 60px; }
.page h5 { width: 100%; float: left; height: auto; color: #fec524; text-transform: uppercase; font-weight: 400; font-size: 25px; position: relative; padding-left: 80px; padding-bottom: 45px; }
.page h5:after { content: ''; position: absolute; left: 0; top: 15px; width: 55px; height: 4px; background: #fec524; border-radius: 3px; }
.sec-top { background: url(../images/shape-top.png) no-repeat top 0 left 0; position: absolute; top: -10%; width: 120%; height: 110%; z-index: 1; left: -20%; overflow: hidden; background-size: contain; }
.row { width: 120%; float: left; height: 110%; top: -10%; left: -20%; margin: 0 auto; padding: 320px 0 130px 0; overflow: hidden; }
.col-left { width: 50%; float: left; height: auto; }
.top-heading { width: 100%; float: left; height: auto; }
.phone-top { width: 100%; float: left; height: auto; max-width: 400px; position: relative; }
.phone-top img { width: 100%; height: 100%; }
.col-right { width: 50%; float: left; height: auto; padding-top: 100px; }
.col-right h1 { width: 100%; float: left; height: auto; font-size: 50px; font-weight: 600; line-height: 65px; }
.app-button { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; margin-top: 50px; }
.btn { flex: 1; max-width: 200px; margin-right: 20px; width: 50%; position: relative; z-index: 9; border-radius: 50px; }
.btn a { width: 100%; height: 100%; cursor: pointer; }
.btn:last-child { margin-right: 0px; }
.btn img { width: 100%; height: 100%; }
.yellow { background: #fec524; }
.white { background: #FFF; }
.yellow:hover { background-image: linear-gradient(to right, #f97847 0%, #eab30a 51%, #ffdb2d 100%); background-position: right center; }
.white:hover { background-image: linear-gradient(to right, #d4d2d2 0%, #efefef 51%, #ffffff 100%); }
.home-left { width: 100%; height: auto; float: left; position: relative; }
.mobile { max-width: 300px; float: left; position: relative; z-index: 1; background: url(../images/phone.png) no-repeat; left: 150px; height: 500px; overflow: hidden; background-size: 100%; }
.men-1 { width: 150px; height: 350px; float: none; position: absolute; right: 100px; top: 140px; z-index: 1; }
.men-2 { width: 150px; height: 350px; float: none; position: absolute; left: 10px; top: 140px; z-index: 1; }
.men-1 img { width: 100%; height: 100%; }
.men-2 img { width: 100%; height: 100%; }
.mobile-image-slider { width: 100%; height: 100%; float: left; padding: 52px 37px 52px 37px; }
.screen-slide { width: 197px; height: 430px; float: left; position: relative; left: 0px; top: 26px; }
.banner-slider { width: 100%; height: 100%; }
.banner-slide li img { width: 100%; height: 100%; }
.poster { width: 320px; height: 500px; position: absolute; background-image: url("../images/phone.png"); left: 50%; border-radius: 5px; box-shadow: 0 45px 100px rgba(0, 0, 0, 0.4); overflow: hidden; }
/* ----------------- about us ----------------- */
.about-cont { width: 100%; float: left; height: auto; padding: 0px 0 0px 0; }
.abt-left { width: 50%; float: left; height: auto; margin: 150px 0 0px 0; }
.abt-left-bg { width: 100%; float: left; height: auto; position: relative; }
.abt-left-bg:after { content: ''; position: absolute; left: -13%; bottom: -80px; width: 70%; height: 100%; background: url(../images/abt-shape.png) no-repeat; background-size: contain; }
.abt-left p { width: 100%; float: left; height: auto; font-size: 18px; color: #fffffe; line-height: 30px; font-weight: 300; opacity: 0.8; margin-top: 40px; }
.abt-right { width: 50%; float: left; height: auto; position: relative; }
.abt-right:after { position: absolute; content: ''; left: 0; bottom: 0; width: 100%; height: 100%; background: url(../images/blue-bg.png) no-repeat; background-size: contain; z-index: -1; }
.phone-right img { width: 100%; height: 100%; }
.phone-right { width: 100%; float: left; height: auto; max-width: 420px; overflow: hidden; -webkit-perspective: 4000px; perspective: 4000px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0); position: relative; left: 12%; }
.phone-right img { display: block; width: 100%; -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.phone-right img:not(:first-child) { position: absolute; }
.phone-right img:first-child { -webkit-transform: translateZ(50px); -ms-transform: translateZ(50px); transform: translateZ(50px); }
.phone-right img:nth-child(2) { -webkit-transform: translateZ(290px); -ms-transform: translateZ(290px); transform: translateZ(290px); }
.phone-right img:nth-child(3) { -webkit-transform: translateZ(400px); -ms-transform: translateZ(400px); transform: translateZ(400px); }
.no-preserve-3d .phone-right { /* we target browsers that don't support preserve-3d and show just a standard image - no effect visible */ position: relative; }
/* ----------------- features ----------------- */
.features-cont { width: 100%; float: left; height: auto; margin: 150px 0 0 0; }
.features-cont p { width: 100%; float: left; height: auto; font-size: 18px; font-weight: 300; opacity: 0.8; line-height: 30px; color: #fffffe; }
.features-list { width: 100%; float: left; height: auto; margin-top: 75px; }
.features-list ul { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; flex-direction: row; }
.features-list ul li { width: calc(100% / 3); float: left; height: auto; margin-top: -1px; border-top: 1px solid #fec524; border-bottom: 1px solid #fec524; border-left: 1px solid #fec524; text-align: center; padding: 35px 30px; }
.features-list ul li:nth-child(4) { border-right: 1px solid #fec524; }
.features-list ul li:nth-child(7) { border-right: 1px solid #fec524; }
.features-list h4 { width: 100%; float: left; height: auto; font-size: 28px; color: #FFF; font-weight: 700; }
svg * { fill: none; stroke: currentColor; }
svg * { fill: none; stroke: currentColor; }
.bloc-head { color: #5aa8c5; padding: 30px; }
.bloc-demo { color: #FF495F; }
.bloc-timing { color: #F7A800; }
.bloc-scenario { color: #4fe084; }
.bloc-doc { color: #69B0CA; }
.obturateur { stroke-width: 6; stroke-miterlimit: 10; color: #fec524; }
.col3 { width:65%; float: none; display: inline-block; height: auto; padding: 40px; }
.use-steps { width: 100%; height: auto; float: left; margin: 50px 0 0 0; }
.use-details { width: 32%; height: auto; float: right; text-align: center; padding: 0px 25px 0 25px; }
.use-details .dt-area { width: 100%; height: auto; position: relative; display: table; }
.use-details p { width: 100%; height: auto; float: left; font-size: 25px; font-weight: 300; color: #212121; padding: 10px 0 0 0; }
.use-details .slick-dots { bottom: -30px; }
.use-details p b { font-weight: 600; }
.use-details .slick-slide { background: #f4f2f0; }
.step-number { width: 50px; height: 50px; float: none; background: #c61920; text-align: center; font-family: 'Open Sans', sans-serif; font-size: 20px; font-weight: 400; border-radius: 50px; color: #FFF; display: inline-block; line-height: 50px; }
.phone-use-box { width: 65%; height: 400px; float: left; padding: 0 0 0 16px; position: relative; }
.phone-image-line { width: 200px; height: 400px; float: none; position: absolute; left: 0; top: 0px; background: url(images/use_phone.html) no-repeat; }
.phone-use-box .slider-nav { }
.phone-use-box .slider-nav:after { width: 200px; height: 464px; float: none; position: absolute; right: 0px; top: -80px; }
/* ----------------- How It Works ----------------- */
.steps { width: 100%; height: auto; float: left; margin: 150px 0 0 0; }
.slider-box { width: 100%; float: left; height: auto; background: #fec524; margin: 0px 0 0px 0; -webkit-box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); -moz-box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); }
.slider-nav .slick-prev,
.slider-nav .slick-next { z-index: 9999; width: 60px; height: 60px; padding: 0 0 0 60px; margin: 0px 0 0 60px; top: 81%; }
.slider-nav .slick-prev { background: url(../images/banner-arrow1.png) no-repeat left top; left: 50px; background-size: 45px; }
.slider-nav .slick-next { margin: 0 70px 0 0; background: url(../images/banner-arrow2.png) no-repeat left top; right: 0; background-size: 45px; }
.slider-left { width: 40%; float: left; height: auto; position: relative; }
.slider-left:after { content: ''; left: 0; top: 0; position: absolute; background: url(../images/shape-white.png) no-repeat left 0 top 0; width: 100%; height: 100%; background-size: 80%; }
.slider-right { width: 60%; float: left; height: auto; padding: 75px 20px; }
.slider-right h4 { color: #0c1e2c; font-size: 40px; font-weight: 600; width: 100%; float: left; height: auto; padding-top: 60px; }
.number { width: 100%; float: left; height: auto; }
.number h1 { width: 100%; float: left; height: auto; font-size: 220px; color: #f3bd25; font-family: 'Arial', sans-serif; padding: 0px }
.slider-right ul {
/*
width: 63%;
*/
/*width: 90%;
*/
width: 100%!important;
float: left; height: auto; right: 0; }
.slider-right ul li { width: 100%; float: left; height: auto; text-align: center; position: relative }
.step { width: 100%; float: left; height: auto; position: absolute; top: 28%; }
.step h5 { width: 100%; float: left; height: auto; font-size: 24px; line-height: 35px; text-transform: uppercase; color: #0c1e2c; padding: 0; font-weight: 700; padding: 25px 0 13px 0; font-family: 'Lato', sans-serif; }
.step h5:after { display: none; }
.step p { width: 100%; float: left; height: auto; font-size: 18px; color: #0c1e2c; font-weight: 400; }
.phone-white { width: 100%; float: left; height: auto; max-width: 300px; position: relative; left: 212px; top: 76px; z-index: 9; padding: 55px 0 55px 180px; background: url(../images/phone-white.png) no-repeat; min-height: 490px; }
.phone-slider { width: 198px; height: auto; float: none; position: absolute; top: 17px; left: 31px; overflow: hidden; }
.phone-slider img { width: 100%; height: 100%; }
.slider-nav { width: 100%; float: left; height: auto; }
.slider-nav li { width: 100%; float: left; height: auto; }
.mob-heading h4{ display: none;}
/* ----------------- benefits ----------------- */
.benifit-cont { width: 100%; float: left; height: auto; margin: 150px 0 0 0; }
.benefits-box { width: 100%; float: left; height: auto; display: flex; flex-wrap: wrap; padding: 0 0 0 0; margin: 0 0 0 0; }
.benefits-box-left { width: 20%; float: left; height: auto; position: relative; }
.benefits-box-left:after { content: ''; position: absolute; left: -266%; background: url(../images/phone-left.png) no-repeat; width: 550%; height: 120%; max-width: 1160px; top: 3%; }
.benefits-box-right { width: 80%; float: left; height: auto; padding-left: 13%; padding-right: 3%; position: relative; }
.benefits-box-right:after { content: ''; ; position: absolute; left: 0; width: 105%; height: 120%; background: url(../images/benefits.png) no-repeat; bottom: 0; background-size: contain; }
.benefits-box-right p { width: 100%; float: left; height: auto; font-size: 17px; line-height: 30px; color: #e1e9ef; font-weight: 300; opacity: 0.8; padding-top: 35px; margin-bottom: 80px; }
/* ----------------- partners ----------------- */
.partners { width: 100%; float: left; height: auto; margin: 0 auto; background: #FFF; display: flex; flex-wrap: wrap; padding: 60px 45px; position: relative; -webkit-box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); -moz-box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); box-shadow: 0px 109px 43px -73px rgba(0,0,0,0.75); }
.partner-sec { width: 100%; float: left; height: auto; position: relative; padding: 130px 0 0 0; }
.partner-sec:after { content: ''; position: absolute; background: url(../images/partners-bg.png) no-repeat center; width: 100%; height: 100%; background-size: contain; z-index: -1; left: 0; bottom: 0; }
.partners h2 { width: 100%; float: left; height: auto; text-transform: capitalize; text-align: left; font-size: 50px; color: #0c1e2c; font-weight: 700; }
.partners ul { width: 103%; float: left; height: auto; margin-right: -3%; }
.partners ul li { width: 16.3%; float: left; height: auto; margin: 20px; }
.partners ul li img { width: 100%; float: left; filter: gray; /* IE5+ */ -webkit-filter: grayscale(1); /* Webkit Nightlies & Chrome Canary */ -webkit-transition: all .5s ease-in-out; }
.partners ul li:hover img { filter: none; -webkit-filter: grayscale(0); -webkit-transform: scale(1.01); }
/* ----------------- contact us ----------------- */
.contact-cont { width: 100%; height: auto; float: left; margin: 150px 0 0 0; }
.col-center { width: 100%; float: left; height: auto; margin: 0 auto; text-align: center; }
.logo-btm { width: auto; height: auto; float: none; display: inline-block; }
.logo-btm { width: 100%; height: 100%; }
.col-center h6 { width: 100%; float: left; height: auto; text-transform: uppercase; font-size: 20px; color: #fec524; font-weight: 300; margin: 40px 0; }
.col-center h3 { width: 100%; float: left; height: auto; font-size: 35px; color: #FFF; font-weight: 300; padding-bottom: 45px; }
.col-center h3 span { color: #fec524; }
.col-center p { width: 100%; float: left; height: auto; font-size: 22px; line-height: 40px; font-weight: 300; }
.social-media { width: 100%; float: left; height: auto; }
.media { width: auto; height: auto; float: none; display: inline-block; margin: 0px 0 50px 0; }
.media li { float: left; height: auto; width: 60px; height: 60px; background: #FFF; margin-right: 30px; padding: 7px; border-radius: 100%; }
.media li:last-child { margin-right: 0; }
.media li a { color: #060f17; font-size: 35px; }
.media li:hover { background: #fec524; }
.media li:hover a { color: #FFF; }
/* ----------------- Footer ----------------- */
footer { width: 100%; float: left; height: 135px; text-align: center; }
footer p { width: 100%; float: left; height: auto; font-size: 18px; font-weight: 300; color: #FFF; padding: 35px 0; border-top: 1px solid #3d4b56; }
.lang{ width: 100%; float: right; height: auto; cursor: pointer;}
.lang a{padding: 10px 15px; color: #FFF; float: right; font-size: 14px; font-family: 'Cairo', sans-serif;}
.social-media-top{ width:auto;float: right; height: auto; position: absolute;right: 0px; top: 0px;}
.social-media-top:after{ content: ''; width: 150px; height: 363px; position: absolute; background: url(../images/media-shape.png) no-repeat top 0 right 0; background-size:contain; right: 0px;}
.media_top{width:100%; float:left; height: auto; position: relative; z-index: 99; margin-top: 55px; right: 8px;}
.media_top li{ width: auto; height: auto; float: left; padding:0 10px; color: #000; font-size: 28px;}
.media_top li:hover a{ color: #FFF; transition: 1s;}
header.is-sticky .logo-sec
{
left:0px!important;
top:10px;
}
@media only screen and (min-width:700px) and (max-width:1550px){
.step
{
top: 10%!important;
}
article ul li .col3 img
{
height:70px!important;
}
.col-right h1
{
font-size:36px!important;
line-height:55px;
}
.slider-right
{
padding:75px 50px!important;
}
.slider-right h4
{
font-size:22px!important;
/* font-size:30px!important;
*/ }
.step p
{
font-size:15px;
}
.slider-nav .slick-prev
{
left:5px!important;
}
.slider-nav .slick-next
{
margin:0px!important;
}
.benefits-box-right
{
padding-left:30%!important;
}
.page h2
{
font-size: 32px;
line-height: 47px;
}
.benefits-box-right p
{
font-size:15px;
}
.col-center h3
{
font-size:30px!important;
}
}
@media only screen and (min-width:769px) and (max-width:1024px){
.slider-right
{
padding:75px 50px!important;
}
.slider-right h4
{
font-size:25px!important;
}
.step p
{
font-size:15px;
}
.slider-nav .slick-prev
{
left:-10px!important;
}
.slider-nav .slick-next
{
margin:0px!important;
}
header.is-sticky
{
height:90px;
}
.home-left
{
width:50%;
}
.col-center h3
{
font-size:30px!important;
}
}
@media (max-width:768px){
.logo-sec
{
left:0px!important;
}
.slider-nav .slick-next
{
right:0px!important;
}
.slider-nav .slick-prev
{
left:45px!important;
}
.step
{
top:15%!important;
}
header.is-sticky
{
height:90px;
}
.col-center h3
{
font-size:25px!important;
}
article ul li .col3 img
{
height:10px;
}
.col3
{
width:100%;
}
article ul li .col3 img
{
height:65px!important;
}
}
@media only screen and (min-width:1200px) and (max-width:1320px){
.phone-white
{
left:100px;
}
.benefits-box-left:after
{
left:-300%;
}
.page h2
{
font-size:30px!important;
}
.col-center h3
{
font-size:30px!important;
}
}
/*
.main-cont img
{
height:100px!important;
} */
article ul li .col3 img
{
height:100px;
}
.features-list ul li img:nth-child(2){
display: none;
}
.features-list ul li:hover img:nth-child(2) {
display: block;
transition: 0.5s;
margin: 0px auto;
}
.features-list ul li:hover img:nth-child(1) {
display: none;
transition: 0.5s;}
.features-list ul li:hover h4 {
color: #fec524!important;
transition: 0.5s;
line-height: 27px;
}
.banner-slider li img{
width: 100%!important;
}
.slick-dots{
display: none!important;
}
button.slick-prev.slick-arrow{
margin-left: 20%!important;
}
button.slick-next.slick-arrow{
margin-right: 20%!important;
}
@media (max-width: 767px){
button.slick-prev.slick-arrow{
margin-left: 15%!important;
}
button.slick-next.slick-arrow{
margin-right: 15%!important;
}
}
.slider-for .slick-slide img{
border-radius: 20px;
}
.slider-steps li{
margin-bottom:100px!important;
display: inherit;
}
/* 11/08/2020 css by rakesh */
/*@media (max-width: 767px){
.slider-right h4 {
display: block!important;
font-size: 15px!important;
}
.slider-right h5 {
font-size: 13px!important;
}
.slider-right p{
margin-top: 0px!important;
}
.slider-nav .slick-prev, .slider-nav .slick-next{
top: 65%!important;
}
}*/
@media (max-width: 767px){
.slider-right h4 {
display: block!important;
font-size: 15px!important;
}
.slider-right h5 {
font-size: 13px!important;
}
.slider-right p{
margin-top: 0px!important;
}
.slider-nav .slick-prev, .slider-nav .slick-next{
top: 65%!important;
}
button.slick-prev.slick-arrow{
margin-left: 0px!important;
}/*
.slider-nav .slick-prev{
left: 0px!important;
}*/
}
/* .benefits-box-left:after{
left:-407px!important;
}
*/