/* Minification failed. Returning unminified contents. (4595,11): run-time error CSS1030: Expected identifier, found ' ' (4595,25): run-time error CSS1030: Expected identifier, found ' ' */ @charset "UTF-8"; /* Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ body { /* Addresses a small issue in webkit: http://bit.ly/NEdoDq */ -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;} } .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);} } .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);} } .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);} } .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); } } .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; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-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%); } } .wobble { -webkit-animation-name: wobble; -moz-animation-name: wobble; -o-animation-name: wobble; animation-name: wobble; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-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); } } .pulse { -webkit-animation-name: pulse; -moz-animation-name: pulse; -o-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) rotateY(0); -webkit-animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg); -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) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) scale(1); -webkit-animation-timing-function: ease-in; } } @-moz-keyframes flip { 0% { -moz-transform: perspective(400px) rotateY(0); -moz-animation-timing-function: ease-out; } 40% { -moz-transform: perspective(400px) translateZ(150px) rotateY(170deg); -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) rotateY(360deg) scale(.95); -moz-animation-timing-function: ease-in; } 100% { -moz-transform: perspective(400px) scale(1); -moz-animation-timing-function: ease-in; } } @-o-keyframes flip { 0% { -o-transform: perspective(400px) rotateY(0); -o-animation-timing-function: ease-out; } 40% { -o-transform: perspective(400px) translateZ(150px) rotateY(170deg); -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) rotateY(360deg) scale(.95); -o-animation-timing-function: ease-in; } 100% { -o-transform: perspective(400px) scale(1); -o-animation-timing-function: ease-in; } } @keyframes flip { 0% { transform: perspective(400px) rotateY(0); animation-timing-function: ease-out; } 40% { transform: perspective(400px) translateZ(150px) rotateY(170deg); animation-timing-function: ease-out; } 50% { transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); animation-timing-function: ease-in; } 80% { transform: perspective(400px) rotateY(360deg) scale(.95); animation-timing-function: ease-in; } 100% { transform: perspective(400px) scale(1); animation-timing-function: ease-in; } } .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; } } .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; } } .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; } } .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; } } .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;} } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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;} } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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); } } .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(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); } 70% { -webkit-transform: scale(.9); } 100% { -webkit-transform: scale(1); } } @-moz-keyframes bounceIn { 0% { opacity: 0; -moz-transform: scale(.3); } 50% { opacity: 1; -moz-transform: scale(1.05); } 70% { -moz-transform: scale(.9); } 100% { -moz-transform: scale(1); } } @-o-keyframes bounceIn { 0% { opacity: 0; -o-transform: scale(.3); } 50% { opacity: 1; -o-transform: scale(1.05); } 70% { -o-transform: scale(.9); } 100% { -o-transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; transform: scale(.3); } 50% { opacity: 1; transform: scale(1.05); } 70% { transform: scale(.9); } 100% { transform: scale(1); } } .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); } } .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); } } .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); } } .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); } } .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(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); } } @-moz-keyframes bounceOut { 0% { -moz-transform: scale(1); } 25% { -moz-transform: scale(.95); } 50% { opacity: 1; -moz-transform: scale(1.1); } 100% { opacity: 0; -moz-transform: scale(.3); } } @-o-keyframes bounceOut { 0% { -o-transform: scale(1); } 25% { -o-transform: scale(.95); } 50% { opacity: 1; -o-transform: scale(1.1); } 100% { opacity: 0; -o-transform: scale(.3); } } @keyframes bounceOut { 0% { transform: scale(1); } 25% { transform: scale(.95); } 50% { opacity: 1; transform: scale(1.1); } 100% { opacity: 0; transform: scale(.3); } } .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); } } .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); } } .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); } } .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); } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .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; } } .hinge { -webkit-animation-name: hinge; -moz-animation-name: hinge; -o-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-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); } } .rollIn { -webkit-animation-name: rollIn; -moz-animation-name: rollIn; -o-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-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); } } .rollOut { -webkit-animation-name: rollOut; -moz-animation-name: rollOut; -o-animation-name: rollOut; animation-name: rollOut; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-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; } } .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; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-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; } } .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; } /* originally authored by Angelo Rohit - https://github.com/angelorohit */ @-webkit-keyframes wiggle { 0% { -webkit-transform: skewX(9deg); } 10% { -webkit-transform: skewX(-8deg); } 20% { -webkit-transform: skewX(7deg); } 30% { -webkit-transform: skewX(-6deg); } 40% { -webkit-transform: skewX(5deg); } 50% { -webkit-transform: skewX(-4deg); } 60% { -webkit-transform: skewX(3deg); } 70% { -webkit-transform: skewX(-2deg); } 80% { -webkit-transform: skewX(1deg); } 90% { -webkit-transform: skewX(0deg); } 100% { -webkit-transform: skewX(0deg); } } @-moz-keyframes wiggle { 0% { -moz-transform: skewX(9deg); } 10% { -moz-transform: skewX(-8deg); } 20% { -moz-transform: skewX(7deg); } 30% { -moz-transform: skewX(-6deg); } 40% { -moz-transform: skewX(5deg); } 50% { -moz-transform: skewX(-4deg); } 60% { -moz-transform: skewX(3deg); } 70% { -moz-transform: skewX(-2deg); } 80% { -moz-transform: skewX(1deg); } 90% { -moz-transform: skewX(0deg); } 100% { -moz-transform: skewX(0deg); } } @-o-keyframes wiggle { 0% { -o-transform: skewX(9deg); } 10% { -o-transform: skewX(-8deg); } 20% { -o-transform: skewX(7deg); } 30% { -o-transform: skewX(-6deg); } 40% { -o-transform: skewX(5deg); } 50% { -o-transform: skewX(-4deg); } 60% { -o-transform: skewX(3deg); } 70% { -o-transform: skewX(-2deg); } 80% { -o-transform: skewX(1deg); } 90% { -o-transform: skewX(0deg); } 100% { -o-transform: skewX(0deg); } } @keyframes wiggle { 0% { transform: skewX(9deg); } 10% { transform: skewX(-8deg); } 20% { transform: skewX(7deg); } 30% { transform: skewX(-6deg); } 40% { transform: skewX(5deg); } 50% { transform: skewX(-4deg); } 60% { transform: skewX(3deg); } 70% { transform: skewX(-2deg); } 80% { transform: skewX(1deg); } 90% { transform: skewX(0deg); } 100% { transform: skewX(0deg); } } .wiggle { -webkit-animation-name: wiggle; -moz-animation-name: wiggle; -o-animation-name: wiggle; animation-name: wiggle; -webkit-animation-timing-function: ease-in; -moz-animation-timing-function: ease-in; -o-animation-timing-function: ease-in; animation-timing-function: ease-in; } .animated.wiggle { -webkit-animation-duration: 0.75s; -moz-animation-duration: 0.75s; -o-animation-duration: 0.75s; animation-duration: 0.75s; } .attachment-list { margin:0; padding:0; list-style:none; } .attachment-list li { padding:5px ; } .attachment-list li a { padding:5px 0 5px 20px; background: url(/Templates/TienPhatAuto/Content/images/download-icon.png) 0 50% no-repeat; font-weight:700; font-size:0.9em; color:#008000; } #slide_prev a { background: url(/Templates/TienPhatAuto/Content/images/icon_prev.png) no-repeat; cursor: pointer; position: absolute; width: 31px; height: 45px; top: 36%; left: 1px; z-index: 100; } #slide_prev a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_prev_h.png) no-repeat; } #slide_next a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_next_h.png) no-repeat 0px -2px; width: 17px; } #slide_next a { background: url(/Templates/TienPhatAuto/Content/images/icon_next.png) no-repeat; width: 18px; height: 44px; top: 36%; right: 0px; position: absolute; z-index: 100; } .banner-top-wrapper { position: relative; } .bg-banner-f { background: url(/Templates/TienPhatAuto/Content/images/bg_banner_f.png) no-repeat; width: 1000px; height: 32px; margin-top: -3px; } .banner-top-wrapper .banner-title .blue { background: url(/Templates/TienPhatAuto/Content/images/icon_blue.png) no-repeat; width: 132px; height: 26px; margin-bottom: 20px; } #nav_ { position: absolute; z-index: 1000; text-align: center; width: 100%; height: 25px; bottom: 0px; background-color: #121212; opacity: .5; /*background: url(/Templates/TienPhatAuto/Content/images/bg_nav_p.png) no-repeat;*/ } #nav_ a { color: white; background-color: white; /*background: url(/Templates/TienPhatAuto/Content/images/bg_nav.png);*/ padding: 3px 4px 3px 3px; font-size: 1px; margin: 0 2px; border-radius: 7px; border: none; border: solid 2px white; } #nav_ .activeSlide { color: red; background: url(/Templates/TienPhatAuto/Content/images/bg_nav_active.png); border: solid 2px white; } .banner-top { background-color: white; width: 100%; overflow: hidden; position: relative; /*border: solid 1px #c5c5c5;*/ } .banner-top a { padding: 0; } .banner-top img { } .banner-top .banner-item { background-color: white; } .banner-top .banner-item .banner-title a { background: url(/Templates/TienPhatAuto/Content/images/bg_detail.png) no-repeat; display: block; width: 133px; height: 49px; } .banner-top .banner-item .banner-title { left: 150px; bottom: 64px; position: absolute; width: 133px; height: 49px; } .banner-top .banner-item .banner-title .name { margin-bottom: 10px; color: white; } .banner-top .banner-item .banner-title .s-desc { font-size: 0.9em; } .banner-top .banner-item .banner-img { /*float: left; width: 712px; background-color: white;*/ } .f-online .online { margin-bottom: 10px; float: left; width: 100%; } .exchange-table { color: white; } .exchange-table .header { display: none; } .exchange-table tr { border-bottom: none !important; } .f-exchange { float: left; margin-top: 30px; margin-left: 36px; width: 18.15%; } .f-exchange .header { font-size: 1.3em; color: white; text-transform: uppercase; font-weight: 700; margin-left: 5px; } .f-online .online .lbl { float: left; width: 50%; color: white; } .f-online .online .dot { float: left; width: 5%; color: white; } .f-online .online .ctn { float: left; font-weight: 700; color: #0ac5db; } .f-online { float: left; margin-top: 21px; margin-left: 36px; width: 16.15%; } .f-online .header { /*background: url(/Templates/TienPhatAuto/Content/images/icon_f_online.png) no-repeat 0px 0px;padding-left: 40px;*/ font-size: 1.2em; margin-bottom: 5px; color: white; text-transform: uppercase; height: 24px; padding-top: 9px; font-weight: 700; } .f-linkweb .reg-email .submit { margin-left: 130px; } .f-linkweb .reg-email .email { width: 270px; height: 20px; color: white; border: none; background-color: #0278ce; font-size: 1em; margin: 1px 0; } .f-linkweb { float: left; width: 25%; margin-top: 21px; } .f-linkweb .header { background: url(/Templates/TienPhatAuto/Content/images/icon_f_linkweb.png) no-repeat 0px 0px; font-size: 1.2em; margin-bottom: 5px; color: #095fc9; text-transform: uppercase; padding-left: 40px; height: 24px; padding-top: 9px; } .f-support { float: left; width: 17%; margin-top: 21px; } .f-support .header { /*background: url(/Templates/TienPhatAuto/Content/images/icon_f_support.png) no-repeat 0px 0px;*/ font-size: 1.3em; margin-bottom: 5px; color: white; text-transform: uppercase; height: 24px; padding-top: 9px; font-weight: 700; } footer { padding: 30px 0 20px; float: left; width: 100%; background: url(/Templates/TienPhatAuto/Content/images/bgfooter.jpg) no-repeat top center; background-size: cover; } .box-footer { margin: 0 15px; float: left; } .logofooter { width: 32%; } .box-address { width: 35%; } .box-lkweb { width: 25%; } .logofooter .logo { float: none; display: block; margin-bottom: 10px; } .logofooter .des { color: #666; } .logofooter .addshare a { display: inline-block; width: 35px; height: 35px; background: #333333; border-radius: 35px; text-align: center; margin-right: 5px; color: #fff; line-height: 30px; } .logofooter .addshare { margin-top: 15px; } .logofooter .addshare a:hover { background: #db0c0b; color: #fff; } footer h2 { text-transform: uppercase; font-weight: 500; margin-bottom: 20px; } .box-lkweb .box-lk ul li { list-style: none; } .box-lkweb .box-lk ul { padding: 0; } .box-lkweb .box-lk ul li a { padding: 5px 0; margin-left: -5px; display: block; position: relative; text-transform: capitalize; color: #111; -webkit-transition: 0.1s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; } .box-lkweb .box-lk ul li a i { color: #999; } .box-lkweb .box-lk ul li a:hover { color: #db0c0b; padding-left: 5px; } .box-lkweb .box-lk ul li a:before { content: "\f061"; font-family: 'FontAwesome'; font-size: 10px; margin-right: 2px; opacity: 0; } .box-lkweb .box-lk ul li a:hover:before { opacity: 1; } .footer-address .address { color: white; /*margin-bottom: 7px; background: url(/Templates/TienPhatAuto/Content/images/icon_address.png) no-repeat 0px 0px;*/ } .box-address div { padding: 5px 0; } .box-address div i { width: 26px; height: 26px; background: #db0c0b; text-align: center; line-height: 26px; color: #fff; border-radius: 30px; margin-right: 5px; } .footer-address .phone { /*margin-bottom: 7px;*/ } .footer-address .phone { float: left; margin-right: 10px; color: white; } .footer-address .fax { margin-right: 10px; color: white; } .footer-address .email { margin-right: 10px; color: white; width: 100%; } .footer-address .phone span { /*background: url(/Templates/TienPhatAuto/Content/images/icon_phone.png) no-repeat 0px 0px; padding-left: 20px;*/ } .footer-address .fax span { /*background: url(/Templates/TienPhatAuto/Content/images/icon_fax.png) no-repeat 0px 2px; padding-left: 20px;*/ } .footer-address .email span { /*background: url(/Templates/TienPhatAuto/Content/images/icon_email.png) no-repeat 0px 2px; padding-left: 10px;*/ } .b-item { width: 100%; color: black; text-align: left; } .add-this { position: absolute; width: 121px; top: 5px; right: 15px; } .add-this .add-line { background: url(/Templates/TienPhatAuto/Content/images/icon_add_line.png) no-repeat; width: 2px; float: left; height: 30px; } .add-this .add-yt a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_addthis_h.png) no-repeat -39px 0px; } .add-this .add-yt a { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_addthis.png) no-repeat -39px 0px; width: 35px; height: 35px; margin-right: 5px; } .add-this .add-f a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_addthis_h.png) no-repeat 0px 0px; } .add-this .add-f a { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_addthis.png) no-repeat 1px 0px; width: 35px; height: 35px; margin-right: 5px; } .add-this .add-rss a { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_addthis.png) no-repeat -77px 0px; width: 36px; height: 35px; margin-right: 4px; } .add-this .add-rss a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_addthis_h.png) no-repeat -78px 0px; } .add-this .add-g a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_addthis_h.png) no-repeat -142px 0px; } .add-this .add-g a { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_addthis.png) no-repeat -142px 0px; width: 44px; height: 40px; } .f-line { background: url(/Templates/TienPhatAuto/Content/images/f_line.png) no-repeat; width: 1px; height: 61px; float: left; } .content-wrapper-f { margin: 0 auto; width: 1000px; position: relative; background-color: #393939; } .f-blue { background: url(/Templates/TienPhatAuto/Content/images/blue_f.png) no-repeat; width: 160px; height: 30px; float: left; margin-top: 15px; margin-left: 15px; } .f-box .support-item { color: white; margin-bottom: 10px; } .f-box .f-box-header { margin-bottom: 10px; color: white; text-transform: uppercase; font-weight: 700; font-size: 1.5em; float: left; margin-top: 25px; width: 100%; } .footer-address .address .lbl { /*font-weight: 700; background: url(/Templates/TienPhatAuto/Content/images/icon_address.png) no-repeat 0px 0px; padding-left: 20px;*/ } .footer-address { line-height: 1.5; } .footer-address a, .footer-address a:link, .footer-address a:visited, .footer-address a:hover { color: #fff; } .footer-address .company { font-size: 1.3em; font-weight: 700; color: white; text-transform: uppercase; /*background: url(/Templates/TienPhatAuto/Content/images/icon_company.png) no-repeat 0px 2px;*/ } .f-item { float: left; width: 31%; margin-right: 22px; } .f-last { width: 50%; } /*! * froala_editor v1.2.2 (http://editor.froala.com) * Copyright 2014-2014 Froala */ .froala-element img.fr-fil, img.fr-tag.fr-fil { z-index: 1; position: relative; vertical-align: top; display: block; margin: auto; overflow: auto; padding: 10px 10px 10px 3px; float: left !important; } .froala-element img.fr-fil.fr-tni, img.fr-tag.fr-fil.fr-tni { float: none !important; margin-left: 0 !important; } .froala-element img.fr-fir, img.fr-tag.fr-fir { z-index: 1; position: relative; vertical-align: top; display: block; margin: auto; overflow: auto; padding: 10px 3px 10px 10px; float: right !important; } .froala-element img.fr-fir.fr-tni, img.fr-tag.fr-fir.fr-tni { float: none !important; margin-right: 0 !important; } .froala-element img.fr-fin, img.fr-tag.fr-fin { z-index: 1; position: relative; vertical-align: top; display: block; margin: auto; overflow: auto; padding: 10px 0; float: none; } .froala-element a.fr-file, a.fr-file { position: relative; } .froala-element a.fr-file:before, a.fr-file:before { position: relative; display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: "\f0c6"; top: 0; padding-right: 3px; } .froala-element hr, hr.fr-tag { height: 0px; border: 0; border-top: solid 1px #cccccc; clear: both; } .froala-element pre, pre.fr-tag { white-space: pre-wrap; /* CSS3 */ white-space: -moz-pre-wrap; /* Mozilla, post millennium */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ border: solid 1px #cccccc; background: #fcfcfc; padding: 10px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; } .froala-element blockquote, blockquote.fr-tag { margin-left: 20px; margin-right: 0; margin-top: 0; padding-left: 20px; position: relative; font-style: italic; border-left: solid 5px #cccccc; } .froala-element ul, .froala-element ol, ul.fr-tag, ol.fr-tag { padding-left: 25px; } .froala-element table, table.fr-tag { border-collapse: collapse; empty-cells: show; width: 100%; margin-bottom: 10px; margin-top: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .froala-element table td, table.fr-tag td { border: solid 1px #cccccc; padding: 5px; } .froala-element p, p.fr-tag { margin: 0 0 10px; } .froala-element h1, h1[class="fr-tag"] { font-size: 36px; line-height: 1.1; font-weight: 400; margin-top: 20px; margin-bottom: 10px; } .froala-element h2, h2[class="fr-tag"] { font-size: 30px; line-height: 1.1; font-weight: 400; margin-top: 20px; margin-bottom: 10px; } .froala-element h3, h3[class="fr-tag"] { font-size: 24px; line-height: 1.1; font-weight: 400; margin-top: 20px; margin-bottom: 10px; } .froala-element h4, h4[class="fr-tag"] { font-size: 18px; line-height: 1.1; font-weight: 400; margin-top: 10px; margin-bottom: 10px; } .froala-element h5, h5[class="fr-tag"] { font-size: 14px; line-height: 1.1; font-weight: 400; margin-top: 10px; margin-bottom: 10px; } .froala-element h6, h6[class="fr-tag"] { font-size: 12px; line-height: 1.1; font-weight: 400; margin-top: 10px; margin-bottom: 10px; } .fr-fvn { float: none; display: block !important; text-align: center !important; } .fr-fvl { float: left; margin: 10px 10px 10px 1px; } .fr-fvr { float: right; margin: 10px 1px 10px 10px; } .product-list .product-item .img-cate { height: 121px; width: 323px; display: table-cell; vertical-align: middle; text-align: center; } .codep { height: 25px; overflow: hidden; margin-top:5px; } .codep .lbl { color: #005eb8; } .product-list .product-item .codep .ctn { font-weight: 700; color: #666666; font-size: .8em; } .home-product .owl-pagination div span { background: #666; display: block; width: 10px; height: 10px; border-radius: 100%; } .home-product .owl-pagination div { display: inline-block; margin: 0 3px; } .home-product .owl-pagination { text-align: center; } .home-product .owl-pagination div.active span { background: #db0c0b; } .home-product .itemed { margin: 2px; } .home-product .content .item { border: 1px solid #eee; width: 100%; display: block; float: left; margin-bottom: 20px; padding: 5px; } .home-product .content .item:hover { box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); -moz-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); -webkit-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); } .home-product .content .item .img { float: left; width: 150px; margin-right: 15px; } .home-product .content .item .img a { display: block; height: 150px; overflow: hidden; } .home-product .content .item .meta { float: left; width: calc(100% - 165px); } p.viewdt a { text-transform: uppercase; border: 1px solid #db0c0b; color: #db0c0b; padding: 7px 14px; border-radius: 3px; } p.viewdt { margin-top: 15px; } p.viewdt a:hover { background: #db0c0b; color: #fff; } .home-product .content .item .name { margin-top: 0; } .home-product .content .item .name a { font-weight: 500; color: #111; font-size: 15px; text-transform: capitalize; } .home-product .content .item .name a:hover { color: #db0c0b; } .home-product .content .item img { object-fit: scale-down; width: 100%; height: 100%; } .home-product { float: left; width: calc(100%/3 - 0px); padding: 15px; } .home-product .content { } .product-list { display: flex; flex-wrap: wrap; } .product-list .contact a { background-color: #717171; width: 70px; height: 22px; float: left; color: white; text-align: center; font-size: 0.85em; line-height: 21px; border-radius: 5px; margin-top: 20px; margin-left: 8px; } .product-list .contact a:hover { background-color: #de0519; } .product-list .detail a { /*background: url(/Templates/TienPhatAuto/Content/images/bg_detail.png);*/ float: left; padding: 5px 15px; color: white; background-color: #4699ff; border-radius: 3px; margin-left: 10px; margin-top: 5px; font-size: .85em; margin-right: 50px; } .product-list .detail a:hover { background-color: #dd3900; } .unit-p .lbl { width: 110px; float: left; text-align: left; font-size: .85em; } .unit-p .ctn { width: 100px; float: left; text-align: right; font-size: .85em; height: 16px; overflow: hidden; } .note { text-align: left; float: left; margin-bottom: 5px; width: 100%; } .note span { color: #707070; font-size: .9em; } .bg-b-item-cate { background: url(/Templates/TienPhatAuto/Content/images/bg_b_item_cate.png); width: 323px; height: 9px; } .cate-list .cate-item .name:hover { background-color: #02b1c0; opacity: 1; } .cate-list .cate-name a { color: white; text-transform: uppercase; font-size: .85em; } .cate-list .cate-item .name { font-size: 1.1em; font-weight: 500; overflow: hidden; padding: 10px 10px; height: 20px; text-align: left; position: absolute; width: 212px; text-align: center; background-color: black; opacity: .8; bottom: -3px; left: -1px; line-height: 24px; } .cate-list .cate-item .img-cate img { max-height: 250px; width: 230px; display: table-cell; margin: auto; } .cate-list .cate-line { margin: 15px 0; } .cate-list .cate-item .img-cate { height: 250px; width: 230px; display: table-cell; vertical-align: middle; text-align: center; background-color: white; } .cate-list .cate-item { display: inline-block; text-align: center; margin-right: 37px; float: left; width: 230px; height: 250px; border: solid 1px #eee; background-color: #f1f5f8; position: relative; } .cart-p a { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_cart_p.png) no-repeat 1px 1px; width: 35px; height: 29px; margin-top: 3px; } .cart-p a:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_cart_p_hover.png) no-repeat 1px 1px; } .p-price { margin-top: 5px; width: 100%; float: left; text-align: left; height: 15px; margin-bottom: 5px; } .p-price .dprice .unit { color: #e70808; } .p-price .dprice { color: #0b63cd; font-weight: 700; margin-bottom: 5px; float: left; min-width: 105px; } .p-price .price { font-size: .85em; color: gray; font-weight: 500; text-decoration: line-through; float: left; margin-left: 7px; text-align: right; } .product-list .product-item .img-cate img { max-height: 212px; max-width: 323px; } .product-list .product-item .img-cate a { height: 212px; width: 323px; float: left; } .product-list .cate-item { position: relative; } .product-list .cate-name { position: absolute; background-color: black; opacity: .8; bottom: 0px; } .product-list .cate-name:hover { background-color: #c80e00; opacity: 1; } .product-list .cate-name a { color: white; } .product-list .product-line { /*margin: 15px 0;*/ } .product-list .product-item { border: 1px solid #eee; width: calc(100%/5 - 30px); float: left; margin: 15px; padding: 5px; text-align: center; } .product-list .product-item:hover { box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); -moz-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); -webkit-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.18); } .product-list .last-box { /*margin-right: 0; float: right;*/ } .product-list .product-item:last-child { margin-right: 0; } .product-list .product-item .name a:hover { /*color: #dd3900;*/ } .product-list .product-item .name a { font-weight: 500; color: #111; display: table-cell; vertical-align: middle; font-size: 14px; text-transform: capitalize; } .product-list .product-item .name a:hover { color: #db0c0b; } .product-list .product-item .name { text-align: center; margin-top: 5px; display: table; width: 100%; vertical-align: middle; height: 40px; } .product-list .product-item .img a { display: block; height: 170px; } .product-list .product-item .img img { width: 100%; height: 100%; object-fit: scale-down; } .product-detail { } .product-detail .name { margin-bottom: 10px; margin-left: 0; } .product-detail .image { margin-right: 10px; margin-bottom: 10px; } .product-detail .headline { padding-top: 30px; float: left; width: 60%; margin-left: 6px; } .product-detail .main-image { text-align: center; line-height: 250px; vertical-align: middle; border: 1px solid #eee; padding: 5px; border-radius: 5px; width: 100%; position: relative; } .product-detail .main-image img { line-height: 250px; max-width: 260px; vertical-align: middle; } .product-detail .description { padding: 10px 5px; border: 1px solid #eee; border-width: 0 1px 1px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; margin-bottom: 10px; float: left; width:100%; } .product-detail h4 { border-bottom: 1px solid #eee; } .other { margin-top: 20px; float: left; width: 95%; } .other h2 { margin-bottom: 10px; margin-left: 10px; } .breadcrumb { /*padding: 5px 0; border: 1px solid #eee; background: #e3e3e3; background: -moz-linear-gradient(top, #e3e3e3 0%, #ffffff 4%, #f4f4f4 7%, #f3f3f3 11%, #f3f3f3 93%, #ffffff 96%, #e3e3e3 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e3e3e3), color-stop(4%,#ffffff), color-stop(7%,#f4f4f4), color-stop(11%,#f3f3f3), color-stop(93%,#f3f3f3), color-stop(96%,#ffffff), color-stop(100%,#e3e3e3)); background: -webkit-linear-gradient(top, #e3e3e3 0%,#ffffff 4%,#f4f4f4 7%,#f3f3f3 11%,#f3f3f3 93%,#ffffff 96%,#e3e3e3 100%); background: -o-linear-gradient(top, #e3e3e3 0%,#ffffff 4%,#f4f4f4 7%,#f3f3f3 11%,#f3f3f3 93%,#ffffff 96%,#e3e3e3 100%); background: -ms-linear-gradient(top, #e3e3e3 0%,#ffffff 4%,#f4f4f4 7%,#f3f3f3 11%,#f3f3f3 93%,#ffffff 96%,#e3e3e3 100%); background: linear-gradient(to bottom, #e3e3e3 0%,#ffffff 4%,#f4f4f4 7%,#f3f3f3 11%,#f3f3f3 93%,#ffffff 96%,#e3e3e3 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e3e3e3', endColorstr='#e3e3e3',GradientType=0 ); border-radius: 5px 5px; margin-bottom: 10px; margin-top: 10px;*/ width: 100%; padding: 5px 0px; } .breadcrumb ul { margin: 0; padding: 0; list-style: none; } .breadcrumb li { display: inline; background-image: url(/Templates/TienPhatAuto/Content/images/nav-arrow-right.png); background-position: right center; background-repeat: no-repeat; padding-right: 10px; padding-left: 3px; } .breadcrumb li span { padding: 0 3px; color: black; } .breadcrumb li a { text-decoration: none; color: black; padding: 0 3px; } .breadcrumb li a:hover { text-decoration: underline; } .breadcrumb .home { } .breadcrumb .last { background: transparent; } .search-box { width: 285px; float: right; position: relative; margin: 17px 0; } .search-box input[type='text'] { border-radius: 36px; width: 100%; padding: 13px 10px; font-size: 12px; float: left; color: black; outline:none !important; background-color: white; margin: 6px 0; } button#search-button { position: absolute; right: 0; border: none; color: red; font-size: 17px; background: none; height: 38px; top: 9px; width: 61px; border-radius: 36px; } button#search-button:hover { } input: focus, input: textarea { border: none; } html { margin: 0; padding: 0; } .c-box .lbl { font-weight: 700; } .c-box .item { margin-bottom: 5px; } #left .box, #right .box { float: left; width: 100%; } #menu-offcanvas { display: none; } .summary { padding: 0 10px; } .hot-news { margin-bottom: 20px; } .hot-news .items { border: 1px solid #eee; margin: 0 15px; margin-bottom: 20px; } .hot-news .items:hover { box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.35); -moz-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.35); -webkit-box-shadow: 0px 0px 16px 0px rgba(61, 61, 61, 0.35); } .hot-news .items .meta { padding: 8px; } .hot-news .owl-buttons { text-align: center; } .hot-news .items .img img { width: 100%; height: 100%; object-fit: scale-down; } .hot-news .items .img a { display: block; height: 270px; } .hot-news .owl-buttons div { display: inline-block; margin: 0 4px; width: 35px; height: 35px; color: #005EB8; text-align: center; line-height: 32px; border-radius: 30px; border: 1px solid #005eb8; } .hot-news .owl-buttons div:hover { background: #005EB8; color: #fff; } .hot-news .items .name { margin-bottom: 10px; height: 47px; display: block; overflow: hidden; } .hot-news .items p.vietiep a { color: #111; display: block; margin-top: 10px; } .hot-news .items p.vietiep a:hover { color: #db0c0b; } .hot-news .items .name a { font-weight: 500; color: #111; text-transform: capitalize; font-size: 16px; } .hot-news .items .name a:hover { color: #db0c0b; } .box-mail { background: url(/Templates/TienPhatAuto/Content/images/bgmail.jpg) no-repeat top center; padding: 45px 0; background-size: cover; width: 100%; background-position: center; clear: both; text-align: center; } .reg-email span { font-size: 22px; color: #fff; margin: 4px 0; position: relative; display: block; padding-bottom: 13px; text-transform: uppercase; font-weight: 600; margin-bottom: 15px; } .reg-email span:after { width: 50px; height: 3px; background: red; position: absolute; left: 0; right: 0; margin: auto; bottom: 0; content: ""; } .reg-email form { width: 50%; margin: 0 auto; position: relative; } .reg-email .chk { margin-right: 5px; } .reg-email form input { border-radius: 32px; height: 40px; outline: none !important; padding-left: 10px; width: 100%; } .reg-email form input#btn_Reg { position: absolute; right: 0; background: #db0c0b; text-transform: uppercase; height: 40px; padding: 0 22px; width: 118px; } .reg-email form input#btn_Reg:hover { background: #db0c0b; } .reg-email .email { width: 190px; height: 20px; padding: 0; } .online-left { margin-left: 45px; } .send-mail { background: url(/Templates/TienPhatAuto/Content/images/img_sendF.gif) no-repeat 1px 1px; height: 75px; width: 125px; margin-left: 33px; float: left; } .support { margin: 0; padding: 0; } .other-img li { float: left; margin-right: 5px; margin-bottom: 5px; } .other-img li img { width: 50px; height: 50px; } .other-img { float: left; margin-bottom: 10px; width: 100%; } .partner .item .name { height: 20px; width: 95%; padding: 5px; overflow: hidden; } .partner .item .name a:hover { color: #005ca2; } .partner .item { border: 1px solid #ebebeb; height: 205px; width: 23.59%; display: block; float: left; margin-bottom: 10px; background-color: white; margin: .57%; text-align: center; } .partner .item .img img { vertical-align: middle; max-width: 170px; height: 170px; } .partner .item .img { width: 230px; height: 175px; text-align: center; display: table-cell; vertical-align: middle; background-color: white; } .sup-box .sup-box-content .header { color: #fcb700; text-transform: uppercase; font-weight: 700; margin-bottom: 10px; } .sup-box .sup-box-content .hotline-sup { color: white; margin-bottom: 5px; font-size: 1.7em; } .dealer .item .name { color: #0b63cd; text-transform: uppercase; font-size: 1.1em; margin-bottom: 5px; font-weight: 700; } .dealer .item .item-s { width: 100%; float: left; margin-bottom: 5px; } .dealer .item .item-s .lbl { width: 6%; float: left; } .dealer .item .item-s .ctn { font-weight: 700; } .dealer .item { width: 100%; float: left; padding: 10px 0; margin-bottom: 10px; border-bottom: solid 1px #ededed; } .right { border-radius: 0 0 5px 5px; } .box-video { padding: 5px; background-color: #07243e; border-radius: 0 0 5px 5px; float: left; width: 95.3%; margin-top: 10px; text-align: center; } .box-video .name a:hover { text-decoration: underline; } .box-video .name a { color: white; } .box-video .name { margin: 10px 5px; } #site-name .address { position: absolute; bottom: 7px; left: 307px; } span.menumb { display: none; } .search-result ul li { margin-bottom: 5px; } .search-result ul li a:hover { color: blue; text-decoration: underline; } .m-left { margin-top: 15px; } .c-box { float: left; width: 50%; } section.form.formleft { float: left; } .b-top { /*background-color: white; height: 145px;*/ } .t-top { background: url(/Templates/TienPhatAuto/Content/images/bg_top.png); height: 38px; } .t-top .t-content { width: 1000px; margin: 0 auto; } #partner_next:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_next_h.png) no-repeat; } #partner_prev:hover { background: url(/Templates/TienPhatAuto/Content/images/icon_prev_h.png) no-repeat; } #partner_next { background: url(/Templates/TienPhatAuto/Content/images/icon_next.png) no-repeat; cursor: pointer; position: absolute; width: 32px; height: 32px; top: -35px; right: -10px; z-index: 100; } #partner_prev { background: url(/Templates/TienPhatAuto/Content/images/icon_prev.png) no-repeat; cursor: pointer; position: absolute; width: 32px; height: 32px; top: -35px; right: 5px; z-index: 100; } .c-box .header { margin-bottom: 10px; } .c-box .header span { text-transform: uppercase; font-size: 1.2em; } .c-box .div-a-contact { margin-bottom: 10px; } .link-list { float: left; margin: 0 10px; width: 100%; } .link-list .lbl { width: 46.5%; float: left; padding: 5px; color: white; background-color: #c80e00; margin-top: 10px; } .link-list .name { width: 48%; float: left; padding: 5px; border-bottom: solid 1px gray; margin-bottom: 10px; margin-top: 10px; padding: 5px; } .link-list .url a { color: blue; } .link-list .url a:hover { text-decoration: underline; } .link-list .name span { font-weight: 700; color: black; } .link-list .url { width: 45%; float: left; padding: 5px; border-bottom: solid 1px gray; margin-bottom: 10px; margin-top: 10px; padding: 5px; } .f-item-last { float: left; width: 320px; } .bg-download a { background: url(/Templates/TienPhatAuto/Content/images/bg_download.png); width: 331px; height: 168px; float: left; } #partner_slide .p-item { background-color: none !important; } .f-item-l { float: left; width: 320px; } #partner .p-item { width: 130px; height: 75px; float: left; margin-right: 10px; margin-bottom: 10px; } #partner .p-item .img { width: 130px; height: 75px; background-color: white; display: table-cell; vertical-align: middle; text-align: center; } #partner .p-item .img img { max-width: 130px; max-height: 75px; } .icon-phone { /*background: url(/Templates/TienPhatAuto/Content/images/icon_phone.png); width: 34px; float: left; height: 34px; margin-top: 12px; position: absolute; margin-left: 15px;*/ } .advgiua { clear: both; border: 2px solid #eee; background-size: cover; padding: 35px 0; border-radius: 5px; margin: 20px 0; float: left; width: 100%; } .boxadv { display: flex; flex-wrap: wrap; } .boxadv .items-tran { width: calc(100%/4); text-align: left; color: #666; padding-left: 15px; -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; } .boxadv .items-tran img { display: inline-block; float: left; margin-right: 10px; border: 1px solid #fff; box-shadow: 0px 3px 0px 1px #d9d9d9; border-radius: 100%; filter: grayscale(100%); -webkit-transition: 0.5s ease-in-out; -moz-transition: 0.5s ease-in-out; -o-transition: 0.5s ease-in-out; } .boxadv .items-tran:hover h3 { color: #db0c0b; } .boxadv .items-tran:hover img { filter: grayscale(0); } .boxadv .items-tran h3 { color: #000; text-transform: uppercase; font-weight: 500; margin-top: 18px; } .boxadv .items-tran:hover { margin-top: 0; } .titlenews { text-align: center; margin-top: 25px; margin-bottom: 25px; } .titlenews span { color: #111; font-size: 21px; font-weight: 600; text-transform: capitalize; } .titlenews label { color: #666; } .boxnews { margin: 12px 0 30px; float: left; width: 100%; } p.viewall { text-align: center; margin: 20px 0; clear: both; float: left; width: 100%; } p.viewall a { border: 1px solid #db0c0b; text-transform: uppercase; padding: 8px 20px; color: #db0c0b; } p.viewall a:hover { background: #db0c0b; color: #fff; } .other ul li { list-style: outside; margin-bottom: 5px; font-size: 0.9em; } .other ul li a { color: black; } .other ul li a:hover { color: blue; } .cart-d { margin-bottom: 10px; float: left; } .f-l .code { color: #666666; } .f-l .code .ctn { font-weight: 700; font-size: 1.1em; margin-left: 10px; } .f-l { float: left; width: 60%; padding: 5px; height: 60px; } .f-r { float: left; width: 49%; padding: 5px; border: solid 1px #eee; border-left: none; font-size: .85em; height: 60px; } .f-r .lbl { float: left; width: 120px; margin-bottom: 5px; } .f-r .ctn { float: left; width: 120px; font-weight: 700; margin-bottom: 5px; } .box-content-mn #total { text-align: left; } .form input, textarea { width: 300px; } .cart-submit { margin-top: 10px; margin-left: 10px; } .cart-submit a { color: blue; text-decoration: underline; font-style: italic; } .cart-submit input { color: white; font-size: 0.85em; background-color: #0154c9; border: none; border-radius: 5px; padding: 2px 10px; } .cart .red { color: red; } .cart .right { text-align: right; } .cart .qty { width: 100px; } .cart { width: 98%; margin-left: 10px; } .cart thead tr { border: solid 1px #007eff; background-color: #f0f0f0; } .cart td, .cart th { border-right: solid 1px #007eff; } .cart input { width: 100px; text-align: right; } .cart tbody tr { border: solid 1px #007eff; } .icon-new { background: url(/Templates/TienPhatAuto/Content/images/icon_new.png) no-repeat; width: 64px; height: 64px; position: absolute; } .list-right-icon { position: fixed; right: 5px; top: 40%; z-index: 11; } .list-right-icon a { display: block; } a.btn-top { position: fixed; right: 10px; bottom: 10px; z-index: 11; } .copyright .line-li { margin: 0 7px; color: white; } .copyright .mrg-footer a { color: white; text-transform: uppercase; } .copyright .mrg-footer { float: left; width: 74%; background: url(/Templates/TienPhatAuto/Content/images/icon_mn_f.png) no-repeat 15px 15px; padding-left: 101px; height: 71px; } .copyright ul li { float: left; } .copyright ul li a:hover, .copyright ul .active a { color: yellow; } .copyright ul { font-size: 0.85em; margin: 28px 0; padding: 0; } .item-l-news { /*margin: 0px 10px; border-bottom: dotted 1px #c8c8c8; padding: 20px 0;*/ } .box-content-mn .more a { color: white; background-color: #c90e00; padding: 5px 10px; font-size: 0.95em; border-radius: 5px; } .box-content-mn .more { float: left; margin: 10px 0; } .item-l-news .image { float: left; margin-right: 5px; width: 75px; height: 55px; } .item-l-news .name { margin-bottom: 5px; } .item-l-news .date { color: #7a7a7a; font-style: italic; font-size: 0.85em; } .item-l-news .name a { color: #544f4d; display: block; text-align: justify; padding-left: 20px; background: url(/Templates/TienPhatAuto/Content/images/icon_h_news.png) no-repeat 1px 2px; } .item-l-news .name a:hover { text-decoration: underline; } .item-l-news .image img { width: 75px; height: 55px; } .pagein .box-content { display: none; overflow: visible; max-height: initial; position: absolute; z-index: 1111; width: 270px; background:#FFF; } .pagein { position: relative; z-index: 111; } .box-content-mn .online { margin-bottom: 5px; float: left; width: 100%; } .box-content-mn .online .lbl { width: 95px; float: left; font-size: 0.85em; color: black; } .box-content-mn .online-tt { border-top: solid 1px #1dd3e3; padding: 10px 0; float: left; width: 100%; } .box-content-mn .online-tt .lbl { text-transform: uppercase; font-weight: 700; font-size: 0.85em; } .box-content-mn .online-tt .ctn { color: #ef0d0d; font-weight: 700; font-size: 1.2em; } .box-content-mn .online .dot { width: 20px; float: left; color: black; } .box-email button { position: absolute; right: 1px; top: 5px; border: none; width: 40px; height: 40px; border-radius: 40px; background: #db0c0b; } .box-email form { position: relative; } .box-email form input { height: 40px; border-radius: 40px; width: 100%; font-size: 14px; padding-left: 15px; } .box-content-mn .online .ctn { font-size: 0.85em; color: #0084bc; font-weight: 700; float: left; text-align: left; margin-bottom: 5px; } #linkwebid { width: 198px; margin: 5px 0 5px 0; background-color: #e2e2e2; border: none; height: 26px; color: #282828; } .sup-box { position: fixed; left: 0; top: 50%; } .sup-box .sup-box-header span { text-transform: uppercase; font-size: 0.85em; font-weight: 700; cursor: pointer; } .bg-online { background: url(/Templates/TienPhatAuto/Content/images/bg_online.png) no-repeat 120px 0px; float: left; } .sup-box .sup-box-header { background: url(/Templates/TienPhatAuto/Content/images/icon_support_online.png) no-repeat 1px 3px; width: 69px; height: 151px; cursor: pointer; } .sup-box .sup-box-content { width: 255px; border: solid 1px #ababab; padding: 15px; position: absolute; border-radius: 3px; z-index: 1000; margin-left: 59px; margin-top: -140px; background-color: black; opacity: 0.8; } .c-box { } .c-box .company { font-weight: 700; margin-bottom: 15px; font-size: 1.2em; } .info .ck a { background: url(/Templates/TienPhatAuto/Content/images/ck.png) no-repeat 1px 3px; padding-left: 50px; border-bottom: dashed 1px #d4d4d4; color: #383e44; font-weight: 700; line-height: 2; width: 75%; float: left; font-size: 0.85em; height: 30px; padding-top: 2px; } .info .tt a { background: url(/Templates/TienPhatAuto/Content/images/tt.png) no-repeat 1px 1px; padding-left: 50px; border-bottom: dashed 1px #d4d4d4; color: #383e44; font-weight: 700; line-height: 2; width: 75%; float: left; font-size: 0.85em; height: 30px; padding-top: 5px; } .info .nt a { background: url(/Templates/TienPhatAuto/Content/images/nt.png) no-repeat 1px 1px; padding-left: 50px; border-bottom: dashed 1px #d4d4d4; color: #383e44; font-weight: 700; line-height: 2; width: 75%; float: left; font-size: 0.85em; height: 30px; padding-top: 8px; } .info .gv a { background: url(/Templates/TienPhatAuto/Content/images/gv.png) no-repeat 1px 1px; padding-left: 50px; border-bottom: dashed 1px #d4d4d4; color: #383e44; font-weight: 700; line-height: 2; width: 75%; float: left; font-size: 0.85em; height: 30px; } .box-lang ul { /*margin: 0; padding: 0; background: url(/Templates/TienPhatAuto/Content/images/bg_lang.png); width: 150px; height: 25px; padding-left: 20px;*/ width: 100%; } .box-lang ul li { float: left; list-style: none; margin-right: 10px; font-size: 0; line-height: 0; margin-top: 6px; background: none; width: 20px; margin-left: 0px; } .box-lang ul li a { color: black; margin: 0; padding: 0; } .box-online .online { float: left; margin-right: 29px; } .box-online .lbl { font-size: 0.85em; } .box-online .ctn { font-size: 0.85em; font-weight: 700; } .box-online { float: left; width: 30%; margin-top: 8px; } .f-copyright { clear: both; margin-bottom: 20px; /*background-color: #171717;*/ min-width: 1000px; } .f-cus { clear: both; background-color: #f8f8f8; height: 100px; padding: 15px 0; } .mrg-copy .c-name { color: #ff6d65; font-size: 1em; text-transform: uppercase; margin-bottom: 8px; } .mrg-copy .c-name:hover { text-decoration: underline; } .mrg-copy a { color: white; } .mrg-copy { font-size: 0.9em; text-align: left; float: left; margin-top: 100px; color: #4eaaff; } .pager { float: left; margin: 10px 0 10px 7px; width: 100%; margin-top: 10px; text-align: center; } .pager .item { border: solid 1px #ddd; background-color: white; color: #333; padding: 4px 5px; font-weight: 400; width: 30px; margin: 2px; text-align: center; display: inline-block; } .pager .active { border: solid 1px #db0c0b; background-color: #db0c0b; color: white; } .question span { color: red; } .reply span { color: red; } .news-list .news-item .icon-q { background: url(/Templates/TienPhatAuto/Content/images/icon_question.png) no-repeat 1px 0px; padding-left: 18px; text-align: justify; } .top { background: url(/Templates/TienPhatAuto/Content/images/icon_top.png); width: 30px; height: 45px; position: absolute; float: right; margin-top: -50px; } .box-news .item { float: left; margin-bottom: 15px; border-bottom: dashed 1px #80b4da; width: 100%; } .box-news .name { font-weight: 500; margin-bottom: 10px; } .box-news .name a { color: white; } .box-news .image { float: left; margin-right: 5px; width: 75px; height: 53px; } .box-news .image img { width: 75px; height: 53px; } .box-news .more { float: left; /*margin-top: 15px;*/ } .box-news .more a { color: #005ce6; font-style: italic; color: #85e7ff; } .box-news .date { color: #85e7ff; font-style: italic; margin-bottom: 5px; } .padding15 { margin-left: -15px; margin-right: -15px; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } #body { clear: both; margin: 0 auto; } .b-content { text-align: left; /*background: white url(/Templates/TienPhatAuto/Content/images/bg_cnt_page.png) repeat-x; padding: 10px;border-bottom: solid 2px #03398b;*/ padding-bottom: 0; width: 100%; margin-top: 5px; } body { color: #333; font-size: 14px; margin: 0 auto; padding: 0; font-family: 'Be Vietnam', sans-serif; /*background: white url(/Templates/TienPhatAuto/Content/images/bg_menu.png);*/ } a { outline: none; text-decoration: none; } a:link, a:visited, a:active, a:hover { /*color: #000;*/ } header, footer, hgroup, nav, section { display: block; } .float-left { float: left; } .float-right { float: right; } .clear-fix:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; } .clear-fix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .clear-fix { display: inline-block; } /* mac hide - force layout in ie \*/ * html .clear-fix, * html #inner, * html #middle { height: 1%; } .clear-fix { display: block; } h1, h2, h3, h4, h5, h6 { color: #000; margin-bottom: 0; padding-bottom: 0; padding-top: 0; margin-top: 10px; } h1 { font-size: 1.4em; margin-bottom: 10px; } h2 { font-size: 1.25em; } h3 { font-size: 1.2em; } h4 { font-size: 1.1em; } h5, h6 { font-size: 1em; } h5 a:link, h5 a:visited, h5 a:active { padding: 0; text-decoration: none; } p { margin: 0; } /* main layout ----------------------------------------------------------*/ .content-wrapper { margin: 0 auto; width: 1170px; position: relative; } .box-lang .lang-1 { width: 25px; height: 17px; background: url(/Templates/TienPhatAuto/Content/images/vn.png) no-repeat 0px 0px; color: white; } .box-lang .lang-2 { width: 24px; height: 16px; background: url(/Templates/TienPhatAuto/Content/images/en.png) no-repeat 0px 0px; color: white; } .box-lang { position: absolute; top: 60px; right: 0px; } .bold { font-weight: 700; } .logo { float: left; margin: 15px 0px; z-index: 1000; } .slogan { background: #f2f2f2; text-align: center; padding: 10px 0; } .slogan a { color: #007ae5; padding-left: 5px; } .flash-banner { /*background: url(/Templates/TienPhatAuto/Content/images/bg_banner.png) no-repeat;*/ position: relative; } .dmsp { width: 270px; float: left; margin-top: -55px; } .banner { width: calc(100% - 300px); float: right; margin-top: 10px; } .wrapsearch { background: #333333; color: #fff; height: 55px; } #site-name { /*font-size: 25px; margin-left: 172px; margin-top: 64px; text-transform: uppercase; color: blue; font-weight: 700;*/ } .left-column { width: 24%; min-height: 100px; } .content-column { width: 72%; float: right; } /* site title ----------------------------------------------------------*/ .site-title { color: #c8c8c8; font-family: Rockwell, Consolas, "Courier New", Courier, monospace; font-size: 2.3em; margin: 0; } .site-title a, .site-title a:hover, .site-title a:active { background: none; color: #c8c8c8; outline: none; text-decoration: none; } /* menu ----------------------------------------------------------*/ ul#menu { font-size: 1.3em; font-weight: 600; margin: 0 0 5px; padding: 0; text-align: right; } ul#menu li { display: inline; list-style: none; padding-left: 15px; } ul#menu li a { background: none; color: #999; text-decoration: none; } ul#menu li a:hover { color: #333; text-decoration: none; } #left { width: 215px; float: left; margin-bottom: 10px; } .right { } #right { width: 215px; float: right; } #center { width: 568px; float: left; } hgroup.title h1, hgroup.title h2 { display: inline; } hgroup.title h2 { font-weight: normal; margin-left: 3px; } /* features */ section.feature { width: 300px; float: left; padding: 10px; } /* ordered list */ ol.round { list-style-type: none; padding-left: 0; } ol.round li { margin: 25px 0; padding-left: 45px; } ol.round li.zero { background: url("/Templates/TienPhatAuto/Images/orderedList0.png") no-repeat; } ol.round li.one { background: url("/Templates/TienPhatAuto/Images/orderedList1.png") no-repeat; } ol.round li.two { background: url("/Templates/TienPhatAuto/Images/orderedList2.png") no-repeat; } ol.round li.three { background: url("/Templates/TienPhatAuto/Images/orderedList3.png") no-repeat; } ol.round li.four { background: url("/Templates/TienPhatAuto/Images/orderedList4.png") no-repeat; } ol.round li.five { background: url("/Templates/TienPhatAuto/Images/orderedList5.png") no-repeat; } ol.round li.six { background: url("/Templates/TienPhatAuto/Images/orderedList6.png") no-repeat; } ol.round li.seven { background: url("/Templates/TienPhatAuto/Images/orderedList7.png") no-repeat; } ol.round li.eight { background: url("/Templates/TienPhatAuto/Images/orderedList8.png") no-repeat; } ol.round li.nine { background: url("/Templates/TienPhatAuto/Images/orderedList9.png") no-repeat; } /* content */ article { float: left; width: 70%; } aside { float: right; width: 25%; } aside ul { list-style: none; padding: 0; } aside ul li { background: url("/Templates/TienPhatAuto/Images/bullet.png") no-repeat 0 50%; padding: 2px 0 2px 20px; } .label { font-weight: 700; } /* contact */ .contact h3 { font-size: 1.2em; } .contact p { margin: 5px 0 0 10px; } .contact iframe { border: 1px solid #333; margin: 5px 0 0 10px; } /* forms */ fieldset { border: none; margin: 0; padding: 0; } fieldset legend { display: none; } fieldset ol { padding: 0; list-style: none; } fieldset ol li { padding-bottom: 5px; } label { display: block; font-size: 1em; font-weight: 500; } label.checkbox { display: inline; } input, textarea { border: 1px solid #e2e2e2; background: #fff; color: #333; font-size: 1.2em; margin: 5px 0 6px 0; padding: 5px; } textarea { font-family: inherit; width: 500px; } input:focus, textarea:focus { border: 1px solid #7ac0da; } input[type="checkbox"] { background: transparent; border: inherit; width: auto; } input[type="submit"], input[type="button"], button { background-color: #3f95ff; cursor: pointer; font-size: 1em; padding: 5px 10px; width: auto; border-radius: 5px; color: white; } td input[type="submit"], td input[type="button"], td button { font-size: 1em; padding: 4px; margin-right: 4px; } /* info and errors */ .message-info { border: 1px solid; clear: both; padding: 10px 20px; } .message-error { clear: both; color: #e80c4d; font-size: 1.1em; font-weight: bold; margin: 20px 0 10px 0; } .message-success { color: #7ac0da; font-size: 1.3em; font-weight: bold; margin: 20px 0 10px 0; } .error { color: #e80c4d; } /* styles for validation helpers */ .field-validation-error { color: #e80c4d; font-weight: bold; } .field-validation-valid { display: none; } input.input-validation-error { border: 1px solid #e80c4d; } input[type="checkbox"].input-validation-error { border: 0 none; } .validation-summary-errors { color: #e80c4d; font-weight: bold; font-size: 1.1em; } .validation-summary-valid { display: none; } /* tables ----------------------------------------------------------*/ table { border-collapse: collapse; border-spacing: 0; margin-top: 0.75em; border: 0 none; } th { font-size: 1.2em; text-align: left; border: none 0px; padding-left: 0; } th a { display: block; position: relative; } th a:link, th a:visited, th a:active, th a:hover { color: #333; font-weight: 600; text-decoration: none; padding: 0; } th a:hover { color: #000; } th.asc a, th.desc a { margin-right: .75em; } th.asc a:after, th.desc a:after { display: block; position: absolute; right: 0em; top: 0; font-size: 0.75em; } th.asc a:after { content: 'â–²'; } th.desc a:after { content: 'â–¼'; } td { padding: 0.5em; border: 0 none; } th { padding: 0.5em; } tr.pager td { padding: 0 0.25em 0 0; } .social-share { width: 185px; margin-top: 10px; } .message { color: green; padding: 10px 0; font-size: 0.9em; display: block; } .error { color: red; padding: 10px 0; font-size: 0.9em; display: block; } img { border: none; } #ajax-box { text-align: center; background: white; padding: 20px 10px; width: 980px; margin: 0 auto; font-weight: bold; -webkit-mask-image: -webkit-linear-gradient(#000, rgba(0,0,0,.9)); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; -webkit-animation-duration: 1s; -webkit-animation-delay: .2s; -webkit-animation-timing-function: ease; -webkit-animation-fill-mode: both; -moz-animation-duration: 1s; -moz-animation-delay: .2s; -moz-animation-timing-function: ease; -moz-animation-fill-mode: both; -ms-animation-duration: 1s; -ms-animation-delay: .2s; -ms-animation-timing-function: ease; -ms-animation-fill-mode: both; -o-animation-duration: 1s; -o-animation-delay: .2s; -o-animation-timing-function: ease; -o-animation-fill-mode: both; animation-duration: 1s; animation-delay: .2s; animation-timing-function: ease; animation-fill-mode: both; } .support-group-list { margin: 0; padding: 0; list-style-type: none; text-align: left; z-index: 1; } .support-group { text-align: left; display: block; background: url(/Templates/TienPhatAuto/Content/images/icon_support.gif) no-repeat; padding: 0 0 10px 20px; margin-left: 5px; position: relative; font-weight: 700; font-size: .9em; color: #005896; cursor: pointer; } .support-list { margin: 0; padding: 0; list-style-type: none; text-align: left; display: none; position: absolute; left: 50%; top: 0; width: 220px; border: 1px solid #FC3; background: #FF9; z-index: 10; } .support-item { text-align: left; display: block; padding: 5px; width: 98%; float: left; color: #005896; font-weight: 700; background: url(/Templates/TienPhatAuto/Content/images/phone.gif) no-repeat 5px 50%; padding-left: 30px; } .yahoo-item { padding-left: 20px; } .phone-item { padding-left: 25px; background: url(/Templates/TienPhatAuto/Content/images/phone.gif) no-repeat; font-weight: 700; color: #005896; } .support-info { float: left; } .support-name { float: left; width: 77px; overflow: hidden; margin-right: 5px; } .customer-slide { width: 914px; height: 100px; padding: 0; float: left; overflow: hidden; } .new-pro-slide li.slide-item .item-name { margin-left: 10px; } .bd-f-cus { float: left; width: 975px; height: 100px; border: solid 1px #d7d6d6; background-color: white; margin-bottom: 10px; } .customer-slide ul { margin: 0; padding: 0; list-style: none; display: block; } .customer-slide li { text-align: center; width: 150px; height: 87px; padding: 0; margin: 6px; display: block; float: left; padding: 0; background-color: white; } .customer-slide li.slide-item { /*border: 1px solid #eee;*/ margin-right: 10px; height: 78px; width: 165px; vertical-align: middle; display: block; float: left; } .customer-slide .slide-item .name { font-size: 0.85em; display: block; margin: 0 20px; } .customer-slide .slide-item .img { height: 150px; margin-top: 10px; margin-bottom: 10px; } .customer-slide .slide-item img { line-height: 87px; height: 78px; width: 165px; vertical-align: middle; } a.prev-cus:hover { background: url(/Templates/TienPhatAuto/Content/images/slide-left-cus-hover.png) no-repeat 100% 50%; } a.next-cus:hover { background: url(/Templates/TienPhatAuto/Content/images/slide-right-cus-hover.png) no-repeat 100% 50%; } a.prev-cus { background: url(/Templates/TienPhatAuto/Content/images/slide-left-cus.png) no-repeat 100% 50%; display: block; width: 23px; height: 100px; float: left; cursor: pointer; font-size: 1px; margin-right: 10px; } a.next-cus { background: url(/Templates/TienPhatAuto/Content/images/slide-right-cus.png) no-repeat 100% 50%; display: block; width: 23px; height: 100px; float: left; cursor: pointer; font-size: 1px; margin-left: 5px; } .new-pro-slide { width: 917px; height: 331px; padding: 0; float: left; overflow: hidden; } .new-pro-slide ul { margin: 0; padding: 0; list-style: none; display: block; } .new-pro-slide li { /* text-align: center; width: 150px; height: 87px; padding: 0; margin: 6px; display: block; float: left; padding: 5px;*/ } .new-pro-slide li.slide-item { border-right: 1px solid #eee; height: 310px; width: 228px; display: block; float: left; } .new-pro-slide .slide-item .name:hover { color: red; } .new-pro-slide .slide-item .name { font-size: 0.85em; display: block; margin-top: 10px; font-weight: 700; } .new-pro-slide .slide-item .img { width: 228px; height: 205px; text-align: center; display: table-cell; vertical-align: middle; } .new-pro-slide .slide-item img { max-height: 205px; max-width: 228px; margin: auto; display: table-cell; } .h-new-pro a.prev:hover { background: url(/Templates/TienPhatAuto/Content/images/slide-left-hover.png) no-repeat 100% 50%; } .h-new-pro a.next:hover { background: url(/Templates/TienPhatAuto/Content/images/slide-right-hover.png) no-repeat 100% 50%; } .h-new-pro a.prev { background: url(/Templates/TienPhatAuto/Content/images/slide-left.png) no-repeat 100% 50%; display: block; width: 25px; height: 25px; float: left; cursor: pointer; font-size: 1px; margin-right: 2px; margin-left: 8px; } .h-new-pro a.next { background: url(/Templates/TienPhatAuto/Content/images/slide-right.png) no-repeat 100% 50%; display: block; width: 25px; height: 25px; float: left; cursor: pointer; font-size: 1px; } @font-face { font-family: 'FontAwesome'; src: url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.eot?v=4.6.3'); src: url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.eot?#iefix&v=4.6.3') format('embedded-opentype'), url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.woff2?v=4.6.3') format('woff2'), url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.ttf?v=4.6.3') format('truetype'), url('/Templates/TienPhatAuto/Content/fonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } .fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* makes the font 33% larger relative to the icon container */ .fa-lg { font-size: 1.33333333em; line-height: 0.75em; vertical-align: -15%; } .fa-2x { font-size: 2em; } .fa-3x { font-size: 3em; } .fa-4x { font-size: 4em; } .fa-5x { font-size: 5em; } .fa-fw { width: 1.28571429em; text-align: center; } .fa-ul { padding-left: 0; margin-left: 2.14285714em; list-style-type: none; } .fa-ul > li { position: relative; } .fa-li { position: absolute; left: -2.14285714em; width: 2.14285714em; top: 0.14285714em; text-align: center; } .fa-li.fa-lg { left: -1.85714286em; } .fa-border { padding: .2em .25em .15em; border: solid 0.08em #eeeeee; border-radius: .1em; } .fa-pull-left { float: left; } .fa-pull-right { float: right; } .fa.fa-pull-left { margin-right: .3em; } .fa.fa-pull-right { margin-left: .3em; } /* Deprecated as of 4.4.0 */ .pull-right { float: right; } .pull-left { float: left; } .fa.pull-left { margin-right: .3em; } .fa.pull-right { margin-left: .3em; } .fa-spin { -webkit-animation: fa-spin 2s infinite linear; animation: fa-spin 2s infinite linear; } .fa-pulse { -webkit-animation: fa-spin 1s infinite steps(8); animation: fa-spin 1s infinite steps(8); } @-webkit-keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes fa-spin { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } .fa-rotate-90 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .fa-rotate-180 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)"; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .fa-rotate-270 { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)"; -webkit-transform: rotate(270deg); -ms-transform: rotate(270deg); transform: rotate(270deg); } .fa-flip-horizontal { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)"; -webkit-transform: scale(-1, 1); -ms-transform: scale(-1, 1); transform: scale(-1, 1); } .fa-flip-vertical { -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)"; -webkit-transform: scale(1, -1); -ms-transform: scale(1, -1); transform: scale(1, -1); } :root .fa-rotate-90, :root .fa-rotate-180, :root .fa-rotate-270, :root .fa-flip-horizontal, :root .fa-flip-vertical { filter: none; } .fa-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; } .fa-stack-1x, .fa-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; } .fa-stack-1x { line-height: inherit; } .fa-stack-2x { font-size: 2em; } .fa-inverse { color: #ffffff; } /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */ .fa-glass:before { content: "\f000"; } .fa-music:before { content: "\f001"; } .fa-search:before { content: "\f002"; } .fa-envelope-o:before { content: "\f003"; } .fa-heart:before { content: "\f004"; } .fa-star:before { content: "\f005"; } .fa-star-o:before { content: "\f006"; } .fa-user:before { content: "\f007"; } .fa-film:before { content: "\f008"; } .fa-th-large:before { content: "\f009"; } .fa-th:before { content: "\f00a"; } .fa-th-list:before { content: "\f00b"; } .fa-check:before { content: "\f00c"; } .fa-remove:before, .fa-close:before, .fa-times:before { content: "\f00d"; } .fa-search-plus:before { content: "\f00e"; } .fa-search-minus:before { content: "\f010"; } .fa-power-off:before { content: "\f011"; } .fa-signal:before { content: "\f012"; } .fa-gear:before, .fa-cog:before { content: "\f013"; } .fa-trash-o:before { content: "\f014"; } .fa-home:before { content: "\f015"; } .fa-file-o:before { content: "\f016"; } .fa-clock-o:before { content: "\f017"; } .fa-road:before { content: "\f018"; } .fa-download:before { content: "\f019"; } .fa-arrow-circle-o-down:before { content: "\f01a"; } .fa-arrow-circle-o-up:before { content: "\f01b"; } .fa-inbox:before { content: "\f01c"; } .fa-play-circle-o:before { content: "\f01d"; } .fa-rotate-right:before, .fa-repeat:before { content: "\f01e"; } .fa-refresh:before { content: "\f021"; } .fa-list-alt:before { content: "\f022"; } .fa-lock:before { content: "\f023"; } .fa-flag:before { content: "\f024"; } .fa-headphones:before { content: "\f025"; } .fa-volume-off:before { content: "\f026"; } .fa-volume-down:before { content: "\f027"; } .fa-volume-up:before { content: "\f028"; } .fa-qrcode:before { content: "\f029"; } .fa-barcode:before { content: "\f02a"; } .fa-tag:before { content: "\f02b"; } .fa-tags:before { content: "\f02c"; } .fa-book:before { content: "\f02d"; } .fa-bookmark:before { content: "\f02e"; } .fa-print:before { content: "\f02f"; } .fa-camera:before { content: "\f030"; } .fa-font:before { content: "\f031"; } .fa-bold:before { content: "\f032"; } .fa-italic:before { content: "\f033"; } .fa-text-height:before { content: "\f034"; } .fa-text-width:before { content: "\f035"; } .fa-align-left:before { content: "\f036"; } .fa-align-center:before { content: "\f037"; } .fa-align-right:before { content: "\f038"; } .fa-align-justify:before { content: "\f039"; } .fa-list:before { content: "\f03a"; } .fa-dedent:before, .fa-outdent:before { content: "\f03b"; } .fa-indent:before { content: "\f03c"; } .fa-video-camera:before { content: "\f03d"; } .fa-photo:before, .fa-image:before, .fa-picture-o:before { content: "\f03e"; } .fa-pencil:before { content: "\f040"; } .fa-map-marker:before { content: "\f041"; } .fa-adjust:before { content: "\f042"; } .fa-tint:before { content: "\f043"; } .fa-edit:before, .fa-pencil-square-o:before { content: "\f044"; } .fa-share-square-o:before { content: "\f045"; } .fa-check-square-o:before { content: "\f046"; } .fa-arrows:before { content: "\f047"; } .fa-step-backward:before { content: "\f048"; } .fa-fast-backward:before { content: "\f049"; } .fa-backward:before { content: "\f04a"; } .fa-play:before { content: "\f04b"; } .fa-pause:before { content: "\f04c"; } .fa-stop:before { content: "\f04d"; } .fa-forward:before { content: "\f04e"; } .fa-fast-forward:before { content: "\f050"; } .fa-step-forward:before { content: "\f051"; } .fa-eject:before { content: "\f052"; } .fa-chevron-left:before { content: "\f053"; } .fa-chevron-right:before { content: "\f054"; } .fa-plus-circle:before { content: "\f055"; } .fa-minus-circle:before { content: "\f056"; } .fa-times-circle:before { content: "\f057"; } .fa-check-circle:before { content: "\f058"; } .fa-question-circle:before { content: "\f059"; } .fa-info-circle:before { content: "\f05a"; } .fa-crosshairs:before { content: "\f05b"; } .fa-times-circle-o:before { content: "\f05c"; } .fa-check-circle-o:before { content: "\f05d"; } .fa-ban:before { content: "\f05e"; } .fa-arrow-left:before { content: "\f060"; } .fa-arrow-right:before { content: "\f061"; } .fa-arrow-up:before { content: "\f062"; } .fa-arrow-down:before { content: "\f063"; } .fa-mail-forward:before, .fa-share:before { content: "\f064"; } .fa-expand:before { content: "\f065"; } .fa-compress:before { content: "\f066"; } .fa-plus:before { content: "\f067"; } .fa-minus:before { content: "\f068"; } .fa-asterisk:before { content: "\f069"; } .fa-exclamation-circle:before { content: "\f06a"; } .fa-gift:before { content: "\f06b"; } .fa-leaf:before { content: "\f06c"; } .fa-fire:before { content: "\f06d"; } .fa-eye:before { content: "\f06e"; } .fa-eye-slash:before { content: "\f070"; } .fa-warning:before, .fa-exclamation-triangle:before { content: "\f071"; } .fa-plane:before { content: "\f072"; } .fa-calendar:before { content: "\f073"; } .fa-random:before { content: "\f074"; } .fa-comment:before { content: "\f075"; } .fa-magnet:before { content: "\f076"; } .fa-chevron-up:before { content: "\f077"; } .fa-chevron-down:before { content: "\f078"; } .fa-retweet:before { content: "\f079"; } .fa-shopping-cart:before { content: "\f07a"; } .fa-folder:before { content: "\f07b"; } .fa-folder-open:before { content: "\f07c"; } .fa-arrows-v:before { content: "\f07d"; } .fa-arrows-h:before { content: "\f07e"; } .fa-bar-chart-o:before, .fa-bar-chart:before { content: "\f080"; } .fa-twitter-square:before { content: "\f081"; } .fa-facebook-square:before { content: "\f082"; } .fa-camera-retro:before { content: "\f083"; } .fa-key:before { content: "\f084"; } .fa-gears:before, .fa-cogs:before { content: "\f085"; } .fa-comments:before { content: "\f086"; } .fa-thumbs-o-up:before { content: "\f087"; } .fa-thumbs-o-down:before { content: "\f088"; } .fa-star-half:before { content: "\f089"; } .fa-heart-o:before { content: "\f08a"; } .fa-sign-out:before { content: "\f08b"; } .fa-linkedin-square:before { content: "\f08c"; } .fa-thumb-tack:before { content: "\f08d"; } .fa-external-link:before { content: "\f08e"; } .fa-sign-in:before { content: "\f090"; } .fa-trophy:before { content: "\f091"; } .fa-github-square:before { content: "\f092"; } .fa-upload:before { content: "\f093"; } .fa-lemon-o:before { content: "\f094"; } .fa-phone:before { content: "\f095"; } .fa-square-o:before { content: "\f096"; } .fa-bookmark-o:before { content: "\f097"; } .fa-phone-square:before { content: "\f098"; } .fa-twitter:before { content: "\f099"; } .fa-facebook-f:before, .fa-facebook:before { content: "\f09a"; } .fa-github:before { content: "\f09b"; } .fa-unlock:before { content: "\f09c"; } .fa-credit-card:before { content: "\f09d"; } .fa-feed:before, .fa-rss:before { content: "\f09e"; } .fa-hdd-o:before { content: "\f0a0"; } .fa-bullhorn:before { content: "\f0a1"; } .fa-bell:before { content: "\f0f3"; } .fa-certificate:before { content: "\f0a3"; } .fa-hand-o-right:before { content: "\f0a4"; } .fa-hand-o-left:before { content: "\f0a5"; } .fa-hand-o-up:before { content: "\f0a6"; } .fa-hand-o-down:before { content: "\f0a7"; } .fa-arrow-circle-left:before { content: "\f0a8"; } .fa-arrow-circle-right:before { content: "\f0a9"; } .fa-arrow-circle-up:before { content: "\f0aa"; } .fa-arrow-circle-down:before { content: "\f0ab"; } .fa-globe:before { content: "\f0ac"; } .fa-wrench:before { content: "\f0ad"; } .fa-tasks:before { content: "\f0ae"; } .fa-filter:before { content: "\f0b0"; } .fa-briefcase:before { content: "\f0b1"; } .fa-arrows-alt:before { content: "\f0b2"; } .fa-group:before, .fa-users:before { content: "\f0c0"; } .fa-chain:before, .fa-link:before { content: "\f0c1"; } .fa-cloud:before { content: "\f0c2"; } .fa-flask:before { content: "\f0c3"; } .fa-cut:before, .fa-scissors:before { content: "\f0c4"; } .fa-copy:before, .fa-files-o:before { content: "\f0c5"; } .fa-paperclip:before { content: "\f0c6"; } .fa-save:before, .fa-floppy-o:before { content: "\f0c7"; } .fa-square:before { content: "\f0c8"; } .fa-navicon:before, .fa-reorder:before, .fa-bars:before { content: "\f0c9"; } .fa-list-ul:before { content: "\f0ca"; } .fa-list-ol:before { content: "\f0cb"; } .fa-strikethrough:before { content: "\f0cc"; } .fa-underline:before { content: "\f0cd"; } .fa-table:before { content: "\f0ce"; } .fa-magic:before { content: "\f0d0"; } .fa-truck:before { content: "\f0d1"; } .fa-pinterest:before { content: "\f0d2"; } .fa-pinterest-square:before { content: "\f0d3"; } .fa-google-plus-square:before { content: "\f0d4"; } .fa-google-plus:before { content: "\f0d5"; } .fa-money:before { content: "\f0d6"; } .fa-caret-down:before { content: "\f0d7"; } .fa-caret-up:before { content: "\f0d8"; } .fa-caret-left:before { content: "\f0d9"; } .fa-caret-right:before { content: "\f0da"; } .fa-columns:before { content: "\f0db"; } .fa-unsorted:before, .fa-sort:before { content: "\f0dc"; } .fa-sort-down:before, .fa-sort-desc:before { content: "\f0dd"; } .fa-sort-up:before, .fa-sort-asc:before { content: "\f0de"; } .fa-envelope:before { content: "\f0e0"; } .fa-linkedin:before { content: "\f0e1"; } .fa-rotate-left:before, .fa-undo:before { content: "\f0e2"; } .fa-legal:before, .fa-gavel:before { content: "\f0e3"; } .fa-dashboard:before, .fa-tachometer:before { content: "\f0e4"; } .fa-comment-o:before { content: "\f0e5"; } .fa-comments-o:before { content: "\f0e6"; } .fa-flash:before, .fa-bolt:before { content: "\f0e7"; } .fa-sitemap:before { content: "\f0e8"; } .fa-umbrella:before { content: "\f0e9"; } .fa-paste:before, .fa-clipboard:before { content: "\f0ea"; } .fa-lightbulb-o:before { content: "\f0eb"; } .fa-exchange:before { content: "\f0ec"; } .fa-cloud-download:before { content: "\f0ed"; } .fa-cloud-upload:before { content: "\f0ee"; } .fa-user-md:before { content: "\f0f0"; } .fa-stethoscope:before { content: "\f0f1"; } .fa-suitcase:before { content: "\f0f2"; } .fa-bell-o:before { content: "\f0a2"; } .fa-coffee:before { content: "\f0f4"; } .fa-cutlery:before { content: "\f0f5"; } .fa-file-text-o:before { content: "\f0f6"; } .fa-building-o:before { content: "\f0f7"; } .fa-hospital-o:before { content: "\f0f8"; } .fa-ambulance:before { content: "\f0f9"; } .fa-medkit:before { content: "\f0fa"; } .fa-fighter-jet:before { content: "\f0fb"; } .fa-beer:before { content: "\f0fc"; } .fa-h-square:before { content: "\f0fd"; } .fa-plus-square:before { content: "\f0fe"; } .fa-angle-double-left:before { content: "\f100"; } .fa-angle-double-right:before { content: "\f101"; } .fa-angle-double-up:before { content: "\f102"; } .fa-angle-double-down:before { content: "\f103"; } .fa-angle-left:before { content: "\f104"; } .fa-angle-right:before { content: "\f105"; } .fa-angle-up:before { content: "\f106"; } .fa-angle-down:before { content: "\f107"; } .fa-desktop:before { content: "\f108"; } .fa-laptop:before { content: "\f109"; } .fa-tablet:before { content: "\f10a"; } .fa-mobile-phone:before, .fa-mobile:before { content: "\f10b"; } .fa-circle-o:before { content: "\f10c"; } .fa-quote-left:before { content: "\f10d"; } .fa-quote-right:before { content: "\f10e"; } .fa-spinner:before { content: "\f110"; } .fa-circle:before { content: "\f111"; } .fa-mail-reply:before, .fa-reply:before { content: "\f112"; } .fa-github-alt:before { content: "\f113"; } .fa-folder-o:before { content: "\f114"; } .fa-folder-open-o:before { content: "\f115"; } .fa-smile-o:before { content: "\f118"; } .fa-frown-o:before { content: "\f119"; } .fa-meh-o:before { content: "\f11a"; } .fa-gamepad:before { content: "\f11b"; } .fa-keyboard-o:before { content: "\f11c"; } .fa-flag-o:before { content: "\f11d"; } .fa-flag-checkered:before { content: "\f11e"; } .fa-terminal:before { content: "\f120"; } .fa-code:before { content: "\f121"; } .fa-mail-reply-all:before, .fa-reply-all:before { content: "\f122"; } .fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before { content: "\f123"; } .fa-location-arrow:before { content: "\f124"; } .fa-crop:before { content: "\f125"; } .fa-code-fork:before { content: "\f126"; } .fa-unlink:before, .fa-chain-broken:before { content: "\f127"; } .fa-question:before { content: "\f128"; } .fa-info:before { content: "\f129"; } .fa-exclamation:before { content: "\f12a"; } .fa-superscript:before { content: "\f12b"; } .fa-subscript:before { content: "\f12c"; } .fa-eraser:before { content: "\f12d"; } .fa-puzzle-piece:before { content: "\f12e"; } .fa-microphone:before { content: "\f130"; } .fa-microphone-slash:before { content: "\f131"; } .fa-shield:before { content: "\f132"; } .fa-calendar-o:before { content: "\f133"; } .fa-fire-extinguisher:before { content: "\f134"; } .fa-rocket:before { content: "\f135"; } .fa-maxcdn:before { content: "\f136"; } .fa-chevron-circle-left:before { content: "\f137"; } .fa-chevron-circle-right:before { content: "\f138"; } .fa-chevron-circle-up:before { content: "\f139"; } .fa-chevron-circle-down:before { content: "\f13a"; } .fa-html5:before { content: "\f13b"; } .fa-css3:before { content: "\f13c"; } .fa-anchor:before { content: "\f13d"; } .fa-unlock-alt:before { content: "\f13e"; } .fa-bullseye:before { content: "\f140"; } .fa-ellipsis-h:before { content: "\f141"; } .fa-ellipsis-v:before { content: "\f142"; } .fa-rss-square:before { content: "\f143"; } .fa-play-circle:before { content: "\f144"; } .fa-ticket:before { content: "\f145"; } .fa-minus-square:before { content: "\f146"; } .fa-minus-square-o:before { content: "\f147"; } .fa-level-up:before { content: "\f148"; } .fa-level-down:before { content: "\f149"; } .fa-check-square:before { content: "\f14a"; } .fa-pencil-square:before { content: "\f14b"; } .fa-external-link-square:before { content: "\f14c"; } .fa-share-square:before { content: "\f14d"; } .fa-compass:before { content: "\f14e"; } .fa-toggle-down:before, .fa-caret-square-o-down:before { content: "\f150"; } .fa-toggle-up:before, .fa-caret-square-o-up:before { content: "\f151"; } .fa-toggle-right:before, .fa-caret-square-o-right:before { content: "\f152"; } .fa-euro:before, .fa-eur:before { content: "\f153"; } .fa-gbp:before { content: "\f154"; } .fa-dollar:before, .fa-usd:before { content: "\f155"; } .fa-rupee:before, .fa-inr:before { content: "\f156"; } .fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before { content: "\f157"; } .fa-ruble:before, .fa-rouble:before, .fa-rub:before { content: "\f158"; } .fa-won:before, .fa-krw:before { content: "\f159"; } .fa-bitcoin:before, .fa-btc:before { content: "\f15a"; } .fa-file:before { content: "\f15b"; } .fa-file-text:before { content: "\f15c"; } .fa-sort-alpha-asc:before { content: "\f15d"; } .fa-sort-alpha-desc:before { content: "\f15e"; } .fa-sort-amount-asc:before { content: "\f160"; } .fa-sort-amount-desc:before { content: "\f161"; } .fa-sort-numeric-asc:before { content: "\f162"; } .fa-sort-numeric-desc:before { content: "\f163"; } .fa-thumbs-up:before { content: "\f164"; } .fa-thumbs-down:before { content: "\f165"; } .fa-youtube-square:before { content: "\f166"; } .fa-youtube:before { content: "\f167"; } .fa-xing:before { content: "\f168"; } .fa-xing-square:before { content: "\f169"; } .fa-youtube-play:before { content: "\f16a"; } .fa-dropbox:before { content: "\f16b"; } .fa-stack-overflow:before { content: "\f16c"; } .fa-instagram:before { content: "\f16d"; } .fa-flickr:before { content: "\f16e"; } .fa-adn:before { content: "\f170"; } .fa-bitbucket:before { content: "\f171"; } .fa-bitbucket-square:before { content: "\f172"; } .fa-tumblr:before { content: "\f173"; } .fa-tumblr-square:before { content: "\f174"; } .fa-long-arrow-down:before { content: "\f175"; } .fa-long-arrow-up:before { content: "\f176"; } .fa-long-arrow-left:before { content: "\f177"; } .fa-long-arrow-right:before { content: "\f178"; } .fa-apple:before { content: "\f179"; } .fa-windows:before { content: "\f17a"; } .fa-android:before { content: "\f17b"; } .fa-linux:before { content: "\f17c"; } .fa-dribbble:before { content: "\f17d"; } .fa-skype:before { content: "\f17e"; } .fa-foursquare:before { content: "\f180"; } .fa-trello:before { content: "\f181"; } .fa-female:before { content: "\f182"; } .fa-male:before { content: "\f183"; } .fa-gittip:before, .fa-gratipay:before { content: "\f184"; } .fa-sun-o:before { content: "\f185"; } .fa-moon-o:before { content: "\f186"; } .fa-archive:before { content: "\f187"; } .fa-bug:before { content: "\f188"; } .fa-vk:before { content: "\f189"; } .fa-weibo:before { content: "\f18a"; } .fa-renren:before { content: "\f18b"; } .fa-pagelines:before { content: "\f18c"; } .fa-stack-exchange:before { content: "\f18d"; } .fa-arrow-circle-o-right:before { content: "\f18e"; } .fa-arrow-circle-o-left:before { content: "\f190"; } .fa-toggle-left:before, .fa-caret-square-o-left:before { content: "\f191"; } .fa-dot-circle-o:before { content: "\f192"; } .fa-wheelchair:before { content: "\f193"; } .fa-vimeo-square:before { content: "\f194"; } .fa-turkish-lira:before, .fa-try:before { content: "\f195"; } .fa-plus-square-o:before { content: "\f196"; } .fa-space-shuttle:before { content: "\f197"; } .fa-slack:before { content: "\f198"; } .fa-envelope-square:before { content: "\f199"; } .fa-wordpress:before { content: "\f19a"; } .fa-openid:before { content: "\f19b"; } .fa-institution:before, .fa-bank:before, .fa-university:before { content: "\f19c"; } .fa-mortar-board:before, .fa-graduation-cap:before { content: "\f19d"; } .fa-yahoo:before { content: "\f19e"; } .fa-google:before { content: "\f1a0"; } .fa-reddit:before { content: "\f1a1"; } .fa-reddit-square:before { content: "\f1a2"; } .fa-stumbleupon-circle:before { content: "\f1a3"; } .fa-stumbleupon:before { content: "\f1a4"; } .fa-delicious:before { content: "\f1a5"; } .fa-digg:before { content: "\f1a6"; } .fa-pied-piper-pp:before { content: "\f1a7"; } .fa-pied-piper-alt:before { content: "\f1a8"; } .fa-drupal:before { content: "\f1a9"; } .fa-joomla:before { content: "\f1aa"; } .fa-language:before { content: "\f1ab"; } .fa-fax:before { content: "\f1ac"; } .fa-building:before { content: "\f1ad"; } .fa-child:before { content: "\f1ae"; } .fa-paw:before { content: "\f1b0"; } .fa-spoon:before { content: "\f1b1"; } .fa-cube:before { content: "\f1b2"; } .fa-cubes:before { content: "\f1b3"; } .fa-behance:before { content: "\f1b4"; } .fa-behance-square:before { content: "\f1b5"; } .fa-steam:before { content: "\f1b6"; } .fa-steam-square:before { content: "\f1b7"; } .fa-recycle:before { content: "\f1b8"; } .fa-automobile:before, .fa-car:before { content: "\f1b9"; } .fa-cab:before, .fa-taxi:before { content: "\f1ba"; } .fa-tree:before { content: "\f1bb"; } .fa-spotify:before { content: "\f1bc"; } .fa-deviantart:before { content: "\f1bd"; } .fa-soundcloud:before { content: "\f1be"; } .fa-database:before { content: "\f1c0"; } .fa-file-pdf-o:before { content: "\f1c1"; } .fa-file-word-o:before { content: "\f1c2"; } .fa-file-excel-o:before { content: "\f1c3"; } .fa-file-powerpoint-o:before { content: "\f1c4"; } .fa-file-photo-o:before, .fa-file-picture-o:before, .fa-file-image-o:before { content: "\f1c5"; } .fa-file-zip-o:before, .fa-file-archive-o:before { content: "\f1c6"; } .fa-file-sound-o:before, .fa-file-audio-o:before { content: "\f1c7"; } .fa-file-movie-o:before, .fa-file-video-o:before { content: "\f1c8"; } .fa-file-code-o:before { content: "\f1c9"; } .fa-vine:before { content: "\f1ca"; } .fa-codepen:before { content: "\f1cb"; } .fa-jsfiddle:before { content: "\f1cc"; } .fa-life-bouy:before, .fa-life-buoy:before, .fa-life-saver:before, .fa-support:before, .fa-life-ring:before { content: "\f1cd"; } .fa-circle-o-notch:before { content: "\f1ce"; } .fa-ra:before, .fa-resistance:before, .fa-rebel:before { content: "\f1d0"; } .fa-ge:before, .fa-empire:before { content: "\f1d1"; } .fa-git-square:before { content: "\f1d2"; } .fa-git:before { content: "\f1d3"; } .fa-y-combinator-square:before, .fa-yc-square:before, .fa-hacker-news:before { content: "\f1d4"; } .fa-tencent-weibo:before { content: "\f1d5"; } .fa-qq:before { content: "\f1d6"; } .fa-wechat:before, .fa-weixin:before { content: "\f1d7"; } .fa-send:before, .fa-paper-plane:before { content: "\f1d8"; } .fa-send-o:before, .fa-paper-plane-o:before { content: "\f1d9"; } .fa-history:before { content: "\f1da"; } .fa-circle-thin:before { content: "\f1db"; } .fa-header:before { content: "\f1dc"; } .fa-paragraph:before { content: "\f1dd"; } .fa-sliders:before { content: "\f1de"; } .fa-share-alt:before { content: "\f1e0"; } .fa-share-alt-square:before { content: "\f1e1"; } .fa-bomb:before { content: "\f1e2"; } .fa-soccer-ball-o:before, .fa-futbol-o:before { content: "\f1e3"; } .fa-tty:before { content: "\f1e4"; } .fa-binoculars:before { content: "\f1e5"; } .fa-plug:before { content: "\f1e6"; } .fa-slideshare:before { content: "\f1e7"; } .fa-twitch:before { content: "\f1e8"; } .fa-yelp:before { content: "\f1e9"; } .fa-newspaper-o:before { content: "\f1ea"; } .fa-wifi:before { content: "\f1eb"; } .fa-calculator:before { content: "\f1ec"; } .fa-paypal:before { content: "\f1ed"; } .fa-google-wallet:before { content: "\f1ee"; } .fa-cc-visa:before { content: "\f1f0"; } .fa-cc-mastercard:before { content: "\f1f1"; } .fa-cc-discover:before { content: "\f1f2"; } .fa-cc-amex:before { content: "\f1f3"; } .fa-cc-paypal:before { content: "\f1f4"; } .fa-cc-stripe:before { content: "\f1f5"; } .fa-bell-slash:before { content: "\f1f6"; } .fa-bell-slash-o:before { content: "\f1f7"; } .fa-trash:before { content: "\f1f8"; } .fa-copyright:before { content: "\f1f9"; } .fa-at:before { content: "\f1fa"; } .fa-eyedropper:before { content: "\f1fb"; } .fa-paint-brush:before { content: "\f1fc"; } .fa-birthday-cake:before { content: "\f1fd"; } .fa-area-chart:before { content: "\f1fe"; } .fa-pie-chart:before { content: "\f200"; } .fa-line-chart:before { content: "\f201"; } .fa-lastfm:before { content: "\f202"; } .fa-lastfm-square:before { content: "\f203"; } .fa-toggle-off:before { content: "\f204"; } .fa-toggle-on:before { content: "\f205"; } .fa-bicycle:before { content: "\f206"; } .fa-bus:before { content: "\f207"; } .fa-ioxhost:before { content: "\f208"; } .fa-angellist:before { content: "\f209"; } .fa-cc:before { content: "\f20a"; } .fa-shekel:before, .fa-sheqel:before, .fa-ils:before { content: "\f20b"; } .fa-meanpath:before { content: "\f20c"; } .fa-buysellads:before { content: "\f20d"; } .fa-connectdevelop:before { content: "\f20e"; } .fa-dashcube:before { content: "\f210"; } .fa-forumbee:before { content: "\f211"; } .fa-leanpub:before { content: "\f212"; } .fa-sellsy:before { content: "\f213"; } .fa-shirtsinbulk:before { content: "\f214"; } .fa-simplybuilt:before { content: "\f215"; } .fa-skyatlas:before { content: "\f216"; } .fa-cart-plus:before { content: "\f217"; } .fa-cart-arrow-down:before { content: "\f218"; } .fa-diamond:before { content: "\f219"; } .fa-ship:before { content: "\f21a"; } .fa-user-secret:before { content: "\f21b"; } .fa-motorcycle:before { content: "\f21c"; } .fa-street-view:before { content: "\f21d"; } .fa-heartbeat:before { content: "\f21e"; } .fa-venus:before { content: "\f221"; } .fa-mars:before { content: "\f222"; } .fa-mercury:before { content: "\f223"; } .fa-intersex:before, .fa-transgender:before { content: "\f224"; } .fa-transgender-alt:before { content: "\f225"; } .fa-venus-double:before { content: "\f226"; } .fa-mars-double:before { content: "\f227"; } .fa-venus-mars:before { content: "\f228"; } .fa-mars-stroke:before { content: "\f229"; } .fa-mars-stroke-v:before { content: "\f22a"; } .fa-mars-stroke-h:before { content: "\f22b"; } .fa-neuter:before { content: "\f22c"; } .fa-genderless:before { content: "\f22d"; } .fa-facebook-official:before { content: "\f230"; } .fa-pinterest-p:before { content: "\f231"; } .fa-whatsapp:before { content: "\f232"; } .fa-server:before { content: "\f233"; } .fa-user-plus:before { content: "\f234"; } .fa-user-times:before { content: "\f235"; } .fa-hotel:before, .fa-bed:before { content: "\f236"; } .fa-viacoin:before { content: "\f237"; } .fa-train:before { content: "\f238"; } .fa-subway:before { content: "\f239"; } .fa-medium:before { content: "\f23a"; } .fa-yc:before, .fa-y-combinator:before { content: "\f23b"; } .fa-optin-monster:before { content: "\f23c"; } .fa-opencart:before { content: "\f23d"; } .fa-expeditedssl:before { content: "\f23e"; } .fa-battery-4:before, .fa-battery-full:before { content: "\f240"; } .fa-battery-3:before, .fa-battery-three-quarters:before { content: "\f241"; } .fa-battery-2:before, .fa-battery-half:before { content: "\f242"; } .fa-battery-1:before, .fa-battery-quarter:before { content: "\f243"; } .fa-battery-0:before, .fa-battery-empty:before { content: "\f244"; } .fa-mouse-pointer:before { content: "\f245"; } .fa-i-cursor:before { content: "\f246"; } .fa-object-group:before { content: "\f247"; } .fa-object-ungroup:before { content: "\f248"; } .fa-sticky-note:before { content: "\f249"; } .fa-sticky-note-o:before { content: "\f24a"; } .fa-cc-jcb:before { content: "\f24b"; } .fa-cc-diners-club:before { content: "\f24c"; } .fa-clone:before { content: "\f24d"; } .fa-balance-scale:before { content: "\f24e"; } .fa-hourglass-o:before { content: "\f250"; } .fa-hourglass-1:before, .fa-hourglass-start:before { content: "\f251"; } .fa-hourglass-2:before, .fa-hourglass-half:before { content: "\f252"; } .fa-hourglass-3:before, .fa-hourglass-end:before { content: "\f253"; } .fa-hourglass:before { content: "\f254"; } .fa-hand-grab-o:before, .fa-hand-rock-o:before { content: "\f255"; } .fa-hand-stop-o:before, .fa-hand-paper-o:before { content: "\f256"; } .fa-hand-scissors-o:before { content: "\f257"; } .fa-hand-lizard-o:before { content: "\f258"; } .fa-hand-spock-o:before { content: "\f259"; } .fa-hand-pointer-o:before { content: "\f25a"; } .fa-hand-peace-o:before { content: "\f25b"; } .fa-trademark:before { content: "\f25c"; } .fa-registered:before { content: "\f25d"; } .fa-creative-commons:before { content: "\f25e"; } .fa-gg:before { content: "\f260"; } .fa-gg-circle:before { content: "\f261"; } .fa-tripadvisor:before { content: "\f262"; } .fa-odnoklassniki:before { content: "\f263"; } .fa-odnoklassniki-square:before { content: "\f264"; } .fa-get-pocket:before { content: "\f265"; } .fa-wikipedia-w:before { content: "\f266"; } .fa-safari:before { content: "\f267"; } .fa-chrome:before { content: "\f268"; } .fa-firefox:before { content: "\f269"; } .fa-opera:before { content: "\f26a"; } .fa-internet-explorer:before { content: "\f26b"; } .fa-tv:before, .fa-television:before { content: "\f26c"; } .fa-contao:before { content: "\f26d"; } .fa-500px:before { content: "\f26e"; } .fa-amazon:before { content: "\f270"; } .fa-calendar-plus-o:before { content: "\f271"; } .fa-calendar-minus-o:before { content: "\f272"; } .fa-calendar-times-o:before { content: "\f273"; } .fa-calendar-check-o:before { content: "\f274"; } .fa-industry:before { content: "\f275"; } .fa-map-pin:before { content: "\f276"; } .fa-map-signs:before { content: "\f277"; } .fa-map-o:before { content: "\f278"; } .fa-map:before { content: "\f279"; } .fa-commenting:before { content: "\f27a"; } .fa-commenting-o:before { content: "\f27b"; } .fa-houzz:before { content: "\f27c"; } .fa-vimeo:before { content: "\f27d"; } .fa-black-tie:before { content: "\f27e"; } .fa-fonticons:before { content: "\f280"; } .fa-reddit-alien:before { content: "\f281"; } .fa-edge:before { content: "\f282"; } .fa-credit-card-alt:before { content: "\f283"; } .fa-codiepie:before { content: "\f284"; } .fa-modx:before { content: "\f285"; } .fa-fort-awesome:before { content: "\f286"; } .fa-usb:before { content: "\f287"; } .fa-product-hunt:before { content: "\f288"; } .fa-mixcloud:before { content: "\f289"; } .fa-scribd:before { content: "\f28a"; } .fa-pause-circle:before { content: "\f28b"; } .fa-pause-circle-o:before { content: "\f28c"; } .fa-stop-circle:before { content: "\f28d"; } .fa-stop-circle-o:before { content: "\f28e"; } .fa-shopping-bag:before { content: "\f290"; } .fa-shopping-basket:before { content: "\f291"; } .fa-hashtag:before { content: "\f292"; } .fa-bluetooth:before { content: "\f293"; } .fa-bluetooth-b:before { content: "\f294"; } .fa-percent:before { content: "\f295"; } .fa-gitlab:before { content: "\f296"; } .fa-wpbeginner:before { content: "\f297"; } .fa-wpforms:before { content: "\f298"; } .fa-envira:before { content: "\f299"; } .fa-universal-access:before { content: "\f29a"; } .fa-wheelchair-alt:before { content: "\f29b"; } .fa-question-circle-o:before { content: "\f29c"; } .fa-blind:before { content: "\f29d"; } .fa-audio-description:before { content: "\f29e"; } .fa-volume-control-phone:before { content: "\f2a0"; } .fa-braille:before { content: "\f2a1"; } .fa-assistive-listening-systems:before { content: "\f2a2"; } .fa-asl-interpreting:before, .fa-american-sign-language-interpreting:before { content: "\f2a3"; } .fa-deafness:before, .fa-hard-of-hearing:before, .fa-deaf:before { content: "\f2a4"; } .fa-glide:before { content: "\f2a5"; } .fa-glide-g:before { content: "\f2a6"; } .fa-signing:before, .fa-sign-language:before { content: "\f2a7"; } .fa-low-vision:before { content: "\f2a8"; } .fa-viadeo:before { content: "\f2a9"; } .fa-viadeo-square:before { content: "\f2aa"; } .fa-snapchat:before { content: "\f2ab"; } .fa-snapchat-ghost:before { content: "\f2ac"; } .fa-snapchat-square:before { content: "\f2ad"; } .fa-pied-piper:before { content: "\f2ae"; } .fa-first-order:before { content: "\f2b0"; } .fa-yoast:before { content: "\f2b1"; } .fa-themeisle:before { content: "\f2b2"; } .fa-google-plus-circle:before, .fa-google-plus-official:before { content: "\f2b3"; } .fa-fa:before, .fa-font-awesome:before { content: "\f2b4"; } .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } .sr-only-focusable:active, .sr-only-focusable:focus { position: static; width: auto; height: auto; margin: 0; overflow: visible; clip: auto; } .home-product .btn-de a { float: left; padding: 5px 15px; color: white; background-color:#4699ff; border-radius: 3px; margin-left: 10px; margin-top:5px; font-size:.85em; margin-right: 50px; } .home-product .btn-de a:hover { background-color:#dd3900; } .home-product .codep span { font-size: 13px; font-weight: 400; } .h-page-right { background: url(/Templates/TienPhatAuto/Content/images/bg_h_page_right.png); width: 27px; height: 44px; float: left; } .home-header { width: 100%; padding: 10px 0px; background-color: #05ccde; text-align: center; border-radius: 10px 0 10px 0; } .home-header span { color: white; text-transform: uppercase; font-size: 1.3em; } #tabs #tabs-2 .items { float: left; width: 222px; height: 189px; margin: 7px; text-align: left; text-align: justify; } #tabs #tabs-2 .items:hover span { text-decoration: underline; } #tabs #tabs-2 .items .name span { font-weight: 700; font-size: 0.8em; text-align: justify; } #tabs #tabs-2 .items .name { margin-bottom: 5px; } #tabs #tabs-2 .items .title-tab { font-size: .7em; line-height: 1.7em; } #tabs #tabs-2 .items .img { float: left; width: 100px; height: 100px; margin-right: 5px; } #tabs #tabs-2 .items .img img { width: 100px; height: 100px; } #tabs #tabs-1 .items, #tabs #tabs-3 .items { float: left; width: 222px; height: 189px; margin: 7px; text-align: center; } #tabs #tabs-1 .items:hover span, #tabs #tabs-3 .items:hover span { color: red; } #tabs #tabs-1 .items .name span, #tabs #tabs-3 .items .name span { font-size: 0.8em; } #tabs #tabs-1 .items .img, #tabs #tabs-3 .items .img { display: table-cell; width: 222px; height: 189px; border-radius: 5px; background-color: white; text-align: center; vertical-align: middle; } #tabs #tabs-1 .items .img img, #tabs #tabs-3 .items .img img { max-width: 222px; max-height: 189px; border-radius: 5px; } .home-product .view-all a { text-transform: uppercase; color: #005eb8; } .home-product .view-all a:hover { text-decoration:underline; } .home-product .view-all { float: right; margin: 12px; } .p-home-pro { float: right; padding: 2px; background-color: white; margin-top: -3px; } .title img { display: inline-block; vertical-align: middle; } .title .t-left { width: 89%; float: left; } .title .t-right { float: right; margin-top: 10px; margin-right: 15px; } .title a:hover span { color: red; } .title { text-align: center; margin-bottom: 30px; } .title span { color: #111; text-transform: capitalize; font-size: 20px; font-weight: 600; padding-bottom: 11px; position: relative; } .title span:after { width: 50px; height: 3px; background: #db0c0b; content: ""; position: absolute; left: 0; right: 0; margin: auto; bottom: 0; } .home-news { float: left; width: 100%; margin-right: 50px; } .last-box { margin-right: 0; float: right; } .home-news:last-child { margin-right: 0; float: right; } .home-news .name { margin: 5px 0; font-weight: 700; color: #005ce6; font-size: 0.9em; } .home-news .image { width: 195px; height: 160px; float: left; margin-right: 10px; } .home-news .headline { font-size: 0.9em; text-align: justify; height: 80px; overflow: hidden; } .home-news .more { font-size: 0.8em; font-weight: 700; text-decoration: underline; margin-top: 10px; color: #005ce6; width: 100px; float: left; } .home-news .more a { color: #005ce6; } .t-hotline .lbl { color: #9a9999; font-size: 1em; text-transform: uppercase; float: left; margin-right: 10px; height: 36px; line-height: 34px; background: url(/Templates/TienPhatAuto/Content/images/icon_t_hotline.png) no-repeat 1px 1px; padding-left: 40px; padding-top: 4px; } .t-hotline { bottom: 5px; right: 19px; position: absolute; } .b-top .hotline { font-size: 16px; font-weight: 500; line-height: 33px; float: right; background: url(/Templates/TienPhatAuto/Content/images/phone.png) no-repeat 0px 19px; margin: 13px 15px; background-size: 16%; padding: 10px 45px; color: #111; } .b-top .email { font-size: 16px; font-weight: 500; line-height: 33px; float: right; background: url(/Templates/TienPhatAuto/Content/images/mail.png) no-repeat 0px 17px; margin: 13px 0px; background-size: 10%; padding: 10px 0px 10px 45px; color: #111; margin-right: 25px; } .b-top .hotline label, .b-top .email label { font-size: 14px; color: #666; margin-bottom: 0; line-height: 17px; } .t-hotline .content { text-transform: uppercase; color: #0b63cd; font-size: 2em; } .copyright { color: #fff; font-weight: 400; background: #db0c0b; text-align: center; border-top: 1px solid #eee; float: left; padding: 15px 0; width: 100%; } .copyright a { color: #fff; text-transform: uppercase; } #mn-top-img { float: left; width: 475px; height: 214px; font-size: 0.85em } .active-contact span, .active-home span { color:yellow; } .menu-top ul li .item-mn-top { color: #fff; font-weight: 500; } .mn-top-img-f .bg-0 a:hover { border-color: #555; box-shadow: 0 1px 25px rgba(0,0,0,.4) inset; } .mn-top-img-f .bg-0 a { width: 100px; padding: 7px 5px; color: white; background-color: #939393; text-align: center; float: left; height: 20px; margin-bottom: 2px; } .mn-top-img-f { float: left; width: 100px; margin: 0; padding: 0; } .mn-top-img .bg-7 a { width: 67px; height: 34px; text-align: center; background: #0cb02b url(/Templates/TienPhatAuto/Content/images/bg_mntop_7.png) no-repeat; background-position: center 8px; padding: 0 10px; padding-top: 55px; float: left; margin-left: 2px; margin-top: 2px; color: white; } .mn-top-img .bg-6 a { width: 86px; height: 39px; padding-top: 50px; text-align: center; background: #008b1a url(/Templates/TienPhatAuto/Content/images/bg_mntop_6.png) no-repeat; background-position: center 10px; float: left; margin-top: 2px; color: white; } .mn-top-img { float: left; width: 175px; margin: 0; padding: 0; margin-right: 2px; } .mn-top-img .bg-5 a { width: 62.9%; height: 35px; text-align: center; background: #0084cc url(/Templates/TienPhatAuto/Content/images/bg_mntop_5.png) no-repeat; background-position: 5px 15px; padding-top: 27px; padding-left: 65px; float: left; color: white; margin-top: 2px; } .mn-top-img .bg-4 a { width: 120px; height: 34px; text-align: center; background: #005ca2 url(/Templates/TienPhatAuto/Content/images/bg_mntop_4.png) no-repeat; background-position: 112px 6px; padding-top: 25px; padding-right: 55px; float: left; color: white; } .mn-top-img .bg-3 a { width: 136px; height: 41px; text-align: center; background: #f69a09 url(/Templates/TienPhatAuto/Content/images/bg_mntop_3.png) no-repeat; background-position: 131px 15px; padding-top: 20px; padding-right: 39px; float: left; color: white; margin-top: 2px; } .mn-top-img .bg-2 a { width: 140px; height: 35px; text-align: center; background: #e84b0d url(/Templates/TienPhatAuto/Content/images/bg_mntop_2.png) no-repeat; background-position: 5px 15px; padding-top: 27px; float: left; padding-left: 35px; color: white; margin-top: 2px; } .mn-top-img .bg-1 a { width: 175px; height: 20px; padding-top: 62px; text-align: center; background: #c51230 url(/Templates/TienPhatAuto/Content/images/bg_mntop_1.png) no-repeat; background-position: center 10px; float: left; color: whitesmoke; padding-bottom: 5px; } .mn-top-img a:hover { border-color: #555; box-shadow: 0 1px 25px rgba(0,0,0,.4) inset; } .menu-top { /*background:url(c:/content/images/header-bg.png) repeat-x;*/ position: relative; } .menu-top ul .li-home img { position: absolute; left: 10px; top: 15px; } header ul.sub-mn-level { display: none; top: 0; left: 100%; border-width: 0 1px 1px; position: absolute; background: #810900; min-width: 198px; z-index: 1000; } .menu-top .icon-hascate { /*background: url(/Templates/TienPhatAuto/Content/images/icon_hascate.png) no-repeat 1px 1px;*/ width: 8px; height: 5px; position: absolute; top: 40%; right: 5px; } .box-top .hot-line { float: left; margin-right: 12px; } .box-top .hot-line .lbl { background: url(/Templates/TienPhatAuto/Content/images/icon_hotline.png) no-repeat 1px 1px; padding-left: 31px; color: #303030; font-weight: 700; float: left; height: 26px; line-height: 25px; margin-right: 5px; } .box-top .hot-line .ctn { color: #303030; font-weight: 700; font-size: 1.1em; line-height: 25px; } .box-top .email { float: left; margin-right: 12px; } .box-top .email .lbl { background: url(/Templates/TienPhatAuto/Content/images/icon_email.png) no-repeat 1px 1px; padding-left: 31px; color: #303030; font-weight: 700; float: left; height: 26px; line-height: 25px; margin-right: 5px; } .box-top .email .ctn { color: #303030; font-weight: 700; font-size: 1.1em; line-height: 24px; } .box-top .cart .ctn { font-size: 0.85em; font-style: italic; } .box-top .cart .lbl { font-size: 1em; font-weight: 700; color: #007eff; text-transform: uppercase; } .box-top .cart { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_cart.png) no-repeat 1px 1px; padding-left: 37px; width: 200px; } .box-top .cart { float: left; background: url(/Templates/TienPhatAuto/Content/images/icon_cart.png) no-repeat 1px 1px; padding-left: 37px; width: 200px; } .box-top { float: left; margin-left: 270px; margin-top: 15px; position: absolute; } .menu-top ul .li-home, .menu-top ul .active-home { /*margin-left: 260px;*/ width: 130px; } .menu-top .menu { float: right; } .menu-top ul { list-style: none; margin: 0; padding: 0; position: relative; width: 100%; float: left; } .menu-top ul li { position: relative; padding: 0; float: left; margin: 16px 19px; } .menu-top ul li a { text-transform: uppercase; text-decoration: none; display: inline-block; font-size: 16px; color: #025157; } .menu-top ul li a:hover { color: #ccc; } .languages li a:hover, .languages .lang-active a { color: white; } .menu-top ul .li-home:hover a, .menu-top ul .active-home a { color: white; } .menu-top ul .li-home:hover, .menu-top ul .active-home { /*background: url(/Templates/TienPhatAuto/Content/images/bg_menu_top_active.png);*/ } .menu-top ul .li-contact { } .menu-top ul .li-contact:hover a, .menu-top ul .active-contact a { /*font-weight: 700;*/ color: white; } .menu-top ul .li-contact:hover, .menu-top ul .active-contact { /*background: url(/Templates/TienPhatAuto/Content/images/bg_menu_top_active.png);*/ color: white; z-index: 1; } .menu-top ul .li:hover .item-mn-top, .menu-top ul .active .item-mn-top { color: #ccc; } .menu-top ul li ul { display: none !important; } .menu-top ul .li:hover, .menu-top ul .active { /*background: url(/Templates/TienPhatAuto/Content/images/bg_menu_top_active.png);*/ z-index: 1000; } .menu-top ul li a img { vertical-align: middle; vertical-align: middle; position: absolute; left: 13px; top: 15px; } header ul.dropdown { display: none; top: 100%; left: 0; position: absolute; background: #fff; min-width: 200px; z-index: 1000; border: 1px solid #eee; } header ul.dropdown li { display: block; float: none; line-height: normal; position: relative; text-align: left; margin: 10px; /*border-bottom: 1px solid white;*/ } header ul.dropdown li:hover { color: red; } header ul.dropdown li:hover > a { color: red; } header ul.dropdown li:last-child { border-bottom: none; } header ul.dropdown li a { color: #111; font-weight: 100; line-height: 1.5; text-transform: none; text-decoration: none; margin-right: 0; display: block; font-size: 14px; } header ul.dropdown li a:hover{ color:red; } #nav { font-size: 13px; } #nav ul.sub-level li .level2 { position: absolute; top: 0; left: 100%; display: none !important; } #nav ul.sub-level li { position: relative; } #nav ul.sub-level li:hover .level2 { display: block !important; } .box-header-s span { line-height: 35px; color: white; text-transform: uppercase; font-weight: 700; } .box-header-s { background: url(/Templates/TienPhatAuto/Content/images/bg_h_menu_r.gif); background-color: #0a1483; text-align: center; font-size: 13px; height: 37px; float: left; width: 100%; } .lp-item { width: 100%; margin-bottom: 20px; text-align: center; height: 220px; float: left; border-bottom: solid 1px #ccc; } .lp-item a { font-weight: 700; color: #0081b8; } .lp-item .img { max-width: 100%; height: 155px; margin-bottom: 10px; text-align: center; vertical-align: middle; } .lp-item .img img { max-width: 100%; max-height: 100%; } .lp-item .name { text-align: center; margin-top: 10px; font-weight: 700; font-size: 0.8em; color: #005896; } .box .items-pay { float: left; width: 217px; height: 70px; padding: 2px; margin: 3px; background-color: white; border: solid 1px #e5e5e5; } .box .items-pay .img { width: 217px; height: 70px; display: table-cell; vertical-align: middle; text-align: center; } .box .items-pay .img img { max-width: 217px; max-height: 70px; } .box-menu { float: left; width: 100%; background-color: #f9f8f8; border-radius: 0 0 5px 5px; } .box-menu .box-menu-content { float: left; width: 99.5%; } .box-menu .box-menu-header span { color: white; text-transform: uppercase; font-size: 1em; } .box-menu .box-menu-header { width: 100%; padding: 13px 0px; background-color: #062037; text-align: center; /*background: url(/Templates/TienPhatAuto/Content/images/bg_h_menu_r.png);border-radius: 10px 0 10px 0;*/ } .box-content-mn .item-l-news { width: 100%; float: left; margin-bottom: 10px; padding-bottom: 10px; border-bottom: dotted 1px #747474; } .box-content .project-item { width: 195px; height: 165px; margin-left: 15px; background-color: white; overflow: hidden; } .box-content .project-item .project-img { width: 195px; height: 133px; margin-top: 10px; } .box-content .project-item .project-name { margin-top: 10px; font-size: 0.85em; } .box-content .project-item .project-img img { width: 195px; height: 133px; } .box-content .name-video { margin-top: 10px; font-size: 0.85em; } #nav ul { margin: 0px; padding: 0px; } #nav li { list-style: none; } #nav li.line-top { border-bottom: dashed 1px white; margin-top: -11px; } ul.top-level { /*background: #6898d0;*/ } ul.top-level li { position: static; /*border: #FF0000 solid; border-width: 1px; border-bottom: 1px solid #90bade;*/ } #nav .item-r { position: relative; } #nav .item-r:after { font-size: 10px; content: "\f054"; font-family: 'FontAwesome'; position: absolute; right: 0; color: #666; top: 12px; } #nav a { display: block; padding: 6px 0; color: black; font-size: 14px; font-weight: 400; margin: 0 10px; border-bottom: 1px solid #eee; } #nav a:hover, #nav a:hover:after { color: #db0c0b; /*padding-left: 3px; border-left: 5px solid #034895;background: url(/Templates/TienPhatAuto/Content/images/icon_menu_cate_hover.png) no-repeat 1px 10px; border-right: 5px solid #034895; background-color: #3FA2DA;*/ } #nav ul.sub-level { display: none; position: absolute; left: 265px; z-index: 9999; background: #fff; margin-top: 0; border: 1px solid #eee; width: 250px; } #nav ul.sub-level li { float: left; width: 250px; } #nav ul.sub-level li:last-child a{ border-bottom:none; } #nav .sub-level { /*background: #6898d0;*/ } .box-content { border: solid 1px #e5e5e6; margin-bottom: 10px; max-height: 508px; overflow-y: auto; overflow-x: hidden; } .box-content::-webkit-scrollbar { width: 4px; height: 4px; background-color: #eee; } .box-content::-webkit-scrollbar-thumb { background: #333; } .box-content-mn { float: left; padding: 10px; margin-bottom: 10px; width: 90%; border: solid 1px #cccccc; } .box { width: 100%; background-color: white; /*border-radius: 10px 0 0 0;margin-top: 10px; border-radius: 5px*/ } .box-header { background-color: #db0c0b; font-size: 16px; width: 100%; height: 55px; } .box-header span { display: block; color: white; font-weight: 600; padding: 16px 10px; text-transform: uppercase; } .box-header span i.fa.fa-caret-down { float: right; margin-top: 5px; } .hot-news .items .date { font-size: .85em; font-style:italic; margin-bottom: 5px; } .box-home-news .header a { color: white; text-transform: uppercase; margin-left: 20px; float: left; margin-top: 15px; background: url(/Templates/TienPhatAuto/Content/images/icon_view_all_news.png) no-repeat 66px 2px; padding-right: 20px; font-size: .8em; text-decoration: underline; } .box-home-news { float: left; width: 100%; } .box-home-news .content .items .s-des span { font-size: 0.85em; text-align: justify; } .box-home-news .content .items .s-des { float: left; width: 120px; height: 38px; margin-bottom: 5px; overflow: hidden; line-height: 1; } .box-home-news .header { width: 100%; background: url(/Templates/TienPhatAuto/Content/images/bg_h_page.png); text-align: left; float: left; height: 44px; } .box-home-news .content .items .d-img { float: left; margin-right: 5px; } .box-home-news .content .items .d-img .img img { max-width: 93px; max-height: 73px; margin: auto; display: table-cell; } .box-home-news .content .items .d-img .img { width: 93px; height: 73px; display: table-cell; vertical-align: middle; text-align: center; border: solid 1px #dedede; } .box-home-news .content .items .name { float: left; width: 120px; height: 30px; margin-bottom: 5px; overflow: hidden; line-height: 1; } .box-home-news .content .items .name a:hover { color: #0081b8; } .box-home-news .content .items .name a { font-weight: 700; font-size: .85em; text-align: justify; display: block; line-height: 15px; } .box-home-news .content .items { float: left; width: 222px; height: 78px; margin: 13px; overflow: hidden; } .box-home-news .content { float: left; padding: 5px 0; border: solid 1px #cacaca; border-top: none; background-color: white; width: 998px; } .box-home-news .header span { color: white; text-transform: uppercase; margin-left: 20px; font-size: 1em; float: left; width: 851px; margin-top: 15px; } .news-list .news-item { width: calc(100%/2 - 30px); float: left; margin: 15px; border: 1px solid #eee; padding: 5px; } .news-list .news-item .div-img { width: 175px; float: left; margin-right: 10px; } .news-list .news-item .img { text-align: center; float: left; margin-right: 20px; } .news-list .news-item img { margin: auto; width: 175px; height: 130px; object-fit: scale-down; } .news-list .news-item .meta { width: calc(100% - 195px); float: left; } .news-list .news-item .name a { color: #333; font-weight: 600; font-size: 15px; } .news-list .news-item .name a:hover { color: #db0c0b; } .news-list .news-item .name { margin-bottom: 10px; } .news-list .news-item .headline { font-size: 14px; color: #666; } .news-detail { margin: 0 10px; } .news-detail .headline { font-weight: 700; display: block; margin-bottom: 10px; } .news-detail .date { font-weight: 100; font-size: 0.8em; font-style: italic; margin-bottom: 10px; } .news-detail .image { text-align: center; max-width: 100%; } /* * Core Owl Carousel CSS File * v1.3.3 */ /* clearfix */ .owl-carousel .owl-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } /* display none until init */ .owl-carousel{ display: none; position: relative; width: 100%; -ms-touch-action: pan-y; } .owl-carousel .owl-wrapper{ display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper-outer{ overflow: hidden; position: relative; width: 100%; } .owl-carousel .owl-wrapper-outer.autoHeight{ -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .owl-carousel .owl-item{ float: left; } .owl-controls .owl-page, .owl-controls .owl-buttons div{ cursor: pointer; } .owl-controls { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* mouse grab icon */ .grabbing { cursor:url(/Templates/TienPhatAuto/Content/grabbing.html) 8 8, move; } /* fix */ .owl-carousel .owl-wrapper, .owl-carousel .owl-item{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); } @media (min-width: 992px) { ul.top-level li i.fa-caret-down { display: none; } #nav ul.top-level li:hover ul.sub-level { display: block; } .pagein .box:hover .box-content { display: block; } } @media (max-width: 1199px) { } @media (max-width: 991px) { .content-wrapper { width: 750px; padding-left: 15px; padding-right: 15px; } .menu-top ul li { margin: 21px 8px; } .menu-top ul li a { font-size: 14px; } .search-box { width: 37%; } .search-box input[type='text'] { width: 100%; border-radius: 0; padding: 10px; } p.hotline { margin: 7px; font-size: 13px; } button#search-button { right: 4px; background: none; color: #111; text-align: right; } .reg-email span { font-size: 14px; } .logofooter { width: 28%; } .box-lkweb { width: 30%; } .box-address { width: 30%; } .product-list .product-item { width: calc(100%/3 - 30px); } } @media (max-width: 767px) { .product-list .product-item { width: calc(100%/2 - 30px); } .breadcrumb li img { display: inline-block; } ul.sub-level.level1 li a { border-bottom: none !important; } .wrapsearch { height: 48px; } .dmsp { z-index: 11111; width: 100%; position: absolute; margin-top: 0; left: 0; } .b-top .email { display: none; } .c-box { width: 100%; padding-right: 0 !important; } section.form.formleft input, section.form.formleft textarea { width: 100%; } section.form.formleft { width: 100%; float: none; clear: both; } .search-box { margin-left: 50px; width: calc(100% - 70px); margin: 0; position: absolute; right: 10px; } p.hotline { display: none; } .box-header { display: none; } span.menumb { background: red; width: 34px; height: 36px; text-align: center; line-height: 31px; color: #fff; font-size: 21px; display: block; position: absolute; top: -42px; left: 15px; } .advgiua { display: none; } .content-wrapper { width: 100%; clear: both; } .home-product { width: 100%; } .box-content { display: none; max-height: initial; position: absolute; top: 0px; background: #fff; width: 100% !important; left: 0; } .banner { width: 100%; } img { display: block; max-width: 100%; height: auto; } .home-product .content .item { } .menu-top .menu { display: none; } .logo { float: none; text-align: center; } .logo img { display: inline-block; } #nav .item-r:after { opacity: 0; } ul.sub-level.level1 { float: left !important; position: relative !important; left: auto !important; margin: 0 !important; width: auto !important; padding-left: 15px !important; } ul.top-level li { position: relative !important; float: left; width: 100%; } ul.top-level li i { position: absolute; right: 0; top: 0; width: 30px; height: 33px; text-align: center; line-height: 33px; } } @media (max-width: 479px) { .news-list .news-item { width: calc(100% - 30px); } .news-list .news-item .img { margin-right: 5px; } .news-list .news-item .img img { width: 100px; } .news-list .news-item .meta { width: calc(100% - 105px); } .news-list .news-item .name { margin-top: 0; line-height: 18px; } .news-list .news-item .headline { font-size: 13px; } .news-list .news-item .name a { font-size: 13px; } .reg-email span { font-size: 13px; } .home-product .view-all a { display: none; } .reg-email form { width: 100%; float: none; } .reg-email form input#btn_Reg { right: 0px; } .box-footer { width: 100% !important; } } /* root element for tabs */ ul.css-tabs { margin: 0 !important; padding: 0; height: 30px; border-bottom: 1px solid #666; } /* single tab */ ul.css-tabs li { float: left; padding: 0; margin: 0; list-style-type: none; } /* link inside the tab. uses a background image */ ul.css-tabs a { float: left; font-size: 13px; display: block; padding: 5px 10px; text-decoration: none; border: 1px solid #666; border-bottom: 0px; height: 18px; background-color: #efefef; color: #777; margin-right: 2px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; position: relative; top: 1px; } ul.css-tabs a:hover { background-color: #F7F7F7; color: #333; } /* selected tab */ ul.css-tabs a.current { background-color: #fff; border-bottom: 2px solid #fff; color: #000; cursor: default; } /* tab pane */ div.css-panes > div { display: none; border: 1px solid #666; border-width: 0 1px 1px 1px; padding: 15px 10px; background-color: #fff; } /* root element for tabs */ ul.css-tab-lang { margin: 0 !important; padding: 0; height: 30px; border-bottom: 1px solid #666; } /* single tab */ ul.css-tab-lang li { float: left; padding: 0; margin: 0; list-style-type: none; } /* link inside the tab. uses a background image */ ul.css-tab-lang a { float: left; font-size: 13px; display: block; padding: 5px 10px; text-decoration: none; border: 1px solid #666; border-bottom: 0px; height: 18px; background-color: #eee; color: #777; margin-right: 2px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; -webkit-border-radius-topleft: 4px 4px; -webkit-border-radius-topright: 4px 4px; border-radius-topleft: 4px; border-radius-topright: 4px; position: relative; top: 1px; } ul.css-tab-lang a:hover { background-color: #F7F7F7; color: #333; } /* selected tab */ ul.css-tab-lang a.current { background-color: #efefef; border-bottom: 2px solid #efefef; color: #000; cursor: default; } /* tab pane */ div.css-pane-lang > div { display: none; border: 1px solid #666; border-width: 0 1px 1px 1px; padding: 15px 10px; background-color: #efefef; }