/* ==========================================================================
   Theme styles
 ========================================================================== */

body,html{ height:100%; width:100%; }
html { 
  background: url('img/wonderfull-sf-2016.jpg') no-repeat center 0 fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

#initial-panel { display:block; width:100%; height:100vh; position:relative; }

#wonderfull{ position:absolute; top:1%; left:3%; z-index:100; }

#logos{
    position: absolute;
    bottom: 0;
    left: 0;
}

#tickets {
    /* background: rgba(0, 0, 0, 0) url(img/bg-tickets.png) no-repeat scroll center center; */
    bottom: 4vh;
    display: block;
    /* height: 336px; */
    position: absolute;
    left: 4vw;
}
#tickets img.hover{ display:none; }
#tickets:hover img{ display:none; outline:none; }
#tickets:hover .hover{ display:block; z-index:100; } 


#mobile{ display:none; }
#mobile img{ width:100%; height:100%; }

/* ==========================================================================
   Breakpoints
 ========================================================================== */

@media only screen and (max-width: 768px) {
	
	#desktop{ display:none; }
	#mobile{ display:block; }
		
}	
@media only screen and (max-width: 480px) {
	
}	
@media only screen and (max-width: 320px) {

}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { 
	/* STYLES GO HERE */
		
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2) { 
	/* STYLES GO HERE */
	
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 1)  { 
/* STYLES GO HERE */
	
}

/* Smartphones (landscape) ----------- */
@media screen and (max-device-width: 480px) {
	/* Styles */
	
}