*{ margin: 0px; padding: 0px; } .content{ width: 1080px; margin: 0px auto; display: block; } .clear{ clear: both; } body{ font-family: 'Open Sans', sans-serif; background: @branco; color: @preto; overflow-x: hidden; transition: all 0.6s; position: relative; } /********** DEFINIÇÕES **********/ @font-face{font-family:revicons;src:url(../fonts/revicons.woff);font-weight:400;} @branco: #ffffff; @preto: #282828; @rosa: #ee859b; @azul: #2da1f9; .right{float: right;} .left{float: left;} .spacer{ display: block; height: 100px; } .btn{ text-decoration: none; color: @branco; text-align: center; font-weight: 700; text-transform: uppercase; display: block; margin: 15px 0px; padding: 8px 20px; background: @rosa; border-radius: 10px; width: max-content; width: -moz-fit-content; font-size: 14px; border: none; font-family: 'Open Sans', sans-serif; cursor: pointer; } .btn:hover{ background: @azul; } ::selection { background: @rosa; color: @branco; } ::-moz-selection { background: @rosa; color: @branco; } #cover { position: fixed; height: 100%; width: 100%; top:0; left: 0; background: #fff url(../img/loader.gif) no-repeat center center; z-index:9999; } .grecaptcha-badge { visibility: hidden; } *:focus {outline: 0;} p.publicidade{ margin-bottom: 0px !important; text-transform: uppercase; font-size: 12px !important; color: #ccc; } /*** ANIMAÇÕES ***/ @keyframes hideshow{ 0%{ opacity: 0; } 100%{ opacity: 1; } } /*** HEADER ***/ .preheader{ text-align: right; padding: 20px 10px 0px 10px; p{ font-family: 'Alegreya', serif; display: inline-block; font-weight: 700; vertical-align: top; line-height: 35px; } .redes{ display: inline-block; ul{ list-style-type: none; li{ display: inline-block; margin: 0px 0px 0px 5px; svg{ width: 30px; height: auto; path{ fill: @preto; } } } li:hover{ svg{ path{ fill: @rosa; } } } } } } .header{ padding: 0px 0px; position: relative; z-index: 10; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,ffffff+10,9ee0e5+10,9ee0e5+90,ffffff+90,ffffff+100 */ background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 10%, #9ee0e5 10%, #9ee0e5 90%, #ffffff 90%, #ffffff 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 0%,#ffffff 10%,#9ee0e5 10%,#9ee0e5 90%,#ffffff 90%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 0%,#ffffff 10%,#9ee0e5 10%,#9ee0e5 90%,#ffffff 90%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ a.logo svg{ width: 140px; height: auto; float: left; } ul{ list-style-type: none; float: right; margin-top: 55px; vertical-align: middle; li{ display: inline; margin: 10px; transition: all 0.6ms ease; position: relative; a{ text-decoration: none; color: @preto; text-transform: uppercase; font-weight: 700; } ul{ display: none; position: absolute; left: 0; top: 20px; margin-top: 0px; li{ display: block; margin: 0px 0px; width: 200px; background: #fff; padding: 15px 20px; a{ color: @preto; } } } &:hover{ ul{ display: block; } } } li:hover, li.current_page_item{ a{ color: @rosa; } } } } /*** FOOTER ***/ .topo{ display: none; img{ position: fixed; right: 30px; bottom: 20px; width: 40px; mix-blend-mode: multiply; } } .footer{ background: #d9e7e8; padding: 50px 0px; .third.right{ text-align: right; } .third{ width: 30%; display: inline-block; vertical-align: top; svg{ width: 40%; } h4{ text-transform: uppercase; font-size: 24px; display: block; margin-bottom: 20px; color: @branco; } ul{ list-style-type: none; li{ margin: 10px; a{ text-decoration: none; color: @preto; font-weight: bold; text-transform: uppercase; } a:hover{ color: @rosa; } } } p{ font-family: 'Alegreya', serif; display: inline-block; font-weight: 700; vertical-align: top; line-height: 35px; } .redes{ display: inline-block; ul{ list-style-type: none; li{ display: inline-block; margin: 0px 0px 0px 5px; svg{ width: 30px; height: auto; path{ fill: @preto; } } } li:hover{ svg{ path{ fill: @rosa; } } } } } .linktopo{ margin-top: 50px; float: right; svg{ width: 30px; height: auto; path{ fill: @branco; } } } } } .posfooter{ background: #9cb7b9; padding: 30px 0px; p{ font-size: 12px; color: @branco; display: block; float: left; } p.desenvolvido{ float: right; img{ width: 60px; height: auto; } } } /*** HOME ***/ .slider{ margin: 50px 0px 30px 0px; padding-bottom: 40px; border-bottom: 4px solid #f2f2f2; .boxsetas{ width: 120px; margin: -50px 0px 0px 350px; .setas{ width: 30px; height: 30px; color: @preto; font-size: 30px; margin: 10px 10px 0px 15px; cursor: pointer; display: inline-block; } .setas:hover{ color: @rosa; } } .bullets{ width: 55%; float: right; margin-top: 5px; .demo{ width: 22.6%; height: 5px; display: inline-block; background: @azul; border-radius: 20px; margin: 10px 5px; cursor: pointer; } .demo:hover{ background: @rosa; } .demo.w3-white{ background: @preto; } } .slide{ .txt{ animation: hideshow; animation-duration: 1s; opacity: 0; animation-fill-mode:forwards; overflow: hidden; float: left; width: 40%; } img{ animation: hideshow; animation-duration: 1s; opacity: 0; animation-fill-mode:forwards; height: 450px; display: block; float: right; width: 55%; object-fit: cover; } h4{ color: @preto; margin-bottom: 10px; } h1{ color: @preto; margin-bottom: 15px; text-transform: uppercase; a{ text-decoration: none; color: @preto; font-size: 40px; line-height: 40px; } } h1 a:hover{ color: @rosa; } p{ font-size: 14px; color: @preto; margin-bottom: 20px; font-family: 'Alegreya', serif; } a.leiamais{ text-decoration: none; color: @preto; text-transform: uppercase; font-weight: bold; margin-top: 40px; display: block; } a.leiamais:hover{ color: @azul; } } } /*************** HOME *******************/ .planeje{ padding: 80px 0px; margin: 20px 0px; background: url(../img/tik-de-viagem-mockup-roteiro.png) no-repeat center center; h2{ color: @azul; text-transform: uppercase; font-size: 36px; margin-bottom: 10px; } p{ font-family: 'Alegreya', serif; margin-bottom: 10px; font-size: 20px; } } .searchnews{ font-family: 'Alegreya', serif; margin-bottom: 30px; form{ input[type=text], input[type=email]{ background: #f2f2f2; border: none; color: #aaaaaa; font-family: 'Alegreya', serif; padding: 10px 0px 10px 10px; display: inline-block; margin: 0px 5px; width: 200px; } input[type=image]{ display: inline-block; float: right; } input[type=image]:hover{ opacity: 0.5; } } .news{ h3{ font-style: italic; } #wpcf7-f1681-o1, #wpcf7-f1681-o2{ float: right; margin-left: 10px; width: 350px; p{ display: inline-block; float: left; } } h3,form{ display: inline-block; input{ display: inline-block; margin-bottom: 0px; margin-top: 0px; } input[type=submit]{ text-decoration: none; color: @branco; text-align: center; font-weight: 700; text-transform: uppercase; display: block; margin: 2px 0px; padding: 8px 20px; background: @rosa; border-radius: 10px; width: max-content; width: -moz-fit-content; font-size: 14px; border: none; font-family: 'Open Sans', sans-serif; cursor: pointer; } input[type=submit]:hover{ background: @azul; } } } } /*************** PÁGINA INTERNA *******************/ .paginainterna{ padding: 50px 0px; border-bottom: 4px solid #f2f2f2; margin-bottom: 30px; width: 67%; float: left; p{ display: block; margin-bottom: 20px; font-family: 'Alegreya', serif; a{ text-decoration: none; color: @rosa; font-weight: bold; } a:hover{ color: @azul; } } .wpcf7-form{ input, textarea{ width: 100%; padding: 5px; } label{ text-transform: uppercase; font-weight: bold; } input[type=submit]{ text-decoration: none; color: @branco; text-align: center; font-weight: 700; text-transform: uppercase; display: block; margin: 15px 0px; padding: 8px 20px; background: @rosa; border-radius: 10px; width: max-content; font-size: 14px; border: none; font-family: 'Open Sans', sans-serif; cursor: pointer; } input[type=submit]:hover{ background: @azul; } } .clipping{ padding: 20px 10px; border-bottom: 1px solid #cecece; h3{ font-size: 26px; display: block; margin-bottom: 10px; font-weight: 700; color: @preto; } p{ font-family: 'Alegreya', serif; font-weight: 700; opacity: 0.5; } .link{ color: @preto; font-family: 'Alegreya', serif; font-weight: bold; opacity: 1; a{ text-decoration: none; color: @rosa; svg{ width: 20px; height: auto; margin-left: 10px; path{ fill: @rosa; } } } a:hover{ color: @azul; svg{ path{ fill: @azul; } } } } } #newslist{ color: @rosa; margin-bottom: 40px; p{ display: inline; line-height: 30px; margin-right: 20px; } select{ display: inline; padding: 5px 10px; border: 1px solid @rosa; color: @rosa; cursor: pointer; background: @branco; } select:hover{ border-color: @azul; color: @azul; } } .box{ padding: 20px 0px; border-bottom: 1px solid #cecece; img{ float: left; border: 1px solid #f2f2f2; margin-right: 20px; max-width: 35%; height: auto; } .txt{ float: right; width: 60%; padding: 5px 0px; font-family: 'Alegreya', serif; h3{ font-size: 26px; display: block; margin-bottom: 10px; font-weight: 700; color: @azul; } h5{ color: @rosa; } .link{ color: @preto; font-family: 'Alegreya', serif; font-weight: bold; a{ text-decoration: none; color: @rosa; svg{ width: 20px; height: auto; margin-left: 10px; path{ fill: @rosa; } } } a:hover{ color: @azul; svg{ path{ fill: @azul; } } } } } } } .titlepaginainterna{ padding: 50px 0px 50px 25px; margin-bottom: 30px; display: block; h3{ color: @branco; text-transform: uppercase; font-size: 42px; } } /******/ .section-title { font-size: 28px; margin-bottom: 20px; padding-bottom: 20px; font-weight: 400; display: inline-block; position: relative; } .section-title:after, .section-title:before { content: ''; position: absolute; bottom: 0; } .section-title:after { height: 2px; background-color: rgba(252, 92, 15, 0.46); left: 25%; right: 25%; } .section-title:before { width: 15px; height: 15px; border: 3px solid #fff; background-color: #fc5c0f; left: 50%; transform: translatex(-50%); bottom: -6px; z-index: 9; border-radius: 50%; } /* CAROUSEL STARTS */ .customer-feedback .owl-item img { width: 85px; height: 85px; } .feedback-slider-item { position: relative; padding: 60px; margin-top: -40px; } .customer-name { margin-top: 15px; margin-bottom: 25px; font-size: 20px; text-align: center; } .feedback-slider-item p { line-height: 1.875; text-align: center; } .customer-rating { background-color: #eee; border: 3px solid #fff; color: rgba(1, 1, 1, 0.702); font-weight: 700; border-radius: 50%; position: absolute; width: 47px; height: 47px; line-height: 44px; font-size: 15px; right: 0; top: 77px; text-indent: -3px; } .thumb-prev .customer-rating { top: -20px; left: 0; right: auto; } .thumb-next .customer-rating { top: -20px; right: 0; } .customer-rating i { color: rgb(251, 90, 13); position: absolute; top: 10px; right: 5px; font-weight: 600; font-size: 12px; } /* GREY BACKGROUND COLOR OF THE ACTIVE SLIDER */ .feedback-slider-item:after { content: ''; position: absolute; left: 20px; right: 20px; bottom: 50px; top: 50px; background-color: #f6f6f6; border: 1px solid rgba(251, 90, 13, .1); border-radius: 10px; z-index: -1; } .thumb-prev, .thumb-next { position: absolute; z-index: 99; top: 45%; width: 98px; height: 98px; left: -90px; cursor: pointer; -webkit-transition: all .3s; transition: all .3s; } .thumb-next { left: auto; right: -90px; } .feedback-slider-thumb img { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; } .feedback-slider-thumb:hover { opacity: .8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; } .customer-feedback .owl-nav [class*="owl-"] { position: relative; display: inline-block; bottom: 45px; transition: all .2s ease-in; } .customer-feedback .owl-nav i { background-color: transparent; color: rgb(251, 90, 13); font-size: 25px; } .customer-feedback .owl-prev { left: -15px; } .customer-feedback .owl-prev:hover { left: -20px; } .customer-feedback .owl-next { right: -15px; } .customer-feedback .owl-next:hover { right: -20px; } /* DOTS */ .customer-feedback .owl-dots { position: absolute; left: 50%; transform: translateX(-50%); bottom: 35px; } .customer-feedback .owl-dot { display: inline-block; } .customer-feedback .owl-dots .owl-dot span { width: 11px; height: 11px; margin: 0 5px; background: #fff; border: 1px solid rgb(251, 90, 13); display: block; -webkit-backface-visibility: visible; -webkit-transition: all 200ms ease; transition: all 200ms ease; border-radius: 50%; } .customer-feedback .owl-dots .owl-dot.active span { background-color: rgb(251, 90, 13); } /* RESPONSIVE */ @media screen and (max-width: 767px) { .feedback-slider-item:after { left: 30px; right: 30px; } .customer-feedback .owl-nav [class*="owl-"] { position: absolute; top: 50%; transform: translateY(-50%); margin-top: 45px; bottom: auto; } .customer-feedback .owl-prev { left: 0; } .customer-feedback .owl-next { right: 0; } }