/*** DEFAULT CSS ***/

body {
    width: 100%;
    height: 100%;
    font-family: 'Open Sans Condensed', sans-serif;
    color: #000;
    background-color: #fff;
}

html {
    width: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 35px;
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
}

p {
    margin: 0 0 25px;
    font-size: 18px;
    line-height: 1.5;
}

@media(min-width:767px) {
    p {
        margin: 0 0 35px;
        font-size: 20px;
        line-height: 1.6;
    }
}

a {
    text-transform: uppercase;
    font-size: 16px;
    color: #fff;
    text-shadow: 1px 1px 1px #585858;
    -webkit-transition: all .2s ease-in-out;
       -moz-transition: all .2s ease-in-out;
            transition: all .2s ease-in-out;
}

a:hover,
a:focus {
    text-decoration: none;
    color: #fff;
}

.navbar-custom {
    margin-bottom: 0;
    border-bottom: 1px solid rgba(255,255,255,.8);
    text-transform: uppercase;
    font-family: 'Open Sans Condensed', sans-serif;
    background-color: rgba(255,255,255,.8);
}
.toggle {
    background-color: #ff8000;
}

.navbar-brand img {
    width: 115px;
    height: 70px;
    margin-top: -5px;
    -webkit-transition: all .2s ease-in-out;
       -moz-transition: all .2s ease-in-out;
            transition: all .2s ease-in-out;
}
.navbar-custom .navbar-brand:focus {
    outline: 0;
}

.navbar-custom .navbar-toggle {
    padding: 4px 6px;
    font-size: 16px;
    color: #fff;
}
.navbar-custom .navbar-brand .navbar-toggle:focus,
.navbar-custom .navbar-brand .navbar-toggle:active {
    outline: 0;
}

.navbar-custom a {
    color: #FF8000;
}

.navbar-custom .nav li.active {
    outline: none;
    background-color: rgba(255,255,255,.7);
}

.navbar-custom .nav li a {
    font-size: 18px;
    padding-top: 5px;
    -webkit-transition: background .3s ease-in-out;
       -moz-transition: background .3s ease-in-out;
            transition: background .3s ease-in-out;
}

.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus,
.navbar-custom .nav li a.active {
    outline: 0;
    background-color: rgba(255,255,255,.3);
}

@media(min-width:767px) {
    .navbar {
        padding: 20px 0;
        border-bottom: 0;
        letter-spacing: 1px;
        background: 0 0;
        -webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
           -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
                transition: background .5s ease-in-out,padding .5s ease-in-out;
    }
    .top-nav-collapse {
        padding: 0;
        background-color: rgba(255,255,255,.7);
    }

    .navbar-custom.top-nav-collapse {
        border-bottom: 1px solid rgba(255,128,0,.8);
        background-color: rgba(255,255,255,.6);
    }
    .navbar-brand img {
        width: 135px;
        height: 90px;
        margin-top: -55px;
    }
    .navbar-custom.top-nav-collapse img {
        width: 105px;
        height: 60px;
        margin: -35px 0 0 25px;
    }
    .container {
        padding-top: 25px;
    }
}

.video {
    position:relative;
    padding-bottom: 56.25%;
    padding-top:30px;
    height:0;
    /*margin-top: 100px;*/
	margin-top: 80px;
    overflow:hidden;
}

.video iframe, .video object, .video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/*** DOWN ***/
.intro {
    display: table;
    width: 100%;
    height: 100%;
    height: 100vh;
    height: auto;
    text-align: center;
    -webkit-background-size: cover;
       -moz-background-size: cover;
            background-size: cover;
         -o-background-size: cover;
}
.btn-circle {
    position: relative;
    width: 70px;
    height: 70px;
    padding: 7px 16px;
    color: #FF8000;
    border: none;
    border-radius: 35px;
    font-size: 40px;
    background: 0 0;
    -webkit-transition: background .3s ease-in-out;
       -moz-transition: background .3s ease-in-out;
            transition: background .3s ease-in-out;
}

.btn-circle:hover,
.btn-circle:focus {
    outline: 0;
    color: #fff;
    background: rgba(255,128,0,.6);
    border: none;
}

.btn-circle i.animated {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
       -moz-transition-property: -moz-transform;
       -moz-transition-duration: 1s;
}

.btn-circle:hover i.animated {
    -webkit-animation-name: pulse;
    -moz-animation-name: pulse;
    -webkit-animation-duration: 1.5s;
    -moz-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
}

@-webkit-keyframes pulse {    
    0 {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes pulse {    
    0 {
        -moz-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}
@media(min-width:767px) {
    .video {
        padding-bottom:41.25%;
    }
    .video iframe, .video object, .video embed {
        height:500px;
    }
    .btn-circle {
        margin-top: -250px;
    }
}


/*** ABOUT US ***/
.about-us {
    display: table;
    width: 100%;
    height: auto;
    color: #fff;
    margin-top: 100px;
    z-index: 10;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}
ul, menu, dir {
    list-style-type: none;
}
.slide {
    width: 100%;
}
.about-us h2 {
    text-shadow: 1px 1px 1px #000;
    padding-top: 10px;
    font-size: 36px;
}
.about-us p {
    text-shadow: 1px 1px 1px #000;
    padding: 10px;
    font-size: 16px;
    letter-spacing: 1px;
}

.cb-slideshow,
.cb-slideshow:after {
    position: relative;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 0;
    list-style-type: none;
}
.cb-slideshow:after {
    content: '';
    background: transparent url(../img/pattern.png) repeat top left;
}
.cb-slideshow li span {
    list-style-type: none;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    -webkit-animation: imageAnimation 36s linear infinite 0s;
    -moz-animation: imageAnimation 36s linear infinite 0s;
    -o-animation: imageAnimation 36s linear infinite 0s;
    -ms-animation: imageAnimation 36s linear infinite 0s;
    animation: imageAnimation 36s linear infinite 0s;
}
.cb-slideshow li div {
    list-style-type: none;
    z-index: 1000;
    position: absolute;
    bottom: 30px;
    left: 0px;
    width: 100%;
    text-align: center;
    opacity: 0;
    -webkit-animation: titleAnimation 36s linear infinite 0s;
    -moz-animation: titleAnimation 36s linear infinite 0s;
    -o-animation: titleAnimation 36s linear infinite 0s;
    -ms-animation: titleAnimation 36s linear infinite 0s;
    animation: titleAnimation 36s linear infinite 0s;
}
.cb-slideshow li div h3 {
    font-family: 'BebasNeueRegular', 'Arial Narrow', Arial, sans-serif;
    font-size: 160px;
    padding: 0 30px;
    line-height: 120px;
    color: rgba(255,255,255,0.8);
}
.cb-slideshow li:nth-child(1) span { background-image: url(../img/img1-1.jpg) }
.cb-slideshow li:nth-child(2) span {
    background-image: url(../img/img2-2.jpg);
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) span {
    background-image: url(../img/img3-3.jpg);
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) span {
    background-image: url(../img/img4-4.jpg);
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) span {
    background-image: url(../img/img5-5.jpg);
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) span {
    background-image: url(../img/img6-6.jpg);
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}
.cb-slideshow li:nth-child(2) div {
    -webkit-animation-delay: 6s;
    -moz-animation-delay: 6s;
    -o-animation-delay: 6s;
    -ms-animation-delay: 6s;
    animation-delay: 6s;
}
.cb-slideshow li:nth-child(3) div {
    -webkit-animation-delay: 12s;
    -moz-animation-delay: 12s;
    -o-animation-delay: 12s;
    -ms-animation-delay: 12s;
    animation-delay: 12s;
}
.cb-slideshow li:nth-child(4) div {
    -webkit-animation-delay: 18s;
    -moz-animation-delay: 18s;
    -o-animation-delay: 18s;
    -ms-animation-delay: 18s;
    animation-delay: 18s;
}
.cb-slideshow li:nth-child(5) div {
    -webkit-animation-delay: 24s;
    -moz-animation-delay: 24s;
    -o-animation-delay: 24s;
    -ms-animation-delay: 24s;
    animation-delay: 24s;
}
.cb-slideshow li:nth-child(6) div {
    -webkit-animation-delay: 30s;
    -moz-animation-delay: 30s;
    -o-animation-delay: 30s;
    -ms-animation-delay: 30s;
    animation-delay: 30s;
}

@media(min-width:767px) {
    .cb-slideshow li:nth-child(1) span { background-image: url(../img/img1.jpg) }
    .cb-slideshow li:nth-child(2) span {
        background-image: url(../img/img2.jpg);
    }
    .cb-slideshow li:nth-child(3) span {
        background-image: url(../img/img3.jpg);
    }
    .cb-slideshow li:nth-child(4) span {
        background-image: url(../img/img4.jpg);
    }
    .cb-slideshow li:nth-child(5) span {
        background-image: url(../img/img5.jpg);
    }
    .cb-slideshow li:nth-child(6) span {
        background-image: url(../img/img6.jpg);
    }
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation { 
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -webkit-transform: scale(1.05);
        -webkit-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -webkit-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -webkit-transform: scale(1.1);
    }
    100% { opacity: 0 }
}
@-moz-keyframes imageAnimation { 
    0% {
        opacity: 0;
        -moz-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -moz-transform: scale(1.05);
        -moz-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -moz-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -moz-transform: scale(1.1);
    }
    100% { opacity: 0 }
}
@-o-keyframes imageAnimation { 
    0% {
        opacity: 0;
        -o-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -o-transform: scale(1.05);
        -o-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -o-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -o-transform: scale(1.1);
    }
    100% { opacity: 0 }
}
@-ms-keyframes imageAnimation { 
    0% {
        opacity: 0;
        -ms-animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        -ms-transform: scale(1.05);
        -ms-animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        -ms-transform: scale(1.1);
    }
    25% {
        opacity: 0;
        -ms-transform: scale(1.1);
    }
    100% { opacity: 0 }
}
@keyframes imageAnimation { 
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        transform: scale(1.05);
        animation-timing-function: ease-out;
    }
    17% {
        opacity: 1;
        transform: scale(1.1);
    }
    25% {
        opacity: 0;
        transform: scale(1.1);
    }
    100% { opacity: 0 }
}
/* Animation for the title */
@-webkit-keyframes titleAnimation { 
    0% {
        opacity: 0;
        -webkit-transform: translateY(200px);
    }
    8% {
        opacity: 1;
        -webkit-transform: translateY(0px);
    }
    17% {
        opacity: 1;
        -webkit-transform: scale(1);
    }
    19% { opacity: 0 }
    25% {
        opacity: 0;
        -webkit-transform: scale(10);
    }
    100% { opacity: 0 }
}
@-moz-keyframes titleAnimation { 
    0% {
        opacity: 0;
        -moz-transform: translateY(200px);
    }
    8% {
        opacity: 1;
        -moz-transform: translateY(0px);
    }
    17% {
        opacity: 1;
        -moz-transform: scale(1);
    }
    19% { opacity: 0 }
    25% {
        opacity: 0;
        -moz-transform: scale(10);
    }
    100% { opacity: 0 }
}
@-o-keyframes titleAnimation { 
    0% {
        opacity: 0;
        -o-transform: translateY(200px);
    }
    8% {
        opacity: 1;
        -o-transform: translateY(0px);
    }
    17% {
        opacity: 1;
        -o-transform: scale(1);
    }
    19% { opacity: 0 }
    25% {
        opacity: 0;
        -o-transform: scale(10);
    }
    100% { opacity: 0 }
}
@-ms-keyframes titleAnimation { 
    0% {
        opacity: 0;
        -ms-transform: translateY(200px);
    }
    8% {
        opacity: 1;
        -ms-transform: translateY(0px);
    }
    17% {
        opacity: 1;
        -ms-transform: scale(1);
    }
    19% { opacity: 0 }
    25% {
        opacity: 0;
        -webkit-transform: scale(10);
    }
    100% { opacity: 0 }
}
@keyframes titleAnimation { 
    0% {
        opacity: 0;
        transform: translateY(200px);
    }
    8% {
        opacity: 1;
        transform: translateY(0px);
    }
    17% {
        opacity: 1;
        transform: scale(1);
    }
    19% { opacity: 0 }
    25% {
        opacity: 0;
        transform: scale(10);
    }
    100% { opacity: 0 }
}

/* Show at least something when animations not supported */
.no-cssanimations .cb-slideshow li span{
    opacity: 1;
}


/*** THE PROJECCT ***/
.project-back {
    width: 100%;
    margin-top: 20px;
    background: url(../img/back2.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    color: #000;
}
.project-back h2 {
    padding-top: 80px;
    font-size: 36px;
}
.project-back p {
    font-size: 16px;
    letter-spacing: 1px;
}


/*** THE PRODUCT ***/
.product-back h2 {
    padding-top: 80px;
    font-size: 36px;
}
.project__back {
    font-size: 16px;
    letter-spacing: 1px;
}
.product-content {
    text-align: left;
    text-transform: uppercase;
    border-bottom: 1px solid #ff8000;
}
.product-text {
    text-align: left;
    font-size: 16px;
    letter-spacing: 1;
    margin-top: -20px;
}
.product-bottle img {
    display: none;
}


/*** WHERE ***/
.where-back {
    width: 100%;
    height: auto;
    background: url(../img/back3.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    color: #fff;
    margin-top: 10px;
    border-bottom: 1px solid #ff8000;
    border-top: 1px solid #ff8000;
}
.where-back h2 {
    padding-top: 80px;
    font-size: 36px;
}
.where-back p {
    font-size: 16px;
    letter-spacing: 1px;
}


/*** MAP ***/
#map {
    width: 100%;
    height: 300px;
}
.contact-map {
    padding-top: 50px;
}
.contact {
    padding-bottom: 40px;
}


/*** ONLINE ***/
.by-back {
    width: 100%;
    height: auto;
    background: url(../img/back4.jpg) no-repeat center center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    color: #fff;
    margin-top: 10px;
    border-bottom: 1px solid #ff8000;
    border-top: 1px solid #ff8000;
}
.by-back h2 {
    padding-top: 80px;
    font-size: 36px;
}
.by-back p {
    font-size: 16px;
    border: 1px solid #fff;
    background-color: rgba(255,128,0,.6);
    letter-spacing: 1px;
}


/*** MEDIA ***/
.media-back {
    width: 100%;
    height: auto;
    margin-top: 10px;
}
.media-back h2 {
    padding-top: 80px;
    font-size: 36px;
}
.media-back p {
    font-size: 16px;
    letter-spacing: 1px;
}
.media__link {
    width: 80%;
    text-align: left;
}
.media__link p {
    border-bottom: 1px solid #ff8000;
    margin-top: 65px;
}
.media__link a {
    float: right;
    color: #000;
    text-shadow: none;
    border: 1px solid #fff;
    padding: 5px;
}
.media__link a:hover {
    border: 1px solid #ff8000;
    padding: 5px;
    border-radius: 2px;
}
.news-face {
    width: 300px;
    margin-top: 80px;
}
.contact-back {
    margin-top: 10px;
    border-top: 1px solid #ff8000;
}
.contact-back h2 {
    text-align: left;
    color: #000;
    margin-left: 100px;
}
.contact-back a {
    color: #000;
    text-shadow: none;
}

@media(min-width: 767px) {
    .about-us {
        height: 760px;
    }
    .about-us h2 {
        padding: 40px 20px 20px 20px;
        font-size: 42px;
    }
    .about-us p {
        padding: 20px;
        font-size: 24px;
    }
    .project-back {
        margin-top: 60px;
    }
    .project-back h2 {
        padding-top: 90px;
        font-size: 42px;
    }
    .project-back p {
        font-size: 24px;
    }
    .product-content h2 {
        padding-top: 90px;
        font-size: 42px; 
    }
    .project__back {
        font-size: 24px;
        letter-spacing: 1px;
    }
    .product-bottle img {
        display: block;
        margin-top: 200px;
        margin-left: 40px;
    }
    .where-back {
        padding-bottom: 50px;
    }
    .where-back h2 {
        padding-top: 90px;
        font-size: 42px;
    }
    .where-back p {
        font-size: 24px;
    }
    .by-back {
        padding-bottom: 120px;
    }
    .by-back h2 {
        padding-top: 90px;
        font-size: 42px;
    }
    .by-back p {
        font-size: 32px;
        padding: 10px;
    }
    .map {
        padding-top: 60px;
    }
    .media__link {
        padding-left: 120px;
    }
    .news-face {
        width: 530px;
        margin-left: -130px;
    }
    .media-back {
        padding-bottom: 50px;
    }
    .media-back h2 {
        padding-top: 90px;
        font-size: 42px;
    }
    .media-back p {
        font-size: 24px;
    }
    .contact-back h2 {
        font-size: 42px;
        text-align: left;
        color: #000;
        margin-left: 100px;
    }
}
::-moz-selection {
    text-shadow: none;
    background: #fcfcfc;
    background: rgba(0,0,0,.2);
}

::selection {
    text-shadow: none;
    background: #fcfcfc;
    background: rgba(0,0,0,.2);
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}

body {
    webkit-tap-highlight-color: rgba(255,255,255,.2);
}

