@charset "UTF-8";
@font-face {
font-family: 'Uni-Sans-Book';
font-weight: 800;
src: url(//bluesound-deutschland.de/wp-content/themes/bluesound/fonts/UniSansHeavy.otf) format("opentype");
}
@font-face {
font-family: 'Uni-Sans-Book';
src: url(//bluesound-deutschland.de/wp-content/themes/bluesound/fonts/UniSansBook.otf) format("opentype");
}
@font-face {
font-family: 'Uni-Sans-Book';
font-weight: bold;
src: url(//bluesound-deutschland.de/wp-content/themes/bluesound/fonts/UniSansBold.otf) format("opentype");
}
.home-hero-container {
opacity: 1 !important;
} .accessible-megamenu li#menu-item-23369 > a {
border-top: 1px solid #999 !important;
border-bottom: none !important;
}
.accessible-megamenu li:first-child .accessible-megamenu-panel > .sub-nav-group > li > a {
border-top: 1px solid #999 !important;
border-bottom: none !important;
} #lighter {
position: fixed;
top: 0; left: 0; bottom: 0; right: 0;
padding: 15px;
background-color: rgba(255,255,255,0.95);
display: none;
}
#mailchimp_popup {
position: relative;
top: 100px;
max-width: 1160px;
margin: 0 auto;
padding: 0 20px;
background-color: #fff;
border: 1px solid #000;
border-radius: 5px;
display: none;
}
#mailchimp_popup .mailchimp_signup {
margin: 30px auto;
}
#close {
position: absolute;
width: 20px;
height: 20px;
top: 40px;
right: 50px;
background-image: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/Close.png);
background-repeat: no-repeat;
background-size: contain;
background-position: top;
cursor: pointer;
}  s {
display: inline-block;
font-size: 2.5rem;
position: relative;
text-decoration: none;
}
s::before {
content: '';
width: 110%;
position: absolute;
right: -5%;
top: 45%;
border-bottom: 3px solid red;
-webkit-transform: skewY(-12deg);
transform: skewY(-12deg);
}
s.associated-products-sale{
font-size: 100%;
}
s.associated-products-sale::before{
border-bottom: 1px solid red;
}
i.cart-icon {
display:inline-block;
width:25px;
height: 16px;
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/Cart.png) no-repeat;
background-size: contain;
}
i.location-icon {
display:inline-block;
width:25px;
height: 16px;
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/location.png) no-repeat;
background-size: contain;
}
i.tick-icon {
display:inline-block;
width: 30px;
height: 25px;
position: relative;
top: 8px;
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) -200px 0;
}
i.dl {
display: block;
padding: 30px;
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/guide-arrow-hd.png) no-repeat center;
background-size: contain;
}
.product_container.flow:hover i.dl {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/guide-arrow-hover-hd.png) no-repeat center;
background-size: contain;
}  *,
*:after,
*:before {
-moz-box-sizing:border-box;
box-sizing:border-box;
-webkit-font-smoothing:antialiased;
font-smoothing:antialiased;
text-rendering:optimizeLegibility;
} html {
font-size:62.5%;
}
body {
font:1.2rem/1.4rem 'Uni-Sans-Book', sans-serif;
color:#23282a;
}
h1 {
color:#23282a;
font:  5rem/5rem 'Uni-Sans-Book', sans-serif;
margin: 0 0 1rem 0;
}
h2 {
color:#23282a;
font:  2.5rem/2.5rem 'Uni-Sans-Book', sans-serif;
margin: 1rem 0;
}
.block {
padding: 1rem;
background: #67686c;
color: white;
font-weight: normal;
max-width: 300px;
}
#callout h2 {
font: 5rem/5rem 'Uni-Sans-Book', sans-serif;
}
h3 {
color:#23282a;
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0 0 1rem 0;
}
h4 {
color:#23282a;
font: 1.6rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0 0 0.5em 0;
}
p {
color:#23282a;
font: 300 1.6rem/2rem 'Uni-Sans-Book', sans-serif;
margin:0 0 1rem 0;
} .clear:before,
.clear:after {
content:' ';
display:table;
clear: both;
}
.clear:after {
clear:both;
}
.clear {
*zoom:1;
}
img {
max-width:100%;
vertical-align:bottom;
}
a {
color:#444;
text-decoration:none;
}
a:hover {
color:#444;
}
a:focus {
outline: thin dotted white;
} div.thecontent a {
text-decoration: underline;
}
div.thecontent a:hover {
}
input:focus {
outline:0;
border:2px solid #04A4CC;
}
.image_container {
width:100%;
background: white;
} .bxslider .slider-text {
z-index: 9999;
text-align: center;
bottom: 20%;
width: 100%;
}
.bxslider .slider-text.left {
text-align: left;
left:5%;
}
.bxslider .slider-text h2 {
font: 3rem/3rem 'Uni-Sans-Book', sans-serif;
color: #fff;
padding:10px;
background: rgba(0,0,0,0.7);
display:inline-block;
}
.bxslider .slider-text p {
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
color: #fff;
padding:10px;
background: rgba(0,0,0,0.7);
display: inline-block;
}
.bxslider .slider-text a {
color:#fff;
}
.slider-text {
visibility:hidden;
}
.slider-text.active-slide {
visibility: visible;
}  .hidden {
position:absolute;
left:-10000px;
top:auto;
width:1px;
height:1px;
}
#content-start {
height:0;
padding:0;
margin:0;
}
html {
max-width:100%;
overflow-x:hidden;
}
body {
max-width: 100%;
overflow-x: hidden;
} .wrapper {
width:100%;
margin:0 auto;
position:relative;
height: 100%;
overflow:hidden;
} .header {
background-color:#23282a;
position: relative;
}
.content {
max-width:1200px;
margin: 0 auto;
padding:10px;
}
header .content {
text-align: center;
padding:0;
}
main {
background-color: #f1f1f1;
}
.halo {
padding:0;
margin:0;
}
.halo ul.lifestyle {
list-style: none;
margin: 0;
padding: 0;
}
.halo ul.lifestyle img {
width: 100%;
}
section#home, section#callout {
padding: 30px 10px;
text-align: center;
} .logo {
float:left;
padding:8px 0;
width:50px;
}
.logo-img {
margin:0 auto;
}
.logo-lg {
display:none;
}
.logo-sm{
display:block;
height: 37px;
width: 33px;
}  .sidebar {
} .footer {
background-color:#23282a;
padding:20px;
}
.footer-subscribers { text-align: center;
}
.footer-mc-caption {
color: white;
display: block;
padding: 20px;
}
#mc_trigger, .footer-bundle-trigger {
min-width: 200px;
padding: 20px 100px;
background: #7A95A7;
color: #fff;
display: flex;
font-size: 1.8rem;
text-transform: uppercase;
align-items: center;
justify-content: space-around;
cursor: pointer;
}
#mc_trigger:hover {
background: #777;
}   .footer-social {
text-align: center;
padding: 20px;
}
.footer-social a {
display: inline-block;
width: 44px;
height: 44px;
margin-right: 5px;
text-indent: -9999px;
}
.footer-social a.facebook {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/facebook-off.png);
}
.footer-social a.facebook:hover {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/facebook-on.png);
}
.footer-social a.twitter {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/twitter-off.png);
}
.footer-social a.twitter:hover {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/twitter-on.png);
}
.footer-social a.insta {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/instagram-off.png);
}
.footer-social a.insta:hover {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/instagram-over.png);
}
.footer-social a.medium {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/medium-off.png) 2px 2px no-repeat;
}
.footer-social a.medium:hover {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/medium-on.png) 2px 2px no-repeat;
}
.footer-menu ul {
list-style-type: none;
margin:0;
padding:0;
background-color: #000;
color:white;
font: 1.4rem/1.4rem 'Uni-Sans-Book', sans-serif;
}
.footer-menu li {
display: block;
padding: 5px 0;
margin: 0 5px;
}
.footer-menu a {
display: block;
padding: 0  30px;
color: white;
text-transform:capitalize;
text-align: center;
text-decoration-style: none;
}
.footer-menu a:hover {
background-color:#23282a;
}
.footer-copyright {
clear: both;
width: 50%;
}
.footer-copyright p {
color:white;
text-align: left;
font-size:1.2rem;
}
.footer-left {
float: left;
width: 50%;
}  #videopage{
max-width: 1071px;
margin: 65px auto;
text-align: center;
}
#videopage h3
{
margin-bottom: 50px;
}
.mcontainer {
max-width: 1071px;
margin: 0 auto;
padding: 0 30px;
}
.llink a {
border: 1px solid #010101;
padding: 15px 20px;
display: inline-block;
vertical-align: top;
font-size: 16px;
margin-top: 15px;
}
section#middlecontent .mcontainer .inner {
width: 100%;
display: inline-block;
margin-bottom: 65px;
}
section#middlecontent .mcontainer .inner .innerdiv:first-child
{
margin-right: 8%;
}
section#middlecontent .mcontainer .inner .innerdiv {
width: 46%;
float: left;
}
section#middlecontent .mcontainer .inner .innerdiv h1
{
margin: 30px 0 20px;
}
section#middlecontent .mcontainer .inner.Yes .innerdiv.Yes:first-child {
margin-right: 0 !important;
}
section#middlecontent .mcontainer .inner.Yes .innerdiv.Yes {
width: 100%;
}
section#middlecontent .mcontainer .inner .innerdiv img {
width: 100%;
}
section#middlecontent {
background: #e8e8e8;
padding: 65px 0 0;
display: inline-block;
width: 100%;
} .prodspagehead {
background-position: center;
background-size: cover !important;
padding: 150px;
min-height: 300px;
}
@media screen and (max-width: 520px) {
.prodspagehead {
padding: 90px 0 !important;
}
}
.prodsheadtitle {
color: #fff;
text-align: center;
}
.prods-product {
width: 33.33%;
float: left;
padding: 20px;
}
@media screen and (max-width: 520px) {
.prods-product {
width: 100% !important;
float: left;
padding: 20px;
margin-bottom: 20px
}
}
.prods-products-title {
color: #000;
margin-bottom: 20px;
margin-top: -10px;
}
.prods-products-title1 {
color: #000;
}
.prods-products-title2 {
color: #777;
}
.prods-products-desc {
font-size: 110%;
}
.prods-buy-now-btn {
display: inline-block;
min-width:120px;
background: #23282a;
color: white;
margin: 20px auto 40px;
padding: 15px;
font-size:1.5rem;
border: none;
text-transform: uppercase;
text-align: center;
}
.prods-buy-now-btn:hover {
background-color: #969696;
color: white;
}
.prods-more-info {
font-size:1.9rem;
padding-left: 30px;
}
@media screen and (max-width: 800px) {
.prods-buy-now-btn {
width: 100% !important;
}
.prods-more-info {
padding-left: 0 !important;
text-align: center;
width: 100%;
}
}
.prods-section {
width: 100%;
height: 560px;
float: left;
background-size: cover !important;
background-position: center !important;
position: relative;
}
@media screen and (max-width: 520px) {
.prods-section {
height: 250px;
background-size: auto 100% !important;
}
}
.prods-section-info {
height: 40%;
background: rgba(255, 255, 255, 0.7);
padding: 20px;
position: absolute;
bottom: 0;
}
@media screen and (max-width: 520px) {
.prods-section-info {
display: none;
}
.prods-section-info-mobile {
padding: 10px;
}
.prods-section-info-title {
font-size: 180% !important;
}
}
@media screen and (min-width: 521px) {
.prods-section-info-mobile {
display: none;
}
}
.prods-section-info-title {
font-weight: 700;
font-size: 300%;
}
@media screen and (min-width: 1590px) {
.prods-section-info {
padding-left: 20%;
}
}
@media screen and (min-width: 1150px) {
.prods-section-info {
width: 50%;
}
}
@media screen and (max-width: 1150px) {
.prods-section-info {
width: 100%;
}
}
.bottomprodscol {
float: left;
height: 510px;
margin: 0px;
padding: 0px 30px;
width: 33%;
}
@media screen and (max-width: 520px) {
.bottomprodscol {
width: 100%;
}
}
.bottomprodscol img {
height: 292px;
}
.bottomproductsnav {
text-align: center;
font-size: 130%;
line-height: 26px;
}
.bottomtoggle {
width: 50%; float: left;
}
@media screen and (max-width: 520px) {
.bottomtoggle {
width: 100%;
margin-bottom: 10px;
}
}  @media screen and (min-width: 1021px) {
.footer-menu {
margin-left: 0px;
}
} #nav1 {
display:none;
}
#nav2-wrapper {
float:right;
width:100px;
}
body.smr-open #nav2-wrapper {
background-color: #000;
}
#nav-trigger {
margin: 0 auto;
padding: 20px 0;
text-align:left;
width: 63px;
}
#nav-trigger span {
color: white;
cursor: pointer;
display: block;
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) 0 2px;
font: 95%/150% 'Uni-Sans-Book', sans-serif;
height: 15px;
-webkit-transition: ease all 0.5s;
-moz-transition: ease all 0.5s;
-ms-transition: ease all 0.5s;
-o-transition: ease all 0.5s;
transition: ease all 0.5s;
}
body.smr-open #nav-trigger span {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) 0 -13px;
}
#nav2-cont {
visibility: hidden;
}
body.smr-open #nav2-cont {
visibility: visible;
}
#nav2 {
position: fixed;
z-index: 1999999;
top: 55px;
max-width: 300px;
width: 0;
right: -300px;
height: 100%;
background-color: #000;
-webkit-transition: ease all 1s;
-moz-transition: ease all 1s;
-ms-transition: ease all 1s;
-o-transition: ease all 1s;
transition: ease all 1s;
overflow-y: auto;
}
body.smr-open #nav2 {
width:100%;
-webkit-transform: translateX(-300px);
transform: translateX(-300px);
}
#nav2 ul {
list-style-type: none;
margin:0;
padding:0;
background-color: #000;
color:white;
font: 1.4rem/1.4rem 'Uni-Sans-Book', sans-serif;
}
#nav2>ul {
padding-bottom: 3rem;
} #nav2 li {
display: block;
}
#nav2 button#close-nav2 {
border:0;
padding:5px;
width:100%;
background-color: #000;
color: white;
}
#nav2 li:last-child {
}
#nav2 a {
display: block;
padding: 12px 30px;
color:white;
text-transform: capitalize;
}
#nav2 a:hover {
background-color:#23282a;
}
#nav2 .sub-menu a {
padding-left:50px;
}
main#info {
background: #f1f1f1 url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/BLS_SoundWAVE.svg) no-repeat;
background-size: 100%;
} header {
z-index: 1;
}
.sub-menu-trigger-wrapper {
display: table;
float: right;
height: 55px;
width: 160px;
}
@media (min-width: 768px) {
.sub-menu-trigger-wrapper {
height: 82px;
}
}
.sub-menu-trigger {
display: table-cell;
vertical-align: middle;
}
.region-dropdown {
}
.language-dropdown {
}
.language-dropdown a:hover,
.language-dropdown a:focus {
outline: none;
}
.language-dropdown span {
width: 13px;
height: 13px;
display: inline-block;
background-size: 100%;
margin-left: 10px;
}
.sub-menu-list {
display: none;
float: left;
width: 100%;
top: 55px;
background: #fff;
left: 0px;
right: 0px;
position: absolute;
-webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
z-index: 1;
}
@media (min-width: 768px) {
.sub-menu-list {
height: 48px;
top: 82px;
}
}
.language-sub-menu.on,
.region-sub-menu.on {
display: block;
}
.sub-menu-list .wrapper {
max-width: 1200px;
}
.sub-menu-list ul {
display: block;
float: none;
list-style: none;
margin: 0;
padding: 10px 10px 10px 0;
text-align: right;
}
.sub-menu-list ul li {
float: none;
height: 54px;
padding: 0;
margin: 0;
list-style: none;
}
@media (min-width: 768px) {
.sub-menu-list ul {
display: inline-block;
float: right;
padding-top: 0;
padding-bottom: 0;
}
.sub-menu-list ul li {
display: inline-block;
height: 48px;
}
}
.sub-menu-list ul li a {
border-bottom: none;
color: #2d3336;
display: block;
float: none;
font: 1.4rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0px;
padding: 14px 4px;
}
.language-sub-menu ul li a {
font-size: 2.6rem;
}
@media (min-width: 768px) {
.language-sub-menu ul li a {
font-size: 1.6rem;
padding-left: 10px;
padding-right: 10px;
}
}
.language-sub-menu ul li a span {
color: #2d3336;
font-weight: 600;
}
.sub-menu-list .change-region {
font-size: 2.6rem;
margin: 0 10px;
}
.change-region img {
vertical-align: baseline;
}
.change-region .region-name {
display: inline;
}
.change-region .region-currency {
display: none;
}
@media (min-width: 768px) {
.change-region .region-name {
display: none;
}
.change-region .region-currency {
display: inline;
}
}  .icon {
display:block;
width:75px;
height: 75px;
padding:0;
margin:0;
margin: 0 auto;
}
.music-icon {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) 0 -64px;
margin-bottom: 20px;
}
.wireless-icon {
background: transparent url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) -75px -63px;
margin-bottom: 20px;
}
#home p {
max-width: 900px;
margin: 0 auto;
font-size: 2rem;
line-height: 2.7rem;
text-align: center;
}
section#gallery {
width:100%;
margin: 20px auto;
padding:0;
overflow:hidden;
text-align:center;
}
section#gallery ul {
overflow:hidden;
list-style:none;
margin:0 auto;
padding:0;
}
section#gallery li {
float:left;
position: relative;
list-style:none;
margin:10px 0;
padding:0;
width:100%;
overflow:hidden;
}
section#gallery li img {
-webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;
}
section#gallery li:hover > img {
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-ms-transform:scale(1.1);
-o-transform:scale(1.1);
transform:scale(1.1);
}
section#gallery li div.overlay {
position: absolute;
top: 0px;
width: 100%;
height: 25%;
background: rgba(0,0,0,0.6);
opacity:1;
-webkit-transition: ease all 0.5s;
-moz-transition: ease all 0.5s;
-ms-transition: ease all 0.5s;
-o-transition: ease all 0.5s;
transition: ease all 0.5s;
z-index: 9999;
}
section#gallery li div.overlay-table {
display:table;
width:100%;
height: 100%;
}
section#gallery li div.overlay-text {
display:table-cell;
vertical-align: middle;
}
section#gallery li div.overlay-text p {
color:white;
font: 1.9rem/2.1rem 'Uni-Sans-Book', sans-serif;
text-align: inherit;
}
section#gallery li div.overlay-text h3 {
color: white;
} .category-news .news-excerpt img {
display: block;
margin: 0 auto;
}
.category-news h2 {
font-weight: bold;
}
.category-news .news-excerpt h2 {
padding-top: 10px;
}
.category-news .news-excerpt a.view-article {
display: none;
}
.category-news #information p {
padding-bottom: 0;
}
.category-news #information article.news-excerpt+article.news-one-liner {
padding-top: 50px;
}
.category-news #information article.news-one-liner {
padding-top: 10px;
padding-bottom: 10px;
}
.category-news .news-one-liner .date {
font-size: 2.1rem;
font-weight: normal;
width: 15rem;
}
.category-news .news-one-liner h2>* {
display: block;
line-height: 3rem;
}
.category-news #information article:last-of-type {
padding-bottom: 50px;
} .page-template-template-downloads li {
font: 300 1.6rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0 0 1rem 0;
} main#product {
background-color:white;
}
main#product #product-info {
margin:0 10px;
}
section#product-shop, section#product-complete, section#product-features, section#product-specs {
margin-bottom:20px;
}
.product-info-titles {
border-bottom: 1px solid black;
text-align: center;
margin-top: 20px;
}
h1.product-title {
font-weight:normal;
margin: 4rem 0 0;
font-family: "Uni-Sans-Thin","Uni-Sans-Book", sans-serif;
}
.product-subtitle {
font-size: 2.8rem;
line-height: 1.2;
margin: .5rem 0 1.5rem;
}
.product-imgs .bx-wrapper .bx-viewport {
-moz-box-shadow:  none !important;
-webkit-box-shadow: none !important;
box-shadow: none !important;
}
.product-imgs .bx-wrapper img {
-webkit-transition: all 1s ease; -moz-transition: all 1s ease; -ms-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease;
margin: 0 auto; }
.product-imgs ul.product {
list-style: none;
}
.product-info-titles {
margin: 10px 0;
}
.product-info-titles h2 {
font-weight:400;
margin-bottom:2px;
}
.product-info-titles p {
font-size: 2.5rem;
font-weight: normal;
margin: 2px 0;
color: #888;
line-height: 3.5rem;
}
.product-info-details {
clear: both;
color: #0F131D;
font-size: 1.6rem;
line-height: 2rem;
margin: 0 0 40px;
}
.product-info-details .thecontent {
clear: both;
padding-top: 40px;
}
.product-info-details a {
color: #5C7E96;
}
.product-info-details sub {
font-size: 1.2rem;
}
.product-info-price {
font-weight:normal;
text-align:center;
font-family: "Uni-Sans-Thin", "Uni-Sans-Book", sans-serif;
}
.product-info-btn, .button-btn-cart, .bls-standard-btn {
display: inline-block;
min-width:230px;
background: #23282a;
color: white;
margin: 20px auto 40px;
padding: 15px;
font-size:2.5rem;
border: none;
text-transform: uppercase;
text-align: center;
}
.product-info-btn:hover, .button-btn-cart:hover, .bls-standard-btn:hover{
background-color: #969696;
color:white;
}
.product-info-btn-dealer {
display: inline-block;
min-width:230px;
background: #fff;
color: #23282a;
margin: 20px auto 40px;
padding: 13px;
font-size:2rem;
border: 2px solid #23282a;
text-transform: uppercase;
text-align: center;
}
@media screen and (min-width: 560px) {
.product-info-btn-dealer {
margin-left: 20px;
}
}
.product-info-btn-dealer:hover {
background-color: #f3f3f3;
}
.product-unavailable {
font-size: 2.5rem;
line-height: 3.5rem;
margin-top: 4rem;
}
.product-unavailable a {
text-decoration: underline;
}
.product-price {
font-size: 5rem;
line-height: 5rem;
margin-top: 1rem;
margin-bottom: 2rem;
}
.product-btn {
text-align: center;
}
.product-buy-bullets {
border-top: 1px solid #ccc;
}
.product-buy-bullets ul {
padding: 0;
}
.product-buy-bullets li {
display: inline-block;
padding: 0 25px 0 0;
}
#product-specs p {
color:#777;
margin-left:8px;
}
#rear-detail {
}
#nav-float {
position: relative;
}
#nav-float-first {
background-color: rgba(0,0,0,0.6);
display:block;
height:45px
}
#nav-float-inner {
width:100%; display:block;
height:50px
}
#nav-float-content {
position:relative;
height:50px;
}
#nav-float:after {
clear:both;
}
#nav-float .logo {
padding:10px;
float:left;
width:86px;
}
#nav-float .logo-sm {
display:block;
}
#nav-float-inner ul {
margin:0;
float:right;
}
#nav-float li {
list-style:none;
float:left;
}
#nav-float li#nav-float-title, #nav-float li a {
text-transform: uppercase;
color:white;
display: block;
font: 1.5rem/1.5srem 'Uni-Sans-Book', sans-serif;
padding: 40px 10px;
text-align: center;
text-decoration: underline;
}
#nav-float li a {
padding:18px 20px;
color: #898B8E;
text-decoration: none;
font-weight: 700;
}
#nav-float li a:hover { color: #5C7E96;
}
#nav-float li#nav-float-title {
text-decoration: none;
font-weight: normal;
}
#nav-float ul li a span.arrow {
position: absolute;
text-align: center;
width: 100%;
bottom: 4px;
left: 0;
visibility: hidden;
height: 5px;
}
#nav-float ul li a.selected span.arrow {
position: absolute;
text-align: center;
width: 100%;
bottom: 4px;
left: 0;
visibility: hidden;
height: 5px;
}
#nav-float li#nav-float-title {
width:30%;
}
.product-outline-icon{ float: left;
padding: 10px 10px; height: 100%;
display: inline-block;
}
span#nav-float-title{
float: left;
font-size:20px;
padding: 20px 10px;
font-weight: 800;
}
.product-outline{
height: 50px;
display: inline-block;
} nav#nav-float{
background-color: rgba(255,255,255,0.9);
}
#nav-padder{
width: 100%;
height: 0px;
}
#nav-padder.show{
height: 50px;
}
#nav-float li a{
text-transform: capitalize;
} .product-content{
width: 75%;
float: left;
}
.product-imgs, .product-info{
width: 100% !important; }
.product-info-btn, .button-btn-cart, .bls-standard-btn {
display: inline-block;
min-width:230px;
background: #5C7E91;
color: white;
margin: 20px auto 40px;
padding: 15px;
font-size:2rem;
border: none;
text-transform: uppercase;
text-align: center;
font-weight: 800;
}
.button-btn-cart.unavailable {
background-color: #969696;
color: white;
cursor: not-allowed;
}
.button-btn-cart.availability{
margin-top: 2px;
margin-bottom: 30px;
}
.product-availability{
font-style: italic;
}
.archived-product{
margin-top: 10px;
}
.product-purchase-flex{
display: flex;
flex-direction: row;
width: 100%;
justify-content: space-between;
}
.product-purchase-child.sidebars{
border-style: none solid;
border-width: 1px;
border-color: gray;
}
.product-guarantee-parent{
display: flex;
}
.product-purchase-child{
padding: 0px 20px;
width: 33%;
}
.product-purchase-child:first-child{
padding-left: unset;
}
.product-content .product-purchase-title {
font-size: 1.6rem;
}
.product-content .product-purchase-title-price {
display: inline-block;
margin-right: 20px;
}
.product-purchase-types {
display: none; margin: 1rem 0 3rem;
}
.product-purchase-types.visible {
display: block;
}
.product-purchase-type {
border: 1px solid #888;
color: #23282a;
display: inline-block;
font-size: 2rem;
font-weight: 600;
margin: 3px;
padding: 15px;
text-align: center;
}
.product-purchase-type.active { border: 3px solid #5C7E91;
padding: 13px;
}
.product-colour-options { font-size: 1.6rem;
margin-top: 20px;
}
.product-colour-choose {
display:inline-block;
font-size:.9em;
padding-top:.45em;
padding-right:.4em;
text-align:right;
}
.product-colour-options .product-colour {
border: 1px solid #888;
border-radius: 100%;
display: inline-block;
height: 4rem;
margin-top: .5em;
margin-left: .25em;
width: 4rem;
}
.product-colour-options .product-colour-white {
background: white;
}
.product-colour-options .product-colour-black {
background: black;
}
.product-colour-options .product-colour-gray {
background: lightgray;
}
.product-colour-options .product-colour-blue {
background: #41a5c5;
}
.product-colour-options .product-colour-active,
.product-colour-options .product-colour.active {
border: 3px solid #5C7E91; box-shadow: none;
padding: 1px;
} button.colorChange{
height: 1.5em;
margin-top: .5em;
margin-left: .25em;
width: 1.5em;
background-color: gray;
border-radius: 100%;
border: 2px solid #888;
padding: 5px;
}
button.colorChange.Black,
button.colorChange.black {
background-color: black;
}
button.colorChange.White,
button.colorChange.white {
background-color: white;
}
button.colorChange.Blue,
button.colorChange.blue {
background-color: #41a5c5;
}
button.colorChange.Gray,
button.colorChange.gray {
background-color: lightgray;
} h1.product-title{
font-size: 60px;
}
.product-content h3{
margin-top: 10px;
font-size: 28px;
}
div.product-info-details div.thecontent ul{
line-height: 25px;
} .producticonsection {
width: 110px;
margin-right: 5%;
float: left;
text-align: center;
font-size: 10px;
}
@media screen and (max-width: 540px) {
.producticonsection {
width: 100%;
}
}
.producticonsection img {
margin-bottom: 5px;
max-height: 50px;
max-width: 57px;
}
.associated-product-content h3 {
font-size: 15px;
font-weight: 800;
margin-bottom: 1px;
color: #898B8E;
}
.associated-product-content .related-price{
color: #898B8E;
font-size: 24px;
line-height: 1.3;
}
.associated-product-content a.related-more-info{
color: #5C7E96;
font-weight: 800;
}
.associated-products.top {
width: 20%;
float: right;
}
.associated-products.bottom {
display: none;
}
.associated-product{
display: inline-block;
padding: 40px 0px;
border-bottom: 1px solid #ccc;
}
.associated-product:last-of-type{
border-bottom: unset;
}
.associated-products h2{
font-size: 28px;
}
.associated-product-imgs{
width: 50%;
float: left;
}
.associated-product-content{
width: 50%;
float: right;
}
div.product-btn{ } .each-specs h3 {
text-transform: uppercase;
}
.each-specs {
margin: 10px 10px 40px;
} section#product-features{
max-width: 100%;
padding: 0px;
}
.feature-row {
width: 100%;
margin: 0px;
padding: 80px 0px;
}
.feature-row:nth-child(odd) {
background-color: #f4f4f4;
}
.feature-row:nth-child(even) {
background-color: white;
}
.feature-row .feature-content {
max-width: 1400px;
margin-right: auto;
margin-left: auto;
display: flex;
align-items: center;
}
.feature-row:nth-child(odd) .feature-content {
flex-direction: row-reverse;
}
.feature-row:nth-child(even) .feature-content {
flex-direction: row;
}
.feature-row .feature-text-inner{
display: block;
font-size: 1.6rem;
line-height: 2rem;
max-width: 400px;
margin-right: auto;
margin-left: auto;
}
.feature-row h3 {
text-transform: none;
font-weight: 800;
font-size: 35px;
line-height: 1;
}
.feature-row img {
width: 50%;
} #product-downloads-outter{
display: flex;
flex-direction: row;
width: 100%;
}
#product-downloads-outter a{
width: 100%;
} 
#product-downloads-outter .product-download-inner {
display: flex;
flex-direction: row;
align-items: flex-end;
margin: 10px 10px 40px;
} 
#product-downloads-outter .product-download-inner img{
float: left;
width: 25px;
} 
#product-downloads-outter .product-download-inner h3{
margin: 0 0 0 5px;
} #thumbnail-outer-container{ display: block;
height: 500px;
margin-left: 20px;
}
.thumbnail-container{
width: 100px; display: none; float: left;
}
.thumbnail-container img.thumbnail {
cursor: pointer;
width: 100%;
}
.thumbnail-container div{
width: 100px;
height: 100px;
display: block;
margin-top: auto;
margin-bottom: auto;
}
#main-and-button{
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
justify-content: space-around;
min-height: 320px;
}
#thumbnail-main{
text-align: center;
width: 500px;
}
#colorChangeButtons{
margin-left: auto;
margin-right:auto;
height: 100px;
text-align: center
}
.colorChange{
color: #67686c;
background-color: white;
border: none;
font-size: 16px;
}
.colorChange:first-of-type{
margin-left: 120px;
}
.colorChange:focus {
}
#carousel-container{
max-width: 1200px;
display: flex;
flex-direction: row;
align-items: center;
width: 100%;
justify-content: flex-start;
margin-left: auto;
margin-right: auto;
}
.nextButton {
font-family: 'slick';
font-size: 40px;
color: #67686c;
background-color: white;
border: none;
}
.nextButton.nextButtonDisable{
color: lightgray;
} .awards-slick-carousel {
margin: 5px auto;
text-align: center;
width: 90%;
}
.awards-slick-carousel img.awards-slick-img {
margin: 0px auto 20px auto;
width: 200px;
}
.awards-slick-carousel p {
color: #777;
font-size: x-large;
font-style: italic;
line-height: normal;
margin-bottom: 20px;
}
.awards-slick-carousel h3.awards-slick-author {
font-weight: 800;
}
.awards-slick-carousel h4.awards-slick-publication {
color: #777;
}
.awards-slick-outer {
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/slick/quotationMark.png);
background-repeat: no-repeat;
background-position: center;
background-size: 20%;
}
.slick-prev:before, .slick-next:before {
color: gray;
font-family: 'slick';
font-size: 28px;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.awards-slick-carousel-item {
padding-left: 10px;
padding-right: 10px;
}
@media only screen and (max-width:768px) {
#nav-float li a{
padding: 18px 10px;
font-size: 14px;
}
#nav-float ul{
padding-left: 10px;
}
img.product-outline-icon {
display: none;
}
#thumbnail-outer-container{ display: none;
}
#main-and-button{
min-height: 280px;
}
#colorChangeButtons{
height: unset;
}
.colorChange:first-of-type{
margin-left: inherit;
}
h1.product-title {
text-align: left;
}
.product-content h3 {
margin-top: 10px;
font-size: 24px;
}
div#nav-padder{
display: none;
}
.product-purchase-flex{
display: flex;
flex-direction: column;
width: 100%;
justify-content: space-between;
}
.product-purchase-child.sidebars{
border-style: none;
}
.product-guarantee-parent{
display: flex;
}
.product-purchase-child{
padding: 15px 10px;
width: 200px;
}
.product-purchase-child:first-child{
padding-left:10px;
}
h4.product-purchase-title{
font-size:	12px;
}
div.product-btn{
text-align: left;
}
.associated-products.top {
display: none;
}
.associated-products.bottom {
display: block;
width: 100%;
}
.associated-products.bottom .associated-product {
padding: 10px 0;
width: 100%
}
.associated-products.bottom h3 {
font-size: 2rem;
line-height: 1.25;
padding-top: 1rem;
}
.associated-products.bottom .associated-product-imgs,
.associated-products.bottom .associated-product-content {
display: table-cell;
float: none;
vertical-align: middle;
width: 50%;
}
.associated-products.bottom .product-description {
font-size: 1.6rem;
line-height: 1.25;
}
.associated-products.bottom .related-price {
padding-top: 1rem;
}
.associated-products.bottom .related-more-info {
display: block;
font-size: 1.6rem;
line-height: 1.25;
padding-top: 1rem;
padding-bottom: 3rem;
}
.product-content {
width: 100%;
} .feature-row {
padding: 0;
}
.feature-row:nth-child(odd) {
background-color: white;
}
.feature-row:nth-child(odd) .feature-content,
.feature-row:nth-child(even) .feature-content {
flex-direction: column-reverse;
}
.feature-row img {
width: 100%;
}
.feature-row .feature-text {
width: 100%;
}
.feature-row .feature-text-inner{
max-width: 90%;
padding: 30px 0;
}
#product-downloads-outter {
flex-direction: column;
}
}
@media only screen and (max-width:480px) {
#nav-float li a{
padding: 18px 6px;
font-size: 10px;
}
span#nav-float-title{
font-size: 15px;
padding: 20px 6px;
}
} .international-shop-outer-div {
padding: 20px;
text-align: center;
}
.international-shop-outer-div .international-shop-flex-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: auto;
max-width: 1000px;
text-align: center;
}
.international-shop-flex-container a div {
border: 1px solid lightgray;
height: 200px;
margin: 20px;
text-align: center;
width: 200px;
}
.international-shop-flex-container a div h3 {
color: black;
height: 85px;
margin-top: 20px;
}
.international-shop-flex-container a div:hover {
border: 3px solid #0f131e;
padding: 2px;
}
.list-shop ul {
margin: 10px 0;
display: inline-block;
width: 100%;
padding: 0;
}
.list-shop > div h1 {
text-align: center;
}
.list-shop ul li {
width: 50%;
float: left;
padding: 0 20px;
font-size: 2rem;
list-style: none;
text-align: center;
}
.list-shop ul li a {
border-bottom: 3px solid #bbb;
cursor: pointer;
display: block;
line-height: normal;
padding: 35px 0;
width: 100%;
}
.list-shop ul li a.active, .list-shop ul li a:hover{
background: #5C7F95;
border-bottom: 3px solid #5C7F95;
color: #fff;
} .ca .list-shop ul li a.ca,
.eu .list-shop ul li a.eu,
.gb .list-shop ul li a.gb,
.us .list-shop ul li a.us {
border-bottom: 3px solid #5C7F95;
}
.list-shop .tabcontent_pr {
display: none;
}
.pre-content {
background: white;
margin: 4px;
padding: 39px;
}
.pre-content p {
max-width: 820px;
}
section#products {
margin: 65px auto;
}
a.anchor{display: block; position: relative; top: -240px; visibility: hidden;}
a.anchor.scrolled{top: -100px;}
.product_container_inner {
margin: 5px 0;
background-color: white;
text-align:center;
}
@media screen and (max-width: 520px) {
#products .product_container_inner {
min-height: 500px;
}
}
.product_container_inner:after {
content: " ";
display: block;
height: 0;
clear: both;
}
.product_container_inner img {
height:260px;
}
.product_container.last .product_container_inner img {
height: auto;
}
.product_container.last .product_container_inner  {
min-height:420px;
padding:30px;
text-align:left;
font-size: 1.2rem;
}
.product_container.last .product_container_inner h2 {
line-height:40px;
margin-bottom:20px;
text-transform:uppercase;
color:#23282a;
}
.product_container.last .product_container_inner h3 {
line-height:28px;
font-weight:normal;
margin-bottom:5px;
text-transform:uppercase;
}
.product_container.last .product_container_inner p {
margin-top: 20px;
margin-bottom: 20px;
}
.product-info-details p { width:90%;
}
.product_container_inner:hover h2,.product_container_inner:hover h4 {
color: white;
}
.product_container.last .product_container_inner h2:hover {
color:#23282a;
}
.manuals h3 {
margin: 20px;
clear:both;
}
.product_container .product_image {
width:100%;
max-width:450px;
margin:0 auto;
}
.product_container.flow, .product_container.apps {
background:transparent;
text-align: center;
}
.product_container.flow .product_container_inner {
padding:20px 0 0 0;
}
.product_container.apps .android {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/downloads-android.png) no-repeat center -432px;
}
.product_container.apps .ios {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/downloads-appstore.png) no-repeat center -432px;
}
.product_container.apps .kindle {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/downloads-kindle.png) no-repeat center -432px;
}
.product_container.apps .windows {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/downloads-windows.png) no-repeat center -432px;
}
.product_container.apps .osx {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/downloads-mac.png) no-repeat center -432px;
}
.product_container.apps .android:hover {
background-position: center -42px;
}
.product_container.apps .ios:hover {
background-position: center -42px;
}
.product_container.apps .kindle:hover {
background-position: center -42px;
}
.product_container.apps .windows:hover {
background-position: center -42px;
}
.product_container.apps .osx:hover {
background-position: center -42px;
}
.product_container.flow a, .product_container.apps a {
display: block;
background-color: transparent;
}
.product_container.apps a {
padding:40px 0;
}
.product_container.flow h2, .product_container.apps h2 {
margin-bottom:1.4rem;
}
.product_container.apps h2 {
margin: 13rem auto 0;
text-align: left;
width: 250px;
}
.product_container.flow p, .product_container.apps p {
margin:5px 0;
padding:0;
line-height: 0;
}
.product_container.flow .product_container_inner:hover {
background-color: black;
}
.product_container.flow .product_container_inner:hover h2 {
color:white;
}
.product_container.apps .product_container_inner:hover h2 {
color:black;
}
.product_container.flow .product_container_inner:hover p {
color:white;
}
.feature-img {
text-align: center;
}
.feature-img img {
}
.product-imgs {
text-align: center;
}
#shop .product_meta_container {
text-align:center;
height: 230px;
padding-top: 8px;
width: 100%;
}
@media screen and (max-width: 520px) {
#products .product_meta_container {
height: 220px;
}
}
#shop .sales .product_meta_container {
height: 200px;
}
#shop .product_container_inner:hover .product_meta_container {
background: rgba(35, 40, 42, 0.75);
color: white;
}  #shop .bxslider h2.product_title {
color: white;
text-align: center;
}
#shop .product-price {
font-family: Uni-Sans-Book, sans-serif;
font-size: 5rem;
height: 50px;
margin: 20px;
text-align: center;
}
#shop .product-add {
font-family: Uni-Sans-Book, sans-serif;
font-size: 1.8rem;
text-align: center;
text-transform: uppercase;
}
#shop .halo img {
width:100%;
} main#info {
padding: 40px 0;
}
main#info h1.block {
padding: 1rem;
background: #67686c;
color: white;
font-weight: normal;
}
.information a.block {
display: block;
width: 200px;
background: #aab1b1;
color: #FFF;
font-size: 21px;
border: none;
padding:15px 20px;
margin-top:5px;
}
.information a.block:hover {
background:#23282a;
}
#information a, .information a {
text-decoration: underline;
}
section#information, .information {
background-color:white;
}
section#information article {
padding:30px;
margin:0 auto;
}
main#info h1.block-attached, main#info h2.block-attached {
font-size: 3rem;
padding: 1rem;
margin-left: -10px;
margin-bottom: -10px;
background: #67686c;
color: white;
font-weight: normal;
display: inline-block;
min-width:50%;
}
#information p, #information li {
font-size: 2.1rem;
line-height: 3rem;
padding: 1rem 0 2rem;
}  #information p, #information li, #information h3, #information h4 {
margin: 0 0 1rem;
}
#information .location-search p {
padding:0;
line-height: 2.5rem;
margin:0;
} #map-canvas {
display:none;
height: 50vh;
width: 100%;"
}
.location-search {
max-width: 800px;
margin:0 auto;
}
#map-locator button#submit-address {
font-size: 2rem;
line-height: 2rem;
padding: 7px;
width: 100%;
margin: 3px 0 10px 0;
}
#stores .topic-content ul {
list-style: none;
margin: 0;
padding: 0;
}
#stores .topic-content ul li {
width:100%;
margin:20px 0;
padding: 0 16px 0 8px;
list-style: none;
font-size: 1.7rem;
color: #777;
}
#stores .topic-content ul li h2 {
margin-left:-8px;
}
#dealer-results li a {
display: block;
overflow: hidden;
text-decoration: underline;
text-overflow: ellipsis;
}
#map-locator input, #information .registration input, #information .registration select {
font-size: 2rem; padding: 8px;
width: 100%;
margin: 3px 0 10px;
}
.availability * {
color: #0098da;
} #information .field {
width:100%;
}
#information .field label {
font-size: 1.4rem;
line-height: 2rem;
padding: 5px;
width: 100%;
display:block;
}
#information .field.left{
clear:both;
}
.serial input {
width:80% !important;
}
.serial a {
font-size: 1.2rem;
}
#boilerplate {
padding-top: 20px;
}
#registration {
max-width: 600px;
margin:0 auto;
}
select#registration-date-year { display:inline-block;
width: 29% !important; }
select#registration-date-month { display: inline-block;
width: 49% !important; }
select#registration-date-day { display: inline-block;
width: 19% !important; }
#information .registration select {
padding: 0;
height: 44px;
}
.nested-fields fieldset {
margin:0;
padding:0;
border:none;
}
#registration .add-fields {
display:block;
margin-bottom:10px;
padding: 10px;
background-color: white; font-size: 1.6rem;
width: 300px;
text-align: left;
}
#registration .add-fields:hover { color:black;
}
#registration .submit {
padding: 10px;
background-color: black;
color:white;
border: 0;
font-size: 1.6rem;
width: 300px;
}
#registration .submit:hover {
color:black;
background-color: #AAB1B1;
}
#registration-block-pattern {
display:none;
}  .bx-wrapper {
position: relative;
margin: 0 auto 60px;
padding: 0;
*zoom: 1;
}
.bx-wrapper img {
max-width: 100%;
display: block;
}
.slider .bx-wrapper .bxslider img {
width: 100%;
} .bx-wrapper .bx-viewport { background: #fff; -webkit-transform: translatez(0);
-moz-transform: translatez(0);
-ms-transform: translatez(0);
-o-transform: translatez(0);
transform: translatez(0);
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
position: absolute;
bottom: -30px;
width: 100%;
}
.bx-wrapper ul.bxslider {
margin:0;
} .bx-wrapper .bx-loading {
min-height: 50px;
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/bx_loader.gif) center center no-repeat #fff;
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 2000;
} .bx-wrapper .bx-pager {
text-align: center;
font-size: .85em;
font-family: Arial;
font-weight: bold;
color: #666;
padding-top: 20px;
}
.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
display: inline-block;
*zoom: 1;
*display: inline;
}
.bx-wrapper .bx-pager.bx-default-pager a {
background: #E2E2E2;
text-indent: -9999px;
display: block;
width: 19px;
height: 18px;
margin: 0 5px;
outline: 0;
-moz-border-radius: 9px;
-webkit-border-radius: 9px;
border-radius: 9px;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
background: #B2B2B2;
} .bx-wrapper .bx-prev {
left: 10px;
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) no-repeat -64px -32px;
}
.bx-wrapper .bx-next {
right: 10px;
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) no-repeat -107px -31px;
}
.bx-wrapper .bx-prev:hover {
background-position: -64px 0;
}
.bx-wrapper .bx-next:hover {
background-position: -107px 1px;
}
.bx-wrapper .bx-controls-direction a {
position: absolute;
top: 50%;
margin-top: -16px;
outline: 0;
width: 32px;
height: 32px;
text-indent: -9999px;
z-index: 9999;
}
.bx-wrapper .bx-controls-direction a.disabled {
display: none;
} .bx-wrapper .bx-controls-auto {
text-align: center;
}
.bx-wrapper .bx-controls-auto .bx-start {
display: block;
text-indent: -9999px;
width: 10px;
height: 11px;
outline: 0;
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) -150px -11px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-start:hover,
.bx-wrapper .bx-controls-auto .bx-start.active {
background-position: -150px 0;
}
.bx-wrapper .bx-controls-auto .bx-stop {
display: block;
text-indent: -9999px;
width: 9px;
height: 11px;
outline: 0;
background: url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/sprite.png) -150px -44px no-repeat;
margin: 0 3px;
}
.bx-wrapper .bx-controls-auto .bx-stop:hover,
.bx-wrapper .bx-controls-auto .bx-stop.active {
background-position: -150px -33px;
} .bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
text-align: left;
width: 80%;
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
right: 0;
width: 35px;
} .bx-wrapper .bx-caption {
background: #666\9;
background: rgba(35, 40, 42, 0.75);
padding: 8px 0 16px;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.bx-wrapper .bx-caption>span {
color: #fff;
display: block;
font-family: Arial;
font-size: .85em;
}
.bx-controls-direction a {
opacity: 0;
transition: opacity .25s ease-in-out;
-moz-transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out;
}
.bx-wrapper:hover .bx-controls-direction a {
opacity: 1;
} @media only screen and (min-width:480px) {
.bx-wrapper .bx-caption {
}
.bxslider .slider-text {
position: absolute;
z-index: 9999;
}
.bxslider .slider-text h2 {
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
padding:20px;
}
.bxslider .slider-text p {
font: 1.6rem/1.8rem 'Uni-Sans-Book', sans-serif !important;
padding:15px;
}
}
@media only screen and (min-width:768px) {
#nav-trigger {
display: none;
}
.nested-fields .field {
float:left !important;
width:48% !important;
}
.nested-fields .field.right {
float:right !important;
width:48% !important;
}
.bx-wrapper .bx-caption {
bottom: 20px;
left: 25%;
width: 50% ;
height: 160px;
text-align: left;
}
.bxslider .slider-text {
position: absolute;
z-index: 9999;
}
.bxslider .slider-text h2 {
font: 5rem/5rem 'Uni-Sans-Book', sans-serif;
padding:30px;
}
.bxslider .slider-text p {
font: 3rem/3rem 'Uni-Sans-Book', sans-serif !important;
padding:30px;
}
section#gallery ul {
width:100%;
}
section#gallery li {
width:33.3%;
margin:0;
}
section#gallery li div.overlay {
height:100%;
}
section#gallery li:hover div.overlay {
background: rgba(0,0,0,0.4);
opacity:1;
}
.logo {
padding: 24px 0;
width: 86px;
}
.logo-sm { height: 34px;
width: unset;
}
#nav-trigger { padding: 34px 0 33px;
}
#nav2 {
top: 82px;
} #nav1.nav-load-show {
display:table;
table-layout: fixed; max-width: 900px;
float: right;
}
.accessible-megamenu {
display: table-row;
width: 100%;
position: relative; font: 1.4rem/1.4rem 'Uni-Sans-Book', sans-serif;
padding:0;
margin:0;
} .accessible-megamenu .accessible-megamenu-top-nav-item {
position: relative;
display: inline-block;
list-style: none;
text-align: right;
}
.accessible-megamenu :focus {
outline:  2px solid rgba(34, 95, 215, 0.3);
-moz-outline-radius: 3px;
}
.accessible-megamenu .accessible-megamenu-top-nav-item a {
color: white;
display: block; max-height:122px; font-weight: bold;
white-space: nowrap;
padding: 37px 20px 31px;
}
.accessible-megamenu .accessible-megamenu-top-nav-item a:hover {
background: white;
color:#2d3336;
}
.accessible-megamenu .accessible-megamenu-top-nav-item a[aria-haspopup]:hover,
.accessible-megamenu .accessible-megamenu-top-nav-item a[aria-haspopup]:focus {
outline-offset: -1px;
}
.accessible-megamenu .accessible-megamenu-top-nav-item a[aria-haspopup]:hover,
.accessible-megamenu .accessible-megamenu-top-nav-item a[aria-haspopup]:focus,
.accessible-megamenu .accessible-megamenu-top-nav-item a[aria-haspopup].open {
margin-left: 0;
z-index: 1002;
background: white;
color: #2d3336;
}
.accessible-megamenu .accessible-megamenu-panel {
position: absolute;
display: block;
background: white;
border: 1px solid #2d3336;
border-top: none;
left: -1px;
margin: 0;
padding: 0 0.769em 0.769em;
line-height: normal;
cursor: default;
visibility: hidden;
top: -9999em;
max-height: 0px;
overflow: hidden;
opacity: 0;
}
.accessible-megamenu .accessible-megamenu-panel.open {
visibility: visible;
top: 82px;
max-height: 600px;
opacity: 1;
z-index: 1001;
-webkit-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
-moz-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
-ms-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
-o-transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
transition: opacity 250ms ease, max-height 500ms ease, visibility 0s linear 0s, top 0s linear 0s;
}
.accessible-megamenu .support_menu .accessible-megamenu-panel {
left: -1px;
}
.accessible-megamenu .accessible-megamenu-panel ul {
padding:0 10px;
margin:0;
list-style: none; text-align: left;
padding-left: 10px;
}
.accessible-megamenu .accessible-megamenu-panel ul li.archive_menu {
border-top: 1px solid #AAB1B1;
}
.accessible-megamenu .accessible-megamenu-panel a {
padding:10px 0;
color:#2d3336;
}
.accessible-megamenu .accessible-megamenu-panel a:hover {
background: transparent;
text-decoration: underline;
} .accessible-megamenu .accessible-megamenu-panel ol {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
.accessible-megamenu .accessible-megamenu-panel ol > li {
position: relative;
list-style: none;
margin: 0;
padding: 0;
}
.accessible-megamenu .accessible-megamenu-panel > ol > li {
float: left;
display: block;
margin-right: 1em;
margin-bottom: 1em;
padding-left: 1em;
}
.accessible-megamenu .accessible-megamenu-panel > ol > li:first-of-type {
padding-left: 0;
border-left: none;
}
.accessible-megamenu .accessible-megamenu-panel > p {
font-size: 1.2em;
line-height: 1.1em;
}
.accessible-megamenu .accessible-megamenu-panel > ol > li > h3 > a {
margin-bottom: 6px;
padding-top: .4em;
padding-bottom: 0;
}
.accessible-megamenu .accessible-megamenu-panel ol ol > li > a {
width: auto;
text-indent: -2.333em;
padding-left: 2.333em;
}
.accessible-megamenu .accessible-megamenu-panel a:hover,
.accessible-megamenu .accessible-megamenu-panel a:focus {
text-decoration: underline;
} .accessible-megamenu li:first-child .accessible-megamenu-panel
{ background-size: 150px;
padding: 10px 10px;
background-position: 210px;
border:1px solid #2d3336;
border-top:none;
width:600px;
margin-left:-1px;
}
.eco_menu .sub-nav-group {
min-width: 165px !important;
width: 165px; }
.speakers1_menu, .hometheater1_menu, .components1_menu {
padding: 6px 0px;
} #stores .topic-content ul li {
float:left;
width:50%;
height:300px;
} .cf:after, .cf:before {
content:"";
display:table;
}
.cf:after {
clear:both;
}
.cf {
zoom:1;
}  #map-locator input, #information .registration input.left, #information .registration select.left {
width: 68%;
float:left;
}
#information .field.left {
width: 48%;
float:left;
}
#information .field.right {
width: 48%;
float:right;
}
#map-locator button#submit-address {
width: 28%;
float:right;
}
#map-canvas {
display:none;
height: 50vh;
width: 100%;"
}
section#information article {
padding:40px;
} .category-news .news-one-liner h2 {
display: table-row;
}
.category-news .news-one-liner h2>* {
display: table-cell;
} #product-info-titles {
text-align: left;
}
.product_container_inner {
margin:4px;
}
#shop .product_container_inner {
margin:4px;
min-height: 480px;
}
h1.product-title {
margin-right:30px;
}
main#product .product-imgs, main#product .product-info {
width:50%;
float:left;
margin:0;
}
.product-info-titles h2, .product-info-titles p {
text-align: left;
}
.product-info-price {
text-align: left;
max-width:350px;
}
.product-colour-options {
float: left;
margin-top: 0;
}
.product-btn {
clear: left;
}
.product_container.apps h2 { }
.product-info-btn { }
.product-info.preorder .product-info-btn, .product-info.preorder .button-btn-cart {
margin: 40px 0 10px;
}
.preorder-date {
display: block;
line-height: 2rem;
margin: 0 0 10px;
}
#nav-float {
clear:both;
display: block;
}
#nav-float.fixed {
position:fixed;
width:100%;
top:0;
left:0;
z-index:999;
}
#nav-float-inner {
width: 100%;
max-width: 1200px;
margin:0 auto;
}
#product .halo {
position: relative;
top: -139px;
clear:both;
}
#product .halo.scrolled {
top:0;
}
#product-features {
margin-top: -139px;
}
#product-features.scrolled {
margin-top:0;
}
#product-features:after, #product-specs:after {
content: " ";
clear: both;
display: block;
height: 0;
visibility: hidden;
}
#product-specs h4 {
margin-bottom:0.2em;
}
.features {
min-height: 225px;
}
.img-left, .text-left {
float:left;
}
.img-right, .text-right {
float:right;
}
.feature-text {
width:50%;
padding:10px;
display: table;
height: 100%;
}
.feature-text-inner {
display: table-cell;
vertical-align: middle;
}
.feature-img {
width: 40%;
margin:0;
padding:10px;
}
.feature-img img {
max-width: 100%;
max-height: 225px
}
.product-btn {
text-align: left;
}
.each-specs {
float:left;
width:30%;
}
.footer-logo {
display:block;
float:left;
width:100px;
}
.footer-logo .logo-sm {
display: block
}
.footer-subscribers {
float:right;
text-align: right;
}
.footer-mc-caption {
display: inline-block;
}
.footer-social {
float:left;
padding: 20px 20px 0 20px;
}
.footer-menu {
float:left;
padding: 5px 0 0 0;
}
.footer-menu ul {
background-color: transparent;
}
.footer-menu li {
display: inline-block;
}
.footer-menu a {
display: block;
padding: 0 5px 16px 5px;
text-align: right;
text-decoration: underline;
}
.footer-menu a:hover {
text-decoration: none;
background-color: black;
}
.product_container.flow, .product_container.apps {
width:50%;
float:left;
} .accessible-megamenu li:first-child .accessible-megamenu-panel > .sub-nav-group > li {
float: left;
width: 50%;
min-width: 200px;
}
.accessible-megamenu li:first-child ul.sub-nav-group
{
width: auto;
}
.accessible-megamenu li:first-child .speakers1_menu, body .accessible-megamenu li:first-child .hometheater1_menu, body .accessible-megamenu li:first-child .components1_menu
{
padding: 0;
}
.accessible-megamenu li:first-child .accessible-megamenu-panel > .sub-nav-group > li > a {
border-bottom: 1px solid #999;
width: 90%;
position: relative;
}
.accessible-megamenu  li#menu-item-23369 > a {
border-bottom: none;
border-top: 1px solid #999;
}
.accessible-megamenu li:first-child .accessible-megamenu-panel > .sub-nav-group > li > a:after {
content: "\003e";
display: inline-block;
float: right;
position: absolute;
right: 0;
}
.accessible-megamenu li:first-child .accessible-megamenu-panel
{
width: 500px;
}
.accessible-megamenu li:first-child .components1_menu:after {
border-bottom: 1px solid #999;
width: 90%;
content: "";
display: inline-block;
margin-bottom: 10px;
}
.accessible-megamenu li:first-child li#menu-item-21978 {
float: right;
}
.accessible-megamenu li:first-child li#menu-item-21978 a
{
border: 0 none !important;
}
.accessible-megamenu li:first-child ul.sub-nav-group ul.sub-nav-group {
padding: 0; } } @media only screen and (min-width:850px) {
body .accessible-megamenu li:first-child .accessible-megamenu-panel
{
width: 700px;
}
body .accessible-megamenu li:first-child .accessible-megamenu-panel > .sub-nav-group > li {
width: 33.33%;
}
} @media only screen and (min-width:960px) {
.logo {
width:272px;
padding:24px 5px 24px;
float:left;
}
#nav1.nav-load-show { }
#nav2-wrapper {
width:143px;
}
.logo-sm{
display:none;
}
.logo-lg{
display:block;
} .bx-wrapper .bx-caption {
height: 200px;
width: 350px;
}
section#products {
max-width: 1071px;
padding:0;
}
section#products:after {
content: " ";
display: block;
height: 0;
clear: both;
}
.product_container.half {
float:left;
width:50%;
}
.product_container.flow, .product_container.apps  {
float:left;
width:33%;
}
#shop .product-price {
text-align: left;
margin: 20px 0 0 19px;
}
#shop .product_meta_container {
width: 380px;
width: calc(100% - 40px);
text-align: left;
margin-left: 20px;
bottom: 20px;
position: relative;
padding: 10px 0 0 0;
}
#shop .bxslider h2.product_title,
#shop .product_meta_container h2.product_title,
#shop .product_meta_container h4.product_title {
margin-left:19px;
text-align: left;
}
#shop .product_meta_container h4.product_title {
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
height: 42px
}
#shop .product-add {
text-align: left;
margin: 32px 0 0 19px;
width: 100%;
}
#product-info-container .product-imgs {
float: left;
width: 50%;
}
#product-info-container .product-info {
float: left;
width: 50%;
padding-top: 30px;
}
#stores .topic-content ul li {
float:left;
width:33%;
}
}
@media only screen and (min-width:1200px) {
#nav2-wrapper {
width:300px;
}
#stores .topic-content ul li {
float:left;
width:25%;
height: 250px;
}
.product_container.flow {
width:25%;
}
.product_container.apps  {
float:left;
width:33%;
}
.product_container.flow h2 {
height:40px;
}
section#information article {
padding:50px;
}
}
@media only screen and (-webkit-min-device-pixel-ratio:1.5),
only screen and (min-resolution:144dpi) {
} ::selection {
background:#04A4CC;
color:#FFF;
text-shadow:none;
}
::-webkit-selection {
background:#04A4CC;
color:#FFF;
text-shadow:none;
}
::-moz-selection {
background:#04A4CC;
color:#FFF;
text-shadow:none;
} .alignnone {
margin:5px 20px 20px 0;
}
.aligncenter,
div.aligncenter {
display:block;
margin:5px auto 5px auto;
}
.alignright {
float:right;
margin:5px 0 20px 20px;
}
.alignleft {
float:left;
margin:5px 20px 20px 0;
}
a img.alignright {
float:right;
margin:5px 0 20px 20px;
}
a img.alignnone {
margin:5px 20px 20px 0;
}
a img.alignleft {
float:left;
margin:5px 20px 20px 0;
}
a img.aligncenter {
display:block;
margin-left:auto;
margin-right:auto;
}
.wp-caption {
background:#FFF;
border:1px solid #F0F0F0;
max-width:96%;
padding:5px 3px 10px;
text-align:center;
}
.wp-caption.alignnone {
margin:5px 20px 20px 0;
}
.wp-caption.alignleft {
margin:5px 20px 20px 0;
}
.wp-caption.alignright {
margin:5px 0 20px 20px;
}
.wp-caption img {
border:0 none;
height:auto;
margin:0;
max-width:98.5%;
padding:0;
width:auto;
}
.wp-caption .wp-caption-text,
.gallery-caption {
font-size:11px;
line-height:17px;
margin:0;
padding:0 4px 5px;
}
.sticky {
}
.bypostauthor {
} @media print {
* {
background:transparent !important;
color:#000 !important;
box-shadow:none !important;
text-shadow:none !important;
}
a,
a:visited {
text-decoration:underline;
}
a[href]:after {
content:" (" attr(href) ")";
}
abbr[title]:after {
content:" (" attr(title) ")";
}
.ir a:after,
a[href^="javascript:"]:after,
a[href^="#"]:after {
content:"";
}
pre,blockquote {
border:1px solid #999;
page-break-inside:avoid;
}
thead {
display:table-header-group;
}
tr,img {
page-break-inside:avoid;
}
img {
max-width:100% !important;
}
@page {
margin:0.5cm;
}
p,
h2,
h3 {
orphans:3;
widows:3;
}
h2,
h3 {
page-break-after:avoid;
}
}  .animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
.animated.bounceIn,
.animated.bounceOut {
-webkit-animation-duration: .75s;
animation-duration: .75s;
}
.animated.flipOutX,
.animated.flipOutY {
-webkit-animation-duration: .75s;
animation-duration: .75s;
}
@-webkit-keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
@keyframes bounce {
0%, 20%, 53%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
-webkit-transform: translate3d(0,0,0);
transform: translate3d(0,0,0);
}
40%, 43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
animation-timing-function: cubic-bezier(0.755, 0.050, 0.855, 0.060);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0,-4px,0);
transform: translate3d(0,-4px,0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
@keyframes flash {
0%, 50%, 100% {
opacity: 1;
}
25%, 75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
} @-webkit-keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(.95, 1.05, 1);
transform: scale3d(.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, .95, 1);
transform: scale3d(1.05, .95, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
0%, 100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%, 30%, 50%, 70%, 90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%, 40%, 60%, 80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
100% {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.swing {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
0% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%, 20% {
-webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
}
30%, 50%, 70%, 90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%, 60%, 80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
} @-webkit-keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes wobble {
0% {
-webkit-transform: none;
transform: none;
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes jello {
11.1% {
-webkit-transform: none;
transform: none
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg)
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg)
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
}
100% {
-webkit-transform: none;
transform: none
}
}
@keyframes jello {
11.1% {
-webkit-transform: none;
transform: none
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg)
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg)
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg)
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg)
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg)
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg)
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg)
}
100% {
-webkit-transform: none;
transform: none
}
}
.jello{
-webkit-animation-name:jello;
animation-name:jello;
-webkit-transform-origin: center;
transform-origin: center
}
@-webkit-keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
0%, 20%, 40%, 60%, 80%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(.97, .97, .97);
transform: scale3d(.97, .97, .97);
}
100% {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.bounceIn {
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInDown {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInLeft {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
@keyframes bounceInRight {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
100% {
-webkit-transform: none;
transform: none;
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
0%, 60%, 75%, 90%, 100% {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(.9, .9, .9);
transform: scale3d(.9, .9, .9);
}
50%, 55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
}
.bounceOut {
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%, 45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInDownBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes fadeInUpBig {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes fadeOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(.95, .95, .95);
transform: perspective(400px) scale3d(.95, .95, .95);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
0% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
0% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
100% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutX {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutY {
0% {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
100% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes lightSpeedIn {
0% {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
opacity: 1;
}
100% {
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
0% {
opacity: 1;
}
100% {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateIn {
0% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
@keyframes rotateInUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: none;
transform: none;
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
@keyframes rotateOut {
0% {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
100% {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
0% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
0% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
100% {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%, 60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%, 80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
100% {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-name: hinge;
animation-name: hinge;
} @-webkit-keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
@keyframes rollIn {
0% {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none;
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
} @-webkit-keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
@keyframes rollOut {
0% {
opacity: 1;
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInDown {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInLeft {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInRight {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomInUp {
0% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
60% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
100% {
opacity: 0;
}
}
@keyframes zoomOut {
0% {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3);
}
100% {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
transform: scale(.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(-2000px, 0, 0);
transform: scale(.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
transform: scale(.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0);
}
100% {
opacity: 0;
-webkit-transform: scale(.1) translate3d(2000px, 0, 0);
transform: scale(.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
animation-timing-function: cubic-bezier(0.550, 0.055, 0.675, 0.190);
}
100% {
opacity: 0;
-webkit-transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInDown {
0% {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInLeft {
0% {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInRight {
0% {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes slideOutDown {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes slideOutLeft {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes slideOutRight {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes slideOutUp {
0% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
100% {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
} .lang-popup {
background:white;
border:1px solid black;
border-radius:5px;
display:none;
font-size: 2rem;
line-height: 2.5rem;
padding:2em;
}
.lang-popup h2 {
border-bottom: 1px solid grey;
}
.lang-popup .region-user {
border-bottom: 1px solid grey;
padding: 20px 0 40px;
}
.lang-popup .region-user h3 {
}
.lang-popup .region {
clear: left;
float: left;
padding-top: 20px;
width: 300px;
}
@media only screen and (min-width:768px) {
.lang-popup .region {
clear: none;
}
.lang-popup .region:nth-child(2n+3) {
clear: left;
}
}
.lang-popup h3{
margin-top: 2.5rem;
}
.lang-popup ul {
margin: 0 1rem;
}
.lang-popup li {
list-style: none;
margin-bottom: .5rem;
}
.lang-popup a {
border-bottom: 1px dotted #333;
}
.lang-popup a:hover {
color: #23282A;
border-bottom: 1px solid #1165BA;
}
.lang-popup .lang-natural {
color: #1165BA;
font-size: .9em;
}
.lang-popup .lang-user {
color: #1165BA;
}  [type="checkbox"]:not(:checked),
[type="checkbox"]:checked {
position: absolute;
left: -9999px;
}
[type="checkbox"]:not(:checked) + label,
[type="checkbox"]:checked + label {
position: relative;
padding-left: 25px;
cursor: pointer;
} [type="checkbox"]:not(:checked) + label:before,
[type="checkbox"]:checked + label:before {
content: '';
color:white;
position: absolute;
left:0; top: -2px;
width: 18px; height: 18px;
padding: 1px;
border: 1px solid #aaa;
background: black;
border-radius: 2px;
box-shadow: inset 0 1px 2px rgba(0,0,0,.3)
} [type="checkbox"]:not(:checked) + label:after,
[type="checkbox"]:checked + label:after {
content: ' X';
position: absolute;
top: -1px; left: 2px;
font-size: 20px;
line-height: 0.8;
color: white;
transition: all .2s;
} [type="checkbox"]:not(:checked) + label:after {
opacity: 0;
transform: scale(0);
}
[type="checkbox"]:checked + label:after {
opacity: 1;
transform: scale(1);
} [type="checkbox"]:disabled:not(:checked) + label:before,
[type="checkbox"]:disabled:checked + label:before {
box-shadow: none;
border-color: #bbb;
background-color: #ddd;
}
[type="checkbox"]:disabled:checked + label:after {
color: #999;
}
[type="checkbox"]:disabled + label {
color: #aaa;
} [type="checkbox"]:checked:focus + label:before,
[type="checkbox"]:not(:checked):focus + label:before {
border: 1px dotted grey;
} label:hover:before {
border: 1px solid #4778d9!important;
} .email-popup {
background:white;
border:1px solid black;
border-radius:5px;
display:none;
font-size: 2rem;
line-height: 2.5rem;
padding: 6rem 1rem 1rem;
margin:5rem 1rem 1rem 1rem;
max-width: 400px;
}
.email-popup .email-popup-close {
position: absolute;
top: 10px;
right: 15px;
color: white;
z-index: 999;
font-size: 1.8rem;
line-height: 2rem;
text-transform: uppercase;
cursor: pointer;
}
.email-popup h2 {
position: absolute;
top:0;
left:0;
padding:1rem;
background: black;
color:white;
text-transform: uppercase;
width:100%;
font-size: 2rem;
line-height: 2rem;
margin: 0;
}
.email-popup h3 {
line-height: 2.3rem; }
.email-popup a {
background: white url(//bluesound-deutschland.de/wp-content/themes/bluesound/img/next_step_arrow_blue.png) no-repeat right;
background-size: 20px;
border: none;
color: #7A95A7;
font-size: 1.6rem;
margin-bottom: 0.5rem;
padding-right: 3rem;
}
.email-popup a:hover  {
border: none;
color: #23282A;
}
.email-popup .email-popup-footer {
display: none;
}
.email-popup .email-popup-form input, .email-popup .email-popup-form select {
color: black;
font-size: 1.2rem;
font-weight: bold;
margin: 5px 0;
padding: 8px;
width: 100%;
} .bundle-popup {
background:white;
border:1px solid black;
border-radius:5px;
display:none;
font-size: 2rem;
line-height: 2.5rem;
padding: 6rem 1rem 1rem;
margin:5rem 1rem 1rem 1rem;
max-width: 800px;
}
.bundle-popup .bundle-popup-close {
position: absolute;
top: 10px;
right: 15px;
color: white;
z-index: 999;
font-size: 1.8rem;
line-height: 2rem;
text-transform: uppercase;
}
.bundle-popup h1 {
position: absolute;
top:0;
left:0;
padding:1rem;
background: black;
color:white;
text-transform: uppercase;
width:100%;
font-size: 2rem;
line-height: 2rem
}
.bundle-popup .bundle-popup-footer {
display: none;
}
.bundle-popup .bundle-popup-form input, .bundle-popup .bundle-popup-form select {
color: black;
font-size: 1.2rem;
font-weight: bold;
margin: 5px 0;
padding: 8px;
width: 100%;
}
.bundle-popup h2 {
text-transform: uppercase;
}
.bundle-popup h3{
line-height: 2.3rem;
}
@media screen and (min-width: 660px) {
.bundle-popup-text {
float: left;
width: 50%;
padding: 25px 25px 0px 25px;
}
.bundle-popup-image {
float: right;
width: 50%;
}
.bundleandsave {
font-size: 2em;
margin-top: 0px;
}
.bundle-popup-image img {
width: 100%;
padding: 25px 45px 5px 15px;
}
}
@media screen and (max-width: 659px) {
.bundle-popup-text {
width: 100%;
padding: 25px 25px 0px 25px;
}
.bundle-popup-image {
width: 100%;
}
.bundleandsave {
font-size: 1.5em;
margin-top: 0px;
}
.bundle-popup-image img {
width: 100%;
padding: 25px 25px 25px 15px;
}
} ::-webkit-input-placeholder {
color:black;
}
::-moz-placeholder {
color:black;
}
:-moz-placeholder {
color:black;
}
:-ms-input-placeholder {
color:black;
}
input[placeholder] {
text-overflow:ellipsis;
}
input::-moz-placeholder {
text-overflow:ellipsis;
}
input:-moz-placeholder {
text-overflow:ellipsis;
}
input:-ms-input-placeholder {
text-overflow:ellipsis;
}
.email-popup .popup-form-item.full, .email-popup .popup-form-select.full {
clear: both;
padding-top: 1px;
}
.email-popup .popup-form-item.half {
width:50%;
float:left;
padding-right:4px;
}
.email-popup .popup-form-item.half.last {
padding-right:0;
padding-left: 4px;
}
.email-popup .popup-form-item label, .email-popup .popup-form-select label {
display:none;
color: #23282a;
font: 600 1.4rem/1.4rem 'Uni-Sans-Book', sans-serif;
margin: 0.6rem 0;
text-transform: uppercase;
}
.email-popup .email-popup-form p {
display:block;
font-size: 1.4rem;
}
.email-popup p, .email-popup-list {
display:none;
}
#mc-submit {
background: black;
border: 0;
color: white;
width: inherit;
padding: 10px 30px;
}
#mc-submit:disabled {
background: #777;
}
.email-popup .popup-form-check {
padding: 10px 0;
}
.email-popup .popup-captcha {
padding-bottom: 12px;
}
.email-popup .popup-confirmation {
padding: 5rem 2rem;
}
.email-popup .popup-confirmation h2 {
color: #aaa;
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0;
text-transform: uppercase;
border:none;
}
.email-popup .popup-confirmation h3 {
color: #23282a;
font: 5rem/5rem 'Uni-Sans-Book', sans-serif;
margin: 0;
padding:0;
}
.email-popup .popup-confirmation h4 {
clear: left;
color: #23282a;
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
font-weight: bold;
margin: 1rem 0;
}
.email-popup .popup-confirmation p {
display: block;
}
.email-popup .popup-confirmation a {
background: none;
}
.email-popup .popup-confirmation h3 {
padding:1rem 0 2rem 0;
}
.email-popup .popup-img {
padding:2rem 0;
max-width: 386px;
}
.mc-error {
color: red;
}
@media only screen and (min-width:768px) {
.mcontainer
{
padding: 0 20px;
}
::-webkit-input-placeholder {
color: #333;
}
::-moz-placeholder {
color: #333;
}
:-moz-placeholder {
color: #333;
}
:-ms-input-placeholder {
color: #333;
}
input[placeholder] {
color: #333;
}
input::-moz-placeholder {
color: #333;
}
input:-moz-placeholder {
color: #333;
}
input:-ms-input-placeholder {
color: #333;
}
.email-popup {
margin: 2rem;
max-width: 800px;
}
.email-popup .email-popup-text {
float:left;
width: 53%;
padding: 0 4rem 0 2rem;
}
.email-popup .popup-form-item label, .email-popup .popup-form-select label {
display:block;
}
.email-popup p, .email-popup-list, .email-popup .email-popup-footer {
display: block;
}
.email-popup .email-popup-footer {
clear:both;
padding-top: 1rem;
border-top: 1px solid #ccc;
}
.email-popup-list {
padding: 3px 3px 3px 0;
}
.email-popup-list h4 {
font-weight: bold;
margin-top: 1.5rem;
}
.email-popup-list ul {
margin: 0 0.5rem 2rem 0;
list-style: none;
padding: 0;
}
.email-popup-list li {
list-style: none;
margin-bottom: 0;
font-size: 1.6rem;
}
.email-popup-list li:before {
content: '>';
padding-right: 10px;
}
.email-popup .email-popup-form {
float:left;
width: 47%;
padding: 0 2rem 2rem;
}
.email-popup h3{
margin-top: 2.5rem;
}
.email-popup ul {
margin: 0 1rem;
}
.email-popup li {
list-style: none;
margin-bottom: .5rem;
}
.email-popup .email-popup-footer p {
font-size: 1.2rem;
}
.email-popup .email-popup-footer .footnote {
color:#7A95A7;
}
.email-popup .popup-confirmation h3 {
float:left;
width:45%;
}
.email-popup .popup-img {
float:right;
width: 55%;
padding: 0 0 0 2rem;
}
.email-popup .popup-confirmation p {
width:45%;
}
}
@media only screen and (min-width:1024px) {
.email-popup {
margin: 5rem;
max-width: 1000px;;
}
.email-popup h2 {
display: block;
}
.email-popup .email-popup-text {
width: 60%;
}
.email-popup .email-popup-form {
width: 40%;
}
}
.email-popup.single {
display: block;
position: relative;
overflow: hidden;
border: none;
margin: 0 auto;
}  .gen_one {
margin-top: 10px !important;
padding-top: 10px !important;
border-top: 1px solid #000 !important;
} @media screen and (min-width: 721px) {
.product-downloads-section {
width: 33%;
float: left;
margin-top: 20px;
margin-bottom: 30px;
}
}
@media screen and (max-width: 720px) {
.product-downloads-section {
width: 100%;
margin-top: 30px;
}
}
.product-downloads-icon {
height: 25px;
float: left;
margin-right: 20px;
}
@media screen and (min-width: 721px) {
.product-downloads-icon {
margin-top: 8px;
}
}
.product-downloads-header {
margin-bottom: 5px;
margin-top: 12px;
}
.product-downloads-link {
margin-left: 50px;
color:#777;
}
.product-downloads-link a {
color:#777;
font: 300 1.6rem/2rem 'Uni-Sans-Book', sans-serif;
}
.footer-menu li {
padding: 0px !important; }
.footernewline {
width: 100%;
padding: 0px !important;
height: 0px !important;
}
.footernewline a {
padding: 0px;
height: 0px;
}
.disabled {
pointer-events: none;
cursor: default;
} .header {
background-color: #0f131e;
}
main#home{
background-color: white;
}
main#home h2{
font-size: 30px;
font-weight: 800;
}
main#home p{
font-size: 14px;
line-height: normal;
}
main#home .width-restrict{
max-width: 900px;
margin-left: auto;
margin-right: auto;
}
.home-add-padding10{
padding-right: 10px;
padding-left: 10px;
}
main#home section#selling{
padding: 60px 0px;
text-align: center;
} .schwein-text{
font-size: 4vw;
position: absolute;
display: inline-block;
left: 21%;
top: 40%;
font-weight: 800;
color: white;
text-align: center;
line-height: normal;
width: 62vw;
}
.home-hero-container{
width: 100%;
position: relative;
box-sizing: border-box;
background-color: black;
} main#home .home-award{
text-align: center;
}
main#home .home-award p{
margin: 15px 0px;
}
main#home section#Award{
padding: 60px 0px;
border-bottom: 1px solid lightgray;
} .tabbed-video-section{
position: relative;
width: 100%;
max-width: 1920px;
margin: 0 auto;
}
.tab-section{
width: 300px;
position: absolute;
top: 0;
right: 0;
border:1px solid lightgray;
margin-top: 10%;
margin-right: 3.5%;
}
.tab-section-titles{
cursor: pointer;
display: flex;
flex-direction: row;
justify-content: space-around;
}
.tab-title{
width: 33.3%;
text-align: center;
padding-top: 10px;
background-color: lightgray;
}
.tab-title.show{
background-color: white;
}
.tab-title h4{
font-weight: 800;
} .tab-content{
display: none;
}
.tab-content.show{
display: block;
background-color: white;
padding: 20px;
}
.video-section{
width: 100%;
height: calc((100vw) * 0.4444);
background-size: 100%; top: 0;
left: 0;
max-height: 838px; }
main#home .tab-section p{
text-align: left;
}
main#home h2.home-video-title{
position: absolute;
top: 8%;
left: 7%;
} main#home .video-match-products{
display: flex;
justify-content: flex-start;
align-items: center;
width: 100%;
margin-top: 10px;
}
main#home .matching-product{
text-align: center;
max-width: 100px;
padding: 10px;
padding-bottom: 0px;
}
main#home .matching-product img{
width: 65px;
}
main#home .matching-product h4{
font-weight: 800;
font-size: 9px;
} main#home section#video-banner{
overflow: auto;
}
main#home section#video-banner #video-banner-containers{
position: relative;
overflow: hidden;
}
main#home section#video-banner img.video-banner-background{
width: 100%;
position:relative;
float: left;
min-width: 500px;
overflow: hidden;
}
main#home section#video-banner .video-banner-cover{
left: 0;
position:absolute;
text-align:center;
top: calc((100vw) * 0.1);
width: 100%;
}
main#home section#video-banner h2{
color: white;
}
main#home #playpause{
width: 100px;
} main#home section#difference {
padding: 60px 0px;
}
main#home .difference-containers{
text-align: center;
}
main#home #difference-tech-container{
display: flex;
max-width: 1000px;
margin: 30px auto;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: center;
}
main#home .tech-container{
width: 25%;
min-width: 150px;
}
main#home .tech-container img.tech-icons-image{
width: 100px;
}
main#home .tech-container .tech-icons-text{
font-size: 14px;
margin-top: 10px;
color:black;
}
main#home .tech-container .tech-icons-sub-text{
font-size: 12px;
margin-top: 5px;
color:black;
} main#home section#features{
padding: 60px 0px;
background-color: #f4f4f4;
}
main#home .home-featue-containers{
display: flex;
align-items: center;
justify-content: space-around;
min-width: 1334px;
max-width: 1600px;
margin-right: auto;
margin-left: auto;
}
main#home .home-feature-content{
max-width: 300px;
text-align: left;
display: block;
}
main#home .home-feature-content p{
text-align: left;
}
main#home section#features img{
max-width: 720px;
} main#home section#posts{
padding: 60px 0px;
border-bottom: 1px solid #f4f4f4
}
main#home section#posts .post-flex-container{
display: flex;
justify-content: space-between;
flex-wrap: wrap;
width: 100%;
}
main#home section#posts .post-container {
max-width: 250px;
text-align: left;
}
main#home section#posts .post-container p{
max-width: 250px;
text-align: left;
font-size: 12px;
min-height: 100px;
}
main#home section#posts .post-container h3{
margin-top: 10px;
font-weight: 800;
min-height: 80px;
}
main#home section#posts .image-div{
height: 160px;
background-size: cover;
}
main#home .button-btn-cart, main#home .bls-standard-btn{
min-width: unset;
line-height: normal;
} main#home section#selling .selling-flex-container{
display: flex;
justify-content: space-around; }
main#home section#selling .selling-container{
background-color: #f4f4f4;
width: 400px;
padding: 20px;
margin: 10px;
}
main#home section#selling > h2{
margin-bottom: 60px;
}
main#home section#selling .selling-container h2{
font-weight: 100;
}
main#home .popup__overlay {
display: none;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
text-align: center;
z-index: 100;
}
main#home .popup__overlay:after {
display: inline-block;
height: 100%;
width: 0;
vertical-align: middle;
content: "";
}
main#home .popup {
display: inline-block;
position: relative;
width: 80%;
height: 70%; padding: 20px;
border: 1px solid black;
background: black;
color: white;
vertical-align: middle;
}
main#home .popup-form__row {
margin: 1em 0;
}
main#home .popup__close {
display: block;
position: absolute;
top: 1px;
right: 1px;
width: 12px;
height: 12px;
padding: 8px;
cursor: pointer;
text-align: center;
font-size: 12px;
line-height: 12px;
color: rgba(0, 0, 0, 0.4);
text-decoration: none;
font-weight: bold;
}
main#home .popup__close:hover {
color: #eea200;
}
main#home iframe {
width: 100%;
height: 100%;
}
@media screen and (max-width: 900px){
.tab-section{
position: relative;
width: 100%;
margin: 0 auto;
}
main#home h2.home-video-title{
top: 15px;
} main#home .home-featue-containers{
flex-direction: column-reverse;
min-width: unset;
}
main#home section#features img{
max-width: unset;
width: 100%;
padding: 10px;
}
main#home .home-feature-content{
max-width: unset;
}
}
@media screen and (max-width: 700px){
main#home #playpause {
width: 70px;
}
}
@media screen and (max-width: 500px){ main#home section#posts .post-container {
max-width: unset;
width: 100%;
}
main#home section#posts .image-div{
height: 250px;
}
main#home section#posts .post-container p{
max-width: unset;
min-height: unset;
}
main#home section#selling .selling-flex-container{
flex-direction: column;
}
main#home section#selling .selling-container{
width: unset;
}
main#home #playpause {
width: 50px;
}
main#home section#video-banner h2{
font-size: 20px;
}
main#home section#video-banner .video-banner-cover{
top: unset;
}
} .footer {
background-color: #0f131e;
}
footer.footer  #footer-top-flex{
display: flex;
flex-direction: row;
justify-content: space-between;
}
footer.footer ul.footer-list{
-moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
footer.footer  #footer-bottom-flex{
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding-top: 70px; }
.footer-flex-child{
margin-right: 10px;
}
.footer-flex-child:first-of-type{
max-width: 450px;
}
footer.footer .footer-copyright{
width: unset;
}
footer.footer .footer-social{
padding: 0px;
}
footer.footer .footer-menu li{
display: flex;
}
footer.footer .footer-menu{
float: unset;
padding: unset;
}
footer.footer .footer-menu a{
text-align: left;
text-decoration: none;
}
footer.footer .footer-images-contianer{
width: 50px;
height: 50px;
margin: 5px;
}
footer.footer .footer-icons{
display: flex;
width: unset;
float: unset;
flex-wrap: wrap;
}
footer.footer .footericon{
height: unset;
width: 100%;
padding: unset;
}
.footer-copyright p{
margin: 0px;
}
h4.footer-mc-caption{
padding: 0px;
text-align: left;
font-size: 14px;
}
#mc_trigger {
padding: 10px;
width: 100%;
max-width: 340px;
justify-content: center;
}
#mc_trigger img{
width: 50px;
padding-right: 10px;
}
.footer-menu ul {
list-style-type: none;
margin:0;
padding:0;
background-color: unset;
color:white;
font: 1.4rem/1.4rem 'Uni-Sans-Book', sans-serif;
}
.logo-sm-bottom{
width: 100%;
height: unset;
}
.footer-logo-bottom{
display: block;
float: left;
width: 40px;
margin-right: 40px;
}
@media screen and (max-width: 900px){
.schwein-text{
font-size:  5.5vw;
position: absolute;
display: inline-block;
left:21%;
top: 40%;
font-weight: 800;
color: white;
}
.footer-flex-child{
margin-top: 30px;
}
.footer-flex-child:first-of-type{
margin-top: 15px;
}
footer.footer  #footer-top-flex{
flex-direction: column;
}
footer.footer .footer-flex-child{
width: 100%;
}
.footer-icons{
display: flex;
justify-content: space-around;
width: 100%;
align-items: center;
}
footer.footer .footer-menu a{
padding: 0 5px;
}
.footer-subscribers {
float: right;
text-align: left;
}
h4.footer-mc-caption{
text-align: center;
}
#mc_trigger {
margin-right: auto;
margin-left: auto;
}
}
@media screen and (max-width: 700px) {
footer.footer  #footer-bottom-flex{
flex-direction: column;
padding-top: 45px;
}
footer.footer .footer-images-contianer{
width: 40px;
height: 40px;
margin: 5px;
}
#mc_trigger, .footer-bundle-trigger {
width: 100%;
justify-content: center;
}
.footer-logo-bottom{
margin-right: 20px;
}
footer.footer .footer-social {
padding: 0px;
margin-bottom: 45px;
}
} div#accessories-section{
display: flex;
flex-wrap: wrap;
justify-content: center;
}
div.bottomprodscol{
height: unset;
width: 320px;
}
.bottomprodscol img{ height: unset !important;
} .cli-plugin-button, .cli-plugin-button:visited {
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
-moz-box-shadow: unset;
-webkit-box-shadow: unset;
box-shadow: unset;
background:unset;
border-bottom:0;
}
#cookie-law-info-bar {
padding: 16px 5px;
} .ca .hide-ca,
.eu .hide-eu,
.gb .hide-gb,
.us .hide-us,
.zz .hide-zz {
display: none !important;
} .clearfix {
float: none;
clear: both;
}
.testssection {
padding: 80px 1.5%;
overflow: hidden;
}
.testsbox {
position: relative;
display: block;
min-height: 220px;
width: 29%;
padding: 1%;
margin: 2%;
background-repeat: no-repeat;
background-size: cover;
float: left;
text-decoration: none !important;
}
@media only screen and (max-width: 986px) {
.testsbox {
width: 46%;
}
}
@media only screen and (max-width: 640px) {
.testsbox {
width: 96%;
}
}
.testsbox:hover {
box-shadow: inset 0 0 0 1px #777;
}
.testsbox .date {
font-size: 13px;
color: #777;
}
.testsbox h2 {
width: 90%;
text-decoration: none;
font-size: 20px;
font-weight: 700;
}
.testsbox .morelink {
font-size: 16px;
}
.testsbox .testlogo {
position: absolute;
right: 10px;
bottom: 10px;
}
.singletest .date {
color: #777;
}
.singletestlogo {
margin: -3px -9px 0 0;
float: right;
}
#information .newscopy {
font-size: 16px !important;
line-height: 18px !important;
margin: 0 0 10px 0;
}
#tests-section {
padding: 70px 0;
}
#tests-section .tn_left {
width: 45%;
float: left;
}
#tests-section .tn_right {
width: 45%;
float: right;
}
@media only screen and (max-width: 986px) {
#tests-section .tn_left, #tests-section .tn_right {
width: 100%;
padding: 0 20px;
float: none;
}
.secondhead {
padding: 30px 0 0 0;
}
}
.tn_left tr {
display: block;
padding: 0 0 15px 0;
}
.ptestlogo {
padding: 0 10px 0 0;
}
.ptestlogo img {
width: 40px;
height: auto;
}
.ptesttitle {
color: #5C7E96;
font-size: 16px;
line-height: 18px;
}
.pnewstitle {
color: #5C7E96;
font-size: 16px;
line-height: 18px;
}
.ptesttitle:hover, .pnewstitle:hover {
color: #23282a;
}
#tests-section h3 {
color: #23282a;
font: 2rem/2rem 'Uni-Sans-Book', sans-serif;
margin: 0 0 1rem 0; 
font-weight: 800;
font-size: 35px;
line-height: 1;
text-transform: uppercase;
} .wpsl-direction-after {
font-size: 10px !important;
color: #777;
}
#wpsl-stores p, #wpsl-stores div, #wpsl-stores span, #wpsl-stores a {
font-size: 15px !important;
line-height: 19px !important;
}
#wpsl-stores p {
margin: 0 !important;
padding: 0 !important;
}
#wpsl-stores, #wpsl-direction-details {
background-color: #fff !important;
}
#wpsl-radius {
width: auto !important;
}
#wpsl-stores ul li, #wpsl-direction-details ul li, 
#wpsl-radius-dropdown option ul li, #wpsl-results-dropdown ul li {
background-image: none !important;
}
#wpsl-search-wrap div {
margin-right: 0 !important;
}
#wpsl-search-btn {
height: auto !important;
padding: 12px 20px 10px 20px !important;
margin: 0 0 0 12px !important;
font-size: 14px !important;
font-weight: 700 !important;
line-height: 14px !important;
color: #fff !important;
background: #7A95A7 !important;
border: 1px solid #7A95A7 !important;
border-radius: 0 !important;
text-transform: uppercase !important;
cursor: pointer !important;
}
#wpsl-search-btn:hover {
background: #000 !important;
border: 1px solid #000 !important;
}
#wpsl-gmap {
border: 1px solid #fff;
}
@media only screen and (max-width: 640px) {
#wpsl-gmap {
max-height: 350px;
}
}
#wpsl-search-input {
padding: 9px 12px !important;
margin-right: 15px !important;
}
#wpsl-search-wrap label {
font-size: 14px !important;
line-height: 16px !important;
margin: 13px 0 0 0;
white-space: nowrap !important;
}
.wpsl-dropdown {
padding-right: 45px !important;
min-width: 110px;
font-size: 15px;
margin-left: 7px !important;
margin-right: 15px !important;
}
.wpsl-input, #wpsl-radius {
padding-right: 12px !important;
}
.wpsl-input div {
margin: 0 !important;
}
#wpsl-wrap form input[type=text] {
line-height: 16px;
}
.wpsl-country {
display: none;
}
.master {
font-weight: 700;
color: #7A95A7;
float: right;
}
.thecontent table tr td img {
height: auto !important;
}