/* ===================================================================================================================================== */ /* ### DESKTOP 16X19 E 4X3 */ /* ===================================================================================================================================== */ header {} .mbr-navbar__section { background:rgba(38, 38, 38, 0.8); position:fixed; z-index:1000 ;width:100%; top:75px; height:70px; /*background-image: linear-gradient(to top, rgba(0,0,0,0.0), rgba(0,0,0,0.95) );*/ } .mbr-navbar--stuck .mbr-navbar__section { background:rgba(38, 38, 38, 0.95); /* ##262626 */ /* background-image: linear-gradient(to top, rgba(0,0,0,0.95), rgba(0,0,0,0.95) );*/ top: 0; /*box-shadow: 0px 2px 5px rgba(0, 0, 0, 0.3);*/ height:70px; /* #e0f513*/ } /*LOGO ICO */ .mbr-navbar__section #logo_ico{ height:100%!important; } .mbr-navbar--stuck .mbr-navbar__section #logo_ico { /* width:160px; */ } .pro .img_box{ width:100%; padding-bottom: 100%; position:relative; overflow:hidden;} .pro .img_box .img{ width:100%; height:100%; position:absolute; top:0px; left:0px; background-repeat:no-repeat !important; background-position:center !important; background-size:cover!important;} .pro a:hover .img_box .img{filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9;} /* PRODUTOS*/ .pro:hover { } .pro .shadow{ margin:0 0 0 0 ; text-align:center; cursor:pointer;} .pro .img_box{ width:100%; padding-bottom: 100%; position:relative; overflow:hidden;} .pro .img_box .img{ width:100%; height:100%; position:absolute; top:0px; left:0px; background-repeat:no-repeat !important; background-position:center !important; background-size:cover!important;} .pro a:hover .img_box .img{filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9;} .pro .img_box{ width:100%; padding-bottom: 100%; position:relative; overflow:hidden;} .pro .img_box .img{ width:100%; height:100%; position:absolute; top:0px; left:0px; background-repeat:no-repeat !important; background-position:center !important; background-size:cover!important;} .pro a:hover .img_box .img{filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9;} .pro img{ width:100%; filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9;} /* =================== */ /* NAV WIDE */ nav_w {width:1200px; margin:auto; text-align:center; line-height:0 !important; height:100%; position:relative; display:table;} .mbr-navbar--stuck .mbr-navbar__section #social_top {filter:alpha(opacity=00); -moz-opacity:0.0; opacity:0.0; visibility:collapse} nav_w b{} /*LOGO ICO */ #logo_ico{ width:200px; display:block; float:left; margin-right:15px; background-repeat:no-repeat; background-position:center; background-size:100% auto; background-image:url(img/logo_ico.png?2); } /*PHONE */ #phone { position:absolute; width:150px; display:table; top:-45px; right:5px; line-height:30px; font-size:18px;letter-spacing:0px; text-align:right; border:#DC9A23 solid 0PX !important; } #phone p{ color:#FFFFFF; height:100%; display:table-cell; vertical-align:middle; } #phone b{ color:#FFFFFF; font-weight:700!important; } /* SOCIAL */ #social_top { position:absolute; width:50%; display:table; top:-45px; padding:0 20px 0 0; right:150px; border-right: #DC9A23 solid 1PX !important;} #social_top a{ height:32px; width:32px; float:right; background-color:#DC9A23; margin-left:5px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; background-position:center; background-repeat:no-repeat; background-size:contain; } #social_top a:hover{background-color:#81b340;} #social_top .s1 { background-image:url(img/s1.png)} #social_top .s2 { background-image:url(img/s2.png)} #social_top .s3 { background-image:url(img/s3.png)} #social_top .s4 { background-image:url(img/s4.png)} #social_top .s5 { background-image:url(img/s5.png)} #social_top .s6 { background-image:url(img/s6.png)} #social_top .s7 { background-image:url(img/s7.png)} #social_base {} #social_base a{ height:50px; width:50px; background-color:#DC9A23; display:inline-block; background-color:#000000; margin-left:7px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px; background-position:center; background-repeat:no-repeat; background-size:contain; } #social_base a:hover{background-color:#81b340;} #social_base .s1 { background-image:url(img/s1.png)} #social_base .s2 { background-image:url(img/s2.png)} #social_base .s3 { background-image:url(img/s3.png)} #social_base .s4 { background-image:url(img/s4.png)} #social_base .s5 { background-image:url(img/s5.png)} #social_base .s6 { background-image:url(img/s6.png)} #social_base .s7 { background-image:url(img/s7.png)} /* MENU */ #menu {float:right; display:table; line-height:30px; font-size:14px; letter-spacing:0px; margin-top:0px; height:100% ; } #menu s{color:#ffffff; padding:0 0px 0px 0px; height:100%; display:table-cell; vertical-align:middle; text-decoration:none!important; } #menu a{color:#ffffff; padding:0 12px 0px 12px; height:100%; display:table-cell; vertical-align:middle; border:transparent solid 2px;} #menu a:hover{ color:#ffffff; background: #DC9A2390} #menu .active { color:#ffffff; background: #DC9A23} #menu #e-1{ display:none; border-bottom:#E4E4E4 solid 1px; clear:both; padding-top:20px; margin-bottom:15px; } #menu #e-2{ display:none; border-bottom:#E4E4E4 solid 1px; clear:both; padding-top:15px; margin-bottom:15px;} #menu #e-3{ display:none; } #menu #link_10, #menu #link_11{ display:none; } /* BOL ICONS*/ fume{ display:none; } .view_nav { } .view_fume{ } #ico_menu,#ico_close,#ico_up,.down{box-shadow: 0px 0px 0px 6px rgba(255, 255, 255, 0.7); position:fixed; border: #FF9900 solid 2px; background-repeat:no-repeat; background-position:center; background-size:contain; width:45px; height:45px; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;} #ico_menu {display:none; background-image:url(img/ico_menu.png); z-index:400; top:25px; right:15px; background-color:rgba(255, 255, 255, 0.7); } #ico_close{display:none; background-image:url(img/ico_close.png); z-index:300; top:25px; right:15px; background-color:#ffffff; } #ico_up {display:block; background-image:url(img/ico_up.png); z-index:100; bottom:25px; right:15px; background-color:rgba(255, 255, 255, 0.7); /*-ms-transform:rotate(180deg); -webkit-transform:rotate(180deg); transform:rotate(180deg);*/} .mbr-navbar--stuck #ico_up { filter:alpha(opacity=0);-moz-opacity:0; opacity:0; } .mbr-navbar--stuck .mbr-navbar__section #ico_up { filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0; } .down {display:block; position: absolute!important; background-image:url(img/ico_down.png); left:50%; z-index:90; width:65px; height:65px; background-color:rgba(255, 255, 255, 0.9); -webkit-border-radius:50px; -moz-border-radius:50px; border-radius:50px;} .down p{position: absolute!important; color:#e0f513; display:block!important; font-size:16px; top:0; left:0; line-height:65px; padding-left:80px;} /* =========================== */ /* NAV R */ nav_r {height:100vh; display:block; text-align:right; position:fixed; top:0; right:-33px; filter:alpha(opacity=00); -moz-opacity:0.0; opacity:0.0; visibility:collapse;} .mbr-navbar--stuck .mbr-navbar__section nav_r { filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; visibility:visible; right:3px;} nav_r #menu_table{ display:table;height:100%; } /* MENU */ #menu_r {display:table-cell; height:100%; vertical-align:middle; font-weight:400; line-height:35px; font-size:15px;letter-spacing:0px; } #menu_r a{color:#ffffff; padding:0 62px 0 0; display:block; height:35px; position:relative; background-image:url(img/nav.png); background-position:center right; background-repeat:no-repeat; } #menu_r a p { filter:alpha(opacity=00); -moz-opacity:0.0; opacity:0.0; display:block; position: absolute; right:50px; overflow:hidden; visibility:collapse; padding: 0 15px 0 15px; -webkit-border-radius:0 10px ; -moz-border-radius:0 10px; border-radius:0 10px; } #menu_r a:hover{background-image:url(img/nav_.png); } #menu_r a:hover p{ visibility:visible; filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; background: #DC9A23} #menu_r .active {background-image:url(img/nav_.png); color: #ffffff; } /* =========================== */ /* ELEMENTOS GERAIS */ article{width:1200px; margin:auto;} .mais_portfolio{ color:#ffffff; background:#e0f513; padding:25px 30px 22px 30px; font-size:14px; display: inline-table; -webkit-border-radius:30px; -moz-border-radius:30px; border-radius:30px;} .bt_pt { display:inline-block; padding:15px 40px 10px 40px; background:#000000; color:#FFFFFF; margin:auto; -webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px} .bt_pt:hover { display:inline-block; background:#e0f513; color:#000;} circle{ display:block; width:20px; position:relative; background: #ffffff; border:#e0f513 solid 1px; padding:8px; -webkit-border-radius:40px; -moz-border-radius:40px; border-radius:40px;z-index:10;} circle hr{ background:#e0f513; width:20px; height:20px; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px; z-index:10;} .line-time-1{ background:#e0f513; width:20px; height:20px; -webkit-border-radius:20px; -moz-border-radius:20px; border-radius:20px;} .line-time-2{ height:100%; border-left:#e0f513 solid 1px; position:absolute; left:50%; top:0px; z-index:0; } .t_1{font-family:'Yanone Kaffeesatz' !important; font-size:65px; line-height:75px; letter-spacing:-1px; font-weight:300;} .t_1 b{font-family:'Yanone Kaffeesatz' !important; font-weight:400!important; } .t_2{font-family:'Yanone Kaffeesatz' !important; font-size:50px; line-height:60px; letter-spacing:-1px; font-weight:300;} .t_2 b{font-family:'Yanone Kaffeesatz' !important; font-weight:400!important; } .t_3{font-family:'Yanone Kaffeesatz' !important; font-size:35px; line-height:45px; letter-spacing:0px; font-weight:300;} .t_3 b{font-family:'Yanone Kaffeesatz' !important; font-weight:400!important; } .t_4{font-family:'Yanone Kaffeesatz' !important; font-size:30px; line-height:40px; letter-spacing:0px; font-weight:300;} .t_4 b{font-family:'Yanone Kaffeesatz' !important; font-weight:400!important; } .t_5{font-size:30px!important; line-height:40px; letter-spacing:0px; font-weight:400;} .t_6{font-size:16px!important; line-height:20px; letter-spacing:0px; font-weight:400; } /* =========================== */ /* HOME */ #palco { width:100%; height: -webkit-calc( 100vh + 150px ); height: -moz-calc( 100vh + 150px ); height: calc( 100vh + 150px ); display:table; min-height:700px!important; } #palco_cel_logo { height:100%; display:table-cell; vertical-align: middle; text-align:left } #palco .logo{ margin:0 0 170px 150px; width:300px;} /* =========================== */ /* produtos */ .produto { border:#C71E25 solid 7px; cursor:default; display:block; margin:20px; padding:20px; /*-webkit-border-radius:15px; -moz-border-radius:15px; border-radius:15px; */ } .produto .bt { cursor:pointer; background:#333333; color:#fff; width: 100%; float:none; box-shadow: 0px 0px 0px 0px rgba(255, 255, 255, 1.0)!important; margin-left:0px; margin-top:10px; padding:15px; border:0px !important; display:block!important; font-weight:600; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; } .produto .bt:hover { background:#C71E25; color:#fff; margin-top:10px; padding:15px; font-weight:600; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; } /* =========================== */ /* SLIDES */ #slide_portfolio_desk{ } #slide_portfolio_desk iframe{ width:100%; height:320px; margin:0; } #slide_portfolio_tab{ } #slide_portfolio_tab iframe{ width:100%; height:240px; margin:0; } #slide_portfolio_cel{ } #slide_portfolio_cel iframe{ width:100%; height:315px; margin:0; } #slide_depoimentos{ width:100%; padding-top:550px; position:relative; } #slide_depoimentos iframe{ position:absolute; top:0px; left:0; width:100%; height:100%; } /* =========================== */ /* FORMS CONTATO*/ input,textarea,select { width:100%; width: -webkit-calc(100% - 20px); width: -moz-calc(100% - 20px); width: calc(100% - 20px); max-width:100%; margin: 18px 0 0 0; padding: 14px 10px 14px 10px; background:#ffffff; border:0px; border: #000000 solid 2px; font-size:15px; height:25px; line-height:25px; resize: none; -webkit-border-radius:12px; -moz-border-radius:12px; border-radius:12px; -webkit-appearance: none;/*limpa confg pre existente*/ } input[type=submit] { margin: 18px 0 0 10px; padding:2px 0 0px 0; width:150px; background: #000000; color:#ffffff ; border: 0px; float:left; height:57px; font-weight:600; /* box-shadow: 0px 0px 0px 7px rgba(255, 255, 255, 1.0)!important; */ } input[type=submit]:hover { background: #e0f513; color:#000000 ; cursor: pointer; } input[type=submit]:disabled { background: #999999; border:#999999 solid 2px; color:#cccccc ; cursor: default; } /* CHECKBOX */ label{ cursor:pointer; position:relative; text-align:left; width:160px; background:#ffffff url(img/bot_.png) left center no-repeat; border:#000000 solid 2px ; height:55px; margin: 18px 15px 10px 3px; padding:0 0 0 49px; display: table; float:left; -webkit-border-radius:12px; -moz-border-radius:12px; border-radius:12px; box-shadow: 0px 0px 0px 7px rgba(220, 220, 220, 1.0); } label:hover{ } label p{ -moz-transition:0s; -o-transition:0s; transition:0s; } .importante {color:red ; border:red solid 2px ; -moz-transition:0s; -o-transition:0s; transition:0s;} .valid {background:#FFFFFF url(img/bot.png) left center no-repeat; border:#389925 solid 2px!important; } #auth_ p{line-height:11px; font-size:11px; padding-bottom:3px; } label cel{ padding:5px 5px 5px 5px; display: table-cell; vertical-align:middle!important; } input[type=checkbox] { width:1px; height:1px; left:30px; top:30px; position:absolute; } /* PLACE HOLD */ input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { } input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{ color:#cccccc; } /* FOCUS */ input:focus,textarea:focus ,select:focus { outline: none; border:#e0f513 solid 2px; color: #000000; } /*tira borda amarelo on focus*/ input:-webkit-autofill { -webkit-box-shadow: 0 0 0px 100px #e1e1e1 inset;}/*tira bg amarelo auto complet*/ /*input[type=text]:hover, textarea:hover,select:hover { background: #f1f1f1;}*/ /* ===================================================================================================================================== */ /* DESKTOP 4X3 E TABLET HORIZONTAL -- MENOR QUE Xpx -- */ /* ===================================================================================================================================== */ @media (max-width: 1230px) { article{width:970px;} nav_w {width:970px; } } /* ===================================================================================================================================== */ /*OBRIGATÓRIO DESKTOP P/ MAIO QUE Xpx */ /* ===================================================================================================================================== */ @media (min-width: 980px) { } /* ===================================================================================================================================== */ /* ### TABLET VERTIAL E CELULAR HORIZONTAL -- */ /* ===================================================================================================================================== */ @media (max-width: 980px) { .mbr-parallax-background {background-repeat:no-repeat !important; background-position:center !important; background-size:cover!important;} .mbr-navbar__section, .mbr-navbar--stuck .mbr-navbar__section{background:rgba(255, 255, 255, 0); top:0px; height:60px;} /* =================== */ /* NAV WIDE */ nav_w{width:100%; width: -webkit-calc(100% - 30px); width: -moz-calc(100% - 30px); width: calc(100% - 30px);} .mbr-navbar--stuck .mbr-navbar__section nav_w {filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; visibility: visible} /* LOGO ICO */ #logo_ico{display: none; } /* PHONE */ #phone {display:none; } /*SOCIAL */ #social_top { display:none!important; } /* MENU #menu {display:table; z-index:200; position:fixed; border-right:#e0f513 solid 35px; text-align:left!important; background:#ffffff; height:auto; top:-90%; right:0; padding:15px 30px 15px 20px; font-weight:500; line-height:50px; font-size:17px; letter-spacing:-1px; width: -webkit-calc(100% - 85px)!important; width: -moz-calc(100% - 85px)!important; width: calc(100% - 85px)!important;} #menu s{height:50px!important; display: inline-table;} #menu a{color:#3F3F41; padding:8px 15px 8px 15px; margin-right:10px; height:50px!important; text-align:center; display: inline-table; } #menu a:hover{background-color: #339900 ; background-image:none} #menu .active {background-color: #339900; background-image:none} #menu #e-1{ display:block; } #menu #e-2{ display:block;} #menu #e-3{height:50px!important; display: inline-table;} #menu #link_10, #menu #link_11{ display:inline-table; } */ /* MENU */ #menu {display:block; z-index:200; position:fixed; border:0; border-right:#ffffff solid 30px!important; background:#f9f9f9; height:110%!important; top:0!important; right:-110%; padding:20px 0 0 0; font-weight:400; line-height:30px!important; width: -webkit-calc(100% - 90px)!important; width: -moz-calc(100% - 90px)!important; width: calc(100% - 90px)!important; } #menu s{display: none;} #menu a{color: #222222; padding:5px 55px 5px 4px; border-bottom:0; height:30px!important; display: block; text-align:right!important; width: -webkit-calc(100% - 60px); width: -moz-calc(100% - 60px); width: calc(100% - 60px); background-repeat:no-repeat; background-position:right; background-image: url(img/nav.png); } #menu a:hover {background-color:#ffffff; background-image: url(img/nav_.png);background-repeat:no-repeat; background-position:right;color:#222222;} #menu .active { background-color:#ffffff; background-image: url(img/nav_.png); background-repeat:no-repeat; background-position:right; color:#222222; } #menu #e-1{ display:block; } #menu #e-2{ display:block; } #menu #e-3{display:none;} #menu #link_10, #menu #link_11 { width: -webkit-calc(100% - 85px); width: -moz-calc(100% - 85px); width: calc(100% - 85px); display:block; padding:0px 30px 20px 29px!important; background: #f9f9f9 !important;} /* BOL ICONS*/ .view_nav{right:-30px!important;top:0px!important;} #ico_close{ } /* BOL ICONS*/ fume { visibility: collapse; display:block; z-index:101; position:fixed; background:rgba(0, 0, 0, 0); height:150%; width:110%; top:-2px; left:-2px;} .view_nav{top:-2px!important;} .view_fume{visibility: visible; background:rgba(0, 0, 0, 0.6)!important;} #ico_menu { display:block;} #ico_close{ display:block; } #ico_up{ } /* =========================== */ /* ### NAV R*/ nav_r { display:none; } /* =========================== */ /* ELEMENTOS GERAIS */ article {width:100%; width: -webkit-calc(100% - 30px); width: -moz-calc(100% - 30px); width: calc(100% - 30px);} .STL_1 { position:absolute; background:#330099; top:0; left:50%; margin-left:-700px; border-right:1400px solid transparent !important; border-top-width:260px; border-top-style:solid;} .STL_2 { position:absolute; top:0; left:50%; margin-left:-700px; border-left: 1400px solid transparent !important; border-top-width:260px; border-top-style:solid;} .STR_1 { position:absolute; top:0; left:50%; margin-left:-600px; border-left: 1200px solid transparent !important; border-top-width:260px; border-top-style:solid;} .STR_2 { position:absolute; top:0; left:50%; margin-left:-700px; border-right:1400px solid transparent !important; border-top-width:260px; border-top-style:solid;} .SBL_1 { position:absolute; bottom:0; left:50%; margin-left:-700px; border-right:1400px solid transparent !important; border-bottom-width:260px; border-bottom-style:solid;} .SBL_2 { position:absolute; bottom:0; left:50%; margin-left:-700px; border-left: 1400px solid transparent !important; border-bottom-width:260px; border-bottom-style:solid;} .SBR_1 { position:absolute; bottom:0; left:50%; margin-left:-600px; border-left: 1200px solid transparent !important; border-bottom-width:260px; border-bottom-style:solid;} .SBR_2 { position:absolute; bottom:0; left:50%; margin-left:-700px; border-right:1400px solid transparent !important; border-bottom-width:260px; border-bottom-style:solid;} /* =========================== */ /* HOME */ #palco {width:100%; height: -webkit-calc( 100vh + 100px ); height: -moz-calc( 100vh + 100px ); height: calc( 100vh + 100px ); min-height:500px!important; } #palco_cel_logo { width:100%; height:100%; display:table-cell; vertical-align: middle; text-align:center } #palco .logo{ margin:0 auto 190px auto; width:45%;} } /* ===================================================================================================================================== */ /* ### CELULAR VERTICAL */ /* ===================================================================================================================================== */ @media (max-width: 400px) { /* MENU #menu {display:block; z-index:200; position:fixed; border:0; border-right:#DC9A23 solid 35px!important; background:#f9f9f9; height:110%!important; top:0!important; right:-110%; padding:20px 0 0 0; font-weight:300; line-height:30px!important; width: -webkit-calc(100% - 90px)!important; width: -moz-calc(100% - 90px)!important; width: calc(100% - 90px)!important; } #menu s{display: none;} #menu a{ font-weight:bold; color:#3F3F41; padding:5px 55px 5px 4px; border-bottom:0; height:30px!important; display: block; text-align:right!important; width: -webkit-calc(100% - 60px); width: -moz-calc(100% - 60px); width: calc(100% - 60px); background-repeat:no-repeat; background-position:right; background-image: url(img/nav.png); } #menu a:hover { background-image: url(img/nav_.png);} #menu .active { background-image: url(img/nav_.png); color:#FFFFFF } #menu #e-1{ display:block; } #menu #e-2{ display:block; } #menu #e-3{display:none;} #menu #link_10, #menu #link_11 { width: -webkit-calc(100% - 85px); width: -moz-calc(100% - 85px); width: calc(100% - 85px); display:block; padding:0px 30px 0px 29px!important; background: #f9f9f9 !important;} */ /* BOL ICONS*/ .view_nav{right:-30px!important;top:0px!important;} #ico_close{ } /* =========================== */ /* HOME */ #palco {width:100%; height: -webkit-calc( 100vh + 100px ); height: -moz-calc( 100vh + 100px ); height: calc( 100vh + 100px ); min-height:500px!important; } #palco_cel_logo { width:100%; height:100%; display:table-cell; vertical-align: middle; text-align:center } #palco .logo{ margin:0 auto 190px auto; width:45%;} #palco {width:100%; height: -webkit-calc( 100vh + 100px ); height: -moz-calc( 100vh + 100px ); height: calc( 100vh + 100px ); min-height:500px!important; } #palco_cel_logo { width:100%; height:100%; display:table-cell; vertical-align: middle; text-align:center } #palco .logo{ margin-bottom:190px; width:80%;} }