/* Theme Name: Fullstop (Imotheme) Theme URI: https://fullstop360.com/ Author: Fullstop Author URI: https://fullstop360.co/ Description: Custom Theme. Version: 1.2 */ /* @import url('fonts.css'); @import url('animsition.css'); @import url('bootstrap.css'); @import url('aos.css'); @import url('fontawesome.css'); @import url('slick.css'); */ @import url('fonts.css'); @import url('../../../../stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css'); @import url('../../../../cdnjs.cloudflare.com/ajax/libs/aos/2.3.4/aos.js'); @import url('../../../../cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css'); @import url('slick.css'); /* Case Study Edit on line number 471 */ /* Global Box-sizing ------------------------------------*/ body { background: #fff; font-weight: 500;font-family: 'Averta'; font-style: normal; font-size: 14px; line-height: 20px; color: #5d5d5d; overflow-x: hidden; padding: 0; position: relative; } ul { list-style: none; } h1, h2, h3, h4, h5, h6 { } a, a:hover, a:visited { text-decoration: none; color: inherit; } a:focus, span:focus, button:focus, li, div, input, * { outline: none; } img, a img { display:block; max-width: 100%; height: auto; } *, *:after, *:before { padding:0; margin:0; list-style:none; border:none; box-sizing:border-box; } .clearfix:before, .gform_wrapper:before, ul:before, .clearfix:after, .gform_wrapper:after, ul:after { content:''; display:table; } .clearfix:after, .gform_wrapper:after, ul:after { clear:both; } .clearfix, .gform_wrapper, ul { *zoom:1; } ul { margin: 0; padding: 0; } .wow { visibility: hidden; } html,body { /*overflow: hidden;*/ margin-bottom: 180px; background-color: #fff; } @-moz-document url-prefix() { html,body { /*overflow: hidden;*/ margin-bottom: 360px; } } .bg { background-size: cover; background-position: center center; background-repeat: no-repeat; } ::selection {background: #fecc45; color: #131313; text-shadow: none; } /*::-webkit-scrollbar {width:10px;height:10px;} ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {display:none;} ::-webkit-scrollbar-track-piece {background-color:#ecedf1;-webkit-border-radius:0px;border-left:1px solid #888;} ::-webkit-scrollbar-thumb:vertical {-webkit-border-radius:0px;background:#ff5e00;}*/ section .headBox { margin: 0 0 60px; } section .headBox h2 { font-weight: 800; font-size: 36px; line-height: 42px; color: #334046; margin: 0 0 10px; } section .headBox p { font-weight: 500; font-family: 'Averta'; font-family: 'Averta'; font-size: 20px; line-height: 30px; color: #1c252c; margin: 0 0 25px; } section .headBox p.last { margin-bottom: 0; } div.clickEffect{ position:fixed; box-sizing:border-box; border-style:solid; border-color:#000000; border-radius:50%; animation:clickEffect 0.4s ease-out; z-index:99999; } @keyframes clickEffect{ 0%{ opacity:1; width:0.3em; height:0.3em; margin:-0.25em; border-width: 1px; } 100%{ opacity:0.1; width:3em; height:3em; margin:-1.5em; border-width:1px; } } /* div.clickEffect{ border-color:#000000; -webkit-animation:clickEffect 1s cubic-bezier(0,.2,.8,1); animation:clickEffect 1s cubic-bezier(0,.2,.8,1); -webkit-animation-iteration-count:1; animation-iteration-count:1 } div.clickEffect:nth-child(2){ -webkit-animation-delay:-.5s; animation-delay:-.5s } @-webkit-keyframes clickEffect{ 0%{ top:28px; left:28px; width:0; height:0; opacity:1 } 100%{ top:-1px; left:-1px; width:58px; height:58px; opacity:0 } } @keyframes clickEffect{ 0%{ top:28px; left:28px; width:0; height:0; opacity:1 } 100%{ top:-1px; left:-1px; width:58px; height:58px; opacity:0 } } */ /* Header ------------------------------------*/ * { /*transition: all .5s ease-in-out;*/ } header { position: fixed; top: 0; right: 0; left: 0; padding: 2rem 60px; z-index: 100; transition: all .1s ease-in-out; -webkit-transform: translate3d(0, 0px, 0); -moz-transform: translate3d(0, 0px, 0); -o-transform: translate3d(0, 0px, 0); transform: translate3d(0, 0px, 0); } a, .button, header * {transition: all .2s ease-in-out;} header:after { position: absolute; top: 0; left: 0; right: 0; background-image: url('../images/headshadow.png'); background-position: top center; background-repeat: repeat; display: block; content: ""; z-index: 110; width: 100%; height: 98px; } body.HeaderFixed header:after { display: none; } header .logo { width: 136px; height: 35px; display: block; opacity: 1; visibility: visible; transition: all 0.5s ease-in-out; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; } header .logo .lgtext { fill: #fff; } header.whitehead .logo .lgtext {fill: #293a43;} header .logoFixed { opacity: 0; visibility: hidden; width: 135px; height: 40px; display: block; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; } header .logoFixed .mid {fill:#FFFFFF;} header .logoFixed .out {fill:#2A3943;} header .logoFixed .in {fill:#28ABE2;} /*header.fixed .logo { opacity: 0; visibility: hidden;}*/ body.HeaderFixed header .logo { opacity: 0; visibility: hidden;} body.HeaderFixed header .logoFixed {opacity: 1;visibility: visible;} body.HeaderFixed header.whitehead .logoFixed {opacity: 0;visibility: hidden;} body.HeaderFixed header.whitehead .logo { opacity: 1; visibility: visible; } /*header.fixed .logoFixed { opacity: 1; visibility: visible; left: 0px; transition: all 0.5s ease-in-out; }*/ body.HeaderFixed header .logoFixed, /*header.whitehead .logoFixed*/ { opacity: 1; visibility: visible; /*left: 40px;*/ left: 0px; transition: all 0.5s ease-in-out; } header .headRow { display: flex; flex-direction: row; justify-content: space-between; align-items: center; position: relative; z-index: 120; } header .headLeft { position: relative; } header .headRight { display: flex; flex-direction: row; align-items: center; } header .button {padding: 10px 30px;margin: 0 55px 0 0;border-radius: 36px;background-color: transparent;border: 2px solid #fff;font-size: 18px;line-height: 26px;color: #fff;display: block;font-weight: 500; font-family: 'Averta';} body.HeaderFixed header .button, header.whitehead .button { color: #000000; background-color: #fecc45; border-color: #fecc45; transition: all .3s ease-in-out; } .menuicon {width: 42px;height: 26px;position: relative; display: inline-block; margin: 0px;} a.menuicon span { width: 41px; height: 4px;background-color: #fff; display: block; margin-bottom: 7px; border-radius: 10px; float: right; transition: all .3s ease-in-out; } a.menuicon span:nth-child(2) { width: 30px;} a.menuicon:hover span:nth-child(2) { width: 41px; transition: all .3s ease-in-out;} body.HeaderFixed header, header.whitehead {background-color: rgba(255,255,255,1); box-shadow: 0 0 10px rgba(0,0,0,0.3); transform: translate(0, -25px); transform: translate(0, -15px); padding: 2rem 60px 1.1rem; } header .button:hover { background-color: #ffc21c;border-color: #ffc21c; color: #000;} body.HeaderFixed header a.menuicon span { background-color: #6b6b6b; } header.whitehead { background-color: rgba(255,255,255,1); } header.whitehead:after { display: none; } /* Banner (Front) ------------------------------------*/ .bannerfront { background-image: url('../images/bgslide.jpg'); background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; height: 890px; display: flex; align-items: center; } .bannerfront h2 {font-weight: 800;font-size: 62px;line-height: 80px;color: #fff;margin: 0 0 60px;} .bannerfront h2 span { position: relative; z-index: 0; padding: 0 5px; } .bannerfront h2 span:after { display: block; content: ""; background-color: #203bc4; position: absolute; bottom: 0; left: 0; right: 0; height: 40px; z-index: -1; } .bannerfront .button {background-color: #fecc45;padding: 15px 30px;margin: 0;border-radius: 36px;font-size: 20px;line-height: 30px;color: #000;display: table;font-weight: 600;} .bannerfront .button:hover { background-color: #ffc21c; } .slick-vertical .slick-slide.bannerfront {height: 890px; display: flex;} /* BannerSlider ------------------------------------*/ .BannerSlider .slick-dots {bottom: 50%;display: block;text-align: right;padding: 0;right: 0; margin: 0;width: auto; position: absolute;} .BannerSlider .slick-dots li {position: relative;display: block;height: auto;text-align: right;width: auto;margin: 0px;padding: 0px;cursor: pointer;} .BannerSlider .slick-dots li:after {content: "";height: 2px;width: 15px;position: absolute;right: 50px;top: 0px;bottom: 0;margin: auto;background-color: #fff; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; } .BannerSlider .slick-dots li.slick-active:after{content: ""; height: 4px;width: 150px;position: absolute;right: -50px;background-color: #fecc45;} .BannerSlider .slick-dots li:before {position: absolute;font-size: 16px;color: #ffffff;font-weight: 700;opacity: 0;right: 80px;top: 0px;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;-moz-transition: all 0.5s ease;-webkit-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease;text-transform: uppercase;} .BannerSlider .slick-dots li:hover:before { opacity: 1; } .BannerSlider .slick-dots li:nth-child(1):before { content: "FirstSlide";} .BannerSlider .slick-dots li.slick-active:nth-child(1):before { content: "FirstSlide"; opacity: 1; right: 120px;} .BannerSlider .slick-dots li button { font-size: 0; border-radius: 50%;width: 10px;height: 10px; margin: 0;padding: 0; background: transparent; cursor: pointer; } .BannerSlider .slick-dots li:nth-child(2):before { content: "SecondSlide";} .BannerSlider .slick-dots li.slick-active:nth-child(2):before { content: "SecondSlide"; opacity: 1;} .BannerSlider .slick-dots li:nth-child(3):before { content: "SecondSlide";} .BannerSlider .slick-dots li.slick-active:nth-child(3):before { content: "TheredSlide"; opacity: 1;} .BannerSlider .slick-dots li.slick-active:before {right: 120px;} /* secEstimate ------------------------------------*/ .secSvcfront { text-align: center; padding: 60px 0 90px; } .secSvcfront h2 {font-weight: 800;font-size: 44px;line-height: 44px;color: #00051d;margin: 0 0 10px;padding: 0;} .secSvcfront p {font-size: 20px;line-height: 30px;color: #585858;margin: 0 0 40px;padding: 0;font-weight: 500; font-family: 'Averta';} .secSvcfront .svcCol.svcLeft { width: 25%; } .secSvcfront .svcCol.svcRight { width: 75%; } .secSvcfront {} .secSvcfront .svcBox { border-radius: 11px; overflow: hidden; position: relative; display: block; } .secSvcfront .svcBox img { position: absolute; display: block; max-width: inherit; } .secSvcfront .svcWrapper { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; height: 610px; margin: 0 0 75px; } .secSvcfront .svcUp, .secSvcfront .svcDown { width: 100%; height: 50%; padding-left: 30px; } .secSvcfront .svcDown { display: flex; flex-direction: row; flex-wrap: wrap; padding-top: 30px; margin: 0 -15px; width: calc(100% + 30px); } .secSvcfront .svcBox { box-shadow: 0px 0px 26px 0px rgba(0, 0, 0, 0.19); /*transition: all .3s ease-in-out;*/ } .secSvcfront .svcBox.svcRed { background-color: #f06544; height: 100%; width: 100%; } .secSvcfront .svcBox.svcBlue { background-color: #0098ef; height: 100%; width: 100%; } .secSvcfront .svcBox.svcRed img { top: -10px; left: -60px; } .secSvcfront .svcBox.svcBlue img { top: -80px; right: -200px;} .secSvcfront .svcBox.svcGreen img { top: 50px; left: 40px; } .secSvcfront .svcBox.svcYellow img { top: 0; left: -75px; } .secSvcfront .svcBox.svcPurple img { top: -40px; left: -105px; } .secSvcfront .svcBox img { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; } .secSvcfront .svcBox:hover img {} .secSvcfront .svcBox.svcBlue:hover img { -webkit-transform: translate3d(5px, 5px, 5px); -moz-transform: translate3d(5px, 5px, 5px); -o-transform: translate3d(5px, 5px, 5px); transform: translate3d(5px, 5px, 5px); } .secSvcfront .svcBox.svcYellow:hover img{ -webkit-transform: translate3d(-5px, -5px, 5px); -moz-transform: translate3d(-5px, -5px, 5px); -o-transform: translate3d(-5px, -5px, 5px); transform: translate3d(-5px, -5px, 5px); } .secSvcfront .svcBox.svcGreen:hover img{ -webkit-transform: translate3d(-5px, -5px, 5px); -moz-transform: translate3d(-5px, -5px, 5px); -o-transform: translate3d(-5px, -5px, 5px); transform: translate3d(-5px, -5px, 5px); } .secSvcfront .svcBox.svcPurple:hover img { -webkit-transform: translate3d(-5px, -5px, 5px); -moz-transform: translate3d(-5px, -5px, 5px); -o-transform: translate3d(-5px, -5px, 5px); transform: translate3d(-5px, -5px, 5px); } .secSvcfront .svcBox.svcRed:hover img { -webkit-transform: translate3d(5px, 5px, 5px); -moz-transform: translate3d(5px, 5px, 5px); -o-transform: translate3d(5px, 5px, 5px); transform: translate3d(5px, 5px, 5px); } .secSvcfront .svcBox.svcYellow { background-color: #efb901; } .secSvcfront .svcBox.svcGreen { background-color: #49a923; } .secSvcfront .svcBox.svcPurple { background-color: #48279b; } .secSvcfront .svcBox.svcYellow, .secSvcfront .svcBox.svcGreen, .secSvcfront .svcBox.svcPurple { margin: 0 15px; width: calc(33.33% - 30px); height: 100%; } .secSvcfront h5 { font-weight: 400; font-size: 22px; line-height: 26px; color: #fff; letter-spacing: 0.5px; text-transform: uppercase; text-align: left; margin: 20px 0 0 20px; position: relative; z-index: 2; } .secSvcfront .button {padding: 20px 50px;border-radius: 70px;background-color: #fecc45;font-size: 28px;line-height: 40px;color: #000;display: table;margin: 0 auto;font-weight: 500; font-family: 'Averta';} .secSvcfront .button:hover { background-color: #ffc21c; } .secSvcfront .svcBox.svcRed:hover { box-shadow: 0px 0px 26px 0px rgba(240, 101, 68, 0.39); } .secSvcfront .svcBox.svcYellow:hover { box-shadow: 0px 0px 26px 0px rgba(240, 189, 0, 0.39); } .secSvcfront .svcBox.svcBlue:hover { box-shadow: 0px 0px 26px 0px rgba(0, 152, 239 , 0.39); } .secSvcfront .svcBox.svcGreen:hover { box-shadow: 0px 0px 26px 0px rgba(73, 169, 35, 0.39); } .secSvcfront .svcBox.svcPurple:hover { box-shadow: 0px 0px 26px 0px rgba(83, 46, 181, 0.39); } /* Portfolio (Front) ------------------------------------*/ .secPfolio .rowPf { display: flex; flex-wrap: wrap; height: 785px; } .secPfolio .colPf { width: 25%; } .secPfolio .pf { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 100%; position: relative; } .secPfolio .pflarge { height: 100%; } .secPfolio .pfsmall { height: 50%; } /* secEstimate ------------------------------------*/ .secEstimate {} .secEstimate .colEstimate { padding: 80px; } .rowEstimate { display: flex; } .secEstimate .getEst { background-color: #293a43; color: #fff; display: flex; align-items: center; transition: all .3s ease-in-out; } .secEstimate .getEst:hover { background-color: #0d222d; transition: all .3s ease-in-out;} .secEstimate .getEst h4 {font-weight: 500;font-family: 'Averta';font-size: 16px;line-height: 22px;margin: 0;padding: 0;} .secEstimate .getEst h2 {font-weight: 700;font-size: 42px;line-height: 48px;margin: 0 0 45px;padding: 0;} .secEstimate .getEst svg { width: 70px; margin-left: 0px; transition: all 1.5s ease-in-out; -webkit-animation: MoveRightLeft 2s ease-in-out infinite; animation: MoveRightLeft 2s ease-in-out infinite;} .secEstimate .getEst:hover svg { margin-left: 100px; -webkit-animation-play-state: paused; animation-play-state: paused; } .secEstimate .getEst svg path {fill: #fff;} .secEstimate .getEst .innerWrap { } .secEstimate .getContact { background-color: #fecc45; color: #000; } .secEstimate .getContact h4 {font-weight: 500;font-family: 'Averta';font-size: 16px;line-height: 22px;margin: 0;padding: 0;} .secEstimate .getContact h2 {font-weight: 800;font-family: 'Averta';font-size: 42px;line-height: 48px;margin: 0 0 50px;padding: 0;} .secEstimate .getContact form { clear: both; } .secEstimate .field input, .secEstimate .field textarea{ background: none; width: 100%;outline: none; transition: all .3s ease-in-out; height: 40px;} .secEstimate .field textarea { resize: none; } .secEstimate .field input[type="submit"] {cursor: pointer;max-width: 235px;color: #000000;text-align: center;font-size: 18px;display: block;border: 2px solid #000;float: right;border-radius: 50px;height: 50px;font-weight: 500;font-family: 'Averta';} .secEstimate .field input[type="submit"]:hover { background-color: #000; color: #fff; } .secEstimate .getContact:hover .field:before { width: 92%; transition: all .8s ease-in-out; } .secEstimate .getContact:hover .field:nth-last-child(2):before { width: 93%;} .secEstimate .getContact .field:nth-last-child(1), .secEstimate .getContact .field:nth-last-child(2) { width: 100%; margin-right: 0px; } .secEstimate .getContact .field:nth-last-child(1):before { display: none; } .secEstimate .getContact .field:nth-last-child(1) { padding-right: 52px;} .colEstimate { width: 50%; min-height: 480px; } /* AnimationForm ------------------------------------*/ form.AnimationForm .field { position:relative;box-sizing: border-box; margin-bottom: 42px; float: left; width: calc(50% - 10px );} form.AnimationForm .field:before { width: 85%; height: 2px; transition: all .8s ease-in-out; background-color: #000; position: absolute; left: 0px; bottom: 0px; content: ''; } form.AnimationForm .field fieldset {position: absolute;top: 10px;left: 0px;color: black;font-size: 16px;font-weight: 500;font-family: 'Averta';transform: translate3d(0, 0, 0);transition: all 0.5s ease-in-out;z-index: 1;} form.AnimationForm .field input, form.AnimationForm .field select, form.AnimationForm .field textarea {z-index: 111;position:relative;background: transparent;width: 100%;height: 42px;padding: 0px;margin: 0;font-size: 16px;font-weight: 500;font-family: 'Averta';} form.AnimationForm .field input:faocus { outline: 0;} form.AnimationForm .field fieldset.active{z-index: 999;top:-20px;} form.AnimationForm .field.phone fieldset {left: 120px;} form.AnimationForm .field.submit { background-color: transparent} form.AnimationForm .field:nth-last-child(2):before { width: calc(90% - 0px ); } /* secTestimonials ------------------------------------*/ .secTestimonials { padding: 110px 0; position: relative; overflow: hidden;} .secTestimonials:before {position: absolute; content: ''; width: 562px;height: 375px; background: url(../images/testimonials-dottes.png) left top no-repeat;background-size: cover; left: -330px; bottom: -160px; z-index: -1;} .secTestimonials p {font-weight: 500;font-family: 'Averta';font-size: 18px;line-height: 32px;color: #00051d;text-align: center;margin: 0;text-align: justify;text-align-last: center;} .secTestimonials .author { font-weight: 300; font-size: 16px; line-height: 22px; color: #00051d; text-align: center; margin: 0 0 25px; } .secTestimonials .author b, .secTestimonials .author small { display: block; } .secTestimonials .author b {font-weight: 700;} .secTestimonials .author small {font-weight: 500;font-family: 'Averta';font-size: inherit;} .divTestimonials {position: relative; background: url(../images/bgreview.png) left top no-repeat;background-size: cover; padding: 100px 200px 0 100px; margin: 0; min-height: 522px; } .divTestimonials:after {position: absolute; content: ''; width: 562px;height: 375px; background: url(../images/testimonials-dottes.png) left top no-repeat;background-size: cover; right: -7px; top: -40px; z-index: -1;} .secTestimonials .authorPic { width: 108px; height: 108px; border-radius: 50%; display: block; margin: 0 auto 10px; } /* secTestimonials ------------------------------------*/ .testiLogo {margin: 80px 0 0 50px;display: flex; flex-wrap: wrap;} .testiLogo .innerLogo {width: calc(33.333% - 0px); position: relative; margin-bottom: 50px; } .testiLogo .innerLogo img {margin: 0 auto;opacity: 0.6;} .testiLogo .innerLogo img.hover { position: absolute; left: 0px; right: 0; top: 0px; transition: all .4s ease-in-out; opacity: 0; } .testiLogo .innerLogo:hover img.hover { opacity: 1;transition: all .4s ease-in-out; } .testiLogo .innerLogo:hover img { opacity: 0; transition: all .4s ease-in-out;} /* Footer ------------------------------------*/ /*.footer { padding: 60px 0 30px; }*/ .footer {padding: 60px 0 30px;position: fixed;left: 0;right: 0;bottom: 0;background: #fff;z-index: -1;} .footer h4 {font-weight: 500;font-family: 'Averta';font-size: 22px;line-height: 32px;color: #4e4e4e;max-width: 70%;} .footer h4 a {font-weight: 700;position: relative;} .footer h4 a:hover { color: #333333; } .footer h4 a:after { position: absolute; left: 0; right: 0; bottom: 0; background: #4e4e4e; height: 2px; display: block; content: ""; } .footer h4 a:hover:after { background-color: #333333 } .footer .rowlower { } .footer nav { display: flex; } .footer nav ul { width: 50%; margin: 0; padding: 0; } .footer nav ul li {font-weight: 500;font-family: 'Averta';font-size: 16px;line-height: 22px;color: #4e4e4e;} .footer nav ul li+li { margin-top: 30px; } .footer nav ul li a {} .footer nav ul li a:hover { color: #333333; } .footer h5 { font-weight: 600; font-size: 14px; line-height: 20px; color: #4e4e4e; text-transform: uppercase; margin: 0 0 10px; padding: 0; } .footer .infoWrap { display: flex; } .footer .infoWrap p {font-weight: 500;font-family: 'Averta';font-size: 16px;line-height: 24px;color: #4e4e4e;margin: 0 0 10px;padding: 0;} .footer .infoWrap a {font-weight: 700;position: relative;font-size: 17px;margin-top: 20px;display: inline-block;} .footer .infoWrap a:hover { color: #333333; } .footer .infoWrap a:after { position: absolute; left: 0; right: 0; bottom: -2px; background: #4e4e4e; height: 2px; display: block; content: ""; } .footer .infoWrap a:hover:after { background-color: #333333; } .rowUpper { padding-bottom: 40px; } .rowLower { padding-top: 30px; border-top: 1px solid #e4e7ee; } .copyrights {display: inline-block;margin-right: 45px;font-size: 14px;font-weight: 500;font-family: 'Averta';color: #293a43;} .copyrights + a, .copyrights + a + a { } .copyrights + a + a { margin-right: 0px; } .copyrights + a:hover, .copyrights + a + a:hover { text-decoration: none; } .terms { display: inline-block; } .terms a {font-size: 15px;font-weight: 700;color: #4e4e4e;position: relative;} .terms a+a { margin-left: 50px;} .terms a:after { position: absolute;left: 0;right: 0;bottom: -2px;background: #4e4e4e;height: 2px;display: block;content: "";} .terms a:hover { color: #333; } .terms a:hover:after { background-color: #333333; } .social { text-align: right;} .social a { font-size: 22px;margin-right: 30px;} .social a i { color: #6a7378; } .social a:hover i.fa-facebook { color: #1e4c9a; } .social a:hover i.fa-twitter { color: #1ca6d7; } .social a:hover i.fa-pinterest-p { color: #e72c33; } .social a:hover i.fa-google-plus { color: #d04633; } .social a:hover i.fa-linkedin { color: #0177af; } .social a:hover i.fa-instagram { color: #7332b2; } @media (min-width: 1200px) { .container { max-width: 1570px; } } @keyframes MoveRightLeft { 0% { -webkit-transform: translateY(0);transform: translateY(0);} 50% {-webkit-transform: translateX(20px);transform: translateX(20px);} 100% {-webkit-transform: translateY(0);transform: translateY(0);} } /* Ghufran Css */ .cs h3 { font-size: 38px; font-weight: 900; color: #1d1d1d; padding: 0px; margin: 0px 0 25px; } .cs p { font-size: 20px; font-weight: 500; font-family: 'Averta'; color: #1d1d1d; padding: 0px; margin: 0px 0 20px 0; line-height: 31px; } .cs p span.italicFont { font-weight: 600; font-style: italic; } .bannerInner { background-image: url(../images/cs/ppbanner.jpg); background-repeat: no-repeat; background-size: cover; background-position: center; width: 100%; min-height: 900px; display: flex; align-items: center; transition: all .5s ease-in-out; position: relative;} .bannerInner h2 { font-size: 60px; font-weight: 900; color: #fff; text-align: center; padding: 0px; margin: 0px; line-height: normal; } .bannerInner p { font-size: 26px; font-weight: 900; color: #fff; text-align: center; padding: 0px; margin: 0px; line-height: normal; } .BanBotNav {display: flex; padding: 65px 0px; /* opacity: 0; */ transition: all .3s ease-in-out; } .BanBotNav > div { flex: 1; position: relative;} .BanBotNav > div:first-child { max-width: 40% } .BanBotNav > div:first-child:before { background: url(../images/headline.png) left top repeat-y; height: 120%; width: 11px; position: absolute; right: 25px; top: 40px; content: ''; z-index: 5; } .BanBotNav > div:nth-child(2) { padding-left: 25px; padding-right: 50px; } .leftNav { max-width: 280px; margin-left: 200px; } .leftNav ul { position: relative; } .leftNav ul:before {position: absolute; left: -80px; top: -100px; font-size: 320px; content: 'B'; color: rgba(0,0,0,0.2);font-weight: 900; z-index: 0;} .leftNav ul li { font-size: 22px; font-weight: 900; padding: 20px 0 18px 0; margin: 0px; text-align: left; transition: all 0.3s;} /*.leftNav ul li.aos-animate:hover {transform: scale(1.1); }*/ .leftNav ul li:hover {transform: scale(1.05); } .leftNav ul li:last-child { padding-bottom: 0; } .leftNav ul li:first-child { padding-top: 0px; } .leftNav ul li+li {border-top: 1px solid #b7b7b7; padding: 20px 0 18px 0;} .leftNav ul li strong { color: #1d1d1d; } .leftNav ul li strong span { font-size: 18px; display: block; font-weight: 500; font-family: 'Averta'; padding-top: 10px; } .leftNav ul li strong:hover { color: #000; } .CntrFul { width: 100%; position: relative; /*z-index: -1;*/} .CntrFul img {width: 100%;} .TwoHalfImg { } .TwoHalfImg figure { margin: 0; } .TwoHalfImg ul { display: flex; } .TwoHalfImg ul li { /* flex: 1; */ } .TwoHalfImg ul li>img {width: 100%;} .TwoHalfTxt { padding-top: 65px; padding-bottom: 65px; padding-right: 200px; padding-left: 200px; } .TwoHalfTxt ul { display: flex; } .TwoHalfTxt ul li { flex: 1;} .TwoHalfTxt ul li:first-child { padding-right: 60px;} .TwoHalfTxt ul.cbdImgSec { align-items: center; padding: 50px; } .TwoHalfTxt ul.cbdImgSec li img { box-shadow: 11px 19px 40.019999999999996px 5.98px rgba(44, 18, 14, 0.07); } .projectDtl { padding-top: 65px; padding-bottom: 40px; } .projectDtl h3 { font-size: 24px; text-transform: uppercase; padding-bottom: 80px; } .yellow-strip { background-color: #fecc45; text-align: center; min-height: 330px; display: flex;flex-direction: column-reverse;flex-wrap: wrap-reverse;justify-content: center;align-items: center;align-content: stretch; } .yellow-strip h2 { font-size: 55px; color: #000; font-weight: 700; text-align: center; padding: 0px; margin: 0px 0 45px; } .yellow-strip a { position: relative; display: block; width: 195px; border-radius: 10px; margin: 0px auto; border: 2px solid #000; font-size: 18px; font-weight: 700; color: #000; text-align: center; height: 55px; overflow: hidden;} .yellow-strip a:before { content: "";background: rgba(0, 0, 0, .1);width: 100%;height: 100%;border-radius: 7px;display: block;position: absolute;left: -100%;top: 0;opacity: 0;-webkit-transition: left .2s cubic-bezier(.45, .9, .75, 1.01),opacity .2s cubic-bezier(.45, .9, .75, 1.01);transition: left .2s cubic-bezier(.45, .9, .75, 1.01),opacity .2s cubic-bezier(.45, .9, .75, 1.01);} .yellow-strip a:hover:before {left: 0; opacity: 1;} .yellow-strip a:after {content: "";width: 9px;height: 9px;border-top: 3px solid #000;border-right: 3px solid #000;display: block;position: absolute;right: 21px;margin-right: 10px;top: 50%;margin-top: -4px;-webkit-transform: rotate(45deg);transform: rotate(45deg);opacity: 0;-webkit-transition: margin-right .2s cubic-bezier(.45, .9, .75, 1.01) 0s,opacity .2s cubic-bezier(.45, .9, .75, 1.01) 0s;transition: margin-right .2s cubic-bezier(.45, .9, .75, 1.01) 0s,opacity .2s cubic-bezier(.45, .9, .75, 1.01) 0s;} .yellow-strip a:hover:after {margin-right: 0; opacity: 1; -webkit-transition: margin-right .2s cubic-bezier(.45, .9, .75, 1.01) .15s,opacity .2s cubic-bezier(.45, .9, .75, 1.01) .15s; transition: margin-right .2s cubic-bezier(.45, .9, .75, 1.01) .15s,opacity .2s cubic-bezier(.45, .9, .75, 1.01) .15s;} .yellow-strip a span {z-index: 1;transition: all 0.2s ease;position: absolute;left: 0;right: 0; margin: auto;top: 30%;} .yellow-strip a:hover span { opacity: 0; visibility: hidden; margin-right: -10px; } .yellow-strip a span + span { opacity: 0; visibility: hidden; margin-right: -10px; } .yellow-strip a:hover span + span { opacity: 1; visibility: visible; margin-right: 0px; } /* Pages Banners BG ------------------------------------*/ .bannerInner.akhtar {background-image: url(../images/cs/abBanner.jpg); } .bannerInner.coco {background-image: url(../images/cs/ccBanner.jpg);} .bannerInner.diamoreum {background-image: url(../images/cs/dmBanner.jpg);} .bannerInner.RingLab {background-image: url(../images/cs/ringlab-banner.jpg);} .bannerInner.altitude {background-image: url(../images/cs/altitude-banner.jpg);} .bannerInner.webcms {background-image: url(../images/product-img/web-cms-banner.jpg); } .bannerInner.john {background-image: url(../images/cs/john-banner.jpg); } .bannerInner.webcms {background-image: url(../images/product-img/web-cms-banner.jpg);} .bannerInner.dmarketing {background-image: url(../images/product-img/dm-banner.jpg);} .mobileapps .bannerInner {background-image: url(../images/product-img/ma-banner.jpg);} .software .softBnr {background-image: url(../images/product-img/software-banner.jpg);} .bannerInner.brandingBrn {background-image: url(../images/product-img/web-cms-banner.jpg);} .bannerInner.sahelingo-bnr {background-image: url(../images/cs/sahelingo-banner.jpg);} .bannerInner.lj-bnr {background-image: url(../images/cs/ljbanner.jpg);} .bannerInner.cbd {background-image: url(../images/cs/cbdbanner.jpg);} .bannerInner.ios {background-image: url(../images/apps/ios-banner.jpg);} .bannerInner.organizix {background-image: url(../images/cs/organizix-cs-banner.jpg);} .mobileapps .bannerInner.WithForm { height: 780px;} .bannerInner.RingLab h2, .bannerInner.RingLab p { color: #505254; } .bannerInner.dark-txt h1, .bannerInner.dark-txt h3 { font-size: 35px; color: #1c252c; text-align: left; margin-bottom: 20px; } .bannerInner.dark-txt .catBanHead { font-size: 55px; color: #1c252c; text-align: left; margin-bottom: 35px; font-weight: 900; padding: 0; margin: 0 0 35px 0; } .bannerInner.dark-txt p { font-size: 26px; color: #1c252c; font-weight: 300; text-align: left; line-height: 41px; padding-right: 41%; margin-bottom: 100px; } h1.sliderHead, h3.sliderHead {font-weight: 900; font-size: 32px; color: #1c252c; text-transform: uppercase; } .ImgHover {position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;z-index: 2;display: -webkit-flex;display: -ms-flexbox; justify-content: center; padding: 2em 1em;transition: opacity .5s ease;display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; } .ImgText { margin-top: 40px; transition: margin-top .4s ease;color: #fff;} .ImgText h4{ font-size: 35px;text-align: center;font-weight: 700;} .ImgText p {font-size: 16px;text-align: center;font-weight: 500;font-family: 'Averta';} .ImgText i {-webkit-animation: MoveRightLeft 2s ease-in-out infinite; animation: MoveRightLeft 2s ease-in-out infinite; font-size: 35px;text-align: center;font-weight: 400; display: block; margin-left: -15px;} .ImgText.black { color: #000; } .pf:hover .ImgHover { opacity: 1; } .pf:hover .ImgText { margin-top: 0px; } body.active, body.MenuActive {overflow: hidden; padding-right: 16px;} /* Estimate Popup Form ------------------------------------*/ .EstimateForm {z-index: 120;background-color: #fff;visibility: hidden;opacity: 0; transition: all 0.5s ease; height: 100vh;width: 100vw;position: fixed; top: 0px;} .EstimateForm.active {visibility: visible;opacity: 1;} .EstimateForm .EstimateInner {max-width: 100%;} .EstimateForm .popupLogo { display: inline-block; width: 35px; height: 35px; } .EstimateForm .popupLogo {width: 190px;position: absolute;left: 60px;top: 30px;} .EstimateForm .popupLogo .st0{fill:#2A3943;} .EstimateForm .popupLogo .st1{fill:#28ABE2;} .EstimateForm .PoupClose {display: inline-block; position: absolute; right: 60px; top: 30px; width: 32px; height: 32px; z-index: 2; opacity: 0.5;} .EstimateForm .PoupClose:hover {opacity: 1;} .EstimateForm .blueBg {background: #f0fafe;} .EstimateForm .PopupForm, .PopupInfo {display: flex;align-items: center;height: 100vh; /*justify-content: center; */ padding-left: 200px;} .EstimateForm .PopupForm h3 { font-size: 42px; font-weight: 800; color: #4e4e4e; padding: 0; margin: 0 0 60px 0; } .EstimateForm .PopupForm form.AnimationForm .field { width: 100%; float: none; } .EstimateForm .PopupForm form.AnimationForm .field:before { display: none; } .EstimateForm .PopupForm .FormFIelds {width: 82%;} .EstimateForm .PopupForm input{ border-bottom: 1px solid #d7d7d7; } .EstimateForm .PopupForm form.AnimationForm fieldset { font-size: 16px; color: #9d9d9d; } .EstimateForm .PopupForm form.AnimationForm fieldset.active { color: #333; } .EstimateForm .PopupForm input[type="submit"] { width: 240px;height: 50px;background-color: #000ee6;border-radius: 50px;color: #fff; font-size: 18px;cursor: pointer; float: right;margin-top: 18px;} .EstimateForm .PopupForm input[type="submit"]:hover { background-color: #324ee2; } .EstimateForm .PopupForm form.AnimationForm .field.half { width: 50%; float: left; } .EstimateForm .PopupInfo {} .EstimateForm .PopupInfo ul { padding: 0px; margin: 0px; } .EstimateForm .PopupInfo ul li { padding: 0 0 0 100px; position: relative; margin: 0px; font-size: 18px; font-weight: 500; font-family: 'Averta'; color: #4e4e4e; } .EstimateForm .PopupInfo ul li+li { margin-top: 70px; } .EstimateForm .PopupInfo ul li strong { font-weight: 700; display: block; } .EstimateForm .PopupInfo ul li img { position: absolute; left: 0px; top: -8px; } .EstimateForm .PopupInfo ul li:nth-child(2) img {left: 8px;} .EstimateForm .PopupClients { margin: 85px 0 0px 0; text-align: center;; } .EstimateForm .PopupClients p { margin-bottom: 40px; } .EstimateForm .PopupClients img { display: inline-block; } .EstimateForm .PopupClients img:nth-child(3) { margin: 0 50px; } /* Circle Navigation ------------------------------------*/ .navFp ul {position: fixed;left: 0;right: 0;top: 0;bottom: 0; opacity: 0; visibility: hidden; margin: auto;height: 560px; z-index: 1003;} .navFp ul li {text-transform: capitalize;padding: 0px 0;margin: 0;text-align: center;position: relative;width: 100%;} .navFp ul li a {color: #fff;line-height: 165px;font-size: 120px;font-weight: 900; display: inline-block; position: relative; text-transform: uppercase; transition: -webkit-transform .25s ease; transition: transform .25s ease; transition: transform .25s ease,-webkit-transform .25s ease; } .navFp ul li a:after {background: url(../images/MenuAnimatino.gif) left bottom repeat-x;height: 30px;content: '';position: absolute;width: 100%;background-size: contain;left: 0;bottom: 0; opacity: 0; visibility: hidden; transition: opacity .4s ease;} .navFp ul li a:hover {-webkit-transform: translateY(-12px); transform: translateY(-12px);} .navFp ul li a:hover:after { opacity: 1; visibility: visible; } .navFp ul li:last-child a { font-size: 40px; line-height: normal; padding: 0; margin: 0 20px; } .navFp ul li:last-child { font-size: 35px; color: #fff; font-weight: bold; } .navFp ul li:last-child a:before { width: 5px; height: 30px; position: absolute; right: -20px; margin: auto; top: 13px; background-color: #fff; content: ''; display: none; } .navFp ul li:last-child a:last-child { padding-right: 0; margin-right: 0; } .navFp ul li:last-child a:last-child:before { display: none; } .navFp ul li:last-child a:hover:after {height: 15px; bottom: -10px; } body.MenuActive .navFp > ul.hide-menu>li>a {opacity: 0;margin-top: 0;transition: opacity .6s,margin-top .3s;} body.MenuActive .navFp > ul.hide-menu>li { font-size: 0; } body.MenuActive .navFp > ul li ul { height: 410px;} .navFp ul li ul {/*position: absolute;top: 50%;-webkit-transform: translateY(-50%);transform: translateY(-50%);*/ width: 100%;text-align: center;transition: visibility 0s linear 0s,opacity .3s; z-index: 1;} .navFp ul li ul li {opacity: 0;visibility: hidden;} .navFp ul li ul li a {line-height: 90px; font-size: 60px;} .navFp ul li ul.show-menu>li { opacity: 1;visibility: visible;transition: visibility .3s linear .3s,opacity .3s .3s;} .navFp ul li ul.show-menu { opacity: 1; visibility: visible; } .navFp ul li ul li a:after { height: 20px; } .nav-tgl {display: inline-block;cursor: pointer;position: fixed;right: 30px;top: 35px; width: 41px; height: 41px;border: none; border-radius: 50%; padding: 0; background: transparent; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0); line-height: 0.6; text-align: right; z-index: 1100;} .nav-tgl > span {transition: all .1s ease-in-out; display: inline-block;position: relative;height: 4px;width: 30px;border-radius: 1px;background: #fff;vertical-align: middle; border-radius: 20px;} .nav-tgl > span:before, .nav-tgl > span:after {display: inline-block;position: absolute;content: "";height: 4px;border-radius: 1px;background: #fff;transition: all 200ms; width: 41px;right: 0; border-radius: 20px;} .nav-tgl > span:before {top: -11px;} .nav-tgl > span:after {top: 11px;} .nav-tgl:focus {outline: none;} /*.nav-tgl:hover > span:after, .nav-tgl:hover > span:before {width: 34px;left: 0;}*/ .navFp:before {display: block;position: fixed;top: 0;left: 0;content: '';width: 100vw;height: 100vh; background-color: #2a3943; transition: all 500ms ease-in-out;clip-path: circle(30px at calc(100% - 65px) 65px); visibility: hidden; z-index: 1000;} .nav-tgl:hover span { width: 41px; } .menu {position: fixed;right: 0;top: 0; z-index: 115;} ul.show-menu li:last-child a:hover {transform: translateY(0px); } ul.show-menu li:last-child a:after { display: none; } body.MenuActive .navFp:before {visibility: visible;clip-path: circle(100%);} body.MenuActive .navFp > ul {opacity: 1; visibility: visible;} body.MenuActive .nav-tgl > span { height: 0; width: 41px;} body.MenuActive .nav-tgl > span:after, body.MenuActive .nav-tgl > span:before { top: 0px; left: 0; /*width: 34px;*/ } body.MenuActive .nav-tgl > span:after { transform: rotate(-45deg); background: #fff !important; } body.MenuActive .nav-tgl > span:before { transform: rotate(45deg); background: #fff !important; } body.MenuActive .navFp { opacity: 1; visibility: visible; } nav.navFp {display: flex;align-items: center;justify-content: center;} body.HeaderFixed .nav-tgl, .menu.whiteMenu .nav-tgl { top: 24px; } body.HeaderFixed .nav-tgl span, body.HeaderFixed .nav-tgl > span:before, body.HeaderFixed .nav-tgl > span:after, .menu.whiteMenu .nav-tgl > span, .menu.whiteMenu .nav-tgl > span:before, .menu.whiteMenu .nav-tgl > span:after { background: #2a3943; } body.MenuActive.HeaderFixed .nav-tgl > span:before, body.MenuActive.HeaderFixed .nav-tgl > span:after { background: #fff; } /* Circle Navigation ------------------------------------*/ /* Case Study Circle color ------------------------------------*/ .Clrpalette { width: 122px; height: 122px; border-radius: 50%; position: relative; box-shadow: 11px 19px 40.019999999999996px 5.98px rgba(44, 18, 14, 0.2); float: left;} .Clrpalette + .Clrpalette { margin-left: 40px; } .Clrpalette p { text-align: center; color: #53515a; padding-top: 35px;} .Clrpalette i { width: 122px;height: 122px;border-radius: 50%;content: '';border: 40px solid #ffb532;display: block; transition: all .2s ease-in-out;} .Clrpalette i:hover {border-color: #ffaa15;} .Clrpalette i.black { border-color: #000000; } .Clrpalette i.black:hover {border-color: #333333;} .Clrpalette i.lightGray { border-color: #ededed; } .Clrpalette i.lightGray:hover { border-color: #e8e8e8; } .Clrpalette i.DarkGray { border-color: #444444; } .Clrpalette i.DarkGray:hover { border-color: #666666; } /*-----Ring Labs Color----*/ .Clrpalette i.RlColorPalet1 { border-color: #444444; } .Clrpalette i.RlColorPalet2 { border-color: #f7e9d1; } .Clrpalette i.RlColorPalet3 { border-color: #a3bff8; } .Clrpalette i.RlColorPalet4 { border-color: #e3964b; } .Clrpalette i.RlColorPalet1:hover { border-color: #222222; } .Clrpalette i.RlColorPalet2:hover { border-color: #ecdcc1; } .Clrpalette i.RlColorPalet3:hover { border-color: #85a8f1; } .Clrpalette i.RlColorPalet4:hover { border-color: #ea8725; } /*-----Ring Labs Color----*/ /*-----Akhtar Biryani Color----*/ .Clrpalette i.ABColorPalet1 { border-color: #c16019; } .Clrpalette i.ABColorPalet2 { border-color: #ffb532; } .Clrpalette i.ABColorPalet3 { border-color: #e50019; } .Clrpalette i.ABColorPalet4 { border-color: #444444; } .Clrpalette i.ABColorPalet1:hover { border-color: #a04e12; } .Clrpalette i.ABColorPalet2:hover { border-color: #e8a226; } .Clrpalette i.ABColorPalet3:hover { border-color: #c10015; } .Clrpalette i.ABColorPalet4:hover { border-color: #222222; } /*-----Akhtar Biryani Color----*/ /*-----St.John Academy Color----*/ .Clrpalette i.JohnColorPalet1 { border-color: #6f0028; } .Clrpalette i.JohnColorPalet2 { border-color: #24407b; } .Clrpalette i.JohnColorPalet3 { border-color: #ab8831; } .Clrpalette i.JohnColorPalet4 { border-color: #767676; } .Clrpalette i.JohnColorPalet1:hover { border-color: #5d0022; } .Clrpalette i.JohnColorPalet2:hover { border-color: #2d4a89; } .Clrpalette i.JohnColorPalet3:hover { border-color: #977728; } .Clrpalette i.JohnColorPalet4:hover { border-color: #636363; } /*-----St.John Academy Color----*/ /*-----Lambton Juices Color----*/ .Clrpalette i.LJColorPalet1 { border-color: #444444; } .Clrpalette i.LJColorPalet2 { border-color: #f7e9d1; } .Clrpalette i.LJColorPalet3 { border-color: #a3bff8; } .Clrpalette i.LJColorPalet4 { border-color: #e3964b; } .Clrpalette i.LJColorPalet1:hover { border-color: #111; } .Clrpalette i.LJColorPalet2:hover { border-color: #ede0cb; } .Clrpalette i.LJColorPalet3:hover { border-color: #96b0e5; } .Clrpalette i.LJColorPalet4:hover { border-color: #d08740; } /*-----Lambton Juices Color----*/ /*-----MeCBD Color----*/ .Clrpalette i.cbdColorPalet1 { border-color: #5fa445; } .Clrpalette i.cbdColorPalet2 { border-color: #8ebe7a; } .Clrpalette i.cbdColorPalet3 { border-color: #ededed; } .Clrpalette i.cbdColorPalet4 { border-color: #6b6b6b; } .Clrpalette i.cbdColorPalet1:hover { border-color: #53903c; } .Clrpalette i.cbdColorPalet2:hover { border-color: #7ca76b; } .Clrpalette i.cbdColorPalet3:hover { border-color: #dedede; } .Clrpalette i.cbdColorPalet4:hover { border-color: #5a5959; } /*-----MeCBD Color----*/ .cd-image-container {position: relative;/* width: 90%;max-width: 768px;margin: 0em auto;*/} .cd-image-container img {display: block; width: 100%;} .cd-image-label { position: absolute;bottom: 0;right: 0;color: #ffffff;padding: 1em;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale; opacity: 0; -webkit-transform: translateY(20px); -moz-transform: translateY(20px); -ms-transform: translateY(20px); -o-transform: translateY(20px); transform: translateY(20px);-webkit-transition: -webkit-transform 0.3s 0.7s, opacity 0.3s 0.7s; -moz-transition: -moz-transform 0.3s 0.7s, opacity 0.3s 0.7s;transition: transform 0.3s 0.7s, opacity 0.3s 0.7s;} .cd-image-label.is-hidden { visibility: hidden;} .is-visible .cd-image-label {opacity: 1;-webkit-transform: translateY(0);-moz-transform: translateY(0);-ms-transform: translateY(0); -o-transform: translateY(0);transform: translateY(0);} .cd-resize-img {position: absolute;top: 0;left: 0; width: 0;height: 100%; overflow: hidden; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);-o-transform: translateZ(0);transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden;} .cd-resize-img img {position: absolute; left: 0; top: 0; display: block; height: 100%; width: auto; max-width: none;} .cd-resize-img .cd-image-label { right: auto; left: 0;} .is-visible .cd-resize-img { width: 50%;-webkit-animation: cd-bounce-in 0.7s;-moz-animation: cd-bounce-in 0.7s;animation: cd-bounce-in 0.7s;} @-webkit-keyframes cd-bounce-in { 0% { width: 0; } 60% { width: 55%; } 100% { width: 50%; } } @-moz-keyframes cd-bounce-in { 0% { width: 0;} 60% { width: 55%; } 100% { width: 50%; } } @keyframes cd-bounce-in { 0% { width: 0; } 60% { width: 55%; } 100% { width: 50%;} } .cd-handle {position: absolute;height: 44px;width: 44px; left: 50%; top: 50%;margin-left: -22px;margin-top: -22px;border-radius: 50%;background: #fecc45 url("../images/cd-arrows.svg") no-repeat center center;cursor: move;box-shadow: 0 0 0 6px rgba(0, 0, 0, 0.2), 0 0 10px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.3);opacity: 0;-webkit-transform: translate3d(0, 0, 0) scale(0);-moz-transform: translate3d(0, 0, 0) scale(0);-ms-transform: translate3d(0, 0, 0) scale(0);-o-transform: translate3d(0, 0, 0) scale(0);transform: translate3d(0, 0, 0) scale(0);} .cd-handle.draggable {background-color: #445b7c;} .is-visible .cd-handle {opacity: 1;-webkit-transform: translate3d(0, 0, 0) scale(1);-moz-transform: translate3d(0, 0, 0) scale(1);-ms-transform: translate3d(0, 0, 0) scale(1);-o-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); -webkit-transition: -webkit-transform 0.3s 0.7s, opacity 0s 0.7s; -moz-transition: -moz-transform 0.3s 0.7s, opacity 0s 0.7s; transition: transform 0.3s 0.7s, opacity 0s 0.7s;} .imag-hover {position: absolute; left: 9%;top: 2%;width: 51%;height: 610px;z-index: 10;text-align: center;display: block;background: rgba(0,0,0,0.5);} .Mobilelogo { display: none; margin: 0px auto; width: 105px; } /* ---- Product Pages ----*/ .cntr-txt {display: flex;flex-direction: row;flex-wrap: wrap;justify-content: flex-start;align-items: center;align-content: stretch;} .box-txt {padding-left: 100px;} .box-txt h3 { font-weight: 700; font-size: 34px; color: #000; } .box-txt i { color: #000; font-size: 34px; -webkit-animation: MoveRightLeft 2s ease-in-out infinite; animation: MoveRightLeft 2s ease-in-out infinite; } .yellow-btn {padding: 10px 50px;margin: 0 22px 0 0;border-radius: 36px;background-color: #fecc45;border: 2px solid #fecc45;font-size: 20px;line-height: 26px;color: #000000;display: inline-block;font-weight: 500;font-family: 'Averta';} .yellow-btn:hover {background-color: #f7b80f; color: #000;} .border-btn {padding: 10px 50px;margin: 0 55px 0 0;border-radius: 36px;background-color: transparent; border: 2px solid #fecc45;font-size: 20px;line-height: 26px;color: #000000;display: inline-block;font-weight: 500;font-family: 'Averta';} .border-btn:hover {background-color: #f7b80f; color: #000;} .web-img-box {background-image: none; background-color: #fecc45;} .web-img-box:hover {background-color: #ffc62c;} .whtiebg { padding: 60px 0; text-align: center; } .whtiebg .border-btn { font-size: 22px; padding: 15px 50px; } /* secFaq ------------------------------------*/ .faqbg { background-color: #f9f9f9; padding-top: 90px 0; } .secFaq { padding: 70px 0 80px; } .secFaq .faq { border-top: 2px solid #334046; padding: 15px 0; } .secFaq .faq.last { border-bottom: 2px solid #334046; } .secFaq .quest { font-weight: 500;font-family: 'Averta'; font-size: 18px; line-height: 30px; color: #1c252c; position: relative; cursor: pointer; padding: 0 40px 0 0; margin: 0px; } .secFaq .quest:before { position: absolute; top: 0; right: 10px; display: block; content: "\f067"; font-family: 'FontAwesome'; font-size: 20px; line-height: 30px; height: 30px; } .secFaq .faq.active .quest:before { content: "\f068"; } .secFaq .ans {/* border-top: 1px solid #bbbab8; */font-weight: 400; font-size: 17px; line-height: 27px; color: #000; padding: 15px 0 0; margin: 0px 45px 0 20px; display: none; position: relative; } .secFaq .faqArea { } .secFaq .faqArea+.faqArea { margin-top: 100px; } .secFaq .faqArea h3 { border-top: 5px solid #334046; padding: 10px 0 0; font-weight: 900; font-size: 24px; line-height: 30px; color: #334046; margin: 0 40px 0 0; } .secFaq .faqArea h3 span { display: block; } .secFaq .ans a { text-decoration: underline; } .secFaq .faqHead { font-weight: 800; font-size: 36px; line-height: 42px; color: #334046; margin: 0 0 10px;} /* Product Form Blue ------------------------------------*/ .rowProduct {display: flex; } .rowProduct .leftSec {display: flex;align-items: center; width: 50%; min-height: 670px; background-color: #0000d9; padding-left: 80px; padding-right: 220px; } .rowProduct .leftSec h3 { font-size: 42px; font-weight: 900; color: #fff; padding: 0px; margin: 0 0 30px 0; } .rowProduct .leftSec p { font-size: 16px; font-weight: 500; font-family: 'Averta'; color: #fff; padding: 0px; margin: 0; line-height: 27px; } .rowProduct .rightSec {display: flex;align-items: center; width: 50%; min-height: 670px; background-color: #0000ee;} .rowProduct .BlueformSec { padding: 0 95px; color: #fff; } .rowProduct .BlueformSec h6 { font-size: 18px; font-weight: 700; padding: 0px; margin: 0px 0 25px; } .productFormBg form.AnimationForm .field:nth-child(odd) { margin-right: 50px; width: calc(50% - 40px ); } .productFormBg form.AnimationForm .field input { color: #fff; } .productFormBg form.AnimationForm .field fieldset { color: #fff; } .productFormBg form.AnimationForm .field:before { background-color: #fff; width: 100%; } .productFormBg form.AnimationForm .field:last-child:before { display: none; } .productFormBg form.AnimationForm .field input[type="submit"] {cursor: pointer;color: #0000ee;text-align: center;font-size: 18px;display: block;border: 1px solid #fff;border-radius: 50px;height: 50px;font-weight: 500;font-family: 'Averta';background: #fff;} .productFormBg form.AnimationForm .field input[type="submit"]:hover { background-color: #e0e0ff;} .productFormBg .email-info { font-size: 18px; font-weight: 500; font-family: 'Averta'; text-align: center; line-height: 30px; } .productFormBg .email-info a { display: block; font-weight: 700; font-size: 21px; } .productFormBg .email-info a:hover { color: #e0e0ff; } /* The customCheckBox */ .CheckBoxes { margin: 0 0 50px 0;} .customCheckBox {display: inline-block;position: relative;padding-left: 25px;margin-bottom: 12px;cursor: pointer;font-size: 22px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;font-size: 16px;font-weight: 500;font-family: 'Averta';color: #fff;} .customCheckBox + .customCheckBox { margin-left: 15px; } .customCheckBox input{position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;} .checkmark { position: absolute;top: 0;left: 0;height: 15px;width: 15px;border: 1px solid #eee; border-radius: 2px;} .customCheckBox:hover input ~ .checkmark{background-color: transparent;} .customCheckBox input:checked ~ .checkmark{} .checkmark:after {content: "";position: absolute;display: none;} .customCheckBox input:checked ~ .checkmark:after{display: block;} .customCheckBox .checkmark:after{left: 4px;top: 1px;width: 5px;height: 10px;border: solid #fff;border-width: 0 2px 2px 0;-webkit-transform: rotate(45deg); -ms-transform: rotate(45deg);transform: rotate(45deg);} /* The CustomRadioButton*/ .RadioBox { margin-bottom: 50px;} .cf:before, .cf:after {content: " "; display: table;} .cf:after { clear: both; } .cf { *zoom: 1; } .plan input, .payment-plan input, .payment-type input{ display: none; } .plan label{ position: relative;color: #fff;font-size: 16px;text-align: center;height: 38px;line-height: 38px;display: inline;cursor: pointer;border: 3px solid transparent;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing: border-box;font-weight: 500;font-family: 'Averta';border-radius: 3px;border: 1px solid #fff; padding: 8px 15px; white-space: nowrap; } .plan label { margin-right: 10px; } .plan label:last-child { margin-right: 0px; } .plan input:checked + label, .payment-plan input:checked + label, .payment-type input:checked + label{ border: 1px solid #fecc45; background-color: #fecc45;color: #333;} .formArea .field { width: 50%; float: left; position: relative; } .icon-scroll, .icon-scroll:before {position: absolute;left: 50%;} .icon-scroll {width: 40px; height: 70px; margin-left: -20px;bottom: 30px;margin-top: -35px;box-shadow: inset 0 0 0 1px #fff;border-radius: 25px;} .icon-scroll:before {content: '';width: 8px;height: 8px;background: #fff;margin-left: -4px;top: 8px;border-radius: 4px; -webkit-animation-duration: 1.5s; animation-duration: 1.5s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-name: scroll; animation-name: scroll; } @-webkit-keyframes scroll { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translateY(46px); transform: translateY(46px); } } @keyframes scroll { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translateY(46px); transform: translateY(46px); } } .dm-ban-bot { background: url(../images/product-img/dm-ban-bot-bg.jpg) center top no-repeat; padding: 100px 0; } .dm-ban-bot h3 { font-size: 50px; font-weight: 800; color: #1c252c; padding: 0; margin: 0 0 130px 0; text-align: center; } .dm-ban-bot p { font-size: 26px; font-weight: 400; color: #1c252c; padding: 0; margin: 0 0 20px 0px; line-height: 38px; } .delivered-txt-main { display: flex; flex-wrap: nowrap; } .delivered-txt-main .delivered-left { width: 100%; padding-left: 100px;} .delivered-txt-main .delivered-img {width: 65%; padding: 0 50px 50px; margin-top: -40px; } .delivered-txt-main .delivered-right { width: 100%; padding-right: 100px;} .dm-boxes-main {} .dm-boxes-main ul.dm-boxes {display: flex; flex-direction: row; flex-wrap: nowrap;} .dm-boxes-main ul.dm-boxes li { height: 468px; width: 25%; padding: 30px; overflow: hidden; position: relative; display: block; background-position: center center; background-repeat: no-repeat; background-size: cover;} .dm-boxes-main ul.dm-boxes li img {position: absolute; display: block; max-width: inherit;-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;} .dm-boxes-main ul.dm-boxes li:hover img {-webkit-transform: translate3d(-5px, -5px, 5px); -moz-transform: translate3d(-5px, -5px, 5px);-o-transform: translate3d(-5px, -5px, 5px);transform: translate3d(-5px, -5px, 5px);} .dm-boxes-main ul.dm-boxes li h3 { font-size: 35px; font-weight: 700; color: #fff; padding: 0px; margin: 0px 100px 25px 0 ; } .dm-boxes-main ul.dm-boxes li p { font-size: 22px; font-weight: 300; color: #fff; padding: 0px; margin: 0px; line-height: 34px; } .dm-boxes-main ul.dm-boxes li:first-child{ background-image: url(../images/product-img/dm-box1-bg.jpg); } .dm-boxes-main ul.dm-boxes li:nth-child(2) { background-image: url(../images/product-img/dm-box2-bg.jpg); } .dm-boxes-main ul.dm-boxes li:nth-child(3) { background-image: url(../images/product-img/dm-box3-bg.jpg); } .dm-boxes-main ul.dm-boxes li:last-child { background-image: url(../images/product-img/dm-box4-bg.jpg); } .dm-boxes-main ul.dm-boxes li img {left: 0px; right: 0; margin: auto; bottom: -65px;} .dm-boxes-main ul.dm-boxes li:nth-child(3) img {left: 0; right: 0;bottom: -30px;margin: auto;} .dm-boxes-main ul.dm-boxes li:last-child img {bottom: -5px;} .chart-area-main { background: url(../images/product-img/dm-chart.jpg) left bottom no-repeat, url(../images/product-img/dm-lines.jpg) left bottom repeat-x; min-height: 400px; background-size: auto, contain;} .chart-area-main p {font-size: 26px;font-weight: 400;color: #1c252c;padding: 0;margin: 80px 0 0 50px;line-height: 38px;} .dm-google-area { margin: 80px 0 65px; } .dm-google-area p {font-size: 26px;font-weight: 400;color: #1c252c;padding: 0;margin: 90px 0 0 50px;line-height: 38px; position: relative;} .dm-google-area p:before {background: url(../images/product-img/dm-ribben.png) left top repeat-x;height: 10px;content: '';position: absolute;width: 300px;background-size: contain; right: -385px; top: -20px; z-index: 2;} .dm-g-txt img {float: right;margin: -100px -400px 0 0;position: relative;z-index: 2;} .dm-g-client-img {position: relative; margin-bottom: 150px; } .dm-google-area .google-img { position: absolute; left: -210px; bottom: -160px; } /*----- SOFTWARE DEVELOPMENT ----*/ .software .dm-boxes-main ul.dm-boxes li h3 { margin-right: 50px; } .software .dm-boxes-main ul.dm-boxes li:first-child{ background-image: url(../images/product-img/sd-box1-bg.jpg); } .software .dm-boxes-main ul.dm-boxes li:nth-child(2) { background-image: url(../images/product-img/sd-box2-bg.jpg); } .software .dm-boxes-main ul.dm-boxes li:nth-child(3) { background-image: url(../images/product-img/sd-box3-bg.jpg); } .software .dm-boxes-main ul.dm-boxes li:last-child { background-image: url(../images/product-img/sd-box4-bg.jpg); } .software .dm-boxes-main ul.dm-boxes li:first-child img {bottom: -110px;} .software .dm-boxes-main ul.dm-boxes li:nth-child(3) img {bottom: -50px;} .software .dm-boxes-main ul.dm-boxes li:last-child img { bottom: -50px; } .software .chart-area-main { background: url(../images/product-img/sd-line-top-img.png) right bottom no-repeat, url(../images/product-img/dm-lines.jpg) left bottom repeat-x;} .software .chart-area-main p { /* margin: 80px 100px 0 -120px; */ margin: 80px 100px 0 0px;} .NoBgImg { background-image: none; background-color: #fff; } .typed::after {content: '_';display: inline;-webkit-animation: blink 0.7s infinite;-moz-animation: blink 0.7s infinite;animation: blink 0.7s infinite;} .bannerInner.dark-txt.logoDesignNew { align-items: inherit; padding: 165px 0 50px 0px; } .bannerInner.dark-txt.logoDesignNew .caption h1 { letter-spacing: 2.5px; margin-bottom: 16px; } .bannerInner.dark-txt.logoDesignNew .caption h1 span { display: block; font-size: 25px;} .bannerInner.dark-txt.logoDesignNew p { font-size: 17px; line-height: 27px; margin-bottom: 27px; font-weight: 500; padding: 0px; } .bannerInner.dark-txt.logoDesignNew p strong { display: block; } .bannerInner.dark-txt.logoDesignNew .yellow-btn { padding: 0px 60px; line-height: 60px; margin-top: 5px;} .bannerInner.dark-txt.logoDesignNew .BannerHalfSlider {margin: 50px -280px 0 50px; } .newPortfolio.logoDesignNewPortfolio .columCenter { flex: 0 0 81%; max-width: 81%; } .logoDesignNew .container, .testi-sec .container { max-width: 1242px; } .portfolioSec.logoDesignNewDribble .portfolio-desc { max-width: 60%; margin-top: 10px; } .portfolioSec.logoDesignNewDribble { text-align: center; padding: 80px 0 0 0; } .portfolioSec.logoDesignNewDribble h1, .portfolioSec.logoDesignNewDribble h2, .portfolioSec.logoDesignNewDribble .drilHeadSml { display: inline-block; color: #334046; font-size: 48px; font-weight: 700; padding: 0; margin: 0;} .portfolioSec.logoDesignNewDribble h1, .portfolioSec.logoDesignNewDribble .drilHeadBig { font-size: 61px; font-weight: 800; display: inline-block; } .BranIdenti .identiTxt.text-center { margin-top: 50px; } /*Custom cursor animation*/ @keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes blink{ 0% { opacity:1; } 50% { opacity:0; } 100% { opacity:1; } } /*----- CORPORATE BRANDING ----*/ .BranIdenti { background: url(../images/product-img/brand-identity-bg.jpg) center top no-repeat; background-size: cover; min-height: 700px; margin: 50px 0 100px; } .BranIdenti .corpImg { /* margin-top: 150px; */ margin-top: 0px; margin-left: 75px; } .BranIdenti .identiTxt { margin-top: 100px; } .BranIdenti .identiTxt h3, .BranIdenti .identiTxt .slideHead { font-size: 48px; font-weight: 800; color: #1c252c; padding: 0px; margin: 0 0 35px; } .BranIdenti .identiTxt p { font-size: 25px; font-weight: 400; color: #565656; padding: 0 0px 0 0; margin: 0 0 40px; line-height: 38px; } /*.BranIdenti .identiTxt p + p { font-size: 21px; }*/ .BranIdenti .identiTxt ul { padding: 0px; margin: 0px; display: flex; flex-wrap: wrap; } .BranIdenti .identiTxt ul li { font-size: 20px; position: relative; color: #334046; padding: 0px; margin: 0px 0 30px 0; width: 50%; align-items: center; display: flex; font-weight: 600; } .BranIdenti .identiTxt ul li i { margin-right: 25px; } .portfolioUpdated { margin: 0 auto; width: 1242px; padding-top: 55px; border-top: 1px solid #efefef;} .portfolioUpdated ul { -webkit-column-width:33vmin; -moz-column-width:33vmin; column-width:33vmin; -webkit-column-fill:balance; -moz-column-fill:balance; column-fill:balance; -webkit-column-gap: 30px; -moz-column-gap: 30px; column-gap: 30px;} .portfolioUpdated ul li { margin-bottom: 30px; position: relative;} .portfolioUpdated ul li:before, .portfolioUpdated ul li:after { width: 95%; height: 97%; display: block; position: absolute; content: ''; left: 0; right: 0; top: 0; bottom: 0; margin: auto; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;} .portfolioUpdated ul li:before {border-top: 2px solid #fff; border-bottom: 2px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1);} .portfolioUpdated ul li:after {border-right: 2px solid #fff; border-left: 2px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0);} .portfolioUpdated ul li:hover:before, .portfolioUpdated ul li:hover:after {opacity: 1; -webkit-transform: scale(1); transform: scale(1);} .columCenter { margin: 0px auto } .portfolioImg { position: relative;margin-bottom: 30px; } .portfolioImg:before, .portfolioImg:after { width: 95%; height: 97%; display: block; position: absolute; content: ''; left: 0; right: 0; top: 0; bottom: 0; margin: auto; opacity: 0; -webkit-transition: opacity 0.35s, -webkit-transform 0.35s; transition: opacity 0.35s, transform 0.35s;} .portfolioImg:before {border-top: 2px solid #fff; border-bottom: 2px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1);} .portfolioImg:after {border-right: 2px solid #fff; border-left: 2px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0);} .portfolioImg:hover:before, .portfolioImg:hover:after {opacity: 1; -webkit-transform: scale(1); transform: scale(1);} /*----- Portfolio Syling ----*/ .portfolioSec h3 {font-weight: 800;font-size: 48px;line-height: 52px;color: #334046;margin: 0 0 10px; text-align: center;} .portfolioSec .portfolioList {} .portfolioSec .portfolioList ul { text-align: center; margin: 50px 0; } .portfolioSec .portfolioList ul li { display: inline-block; font-size: 20px; font-weight: 400; padding: 0px 30px; border: 2px solid transparent; border-radius: 50px; line-height: 45px; cursor: pointer; color: #1c252c } .portfolioSec .portfolioList ul li:hover, .portfolioSec .portfolioList ul li.current { border: 2px solid #fecc45; } .portfolioSec .portfolio-desc {max-width: 50%;margin: 0 auto 50px;} .portfolioSec .portfolio-desc p { font-size: 22px; font-weight: 400; color: #1c252c; text-align: center; padding: 0px; margin: 0px; line-height: 33px;} .portfolioSec .portfolio-item { display: flex; flex-wrap: wrap; } .portfolioSec .portfolio-item>div { width: 25%; /* height: 450px; padding: 12%; */ padding: 10%; background-position: center center; background-repeat: no-repeat; background-size: cover; min-height: 300px; } .isotope-item {z-index: 2;} .isotope-hidden.isotope-item {pointer-events: none; z-index: 1;} .isotope, .isotope .isotope-item {-webkit-transition-duration: 0.8s;-moz-transition-duration: 0.8s;transition-duration: 0.8s;} .isotope {-webkit-transition-property: height, width;-moz-transition-property: height, width;transition-property: height, width;} .isotope .isotope-item {-webkit-transition-property: -webkit-transform, opacity;-moz-transition-property: -moz-transform, opacity;transition-property: transform, opacity;} .none { display: none; } /* .portfolioSec .portfolio-item .estate, .portfolioSec .portfolio-item .easter, .portfolioSec .portfolio-item .it, .portfolioSec .portfolio-item .beauty, .portfolioSec .portfolio-item .consult, .portfolioSec .portfolio-item .sports, .portfolioSec .portfolio-item .auto, .portfolioSec .portfolio-item .fitness { opacity: 0;} */ /*----- Portfolio Syling ----*/ /*----- Mobile Application ----*/ .center-head-txt { text-align: center; } .center-head-txt h3 { font-size: 35px; font-weight: 900; color: #334046; padding: 0px; margin: 70px 0 30px 0; } .center-head-txt p { font-size: 20px; font-weight: 400; color: #334046; padding: 0px; margin: 0 0 50PX 0; line-height: 26px; max-width: 82%; margin: 0 auto; } .blue-ban-bg { background-color: #0e0ef7; min-height: 170px; padding: 35px 0px; } .blue-ban-bg h4 { text-align: center; font-size: 35px; font-weight: 400; padding: 0px 0 40px; margin: 0px; color: #fff; } .blue-ban-bg h4 span { font-weight: 700; } .blue-ban-bg form.AnimationForm .field {width: calc(100% - 0px ); margin-bottom: 0;} .blue-ban-bg .field input { border-bottom: 2px solid #fff; color: #fff; } .blue-ban-bg .field:before { display: none; } .blue-ban-bg form.AnimationForm .field fieldset { color: #fff; } .blue-ban-bg form.AnimationForm .field fieldset.active { top: -10px;} .blue-ban-bg form.AnimationForm .field input[type="submit"] { cursor: pointer;text-align: center;font-size: 18px;display: block;border: 2px solid #fff;border-radius: 50px;height: 50px;font-weight: 500;font-family: 'Averta'; background: transparent;color: #fff; transition: all .4s ease-in-out;} .blue-ban-bg form.AnimationForm .field input[type="submit"]:hover { background-color: #fff; color: #0e0ef7; } .WhatweDo-Services {padding-top: 50px;} .WhatweDo-Services ul { display: flex; flex-wrap: wrap; } .WhatweDo-Services ul li { width: 50%; border-right: 1px solid #f2f2f2; padding: 35px 35px 35px 80px; margin: 0px; position: relative; } .WhatweDo-Services ul li i { width: 60px; height: 60px; position: absolute; left: 0px; top: 35px; } .WhatweDo-Services ul li h4 { font-size: 28px; font-weight: 400; padding: 0px; margin: 0px 0 16px 0; color: #334046; } .WhatweDo-Services ul li p { font-size: 16px; font-weight: 400; padding: 0px; margin: 0px; color: #334046; letter-spacing: 0.5px; } .WhatweDo-Services ul li + li + li {border-top: 1px solid #f2f2f2;} .WhatweDo-Services ul li:nth-child(even) { border-right: 0px;margin-right: 0px; padding-left: 110px; } .WhatweDo-Services ul li:nth-child(even) i { left: 30px; } .wedoImg.img100 img {max-width: inherit;} .yellow-cta { background-color: #fecc45; } .yellow-cta .text {min-height: 150px; display: flex;flex-wrap: nowrap;justify-content: center;align-items: center;align-content: center;} .yellow-cta h3 { font-size: 37px; color: #1c252c; padding: 0px; margin: 0px; font-weight: 400; } .yellow-cta h3 span { font-weight: 700; } .yellow-cta a {padding: 10px 50px;margin: 0 0px 0 25px;border-radius: 36px;background-color: #ffffff;border: 2px solid #ffffff;font-size: 22px;line-height: 26px;color: #334046;font-weight: 500;font-family: 'Averta'} .yellow-cta a:hover {background-color: #ffeebf;color: #000; border-color:#ffeebf; } .industries {background: url(../images/product-img/mobile-apps-lines.jpg) left bottom repeat-x; padding-bottom: 75px; } .industrie-list { margin-top: 70px; } .industrie-list ul { display: flex; flex-wrap: wrap; justify-content: center;align-items: center;align-content: center; } .industrie-list ul li { width: calc(20% - 25px); padding: 12.5px; margin-bottom: 25px; min-height: 140px; } .industrie-list ul li div {background-color: #fff; box-shadow: 0px 2px 28.48px 3.52px rgba(0, 0, 0, 0.03); padding: 25px; transition: all .6s ease-in-out;} .industrie-list ul li img { display: block; margin: 0px auto 5px; } .industrie-list ul li p { font-size: 18px; font-weight: 400; color: #334046; padding: 0px; margin: 0px; text-align: center; } .industrie-list ul li:hover div { transform: scale(1.1);} /* secStudies ------------------------------------*/ /* Logo Design Banner ----------------------*/ .morelogo h3 { font-weight: 700;font-size: 35px;line-height: 45px;color: #334046;margin: 0 0 30px; font-family: 'Averta';} .morelogo p { text-align: left;font-weight: 300;font-size: 18px;line-height: 24px;margin: 0 0 20px; color: #333 } .morelogo .requestCall form input[type="submit"] { margin: 10px 0 0; } .morelogo .yellow-btn {display: block; margin: 0 0 20px 0; text-align: center;} .morelogo .border-btn {display: block; margin: 0; text-align: center;} .secStudies {margin-bottom: 50px;} .secStudies .headBox { margin-bottom: 40px; } .secStudies .csArea { margin: 0 0 30px; } .secStudies .csWrap { border-top: 2px dashed #989898; border-bottom: 2px dashed #989898; padding-top: 15px; padding-bottom: 40px; margin: 0 0 30px; } .secStudies .csArea [class^="col-"]:nth-child(n+5) .csWrap, .secStudies .csArea [class*=" col-"]:nth-child(n+5) .csWrap { border-top: none; padding-top: 0; } .secStudies .csWrap .csBox { margin: 0; position: relative; } .secStudies .csWrap h4 { padding: 0 0 15px; margin: 0; font-weight: 300; font-size: 18px; line-height: 24px; color: #1c252c; } .secStudies .csWrap h4 b { font-weight: 600; display: block; } .secStudies .cs-img-overlay { display: block; } .secStudies .csBox .cs-img-overlay::after { border-right: 1px solid #fff; border-left: 1px solid #fff; -webkit-transform: scale(1,0); transform: scale(1,0); } .secStudies .cs-actions { position: absolute; top: 0; left: 0; right: 0; bottom: -50px; width: 100%; text-align: center; margin: auto; display: table; z-index: 555; opacity: 0; -webkit-transition: all .2s ease; transition: all .2s ease; } .secStudies .csBox {width: 100%;padding-top: 100%;margin: 0 0 35px;display: block;background-repeat: no-repeat;background-position: center;background-size: cover;} .secStudies .csBox .cs-img-overlay::before, .secStudies .csBox .cs-img-overlay::after { position: absolute; top: 30px; right: 30px; bottom: 30px; left: 30px; content: ''; opacity: 0; -webkit-transition: opacity .35s,-webkit-transform .35s; transition: opacity .35s,transform .35s; } .secStudies .csBox .cs-img-overlay::before { border-top: 1px solid #fff; border-bottom: 1px solid #fff; -webkit-transform: scale(0,1); transform: scale(0,1); } .secStudies .csBox .cs-img-overlay span { background: #fff; color: #1c252c; padding: 7px 12px; border-radius: 4px; font-size: 14px; text-transform: uppercase; text-decoration: none; } .secStudies .csBox:hover .cs-img-overlay .cs-actions { opacity: 1; bottom: 0; } .secStudies .csBox:hover .cs-img-overlay::before, .secStudies .csBox:hover .cs-img-overlay::after { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .secStudies .csBox:hover .cs-img-overlay { display: block; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; text-align: center; margin: auto; height: 100%; } .secStudies .csBox a { position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 1000; } .secStudies .webArea { padding: 0 15px; margin: 0 0 60px; } .secStudies .webArea .csWrap { border: none; margin: 0; padding: 0; } .secStudies .webArea [class^="col-"]:nth-child(n+5) .csWrap, .secStudies .webArea [class*=" col-"]:nth-child(n+5) .csWrap { margin-top: 30px; } .requestCall { text-align: center; padding-top: 30px; } .requestCall p { font-weight: 300; font-size: 18px; line-height: 24px; margin: 0 0 20px; } .requestCall .form-control { font-weight: 300; font-size: 15px; line-height: 20px; color: #667075; padding: 10px 15px;} .requestCall .row+.row { margin-top: 15px; } .requestCall form input[type="submit"] {background-color: #fecc45;border-width: 1px;border-style: solid;border-color: #fecc45;font-weight: 700;font-size: 18px;line-height: 24px;color: #333;display: block;margin: 0 auto;padding: 10px 30px;position: relative;z-index: 20;} .fullcta .requestCall { text-align: left; } .fullcta .requestCall .row { display: inherit; } .fullcta .requestCall .row+.row { margin-top: 0; } .fullcta .requestCall [class^="col-"], .fullcta .requestCall [class*=" col-"]{ max-width: 100%; } .fullcta .requestCall [class^="col-"]+[class^="col-"], .fullcta .requestCall [class*=" col-"]+[class*=" col-"] { margin-top: 20px; } /* secStudies ------------------------------------*/ /* Custom select box ------------------------------------*/ .icon_select_mate { position: absolute; top: 12px; right: 2%; font-size: 16px; height: 22px; transition: all 275ms; } .select_mate { position: relative; font-weight: 300; font-size: 16px; line-height: 30px; color: #334046; background-color: #fff; border: 1px solid #ccc; border-radius: 5px; transition: all 375ms ease-in-out; margin-bottom: 20px; } .select_mate select { position: absolute; overflow: hidden; height: 54px; opacity: 0; z-index: -1; font-family: 'Averta';} .cont_list_select_mate { position: relative; float: left; width: 100%; } .cont_select_int { position: absolute; left: -1px; right: -1px; top: 0px; z-index: 999; overflow: hidden; width: auto; height: 0; max-height: 270px; overflow-y: scroll; margin: 0; padding: 0; background-color: #fff; border-radius: 3px; box-shadow: 1px 4px 10px -2px rgba(0, 0, 0, 0.2); transition: all 375ms ease-in-out; } .cont_select_int li { position: relative; float: left; width: 100%; border-bottom: 1px solid #E0E0E0; background-color: #F5F5F5; list-style-type: none; padding: 10px 20px; margin: 0px; transition: all 275ms ease-in-out; display: block; cursor: pointer; font-weight: 300; font-size: 16px; line-height: 24px; color: #334046; } .cont_select_int li:last-child { border-radius: 5px; border-bottom: 0; } .cont_select_int li:hover { background-color: #EEEEEE; } .cont_select_int .active { background-color: #EEEEEE;} p.selecionado_opcion { width: 100%; padding: 15px 40px 15px 20px; margin: 0; display: block; cursor: pointer; font-family: 'Averta'; height: 54px;} /* secTalk ------------------------------------*/ .secTalk {padding: 100px 0;background-color: #f4f3f1;background-image: url('../images/girrafetalk.png');background-repeat: no-repeat;background-position: bottom right;background-size: auto 90%;} .secTalk .headBox { margin: 0 0 40px; padding: 0 30px 0 0; } .secTalk .btn-call { margin-bottom: 20px; } .secTalk a { font-weight: 600; font-size: 18px; line-height: 30px; color: #334046; clear: both; display: block; } .secTalk a [class^="icon-"], .secTalk a [class*=" icon-"] { float: left; display: block; width: 30px; height: 31px; font-size: 20px; line-height: 31px; text-align: center; margin: 0 10px 0 0; } .secTalk a .icon-support { font-size: 28px; } .secTalk a .icon-long-arrow-right { float: right; margin: 0 0 0 5px; font-size: 22px; } .secTalk a span { position: relative; display: table; float: left; } .secTalk a i {float: left; font-size: 25px; margin: 0 15px 0 0; } .secTalk a i.fa-long-arrow-right { float: right; margin-left: 15px;margin-top: 5px; } .secTalk a span:after { position: absolute; bottom: 0; left: 0; background-color: #334046; height: 1px; width: 100%; display: block; content: ""; } .secTalk a+a { margin: 15px 0 0; } .secTalk a:hover { color: #111; } .secTalk a:hover span:after { background-color: #111; } .secTalk .ctaImage { margin: 0 20px -100px 0; } .secTalk .btn i { margin: 0 15px 0 0; } .secTalk input[type="email"] { border-color: #111; background: none; font-weight: 300; font-size: 16px; line-height: 30px; color: #4c575c; padding: 13px 24px; } .secTalk .btn {} .secTalk .btn:hover {} /* secTalk ------------------------------------*/ /* secRecent ------------------------------------*/ .secRecent .carousel-indicators { position: relative; left: inherit; right: inherit; bottom: inherit; margin: 0 0 35px; border-bottom: 1px solid #dcdcdc; display: flex; flex-direction: row; flex-wrap: nowrap; flex-flow: row wrap; justify-content: center; align-items: center; align-content: space-between; } .secRecent .carousel-indicators > div { text-indent: inherit; margin: 0; padding: 0 20px 10px; width: inherit; height: inherit; font-weight: 700; font-size: 16px; line-height: 24px; color: #b9b9b9; cursor: pointer; position: relative; border-bottom: 5px solid transparent; } .secRecent .carousel-indicators > div:hover { color: #ee5e17; } .secRecent .carousel-indicators > div.active { background: none; color: #334046; border-color: #334046; } #logoDesign .headBox { margin-bottom: 35px; } .secWebmore { padding: 90px 0 100px; } .secWebmore .rowmwb { margin-bottom: 45px; } .secWebmore .seebox { padding-top: 120%; margin: 25px 0; background-repeat: no-repeat; background-size: cover; position: relative; } .secWebmore .seeHead {-webkit-transform: translate3d(0, -10px, 0);-moz-transform: translate3d(0, -10px, 0);-o-transform: translate3d(0, -10px, 0);transform: translate3d(0, -10px, 0);} .secWebmore .seeFoot {-webkit-transform: translate3d(0, 10px, 0);-moz-transform: translate3d(0, 10px, 0);-o-transform: translate3d(0, 10px, 0);transform: translate3d(0, 10px, 0);} .secWebmore .seeHead, .secWebmore .seeFoot {opacity: 0;visibility: hidden;-webkit-transition: all 0.35s ease-in-out;-moz-transition: all 0.35s ease-in-out;-o-transition: all 0.35s ease-in-out;transition: all 0.35s ease-in-out;} .secWebmore .seebox:hover .seeHead, .secWebmore .seebox:hover .seeFoot {-webkit-transform: translate3d(0, 0, 0);-moz-transform: translate3d(0, 0, 0);-o-transform: translate3d(0, 0, 0);transform: translate3d(0, 0, 0); opacity: 1;visibility: visible;} .secWebmore .seebox h3 { font-weight: 700; font-size: 24px; line-height: 30px; color: #fff; text-align: left; text-shadow: 1px 1px 1px rgba(0,0,0,0.3); margin: 0 0 5px; padding: 0; } .secWebmore .seebox p { font-weight: 300; font-size: 18px; line-height: 26px; color: #fff; text-align: left; text-shadow: 1px 1px 1px rgba(0,0,0,0.3); text-transform: uppercase; margin: 0; padding: 0; } .secWebmore .seeFoot { font-weight: 600; font-size: 18px; line-height: 26px; color: #fff; text-align: left; text-shadow: 1px 1px 1px rgba(0,0,0,0.3); margin: 0; padding: 0; } .secWebmore .moreFull { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .secWebmore .seebox .seeOverlay {position: absolute;top: 0;left: 0;right: 0;bottom: 0;width: 100%;text-align: center;margin: auto;height: 100%;padding: 50px;display: flex;flex-direction: column;justify-content: space-between;background-color: rgba(0,0,0,0);-webkit-transition: all 0.35s;-moz-transition: all 0.35s;-o-transition: all 0.35s;transition: all 0.35s;} .secWebmore .seebox:hover .seeOverlay {background-color: rgba(0,0,0,0.4);} .secWebmore .seeOverlay::before, .secWebmore .seeOverlay::after {position: absolute;top: 30px;right: 30px;bottom: 30px;left: 30px;opacity: 0;visibility: hidden;display: block;content: ""; -webkit-transition: all 0.35s; -moz-transition: all 0.35s; -o-transition: all 0.35s; transition: all 0.35s;} .secWebmore .seeOverlay::before {border-top: 1px solid #fff;border-bottom: 1px solid #fff;-webkit-transform: scale(0,1);transform: scale(0,1);} .secWebmore .seeOverlay::after {border-left: 1px solid #fff;border-right: 1px solid #fff;-webkit-transform: scale(1,0); transform: scale(1,0);} .secWebmore .seebox:hover .seeOverlay::before, .secWebmore .seebox:hover .seeOverlay::after {opacity: 1; visibility: visible;-webkit-transform: scale(1);transform: scale(1);} .seemoreweb .bannerInner.dark-txt p { padding-right: 150px; } .sahelingo-blue-bg { background-color: #2d78d6; height: 990px; padding: 80px 0 0 0; } .stationary-main {} .stationary-main ul {display: flex;flex-wrap: nowrap;align-items: center;justify-content: center; margin-bottom: 90px; max-width: 90%; margin: 0 auto;} .stationary-main ul li {width: 30%;} .stationary-main ul li:last-child {width: 10%;} .letterhead-main { margin: -630px 0 0 0; } .letterhead-main img {margin: 0 auto; } .letterhead-main span { display: block; margin: 70px 0 100px 0; } .construction-color {} .construction-color ul { display: flex; flex-wrap: nowrap; margin-bottom: 80px; } .construction-color ul li { width: 50%; padding: 0 0 35px 100px; } .construction-color ul li h3 { font-size: 18px; font-weight: 700; color: #b8b8b8; text-transform: uppercase; padding: 0px; margin: 0px 0 65px 0; } .construction-color ul li + li { border-left: 1px solid #e9e9e9; } .construction-color ul li img { margin: 0px auto; } .graph-bg { background: url(../images/cs/sahelingo-progress-bg.jpg) center center no-repeat; min-height: 1020px; padding-top: 110px; } .graph-bg img { margin: 0px auto } .lj .TwoHalfImg ul li img { max-width: inherit;} .padTop120 { padding-top: 120px; } /*-----------MOBILE SLIDER-----------------*/ .HomeMobileSlider { height: 100vh; display: none; } .HomeMobileSlider .slick-track, .HomeMobileSlider .slick-list { height: 100vh !important } .HomeMobileSlider .slick-vertical .slick-slide { height: 100% } .HomeMobileSlider .slick-dots {text-align: center;margin-top: -30px;z-index: 1;position: relative; padding: 0px;} .HomeMobileSlider .slick-dots button { background-color: #fff; } .HomeMobileSlider .slick-dots li.slick-active button {background-color: rgb(254, 204, 69);} .mobile-slides { background-position: center center; background-size: cover; height: 100vh !important;} .mobile-slides h3 {font-family: Averta;font-weight: 800; font-size: 30px; line-height: 50px; color: rgb(255, 255, 255); margin: 0px; padding: 0px;z-index: 11;text-align: center; position: relative; } .mobile-slides h3 span {position: relative; } .mobile-slides h3 span:before {display: block;content: "";background-color: #203bc4;position: absolute;bottom: -5px;left: 0;right: 0;height: 35px;z-index: -1;} .slick-vertical .slick-slide.mobile-slides { display: flex; align-items: center; justify-content: center; } .mobile-slides .slider-yelow-btn {background-color: rgb(254, 204, 69); border: 2px solid rgb(254, 204, 69); border-radius: 36px;font-family: Averta;font-weight: 600;font-size: 18px;line-height: 30px;color: rgb(0, 0, 0);padding: 10px 20px;margin: 20px auto 0; text-align: center; display: block; width: 250px;} .mobile-slides .sliderBorBtn { background-color: rgba(255, 255, 255, 0);border: 2px solid rgb(255, 255, 255);border-radius: 36px;font-weight: 400;font-size: 20px;line-height: 30px;color: rgb(255, 255, 255);padding: 5px 20px;margin: 20px 0 0 0; display: table; text-align: center;} .mobile-slides>div {padding: 0 20px; width: 100%;} .slick-initialized .mobile-slides.slick-slide { display: flex; align-items: center;} .slideNum {z-index: 1;font-weight: 700;font-size: 120px;color: rgba(255, 255, 255, 0.1);text-transform: uppercase;margin: 0px;padding: 0px;text-align: left; line-height: 120px; position: absolute; margin-top: -65px;} .caseStu {z-index: 12;font-weight: 400;font-size: 22px;line-height: 22px;color: rgb(255, 255, 255);text-transform: uppercase;margin: 0px 0 10px 0; padding: 0px; position: relative; } .slidHead {font-weight: 700; font-size: 40px;line-height: 45px;color: rgb(255, 255, 255);margin: 0px;padding: 0px;z-index: 11;text-align: left;} /*-----------MOBILE SLIDER-----------------*/ /*--------------NEW TESTIMONIAL SECTION--------------*/ .testi-sec { padding: 50px 0px; } .testi-sec img { display: inline-block; } .testi-sec .center-head-txt p {max-width: 40%;} .testi-sec .slick-dots { text-align: center; padding-left: 0px; } .testi-sec .slick-dots li.slick-active button { background-color: #28abe2;} .testi-trust { display: inline-block; margin: 10px 0 0 0; } .texti-box { /* padding: 20px 70px 30px 105px; */ padding: 20px 20px 30px 70px; margin-top: 50px; } .texti-box>img { width: 100px; } .texti-box p { padding: 0; margin: 30px 0; font-size: 16px; font-weight: 500; color: #636363; line-height: 28px; position: relative; } .texti-box p:before { width: 30px; height: 23px; background: url(../images/testi-arrow.png) center top no-repeat; position: absolute; left: -50px; top: 5px; content: '';} .texti-box .author img { float: left; margin-right: 15px; width: 50px; height: 50px; border-radius: 50%; } .texti-box .author h4 { font-size: 16px; font-weight: 500; color: #636363; line-height: 20px; padding: 5px 0 0 0; margin: 0; } .texti-box .author h4 strong {font-weight: 700; color: #272727; display: block; } ul.testi-logo-new { position: relative; display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; max-width: 90%; margin: 120px auto 50px; } ul.testi-logo-new li { width: 16.666%; height: 50px; align-items: center;justify-content: center;display: flex; } ul.testi-logo-new li img { margin: 0 auto; opacity: 0.6;} ul.testi-logo-new li img.hover { position: absolute; transition: all .4s ease-in-out; opacity: 0;} ul.testi-logo-new li:hover img {opacity: 0;transition: all .4s ease-in-out;} ul.testi-logo-new li:hover img.hover { opacity: 1; transition: all .4s ease-in-out;} /*--------------NEW TESTIMONIAL SECTION--------------*/ #bannerfront { /*min-height: 890px;*/ } /*----------APP IOS STYLING -------------*/ .bannerInner.dark-txt p {/* padding-right: 22%; */ padding-right: 0; } .topBlueForm { background: url(../images/apps/blue-form-bg.jpg) center bottom no-repeat; background-size: cover; } .topBlueForm .row { min-height: 337px; } .topBlueForm h3 { font-size: 41px; font-weight: 600; color: #fff; text-align: center; padding: 0px; margin: 0px; } .topBlueForm h3 strong { font-weight: 700; } .topBlueForm p { font-size: 16px; font-weight: 400; color: #fff; text-align: center; padding: 0px; margin: 25px 0 0 0; } .topBlueForm form.AnimationForm .field { width: 100%; margin-bottom: 15px; } .topBlueForm form.AnimationForm .field input, .topBlueForm form.AnimationForm .field textarea { color: #fff; } .topBlueForm form.AnimationForm .field fieldset { color: #fff; } .topBlueForm form.AnimationForm .field:before { background-color: #fff; width: 100%;} .topBlueForm form.AnimationForm .field:last-child:before { display: none; } .topBlueForm form.AnimationForm .field input[type="submit"] { cursor: pointer; color: #0000ee; text-align: center; font-size: 18px; display: block; border: 1px solid #fff; border-radius: 50px; height: 50px; font-weight: 500; font-family: 'Averta'; background: #fff;} .topBlueForm form.AnimationForm .field fieldset.active {top: -10px;} .topBlueForm form.AnimationForm .field textarea { height: 60px; resize: none; } .iosBodyImg { background: url(../images/apps/ios-body-img.jpg) center top no-repeat; background-size: cover; position: relative; } .iosBodyImg .row { min-height: 895px; } .iosBodyImg h3 { color: #334046; font-size: 48px; font-weight: 700; padding: 0px; margin: 0 0 30px 0; max-width: 50%; } .iosBodyImg p { color: #334046; font-size: 20px; font-weight: 400; padding: 0px; margin: 0; width: 70%; line-height: 30px; } .iosBodyImg ul { padding: 0px; margin: 60px 0 0 0; display: flex; flex-wrap: wrap; } .iosBodyImg ul li { font-size: 20px; font-weight: 400; color: #334046; padding: 0 100px 0 75px; margin: 0 0 70px 0; position: relative; line-height: 26px; width: 50%; } .iosBodyImg ul li i { position: absolute; left: 0px; top: -8px; } .iosBodyImg img.hand { position: absolute; right: -140px; bottom: 0px; max-width: 40%; } .iosBodyImg img.hand-left { position: absolute;right: 480px;top: 280px;bottom: 0px; } .iosBodyImg img.hand-right { position: absolute;right: 60px;top: 400px;bottom: 0px; } .structureBg { background: url(../images/apps/structure-bg.jpg) center top no-repeat; background-size: cover; padding: 95px 0 0 0; min-height: 975px; } .structureBg h4 { font-size: 48px; font-weight: 700; color: #334046; text-align: center; padding: 0px; max-width: 80%; margin: 0 auto 150px; } .structure-root ul {background: url(../images/apps/structure-root.png) center top no-repeat; min-height: 435px; position: relative;} .structure-root ul li {position: absolute; left: 6%; bottom: 1%; height: 270px; width: 130px;} .structure-root ul li img {position: absolute; bottom: 0; left: 0; right: 0; margin: auto;} .structure-root ul li span {font-weight: 600; font-size: 20px; color: #151515; text-align: center; display: block;} .structure-root ul li span:before {width: 1px;height: 30%;background-color: #cfcfcf;position: absolute;left: 0px;right: 0px;margin: auto; content: ''; top: 40px;} .structure-root ul li:nth-child(2) {left: 20.5%; bottom: 16.2%;} .structure-root ul li:nth-child(3) {left: 31%; bottom: -21.5%; display: flex;align-items: flex-end;width: 145px;height: 220px;} .structure-root ul li:nth-child(3) img { top: 0px;bottom: inherit;margin: 0 auto; } .structure-root ul li:nth-child(3) span:before {height: 40%;top: 100px;} .structure-root ul li:nth-child(4) {left: 45.7%; bottom: -18.8%; display: flex;align-items: flex-end;width: 145px;height: 220px;} .structure-root ul li:nth-child(4) img { top: 0px;bottom: inherit;margin: 0 auto; } .structure-root ul li:nth-child(4) span:before {height: 35%; top: 120px;} .structure-root ul li:nth-child(5) { left: 53%; bottom: inherit; top: -14.2%; height: 200px;} .structure-root ul li:nth-child(6) { left: 35%; bottom: inherit; top: -21.5%; height: 230px;} .structure-root ul li:nth-child(7) { left: 71%;bottom: 6%;width: 190px;height: 200px;} .structure-root ul li:nth-child(8) { left: 84.4%;bottom: 33%;width: 220px;height: 190px;} .mainSlider { background: url(../images/apps/slider.jpg) center top no-repeat; min-height: 930px; background-size: cover; } .techonologyBg {background: url(../images/apps/technology-bg.jpg) center top no-repeat; background-size: cover;} .techonologyBg .row { min-height: 500px; } .techonologyBg h3 { margin-top: 0px; } .techonologyBg img { display: block; margin: 50px auto 0; } /* Yellow FORM for inner pages. ------------------------------------*/ .yeloForm { background-color: #fecc45; } .yeloForm .row { min-height: 180px; } .yeloForm h3 { font-size: 35px; font-weight: 500; color: #1c252c; padding: 0px; margin: 0px; text-align: center; } .yeloForm form.AnimationForm .field { width: 100%; margin: -35px 0 0 0; } .yeloForm form.AnimationForm .field:before { width: 100%; background-color: rgba(0,0,0,0.4); } .yeloForm form.AnimationForm .field fieldset { color: rgba(0,0,0,0.8); } .yeloForm form.AnimationForm .field fieldset.active {top: -10px;} .yeloForm form.AnimationForm .field input[type="submit"] { cursor: pointer; color: #334046; text-align: center; font-size: 18px; display: block; border: 1px solid #fff; border-radius: 50px; height: 50px; font-weight: 500; font-family: 'Averta'; background: #fff; transition: all .4s ease-in-out;} .yeloForm form.AnimationForm .field input[type="submit"]:hover { background-color: #fdc224; border-color: #fdc224; } .yeloForm form.AnimationForm .col:last-child .field:before { display: none; } /* Blue CTA for inner pages ------------------------------------*/ .blue-cta { background-color: #0e0ef7; } .blue-cta .row { min-height: 210px; } .blue-cta h3 { font-size: 35px; font-weight: 500; color: #fff; text-align: center; padding: 0px; margin: 0 0 10px; } .blue-cta ul { padding: 0px; margin: 0px; text-align: center; } .blue-cta ul li { padding: 0; margin: 20px 0 0 0; font-size: 37px; font-weight: 500; position: relative; text-align: right; display: inline-block; } .blue-cta ul li span { display: block; font-size: 20px; margin-top: 12px; } .blue-cta ul li i { position: absolute; right: 0px; top: 0px; } .blue-cta ul li a {color: #fff;} .blue-cta ul li:first-child { padding: 0 70px 0 0;} .blue-cta ul li:nth-child(2) { margin: 0 35px; } .blue-cta ul li a.estimateBtn { height: 58px; line-height: 58px; font-size: 22px; color: #0404e2; text-align: center; display: block; border: 1px solid #fff; border-radius: 50px; font-weight: 500; background: #fff; transition: all .4s ease-in-out; padding: 0px 45px; margin: 0px; position: relative; top: -15px;} .blue-cta ul li a.estimateBtn:hover { background-color: #fdc224; border-color: #fdc224; } .blue-cta ul li:last-child { text-align: left; padding: 0 0 0 70px; } .blue-cta ul li:last-child i { right: inherit; left: 0px; } .appsForm h6 { font-size: 16px; font-weight: 600; color: #fff; padding: 0px; margin: 20px 0 10px; } .appsForm i { font-size: 40px; color: #fff; transition: all 1.5s ease-in-out; -webkit-animation: MoveRightLeft 2s ease-in-out infinite; animation: MoveRightLeft 2s ease-in-out infinite;} /* About Page ------------------------------------*/ .aboutBnr { background: url(../images/slider/bgslide.jpg) center top no-repeat; height: 100vh; background-size: cover; } .aboutBnr h3 {font-family: Averta;font-weight: 800;font-size: 62px;line-height: 80px;color: rgb(255, 255, 255);margin: 0px;padding: 0px;text-align: left; position: relative; z-index: 1;} .aboutBnr h3 span { position: relative; padding: 0 5px; } .aboutBnr h3 span:after {display: block;content: "";background-color: #203bc4; position: absolute; bottom: 0; left: 0; right: 0; height: 40px; z-index: -1;} .mainHeadBtn { background-color: rgb(254, 204, 69);border: 2px solid rgb(254, 204, 69);border-radius: 36px;font-weight: 600;font-size: 20px;line-height: 30px;color: #000; display: inline-block; padding: 10px 40px;margin: 65px 0 0 0px;} .arondSec { min-height: 430px; } .arondSec h3 { font-size: 48px; font-weight: 700; color: #334046; padding: 110px 0 0 0; margin: 0px; } .arondSec h3:before {background: url(../images/headline.png) left top repeat-y;height: 80%;width: 11px;position: absolute;right: 25px;top: 0px;content: '';z-index: 5;} .arondSec p { padding: 75px 0 0 75px; font-size: 20px; font-weight: 400; color: #1d1d1d; margin: 0px; line-height: 32px; } .about-values { background-color: #fbfbfb; padding: 60px 0; } .about-values h3 {font-size: 48px;font-weight: 700;color: #334046;padding: 32px 0 0 0;margin: 0px;} .about-values ul {margin: 0;padding: 0px;display: flex;flex-wrap: wrap;} .about-values ul li {padding-left: 75px;margin-bottom: 40px;width: 50%;} .about-values ul li:nth-child(even) {padding-left: 140px;} .about-values ul li img {} .about-values ul li h5 {font-size: 22px;font-weight: 700;padding: 21px 0 5px;margin: 0px;color: #1d1d1d;} .about-values ul li p { font-size: 20px; font-weight: 400; padding: 0px; margin: 0px; line-height: 31px; color: #1d1d1d; } .about-services { padding: 85px 0 115px; } .about-services h3 {font-size: 48px;font-weight: 700;color: #334046;padding: 32px 0 0 0;margin: 0px;} .about-services ul {margin: 0;padding: 0px;display: flex;flex-wrap: wrap;} .about-services ul li {margin-bottom: 40px;width: 33.333%;} .about-services ul li:first-child { padding-left: 75px; } .about-services ul li:nth-child(2) { padding-top: 40px; } .about-services ul li h5 {font-size: 22px;font-weight: 700;padding: 0px;margin: 0 0 15px 0;color: #1d1d1d;} .about-services ul li a { font-size: 20px; font-weight: 400; padding: 0px; margin: 0px; line-height: 31px; color: #1d1d1d; display: block;} .BannerHalfSlider ul.slick-dots { margin-top: 20px; text-align: left; padding-left: 20%; } .webDeveMain { background: url(../images/product-img/web-deve-left-bg.jpg) left top no-repeat; min-height: 900px; position: relative; } .webDeveMain .leftTabBig { position: absolute; left: 30px; top: 140px; } .webDeveMain .leftTabSmall { position: absolute; left: 0px; top: 270px; } .webDeveMain .webDeveTxt { margin: 100px 0 0 60px; } .webDeveMain .webDeveTxt h3 { color: #334046; font-size: 48px; font-weight: 700; padding: 0px; margin: 0 0 30px 0; max-width: 50%;} .webDeveMain .webDeveTxt p { color: #334046; font-size: 20px; font-weight: 400; padding: 0px; margin: 0; width: 70%; line-height: 30px;} ul.shortService { padding: 0px; margin: 60px 0 0 0; display: flex; flex-wrap: wrap; } ul.shortService li { font-size: 20px; font-weight: 400; color: #334046; padding: 0 50px 0 75px; margin: 0 0 50px 0; position: relative; line-height: 26px; width: 50%; } ul.shortService li i { position: absolute; left: 0px; top: -8px; } .fileinput-button { background-color: #fecc45 !important; border-color: #ffc321 !important; color: #333; border-radius: 25px;} .secBrief .submission button[type="submit"] { background: #fecc45; color: #2a3943; border-radius: 25px; } .morelogo .requestCall .form-control { max-width: 100%; } .secStudies .csWrap .csBox:hover .cs-actions { opacity: 1; bottom: 0; } .secStudies .csWrap .csBox:hover .cs-actions span {background: #fff; color: #1c252c; padding: 7px 12px;border-radius: 4px; font-size: 14px; text-transform: uppercase;text-decoration: none; } /* Contact Page ------------------------------------*/ .contactBnr { height: auto; } .contactSec { padding: 100px 0px; } .contactSec .center-head-txt { margin-bottom: 50px; } .contactSec .center-head-txt h3 {margin: 0px 0 30px 0; } .contactFormMain .field { margin-bottom: 25px; } .contactFormMain .field p {font-size: 16px; font-weight: 600; color: #2a3943; padding: 0; margin: 0 0 10px 0;} .contactFormMain .field input[type="text"], .contactFormMain .field input[type="email"], .contactFormMain .field input[type="number"], .contactFormMain .field textarea { background-color: #f8f8f8; border-color: #e2e2e2; display: block; width: 100%; padding: 0 25px; height: 45px; font-size: 15px; line-height: 1.5; color: #495057; background-clip: padding-box; border: 1px solid #ced4da; border-radius: .25rem; transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;} .contactFormMain .field textarea { min-height: 150px; resize: none; } .contactFormMain .field input[type="submit"] {cursor: pointer; width: 235px; color: #000; text-align: center; font-size: 18px; display: block; float: right; border-radius: 50px; height: 50px; font-weight: 500; font-family: 'Averta'; background-color: #fecc45; text-transform: uppercase; transition: 0.3s;} .contactFormMain .field input[type="submit"]:hover { color: #fff;} .contactInfo { padding: 0 0 0 50px; } .contactInfo h3 { color: #334046; font-size: 30px; font-weight: 600; margin: 0 0 20px 0; } .contactInfo ul {} .contactInfo ul li {line-height: 30px; font-size: 20px; font-weight: 400; color: #334046; margin-bottom: 25px; border-bottom: 1px solid #ccc; padding-bottom: 25px; } .contactInfo ul li a {} .contactInfo ul li a:hover { color: #fecc45; } .contactInfo ul li a i { display: inline-block; margin: 0 10px 0 0; font-size: 24px; } form.AnimationForm div#message h2 { text-align: center; display: block; color: #000; font-size: 20px; } form.AnimationForm div#message { margin-left: 50px; border: 1px solid #fff; padding: 10px 50px; opacity: 1; } .slidePera { font-size: 16px; color: #ffff; padding: 0px; margin: 0px; } /*----Industry page----*/ .bannerInner.dark-txt .realStateban p { margin-bottom: 10px; } .realStateban ul { margin-bottom: 40px; } .realStateban ul li { font-size: 26px; font-weight: 300; color: #1c252c; padding: 0 0 0 42px; margin: 0px; position: relative; line-height: 48px; } .realStateban ul li:before { width: 26px; height: 26px; position: absolute; left: 0px; top: 12px; content: ''; background: url(../images/real-estate/banner-icon.png) left top no-repeat; background-size: contain; } .estateDesign { background: url(../images/product-img/brand-identity-bg.jpg) center top no-repeat; background-size: cover; padding: 100px 0;} .estateDesign .estateBodyTxt { max-width: 600px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead {font-size: 48px; font-weight: 800; color: #1c252c; padding: 0px; margin: 0 0 35px;} .estateDesign .estateBodyTxt p { font-size: 25px; font-weight: 400; color: #565656; padding: 0; margin: 0 0 30px; line-height: 35px;} .estateDesign .estateBodyTxt p span { font-size: 21px; } .estateDesign .estateBodyTxt h6, .estateDesign .estateBodyTxt .rightTxtSubHead {font-size: 21px; font-weight: 800; color: #1c252c; padding: 0px; margin: 0 0 0px;} .centerBtn { text-align: center; padding: 50px 0px; border-bottom: 1px solid #efefef; margin-bottom: 80px; } .howWorkBox { margin: 100px 0; text-align: center; } .howWorkBox i { display: block;text-align: center; margin-bottom: 40px; } .howWorkBox i img { margin: 0px auto } .howWorkBox h5 {font-weight: 800; font-size: 28px; color: #334046; margin: 0 0 10px; padding: 0px;} .howWorkBox p {font-size: 21px; font-weight: 500; color: #1c252c; padding: 0px; margin: 0px; line-height: 33px;} .logoIndustry { padding: 80px 0px; background-color: #f7f7f7; } .logoIndustry h2 { font-size: 48px; font-weight: 900; color: #334046; padding: 0px; margin: 0; text-align: center;} .logoIndustry .industryList { margin-top: 80px; } .logoIndustry .industryList ul { display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap; } .logoIndustry .industryList ul li { width: 33.333%; padding: 0 20px 0 0; font-size: 20px; font-weight: 300; color: #1c252c; line-height: 55px; margin: 0px; } .logoIndustry .industryList ul li a {color: #1c252c;} .logoIndustry .industryList ul li:nth-child(3n) { padding: 0; } .indusLogoSec [class*="col-"] { padding-left: 0px; padding-right: 0px; } .bodyImg { text-align: right; } .bodyImg img { display: inline-block; } .hide-more3 { display: block;} .industryList .show-button { display: none; margin-top: 15px; font-size: 18px; font-weight: 300; color: #ffffff; font-family: 'Averta'; text-decoration: underline; float: right; background-color: #fecc45; padding: 8px 20px; border-radius: 20px; text-decoration: none; } /*----Industry page----*/ .creative-brief .intercom-namespace { display: none !important; } #shots { display: flex; flex-wrap: wrap; /* max-width: 1570px; */ margin: 20px auto; height: 100%; } #shots .shot {position: relative; display: flex; width: 25%; background: #fecc45; color: white; text-decoration: none; justify-content: center; align-items: center; text-align: center;} #shots .shot:hover img { opacity: .1;} #shots .shot:hover .title { opacity: 1; transform: translate(0px, 0px); } #shots .shot .title { position: absolute; width: calc(100% - 1rem); padding: 0.5rem; opacity: 0; transition: opacity .2s ease-in-out; letter-spacing: 1px; font-size: 20px; font-weight: 600; color: #000; transform: translate(0px, 30px); transition: 0.6s; } #shots .shot img { display: block; max-width: 100%; transition: opacity .2s ease-in-out;} .termsTxt {margin: 170px 0 80px;} .termsTxt h2 { font-weight: 800; font-family: 'Averta'; font-size: 42px; line-height: 48px; margin: 0 0 30px; padding: 0; color: #00051d; text-align: center; } .termsTxt h5 { font-weight: 800; font-family: 'Averta'; font-size: 25px; line-height: normal; margin: 0 0 15px; padding: 0; color: #00051d; } .termsTxt p { font-size: 20px; line-height: 30px; color: #00051d; margin: 0 0 40px; padding: 0; font-weight: 500; font-family: 'Averta';} .termsTxt ul { display: flex; justify-content: center; align-items: flex-start; flex-wrap: wrap; flex-direction: column; margin: 0 0 40px; } .termsTxt ul li { font-size: 20px; line-height: 30px; color: #00051d; margin: 0 0 5px 25px; padding: 0; font-weight: 500; font-family: 'Averta'; list-style: disc; } .linkSec a { padding: 10px 30px; margin: 0; border-radius: 36px; background-color: transparent; border: 2px solid #fecc45; font-size: 18px; line-height: 26px; color: #000000; font-weight: 500; font-family: 'Averta'; display: inline-block; transition: all .3s ease-in-out; min-width: 300px; text-align: center; } .linkSec a:hover { background-color: #ffc21c; border-color: #ffc21c; } .linkSec { width: 100% !important; text-align: center; padding: 4% !important; } .csSliderSec .slick-initialized .slick-slide { display: block; opacity: 0.2; transition: 0.2s; } .csSliderSec .slick-initialized .slick-slide.slick-current { opacity: 1; transition: 0.2s; } .csSliderSec .slick-initialized .slick-slide { position: relative; height: 550px; transition: 3s;} .csSliderSec .slick-initialized .slick-slide img { position: absolute; left: 0px; top: 0px; transition: 3s;} .csSliderSec .slick-initialized .slick-slide:hover img { top: -100px; transition: 3s;} .csSliderSec .slick-slider .slick-prev, .csSliderSec .slick-slider .slick-next { left: 0px; bottom: inherit; top: 0px; border: 0px solid #000; width: calc(33% + 25px); height: 100%;border-radius: 0; } .csSliderSec .slick-slider .slick-next { right: 0px; left: inherit; } .csSliderSec .slick-slider .slick-prev:before, .csSliderSec .slick-slider .slick-next:before { font-size: 0px; } .csSliderSec .pagingInfo { font-size: 100px; text-align: center; margin: 50px auto; color: #333; position: relative; } .csSliderSec .pagingInfo:after {content: ''; position: absolute; border-right: 1px solid #000; -webkit-transform: rotate(22deg); transform: rotate(22deg); left: calc(50% - -2px); top: -22px; height: 70px; -webkit-transform: rotate(24deg); transform: rotate(24deg); margin: auto;} .csSliderSec .pagingInfo:first-letter { color: #fecc45; } .csSliderSec p { font-size: 25px; text-align: center; margin-bottom: 50px; } /* .category_banBot { margin: 80px 0px; } .category_banBot h3 { font-size: 48px; font-weight: 800; color: #1c252c; padding: 0px; margin: 0 0 25px;} .category_banBot p {font-size: 25px; font-weight: 400; color: #565656; padding: 0; margin: 0 0 30px; line-height: 35px;} .category_banBot ul {} .category_banBot ul li {} .category_banBot ul li:before {} .boxTxt { min-height: 150px; border-radius: 5px; display: flex; justify-content: center; align-items: center; box-shadow: 0 0 10px rgba(0,0,0,0.1) inset; } .boxTxt p {color: #ffffff; line-height: 30px; padding: 0; margin: 0; max-width: 75%; text-align: center;} .bodyTxtSec { margin-bottom: 80px; } .indusBodyTxt h6 {font-size: 21px; font-weight: 800; color: #1c252c; padding: 0px; margin: 0 0 0px;} .indusBodyTxt p { font-size: 25px; font-weight: 400; color: #565656; padding: 0; margin: 0 0 30px; line-height: 35px;} */ .csCenterTxtSmlWdth { margin: 100px 0 50px; } .csCenterTxtSmlWdth .container { max-width: 1200px; margin: 0 auto; text-align: center; } .csCenterTxtSmlWdth h2 {font-weight: 800; font-size: 44px; line-height: 44px; color: #00051d; margin: 0 0 10px; padding: 0;} .csCenterTxtSmlWdth p { font-size: 20px; line-height: 36px; color: #585858; margin: 0 0 40px; padding: 0; font-weight: 500; font-family: 'Averta'; } .orgazinixBorSec { border-top: 1px solid #e3e3e3; } .orgazinixBorSec .TwoHalfTxt { padding-top: 0px; padding-bottom: 0; } .orgazinixBorSec .TwoHalfTxt ul.cbdImgSec { padding-top: 0px; padding-bottom: 0px; } .orgazinixBorSec .TwoHalfTxt ul li:first-child { padding-right: 60px; border-right: 1px solid #e3e3e3; padding-top: 50px; padding-left: 0px; } .orgazinixBorSec .TwoHalfTxt ul li { padding-left: 100px; } .organizix-GrnImg {background-color: #00ae9a; padding-top: 100px;} .organizix-GrnImg img { width: auto; margin: 0 auto; } .organizix-RImg-LTxt .TwoHalfImg ul li { width: 50%; display: flex; align-items: center; justify-content: center;} .organizix-RImg-LTxt .TwoHalfImg ul li .textDiv { max-width: 650px; padding: 30px; } .organizix-RImg-LTxt .TwoHalfImg ul li h3 { font-size: 38px; font-weight: 900; color: #1d1d1d; padding: 0px; margin: 0px 0 25px;} .organizix-RImg-LTxt .TwoHalfImg ul li p { font-size: 20px; font-weight: 500; font-family: 'Averta'; color: #1d1d1d; padding: 0px; margin: 0px 0 20px 0; line-height: 31px;} .organizixCs .Clrpalette i.cbdColorPalet1 { border-color: #10acc5; } .organizixCs .Clrpalette i.cbdColorPalet2 { border-color: #e6711f; } .organizixCs .Clrpalette i.cbdColorPalet3 { border-color: #ededed; } .organizixCs .Clrpalette i.cbdColorPalet4 { border-color: #6b6b6b; } /* Business Logo Design Slider Styling ----------------------------------------------- */ .item.thumb.slick-slide {display: flex; justify-content: center; align-items: center; height: 150px; /* border-left: 1px solid #e5e5e5; */ padding: 0; } .item.thumb.slick-slide>div { display: flex; justify-content: center; align-items: center; min-height: 130px; width: 100%; cursor: pointer; } /* .item.thumb.slick-slide>div:hover { box-shadow: 0 0 10px rgba(0,0,0,0.2); } */ .item.thumb.slick-current.slick-active>div {box-shadow: 0 0 10px rgba(0,0,0,0.2); } .item.thumb.slick-slide img { width: 120px; } .item.thumb.slick-slide img.img100 { width: 100px; } .thumbList{margin-top: -170px;} .pagingInfo{display: block;text-align:right;position:relative;font-size: 24px;font-weight:400;color:#303e48; padding-top:10px;} .pagingInfo:before{width: calc(100% - 75px); height:2px;content: '';background-color:#28abe2;position:absolute;left:0;top:20px;} .pagingInfo:first-letter { font-weight: 700; color: #28abe2; font-size: 30px } .thumbList .slick-slider .slick-prev { display: none !important; } .thumbList .slick-slider .slick-next {right: -30px; left: inherit; top: 0; bottom: 0; border: 0px; background: url(../images/real-estate/arrow-icon.png) left top no-repeat; background-size: cover; width: 28px; height: 28px; opacity: 1; } .thumbList .slick-slider .slick-next:before { font-size: 0px; } .thumbList .slick-slider .slick-next:hover { opacity: 0.8; } /* Business Logo Design Slider Styling ----------------------------------------------- */ /*--------------RESPONSIVE STYLING START HERE---------------*/ @media (max-width: 1500px) { .bannerInner { padding-top: 100px; } } @media (min-width:1282px) and (max-width: 1366px) { .divTestimonials { background-size: 100% 100%; padding: 100px 100px 0 100px;} .slick-slider .slick-next {right: 20px;} .plan label {margin-right: 10px;padding: 8px 15px;font-size: 16px;} .TwoHalfTxt {padding: 50px; } .Clrpalette + .Clrpalette {margin-left: 25px; } .EstimateForm .PopupForm, .PopupInfo {padding-left: 50px;} .EstimateForm .PopupForm .FormFIelds {width: 90%;} .projectDtl {padding-top: 0;padding-bottom: 0; } .portfolioSec .portfolioList ul li {font-size: 16px; padding: 0px 20px;} .portfolioSec .portfolio-desc {max-width: 80%;margin: 0 auto 20px;} .dm-boxes-main ul.dm-boxes li h3 {font-size: 28px; margin: 0px 20px 15px 0;} .dm-boxes-main ul.dm-boxes li p {font-size: 18px;line-height: 26px;} .chart-area-main {background-position: -160px bottom, left bottom;} .dm-google-area {margin: 80px 0 0px; } .dm-google-area p {font-size: 24px;margin: 30px 0 0 50px;line-height: 34px;} .dm-google-area .google-img {bottom: -50px;} .dm-g-client-img {margin-bottom: 50px;} .padTop120 {padding-top: 80px;} .texti-box { padding: 20px 30px 30px 70px;margin-top: 50px; } ul.testi-logo-new {margin: 50px auto 20px; max-width: 100%; } ul.testi-logo-new li { height: auto; } .software .chart-area-main p {margin: 80px 100px 0 0px; } .appi-port-left-content .appi-pp-para .appi-cont p span { font-size: 14px; } .iosBodyImg img.hand-left {right: 200px; } .sliderHeight { margin-top: 5095px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead {font-size: 38px; } } @media (min-width:1170px) and (max-width: 1281px) { .appi-port-left-content .appi-pp-para .appi-cont p span { font-size: 14px; } .iosBodyImg img.hand-left {right: 100px; } .iosBodyImg h3 { font-size: 38px; max-width: 80%; } .rowProduct .BlueformSec { padding: 0 50px; } .iosBodyImg img.hand-left { right: 200px; max-width: 300px; } .iosBodyImg img.hand-right { max-width: 300px; } .thumbList .slick-slider .slick-next { right: 0px; } .bannerInner.dark-txt p { font-size: 20px; line-height: 30px; } .bannerInner.dark-txt .catBanHead { font-size: 45px; margin: 0 0 20px 0; } .realStateban ul li { font-size: 20px; line-height: 36px; } .realStateban ul li:before { width: 20px; height: 20px; top: 10px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead {font-size: 30px; } } @media (min-width:1000px) and (max-width: 1169px) { .navFp ul { height: 410px; } .navFp ul li a {line-height: 120px;font-size: 80px;} body.MenuActive .navFp > ul li ul {height: 320px;} .navFp ul li ul li a {line-height: 70px;font-size: 50px;} .secSvcfront .svcBox.svcBlue img {top: 0;right: -260px;} .secSvcfront .svcBox.svcYellow img {top: 10px;left: -20px;} .ImgText h4 {font-size: 22px;} .secEstimate .colEstimate { padding: 40px 20px; } .secEstimate .getContact h2 { font-size: 30px; } .secEstimate .getEst h2 { font-size: 35px; } .secTestimonials {padding: 50px 0 0;} .divTestimonials { padding: 0px; background: none; } .slick-slider .slick-next {right: 40%;left: inherit; bottom: 120px;} .slick-slider .slick-prev { left: 40%; bottom: 120px;} .footer h4 {font-size: 18px;line-height: 28px;} .footer .infoWrap p { font-size: 13px; line-height: 18px; } .footer .infoWrap a { font-size: 14px; } .footer nav ul li { font-size: 14px; } .footer nav ul li+li {margin-top: 20px;} .bannerInner.webcms h2 { font-size: 45px; } .bannerInner.webcms p { padding-right: 0px; } .box-txt {padding-left: 30px;} .box-txt h3 { font-size: 28px; } .rowProduct .leftSec {padding-left: 50px; padding-right: 50px;} .rowProduct .BlueformSec {padding: 0 30px;} .RadioBox {margin-bottom: 20px;} .plan.cf {text-align: center;} .plan label {margin-right: 15px;margin-top: 20px; display: inline-block; max-width: 200px; padding-top: 0;} .ios .plan label { padding: 0px 20px;} .EstimateForm .PopupForm, .PopupInfo { padding-left: 20px; } .EstimateForm .PopupForm h3 {margin: 0 0 30px 0; font-size: 30px;} .EstimateForm .PopupForm .FormFIelds {width: 95%; } .EstimateForm .PopupForm input[type="submit"] {width: 210px;height: 40px;} .projectDtl {padding-top: 0px;padding-bottom: 40px; } .leftNav { margin-left: 70px; } .TwoHalfTxt {padding: 50px; } .Clrpalette {width: 100px;height: 100px;} .Clrpalette i {width: 100px;height: 100px; border: 30px solid #ffb532;} .Clrpalette + .Clrpalette {margin-left: 10px;} .bannerInner.dark-txt h2 {font-size: 36px; margin-bottom: 20px; } .bannerInner.dark-txt p {font-size: 20px;line-height: 28px;margin-bottom: 30px; padding-right: 0; } .bannerInner.dark-txt .catBanHead {font-size: 40px; } .realStateban ul li { font-size: 20px; padding: 0 0 0 40px; line-height: 35px; } .realStateban ul li:before { width: 20px; height: 20px; top: 7px; } .bannerInner { min-height: 700px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead { font-size: 34px; margin: 0 0 20px; } .dm-ban-bot { padding: 50px 0;} .delivered-txt-main .delivered-left {padding-left: 50px; } .dm-ban-bot p {font-size: 20px;line-height: 30px; } .delivered-txt-main .delivered-right {padding-right: 50px;} .dm-ban-bot h3 {font-size: 30px; margin: 0 0 60px 0; } .dm-boxes-main ul.dm-boxes {flex-wrap: wrap;margin: 15px; } .dm-boxes-main ul.dm-boxes li {width: calc(50% - 12px); margin-bottom: 15px;} .dm-boxes-main ul.dm-boxes li:nth-child(even) { margin-left: 15px; } .portfolioSec .portfolio-item>div {height: 300px;} .chart-area-main {background-position: -250px bottom, left bottom;} .dm-google-area p {font-size: 20px;margin: 0px 20px 0 0px;line-height: 30px;} .dm-google-area p:before { top: 20px; } .dm-google-area .google-img { display: none; } .dm-google-area {margin: 30px 0 0px; } .dm-g-client-img {margin-bottom: 0px;} .WhatweDo-Services {padding-top: 20px; } .WhatweDo-Services ul li { padding: 15px 15px 15px 80px;} .WhatweDo-Services ul li:nth-child(even) { padding-left: 100px;} .WhatweDo-Services ul li h4 {font-size: 24px; margin: 0px 0 10px 0;} .morelogo {background-position: -250px center;} .select_mate select { z-index: 1; width: 100%; } .morelogo h3 {font-size: 30px;line-height: 40px;} .secStudies .csWrap h4 { font-size: 17px;} .seemoreweb .bannerInner.dark-txt p {padding-right: 0; } .graph-bg {min-height: inherit; padding: 50px 0; } .stationary-main ul li {margin: 0 15px; } .sahelingo-blue-bg {height: 750px; padding: 40px 0 0 0; } .letterhead-main {margin: -560px 0 0 0; } .letterhead-main span {margin: 30px 0 50px; } .construction-color ul li { padding: 0 50px 35px; } .padTop120 {padding-top: 50px;} /*----home slider----*/ .rev_slider { display: none !important; } .HomeMobileSlider { display: block; height: 700px; } .HomeMobileSlider .slick-track, .HomeMobileSlider .slick-list { height: 700px !important; } .mobile-slides { height: 700px !important; background-position: center top; } .mobile-slides>div { padding: 0 50px; width: 100%; } /*----home slider----*/ .texti-box { padding: 20px 10px 20px 40px; margin-top: 50px; } .testi-sec .center-head-txt p { max-width: 70%; } .texti-box p:before { left: -35px; } ul.testi-logo-new {max-width: 100%; margin: 40px auto 20px; } .testi-sec .border-left { border-left: 0px !important } .topBlueForm h3 { font-size: 30px; } .iosBodyImg h3 { margin: 25px 0 30px 0; max-width: 100%; font-size: 35px; } .iosBodyImg p {font-size: 18px;width: 100%;} .iosBodyImg ul li {font-size: 20px;padding: 0 0px 0 70px; margin: 0 0 40px 0;} .structureBg {padding: 35px 0 150px;min-height: inherit;} .structureBg h4 {font-size: 40px;max-width: 100%;margin: 0 auto 120px;} .blue-cta ul li { font-size: 24px; } .blue-cta ul li:first-child { padding: 0 60px 0 0; } .blue-cta ul li:nth-child(2) { margin: 0 20px; } .blue-cta ul li:last-child { padding: 0 0 0 60px;} .blue-cta ul li a.estimateBtn {padding: 0px 25px;font-size: 20px;} .techonologyBg .row { min-height: 350px; } .techonologyBg img {margin: 30px auto 0;} .aboutBnr h3 {font-size: 50px; line-height: 70px;} .arondSec h3 { font-size: 35px; } .arondSec p { padding: 75px 0 0 0px;} .about-values ul li, .about-values ul li:nth-child(even) { padding-left: 25px;} .about-values h3 { font-size: 35px;padding: 0; } .about-values {padding: 60px 0 0px; } .about-services h3 {font-size: 35px;padding: 0;} .about-services { padding: 25px 0 0; } .about-services ul li a { font-size: 18px; } .estateDesign .estateBodyTxt h3 { font-size: 40px; } .estateDesign .estateBodyTxt p { font-size: 20px; margin: 0 0 20px; line-height: 30px; } .logoIndustry .industryList ul li {width: 50%;padding: 0 0px 0 0; font-size: 18px; } .iosBodyImg img.hand-left { right: 150px; max-width: 250px; } .iosBodyImg img.hand-right { max-width: 250px; } .bannerInner.dark-txt.logoDesignNew .slick-initialized .slick-slide .row .col-12 + .col-12 { height: 400px; overflow: hidden; overflow-y: scroll; } .item.thumb.slick-slide img { width: 70%; } .thumbList .slick-slider .slick-next { right: 0px; } .item.thumb.slick-slide {padding: 0 0 0 10px;} .bannerInner.dark-txt.logoDesignNew {padding: 120px 0 30px 0px; height: auto; } #shots .shot {} .linkSec { min-height: inherit !important; height: auto !important; } .portfolioSec.logoDesignNewDribble .portfolio-desc { max-width: 100%; } .arondSec h3:before { display: none; } } @media (min-width: 768px) and (max-width: 999px) { .logoIndustry .industryList ul li {width: 50%;padding: 0 0px 0 0; font-size: 18px; } .EstimateForm .PopupForm h3 {font-size: 25px;margin: 0 0 20px 0;} .EstimateForm .PopupForm, .PopupInfo { padding-left: 20px;} .EstimateForm .PopupInfo ul li { padding: 0 0 0 70px; } .EstimateForm .PopupInfo ul li+li {margin-top: 30px; } .EstimateForm .PopupClients {margin: 50px 0 0px 0;} .EstimateForm .PopupClients p {margin-bottom: 20px; } .EstimateForm .PopupClients img:nth-child(3) {margin: 20px; } .bannerfront h2 {font-size: 50px; line-height: 60px;} .ImgText h4 {font-size: 25px;} .divTestimonials {padding: 50px 100px 0 100px; background: none; min-height: 500px;} .slick-slider .slick-next { right: 20px;} .slick-slider .slick-prev, .slick-slider .slick-next { bottom: 180px; } .secEstimate .getContact h2 {font-size: 25px;line-height: 35px;} .rowEstimate {flex-direction: column;} .colEstimate {min-height: inherit; width: 100%;} .secEstimate .colEstimate {padding: 50px;} .secSvcfront .svcWrapper { flex-direction: column; margin: 0 0 30px; } .secSvcfront .svcCol.svcLeft {width: 100%;height: 200px; margin-bottom: 20px;} .secSvcfront .svcCol.svcRight {width: 100%; } .secSvcfront .svcUp, .secSvcfront .svcDown {width: 100%; height: 100%; padding-left: 0;} .secSvcfront {padding: 60px 0 70px;} .secSvcfront .svcBox.svcYellow, .secSvcfront .svcBox.svcGreen, .secSvcfront .svcBox.svcPurple {margin: 0 10px;width: calc(33.33% - 20px);} .secSvcfront .svcBox.svcPurple { margin-right: 0px; } .secPfolio .rowPf { height: auto; } .secPfolio .colPf {width: 100%; height: 200px;} /*.secPfolio .colPf {width: 100%; height: auto;} .secPfolio .pflarge, .secPfolio .pfsmall {height: 400px;}*/ .secPfolio .colPf:last-child, .secPfolio .colPf:nth-child(2) { height: 400px; } .secPfolio .pfsmall, .branding .secPfolio .colPf:last-child, .branding .secPfolio .colPf:nth-child(2) { height: 200px; } .branding .secPfolio {height: 1800px;} .BranIdenti .identiTxt {margin-top: 0; } .BranIdenti {min-height: inherit; margin: 20px 0 0;} .portfolioSec .portfolioList ul li {font-size: 18px;padding: 0px 20px;border-radius: 40px;line-height: 35px;} .portfolioSec .portfolio-desc {max-width: 100%;margin: 0 auto 20px; } .portfolioSec .portfolio-item {flex-wrap: wrap;} .portfolioSec .portfolio-item>div {width: 48%;height: 450px;padding: 25%; } .secTestimonials { padding: 20px 0; } .testiLogo { margin: 0px; } .Mobilelogo { display: block; margin: 20px auto 10px; max-width: 60px; } .Mobilelogo .mid {fill: #FFFFFF;} .Mobilelogo .out, .Mobilelogo .in { fill: #717171;} .Mobilelogo:hover .out { fill: #2A3943;} .Mobilelogo:hover .in { fill: #28ABE2;} .footer nav ul li { display: inline-block;} .footer nav ul li+li {margin-top: 10px; margin-left: 26px;} .footer { padding: 30px 0; } .footer h4 {font-size: 20px;line-height: 28px;max-width: inherit;} .footer nav, .footer .infoWrap { display: block;} .footer nav ul {width: 100%; text-align: center;} .footer h5 {margin: 10px 0 0 0; font-size: 16px; font-weight: 700; position: relative;} .footer h5:before { width: 65px; height: 2px; background-color: #4e4e4e; position: absolute;; right: 0px; bottom: -5px; content: ''; } .footer .infoWrap p { margin: 0px; } .infoWrap .infoLoc {float: left;width: calc(50% - 16px); text-align: right; margin-right: 10px;} .infoWrap .infoLoc + .infoLoc { text-align: left; margin-left: 10px; } .infoWrap .infoLoc + .infoLoc h5:before { right: inherit; left: 0; width: 85px } .copyrights { margin-right: 0px; display: block; text-align: center; } .social {text-align: center;padding-top: 20px;} .social a:last-child { margin: 0px; } .bannerInner.webcms h2 {font-size: 35px;} .bannerInner.webcms p { padding-right: 0; } .border-btn { margin: 0px; padding: 10px 30px; } .yellow-btn {padding: 10px 30px; font-size: 18px; } .NoBgImg {height: 700px; } .rowProduct {flex-direction: column;} .rowProduct .leftSec, .rowProduct .rightSec { width: 100%; padding: 20px; min-height: inherit; } .rowProduct .leftSec h3 {font-size: 30px;margin: 0 0 20px 0;} .rowProduct .BlueformSec {padding: 0;} .CheckBoxes {margin: 0 0 20px 0;} .productFormBg form.AnimationForm .field, .productFormBg form.AnimationForm .field:nth-child(odd) {margin-right: 0px;width: calc(100% - 0px ); } .rowProduct .rightSec form.AnimationForm { width: 100%; } .productFormBg form.AnimationForm .field input[type="submit"] {max-width: 50%; margin: 0 auto;} .leftNav {margin-left: 20px; } .BanBotNav > div:first-child:before {right: -10px; top: 10px;} .BanBotNav > div:nth-child(2) {padding-right: 20px;} .TwoHalfTxt {padding: 25px; } .TwoHalfTxt ul li:first-child {padding-right: 30px; } .cs h3 {font-size: 25px;margin: 0px 0 10px; padding-bottom: 25px; } .Clrpalette { margin-bottom: 40px; width: 60px;height: 60px; } .Clrpalette i {width: 100%; height: 100%; border-width: 20px;} .Clrpalette p { padding-top: 5px; } .Clrpalette + .Clrpalette {margin-left: 20px; } /*.Clrpalette:nth-child(even) { margin-left: 20px; }*/ .projectDtl {padding-top: 0;padding-bottom: 0; } .bannerInner h2 br, .bannerInner.dark-txt h2 {font-size: 32px;margin-bottom: 25px;} .bannerInner.dark-txt p {padding-right: 0;margin-bottom: 20px; font-size: 20px;line-height: 30px;} .bannerInner.dark-txt .catBanHead {font-size: 40px; } .dm-ban-bot {padding: 50px 0;} .dm-ban-bot h3 {font-size: 40px;margin: 0 0 30px 0;} .delivered-txt-main {display: contents; flex-wrap: wrap;} .delivered-txt-main .delivered-left {padding-left: 20px;} .delivered-txt-main .delivered-img {width: 100%; padding: 20px;margin-top: 0;} .delivered-txt-main .delivered-img img {margin: 0px auto;} .delivered-txt-main .delivered-right {padding-right: 0px; padding-left: 20px;} .dm-google-area p { margin: 0px 0 20px 0; } .dm-ban-bot .text-center p { padding-top: 30px; } .dm-boxes-main ul.dm-boxes { flex-wrap: wrap;} .dm-boxes-main ul.dm-boxes li {width: calc(50% - 20px); margin: 10px; } .dm-boxes-main ul.dm-boxes li h3 { font-size: 30px; margin: 0px 20px 15px 0; } .dm-boxes-main ul.dm-boxes li p {font-size: 20px; line-height: 30px; } .chart-area-main { background-position: -300px bottom, left bottom; } .dm-google-area {margin: 40px 0 0px;} .dm-g-client-img {margin-bottom: 0px; } .dm-g-client-img img { margin: 0px auto; } .dm-google-area .google-img {position: relative;left: 0;bottom: 0;margin-bottom: 15px;} .blue-ban-bg form.AnimationForm .col {flex: 0 0 50%;} .blue-ban-bg form.AnimationForm .col:nth-last-child(1) { flex: 0 0 100%; } .blue-ban-bg form.AnimationForm .field input[type="submit"] {width: 280px;display: block;margin: 20px auto 0; } .blue-ban-bg form.AnimationForm .field {margin-bottom: 25px;} .center-head-txt p {max-width: 100%} .WhatweDo-Services ul li i {width: 40px;height: 40px; top: 15px; left: -10px;} .WhatweDo-Services ul li {padding: 10px 5px 5px 40px;} .WhatweDo-Services ul li:nth-child(even) { padding-left: 40px; } .WhatweDo-Services ul li:nth-child(even) i {left: 0px; } .WhatweDo-Services ul li h4 {font-size: 22px;margin: 0px 0 10px 0;} .yellow-cta h3 {font-size: 26px;} .yellow-cta a {padding: 10px 30px;font-size: 20px;} .industrie-list ul li {width: calc(30% - 5px);margin-bottom: 15px;min-height: inherit;} .morelogo {background-position: -250px center;} .select_mate select { z-index: 1; width: 100%; } .secStudies .csArea [class^="col-"]:nth-child(n+3) .csWrap, .secStudies .csArea [class*=" col-"]:nth-child(n+3) .csWrap { border-top: none; padding-top: 0; } .moreweb {background-position: -350px center;} .seemoreweb .bannerInner.dark-txt p {padding-right: 0; } .graph-bg {min-height: inherit; padding: 50px 0; } .sahelingo-blue-bg {height: 700px; padding: 30px 0 0 0; } .stationary-main ul { flex-wrap: wrap;} .stationary-main ul li, .stationary-main ul li:last-child { width: calc(50% - 30px);margin: 15px; } .letterhead-main {margin: -250px 0 0 0; } .stationary-main ul li:last-child img { margin: 0px auto; } .letterhead-main span { margin: 30px 0; } .construction-color ul li {padding: 0 0 35px 50px;} .construction-color ul li + li { border: 0px; } .padTop120 {padding-top: 30px;} /*----home slider----*/ .rev_slider { display: none !important; } .HomeMobileSlider { display: block; height: 700px; } .HomeMobileSlider .slick-track, .HomeMobileSlider .slick-list { height: 700px !important; } .mobile-slides { height: 700px !important; background-position: center top; } .mobile-slides>div { padding: 0 50px; width: 100%; } /*----home slider----*/ .testi-sec .center-head-txt p { max-width: 80%; } .testi-sec { padding: 0px 0px;} .texti-box {margin-top: 0px; padding: 20px 50px; } .testi-sec .border-left { border-left: 0px !important; border-top: 0; } ul.testi-logo-new {flex-wrap: wrap;max-width: 100%; margin: 20px auto; } ul.testi-logo-new li { width: 33.333%; height: 140px;} .topBlueForm h3 { font-size: 24px; } .iosBodyImg .row { min-height: inherit; } .iosBodyImg h3 {font-size: 35px;margin: 30px 0; max-width: 100%;} .iosBodyImg p {font-size: 16px;width: 100%;line-height: 26px; } .iosBodyImg ul li {font-size: 19px;padding: 0 0px 0 80px;margin: 0 0 45px 0;line-height: 24px;width: 100%; } .yeloForm {padding: 30px 0 40px; } .yeloForm .row {min-height: 180px;display: block;} .yeloForm .row .col {margin-top: 30px; padding-top: 30px;} .blue-cta ul li { font-size: 25px;] } .blue-cta ul li:first-child { padding: 0 20px 0 0;} .blue-cta ul li:nth-child(2) { margin: 0 20px; } .blue-cta ul li a.estimateBtn { height: 50px; line-height: 50px; font-size: 18px;padding: 0px 20px; } .blue-cta ul li:last-child {padding: 0 0 0 20px;} .techonologyBg .row {padding: 20px 0;} .techonologyBg img { margin: 20px auto 0;} .aboutBnr h3 {font-size: 40px; line-height: 60px;} .arondSec h3 { font-size: 35px; padding: 70px 0 0 0;} .arondSec p { padding: 30px 0; } .about-values h3 { font-size: 35px;} .about-values ul li, .about-values ul li:nth-child(even) { padding-left: 0px; margin-bottom: 20px; } .about-services h3 { font-size: 35px; padding: 0px; } .about-services ul li:first-child { padding-left: 0;} .about-services ul li a { font-size: 16px; } .about-values {padding: 30px 0 20px; } .about-services { padding: 30px 0 20px; } #bannerfront {min-height: inherit; } .blue-cta ul li i, .mobileHide, .footer h4, .footer .infoWrap p, .footer .infoWrap a, .terms, .topBlueForm p br, .structureBg, .arondSec h3:before { display: none; } .howWorkBox h5 { font-size: 20px; } .thumbList { margin-top: -120px; } .bannerInner.dark-txt.logoDesignNew .slick-initialized .slick-slide .row .col-12 + .col-12 { height: 300px; overflow: hidden; overflow-y: scroll; } .item.thumb.slick-slide img { width: 70%; } .thumbList .slick-slider .slick-next { right: 0px; } .bannerInner.dark-txt.logoDesignNew { align-items: inherit; padding: 100px 0 50px 0px; } .BranIdenti .identiTxt h3, .BranIdenti .identiTxt .slideHead { font-size: 38px; } .BranIdenti .identiTxt p { font-size: 20px; line-height: 32px; } .BranIdenti .identiTxt h3, .BranIdenti .identiTxt .slideHead { font-size: 38px; } .BranIdenti .identiTxt p { font-size: 20px; line-height: 32px; } #shots .shot { width: 33%;} #shots .shot .title { font-size: 16px; } .estateDesign .estateBodyTxt { max-width: 100%; } .categoryBanImg-Tab { padding-top: 150px;; } .bodyImg { text-align: center; padding-top: 50px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead { font-size: 35px; } .bannerInner.dark-txt.logoDesignNew .yellow-btn { padding: 0 25px; } .BranIdenti .identiTxt ul li i { margin-right: 10px; } .BranIdenti .identiTxt ul li { color: #565656; font-size: 18px; } .linkSec { min-height: inherit !important; height: auto !important; } .portfolioSec.logoDesignNewDribble .portfolio-desc { max-width: 100%; } } @media (max-width: 767px) { html { margin-bottom: 0px; } body {margin-bottom: 300px;} .bannerfront h2 {font-size: 32px; line-height: 50px;} /*------------Home Banner Slider Responsive------------*/ .tp-caption.tp-h2 span.blue-bg:after { display: none; } .rev_slider .tp-mask-wrap .tp-caption, .rev_slider .tp-mask-wrap :last-child {font-size: 17px !important; left: 20px;} .rev_slider .tp-mask-wrap :last-child {padding: 0px 10px 0 10px !important; } .tp-parallax-wrap #slide-2938-layer-7_5384 {top: 120px !important;} /*------------Home Banner Slider Responsive------------*/ .secSvcfront {padding: 50px 0;} .secSvcfront h2 { font-size: 30px; line-height: 35px; margin-bottom: 20px; } .secSvcfront p { margin: 0 0 50px; } .secSvcfront .svcCol.svcLeft, .secSvcfront .svcCol.svcRight {width: 100%; margin-bottom: 20px; } .secSvcfront .svcBox.svcRed {height: 220px;} .secSvcfront .svcUp{ padding: 0px; height: auto; margin-bottom: 15px; } .secSvcfront .svcDown { padding: 0 15px; height: auto; margin-bottom: 15px; } .secSvcfront .svcBox.svcYellow, .secSvcfront .svcBox.svcGreen, .secSvcfront .svcBox.svcPurple {margin: 0;width: 100%; height: 220px; margin-bottom: 15px;} .secSvcfront .svcBox.svcBlue { height: 220px; } .secPfolio .colPf {width: 100%; margin: 0 15px; } .secSvcfront .button { padding: 10px 20px; font-size: 20px; } .secSvcfront .svcWrapper { height: auto; margin: 0 15px; } .secSvcfront .svcBox.svcBlue img { top: -10px;right: -180px;} .secSvcfront .svcBox.svcYellow img { top: -40px;left: -95px;width: 180%;} .divTestimonials { padding: 10px; background: none; margin-bottom: 20px;} .secTestimonials {padding: 30px 0;} .testiLogo { margin: 0; } .rowEstimate { display: block;} .secEstimate .getEst {display: block;width: 100%;min-height: inherit;} .secEstimate .getContact h2 {font-size: 30px;line-height: 35px;margin: 0 0 20px;} .secEstimate .colEstimate {padding: 30px;} .colEstimate {width: 100%;min-height: inherit;} form.AnimationForm .field, .blue-ban-bg form.AnimationForm .field {margin-bottom: 20px;float: none;width: 100%;} .secEstimate .getContact .field:nth-last-child(1) {padding-right: 0; margin-bottom: 0; margin-top: 40px;} form.AnimationForm .field fieldset.active {top: -8px;} .secEstimate .field input[type="submit"] {float: none; display: block; margin: 0px auto;} .secEstimate .getEst h2 {font-size: 30px;line-height: 35px;margin: 0 0 35px;} form.AnimationForm .field:nth-last-child(2):before {width: calc(100% - 0px ); } form.AnimationForm .field:before, .secEstimate .getContact:hover .field:before, .secEstimate .getContact:hover .field:nth-last-child(2):before {width: 100%;} .slick-slider .slick-next {right: 20px;} .slick-slider .slick-prev { left: 20px; } .slick-slider .slick-prev, .slick-slider .slick-next { top: 50px; bottom: inherit;} .secPfolio .pfsmall, .secPfolio .pflarge {height: 315px; margin: 0px 0 20px; } .secPfolio .pfsmall { height: 250px; } .secPfolio .rowPf {/*height: 1880px;*/ height: auto;} .secSvcfront .svcBox { box-shadow: none; } .Mobilelogo { display: block; margin: 20px auto 10px; max-width: 60px; } .Mobilelogo .mid {fill: #FFFFFF;} .Mobilelogo .out, .Mobilelogo .in { fill: #717171;} .Mobilelogo:hover .out { fill: #2A3943;} .Mobilelogo:hover .in { fill: #28ABE2;} .footer nav ul li { display: inline-block;} .footer nav ul li+li {margin-top: 10px; margin-left: 22px;} .footer { padding: 30px 0; } .footer h4 {font-size: 20px;line-height: 28px;max-width: inherit;} .footer nav, .footer .infoWrap { display: block;} .footer nav ul {width: 100%; text-align: center;} .footer h5 {margin: 10px 0 0 0; font-size: 16px; font-weight: 700; position: relative;} .footer h5:before { width: 65px; height: 2px; background-color: #4e4e4e; position: absolute;; right: 0px; bottom: -5px; content: ''; } .footer .infoWrap p { margin: 0px; } .infoWrap .infoLoc {float: left;width: calc(50% - 16px); text-align: right; margin-right: 10px;} .infoWrap .infoLoc + .infoLoc { text-align: left; margin-left: 10px; } .infoWrap .infoLoc + .infoLoc h5:before { right: inherit; left: 0; width: 85px } .copyrights { margin-right: 0px; display: block; text-align: center; } .social {text-align: center;padding-top: 20px;} .social a:last-child { margin: 0px; } header {padding: 35px 10px 30px 25px} header .button.EstimateModal { display: none; } .nav-tgl, body.HeaderFixed .nav-tgl {top: 8px;} body.HeaderFixed header {transform: translate(0, 0px); padding: 35px 10px 30px 25px;} .navFp ul { height: 230px; } body.MenuActive .navFp > ul li ul {height: 245px;} .navFp ul li a, .navFp ul li ul li a {line-height: 50px;font-size: 32px;} .navFp ul li:last-child a {line-height: 50px;font-size: 25px;} .navFp ul li a:hover:after {height: 15px;bottom: -10px;} .navFp ul li:last-child a { margin: 0px;} .navFp ul li:last-child {font-size: 22px; } .BanBotNav { flex-direction: column; } .BanBotNav > div:first-child {max-width: 100%;} .leftNav {max-width: inherit;margin: 0 30px 30px;} .cs p {font-size: 18px; line-height: 28px; } .TwoHalfImg ul { flex-direction: column;} .CntrFul {width: inherit;position: relative;margin: 0 15px 15px; } .TwoHalfImg ul li {margin: 0 15px 15px; } .TwoHalfImg ul li:nth-last-child(1) { margin-bottom: 0px; } .TwoHalfTxt {padding: 15px;} .TwoHalfTxt ul {flex-direction: column;} .TwoHalfTxt ul li:first-child {padding-right: 0; margin-bottom: 40px;} .cs h3 {font-size: 25px;margin: 10px 0 20px; padding-bottom: 0px;} .projectDtl {padding-top: 25px;padding-bottom: 20px;} .yellow-strip { min-height: 220px;} .yellow-strip h2 {font-size: 30px;margin: 0px 0 30px;} .yellow-strip a {width: 190px; height: 50px;} .bannerInner.webcms h2 {font-size: 30px;margin-bottom: 15px;} .bannerInner.webcms h2 br { display: none; } .bannerInner.webcms p {font-size: 22px;line-height: 30px;padding-right: 0;margin-bottom: 30px;} .border-btn, .yellow-btn, .morelogo .yellow-btn, .morelogo .border-btn {font-size: 16px;margin-right: 0;display: block;width: 250px;margin: 0 auto 15px;padding: 10px 0; text-align: center;} .bannerInner.dark-txt.logoDesignNew .yellow-btn { padding: 0px 20px; width: 100%; } .morelogo .border-btn, .border-btn { margin-bottom: 0px; } section .headBox h2 {font-size: 28px;line-height: 35px;} section .headBox {margin: 0 0 30px; text-align: center; } .secFaq {padding: 30px 0;} section .headBox p { font-size: 18px; text-align: center; } .secFaq .faqArea h3 {font-size: 22px;margin: 0 0px 20px 0;} .secFaq .faqArea h3 span { display: inline-block; } .secFaq .ans {margin: 0px; font-size: 16px; line-height: 24px;} .secFaq .faq {padding: 7px 0;} .secFaq .faqArea+.faqArea {margin-top: 30px;} .rowProduct {flex-direction: column;} .rowProduct .leftSec, .rowProduct .rightSec { width: 100%; padding: 20px; min-height: inherit; } .rowProduct .leftSec { text-align: center; } .rowProduct .leftSec h3 {font-size: 25px;margin: 0 0 20px 0;} .rowProduct .BlueformSec {padding: 0;} .CheckBoxes {margin: 0 0 20px 0;} .plan label, .plan label:last-child {display: block;padding-top: 0;max-width: 250px; margin: 0 auto 15px;} .productFormBg form.AnimationForm .field, .productFormBg form.AnimationForm .field:nth-child(odd) {margin-right: 0px;width: calc(100% - 0px ); } .customCheckBox + .customCheckBox {padding-left: 20px; font-size: 15px;margin-left: 5px;} .rowProduct .rightSec form.AnimationForm { width: 100%; } .box-txt {padding-left: 0px; text-align: center; width: 100%; } .box-txt h3 { font-size: 25px; font-weight: 700;} .whtiebg { text-align: center; padding: 40px 0 30px;} .whtiebg .border-btn {font-size: 20px;padding: 15px 30px;} header.whitehead {padding: 35px 10px 30px 25px;transform: translate(0, 0px);} .menu.whiteMenu .nav-tgl {top: 12px;} .Clrpalette {width: 70px;height: 70px;display: inline-block; float: none; } .Clrpalette i { width: 70px; height: 70px; border-width: 20px; } .Clrpalette + .Clrpalette {margin-left: 15px; } .Clrpalette p { padding-top: 15px; } .bannerInner h2, .bannerInner.dark-txt h2 {font-size: 30px; margin-bottom: 15px; } .bannerInner.dark-txt .catBanHead {font-size: 30px; margin: 0 0 20px 0; text-align: center; } .leftNav ul li+li {padding: 10px 0;} .BanBotNav > div:nth-child(2) {padding-right: 20px; } .BannerHalfSlider {margin-top: 15px; } .RadioBox {margin-bottom: 20px; } .bannerInner.dark-txt p {font-size: 22px;line-height: 30px;padding-right: 0;margin-bottom: 20px; text-align: center; } .bannerInner.dark-txt p br {display: none; } .dm-ban-bot h3 {font-size: 30px; margin-bottom: 20px; } .dm-ban-bot {padding: 20px 0; text-align: center; } .delivered-txt-main {display: contents;flex-wrap: wrap; } .delivered-txt-main .delivered-left { padding-left: 0px; } .dm-ban-bot p {font-size: 20px;padding: 0 20px;line-height: 30px;} .delivered-txt-main .delivered-img {width: 60%;margin: 20px auto 0;padding: 0;} .delivered-txt-main .delivered-right { padding-right: 0px; padding-top: 20px; } /* .dm-ban-bot .text-center { text-align: left !important; } */ .dm-ban-bot .text-center p { padding: 0px; } .dm-boxes-main ul.dm-boxes {display: contents;flex-wrap: wrap; } .dm-boxes-main ul.dm-boxes li {max-width: 100%;width:100%; height: auto; padding: 25px 15px 220px 15px;} .dm-boxes-main ul.dm-boxes li:nth-child(2) { padding-bottom: 170px; } .dm-boxes-main ul.dm-boxes li:nth-child(3) { padding-bottom: 250px; } .dm-boxes-main ul.dm-boxes li h3 {font-size: 24px;margin: 0px 0px 10px 0; text-align: center; } .software .dm-boxes-main ul.dm-boxes li h3 { margin-right: 0px; } .dm-boxes-main ul.dm-boxes li p {font-size: 18px;line-height: 25px; text-align: center; } .chart-area-main p {font-size: 20px;margin: 0px 0 0 0px;line-height: 30px;} .software .chart-area-main { background-image: none; } .software .chart-area-main p { margin: 0; line-height: 26px; font-size: 18px; } .software .dm-boxes-main ul.dm-boxes li:first-child { padding-bottom: 240px; } .software .dm-boxes-main ul.dm-boxes li:nth-child(2) { padding-bottom: 220px; } .software .dm-boxes-main ul.dm-boxes li:nth-child(3) { padding-bottom: 180px; } .software .dm-boxes-main ul.dm-boxes li:last-child {padding-bottom: 280px; } .chart-area-main { background-image: none; min-height: inherit; text-align: center; } .dm-google-area {margin: 0; text-align: center; } .dm-google-area p {font-size: 20px;line-height: 30px; margin: 0;} .dm-google-area .google-img {position: relative;left: 0;bottom: 0; max-width: 70%; margin: 20px auto;} .dm-g-client-img { margin-bottom: 20px;} .BranIdenti {margin: 0px 0 50px;} .BranIdenti .identiTxt {margin-top: 0px;} .BranIdenti .identiTxt h3 {font-size: 32px;margin: 0 0 15px;} .BranIdenti .identiTxt p {font-size: 20px;margin: 0 0 15px;line-height: 30px; padding: 0;} .portfolioSec h3 { font-size: 25px; line-height: 30px;} .portfolioSec.logoDesignNewDribble h1, .portfolioSec.logoDesignNewDribble .drilHeadBig {font-size: 35px; margin: 0 0 20px; } .portfolioSec.logoDesignNewDribble .drilHeadSml { font-size: 30px;} .portfolioSec .portfolioList ul {text-align: center;margin: 20px 0;} .portfolioSec.logoDesignNewDribble .portfolio-desc {max-width: 100%; margin-top: 10px; } .portfolioSec .portfolioList ul li {display: block;border-radius: 0;border-bottom: 1px solid #eee;} .portfolioSec .portfolio-desc {max-width: 100%;margin: 0 auto 20px; } .portfolioSec .portfolio-desc p {font-size: 17px;line-height: 24px;} .portfolioSec .portfolioList ul li:hover, .portfolioSec .portfolioList ul li.current {border: 1px solid #fecc45; } .portfolioSec .portfolio-item>div {width: 100%; height: 230px; } .typed { display: block; } .blue-ban-bg {min-height: inherit;padding: 25px 15px 15px 15px;} .blue-ban-bg h4 {font-size: 25px;font-weight: 400;padding: 0px 0 10px;} .blue-ban-bg .col { flex: 0 0 100%;} .blue-ban-bg form.AnimationForm .field input[type="submit"] { margin: 20px 0 0 0; } .center-head-txt h3 {font-size: 27px; margin: 20px 0 30px 0;} .center-head-txt p { max-width: 100%; } .WhatweDo-Services {padding: 50px 15px 15px 15px; } .WhatweDo-Services ul li {width: 100%;padding: 25px 0;border-bottom: 1px solid #eee; border-right: 0; text-align: center; } .WhatweDo-Services ul li:nth-child(even) {padding: 25px 0;} .WhatweDo-Services ul li:nth-child(even) i {left: 0px;} .WhatweDo-Services ul li i { left: 0px; top: 0px; right: 0; margin: auto; display: block; position: relative; } .yellow-cta .text { flex-wrap: wrap; } .yellow-cta h3 {font-size: 26px;} .yellow-cta a { margin: 10px 0 0 0; } .industrie-list ul li {width: calc(100% - 100px); margin-bottom: 30px; min-height: inherit; padding: 0;} /*---SUMEED POINTS STYLING---*/ .nav-tgl > span { width: 20px; } .nav-tgl > span:before, .nav-tgl > span:after { width: 30px; } .nav-tgl:hover span {width: 30px; } .nav-tgl > span:before {top: -9px; } .nav-tgl > span:after {top: 9px;} header .logo { width: 120px; } .icon-scroll {width: 30px;height: 60px; display: none; } .icon-scroll:before {width: 6px;height: 6px; } /*---SUMEED POINTS STYLING---*/ .secSvcfront .svcBox.svcRed img {top: -20px;left: -150px;max-width: 200%;} .secSvcfront .svcBox.svcBlue img {top: 25px;right: -250px;max-width: 160%;} .secSvcfront .svcBox.svcGreen img {top: 30px;left: 20px; } .secSvcfront .svcBox.svcPurple img {top: -75px;left: -105px;width: 180%;} header .logoFixed {width: 115px; height: 40px; top: -6px;} .navFp:before {clip-path: circle(30px at calc(100% - 45px) 35px);} /*Estimate Form*/ .EstimateForm.active {overflow-y: scroll; } .EstimateForm .PopupForm, .PopupInfo { padding: 20px; } .EstimateForm .EstimateInner { max-width: inherit; } .EstimateForm .PopupForm h3 {font-size: 28px; margin: 0px;} .EstimateForm .PopupForm .FormFIelds {width: 100%;} /*Estimate Form*/ /* MoreLogoes */ .morelogo { background-image: none !important; } .morelogo h3 {font-size: 25px;line-height: 35px; text-align: center; } .select_mate select { z-index: 1; width: 100%; } .requestCall { padding-bottom: 100px; } .secStudies .headBox {margin-bottom: 20px; } .secStudies .headBox h2 {font-size: 25px; margin: 0; text-align: center;} .secStudies .csArea [class^="col-"]:nth-child(n+2) .csWrap, .secStudies .csArea [class*=" col-"]:nth-child(n+2) .csWrap {border-top: none;padding-top: 0; } .secStudies .csWrap {padding-bottom: 25px; margin: 0 0 15px; text-align: center; } .secStudies .csArea {margin: 0 0 20px; } .secStudies {margin-bottom: 35px; } /* MoreLogoes */ /* MoreWebs */ .moreweb { background-image: none !important; text-align: center; } .seemoreweb .bannerInner.dark-txt p {padding-right: 0; } .secWebmore .seebox { margin: 10px 0;} .secWebmore {padding: 30px 0 20px; } .secWebmore .rowmwb {margin-bottom: 25px; } .secWebmore .seebox h3 {font-size: 18px;line-height: 25px;} .secWebmore .seebox p { font-size: 15px;} /* MoreWebs */ .lj .TwoHalfImg ul li img { max-width: 100%; } .graph-bg {min-height: inherit;padding: 50px 0; } .sahelingo-blue-bg {height: auto; padding: 20px 0 0 0; } .stationary-main ul {flex-wrap: wrap;} .stationary-main ul li, .stationary-main ul li:last-child {width: 100%; margin-bottom: 15px; } .stationary-main ul li:last-child img { margin: 0px auto; } .letterhead-main {margin: 30px 0 0 0; } .letterhead-main span {margin: 30px auto;} .construction-color ul {flex-wrap: wrap;margin-bottom: 20px; } .construction-color ul li + li {border-top: 1px solid #e9e9e9;padding-top: 15px; border-left: 0px; } .construction-color ul li { padding: 0 0 15px 0px; width: 100%; } /*------MOBILE SLIDER------*/ .HomeMobileSlider { display: block; } .DesktopSlider { display: none !important; } .HomeMobileSlider .slick-dots li+li { margin-left: 5px; } /*------MOBILE SLIDER------*/ /*------New Testimonials Section------*/ .testi-sec { padding: 0px 0px; } .testi-sec .center-head-txt p { max-width: 100%; font-size: 17px; } .texti-box { padding: 20px 00px 20px 00px;margin-top: 0; text-align: center; } .texti-box p {margin: 10px 0;font-size: 15px;line-height: 25px;} .texti-box p:before { display: none; } .texti-box .author img { float: none; } ul.testi-logo-new {flex-wrap: wrap;margin: 20px auto 30px;} ul.testi-logo-new li { width: calc(32% - 10px); height: 100px; margin: 0 5px;} /*------New Testimonials Section------*/ .topBlueForm {padding: 25px 0} .topBlueForm h3 { font-size: 25px; } .topBlueForm p {margin: 15px 0 0 0;} .iosBodyImg .row {min-height: inherit; } .iosBodyImg {padding: 20px 0; background-position: left top; text-align: center; } .iosBodyImg h3 {font-size: 25px;margin: 0 0 10px 0; max-width: 100%; } .iosBodyImg p {font-size: 18px;width: 100%; line-height: 26px; } .iosBodyImg ul li {padding: 0 0px 0 0px; line-height: 22px; width: 100%; margin: 0 0 25px 0;} .iosBodyImg ul { margin: 30px 0 0 0; } .iosBodyImg ul li i { position: relative; left: 0px; top: -6px; right: 0; margin: 0 auto 10px; display: block; width: 60px; } .yeloForm h3 { font-size: 28px;} .yeloForm .row {display: block; padding: 20px 0; } .yeloForm .row .col { width: 100%; margin-top: 30px; padding-top: 30px; } .blue-cta {padding: 25px 0; } .blue-cta ul li { font-size: 30px; } .blue-cta ul li:nth-child(2) {margin: 20px 0; } .blue-cta ul li:first-child { padding: 0 0px 0 70px; text-align: left; } .blue-cta ul li i {right: inherit;left: 0; } .blue-cta ul li a.estimateBtn { top: 0px; } .techonologyBg .row { min-height: 320px; } .techonologyBg img { margin: 20px auto 0; } .industrie-list { margin-top: 30px; } .aboutBnr h3 {font-size: 25px; line-height: 42px; text-align: center;} .aboutBnr h3 span:after { top: 3px; bottom: inherit; } .aboutBnr .mainHeadBtn { width: 260px; display: block; padding: 10px; margin: 20px auto 0; text-align: center;} .arondSec h3 { font-size: 30px; padding: 20px 0 0 0; text-align: center; } .arondSec p { padding: 10px 0 0 0px; font-size: 18px; line-height: 30px; } .about-values ul li, .about-values ul li:nth-child(even) {padding-left: 0px; margin-bottom: 30px; width: 100%; } .about-values {padding: 0px 0 20px; margin: 25px 0; } .about-values h3 { font-size: 30px; padding: 30px 0 20px;} .about-services { padding: 25px 0; text-align: center; } .about-services h3 { font-size: 30px; padding: 0px 0 20px 0; } .about-services ul li { margin-bottom: 20px; width: 100%; } .about-services ul li:first-child { padding-left: 0; margin-bottom: 0; } .about-services ul li:nth-child(2) { padding-top: 0; } .BranIdenti .corpImg {margin-top: 0; margin: 0 auto; } .BranIdenti .identiTxt ul li {margin: 0px 0 20px 0; width: 100%;} #bannerfront { min-height: auto; } .border-left { border-width: 0px !important } .BanBotNav > div:first-child:before, .mobileHide, .footer h4, .footer .infoWrap p, .footer .infoWrap a, .terms, .bannerInner h2 br, .bannerInner.dark-txt h2 br, .is-visible .cd-handle, .is-visible .cd-resize-img, .structureBg, .topBlueForm p br, .arondSec h3:before, .portfolioSec .portfolio-desc p br { display: none; } /*---------Industry page ----------*/ .bannerInner { height: auto; padding-top: 85px; padding-bottom: 20px; } .rowRev .row {-ms-flex-direction: row-reverse; flex-direction: row-reverse; } .realStateban ul li:before {background-size: cover; width: 20px; height: 20px; } .realStateban ul li {font-size: 20px; line-height: 40px; } .estateDesign {padding: 30px 0; } .estateDesign .estateBodyTxt {padding: 0 15px; } .estateDesign .estateBodyTxt h3, .estateDesign .estateBodyTxt .rightTxtHead {font-size: 26px; margin: 0 0 10px; } .estateDesign .estateBodyTxt p { font-size: 18px; margin: 0 0 20px; line-height: 28px;} .estateDesign .estateBodyTxt h6, .estateDesign .estateBodyTxt .rightTxtSubHead { font-size: 18px; } .centerBtn {padding: 40px 0px; margin-bottom: 30px; } .howWorkBox {margin: 20px 0; } .howWorkBox h5 {font-size: 22px; } .howWorkBox p {font-size: 18px; line-height: 26px; } .logoIndustry {padding: 30px 0px; } .logoIndustry h2 {font-size: 32px; } .logoIndustry .industryList { margin-top: 20px; } .logoIndustry .industryList ul li {width: 100%; padding: 0 0px 0 0; font-size: 18px; line-height: 40px; margin: 0px; border-bottom: 1px solid #e7e7e7; } .indusLogoSec [class*="col-"] {padding-left: 15px; padding-right: 15px; } .indusLogoSec .slick-dots { margin-top: 10px; } .indusLogoSec .slick-dots li+li {margin-left: 8px; } .indusLogoSec .slick-dots li.slick-active button {background-color: #293a43; } .caption.realStateban {margin-top: 20px; } .hide-more3 { display: none;} .industryList .show-button {display: block; } .howWorkBox i {margin-bottom: 20px; } /*---------Industry page ----------*/ .BranIdenti .identiTxt.text-center {margin-top: 0px; } .BranIdenti .identiTxt h3, .BranIdenti .identiTxt .slideHead { font-size: 30px; margin: 0 0 15px; } .termsTxt { margin: 100px 0 50px; } .termsTxt h2 {font-size: 28px; line-height: normal;} .termsTxt h5 {font-size: 20px; } .termsTxt p { font-size: 17px; line-height: 25px; margin: 0 0 20px; } .termsTxt ul li {font-size: 18px; line-height: 26px; margin: 0 0 10px 25px; } .orgazinixBorSec .TwoHalfTxt ul li { padding-left: 0px; } .orgazinixBorSec .TwoHalfTxt ul.cbdImgSec { padding: 0px; } .organizix-GrnImg { padding-top: 20px; } .organizix-RImg-LTxt .TwoHalfImg ul li {width: 100%; margin: 15px 0px; } .organizixTxtSec .TwoHalfTxt ul.cbdImgSec {padding: 0; } .bannerInner.dark-txt.logoDesignNew { padding: 100px 0 0 0px; } .thumbList { margin: 0px; position: absolute; left: 0; top: 0; right: 0; width: 100%; } .logoDesignNew .slick-slider.slider-for .item { padding-top: 220px; } .thumbList .slick-slider .slick-prev { display: block !important; right: inherit; left: 0px; top: 0; bottom: 0; border: 0px; background: url(../images/real-estate/arrow-icon.png) left top no-repeat; background-size: cover; width: 28px; height: 28px; opacity: 1; transform: rotate(180deg);} .thumbList .slick-slider .slick-prev:before { font-size: 0px; } .thumbList .slick-slider .slick-next { right: 0px; } .newPortfolio.logoDesignNewPortfolio .columCenter { flex: 0 0 100%; max-width: 100%; } .item.thumb.slick-slide img { width: 55%; } .bannerInner h2, .bannerInner.dark-txt.logoDesignNew h2 { margin-top: 20px; } /* .bannerInner.dark-txt.logoDesignNew .slick-initialized .slick-slide .row .col-12 + .col-12 { height: 300px; overflow: hidden; overflow-y: scroll; } */ #shots { height: 100%;} #shots .shot {width: 50%; } #shots .shot .title { font-size: 16px; } .secFaq .faqHead { font-size: 26px; line-height: 34px; } h1.sliderHead, h3.sliderHead { margin-top: 25px; } .row.mobColRev { flex-direction: column-reverse; } .bannerInner.dark-txt.logoDesignNew .BannerHalfSlider { /*margin: 50px 0px 0 0px;*/ margin: 0px; } .BannerHalfSlider ul.slick-dots { text-align: center; padding-left: 0; } .BranIdenti .identiTxt ul li i { margin-right: 15px; max-width: 35px; } .BranIdenti .identiTxt ul li { font-size: 18px; } .portfolioSec .portfolio-item>div { margin-top: 20px; } .linkSec { min-height: inherit !important; height: auto !important; padding-bottom: 25px !important; } .portfolioSec.logoDesignNewDribble { padding: 35px 0 0; } .bannerInner.dark-txt.logoDesignNew .caption h1 { margin-top: 20px; text-align: center; } .bannerInner.dark-txt.logoDesignNew p { text-align: center; } .bannerInner.dark-txt.logoDesignNew p strong { margin-top: 15px; } .portfolioSec .portfolio-desc { margin: 25px auto 20px; } .bannerInner.dark-txt.logoDesignNew .yellow-btn { margin-bottom: 35px; } .secSvcfront h5 { font-weight: 600; } .HomeMobileSlider .slick-dots { margin-top: -50px; } .arondSec, .about-values { text-align: center; } .about-values ul li img {margin: auto;} #fullpage, .iosBodyImg img.hand-right { display: none; } .secEstimate .getEst .innerWrap { text-align: center; } .contactInfo { padding: 30px 0 0 0px; } .contactFormMain .field input[type="submit"] { margin: auto; float: none; } } @media (max-width: 360px) { .Clrpalette {width: 60px;height: 60px;} .Clrpalette i {width: 60px;height: 60px;} } @media (max-width: 320px) { .footer nav ul li+li {margin-left: 8px;} .software .dm-boxes-main ul.dm-boxes li:first-child { padding-bottom: 180px; } .software .dm-boxes-main ul.dm-boxes li:nth-child(2) { padding-bottom: 170px; } .software .dm-boxes-main ul.dm-boxes li:nth-child(3) { padding-bottom: 160px; } .software .dm-boxes-main ul.dm-boxes li:last-child {padding-bottom: 220px; } .secSvcfront .svcBox.svcRed img { top: 10px; } .mobile-slides h3 { font-size: 25px; line-height: 40px; } .slidHead {font-size: 35px;} } /* Landscape */ @media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {}