@charset "UTF-8"; html. ovh,html.ovh body{overflow-x:hidden!important; overflow-y:hidden!important} .txt-single-content a:hover,u{ text-decoration:underline} article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,svg{ display:block;} a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption, center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer, form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav, object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table, tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{ margin:0; padding:0; border:0; font:inherit; vertical-align:baseline} ol,ul{ list-style:none} blockquote,q{quotes:none} blockquote:after,blockquote:before,q:after,q:before{ content:''; content:none} table{border-collapse:collapse; border-spacing:0} *{box-sizing:border-box} html.ovh body{position:relative; height:100vh; -webkit-overflow-scrolling:touch} body{line-height:1; font-family:futura-pt,sans-serif;font-size:100%; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; overflow-x:hidden;background:#e9e9e9} a{text-decoration:none; color:#82bc00; transition:color .3s} a:focus,button:focus,input:focus,select:focus,textarea:focus{outline:0} sup{vertical-align:top;font-size:smaller} .btn-back span,.btn-default{font-size:13px; text-transform:uppercase} strong{font-weight:600} i{font-style:italic} textarea{resize:none} button{ border:0;padding: 0;background:0 0; cursor:pointer} @media only screen and (max-device-width:1024px) {input,textarea{ border-radius:0}} .column.column-left{ transition:width .6s 1.2s ease-in-out} .column.column-left section.home .txt-wrap h2{opacity:0; visibility:hidden; margin-left:-30px; transition:opacity 1s .3s,visibility 1s .3s} .column.column-left footer,.column.column-left section.home .txt-wrap p{ transition:opacity 1s .5s,visibility 1s .5s;opacity:0; visibility:hidden} .column.column-left section.home .txt-wrap p{ margin-left:-30px} .column.column-right nav.right-nav>ul li{ transition:opacity 1.5s,visibility 1.5s; opacity:0; visibility:hidden} .column.column-right nav.right-nav>ul li:first-child,.column.column-right nav.right-nav>ul li:nth-child(2){ transition-delay:2s} .column.column-right nav.right-nav>ul li:nth-child(3),.column.column-right nav.right-nav>ul li:nth-child(4){ transition-delay:2.1s} .column.column-right nav.right-nav>ul li:nth-child(5),.column.column-right nav.right-nav>ul li:nth-child(6){ transition-delay:2.2s} body.action .loading{opacity:0; visibility:hidden} body.action .column.column-left{ width:47%} body.action .column.column-left section.home .txt-wrap h2,body.action .column.column-left section.home .txt-wrap p{ opacity:1;visibility:visible; margin-left:0} body.action .column.column-left footer,body.action .column.column-right nav.right-nav>ul li{ opacity:1; visibility:visible} @keyframes arrow{50%{ margin-right:-15px}} .btn-back{ display:inline-block; vertical-align:middle} @media only screen and (max-width:736px){ .column.column-left footer,.column.column-right nav.right-nav>ul li{ transition:none;opacity:1;visibility:visible} .column.column-left{transition:none} .column.column-right nav.right-nav>ul li:first-child,.column.column-right nav.right-nav>ul li:nth-child(2), .column.column-right nav.right-nav>ul li:nth-child(3), .column.column-right nav.right-nav>ul li:nth-child(4), .column.column-right nav.right-nav>ul li:nth-child(5){ transition-delay:0s} body.action .loading{opacity:0; visibility:hidden} body.action .column.column-left{width:100%} body.action .column.column-right nav.right-nav>ul li{ opacity:1; visibility:visible} .btn-back{display:table; margin-bottom:24px}} .btn-back .arrow,.btn-back .arrow>svg,.btn-back span{ display:inline-block} .btn-back .arrow>svg{vertical-align:middle; fill:#82bc00; width:10px;height:18px; transition:fill .3s} .btn-back .arrow:after{ content:''; display:inline-block; vertical-align:middle; width:34px; height:2px; background:#82bc00; margin:0 15px 0 -7px; transition:background .3s} .btn-back span{vertical-align:middle; transition:color .3s; color:#82bc00; font-weight:700} .btn-back:hover .arrow>svg{fill:#ffffff} .btn-back:hover .arrow:after{background:#ffffff} .btn-back:hover span{color:#fff} @media only screen and (min-width:768px) and (max-width:1024px){ .txt-wrap .btn-back{display:none}} .btn-default{display:block; width:171px; height:46px; border:2px solid #82bc00; border-radius:25px; transition:border-color .3s,color .3s; line-height:44px; font-weight:700;text-align:center} .btn-default.type-contact{color:#fff} .btn-default.type-contact:hover{border-color:#fff; color:#82bc00} .btn-default.type-send{color:#000} .btn-default.type-send:hover{border-color:#000; color:#82bc00} nav.left-nav{top:50%; position:fixed; z-index:10; -ms-transform:translate(-100%,-50%); transform:translate(-100%,-50%); transition:transform .8s .2s} nav.left-nav ul li{margin-bottom:60px} nav.left-nav ul li:last-child{margin-bottom:0} nav.left-nav ul li a{position:relative; margin-left:50px; transition:all .3s;color:#82bc00; font-size:14px; font-weight:700; text-transform:uppercase} @media not screen and (max-device-width:1024px){ nav.left-nav ul li a:hover{color:#ffffff;} nav.left-nav ul li a:hover:before{ background:#82bc00; margin-right:15px}} nav.left-nav ul li a.active{ color:#ffffff} nav.left-nav ul li a.active:before{ background:#82bc00; margin-right:15px} nav.left-nav ul li a:before{ content:''; position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); right:100%; width:200px; height:1px; background:#ffffff; margin-right:30px; transition:all .3s} @media only screen and (max-width:1440px){ nav.left-nav ul li{ margin-bottom:40px}} @media only screen and (min-width:768px) and (max-width:1024px){nav.left-nav ul li a{margin-left:25px}} @media only screen and (max-width:736px){nav.left-nav{ position:fixed; top:0; left:0; width:100vw; height:100vh; -ms-transform:none; transform:none; opacity:0; visibility:hidden; transition:all .6s; pointer-events:none} nav.left-nav ul{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); pointer-events:auto} nav.left-nav ul li{ margin-bottom:35px} nav.left-nav ul li a{ display:table; background:0 0; border-radius:5px; padding:5px 10px; margin:0 auto; transition:all .3s;color:#000;font-size:16px; text-align:center} nav.left-nav ul li a.active{ color:#000; background:#fff} nav.left-nav ul li a:before{content:none}} ul.flipping-cards{height:100%} ul.flipping-cards li.flipping-card{ position:relative; display:inline-block; width:calc(50% - 28px); height:calc(50% - 28px); margin:13px} ul.flipping-cards li.flipping-card>a{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:5; text-indent:-9999px } @media not screen and (max-device-width:1024px){ ul.flipping-cards li.flipping-card>a:hover~.front{ z-index:0; transform:rotateY(180deg)} ul.flipping-cards li.flipping-card>a:hover~.back{ transform:rotateY(0)}} ul.flipping-cards li.flipping-card>div{ width:100%; height:100%; transition:all .7s; -webkit-backface-visibility:hidden; backface-visibility:hidden} ul.flipping-cards li.flipping-card .front{ border-radius:5px; overflow:hidden; z-index:3} ul.flipping-cards li.flipping-card .front figure{ display:block; position:relative; width:100%; height:100%} ul.flipping-cards li.flipping-card .front figure img{ display:block; width:100%; height:100%; object-fit:cover} ul.flipping-cards li.flipping-card .front figure figcaption{ position:absolute; top:15px; left:0; z-index:1} ul.flipping-cards li.flipping-card .front figure figcaption p{ height:inherit; border-radius:0 15px 16px 0; background:#82bc00; padding:0 20px; color:#ffffff; font-size:16px; line-height:31px; font-weight:700; text-transform:uppercase; text-align:center; letter-spacing:1.3px} @media only screen and (max-width:1280px){ul.flipping-cards li.flipping-card .front figure figcaption p{ font-size:1vw}} ul.flipping-cards li.flipping-card .back{ position:absolute; top:0; left:0; transform:rotateY(180deg); z-index:1} ul.flipping-cards li.flipping-card .back .top{position:relative;height:89%; background:#fff; border-top-right-radius:5px; border-top-left-radius:5px} ul.flipping-cards li.flipping-card .back .top .top-wrap{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); width:100%} ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap{position:relative; display:table; width:59px; height:59px; margin:0 auto} ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap .circle{width:40px; height:40px; background:#82bc00; border-radius:50%} ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap>svg{ position:absolute; top:10px;left:10px; fill:#000; width:49px; height:49px} ul.flipping-cards li.flipping-card .back .top .top-wrap h4{margin:10px 0; color:#000; font-size:16px; font-weight:700; text-align:center; text-transform:uppercase} ul.flipping-cards li.flipping-card .back .top .top-wrap p{ margin:0 auto; padding:0 45px; line-height:25px; font-weight:300; text-align:center} ul.flipping-cards li.flipping-card .back .bottom{position:relative; height:11%; background:#82bc00; border-bottom-right-radius:5px; border-bottom-left-radius:5px; overflow:hidden} ul.flipping-cards li.flipping-card .back .bottom .arrow{position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); right:64%;transition:all .3s; z-index:5} ul.flipping-cards li.flipping-card .back .bottom .arrow:before{content:''; position:absolute; top:8px; right:2px; width:100vw; height:2px; background:#fff; transition:all .3s;z-index:-1} ul.flipping-cards li.flipping-card .back .bottom .arrow>svg{fill:#fff;width:10px; height:18px; transition:all .3s} @media only screen and (max-width:1024px){ul.flipping-cards{height:auto} ul.flipping-cards li.flipping-card{width:100%;height:inherit;margin:0 0 12px} ul.flipping-cards li.flipping-card .front{display:none} ul.flipping-cards li.flipping-card .back{position:relative; top:initial; left:initial; -ms-transform:none; transform:none} ul.flipping-cards li.flipping-card .back .top{height:246px} ul.flipping-cards li.flipping-card .back .top .top-wrap h4{margin:15px 0 10px; font-size:13px} ul.flipping-cards li.flipping-card .back .top .top-wrap p{padding:0 40px;font-size:14px;line-height:20px} ul.flipping-cards li.flipping-card .back .bottom{ height:48px; transition:none} ul.flipping-cards li.flipping-card .back .bottom:after{content:none} ul.flipping-cards li.flipping-card .back .bottom .arrow{right:65%; transition:none} ul.flipping-cards li.flipping-card .back .bottom .arrow:before,ul.flipping-cards li.flipping-card .back .bottom .arrow>svg{transition:none}} ul.cases-list:after{content:''; display:block; clear:both; width:100%} ul.cases-list li.case-card{position:relative; float:left; width:50%; height:50vh; overflow:hidden} ul.cases-list li.case-card:nth-child(3n+1){width:100%} ul.cases-list li.case-card>a{position:absolute; top:0; left:0; width:100%; height:100%; z-index:10; text-indent:-9999px} @media not screen and (max-device-width:1024px){ul.cases-list li.case-card>a:hover~.front{opacity:0;z-index:0} ul.cases-list li.case-card>a:hover~.back{opacity:1;z-index:5}} ul.cases-list li.case-card>div{transition:all .7s} ul.cases-list li.case-card .front{height:100%;z-index:5} ul.cases-list li.case-card .front figure{display:block; width:100%; height:100%} ul.cases-list li.case-card .front figure img{display:block; width:100%; height:100%; object-fit:cover} ul.cases-list li.case-card .front figure figcaption:not(.blog-post) h4{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%)} ul.cases-list li.case-card .front figure figcaption:not(.blog-post) h4 span{display:none} ul.cases-list li.case-card .front figure figcaption:not(.blog-post) h4 img{ display:block; max-width:100%; height:auto} ul.cases-list li.case-card .front figure figcaption.blog-post{position:absolute; width:100%; left:0; bottom:0; padding:0 0 20px 40px; font-size:15px} ul.cases-list li.case-card .front figure figcaption.blog-post:before{content:''; position:absolute; bottom:0; left:0; width:100%; height:200px; background:linear-gradient(to bottom,transparent 0,rgba(0,0,0,.9) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0 )} .testimonials-list>li.big-content:after,.txt-single-content.big-content:after{ filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff', GradientType=0 )} ul.cases-list li.case-card .front figure figcaption.blog-post h4{ position:relative; z-index:5; color:#82bc00; font-weight:1000; text-transform:uppercase} ul.cases-list li.case-card .front figure figcaption.blog-post p{ position:relative;max-width:80%; margin:20px 0;z-index:5; color:#fff; line-height:1.3} ul.cases-list li.case-card .back{position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; z-index:0} ul.cases-list li.case-card .back .top{ position:relative; height:89%; background:#fff} ul.cases-list li.case-card .back .top .top-wrap{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%); width:100%} ul.cases-list li.case-card .back .top .top-wrap h4{position:relative; display:table; max-width:80%; margin:0 auto 14px;z-index:5; color:#000; font-size:22px; font-weight:700; text-align:center; text-transform:uppercase}ul.cases-list li.case-card .back .top .top-wrap h4:before{content:''; display:block; position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); left:-10px;width:40px; height:40px; border-radius:50%; background:#82bc00; z-index:-1} ul.cases-list li.case-card .back .top .top-wrap p{padding:0 65px; font-size:20px; line-height:30px; font-weight:300; text-align:center} ul.cases-list li.case-card .back .bottom{position:relative; height:11%; background:#82bc00; overflow:hidden} ul.cases-list li.case-card .back .bottom .arrow{position:absolute; top:50%; transform:translate(0,-50%);-ms-transform:translate(0,-50%); right:64%; transition:all .3s; z-index:5} ul.cases-list li.case-card .back .bottom .arrow:before{content:''; position:absolute; top:8px; right:2px;width:100vw; height:2px; background:#fff; transition:all .3s; z-index:-1} ul.cases-list li.case-card .back .bottom .arrow>svg{fill:#fff; width:10px; height:18px; transition:all .3s} @media only screen and (max-width:1024px){ul.cases-list.blog-list li.case-card{width:100%}} @media only screen and (max-width:736px){ul.cases-list li.case-card{height:inherit} ul.cases-list li.case-card .front figure figcaption h4 img{-ms-transform:scale(.6); transform:scale(.6)} ul.cases-list.blog-list li.case-card .front figure figcaption.blog-post{padding:0 20px 20px} ul.cases-list.blog-list li.case-card .front figure figcaption.blog-post p{display:none}} .column-left>section .txt-wrap{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); width:100%; max-width:50%; transition:transform .2s ease-in} .column-left>section .txt-wrap .fade-enter-active,.column-left>section .txt-wrap .fade-leave-active{transition:opacity 1.2s; position:absolute; top:0;left:0} .column-left>section .txt-wrap .fade-enter,.column-left>section .txt-wrap .fade-leave-active, .column-left>section .txt-wrap .fade-leave-to{opacity:0}.column-left>section .txt-wrap h1, .column-left>section .txt-wrap h2{margin-bottom:24px; color:#82bc00; font-size:40px; line-height:.9; font-weight:700; text-transform:uppercase} .column-left>section .txt-wrap h1 span,.column-left>section .txt-wrap h2 span{display:block; font-weight:300} .column-left>section .txt-wrap p{ max-width:450px; margin-bottom:23px; color:#fff; font-size:20px; line-height:1.3; font-weight:300} .column-left>section:not(.home)~nav.left-nav{-ms-transform:translate(0,-50%); transform:translate(0,-50%)} @media only screen and (min-width:768px) and (max-width:1024px){ .column-left>section .txt-wrap{max-width:calc(100% - 170px); margin-left:50px} .column-left>section .txt-wrap h1,.column-left>section .txt-wrap h2{margin-bottom:24px; font-size:25px;line-height:.9} .column-left>section .txt-wrap p{ max-width:100%; margin-bottom:8px; font-size:16px; line-height:1.5}} @media only screen and (max-width:736px){ .column-left>section{padding:60px 25px 45px} .column-left>section .txt-wrap{position:relative; top:initial; left:initial; width:100%; max-width:100%; -ms-transform:none; transform:none; transition:none; margin-top:65px} .column-left>section .txt-wrap h1,.column-left>section .txt-wrap h2{ margin-bottom:24px; font-size:40px; line-height:.9; overflow-wrap:break-word} .column-left>section .txt-wrap>a+h1,.column-left>section .txt-wrap>a+h2{ font-size:29px; overflow-wrap:initial} .column-left>section .txt-wrap p{max-width:100%; margin-bottom:8px; font-size:16px; line-height:1.5} .column-left>section:not(.home)~nav.left-nav{-ms-transform:none;transform:none}} .main-columns:after{content:''; display:block; clear:both; width:100%} .main-columns>.column{width:53%; height:100vh; overflow:hidden} .main-columns>.column.column-left{position:absolute; top:0; left:0; width:100%; background:#00313c; z-index:1} .main-columns>.column.column-right{float:right; position:relative; background:#e9e9e9; -webkit-overflow-scrolling:touch} .main-columns>.column.column-left>section,.main-columns>.column.column-right>section{position:absolute; top:0; left:0; width:100%; max-width:53vw; height:100%; min-height:100vh; opacity:1; transition:transform .6s ease-in-out,opacity .8s ease-in-out} .main-columns>.column.column-left>section.from-bottom-enter, .main-columns>.column.column-left>section.from-top-leave-to, .main-columns>.column.column-right>section.from-bottom-enter, .main-columns>.column.column-right>section.from-top-leave-to{-ms-transform:translate(0,100%); transform:translate(0,100%); opacity:0} .main-columns>.column.column-left>section.from-bottom-leave-to,.main-columns>.column.column-left>section.from-top-enter, .main-columns>.column.column-right>section.from-bottom-leave-to, .main-columns>.column.column-right>section.from-top-enter{-ms-transform:translate(0,-100%); transform:translate(0,-100%); opacity:0} .main-columns>.column.column-left>section.from-left-leave-to, .main-columns>.column.column-left>section.from-right-enter, .main-columns>.column.column-right>section.from-left-leave-to, .main-columns>.column.column-right>section.from-right-enter{-ms-transform:translate(100%,0); transform:translate(100%,0)} .main-columns>.column.column-left>section.from-left-enter, .main-columns>.column.column-left>section.from-right-leave-to, .main-columns>.column.column-right>section.from-left-enter, .main-columns>.column.column-right>section.from-right-leave-to{-ms-transform:translate(-100%,0); transform:translate(-100%,0)} .main-columns>.column.column-left>section.from-left-enter.blog, .main-columns>.column.column-left>section.from-left-enter.blog-post, .main-columns>.column.column-left>section.from-left-leave-to.blog-post, .main-columns>.column.column-left>section.from-right-enter.blog-post, .main-columns>.column.column-left>section.from-right-leave-to.blog, .main-columns>.column.column-left>section.from-right-leave-to.blog-post, .main-columns>.column.column-right>section.from-left-enter.blog,.main-columns>.column.column-right>section.from-left-enter.blog-post, .main-columns>.column.column-right>section.from-left-leave-to.blog-post, .main-columns>.column.column-right>section.from-right-enter.blog-post, .main-columns>.column.column-right>section.from-right-leave-to.blog, .main-columns>.column.column-right>section.from-right-leave-to.blog-post{-ms-transform:none; transform:none; transition:none} .main-columns>.column.column-left>section>p,.main-columns>.column.column-right>section>p{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); color:#fff; font-size:50px; text-transform:uppercase; font-weight:700} .main-columns>.column.column-left>section.from-left-enter .video-container, .main-columns>.column.column-left>section.from-left-leave-to .video-container, .main-columns>.column.column-left>section.from-right-enter .video-container, .main-columns>.column.column-left>section.from-right-leave-to .video-container, .main-columns>.column.column-right>section.from-left-enter .video-container, .main-columns>.column.column-right>section.from-left-leave-to .video-container, .main-columns>.column.column-right>section.from-right-enter .video-container, .main-columns>.column.column-right>section.from-right-leave-to .video-container{opacity:0; transition:opacity .6s} .main-columns.open-menu{height:100vh} @media only screen and (max-width:736px) {.main-columns{overflow:hidden}.main-columns>.column{width:100%; height:inherit; overflow:visible} .main-columns>.column.column-left{position:relative; top:initial;left:initial} .main-columns>.column.column-right{float:none}.main-columns>.column.column-left>section, .main-columns>.column.column-right>section{position:relative; top:initial; left:initial; width:100%; max-width:100%; height:auto; min-height:initial; transition:opacity .8s ease-in-out} .main-columns>.column.column-left>section.from-left-enter .video-container, .main-columns>.column.column-left>section.from-left-leave-to .video-container, .main-columns>.column.column-left>section.from-right-enter .video-container, .main-columns>.column.column-left>section.from-right-leave-to .video-container, .main-columns>.column.column-right>section.from-left-enter .video-container, .main-columns>.column.column-right>section.from-left-leave-to .video-container, .main-columns>.column.column-right>section.from-right-enter .video-container, .main-columns>.column.column-right>section.from-right-leave-to .video-container{opacity:0; transition:opacity .6s}} .txt-single-content{padding:20px; background:#fff} .txt-single-content .top{margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #82bc00} .txt-single-content .top h1,.txt-single-content .top h2{margin-bottom:20px; font-size:30px; font-weight:600} .txt-single-content .top p{position:relative; padding-right:30px; padding-left:30px; z-index:0; font-size:22px; line-height:1.4; font-weight:100} .txt-single-content .bottom .bottom-body>p,.txt-single-content .bottom .bottom-body>ul:not(.share-buttons-list){padding:0 50px; margin-bottom:10px; font-size:20px; line-height:1.5; font-weight:100} .txt-single-content .bottom .bottom-body>p>img{display:block;max-width:100%; height:auto} .txt-single-content .bottom .bottom-body>ul:not(.share-buttons-list){list-style:circle} .txt-single-content .bottom .bottom-body>ul:not(.share-buttons-list) li{margin-left:50px} .txt-single-content .bottom .bottom-body>ul.share-buttons-list{padding:0 50px} .txt-single-content .bottom .bottom-body>h2,.txt-single-content .bottom .bottom-body>h3{padding:0 50px; margin:20px 0; font-size:24px} .txt-single-content .bottom .bottom-body>img{display:block; max-width:100%; height:auto; padding:0 50px; margin-bottom:10px} .txt-single-content .bottom .box{border-radius:5px; margin-top:40px; padding:43px 50px; background:#facd00} .txt-single-content .bottom .box p{font-size:20px; font-weight:100; line-height:1.5} .txt-single-content.big-content:after{content:''; display:block; position:absolute; top:calc(100vh - 200px); left:0; width:100%; height:200px; transition:all .6s; background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 100%)} .txt-single-content.big-content.scrolled:after{opacity:0;visibility:hidden} @media only screen and (max-width:1024px){.txt-single-content{padding:25px} .txt-single-content .top{margin-bottom:15px; padding-bottom:15px} .txt-single-content .top h1,.txt-single-content .top h2{margin-bottom:10px; font-size:23px} .txt-single-content .top p{padding-right:30px; font-size:18px} .txt-single-content .top p:first-of-type:before{top:-15px; left:-5px; font-size:70px} .txt-single-content .bottom .bottom-body>h2,.txt-single-content .bottom .bottom-body>h3, .txt-single-content .bottom .bottom-body>img,.txt-single-content .bottom .bottom-body>p, .txt-single-content .bottom .bottom-body>ul:not(.share-buttons-list){padding:0 25px; margin-bottom:10px; font-size:16px} .txt-single-content .bottom .bottom-body>ul.share-buttons-list{padding:0 25px} .txt-single-content .bottom .bottom-body>ul:not(.share-buttons-list) li{margin-left:25px} .txt-single-content .bottom .box{margin-top:0; padding:20px 25px} .txt-single-content .bottom .box p{font-size:16px}} .testimonials-list{padding:50px 50px 20px} .testimonials-list>li{display:block; margin-bottom:30px; border-radius:5px; overflow:hidden} .testimonials-list>li .top figcaption,.testimonials-list>li .top figcaption h2,.testimonials-list>li .top figcaption p, .testimonials-list>li .top img{display:inline-block;vertical-align:middle}.testimonials-list>li .top{position:relative; background:#00313c; padding:25px 40px} .testimonials-list>li .top img{width:100%; max-width:75px; height:auto; margin-right:20px;border-radius:50%} .testimonials-list>li .top figcaption h2{margin-right:20px; color:#fff; font-size:20px; font-weight:600} .testimonials-list>li .top figcaption p{background:#82bc00; padding:6px 8px; border-radius:5px; font-size:16px; font-weight:100} .testimonials-list>li .top:after{content:''; display:block; position:absolute; bottom:0; left:67px; width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent; border-bottom:10px solid #fff} .testimonials-list>li .bottom{position:relative; background:#fff; max-height:200px; overflow-y:hidden; padding:40px 75px 40px 40px; transition:max-height .6s} .testimonials-list>li .bottom>p{font-size:20px; font-weight:100;line-height:1.5} .testimonials-list>li .btn-expand{position:absolute; bottom:40px; left:40px; background:#facd00; border-radius:20px; padding:9px 20px; z-index:5;opacity:0; visibility:hidden; font-size:13px; font-weight:700; text-transform:uppercase} .testimonials-list>li .btn-expand>svg{display:inline-block; vertical-align:middle; fill:#000;width:9px; height:5px;margin-left:6px} .testimonials-list>li.big-content{position:relative} .testimonials-list>li.big-content:after{content:''; display:block; position:absolute; bottom:0;left:0; width:100%; height:180px; transition:all .6s; background:linear-gradient(to bottom,rgba(255,255,255,0) 0,#fff 80%)} .testimonials-list>li.big-content .btn-expand{opacity:1; visibility:visible} .testimonials-list>li.big-content.expand .btn-expand,.testimonials-list>li.big-content.expand:after{visibility:hidden; opacity:0} .testimonials-list>li.big-content.expand .bottom{max-height:2000px} @media only screen and (max-width:1024px){ .testimonials-list{padding:25px} .testimonials-list>li{margin-bottom:10px} .testimonials-list>li .top{padding:20px 30px} .testimonials-list>li .top img{margin-right:15px} .testimonials-list>li .top figcaption h2{display:block; vertical-align:inherit;margin:0 0 10px; font-size:15px} .testimonials-list>li .top figcaption p{display:block; vertical-align:inherit; padding:4px 6px; font-size:13px} .testimonials-list>li .top:after{left:44px} .testimonials-list>li .bottom{max-height:200px; padding:20px} .testimonials-list>li .bottom>p{font-size:16px} .testimonials-list>li .btn-expand{bottom:20px; left:20px; padding:7px 16px; font-size:10px}} .comments-content{padding:50px} ul.share-buttons-list{margin-top:15px; font-size:0} ul.share-buttons-list li{display:inline-block; vertical-align:middle; margin-right:14px} ul.share-buttons-list li a{display:block; position:relative;width:38px; height:38px; border-radius:50%; transition:background .3s} ul.share-buttons-list li a.btn-facebook{background:#3e579b} ul.share-buttons-list li a.btn-facebook:hover{background:#526eba} ul.share-buttons-list li a.btn-twitter{background:#6aa8df} ul.share-buttons-list li a.btn-twitter:hover{background:#94c1e8} ul.share-buttons-list li a.btn-google{background:#d25438} ul.share-buttons-list li a.btn-google:hover{background:#db7862} ul.share-buttons-list li a.btn-linkedin{background:#4278b7} ul.share-buttons-list li a.btn-linkedin:hover{background:#6592c7} ul.share-buttons-list li a>svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); fill:#fff} ul.share-buttons-list li a>svg.i-facebook{width:9px; height:18px} ul.share-buttons-list li a>svg.i-google{width:25px; height:16px} ul.share-buttons-list li a>svg.i-twitter{width:19px; height:15px} ul.share-buttons-list li a>svg.i-linkedin{width:16px; height:16px} ul.share-buttons-list li a span{display:none} ul.fixed-share-buttons-list{display:block; position:fixed; position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); right:0; z-index:5; transition:opacity .6s} ul.fixed-share-buttons-list.v-enter,ul.fixed-share-buttons-list.v-leave-to{opacity:0} ul.fixed-share-buttons-list.v-enter-to{transition-delay:.5s} ul.fixed-share-buttons-list li{display:block} ul.fixed-share-buttons-list li a{position:relative; display:block; width:50px; height:60px; transition:background .3s} ul.fixed-share-buttons-list li a span{display:none} ul.fixed-share-buttons-list li a.btn-facebook{background:#3e579b} ul.fixed-share-buttons-list li a.btn-facebook:hover{background:#526eba} ul.fixed-share-buttons-list li a.btn-twitter{background:#6aa8df} ul.fixed-share-buttons-list li a.btn-twitter:hover{background:#94c1e8} ul.fixed-share-buttons-list li a.btn-google{background:#d25438} ul.fixed-share-buttons-list li a.btn-google:hover{background:#db7862} ul.fixed-share-buttons-list li a.btn-linkedin{background:#4278b7} ul.fixed-share-buttons-list li a.btn-linkedin:hover{background:#6592c7} ul.fixed-share-buttons-list li a>svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); fill:#fff} ul.fixed-share-buttons-list li a>svg.i-facebook{width:50%; height:42.8571428571%} ul.fixed-share-buttons-list li a>svg.i-twitter{width:50%; height:35.7142857143%} ul.fixed-share-buttons-list li a>svg.i-google{width:50%; height:28.5714285714%; height:25px} ul.fixed-share-buttons-list li a>svg.i-linkedin{width:50%; height:42.8571428571%} ul.clients-list:after{content:''; display:block; clear:both; width:100%} ul.clients-list li{float:left; display:-ms-flexbox; display:flex; -ms-flex-pack:center; justify-content:center; -ms-flex-align:center; align-items:center; width:25%; height:100px; padding:0 10px} ul.clients-list li img{display:block; max-width:100%; height:auto} @media only screen and (max-width:736px){ ul.clients-list li{float:left; display:-ms-flexbox; display:flex; -ms-flex-pack:center; justify-content:center; -ms-flex-align:center; align-items:center; width:33%; height:100px; padding:0 10px} } @media only screen and (max-width:1024px){ul.share-buttons-list li a span{font-size:11px} ul.clients-list li{width:50%}} @media only screen and (max-width:320px){ul.clients-list li{padding:0 20px}} .author-share-wrap{margin-top:16px} .author-share-wrap:after{content:''; display:block; clear:both; width:100%} .author-share-wrap .author-info{float:left;font-size:0} .author-share-wrap .author-info img{display:inline-block; vertical-align:middle; max-width:100%; height:auto; border-radius:50%} .author-share-wrap .author-info .info{display:inline-block; vertical-align:middle; padding-left:15px} .author-share-wrap .author-info .info p{font-size:18px; font-weight:300; padding-right:0!important} .author-share-wrap .author-info .info p a{color:#000;font-weight:600} .author-share-wrap .author-info .info p time{font-size:15px} .author-share-wrap .share-buttons-list{float:right;margin-top:7px} @media only screen and (max-width:1420px){.author-share-wrap .author-info{float:none;display:block} .author-share-wrap .share-buttons-list{display:block;float:none;margin-top:20px}} @media only screen and (min-width:736px) and (max-width:768px){ .author-share-wrap .author-info img{width:38px} .author-share-wrap .author-info .info{padding-left:10px} .author-share-wrap .author-info .info p{font-size:15px} .author-share-wrap .author-info .info p time{font-size:12px}} @media only screen and (max-width:736px){ .author-share-wrap .author-info .info{padding-left:10px} .author-share-wrap .author-info .info p{font-size:15px} .author-share-wrap .author-info .info p:first-of-type{max-width:150px} .author-share-wrap .author-info .info p time{font-size:12px}} @font-face{font-family:futura-pt; src:url(../fonts/futura-pt-black.eot); src:url(../fonts/futura-pt-black.eot?#iefix) format("embedded-opentype"), url(../fonts/futura-pt-black.woff2) format("woff2"), url(../fonts/futura-pt-black.woff) format("woff"), url(../fonts/futura-pt-black.ttf) format("truetype"), url(../fonts/futura-pt-black.svg#a19774d98080809ad976d8aabf478ad6b326b569012064015b36b619b7a290a) format("svg"); font-weight:900;font-style:normal} @font-face{font-family:futura-pt;src:url(/fonts/futura-pt-bold.eot); src:url(../fonts/futura-pt-bold.eot?#iefix) format("embedded-opentype"), url(../fonts/futura-pt-bold.woff2) format("woff2"), url(../fonts/futura-pt-bold.woff) format("woff"), url(../fonts/futura-pt-bold.ttf) format("truetype"), url(../fonts/futura-pt-bold.svg#1c4f3e492ed61331493cee14f436222188d5c41750789eba0b7c9c80d938ff1) format("svg"); font-weight:700;font-style:normal} @font-face{font-family:futura-pt;src:url(/fonts/futura-pt-light.eot); src:url(../fonts/futura-pt-light.eot?#iefix) format("embedded-opentype"), url(../fonts/futura-pt-light.woff2) format("woff2"), url(../fonts/futura-pt-light.woff) format("woff"), url(../fonts/futura-pt-light.ttf) format("truetype"), url(../fonts/futura-pt-light.svg#7a2552e0954af5fb819d9c6a302930c2ecaee078ff44f43ff526f0c9986349f) format("svg"); font-weight:300; font-style:normal} @font-face{font-family:futura-pt; src:url(../fonts/futura-pt-medium.eot); src:url(../fonts/futura-pt-medium.eot?#iefix) format("embedded-opentype"), url(../fonts/futura-pt-medium.woff2) format("woff2"), url(../fonts/futura-pt-medium.woff) format("woff"), url(../fonts/futura-pt-medium.ttf) format("truetype"), url(../fonts/futura-pt-medium.svg#ee80c77cad2477812b9324c0a127dbef30397087b2b71796abbe84e757801ac) format("svg"); font-weight:500; font-style:normal} @font-face{font-family:futura-pt; src:url(../fonts/futura-pt-thin.eot); src:url(../fonts/futura-pt-thin.eot?#iefix) format("embedded-opentype"), url(../fonts/futura-pt-thin.woff2) format("woff2"),url(/fonts/futura-pt-thin.woff) format("woff"), url(../fonts/futura-pt-thin.ttf) format("truetype"), url(../fonts/futura-pt-thin.svg#692fa42e4f1ae8e08626143e8ddf1bf79418c98fc508ec13b506384669d313d) format("svg"); font-weight:100; font-style:normal} .column.column-left header{position:absolute; top:40px; left:50px; width:calc(50vw - 100px); height:56px;z-index:10} .column.column-left header:after{content:''; display:block; clear:both; width:100%} .column.column-left header .fade-enter-active,.column.column-left header .fade-leave-active{transition:opacity 1.2s; position:absolute;top:0; left:0} .column.column-left header .fade-enter,.column.column-left header .fade-leave-active,.column.column-left header .fade-leave-to{opacity:0} .column.column-left header .logo{float:left}.column.column-left header .logo a{display:block} .column.column-left header .logo a span{display:none} .column.column-left header .logo a>svg{fill:#82bc00; width:140px; height:56px; transition:fill .3s ease-in-out} @media not screen and (max-device-width:1024px){ .column.column-left header .logo a:hover>svg{fill:#fff}} .column.column-left header .right-wrap{position:relative; float:right} .column.column-left header .right-wrap .btn-lang{display:inline-block; vertical-align:middle; width:62px; height:33px; border-radius:17px; background-color:rgba(233,233,233,.1); margin-left:30px} .column.column-left header .right-wrap .btn-lang span{display:inline-block; color:#82bc00; font-size:13px; font-weight:700; text-transform:uppercase} .column.column-left header .right-wrap .btn-lang>svg{display:inline-block; vertical-align:top; margin:6px 0 0 7px; fill:#82bc00; width:9px; height:5px} @media not screen and (max-device-width:1024px){ .column.column-left header .right-wrap .btn-lang:hover+ul{opacity:1; visibility:visible;margin-top:17px}} .column.column-left header .right-wrap .btn-lang.show svg{-ms-transform:rotate(180deg); transform:rotate(180deg)} .column.column-left header .right-wrap .btn-lang.show+ul{opacity:1; visibility:visible; margin-top:17px} .column.column-left header .right-wrap .lang-links{position:absolute; top:100%; right:0; margin-top:-50px; opacity:0; visibility:hidden; transition:all .3s} @media not screen and (max-device-width:1024px){ .column.column-left header .right-wrap .lang-links:hover{opacity:1; visibility:visible;margin-top:17px}} .column.column-left header .right-wrap .lang-links.open{opacity:1; visibility:visible; margin-top:-6px} .column.column-left header .right-wrap .lang-links:before{content:''; display:block; position:absolute; bottom:100%; width:100%; height:60px; margin-bottom:-17px; z-index:-1} .column.column-left header .right-wrap .lang-links li:first-child a{border-top-right-radius:17px; border-top-left-radius:17px} .column.column-left header .right-wrap .lang-links li:first-child a:after{content:''; display:block; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-bottom:5px solid #fff; position:absolute;top:-5px; right:15px;transition:border-bottom .3s} .column.column-left header .right-wrap .lang-links li:last-child a{border-bottom-right-radius:17px; border-bottom-left-radius:17px} .column.column-left header .right-wrap .lang-links li a{display:block;width:62px; height:40px; padding:15px; background:#fff; transition:background .3s;color:#000; font-size:13px;font-weight:700; text-transform:uppercase} @media not screen and (max-device-width:1024px) { .column.column-left header .right-wrap .lang-links li a:hover{background:#82bc00} .column.column-left header .right-wrap .lang-links li a:hover:after{border-bottom:5px solid #82bc00}} .column.column-left header .right-wrap .lang-links li a.active{background:#82bc00; cursor:default} .column.column-left header .right-wrap .lang-links li a.active:after{border-bottom:5px solid #82bc00} @media only screen and (min-width:768px) and (max-width:1024px){.column.column-left header{top:20px; left:25px; width:calc(50vw - 50px)} .column.column-left header .btn-menu{display:none}} @media only screen and (max-width:736px){.column.column-left header{top:initial; left:initial; width:100%; padding:20px 20px 0} .column.column-left header .logo{position:relative;z-index:5} .column.column-left header .logo a>svg{width:104px;height:40px;transition:fill .6s} .column.column-left header .right-wrap{position:absolute;right:70px} .column.column-left header .btn-menu{display:block;position:relative; float:right; width:33px; height:33px; background:url(../images/menu-mobile.png) center center no-repeat #82bc00; background-size:50% auto;border-radius:50%; transition:background .6s; z-index:5} .column.column-left header .btn-back, .column.column-left header .btn-menu span{display:none} .column.column-left header .menu-bg{position:fixed; top:0; left:0;width:100vw; height:100vh; background:0 0; transition:all .6s;pointer-events:none} .column.column-left header .menu-bg:after{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); content:''; width:50px; height:50px; background:#82bc00; border-radius:50%; transition:all .6s;opacity:0; visibility:hidden} .column.column-left header.open-menu{position:fixed} .column.column-left header.open-menu .logo a>svg{fill:#000} .column.column-left header.open-menu .btn-menu{background:url(../images/close-mobile.png) center center no-repeat #000; background-size:50% auto} .column.column-left header.open-menu .menu-bg{background:#82bc00} .column.column-left header.open-menu .menu-bg:after{width:100vw; height:100vh; border-radius:0; opacity:1; visibility:visible} .column.column-left header.open-menu~nav.left-nav{opacity:1; visibility:visible; transition-delay:.6s}} .column.column-left footer{position:absolute; left:50px; bottom:40px; width:calc(50vw - 100px); overflow:hidden; padding-top:45px; border-top:1px solid #49484a; z-index:10} .column.column-left footer p{float:left; padding:3px 0; color:#fff; font-size:16px; font-weight:300} .column.column-left footer p br{display:none} .column.column-left footer .social-links{float:right} .column.column-left footer .social-links:after{content:''; display:block; clear:both; width:100%} .column.column-left footer .social-links li{float:left; margin-left:30px} .column.column-left footer .social-links li:first-child{margin-left:0} .column.column-left footer .social-links li a{display:block} .column.column-left footer .social-links li a span{display:none} .column.column-left footer .social-links li a>svg{fill:#fff; transition:fill .3s ease-in-out} .column.column-left footer .social-links li a>svg.i-facebook{width:9px;height:16px} .column.column-left footer .social-links li a>svg.i-twitter{width:17px; height:14px} .column.column-left footer .social-links li a>svg.i-google{width:22px; height:15px} .column.column-left footer .social-links li a>svg.i-linkedin{width:16px;height:16px} .column.column-left footer .social-links li a:hover>svg.i-facebook{fill:#415A90} .column.column-left footer .social-links li a:hover>svg.i-twitter{fill:#38ADEA} .column.column-left footer .social-links li a:hover>svg.i-google{fill:#E54E44} .column.column-left footer .social-links li a:hover>svg.i-linkedin{fill:#0077B7} @media only screen and (max-width:1440px){ .column.column-left footer p br{display:block}} @media only screen and (min-width:768px) and (max-width:1024px){ .column.column-left footer{left:25px; bottom:20px; width:calc(50vw - 50px); padding-top:20px; font-size:0} .column.column-left footer p{float:none; display:inline-block; vertical-align:middle; width:300px; font-size:16px} .column.column-left footer p br{display:block} .column.column-left footer .social-links{display:inline-block; vertical-align:middle; float:none; width:calc(100% - 300px); padding-left:8px} .main-columns+footer{display:none}} @media only screen and (min-width:736px) and (max-width:768px){ .column.column-left footer p{width:200px} .column.column-left footer .social-links{width:calc(100% - 200px); padding-left:10px} .column.column-left footer .social-links li,.column.column-left footer .social-links li:first-child{margin-left:15px}} @media only screen and (max-width:736px){.column.column-left footer{display:none} .main-columns+footer .social-links li a,.main-columns+footer p br{display:block} .main-columns+footer{position:relative;width:100%; overflow:hidden; padding:25px; background:#1d1c1c} .main-columns+footer p{margin-top:39px;color:#fff; font-size:13px; line-height:1.5; font-weight:300} .main-columns+footer .social-links{position:absolute; top:25px; left:25px} .main-columns+footer .social-links:after{content:''; display:block; clear:both; width:100%} .main-columns+footer .social-links li{float:left; margin-left:30px} .main-columns+footer .social-links li:first-child{margin-left:0} .main-columns+footer .social-links li a span{display:none} .main-columns+footer .social-links li a>svg{fill:#fff;transition:fill .3s ease-in-out} .main-columns+footer .social-links li a>svg.i-facebook{width:9px;height:16px} .main-columns+footer .social-links li a>svg.i-twitter{width:17px;height:14px} .main-columns+footer .social-links li a>svg.i-google{width:22px; height:15px} .main-columns+footer .social-links li a>svg.i-linkedin{width:16px; height:16px}} .column-left section.home .video-container{position:absolute; top:0;left:0; width:100vw; height:100%; z-index:-1; transition:opacity 1s .3s,visibility 1s .3s} .column-left section.home .video-container:after{content:''; position:absolute; top:0;left:0; width:100%; height:100%; background:rgba(0,0,0,.7)} .column-left section.home .video-container video{min-width:100vw;min-height:100vh;object-fit:inherit} .column-left section.home .txt-wrap{max-width:80%} .column-left section.home .txt-wrap p{max-width:100%} .column-right section.home .video-container{position:absolute; top:0;left:0; width:10vh; height:100%; z-index:-1; transition:opacity 1s .3s,visibility 1s .3s} .column-right section.home .video-container:after{content:''; position:absolute; top:0;left:0; width:100%; height:100%; background:rgba(0,0,0,.7)} .column-right section.home .video-container video{min-width:100vw;min-height:100vh;object-fit:inherit} .column-right section.home .txt-wrap{max-width:80%} .column-right section.home .txt-wrap p{max-width:100%} .rslides { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; margin: 0 auto; } .rslides li { -webkit-backface-visibility: hidden; position: absolute; display: none; width: 100%; left: 0; top: 0; } .rslides li:first-child { position: relative; display: block; float: left; } .rslides img { display: block; height: auto; float: left; width: 100%; border: 0; } .events { list-style: none; } .callbacks_container { margin-bottom: 0px; position: relative; width: 100%; } .callbacks { position: relative; list-style: none; overflow: hidden; width: 100%; padding: 0; margin: 0; } .callbacks li { position: absolute; width: 100%; left: 0; top: 0; } .callbacks img { display: block; position: relative; z-index: 1; height: auto; width: 100%; border: 0; } .callbacks .caption { display: block; position: absolute; z-index: 2; font-size: 18px; text-shadow: none; color: #fff; background: #000; background: rgba(0,0,0, .8); left: 0; right: 0; bottom: 0; padding: 10px 20px; margin: 0; max-width: none; } .callbacks_nav { position: absolute; -webkit-tap-highlight-color: rgba(0,0,0,0); top: 52%; left: 0; opacity: 0.7; z-index: 3; text-indent: -9999px; overflow: hidden; text-decoration: none; height: 61px; width: 38px; background: transparent url("themes.gif") no-repeat left top; margin-top: -45px; } .callbacks_nav:active { opacity: 1.0; } .callbacks_nav.next { left: auto; background-position: right top; right: 0; } /* JQuery Simple MobileMenu https://github.com/Position2/jQuery-Simple-MobileMenu */ /*Main style*/ body.mmactive { overflow: hidden; } .mobile_menu { display: none; position: relative; } .sm_menu_outer.active .mobile_menu { display: block; } .sm_menu_outer { height:calc(100vh - 116px); overflow-y: scroll; overflow-x: hidden; position: fixed; right: 0; bottom: 0; z-index: -9; width: 100%; opacity: 0; background-color: #000000; -webkit-transition: opacity 0.2s; -moz-transition: opacity 0.2s; transition: opacity 0.2s; } .sm_menu_outer.active { opacity: 1; z-index: 999; } .sm_menu_outer .mobile_menu li.back a { padding: 20px 5px 20px 55px; background: url("../images/back.png") no-repeat scroll 15px center / 5% auto; } .sm_menu_outer .mobile_menu a { color: #ffffff; display: block; font: 300 18px/140% ; letter-spacing: 1px; padding: 20px 15px; text-transform: uppercase; text-decoration: none; } /*Sub Menu anim */ .sm_menu_outer .mobile_menu .submenu { background-color: #000000; height: 100%; position: absolute; right: -100%; top: 0; transition: all 0.5s ease 0s; width: 100%; z-index: 999; } .sm_menu_outer .mobile_menu li.active>.submenu { right: 0; } .sm_menu_outer .mobile_menu li { list-style-type: none; border-bottom: 0.5px solid rgba(0, 0, 0, 0); border-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #2a2a2a 20%, #2a2a2a 50%, #2a2a2a 80%, rgba(0, 0, 0, 0) 100%) 0 0 1 0; color: #ffffff; } .sm_menu_outer .mobile_menu li.hasChild>a { background: url("../images/next.png") no-repeat scroll 95% center / 5% auto; } /*Hamburger Animation */ #sm_menu_ham { cursor: pointer; float: right; height: 25px; position: fixed; right: 5px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all 0.5s ease-in-out 0s; -moz-transition: all 0.5s ease-in-out 0s; -o-transition: all 0.5s ease-in-out 0s; transition: all 0.5s ease-in-out 0s; width: 30px; top: 15px; right: 15px; z-index: 9999; } #sm_menu_ham span { background-color: #FFFFFF; border-radius: 5px; display: block; height: 2px; left: 0; opacity: 1; position: absolute; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: all 0.25s ease-in-out 0s; -moz-transition: all 0.25s ease-in-out 0s; -o-transition: all 0.25s ease-in-out 0s; transition: all 0.25s ease-in-out 0s; width: 30px; } #sm_menu_ham span:nth-child(1) { top: 0; } #sm_menu_ham span:nth-child(2), #sm_menu_ham span:nth-child(3) { top: 10px; } #sm_menu_ham span:nth-child(4) { top: 20px; } #sm_menu_ham.open span:nth-child(1) { left: 50%; top: 18px; width: 0; } #sm_menu_ham.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); } #sm_menu_ham.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); } #sm_menu_ham.open span:nth-child(4) { left: 50%; top: 18px; width: 0; } /*@media (min-width: 0px) and (max-width: 767px) {} @media (min-width: 768px) and (max-width: 991px) {} @media (min-width: 992px) and (max-width: 1024px) {}*/ @media (min-width: 1024px) { #sm_menu_ham, .sm_menu_outer { display: none; } } .container { position: relative; min-width: 100%; } .overlay { position: absolute; bottom: 0; left: 0; right: 0; background-color: #00313c; overflow: hidden; width: 100%; height: 0; transition: .5s ease; } .container:hover .overlay { height: 100%; } .text { white-space: nowrap; color: white; font-size: 20px; position: absolute; overflow: hidden; top: 50%; left: 50%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); } .container figcaption{ position: absolute; bottom: 10px; left: 30px; z-index: 10; } /* The Modal (background) */ .modal { display: none; /* Hidden by default */ position: fixed; /* Stay in place */ z-index: 1; /* Sit on top */ padding-top: 25px; /* Location of the box */ left: 0; top: 0; width: 100%; /* Full width */ height: 100%; /* Full height */ overflow: auto; /* Enable scroll if needed */ background-color: rgb(0,0,0); /* Fallback color */ background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ } /* Modal Content */ .modal-content { position: relative; background-color: #fefefe; margin: auto; padding: 0; border: 1px solid #888; width: 70%; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); -webkit-animation-name: animatetop; -webkit-animation-duration: 0.4s; animation-name: animatetop; animation-duration: 0.4s } /* Add Animation */ @-webkit-keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1} } @keyframes animatetop { from {top:-300px; opacity:0} to {top:0; opacity:1} } /* The Close Button */ .close { color: white; float: right; font-size: 36px; font-weight: bold; } .close:hover, .close:focus { color: #000; text-decoration: none; cursor: pointer; } .modal-header { padding: 2px 16px; background-color: #5cb85c; color: white; } .modal-body {padding: 2px 2px;} .modal-footer { padding: 2px 16px; background-color: #5cb85c; color: white; } * {box-sizing:border-box} /* Slideshow container */ .slideshow-container { max-width: 100%; position: relative; margin: auto; } /* Hide the images by default */ .mySlides, .myslides2, .myslides3, .myslides4,.myslides5{ display: none; } /* Next & previous buttons */ .prev, .next { cursor: pointer; position: absolute; top: 50%; width: auto; margin-top: -22px; padding: 16px; color: white; font-weight: bold; font-size: 18px; transition: 0.6s ease; border-radius: 0 3px 3px 0; } /* Position the "next button" to the right */ .next { right: 0; border-radius: 3px 0 0 3px; } /* On hover, add a black background color with a little bit see-through */ .prev:hover, .next:hover { background-color: rgba(0,0,0,0.8); } /* Caption text */ .texti { color: #f2f2f2; font-size: 15px; padding: 8px 12px; position: absolute; bottom: 8px; width: 100%; text-align: center; } /* Number text (1/3 etc) */ .numbertext { color: #f2f2f2; font-size: 12px; padding: 8px 12px; position: absolute; top: 0; } /* Fading animation */ .fade { -webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s; } @-webkit-keyframes fade { from {opacity: .4} to {opacity: 1} } @keyframes fade { from {opacity: .4} to {opacity: 1} } .columni { float: left; width: 33.33%; height:250px; overflow: auto; } /* Clear floats after the columns */ .row:after { content: ""; display: table; clear: both; } @media (max-width: 600px) { .columni { width: 100%; } } .rt{ text-align: center; font-size: 18px; font-weight: bold; padding:20px 0px 10px 0PX; } .hk{ font-size: 18px; line-height: 1.3; padding: 10px font-weight:0; text-align: center; } .icon { text-align: center; width: 30px; height: 30px; line-height: 35px; margin: 0 auto 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; -o-border-radius: 50%; border-radius: 50%; padding-top: 20px } .column-right section.home nav.right-nav{height:100vh; transition:all 1s} .column-right section.home nav.right-nav>ul{height:100%; padding:7% 3.5% 4.2%} .column-right section.home nav.right-nav>ul.list-en li:first-child,.column-right section.home nav.right-nav>ul.list-es li:first-child{ width:calc(100% - 50px)} .column-right section.home nav.right-nav>ul.list-en li:first-child .top,.column-right section.home nav.right-nav>ul.list-es li:first-child .top{ background:#82bc00;} .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom, .column-right section.home nav.right-nav>ul.list-en li:first-child .top .top-wrap .img-wrap .circle, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom, .column-right section.home nav.right-nav>ul.list-es li:first-child .top .top-wrap .img-wrap .circle{background:#fff} .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom .arrow, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom .arrow{right:85%} .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom .arrow:before, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom .arrow:before{background:#000} .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom .arrow>svg, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom .arrow>svg{fill:#000} .column-right section.home nav.right-nav>ul li{display:inline-block; position:relative;width:calc(50% - 52px); height:calc(33.33% - 25px); margin:0 25px 25px; border-radius:5px; overflow:hidden} .column-right section.home nav.right-nav>ul li>a{position:absolute; width:100%; height:100%; z-index:10; text-indent:-9999px} @media not screen and (max-device-width:1024px){ .column-right section.home nav.right-nav>ul li>a:hover~.bottom:after{right:0} .column-right section.home nav.right-nav>ul li>a:hover~.bottom .arrow{animation:arrow .6s ease-in-out} .column-right section.home nav.right-nav>ul li>a:hover~.bottom .arrow:before{background:#82bc00!important} .column-right section.home nav.right-nav>ul li>a:hover~.bottom .arrow>svg{fill:#82bc00!important}} .column-right section.home nav.right-nav>ul li .top{display:table; position:relative; width:100%; height:73%; background:#fff; overflow:hidden} .column-right section.home nav.right-nav>ul li .top .top-wrap{display:table-cell; vertical-align:middle; width:100%; padding:0 25px 0 30px} .column-right section.home nav.right-nav>ul li .top .top-wrap:after{content:''; display:block; clear:both; width:100%} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap{position:relative; float:left;width:80px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap .circle{width:40px; height:40px; border-radius:50%; background:#82bc00;} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg{position:absolute; top:10px; left:10px; fill:#000; height:48px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-services{width:33px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-process{width:43px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-cases{width:48px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-about{width:50px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-blog{width:48px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap>svg.i-contact{width:46px;height:46px} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap{ float:left; width:calc(100% - 80px)} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap h3{margin-bottom:9px; font-size:16px; font-size:1.1rem; font-weight:700; letter-spacing:1.1px; text-transform:uppercase} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap p{font-size:17px; line-height:1.5;font-weight:300} .column-right section.home nav.right-nav>ul li .bottom{position:relative; height:27%; background:#82bc00; transition:all .3s} .column-right section.home nav.right-nav>ul li .bottom:after{content:''; position:absolute; top:0;right:100%; width:100%; height:100%; background:#00313c; transition:all .3s ease-in-out} .column-right section.home nav.right-nav>ul li .bottom .arrow{position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); right:68%;transition:all .3s;z-index:5} .column-right section.home nav.right-nav>ul li .bottom .arrow:before{content:''; position:absolute; top:8px;right:2px; width:100vw; height:2px; background:#fff; transition:all .3s;z-index:-1} .column-right section.home nav.right-nav>ul li .bottom .arrow>svg{fill:#fff; width:10px; height:18px; transition:all .3s} body.ie .column-left section.home .video-container{ -ms-transform:translateX(-15%); transform:translateX(-15%)} @media only screen and (max-width:1440px){ .column-right section.home nav.right-nav>ul li .top{height:83%} .column-right section.home nav.right-nav>ul li .top .top-wrap{padding:0 15px} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap h3{margin-bottom:5px} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap p{line-height:1} .column-right section.home nav.right-nav>ul li .bottom{height:17%}} @media only screen and (min-width:768px) and (max-width:1024px){ .column-right section.home nav.right-nav>ul li:first-child .bottom .arrow, .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom .arrow, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom .arrow{right:65%} .column-left section.home .video-container{background:url(../images/home-background.gif) top left no-repeat;background-size:auto 100%} .column-left section.home .txt-wrap{max-width:calc(100% - 50px); margin-left:0} .column-right section.home{overflow-y:scroll} .column-right section.home nav.right-nav{height:inherit;transition:none} .column-right section.home nav.right-nav>ul{height:auto;padding:20px} .column-right section.home nav.right-nav>ul.list-en li:first-child, .column-right section.home nav.right-nav>ul.list-es li:first-child{width:100%} .column-right section.home nav.right-nav>ul li{width:100%;height:inherit; margin:0 0 13px} .column-right section.home nav.right-nav>ul li:first-child{width:100%} .column-right section.home nav.right-nav>ul li .top{width:100%;height:inherit;padding:30px 15px} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap{width:68px} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap{width:calc(100% - 68px)} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap h3{margin-bottom:9px; font-size:13px;letter-spacing:0} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap p{font-size:14px} .column-right section.home nav.right-nav>ul li .bottom{height:48px;transition:none} .column-right section.home nav.right-nav>ul li .bottom:after{content:none} .column-right section.home nav.right-nav>ul li .bottom .arrow{right:65%;transition:none} .column-right section.home nav.right-nav>ul li .bottom .arrow:before, .column-right section.home nav.right-nav>ul li .bottom .arrow>svg{transition:none}} @media only screen and (max-width:736px){ .column-right section.home nav.right-nav>ul li:first-child .bottom .arrow, .column-right section.home nav.right-nav>ul.list-en li:first-child .bottom .arrow, .column-right section.home nav.right-nav>ul.list-es li:first-child .bottom .arrow{right:65%}.column-left section.home .video-container{ width:300vw; height:100%; background:url(../images/home-background.gif) top left no-repeat;background-size:auto 100%} .column-right section.home nav.right-nav>ul li:first-child, .column-right section.home nav.right-nav>ul.list-en li:first-child, .column-right section.home nav.right-nav>ul.list-es li:first-child{width:100%} .column-left section.home .txt-wrap{max-width:100%} .column-right section.home nav.right-nav{height:inherit;transition:none} .column-right section.home nav.right-nav>ul{height:auto;padding:20px} .column-right section.home nav.right-nav>ul li{width:100%;height:inherit;margin:0 0 13px} .column-right section.home nav.right-nav>ul li .top{height:inherit;padding:30px 15px} .column-right section.home nav.right-nav>ul li .top .top-wrap{padding:0} .column-right section.home nav.right-nav>ul li .top .top-wrap .img-wrap{width:68px} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap{width:calc(100% - 68px)} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap h3{margin-bottom:9px; font-size:13px; letter-spacing:0} .column-right section.home nav.right-nav>ul li .top .top-wrap .txt-wrap p{font-size:14px} .column-right section.home nav.right-nav>ul li .bottom{height:48px;transition:none} .column-right section.home nav.right-nav>ul li .bottom:after{content:none} .column-right section.home nav.right-nav>ul li .bottom .arrow{right:65%;transition:none} .column-right section.home nav.right-nav>ul li .bottom .arrow:before, .column-right section.home nav.right-nav>ul li .bottom .arrow>svg{transition:none}} .column-right section.services{overflow-y:scroll;padding:37px} .column-right section.services ul.flipping-cards{height:initial} .column-right section.services ul.flipping-cards li.flipping-card .front figure figcaption p{width:initial; padding:0 20px; text-align:left} @media only screen and (max-width:1440px) {.column-right section.services{padding:15px} .column-right section.services ul.flipping-cards li.flipping-card .front figure figcaption p{padding:0 10px}} @media only screen and (max-width:1024px){.column-right section.services{padding:25px}} @media only screen and (max-width:736px){ .column-right section.services{overflow-y:visible}} .column-right section.contact .row{display:block;width:100%;height:50%} .column-right section.contact .row.top:after{content:''; display:block; clear:both;width:100%} .column-right section.contact .row.top>.column{ position:relative; float:left; width:50%; height:100%;} .column-right section.contact .row.top>.column figure{display:block; height:100%} .column-right section.contact .row.top>.column figure img{display:block;width:100%; height:100%; object-fit:cover} .column-right section.contact .row.top>.column figure figcaption{position:absolute; left:0; bottom:0; padding:17% 0 8% 8%; font-size:15px} .column-right section.contact .row.top>.column figure figcaption h4{color:#82bc00; font-weight:700; text-transform:uppercase} .column-right section.contact .row.top>.column figure figcaption p{color:#fff; margin:20px 0} .column-right section.contact .row.top>.column figure figcaption p:last-child{margin:0} .column-right section.contact .row.bottom{background:#fff; padding:5% 7%; overflow-y:scroll} .column-right section.contact .row.bottom h3{margin-bottom:20px; font-size:30px; font-weight:700} .column-right section.contact .row.bottom form ::-webkit-input-placeholder{color:#1d1c1c} .column-right section.contact .row.bottom form :-moz-placeholder{color:#1d1c1c} .column-right section.contact .row.bottom form ::-moz-placeholder{color:#1d1c1c} .column-right section.contact .row.bottom form :-ms-input-placeholder{color:#1d1c1c} .column-right section.contact .row.bottom form label:not(.label-checkbox){display:none} .column-right section.contact .row.bottom form label.label-checkbox{display:inline-block;vertical-align:middle} .column-right section.contact .row.bottom form label.label-checkbox input[type=checkbox]{ width:initial; display:inline-block; vertical-align:middle; float:left;margin:0 5px 5px 0} .column-right section.contact .row.bottom form p{margin-bottom:35px} .column-right section.contact .row.bottom form p:after{content:''; display:block; clear:both;width:100%} .column-right section.contact .row.bottom form p .column{float:left; width:50%} .column-right section.contact .row.bottom form p .column:first-child{padding:0 30px 0 0} .column-right section.contact .row.bottom form p .column:last-child{padding:0 0 0 30px} .column-right section.contact .row.bottom form p select{ -webkit-appearance:none; -moz-appearance:none; appearance:none; border-radius:0} .column-right section.contact .row.bottom form p input, .column-right section.contact .row.bottom form p select, .column-right section.contact .row.bottom form p textarea{width:100%; background:0 0; border:0; border-bottom:1px solid #e9e9e9; padding:5px 20px 5px 0; color:#1d1c1c; font-size:16px; font-weight:300} .column-right section.contact .row.bottom form p small{display:block; margin-top:5px} @media only screen and (min-width:768px) and (max-width:1024px){.column-right section.contact .row.top>.column figure figcaption{ padding:17% 0 17% 2%}} @media only screen and (max-width:768px){ .column-right section.contact{overflow-y:scroll} .column-right section.contact .row{height:initial} .column-right section.contact .row.top>.column{float:none;width:100%; height:initial}.column-right section.contact .row.top>.column figure img{height:auto} .column-right section.contact .row.top>.column figure figcaption{padding:0 0 25px 25px; font-size:13px} .column-right section.contact .row.top>.column figure figcaption p{margin:10px 0 0;line-height:2} .column-right section.contact .row.top>.column figure figcaption p:last-child{margin:0} .column-right section.contact .row.top>.column figure figcaption p br:last-of-type{display:none} .column-right section.contact .row.bottom{padding:25px} .column-right section.contact .row.bottom h3{margin-bottom:30px;font-size:23px} .column-right section.contact .row.bottom form p{margin-bottom:35px} .column-right section.contact .row.bottom form p .column{display:block; float:none; width:100%; margin-bottom:33px} .column-right section.contact .row.bottom form p .column:first-child, .column-right section.contact .row.bottom form p .column:last-child{padding:0} .column-right section.contact .row.bottom form p input,.column-right section.contact .row.bottom form p textarea{ font-size:14px} .column-right section.contact .row.bottom form p textarea{height:90px} .column-right section.contact .row.bottom form p textarea::-webkit-input-placeholder{ line-height:140px} .column-right section.contact .row.bottom form p textarea:-moz-placeholder{ line-height:140px} .column-right section.contact .row.bottom form p textarea::-moz-placeholder{line-height:140px} .column-right section.contact .row.bottom form p textarea:-ms-input-placeholder{line-height:140px}} @media only screen and (max-width:736px){ .column-right section.contact{overflow-y:visible}} .column-right section.process{overflow-y:scroll} .column-right section.process ol.processes-list>li{position:relative; padding:40px 0; background:#eee; background:linear-gradient(to bottom,#eee 0,#e7e7e7 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#e7e7e7', GradientType=0 )} .column-right section.process ol.processes-list>li:before{content:''; position:absolute; top:0; left:0; width:30%; height:100%; background:#fff; box-shadow:0 10px 18px rgba(196,202,207,.45)} .column-right section.process ol.processes-list>li:after{content:''; position:absolute; bottom:0; right:0; width:70%; height:1px; background:#e1e3e3} .column-right section.process ol.processes-list>li h4,.column-right section.process ol.processes-list>li h4 span, .column-right section.process ol.processes-list>li>h3{position:relative} .column-right section.process ol.processes-list>li:first-child{padding:120px 0 40px} .column-right section.process ol.processes-list>li h4:after,.column-right section.process ol.processes-list>li>h3:after{ content:''; display:block; clear:both; width:100%} .column-right section.process ol.processes-list>li h4 span,.column-right section.process ol.processes-list>li>h3 span{float:left} .column-right section.process ol.processes-list>li h4 span:first-child,.column-right section.process ol.processes-list>li>h3 span:first-child{ width:30%; text-align:right} .column-right section.process ol.processes-list>li h4 span:last-child, .column-right section.process ol.processes-list>li>h3 span:last-child{width:70%} .column-right section.process ol.processes-list>li>h3{margin-bottom:20px; color:#dfe0e1; font-size:55px; text-transform:uppercase} .column-right section.process ol.processes-list>li>h3 span:last-child{font-weight:700} .column-right section.process ol.processes-list>li h4{font-size:13px;font-weight:700; text-transform:uppercase} .column-right section.process ol.processes-list>li h4 span:first-child{padding-right:30px; color:#82bc00} .column-right section.process ol.processes-list>li h4 span:first-child:before{content:''; display:block; position:absolute; top:50%; right:0; width:5px; height:5px; border-radius:50%; background:#82bc00; -ms-transform:translate(50%,-50%); transform:translate(50%,-50%); z-index:5} .column-right section.process ol.processes-list>li h4 span:first-child:after{content:''; display:block; position:absolute; top:50%; left:100%; width:13px; height:1px; background:#d7d7d7; -ms-transform:translate(0,-50%); transform:translate(0,-50%)} .column-right section.process ol.processes-list>li h4 span:last-child{padding-left:35px} .column-right section.process ol.processes-list>li h4 span:last-child a{position:relative; z-index:1;color:#000} .column-right section.process ol.processes-list>li h4 span:last-child a:before{content:''; display:block; position:absolute; top:50%;left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); width:30px;height:calc(100% + 6px); border-radius:15px;background:#fff; z-index:-1; opacity:0; transition:all .3s} .column-right section.process ol.processes-list>li h4 span:last-child a:hover:before{width:calc(100% + 20px); opacity:1} .column-right section.process ol.processes-list>li h4.active span:first-child:before{border:2px solid #fff} .column-right section.process ol.processes-list>li h4.active span:first-child:after{width:24px} .column-right section.process ol.processes-list>li ul.process-list>li{position:relative;margin-bottom:30px} .column-right section.process ol.processes-list>li ul.process-list>li:last-child{margin-bottom:0} .column-right section.process ol.processes-list>li ul.process-list>li .process-card{position:absolute; top:0;right:0; max-width:37.5%; background:#fff; z-index:10; padding:30px 30px 20px; border-top-left-radius:5px; border-bottom-left-radius:5px; opacity:0; visibility:hidden; transition:all .3s} .column-right section.process ol.processes-list>li ul.process-list>li .process-card button{position:absolute; top:10px; right:30px; color:#82bc00; font-size:20px} .column-right section.process ol.processes-list>li ul.process-list>li .process-card .img-wrap{position:relative; display:inline-block; vertical-align:middle; width:50px; height:53px} .column-right section.process ol.processes-list>li ul.process-list>li .process-card .img-wrap .circle{width:40px; height:40px; border-radius:50%; background:#facd00} .column-right section.process ol.processes-list>li ul.process-list>li .process-card .img-wrap .icon-circle{position:absolute; top:13px; left:10px; width:40px; height:40px; border-radius:50%; border:2px solid #000; line-height:40px; font-weight:700; text-align:center} .column-right section.process ol.processes-list>li ul.process-list>li .process-card h5{display:inline-block; vertical-align:middle; width:calc(100% - 79px); margin-left:15px; padding-right:10px; font-size:16px; font-weight:700; text-transform:uppercase} .column-right section.process ol.processes-list>li ul.process-list>li .process-card p{display:inline-block; width:100%; margin-top:15px; padding:0 10px 0 30px; font-size:17px;font-weight:300} .column-right section.process ol.processes-list>li ul.process-list>li.active .process-card{opacity:1; visibility:visible} .column-right section.process ol.processes-list>li:nth-last-of-type(-n+2) ul.process-list>li .process-card{top:initial;bottom:0} .column-right section.process+.process-title{display:block; position:fixed; top:6%;left:50%; width:50%; z-index:5; transition:opacity .6s .5s} .column-right section.process+.process-title:after{content:''; display:block; clear:both; width:100%} .column-right section.process+.process-title p{float:left; font-size:16px; font-weight:900; text-transform:uppercase} .column-right section.process+.process-title p span{display:inline-block; padding:8px 45px} .column-right section.process+.process-title p:first-child{width:30%; text-align:right} .column-right section.process+.process-title p:first-child span{background:#82bc00; border-top-left-radius:20px; border-bottom-left-radius:20px; color:#ffffff} .column-right section.process+.process-title p:last-child{width:70%} .column-right section.process+.process-title p:last-child span{background:#00313c; border-top-right-radius:20px; border-bottom-right-radius:20px; color:#82bc00} .column-right section.process+.process-title.v-enter, .column-right section.process+.process-title.v-leave-to{opacity:0}body.es .column-left>section.id-2 .txt-wrap{max-width:100%; padding-left:150px} @media only screen and (max-width:1440px){ .column-left section.process .txt-wrap,.column-left section.processos .txt-wrap{max-width:75%; margin-left:70px} .column-left section.process .txt-wrap .btn-back,.column-left section.process .txt-wrap h2, .column-left section.processos .txt-wrap .btn-back,.column-left section.processos .txt-wrap h2{margin-bottom:10px} .column-right section.process ol.processes-list>li>h3{font-size:47px}} @media only screen and (max-width:1024px){ .column-right section.process .process-title{display:block; position:absolute; top:35px; left:0; width:100%; z-index:5; transition:none} .column-right section.process .process-title p{float:left; font-size:13px; font-weight:700; text-transform:uppercase} .column-right section.process .process-title p span{display:inline-block; padding:8px 20px} .column-right section.process .process-title p:first-child{width:30%;text-align:right} .column-right section.process .process-title p:first-child span{background:#facd00; border-top-left-radius:20px; border-bottom-left-radius:20px; color:#000} .column-right section.process .process-title p:last-child{width:70%} .column-right section.process .process-title p:last-child span{background:#000; border-top-right-radius:20px;border-bottom-right-radius:20px;color:#facd00} .column-right section.process ol.processes-list>li{padding:35px 0} .column-right section.process ol.processes-list>li:first-child{padding:100px 0 35px} .column-right section.process ol.processes-list>li>h3{margin-bottom:30px; font-size:25px; font-weight:100} .column-right section.process ol.processes-list>li>h3 span:last-child{font-weight:300} .column-right section.process ol.processes-list>li h4{font-size:11px} .column-right section.process ol.processes-list>li h4 span:first-child{padding-right:12px} .column-right section.process ol.processes-list>li h4 span:last-child{padding-left:12px} .column-right section.process ol.processes-list>li ul.process-list>li .process-card{position:relative; top:initial; right:initial; max-width:100%; max-height:0; padding:0 30px; transition:all .6s;overflow:hidden} .column-right section.process ol.processes-list>li ul.process-list>li.active .process-card{opacity:1; visibility:visible; max-height:200vh; margin-top:20px; padding:30px 30px 20px} .column-right section.process ol.processes-list>li:last-child ul.process-list>li .process-card{bottom:initial} .column-right section.process+.process-title{display:none}body.es .column-left>section.id-2 .txt-wrap{padding-left:60px}} @media only screen and (min-width:768px) and (max-width:1024px){.column-left>section .txt-wrap p{max-width:85%}} @media only screen and (max-width:736px){ .column-left section.process .txt-wrap,.column-left section.processos .txt-wrap{max-width:100%;margin-left:0} .column-right section.process,.column-right section.processos{overflow-y:visible}body.es .column-left>section.id-2 .txt-wrap{padding-left:0}} .column-right section.cases{overflow-y:scroll} @media only screen and (max-width:736px){.column-right section.cases{overflow-y:visible}} .column-right section.about{padding:37px} .column-right section.about ul.flipping-cards li.flipping-card:first-child .back .top .top-wrap .img-wrap{width:54px;height:54px} .column-right section.about ul.flipping-cards li.flipping-card:nth-child(2) .back .top .top-wrap .img-wrap{width:56px;height:48px} .column-right section.about ul.flipping-cards li.flipping-card:last-child .back .top .top-wrap .img-wrap{width:72px;height:58px} .column-right section.about ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap>svg.i-agency{width:44px;height:44px} .column-right section.about ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap>svg.i-testimonials{width:46px;height:38px} .column-right section.about ul.flipping-cards li.flipping-card .back .top .top-wrap .img-wrap>svg.i-team{width:62px;height:48px} .column-right section.about ul.flipping-cards li.flipping-card .back .top .top-wrap p{padding:0 35px; max-width:400px} @media only screen and (max-width:1024px){.column-right section.about{overflow-y:scroll;padding:25px} .column-right section.about ul.flipping-cards li.flipping-card:last-child{width:100%}} .column-right section.single-case .case-content figure figcaption,.column-right section.single-case .case-content>h2, .column-right section.single-case .case-content>p{padding:0 50px} @media only screen and (max-width:736px){ .column-right section.about{overflow-y:visible}} .column-right section.single-case{background:#fff;overflow-y:scroll} .column-right section.single-case .top-image{position:relative;margin-bottom:50px} .column-right section.single-case .top-image>img{display:block;max-width:100%;height:auto} .column-right section.single-case .top-image>img:nth-of-type(2){position:absolute;top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%)} .column-right section.single-case .top-image>table{position:absolute; left:50%; transform:translate(-50%,0); -ms-transform:translate(-50%,0); bottom:40px;width:calc(100% - 100px)} .column-right section.single-case .top-image>table td,.column-right section.single-case .top-image>table th{width:25%} .column-right section.single-case .case-content blockquote:after, .column-right section.single-case .tabs:after{display:block;width:100%; content:''; clear:both} .column-right section.single-case .top-image>table td:last-child, .column-right section.single-case .top-image>table th:last-child{text-align:right} .column-right section.single-case .top-image>table th{color:#82bc00; font-size:15px; font-weight:700; text-align:left; text-transform:uppercase} .column-right section.single-case .top-image>table td{vertical-align:bottom; height:30px; color:#fff} .column-right section.single-case .case-content>h2{margin-bottom:19px; font-size:25px; font-weight:700} .column-right section.single-case .case-content>p{margin-bottom:25px; font-size:20px; line-height:1.6; font-weight:100} .column-right section.single-case .case-content>p:last-of-type{margin-bottom:45px} .column-right section.single-case .case-content figure{margin-bottom:40px} .column-right section.single-case .case-content figure img{display:block;max-width:100%;height:auto} .column-right section.single-case .case-content figure figcaption small{display:block; padding-top:10px; color:rgba(0,0,0,.45);font-size:20px; font-weight:100} .column-right section.single-case .case-content figure+blockquote{position:relative; margin-top:-97px; z-index:5} .column-right section.single-case .case-content blockquote{background:#82bc00; padding:30px 70px 40px 40px; border-radius:5px; margin:0 50px 50px} .column-right section.single-case .case-content blockquote>img{float:left; max-width:75px; height:auto; border-radius:50%} .column-right section.single-case .case-content blockquote h4{padding:15px 0 0 100px; margin-bottom:20px; font-size:20px; font-weight:600} .column-right section.single-case .case-content blockquote p{padding-left:100px; font-size:20px; line-height:1.5; font-weight:300} .column-right section.single-case .tabs{padding:0 50px 50px} .column-right section.single-case .tabs .tab-list{display:-ms-flexbox; display:flex; margin-bottom:28px; -ms-flex-flow:row wrap; flex-flow:row wrap} .column-right section.single-case .tabs .tab-list li{border:1px solid #bcbcbc; border-left:none; cursor:pointer; -ms-flex:1 auto; flex:1 auto; text-align:center; transition:background .3s ease-in-out; padding:6px 0 2px} .column-right section.single-case .tabs .tab-list li:first-child{border-left:1px solid #bcbcbc} .column-right section.single-case .tabs .tab-list li.active{background:#facd00} .column-right section.single-case .tabs .tab-list li img{display:inline-block;max-width:100%;height:auto} .column-right section.single-case .more-projects-content h3{padding:0 50px; margin-bottom:25px; font-size:22px; text-transform:uppercase; font-weight:600} .column-right section.single-case .more-projects-content ul.cases-list li.case-card{height:inherit} .column-right section.single-case .more-projects-content ul.cases-list li.case-card:nth-child(3n+1){width:50%} @media only screen and (max-width:1024px){.column-right section.single-case .tabs .tab-list{-ms-flex-wrap:wrap;flex-wrap:wrap} .column-right section.single-case .tabs .tab-list li{-ms-flex-positive:1;flex-grow:1;width:calc(100% / 3)} .column-right section.single-case .tabs .tab-list li:nth-child(1n+3){border-left:1px solid #bcbcbc} .column-right section.single-case .tabs .tab-list li:nth-child(1n+4){border-top:none}} @media only screen and (max-width:768px){.column-right section.single-case .top-image{margin-bottom:25px} .column-right section.single-case .top-image>img:nth-of-type(2){-ms-transform:translate(-50%,-50%) scale(.7); transform:translate(-50%,-50%) scale(.7)} .column-right section.single-case .top-image>table{bottom:20px;width:calc(100% - 50px)} .column-right section.single-case .top-image>table td,.column-right section.single-case .top-image>table th{width:initial;padding:0 5px} .column-right section.single-case .case-content figure figcaption, .column-right section.single-case .case-content>h2, .column-right section.single-case .case-content>p{padding:0 25px} .column-right section.single-case .top-image>table th{font-size:10px} .column-right section.single-case .top-image>table td{font-size:13px;height:20px} .column-right section.single-case .case-content>h2{margin-bottom:9px;font-size:23px} .column-right section.single-case .case-content>p{margin-bottom:20px;font-size:18px} .column-right section.single-case .case-content figure{margin-bottom:24px} .column-right section.single-case .case-content figure figcaption small{padding-top:14px; font-size:14px} .column-right section.single-case .case-content figure+blockquote{margin-top:-50px} .column-right section.single-case .case-content blockquote{padding:20px;margin:0 25px 20px} .column-right section.single-case .case-content blockquote>img{width:38px;height:auto} .column-right section.single-case .case-content blockquote h4{padding:2px 0 0 60px;margin-bottom:5px;font-size:17px} .column-right section.single-case .case-content blockquote p{padding-left:60px;font-size:16px} .column-right section.single-case .tabs{padding:0 25px 25px} .column-right section.single-case .tabs .tab-list{margin-bottom:16px} .column-right section.single-case .more-projects-content h3{display:none}} .column-right section.single-content .related-content h3, .column-right section.the-agency .related-content h3{margin-bottom:25px; font-size:22px; font-weight:600; text-transform:uppercase} @media only screen and (max-width:736px){ .column-right section.single-case{overflow-y:visible}} .column-right section.single-content,.column-right section.the-agency{overflow-y:scroll} .column-right section.the-agency .related-content{padding:50px} .column-right section.single-content .txt-single-content .top p{padding-right:70px} .column-right section.single-content .banner-content a{display:block} .column-right section.single-content .banner-content a .desktop img{display:block;width:100%;height:auto} @media only screen and (min-width:1920px) {.column-right section.single-content .banner-content a .desktop{ position:relative;height:260px;overflow:hidden} .column-right section.single-content .banner-content a .desktop img{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%)}} .column-right section.single-content .banner-content a .mobile{display:none} .column-right section.single-content .related-content{padding:50px} .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card{width:calc(33.33% - 16px); margin:0 24px 0 0} .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card:last-child{margin:0} .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card .front figure figcaption p{width:initial; padding:0 20px; text-align:left} @media only screen and (max-width:1280px){ .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card .front figure figcaption p{padding:0 5%}} @media only screen and (max-width:1024px){ .column-right section.single-content .txt-single-content .top p{padding-right:0} .column-right section.single-content .related-content{padding:25px;} .column-right section.single-content .related-content h3{margin-bottom:25px; font-size:18px} .column-right section.single-content .related-content ul.flipping-cards li.flipping-card .back .top{height:181px} .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card{width:100%;margin:0 0 12px} .column-right section.single-content .related-content.services-content .flipping-cards .flipping-card:last-child{margin:0 0 12px}} @media only screen and (max-width:736px){.column-right section.single-content{overflow-y:visible} .column-right section.single-content .banner-content{background:#82bc00;padding:30px 0} .column-right section.single-content .banner-content a{display:block} .column-right section.single-content .banner-content a .desktop{display:none}.column-right section.single-content .banner-content a .mobile{ display:table; margin:0 auto; font-size:0; -ms-transform:translateX(-3%); transform:translateX(-3%)} .column-right section.single-content .banner-content a .mobile img{display:inline-block; vertical-align:middle; width:50px;height:auto} .column-right section.single-content .banner-content a .mobile p{display:inline-block; vertical-align:middle; color:#000; padding-left:28px; font-size:18px; line-height:1.4; text-transform:uppercase; font-weight:700}} .column-right section.testimonials{overflow-y:scroll}.column-right section.testimonials .related-content{padding:0 50px 50px} .column-right section.testimonials .related-content h3{margin-bottom:25px; font-size:22px; font-weight:600; text-transform:uppercase} @media only screen and (max-width:736px){.column-right section.testimonials{overflow-y:visible} .column-right section.testimonials .related-content{padding:25px} .column-right section.testimonials .related-content h3{font-size:18px}} .column-right section.meet-the-team{overflow-y:scroll} .column-right section.meet-the-team h2{margin-bottom:30px;font-size:30px;font-weight:600} .column-right section.meet-the-team .leaders-content{background:#fff;padding:50px 50px 45px} .column-right section.meet-the-team .leaders-content .leaders-list>li{margin-bottom:25px; overflow:hidden; border-radius:5px} .column-right section.meet-the-team .leaders-content .leaders-list>li:last-child{margin-bottom:0} .column-right section.meet-the-team .leaders-content .leaders-list>li figure{position:relative} .column-right section.meet-the-team .leaders-content .leaders-list>li figure img{display:block; width:50%; height:auto} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption{position:absolute; top:0; left:50%; width:50%; height:100%; background:#82bc00} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption:after{content:''; display:block; position:absolute; top:50px;left:-10px; width:0;height:0; border-top:10px solid transparent; border-bottom:10px solid transparent; border-right:10px solid #82bc00} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap{position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); width:100%;padding:0 40px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap h3{margin-bottom:5px; font-size:18px; font-weight:700; text-transform:uppercase} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap>p{margin-bottom:50px;font-size:20px} @media only screen and (min-width:1024px) and (max-width:1260px){ .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap{padding:0 20px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap>p{margin-bottom:20px}} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li{padding-bottom:16px; margin-bottom:15px; border-bottom:1px solid rgba(0,0,0,.1)} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li:after{content:''; display:block; clear:both;width:100%} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li:last-child{margin-bottom:0} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a{display:inline-block;position:relative} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a span{display:block; color:#000; font-size:18px; text-indent:30px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a>svg{position:absolute; top:50%; transform:translate(0,-50%); -ms-transform:translate(0,-50%); fill:#ffffff} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a>svg.i-facebook{width:8px;height:14px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a>svg.i-twitter{width:14px;height:11px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a>svg.i-linkedin{width:13px;height:13px} .column-right section.meet-the-team .people-content{background:#fff;padding:0 50px 25px} .column-right section.meet-the-team .people-content .people-list:after{content:''; display:block; clear:both; width:100%} .column-right section.meet-the-team .people-content .people-list>li{float:left; width:calc(50% - 12.5px); margin:0 25px 25px 0; border-radius:5px;overflow:hidden} .column-right section.meet-the-team .people-content .people-list>li:nth-child(2n+2){margin:0 0 25px} .column-right section.meet-the-team .people-content .people-list>li figure{position:relative} .column-right section.meet-the-team .people-content .people-list>li figure:after{content:''; position:absolute; bottom:0; left:0; width:100%; height:40%; z-index:5; background:linear-gradient(to bottom,transparent 20%,rgba(0,0,0,.65) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0 )} .column-right section.meet-the-team .people-content .people-list>li figure img{display:block; width:100%; height:auto; object-fit:cover} .column-right section.meet-the-team .people-content .people-list>li figure figcaption{position:absolute; bottom:10px; left:30px; z-index:10} .column-right section.meet-the-team .people-content .people-list>li figure figcaption h3{margin-bottom:7px; color:#82bc00; font-size:18px; text-transform:uppercase; font-weight:700} .column-right section.meet-the-team .people-content .people-list>li figure figcaption p{color:#fff;font-size:20px} .column-right section.meet-the-team .related-content{padding:50px 37px} .column-right section.meet-the-team .related-content h3{margin-bottom:25px; margin-left:13px; font-size:22px; font-weight:600; text-transform:uppercase} @media only screen and (max-width:1024px){.column-right section.meet-the-team h2{margin-bottom:20px;font-size:23px} .column-right section.meet-the-team .leaders-content{padding:25px} .column-right section.meet-the-team .leaders-content .leaders-list>li{margin-bottom:12px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure img{width:100%;height:auto;} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption{position:relative; top:intial; left:initial; width:100%; height:inherit} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption:after{top:-10px; left:50%; -ms-transform:translateX(-50%); transform:translateX(-50%); border-right:10px solid transparent; border-left:10px solid transparent; border-bottom:10px solid #82bc00; border-top:none} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap{position:relative; top:initial; -ms-transform:none; transform:none; padding:20px} .column-right section.meet-the-team .people-content,.column-right section.meet-the-team .related-content{padding:25px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap h3{margin-bottom:3px; font-size:16px; } .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap>p{margin-bottom:58px; font-size:18px} .column-right section.meet-the-team .leaders-content .leaders-list>li figure figcaption .info-wrap ul.social-list>li a span{font-size:16px; font-weight:300} .column-right section.meet-the-team .people-content .people-list>li{display:block; float:none;width:100%; margin:0 0 12px} .column-right section.meet-the-team .people-content .people-list>li:nth-child(2n+2){margin:0 0 12px} .column-right section.meet-the-team .people-content .people-list>li figure:after{height:40%; background:linear-gradient(to bottom,transparent 20%,rgba(0,0,0,.65) 100%); filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0 )} .column-right section.meet-the-team .people-content .people-list>li figure img{width:100%} .column-right section.meet-the-team .people-content .people-list>li figure figcaption{bottom:20px;left:20px} .column-right section.meet-the-team .people-content .people-list>li figure figcaption h3{margin-bottom:3px;font-size:16px} .column-right section.meet-the-team .people-content .people-list>li figure figcaption p{font-size:18px} .column-right section.meet-the-team .related-content h3{margin-bottom:25px;font-size:18px}} @media only screen and (max-width:736px){.column-right section.meet-the-team{overflow-y:visible}} .column-right section.error-404{position:relative;background:#facd00} .column-right section.error-404 .icon-wrap{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); width:292px;height:292px; border-radius:50%; background:#fff} .column-right section.error-404 .icon-wrap>svg{position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); fill:#505050; width:216px; height:238px} .column-left section.error-404 h2{font-size:142px} .column-left section.error-404 p{color:#facd00; font-size:29px; text-transform:uppercase; font-weight:300; font-style:italic} .column-left section.blog .txt-wrap,.column-left section.blog-post .txt-wrap{max-width:100%;padding-left:150px} .column-left section.blog .txt-wrap p,.column-left section.blog-post .txt-wrap p{max-width:calc(100% - 50px)} .column-left section.blog .txt-wrap form ::-webkit-input-placeholder, .column-left section.blog-post .txt-wrap form ::-webkit-input-placeholder{color:#fff} .column-left section.blog .txt-wrap form :-moz-placeholder,.column-left section.blog-post .txt-wrap form :-moz-placeholder{color:#fff} .column-left section.blog .txt-wrap form ::-moz-placeholder, .column-left section.blog-post .txt-wrap form ::-moz-placeholder{color:#fff} .column-left section.blog .txt-wrap form :-ms-input-placeholder,.column-left section.blog-post .txt-wrap form :-ms-input-placeholder{color:#fff} .column-left section.blog .txt-wrap form label,.column-left section.blog-post .txt-wrap form label{display:none} .column-left section.blog .txt-wrap form p,.column-left section.blog-post .txt-wrap form p{margin-bottom:35px} .column-left section.blog .txt-wrap form p:after,.column-left section.blog-post .txt-wrap form p:after{content:''; display:block;clear:both;width:100%} .column-left section.blog .txt-wrap form p .column,.column-left section.blog-post .txt-wrap form p .column{float:left; width:50%} .column-left section.blog .txt-wrap form p .column:first-child,.column-left section.blog-post .txt-wrap form p .column:first-child{padding:0 30px 0 0} .column-left section.blog .txt-wrap form p .column:last-child,.column-left section.blog-post .txt-wrap form p .column:last-child{padding:0 0 0 30px} .column-left section.blog .txt-wrap form p select,.column-left section.blog-post .txt-wrap form p select{-webkit-appearance:none; -moz-appearance:none; appearance:none;border-radius:0} .column-left section.blog .txt-wrap form p input,.column-left section.blog .txt-wrap form p select, .column-left section.blog .txt-wrap form p textarea, .column-left section.blog-post .txt-wrap form p input, .column-left section.blog-post .txt-wrap form p select, .column-left section.blog-post .txt-wrap form p textarea{width:100%; background:0 0; border:0; border-bottom:1px solid #e9e9e9; padding:5px 20px 5px 0; color:#fff; font-size:16px; font-weight:300} .column-left section.blog .txt-wrap form p small, .column-left section.blog-post .txt-wrap form p small{color:#fff;font-size:16px} .column-left section.blog .txt-wrap form p option, .column-left section.blog-post .txt-wrap form p option{color:#000} @media only screen and (max-width:1024px){ .column-left section.blog .txt-wrap,.column-left section.blog-post .txt-wrap{margin-left:0; padding-left:140px} .column-left section.blog .txt-wrap p,.column-left section.blog-post .txt-wrap p{max-width:calc(100% - 25px)} .column-left section.blog .txt-wrap form p .column, .column-left section.blog-post .txt-wrap form p .column{display:block; float:none; width:100%; margin-bottom:35px} .column-left section.blog .txt-wrap form p .column:first-child, .column-left section.blog .txt-wrap form p .column:last-child, .column-left section.blog-post .txt-wrap form p .column:first-child, .column-left section.blog-post .txt-wrap form p .column:last-child{padding:0}} @media only screen and (max-width:736px){.column-left section.blog,.column-left section.blog-post{padding:60px 25px 20px} .column-left section.blog .txt-wrap,.column-left section.blog-post .txt-wrap{margin-left:0;padding-left:0} .column-left section.blog .txt-wrap p,.column-left section.blog-post .txt-wrap p{max-width:100%} .column-left section.blog .txt-wrap form p, .column-left section.blog .txt-wrap form p:last-of-type span:last-of-type, .column-left section.blog-post .txt-wrap form p,.column-left section.blog-post .txt-wrap form p:last-of-type span:last-of-type{margin-bottom:0} .column-left section.blog .txt-wrap form p .column,.column-left section.blog-post .txt-wrap form p .column{display:block; float:none; width:100%; margin-bottom:20px} .column-left section.blog .txt-wrap form p .column:first-child, .column-left section.blog .txt-wrap form p .column:last-child, .column-left section.blog-post .txt-wrap form p .column:first-child, .column-left section.blog-post .txt-wrap form p .column:last-child{padding:0} .column-left section.blog .txt-wrap form p input, .column-left section.blog .txt-wrap form p select, .column-left section.blog .txt-wrap form p textarea, .column-left section.blog-post .txt-wrap form p input,.column-left section.blog-post .txt-wrap form p select, .column-left section.blog-post .txt-wrap form p textarea{font-family:futura-pt,sans-serif} .column-left section.blog .txt-wrap form p small,.column-left section.blog-post .txt-wrap form p small{font-size:11px}}