@charset "UTF-8"; /* Theme Name: Hub Theme URI: http://www.woothemes.com/ Version: 1.2.5 Description: Designed by WooThemes. Author: WooThemes Author URI: http://www.woothemes.com/ Tags: woothemes Copyright: (c) 2009-2013 WooThemes. License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* WARNING! DO NOT EDIT THIS FILE! To make it easy to update your theme, you should not edit the styles in this file. Instead use the custom.css file to add your styles. You can copy a style from this file and paste it in custom.css and it will override the style in this file. You have been warned! :) LAYOUT Layout styles for desktop orientations is included in css/layout.css. */ /*------------------------------------------------------------------------------------------*/ /* LESS MIXINS */ /*------------------------------------------------------------------------------------------*/ @-webkit-keyframes spin-360 { from { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); zoom: 1; } 50% { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); zoom: 1; } to { -webkit-transform: rotate(0); -moz-transform: rotate(0); -ms-transform: rotate(0); -o-transform: rotate(0); transform: rotate(0); zoom: 1; } } body { *zoom: 1; } body:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } body:before, body:after { content: ""; display: table; } body:after { clear: both; } /*------------------------------------------------------------------------------------------*/ /* ANIMATION */ /*------------------------------------------------------------------------------------------*/ body { -webkit-backface-visibility: hidden; } .animated { -webkit-animation-duration: 1s; -moz-animation-duration: 1s; -o-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; -o-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; -moz-animation-duration: 2s; -o-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @-moz-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @-o-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .animated.flash { -webkit-animation-name: flash; -moz-animation-name: flash; -o-animation-name: flash; animation-name: flash; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); } } @-moz-keyframes shake { 0%, 100% { -moz-transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -moz-transform: translateX(-10px); } 20%, 40%, 60%, 80% { -moz-transform: translateX(10px); } } @-o-keyframes shake { 0%, 100% { -o-transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -o-transform: translateX(-10px); } 20%, 40%, 60%, 80% { -o-transform: translateX(10px); } } @keyframes shake { 0%, 100% { transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { transform: translateX(-10px); } 20%, 40%, 60%, 80% { transform: translateX(10px); } } .animated.shake { -webkit-animation-name: shake; -moz-animation-name: shake; -o-animation-name: shake; animation-name: shake; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); } } @-moz-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -moz-transform: translateY(0); } 40% { -moz-transform: translateY(-30px); } 60% { -moz-transform: translateY(-15px); } } @-o-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -o-transform: translateY(0); } 40% { -o-transform: translateY(-30px); } 60% { -o-transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { transform: translateY(0); } 40% { transform: translateY(-30px); } 60% { transform: translateY(-15px); } } .animated.bounce { -webkit-animation-name: bounce; -moz-animation-name: bounce; -o-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); } } @-moz-keyframes tada { 0% { -moz-transform: scale(1); } 10%, 20% { -moz-transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -moz-transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -moz-transform: scale(1.1) rotate(-3deg); } 100% { -moz-transform: scale(1) rotate(0); } } @-o-keyframes tada { 0% { -o-transform: scale(1); } 10%, 20% { -o-transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -o-transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -o-transform: scale(1.1) rotate(-3deg); } 100% { -o-transform: scale(1) rotate(0); } } @keyframes tada { 0% { transform: scale(1); } 10%, 20% { transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { transform: scale(1.1) rotate(-3deg); } 100% { transform: scale(1) rotate(0); } } .animated.tada { -webkit-animation-name: tada; -moz-animation-name: tada; -o-animation-name: tada; animation-name: tada; } @-webkit-keyframes swing { 20%, 40%, 60%, 80%, 100% { -webkit-transform-origin: top center; } 20% { -webkit-transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); } } @-moz-keyframes swing { 20% { -moz-transform: rotate(15deg); } 40% { -moz-transform: rotate(-10deg); } 60% { -moz-transform: rotate(5deg); } 80% { -moz-transform: rotate(-5deg); } 100% { -moz-transform: rotate(0deg); } } @-o-keyframes swing { 20% { -o-transform: rotate(15deg); } 40% { -o-transform: rotate(-10deg); } 60% { -o-transform: rotate(5deg); } 80% { -o-transform: rotate(-5deg); } 100% { -o-transform: rotate(0deg); } } @keyframes swing { 20% { transform: rotate(15deg); } 40% { transform: rotate(-10deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } 100% { transform: rotate(0deg); } } .animated.swing { -webkit-transform-origin: top center; -moz-transform-origin: top center; -o-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; -moz-animation-name: swing; -o-animation-name: swing; animation-name: swing; } @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); } } @-moz-keyframes wobble { 0% { -moz-transform: translateX(0%); } 15% { -moz-transform: translateX(-25%) rotate(-5deg); } 30% { -moz-transform: translateX(20%) rotate(3deg); } 45% { -moz-transform: translateX(-15%) rotate(-3deg); } 60% { -moz-transform: translateX(10%) rotate(2deg); } 75% { -moz-transform: translateX(-5%) rotate(-1deg); } 100% { -moz-transform: translateX(0%); } } @-o-keyframes wobble { 0% { -o-transform: translateX(0%); } 15% { -o-transform: translateX(-25%) rotate(-5deg); } 30% { -o-transform: translateX(20%) rotate(3deg); } 45% { -o-transform: translateX(-15%) rotate(-3deg); } 60% { -o-transform: translateX(10%) rotate(2deg); } 75% { -o-transform: translateX(-5%) rotate(-1deg); } 100% { -o-transform: translateX(0%); } } @keyframes wobble { 0% { transform: translateX(0%); } 15% { transform: translateX(-25%) rotate(-5deg); } 30% { transform: translateX(20%) rotate(3deg); } 45% { transform: translateX(-15%) rotate(-3deg); } 60% { transform: translateX(10%) rotate(2deg); } 75% { transform: translateX(-5%) rotate(-1deg); } 100% { transform: translateX(0%); } } .animated.wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); } 50% { -webkit-transform: scale(1.1); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes pulse { 0% { -moz-transform: scale(1); } 50% { -moz-transform: scale(1.1); } 100% { -moz-transform: scale(1); } } @-o-keyframes pulse { 0% { -o-transform: scale(1); } 50% { -o-transform: scale(1.1); } 100% { -o-transform: scale(1); } } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.1); } 100% { transform: scale(1); } } .animated.pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -moz-animation-timing-function: ease-out; } 50% { -moz-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -moz-animation-timing-function: ease-in; } 80% { -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -o-animation-timing-function: ease-out; } 50% { -o-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -o-animation-timing-function: ease-in; } 80% { -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) translateZ(0) rotateY(0) scale(1); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) translateZ(0) rotateY(360deg) scale(0.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible !important; -webkit-animation-name: flip; -moz-backface-visibility: visible !important; -moz-animation-name: flip; -o-backface-visibility: visible !important; -o-animation-name: flip; backface-visibility: visible !important; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-moz-keyframes flipInX { 0% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateX(-10deg); } 70% { -moz-transform: perspective(400px) rotateX(10deg); } 100% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-o-keyframes flipInX { 0% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateX(-10deg); } 70% { -o-transform: perspective(400px) rotateX(10deg); } 100% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateX(-10deg); } 70% { transform: perspective(400px) rotateX(10deg); } 100% { transform: perspective(400px) rotateX(0deg); opacity: 1; } } .animated.flipInX { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @-moz-keyframes flipOutX { 0% { -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @-o-keyframes flipOutX { 0% { -o-transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { transform: perspective(400px) rotateX(90deg); opacity: 0; } } .animated.flipOutX { -webkit-animation-name: flipOutX; -webkit-backface-visibility: visible !important; -moz-animation-name: flipOutX; -moz-backface-visibility: visible !important; -o-animation-name: flipOutX; -o-backface-visibility: visible !important; animation-name: flipOutX; backface-visibility: visible !important; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @-moz-keyframes flipInY { 0% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -moz-transform: perspective(400px) rotateY(-10deg); } 70% { -moz-transform: perspective(400px) rotateY(10deg); } 100% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @-o-keyframes flipInY { 0% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -o-transform: perspective(400px) rotateY(-10deg); } 70% { -o-transform: perspective(400px) rotateY(10deg); } 100% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { transform: perspective(400px) rotateY(-10deg); } 70% { transform: perspective(400px) rotateY(10deg); } 100% { transform: perspective(400px) rotateY(0deg); opacity: 1; } } .animated.flipInY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInY; -moz-backface-visibility: visible !important; -moz-animation-name: flipInY; -o-backface-visibility: visible !important; -o-animation-name: flipInY; backface-visibility: visible !important; animation-name: flipInY; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @-moz-keyframes flipOutY { 0% { -moz-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -moz-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @-o-keyframes flipOutY { 0% { -o-transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -o-transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { transform: perspective(400px) rotateY(90deg); opacity: 0; } } .animated.flipOutY { -webkit-backface-visibility: visible !important; -webkit-animation-name: flipOutY; -moz-backface-visibility: visible !important; -moz-animation-name: flipOutY; -o-backface-visibility: visible !important; -o-animation-name: flipOutY; backface-visibility: visible !important; animation-name: flipOutY; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .animated.fadeIn { -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp { 0% { opacity: 0; -moz-transform: translateY(20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp { 0% { opacity: 0; -o-transform: translateY(20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInUp { -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown { 0% { opacity: 0; -moz-transform: translateY(-20px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown { 0% { opacity: 0; -o-transform: translateY(-20px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInDown { -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft { 0% { opacity: 0; -moz-transform: translateX(-20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft { 0% { opacity: 0; -o-transform: translateX(-20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInLeft { -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight { 0% { opacity: 0; -moz-transform: translateX(20px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight { 0% { opacity: 0; -o-transform: translateX(20px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInRight { -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUpBig { 0% { opacity: 0; -moz-transform: translateY(2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUpBig { 0% { opacity: 0; -o-transform: translateY(2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInUpBig { -webkit-animation-name: fadeInUpBig; -moz-animation-name: fadeInUpBig; -o-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDownBig { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDownBig { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } } .animated.fadeInDownBig { -webkit-animation-name: fadeInDownBig; -moz-animation-name: fadeInDownBig; -o-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeftBig { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeftBig { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; -moz-animation-name: fadeInLeftBig; -o-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRightBig { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRightBig { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } } .animated.fadeInRightBig { -webkit-animation-name: fadeInRightBig; -moz-animation-name: fadeInRightBig; -o-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } .animated.fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; -o-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); } } @-moz-keyframes fadeOutUp { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-20px); } } @-o-keyframes fadeOutUp { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } } .animated.fadeOutUp { -webkit-animation-name: fadeOutUp; -moz-animation-name: fadeOutUp; -o-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); } } @-moz-keyframes fadeOutDown { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(20px); } } @-o-keyframes fadeOutDown { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } } .animated.fadeOutDown { -webkit-animation-name: fadeOutDown; -moz-animation-name: fadeOutDown; -o-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); } } @-moz-keyframes fadeOutLeft { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-20px); } } @-o-keyframes fadeOutLeft { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } } .animated.fadeOutLeft { -webkit-animation-name: fadeOutLeft; -moz-animation-name: fadeOutLeft; -o-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); } } @-moz-keyframes fadeOutRight { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(20px); } } @-o-keyframes fadeOutRight { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } } .animated.fadeOutRight { -webkit-animation-name: fadeOutRight; -moz-animation-name: fadeOutRight; -o-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes fadeOutUpBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes fadeOutUpBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .animated.fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; -moz-animation-name: fadeOutUpBig; -o-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes fadeOutDownBig { 0% { opacity: 1; -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes fadeOutDownBig { 0% { opacity: 1; -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } } .animated.fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; -moz-animation-name: fadeOutDownBig; -o-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes fadeOutLeftBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes fadeOutLeftBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .animated.fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; -moz-animation-name: fadeOutLeftBig; -o-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes fadeOutRightBig { 0% { opacity: 1; -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes fadeOutRightBig { 0% { opacity: 1; -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .animated.fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; -moz-animation-name: fadeOutRightBig; -o-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(0.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(0.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(0.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(0.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(0.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(0.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(0.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(0.9); } 100% { transform: scale(1); } } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes slideInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes slideInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 100% { -o-transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; transform: translateY(-2000px); } 100% { transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; -moz-animation-name: slideInDown; -o-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes slideInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes slideInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 100% { -o-transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 100% { transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; -moz-animation-name: slideInLeft; -o-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes slideInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes slideInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 100% { -o-transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; transform: translateX(2000px); } 100% { transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; -moz-animation-name: slideInRight; -o-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes slideOutLeft { 0% { -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes slideOutLeft { 0% { -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; -moz-animation-name: slideOutLeft; -o-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes slideOutRight { 0% { -moz-transform: translateX(0); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes slideOutRight { 0% { -o-transform: translateX(0); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes slideOutRight { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; -moz-animation-name: slideOutRight; -o-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes slideOutUp { 0% { -moz-transform: translateY(0); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes slideOutUp { 0% { -o-transform: translateY(0); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; -moz-animation-name: slideOutUp; -o-animation-name: slideOutUp; animation-name: slideOutUp; } .animated.bounceIn { -webkit-animation-name: bounceIn; -moz-animation-name: bounceIn; -o-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInUp { 0% { opacity: 0; -moz-transform: translateY(2000px); } 60% { opacity: 1; -moz-transform: translateY(-30px); } 80% { -moz-transform: translateY(10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInUp { 0% { opacity: 0; -o-transform: translateY(2000px); } 60% { opacity: 1; -o-transform: translateY(-30px); } 80% { -o-transform: translateY(10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; transform: translateY(2000px); } 60% { opacity: 1; transform: translateY(-30px); } 80% { transform: translateY(10px); } 100% { transform: translateY(0); } } .animated.bounceInUp { -webkit-animation-name: bounceInUp; -moz-animation-name: bounceInUp; -o-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); } } @-moz-keyframes bounceInDown { 0% { opacity: 0; -moz-transform: translateY(-2000px); } 60% { opacity: 1; -moz-transform: translateY(30px); } 80% { -moz-transform: translateY(-10px); } 100% { -moz-transform: translateY(0); } } @-o-keyframes bounceInDown { 0% { opacity: 0; -o-transform: translateY(-2000px); } 60% { opacity: 1; -o-transform: translateY(30px); } 80% { -o-transform: translateY(-10px); } 100% { -o-transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; transform: translateY(-2000px); } 60% { opacity: 1; transform: translateY(30px); } 80% { transform: translateY(-10px); } 100% { transform: translateY(0); } } .animated.bounceInDown { -webkit-animation-name: bounceInDown; -moz-animation-name: bounceInDown; -o-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInLeft { 0% { opacity: 0; -moz-transform: translateX(-2000px); } 60% { opacity: 1; -moz-transform: translateX(30px); } 80% { -moz-transform: translateX(-10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInLeft { 0% { opacity: 0; -o-transform: translateX(-2000px); } 60% { opacity: 1; -o-transform: translateX(30px); } 80% { -o-transform: translateX(-10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 60% { opacity: 1; transform: translateX(30px); } 80% { transform: translateX(-10px); } 100% { transform: translateX(0); } } .animated.bounceInLeft { -webkit-animation-name: bounceInLeft; -moz-animation-name: bounceInLeft; -o-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); } 100% { -webkit-transform: translateX(0); } } @-moz-keyframes bounceInRight { 0% { opacity: 0; -moz-transform: translateX(2000px); } 60% { opacity: 1; -moz-transform: translateX(-30px); } 80% { -moz-transform: translateX(10px); } 100% { -moz-transform: translateX(0); } } @-o-keyframes bounceInRight { 0% { opacity: 0; -o-transform: translateX(2000px); } 60% { opacity: 1; -o-transform: translateX(-30px); } 80% { -o-transform: translateX(10px); } 100% { -o-transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; transform: translateX(2000px); } 60% { opacity: 1; transform: translateX(-30px); } 80% { transform: translateX(10px); } 100% { transform: translateX(0); } } .animated.bounceInRight { -webkit-animation-name: bounceInRight; -moz-animation-name: bounceInRight; -o-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); } 25% { -webkit-transform: scale(0.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(0.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(0.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(0.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(0.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(0.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(0.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(0.3); } } .animated.bounceOut { -webkit-animation-name: bounceOut; -moz-animation-name: bounceOut; -o-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); } } @-moz-keyframes bounceOutUp { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(20px); } 100% { opacity: 0; -moz-transform: translateY(-2000px); } } @-o-keyframes bounceOutUp { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(20px); } 100% { opacity: 0; -o-transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(20px); } 100% { opacity: 0; transform: translateY(-2000px); } } .animated.bounceOutUp { -webkit-animation-name: bounceOutUp; -moz-animation-name: bounceOutUp; -o-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); } } @-moz-keyframes bounceOutDown { 0% { -moz-transform: translateY(0); } 20% { opacity: 1; -moz-transform: translateY(-20px); } 100% { opacity: 0; -moz-transform: translateY(2000px); } } @-o-keyframes bounceOutDown { 0% { -o-transform: translateY(0); } 20% { opacity: 1; -o-transform: translateY(-20px); } 100% { opacity: 0; -o-transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { transform: translateY(0); } 20% { opacity: 1; transform: translateY(-20px); } 100% { opacity: 0; transform: translateY(2000px); } } .animated.bounceOutDown { -webkit-animation-name: bounceOutDown; -moz-animation-name: bounceOutDown; -o-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); } } @-moz-keyframes bounceOutLeft { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(20px); } 100% { opacity: 0; -moz-transform: translateX(-2000px); } } @-o-keyframes bounceOutLeft { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(20px); } 100% { opacity: 0; -o-transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(20px); } 100% { opacity: 0; transform: translateX(-2000px); } } .animated.bounceOutLeft { -webkit-animation-name: bounceOutLeft; -moz-animation-name: bounceOutLeft; -o-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); } } @-moz-keyframes bounceOutRight { 0% { -moz-transform: translateX(0); } 20% { opacity: 1; -moz-transform: translateX(-20px); } 100% { opacity: 0; -moz-transform: translateX(2000px); } } @-o-keyframes bounceOutRight { 0% { -o-transform: translateX(0); } 20% { opacity: 1; -o-transform: translateX(-20px); } 100% { opacity: 0; -o-transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { transform: translateX(0); } 20% { opacity: 1; transform: translateX(-20px); } 100% { opacity: 0; transform: translateX(2000px); } } .animated.bounceOutRight { -webkit-animation-name: bounceOutRight; -moz-animation-name: bounceOutRight; -o-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateIn { 0% { -moz-transform-origin: center center; -moz-transform: rotate(-200deg); opacity: 0; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateIn { 0% { -o-transform-origin: center center; -o-transform: rotate(-200deg); opacity: 0; } 100% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { transform-origin: center center; transform: rotate(-200deg); opacity: 0; } 100% { transform-origin: center center; transform: rotate(0); opacity: 1; } } .animated.rotateIn { -webkit-animation-name: rotateIn; -moz-animation-name: rotateIn; -o-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; -moz-animation-name: rotateInUpLeft; -o-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; -moz-animation-name: rotateInDownLeft; -o-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInUpRight { -webkit-animation-name: rotateInUpRight; -moz-animation-name: rotateInUpRight; -o-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } } @-moz-keyframes rotateInDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } } @-o-keyframes rotateInDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } 100% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } } .animated.rotateInDownRight { -webkit-animation-name: rotateInDownRight; -moz-animation-name: rotateInDownRight; -o-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -webkit-transform: rotate(200deg); opacity: 0; } } @-moz-keyframes rotateOut { 0% { -moz-transform-origin: center center; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: center center; -moz-transform: rotate(200deg); opacity: 0; } } @-o-keyframes rotateOut { 0% { -o-transform-origin: center center; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: center center; -o-transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { transform-origin: center center; transform: rotate(0); opacity: 1; } 100% { transform-origin: center center; transform: rotate(200deg); opacity: 0; } } .animated.rotateOut { -webkit-animation-name: rotateOut; -moz-animation-name: rotateOut; -o-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutUpLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutUpLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(-90deg); opacity: 0; } } .animated.rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; -moz-animation-name: rotateOutUpLeft; -o-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutDownLeft { 0% { -moz-transform-origin: left bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: left bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutDownLeft { 0% { -o-transform-origin: left bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: left bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { transform-origin: left bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: left bottom; transform: rotate(90deg); opacity: 0; } } .animated.rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; -moz-animation-name: rotateOutDownLeft; -o-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(90deg); opacity: 0; } } @-moz-keyframes rotateOutUpRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(90deg); opacity: 0; } } @-o-keyframes rotateOutUpRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(90deg); opacity: 0; } } .animated.rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; -moz-animation-name: rotateOutUpRight; -o-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -webkit-transform: rotate(-90deg); opacity: 0; } } @-moz-keyframes rotateOutDownRight { 0% { -moz-transform-origin: right bottom; -moz-transform: rotate(0); opacity: 1; } 100% { -moz-transform-origin: right bottom; -moz-transform: rotate(-90deg); opacity: 0; } } @-o-keyframes rotateOutDownRight { 0% { -o-transform-origin: right bottom; -o-transform: rotate(0); opacity: 1; } 100% { -o-transform-origin: right bottom; -o-transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { transform-origin: right bottom; transform: rotate(0); opacity: 1; } 100% { transform-origin: right bottom; transform: rotate(-90deg); opacity: 0; } } .animated.rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; -moz-animation-name: rotateOutDownRight; -o-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -webkit-animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); opacity: 0; } } @-moz-keyframes hinge { 0% { -moz-transform: rotate(0); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 20%, 60% { -moz-transform: rotate(80deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 40% { -moz-transform: rotate(60deg); -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 80% { -moz-transform: rotate(60deg) translateY(0); opacity: 1; -moz-transform-origin: top left; -moz-animation-timing-function: ease-in-out; } 100% { -moz-transform: translateY(700px); opacity: 0; } } @-o-keyframes hinge { 0% { -o-transform: rotate(0); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 20%, 60% { -o-transform: rotate(80deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 40% { -o-transform: rotate(60deg); -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 80% { -o-transform: rotate(60deg) translateY(0); opacity: 1; -o-transform-origin: top left; -o-animation-timing-function: ease-in-out; } 100% { -o-transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { transform: rotate(0); transform-origin: top left; animation-timing-function: ease-in-out; } 20%, 60% { transform: rotate(80deg); transform-origin: top left; animation-timing-function: ease-in-out; } 40% { transform: rotate(60deg); transform-origin: top left; animation-timing-function: ease-in-out; } 80% { transform: rotate(60deg) translateY(0); opacity: 1; transform-origin: top left; animation-timing-function: ease-in-out; } 100% { transform: translateY(700px); opacity: 0; } } .animated.hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } } @-moz-keyframes rollIn { 0% { opacity: 0; -moz-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } } @-o-keyframes rollIn { 0% { opacity: 0; -o-transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; transform: translateX(0px) rotate(0deg); } } .animated.rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); } } @-moz-keyframes rollOut { 0% { opacity: 1; -moz-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -moz-transform: translateX(100%) rotate(120deg); } } @-o-keyframes rollOut { 0% { opacity: 1; -o-transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -o-transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; transform: translateX(100%) rotate(120deg); } } .animated.rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-moz-keyframes lightSpeedIn { 0% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -moz-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -moz-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } } @-o-keyframes lightSpeedIn { 0% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -o-transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -o-transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { transform: translateX(0%) skewX(0deg); opacity: 1; } } .animated.lightSpeedIn { -webkit-animation-name: lightSpeedIn; -moz-animation-name: lightSpeedIn; -o-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; -moz-animation-timing-function: ease-out; -o-animation-timing-function: ease-out; animation-timing-function: ease-out; } .animated.lightSpeedIn { -webkit-animation-duration: 0.5s; -moz-animation-duration: 0.5s; -o-animation-duration: 0.5s; animation-duration: 0.5s; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-moz-keyframes lightSpeedOut { 0% { -moz-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -moz-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @-o-keyframes lightSpeedOut { 0% { -o-transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -o-transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { transform: translateX(100%) skewX(-30deg); opacity: 0; } } .animated.lightSpeedOut { -webkit-animation-name: lightSpeedOut; -moz-animation-name: lightSpeedOut; -o-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } .animated.lightSpeedOut { -webkit-animation-duration: 0.25s; -moz-animation-duration: 0.25s; -o-animation-duration: 0.25s; animation-duration: 0.25s; } /*------------------------------------------------------------------------------------------*/ /* 0. RESET */ /*------------------------------------------------------------------------------------------*/ /*! normalize.css v2.1.3 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined in IE 8/9. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * Correct `inline-block` display not defined in IE 8/9. */ audio, canvas, video { display: inline-block; } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9. * Hide the `template` element in IE, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* ========================================================================== Base ========================================================================== */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background: transparent; } /** * Address `outline` inconsistency between Chrome and other browsers. */ a:focus { outline: thin dotted; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* ========================================================================== Typography ========================================================================== */ /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari 5, and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } /** * Address styling not present in IE 8/9, Safari 5, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /** * Address differences between Firefox and other browsers. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Address styling not present in IE 8/9. */ mark { background: #ff0; color: #000; } /** * Correct font family set oddly in Safari 5 and Chrome. */ code, kbd, pre, samp { font-family: monospace, serif; font-size: 1em; } /** * Improve readability of pre-formatted text in all browsers. */ pre { white-space: pre-wrap; } /** * Set consistent quote types. */ q { quotes: "\201C" "\201D" "\2018" "\2019"; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ========================================================================== Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9. */ img { border: 0; } /** * Correct overflow displayed oddly in IE 9. */ svg:not(:root) { overflow: hidden; } /* ========================================================================== Figures ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari 5. */ figure { margin: 0; } /* ========================================================================== Forms ========================================================================== */ /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct `color` not being inherited in IE 8/9. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { border: 0; /* 1 */ padding: 0; /* 2 */ } /** * 1. Correct font family not being inherited in all browsers. * 2. Correct font size not being inherited in all browsers. * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome. */ button, input, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 2 */ margin: 0; /* 3 */ } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ button, input { line-height: normal; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+. * Correct `select` style inheritance in Firefox 4+ and Opera. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * 1. Remove default vertical scrollbar in IE 8/9. * 2. Improve readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ========================================================================== Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } /*------------------------------------------------------------------------------------------*/ /* 1. SETUP */ /*------------------------------------------------------------------------------------------*/ /* Defaults */ html { font-size: 62.5%; } body { font-size: 1.6em; line-height: 1.618; color: #84878c; font-family: 'Raleway', sans-serif; font-weight: 500; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; position: relative; background: #fff; word-wrap: break-word; } #wrapper { position: relative; width: 100%; overflow: hidden; } #inner-wrapper { position: relative; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: left ease 0.5s; -moz-transition: left ease 0.5s; -ms-transition: left ease 0.5s; -o-transition: left ease 0.5s; transition: left ease 0.5s; } /* Wrapper */ .wrapper { padding: 0 2.244em; } ::selection, ::-moz-selection { background: #f36557; color: #fff; } img { vertical-align: bottom; max-width: 100%; -webkit-transform: translateZ(0) scale(1, 1); } hr { background-color: #e6e6e6; border: 0; height: 1px; margin: 1.618em 0; } /* Hyperlinks */ a { color: #f36557; text-decoration: none; } a:hover { color: #d14335; text-decoration: none; } /* Typography */ /* All typography (and layout) based on a modular scale using 12 & 14 px values scaled in accordance the golden ratio (1.618) http://modularscale.com/scale/?px1=14&px2=12&ra1=1.618&ra2=0 Remember to keep margins consistent and try to avoid margin-top. If everything has an appropriate margin-bottom we don't need one and vertical rhythm will be kept consistent */ h1, h2, h3, h4, h5, h6 { font-family: 'Cabin', sans-serif; color: #1a212c; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { text-decoration: none; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover { text-decoration: underline; } h1 { font-size: 2.244em; line-height: 1.387em; margin: 0 0 .327em; } h2 { font-size: 1.618em; line-height: 1.387em; margin: 0 0 .53em; } h3 { font-size: 1.387em; margin: 0 0 .618em; } h4 { font-size: 1em; margin: 0 0 .857em; } h5 { font-size: .857em; margin: 0 0 1em; } h6 { font-size: .618em; margin: 0 0 1.387em; } p { -webkit-hyphens: auto; -webkit-hyphenate-character: "\2010"; -webkit-hyphenate-limit-after: 1; -webkit-hyphenate-limit-before: 3; -moz-hyphens: manual; orphans: 3; widows: 3; } ul, ol, dl, p, table, form, pre, address { margin: 0 0 1.618em 0; } ul, ol { padding-left: 0; list-style-position: inside; } li > ul, li > ol { margin: 0 0 0 1.618em; } dl dt { font-weight: bold; } dl dd { margin-bottom: 1.618em; } acronym { text-decoration: underline; cursor: help; } code { -webkit-border-radius: 0.202em; border-radius: 0.202em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; padding: .202em .53em; color: #f36557; font-size: .857em; white-space: nowrap; background-color: #f7f7f9; border: 1px solid #e1e1e8; } ins { background-color: rgba(243, 101, 87, 0.3); text-decoration: none; } pre { background-color: #f7f7f9; border: 1px solid #e1e1e8; padding: .618em 1em; font-size: .857em; -webkit-border-radius: 0.236em; border-radius: 0.236em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } /* @font-face icons - Used for the subscribe & connect social icons. If you would like to add more icons to the font, you can do so by rebuilding the font at http://keyamoon.com/icomoon/app/ and replace the existing font files in the theme with the new ones. */ @font-face { font-family: 'Social'; font-weight: normal; font-style: normal; src: url('includes/fonts//social.eot'); src: url('includes/fonts//social.eot?#iefix') format('embedded-opentype'), url('includes/fonts/social.woff') format('woff'), url('includes/fonts/social.ttf') format('truetype'), url('includes/fonts/social.svg#woo-social') format('svg'); } @font-face { font-family: 'FontAwesome'; src: url('includes/fonts//fontawesome-webfont.eot'); src: url('includes/fonts//fontawesome-webfont.eot?#iefix') format('embedded-opentype'), url('includes/fonts//fontawesome-webfont.woff') format('woff'), url('includes/fonts//fontawesome-webfont.ttf') format('truetype'), url('includes/fonts//fontawesome-webfont.svg#FontAwesome') format('svg'); font-weight: normal; font-style: normal; } /*------------------------------------------------------------------------------------------*/ /* 2. STRUCTURE */ /*------------------------------------------------------------------------------------------*/ /* Header */ #header-wrapper { padding: 2.618em 0; margin: 0 0 3.631em; background: #222832; } .home.blog #header-wrapper { margin: 0; } #header { clear: both; } #header #logo { float: left; max-width: 100%; } #header .site-title, #header .site-description { color: #000; display: none; text-align: center; } #header .site-title a, #header .site-description a { color: #525458; text-transform: none; font-weight: normal; text-decoration: none; } #header .site-title a:hover, #header .site-description a:hover { text-decoration: underline; } #header .site-title { margin-bottom: 0; word-wrap: break-word; } #header .site-description { margin-bottom: 1.618em; } #header .site-header { *zoom: 1; } #header .site-header:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #header .site-header:before, #header .site-header:after { content: ""; display: table; } #header .site-header:after { clear: both; } #header .nav-toggle { position: absolute; top: 2.244em; right: 2.618em; cursor: pointer; } #header .nav-toggle:after { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; display: inline-block; text-align: right; line-height: 1; content: "\f0c9"; background: #f36557; color: #ffffff; height: 1.5em; width: 1.5em; text-align: center; line-height: 1.5; font-size: 1.387em; -webkit-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; margin-left: 0; } #header .nav-toggle a { color: #fff; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); } #header .nav-toggle a:hover { text-decoration: none; } #header .nav-toggle span { display: none; } #header .site-description { color: #9ea1a5; font-style: italic; } #header #topad { float: right; } /* Sidebar */ #sidebar .secondary { float: left; margin-right: 20px; } #sidebar .secondary.last { margin: 0; } /* Footer */ #footer-wrapper { background: #222832; border-top: 0.202em solid #f36557; } #footer { padding: 3.631em 0; } #footer p { text-align: center; } #footer p:last-child { margin: 0; } #footer #copyright { margin: 0 0 1.618em; } #footer #credit img { vertical-align: middle; } #footer #credit span { display: none; } #footer-widgets { margin: 2.618em 0; } #footer-widgets + #footer:before { position: relative; content: ''; display: block; margin: -2.618em auto 2.618em; width: 12%; height: .202em; background: #f36557; } /*------------------------------------------------------------------------------------------*/ /* 3. WORDPRESS */ /*------------------------------------------------------------------------------------------*/ #breadcrumb, .post .video { margin-bottom: 1.618em; } .archive-header { display: block; float: left; width: 100%; margin: 0 0 1.618em; padding: 0 0 1em; *zoom: 1; } .archive-header:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .archive-header:before, .archive-header:after { content: ""; display: table; } .archive-header:after { clear: both; } .archive-header:after { content: ''; display: block; width: 7%; height: .202em; background: #f36557; } .archive-header .archive-rss a { text-transform: uppercase; font-size: .857em; } .archive-header .archive-rss a:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f09e"; } .archive-header h1 { font-size: 1.618em; text-transform: uppercase; margin: 0 0 .327em; } .archive-description { clear: both; } .archive-description p { font-weight: bold; margin: 0 0 1em; } .hentry { margin: 0 0 3.631em; *zoom: 1; /* Images */ } .hentry:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .hentry:before, .hentry:after { content: ""; display: table; } .hentry:after { clear: both; } .hentry header { margin: 0 0 2.244em; } .hentry header h1, .hentry header h2 { font-weight: bold; margin: 0 0 .125em; } .hentry header h1 a:link, .hentry header h2 a:link, .hentry header h1 a:visited, .hentry header h2 a:visited { color: #1a212c; } .hentry .post-meta { margin: 1em 0 0; font-size: .857em; text-transform: uppercase; color: #bec0c2; } .hentry .post-meta li { list-style: none; margin: 0 0 1em; } .hentry .post-meta li a { color: #bec0c2; text-decoration: none; border-bottom: .125em dashed transparent; } .hentry .post-meta li a:hover { color: #acaeb1; border-color: #d3d4d6; } .hentry .post-meta li:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f179"; color: #f36557; width: 1.35em; } .hentry .post-meta li.post-date:before { content: "\f133"; } .hentry .post-meta li.post-category:before { content: "\f114"; } .hentry .post-meta li.edit:before { content: "\f044"; } .hentry .post-more { clear: both; } .hentry .post-more .button.comments { margin-left: .618em; color: #b3b3b3; border-color: #b3b3b3; } .hentry .post-more .button.comments:hover { color: #fff; background: #b3b3b3; } .hentry p.tags { width: 100%; clear: both; } .hentry p.tags a { position: relative; display: inline-block; background: #f36557; color: #fff; font-size: .857em; padding: .16em .857em .16em 1.25em; margin: 0 .327em 1em 1.327em; -webkit-border-top-right-radius: 0.327em; -webkit-border-bottom-right-radius: 0.327em; border-top-right-radius: 0.327em; border-bottom-right-radius: 0.327em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .hentry p.tags a:hover { background: #e25446; } .hentry p.tags a:hover:before { border-color: transparent #e25446 transparent transparent; } .hentry p.tags a:before { content: ""; position: absolute; top: 0; left: -0.95em; width: 0; height: 0; border-color: transparent #f36557 transparent transparent; border-style: solid; border-width: 1em 1em 1em 0; } .hentry p.tags a:after { content: ""; position: absolute; top: 33%; left: 0; background: #f5f5f4; width: .53em; height: .53em; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .hentry .entry { font-size: 1.125em; } .hentry .entry ul, .hentry .entry ol { margin-left: 1.618em; } .hentry .entry blockquote { position: relative; margin: 0 0 1.618em; padding: 0 0 0 1.327em; border-left: 0.4em solid #f36557; font-style: italic; color: #777a7f; } .hentry img, .hentry img.thumbnail { background: #fff; max-width: 100%; height: auto; } .hentry img:hover, .hentry img.thumbnail:hover { border-color: #cdcdcd; } .hentry img.wp-smiley { padding: 0; border: 0; } .hentry .alignnone { margin: 0 0 1.618em 0; } .hentry .alignleft { float: left; margin: 0 1.618em 1em 0; } .hentry .alignright { float: right; margin: 0 0 1em 1.618em; } .hentry .aligncenter { display: block; text-align: center; margin: 0 auto 1.618em; } .hentry .wp-caption { padding: .618em; text-align: center; background: #f5f5f4; max-width: 100%; -webkit-border-radius: 0.327em; border-radius: 0.327em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .hentry .wp-caption img { margin: 0 0 .327em; padding: 0; background: none; border: 0; display: block; } .hentry .wp-caption-text { margin: 0; padding: 0; font-size: .857em; text-align: center; } /* Pagination */ .nav-entries a { display: block; color: #84878c; text-decoration: none; } .nav-entries a:hover { text-decoration: underline; } .woo-pagination { margin: 0 0 3.631em; } .woo-pagination .page-numbers { display: inline; text-decoration: none; color: #f36557; padding: .327em .857em; border: 0.146em solid #f36557; font-weight: bold; -webkit-border-radius: 0.327em; border-radius: 0.327em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .woo-pagination .page-numbers.dots { background: none; border: 0; } .woo-pagination .page-numbers:hover { color: #fff; background: #f36557; border-color: #f14f3f; } .woo-pagination .page-numbers.current { background: #f36557; border-color: #f14f3f; color: #fff; } /* Single Post Author */ #post-author { margin: 0 0 2.618em; background: #f5f5f4; padding: 1.618em; border-top: 1px solid #e6e6e6; clear: both; } #post-author .profile-image { float: left; margin: 0 1.618em .382em 0; padding: .382em; border: 1px solid #e6e6e6; background: rgba(255, 255, 255, 0.7); } /* Post Entry Nav */ #post-entries { clear: both; border-top: 2px solid #e6e6e6; padding: 1.618em 0 0; margin: 0 0 2.618em; } #post-entries .nav-prev a:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f060"; } #post-entries .nav-next a:after { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; text-align: right; line-height: 1; content: "\f061"; } #post-details { text-align: center; } #post-details:after { content: ''; display: block; margin: 2.618em auto; width: 25%; height: .202em; background: #e6e6e6; } #post-details .profile-image img { display: block; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; padding: .327em; border: 0.09em solid #e6e6e6; margin: 0 auto 1em; } #post-details .social { margin: 0 0 1.387em; list-style: none; } #post-details .social li { display: inline-block; margin: 0 .327em 0 0; } #post-details .social li a { display: block; overflow: hidden; height: 2.255em; opacity: 0.8; filter: alpha(opacity=@opacity * 100); -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; } #post-details .social li a:hover { opacity: 1; filter: alpha(opacity=@opacity * 100); } #post-details .social li a span { display: none; } #post-details .social li a:before { display: block; font-family: Social; font-size: 1em; line-height: 1; padding: .53em; display: inline-block; -webkit-border-radius: 300px; border-radius: 300px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; color: #fff; background: #f36557; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1); } #post-details .social li a.twitter:before { content: '\e002'; background-color: #00aced; } #post-details .social li a.facebook:before { content: '\e003'; background-color: #3b5998; } #post-details .social li a.gplus:before { content: '\e008'; background-color: #2d2d2d; font-weight: bold; } @media only screen and (min-width: 768px) { /* Post Entry Nav */ #post-entries { margin-left: 27.08333333%; } .hentry .post-meta { margin: 0 0 1.618em 0; } .hentry .post-meta li { display: inline; margin: 0 0 0 1.387em; } .hentry .post-meta li:first-child { margin: 0; } } /*------------------------------------------------------------------------------------------*/ /* 4. NAVIGATION */ /*------------------------------------------------------------------------------------------*/ /* Top Nav */ #top, .top-navigation { display: none; } /* Navigation */ ul.nav li a { padding: .53em 1em; display: block; } ul.nav li a:hover { text-decoration: none; } ul.nav li.current-menu-item > a { background: #ffffff; color: #84878c; } #navigation { clear: both; margin-bottom: 2.618em; width: 80%; left: -80%; position: absolute; top: 0; height: 100%; z-index: 999; background: #62656a; padding-top: 4.236em; box-shadow: inset -1.618em 0 1.618em -1em #515459; -webkit-box-shadow: inset -1.618em 0 1.618em -1em #515459; } #navigation .widget_product_search { margin: 0; border-top: 1px solid #515459; } #navigation .widget_product_search #searchform { border-left: 0; border-right: 0; -webkit-border-radius: 0; border-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; padding: .618em 1em; margin: 0; border-bottom: 1px solid #515459; border-top: 1px solid #73767b; background-color: #6a6d72; background-image: -webkit-gradient(linear, left top, left bottom, from(#6a6d72), to(#62656a)); background-image: -webkit-linear-gradient(top, #6a6d72, #62656a); background-image: -moz-linear-gradient(top, #6a6d72, #62656a); background-image: -ms-linear-gradient(top, #6a6d72, #62656a); background-image: -o-linear-gradient(top, #6a6d72, #62656a); background-image: linear-gradient(to bottom, #6a6d72, #62656a); } #navigation .widget_product_search #searchform #s { padding: .202em .857em; -webkit-border-radius: 4em; border-radius: 4em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background-color: #73767b; background-image: -webkit-gradient(linear, left top, left bottom, from(#73767b), to(#7a7d82)); background-image: -webkit-linear-gradient(top, #73767b, #7a7d82); background-image: -moz-linear-gradient(top, #73767b, #7a7d82); background-image: -ms-linear-gradient(top, #73767b, #7a7d82); background-image: -o-linear-gradient(top, #73767b, #7a7d82); background-image: linear-gradient(to bottom, #73767b, #7a7d82); border: 1px solid #515459; color: #c8cbd0; -webkit-box-shadow: inset 0 1px 3px #62656a, 0 1px 1px #73767b; box-shadow: inset 0 1px 3px #62656a, 0 1px 1px #73767b; } #navigation .widget_product_search #searchform #searchsubmit { display: none; } #navigation h3 { border-bottom: 1px solid #515459; border-top: 1px solid #8e9196; background-color: #84878c; background-image: -webkit-gradient(linear, left top, left bottom, from(#84878c), to(#73767b)); background-image: -webkit-linear-gradient(top, #84878c, #73767b); background-image: -moz-linear-gradient(top, #84878c, #73767b); background-image: -ms-linear-gradient(top, #84878c, #73767b); background-image: -o-linear-gradient(top, #84878c, #73767b); background-image: linear-gradient(to bottom, #84878c, #73767b); padding: .382em 1em; font-size: .857em; margin: 0; text-transform: uppercase; color: #d9dce1; text-shadow: 0 1px 0 #515459; } #navigation ul.nav { list-style: none; margin-bottom: 0; } #navigation ul.nav li { list-style: none; } #navigation ul.nav li a { border-bottom: 1px solid #515459; border-top: 1px solid #6a6d72; color: #a6a9ae; /*-webkit-tap-highlight-color: #f36557;*/ text-shadow: 0 -1px 0 #515459; } #navigation ul.nav li.current-menu-item > a { background-color: #6a6d72; background-image: -webkit-gradient(linear, left top, left bottom, from(#6a6d72), to(#62656a)); background-image: -webkit-linear-gradient(top, #6a6d72, #62656a); background-image: -moz-linear-gradient(top, #6a6d72, #62656a); background-image: -ms-linear-gradient(top, #6a6d72, #62656a); background-image: -o-linear-gradient(top, #6a6d72, #62656a); background-image: linear-gradient(to bottom, #6a6d72, #62656a); color: #f5f5f4; text-shadow: 0 1px #515459; border: 0; -webkit-box-shadow: inset 0 1px #73767b, inset 0 -1px #515459; box-shadow: inset 0 1px #73767b, inset 0 -1px #515459; } #navigation ul.nav li.current-menu-item > a:after { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; text-align: right; line-height: 1; content: "\f054"; font-size: .875em; float: right; line-height: 2; } #navigation ul.nav ul { margin: 0; } #navigation ul.nav ul li a { padding-left: 1.618em; } #navigation ul.nav ul li ul li a { padding-left: 2.618em; } #navigation .nav-close, #navigation .nav-home { position: absolute; top: 1em; left: 1em; cursor: pointer; } #navigation .nav-close:after, #navigation .nav-home:after { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; display: inline-block; text-align: right; line-height: 1; content: "\f00d"; background-color: #62656a; background-image: -webkit-gradient(linear, left top, left bottom, from(#62656a), to(#5a5d62)); background-image: -webkit-linear-gradient(top, #62656a, #5a5d62); background-image: -moz-linear-gradient(top, #62656a, #5a5d62); background-image: -ms-linear-gradient(top, #62656a, #5a5d62); background-image: -o-linear-gradient(top, #62656a, #5a5d62); background-image: linear-gradient(to bottom, #62656a, #5a5d62); height: 1.5em; width: 1.5em; text-align: center; line-height: 1.5; font-size: 1.618em; -webkit-border-radius: 2px; border-radius: 2px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; margin-left: 0; color: #a6a9ae; text-shadow: 0 -1px 0 #404348; -webkit-box-shadow: inset 0 0 1px 1px #404348, inset 0 2px #73767b, 0 1px #73767b; box-shadow: inset 0 0 1px 1px #404348, inset 0 2px #73767b, 0 1px #73767b; } #navigation .nav-close span, #navigation .nav-home span { display: none; } #navigation .nav-home { left: auto; right: 1em; } #navigation .nav-home:after { content: "\f015"; } #navigation ul.rss li { display: inline; padding: 0; } #navigation ul.rss li a:after { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; text-align: right; line-height: 1; content: "\f09e"; color: orange; float: right; line-height: 1.618; } #navigation ul.rss li.sub-email { color: #84878c; } #navigation ul.rss li.sub-email a:after { content: "\f003"; } .show-nav #navigation .top-navigation { display: block; } .show-nav #inner-wrapper { left: 80%; -webkit-border-radius: 0.618em; border-radius: 0.618em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } @media only screen and (max-width: 767px) { .csstransforms3d.csstransitions #navigation { left: 0; -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } .csstransforms3d.csstransitions #inner-wrapper { left: 0 !important; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: -webkit-transform 200ms ease; -moz-transition: -moz-transform 200ms ease; -o-transition: -o-transform 200ms ease; transition: transform 200ms ease; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } .csstransforms3d.csstransitions .show-nav #navigation { -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .csstransforms3d.csstransitions .show-nav #inner-wrapper { -webkit-transform: translate3d(80%, 0, 0); -moz-transform: translate3d(80%, 0, 0); -ms-transform: translate3d(80%, 0, 0); -o-transform: translate3d(80%, 0, 0); transform: translate3d(80%, 0, 0); -webkit-transform-origin: 50% 0%; -moz-transform-origin: 50% 0%; -ms-transform-origin: 50% 0%; -o-transform-origin: 50% 0%; transform-origin: 50% 0%; } } /*------------------------------------------------------------------------------------------*/ /* 5. WIDGETS */ /*------------------------------------------------------------------------------------------*/ /* General */ .widget { margin-bottom: 2.244em; } .widget h3 { padding: 0 0 .382em; margin: 0 0 1.327em; font-size: 1.1em; text-transform: uppercase; } .widget ul { clear: both; list-style: none; } .widget ul li a { text-decoration: none; } .widget ul li a:hover { text-decoration: underline; } /* Search Form */ .search_main { display: inline-block; } #searchform { overflow: hidden; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; border: 0.146em solid #e6e6e6; -webkit-border-radius: 2.618em; border-radius: 2.618em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #searchform .s, #searchform #s { padding: .857em 2.618em .857em 1.618em; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; border: 0; background: none; color: #84878c; } #searchform .search-submit, #searchform #searchsubmit { position: absolute; top: 35%; right: 1.387em; border: none; overflow: hidden; margin: 0; padding: 20px 0 0; width: 20px; height: 0; background: url('images/ico-search.png') no-repeat left top; border-radius: 0; -moz-border-radius: 0; -webkit-border-radius: 0; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } #searchform .search-submit:active, #searchform #searchsubmit:active { box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; } #searchform .search-submit:hover, #searchform #searchsubmit:hover { background: url('images/ico-search.png') no-repeat left top; } #searchform label { display: none; } .widget_search #searchform { margin: 0; } /* Flickr */ .widget_woo_flickr h3 span { color: #0051d8; } .widget_woo_flickr h3 span span { color: #ff1183; } .widget_woo_flickr .wrap { margin: 1em 0 0; } .widget_woo_flickr .wrap .flickr_badge_image { display: inline-block; margin: 0 1em 1em 0; } .widget_woo_flickr .wrap .flickr_badge_image a img { display: block; padding: .236em; border: 1px solid #e6e6e6; -webkit-border-radius: 300px; border-radius: 300px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } /* Calendar */ #wp-calendar caption { padding: 1em; } #wp-calendar th, #wp-calendar td { text-align: center; padding: .53em 0; } /* Author Info */ .widget_woo_blogauthorinfo .avatar { padding: .236em; border: 1px solid #e6e6e6; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .widget_woo_blogauthorinfo .left { float: left; margin: 0 1em .618em 0; } .widget_woo_blogauthorinfo .right { float: right; margin: 0 .618em 1em; } /* Tabs */ .widget_woodojo_tabs, .woocommerce_tabs, .woocommerce-tabs { clear: both; } .widget_woodojo_tabs ul.nav-tabs, .woocommerce_tabs ul.nav-tabs, .woocommerce-tabs ul.nav-tabs, .widget_woodojo_tabs ul.tabs, .woocommerce_tabs ul.tabs, .woocommerce-tabs ul.tabs { margin: 0; list-style: none; border-bottom: 0.146em solid #e6e6e6; *zoom: 1; } .widget_woodojo_tabs ul.nav-tabs:after, .woocommerce_tabs ul.nav-tabs:after, .woocommerce-tabs ul.nav-tabs:after, .widget_woodojo_tabs ul.tabs:after, .woocommerce_tabs ul.tabs:after, .woocommerce-tabs ul.tabs:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .widget_woodojo_tabs ul.nav-tabs:before, .woocommerce_tabs ul.nav-tabs:before, .woocommerce-tabs ul.nav-tabs:before, .widget_woodojo_tabs ul.tabs:before, .woocommerce_tabs ul.tabs:before, .woocommerce-tabs ul.tabs:before, .widget_woodojo_tabs ul.nav-tabs:after, .woocommerce_tabs ul.nav-tabs:after, .woocommerce-tabs ul.nav-tabs:after, .widget_woodojo_tabs ul.tabs:after, .woocommerce_tabs ul.tabs:after, .woocommerce-tabs ul.tabs:after { content: ""; display: table; } .widget_woodojo_tabs ul.nav-tabs:after, .woocommerce_tabs ul.nav-tabs:after, .woocommerce-tabs ul.nav-tabs:after, .widget_woodojo_tabs ul.tabs:after, .woocommerce_tabs ul.tabs:after, .woocommerce-tabs ul.tabs:after { clear: both; } .widget_woodojo_tabs ul.nav-tabs li, .woocommerce_tabs ul.nav-tabs li, .woocommerce-tabs ul.nav-tabs li, .widget_woodojo_tabs ul.tabs li, .woocommerce_tabs ul.tabs li, .woocommerce-tabs ul.tabs li { float: left; margin-bottom: 0; margin-right: .53em; display: block; } .widget_woodojo_tabs ul.nav-tabs li a, .woocommerce_tabs ul.nav-tabs li a, .woocommerce-tabs ul.nav-tabs li a, .widget_woodojo_tabs ul.tabs li a, .woocommerce_tabs ul.tabs li a, .woocommerce-tabs ul.tabs li a { border-bottom: 0; background: rgba(230, 230, 230, 0.4); border: 0.146em solid #e6e6e6; border-bottom-width: 0; display: block; color: #84878c; margin: 0 !important; padding: .53em .618em !important; -webkit-border-top-left-radius: 0.53em; -webkit-border-top-right-radius: 0.53em; border-top-left-radius: 0.53em; border-top-right-radius: 0.53em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; text-decoration: none; } .widget_woodojo_tabs ul.nav-tabs li a:hover, .woocommerce_tabs ul.nav-tabs li a:hover, .woocommerce-tabs ul.nav-tabs li a:hover, .widget_woodojo_tabs ul.tabs li a:hover, .woocommerce_tabs ul.tabs li a:hover, .woocommerce-tabs ul.tabs li a:hover { color: #f36557; } .widget_woodojo_tabs ul.nav-tabs li:last-child a, .woocommerce_tabs ul.nav-tabs li:last-child a, .woocommerce-tabs ul.nav-tabs li:last-child a, .widget_woodojo_tabs ul.tabs li:last-child a, .woocommerce_tabs ul.tabs li:last-child a, .woocommerce-tabs ul.tabs li:last-child a { border-right-width: .146em; } .widget_woodojo_tabs ul.nav-tabs li.active, .woocommerce_tabs ul.nav-tabs li.active, .woocommerce-tabs ul.nav-tabs li.active, .widget_woodojo_tabs ul.tabs li.active, .woocommerce_tabs ul.tabs li.active, .woocommerce-tabs ul.tabs li.active { position: relative; } .widget_woodojo_tabs ul.nav-tabs li.active a, .woocommerce_tabs ul.nav-tabs li.active a, .woocommerce-tabs ul.nav-tabs li.active a, .widget_woodojo_tabs ul.tabs li.active a, .woocommerce_tabs ul.tabs li.active a, .woocommerce-tabs ul.tabs li.active a { border-width: .146em !important; border-bottom-width: 0 !important; position: relative; background: #fff; color: #f36557; } .widget_woodojo_tabs ul.nav-tabs li.active a:after, .woocommerce_tabs ul.nav-tabs li.active a:after, .woocommerce-tabs ul.nav-tabs li.active a:after, .widget_woodojo_tabs ul.tabs li.active a:after, .woocommerce_tabs ul.tabs li.active a:after, .woocommerce-tabs ul.tabs li.active a:after { content: ""; display: block; position: absolute; bottom: -4px; left: 0; right: 0; height: 4px; background: #fff; } .widget_woodojo_tabs .tab-content, .woocommerce_tabs .tab-content, .woocommerce-tabs .tab-content { padding: 1em; border: 0.146em solid #e6e6e6; border-top-width: 0; -webkit-border-bottom-left-radius: 0.53em; -webkit-border-bottom-right-radius: 0.53em; border-bottom-left-radius: 0.53em; border-bottom-right-radius: 0.53em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .widget_woodojo_tabs .tab-content ul li, .woocommerce_tabs .tab-content ul li, .woocommerce-tabs .tab-content ul li { padding: 0 0 1em !important; margin: 0 0 1em !important; border-bottom: 0.102em solid #e6e6e6; } .widget_woodojo_tabs .tab-content ul li img, .woocommerce_tabs .tab-content ul li img, .woocommerce-tabs .tab-content ul li img { border-radius: 100%; } .widget_woodojo_tabs .tab-content ul li:last-child, .woocommerce_tabs .tab-content ul li:last-child, .woocommerce-tabs .tab-content ul li:last-child { margin: 0 !important; padding: 0 !important; border: 0; } /* Twitter */ .widget_woodojo_tweets ul.tweets li { margin: 0; padding: 0; border: 0; } .widget_woodojo_tweets ul.tweets li .time-ago { margin: .618em 0 0; display: block; } .widget_woodojo_tweets ul.tweets li .time-ago a { text-transform: uppercase; color: #bec0c2; text-decoration: none; border-bottom: .125em dashed transparent; } .widget_woodojo_tweets ul.tweets li .time-ago a:hover { color: #acaeb1; border-color: #d3d4d6; } .widget_woodojo_tweets ul.tweets li:after { content: ''; display: block; margin: 1.618em 0; width: 20%; height: .202em; background: #e6e6e6; } .widget_woodojo_tweets ul.tweets li:last-child { margin: 0 0 1.387em; } .widget_woodojo_tweets ul.tweets li:last-child:after { content: none; } /* Instagram */ .widget_woodojo_instagram { margin-bottom: 1.2em; } .widget_woodojo_instagram ul li img { display: block; padding: .236em; border: 1px solid #e6e6e6; -webkit-border-radius: 300px; border-radius: 300px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } /* Instagram Profile */ .widget_woodojo_twitterprofile .avatar, .widget_woodojo_instagram_profile .avatar { display: block; padding: .236em; border: 1px solid #e6e6e6; -webkit-border-radius: 300px; border-radius: 300px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } /* Twitter Profile */ .widget_woodojo_twitterprofile .profile-info { margin: 1.387em 0; clear: both; } .widget_woodojo_twitterprofile .tweeting-since { margin: 1.618em 0; background: none; } /* Footer Widgets */ #footer-widgets .widget h3 { color: #fff; } #footer-widgets .widget ul { list-style: none; } #footer-widgets .widget ul li { border-bottom: 0.09em solid #2c3441; padding: 0 0 .618em; margin: 0 0 .618em; } #footer-widgets .widget ul li:last-child { margin: 0; } #footer-widgets .widget ul li a:hover { text-decoration: none; } #footer-widgets #searchform { border-color: #2c3441; } #footer-widgets .widget_woo_flickr .wrap .flickr_badge_image a img { border-color: #2c3441; } #footer-widgets .widget_woodojo_instagram ul li img { border-color: #2c3441; } #footer-widgets .widget_woodojo_twitterprofile .avatar, #footer-widgets .widget_woodojo_instagram_profile .avatar { border-color: #2c3441; } #footer-widgets .widget_woodojo_tweets ul.tweets li { padding: 0 0 1.387em; margin: 0 0 1.387em; } #footer-widgets .widget_woodojo_tweets ul.tweets li:after { content: none; } #footer-widgets .widget_woodojo_tweets ul.tweets li:last-child { border: 0; margin: 0 0 1em; } #footer-widgets .widget_woo_blogauthorinfo .avatar { border-color: #2c3441; } /*------------------------------------------------------------------------------------------*/ /* 6. COMMENTS */ /*------------------------------------------------------------------------------------------*/ /* Comments */ #comments-wrapper { padding: 3.631em 0; background: #f5f5f4; border-top: 0.09em solid #ebebeb; } #comments h3, #respond h3 { margin: 0 0 2.244em; border: 0; font-size: 1.1em; text-transform: uppercase; } #comments { clear: both; } #comments .comments-num { margin-left: 13.33333333%; } #comments .nocomments { position: relative; margin-bottom: 1.618em; font-weight: 500; font-size: 1em; font-family: 'Raleway', sans-serif; } #comments .nocomments:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f179"; content: "\f05a"; color: #f36557; width: 1.8em; } #comments .commentlist { margin: 0; list-style: none; } #comments .commentlist ul.children { margin: 0 1.618em; } #comments .commentlist li.comment { list-style: none; clear: both; } #comments .commentlist li.comment .avatar { width: 2.244em; height: auto; margin: -0.857em 0 1.618em 0.857em; } #comments .commentlist li.comment .avatar img.avatar { width: 100% !important; height: auto; margin: 0 !important; vertical-align: middle; border: 1px solid #e6e6e6; padding: .327em; background: #fff; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #comments .commentlist li.comment .comment-entry p:last-child { margin: 0; } #comments .commentlist li.comment .reply a { font-size: .857em; background: none; border: 0; color: #f36557 !important; text-shadow: none; margin: 0; text-transform: capitalize; padding: 0; } #comments .commentlist li.comment .reply a:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f112"; margin-right: .53em; } #comments .commentlist li.comment .reply a:hover { color: #d14335 !important; } #comments .commentlist li.comment #respond { width: 100%; padding: 1.618em; margin: 1.618em 0 0; background: #f5f5f4; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #comments .commentlist li.comment #respond #reply-title { margin: 0; } #comments .commentlist li.comment #respond #commentform { margin: 0; } #comments .commentlist li.comment #respond #commentform .form-submit { margin: 0; } #comments .commentlist > li.comment { *zoom: 1; list-style: none; } #comments .commentlist > li.comment:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #comments .commentlist > li.comment:before, #comments .commentlist > li.comment:after { content: ""; display: table; } #comments .commentlist > li.comment:after { clear: both; } #comments .commentlist > li.comment .comment-text { position: relative; background: #ffffff; padding: 1.618em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 2.618em; } #comments .commentlist > li.comment .comment-text p:last-child { margin-bottom: 0; } #comments .commentlist > li.comment .comment-text .comment-head { margin: 0 0 1em 0; } #comments .commentlist > li.comment .comment-text .comment-head .name { display: block; margin: 0 .618em 0 0; font-weight: bold; text-transform: capitalize; color: #f36557; font-size: 1.1em; } #comments .commentlist > li.comment .comment-text .comment-head .date, #comments .commentlist > li.comment .comment-text .comment-head .edit, #comments .commentlist > li.comment .comment-text .comment-head .perma { font-size: .857em; color: #b9babd; } #comments .commentlist > li.comment .comment-text:before { content: ''; width: 0; height: 0; position: absolute; top: 100%; border-top: .618em solid white; border-left: .618em solid transparent; border-right: .618em solid transparent; } #reviews ol.commentlist li.comment .comment-text { padding: 0; } /* Comments Form */ #respond label { color: #9ea1a5; } #respond #reply-title small { display: block; margin: 0 0 1.618em; text-transform: none; font-weight: 500; } #respond #commentform { margin: 0; } #respond #commentform .comment-form-url { margin-right: 0; } #respond #commentform .form-submit { margin: 0; } #respond #commentform label { display: block; margin: 0 0 .53em; font-size: .857em; } #respond #commentform input.txt, #respond #commentform textarea { background: #fff; width: 100%; } /* Pingbacks / Trackbacks */ .pinglist li { margin: 0 0 0 1.618em; list-style-type: decimal; } .pinglist li .author { font-weight: bold; } .pinglist li .pingcontent { display: block; margin: 0 0 1.618em; } @media only screen and (min-width: 768px) { #comments .commentlist li.comment .avatar { margin-top: 0; margin-bottom: 0; } #comments .commentlist ul.children { margin: 0; } #comments .commentlist > li.comment { display: block; width: 106.25%; margin-left: -3.125%; margin-right: -3.125%; *width: 106.19791667%; *margin-left: -3.17708333%; *margin-right: -3.17708333%; *zoom: 1; } #comments .commentlist > li.comment:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #comments .commentlist > li.comment:before, #comments .commentlist > li.comment:after { content: ""; display: table; } #comments .commentlist > li.comment:after { clear: both; } #comments .commentlist > li.comment .avatar { display: inline; float: left; width: 6.25%; margin-left: 3.125%; margin-right: 3.125%; *width: 6.19791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; } #comments .commentlist > li.comment .avatar img { width: 100%; height: auto; } #comments .commentlist > li.comment .comment-text { display: inline; float: left; width: 81.25%; margin-left: 3.125%; margin-right: 3.125%; *width: 81.19791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; float: right; } #comments .commentlist > li.comment .comment-text:before { top: 1.327em; left: -0.55em; border-left: 0; border-top: .618em solid transparent; border-bottom: .618em solid transparent; border-right: .618em solid white; } #comments .commentlist > li.comment ul.children li.comment .comment-text { display: inline; float: left; width: 68.75%; margin-left: 3.125%; margin-right: 3.125%; *width: 68.69791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; } #comments .commentlist > li.comment ul.children li.comment .comment-text, #comments .commentlist > li.comment ul.children li.comment .avatar { float: right; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment .comment-text { display: inline; float: left; width: 56.25%; margin-left: 3.125%; margin-right: 3.125%; *width: 56.19791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment .comment-text, #comments .commentlist > li.comment ul.children li.comment ul.children li.comment .avatar { float: right; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment .comment-text { display: inline; float: left; width: 43.75%; margin-left: 3.125%; margin-right: 3.125%; *width: 43.69791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment .comment-text, #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment .avatar { float: right; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment ul.children li.comment .comment-text { display: inline; float: left; width: 31.25%; margin-left: 3.125%; margin-right: 3.125%; *width: 31.19791667%; *margin-left: 3.07291667%; *margin-right: 3.07291667%; } #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment ul.children li.comment .comment-text, #comments .commentlist > li.comment ul.children li.comment ul.children li.comment ul.children li.comment ul.children li.comment .avatar { float: right; } } /*------------------------------------------------------------------------------------------*/ /* 7. PAGE TEMPLATES */ /*------------------------------------------------------------------------------------------*/ /* Contact Form */ #contact-page .screenReader { left: -9999px; position: absolute; top: -9999px; display: none; } #contact-page ol.forms { *zoom: 1; margin: 0 0 2.618em; list-style: none; } #contact-page ol.forms:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #contact-page ol.forms:before, #contact-page ol.forms:after { content: ""; display: table; } #contact-page ol.forms:after { clear: both; } #contact-page ol.forms li { clear: both; float: left; margin-bottom: 1.618em; position: relative; width: 48%; } #contact-page ol.forms li:first-child { margin-right: 3.8%; } #contact-page ol.forms li:nth-child(2n) { clear: none; } #contact-page ol.forms li.textarea, #contact-page ol.forms li.screenReader, #contact-page ol.forms li.inline, #contact-page ol.forms li.buttons, #contact-page ol.forms li input.txt, #contact-page ol.forms li textarea { width: 100%; } #contact-page ol.forms li .error { display: block; color: red; } #contact-page ol.forms li.textarea .error { display: block; } #contact-page ol.forms li.screenReader { margin-bottom: 0; } #contact-page ol.forms li.inline { clear: none; float: left; width: 48%; } #contact-page ol.forms li.inline input { width: auto; margin-right: .53em; position: relative; top: -0.5px; } #contact-page ol.forms li.inline label { display: inline; float: none; width: auto; font-size: .857em; font-weight: normal; font-style: italic; } #contact-page ol.forms li.buttons { clear: none; float: right; width: 48%; text-align: right; } #contact-page ol.forms label { cursor: pointer; display: block; font-weight: 700; margin: 0 0 1em; } .page-template-template-contact-php #single_map_canvas img { max-width: inherit; } .page-template-template-contact-php #location-map { margin: 0 0 2.618em; border-bottom: 1px solid #e6e6e6; } .page-template-template-contact-php #location-map #location { margin: 0 0 2.618em; } .page-template-template-contact-php #location-map #location ul { margin: 0; padding: 0; } .page-template-template-contact-php #location-map #location ul li { list-style: none; padding: 0; } .page-template-template-contact-php #location-map #map { margin: 0 0 2.618em; } .page-template-template-contact-php #twitter-connect { margin: 0 0 2.618em; border-bottom: 1px solid #e6e6e6; } .page-template-template-contact-php #twitter-connect #twitter { margin: 0 0 2.618em; } .page-template-template-contact-php #twitter-connect #twitter ul { margin: 0 0 .857em; list-style: none; } .page-template-template-contact-php #twitter-connect #twitter a.time { color: #acaeb1; } .page-template-template-contact-php #twitter-connect #twitter .follow-twitter { font-style: italic; font-size: .857em; } .page-template-template-contact-php #twitter-connect #contact-social { margin: 0 0 2.618em; } .page-template-template-contact-php #twitter-connect #contact-social #connect { background: none; border: none; padding: 0; } .page-template-template-contact-php #twitter-connect #contact-social #connect .social { float: none; clear: both; } .page-template-template-contact-php #twitter-connect #contact-social #connect .social a span { display: none; } @media only screen and (min-width: 768px) { .page-template-template-contact-php #location-map { *zoom: 1; } .page-template-template-contact-php #location-map:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .page-template-template-contact-php #location-map:before, .page-template-template-contact-php #location-map:after { content: ""; display: table; } .page-template-template-contact-php #location-map:after { clear: both; } .page-template-template-contact-php #location-map #location { float: left; width: 30%; } .page-template-template-contact-php #location-map #map.float { float: right; width: 65%; } .page-template-template-contact-php #twitter-connect { *zoom: 1; } .page-template-template-contact-php #twitter-connect:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .page-template-template-contact-php #twitter-connect:before, .page-template-template-contact-php #twitter-connect:after { content: ""; display: table; } .page-template-template-contact-php #twitter-connect:after { clear: both; } .page-template-template-contact-php #twitter-connect #twitter { float: left; width: 45%; } .page-template-template-contact-php #twitter-connect #contact-social.float { float: right; width: 45%; } } /* Sitemap */ .page-template-template-sitemap-php .entry ul, .page-template-template-sitemap-php .entry ol { list-style: none; margin-left: 0; } .page-template-template-sitemap-php .entry ul ul, .page-template-template-sitemap-php .entry ol ul, .page-template-template-sitemap-php .entry ul ol, .page-template-template-sitemap-php .entry ol ol { margin-left: 20px; } /* Business Template */ .page-template-template-business-php #content { *zoom: 1; } .page-template-template-business-php #content:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .page-template-template-business-php #content:before, .page-template-template-business-php #content:after { content: ""; display: table; } .page-template-template-business-php #content:after { clear: both; } .page-template-template-business-php .business-content, .page-template-template-business-php #business-testimonials { padding: 2.618em 0; background: #f5f5f4; border-color: #e6e6e6; border-style: solid; border-width: 1px 0; } .page-template-template-business-php .business-content p:last-child { margin: 0; } .page-template-template-business-php #business-testimonials { margin: 0 0 3.631em; } .page-template-template-business-php #business-testimonials .quote { margin: 0; } .page-template-template-business-php #business-testimonials .widget { margin-bottom: 0; } .page-template-template-business-php .widget_woothemes_features .feature { margin: 0 0 1.387em; } .page-template-template-business-php .widget, .page-template-template-business-php .business-content .title, .page-template-template-business-php .business-content .entry { display: inline; float: left; width: 95.83333333%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 95.78125%; *margin-left: 2.03125%; *margin-right: 2.03125%; } .page-template-template-business-php .wooslider { box-shadow: 0 0 0 0 #888888; -webkit-box-shadow: 0 0 0 0 #888888; padding: 0; } .page-template-template-business-php .wooslider .slides { margin: 0 0 1.618em; } /*------------------------------------------------------------------------------------------*/ /* 8. FLEXSLIDER */ /*------------------------------------------------------------------------------------------*/ /* * jQuery FlexSlider v2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus { outline: none; } .slides, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; } /* FlexSlider Necessary Styles */ .flexslider { margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img { width: 100%; display: block; } .flex-pauseplay span { text-transform: capitalize; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block; } * html .slides { height: 1%; } /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child { display: block; } /* Theme */ .flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2); zoom: 1; /* Direction Nav */ /* Control Nav */ /* Content Styles */ } .flexslider .slides { zoom: 1; } .flexslider .flex-viewport { max-height: 2000px; margin: 1px; -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; } .flexslider.loading .flex-viewport { max-height: 300px; } .flexslider .flex-direction-nav a { position: absolute; display: block; margin: -20px 0 0; padding: 5px 0 0; width: 30px; height: 25px; overflow: hidden; top: 50%; z-index: 10; cursor: pointer; text-align: center; opacity: 0; filter: alpha(opacity=@opacity * 100); -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; } .flexslider .flex-direction-nav a:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f179"; margin: 0; font-size: 1.618em; } .flexslider .flex-direction-nav .flex-next { right: -10px; } .flexslider .flex-direction-nav .flex-next:before { content: '\f054'; } .flexslider .flex-direction-nav .flex-prev { left: -10px; } .flexslider .flex-direction-nav .flex-prev:before { content: '\f053'; } .flexslider .flex-direction-nav.flex-disabled { opacity: 0.3; filter: alpha(opacity=@opacity * 100); cursor: default; } .flexslider:hover .flex-direction-nav a { opacity: 1; filter: alpha(opacity=@opacity * 100); } .flexslider:hover .flex-direction-nav .flex-prev { left: 0; } .flexslider:hover .flex-direction-nav .flex-next { right: 0; } .flexslider .flex-control-nav { width: 100%; position: absolute; bottom: -40px; text-align: center; } .flexslider .flex-control-nav li { margin: 0 6px; display: inline-block; } .flexslider .flex-control-nav li a { width: 11px; height: 11px; display: block; background: #666; background: rgba(0, 0, 0, 0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; border-radius: 20px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.3); -webkit-box-shadow: inset 0 0 3px 0 rgba(0, 0, 0, 0.3); } .flexslider .flex-control-nav li a:hover { background: #333; background: rgba(0, 0, 0, 0.7); } .flexslider .flex-control-nav li a.flex-active { background: #000; background: rgba(0, 0, 0, 0.9); cursor: default; } .flexslider .slides img { width: auto; } .flexslider .layout-full .slide-content, .flexslider .layout-full .slide-media { width: 100%; float: none; } .flexslider .layout-left-content .slide-content, .flexslider .layout-right-content .slide-content, .flexslider .layout-left-content .slide-media, .flexslider .layout-right-content .slide-media { width: 45%; } .flexslider .layout-left-content { *zoom: 1; } .flexslider .layout-left-content:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .flexslider .layout-left-content:before, .flexslider .layout-left-content:after { content: ""; display: table; } .flexslider .layout-left-content:after { clear: both; } .flexslider .layout-left-content .slide-content { float: left; } .flexslider .layout-left-content .slide-media { float: right; } .flexslider .layout-right-content { *zoom: 1; } .flexslider .layout-right-content:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .flexslider .layout-right-content:before, .flexslider .layout-right-content:after { content: ""; display: table; } .flexslider .layout-right-content:after { clear: both; } .flexslider .layout-right-content .slide-content { float: right; } .flexslider .layout-right-content .slide-media { float: left; } /*------------------------------------------------------------------------------------------*/ /* 9. MISC */ /*------------------------------------------------------------------------------------------*/ /* Floating & Alignment */ .fl { float: left; } .fr { float: right; } .ac { text-align: center; } .ar { text-align: right; } /* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements. j.mp/bestclearfix */ .fix:before, .fix:after, .col-full:before, .col-full:after { content: "\0020"; display: block; height: 0; overflow: hidden; } .fix:after, .col-full:after { clear: both; } /* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */ .fix, .col-full { zoom: 1; } /* Breadcrumbs */ #breadcrumbs { margin: -3.631em 0 3.631em; padding: 1.618em 0; background: #f5f5f4; border-bottom: 0.09em solid #ebebeb; } #breadcrumbs .breadcrumb-trail { font-size: .857em; } #breadcrumbs .breadcrumb-trail a.trail-begin:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f015"; } #breadcrumbs .breadcrumb-trail .sep { display: block; text-indent: -999px; position: relative; height: 1em; width: 1em; display: inline-block; padding: 0 .618em; color: #c8cbd0; } #breadcrumbs .breadcrumb-trail .sep:before { font-family: 'FontAwesome'; speak: none; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased; margin: 0; text-indent: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; text-align: center; content: "\f105"; line-height: 1.618; } /* Subscribe & Connect (& Related posts) */ #connect { clear: both; } #connect .newsletter-form { margin: 0 0 1.387em; } #connect .newsletter-form .email { margin: 0 1em 1em 0; } #connect .newsletter-form .submit { margin: 0 0 1em; } #connect .social a { opacity: 0.8; filter: alpha(opacity=@opacity * 100); -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; } #connect .social a:hover { opacity: 1; filter: alpha(opacity=@opacity * 100); } #connect .social { font-size: .857em; } #connect .social a:hover { text-decoration: none; } #connect .social a:before { font-family: Social; font-size: 1.2em; line-height: 1.1; margin: 0 0.53em 0.53em 0; padding: .53em; display: inline-block; -webkit-border-radius: 300px; border-radius: 300px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; color: #fff; background: #f36557; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.1); } #connect .social a.subscribe:before { content: '\e001'; background-color: #FF6600; } #connect .social a.twitter:before { content: '\e002'; background-color: #00aced; } #connect .social a.facebook:before { content: '\e003'; background-color: #3b5998; } #connect .social a.youtube:before { content: '\e004'; background-color: #af2b26; } #connect .social a.flickr:before { content: '\e005'; background-color: #ff0084; } #connect .social a.linkedin:before { content: '\e006'; background-color: #71c5ef; } #connect .social a.delicious:before { content: '\e007'; background-color: #285da7; } #connect .social a.googleplus:before { content: '\e008'; background-color: #2d2d2d; font-weight: bold; } #connect .social a.dribbble:before { content: '\e009'; background-color: #ea4c89; } #connect .social a.instagram:before { content: '\e010'; background-color: #517fa4; } #connect .social a.vimeo:before { content: '\e011'; background-color: #33454E; } #connect .social a.pinterest:before { content: '\e012'; background-color: #cb2027; } #main #connect { margin: 0 0 2.618em; background: #f5f5f4; padding: 1.618em; border-top: 1px solid #e6e6e6; } #related-posts { margin: 0 0 2.618em; } #related-posts ul { list-style: none; } /* Tables */ table { border-spacing: 0; width: 100%; border: 1px solid #e6e6e6; -webkit-border-radius: 4px; border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; box-shadow: 0 1px 2px 0 #ffffff; -webkit-box-shadow: 0 1px 2px 0 #ffffff; border-collapse: separate; } table td, table th { padding: .327em .102em; text-align: left; border-right: 1px solid #e6e6e6; vertical-align: top; } table td p:last-child, table th p:last-child { margin-bottom: 0; } table thead th { border-right: 1px dotted #e4e4e3; border-bottom: 1px solid #e6e6e6; text-transform: uppercase; padding: .327em .102em; vertical-align: middle; } table thead th:first-child { -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } table thead th:last-child { -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 0; border-bottom-left-radius: 0; border-bottom-right-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } table tr th:last-child, table tr td:last-child { border-right: 0; } table tbody th { border-bottom: 1px solid #e6e6e6; color: #6b6e72; } table tbody tr:nth-child(2n) td { border-right: 1px dotted #e4e4e3; } table tbody tr:nth-child(2n) td:last-child { border-right: 0; } table tbody td { border-bottom: 1px solid #e6e6e6; } table tbody h2 { font-size: 1em; letter-spacing: normal; font-weight: normal; } table tbody h2 a { font-weight: normal; } table tbody tr:last-child td:first-child { -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } table tbody tr:last-child td:last-child { -webkit-border-bottom-left-radius: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; -webkit-border-top-left-radius: 0; -webkit-border-bottom-left-radius: 0; border-top-left-radius: 0; border-bottom-left-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } table tbody tr:last-child td { border-bottom: 0; } /* Forms */ input[type=text], input.input-text, textarea, input.txt, input[type=tel], input[type=email], input[type=password] { padding: .618em; border: 0; font-size: 1em; /* Make inputs the same size as normal text */ line-height: 1.618em; font-family: inherit; /* Make inputs use the correct typeface instead of the browser default */ outline: none; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color: #6b6e72; background: #f5f5f4; } /* Buttons (Includes WF chortcode buttons) */ a.button, a.comment-reply-link, #commentform #submit, .submit, input[type=submit], input.button, button.button, #wrapper .woo-sc-button, .follow-link a, .our-team-author-archive a { display: inline-block; padding: .53em 1.387em; color: white; text-align: center; border: none; text-decoration: none; text-transform: uppercase; font-family: 'Cabin', sans-serif; font-size: .857em; /* Make inputs the same size as normal text */ font-weight: 700; cursor: pointer; /* Inputs need pointers! */ overflow: visible; /* IE fix */ width: auto; /* IE fix */ line-height: 1.618em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; white-space: nowrap; background: none; color: #f36557; border: 0.146em solid #f36557; -webkit-appearance: none; -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; -webkit-border-top-left-radius: 2.618em; -webkit-border-bottom-left-radius: 2.618em; border-top-left-radius: 2.618em; border-bottom-left-radius: 2.618em; -webkit-border-top-right-radius: 2.618em; -webkit-border-bottom-right-radius: 2.618em; border-top-right-radius: 2.618em; border-bottom-right-radius: 2.618em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } a.button:hover, a.comment-reply-link:hover, #commentform #submit:hover, .submit:hover, input[type=submit]:hover, input.button:hover, button.button:hover, #wrapper .woo-sc-button:hover, .follow-link a:hover, .our-team-author-archive a:hover { color: #fff; text-decoration: none; background: #f36557; } a.button:active, a.comment-reply-link:active, #commentform #submit:active, .submit:active, input[type=submit]:active, input.button:active, button.button:active, #wrapper .woo-sc-button:active, .follow-link a:active, .our-team-author-archive a:active { color: #fff; background: #f36557; text-shadow: 0 -1px 0 #d5210f; border-color: #f14f3f; } a.button.large, a.comment-reply-link.large, #commentform #submit.large, .submit.large, input[type=submit].large, input.button.large, button.button.large, #wrapper .woo-sc-button.large, .follow-link a.large, .our-team-author-archive a.large { font-size: 1.387em; } a.button.small, a.comment-reply-link.small, #commentform #submit.small, .submit.small, input[type=submit].small, input.button.small, button.button.small, #wrapper .woo-sc-button.small, .follow-link a.small, .our-team-author-archive a.small { font-size: .857em; } a.button.red, a.comment-reply-link.red, #commentform #submit.red, .submit.red, input[type=submit].red, input.button.red, button.button.red, #wrapper .woo-sc-button.red, .follow-link a.red, .our-team-author-archive a.red { border-color: #af4040; background: #d72323; } a.button.red:hover, a.comment-reply-link.red:hover, #commentform #submit.red:hover, .submit.red:hover, input[type=submit].red:hover, input.button.red:hover, button.button.red:hover, #wrapper .woo-sc-button.red:hover, .follow-link a.red:hover, .our-team-author-archive a.red:hover { background: #d20000; } a.button.orange, a.comment-reply-link.orange, #commentform #submit.orange, .submit.orange, input[type=submit].orange, input.button.orange, button.button.orange, #wrapper .woo-sc-button.orange, .follow-link a.orange, .our-team-author-archive a.orange { border-color: #af7440; background: #d76b23; } a.button.orange:hover, a.comment-reply-link.orange:hover, #commentform #submit.orange:hover, .submit.orange:hover, input[type=submit].orange:hover, input.button.orange:hover, button.button.orange:hover, #wrapper .woo-sc-button.orange:hover, .follow-link a.orange:hover, .our-team-author-archive a.orange:hover { background: #d25e00; } a.button.green, a.comment-reply-link.green, #commentform #submit.green, .submit.green, input[type=submit].green, input.button.green, button.button.green, #wrapper .woo-sc-button.green, .follow-link a.green, .our-team-author-archive a.green { border-color: #87bf00; background: #8dc11e; } a.button.green:hover, a.comment-reply-link.green:hover, #commentform #submit.green:hover, .submit.green:hover, input[type=submit].green:hover, input.button.green:hover, button.button.green:hover, #wrapper .woo-sc-button.green:hover, .follow-link a.green:hover, .our-team-author-archive a.green:hover { background: #87c000; } a.button.aqua, a.comment-reply-link.aqua, #commentform #submit.aqua, .submit.aqua, input[type=submit].aqua, input.button.aqua, button.button.aqua, #wrapper .woo-sc-button.aqua, .follow-link a.aqua, .our-team-author-archive a.aqua { border-color: #40af96; background: #23d7af; } a.button.aqua:hover, a.comment-reply-link.aqua:hover, #commentform #submit.aqua:hover, .submit.aqua:hover, input[type=submit].aqua:hover, input.button.aqua:hover, button.button.aqua:hover, #wrapper .woo-sc-button.aqua:hover, .follow-link a.aqua:hover, .our-team-author-archive a.aqua:hover { background: #00d2a8; } a.button.teal, a.comment-reply-link.teal, #commentform #submit.teal, .submit.teal, input[type=submit].teal, input.button.teal, button.button.teal, #wrapper .woo-sc-button.teal, .follow-link a.teal, .our-team-author-archive a.teal { border-color: #23a6d6; background: #23abd7; } a.button.teal:hover, a.comment-reply-link.teal:hover, #commentform #submit.teal:hover, .submit.teal:hover, input[type=submit].teal:hover, input.button.teal:hover, button.button.teal:hover, #wrapper .woo-sc-button.teal:hover, .follow-link a.teal:hover, .our-team-author-archive a.teal:hover { background: #009ed2; } a.button.purple, a.comment-reply-link.purple, #commentform #submit.purple, .submit.purple, input[type=submit].purple, input.button.purple, button.button.purple, #wrapper .woo-sc-button.purple, .follow-link a.purple, .our-team-author-archive a.purple { border-color: #234dd6; background: #2356d7; } a.button.purple:hover, a.comment-reply-link.purple:hover, #commentform #submit.purple:hover, .submit.purple:hover, input[type=submit].purple:hover, input.button.purple:hover, button.button.purple:hover, #wrapper .woo-sc-button.purple:hover, .follow-link a.purple:hover, .our-team-author-archive a.purple:hover { background: #0036d2; } a.button.pink, a.comment-reply-link.pink, #commentform #submit.pink, .submit.pink, input[type=submit].pink, input.button.pink, button.button.pink, #wrapper .woo-sc-button.pink, .follow-link a.pink, .our-team-author-archive a.pink { border-color: #d623cb; background: #d723d5; } a.button.pink:hover, a.comment-reply-link.pink:hover, #commentform #submit.pink:hover, .submit.pink:hover, input[type=submit].pink:hover, input.button.pink:hover, button.button.pink:hover, #wrapper .woo-sc-button.pink:hover, .follow-link a.pink:hover, .our-team-author-archive a.pink:hover { background: #bc00d2; } a.button.silver, a.comment-reply-link.silver, #commentform #submit.silver, .submit.silver, input[type=submit].silver, input.button.silver, button.button.silver, #wrapper .woo-sc-button.silver, .follow-link a.silver, .our-team-author-archive a.silver { color: #444 !important; text-shadow: 0 1px #fff; border-color: #bbb; background: #d8d8d8; } a.button.silver:hover, a.comment-reply-link.silver:hover, #commentform #submit.silver:hover, .submit.silver:hover, input[type=submit].silver:hover, input.button.silver:hover, button.button.silver:hover, #wrapper .woo-sc-button.silver:hover, .follow-link a.silver:hover, .our-team-author-archive a.silver:hover { background: #ccc; } /* Shortcode info boxes */ p.woo-sc-box, div.woo-sc-box { margin: 1em 0 1.5em 0; padding: 9px 10px 9px 50px; border-width: 1px 0 1px 0; color: #5e6165; text-shadow: none; } p.woo-sc-box.rounded, div.woo-sc-box.rounded { -webkit-border-radius: 5px; border-radius: 5px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } p.woo-sc-box.alert, div.woo-sc-box.alert { border-color: #f0baa2; background-color: #ffd9c8; } p.woo-sc-box.download, div.woo-sc-box.download { border-color: #d4ebaf; background-color: #edfcd5; } p.woo-sc-box.tick, div.woo-sc-box.tick { border-color: #d4ebaf; background-color: #edfcd5; } p.woo-sc-box.info, div.woo-sc-box.info { border-color: #e6e6e6; background-color: #f5f5f4; } p.woo-sc-box.note, div.woo-sc-box.note { border-color: #efe3ae; background-color: #fef6d2; } p.woo-sc-box.normal, div.woo-sc-box.normal { border-color: #e6e6e6; background-color: #f5f5f4; } /* Gravity forms */ ul.gform_fields li { list-style: none; } .gfield { margin-bottom: 1.618em; } .gfield_label { width: 100%; font-weight: bold; margin-bottom: .618em; display: block; } .gfield_required { color: red; } .ginput_container { *zoom: 1; margin-bottom: 1.618em; } .ginput_container:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .ginput_container:before, .ginput_container:after { content: ""; display: table; } .ginput_container:after { clear: both; } .ginput_container label { display: block; } .ginput_container input, .ginput_container textarea { width: 100%; } .ginput_container .ginput_left, .ginput_container .ginput_right, .ginput_container .ginput_full { margin-bottom: 1em; display: block; } .ginput_container .ginput_left label, .ginput_container .ginput_right label, .ginput_container .ginput_full label { font-size: .875em; } .ginput_container .ginput_left, .ginput_container .ginput_right { width: 48%; float: left; clear: left; } .ginput_container .ginput_right { float: right; clear: none; } .ginput_container .gfield_checkbox, .ginput_container .gfield_radio { margin-left: 0; } .ginput_container .gfield_checkbox label, .ginput_container .gfield_radio label { display: inline-block; margin-left: .618em; } .ginput_container .gfield_checkbox input, .ginput_container .gfield_radio input { width: auto; } img.ui-datepicker-trigger { border: 0; padding: 0; } /* IE specific styling */ .ie8 .widget_woo_blogauthorinfo .avatar { width: auto; } .ie8 #testimonials .slide-nav .testimonials-list > div .avatar-link { width: 65px; } /*------------------------------------------------------------------------------------------*/ /* 10. HOMEPAGE */ /*------------------------------------------------------------------------------------------*/ .home-section { position: relative; padding: 3.631em 0; *zoom: 1; } .home-section:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } .home-section:before, .home-section:after { content: ""; display: table; } .home-section:after { clear: both; } .home-section header.section-title { display: inline; float: left; width: 95.83333333%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 95.78125%; *margin-left: 2.03125%; *margin-right: 2.03125%; margin-bottom: 3.631em; } .home-section header.section-title .heading { display: block; text-transform: uppercase; font-family: 'Cabin', sans-serif; font-size: 1.2em; color: #b9babd; } .home-section header.section-title h1 { font-size: 1.618em; text-transform: uppercase; font-weight: 700; margin: 0 0 .327em; } .home-section header.section-title:after { content: ''; display: block; width: 7%; height: .202em; background: #f36557; } .home-section .meta { margin: 0; font-size: .857em; text-transform: uppercase; color: #bec0c2; } .home-section .meta .post-date:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; display: inline-block; line-height: 1; content: "\f179"; color: #f36557; width: 1.6em; content: "\f133"; } #intro-message { padding-top: 1em; background: #222832; color: #9ea1a5; } #intro-message h2 { font-size: 2.244em; color: #fff; font-weight: normal; } #intro-message p { margin: 0 0 1.618em; font-size: 1.387em; } #intro-message a.button { font-size: 1em; padding: .857em 1.618em; } #popular-posts { background: #f5f5f4; } #popular-posts ul { list-style: none; margin: 0; *zoom: 1; } #popular-posts ul:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #popular-posts ul:before, #popular-posts ul:after { content: ""; display: table; } #popular-posts ul:after { clear: both; } #popular-posts ul li { clear: both; position: relative; margin: 0 0 2.244em; background: #fff; padding: 1em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all ease-in-out 0.2s; -moz-transition: all ease-in-out 0.2s; -ms-transition: all ease-in-out 0.2s; -o-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; } #popular-posts ul li:hover { box-shadow: 0 0 0.327em 0 rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 0.327em 0 rgba(0, 0, 0, 0.2); top: -0.53em; } #popular-posts ul li:last-child { margin-bottom: 0; } #popular-posts ul li h3 { margin: 0 0 .327em; line-height: 1.25em; } #popular-posts ul li h3 a { font-size: .857em; font-weight: 400; color: #3a3b3e; } #popular-posts ul li .image-wrap { position: relative; } #popular-posts ul li .image-wrap .author-avatar { position: absolute; top: 0; width: 100%; } #popular-posts ul li .image-wrap .author-avatar span { display: none; position: relative; margin: -2em -0.5em 0 0; float: right; background: #000; background: rgba(0, 0, 0, 0.6); padding: .327em .857em; color: #fff; font-size: .857em; -webkit-border-radius: 0.327em; border-radius: 0.327em; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #popular-posts ul li .image-wrap .author-avatar span:after { content: ''; position: absolute; top: 100%; left: 50%; width: 0; height: 0; border-left: .327em solid transparent; border-right: .327em solid transparent; border-top: 0.327em solid rgba(0, 0, 0, 0.6); } #popular-posts ul li .image-wrap .author-avatar:hover span { display: block; } #popular-posts ul li .image-wrap .avatar { margin: 0; float: none; position: absolute; top: 1em; right: 1em; border: .236em solid #fff; } #popular-posts ul li img.thumbnail { padding: 0; border: 0; margin: 0 0 .618em; } #popular-posts ul li .avatar { float: left; margin: 0 1.387em 0 0; border: .236em solid #fff; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #featured-slider { margin-bottom: 0; padding: 0; background: none; box-shadow: 0 0 0 0 #888888; -webkit-box-shadow: 0 0 0 0 #888888; border: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; *zoom: 1; } #featured-slider:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #featured-slider:before, #featured-slider:after { content: ""; display: table; } #featured-slider:after { clear: both; } #featured-slider ul.slides { clear: both; } #featured-slider ul.slides li .post, #featured-slider ul.slides li .type-page { margin: 0; } #featured-slider .button { padding: .618em 1.618em; font-size: 1em; } #featured-slider .flex-direction-nav { width: 3.631em; position: absolute; top: 10%; right: 0; } #featured-slider .flex-direction-nav a { opacity: 1; filter: alpha(opacity=@opacity * 100); width: 35px; height: 35px; padding: 0; background: #f0f0f0; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #featured-slider .flex-direction-nav .flex-prev:before { margin-left: -3px; } #featured-slider .flex-direction-nav .flex-next:before, #featured-slider .flex-direction-nav .flex-prev:before { line-height: 1.45; } #featured-slider:hover .flex-direction-nav a { opacity: 1; filter: alpha(opacity=@opacity * 100); } #featured-slider:hover .flex-direction-nav .flex-prev { left: -10px; } #featured-slider:hover .flex-direction-nav .flex-next { right: -10px; } #featured-slider-pagination { display: none; } #featured-slider-pagination #prev, #featured-slider-pagination #next { margin: 0 0 .53em; display: block; border: 0; text-align: center; width: 100%; background: none; font-size: 1.618em; } #featured-slider-pagination #prev.disabled:hover:before, #featured-slider-pagination #next.disabled:hover:before { color: #cdcdcd; } #featured-slider-pagination #prev.disabled:before, #featured-slider-pagination #next.disabled:before { color: #cdcdcd; } #featured-slider-pagination #prev:focus, #featured-slider-pagination #next:focus { outline: none; } #featured-slider-pagination #prev:before, #featured-slider-pagination #next:before { font-family: "FontAwesome"; font-weight: normal; font-style: normal; text-decoration: inherit; speak: none; width: 1.5em; line-height: 1; content: "\f179"; color: #f36557; content: "\f077"; display: inline-block; } #featured-slider-pagination #prev:hover:before, #featured-slider-pagination #next:hover:before { color: #d14335; } #featured-slider-pagination #next { margin: .53em 0 0; } #featured-slider-pagination #next:before { content: "\f078"; } #featured-slider-pagination ul#carousel-items { list-style: none; } #featured-slider-pagination ul#carousel-items:before, #featured-slider-pagination ul#carousel-items:after { content: ''; display: block; background: url(images/slider-pagination-top.png ) center no-repeat; width: 351px; height: 16px; } #featured-slider-pagination ul#carousel-items:after { background: url(images/slider-pagination-bottom.png ) center no-repeat; } #featured-slider-pagination ul#carousel-items li { display: none; border-bottom: 0.09em solid #e6e6e6; *zoom: 1; } #featured-slider-pagination ul#carousel-items li:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #featured-slider-pagination ul#carousel-items li:before, #featured-slider-pagination ul#carousel-items li:after { content: ""; display: table; } #featured-slider-pagination ul#carousel-items li:after { clear: both; } #featured-slider-pagination ul#carousel-items li.last { border: 0; } #featured-slider-pagination ul#carousel-items li a { display: block; padding: 1.618em 0; *zoom: 1; } #featured-slider-pagination ul#carousel-items li a:after { content: "\0020"; display: block; height: 0; overflow: hidden; clear: both; } #featured-slider-pagination ul#carousel-items li a:before, #featured-slider-pagination ul#carousel-items li a:after { content: ""; display: table; } #featured-slider-pagination ul#carousel-items li a:after { clear: both; } #featured-slider-pagination ul#carousel-items li a:hover img { opacity: 1; filter: alpha(opacity=@opacity * 100); } #featured-slider-pagination ul#carousel-items li a:hover h3 { color: #4d4f53; } #featured-slider-pagination ul#carousel-items li a.active h3 { color: #f36557; } #featured-slider-pagination ul#carousel-items li .details { float: right; width: 67%; } #featured-slider-pagination ul#carousel-items li .avatar { float: left; padding: .202em; border: 0.09em solid #e6e6e6; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; margin: 0 1.387em 0 0; background: #fff; } #featured-slider-pagination ul#carousel-items li h3 { font-weight: 400; font-size: 1.618em; margin: 0 0 .236em; line-height: 1.25em; } #our-team { padding: 3.631em 0 0; background: #f5f5f4; border-top: 0.09em solid #e6e6e6; } #our-team .widget_woothemes_our_team { margin: 0; } #our-team .widget_woothemes_our_team h3.member { border: 0; margin: 0; padding: 0; color: #fff; } #our-team .widget_woothemes_our_team h3.member a { color: #fff; } #our-team .widget_woothemes_our_team h3.member a:after { content: none; } #our-team .widget_woothemes_our_team .team-member { position: relative; float: left; width: 100%; /* 100/5 */ margin: 0; overflow: hidden; } #our-team .widget_woothemes_our_team .team-member .avatar { margin: 0; } #our-team .widget_woothemes_our_team .team-member .team-member-content { opacity: 0; filter: alpha(opacity=@opacity * 100); position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 1.618em; background: #222832; background: rgba(34, 40, 50, 0.8); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; transition: opacity 0.25s ease-in-out; -moz-transition: opacity 0.25s ease-in-out; -webkit-transition: opacity 0.25s ease-in-out; } #our-team .widget_woothemes_our_team .team-member .team-member-text { font-size: .857em; } #our-team .widget_woothemes_our_team .team-member:hover .team-member-content { opacity: 1; filter: alpha(opacity=@opacity * 100); } #our-team .widget_woothemes_our_team .team-member:hover .avatar { filter: blur(0.202em); -webkit-filter: blur(0.202em); -moz-filter: blur(0.202em); -o-filter: blur(0.202em); -ms-filter: blur(0.202em); filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius='@blur'); } #our-team .widget_woothemes_our_team .role { margin: 0 0 .857em; } #testimonials { position: inherit; padding: 0; } #testimonials #testimonials-holder { background: #222832; position: relative; padding: 3.631em 0; z-index: 0; } #testimonials #testimonials-bg { opacity: 0.05; filter: alpha(opacity=@opacity * 100); z-index: -1; -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; background: url('images/bg.jpg') no-repeat; background-position: center center; background-repeat: no-repeat; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; } #testimonials .wrapper { z-index: 1; } #testimonials header h1 { color: #fff; } #testimonials .slide-nav ul { position: relative; margin: 0; } #testimonials .slide-nav ul li { display: inline-block; margin: 0 1em 1em 0; } #testimonials .slide-nav ul li .avatar-link { position: relative; display: block; } #testimonials .slide-nav ul li .avatar-link:after { position: absolute; left: 22%; bottom: 0; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-bottom: 20px solid #fff; } #testimonials .slide-nav ul li .avatar-link.active .avatar { background: #f36557; border-color: #f36557; } #testimonials .slide-nav ul li .avatar { display: inline-block; padding: .202em; border: 0.09em solid #e6e6e6; -webkit-border-radius: 100%; border-radius: 100%; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; background: #fff; } #testimonials .slides { /* Hide the slides before the JS is loaded. Avoids image jumping */ } #testimonials .slides .testimonials { margin: 0; padding: 0; } #testimonials .slides .testimonials-list { background: #fff; overflow: hidden; margin: 0 auto; list-style: none; } #testimonials .slides .testimonials-list > li { display: none; -webkit-backface-visibility: hidden; } #testimonials .slides .testimonial { padding: 2.244em 1.618em; margin: 0 auto; text-align: center; box-sizing: border-box; } #testimonials .slides .testimonial p { font-size: 1.25em; margin: 0 0 1em; } #testimonials .slides .testimonial .author { font-weight: bold; } #testimonials .slides .testimonial .author span { display: block; } #testimonials .slides .testimonial .author .byline { font-weight: normal; } #testimonials .slides .testimonial .author .url { font-weight: normal; } #testimonials .woo-sc-box { clear: both; } #sensei-featuredcourses { background: #f5f5f4; border-bottom: 0.09em solid #e6e6e6; } #sensei-featuredcourses .course { background: #fff; padding: 1em; margin: 0 0 2.244em; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; clear: both; } #sensei-featuredcourses .course h2 { font-weight: normal; font-size: 1.387em; line-height: 1.25em; } #sensei-featuredcourses .course img.thumbnail { margin: 0 1em 1em 0; padding: 0; border: 0; -webkit-border-radius: 0; border-radius: 0; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } #sensei-featuredcourses .course p:last-child { margin: 0; } #sensei-featuredcourses .course:last-child { margin-bottom: 0; } #featured-products ul.products { padding: 0 2.244em; margin-bottom: 0; } #catapult-cookie-bar { -webkit-box-shadow: 0px -1px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px -1px 5px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); } button#catapultCookie { padding: 0 24px !important; } button#catapultCookie:hover { opacity: 0.8; } #catapult-cookie-bar a:hover { text-decoration: underline; } input[type=checkbox] { -webkit-appearance: checkbox !important; padding: 0 !important; width: 20px !important; height: 20px !important; float: left !important; } ul.gfield_checkbox { margin-bottom: 20px !important; } ul.gfield_checkbox li label { display: inline-block !important; float: left; max-width: 80%; } #sidebar ul.gfield_checkbox { margin: 0px !important; } #sidebar ul.gfield_checkbox li label, #sidebar ul.gfield_checkbox li label a { color: #fff; font-size: 10px; } @media only screen and (min-width: 640px) { #our-team .widget_woothemes_our_team .team-member { width: 48%; /* 100/5 */ } } @media only screen and (min-width: 768px) { #intro-message { padding: 3.631em 0 6.854em; text-align: center; } #intro-message .wrapper { max-width: 70%; } #intro-message h2 { font-size: 3.25em; } #popular-posts ul li { clear: none; display: inline; float: left; width: 29.16666667%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 29.11458333%; *margin-left: 2.03125%; *margin-right: 2.03125%; margin-bottom: 0; } #featured-slider { display: inline; float: left; width: 62.5%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 62.44791667%; *margin-left: 2.03125%; *margin-right: 2.03125%; } #featured-slider ul.slides { clear: none; } #featured-slider .flex-direction-nav { display: none; } #featured-slider-pagination { display: inline; float: left; width: 29.16666667%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 29.11458333%; *margin-left: 2.03125%; *margin-right: 2.03125%; } #testimonials .slides .testimonials-list { max-width: 70%; } #testimonials .slide-nav ul { text-align: center; list-style: none; } #testimonials .slide-nav ul li { margin: 0 1em; } #testimonials .slide-nav ul li .avatar-link { padding: 0 0 2.618em; } #testimonials .slide-nav ul li .avatar-link.active .avatar { background: #fff; border-color: #e6e6e6; } #testimonials .slide-nav ul li .avatar-link.active:after { content: ''; } #our-team .widget_woothemes_our_team .team-member { width: 20%; /* 100/5 */ } #sensei-featuredcourses .course { clear: none; display: inline; float: left; width: 29.16666667%; margin-left: 2.08333333%; margin-right: 2.08333333%; *width: 29.11458333%; *margin-left: 2.03125%; *margin-right: 2.03125%; margin-bottom: 0; } #featured-products { padding-bottom: 0; } #featured-products ul.products { padding: 0; } }