/* COLORS
   ================================================== */
/* @red-idw: #d44457;
@red-idw-hover: #EE5E71;
@grey-strong-idw: #2d2d37;
@grey-font-idw:#232323;
   ================================================== */
/* latin-ext  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 300;
    src: local('Raleway Light'), local('Raleway-Light'), url(https://fonts.gstatic.com/s/raleway/v10/ZKwULyCG95tk6mOqHQfRBCEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 300;
    src: local('Raleway Light'), local('Raleway-Light'), url(https://fonts.gstatic.com/s/raleway/v10/-_Ctzj9b56b8RgXW8FArifk_vArhqVIZ0nv9q090hN8.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin-ext  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    src: local('Raleway'), local('Raleway-Regular'), url(https://fonts.gstatic.com/s/raleway/v10/yQiAaD56cjx1AooMTSghGfY6323mHUZFJMgTvxaG2iE.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 400;
    src: local('Raleway'), local('Raleway-Regular'), url(https://fonts.gstatic.com/s/raleway/v10/0dTEPzkLWceF7z0koJaX1A.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin-ext  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 700;
    src: local('Raleway Bold'), local('Raleway-Bold'), url(https://fonts.gstatic.com/s/raleway/v10/WmVKXVcOuffP_qmCpFuyzSEAvth_LlrfE80CYdSH47w.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin  */
@font-face {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 700;
    src: local('Raleway Bold'), local('Raleway-Bold'), url(https://fonts.gstatic.com/s/raleway/v10/JbtMzqLaYbbbCL9X6EvaI_k_vArhqVIZ0nv9q090hN8.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin-ext  */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v15/Pru33qjShpZSmG3z6VYwnRJtnKITppOI_IvcXXDNrsc.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin  */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 300;
    src: local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v15/Hgo13k-tfSpn0qi1SFdUfVtXRa8TVwTICgirnJhmVJw.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
/* latin-ext  */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v15/Fcx7Wwv8OzT71A3E1XOAjvesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
    unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin  */
@font-face {
    font-family: 'Roboto';
    font-style: normal;
    font-weight: 400;
    src: local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v15/CWB0XYA8bzo0kSThX0UTuA.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
body {
    font-size: 1.4rem;
    font-family: 'Roboto', sans-serif;
    color: #333333;
    margin: 0;
}
html {
    font-size: 62.5%;
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block
}
audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}
audio:not([controls]) {
    display: none;
    height: 0;
}
[hidden],
template {
    display: none
}
a {
    background-color: transparent
}
a:active,
a:hover {
    outline: 0
}
abbr[title] {
    border-bottom: 1px dotted
}
b,
strong {
    font-weight: 700
}
dfn {
    font-style: italic
}
h1 {
    font-size: 2em;
    margin: .67em 0;
}
mark {
    background: #ff0;
    color: #000;
}
small {
    font-size: 80%
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup {
    top: -.5em
}
sub {
    bottom: -.25em
}
img {
    border: 0
}
svg:not(:root) {
    overflow: hidden
}
figure {
    margin: 1em 40px
}
hr {
    box-sizing: content-box;
    height: 0;
}
pre {
    overflow: auto
}
code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0;
}
button {
    overflow: visible
}
button,
select {
    text-transform: none
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}
button[disabled],
html input[disabled] {
    cursor: default
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0;
}
.hidden {
    display: none
}
form input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #fff inset;
    box-shadow: 0 0 0 1000px #fff inset;
    -webkit-text-fill-color: #a9a9a9 !important;
    border: 1px solid rgba(200, 200, 200, 1.00);
}
.fancybox-inner small {
    font-family: 'Roboto', sans-serif;
    max-width: 350px;
    margin: 1% auto;
    display: block;
}
.fancybox-inner .first-title,
.title-lightbox {
    text-align: center;
    font-size: 2.5rem;
    font-family: 'Roboto', sans-serif;
    font-weight: 100;
    text-transform: uppercase;
    display: block;
}
.fancybox-inner input {
    margin: auto;
}
.fancybox-inner input[type='text'],
.fancybox-inner input[type='password'],
.fancybox-inner input[type='button'] {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 10px;
    margin: 1% auto;
    border: 1px solid rgba(200, 200, 200, 1.00);
    max-width: 350px;
}
.fancybox-inner article {
    padding: 20px;
    box-sizing: border-box;
}
.fancybox-inner p {
    text-align: center;
}
.fancybox-inner .wrapper a {color:#d44457; } 
.fancybox-inner .wrapper p {text-align: left;}
.fancybox-inner .wrapper small {text-align: left; max-width: none;}

.fancybox-inner hr {
    border: 0;
    height: 1px;
    margin: 2rem 0;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
}
.wrapper {
    max-width: 1500px;
    margin: auto !important;
}
.wrapper .marketing-picture {
    margin: 0
}
.content-2 {
    min-height: 250px
}
input {
    line-height: normal
}
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto
}
input[type="search"] {
    -webkit-appearance: textfield;
    box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}
fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em;
}
legend {
    border: 0;
    padding: 0;
}
textarea {
    overflow: auto
}
optgroup {
    font-weight: 700
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
td,
th {
    padding: 0
}
*,
::after,
::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
a {
    text-decoration: none
}
h1 a {
    color: #fff;
    font-weight: 700;
    padding: 10px;
}
img {
    max-width: 100%
}
.custom3 img,
.custom1 img {
    width: 100%
}
.cd-header {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 50px;
    background-color: #21272c;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.baseline {
    background-color: #d44457;
    color: #fff;
    margin: 0 !important;
    text-transform: uppercase;
}
.baseline h1 {
    font-size: 2rem;
    text-align: center;
    font-weight: 100;
    margin: 0;
    padding: 10px 0;
}
.black-btn {
    border: 1px solid #333
}
#cd-logo {
    float: left;
    margin: 13px 0 0 5%;
}
#cd-logo img {
    display: block
}
.my-close-button {
    padding: 5px 10px !important;
    background-color: #d44457;
    color: #fff;
}
.button-flat {
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    position: relative;
    padding: .8em 1.4em;
    padding-right: 4.7em;
    background: #d44457;
    border: none;
    color: #fff !important;
    transition: .2s;
}
.button-flat:before,
.button-flat:after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    padding-top: inherit;
    padding-bottom: inherit;
    width: 2.8em;
    content: "\00a0";
    font-family: 'Idealwine', sans-serif;
    font-size: 1.2em;
    text-align: center;
    transition: .2s;
}
.icon-truck {
    font-family: 'Idealwine', sans-serif !important
}
#content-login .log:before {
    background: #2d2d37
}
.button-flat:before {
    background-color: rgba(0, 0, 0, 0.1)
}
.arrow:hover {
    background: #EE5E71
}
.arrow:active {
    background: #d44457
}
.arrow:after {
    content: "\f019"
}
.log {
    padding-left: 10px !important;
    box-sizing: border-box !important;
}
.arrow:hover:after {
    -webkit-animation: bounceright .3s alternate ease infinite;
    animation: bounceright .3s alternate ease infinite;
}
.log {
    background: #2d2d37
}
.log:after {
    content: "\f015"
}
.log:hover:after {
    -webkit-animation: none;
    -webkit-transform: scale(1.4);
    animation: none;
    transform: scale(1.4);
}
.log:hover {
    background: #7D7D83
}
.log:active {
    background: #64646A;
    outline: none;
}
.wrapper p {
    font-size: 1.5rem;
    margin: 5px 0;
    font-weight: 400;
}
.wrapper li {
    font-size: 1.5rem;
    font-weight: 400;
}
.bg-img .button-flat {
    margin: auto
}
.bg-img {
    background: url(/spring_modules/home/img/map-home.jpg) no-repeat;
    min-height: 200px;
}
.blog-flux figure {
    max-width: 80%;
    height: 98px;
    overflow: hidden;
    position: relative;
    margin: 0;
    padding: 0;
    margin-left: 5px;
}
.blog-flux img {
    width: 100%;
    transition: all 2s ease-in-out;
    -webkit-transition: all 20s linear;
    /** Chrome & Safari **/
    -moz-transition: all 20s linear;
    /** Firefox **/
    -o-transition: all 20s linear;
    /** Opera **/
}
.blog-flux img:hover {
    transform: scale(2);
    -webkit-transform: scale(2);
    -o-transform: scale(2);
    -moz-transform: scale(2);
}
.blog-flux a {
    font-weight: 700;
    color: #d44457;
    float: right;
}
.blog-flux h4 {
    font-size: 1.8rem;
    margin: 5px 0;
    max-height: 45px;
    overflow: hidden;
}
.blog-flux p {
    max-height: 55px;
    overflow: hidden;
}
.blog-flux time {
    background-color: #2d2d37;
    color: #fff;
    display: block;
    max-width: 20%;
    padding: 20px 10px;
    font-weight: 300;
    text-align: center;
    float: left;
}
.blog-flux time hr {
    background-image: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0))
}
.blog-flux time span {
    font-size: 2.5rem
}
footer {
    background: url(/spring_modules/template/img/item/roue.svg) no-repeat bottom right #2d2d37
}
.content-4 .span_4_of_12 {
    height: 680px;
    position: relative;
}
.content-4 .seemore {
    position: absolute;
    bottom: 0;
    right: 0;
}
.content-4 .button-flat {
    display: block;
    max-width: 220px;
}
.social-space a {
    width: 30px;
    display: block;
    text-decoration: none;
}
.lightTip {
    font-size: 1.1rem;
    background-color: #2d2d37;
    color: #fff;
    padding: 8px;
    vertical-align: middle;
    margin-top: -25px;
    box-sizing: border-box;
    text-transform: uppercase;
}
.lightTip .bottom {
    width: 0;
    position: absolute;
    margin-left: 38%;
    height: 0;
    border-style: solid;
    border-width: 15px 15px 0;
    border-color: #2d2d37 transparent transparent;
}
.chart li .bar:hover,
.chart li a:hover .bar {
    background-color: #EE5E71
}
.chart li a:before {
    color: #fff;
    left: 5px;
    position: absolute;
    font-size: 1.6rem;
    vertical-align: middle;
    top: 10px;
}
.social-space .light2Tip {
    left: -20px !important
}
.social-space .light2Tip .bottom {
    display: none
}
/* GROUPING
   ================================================== */
.group:before,
.group:after {
    content: "";
    display: table;
}
.group:after {
    clear: both
}
.grid figure {
    position: relative;
    overflow: hidden;
    margin: 10px 1%;
    min-width: 150px;
    max-width: 200px;
    max-height: 200px;
    height: auto;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}
.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: .8;
}
.grid figure figcaption {
    padding: 2em 0;
    color: #fff;
    text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
/* ===[ Anchor will cover the whole item by default ]=== */
/* ===[ For some effects it will show as a button ]=== */
.grid figure figcaption > a {
    z-index: 1000;
    font-size: 0;
    opacity: 0;
    color: #fff;
}
.grid figure h2 {
    word-spacing: -.15em;
    font-weight: 300;
}
.grid figure h2 span {
    font-weight: 800
}
.grid figure h2,
.grid figure p {
    margin: 0
}
.grid figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
}
figure.effect-jazz {
    background: -webkit-linear-gradient(-45deg, #333 0%, #333 100%);
    background: linear-gradient(-45deg, #333 0%, #333 100%);
}
figure.effect-jazz img {
    opacity: .9
}
figure.effect-jazz figcaption::after,
figure.effect-jazz img,
figure.effect-jazz p {
    -webkit-transition: opacity 0.35s, -webkit-transform .35s;
    transition: opacity 0.35s, transform .35s;
}
figure.effect-jazz figcaption::after {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    content: '';
    opacity: 0;
    -webkit-transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 0, 1);
    transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 0, 1);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
figure.effect-jazz h2,
figure.effect-jazz p {
    opacity: 1;
    -webkit-transform: scale3d(0.8, 0.8, 1);
    transform: scale3d(0.8, 0.8, 1);
}
figure.effect-jazz h2 {
    padding: 20px;
    background-color: rgba(0, 0, 0, 0.7);
    text-align: center !important;
    -webkit-transition: -webkit-transform .35s;
    transition: transform .35s;
}
figure.effect-jazz p {
    padding: .5em 2em;
    text-transform: none;
    font-size: .85em;
    opacity: 0;
}
figure.effect-jazz:hover img {
    opacity: .7;
    -webkit-transform: scale3d(1.05, 1.05, 1);
    transform: scale3d(1.05, 1.05, 1);
}
figure.effect-jazz:hover figcaption::after {
    opacity: 1;
    -webkit-transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 1, 1);
    transform: rotate3d(0, 0, 1, 45deg) scale3d(1, 1, 1);
}
figure.effect-jazz:hover h2,
figure.effect-jazz:hover p {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
}
/* GROUPING
   ================================================== */
.group:before,
.group:after {
    content: "";
    display: table;
}
.group:after {
    clear: both
}
/* SECTIONS
   ================================================== */
.section {
    clear: both;
    padding: 0;
    margin: 0;
}
/* COLUMN SETUP
   ================================================== */
.col {
    display: block;
    float: left;
    position: relative;
    margin: 1% 0 1% 5%;
}
.col:first-child {
    margin-left: 0
}
/* GROUPING
   ================================================== */
.group:before,
.group:after {
    content: "";
    display: table;
}
.group:after {
    clear: both
}
/* GRID OF TWELVE
   ================================================== */
.span_12_of_12 {
    width: 100%
}
.span_11_of_12 {
    width: 91.25%
}
.span_10_of_12 {
    width: 82.5%
}
.span_9_of_12 {
    width: 73.75%
}
.span_8_of_12 {
    width: 65%
}
.span_7_of_12 {
    width: 56.25%
}
.span_6_of_12 {
    width: 47.5%
}
.span_5_of_12 {
    width: 38.75%
}
.span_4_of_12 {
    width: 30%
}
.span_3_of_12 {
    width: 21.25%
}
.span_2_of_12 {
    width: 12.5%
}
.span_1_of_12 {
    width: 3.75%
}
::-webkit-input-placeholder {
    color: #333
}
:-moz-placeholder {
    color: #333
}
::-moz-placeholder {
    color: #333
}
:-ms-input-placeholder {
    color: #333
}
#tabs,
#tabs2,
#tabs3,
#tabs4,
#tabs5 {
    width: 100%;
    margin: 0 auto;
    margin-bottom: 0;
}
#tabs_container ul {
    padding-left: 0
}
#tabs_container {
    padding: 0;
    padding-left: 0;
    padding-top: 0;
    overflow: hidden;
    position: relative;
    min-height: 260px;
}
#tabs4 #tabs_container {
    min-height: 380px
}
.transition {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}
.make_transist {
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.hidescale {
    -webkit-transform: scale(0.9);
    -moz-transform: scale(0.9);
    -o-transform: scale(0.9);
    -ms-transform: scale(0.9);
    transform: scale(0.9);
    filter: alpha(opacity=0);
    opacity: 0;
}
.showscale {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}
.hideleft {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    filter: alpha(opacity=0);
    opacity: 0;
}
.showleft {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -o-transform: translateX(0px);
    -ms-transform: translateX(0px);
    transform: translateX(0px);
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}
.hidescaleup {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -ms-transform: scale(1.1);
    transform: scale(1.1);
    filter: alpha(opacity=0);
    opacity: 0;
}
.showscaleup {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
}
.hideflip {
    filter: alpha(opacity=0);
    opacity: 0;
    -webkit-transform: rotatey(-90deg) scale(1.1);
    -moz-transform: rotatey(-90deg) scale(1.1);
    -o-transform: rotatey(-90deg) scale(1.1);
    -ms-transform: rotatey(-90deg) scale(1.1);
    transform: rotatey(-90deg) scale(1.1);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.showflip {
    filter: alpha(opacity=100);
    opacity: 1;
    -webkit-transition-delay: .3s;
    -moz-transition-delay: .3s;
    -o-transition-delay: .3s;
    -ms-transition-delay: .3s;
    transition-delay: .3s;
    -webkit-transform: rotatey(0deg) scale(1);
    -moz-transform: rotatey(0deg) scale(1);
    -o-transform: rotatey(0deg) scale(1);
    -ms-transform: rotatey(0deg) scale(1);
    transform: rotatey(0deg) scale(1);
    -webkit-transform-origin: 50% 50%;
    -moz-transform-origin: 50% 50%;
    -o-transform-origin: 50% 50%;
    -ms-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
}
.tabulousclear {
    display: block;
    clear: both;
}
.wsmenuexpandermain {
    position: relative
}
.overlapblackbg {
    display: none
}
.bigmegamenu {
    position: relative;
    margin-top: 5px;
}
.wsmenu {
    color: #fff;
    padding: 0;
    float: right;
}
.wsmenu-list {
    text-align: left;
    margin: 0 auto;
    width: 100%;
    display: table;
    padding: 0;
}
.wsmenu-list > li > a .fa {
    display: inline-block;
    line-height: inherit;
    margin-right: 4px;
}
.wsmenu-list li ul li a .fa.fa-angle-double-right {
    margin: 0 3px 0 -4px
}
.wsmenu-list li a .arrow:after {
    border-left: 4px solid rgba(0, 0, 0, 0);
    border-right: 4px solid rgba(0, 0, 0, 0);
    border-top: 4px solid #b3b3b3;
    content: "";
    float: right;
    height: 0;
    margin: 0 0 0 9px;
    position: absolute;
    text-align: right;
    top: 22px;
    width: 0;
}
.wsmenu-list > li > a {
    display: block;
    padding: 0 14px;
    line-height: 44px;
    margin-top: 12px;
    text-decoration: none;
    position: relative;
}
.wsmenu-list > li:first-of-type > a {
    padding: 0
}
.wsmenu-list > li > form {
    margin-top: 5px
}
.wsmenu-list li a:hover .arrow:after {
    border-top-color: #b3b3b3
}
.wsmenu-list li a.active .arrow:after {
    border-top-color: #b3b3b3
}
.wsmenu-list li:hover>a .arrow:after {
    border-top-color: #b3b3b3
}
.megamenu iframe {
    width: 100%;
    margin-top: 10px;
    min-height: 200px;
}
.megamenu video {
    width: 100%;
    margin-top: 10px;
    min-height: 200px;
}
/* ===[ For megamenu desktop ]=== */
.wsmenu-list li:hover .megamenu {
    opacity: 1
}
.megamenu {
    width: 100%;
    left: 0;
    position: absolute;
    top: 60px;
    color: #000;
    z-index: 1000;
    margin: 0;
    text-align: left;
    padding: 14px;
    border: solid 1px #eee;
    background-color: #fff;
    opacity: 0;
    -o-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -o-transition: -o-transform 0.3s, opacity .3s;
    -ms-transition: -ms-transform 0.3s, opacity .3s;
    -moz-transition: -moz-transform 0.3s, opacity .3s;
    -webkit-transition: -webkit-transform 0.3s, opacity .3s;
}
.megamenu .title {
    border-bottom: 1px solid #CCC;
    padding: 9px 5px 9px 0;
    color: #424242;
    margin-bottom: 7px;
    text-align: left;
    height: 39px;
}
.link-list li {
    display: block;
    white-space: nowrap;
    text-align: left;
}
.link-list li a {
    line-height: 18px;
    text-align: left;
    padding: 6px 0;
    background: #fff !important;
    background-image: none !important;
    color: #666 !important;
    display: block;
    border-right: 1px solid #e7e7e7;
}
.megacollink {
    width: 23%;
    float: left;
    margin: 0 1%;
}
.megacollink li {
    display: block;
    white-space: nowrap;
    text-align: left;
}
.megacollink li a {
    line-height: 18px;
    text-align: left;
    padding: 8px 0;
    background: #fff !important;
    background-image: none !important;
    color: #666 !important;
    display: block;
    border-right: 1px solid #e7e7e7;
    background-color: #fff;
}
.megacolimage {
    width: 31.33%;
    float: left;
    margin: 0 1%;
}
.typographydiv {
    width: 100%;
    margin: 0;
}
.typographylinks {
    width: 25%;
    float: left;
    margin: 0;
}
.mainmapdiv {
    width: 100%;
    display: block;
    margin: 0;
}
.wsmenu-list .ad-style {
    width: 28%;
    float: right;
}
.wsmenu-list .ad-style a {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    line-height: normal !important;
    background-image: none !important;
}
.mobile-sub .megamenu .ad-style a:hover {
    background-color: transparent !important
}
.wsmenu-list .megamenu li:hover>a {
    background: transparent !important
}
.wsmenu-list .megamenu li a:hover {
    background: transparent !important;
    text-decoration: underline;
}
.wsmenu-list .megamenu li .fa {
    margin-right: 5px;
    text-align: center;
    width: 18px;
}
.mrgtop {
    margin-top: 15px
}
.show-grid div {
    padding-bottom: 10px;
    padding-top: 10px;
    background-color: #dbdbdb;
    border: 1px solid #e7e7e7;
    color: #6a6a6a;
    margin: 2px 0;
}
/* ===[ Form for desktop ]=== */
.halfdiv {
    width: 35%;
    right: 0 !important;
    left: auto;
}
.menu_form {
    width: 100%;
    display: block;
}
.menu_form input[type="text"] {
    width: 100%;
    border: 1px solid #e2e2e2;
    color: #000;
    padding: 8px 5px;
    margin-bottom: 8px;
}
.menu_form textarea {
    width: 100%;
    border: 1px solid #e2e2e2;
    color: #000;
    padding: 8px 5px;
    margin-bottom: 8px;
    min-height: 122px;
}
.menu_form input[type="submit"] {
    width: 25%;
    display: block;
    height: 28px;
    float: right;
    border: solid 1px #ccc;
    margin-right: 15px;
}
.menu_form input[type="button"] {
    width: 25%;
    display: block;
    height: 28px;
    float: right;
    border: solid 1px #ccc;
}
.megamenu .left.carousel-control {
    padding-top: 20%
}
.megamenu .right.carousel-control {
    padding-top: 20%
}
.carousel-inner .item img {
    width: 100%
}
.left {float: left;}

.megamenu .carousel-caption {
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.7);
    height: 31px;
    left: 0;
    padding: 7px 0;
    right: 0;
    width: 100%;
}
/* ===[ Animation ]=== */
.wsmenu-submenu .icon-clock {
    padding-right: 5px
}
.wsmenu-list li > .wsmenu-submenu {
    -o-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -o-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    visibility: hidden;
}
.wsmenu-list li:hover > .wsmenu-submenu {
    -o-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
    visibility: visible;
}
.wsmenu-submenu li > .wsmenu-submenu-sub {
    -o-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -o-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    visibility: hidden;
}
.wsmenu-submenu li:hover > .wsmenu-submenu-sub {
    -o-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
    visibility: visible;
}
.wsmenu-submenu-sub li > .wsmenu-submenu-sub-sub {
    -o-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -o-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    visibility: hidden;
}
.wsmenu-submenu-sub li:hover > .wsmenu-submenu-sub-sub {
    -o-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
    visibility: visible;
}
.wsmenu-list li > .megamenu {
    -o-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -o-transform: rotateX(-90deg);
    -moz-transform: rotateX(-90deg);
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    visibility: hidden;
}
.wsmenu-list li:hover > .megamenu {
    -o-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
    opacity: 1;
    visibility: visible;
}
/* ===[ Submenu CSS ]=== */
.wsmenu-submenu {
    position: absolute;
    top: 55px;
    z-index: 1000;
    margin: 0;
    padding: 2px;
    border: solid 1px #eee;
    background-color: #fff;
    opacity: 0;
    -o-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -o-transition: -o-transform 0.3s, opacity .3s;
    -ms-transition: -ms-transform 0.3s, opacity .3s;
    -moz-transition: -moz-transform 0.3s, opacity .3s;
    -webkit-transition: -webkit-transform 0.3s, opacity .3s;
}
.wsmenu-submenu li a {
    background-image: none !important;
    color: #666 !important;
    border-right: 0 none !important;
    text-align: left;
    display: block;
    line-height: 22px;
    padding: 6px 12px;
    text-transform: none;
    letter-spacing: normal;
}
.wsmenu-submenu li {
    position: relative;
    margin: 0;
    padding: 0;
}
.wsmenuexpandermain {
    display: none
}
.wsmenu-list li:hover .wsmenu-submenu {
    display: block
}
.wsmenu-list .wsmenu-submenu .wsmenu-submenu-sub {
    min-width: 180px;
    position: absolute;
    left: 99.9%;
    top: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -o-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -o-transition: -o-transform 0.4s, opacity .4s;
    -ms-transition: -ms-transform 0.4s, opacity .4s;
    -moz-transition: -moz-transform 0.4s, opacity .4s;
    -webkit-transition: -webkit-transform 0.4s, opacity .4s;
}
.wsmenu-list .wsmenu-submenu li:hover .wsmenu-submenu-sub {
    opacity: 1;
    list-style: none;
    padding: 2px;
    border: solid 1px #eee;
    background-color: #fff;
}
.wsmenu-list .wsmenu-submenu li:hover .wsmenu-submenu-sub {
    display: block
}
.wsmenu-list .wsmenu-submenu .wsmenu-submenu-sub .wsmenu-submenu-sub-sub {
    min-width: 220px;
    position: absolute;
    left: 100%;
    top: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    -o-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -o-transition: -o-transform 0.4s, opacity .4s;
    -ms-transition: -ms-transform 0.4s, opacity .4s;
    -moz-transition: -moz-transform 0.4s, opacity .4s;
    -webkit-transition: -webkit-transform 0.4s, opacity .4s;
}
.wsmenu-list .wsmenu-submenu .wsmenu-submenu-sub li:hover .wsmenu-submenu-sub-sub {
    opacity: 1;
    list-style: none;
    padding: 2px;
    border: solid 1px #eee;
    background-color: #fff;
}
.wsmenu-submenu li {
    position: relative;
    padding: 0;
    margin: 0;
    display: block;
}
.wsmenu-click {
    display: none
}
.typography-text {
    padding: 0
}
.typography-text p {
    text-align: justify;
    line-height: 24px;
    color: #656565;
}
.typography-text ul li {
    display: block;
    padding: 2px 0;
    line-height: 22px;
}
.typography-text ul li a {
    color: #656565
}
.hometext {
    display: none
}
.wsmenu-submenu .fa {
    margin-right: 7px
}
#content-search {
    max-width: 342px
}
/* ===[ Personalisation ]=== */
.slider {
    background-color: #000
}
.logo {
    float: left;
    min-width: 170px;
    padding: 15px 10px 0 15px;
}
.header {
    z-index: 1000
}
.header .wsmenu-list li:hover a {
    color: #fff
}
/* CONFIG PERSO
   ================================================== */
.wsmenu-submenu li a:hover,
#search_button:hover {
    background-color: rgba(0, 0, 0, 0.05)
}
.right-menu li {
    display: inline-block;
    margin: 0 2px;
    vertical-align: middle;
}
.right-menu li:last-of-type {
    color: #fff;
    background-color: #d44457;
}
.header {
    background-color: #2d2d37
}
.header-color {
    background-color: #2d2d37 !important
}
#searchform {
    display: block;
    margin-bottom: 15px;
}
.fieldcontainer {
    display: block;
    position: relative;
    width: 90%;
    margin: 0 auto;
}
.searchfield {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 10px !important;
    padding-right: 43px !important;
    background-color: #fff;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
    border: 1px solid #fff;
}
.searchfield:focus {
    width: 100%;
    border: none;
    color: rgba(71, 71, 81, 0.7);
    background-color: #fefefe;
    border: 1px solid #fff;
}
#searchbtn {
    position: absolute;
    right: 5px;
    top: 5px;
    height: 32px;
    width: 32px;
    border: 0;
    cursor: pointer;
    filter: alpha(opacity=65);
    opacity: .65;
    background: transparent url(../img/item/search.svg) center center no-repeat;
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}
#searchbtn:hover,
#searchbtn:focus,
#search2btn:hover,
#search2btn:focus {
    filter: alpha(opacity=90);
    opacity: .9;
}
#content-search {
    display: block;
    width: 100%;
    float: left;
    box-sizing: border-box;
    margin-top: 10px;
}
.header #content-right {
    position: absolute;
    right: 0;
    top: 0;
    background-color: rgba(71, 71, 81, 0.8);
    border-left: 1px solid rgba(255, 255, 255, 0.3);
    height: 100%;
    padding: 0 10px 0 0;
    box-sizing: border-box;
}
.header #content-right li {
    display: inline-block;
    margin: 2px;
    margin-bottom: 0;
}
.fr::before {
    background: url(../img/item/flags.gif) 0 0
}
.uk::before {
    background: url(../img/item/flags.gif) -288px 0
}
.flag::before {
    width: 32px;
    height: 32px;
    content: " ";
    display: block;
    float: left;
    cursor: pointer;
}
.marketing-picture {
    padding-left: 0
}
.marketing-picture figure {
    margin: 0;
    padding: 0;
}
.marketing-picture img {
    min-width: 200px
}
.marketing-picture li {
    display: inline-block;
    height: 140px;
    width: 24%;
    padding-left: 0;
    margin-bottom: 5px;
}
.top-level-2 {
    background: url(../img/bgNav3.jpg) bottom right no-repeat
}
.top-level-3 {
    background: url(../img/bgNav2.jpg) bottom right no-repeat
}
.top-level-4 {
    background: url(../img/bgNav1.jpg) bottom right no-repeat;
    padding: 25px !important;
}
.top-level-4 .owl-pagination {
    top: -15px;
    right: 10px;
}
.fa-minus {
    font-size: .8rem;
    font-weight: lighter;
}
.wsmenu-submenu .button-flat {
    padding: 2px 10px !important;
    color: #fff !important;
    text-transform: uppercase;
    min-width: 17em;
    font-size: 1.2rem;
}
.wsmenu-submenu .arrow:hover {
    background: #EE5E71
}
.wsmenu-submenu p {
    color: #333
}
.blanc,
.Blanc,
.blanc-liquoreux,
.blanc-sec,
.divers,
.misc,
.white,
.sweet,
.blanc-demi-sec, .blanc-effervescent, .sparkling{
    color: #FCE697
}
.icon-bicolor {
    background-color: #FCE697
}
.rouge,
.Rouge,
.rouge a,
.icon-bicolor {
    color: #d44457 !important
}
.rose {
    color: #fab3b3 !important
}
.clear {
    height: 10px
}
hr {
    border: 0;
    height: 1px;
    margin: .5rem 0;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.55), rgba(0, 0, 0, 0));
    clear: both;
}
.bg-change-1:hover .change,
.bg-change-2:hover .change,
.bg-change-3:hover .change {
    background-color: rgba(0, 0, 0, 0.1);
    color: #d44457 !important;
    font-weight: 700;
}
.wsmenu-submenu .fa-angle-right:before {
    float: right
}
.wsmenu-submenu .wsmenu-submenu-sub h6 {
    text-align: left;
    font-weight: 300;
    font-size: 2rem;
    margin: 5px 0;
}
.wsmenu-submenu .top-level-2 .wsmenu-submenu-sub {
    padding: 10px;
}
.wsmenu-submenu .top-level-3 .span_3_of_12, .wsmenu-submenu .top-level-2 .span_6_of_12 {padding-top: 0;}

.wsmenu-submenu .top-level-2 .span_6_of_12
 {
    min-height: 120px;
}
.wsmenu-submenu .top-level-2 .span_6_of_12:first-of-type,
.wsmenu-submenu .top-level-3 .span_3_of_12,
.top-level-4 .span_4_of_12:first-of-type {
    border-right: 1px solid #cacaca
}
.wsmenu-submenu .top-level-2 .span_6_of_12 {
    padding-left: 10px
}
.wsmenu-submenu .top-level-3 .col {
    padding-left: 10px
}
.wsmenu-submenu .top-level-3 .span_3_of_12:last-of-type {
    border: none
}
.change span {
    min-width: 150px;
    display: inline-block;
}
.top-level-3 small {
    font-size: 7px
}
wsmenu-submenu-sub {
    padding: 20px 10px
}
.wsmenu-submenu .top-level-3 li a {
    border: none !important
}
.grid .button-flat2 {
    font-size: 1.1rem;
    opacity: 0;
    display: none !important;
    clear: both;
    position: relative !important;
    width: 45%;
    padding: 5px !important;
    min-width: 70px !important;
    margin: auto;
    color: #fff !important;
    text-align: center !important;
    border: 1px solid #fff !important;
    border-bottom: 1px solid #fff !important;
    box-shadow: 1px 1px 0 #fff;
}
.grid figcaption:hover .button-flat2 {
    opacity: 1;
    display: block !important;
    margin-top: 5px;
    text-transform: uppercase;
}
.wsmenu-submenu-sub {
    min-width: 750px !important;
    clear: both !important;
    margin-bottom: 5px !important;
}
.header .wsmenu-list > li > .button-flat {
    border-right: none !important
}
.pagination li a {
    padding: 5px 10px !important
}
.pagination {
    padding-left: 0 !important;
    text-align: right;
    padding-right: 30px;
}
.pagination .tabulous_active {
    color: #fff !important;
    background-color: #d44457;
}
.clear1 {
    height: 1rem
}
.clear2 {
    height: 2rem
}
.clear3 {
    height: 3rem
}
/* *  Core Owl Carousel CSS File

 *  v1.3.3
   ================================================== */
/* clearfix  */
.owl-carousel .owl-wrapper:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}
/* display none until init  */
.owl-carousel {
    display: none;
    position: relative;
    width: 100%;
    -ms-touch-action: pan-y;
}
.owl-carousel .owl-wrapper {
    display: none;
    position: relative;
    -webkit-transform: translate3d(0px, 0px, 0px);
    transform: translate3d(0px, 0px, 0px);
}
.owl-carousel .owl-wrapper-outer {
    overflow: hidden;
    position: relative;
    width: 100%;
}
.owl-carousel .owl-wrapper-outer.autoHeight {
    -webkit-transition: height 500ms ease-in-out;
    -moz-transition: height 500ms ease-in-out;
    -ms-transition: height 500ms ease-in-out;
    -o-transition: height 500ms ease-in-out;
    transition: height 500ms ease-in-out;
}
.owl-carousel .owl-item {
    float: left
}
.owl-item small { color: #fff;}

.owl-controls .owl-page,
.owl-controls .owl-buttons div {
    cursor: pointer
}
.owl-controls {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
/* mouse grab icon  */
.grabbing {
    cursor: url(/spring_modules/template/img/item/grabbing.png) 8 8, move
}
/* fix  */
.owl-carousel .owl-wrapper,
.owl-carousel .owl-item {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
/* *   Owl Carousel Owl Demo Theme 

*   v1.3.3
   ================================================== */
.owl-theme .owl-controls {
    margin-top: 10px;
    text-align: center;
}
/* ===[ Styling Next and Prev buttons ]=== */
.owl-theme .owl-controls .owl-buttons div {
    color: #FFF;
    display: inline-block;
    margin: 5px;
    padding: 3px 10px;
    font-size: 12px;
    background: #2d2d37;
    filter: Alpha(Opacity=50);
    /*IE7 fix*/
    opacity: .5;
}
/* ===[ Clickable class fix problem with hover on touch devices ]=== */
/* ===[ Use it for non-touch hover action ]=== */
.owl-theme .owl-controls.clickable .owl-buttons div:hover {
    filter: Alpha(Opacity=100);
    /*IE7 fix*/
    opacity: 1;
    text-decoration: none;
}
/* ===[ Styling Pagination ]=== */
.custom1 .owl-controls .owl-buttons div,
.custom2 .owl-controls .owl-buttons div,
.custom3 .owl-controls .owl-buttons div {
    color: #FFF;
    display: inline-block;
    margin: 5px;
    padding: 3px 10px;
    font-size: 12px;
    background: #d44457;
    filter: Alpha(Opacity=90);
    /*IE7 fix*/
    opacity: .9;
}
.custom1 .owl-controls.clickable .owl-buttons div:hover,
.custom2 .owl-controls.clickable .owl-buttons div:hover,
.custom3 .owl-controls.clickable .owl-buttons div:hover {
    filter: Alpha(Opacity=100);
    /*IE7 fix*/
    opacity: 1;
    text-decoration: none;
}
/* ===[ Styling Pagination ]=== */
.owl-theme .owl-controls .owl-page {
    display: inline-block
}
.owl-theme .owl-controls .owl-page span {
    display: block;
    width: 30px;
    height: 12px;
    margin: 5px 0 5px 3px;
    filter: Alpha(Opacity=50);
    /*IE7 fix*/
    opacity: .5;
    background: #2d2d37;
}
.owl-pagination {
    text-align: right
}
.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
    filter: Alpha(Opacity=100);
    /*IE7 fix*/
    opacity: 1;
}
/* ===[ If PaginationNumbers is true ]=== */
.owl-theme .owl-controls .owl-page span.owl-numbers {
    height: auto;
    width: auto;
    color: #FFF;
    padding: 2px 10px;
    font-size: 12px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
}
.owl-carousel .owl-item a {
    padding: 0;
    margin: 0;
}
.custom2 {
    padding-left: 0;
    margin-top: 0;
    padding-top: 0;
}
.custom2 .title-owl {
    height: 35px;
    overflow: hidden;
    display: block;
}
.custom2 time a {
    font-weight: 400;
    font-size: 1.2rem;
}
.custom2 .sale {
    text-transform: uppercase;
    color: #7D7D83;
    font-size: 1.3rem;
}
.wrapper h2 {
    font-size: 2.3rem;
    margin-bottom: 0;
    font-weight: 300;
    text-transform: uppercase;
    line-height: 1.3;
}
.wrapper h2 span {
    font-size: 1.5rem;
    text-transform: none;
    font-weight: 400;
}
.wrapper .owl-item .price {
    font-size: 2.2rem;
    font-weight: 700;
    text-align: center;
}
.wrapper .owl-item {
    text-align: center;
    list-style-type: none;
    max-width: 100%;
    padding: 0;
    box-sizing: border-box;
    padding-left: 5px;
    overflow: hidden;
}
.wrapper .custom4 .owl-item {
    max-width: 90%
}
.wrapper .custom1 .owl-wrapper .owl-item:first-of-type {
    padding-left: 0 !important
}
.wrapper .owl-item h3 {
    font-size: 1.4rem;
    line-height: 1.25;
    margin-bottom: 0;
    font-weight: 400;
}
.wrapper .owl-item a {
    color: #333
}
.wrapper .owl-item time {
    background-color: #2d2d37;
    padding: 10px;
    box-sizing: border-box;
    display: block;
    font-size: 1.6rem;
    margin-bottom: 7px;
}
.wrapper .owl-item time a {
    color: #fff
}
.wrapper .owl-item time span {
    font-weight: 300
}
.owl-carousel figure {
    margin: 0 !important;
    padding: 0 !important;
}
.owl-carousel figure img {
    margin-bottom: 2%;
    max-height: 200px;

}
.owl-theme h3 .icon {
    position: absolute;
    margin-top: -35px;
    z-index: 1;
}
.black-color {
    background-color: #ECECEC
}
.custom1 {
    padding: 0;
    margin: 0;
}
.custom3 {
    padding: 10px
}
/* preloading images  */
.owl-item.loading {
    min-height: 150px;
    background: url(AjaxLoader.gif) no-repeat center center;
}
.custom1 .owl-item h3,
.custom3 .owl-item h3 {
    margin-top: 0;
    position: relative;
    display: block;
}
.custom1 .owl-item .title-content,
.custom3 .owl-item .title-content {
    position: absolute;
    margin: auto;
    display: block;
    background-color: rgba(0, 0, 0, 0.55);
    font-size: 2.2rem;
    font-weight: 700;
    color: #fff !important;
    font-family: 'Raleway', sans-serif;
    text-transform: uppercase;
    max-width: 90%;
    text-align: left;
    padding: 10px;
    margin-top: 40%;
    overflow: hidden;
}
.custom1 .owl-item img {
    height: 180px
}
.custom1 .owl-item img:hover .title-content {
    text-transform: lowercase;
    -vendor-animation-duration: 3s;
    -vendor-animation-delay: 2s;
    -vendor-animation-iteration-count: infinite;
}
.owl-pagination {
    position: absolute;
    top: -30px;
    right: 0;
}
.seemore {
    float: right;
    background-color: #2d2d37;
    color: #fff;
    padding: 5px 15px;
    text-transform: uppercase;
}
.new-wine #tabs4 {
    text-align: center;
    max-height: 480px;
    overflow: hidden;
}
.new-wine #tabs_container li {
    margin-left: 1%
}
.new-wine #tabs_container li:first-of-type {
    margin-left: 0
}
.new-wine #tabs4 .wrapper-hide {
    overflow: hidden;
    width: 100%;
}
.new-wine #tabs4 ul li {
    list-style-type: none;
    display: inline-block;
}
.new-wine .wrapper-hide li {
    float: left;
    min-width: inherit;
    width: 10%;
}
.new-wine #tabs4 h3 {
    color: #333;
    font-size: 2rem;
    font-weight: 300;
    text-transform: uppercase;
}
.new-wine h2 {
    margin: 0;
    text-align: center;
}
.new-wine .li {
    position: relative
}
.new-wine-item {
    margin: 0
}
.price {
    font-size: 2.2rem;
    font-weight: 700;
    color: #000;
    text-align: center;
}
.new-wine-item figcaption {
    text-align: center;
    max-height: 50px;
    overflow: hidden;
}
.new-wine-item figcaption a {
    color: #000;
    min-height: 51px;
    display: block;
    font-weight: 400;
}
.new-wine .select-region {
    background-color: #d44457
}
.new-wine .select-region h3 {
    color: #fff !important;
    line-height: .5;
}
.new-wine #tabs4 #nav-item li a {
    list-style-type: none;
    display: inline-block;
    width: 13%;
    min-width: 190px;
    position: relative;
}
.new-wine li figure .icon,
.custom2 .owl-item .icon {
    margin-left: 5px !important;
    position: relative;
    z-index: 1;
    margin-top: -25px;
    float: left;
}
.new-wine li .select-region .triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0;
    border-color: #d44457 transparent transparent;
    position: absolute;
    left: 50%;
}
.wrapper {
    padding: 0 3%;
    box-sizing: border-box;
}
#tabs_container .button-flat {
    min-width: 7em;
    font-size: 1.2rem;
}
.label {
    color: #fff;
    padding: 2px;
    text-transform: uppercase;
    font-size: 9px;
    position: absolute;
}
.owl-item .label {
    left: 0;
    top: 20px;
}
.online {
    background-color: #d44457
}
.fixe {
    background-color: #2ca35a
}
.icon-leaf {
    color: #2ca35a;
    top: -25px;
    font-size: 2rem;
}
.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
}
footer {
    background-color: #2d2d37;
    font-weight: 300;
    font-size: 1.5rem;
}
.bg-color {
    background-color: rgba(255, 255, 255, 0.07);
    margin: 0 !important;
}
footer a {
    color: #fff
}
footer li {
    list-style-type: none
}
footer .site-map .capital {
    text-transform: uppercase
}
footer .site-map li a {
    padding: 5px 0;
    display: block;
}
footer .banner-01 {
    background-color: #d44457;
    padding: 10px 0;
}
footer .banner-01 span {
    font-weight: 700
}
footer .banner-01 p {
    color: #fff;
    text-transform: uppercase;
    font-size: 1.7rem;
    text-align: center;
    margin: 0;
    font-weight: 300;
}
footer .banner-01 small {
    font-size: 1.1rem;
    text-transform: lowercase;
    font-weight: 400;
}
footer .newsletter h6 {
    font-size: 2.7rem;
    color: #fff;
    font-weight: 700;
    margin: 0;
}
footer .newsletter strong {
    font-weight: 100
}
footer .newsletter p {
    color: #ADADAD;
    line-height: 1.4;
}
footer .newsletter a {
    text-decoration: underline
}
footer .searchfield {
    width: 40%;
    float: left;
}
footer .button-flat {
    width: 130px
}
footer .social-space {
    padding: 0
}
footer .social-space li {
    display: inline-block;
    margin: 10px;
}
footer .social-space li i {
    font-size: 3rem !important;
    color: #ADADAD;
}
footer .newsletter small {
    color: #ADADAD
}
footer .banner-00 {
    background-color: #fff;
    border-top: 1px solid #cacaca;
}
footer .banner-00 li {
    text-transform: uppercase;
    font-size: 1.8rem;
    display: inline-block;
    vertical-align: middle;
}
footer .banner-00 li:last-of-type,
.margin-adjust {
    margin-left: 5%
}
footer .searchfield:focus {
    box-shadow: none;
    width: 500px;
}
footer .social-space li i:hover {
    color: #d44457
}
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    background: #d44457 url(../img/item/cd-top-arrow.svg) no-repeat center 50%;
    visibility: hidden;
    opacity: 0;
    z-index: 1000;
}
.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
    opacity: .5;
}
.no-touch .cd-top:hover {
    background-color: #e86256;
    opacity: 1;
}
.cote-search .fieldcontainer {
    width: 100%
}
.cote-search .searchfield {
    border: 8px solid #ECECEC
}
.cote-search #searchbtn {
    position: absolute;
    right: 10px;
    top: 10px;
}
.chart {
    zoom: 1;
    width: 70%;
}
.chart:after {
    clear: both;
    content: '.';
    display: block;
    height: 0;
    visibility: hidden;
}
.chart li {
    display: block;
    position: relative;
    margin: 5px 0;
    min-width: 150px;
}
.chart li:before {
    color: #fff;
    content: attr(title);
    left: 5px;
    position: absolute;
    font-size: 1.6rem;
    vertical-align: middle;
    top: 10px;
}
.chart li.title:before {
    color: black;
    font-weight: bold;
    left: 0;
}
.chart li:first-child {
    margin-top: 0
}
.chart li .bar {
    background: #d44457;
    padding: 20px 0;
}
.chart li .number {
    color: black;
    font-size: 2.1rem;
    font-weight: 300;
    padding-left: 5px;
    position: absolute;
}
.chart li.past .bar {
    background: #d44457
}
.chart li.past .number {
    color: #aaa
}
.chart {
    padding-left: 0
}
.chart li .bar:hover,
.chart li a:hover .bar {
    background-color: #FF6F82
}
.chart li a:before {
    color: #fff;
    content: attr(title);
    left: 5px;
    position: absolute;
    font-size: 1.6rem;
    vertical-align: middle;
    top: 10px;
}
.banner-00 ul {
    margin: 25px 0
}
nav #searchbtn {
    font-size: 0px
}
#tabs-1,
#tabs-2,
#tabs-3,
#tabs-4 {
    width: 100% !important
}
.more-info-slide .icon {
    color: rgba(255, 255, 255, 1);
    font-size: 1.7rem;
}
.more-info-slide .next:hover .icon {
    color: #34495e
}
.content-2 .more-info-slide article a {
    margin-top: 10px;
    float: right;
    outline: none;
    text-align: center;
    z-index: 1000;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
}
.content-4 .more-info-slide article a {
    outline: none;
    text-align: center;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    position: absolute;
    right: 0;
    bottom: 0;
}
.more-info-slide article a.prev {
    left: 0
}
.more-info-slide article a.next {
    right: 0
}
.more-info-slide article a svg {
    display: block;
    margin: 0 auto;
    padding: 0;
}
.nav-roundslide a {
    padding: 20px;
    width: 40px;
    height: 40px;
    background: #2d2d37;
    -webkit-transition: width 0.3s, background-color .3s;
    transition: width 0.3s, background-color .3s;
}
.nav-roundslide .icon-wrap {
    position: absolute;
    width: 32px;
}
.nav-roundslide a.prev .icon-wrap {
    left: 15px
}
.nav-roundslide a.next .icon-wrap {
    right: 5px;
    top: 10px;
}
.nav-roundslide p {
    position: absolute;
    top: 12px;
    margin: 0;
    color: #566473;
    text-transform: uppercase;
    white-space: nowrap;
    letter-spacing: 1px;
    font-weight: 400;
    font-size: .85em;
    opacity: 0;
    -webkit-transition: opacity 0.1s, -webkit-transform .1s;
    transition: opacity 0.1s, transform .1s;
}
.nav-roundslide a.prev p {
    right: 30px;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}
.nav-roundslide a.next p {
    left: 40px;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.nav-roundslide a:hover {
    width: 200px;
    background: #fff;
}
.nav-roundslide a:hover p {
    opacity: 1;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transform: translateX();
    transform: translateX();
}
/* --------------------
   ================================================== */
/* ===[ Slit (inspired by Jam3) ]=== */
/* --------------------
   ================================================== */
.color-5 {
    background: #cdd2d5
}
.nav-slit .icon-wrap {
    position: relative;
    display: block;
    padding: 45px 5px;
    background-color: #939a9f;
}
.nav-slit svg.icon {
    -webkit-transition: -webkit-transform .3s .3s;
    transition: transform .3s .3s;
}
.nav-slit div {
    position: absolute;
    top: 0;
    width: 200px;
    height: 100%;
    background-color: #939a9f;
    -webkit-transition: -webkit-transform .3s .3s;
    transition: transform .3s .3s;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}
.nav-slit a.prev div {
    left: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.nav-slit a.next div {
    right: 0;
    text-align: right;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}
.nav-slit h3 {
    position: absolute;
    top: 100%;
    margin: 0;
    padding: 0 20px;
    width: 100%;
    height: 30%;
    background: #34495e;
    color: #fff;
    text-transform: uppercase;
    white-space: nowrap;
    letter-spacing: 1px;
    font-weight: 500;
    font-size: .75em;
    line-height: 2.75;
    -webkit-transition: -webkit-transform .3s;
    transition: transform .3s;
    -webkit-transform: rotateX(-90deg);
    transform: rotateX(-90deg);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webki-backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.nav-slit img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.nav-slit a.prev:hover svg.icon {
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.nav-slit a.next:hover svg.icon {
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
}
.nav-slit a:hover div {
    -webkit-transform: translateX();
    transform: translateX();
}
.nav-slit a:hover h3 {
    -webkit-transition-delay: .6s;
    transition-delay: .6s;
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg);
}
header {
    box-sizing: border-box !important
}
.wrapper,
.section,
body,
.slider,
header,
.content {
    min-width: 280px
}
.sticker-promo {
    position: absolute;
    left: -70px;
    top: -60px;
}
.red-color {
    color: #d44457 !important
}
.hebe.tparrows:before,
.gyges .tp-thumb:hover .tp-thumb-img-wrap,
.gyges .tp-thumb.selected .tp-thumb-img-wrap,
.fancybox-close {
    background-color: #d44457 !important
}
#okMail:hover,
#closeCookieCream:hover {
    background-color: #EE5E71
}
.pagination li {
    display: inline-block
}
#target-to-sell-tag .owl-item {
    padding-left: .15%
}
#target-to-sell-tag .owl-item:first-of-type {
    margin-left: -.15%
}
#target-to-sell-tag .price {
    font-size: 2.2rem;
    font-weight: 700;
    color: #000;
    text-align: center;
}
#target-to-sell-tag h3 {
    height: 35px;
    overflow: hidden;
}
.owl-carousel .icon-angle-left,
.owl-carousel .icon-angle-right {
    font-size: 2.5rem;
    padding: 10px;
}
#target-to-sell-tag:hover .owl-prev,
#target-to-sell-tag:hover .owl-next,
.custom1:hover .owl-next,
.custom1:hover .owl-prev,
.custom2:hover .owl-next,
.custom2:hover .owl-prev,
.custom3:hover .owl-next,
.custom3:hover .owl-prev {
    display: block !important
}
.owl-prev {
    position: absolute;
    left: -20px;
    top: 20%;
}
.owl-next {
    position: absolute;
    right: -20px;
    top: 20%;
}
.custom1 .owl-prev,
.custom3 .owl-prev {
    position: absolute;
    left: -20px;
    top: 40%;
}
.custom1 .owl-next,
.custom3 .owl-next {
    position: absolute;
    right: -20px;
    top: 40%;
}
#tabs_container li {
    position: relative
}
#tabs_container li .button-flat {
    position: absolute;
    top: 30%;
    left: 14%;
    display: none;
}
#tabs_container li:hover .button-flat {
    display: block
}
#tabs_container li {
    position: relative;
    font-size: 1.35rem;
}
.background-load {
    display: none;
    background-color: rgba(45, 45, 55, 0.9);
    width: 100%;
    height: 100%;
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 1000;
}
#loader-cube {
    position: absolute;
    z-index: 1500;
    left: 50%;
    top: 50%;
    width: 326px;
    height: 118px;
    margin-top: -59px;
    margin-left: -163px;
}
.thecube {
    width: 75px;
    height: 75px;
    margin: 0 auto;
    margin-top: 50px;
    position: relative;
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}
.thecube .cube {
    position: relative;
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}
.thecube .cube {
    float: left;
    width: 50%;
    height: 50%;
    position: relative;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
}
.thecube .cube:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #d44457;
    -webkit-animation: foldthecube 2.4s infinite linear both;
    animation: foldthecube 2.4s infinite linear both;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
}
.thecube .c2 {
    -webkit-transform: scale(1.1) rotateZ(90deg);
    transform: scale(1.1) rotateZ(90deg);
}
.thecube .c3 {
    -webkit-transform: scale(1.1) rotateZ(180deg);
    transform: scale(1.1) rotateZ(180deg);
}
.thecube .c4 {
    -webkit-transform: scale(1.1) rotateZ(270deg);
    transform: scale(1.1) rotateZ(270deg);
}
.thecube .c2:before {
    -webkit-animation-delay: .3s;
    animation-delay: .3s;
}
.thecube .c3:before {
    -webkit-animation-delay: .6s;
    animation-delay: .6s;
}
.thecube .c4:before {
    -webkit-animation-delay: .9s;
    animation-delay: .9s;
}
.textedit p {
    color: #fff;
    text-align: center;
    margin-top: 30px;
    font-size: 1.4rem;
    font-weight: 100;
    font-family: Raleway;
    text-transform: uppercase;
}
.thecube p small {
    text-transform: lowercase
}
.cookies-article .nav-cookie {
    background-color: rgba(0, 0, 0, 0.05);
    padding: 15px;
}
.cookies-article .nav-cookie li {
    list-style-type: square
}
.cookies-article .nav-cookie h4 a {
    text-transform: uppercase;
    color: #333;
}
.cookies-article h3 {
    margin-bottom: 0;
    margin-top: 20px;
    font-size: 1.6rem;
}
.cookies-article h2 {
    margin-bottom: 0;
    margin-top: 20px;
    font-size: 2.6rem;
}
.cookies-article h1 {
    font-size: 4rem;
    font-weight: 100;
    font-family: Raleway;
}
.cookies-article p a {
    color: #d44457
}
.fancybox-inner #comfirm-newsletter p,
.fancybox-inner #comfirm-newsletter-exist p {
    font-size: 1.5rem;
    text-align: center;
}
.fancybox-inner #comfirm-newsletter .icon-check,
.fancybox-inner #comfirm-newsletter-exist .icon-times {
    font-size: 35px;
    font-weight: bolder;
    line-height: 2;
}
.fancybox-inner label a,
.fancybox-inner form a {
    color: #333
}
#slideit-cookie * {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-weight: 300;
    font-style: normal;
    font-size: 100%;
    font-family: 'roboto', sans-serif;
    /* Edit this if you want to match the font with your template design */
    vertical-align: baseline;
    line-height: normal;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#slideit-cookie section {
    -moz-box-shadow: 0 0 7px 0 #9b9b9b;
    -webkit-box-shadow: 0 0 7px 0 #9b9b9b;
    -o-box-shadow: 0 0 7px 0 #9b9b9b;
    box-shadow: 0 0 7px 0 #9b9b9b;
}
#slideit-cookie a {
    text-decoration: none
}
#slideit-cookie label {
    cursor: pointer
}
#slideit-cookie input[type="radio"] {
    display: none
}
#slideit-cookie {
    z-index: 999;
    /* Keep the item above all other elements on the page */
    position: fixed;
    width: 100%;
    /* Width of the wrapper of the section. Adjust this value if you want wider elements */
    bottom: 0;
    /* Vertical position of the elements */
    left: 0;
    /* Horizontal position of the elements */
}
/* **** Form styles ****
   ================================================== */
#slideit-cookie section {
    margin: 0;
    overflow: hidden;
    width: 100%;
    height: auto;
    left: 0;
    bottom: 56px;
    position: absolute;
    z-index: 10;
    background: rgba(255, 255, 255, 0.9);
    border-bottom: 6px solid #d44457;
    -webkit-backface-visibility: hidden;
    /* Webkit transition hack */
}
#slideit-cookie section,
#slideit-cookie input#close-item:checked ~ section {
    /* Section position when closed */
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}
#slideit-cookie input#open-item:checked ~ section {
    /* Section position when opened */
    -webkit-transform: translateY();
    -moz-transform: translateY();
    -ms-transform: translateY();
    -o-transform: translateY();
    transform: translateY();
}
#slideit-cookie section .wrap {
    padding: 5px;
    position: relative;
    float: left;
    text-align: center;
    width: 100%;
}
#slideit-cookie .title {
    display: block;
    text-transform: uppercase;
    font-size: 16px;
    color: #222;
}
#slideit-cookie .links a {
    color: #333;
    font-size: 12px;
    display: inline-block;
    margin: 16px 10px 10px;
}
#slideit-cookie .links a:hover,
#slideit-cookie .links a:focus {
    color: #222
}
#slideit-cookie .links a:before {
    padding-right: 4px
}
#slideit-cookie p.copyright {
    font-size: 11px;
    color: #bbb;
    line-height: 14px;
    display: block;
    margin: 10px auto 0;
    padding-top: 20px;
    width: 50%;
    border-top: solid 1px #f0f0f0;
}
#slideit-cookie p.copyright span {
    font-size: 14px;
    display: inline-block;
    padding-right: 4px;
    vertical-align: top;
    margin-top: -1px;
}
/* **** Main labels ****
   ================================================== */
#slideit-cookie label.open {
    font-size: 11px;
    color: #222;
    background: #fff;
    width: 100px;
    bottom: -50px;
    left: 0;
    right: 0;
    top: auto;
    margin: 0 auto;
    padding: 10px 0;
    text-transform: uppercase;
    z-index: 1;
}
#slideit-cookie input#close-item:checked ~ label.open {
    bottom: 0
}
#slideit-cookie label.open:hover,
#slideit-cookie label.open:focus {
    background: #222;
    color: #fff;
}
#slideit-cookie label.close {
    font-size: 15px;
    background: #d44457;
    color: #fff;
    width: 22px;
    z-index: 999;
    padding: 4px 10px 4px 8px;
}
#slideit-cookie label.close:hover,
#slideit-cookie label.close:focus {
    background: #757786
}
/* **** Transitions ****
   ================================================== */
#slideit-cookie label,
#slideit-cookie a {
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}
#slideit-cookie section {
    -webkit-transition: all .4s cubic-bezier(0.2, 0.6, 0.3, 1);
    -moz-transition: all .4s cubic-bezier(0.2, 0.6, 0.3, 1);
    -ms-transition: all .4s cubic-bezier(0.2, 0.6, 0.3, 1);
    -o-transition: all .4s cubic-bezier(0.2, 0.6, 0.3, 1);
    transition: all .4s cubic-bezier(0.2, 0.6, 0.3, 1);
}
#slideit-cookie input#close-item:checked ~ label.open {
    -webkit-transition: top .3s ease 0.4s, background .1s ease, color .1s ease;
    -moz-transition: top .3s ease 0.4s, background .1s ease, color .1s ease;
    -ms-transition: top .3s ease 0.4s, background .1s ease, color .1s ease;
    -o-transition: top .3s ease 0.4s, background .1s ease, color .1s ease;
    transition: top .3s ease 0.4s, background .1s ease, color .1s ease;
}
#slideit-cookie {
    -moz-animation-name: dropFooter;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: ease-in;
    -moz-animation-duration: .5s;
    -webkit-animation-name: dropFooter;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: .5s;
    animation-name: dropFooter;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: .5s;
}
i {
    font-style: normal
}
.header .wsmenu-list li .button-flat {
    text-align: left;
    text-indent: 10px;
}
.error-message {
    color: #d44457;
    text-align: center;
    padding: 5px;
    display: block;
}
#promo-banner-02 {
    font-size: 1.6rem;
    background-color: #565660;
    width: 100%;
    padding: 0.5%;
    position: relative;
    z-index: 3;
    color: #D0D0DA;
}
#promo-banner-01 aside a,
#promo-banner-02 aside a {
    color: #D0D0DA;
    font-weight: 900;
    text-decoration: underline;
}
#promo-banner-01 aside,
#promo-banner-02 aside {
    font-family: raleway;
    padding: 0 3%;
    text-align: center;
    box-sizing: border-box;
    font-weight: 300;
    min-width: 320px;
    max-width: 1500px;
    margin: auto;
}
.search-cote .bg_cote {
    background: url("../img/cote/bg-cote-4.jpg")0 0;
    background-repeat: no-repeat;
    width: 100%;
    background-size: cover;
    min-height: 400px;
}
.search-cote .bg_cote h1 {
    font-size: 3rem;
    text-align: center;
    color: #fff;
    font-family: raleway;
    font-weight: 300;
    margin-top: 100px;
    text-transform: uppercase;
    line-height: .9;
    display: block;
}
.search-cote .bg_cote #formCote {
    max-width: 50%;
    margin: auto;
    padding: 25px 10px;
}
.search-cote .second {
    background-color: none;
    border: none;
}
.search-cote h2 {
    text-align: center
}
.search-cote h3 {
    margin: 0
}
.search-cote .bg_cote p {
    text-align: justify
}
.search-cote .button-flat {
    margin: auto
}
.search-cote .searchfield2,
.vintage {
    text-align: center;
    margin-bottom: 10px;
    width: 100%;
}
.search-cote #formCote {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 20px;
}
.search-cote #formCote input {
    padding: 15px !important
}
.search-cote #searchbtn2 {
    top: 0px;
    border: 0;
    cursor: pointer;
    opacity: .65;
    position: absolute;
    right: 15px;
    background: transparent url(../img/item/search.svg) center center no-repeat;
}
.search-cote .cote-input p {
    text-align: center;
    padding: 15px;
    font-size: 1.7rem;
    color: #fff;
}
.search-cote .cote-input p a {
    color: #d44457;
    font-weight: bold;
    text-decoration: underline;
}
.search-cote .button-flat {
    display: block
}
.search-cote img {
    width: 100%
}
#devise {
    background-color: rgba(71, 71, 81, 0.8);
    width: 75px;
    padding-top: 5px;
    padding-left: 5px;
    font-size: 15px;
    line-height: 1;
    border-radius: 0;
    -webkit-appearance: none;
    border: none;
    color: #fff;
    font-weight: 700;
    /* border-top: 1px solid #000; */
    cursor: pointer;
    box-sizing: border-box;
}
:focus {
    outline: none
}
.searchfield:focus {
    box-shadow: 0 0 0 4px #d44457
}
header .searchfield:focus {
    box-shadow: 0 0 0 4px rgba(71, 71, 81, 0.8)
}
input:focus::-webkit-input-placeholder {
    color: transparent!important
}
input:focus::-moz-placeholder {
    color: transparent!important
}
input:focus:-moz-placeholder {
    color: transparent!important
}
footer .searchfield,
footer .searchfield:focus {
    border: 2px solid #fff
}
.autocomplete-suggestions a {
    color: #333;
    line-height: 1.5;
    display: block;
    padding: 3px;
}
.autocomplete-suggestions a:hover {
    background-color: #ececec
}
.autocomplete-suggestions {
    padding: 10px
}
.autocomplete-suggestions {
    text-align: left;
    cursor: default;
    border: 1px solid #ccc;
    border-top: 0;
    background: #fff;
    box-shadow: -1px 1px 3px rgba(0, 0, 0, .1);
    position: absolute;
    display: none;
    z-index: 9999;
    max-height: 254px;
    overflow: hidden;
    overflow-y: auto;
    box-sizing: border-box;
}
.autocomplete-suggestion {
    position: relative;
    padding: 0 .6em;
    line-height: 23px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 1.02em;
    color: #333;
}
.autocomplete-suggestion b {
    font-weight: normal;
    color: #d34456;
}
.autocomplete-suggestions a strong {
    color: #EE5E71
}
.autocomplete-suggestion.selected {
    background: #f0f0f0
}
.clear-nav {
    clear: both;
    height: 12rem;
}
.custom2 figure {
    min-height: 214px
}
.new-wine-item img {
    height: 185px
}
/* ! fancyBox v2.1.5 fancyapps.com | fancyapps.com/fancybox/#license
   ================================================== */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp {
    padding: 0;
    margin: 0;
    border: 0;
    outline: none;
    vertical-align: top;
}
.fancybox-wrap {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 8020;
}
.fancybox-skin {
    position: relative;
    background: #f9f9f9;
    color: #444;
    text-shadow: none;
}
.fancybox-opened {
    z-index: 8030
}
.fancybox-outer,
.fancybox-inner {
    position: relative
}
.fancybox-inner {
    overflow: hidden
}
.fancybox-type-iframe .fancybox-inner {
    -webkit-overflow-scrolling: touch
}
.fancybox-error {
    margin: 0;
    padding: 15px;
    white-space: nowrap;
}
.fancybox-image,
.fancybox-iframe {
    display: block;
    width: 100%;
    height: 100%;
}
.fancybox-image {
    max-width: 100%;
    max-height: 100%;
}
.fancybox-close {
    background-color: #d44457;
    color: #fff;
    font-family: 'Idealwine';
    font-size: 1.5em;
    text-align: center;
    padding: 2.5%;
}
.fancybox-close:after {
    content: "\f01e"
}
#fancybox-loading {
    position: fixed;
    top: 50%;
    left: 50%;
    margin-top: -22px;
    margin-left: -22px;
    background-position: 0 -108px;
    opacity: 0.8;
    cursor: pointer;
    z-index: 8060;
}
#fancybox-loading div {
    width: 44px;
    height: 44px;
    background: url('fancybox_loading.gif') center center no-repeat;
}
.fancybox-close {
    position: absolute;
    top: 0px;
    right: 0px;
    cursor: pointer;
    z-index: 8040;
}
.fancybox-nav {
    position: absolute;
    top: 0;
    width: 40%;
    height: 100%;
    cursor: pointer;
    text-decoration: none;
    background: transparent url('blank.gif');
    /* helps IE */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    z-index: 8040;
}
.fancybox-prev {
    left: 0
}
.fancybox-next {
    right: 0
}
.fancybox-nav span {
    position: absolute;
    top: 50%;
    width: 36px;
    height: 34px;
    margin-top: -18px;
    cursor: pointer;
    z-index: 8040;
    visibility: hidden;
}
.fancybox-prev span {
    left: 10px;
    background-position: 0 -36px;
}
.fancybox-next span {
    right: 10px;
    background-position: 0 -72px;
}
.fancybox-nav:hover span {
    visibility: visible
}
.fancybox-tmp {
    position: absolute;
    top: -99999px;
    left: -99999px;
    visibility: hidden;
    max-width: 99999px;
    max-height: 99999px;
    overflow: visible !important;
}
/** Overlay helper 
 * 
 * 
 * 
 * .fancybox-lock {
 * 
 *     overflow: hidden !important;
 * 
 *     width: auto;
 * 
 * }
 * 
 * 
 * 
 * .fancybox-lock body {
 * 
 *     overflow: hidden !important;
 * 
 * }
 * 
 * 
 * 
 * .fancybox-lock-test {
 * 
 *     overflow-y: hidden !important;
 * 
 * }
 */
.fancybox-overlay {
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    display: none;
    z-index: 8010;
    background-color: rgba(0, 0, 0, 0.7);
}
.fancybox-overlay-fixed {
    position: fixed;
    bottom: 0;
    right: 0;
}
.fancybox-lock .fancybox-overlay {
    overflow: auto;
    /*overflow-y: scroll;*/
}
/* ===[ Title helper ]=== */
.fancybox-title {
    visibility: hidden;
    position: relative;
    text-shadow: none;
    z-index: 8050;
}
.fancybox-opened .fancybox-title {
    visibility: visible
}
.fancybox-title-float-wrap {
    position: absolute;
    bottom: 0;
    right: 50%;
    margin-bottom: -35px;
    z-index: 8050;
    text-align: center;
}
.fancybox-title-float-wrap .child {
    display: inline-block;
    margin-right: -100%;
    padding: 2px 20px;
    background: transparent;
    /* Fallback for web browsers that doesn't support RGBa */
    background: rgba(0, 0, 0, 0.8);
    color: #FFF;
    font-weight: bold;
    line-height: 24px;
    white-space: nowrap;
}
.fancybox-title-outside-wrap {
    position: relative;
    margin-top: 10px;
    color: #fff;
}
.fancybox-title-inside-wrap {
    padding-top: 10px
}
.fancybox-title-over-wrap {
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    padding: 10px;
    background: #000;
    background: rgba(0, 0, 0, .8);
}
.last-order h1 {
    font-size: 2.5rem;
    margin-bottom: 0;
    font-weight: 300;
    text-transform: uppercase;
    line-height: .9;
}
.last-order h1 span {
    font-size: 1.5rem;
    text-transform: none;
    font-weight: 400;
}
.result-item-order h3 {
    font-size: 2.5rem;
    text-transform: none;
    font-weight: 400;
}
.result-item-order {
    background-color: #ECECEC;
    padding: 0.2% 0.3%;
}
.result-item-order .price {
    font-size: 2.8rem;
    font-weight: 700;
    text-align: center;
    padding: 20px;
}
.result-item-order .price small {
    font-size: 1.2rem;
    font-weight: normal;
}
.result-item-order .note {
    display: none
}
.result-item-order.button-flat {
    margin: auto
}
.result-item-order figure {
    margin: 10px
}
.result-item-order img {
    max-width: 100%
}
.result-item-order .span_7_of_12 {
    border-right: 1px solid #cacaca;
    min-height: 200px;
}
.last-order h2 {
    text-transform: initial;
    font-size: 1.5rem;
}
.result-item-order .notes {
    display: none
}
/* ===[ Retina graphics! ]=== */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) { 
    #fancybox-loading,
    .fancybox-close,
    .fancybox-prev span,
    .fancybox-next span {
        background-image: url('fancybox_sprite@2x.png');
        background-size: 44px 152px;
        /*The size of the normal image, half the size of the hi-res image*/
    }
    #fancybox-loading div {
        background-image: url('fancybox_loading@2x.gif');
        background-size: 24px 24px;
        /*The size of the normal image, half the size of the hi-res image*/
    }
}
.styled-select,
#deviseUpdate {
/* display: none;*/
}
.millesime .black-color {
    padding: 10px;
    text-align: center;
}
.millesime h1 {
    font-size: 2rem;
    text-transform: uppercase;
    font-weight: 300;
}
.millesime h2 {
    text-transform: none;
    font-size: 2rem;
}
.millesime p {
    text-align: justify
}
.millesime ul {
    padding: 0
}
.millesime a {
    color: #333
}
.millesime select {
    padding: 5px 10px
}
.millesime .notation li {
    font-size: 2.5rem;
    font-weight: 300;
    display: block;
    text-align: center;
    background-color: #d44457;
    padding: 10px;
    margin-bottom: 10px;
    color: #fff;
    text-transform: uppercase;
}
.millesime .button-flat-2 {
    float: right;
    margin-left: 10px;
    background-color: #2d2d37;
    color: #fff;
    padding: 5px 15px;
    text-align: center;
}
.saga-millesime {
    margin: 4% 0
}
.bg-saga {
    background: url("/spring_modules/template/img/saga/bg-saga.jpg") no-repeat bottom fixed;
    background-size: cover;
    min-height: 300px;
    padding: 50px;
    min-width: 350px;
}
.bg-saga form {
    max-width: 500px;
    margin: auto;
    background-color: rgba(0, 0, 0, 0.4);
    padding: 40px 60px;
}
.bg-saga h1 {
    font-size: 3rem;
    text-align: center;
    color: #fff;
    font-family: raleway;
    font-weight: 300;
    text-transform: uppercase;
    line-height: .9;
}
.bg-saga select {
    margin-bottom: 10px
}
.bg-saga .region {
    text-align: center !important
}
.bg-saga .button-flat {
    display: block;
    text-align: center;
    min-width: auto;
    width: 100%;
    margin: auto;
}
.bg-saga select {
    padding: 15px !important
}
.saga-millesime .span_4_of_12 .button-flat {
    background-color: #2d2d37
}
#millesime,
#region {
    text-align: center
}
.table-note table a {
    color: #333
}
.table-note table {
    border: 1px solid #ccc;
    width: 100%;
    margin: 0;
    padding: 0;
    border-collapse: collapse;
    border-spacing: 0;
}
.table-note table tr {
    border: 1px solid #ddd;
    padding: 6px;
}
.table-note table tr:hover {
    background-color: #d44457;
    -webkit-transition: background-color 100ms ease-in-out;
    -moz-transition: background-color 100ms ease-in-out;
    -o-transition: background-color 100ms ease-in-out;
    -ms-transition: background-color 100ms ease-in-out;
    transition: background-color 100ms ease-in-out;
}
.table-note table tr:hover a,
.table-note table tr:hover .millesime-row {
    color: #fff
}
.table-note thead tr:hover {
    background-color: #fff
}
.table-note thead tr:hover a {
    color: #333
}
.table-note table th,
.table-note table td {
    padding: 10px;
    text-align: center;
}
.table-note table th {
    text-transform: uppercase;
    font-size: 14px;
    letter-spacing: 1px;
}
@media screen and (max-width: 1000px) { 
    .table-note table {
        border: 0
    }
    .table-note table thead {
        display: none
    }
    .table-note table tr {
        margin-bottom: 10px;
        display: block;
        border-bottom: 2px solid #ddd;
    }
    .table-note table td {
        display: block;
        text-align: right;
        font-size: 13px;
        border-bottom: 1px dotted #ccc;
    }
    .table-note table td:last-child {
        border-bottom: 0
    }
    .table-note table td:before {
        content: attr(data-label);
        float: left;
        text-transform: uppercase;
        font-weight: bold;
    }
}
.table-note .Blanc-liq {
    color: #f39c12
}
.table-note table .bgrow {
    background-color: #ECECEC
}
.table-note table .millesime-row {
    font-weight: 700;
    font-size: 1.8rem;
}
.table-note small {
    text-align: right;
    display: block;
}
.table-note fieldset {
    text-align: right;
    border: none;
    padding: 0;
    padding-top: 20px;
}
.button-flat-2 {
    min-width: auto;
    text-align: center;
    padding: 10px 15px;
}
.button-flat-2:before {
    display: none
}
.button-flat-2 {
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    position: relative;
    background: #d44457;
    border: none;
    color: #fff !important;
    transition: .2s;
    text-transform: uppercase;
}
.right {
    float: right
}
.ariane, .ariane a {color: #989898 !important; font-size: 1.2rem;}
nav .button-flat {
    min-width: 11em
}
#header-cote {
    background-color: #232830;
    color: #fff;
}
#header-cote a {
    color: #fff;
}
#header-cote .ariane a,
#header-cote .ariane { color: #565660 !important;}
#header-cote .ariane strong{ color: #565660 !important; font-weight: normal;}

#header-cote .bloc-cote {
    z-index: 2;
    position: absolute;
    width: 100%;
}
#header-cote #barChart {
    z-index: 1
}
#header-cote #formHome {
    max-width: 80%;
    margin: auto;
}
#header-cote #formHome input {
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
}
#header-cote .span_4_of_12, #header-cote .cote-bloc, #header-cote .vintage-list, #header-cote .cote-bloc-no-log  {
    background-color: rgba(255, 255, 255, 0.1);
    max-height: 180px;
}
#header-cote .vintage-list {
    height: 180px;
    overflow: hidden;
    text-align: left !important;
    padding-left: 10px;
    box-sizing: border-box;
    overflow-y: auto;
}
#header-cote .cote-bloc-no-log {
    max-height: 110px;
}
#header-cote .cote-bloc-no-log .icon-line-chart {
    color: rgba(255,255,255,0.2);
    font-size: 6rem;
    padding: 10px;
    display: none;
}
#header-cote .cote-bloc-no-log .button-flat {
    margin: 13px
}
#header-cote .span_4_of_12, #header-cote .cote-bloc  {
    text-align: center;
    padding-top: 10px;
}
#header-cote .cote-bloc,
.note-cote {
    height: 110px
}
#header-cote .vintage-list a {
    color: #fff;
    font-size: 1.6rem;
    padding: 10px 18px;
    display: inline-block;
    font-weight: normal;
}
#header-cote .vintage-list a:hover {
    background-color: rgba(255, 255, 255, 0.2)
}
#header-cote .vintage-list .selected-vintage {
    color: #d44457;
    font-weight: 700 !important;
    background-color: rgba(0, 0, 0, 0.3);
}
#header-cote .cote-bloc h3 {
    text-transform: uppercase;
    text-align: center;
    font-weight: 100;
    font-size: 2rem;
    margin: 0px;
    margin: auto;
}
#header-cote .cote-bloc .clear {display: none;}

#header-cote .cote-bloc h3 span {
    font-size: 5rem;
    font-weight: normal;
}
#header-cote .cote-bloc h3 sup {
    font-weight: 100
}
#header-cote i {
    background-color: #d44457;
    padding: 10px;
    color: #fff;
}
#header-cote .cote-bloc i {
    position: absolute;
    right: 10px;
}
#header-cote small {
    color: #cecece;
    float: right;
}
#header-cote .button {
    background-color: rgba(255, 255, 255, 0.1);
    text-align: center;
    vertical-align: middle;
    font-size: 1.4rem;
    padding: 10px;
    padding-top: 20px;
    margin-top: 22px;
    cursor: pointer;
    height: 57px;
    overflow: hidden;
    display: block;
}
#header-cote .button2 {
    background-color: rgba(255, 255, 255, 0.1);
    text-align: center;
    font-size: 1.4rem;
    padding: 10px;
    margin-top: 22px;
    cursor: pointer;
    height: 57px;
    overflow: hidden;
    display: block;
    vertical-align: middle;
}
#header-cote .span_6_of_12 .button-flat { margin: auto; width: 290px; display: block; margin-top: 38px;}

#header-cote .button:hover {
    background-color: rgba(255, 255, 255, 0.8);
    color: #2d2d37;
}
#header-cote .button span {
    padding-right: 5px
}
#header-cote .clear-max {
    height: 120px;
    clear: both;
}
#header-cote .note-cote {
    min-height: 110px
}
#header-cote .note-cote li {
    font-size: 3rem;
    font-weight: bold;
    white-space : nowrap;
    
}
#header-cote .owl-carousel {
    width: 90%
}
#header-cote .note-cote li b {
    font-size: 1.2rem;
    font-weight: 300;
    display: block;
}
#header-cote .note-cote ul {
    padding-left: 0
}
#header-cote .owl-next {
    display: block !important
}
#header-cote .owl-theme .owl-controls .owl-buttons div {
    margin: 0;
    padding: 0;
    opacity: 1;
}
#header-cote .owl-pagination {
    display: none
}
#header-cote .vintage-list .selected-vintage {
    position: absolute;
    top: 3%;
    left: 2%;
    font-size: 2.5rem !important;
    width: 96%;
    text-align: center;
    background-color: rgba(0,0,0,0.3);
}
#header-cote .vintage-list {
    padding-top: 60px
}
#header-cote h1 {
    font-size: 1.6rem;
    margin-bottom: 0;
    font-weight: 300;
    line-height: .9;
    display: inline;
}
.new-cote a:hover {
    color: #d44457
}
.new-cote a {
    color: #333
}
.new-cote .span_4_of_12 {
    background-color: #ECECEC;
    padding: 10px;
    box-sizing: border-box;
}
.new-cote .span_4_of_12 h5 {
    font-size: 1.6rem;
    color: #fff;
    background-color: #232830;
    padding: 5px;
}
.new-cote li {
    line-height: 1.5;
    font-size: 1.5rem;
    list-style-type: square;
}
.new-cote .target-to-sell li {
    list-style-type: none
}
.wine-info img {
    float: left;
    margin-right: 40px;
    margin-bottom: 20px;
    max-width: 400px;
}
.wine-info .more br {
    display: none
}
.wine-info .more {
    text-align: justify
}
.wine-info h3 {
    text-align: justify;
    line-height: 1.5;
    font-size: 1.5rem;
    margin: 5px 0;
    font-weight: 400;
    font-weight: normal;
}
.wine-info h2,
.new-cote h2 {
    text-transform: none
}
.wine-info h2,
.new-cote h2 {
    line-height: 1.2
}
.morecontent span {
    display: none
}
.morelink {
    display: block
}
.property li {
    list-style-type: square
}
.property li a {
    color: #333;
    margin-left: 5px;
    font-weight: bold;
    line-height: 1.6;
}
.btn-more {
    padding: 10px;
    background-color: #ECECEC;
    color: #333;
    text-align: center;
    margin: 20px 0;
    text-transform: uppercase
}

#barChart {
    min-height: 500px
}

.cote-custom .clear-nav {
    clear: both;
height: 0;}

li small { color:#333;}

.faq-article .span_3_of_12 { background-color: #f3f3f3; padding: 10px 25px; box-sizing: border-box; line-height: 1.2; z-index: 10; }
.faq-article img {float: left; margin-right: 30px; border: 10px solid #f3f3f3; margin-bottom: 40px;}
.faq-article img:first-of-type {margin-bottom: 95px;}
.faq-article .float-img {float: right; margin: 0; margin-left: 20px;} 
.faq-article p {   line-height: 1.4;}
.faq-article h1 { font-size: 2rem; font-weight: 100; font-family: Raleway; }
.faq-article h2 { font-size: 1.5rem !important;margin: 5px 0;font-weight: 400; text-transform: none; }
.faq-article h3 { background-color: #474751; color: #fff; padding: 4px 10px; }
.faq-article h4 { font-size: 1.8rem; font-weight: 100; font-family: Raleway; padding-bottom: 5px; margin: 0; }
.faq-article h5 { font-weight: bold; font-size: 1.6rem; color: rgba(50,50,50,1.00); margin: 0; }
.faq-article li { line-height: 1.4; list-style-type: square !important; padding: 3px 0; }
.faq-article ol { padding-left: 15px; }
.faq-article .no-visible { list-style-type: none !important; }
.faq-article .info { background-color: rgba(0,0,0,0.05); padding: 5px; display: inline-block; }
.faq-article li a span { text-decoration: underline; }
.faq-article .background-style, .faq-article small {     background-color: rgba(0,0,0,0.05); }
.faq-article .faq-article small { background-color: rgba(0,0,0,0.05); display:block; padding:10px; margin:10px 0;}
.faq-article .background-style-1  {     background-color: rgba(0,0,0,0.8); color:#fff; }
.faq-article th { padding:5px; text-transform:uppercase;}
.faq-article .span_9_of_12 a, .faq-article .span_12_of_12 a { font-weight: bold; text-decoration: underline; color:#474751;  }
.faq-article .border-img img {max-width: 100px; margin: auto;}
 .faq-article .flag {padding-right: 10px !important; }
 .faq-article br {display: none;}
  .faq-article p br {display: block;}
 .faq-article p, .faq-article li a { text-align: justify;}
 #graphique_degustation { float: left; margin-right: 20px;}
 .faq-article .span_3_of_12 a { font-weight: normal; color:#474751; text-align: left !important; }

.tp-caption p a { color:#d44457;}

#promo-banner-03 .promo { left: 0.5%; top: 25px; box-shadow: 3px 3px 1px rgba(0,0,0,0.5);position: absolute;  background-color: #fff; border-radius: 180px; padding: 30px 16px; 
 text-align: center;
}
#promo-banner-03 .promo p{color:#d44457;font-size: 1.8rem; text-transform: uppercase; font-weight: bold !important;
-ms-transform: rotate(-17deg); /* IE 9 */
    -webkit-transform: rotate(-17deg); /* Chrome, Safari, Opera */
    transform: rotate(-17deg);}
#promo-banner-03 {
padding: 15px 10px;
    position: relative;
background: repeating-linear-gradient(
  45deg,
  #d44457,
  #d44457 50px,
  #CA3A4D 50px,
  #CA3A4D 100px
);
}
#promo-banner-03 p i { font-size: 3.5rem;}
#promo-banner-03 a { position: absolute; right: 10px; bottom: 10px; font-size: 1.6rem; background-color: #fff; color:  #CA3A4D; padding: 10px; box-shadow: 3px 3px 1px rgba(0,0,0,0.5); font-family: raleway;}
#promo-banner-03 p {font-size: 3rem; font-family: raleway; font-weight: 100; color: #fff; text-transform: uppercase; text-align: center; vertical-align: middle; }
#promo-banner-03 p strong {font-weight: 700; }
#promo-banner-03 small {text-align: center; font-size: 1.3rem; display: block; color: #fff; font-weight: 300; }
#promo-banner-03  aside {width: 80%; margin: auto;}

.faq-article .span_9_of_12 { float: right; }
 .fixed {position: fixed; max-width: 320px;}

 input+.tooltip {
    display: none;
}
input:focus+.tooltip {
    display: block;
    text-indent: 10px;
    font-size: 12px;
    color: #585858;
    text-align: justify;
}

::selection {
    background: #ebf4fc;
}

.absolute-type {
    float: left;
    width: 100%;
    margin-top: 500px;
    background-color: #d44457;
    color: #fff;
    /* margin: 0 !important; */
    text-transform: uppercase;
    z-index: 100;
    position: relative;
}

.delay-4 {

    animation-delay: 0.75s;

}

#slideit * {

    color: #fff;
}

#slideit a {
    text-decoration: none;
}

#slideit label {
    cursor: pointer;
}

#slideit input[type="radio"] {
    display: none;
}


#slideit {
    z-index: 9999;
/* Keep the item above all other elements on the page */
    position: fixed;
    width: 100%;
/* Width of the wrapper of the section. Adjust this value if you want wider elements */
    bottom: -70px;
/* Vertical position of the elements */
    left: 0;
/* Horizontal position of the elements */
}

#slideit h4 {
    font-size: 2.8rem;
    padding:0;
    text-transform: uppercase;
    font-family: 'roboto',sans-serif;
    font-weight: 300;
    text-align: left;
    display: block;
    margin: auto;
}

#slideit img {
    max-width: 220px;
    z-index: 100;
    float: left;
    margin: -60px 20px 0 0;
}

#slideit h4 b {
    font-weight: 700;
}


#slideit section {
    border-top: 4px solid #2d2d37;
    background-color: #3b3b44;
    background: repeating-linear-gradient(45deg,#2d2d37,#2d2d37 10px,#3b3b44 10px,#3b3b44 20px);
    margin: 0;
    width: 100%;
    height: auto;
    left: 0;
    bottom: 0;
    position: absolute;
    z-index: 10;
    -webkit-backface-visibility: hidden;
/* Webkit transition hack */
}

#slideit section,#slideit input#close-item:checked ~ section {
/* Section position when closed */
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

#slideit input#open-item:checked ~ section {
/* Section position when opened */
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

#slideit section .wrap {
    padding: 0;
    position: relative;
    margin: auto;
    display: block;
    text-align: center;
}

#slideit label.open,#slideit label.close {
    text-align: center;
    position: absolute;
}


#slideit label.close {
    right: 30px;
    left: auto;
    top: 0;
    bottom: auto;
    font-size: 2rem;
    background: #d44457;
    color: #fff;
    width: 30px;
    z-index: 999;
    font-weight: 300;
}

#slideit label.close:hover,#slideit label.close:focus {
    background: #EE5E71;
}

#slideit .button-flat2 {
    border: none;
    box-shadow: inset 1px 1px 1px rgba(255,255,255,0.3),0 3px 3px rgba(0,0,0,0.15),0 3px 2px -2px rgba(0,0,0,0.2);
    font-weight: 700;
    text-align: center;
    color: #fff;
    text-shadow: 0 -.5px 1px rgba(0,0,0,0.15);
    font-family: roboto;
    padding: 15px;
    background-color: #d44457;
    font-weight: 400;
    position: absolute;
    right: 0;
    top: 0;
}

#slideit .button-flat2:hover {
    background: #EE5E71;
}

a:active,a:hover {
    outline: 0;
}

#slideit .button-flat2 i {
    padding-left: 10px !important;
}

#slideit p {
    font-family: roboto;
    color: #fff;
    font-weight: 300;
    font-size: 1.5rem;
    text-align: left;
}

#slideit input#open-item:checked ~ section { padding: 20px; }

/***** Transitions *****/
#slideit label,#slideit a {
    -webkit-transition: all .1s ease-in-out;
    -moz-transition: all .1s ease-in-out;
    -ms-transition: all .1s ease-in-out;
    -o-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out;
}

#slideit section {
    -webkit-transition: all .4s cubic-bezier(0.2,0.6,0.3,1);
    -moz-transition: all .4s cubic-bezier(0.2,0.6,0.3,1);
    -ms-transition: all .4s cubic-bezier(0.2,0.6,0.3,1);
    -o-transition: all .4s cubic-bezier(0.2,0.6,0.3,1);
    transition: all .4s cubic-bezier(0.2,0.6,0.3,1);
}

 {
    -webkit-transition: bottom .3s ease 0.4s,background .1s ease,color .1s ease;
    -moz-transition: bottom .3s ease 0.4s,background .1s ease,color .1s ease;
    -ms-transition: bottom .3s ease 0.4s,background .1s ease,color .1s ease;
    -o-transition: bottom .3s ease 0.4s,background .1s ease,color .1s ease;
    transition: bottom .3s ease 0.4s,background .1s ease,color .1s ease;
}

#slideit {
    -moz-animation-name: dropHeader;
    -moz-animation-iteration-count: 1;
    -moz-animation-timing-function: ease-in;
    -moz-animation-duration: .5s;
    -webkit-animation-name: dropHeader;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-timing-function: ease-in;
    -webkit-animation-duration: .5s;
    animation-name: dropHeader;
    animation-iteration-count: 1;
    animation-timing-function: ease-in;
    animation-duration: .5s;
}


@media screen and (max-width: 1024px) {
    #slideit h4 {
        max-width: 900px;
    }

    #slideit img {
        display: none;

    }
    #slideit {bottom: 0;}

}

@media screen and (min-width: 1024px) {
    #slideit h4 {
        max-width: 900px;
    }

    #slideit section .wrap {
        max-width: 950px;
    }
}





/* RESPONSIVE**********************************************************************************************************************************************************
   ================================================== */
/* MOBILE VERSION (< 1000px) *********************************************************
   ================================================== */
@media only screen and (max-width: 1000px) { 
    .faq-article img { float: none; width: 100%; margin-bottom: 10px;}
    .faq-article .span_3_of_12 { position: relative;  max-width: none; }

    #idw-anim, .absolute-type {    position: absolute; margin-top:87% !important;}
#slideit-cookie section {
    bottom: 95px;}
    #result-item .price { font-size: 25px; }
.custom1 .owl-item img { height: auto; }
.cadre { overflow: visible; }
.cloudzoom, .span_5_of_12 img { max-width: 75%; margin: auto; }
.time h6 { width: 100%; text-align: center !important; font-size: 2rem; }
.time { width: 100%; text-align: center !important; }
.wrapper-for-old-site h1 { font-size: 2rem !important; margin: 0; font-weight: 300; line-height: 1.3; }
.bloc-prix .btn { width: 100%; box-shadow: none; }
.achat button { margin-left: 0; font-size: 2rem; }
.input-prix { border: 1px solid #cacaca !important; }
.achat input, .achat fieldset { display: block; float: left; margin: 0; }
.achat fieldset { width: 25%; float: none; margin: 0; max-width: none; padding: 0; }
.achat .input-prix { width: 75% !important; max-height: 100%; max-width: 100%; }
.achat .mini { padding: 10px; font-size: 1.6rem; }
.achat .mini:first-child { margin-top: 0 !important; }
.bloc-prix .btn .icon-arrow-right { color: #fff; }
.legend { font-size: 1.2rem !important; }
.cote-list #form_millesime { width: 100px !important; }
.detail { background-color: rgba(255,255,255,1); border: none; width: 90%; padding-top: 10px; box-shadow: none; }
.bloc-prix, .modif, #compte_a_rebours { box-shadow: none; padding: 0; }
#compte_a_rebours { min-width: 0; }
.icon-alarm, .icon-info { font-size: 2rem; }
.bloc-prix .prix-fixe { width: 100%; display: block; text-align: center; }
.bloc-prix { background-color: transparent; }
#header-cote .bloc-cote, #header-cote small {position: relative !important; float: none; top: 0 !important; right: 0 !important;}
 #header-cote small { padding-bottom: 10px; display: block; text-align: right;}
 #header-cote .cote-bloc, .note-cote {height: auto;}
 #header-cote .vintage-list {padding-left: 25px;}
    #result-item .price {
    font-size: 25px;}

    .custom1 .owl-item img { height: auto;}

    #header-cote .clear-max {
        height: 10px
    }
    #header-cote .vintage-list {
        height: 150px;
        overflow-y: visible;
    }
    #header-cote .button,
    .ariane,
    #header-cote .owl-prev,
    #promo-banner-02,
    #barChart {
        display: none
    }
    #header-cote #formHome,
    #header-cote .fieldcontainer {
        width: 100%;
        max-width: 100%;
    }
    #header-cote small {
        position: absolute;
        bottom: -90px;
        right: 15px;
    }
    #header-cote .span_4_of_12, #header-cote .span_6_of_12  {
        margin-bottom: 10px
    }
    .wine-info img {
        margin: auto;
        float: none;
        display: block;
    }

    .flag-mobile li {
        display: inline-block
    }
    .flag-mobile {
        padding-left: 15px
    }
    .flag-mobile .flag {
        padding: 0px;
        margin-right: 5px !important;
    }
    .bg-saga form {
        padding: 10px
    }
    .owl-theme .owl-controls .owl-page span,
    .banner-00,
    .hide-for-mobile,
    .new-wine .triangle,
    .new-wine #tabs4 #nav-item li:last-of-type,
    .sticker-promo,
    #content-login .log:before,
    nav .button-flat:before,
    nav .button-flat:after {
        display: none !important
    }
    .wsmenu > .wsmenu-list > .border-select > .for-mobile {
        position: relative
    }
    .wsmenu > .wsmenu-list > .border-select:hover > .for-mobile {
        color: #fff
    }
    .result-item-order {
        padding: 20px;
        text-align: center;
    }
    .result-item-order .span_7_of_12 {
        border: none
    }
    .result-item-order .button-flat {
        display: block;
        text-align: center;
    }
    .result-item-order h3 {
        font-size: 2rem
    }
    .custom2 figure {
        min-height: 140px
    }
    #result-item .span_8_of_12 {
        max-width: 60%
    }
    #result-item .span_2_of_12 {
        max-width: 20%
    }
    .custom2 .sale {
        font-size: 1rem !important
    }
    .bg-img {
        min-height: 120px
    }
    .c-mask {
        display: none
    }
    .c-menu__close {
        background-color: #d44457 !important
    }
    .c-buttons {
        text-align: left;
        display: block;
        float: left;
    }
    #result-right .result-bar {
        background: #2d2d37;
        width: 100%;
        display: block;
        height: 32px;
    }
    #result-item .medium {
        padding: 6px 20px;
        width: 100%;
    }
    .wsmenu > .wsmenu-list > .border-select > a {
        line-height: 2.8
    }
    .wsmenu-list li > .wsmenu-submenu {
        background-color: #fff !important
    }
    #content-login .wsmenu-submenu {
        display: block !important
    }
    #result-item h2 {
        font-size: 1em !important
    }
    #promo-banner-01 aside,
    #promo-banner-02 aside {
        font-size: 1.5rem
    }
    .pagingV3 {
        float: right !important;
        display: block !important;
        position: relative !important;
        top: 0;
        margin-bottom: 0;
    }
    .pagingV2 {
        width: 100%;
        display: block;
        position: relative;
    }
    .pagination {
        padding-right: 0
    }
    .custom1 .owl-item img {
        min-height: auto;
        width: 100%;
    }
    .custom1 .owl-item .title-content,
    .custom3 .owl-item .title-content {
        font-size: 1.6rem;
        margin-top: 35%;
    }
    .search-cote .bg_cote h1 {
        margin-top: 50px;
        font-size: 1.8rem;
    }
    .search-cote .bg_cote {
        height: 400px;
        height: 100%;
    }
    .search-cote .bg_cote #formCote {
        max-width: 100%;
        padding: 0;
    }
    .search-cote #formCote {
        background-color: transparent
    }
    .search-cote .cote-input p {
        font-size: 1.1rem
    }
    .search-cote .bg_cote {
        background: url("../img/cote/bg-cote-4.jpg")0 -0px;
        background-repeat: no-repeat;
        width: 100%;
        background-size: cover;
        height: 200px !important;
        min-height: 200px;
        display: block;
    }
    .clear3 {
        height: 2rem
    }
    #slideit-cookie {
        font-size: 1.2rem
    }
    #slideit-cookie label {
        float: right
    }
    #slideit-cookie .links a {
        margin: 0
    }
    #content-search {
        background-color: #d44457;
        margin: 0;
        padding: 5px;
    }
    #content-search .searchfield {
        border: none
    }
    #content-search::-webkit-input-placeholder {
        /* Chrome/Opera/Safari */
        color: #cacaca;
    }
    #content-search::-moz-placeholder {
        /* Firefox 19+ */
        color: #cacaca;
    }
    #content-search:-ms-input-placeholder {
        /* IE 10+ */
        color: #cacaca;
    }
    #content-search:-moz-placeholder {
        /* Firefox 18- */
        color: #cacaca;
    }
    .animated-arrow span,
    .animated-arrow span:before,
    .animated-arrow span:after {
        background-color: #d44457
    }
    .content-4 .span_4_of_12 {
        height: auto !important
    }
    .wrapper {
        padding: 0 6%
    }
    .wrapper h2 {
        font-size: 2rem
    }
    .chart {
        padding-left: 0
    }
    .blog-flux time span {
        font-size: 1.5rem
    }
    .blog-flux time {
        padding: 18px 10px
    }
    footer .social-space li {
        margin: 6px
    }
    .cote-search #searchbtn {
        right: 10px
    }
    .NotGeneric-Title {
        font-size: 1.8rem
    }
    .tp-caption h4 {
        font-size: 2rem;
        line-height: 28px;
    }
    .baseline h1 {
        font-size: 1.7rem
    }
    .new-wine #tabs4 h3 {
        font-size: 1.7rem
    }
    .new-wine .wrapper-hide li {
        width: 30%
    }
    .new-wine #tabs4 #nav-item li a {
        min-width: 120px
    }
    .new-wine #tabs_container li {
        margin-left: 3%
    }
    #tabs4 #tabs_container {
        min-height: 1300px
    }
    .new-wine #tabs4 ul li {
        margin-bottom: 10px
    }
    #nav-item {
        padding-left: 0
    }
    .baseline h1 {
        padding: 10px
    }
    .col {
        margin: 1% 0
    }
    .span_1_of_12,
    .span_2_of_12,
    .span_3_of_12,
    .span_4_of_12,
    .span_5_of_12,
    .span_6_of_12,
    .span_7_of_12,
    .span_8_of_12,
    .span_9_of_12,
    .span_10_of_12,
    .span_11_of_12,
    .span_12_of_12 {
        width: 100%
    }
    .wsmenu-list > li:hover>a {
        background-color: rgba(0, 0, 0, 0.08) !important;
        text-decoration: none;
    }
    .hometext {
        display: inline-block !important
    }
    .megacollink {
        width: 96% !important;
        margin: 0 2% !important;
    }
    .megacolimage {
        width: 90% !important;
        margin: 0 5% !important;
    }
    .typographylinks {
        width: 98% !important;
        margin: 0 1% !important;
    }
    .typographydiv {
        width: 86% !important;
        margin: 0 7% !important;
    }
    .mainmapdiv {
        width: 90% !important;
        margin: 0 5% !important;
    }
    .overlapblackbg {
        left: 0;
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        display: none;
        background-color: rgba(0, 0, 0, 0.8);
        cursor: pointer;
    }
    .overlapblackbg.menuopen {
        display: block
    }
    .wsmenu-submenu > li:hover>a {
        background-color: #7b7b7b;
        color: #666;
    }
    .wsmenu > .wsmenu-list > li > a.active {
        color: #666;
        background-color: rgba(0, 0, 0, 0.08);
    }
    .wsmenu > .wsmenu-list > li > a:hover {
        color: #666;
        background-color: rgba(0, 0, 0, 0.08);
    }
    .wsmenu-list li:hover .wsmenu-submenu {
        display: none
    }
    .wsmenu-list li:hover .wsmenu-submenu .wsmenu-submenu-sub {
        display: none
    }
    .wsmenu-list .wsmenu-submenu .wsmenu-submenu-sub li:hover .wsmenu-submenu-sub-sub {
        display: none;
        list-style: none;
        padding: 2px;
        border: solid 1px #eee;
        background-color: #fff;
    }
    .wsmenu-list li:first-child a {
        -webkit-border-radius: 0 0 0 0;
        -moz-border-radius: 0;
        border-radius: 0 0 0 0;
    }
    .wsmenu-list li:last-child a {
        -webkit-border-radius: 0 4px 0 0;
        -moz-border-radius: 0;
        border-radius: 0 0 0 0;
        border-right: 0 solid;
    }
    .innerpnd {
        padding: 0 !important
    }
    .typography-text {
        padding: 10px 0
    }
    .wsmenucontainer {
        overflow: hidden;
        -webkit-backface-visibility: hidden;
        -moz-backface-visibility: hidden;
        -ms-backface-visibility: hidden;
        -webkit-transition: all .4s ease-in-out;
        -moz-transition: all .4s ease-in-out;
        -o-transition: all .4s ease-in-out;
        -ms-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }
    .wsmenuexpandermain {
        display: block !important;
        position: relative;
        top: 0;
        right: 0;
        left: 0;
        -webkit-transition: all .4s ease-in-out;
        -moz-transition: all .4s ease-in-out;
        -o-transition: all .4s ease-in-out;
        -ms-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }
    /* ===[ Mobile click to drop arrow ]=== */
    .wsmenu-click {
        height: 43px;
        position: absolute;
        top: 0;
        right: 0;
        display: block;
        cursor: pointer;
        width: 100%;
    }
    .wsmenu-click i {
        display: block;
        height: 23px;
        width: 25px;
        margin-top: 11px;
        margin-right: 8px;
        background-size: 25px;
        color: rgba(0, 0, 0, 0.25);
        float: right;
    }
    .wsmenu-rotate {
        -webkit-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    /* ===[ 2nd UL Style ]=== */
    .wsmenu-submenu-sub {
        width: 100% !important;
        position: static !important;
        left: 100% !important;
        top: 0 !important;
        display: none;
        margin: 0 !important;
        padding: 0 !important;
        border: solid 0 !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    .wsmenu-submenu-sub li {
        margin: 0 !important;
        padding: 0;
        position: relative;
    }
    .wsmenu-submenu-sub a {
        display: block;
        padding: 10px 25px;
        border-bottom: solid 1px #ccc;
        font-weight: 400;
    }
    .wsmenu-submenu-sub li a.active {
        color: #000 !important
    }
    .wsmenu-submenu-sub li:hover>a {
        background-color: #333 !important;
        color: #fff;
    }
    .wsmenu-list > li > a .fa {
        margin-right: 6px
    }
    .wsmenu-submenu-sub-sub {
        width: 100% !important;
        position: static !important;
        left: 100% !important;
        top: 0 !important;
        display: none;
        margin: 0 !important;
        padding: 0 !important;
        border: solid 0 !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    .wsmenu-submenu-sub-sub li {
        margin: 0 !important
    }
    .wsmenu-submenu-sub-sub a {
        display: block;
        color: #000;
        padding: 10px 25px;
        background: #000 !important;
        border-bottom: solid 1px #ccc;
        font-weight: 400;
    }
    .wsmenu-submenu-sub-sub li a.active {
        color: #000 !important
    }
    .wsmenu-submenu-sub-sub li:hover>a {
        background-color: #606060 !important;
        color: #fff;
    }
    .wsmenu {
        position: relative
    }
    .wsmenu .wsmenu-list {
        height: 100%;
        overflow-y: auto;
        display: block !important;
    }
    .wsmenu .wsmenu-list > .border-select {
        width: 240px;
        display: block;
        float: none;
        border-right: none;
        position: relative;
        white-space: inherit;
    }
    .wsmenu > .wsmenu-list > .border-select > a {
        padding: 9px 32px 9px 17px;
        text-align: left;
        border-right: solid 0;
        color: #666;
        line-height: 25px;
        border-bottom: 1px solid;
        border-bottom-color: rgba(0, 0, 0, 0.13);
        position: static;
    }
    .no-static {
        position: relative !important
    }
    .wsmenu > .wsmenu-list > li > a > .fa {
        color: #bfbfbf
    }
    .wsmenu .wsmenu-list li a .arrow:after {
        display: none !important
    }
    .wsmenu .wsmenu-list li ul li a .fa.fa-caret-right {
        color: #8E8E8E
    }
    .mobile-sub .wsmenu-submenu {
        transform: none !important;
        opacity: 1 !important;
        display: none;
        position: relative !important;
        top: 0;
        background-color: #333;
        border: solid 1px #ccc;
        padding: 0;
        visibility: visible !important;
    }
    .mobile-sub .wsmenu-submenu li a {
        line-height: 20px;
        height: 36px;
        padding: 8px 0 8px 18px;
        color: #8E8E8E;
    }
    .mobile-sub .wsmenu-submenu li a:hover {
        background-color: #e7e7e7 !important;
        color: #666;
        text-decoration: underline;
    }
    .mobile-sub .wsmenu-submenu li:hover>a {
        background-color: #e7e7e7 !important;
        color: #666;
    }
    .mobile-sub .wsmenu-submenu li .wsmenu-submenu-sub li a {
        line-height: 20px;
        height: 36px;
        background-color: #e7e7e7 !important;
        border-bottom: none;
        padding-left: 28px;
    }
    .mobile-sub .wsmenu-submenu li .wsmenu-submenu-sub li .wsmenu-submenu-sub-sub li a {
        line-height: 20px;
        height: 36px;
        background-color: #e7e7e7 !important;
        border-bottom: none !important;
        padding-left: 38px;
        color: #8e8e8e;
    }
    .mrginleft {
        -webkit-transition: all .1s ease-in-out;
        -moz-transition: all .1s ease-in-out;
        -o-transition: all .1s ease-in-out;
        -ms-transition: all .1s ease-in-out;
        transition: all .1s ease-in-out;
    }
    .wsmenu-list .megamenu {
        background-color: #e7e7e7;
        color: #666;
        display: none;
        position: relative !important;
        top: 0;
        padding: 0;
        border: solid 0;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    .wsmenu-list li:hover .megamenu {
        display: none;
        position: relative !important;
        top: 0;
    }
    .megamenu .title {
        color: #666;
        padding: 10px 8px 10px 0;
    }
    .halfdiv .title {
        padding-left: 15px
    }
    .megamenu > ul {
        width: 100% !important;
        margin: 0;
        padding: 0;
    }
    .megamenu > ul > li > a {
        padding: 9px 14px !important;
        line-height: normal !important;
        background-color: #e7e7e7 !important;
        color: #666;
    }
    .megamenu > ul > li > a:hover {
        background-color: #000 !important
    }
    .ad-style {
        width: 100% !important
    }
    .megamenu ul li.title {
        line-height: 26px;
        color: #666;
        margin: 0;
        padding: 7px 13px !important;
        border-bottom: 1px solid #ccc;
        background-color: transparent !important;
    }
    .halfdiv {
        width: 100%;
        display: block;
    }
    .menu_form {
        padding: 10px 10px 63px;
        background-color: #e7e7e7;
    }
    .menu_form input[type="button"] {
        width: 46%
    }
    .menu_form input[type="submit"] {
        width: 46%
    }
    .menu_form textarea {
        min-height: 100px
    }
    .wsmenu {
        width: 0;
        height: 100%;
        position: fixed;
        right: -1px;
        top: 0;
        margin: 0;
        border-radius: 0;
        z-index: 200;
        -webkit-transition: all .1s ease-in-out;
        -moz-transition: all .1s ease-in-out;
        -o-transition: all .1s ease-in-out;
        -ms-transition: all .1s ease-in-out;
        transition: all .1s ease-in-out;
        background-color: #fff !important;
        border-left: 1px solid rgba(0, 0, 0, 0.7);
    }
    /* ===[ Nav Expanding Open Effect ]=== */
    .wsmenu.menuopen {
        width: 240px;
        -webkit-transition: all .1s ease-in-out;
        -moz-transition: all .1s ease-in-out;
        -o-transition: all .1s ease-in-out;
        -ms-transition: all .1s ease-in-out;
        transition: all .1s ease-in-out;
    }
    .wsmenu.menuclose {
        -webkit-transition: all .1s ease-in-out;
        -moz-transition: all .1s ease-in-out;
        -o-transition: all .1s ease-in-out;
        -ms-transition: all .1s ease-in-out;
        transition: all .1s ease-in-out;
    }
    /* ===[ Navigation arrow Animation ]=== */
    .animated-arrow {
        position: fixed;
        right: 0;
        top: 0;
        z-index: 200;
        -webkit-transition: all .2s ease-in-out;
        -moz-transition: all .2s ease-in-out;
        -o-transition: all .2s ease-in-out;
        -ms-transition: all .2s ease-in-out;
        transition: all .2s ease-in-out;
    }
    .callusicon {
        color: #c9c9c9;
        height: 25px;
        position: fixed;
        right: 15px;
        top: 13px;
        width: 25px;
        z-index: 2;
        -webkit-transition: all .4s ease-in-out;
        -moz-transition: all .4s ease-in-out;
        -o-transition: all .4s ease-in-out;
        -ms-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out;
    }
    .callusicon:focus,
    callusicon:hover {
        color: #fff !important
    }
    .mrginleft .callusicon {
        display: none !important
    }
    .wsmenuexpandermain .menuopen {
        right: 240px !important;
        margin-top: 4px !important;
    }
    .smallogo {
        width: 100%;
        display: block;
        text-align: center;
        padding-top: 9px;
        position: fixed;
        z-index: 0;
        height: 52px;
        background: #262626;
        background: -moz-linear-gradient(top, #262626 0, #1c1c1c 50%, #262626 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #262626), color-stop(50%, #1c1c1c), color-stop(100%, #262626));
        background: -webkit-linear-gradient(top, #262626 0, #1c1c1c 50%, #262626 100%);
        background: -o-linear-gradient(top, #262626 0, #1c1c1c 50%, #262626 100%);
        background: -ms-linear-gradient(top, #262626 0, #1c1c1c 50%, #262626 100%);
        background: linear-gradient(to bottom, #262626 0, #1c1c1c 50%, #262626 100%);
        -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .5);
        box-shadow: 0 1px 4px rgba(0, 0, 0, .5);
    }
    .animated-arrow {
        cursor: pointer;
        padding: 13px 35px 16px 0;
        margin: 15px 0 0 15px;
    }
    .animated-arrow span,
    .animated-arrow span:before,
    .animated-arrow span:after {
        cursor: pointer;
        height: 3px;
        width: 23px;
        background: #fff;
        position: absolute;
        display: block;
        content: '';
    }
    .animated-arrow span:before {
        top: -7px
    }
    .animated-arrow span:after {
        bottom: -7px
    }
    .animated-arrow span,
    .animated-arrow span:before,
    .animated-arrow span:after {
        transition: all 500ms ease-in-out
    }
    .animated-arrow.menuopen span {
        background-color: transparent
    }
    .animated-arrow.menuopen span:before,
    .animated-arrow.active span:after {
        top: 7px
    }
    .animated-arrow.menuopen span:before {
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        bottom: 0;
    }
    .animated-arrow.menuopen span:after {
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    /* ===[ Animation None ]=== */
    .wsmenu-list li > .wsmenu-submenu {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
    }
    .wsmenu-list li:hover > .wsmenu-submenu {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
    }
    .wsmenu-submenu li > .wsmenu-submenu-sub {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
    }
    .wsmenu-submenu li:hover > .wsmenu-submenu-sub {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .wsmenu-submenu-sub li > .wsmenu-submenu-sub-sub {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .wsmenu-submenu-sub li:hover > .wsmenu-submenu-sub-sub {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .wsmenu-list li > .megamenu {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    .wsmenu-list li:hover > .megamenu {
        -o-transform: none !important;
        -moz-transform: none !important;
        -webkit-transform: none !important;
        transform: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
    #content-login {
        width: 100%;
        display: block;
        padding: 6%;
    }
    #content-login a:last-of-type {
        margin-top: 10px
    }
    #content-search {
        float: none
    }
    .slider,
    .overlapblackbg {
        z-index: 1
    }
    .wsmenu-list > li:hover> a {
        background-color: #d44457 !important
    }
    .mobile-only {
        display: inline-block
    }
    .logo-mobile {
        padding: 10px
    }
    #content-right,
    .mobile-hide,
    .select {
        display: none !important
    }
    .section {
        clear: both;
        margin: 0;
    }
    .tp-caption h4 {
        font-size: 1.4rem;
        line-height: 20px;
    }
    .tp-bannertimer {
        margin-top: 0 !important;
        top: 0 !important;
    }
    .slider {
        overflow: hidden;
        min-height: 310px;

    }
    .wsmenu > .wsmenu-list > li > a {
        color: #333;
        text-transform: uppercase;
    }
    .wsmenu .wsmenu-list > li {
        border-bottom: 1px solid rgba(255, 255, 255, 0.10)
    }
    .wsmenu-list li > .wsmenu-submenu {
        border: none;
        background-color: rgba(230, 230, 230, 1);
    }
    .mobile-sub .wsmenu-submenu li a {
        background-color: transparent
    }
    .bigmegamenu {
        margin-top: 0
    }
    .header {
        border-bottom: none;
        position: static;
        width: 100%;
        z-index: 100;
        box-sizing: border-box;
    }
    .wsmenu-list > li:first-of-type {
        background-color: #000 !important
    }
    .wsmenu-list > li:first-of-type a {
        margin: 0
    }
    .searchfield {
        width: 100%;
        padding: 15px !important;
    }
    #searchbtn {
        right: 5px;
        top: 8px;
    }
    .wsmenu-list > li > a {
        margin-top: 0
    }
    #slideit-cookie p.copyright {
        width: 100%
    }
    #slideit-cookie section .wrap {
        text-align: left
    }
    #slideit-cookie .links a {
        width: 100%;
        display: block;
        margin-left: 0;
    }
    #slideit-cookie p.copyright {
        float: left;
        margin: 10px 0 0;
    }
    #slideit-cookie * {
        text-align: left
    }
    .custom2 .sale {
        font-size: 1.1rem
    }
    .clear-nav {
        clear: both;
        height: 0.5rem;
    }
}
/* DESKTOP VERSION (> 1000px)  *********************************************************
   ================================================== */
@media screen and (min-width: 1000px) { 
    .header .wsmenu-list #content-login {
        float: right
    }
    .header .wsmenu-list li .button-flat {
        padding: 0;
        padding-right: 2em;
        display: inline-block;
    }
    .cd-header {
        height: 70px;
        background-color: transparent;
    }
    #cd-logo {
        margin: 23px 0 0 5%
    }
    .cd-primary-nav {
        float: right;
        margin-right: 5%;
        width: 44px;
        height: 100%;
        background: url(../assets/cd-icon-menu.svg) no-repeat center center;
    }
    .cd-primary-nav ul {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        -webkit-transform: translateY(-100%);
        -moz-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    .cd-primary-nav ul.is-visible {
        box-shadow: 0 3px 8px rgba(0, 0, 0, 0.2);
        -webkit-transform: translateY(50px);
        -moz-transform: translateY(50px);
        -ms-transform: translateY(50px);
        -o-transform: translateY(50px);
        transform: translateY(50px);
    }
    .cd-primary-nav a {
        display: block;
        height: 50px;
        line-height: 50px;
        padding-left: 5%;
        background: #21272c;
        border-top: 1px solid #333c44;
        color: #fff;
    }
    .cd-primary-nav {
        width: auto;
        height: auto;
        background: none;
    }
    .cd-primary-nav ul {
        position: static;
        width: auto;
        -webkit-transform: translateY();
        -moz-transform: translateY();
        -ms-transform: translateY();
        -o-transform: translateY();
        transform: translateY();
        line-height: 70px;
    }
    .cd-primary-nav ul.is-visible {
        -webkit-transform: translateY();
        -moz-transform: translateY();
        -ms-transform: translateY();
        -o-transform: translateY();
        transform: translateY();
    }
    .cd-primary-nav li {
        display: inline-block;
        margin-left: 1em;
    }
    .cd-primary-nav a {
        display: inline-block;
        height: auto;
        font-weight: 600;
        line-height: normal;
        background: transparent;
        padding: .6em 1em;
        border-top: none;
    }
    .cd-hero-slider h2,
    .cd-hero-slider p,
    .label-vente {
        text-align: center;
        max-width: 650px;
        margin: auto;
        width: 80%;
    }
    .material-icons {
        vertical-align: middle
    }
    .cd-hero-slider .cd-half-width:first-of-type {
        left: 50%;
        max-width: 700px;
    }
    .cd-hero-slider h2 {
        font-size: 3rem;
        font-family: 'Roboto', sans-serif;
        text-transform: uppercase;
        color: #fff;
        font-weight: 700;
    }
    .cd-hero-slider h2 span {
        font-weight: 300
    }
    .online {
        color: #bd2a30
    }
    .direct {
        color: #2ca35a
    }
    .label-vente {
        font-weight: 100;
        text-transform: uppercase;
        font-size: 6rem;
        padding-bottom: 20px;
    }
    .cd-slider-nav a {
        background-color: #bd2a30;
        margin: 0 10px;
        padding-top: 0;
    }
    .cd-slider-nav {
        background-color: transparent
    }
    .cd-slider-nav nav {
        height: 15px
    }
    .cd-slider-nav li,
    .cd-slider-nav .cd-marker {
        width: 60px
    }
    .cd-slider-nav .cd-marker {
        z-index: 1;
        color: #fff;
        padding: 5px;
        bottom: -2px;
        height: 150%;
    }
    .cd-hero-slider li:nth-of-type(3),
    .cd-hero-slider li:nth-of-type(2),
    .cd-hero-slider li:nth-of-type(1) {
        background-color: #000
    }
    .cd-hero-slider time {
        color: rgba(135, 135, 135, 1.00);
        font-weight: 300;
        display: block;
        margin-bottom: 25px;
        text-align: center;
    }
    .cd-hero-slider li {
        background-position: left bottom;
        background-size: contain;
        background-repeat: no-repeat;
    }
    .cd-hero-slider .cd-full-width,
    .cd-hero-slider .cd-half-width {
        padding-top: 190px
    }
    .header {
        background-color: #2d2d37
    }
    .wsmenu-list li:hover > .wsmenu-submenu {
        display: block !important
    }
    .wsmenu-submenu li:hover > .wsmenu-submenu-sub {
        display: block !important
    }
    .wsmenu-submenu-sub li:hover > .wsmenu-submenu-sub-sub {
        display: block !important
    }
    .wsmenu-list li:hover > .megamenu {
        display: block !important
    }
    .wsmenu-submenu-sub .col a {
        padding: 4px;
        line-height: normal;
        color: rgba(100, 100, 100, 1.00);
    }
    .wsmenu-submenu-sub .col a span {
        color: rgba(27, 27, 27, 1.00)
    }
    .wsmenu-submenu-sub .col {
        color: #333
    }
    .wsmenu-submenu li a {
        border-bottom: 1px solid rgba(225, 225, 225, 1.00);
        padding: 10px;
    }
    .wsmenu-submenu li:last-of-type a {
        border-bottom: none !important
    }
    .col-md-1 {
        float: left
    }
    .wsmenu-list .wsmenu-submenu .wsmenu-submenu-sub {
        min-height: 200px
    }
    .wsmenu-list .wsmenu-submenu .top-level-1 {
        top: -3px
    }
    .wsmenu-list .wsmenu-submenu .top-level-2 {
        top: -46px
    }
    .wsmenu-list .wsmenu-submenu .top-level-3 {
        top: -89px;
        padding: 10px !important;
    }
    .wsmenu-list .wsmenu-submenu .top-level-4 {
        top: -132px
    }
    .wsmenu-list > li {
        text-align: center;
        display: block;
        float: left;
    }
    #content-right ul {
        padding: 0;
        padding-left: 5px;
        margin-bottom: 0;
        margin-top: 5px;
    }
    #content-right label {
        color: #fff
    }
    #content-right .styled-select select {
        background-color: #3D3D3D;
        width: 75px;
        padding-top: 5px;
        font-size: 15px;
        line-height: 1;
        border-radius: 0;
        -webkit-appearance: none;
        border: none;
        color: #fff;
        font-weight: 700;
        cursor: pointer;
        box-sizing: border-box;
    }
    .styled-select {
        width: 75px;
        overflow: hidden;
    }
    #content-right form {
        padding-left: 5px
    }
    header {
        width: 100%
    }
    .mobile-only {
        display: none !important
    }
    .slider {
        max-height: 500px
    }
    .header .wsmenu-list {
        min-width: 400px;
        margin: 0 10px;
    }
    .header {
        padding: 0 15px;
        box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    }
    .header .wsmenu {
        float: left
    }
    header {
        z-index: 10;
        position: relative;
    }
    .wsmenucontainer {
        z-index: 9;
        position: relative;
    }
    header {
        -moz-animation-name: dropHeader;
        -moz-animation-iteration-count: 1;
        -moz-animation-timing-function: ease-in;
        -moz-animation-duration: .2s;
        -webkit-animation-name: dropHeader;
        -webkit-animation-iteration-count: 1;
        -webkit-animation-timing-function: ease-in;
        -webkit-animation-duration: .2s;
        animation-name: dropHeader;
        animation-iteration-count: 1;
        animation-timing-function: ease-in;
        animation-duration: .2s;
    }
    .header .wsmenu {
        width: 100%
    }
    .header .wsmenu-list > .border-select {
        border: 2px solid rgba(0, 0, 0, 0.00);
        padding: 0;
    }
    .header .wsmenu-list > .border-select:hover {
        border-top: 2px solid #d44457
    }
    .header .wsmenu-list > li > a {
        border-right: 1px solid rgba(255, 255, 255, 0.3);
        color: rgba(255, 255, 255, 0.8);
    }
    .header .wsmenu-list > li:first-of-type > a,
    .header .wsmenu-list > li:last-of-type > a {
        border: none
    }
    .owl-prev,
    .owl-next {
        display: none !important
    }
    .fixed-nav {
        position: fixed;
        width: 100%;
        z-index: 100;
    }
}


@media only screen and (min-width:1000px) and (max-width:1600px) { 

    header .wsmenu-list #content-login {
        right: 100px;
        position: absolute;
    }
}
@media screen and (max-width: 1279px) { #promo-banner-03 .promo {display: none;}
#promo-banner-03 a { position: relative; margin: auto; max-width: 170px; display: block; margin-top: 20px;}
#promo-banner-03  aside {padding-bottom: 20px;}
}

/* ===[ Entre 1000px & 1280px ********************************************************* ]=== */
@media only screen and (min-width:1000px) and (max-width:1279px) { 
    svg:not(: root) {
        max-width: 40px;
        overflow: hidden;
    }
    .custom2 figure {
        min-height: 140px
    }
    .new-wine-item img {
        height: 123px
    }
    #content-search {
        max-width: 300px
    }
    .header .wsmenu-list #content-login {
        margin-right: 0;
    }
    svg:not(:root) {
        max-width: 40px;
        overflow: hidden;
    }
    .wsmenu-list > li > a > .fa {
        display: none !important
    }
    .hometext {
        display: block !important
    }
    .wsmenu {
        width: 100%;
        position: relative;
    }
    .bigmegamenu {
        position: static !important
    }
    .wsmenu-list li a {
        white-space: nowrap !important;
        padding-left: 4px !important;
        padding-right: 10px !important;
    }
    .megacollink {
        width: 48%;
        margin: 1%;
    }
    .typographylinks {
        width: 48%;
        margin: 1%;
    }
    header .button-flat:before,
    header .log:after,
    header .arrow:after {
        display: none !important
    }
    header .wsmenu-list #content-login {
        margin-right: 0px;
        position: absolute;
    }
    .custom1 .owl-item .title-content,
    .custom3 .owl-item .title-content {
        font-size: 1.8rem;
        margin-top: 35%;
    }
    .bg-img {
        min-height: none
    }
}
/* ALL Width *********************************************************
   ================================================== */
@media only screen and (min-width: 768px) { 
    .cd-top {
        right: 20px;
        bottom: 20px;
    }
}
@media only screen and (max-width: 1024px) { 
    .custom3 img,
    .custom1 img {
        width: auto
    }
    .wsmenu-submenu-sub {
        min-width: 600px !important;
        width: 600px;
    }
    .wrapper,
    .wrapper-for-old-site {
        max-width: 900px;
        margin: auto !important;
    }
}
@media only screen and (min-width: 1024px) { 
    .cd-top {
        height: 60px;
        width: 60px;
        right: 30px;
        bottom: 30px;
    }
}
@media only screen and (min-width:1380px) { 
    .wsmenu-submenu-sub {
        width: 850px
    }
    #nav-item .tabulous_active {
        color: #fff !important
    }
    .header .wsmenu-list #content-login {
        float: right
    }
    .button-flat {
        min-width: 14em
    }
    .slider {
        height: 500px
    }
}
@media only screen and (max-width:1380px) { 
    .header .wsmenu-list #content-login {
        margin-right: 0px
    }
    header .log:after,
    header .arrow:after,
    header .button-flat:before {
        display: none
    }
    header .wsmenu-list li .button-flat {
        min-width: 1em;
        padding-left: 5px;
        padding-right: 8px !important;
        text-align: center;
    }
}
@media screen and (max-width: 50em) { 
    .grid figure {
        display: inline-block;
        float: none;
        margin: 10px auto;
        width: 100%;
    }
}
@media screen and (max-width: 726px) { 
    footer .searchfield {
        width: 100% !important
    }
    footer {
        margin-top: 50px
    }
    footer .button-flat {
        width: 100%;
        padding: auto;
    }
    footer input[type="button"] {
        text-align: center;
        display: inline;
    }
    #tabs4 #tabs_container {
        min-height: 900px
    }
    .new-wine #tabs4 h3 {
        font-size: 1.2rem
    }
    .new-wine #tabs4 #nav-item li a {
        min-width: 78px
    }
}
@media screen and (max-width: 320px) { 
    #tabs4 #tabs_container {
        min-height: 800px
    }
}




.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.flipOutX,
.animated.flipOutY,
.animated.bounceIn,
.animated.bounceOut {
  -webkit-animation-duration: .75s;
  animation-duration: .75s;
}

@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -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 {
  from, 20%, 53%, 80%, to {
    -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 {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

@keyframes flash {
  from, 50%, to {
    opacity: 1;
  }

  25%, 75% {
    opacity: 0;
  }
}

.flash {
  -webkit-animation-name: flash;
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes pulse {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes rubberBand {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes rubberBand {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.rubberBand {
  -webkit-animation-name: rubberBand;
  animation-name: rubberBand;
}

@-webkit-keyframes shake {
  from, to {
    -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 {
  from, to {
    -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 headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes headShake {
  0% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  6.5% {
    -webkit-transform: translateX(-6px) rotateY(-9deg);
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    -webkit-transform: translateX(5px) rotateY(7deg);
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    -webkit-transform: translateX(-3px) rotateY(-5deg);
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    -webkit-transform: translateX(2px) rotateY(3deg);
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

.headShake {
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-name: headShake;
  animation-name: headShake;
}

@-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);
  }

  to {
    -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);
  }

  to {
    -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 {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes tada {
  from {
    -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);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.tada {
  -webkit-animation-name: tada;
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes wobble {
  from {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes wobble {
  from {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.wobble {
  -webkit-animation-name: wobble;
  animation-name: wobble;
}

@-webkit-keyframes jello {
  from, 11.1%, to {
    -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);
  }
}

@keyframes jello {
  from, 11.1%, to {
    -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);
  }
}

.jello {
  -webkit-animation-name: jello;
  animation-name: jello;
  -webkit-transform-origin: center;
  transform-origin: center;
}

@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -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);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -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);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInDown {
  from, 60%, 75%, 90%, to {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInDown {
  -webkit-animation-name: bounceInDown;
  animation-name: bounceInDown;
}

@-webkit-keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInLeft {
  from, 60%, 75%, 90%, to {
    -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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInLeft {
  -webkit-animation-name: bounceInLeft;
  animation-name: bounceInLeft;
}

@-webkit-keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -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);
  }

  from {
    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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes bounceInRight {
  from, 60%, 75%, 90%, to {
    -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);
  }

  from {
    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);
  }

  to {
    -webkit-transform: none;
    transform: none;
  }
}

.bounceInRight {
  -webkit-animation-name: bounceInRight;
  animation-name: bounceInRight;
}

@-webkit-keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -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);
  }

  from {
    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);
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounceInUp {
  from, 60%, 75%, 90%, to {
    -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);
  }

  from {
    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);
  }

  to {
    -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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.bounceOutUp {
  -webkit-animation-name: bounceOutUp;
  animation-name: bounceOutUp;
}

@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(-2000px, 0, 0);
    transform: translate3d(-2000px, 0, 0);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(2000px, 0, 0);
    transform: translate3d(2000px, 0, 0);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}

@-webkit-keyframes flip {
  from {
    -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;
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }
}

@keyframes flip {
  from {
    -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;
  }

  to {
    -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 {
  from {
    -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);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInX {
  from {
    -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);
  }

  to {
    -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 {
  from {
    -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);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@keyframes flipInY {
  from {
    -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);
  }

  to {
    -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 {
  from {
    -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;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -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;
  }

  to {
    -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 {
  from {
    -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;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutY {
  from {
    -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;
  }

  to {
    -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 {
  from {
    -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;
  }

  to {
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes lightSpeedIn {
  from {
    -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;
  }

  to {
    -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 {
  from {
    opacity: 1;
  }

  to {
    -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateIn {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, -200deg);
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, -45deg);
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInDownRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpLeft {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    -webkit-transform: rotate3d(0, 0, 1, 45deg);
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: none;
    transform: none;
    opacity: 1;
  }
}

@keyframes rotateInUpRight {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    -webkit-transform: rotate3d(0, 0, 1, -90deg);
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -webkit-transform-origin: center;
    transform-origin: center;
    -webkit-transform: rotate3d(0, 0, 1, 200deg);
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

@keyframes rotateOut {
  from {
    -webkit-transform-origin: center;
    transform-origin: center;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: left bottom;
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -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 {
  from {
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    -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;
  }

  to {
    -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;
  }

  to {
    -webkit-transform: translate3d(0, 700px, 0);
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.hinge {
  -webkit-animation-name: hinge;
  animation-name: hinge;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes rollIn {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.rollIn {
  -webkit-animation-name: rollIn;
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@-webkit-keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    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 {
  from {
    opacity: 1;
  }

  to {
    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 {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    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 {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    opacity: 0;
  }
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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);
  }

  to {
    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 {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInDown {
  from {
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInDown {
  -webkit-animation-name: slideInDown;
  animation-name: slideInDown;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}

@-webkit-keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

@keyframes slideOutDown {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}

.slideOutDown {
  -webkit-animation-name: slideOutDown;
  animation-name: slideOutDown;
}

@-webkit-keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes slideOutLeft {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.slideOutLeft {
  -webkit-animation-name: slideOutLeft;
  animation-name: slideOutLeft;
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

@keyframes slideOutUp {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}

.slideOutUp {
  -webkit-animation-name: slideOutUp;
  animation-name: slideOutUp;
}