body {
    margin: 0;
    min-width: 100px;
    padding: 0;
    font-family: 'Gotham Rounded Light', 'Gotham-Rounded-Light', 'Trebuchet MS', sans-serif;
    font-size: 36.5%;
    overflow-x: hidden;
}

body > *, #wrapper > li {

    visibility: visible;

    position: absolute;
    width: 100%;
    height: 100%;
    display: none;

    background-color: #000000;
}

#landscape_only {
    visibility: hidden;
    display: none;

}

#logodelta, #maquina-preta-btn, #maquina-branca-btn {
    display: block;
    background-color: transparent;
}

h1, h2, h3, h4, h5, h6{color:#ccc; font-weight: normal; margin:0;}

p{font-size: 1.2em;}
a, a:link{color:#ffffff; text-decoration: none; outline:0; border:0;}


#logodelta {
    position: fixed;
    top: 0;
    left: 0;
    width: 74px;
    height: 30px;

    margin: 16px 0 0 16px;

    z-index: 990;
}

.maquina-branca #logodelta {
    background: url(../images/logodelta-white.png) 0 0 no-repeat;
    background-size: 100% 100%;
}

.maquina-preta #logodelta {
    background: url(../images/logodelta-black.png) 0 0 no-repeat;
    background-size: 100% 100%;
}

#logodelta a {
    width:100%;
    height: 100%;
    display: block;
    /*    text-indent:-9999px;*/
    color: transparent;
}



#preloader {
    display: block;
}

#preloader, #wrapper {
    margin: 0;
    padding: 0;
}

#preloader {
    z-index: 995;

    background-color: #ffffff;
    /*    border: 1px gray solid;*/

    position: absolute;
    /*    margin: -2px;*/
    width: 100%;
    height: 100%;

    text-align: center;
}

.maquina-branca #preloader {
    background: url(../images/white/alqimia_preloader.jpg) no-repeat center center fixed;
}
.maquina-preta #preloader {
    /*    background: url(../images/black/alqimia_preloader.jpg) no-repeat center center fixed;*/
}	
.maquina-branca #preloader, .maquina-preta #preloader {
    background-size: 100% auto;
}

#preloader h3 {
    /*    font-size: 1.6em;*/
    font-size: 2.6em;
    position: absolute;
    right: 7%;
    bottom: 5%;
    text-transform: uppercase;
    font-weight: normal;
    text-align: right;
    width: 550px;
}

#loading-img {
    position: absolute;
    /*    bottom: 24%;*/
    bottom: 23%;
    width: 10px;
    height: 10px;
    /* box-shadow: 0 0 4px #ccc;*/
}






#wrapper {
    position: absolute;
    width: 100%;
    height: 100%;
}


#wrapper > li {
    list-style: none;
    display: block;
    position: relative;

    width: 100%;
    height: 100%;
}

#wrapper > li > div {
    position: absolute;
    width: 100%;
    height: 100%;
}








.maquina-preta #maquina-branca-btn, .maquina-branca #maquina-preta-btn {
    visibility: visible;
}
.maquina-branca #maquina-branca-btn, .maquina-preta #maquina-preta-btn {
    visibility: hidden;
}


.maquina-preta #intro .maquina-preta, .maquina-branca #intro .maquina-branca {
    display: block;
}
.maquina-branca #intro .maquina-preta, .maquina-preta #intro .maquina-branca {
    display: none;
}


.cafe #capsula .cafe, .cafe #bebida .cafe, .cha #capsula .cha, .cha #bebida .cha {
    visibility: visible;
}
.cha #capsula .cafe, .cha #bebida .cafe, .cafe #capsula .cha, .cafe #bebida .cha {
    visibility: hidden;
}







#maquina-preta-btn,  #maquina-branca-btn {
    position: fixed;
    top: 58px;
    bottom: 0; 
    right: 0; 
    z-index: 190;
    width: 12px; 
    height: 7px;
}

#maquina-branca-btn {
    left: 17px;
}
#maquina-preta-btn {
    left: 37px;
}

#maquina-preta-btn a {
    width:100%; 
    height: 100%; 
    display: block;
    background:url(../images/btn-maquina-preta.png) 0 0 no-repeat;
    background-size: auto 100%;
}

#maquina-branca-btn a {
    width:100%; 
    height: 100%; 
    display: block;
    background:url(../images/btn-maquina-branca.png) 0 0 no-repeat;
    background-size: auto 100%;
}



#maquina-preta-btn a:hover{
    /*    background-position: -77px 0;*/
    background-position: -56px 0;
}

#maquina-branca-btn a:hover{
    /*    background-position: -80px 0;*/
    background-position: -57px 0;
}


.voltar {
    bottom: 0; 
    /*right: 0; */
    left: 7px;
    width: 60px; 
    height: 27px; 
}




#fix-intro-left, #fix-intro-right {
    position: absolute;
    top: 0;
    /*    width: 230px;*/
    width: 155px;
    height: 100%;
}

#fix-intro-left {
    left: 0;
}

#fix-intro-right {
    right: 0;
}





























#container360-branca, #container360-preta {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}










.maquina-branca #intro .intro360 {
    background: #ffffff url(../images/white/360/01.jpg) no-repeat 0 0;
}

.maquina-preta #intro .intro360 {
    background: #ffffff url(../images/black/360/01.jpg) no-repeat 0 0;
}

.maquina-branca #intro .intro360, .maquina-preta #intro .intro360 {   
    /* Tem que estar depois do background */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.maquina-branca #capsula .cafe {
    background: #ffffff url(../images/white/capsula_cafe_bg.jpg) no-repeat 0 0;
}

.maquina-preta #capsula .cafe {
    background: #000000 url(../images/black/capsula_cafe_bg.jpg) no-repeat 0 0;
}

.maquina-branca #capsula .cha{
    background: #ffffff url(../images/white/capsula_cha_bg.jpg) no-repeat 0 0;
}

.maquina-preta #capsula .cha {
    background: #000000 url(../images/black/capsula_cha_bg.jpg) no-repeat 0 0;
}

.maquina-branca #capsula .cafe, .maquina-preta #capsula .cafe,  .maquina-branca #capsula .cha, .maquina-preta #capsula .cha{
    /* Tem que estar depois do background */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


.maquina-branca #bebida .cafe {
    background: #ffffff url(../images/white/bebida_cafe_bg.jpg) no-repeat 500px 0;
}

.maquina-preta #bebida .cafe {
    background: #000000 url(../images/black/bebida_cafe_bg.jpg) no-repeat 500px 0;
}

.maquina-branca #bebida .cha{
    background: #ffffff url(../images/white/bebida_cha_bg.jpg) no-repeat 500px 0;
}

.maquina-preta #bebida .cha {
    background: #000000 url(../images/black/bebida_cha_bg.jpg) no-repeat 500px 0;
}

.maquina-branca #bebida .cafe, .maquina-preta #bebida .cafe,  .maquina-branca #bebida .cha, .maquina-preta #bebida .cha{
    /* Tem que estar depois do background */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}


.nav {
    display: block;
    z-index: 110; 
    width: 100%; 
    bottom: 3px;
}

#intro .nav {
    height: 43px;
}

.nav li{
    list-style:none;
}
.maquina-preta .nav li{
    /*    color: #fefefe;*/
    color: #999999;
}

.headline {
    /*    width: 323px; 
	height: 250px; */
    width: 160px; 
    height: 110px; 
    position: absolute; 
    /*    left: 40px; */
    left: 5px;
    top: 22%;
}

.headline_right {
    position: absolute;
    left: auto;
    top:14%;
    right: 6%;
    width: 250px;

    z-index: 200;
}
.headline_left{position: absolute;  right:auto;height: auto; top:18%; left: 40px; width:380px;}




#dados_tecnicos .headline_left h5 {
    font-size: 1.5em;
}





.headline_right h3 {
    /*    font-size: 2.4em;*/
    font-size: 3.4em;
    text-align: left;
    width:90%;
    z-index:25;
    line-height: 1.0em;
}
.headline_left h5, .headline_right h5 {
    /*    font-size: 1.4em;*/
    font-size: 2.4em;
    margin: 10px 0;
}
.headline_right .reserva, .headline_right .specs{font-family: 'Gotham Rounded Medium', 'Gotham-Rounded-Medium', 'Trebuchet MS', sans-serif; color: #777; padding: 2px 15px 2px 0; height:6px; }
.headline_right .reserva {background: url(../images/arrow.png) no-repeat center right; background-size: 10px 10px; -webkit-background-size: 10px 10px;}

.headline_right a {
    font-size: 1.6em;
}

.que_deseja_tomar { 
    background-position: right -3px;
    top: -15px;
}

.texto_comprar h3.specs { background-position: 71px -66px;  }
.texto_comprar a.specs { background-position: 108px -110px; }

.headline h2{
    font-size: 3.6em; 
    /*    font-size: 1.8em;--- */
    position: relative; 
    text-align: left;
    width:90%; 
    z-index:121; 
    line-height: 1.0em; 
    text-transform: uppercase;
}

.headline.button h2{
    top: 50%; 
    left: 35%;
}

.maquina-branca .headline h2{color:#444;}

.headline h4{font-size: 70%; text-transform: uppercase; font-family: 'Gotham Rounded Medium', 'Gotham-Rounded-Medium', 'Trebuchet MS', sans-serif;  font-weight: normal; margin: 10px 0;}

h4.curto { background:url(../images/icon-copo-pouco-cheio.png) 14px center no-repeat; padding-left: 30px; height: 12px; background-size: 9px 8px;}
h4.medio { background:url(../images/icon-copo-meio-cheio.png) 14px center no-repeat; padding-left: 30px; height: 12px; background-size: 9px 8px;}
h4.longo { background:url(../images/icon-copo-cheio.png) 10px center no-repeat; padding-left: 30px; height: 12px; background-size: 12px 12px;}
h4.padding-left { background:url(../images/icon-capsula.png) 10px center no-repeat; padding-left: 30px; background-size: 12px 12px;}

.headline.button h2.text_right, h2.text_right{ text-align: right;}


.btn{
    width: 42px; 
    height: 44px; 
    margin: 0 auto; 
}
.small-btn{
    width: 45px; 
    height: 47px;
    padding: 13px 10px 0 10px;
    margin: 0 auto; 
    display: inline-block;
}
.btn a, .small-btn a{
    display: block; 
    width:100%; 
    height:100%; 
    /*    text-indent: -9999px;*/
    color: transparent;
    overflow: hidden;
}

.maquina-branca .btn-cafe-capsula{
    background: url(../images/white/btn-capsula-cafe.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-branca .btn-cha-capsula{
    background: url(../images/white/btn-capsula-cha.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-branca .btn-cafe{
    background: url(../images/white/btn-cafe.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-branca .btn-cha{
    background: url(../images/white/btn-cha.png) no-repeat 0 0;
    background-size: 100% 100%;
}


.maquina-preta .btn-cafe-capsula{
    /*    background: url(../images/black/btn-capsula-cafe.png) no-repeat 0 0;*/
    background: url(../images/white/btn-capsula-cafe.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-preta .btn-cha-capsula{
    /*    background: url(../images/black/btn-capsula-cha.png) no-repeat 0 0;*/
    background: url(../images/white/btn-capsula-cha.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-preta .btn-cafe{
    background: url(../images/black/btn-cafe.png) no-repeat 0 0;
    background-size: 100% 100%;
}
.maquina-preta .btn-cha{
    background: url(../images/black/btn-cha.png) no-repeat 0 0;
    background-size: 100% 100%;
}


.btn-automatica{
    /*background: url(../images/white/btn-automatica.png) no-repeat 0 0;*/
    top: 110px !important;
    
}
.btn-img{z-index:100;}

/*.anuncio-btn {width: 98px; height: 95px; position: absolute; top:0; right:0; z-index:122;}*/

.maquina-branca .partilhar-fb{
    background: url(../images/white/btn-partilhar-fb.png) no-repeat 0 0;
    background-size: 100% 100%;}
.maquina-preta .partilhar-fb{
    background: url(../images/black/btn-partilhar-fb.png) no-repeat 0 0;
    background-size: 100% 100%;}


/* ++++ LATERAIS ++++ */
.lateral {
    position: absolute;
    top: 0;
    left: -110%;
    display: none;
    z-index: 175;
}

.depositos .headline{ height: auto;}
.depositos .headline h2{text-align: left;} 


.maquina-branca #inteligente, .maquina-preta #inteligente, .maquina-branca #automatica, .maquina-preta #automatica, .maquina-branca #dados_tecnicos, .maquina-preta #dados_tecnicos {position: absolute; top:0; left: 0;}


.maquina-branca #inteligente {
    background: url(../images/white/inteligente_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-preta #inteligente {
    background: url(../images/black/inteligente_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-branca #depositos_agua {
    background: #ffffff url(../images/white/depositos_agua_bg.jpg) no-repeat 0 0;
}

.maquina-preta #depositos_agua {
    background: #000000 url(../images/black/depositos_agua_bg.jpg) no-repeat 0 0;
}

.maquina-branca #depositos_agua, .maquina-preta #depositos_agua{
    /* Tem que estar depois do background */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-branca #automatica {
    background: url(../images/white/automatica_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-preta #automatica {
    background: url(../images/black/automatica_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-branca #dados_tecnicos {
    background: url(../images/white/dados_tecnicos_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}

.maquina-preta #dados_tecnicos {
    background: url(../images/black/dados_tecnicos_bg.jpg) 0 0 no-repeat;
    /* http://css-tricks.com/3458-perfect-full-page-background-image/ */
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    height: 100%;
    width:100%;
}


.texto_comprar {
    font-size: 70%;
    top: 59%;
    right: -95px;
}

.texto_comprar h3 {
    color: #000;
    font-weight: lighter;
}

body.cha .texto_comprar {
    top: 58%;
    right: -115px;
}

body.maquina-preta.cafe .texto_comprar {
    right: -125px;
}

.partilhar-fb {
    bottom: 3px;
    margin-left: -7px;
}

.partilhar-fb p {
    color: #eee;
    position: absolute;
    top: 38px;
    font-size: 0.8em;
    margin-left: -5px;
}
body.maquina-branca .partilhar-fb p {
    color: #333;
}

#dados_tecnicos header h2 { display: none; }
#dados_tecnicos header { font-size: 70%; }


.btn-anuncio {
    font-size: 60%;
}

.btn-anuncio > img {
    width: 85px;
    height: 85px;
}

.metade {
    width: 86px;
    height: 86px;
}
.metade-fb {
    width: 8px;
    height: 8px;
}