/* To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates and open the template in the editor. */ /* Created on : 02/04/2016, 16:52:38 Author : CarlosGarcia */ /* * My Settings */ .icon_container {margin: 5px 5px 0 0;} .ic_mada_facebook {background: url(/media/images/icons/ico_facebook_32x32.png) no-repeat; height: 32px; width: 32px; opacity: 0.2;} .ic_mada_twitter {background: url(/media/images/icons/ico_twitter_32x32.png) no-repeat; height: 32px; width: 32px; opacity: 0.2} .ic_mada_google {background: url(/media/images/icons/ico_google_32x32.png) no-repeat; height: 32px; width: 32px; opacity: 0.2} .ic_mada_whatsapp {background: url(/media/images/icons/ico_whatsapp_32x32.png) no-repeat; height: 32px; width: 32px; opacity: 0.2} .ic_facebook_inline {background: url(/media/images/icons/icon_facebook_inline.png) no-repeat; height: 20px; width: 103px; margin: 3px 0 0 5px;} .divider_svg {background-position: center bottom; background-repeat: no-repeat; background-size: 100% auto; bottom: 0; content: ""; height: 100%; left: 0; position: relative; right: 0;} /* LayoutBuilder */ .dark_block {padding: 5px; background: rgba(0, 0, 0, 0.5);} .dark_block2 {padding: 5px; background: rgba(0, 0, 0, 0.5); border-left: 4px solid #b05927} .bt_toggle_txt {padding: 1px 10px; border: 1px solid #ccc; background: #f1f1f1; margin: 0 2px; border-radius: 3px; cursor: pointer;} .ui-datepicker {width: auto!important;} .border-fit {border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc} .ic_mada_facebook:hover, .ic_mada_twitter:hover, .ic_mada_google:hover, .ic_mada_whatsapp:hover {opacity: 1;} .mega_it_shadow {background-color: #fff; box-shadow: 0 0 20px 2px rgba(174, 174, 174, 0.75); margin-bottom: 30px; display: flex;} .mega_it_shadow_right {background-color: #fff; box-shadow: 0 0 20px 2px rgba(174, 174, 174, 0.75); margin-bottom: 30px; display: block;} .img-mega-it::after, .img-mega-it::before {background-color: #fff; content: ""; display: block; height: 5px; left: 0; position: absolute; top: -2px; width: 100%;} .img-mega-it {box-shadow: 0 0 20px 2px rgba(174, 174, 174, 0.75); float: left; padding: 40px; position: relative;} .img-mega-it_right {box-shadow: 0 0 20px 2px rgba(174, 174, 174, 0.75); float: right; padding: 40px; position: relative;} .conteudo-mega-it {float: left;} .wrapper-full {overflow: hidden} .snap_left {margin-left: -700px;position: absolute;text-align: left; top: 0;} .snap_left img {max-width: none; position: absolute; left: 0px;} .snap_right {right: 0px;position: absolute;top: 0;} .snap_right img {max-width: none; } .bg-cover {background-size: cover!important;} #product-quick .large-image img {max-height: 370px;} /* Tags */ .ctnTags .tag {background: #fff; border: 1px solid #f1f1f1; border-radius: 4px; float: left; font-size: 0.8em!important; margin: 0 6px 10px 0; padding: 7px;} .rating .fa {font-size: 13px;} .modal-dialog {z-index: 1099;} .bg-danger, .bg-success, .bg-info, .bg-alert {padding: 15px} #mural .list-group-item.active, #mural .list-group-item.active:focus, #mural .list-group-item.active:hover {border: none;} .navbar.navbar-static-top {margin-bottom: 0px;} #menu-wrap .nav > li, #main-nav .nav > li {float: left;} #menu-wrap .collapse, #main-nav .collapse {display: block;} .dropdown > .bgMenuOp, .has-dropdown > .bgMenuOp, .megamenu li > .bgMenuOp {height: 100%;opacity: 0.5;position: absolute; width: 100%; z-index: 0;} .navbar-static-top {border-width: 0 0 0px!important;} .nav-collapse .nav > li > a:hover, .nav-collapse .dropdown-menu a:hover, .row-list li:hover {color: #E62222!important;} .searchCtnSolid {display: none;} .flex {display: flex;} .list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover{border: 1px solid #ccc; background: none;} #menu_ecommerce_support .list-group-item.active, #menu_ecommerce_support .list-group-item.active:focus, #menu_ecommerce_support .list-group-item.active:hover {border: 1px solid #ccc; background: #fbfbfb;} #menu_ecommerce_support .list-group-item.active, #menu_ecommerce_support .list-group-item.active:focus, #menu_ecommerce_support .list-group-item.active:hover {color: #bfbfbf;} light {font-weight: 200;} .bg-white-header {position: absolute; background: #fff; width: 50%; height: 100%; left: -600px;} .ctn_barra_guerrilha_flat {width: 100%; height: 10px;} .bg-white-full-absolute {position: absolute; background: #fff; height: 100%; width: 100%;} .btn-input-height {padding-top: 6px!important;padding-bottom: 6px!important;} .btn-gray-dark {background: #969696!important; color: #fff!important;} .p_default {font-size: 14px;} .overflow-x {overflow-x: hidden;} .icon_whatsapp {background: url("/media/images/icons/icon_whatsapp.png"); height: 20px; width: 20px; display: flex;} .icon_telephone {background: url("/media/images/icons/icon_telefone.png"); height: 20px; width: 20px; display: flex;} .dropcase, dropcase {float: left;font-family: Georgia,"Times New Roman",Times,serif;font-size: 300%;line-height: 1em;margin-right: 0.3em;padding-bottom: 0.3em; position: relative;text-transform: uppercase;top: 6px;} .bar, bar {background: #ccc; color: #000; padding: 10px; display: block;} .bar_inverse, bar_inverse {background: #333; color: #fff; padding: 10px;display: block;} .bar_blue, bar_blue {background: #1BB6F2; color: #fff; padding: 10px;display: block;} .bar_red, bar_red {background: #9F0327; color: #fff; padding: 10px;display: block;} /* Galeria */ .gal_default {max-height: 300px; overflow: hidden;} .search_field_input {background-color: #f1f1f1;border: medium none; border-radius: 15px!important; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.075) inset; font: italic 300 12px/1 Arial,sans-serif; margin: 5px 0; padding: 9px 30px 9px 15px;} .bt_search_glamo {color: #ccc;cursor: pointer;font-size: 1.2em;margin: 13px 0 0;position: absolute;right: 15px;} #crop-avatar-modal-content, #crop-image-modal-content {max-height: 600px!important; overflow-y: scroll;display: block;position: relative;} .nav-tabs > li > a {background: #e1e1e1; } .mgR_resp, .mgR {margin-right: 10px;} .mgL_resp, .mgL {margin-left: 10px;} .full-width {width: 100%!important;} .mg0 {margin: 0px!important;} .menu a, .sub-menu a, .submenu_dropdow a {color: #333!important} .menu li a:hover, .sub-menu li a:hover, .submenu_dropdow:hover a {color: #E62222!important} .megamenu li:hover .submenu_dropdow a {color: #333!important} .breadcrumb {background-color: #f5f5f5; border-radius: 4px; list-style: outside none none; margin: 0 0 20px; padding: 8px 15px; display: inline-block!important} .brand {position: absolute} .theme.bg {background: #ea3a3c!important;} .carousel-control.left, .carousel-control.right {background-image: none;} .d_block {display: block!important} .mfp-close {line-height: none; background: #ea3a3c!important; border-radius: 50%; width: 40px; height: 40px; text-align: center;top: -10px!important; right: -10px!important; line-height: unset!important; opacity: 1!important; color: #fff!important; } .mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close {padding: 0px!important;} .fullCP .carousel-control {width: auto;} .auto {width: auto!important; min-width: auto!important;} .carArrowRight {right: 0px;} .player_pp {bottom: 0;display: inline; margin-left: -60px; left: 50%; width: 120px; position: absolute;} .player_pp_icons {padding: 0px 7px; background: #333; margin-right: 5px; cursor: pointer} .mgFooter {padding-bottom: 40px; clear: both; position: relative} .ctnSearchBig {margin: auto; text-align: center; width: auto!important; left: 50%; display: inline-flex} .box-shadow-plus {box-shadow: 10px 4px 10px #333} .box-shadow-plus2 {box-shadow: 0px 0px 36px #333} .box-shadow-plus3 {box-shadow: 0px 1px 9px #333} .pos-fixed {position: fixed;} comment_simple {border-left: 7px solid; padding: 10px 10px; font-style: italic; margin-left: 20px; display: inline-block} .italic {font-style: italic;} .capitalize {text-transform:uppercase } a.capitalize-first {display: block } .no-radius, .btn-main.no-radius, .btn-default.no-radius {border-radius: 0px!important;} .fontawsome {font-family:'FontAwesome'!important;} p {line-height:normal;} .capitalize-first:first-letter {text-transform: uppercase;} .ctnBlockBlack {padding: 50px; background: rgba(0,0,0, 0.7); position: relative; margin: 10px 0;} .navbar-form.form-search {margin: 0px 0px 0px 0px} /*Vinhepaper*/ .height-auto {height: auto;} .fullCP.so-deal .item-timer .time-item {line-height: 24px!important;border-bottom: none; border-left: 1px solid #fff} .fullCP.so-deal .num-time {border: none;} .search-form {position: relative; display: table} .p_r_10 {padding-right: 10px;} .fullCT .carousel-control.left {left: -30px!important;} .hero-unit, .hero_texture {padding: 10px 0px; -webkit-border-radius: 6px;-moz-border-radius: 6px;border-radius: 6px; box-shadow: 0px 2px 5px;} .hero-unit {background: #fff;} .hero2 {background: rgba(0, 0, 0, 0) linear-gradient(#fff, #efefef) repeat scroll 0 0; border: 1px solid #e3e3e3; border-radius: 10px; box-sizing: border-box; margin: 10px; min-height: 250px; position: relative;} .base_decor {background-color: #fff;background-image: none; border: 1px solid #ccc; border-radius: 0px; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; color: #555; display: block; font-size: 14px; height: 34px;line-height: 1.42857; padding: 6px 12px; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; width: 100%;} .base_decor_plus {background-color: #fff;background-image: none;border: 1px solid #ccc; border-radius: 0;box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;display: block; padding: 6px 12px;; width: 100%;} /* Eventos */ .bt_cld {background: rgba(0, 0, 0, 0) none repeat scroll 0 0;float: right;border: medium none;} #table_sm table th {font-size: 10px;} #table_sm > tbody > tr > td, #table_sm > tbody > tr > th, #table_sm > tfoot > tr > td, #table_sm > tfoot > tr > th, #table_sm td, #table_sm > thead > tr > th {padding: 5px!important;} .table-calendar .today {background: #009526 none repeat scroll 0 0 !important; color: #fff;} .table-calendar a {color: #333;} .table-calendar .today a, .table-calendar .linked-day a {color: #fff;} .table-calendar .linked-day {background: #abcbe4 none repeat scroll 0 0 !important;} .step { background: white none repeat scroll 0 0; border-radius: 1px; float: left; padding: 7px 13px; position: relative; text-align: center; width: 33.33%; } #likebox-wrapper * { width: 100% !important; } .step_line { border-bottom: 16px solid transparent; border-left: 16px solid #fff; border-top: 16px solid transparent; height: 0; left: 105%; margin: 0; position: absolute; top: 1px; width: 0; z-index: 1008; } .step_line.backline { border-bottom: 20px solid transparent; border-left: 20px solid #f7f7f7; border-top: 20px solid transparent; position: absolute; top: -3px; z-index: 1006; } .step_line.step_complete { background: rgba(0, 0, 0, 0) none repeat scroll 0 center; border-left: 16px solid #357ebd; } .step_complete { background: #357ebd none repeat scroll 0 0; } .step_complete a.check-bc, .step_complete a.check-bc:hover, .afix-1, .afix-1:hover { color: #eee; } .check-bc, .check-bc:hover { color: #222; } .bg-border-ctn .so-deal .extraslider-inner {padding-bottom: 1px!important} .fullCT .module {margin-bottom: 0px;} .module .label-sale {left: unset!important; right: 0px;} .module .bg_lancamento_small {margin-left: -20px; margin-top: -20px; } .item-absolute-upon {position: absolute; top: 90px; z-index: 100; } .my-mfp-medium .mfp-content {width: 690px; height: 435px;} /* Vitrine MAxxi */ .vtmxx_refined .owl2-carousel .owl2-stage-outer {overflow: visible} .vtmxx_refined h4, .vtmxx_details h4 {text-align: center!important;} .vtmxx_refined .addToCart, .vtmxx_refined .wishlist, .vtmxx_refined .compare, .vtmxx_refined .btn_mx_quickview {top: 160px!important;} .vtmxx_refined .addToCart {left: 60px!important} .vtmxx_refined .wishlist {left: 100px!important} .vtmxx_refined .compare {left: 140px!important;} .vtmxx_refined .btn_mx_quickview {left: 180px!important;} .showEasy, .vtmxxShowEasy {opacity: 0;} .product-item-container:hover .vtmxxShowEasy {opacity: 1;} .product-item-container:hover {box-shadow: 0 1px 6px 0px rgba(0,0,0,0.5)!important;} .bubble-vitrine {background: #ff9900 none repeat scroll 0 0; border-radius: 50%; color: #fff; font-weight: bold; height: 45px; margin: -14px -14px 0 0; padding: 10px;position: absolute;right: 0;width: 45px; z-index: 1000;} /* Vitrine Maxxi */ #sticky_navigation_simple {position: fixed; top: -200px;-webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;} #menu_ecommerce_support .list-group a {border: none; padding: 0px; color: initial} hr.half2 {margin: 0px;} .navbar {min-height: auto;} label {font-weight: bold;} .dropdown span {font-size: 14px; font-weight: bold;} .lead {font-size: 15px;} .sF3em {font-size: 3em} .no-border {border: none;} .no-background {background: none!important;} .no-fullCT {padding: 0px!important; margin: 0px!important; background: none!important;} .show_resp2 {display: none;} .no-float {float: none!important} .login_container_signed {display: none;} .menu .row-list a, #menuGroup .row-list a, #menuTexture .row-list a, .menu_wrap_mb_bg .row-list a, #menuGroup .row-list a {color: #333;} .profile-container {position: absolute; width: 143px; top: 150px; left: 5%; z-index: 1000;} .profile-container ul, .profile-container li {margin: 0;padding: 0; list-style-type: none;} .profile {background: #f6f6f6; float: left; padding: 4px; border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out;} /* Perfil Flututante */ .avatar img {display: block; border-radius: 3px; -o-border-radius: 3px; -ms-border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px;} .follow {margin: 4px 0 0 0;} .follow button {display: block; width: 100%; margin: 0; cursor: pointer;} .profile-list, .profile-list a {overflow: hidden;width: 100%; box-sizing: border-box; color: #767b7e; font-size: 13px;} .profile-list li { cursor: pointer; background: #ffffff; border-top: 1px solid #e5e6e6; padding: 15px 10px;} .profile-list li:last-child {border-radius: 0 0 3px 3px;; -o-border-radius: 0 0 3px 3px;-ms-border-radius: 0 0 3px 3px; -moz-border-radius: 0 0 3px 3px; -webkit-border-radius: 0 0 3px 3px;} .profile-list li [class^="icon-"] {margin: 0 3px 0 0;} .profile-list .profile {border-radius: 3px 3px 0 0; position: relative;} .profile-list li { -webkit-transform-origin: 50% 0%; -o-transform-origin: 50% 0%; transform-origin: 50% 0%; -webkit-transform: perspective(250px) rotateX(-90deg); -o-transform: perspective(250px) rotateX(-90deg); transform: perspective(250px) rotateX(-90deg); -moz-box-shadow: 0px 2px 10px rgba(0,0,0,0.05);} .profile-list .first { -webkit-transition: 0.2s linear 0.8s; -o-transition: 0.2s linear 0.8s; transition: 0.2s linear 0.8s;} .profile-list .second { -webkit-transition: 0.2s linear 0.6s; -o-transition: 0.2s linear 0.6s; transition: 0.2s linear 0.6s;} .profile-list .third { -webkit-transition: 0.2s linear 0.4s; -o-transition: 0.2s linear 0.4s; transition: 0.2s linear 0.4s;} .profile-list .fourth { -webkit-transition: 0.2s linear 0.2s; -o-transition: 0.2s linear 0.2s; transition: 0.2s linear 0.2s;} .profile-container:hover .profile { border-radius: 3px 3px 0 0;-o-border-radius: 3px 3px 0 0;-ms-border-radius: 3px 3px 0 0;-moz-border-radius: 3px 3px 0 0;-webkit-border-radius: 3px 3px 0 0;} .profile-container:hover .profile-list li {-webkit-transform: perspective(350px) rotateX(0deg);-o-transform: perspective(350px) rotateX(0deg);transform: perspective(350px) rotateX(0deg);-webkit-transition: 0.2s linear 0s;-o-transition: 0.2s linear 0s;transition: 0.2s linear 0s;} .profile-container:hover .profile-list .second {-webkit-transition-delay: 0.2s;-o-transition-delay: 0.2s;transition-delay: 0.2s;} .profile-container:hover .profile-list .third {-webkit-transition-delay: 0.4s;-o-transition-delay: 0.4s;transition-delay: 0.4s;} .profile-container:hover .profile-list .fourth {transition-delay: 0.6s;-o-transition-delay: 0.6s;transition-delay: 0.6s;} /* Share count */ a.post-share {display: block;width: 94px;height: 46px;float: left;margin: 10px 0px 0px 0px;background: #3e599a url(/media/images/layout/social_icons/sidebar-share.png) no-repeat 0 0;text-decoration:none;width: 197px;text-indent: 50px;ont: 15px/46px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;color: #ffffff; line-height: 45px;} a.post-share:hover {opacity: 0.8;text-decoration: none;cursor: pointer;} a.post-share span {padding: 12px;display: block;float:right;background-color: #4665af;color: #ffffff;vertical-align: middle;font: 16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;text-align: center;text-indent: 0;} a.post-share.facebook {background: #3e599a url(/media/images/layout/social_icons/sidebar-share.png) no-repeat 0 1px;margin-right: 10px;} a.post-share.facebook span {background-color: #4665af;} a.post-share.twitter {background: #4b8cbe url(/media/images/layout/social_icons/sidebar-share.png) no-repeat -0px -111px;margin-right: 10px;} a.post-share.twitter span {background-color: #529fda;} a.post-share.gplus {background: #b8382e url(/media/images/layout/social_icons/sidebar-share.png) no-repeat -0px -50px;margin-right: 10px;} a.post-share.gplus span {background-color: #d24238;} a.post-share.stumble {background: #e15131 url(/media/images/layout/social_icons/sidebar-share.png) no-repeat -0px -165px;} a.post-share.stumble span {background-color: #fd5d3b;} .pagination { margin: 20px auto; display: table; position: relative; } .pagination ul { display: inline-block; *display: inline; /* IE7 inline-block hack */ *zoom: 1; margin-left: 0; margin-bottom: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); } .pagination ul > li { display: inline; } .pagination ul > li > a, .pagination ul > li > span { float: left; padding: 4px 12px; line-height: 20px; text-decoration: none; background-color: #ffffff; border: 1px solid #dddddd; border-left-width: 0; color: #333; } .pagination ul > li > a:hover, .pagination ul > .active > a, .pagination ul > .active > span { background-color: #f5f5f5; } .pagination ul > .active > a, .pagination ul > .active > span { color: #999999; cursor: default; } .pagination ul > .disabled > span, .pagination ul > .disabled > a, .pagination ul > .disabled > a:hover { color: #999999; background-color: transparent; cursor: default; } .pagination ul > li:first-child > a, .pagination ul > li:first-child > span { border-left-width: 1px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-left-radius: 4px; } .pagination ul > li:last-child > a, .pagination ul > li:last-child > span { -webkit-border-top-right-radius: 4px; -moz-border-radius-topright: 4px; border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-bottomright: 4px; border-bottom-right-radius: 4px; } .pagination-centered { text-align: center; } .pagination-right { text-align: right; } .pagination-large ul > li > a, .pagination-large ul > li > span { padding: 11px 19px; font-size: 17.5px; } .pagination-large ul > li:first-child > a, .pagination-large ul > li:first-child > span { -webkit-border-top-left-radius: 6px; -moz-border-radius-topleft: 6px; border-top-left-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-bottomleft: 6px; border-bottom-left-radius: 6px; } .pagination-large ul > li:last-child > a, .pagination-large ul > li:last-child > span { -webkit-border-top-right-radius: 6px; -moz-border-radius-topright: 6px; border-top-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; -moz-border-radius-bottomright: 6px; border-bottom-right-radius: 6px; } .pagination-mini ul > li:first-child > a, .pagination-small ul > li:first-child > a, .pagination-mini ul > li:first-child > span, .pagination-small ul > li:first-child > span { -webkit-border-top-left-radius: 3px; -moz-border-radius-topleft: 3px; border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-bottomleft: 3px; border-bottom-left-radius: 3px; } .pagination-mini ul > li:last-child > a, .pagination-small ul > li:last-child > a, .pagination-mini ul > li:last-child > span, .pagination-small ul > li:last-child > span { -webkit-border-top-right-radius: 3px; -moz-border-radius-topright: 3px; border-top-right-radius: 3px; -webkit-border-bottom-right-radius: 3px; -moz-border-radius-bottomright: 3px; border-bottom-right-radius: 3px; } .pagination-small ul > li > a, .pagination-small ul > li > span { padding: 2px 10px; font-size: 11.9px; } .pagination-mini ul > li > a, .pagination-mini ul > li > span { padding: 0 6px; font-size: 10.5px; } @media (max-width: 767px) { #menu-wrap {display:none} .right_resp, .left_resp {float: none!important} .left_resp_apply {float: left} .pd_0_resp {padding: 0px;} } @media (max-width: 480px) { .page-header h1 small {display: block; line-height: 20px; } .txt_right_resp, .txt_left_resp {text-align: unset!important} .baseTextBillboard { height: 100%!important;} .ctnTextBillBoard{ width: 80%!important; height: 150px!important;} .navbar .brand {position: relative;} .hide_resp, .liveChat, .textwidget, .profile-container.unfold {display: none!important} .btn-block-resp, .btn-full-resp {display: block; width: 100%!important; padding-left: 0; padding-right: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mgB0_resp {margin-bottom: 10px!important} .mgT0_resp {margin-top: 10px!important} .mgR_resp {margin-right: 0px;} .mgL_resp {margin-left: 0px;} .center_resp_apply {text-align: center} .ln_h_23 {line-height: 23px;} .carousel-caption-simple {display: block; position: relative;} .pagination ul > li > a, .pagination ul > li > span {padding: 4px 8px;} } @media (min-width: 480px) { .tablet-hidden{display: none;} } /* ================================= */ /* #Content Social icons ================================================== */ .widget_nav_menu{ margin-left:0px; margin-bottom:30px; display:inline-block; min-height:100%; height:100%; } .socialIconsInline {display: inline-block; margin: auto; position: relative; text-align: center;} .socialIconsInline li {float: left; margin-left: 10px;} .fa-search-position {position:absolute; vertical-align: middle; top: 10px; right: 5px;} .fa-search-position2 {position:absolute; right: 10px; margin-top: 8px;} .socialIcons { min-width:100%; width:100%; padding:0px; margin:0px; } .socialIcons li{ position: relative; display: inline; list-style: none; text-indent: -999px; float: left; width: 32px; height: 32px; overflow: hidden; margin-right: 4px; margin-bottom: 4px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .socialIcons li a{ background-repeat: no-repeat; background-position: 0 0; display: block; height: 32px; width: 32px; } .socialIcons li a:hover, .socialIcons li a:focus { background-color: transparent; } .socialIcons li:hover { background-position: 0 -32px; } .socialIcons .vimeo.normal {background: url(/media/images/layout/social_icons/main_content/vimeo.png) no-repeat;} .socialIcons .facebook.normal {background: url(/media/images/layout/social_icons/main_content/facebook.png) no-repeat;} .socialIcons .linkedin.normal {background: url(/media/images/layout/social_icons/main_content/linkedin.png) no-repeat;} .socialIcons .twitter.normal {background: url(/media/images/layout/social_icons/main_content/twitter1.png) no-repeat;} .socialIcons .twitter2.normal{background: url(/media/images/layout/social_icons/main_content/twitter2.png) no-repeat;} .socialIcons .pinterest.normal {background: url(/media/images/layout/social_icons/main_content/pinterest.png) no-repeat;} .socialIcons .flickr.normal {background: url(/media/images/layout/social_icons/main_content/flickr.png) no-repeat;} .socialIcons .yahoo1.normal {background: url(/media/images/layout/social_icons/main_content/yahoo1.png) no-repeat;} .socialIcons .yahoo2.normal {background: url(/media/images/layout/social_icons/main_content/yahoo2.png) no-repeat;} .socialIcons .googleplus.normal{background: url(/media/images/layout/social_icons/main_content/googleplus.png) no-repeat;} .socialIcons .stumbleupon.normal {background: url(/media/images/layout/social_icons/main_content/stumbleupon.png) no-repeat;} .socialIcons .skype.normal {background: url(/media/images/layout/social_icons/main_content/skype.png) no-repeat;} .socialIcons .youtube.normal{background: url(/media/images/layout/social_icons/main_content/youtube.png) no-repeat;} .socialIcons .rss.normal {background: url(/media/images/layout/social_icons/main_content/rss.png) no-repeat;} .socialIcons .instagram.normal {background: url(/media/images/layout/social_icons/main_content/instagram.png) no-repeat;} .socialIcons .homeicon.normal{background: url(/media/images/layout/social_icons/main_content/home.png) no-repeat;} .socialIcons .phone.normal {background: url(/media/images/layout/social_icons/main_content/phone.png) no-repeat;} .socialIcons .email.normal {background: url(/media/images/layout/social_icons/main_content/email.png) no-repeat;} /* #Footer Social icons ================================================== */ .socialIcons{ margin-left:0px; } .socialIcons li{ position: relative; display: inline; list-style: none; text-indent: -999px; float: left; width: 32px; height: 32px; overflow: hidden; margin-right: 2px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .socialIcons li a{ background-repeat: no-repeat; background-position: 0 0; display: block; height: 32px; width: 32px; } .socialIcons li a:hover, footer .socialIcons li a:focus { background-color: transparent; } .socialIcons li:hover { background-position: 0 32px; } .socialIcons .vimeo, .socialIconsLine .vimeo{background: url(/media/images/layout/social_icons/footer/vimeo.png) no-repeat;} .socialIcons .facebook, .socialIconsLine .facebook {background: url(/media/images/layout/social_icons/footer/facebook.png) no-repeat;} .socialIcons .linkedin, .socialIconsLine .linkedin {background: url(/media/images/layout/social_icons/footer/linkedin.png) no-repeat;} .socialIcons .twitter, .socialIconsLine .twitter {background: url(/media/images/layout/social_icons/footer/twitter1.png) no-repeat;} .socialIcons .twitter2, .socialIconsLine .twitter{background: url(/media/images/layout/social_icons/footer/twitter2.png) no-repeat;} .socialIcons .pinterest, .socialIconsLine .pintrest {background: url(/media/images/layout/social_icons/footer/pinterest.png) no-repeat;} .socialIcons .flickr, .socialIconsLine .flickr {background: url(/media/images/layout/social_icons/footer/flickr.png) no-repeat;} .socialIcons .googleplus, .socialIconsLine .googleplus{background: url(/media/images/layout/social_icons/footer/googleplus.png) no-repeat;} .socialIcons .stumbleupon, .socialIconsLine .stumbleupon {background: url(/media/images/layout/social_icons/footer/stumbleupon.png) no-repeat;} .socialIcons .skype, .socialIconsLine .skype {background: url(/media/images/layout/social_icons/footer/skype.png) no-repeat;} .socialIcons .youtube, .socialIconsLine .youtube{background: url(/media/images/layout/social_icons/footer/youtube.png) no-repeat;} .socialIcons .rss, .socialIconsLine .rss {background: url(/media/images/layout/social_icons/footer/rss.png) no-repeat;} .socialIcons .instagram, .socialIconsLine .instagram {background: url(/media/images/layout/social_icons/footer/instagram.png) no-repeat;} .socialIcons .homeicon, .socialIconsLine .homeicon{background: url(/media/images/layout/social_icons/footer/home.png) no-repeat;} .socialIcons .phone, .socialIconsLine .phone {background: url(/media/images/layout/social_icons/footer/phone.png) no-repeat;} .socialIcons .whatsapp, .socialIconsLine .whatsapp {background: url(/media/images/layout/social_icons/footer/whatsapp.png) no-repeat;} .socialIcons .email, .socialIconsLine .email {background: url(/media/images/layout/social_icons/footer/email.png) no-repeat;} input.email { padding-left: 36px!important} .socialIconsLine { min-width:100%; width:100%; padding:0px; margin:0px; } .socialIconsLine li{ position: relative; list-style: none; text-indent: -999px; width: 100%; height: 44px; margin-right: 4px; margin-bottom: 4px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; background-position: 0 -32px!important; text-indent:inherit; border-bottom: 2px dotted #ccc; padding: 4px 0 6px 0; } .socialIconsLine li a{ background-repeat: no-repeat; display: block; height: 32px; width: 100%; padding-left: 50px; } .socialIconsLine li a:hover, .socialIconsLine li a:focus { background-color: transparent; } /* FIM SOCIAL */ .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; line-height: 0; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; width: 100%; min-height: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; margin-left: 2.127659574468085%; *margin-left: 2.074468085106383%; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.127659574468085%; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.48936170212765%; *width: 91.43617021276594%; } .row-fluid .span10 { width: 82.97872340425532%; *width: 82.92553191489361%; } .row-fluid .span9 { width: 74.46808510638297%; *width: 74.41489361702126%; } .row-fluid .span8 { width: 65.95744680851064%; *width: 65.90425531914893%; } .row-fluid .span7 { width: 57.44680851063829%; *width: 57.39361702127659%; } .row-fluid .span6 { width: 48.93617021276595%; *width: 48.88297872340425%; } .row-fluid .span5 { width: 40.42553191489362%; *width: 40.37234042553192%; } .row-fluid .span4 { width: 31.914893617021278%; *width: 31.861702127659576%; } .row-fluid .span3 { width: 23.404255319148934%; *width: 23.351063829787233%; } .row-fluid .span2 { width: 14.893617021276595%; *width: 14.840425531914894%; } .row-fluid .span1 { width: 6.382978723404255%; *width: 6.329787234042553%; } .wrapper, .wrapper2 {background: none repeat scroll 0 0 white; border: 1px solid rgba(255, 255, 255, 0.5); box-shadow: 0 0 10px rgba(0, 0, 0, 0.3), 0 0 20px rgba(0, 0, 0, 0.1) inset; box-sizing: border-box; margin: 0px auto; max-width: 1250px; overflow: hidden; width: 100%; padding: 15px;} .wrapper2 {box-shadow: 0 0 40px rgba(0, 0, 0, 0.3), 0 0 50px rgba(0, 0, 0, 0.1) inset; margin: 40px auto; width: 90%;} .img-rounded { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .img-polaroid { padding: 4px; background-color: #fff; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1); } .img-circle { -webkit-border-radius: 500px; -moz-border-radius: 500px; border-radius: 500px; } .middle-size {width: 120px; height: 120px} .circle_regular {width: 40px; height: 40px; padding: 10px; border-radius: 50%; background: #fff; display: inline-block} .circle_normal {width: 120px; height: 120px; padding: 10px; border-radius: 50%; background: #fff; display: inline-block;} .circle_large {width: 150px; height: 150px; padding: 10px; border-radius: 50%; background: #fff; display: inline-block;} .main-border-white {border: 1px solid #fff;} .ctn_item_carousel {width: 600px; margin: 0 auto; position: relative} [class*="span"] { float: left; min-height: 1px; margin-left: 20px; } .span12 { width: 940px; } .span11 { width: 860px; } .span10 { width: 780px; } .span9 { width: 700px; } .span8 { width: 620px; } .span7 { width: 540px; } .span6 { width: 460px; } .span5 { width: 380px; } .span4 { width: 300px; } .span3 { width: 220px; } .span2 { width: 140px; } .span1 { width: 60px; } /* ============================= */ @media (max-width: 990px) { } @media (min-width: 768px) and (max-width: 979px) { h2.resp { font-size: 2em!important; } .span12 { width: 724px; } .span11 { width: 662px; } .span10 { width: 600px; } .span9 { width: 538px; } .span8 { width: 476px; } .span7 { width: 414px; } .span6 { width: 352px; } .span5 { width: 290px; } .span4 { width: 228px; } .span3 { width: 166px; } .span2 { width: 104px; } .span1 { width: 42px; } .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; line-height: 0; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; width: 100%; min-height: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; margin-left: 2.7624309392265194%; *margin-left: 2.709239449864817%; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.7624309392265194%; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.43646408839778%; *width: 91.38327259903608%; } .row-fluid .span10 { width: 82.87292817679558%; *width: 82.81973668743387%; } .row-fluid .span9 { width: 74.30939226519337%; *width: 74.25620077583166%; } .row-fluid .span8 { width: 65.74585635359117%; *width: 65.69266486422946%; } .row-fluid .span7 { width: 57.18232044198895%; *width: 57.12912895262725%; } .row-fluid .span6 { width: 48.61878453038674%; *width: 48.56559304102504%; } .row-fluid .span5 { width: 40.05524861878453%; *width: 40.00205712942283%; } .row-fluid .span4 { width: 31.491712707182323%; *width: 31.43852121782062%; } .row-fluid .span3 { width: 22.92817679558011%; *width: 22.87498530621841%; } .row-fluid .span2 { width: 14.3646408839779%; *width: 14.311449394616199%; } .row-fluid .span1 { width: 5.801104972375691%; *width: 5.747913483013988%; } input.span12, textarea.span12, .uneditable-input.span12 { width: 710px; } input.span11, textarea.span11, .uneditable-input.span11 { width: 648px; } input.span10, textarea.span10, .uneditable-input.span10 { width: 586px; } input.span9, textarea.span9, .uneditable-input.span9 { width: 524px; } input.span8, textarea.span8, .uneditable-input.span8 { width: 462px; } input.span7, textarea.span7, .uneditable-input.span7 { width: 400px; } input.span6, textarea.span6, .uneditable-input.span6 { width: 338px; } input.span5, textarea.span5, .uneditable-input.span5 { width: 276px; } input.span4, textarea.span4, .uneditable-input.span4 { width: 214px; } input.span3, textarea.span3, .uneditable-input.span3 { width: 152px; } input.span2, textarea.span2, .uneditable-input.span2 { width: 90px; } input.span1, textarea.span1, .uneditable-input.span1 { width: 28px; } } @media (min-width: 1200px) { [class*="span"] { float: left; min-height: 1px; margin-left: 30px; } .span12 { width: 1170px; } .span11 { width: 1070px; } .span10 { width: 970px; } .span9 { width: 870px; } .span8 { width: 770px; } .span7 { width: 670px; } .span6 { width: 570px; } .span5 { width: 470px; } .span4 { width: 370px; } .span3 { width: 270px; } .span2 { width: 170px; } .span1 { width: 70px; } .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; content: ""; line-height: 0; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; width: 100%; min-height: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; float: left; margin-left: 2.564102564102564%; *margin-left: 2.5109110747408616%; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.564102564102564%; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.45299145299145%; *width: 91.39979996362975%; } .row-fluid .span10 { width: 82.90598290598291%; *width: 82.8527914166212%; } .row-fluid .span9 { width: 74.35897435897436%; *width: 74.30578286961266%; } .row-fluid .span8 { width: 65.81196581196582%; *width: 65.75877432260411%; } .row-fluid .span7 { width: 57.26495726495726%; *width: 57.21176577559556%; } .row-fluid .span6 { width: 48.717948717948715%; *width: 48.664757228587014%; } .row-fluid .span5 { width: 40.17094017094017%; *width: 40.11774868157847%; } .row-fluid .span4 { width: 31.623931623931625%; *width: 31.570740134569924%; } .row-fluid .span3 { width: 23.076923076923077%; *width: 23.023731587561375%; } .row-fluid .span2 { width: 14.52991452991453%; *width: 14.476723040552828%; } .row-fluid .span1 { width: 5.982905982905983%; *width: 5.929714493544281%; } input.span12, textarea.span12, .uneditable-input.span12 { width: 1156px; } input.span11, textarea.span11, .uneditable-input.span11 { width: 1056px; } input.span10, textarea.span10, .uneditable-input.span10 { width: 956px; } input.span9, textarea.span9, .uneditable-input.span9 { width: 856px; } input.span8, textarea.span8, .uneditable-input.span8 { width: 756px; } input.span7, textarea.span7, .uneditable-input.span7 { width: 656px; } input.span6, textarea.span6, .uneditable-input.span6 { width: 556px; } input.span5, textarea.span5, .uneditable-input.span5 { width: 456px; } input.span4, textarea.span4, .uneditable-input.span4 { width: 356px; } input.span3, textarea.span3, .uneditable-input.span3 { width: 256px; } input.span2, textarea.span2, .uneditable-input.span2 { width: 156px; } input.span1, textarea.span1, .uneditable-input.span1 { width: 56px; } } /* FIM DO BOOTSSTRAP */ @-ms-viewport { width: device-width; } #menu-select-mobile{display: none} #menu-mobile {position: relative; z-index: 1000;} .hide-text { font: 0/0 a; color: transparent; text-shadow: none; background-color: transparent; border: 0; } .input-block-level { display: block; width: 100%; min-height: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .hidden { display: none; visibility: hidden; } .visible-phone { display: none !important; } .visible-tablet { display: none !important; } .hidden-desktop { display: none !important; } .visible-desktop { display: inherit !important; } @media (min-width: 768px) and (max-width: 979px) { .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important ; } .visible-tablet { display: inherit !important; } .hidden-tablet { display: none !important; } } @media (max-width: 767px) { .hidden-desktop { display: inherit !important; } .visible-desktop { display: none !important; } .visible-phone { display: inherit !important; } .hidden-phone { display: none !important; } .content_software {margin-left: 10px; margin-right: 10px;} } @media (min-width: 1200px) { [class*="span"] { float: left; min-height: 1px; margin-left: 30px; } .span12 { width: 1170px; } .span11 { width: 1070px; } .span10 { width: 970px; } .span9 { width: 870px; } .span8 { width: 770px; } .span7 { width: 670px; } .span6 { width: 570px; } .span5 { width: 470px; } .span4 { width: 370px; } .span3 { width: 270px; } .span2 { width: 170px; } .span1 { width: 70px; } .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; line-height: 0; content: ""; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; float: left; width: 100%; min-height: 30px; margin-left: 2.564102564102564%; *margin-left: 2.5109110747408616%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.564102564102564%; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.45299145299145%; *width: 91.39979996362975%; } .row-fluid .span10 { width: 82.90598290598291%; *width: 82.8527914166212%; } .row-fluid .span9 { width: 74.35897435897436%; *width: 74.30578286961266%; } .row-fluid .span8 { width: 65.81196581196582%; *width: 65.75877432260411%; } .row-fluid .span7 { width: 57.26495726495726%; *width: 57.21176577559556%; } .row-fluid .span6 { width: 48.717948717948715%; *width: 48.664757228587014%; } .row-fluid .span5 { width: 40.17094017094017%; *width: 40.11774868157847%; } .row-fluid .span4 { width: 31.623931623931625%; *width: 31.570740134569924%; } .row-fluid .span3 { width: 23.076923076923077%; *width: 23.023731587561375%; } .row-fluid .span2 { width: 14.52991452991453%; *width: 14.476723040552828%; } .row-fluid .span1 { width: 5.982905982905983%; *width: 5.929714493544281%; } .controls-row [class*="span"] + [class*="span"] { margin-left: 30px; } input.span12, textarea.span12, .uneditable-input.span12 { width: 1156px; } input.span11, textarea.span11, .uneditable-input.span11 { width: 1056px; } input.span10, textarea.span10, .uneditable-input.span10 { width: 956px; } input.span9, textarea.span9, .uneditable-input.span9 { width: 856px; } input.span8, textarea.span8, .uneditable-input.span8 { width: 756px; } input.span7, textarea.span7, .uneditable-input.span7 { width: 656px; } input.span6, textarea.span6, .uneditable-input.span6 { width: 556px; } input.span5, textarea.span5, .uneditable-input.span5 { width: 456px; } input.span4, textarea.span4, .uneditable-input.span4 { width: 356px; } input.span3, textarea.span3, .uneditable-input.span3 { width: 256px; } input.span2, textarea.span2, .uneditable-input.span2 { width: 156px; } input.span1, textarea.span1, .uneditable-input.span1 { width: 56px; } .thumbnails { margin-left: -30px; } .thumbnails > li { margin-left: 30px; } .row-fluid .thumbnails { margin-left: 0; } } @media (min-width: 768px) and (max-width: 979px) { .logo_site{width: 200px!important; background-size: 100%!important;} h2.resp {font-size: 1.4em; line-height: 20px; padding: 0px; margin:0px!important} p.resp {font-size: 95%; line-height: 120%; padding: 0px; margin:0px} .overlay {background-size: 1050px 420px; margin-left: -500px; } [class*="span"] { float: left; min-height: 1px; margin-left: 20px; } .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { width: 724px; } .span12 { width: 724px; } .span11 { width: 662px; } .span10 { width: 600px; } .span9 { width: 538px; } .span8 { width: 476px; } .span7 { width: 414px; } .span6 { width: 352px; } .span5 { width: 290px; } .span4 { width: 228px; } .span3 { width: 166px; } .span2 { width: 104px; } .span1 { width: 42px; } .row-fluid { width: 100%; *zoom: 1; } .row-fluid:before, .row-fluid:after { display: table; line-height: 0; content: ""; } .row-fluid:after { clear: both; } .row-fluid [class*="span"] { display: block; float: left; width: 100%; min-height: 30px; margin-left: 2.7624309392265194%; *margin-left: 2.709239449864817%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="span"]:first-child { margin-left: 0; } .row-fluid .controls-row [class*="span"] + [class*="span"] { margin-left: 2.7624309392265194%; } .row-fluid .span12 { width: 100%; *width: 99.94680851063829%; } .row-fluid .span11 { width: 91.43646408839778%; *width: 91.38327259903608%; } .row-fluid .span10 { width: 82.87292817679558%; *width: 82.81973668743387%; } .row-fluid .span9 { width: 74.30939226519337%; *width: 74.25620077583166%; } .row-fluid .span8 { width: 65.74585635359117%; *width: 65.69266486422946%; } .row-fluid .span7 { width: 57.18232044198895%; *width: 57.12912895262725%; } .row-fluid .span6 { width: 48.61878453038674%; *width: 48.56559304102504%; } .row-fluid .span5 { width: 40.05524861878453%; *width: 40.00205712942283%; } .row-fluid .span4 { width: 31.491712707182323%; *width: 31.43852121782062%; } .row-fluid .span3 { width: 22.92817679558011%; *width: 22.87498530621841%; } .row-fluid .span2 { width: 14.3646408839779%; *width: 14.311449394616199%; } .row-fluid .span1 { width: 5.801104972375691%; *width: 5.747913483013988%; } .controls-row [class*="span"] + [class*="span"] { margin-left: 20px; } input.span12, textarea.span12, .uneditable-input.span12 { width: 710px; } input.span11, textarea.span11, .uneditable-input.span11 { width: 648px; } input.span10, textarea.span10, .uneditable-input.span10 { width: 586px; } input.span9, textarea.span9, .uneditable-input.span9 { width: 524px; } input.span8, textarea.span8, .uneditable-input.span8 { width: 462px; } input.span7, textarea.span7, .uneditable-input.span7 { width: 400px; } input.span6, textarea.span6, .uneditable-input.span6 { width: 338px; } input.span5, textarea.span5, .uneditable-input.span5 { width: 276px; } input.span4, textarea.span4, .uneditable-input.span4 { width: 214px; } input.span3, textarea.span3, .uneditable-input.span3 { width: 152px; } input.span2, textarea.span2, .uneditable-input.span2 { width: 90px; } input.span1, textarea.span1, .uneditable-input.span1 { width: 28px; } } @media (max-width: 767px) { h2.resp {font-size: 16px!important; line-height: 20px!important; padding: 0px!important; margin:0px!important} p.resp {font-size: 60%!important; line-height: 100%!important; padding: 0px!important; margin:0px!important} .logo_site { background-size: 50% 50%!important; } .overlay {background-size: 750px 300px; margin-left: -375px; top: 5%} #menu-select-mobile{display: block; /* padding: 0px 20px; TODO mudar no layout*/} body, html { overflow-x: hidden; } .pan_shadow:before{background: none!important;} .pan_shadow:after{background: none!important;} .ctnTextBillBoard {width: 45%;} .container > .container {padding: 0px;} .row-fluid { width: 100%; } [class*="span"], .uneditable-input[class*="span"], .row-fluid [class*="span"] { display: block; float: none; width: 100%; margin-left: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .span12, .row-fluid .span12 { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .row-fluid [class*="offset"]:first-child { margin-left: 0; } .input-large, .input-xlarge, .input-xxlarge, input[class*="span"], select[class*="span"], textarea[class*="span"], .uneditable-input { display: block; width: 100%; min-height: 30px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .input-prepend input, .input-append input, .input-prepend input[class*="span"], .input-append input[class*="span"] { display: inline-block; width: auto; } .controls-row [class*="span"] + [class*="span"] { margin-left: 0; } .modal { position: fixed; top: 20px; right: 20px; left: 20px; width: auto; margin: 0; } .modal.fade { top: -100px; } .modal.fade.in { top: 20px; } .brand {position: relative} } @media (max-width: 480px) { .brand { float: none!important; margin-top: 2px!important; display: block;} .mn_posSame {padding: 0px!important;} .logo {height: 50px!important;} .needhead {max-height: auto!important; height: auto;} .headerPan, .topo_helper .navbar-static-top {height : auto!important;} .brand img {height: 50px!important;} .page-header h1 small { display: block; line-height: 20px; } input[type="checkbox"], input[type="radio"] { border: 1px solid #ccc; } .media .pull-left, .media .pull-right { display: block; float: none; margin-bottom: 10px; } .media-object { margin-right: 0; margin-left: 0; } .modal { top: 10px; right: 10px; left: 10px; } .modal-header .close { padding: 10px; margin: -10px; } .carousel-caption { position: static; } #comboShare {display: none;} .sF_resp {font-size: 0.8em;} .mgL_resp {margin-left: 0px!important;} .ctn_item_carousel {width: 300px; margin: 0 auto; position: relative} } @media (min-width: 767px) { .row-eq-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } } @media (max-width: 979px) { .ctnTextBillBoard, .ctnTextBillBoard {width: 45%;} .navbar .brand { padding-right: 10px; padding-left: 10px; margin: 0 0 0 0px; } .right_resp2, .left_resp2 {float: none!important} .hide_resp2 {display: none;} .show_resp2 {display: block;} .responsive.so-megamenu .navbar-default .megamenu-wrapper ul.megamenu > li > a, .responsive.so-megamenu .navbar-default .vertical-wrapper ul.megamenu > li > a, ul.megamenu > li > a > span, #remove-megamenu {color: #556270 !important} #menu-wrap .nav-collapse, .nav-collapse.collapse {float: none;} .headerPan, .topo_helper .navbar-static-top {height: auto!important;} } @media (max-width: 340px) { h2.resp {font-size: 60%!important; line-height: 100%!important} p.resp {font-size: 40%!important;} } @media (max-width: 1023px) { .right_resp3, .left_resp3 {float: none!important} } @media (min-width: 1024px) { .img-support {max-height: 220px; min-height: 220px;} } /* ============================= */ .search_trigger:hover {background: none!important;} .hide, .hidden {display: none;} .left {float: left} .right {float: right} .clear {clear: both} .center, .txt_center {text-align: center} .txt_right {text-align: right} .txt_left {text-align: left} .label_checkbox_email {height: auto; opacity: 0.3; margin: 10px 0} .bb_square {padding: 30px; border: 1px solid #e5eaea; border-left: 10px solid #999; border-right: 10px solid #999; margin-bottom: 20px; background: #fff;} .shadow_simple {box-shadow: 0 0px 11px rgba(0, 0, 11, 0.3)} .sm-icon {background: #f2ce3e none repeat scroll 0 0; border-radius: 4px; height: 50px; margin: 10px auto; text-align: center; width: 50px;} .sm-icon-mini {background: #f2ce3e none repeat scroll 0 0; border-radius: 4px; height: 30px; text-align: center; width: 30px;} .sm-icon-mini2 {background: #f2ce3e none repeat scroll 0 0; border-radius: 4px; height: 25px; text-align: center; width: 25px;} .sm-icon-mini3 {background: #f2ce3e none repeat scroll 0 0; border-radius: 4px; height: 32px; text-align: center; width: 32px;} .bg-facebook {background: #374F81;} .bg-twitter {background: #00A0D1;} .bg-pinterest {background: #AA2127;} .bg-linkedin {background: #076A99;} .bg-google-plus {background: #B84435;} .bg-youtube {background: #AA2127;} .bg-flickr {background: #D60672;} .bg-instagram {background: #C23B6A;} .bg-whatsapp {background: #25d366;} .bg-gray {background: #ccc;} .bg-gray-light {background: #f5f5f5;} .bg-common {background: #333;} .bg-black {background: #222;} .bg-white {background: #fff;} .btn-facebook {background: #374F81; color: #fff;} .btn-facebook:hover {background: #374F70; color: #fff;} .pp_block_square {background: #e6e6e6 none repeat scroll 0 0; border-radius: 4px; color: #aaa; padding: 6px 15px; display: inline-block} .pp_block_square_white {background: #fff none repeat scroll 0 0; border-radius: 4px; color: #ccc; padding: 6px 15px; display: inline-block; border: 1px solid #ccc; opacity: 0.7} .pd-col-right-15 {padding-right: 15px;} .pd-col-left-15 {padding-left: 15px;} .d_flex {display: flex;} .mgAuto, .mg_auto {margin: auto;} .cp_blockSpecial {width: 40%; bottom: 0px!important; background-color: rgba(239,239,239, 0.75)!important; top: 0px; margin: 20px; height: auto; overflow: hidden;} .item_featured:hover {transform: scale(3) rotate(45deg); transition: all 30s ease 0s;} .item_featured {transition: all 10s ease 0s;} .item_featured3 {transition: all 1s ease 0s;} .item_featured2 {transform: scale(3); transition: all 90s ease 0s;} .item_featured3:hover {transform: scale(1.1); transition: all 1s ease 0s;} .double_line::before {background: #e7e7e7 none repeat scroll 0 0; bottom: -2px; content: " "; display: block; height: 1px; position: absolute; width: 100%;} .double_line::after {background: #e7e7e7 none repeat scroll 0 0; content: " "; display: block; height: 1px; width: 100%;} .line_medium {height: 2em; width: 100%;} #banner_loader1 .ctnRl_1 {display: block;} .ctn_banner_main {position: absolute; top: 40%;} .h-30 {height: 30px!important;} .blur {filter: blur(5px)} #publicidade_flutuante {position: absolute; z-index: 10000; width: 100%; text-align: center;} #publicidade_flutuante .content {top: 50px; position: relative} #publicidade_flutuante .close {float: none; margin: -25px 0 0 0; background: #fff; opacity: 1; padding: 5px;} .dim_flutuante {background: none repeat scroll 0 0 #000;height: 100%;opacity: 0.73;position: fixed;top: 0;width: 100%;z-index: 1000;} #publicidade_global {position: fixed; z-index: 991; width: 150px; right: 30px; top: 10%;} #publicidade_global .content {position: relative; width: 100%; height: 100%; background: url(/media/images/textures/paginas/transparent_60.png); padding: 0 10px 10px 10px; border-radius: 4px; border: 1px solid #ccc;} #publicidade_global p {font-size: 0.9em; color: #666; margin-top: 7px;} .ctn_barra_guerrilha {background: #333;} .searchbar_rounded {background-color: #333333; border: medium none; border-radius: 15px!important; color: #ffffff; font: italic 300 12px/1 Roboto,Arial,sans-serif; padding: 9px 30px 9px 15px; width: 250px; box-shadow: 0 1px 5px rgba(0, 0, 0, 0.075) inset; line-height: none;} .bt_searchbar_rounded {color: #fff; cursor: pointer; font-size: 1.2em;margin: 8px 0 0;position: absolute;right: 15px;} .bt_searchbar_rounded2 {cursor: pointer; font-size: 1.9em; margin: 6px 0 0; position: absolute; right: 25px;} sublime::after {background-color: #006991;content: "";display: block;height: 1px; margin-top: 6px;width: 30%;} .shadow_main_banner {position: absolute; z-index: -1!important; height: 110px; bottom: -40px; width: 980px; left: 50%; margin-left: -490px;} .logo_site {background-size: 100%;} .topic.h2_topic {float: left; background-position: 0 7px} .botao {min-width: 100px; min-height: 30px; border: none; text-align: center; line-height: 40px; vertical-align: middle; background: transparent; text-decoration: none} .overlay {background-position: center top; background-repeat: no-repeat; float: left; height: 600px; overflow: hidden; position: absolute; width: 100%; z-index: -1} .t_justify {text-align: justify;} .t_center {text-align: center;} .t_left {text-align: left;} .t_right {text-align: right;} .pointer_default {cursor: default!important} .right_resp, .right_resp2, .right_resp3 {float: right} /* Don't use it as !important */ .left_resp, .left_resp2 {float: left} /* Don't use it as !important */ .center_container_resp {margin: 0 auto; width: 60%;} /* Don't use it as !important */ .bold {font-weight: bold;} .pointer {cursor: pointer} .top15 {top:15px} .margin_lateral_auto {margin: 0 auto;} .txt_left, .txt_left_resp, .txt-left {text-align: left!important;} .txt_right, .txt_right_resp, .txt-right {text-align: right!important;} .txt_plus, .txt_plus_resp {height: 50px!important; font-size: 1.3em!important;} .txt_plus0, .txt_plus0_resp {height: 40px!important; font-size: 1.1em!important;} .btn_plus0, .btn_plus0_resp {height: 40px!important; font-size: 1.1em!important; padding: 12px 20px!important;} .pLineHeight, .paragraph_short {line-height: 20px; height: 40px; overflow: hidden} .circular {width: 70px;height: 70px;margin: 0px auto; border-radius: 35px;-webkit-border-radius: 35px;-moz-border-radius: 35px;box-shadow: 0 0 8px rgba(0, 0, 0, .8);-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);-moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8); background-size: 100%!important; z-index: 2; position: absolute; position: absolute;top: 50%;left: 50%; overflow: hidden;} .crossline {text-decoration: line-through;} .uf {width: 60px} .txt_mark {display: inline-block; padding: 0 10px 0 0; position: relative;text-align: left; width: auto !important; background: url(/media/images/textures/paginas/transparent_90.png);} .tt_stripes {background: rgba(0, 0, 0, 0) url(/media/images/textures/efeitos/strippes.png) repeat; height: 100%; width: 100%;} .menu_item_ecommerce {position: relative;} .menu_item_cat {margin-bottom: 0px; border: none; background: none; cursor: pointer;padding-bottom: 3px; text-align: left; width: 100%; display: inline-block} .bt_subcat_retratil {width: 100%!important; display: inline-block} .main_menu_store .parent:after {display: inline-block; content: "\f078"; position: absolute; right: 10px; font-family: FontAwesome;} #menu_resp_retratil {display: none; background: #fff;;} .itMenuResp {width: 100%; height: 30px; background: #f1f1f1; clear: left; margin-bottom: 5px; padding: 5px; color: #333;} .itMenuResp:hover {background-color: #ccc; color: #000;} .cat-title::after {content: ""; display: block; font-family: "FontAwesome"; font-size: 24px; position: absolute; right: 12px; text-align: center; top: 12px;} .cat-title {background: #31353d none repeat scroll 0 0;border-radius: 3px;color: #ffffff; display: none;height: 46px;position: absolute;right: 20px;text-transform: uppercase; top: 12px; width: 46px; cursor: pointer;} /* Menu Ecommerce */ .titulo_menu_ecommerce {margin-top: 5px; font-weight: bold; margin-right: 10px; height: auto; margin-bottom: 25px!important; border-bottom: 7px solid; margin-left: 5px;} .menu_item_ecommerce {border-bottom: 2px solid; margin-bottom: 8px; padding: 10px!important} .menu_item_ecommerce_no_border {height: 25px;} .menu_item_cat {border: none; background: none; cursor: pointer;padding-bottom: 3px; text-align: left} .menu_item_subcat {margin-bottom: 3px; padding-left: 5px; background: none; border: none; cursor: pointer; text-align: left; margin-left: 5px; padding-bottom: 3px; padding-top: 4px;} .menu_item_subitem {margin-bottom: 5px; margin-left: 30px; font-size: 0.85em; cursor: pointer; padding: 5px; margin-right: 5px;} .menu_support_items {display: none; margin-top: 10px; margin-bottom: 5px;} .subcat_items {padding-bottom: 0px;} .bg_lancamento {position: absolute; width: 200px; height: 200px; background: url(/media/images/layout/ecommerce/badge_lacamento.png) no-repeat; z-index: 2} .bg_lancamento_small {position: absolute; width: 100px; height: 100px; background: url(/media/images/layout/ecommerce/badge_lacamento_small.png) no-repeat; z-index: 2} .bg_vendido {position: absolute; width: 380px; height: 200px; background: url(/media/images/layout/ecommerce/badge_vendido.png) no-repeat; z-index: 2; top: 50%; left: 50%; margin: -100px 0 0 -190px;} .bg_vendido_small {position: absolute; width: 171px; height: 90px; background: url(/media/images/layout/ecommerce/badge_vendido_small.png) no-repeat; z-index: 2; top: 50%; left: 50%; margin: -45px 0 0 -85px;} .bg_reservado {position: absolute; width: 380px; height: 116px; background: url(/media/images/layout/ecommerce/badge_reservado.png) no-repeat; z-index: 2; top: 50%; left: 50%; margin: -58px 0 0 -190px;} .bg_reservado_small {position: absolute; width: 170px; height: 52px; background: url(/media/images/layout/ecommerce/badge_reservado_small.png) no-repeat; z-index: 2; top: 50%; left: 50%; margin: -26px 0 0 -85px;} .col-top {vertical-align: top;} .col-middle {vertical-align: middle;} .vertical-align, .v-align, .v_align {vertical-align: middle!important;} .col-bottom {vertical-align: bottom;} .rodape_blackbar_fixed {position: fixed; bottom: 0px; z-index: 3000} .topo_fixed {position: sticky; top: 0px; z-index: 10} .no_margin {margin: 0px!important; line-height: normal!important} .sidebar-minify-btn, .sidebar-minify-btn-left {margin: 10px 0;float: right;padding: 5px 20px 5px 10px!important;background: #1b1f24;color: #fff;-webkit-border-radius: 20px 0 0 20px;-moz-border-radius: 20px 0 0 20px;border-radius: 20px 0 0 20px;} .sidebar-minify-btn-left {float: left!important; border-radius: 0 20px 20px 0; padding: 5px 10px 5px 10px!important; margin: 20px 0; top: 20px; position: relative} .bt_facebook_login {width: 170px; height: 40px; background: url(/media/images/buttons/bt_facebook_logar_cadastrar.png) no-repeat; display: inline-block; cursor: pointer;} .txt_face p {color: #fff!important; text-align: center; vertical-align: middle; height: 20px; margin: 10px 0 0 25px} #c_type_pf, #c_type_pj {padding: 0px 15px;} #c_type_pf.active, #c_type_pj.active {background: #ccc; color: #000;} #c_type_pf:hover, #c_type_pj:hover {background: #333; color: #fff; } .subtitle_desc_types, .subtitle_desc_user {margin-bottom: 15px; display: inline-block;} .ctnSearchAnime {text-align: right; float: left;} .ctnSearchBox2 {text-align: center; display: inline-block;} .inner_shadow {box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3)!important;} .menu_lateral_software {float: left; width: 250px;display: inline-block} .menu_software {width: 200px; height: 100%; display: inline-block; position: fixed; z-index: 500} .content_software {margin-left: 200px; position: relative} .menu_software .item {background: url(/media/images/textures/paginas/transparent_black_50.png); padding: 5px; margin-bottom: 2px; cursor: pointer; color: #fff; border: 1px solid #333} .menu_software .item:hover {background: url(/media/images/textures/paginas/transparent_black_90.png); } .menu_software .item a {width: 100%; color: #fff;} .bt_rd_google_plus {background: url(/media/images/icons/icon_visit_googleplus.jpg) no-repeat; width: 131px; height: 22px;} .bt_rd_facebook {background: url(/media/images/icons/icon_visit_facebook.jpg) no-repeat; width: 131px; height: 22px;} .bt_login_facebook {background: url(/media/images/icons/logar_via_facebook.jpg) no-repeat; width: 70px; height: 20px;} .ramo_ab {position: absolute; width: 100%;} .ctn_express {overflow-y: auto; max-height: 149px; position: relative; border: 1px solid #f1f1f1;} .itEx {height: 25px; background: #f9f9f9; border: 1px solid #fff; padding: 5px; cursor: pointer;} .itEx:hover {background: #f1f1f1} .wrap_container {display: flex; position: relative; width: 100%;} .payment_supportbar {background: #fff; padding:10px 0; -moz-box-shadow: 1px 1px 1px #777, 0px 2px 10px #666 inset; -webkit-box-shadow: 1px 1px 1px #777, 0px 2px 10px #666 inset; box-shadow: 1px 1px 1px #777, 0 2px 10px #666 inset;} .bg-black-transp {background: url(/media/images/textures/paginas/transparent_black.png); } /* Live Search - SenseBar */ .live_search_component {width: 100%; margin-bottom: 10px; position: relative; float: left} .label_search_live {font-weight: bold;} .bt_arrow_live_search {height: 25px; width: 25px; margin-top: -28px; border: none; left:370px; position: absolute; cursor: pointer} #items_live_search_user, #items_live_search_ramo {border: 1px solid #f1f1f1; position: absolute; width: 100%; display: none; max-height: 140px; overflow: auto; overflow-x: hidden; z-index: 1000; background: #fff} .item_sl_c {} .item_sl_c_string {border-bottom: 1px solid #F1F1F1;clear: both;display: block; background: #f9f9f9;margin-bottom: 2px; margin-left: 3px; margin-right: 3px; margin-top: 2px; position: relative; cursor: pointer; padding: 10px 3px 10px 3px;} .item_sl_c_string:hover {background: #ccc} .no-items {height: 30px; font-weight: bold; vertical-align: middle; border-bottom: 1px solid #ccc;} .item_no_border {width: 90%;height: 100%; margin: 0 5%; } .item_border {border: 1px solid #ddd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; background: #fff;} .clearPPSquare .pp_square {border: none!important; border-radius: 0px; box-shadow: none; padding: 0px;} .posBottom {bottom: 0px;} .scroll_content {overflow-y: auto; position: relative;} .line_unset {line-height: unset!important;} .line_normal {line-height: normal!important;} /* Logos */ .logoDev_white {background: url('/media/images/cool/cool_j/logo_purplepier_dev_white.png') no-repeat; width: 190px; height: 40px; } .logoDev_black {background: url('/media/images/cool/cool_j/logo_purplepier_dev_black.png') no-repeat; width: 190px; height: 40px; } .base_black {background: url("/media/images/textures/rodape/base_black_50.png") repeat-x; width: 100%; height: 50px; } .base_black2 {background: url("/media/images/textures/rodape/base_black_50_2.jpg") repeat-x; width: 100%; height: 50px; } .botao_trans_back {text-align: center; cursor: pointer; width: 122px!important; height: 40px; background: url(/media/images/buttons/buttons_trans_back.png) no-repeat; overflow: hidden; border: none; display: block; } /* Rss */ .ctnRss {float: left; margin: 5px 0 0 10px; width: 85px;} .ttrss {font-size: 0.8em; margin: 11px 0 0 10px; } .qq-upload-button {padding: 6px 12px; height: auto!important} .hgtSize_40, .h40 {height: 40px!important;} .hgtSize_60, .h60 {height: 60px!important;} .hgtSize_100, .h100 {height: 100px;} .hgtSize_200 {height: 200px;} .hgtSize_300 {height: 300px;} .hgtSize_400 {height: 400px;} .hgtSize_500 {height: 500px;} .hgtSize_600 {height: 600px;} .truncate { width: 90%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis;} .truncate2 { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis; -ms-text-overflow: ellipsis;} .table_support .truncate {display: -moz-box} .line_simple {height: 20px; overflow: hidden;} .fa-icon-xxxlarge {font-size: 500%!important;} .fa-icon-xxlarge {font-size: 400%!important;} .fa-icon-xlarge {font-size: 300%!important;} .fa-icon-large {font-size: 350%!important;} .fa-icon-big {font-size: 200%!important;} .ctnArtTxt h1 {background: none; padding: 0px;} .paralax {background: 50% 0 fixed; height: auto;margin: 0 auto;width: 100%;position: relative;padding: 0px 0; background-size: 100% auto!important;} .ctn_properties_print_font {padding: 10px; border: 1px solid #ccc; display: inline-block;} .ctnPrint {left: 50%; margin-left: -490px; position: relative; width: 980px;} .z-under {position: relative; z-index: 990;} .no-z-index {z-index: 0;} .padding_2 {padding: 2px!important;} .padding_10 {padding: 10px!important;} .padding_20 {padding: 20px!important;} .line_height {line-height: 20px;} .mnCenter {margin: 0 auto -5px auto!important; display: inline-block; float: none;} .inline-block, .inline {display: inline-block} .mxHeight_50 {max-height: 50px;} .iframeFace {border:none; overflow:hidden; height:21px;} .concrete {background-color: #d3d2c9;} .btn-auto {min-width: auto!important;} .btn-green {background-color: #33b73a;border-color: #2ea440; color: #fff;} .btn-green:hover {background-color: #1F9926;color: #fff;} .btn-red {background-color: #b73333;border-color: #a42e2e; color: #fff;} .btn-red:hover {background-color: #A32727;color: #fff;} .btn-line, .btn-white {background: rgba(255,255,255,0.5);border-color: #ccc; color: #333;} .btn-line:hover, .btn-white:hover {background: rgba(255,255,255,0.5);border-color: #333; color: #000;} .btn-line2, .btn-white2 {border: 2px solid #fff!important; color: #fff; background:none; padding: 10px 30px;} .btn-line2:hover, .btn-white2:hover {border: 2px solid #ccc; color: #ccc;} .btn-line3, .btn-black2 {border: 2px solid #333!important; color: #333; background:none; padding: 10px 30px;} .btn-line3:hover, .btn-black2:hover {border: 2px solid #000; color: #000;} #second { background: rgba(0, 0, 0, 0) url("/media/temp/images/secondBG.jpg") no-repeat fixed 50% 0; color: white; height: 1300px; margin: 0 auto; overflow: hidden; padding: 0; background-size: 100%; } #header, #intro, #second { width: 100%; } #second .bg { background: rgba(0, 0, 0, 0) url("/media/temp/images/trainers.png") no-repeat fixed 50% 0; height: 1300px; margin: 0 auto; padding: 0; position: absolute; width: 900px; z-index: 200; } .story { margin: 0 auto; min-width: 980px; overflow: auto; width: 980px; } .story .float-left, .story .float-right { padding: 100px 0 0; position: relative; width: 350px; } .float-right { float: right; margin: 0 20px 0 0; } /* Produtos */ .list-group {margin-bottom: 20px; padding-left: 0;} .list-group-item {background-color: #fff; border: 0px!important; display: block; margin-bottom: 0px!important; padding: 15px 15px;} .list-group-item.active, .list-group-item-color.active {background-color: #f9f9f9;} .list-group-item-color {background-color: #efefef; border: 1px solid #E1E1E1!important; display: block; margin-bottom: 3px!important; padding: 15px 15px;} .slide-item {width: 100%;} .caption-ecommerce {height: 130px; overflow: hidden; text-align: center;} .img_prod {text-align: center; height: 220px; position: relative; overflow: hidden} .img_prod img {text-align: center; width: 300px;} .pp_square a {text-decoration: none!important;} /*Flash Notice */ .flash_notice {position:fixed; top:0; left:0; width:100%; padding: 10px 0.8em 0.8em 0.8em; border-bottom-width: 2px; border-bottom-style: solid; font-size: 18px; z-index: 1010; opacity: 0.9} .flash_notice span {padding-top: 10px;} .flash_notice_button_close {width: 35px; height: 30px; background: url(/media/images/buttons/button_flash_notice_close.png) no-repeat; float: right; margin-right: 20px; cursor: pointer;} .flash_notice_button_close:hover {background-position: 0px -30px;} #flash_notice_text {float: left} .divider_shadow {background: url("/media/images/divider/faq_divider_horizontal.png") no-repeat scroll center 0 transparent;height: 30px;padding-bottom: 20px; position: relative;width: 100%; overflow: hidden; margin: 0 auto } hr.separator {background-color: #333; border: 0 none; box-shadow: 0 1px 0 0 #999; height: 1px; outline: 0 none;margin: 5px auto;width: 99%;} hr.separator_light {background-color: #ccc; border: 0 none; box-shadow: 0 1px 0 0 #fff; height: 1px; outline: 0 none;margin: 5px auto;width: 100%;} .clear {clear: both} /* COMPONENTS */ #novidadeTetriz .ctnImageTetriz, .ctnNovidade {width: auto!important} .outdoor_rotativo, .overflow-hidden {overflow: hidden;} .selo_position_inbound {position: absolute; top: 0px; right: 0px;} .selo_position_inbound.regular img {height: 80px} .selo_position_inbound.normal img {height: 100px} .ctnOtrBts {width: 100%; z-index: 3} .bn_button_left, .bn_button_right, .btn_bt_left, .btn_bt_right {height: 45px; width: 30px; border: none; cursor: pointer} .relative {position: relative} .absolute {position: absolute} .well_simple:before {border-left: none;} .support-search_menu {height: 22px;} .carArrow {font-size: 26px!important; padding: 5px; position: absolute; top: 47%; color: #fff; background: #fff none repeat scroll 0 0;border: 1px solid #ccc;} .ctn_vitrine_barcelona .carousel-control {width: auto!important; opacity: 1; left: auto;} .ctn_vitrine_barcelona .carousel-indicators {bottom: 0px; position: relative} .ctn_vitrine_barcelona .carousel-indicators li, .carousel-support-base.carousel-indicators li {border: 1px solid #ccc} .ctn_vitrine_barcelona .carousel-indicators li:active, .carousel-support-base.carousel-indicators li.active {background-color: #ccc!important;} .carousel-support-base.carousel-indicators {bottom: 0px; position: relative;} .menu li a > span {opacity: 1 !important; font-family: purple_main} .purple_main {font-family: purple_main} .mgB2 {margin-bottom: 20px;} .mgB {margin-bottom: 10px;} .mgT {margin-top: 10px;} .mgT1 {margin-top: 20px;} .mgL0 {margin-left: 5px;} .mgR0 {margin-right: 5px} .legend {opacity: 0.5} .imgBd_mini {border: 1px solid #fff;background: url(/media/images/textures/paginas/transparent_40.png); height: 40px} .fb_center {position:relative; left: 50%; margin-left: -130px!important; width: 260px} a.link, span.link {text-decoration: underline!important;} .mgB_0 {margin-bottom: 0px!important;} .mgT_0 {margin-top: 0px!important;} .uppercase {text-transform: uppercase;} .h_300 {height: 300px!important;} .h_400 {height: 400px!important;} .h_500 {height: 500px!important;} .max-h-300 {max-height: 300px;} .max-h-400 {max-height: 400px;} .max-h-500 {max-height: 500px;} .support-search_menu_right {height: 30px; margin-top: -7px; padding: 0px 15px; position: relative;} .support-search_menu_right .icon_search_fa {position: absolute; right: 30px; top: 50%; margin-top: -10px} /* Live Chat */ .liveChat {position: fixed; bottom: 0; z-index: 1000; width: 330px; height: 50px;} .baseLiveChat {background-repeat: no-repeat; width: 330px; height: 50px; position: absolute} .titlechat {color: #fff; padding: 3px; position: absolute; z-index: 1001; margin: 15px 0 0 35px; font-weight: bold;} .bt_maximize {background: url('/media/images/layout/livechat/bt_maximize_white.png') no-repeat; width: 24px!important; height: 18px; position: absolute; z-index: 1002; right: 0; margin: 20px 20px 0 0; border: none; cursor: pointer} .ctnLiveChat {height: 450px; border: 1px solid #ccc; margin: 50px 0 0 7px; width: 315px; background: #fff;} .ctnTextLiveChatAnswer {border: 1px solid #ccc; background: #f1f1f1;height: 200px; margin: 5px 0 0 7px; position: absolute; width: 298px; overflow-y: auto;} .ctnTextLiveChat {margin: 220px 0 0 0;} .ctnTextLiveChatOff {margin: 0px 0 0 0;} .ctnTextLiveOffMessage {margin: 10px;} .textLiveChat {margin: 0 0 0 7px; bottom: 5px} .textLiveChat.textarea_small, .textLiveChat.input_small2 {width: 298px;} .btnLiveChat {float: right; margin: 5px 10px 0 0;} .tLcP {margin: 5px 0 0 5px; color: #666; font-size: 0.9em;} .tLcA {margin: 5px 0 0 5px; font-size: 0.9em; } .tLcS {color: #666;} .badge_status_lv {width: 25px; height: 25px; position: absolute; z-index: 1002; margin: 17px 20px 0 10px;} .badge_status_lv.off {background: url('/media/images/layout/livechat/badge_offline.png') no-repeat;} .badge_status_lv.on {background: url('/media/images/layout/livechat/badge_online.png') no-repeat;} .ctnPartner {float: left; margin: 0 23px 20px 0; height: 100px; overflow: hidden; padding: 6px; background: #f9f9f9; border: 1px solid #f1f1f1; border-radius: 6px; width: 200px;} .ctnPartBlock {margin-left: 25px} .ctncontatus {float: right;font-size: 0.9em;} /* Produtos */ .product-item-rounded {margin-top: 15px; border-radius: 5px; overflow: hidden; box-shadow: 10px 5px 0 0 0.8; } /* Banner Main */ .bn_button_left {position: absolute; z-index: 12; top: 0px; cursor: pointer; overflow: hidden; bottom: 0%; margin: auto;} .bn_button_left:hover {background-position: 0px -70px;} .bn_button_right {z-index: 12; right: 0; top: 0; cursor: pointer; position: absolute; overflow: hidden; bottom: 0; margin: auto} .bn_button_right:hover {background-position: 0px -70px;} .bn_status_bar {background: url(/media/images/layout/bg_black_transparent.png); width: 100%; height: 60px; position: absolute; bottom: 0; z-index: 4;} /* Rodapes */ #rodapeMain .container_vertical_likebox {position: relative; width:260px; margin-left: 0px;} #rodapeMain .container_vertical_likebox2 {height: 240px;margin-left: 0;overflow: hidden; padding: 5px; position: relative; width: 250px;} .overflow_hidden {overflow: hidden;} .fb_center2 {display: table; margin: auto;} .fb-comments, .fb-comments iframe {width: 100% !important;} .ft_copyright_line {font-size: 0.9em; padding: 20px 0; text-align: left;} .legenda_right {float: left; font-size: 0.9em; margin: 15px 0 0;} .legend_left {float: right; font-size: 0.9em; margin-top: 13px;} #rodape_acervo, #rodape_acervo .line3 {padding-top: 4px; } /* Colors */ blue, .blue {color: mediumblue; font-weight: bold} red, .red {color: #B9262C; font-weight: bold} green, .green {color: #80b86e; font-weight: bold} purple, .purple {color: #b80573; font-weight: bold} yellow, .yellow {color: #ffcc00; font-weight: bold} black, .black, a.black {color: #333!important; font-weight: bold} .black2, a.black {color: #333!important;} white, .white, .txt-white, .white a, .txt-white a {color: #fff; font-weight: bold} orange, .orange, .txt-orange {color: #ff9900; font-weight: bold} gray, .gray, .txt_gray {color: #ccc!important; font-weight: bold} .txt_gray_light {color: #ABABAB;} .txt_red {color: #E62222;} .no-link-decoration a {text-decoration: none} .mgTop_resp {margin-top: 20px;} .bg_transparent_20, .transparent_20 {background: url(/media/images/textures/paginas/transparent_20.png) repeat;} .bg_transparent_40 {background: url(/media/images/textures/paginas/transparent_40.png) repeat;} .bg_transparent_60, .transparent_60 {background: url(/media/images/textures/paginas/transparent_60.png) repeat;} .bg_transparent_90 {background: url(/media/images/textures/paginas/transparent_90.png) repeat;} .padding_0, .pd_0 {padding: 0px!important;} .padding_10, .p-10 {padding: 10px!important;} .padding_15, .p-15 {padding: 15px!important;} .padding_20, .p-20 {padding: 20px!important;} .padding_30, .p-30 {padding: 30px!important;} .padding_5, .p-5 {padding: 5px;} .padding_1, .p-1 {padding: 1px;} .padding_l_10, .p-l-10 {padding: 0 10px;} .padding_l_20, .p-l-20 {padding: 0 20px;} .padding_top_10, .p-t-10 {padding-top: 10px;} .padding_top_5, .p-t-5 {padding-top: 5px;} .padding_t_10 {padding: 10px 0px;} .padding_bottom_10, .p-b-10 {padding-bottom: 10px;} .padding_left_10, .pL10 {padding-left: 10px;} .transparent_black_100 {background: url("/media/images/textures/paginas/transparent_black_100.png") repeat scroll 0 0 rgba(0, 0, 0, 0)} .transparent_black_90 {background: url("/media/images/textures/paginas/transparent_black_90.png") repeat scroll 0 0 rgba(0, 0, 0, 0)} .transparent_black_80 {background: url("/media/images/textures/paginas/transparent_black_80.png") repeat scroll 0 0 rgba(0, 0, 0, 0)} .transparent_black_60 {background: url("/media/images/textures/paginas/transparent_black_50.png") repeat scroll 0 0 rgba(0, 0, 0, 0)} .sF {font-size: 0.9em!important;} .sF1 {font-size: 0.8em!important;} .sF2 {font-size: 0.7em!important;} .sF3 {font-size: 0.6em!important;} .sF4 {font-size: 0.5em!important;} .bF {font-size: 1.2em;} .bF2 {font-size: 1.4em;} .bF3 {font-size: 1.9em;} .bF40, .bF4 {font-size: 40px;} .lH1 {line-height: 10px;} /*Componentes */ /* Tip */ .subtip {margin: 0px 0 0 10px; display: inline-block } .pp_tip {padding: 10px; display: flex;} .pp_tip .icon_tip {margin: -5px 10px 0 5px; width: 55px; height: 50px; display: inline-block; float: left; } .pp_tip p, .pp_tip h3, .pp_tip h4 {line-height: unset;} .pp_tip .groupItems {display: inline-block; margin-left: 10px;} .pp_tip p {color: #333; font-weight: normal;} .pp_tip.bg-success h3 {color: #205205;} .pp_tip.bg-success h4 {color: #327f30;} .pp_tip.bg-success .icon_tip {background: url("/media/images/icons/icon_success_m.png") no-repeat; } .pp_tip.bg-danger h3 {color: #6b0606;} .pp_tip.bg-danger h4 {color: #a41515;} .pp_tip.bg-danger .icon_tip {background: url("/media/images/icons/icon_error_m.png")no-repeat; } .pp_tip.bg-info h3 {color: #0b446c;} .pp_tip.bg-info h4 {color: #2d7bb2;} .pp_tip.bg-info .icon_tip {background: url("/media/images/icons/icon_headsup_m.png")no-repeat; } .pp_tip.bg-warning h3 {color: #8a6d3b;} .pp_tip.bg-warning h4 {color: #decc36;} .pp_tip.bg-warning .icon_tip {background: url("/media/images/icons/icon_info_m.png")no-repeat; } .pp_tip.bg-tip {background-color: #fecf6a; border: 1px solid #dfb04b; display: flex;} .pp_tip.bg-tip h3 {color: #8a6d3b;} .pp_tip.bg-tip h4 {color: #7c6e4c;} .pp_tip.bg-tip .icon_tip {background: url("/media/images/icons/icon_idea_m.png")no-repeat; } /* Bubbles */ .bubble {background: #EA061D; border-radius: 50%; box-shadow: 0 0 20px rgba(0,0,0,0.5); display: inline-block} .bubble .nr {padding: 0px 8px; text-align: center; font-size: 0.8em; font-weight: bold; color: #fff;} .bubble .nr.decimal {padding: 1px 7px; margin-left: -2px} .bubble.bubble-header {position: absolute; bottom: 0px;} .bubble.bubble-left {position: absolute; left: 0px;} .bubble.bubble-right {position: absolute; right: 0px;} .bubble-clear {box-shadow: none; } #file_crop .btn-main {padding: 6px 12px!important} /* TOPIC */ topics > topic:first-child {margin: 25px 0 15px 20px; display: inline-block;} topic {margin: 0 0 15px 20px; display: inline-block;} topics_colapse > topic:first-child {margin: 5px 0 5px 0px; display: inline-block;} topics_colapse topic {margin: 0 0 5px 0px; display: inline-block;} .clearFontSpace {padding: 0px; margin: 0px;} /* Operadoras */ .cel_operadoras {width: 80px; height: 20px; margin: -30px 0 0 185px; position: absolute; overflow: hidden} .cel_op {cursor: pointer; height: 20px; width: 80px!important; border: none; } .logo_mini_claro {background: url(/media/images/icons/logo_op_mini_claro.png) no-repeat;} .logo_mini_vivo {background: url(/media/images/icons/logo_op_mini_vivo.png) no-repeat;} .logo_mini_tim {background: url(/media/images/icons/logo_op_mini_tim.png) no-repeat;} .logo_mini_oi {background: url(/media/images/icons/logo_op_mini_oi.png) no-repeat;} .logo_mini_nextel {background: url(/media/images/icons/logo_op_mini_nextel.png) no-repeat;} .video-container {position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden;} .video-container iframe, .video-container object, .video-container embed {position: absolute;top: 0;left: 0; width: 100%; height: 100%;} .pp_square, .pp_square_bg { display: block; padding: 4px; line-height: 20px; border: 1px solid #ddd; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); box-shadow: 0 1px 3px rgba(0, 0, 0, 0.055); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .pp_square.bbt:hover{ background: #ccc; cursor:pointer; } .pp_square.active{ background: #ff9900; } .pp_square_ret, .pp_square_ret_bg, .pp_square_ret2{ display: block; border: 1px solid #ddd; border-radius: 0px!important; } .pp_square_ret_bg{ padding: 5px; } .mainTitle{font-size: 31.5px;} h1, h2, h3, h4, h5, h6 { margin: 10px 0; font-family: inherit; font-weight: bold; text-rendering: optimizelegibility; } .transition {-webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out;} /* Sharebar */ .container_sharebar {height: 45px; margin-bottom: 20px; margin-top: 20px; border-top: 1px dotted #ccc;} .share_buttons {white-space: nowrap; margin-left: 0px; margin-bottom: 10px; height: 30px; border-top: 1px dotted #ccc; padding-top: 5px; padding-bottom: 3px; border-bottom: 1px dotted #ccc; background: #fff;} .icon_fake_google_plus {background: url(/media/images/layout/icon_fake_google_plus.png)no-repeat; height: 24px; width: 70px;} .container_buttons_line1 {width: 100%; display: inline-block} .container_button_like {margin-bottom: 5px; margin-top: 5px; height: 30px; width: 630px; float: left} #container_button_googlePlus {margin-bottom: 5px; margin-top: 5px; height: 30px; float: right} #container_button_googlePlus > div {width: 66px!important} #___plusone_0 {width: auto!important} .label_properties_buttons {padding-top: 5px; float: left; font-size: 10pt; margin-left: 5px; color: #666} .icon_img_share {float: left;} .container_buttons_lines_2 {float: right;} .ic_facebook {margin-left:0px; float:left; cursor: pointer; border-left: 1px dotted #ccc; padding-left: 5px; padding-right: 5px;} .ic_twitter {margin-left:0px; float: left;cursor: pointer; border-left: 1px dotted #ccc; padding-left: 5px; padding-right: 5px;} .ic_linkedin {margin-left:0px; float: left;cursor: pointer; border-left: 1px dotted #ccc; border-right: 1px dotted #ccc; padding-left: 5px; padding-right: 5px;} .share_curtir {margin-left:20px; cursor: pointer} .container_buttons_lines_1 {width: 130px; float: left;} .share_comment {margin-left:0px; padding-left: 5px; padding-right: 5px; float: left; cursor: pointer; border-left: 1px dotted #ccc; border-right: 1px dotted #ccc; } .share_mail {margin-left:0px; padding-left: 5px; padding-right: 5px; float: left; cursor: pointer; border-left: 1px dotted #ccc;} .share_error {margin-left:0px; padding-left: 5px; padding-right: 5px; float: left; cursor: pointer; border-left: 1px dotted #ccc;} .shortUrl {margin-bottom: 10px; height: 40px; width: 450px; float: left;} .shortUrl2 {margin-bottom: 10px; height: 40px; float: left;} .title_shortUrl {float: left; font-size: 10pt; padding-top: 6px; color: #ccc} .link_shortUrl {margin-left: 10px; float: left; width: 200px;} .bt_copy_shortUrl {cursor: pointer;} .icon_shortUrl_copy {background: url(/media/images/icons/icon_copy.png)no-repeat; height: 24px; width: 70px; padding-left: 30px; float: left; font-size: 10pt; margin-left: 15px; padding-top: 3px;} /* ComboShare */ .comboShareNW {background-repeat: repeat-x;box-shadow: 0 3px 4px rgba(0,0,0, 0.5);min-height: 60px;padding: 6px;position: fixed; z-index: 1002} .comboShareNW.preto {background-color: #1F1F1F; background-image: -moz-linear-gradient(center top , #333333, #000000);} .comboShareNW.branco {background-color: #f1f1f1; background-image: -moz-linear-gradient(center top , #f1f1f1, #fff);} .comboShareNW.vermelho {background-color: #c01212; background-image: -moz-linear-gradient(center top , #c01212, #9a1010);} .comboShareNW.verde {background-color: #1d9a10; background-image: -moz-linear-gradient(center top , #1d9a10, #11580a);} .comboShareNW.azul {background-color: #0a4fad; background-image: -moz-linear-gradient(center top , #0a4fad, #1353aa);} .comboShareNW.page {left: 50%; top: 50%; margin-left: -533px} .comboShareNW.pageRight {left: 50%; top: 50%; margin-left: 590px} .comboShareNW.rightP {right: 0%; top: 50%;} .comboShareNW.leftP {left: 0%; top: 50%;} .comboShareNW.page_top {left: 50%; top: 300px; margin-left: -533px; position: absolute} #comboShare .icons {overflow: hidden; margin: 0 0 5px 0; cursor: pointer; border-left: none; padding-left: 0px; width: 25px;} .icCs:hover {margin-top: -30px;} /* Document : cool_html Created on : 10/05/2011, 21:38:44 Author : Assuero Description: Purpose of the stylesheet follows. */ .s_cool {position: absolute; width: auto; height: auto; z-index: 2} .s_background {width: 100%; height: 100%; z-index: 0; position: absolute; float: left;} .s_overlay {width: 100%; height: 100%; z-index: 1; position: absolute; float: left;} .text_textarea_cool {resize: none;} #loader {position: relative;} .share_linkedin_icon, .icon_linkedin {background: url(/media/images/icons/cs_linkedin.jpg) no-repeat; height: 30px; width: 30px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_facebook_icon, .icon_facebook {background: url(/media/images/icons/cs_facebook.jpg) no-repeat; height: 30px; width: 30px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_twitter_icon, .icon_twitter {background: url(/media/images/icons/cs_twitter.jpg) no-repeat; height: 30px; width: 30px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_google_icon, .icon_google {background: url(/media/images/icons/cs_google.jpg) no-repeat; height: 30px; width: 30px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_google_icon:hover, .share_twitter_icon:hover, .share_linkedin_icon:hover, .share_facebook_icon:hover, .icon_linkedin:hover, .icon_twitter:hover, .icon_facebook:hover, .icon_google:hover {background-position: 0px -30px;} .share_mail_icon {background: url(/media/images/layout/html_components/bt_mail.png) no-repeat; height: 24px; width: 24px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_mail_icon:hover {background-position: 0px -24px;} .share_facebook_small_gray, .share_facebook_small_color {background: url(/media/images/icons/icon_share_facebook_small_gray.png) no-repeat; height: 18px; width: 19px; overflow: hidden; border: none; cursor: pointer;display: block;} .share_facebook_small_gray:hover {background-position: 0px -18px;} .share_facebook_small_color {background: url(/media/images/icons/icon_share_facebook_small_color.png); height: 22px; width: 22px;} .share_twitter_small_gray, .share_twitter_small_color {background: url(/media/images/icons/icon_share_twitter_small_gray.png) no-repeat; height: 18px; width: 19px; overflow: hidden; border: none; cursor: pointer;} .share_twitter_small_gray:hover {background-position: 0px -18px;} .share_twitter_small_color {background: url(/media/images/icons/icon_share_twitter_small_color.png); height: 22px; width: 22px;} .share_linkedin_small_gray, .share_linkedin_small_color {background: url(/media/images/icons/icon_share_linkedin_small_gray.png) no-repeat; height: 18px; width: 19px; overflow: hidden; border: none; cursor: pointer;} .share_linkedin_small_gray:hover {background-position: 0px -18px;} .share_linkedin_small_color {background: url(/media/images/icons/icon_share_linkedin_small_color.png); height: 22px; width: 22px;} .share_youutbe_small_gray, .share_youtube_small_color {background: url(/media/images/icons/icon_share_youutbe_small_gray.png) no-repeat; height: 18px; width: 19px; overflow: hidden; border: none; cursor: pointer;} .share_youtube_small_color {background: url(/media/images/icons/icon_share_youtube_small_color.png); height: 22px; width: 22px;} .google_maps_icon {background: url(/media/images/layout/html_components/bt_googlemaps.png) no-repeat; height: 23px; width: 109px; overflow: hidden; border: none; cursor: pointer;} .google_maps_icon:hover {background-position: 0px -23px;} .des_purplepier {background: url(/media/images/layout/html_components/bt_purplepier_dev.png) no-repeat; height: 30px; width: 230px; overflow: hidden; border: none; cursor: pointer;} .des_purplepier:hover {background-position: 0px -30px;} /* Menu Component */ .menu_cool {height:35px; display: inline-block; position: relative;} ul.menu_cool {height:35px; min-width: 700px; display: inline-block;} li.menu_cool {float:left!important; margin-top:5px; text-align:center; padding-top: 0px!important; white-space: nowrap; min-width: 70px!important; font-size: 10pt!important;} a.menu_cool {margin:0px 10px 0 10px; text-align:center; text-decoration:none; font-weight:bold; white-space:nowrap; font-size: 10pt!important; float: left!important; font-family: Helvetica, Tahoma, Verdana, Arial!important;min-width: 70px!important;} a.menu_cool:hover {text-decoration:none;} .mn2_cols4_html {width: 980px; height: 30px; display: none;} .mn2_line_html_component, .mn3_line_html_component, .login_person_compontent_html {display: none;} .mn2_cols4_column {width: 200px; height: auto; float: left; margin-right: 20px;} .container_link_mn2_cols4 {height: 25px; margin-bottom: 10px;} .icon_mn2 {height: 15px; width: 15px; float: left; margin-right: 6px; margin-top: 0px;} .mn2_line, .mn1_line {width: 960px; height: 50px; text-align: center;} .container_login_options {display: inline-block; font-size: 10px; white-space: nowrap; width: 225px; float: right; margin-right: 0px;} .login_component_nao_cadastrado {float: left; margin-right: 10px; cursor: pointer} .login_component_nao_cadastrado:hover {text-decoration:underline} .login_component_esqueci_senha {cursor: pointer} .login_component_esqueci_senha:hover {text-decoration:underline} /* Login Component Guest */ .login_guest_compontent_html {height: 30px; width: 290px; color: #fff} .login_guest_phrase_init {float: left; width: auto; font-size: 9pt; margin-right: 5px;} .login_guest_phrase_init2 {float: left; width: 155px; font-size: 9pt; padding-top: 10px; color: brown} .login_guest_phrase_end {float: left; font-size: 9pt;} .login_guest_link_associese {float: left; margin-right: 5px; text-decoration: underline; font-size: 9pt; color: #fff!important} .login_guest_divider {float: left; margin-right: 5px; font-size: 9pt; color: #fff!important} .login_guest_link_login {float: left; text-decoration: underline; margin-right: 5px; font-size: 9pt; color: #fff!important} .login_guest_link_login a {color: #fff!important} .color_guest_name p, .color_guest_name p span {color: #fff!important;} /* Searchbar */ .searchbar_big_green_compontent_html,.searchbar_big_green_button {display: none;} .ctn_login_cp,.searchbar_choices_compontent_html, .login_signed_Simple {display: none;} .search_input {background: none!important; border: none!important;} .search_bar {background: url(/media/images/layout/html_components/search_bar.png) no-repeat; height: 35px; width: 225px; position: absolute;} .bt_cadastrar_user {background: url(/media/images/layout/html_components/bt_cadastrar_se.png) no-repeat; height: 40px; width: 152px; position: absolute; overflow: hidden} .bt_cadastrar_user:hover {background-position: 0px -40px} /* User form */ .form_cadastrar_user, .button_colorful_cp_html, .mn1_line_html {display: none;} /* E-commerce */ .bt_shopping_cart_pay_it, #popup_payment {display: none;} .bt_loja_limpar_lista, .item_sh_c_empty, #frete_preloader {display: none;} .pp_square_bg, .pp_square_ret_bg {background: #fff; z-index: 2;} .ctnLegendTxt{background: #f1f1f1; border-bottom: 1px solid #ccc; color: #999; padding: 10px 20px; height: auto; margin-top: -3px; z-index: 0;} .pp_tip{border-color: none;} .ui-timepicker td {padding: 3px 2px; cursor: pointer} /* Dividers */ .divider_dotted {width: 100%; border-bottom: 1px dotted #000; height: 1px;} .divider_dashed {width: 100%; border-bottom: 1px dashed #000; height: 1px;} .divider_groove {width: 100%; border-bottom: 1px groove #000; height: 1px;} .divider_ridge {width: 100%; border-bottom: 1px ridge #000; height: 1px;} .divider_limiter_shadow {width: 100%; height: 7px; background: url(/media/images/layout/dividers/limiter.png) repeat-x;} .divider_decorativo_1 {width: 100%; height: 7px; background: url(/media/images/layout/dividers/decorativo.png) repeat-x;} .divider_decorativo_dotted, .divider_bubbles {width: 100%; height: 10px; background: url(/media/images/layout/dividers/decorativo_dotted.png) repeat-x;} .ft_global_advr {float: left; font-size: 5px;} .bt_like {float: left; background: url(/media/images/buttons/bt_like.png) no-repeat; width: 45px!important; height: 32px; border: none; cursor: pointer; overflow: hidden} .bt_like:hover {background-position: 0px -32px} .bt_unlike {float: left; background: url(/media/images/buttons/bt_like_no.png) no-repeat; width: 45px!important; height: 32px; border: none; cursor: pointer; overflow: hidden} .bt_unlike:hover {background-position: 0px -32px} .bCItem {float: left; margin: 2px 5px 0 0;} .arrow_divider {background: url("/media/images/layout/arrows/arrow_dotted.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0); float: left; height: 15px; margin: 5px 5px 0 0;width: 15px;} .bg_bar_white {background: url("/media/images/layout/ecommerce/bg_bar_white.png") repeat-x; width: 100%; height: 100%; background-size: 100% 100%; padding: 5px 0;} .squarebox {background: url("/media/images/layout/boundbox/corner-left.png") no-repeat scroll left top #ffffff; border: 1px solid #d2d2d2;box-shadow: 0 0 3px rgba(90, 90, 90, 0.2); color: #3c3c3c; position: relative;} .squarebox .content {background: url("/media/images/layout/boundbox/corner-right.png") no-repeat scroll right top transparent; padding: 15px 15px 15px;} .no-shadow {box-shadow: none!important;} .no-border-bottom {border-bottom: none!important;} #ftMnCor_azul a, #ftMnCor_azul .hCard, #ftMnCor_azul span {color: #0d86d2!important;} #ftMnCor_azul h4 span {color: #024067!important;} #ftMnCor_azul .line3 {border-bottom: 1px solid #7eaecd;} #ftMnCor_preto a, #ftMnCor_preto .hCard, #ftMnCor_preto span {color: #333!important;} #ftMnCor_preto h4 span {color: #000!important;} #ftMnCor_preto .line3 {border-bottom: 1px solid #999;} #ftMnCor_cinza a, #ftMnCor_cinza .hCard, #ftMnCor_cinza span {color: #919191!important;} #ftMnCor_cinza h4 span {color: #666!important;} #ftMnCor_cinza .line3 {border-bottom: 1px solid #ccc;} #ftMnCor_laranja_preto a, #ftMnCor_laranja_preto .hCard, #ftMnCor_laranja_preto span {color: #333!important;} #ftMnCor_laranja_preto h4 span {color: #d37404!important;} #ftMnCor_laranja_preto .line3 {border-bottom: 1px solid #d37404;} #ftMnCor_laranja_preto h4 span, #ftMnCor_laranja_preto .line3 span:before {border-color: #333} #ftMnCor_amarelo a, #ftMnCor_amarelo .hCard, #ftMnCor_amarelo span {color: #FFDC00!important;} #ftMnCor_amarelo h4 span {color: #FFA900!important;} #ftMnCor_amarelo .line3 {border-bottom: 1px solid #FFA900;} #ftMnCor_amarelo h4 span, #ftMnCor_amarelo .line3 span:before {border-color: #FFDC00} #ftMnCor_laranja a, #ftMnCor_laranja .hCard, #ftMnCor_laranja span {color: #FF6417!important;} #ftMnCor_laranja h4 span {color: #FF6417!important;} #ftMnCor_laranja .line3 {border-bottom: 1px solid #FF6417;} #ftMnCor_laranja h4 span, #ftMnCor_laranja .line3 span:before {border-color: #FF6417} #ftMnCor_branco a, #ftMnCor_branco .hCard, #ftMnCor_branco span {color: #fff!important;} #ftMnCor_branco h4 span, #ftMnCor_branco p {color: #ccc!important;} #ftMnCor_branco .line3 {border-bottom: 1px solid #f9f9f9;} #ftMnCor_branco h4 span, #ftMnCor_branco .line3 span:before {border-color: #f1f1f1} .no-after:after, .no-after span:before, .no-border-inner span {border: none;} .table-striped tbody > tr.thead:nth-child(odd) > td {background: #999 !important} /* Componentes */ .ctn_vitrine_barcelona .dItem {height: 50px;} /* Document : comment_simple Created on : 22/08/2011, 10:20:02 Author : carlosgarcia Description: component simple Purpose of the stylesheet follows. */ .comment_divider {margin-bottom: 10px; overflow: hidden} .container_comment {width: 100%; margin-bottom: 20px;} .container_item_comment {padding: 5px; border: 1px solid #f1f1f1; margin-bottom: 10px} .container_names_properties {margin-bottom: 0px; padding: 5px 10px; background: #f1f1f1; margin-bottom: 10px;} .container_names_properties_item {margin-bottom: 0px; border-left: 4px solid #fff; padding: 5px 10px; background: #f5f5f5; margin-bottom: 10px;} .comment_pict {float: left; margin: 0px 10px 0 0px;} .comment_title {float: left; font-weight: bold;} .comment_time_past_main {float: right; font-size: 9pt; color: #999; margin-right: 5px;} .comment_time_past {float: left; font-size: 9pt; color: #999} .comment_name_reply {float: right; font-size: 9pt;} .icon_comment {background: url(/media/images/icons/icon_balloon_comment.png)no-repeat; height: 15px; width: 16px; float: left; margin-right: 5px;} .in_reply {white-space: nowrap; float: left; margin-right: 5px;} .comment_comentario {} .comment_comentario_item {border-left: 4px solid #fff; padding-left: 0px} .paragraph_comment {margin-bottom: 10px;} .paragraph_comment_item {margin-bottom: 10px;} .phrase_like {margin-right: 10px;} .divider_comments {border-bottom: 1px dotted #888; width: 100%; height: 2px; margin-bottom: 5px;} .divider_comments_item {border-top: 1px dotted #ccc; height: 2px; margin-left: 25px; margin-bottom: 7px;} .container_people_reviews {float: left; font-size: 10pt; padding-top: 10px; font-weight: bold} .no_display {display:none} .likes_bt {float: left; margin-right: 10px;} /* Comments Reply */ .container_commnet_reply {display: none;} /* Buttons reviews */ .container_buttons_reviews {float: right} .container_buttons_review {float: left} .bt_reply, .bt_reply2 {float: left; background: url(/media/images/buttons/bt_like_reply.png) no-repeat; width: 90px!important; height: 32px; border: none; cursor: pointer; overflow: hidden} .bt_reply:hover, .bt_reply2:hover {background-position: 0px -32px} .bt_like {float: left; background: url(/media/images/buttons/bt_like.png) no-repeat; width: 45px!important; height: 32px; border: none; cursor: pointer; overflow: hidden} .bt_like:hover {background-position: 0px -32px} .bt_unlike {float: left; background: url(/media/images/buttons/bt_like_no.png) no-repeat; width: 45px!important; height: 32px; border: none; cursor: pointer; overflow: hidden} .bt_unlike:hover {background-position: 0px -32px} @media (max-width: 768px) { .mn_osis_pos {display: none;} .cat-title {display: block;} .menu_resp_colapse {min-height: 60px} .menu_resp_colapse .brand img {height: 70px!important;} .menu_resp_colapse .brand {margin-left: 20px;} .ctn_banner_main {position: relative; top: auto;} .tela_captura_module {position: absolute; top: 20px; margin: auto; z-index: 1001;} } @media (min-width: 768px) { .tela_captura_module {position: fixed; top: 20px; margin-left: -595px; left: 50%; width: 1170px; z-index: 1001;} } /* Animation */ .owl-img-wrapper {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.25); display: block; overflow: hidden; position: relative;} .owl-img-pops {background-color: #ffffff; border: medium none;border-radius: 50%;box-shadow: 0 0 1px rgba(0, 0, 0, 0.5), 0 0 2px rgba(0, 0, 0, 0.1) inset;display: inline-block !important;float: none !important; font-size: 14px; font-weight: normal; height: 40px; line-height: 40px; margin: 0 2px; text-align: center; width: 40px;} .owl-img-wrapper .owl-img-pops-effect3 div {position: absolute;} .img-responsive {display: block;height: auto; width: 100%;} .owl-img-wrapper .owl-img-overlay {background: rgba(0, 0, 0, 0.5) none repeat scroll 0 0; bottom: 0;display: block; height: 100%; left: 0; opacity: 0; position: absolute; right: 0; top: 0; transition: all 0.3s ease 0s; width: 100%;} .owl-img-wrapper .owl-img-pops-effect3 div:nth-of-type(1) {bottom: 50%;left: 50%; margin: -20px 0 0 -82px; opacity: 0;top: 50%; transition: all 0.3s ease 0s; visibility: hidden;} .owl-img-wrapper .owl-img-pops-effect3 div:nth-of-type(2) {bottom: 50%; margin: -20px -82px 0 0; opacity: 0; right: 50%; top: 50%; transition: all 0.3s ease 0s; visibility: hidden;} .owl-img-wrapper:hover .owl-img-pops-effect3 div:nth-of-type(1) {margin: -20px 0 0 -42px; opacity: 1; visibility: visible;} .owl-img-wrapper:hover .owl-img-pops-effect3 div:nth-of-type(2) {margin: -20px -42px 0 0; opacity: 1; visibility: visible;} .owl-img-wrapper:hover .owl-img-overlay {opacity: 1;} .flipInX {animation-name: flipInX;backface-visibility: visible !important;} .animated {animation-duration: 1s; animation-fill-mode: both;} .in {opacity: 1;} .out {opacity: 0;} .animated.infinite { animation-iteration-count: infinite; } .animated.hinge { animation-duration: 2s; } .animated.delay1 { animation-delay: 1s; } .animated.delay2 { animation-delay: 2s; } /*! Animate.css - http://daneden.me/animate Licensed under the MIT license - http://opensource.org/licenses/MIT Copyright (c) 2014 Daniel Eden */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } @keyframes bounce { 0%, 20%, 53%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 40%, 43% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -30px, 0); -ms-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } 70% { -webkit-transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); transition-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060); -webkit-transform: translate3d(0, -15px, 0); -ms-transform: translate3d(0, -15px, 0); transform: translate3d(0, -15px, 0); } 90% { -webkit-transform: translate3d(0, -4px, 0); -ms-transform: translate3d(0, -4px, 0); transform: translate3d(0, -4px, 0); } } .bounce, .bounce-hover:hover { -webkit-animation-name: bounce; animation-name: bounce; -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes pulse { 0% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 50% { -webkit-transform: scale3d(1.05, 1.05, 1.05); -ms-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); } 100% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes rubberBand { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes rubberBand { 0% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 30% { -webkit-transform: scale3d(1.25, 0.75, 1); -ms-transform: scale3d(1.25, 0.75, 1); transform: scale3d(1.25, 0.75, 1); } 40% { -webkit-transform: scale3d(0.75, 1.25, 1); -ms-transform: scale3d(0.75, 1.25, 1); transform: scale3d(0.75, 1.25, 1); } 50% { -webkit-transform: scale3d(1.15, 0.85, 1); -ms-transform: scale3d(1.15, 0.85, 1); transform: scale3d(1.15, 0.85, 1); } 65% { -webkit-transform: scale3d(.95, 1.05, 1); -ms-transform: scale3d(.95, 1.05, 1); transform: scale3d(.95, 1.05, 1); } 75% { -webkit-transform: scale3d(1.05, .95, 1); -ms-transform: scale3d(1.05, .95, 1); transform: scale3d(1.05, .95, 1); } 100% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .rubberBand { -webkit-animation-name: rubberBand; animation-name: rubberBand; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } @keyframes shake { 0%, 100% { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translate3d(-10px, 0, 0); -ms-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 20%, 40%, 60%, 80% { -webkit-transform: translate3d(10px, 0, 0); -ms-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } 100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } @keyframes swing { 20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); -ms-transform: rotate3d(0, 0, 1, 15deg); transform: rotate3d(0, 0, 1, 15deg); } 40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); -ms-transform: rotate3d(0, 0, 1, -10deg); transform: rotate3d(0, 0, 1, -10deg); } 60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); -ms-transform: rotate3d(0, 0, 1, 5deg); transform: rotate3d(0, 0, 1, 5deg); } 80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); -ms-transform: rotate3d(0, 0, 1, -5deg); transform: rotate3d(0, 0, 1, -5deg); } 100% { -webkit-transform: rotate3d(0, 0, 1, 0deg); -ms-transform: rotate3d(0, 0, 1, 0deg); transform: rotate3d(0, 0, 1, 0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } 100% { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes tada { 0% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } 10%, 20% { -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); -ms-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); } 40%, 60%, 80% { -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); } 100% { -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } 100% { -webkit-transform: none; transform: none; } } @keyframes wobble { 0% { -webkit-transform: none; -ms-transform: none; transform: none; } 15% { -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); -ms-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); } 30% { -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); -ms-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); } 45% { -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); -ms-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); } 60% { -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); -ms-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); } 75% { -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); -ms-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); } 100% { -webkit-transform: none; -ms-transform: none; transform: none; } } /* Buzz */ @-webkit-keyframes buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } } @keyframes buzz { 50% { -webkit-transform: translateX(3px) rotate(2deg); transform: translateX(3px) rotate(2deg); } 100% { -webkit-transform: translateX(-3px) rotate(-2deg); transform: translateX(-3px) rotate(-2deg); } } .buzz:hover, .buzz:focus, .buzz:active { -webkit-animation-name: buzz; animation-name:buzz; -webkit-animation-duration: 0.15s; animation-duration: 0.15s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } @keyframes bounceIn { 0%, 20%, 40%, 60%, 80%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); -ms-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 20% { -webkit-transform: scale3d(1.1, 1.1, 1.1); -ms-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 40% { -webkit-transform: scale3d(.9, .9, .9); -ms-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 60% { opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); -ms-transform: scale3d(1.03, 1.03, 1.03); transform: scale3d(1.03, 1.03, 1.03); } 80% { -webkit-transform: scale3d(.97, .97, .97); -ms-transform: scale3d(.97, .97, .97); transform: scale3d(.97, .97, .97); } 100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); -ms-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } } .animated-hover {opacity: 0} .bounceIn, .bounceInHover:hover { -webkit-animation-name: bounceIn; animation-name: bounceIn; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounceInDown { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInDown { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, -3000px, 0); -ms-transform: translate3d(0, -3000px, 0); transform: translate3d(0, -3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, 25px, 0); -ms-transform: translate3d(0, 25px, 0); transform: translate3d(0, 25px, 0); } 75% { -webkit-transform: translate3d(0, -10px, 0); -ms-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 90% { -webkit-transform: translate3d(0, 5px, 0); -ms-transform: translate3d(0, 5px, 0); transform: translate3d(0, 5px, 0); } 100% { -webkit-transform: none; -ms-transform: none; transform: none; } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInLeft { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(-3000px, 0, 0); -ms-transform: translate3d(-3000px, 0, 0); transform: translate3d(-3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(25px, 0, 0); -ms-transform: translate3d(25px, 0, 0); transform: translate3d(25px, 0, 0); } 75% { -webkit-transform: translate3d(-10px, 0, 0); -ms-transform: translate3d(-10px, 0, 0); transform: translate3d(-10px, 0, 0); } 90% { -webkit-transform: translate3d(5px, 0, 0); -ms-transform: translate3d(5px, 0, 0); transform: translate3d(5px, 0, 0); } 100% { -webkit-transform: none; -ms-transform: none; transform: none; } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; transform: none; } } @keyframes bounceInRight { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(3000px, 0, 0); -ms-transform: translate3d(3000px, 0, 0); transform: translate3d(3000px, 0, 0); } 60% { opacity: 1; -webkit-transform: translate3d(-25px, 0, 0); -ms-transform: translate3d(-25px, 0, 0); transform: translate3d(-25px, 0, 0); } 75% { -webkit-transform: translate3d(10px, 0, 0); -ms-transform: translate3d(10px, 0, 0); transform: translate3d(10px, 0, 0); } 90% { -webkit-transform: translate3d(-5px, 0, 0); -ms-transform: translate3d(-5px, 0, 0); transform: translate3d(-5px, 0, 0); } 100% { -webkit-transform: none; -ms-transform: none; transform: none; } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes bounceInUp { 0%, 60%, 75%, 90%, 100% { -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); } 0% { opacity: 0; -webkit-transform: translate3d(0, 3000px, 0); -ms-transform: translate3d(0, 3000px, 0); transform: translate3d(0, 3000px, 0); } 60% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); -ms-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 75% { -webkit-transform: translate3d(0, 10px, 0); -ms-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 90% { -webkit-transform: translate3d(0, -5px, 0); -ms-transform: translate3d(0, -5px, 0); transform: translate3d(0, -5px, 0); } 100% { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } @keyframes bounceOut { 20% { -webkit-transform: scale3d(.9, .9, .9); -ms-transform: scale3d(.9, .9, .9); transform: scale3d(.9, .9, .9); } 50%, 55% { opacity: 1; -webkit-transform: scale3d(1.1, 1.1, 1.1); -ms-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } 100% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); -ms-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes bounceOutDown { 20% { -webkit-transform: translate3d(0, 10px, 0); -ms-transform: translate3d(0, 10px, 0); transform: translate3d(0, 10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, -20px, 0); -ms-transform: translate3d(0, -20px, 0); transform: translate3d(0, -20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); -ms-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes bounceOutLeft { 20% { opacity: 1; -webkit-transform: translate3d(20px, 0, 0); -ms-transform: translate3d(20px, 0, 0); transform: translate3d(20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); -ms-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); -ms-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); -ms-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes bounceOutUp { 20% { -webkit-transform: translate3d(0, -10px, 0); -ms-transform: translate3d(0, -10px, 0); transform: translate3d(0, -10px, 0); } 40%, 45% { opacity: 1; -webkit-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -ms-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); -ms-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -ms-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); -ms-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); -ms-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); -ms-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } @keyframes fadeOutDown { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 100%, 0); -ms-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } @keyframes fadeOutDownBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, 2000px, 0); -ms-transform: translate3d(0, 2000px, 0); transform: translate3d(0, 2000px, 0); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes fadeOutLeft { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(-2000px, 0, 0); -ms-transform: translate3d(-2000px, 0, 0); transform: translate3d(-2000px, 0, 0); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes fadeOutRight { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); -ms-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes fadeOutRightBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); -ms-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } @keyframes fadeOutUp { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -100%, 0); -ms-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } @keyframes fadeOutUpBig { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(0, -2000px, 0); -ms-transform: translate3d(0, -2000px, 0); transform: translate3d(0, -2000px, 0); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, -360deg); transform: perspective(400px) rotate3d(0, 1, 0, -360deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) scale3d(.95, .95, .95); -ms-transform: perspective(400px) scale3d(.95, .95, .95); transform: perspective(400px) scale3d(.95, .95, .95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg); transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg); transform: perspective(400px) rotate3d(1, 0, 0, -5deg); } 100% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px); } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } 100% { -webkit-transform: perspective(400px); transform: perspective(400px); } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; opacity: 0; } 40% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, -20deg); transform: perspective(400px) rotate3d(0, 1, 0, -20deg); -webkit-transition-timing-function: ease-in; transition-timing-function: ease-in; } 60% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, 10deg); transform: perspective(400px) rotate3d(0, 1, 0, 10deg); opacity: 1; } 80% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, -5deg); transform: perspective(400px) rotate3d(0, 1, 0, -5deg); } 100% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px); } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg); transform: perspective(400px) rotate3d(1, 0, 0, -20deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg); transform: perspective(400px) rotate3d(1, 0, 0, 90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-animation-duration: .75s; animation-duration: .75s; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px); -ms-transform: perspective(400px); transform: perspective(400px); } 30% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, -15deg); transform: perspective(400px) rotate3d(0, 1, 0, -15deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); -ms-transform: perspective(400px) rotate3d(0, 1, 0, 90deg); transform: perspective(400px) rotate3d(0, 1, 0, 90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; -webkit-animation-duration: .75s; animation-duration: .75s; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } 100% { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg); -ms-transform: translate3d(100%, 0, 0) skewX(-30deg); transform: translate3d(100%, 0, 0) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: skewX(20deg); -ms-transform: skewX(20deg); transform: skewX(20deg); opacity: 1; } 80% { -webkit-transform: skewX(-5deg); -ms-transform: skewX(-5deg); transform: skewX(-5deg); opacity: 1; } 100% { -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { opacity: 1; } 100% { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { opacity: 1; } 100% { -webkit-transform: translate3d(100%, 0, 0) skewX(30deg); -ms-transform: translate3d(100%, 0, 0) skewX(30deg); transform: translate3d(100%, 0, 0) skewX(30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, -200deg); -ms-transform: rotate3d(0, 0, 1, -200deg); transform: rotate3d(0, 0, 1, -200deg); opacity: 0; } 100% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); -ms-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, 45deg); -ms-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; transform: none; opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -90deg); -ms-transform: rotate3d(0, 0, 1, -90deg); transform: rotate3d(0, 0, 1, -90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center; transform-origin: center; opacity: 1; } 100% { -webkit-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; opacity: 1; } 100% { -webkit-transform-origin: center; -ms-transform-origin: center; transform-origin: center; -webkit-transform: rotate3d(0, 0, 1, 200deg); -ms-transform: rotate3d(0, 0, 1, 200deg); transform: rotate3d(0, 0, 1, 200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0, 0, 1, 45deg); transform: rotate(0, 0, 1, 45deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0, 0, 1, 45deg); -ms-transform: rotate(0, 0, 1, 45deg); transform: rotate(0, 0, 1, 45deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate3d(0, 0, 1, -45deg); -ms-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate3d(0, 0, 1, 90deg); -ms-transform: rotate3d(0, 0, 1, 90deg); transform: rotate3d(0, 0, 1, 90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes hinge { 0% { -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate3d(0, 0, 1, 80deg); -ms-transform: rotate3d(0, 0, 1, 80deg); transform: rotate3d(0, 0, 1, 80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40%, 80% { -webkit-transform: rotate3d(0, 0, 1, 60deg); -ms-transform: rotate3d(0, 0, 1, 60deg); transform: rotate3d(0, 0, 1, 60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; opacity: 1; } 100% { -webkit-transform: translate3d(0, 700px, 0); -ms-transform: translate3d(0, 700px, 0); transform: translate3d(0, 700px, 0); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } 100% { opacity: 1; -webkit-transform: none; transform: none; } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); -ms-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); } 100% { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } @keyframes rollOut { 0% { opacity: 1; } 100% { opacity: 0; -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); -ms-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } @keyframes zoomIn { 0% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); -ms-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } @-webkit-keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInDown { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInDown { -webkit-animation-name: zoomInDown; animation-name: zoomInDown; } @-webkit-keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInLeft { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInLeft { -webkit-animation-name: zoomInLeft; animation-name: zoomInLeft; } @-webkit-keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInRight { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInRight { -webkit-animation-name: zoomInRight; animation-name: zoomInRight; } @-webkit-keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomInUp { 0% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 60% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomInUp { -webkit-animation-name: zoomInUp; animation-name: zoomInUp; } @-webkit-keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } @keyframes zoomOut { 0% { opacity: 1; } 50% { opacity: 0; -webkit-transform: scale3d(.3, .3, .3); -ms-transform: scale3d(.3, .3, .3); transform: scale3d(.3, .3, .3); } 100% { opacity: 0; } } .zoomOut { -webkit-animation-name: zoomOut; animation-name: zoomOut; } @-webkit-keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutDown { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutDown { -webkit-animation-name: zoomOutDown; animation-name: zoomOutDown; } @-webkit-keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; transform-origin: left center; } } @keyframes zoomOutLeft { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(-2000px, 0, 0); -ms-transform: scale(.1) translate3d(-2000px, 0, 0); transform: scale(.1) translate3d(-2000px, 0, 0); -webkit-transform-origin: left center; -ms-transform-origin: left center; transform-origin: left center; } } .zoomOutLeft { -webkit-animation-name: zoomOutLeft; animation-name: zoomOutLeft; } @-webkit-keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; transform-origin: right center; } } @keyframes zoomOutRight { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0); } 100% { opacity: 0; -webkit-transform: scale(.1) translate3d(2000px, 0, 0); -ms-transform: scale(.1) translate3d(2000px, 0, 0); transform: scale(.1) translate3d(2000px, 0, 0); -webkit-transform-origin: right center; -ms-transform-origin: right center; transform-origin: right center; } } .zoomOutRight { -webkit-animation-name: zoomOutRight; animation-name: zoomOutRight; } @-webkit-keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } @keyframes zoomOutUp { 40% { opacity: 1; -webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -ms-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0); -webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190); } 100% { opacity: 0; -webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -ms-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); } } .zoomOutUp { -webkit-animation-name: zoomOutUp; animation-name: zoomOutUp; } .grid { max-width: 1300px; margin: 0 auto; list-style: none; text-align: center; } .grid figure { position: relative; text-align: center; margin: 0px; } .grid figcaption { position: absolute; top: 0; left: 0; background: rgba(0,0,0, 0.7); color: #f; padding: 5px; } .grid figcaption h3 { margin: 10px 0; padding: 0; color: #fff; } .grid figcaption p { color: #fff; } /* Caption Style 3 */ .cs-style-3 figure { overflow: hidden; } .cs-style-3 figure img{ transform: scale(1);transition: all 1s ease 0s; } .cs-style-3 figure:hover img, .cs-style-3 figure.cs-hover img { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); transition: all 1s ease 0s; } /* Caption Style 3 */ .cs-style-3 .btn_base { position: relative; bottom: 5px; margin: auto; } .cs-style-3 figcaption { height: 100%; width: 100%; top: auto; bottom: 0; opacity: 0; -webkit-transform: translateY(100%); -moz-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s; -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s; transition: transform 0.4s, opacity 0.1s 0.3s; } .cs-style-3 figure:hover figcaption, .cs-style-3 figure.cs-hover figcaption { opacity: 1; -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); -webkit-transition: -webkit-transform 0.4s, opacity 0.1s; -moz-transition: -moz-transform 0.4s, opacity 0.1s; transition: transform 0.4s, opacity 0.1s; } /* Retina-specific stuff here */ @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { /* Retina-specific stuff here */ .logoDev_white {background: url('/media/images/cool/cool_j/logo_purplepier_dev_white_2x.png') no-repeat; width: 190px; height: 40px; background-size: 100% 100%;} }