@charset "utf-8";
/* CSS Document */
@media all and (max-width: 2500px) and (min-width: 2251px) {
	body{
		background-color:#000;		
		margin:0 auto;
		font-family: 'CHEVM___' ;
		color:#FFF;	
		font-size:16px;
	}	
	@font-face{ font-family: CHEVM___ ;src: url('CHEVM___.ttf');  }
	* {   margin: 1px;   padding: 0px;}
	.header{
		width:100%;
		background-color:#FF0;
	}
	.formfield{
		background:#636363;
		border:2px solid #000;
		margin:5px 5px 5px 5px;
	}	
	.formfield:focus{
		background:#FFF;
		font-weight:bold;
		box-shadow:0px 0px 15px #3FF;
	}
	.content{
		width:100%;
		margin:0 auto;
		text-align:left;
		border-bottom:2px solid #FFF;
	}
	.header{		
		 height:auto;
         width:100%;
		 max-width:1250px;
	}
	.breadcrumbs{
		background-color:#FF0;
		width:100%;
		height:auto;
		margin-top:-1.5%;
	}
	.favourites{
		background-color:#FF0;
		width:25%;
		text-align:center;
		font-weight:bolder;
		font-size:24px;
		margin:0 auto;
		border-radius:25px;
		padding:1%;
	}
	.findplace{
		background-color:#FFF;
		width:25%;
		text-align:center;
		font-weight:bolder;
		font-size:24px;
		margin:0 auto;
		border-radius:25px;
		padding:1%;
	}
	.enterplace{
		background-color:#80FF00;
		width:25%;
		text-align:center;
		font-weight:bolder;
		font-size:24px;
		margin:0 auto;
		border-radius:25px;
		padding:1%;
	}
	.enteraddress{
		background-color:#FE642E;
		width:25%;
		text-align:center;
		font-weight:bolder;
		font-size:24px;
		margin:0 auto;
		border-radius:25px;
		padding:1%;
	}
	.history{
		background-color:#333333;
		width:25%;
		text-align:center;
		font-weight:bolder;
		font-size:24px;
		margin:0 auto;
		border-radius:25px;
		padding:1%;
	}
	a.nav:link {color: #FC3; text-decoration: none; }
	a.nav:visited {color: #FC3; text-decoration: none; }
	a.nav:hover {color: #09F; text-decoration: underline; }
	a.nav:active {color: white; } 
}

@media all and (max-width: 2250px){
	body{
		background-color:#000;		
		margin:0 auto;
		font-family: 'CHEVL___' ;		
		color:#FFF;
		font-size:20px;
		max-width:450px;
	}
	@font-face{ font-family: CHEVL___ ;src: url('CHEVL___.ttf');  }
		* {   margin: 0 auto;   padding: 0px;}
	.header{
		width:100%;
		background-color:#000;
	}
	.formfield{
		background:#212121;
		border:2px solid #000;		
		margin:5px 0px 5px 0px;
		width:285px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#636363;
	}
	.formfield:focus{
		background:#9C9C9C;
		border:2px solid #000;
		margin:5px 0px 5px 0px;
		width:300px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#FFF;		
	}
	.formfield2{
		background:#000;		
		margin:5px 0px 5px 0px;		
		width:30px;
		height:30px;
		font-size:24px;
		font-weight:bold;
	}
	.formfield2:focus{
		background:#FFF;
		border:2px solid #000;
		margin:5px 0px 5px 0px;
		width:8%;
		height:28px;
		font-size:24px;
		font-weight:bold;
	}
	.formfield3{
		background:#212121;
		border:2px solid #000;		
		margin:5px 0px 5px 0px;
		width:255px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#636363;
	}
	.formfield3:focus{
		background:#9C9C9C;
		border:2px solid #000;
		margin:5px 0px 5px 0px;
		width:300px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#FFF;
	}
	.formfield4{
		background:#212121;
		border:2px solid #000;		
		margin:5px 0px 5px 0px;
		width:355px;
		height:45px;
		font-size:20px;
		font-weight:bold;
		color:#636363;
	}
	.formfield4:focus{
		background:#9C9C9C;
		border:2px solid #000;
		margin:5px 0px 5px 0px;
		width:355px;
		height:45px;
		font-size:20px;
		font-weight:bold;
		color:#FFF;
	}
	.flexdatalist1{
		border-radius: 0px;
		background:#212121;
		border:2px solid #000;		
		margin:5px 0px 5px 0px;
		width:300px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#636363;
	}
	.flexdatalist1:focus{
		border-radius: 0px;
		background:#9C9C9C;
		border:2px solid #000;
		margin:5px 0px 5px 0px;
		width:300px;
		height:45px;
		font-size:24px;
		font-weight:bold;
		color:#FFF;
	}
	.destinationfield{
		text-align:left;
		background:#FFF;
		color:#000;				
		width:78%;
		height:28px;
		background: none!important;
		border: none;
		padding: 0!important;
		/*optional*/
		font-family: 'CHEVL___' ;
		color:#FFF;	
		font-size:20px;
		/*text-decoration: underline;*/
		/*cursor: pointer;		*/
	}
	.destinationfield2{
		text-align:left;
		background:#FFF;
		color:#FFFF00;				
		width:78%;
		height:28px;
		background: none!important;
		border: none;
		padding: 0!important;
		/*optional*/
		font-family: 'CHEVL___' ;
		color:#FFFF00;	
		font-size:20px;
		/*text-decoration: underline;*/
		/*cursor: pointer;		*/
	}
	.loginbutton{
		width:255px;
		height:31px;				
		font-size:24px;
		background:url(registeraccountbutton.png);
	}
	.loginbutton2{
		width:105px;
		height:52px;		
		font-size:18px;
		background:url(booknow.png) no-repeat center;		
		top: 75px;
		right:15px;	
		border:none;	
		margin-top:80px;
	}
	.loginbutton3{
		width:255px;
		height:31px;				
		font-size:24px;
		background:url(addfavouritebutton.png);
	}
	.loginbutton4{
		width:255px;
		height:31px;				
		font-size:24px;
		background:url(chooseplacebutton.png);
	}
	.loginbutton5{
		width:255px;
		height:31px;				
		font-size:24px;
		background:url(confirmaddressbutton.png);
	}
	.loginbutton6{
		width:255px;
		height:31px;				
		font-size:24px;
		background:url(confirmdestinationbutton.png);
	}
	.loginbutton7{
		width:105px;
		height:52px;		
		font-size:18px;
		background:url(edit.png) no-repeat center;
		top: 75px;
		right:15px;	
		border:none;	
		margin-top:80px;	
	}
	.loginbutton8{
		width:105px;
		height:52px;		
		font-size:18px;
		background:url(edit.png) no-repeat center;
		top: 75px;
		right:15px;	
		border:none;	
		margin-top:80px;	
	}
	.loginbutton9{
		width:118px;
		height:30px;		
		font-size:18px;
		background:url(send.png);
		position: fixed;
		top:75px;
		right:15px;		
	}
	.moveup{
		width:16px;
		height:16px;				
		background:url(uparrow2.png);
		border:none;
		float:right;
		margin-right:10%;	
	}
	.cancelbutton2{
		width:105px;
		height:52px;		
		font-size:18px;
		background:url(cancel.png) no-repeat center;		
		top: 75px;
		right:15px;	
		margin-top:120px;
		border:none;	
	}
	.content{
		width:96%;
		margin:0 auto;
		text-align:left;
		border-bottom:1px solid #CCC;
		position: relative;
		padding:0% 2% 2% 2%;
	}
	.content2{
		width:96%;
		margin:0 auto;
		text-align:left;		
		position: relative;
		padding:0% 2% 2% 2%;
	}
	.contenthome{
		width:96%;
		margin:0 auto;
		text-align:left;
		position: relative;
		padding:0% 2% 2% 2%;
	}
	.header{		
		height:auto;
        width:100%;
	}
	.breadcrumbs{
		background-color:#000;
		width:100%;
		height:auto;
		margin-top:-1.5%;
		margin-left:2%;
	}
	.favourites{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:2% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.favourites2{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:2% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.favourites3{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}		
	.favourites4{
		background-color:#000000;
		width:90%;
		text-align:center;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:2% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.meters{
		position: absolute;
		left: 32%;
		top: 60%;
	}	
	.findplace{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 2% 2%;	
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.enterplace{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.enteraddress{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.collect{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 2% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.history{
		background-color:#000000;
		width:90%;
		text-align:left;		
		font-size:20px;			
		padding:3% 3% 3% 0%;
		float:left;
		margin:-2.5% 2% 0% 2%;
		border-bottom:1px solid #CCC;
		border-top:1px solid #CCC;
	}
	.cancel{
		width:85%;
		height:50px;
		margin: 0 auto;
		border-radius:25px;
		font-size:24px;
		background-color:#FF0000;
	}
	.menuitem{
		position: absolute;
		top:0px;
		left:66%;		
		width:109px;
		height:61px;
		z-index: 1;
	}
	.question{		
		float:right;
		position:relative;
	}	
	.rightarrow{
		float:left;
		width:200px;
	}	
	.rightarrow2{
		float:left;
		margin-left:0px;
	}	
	.tooltip{
		display: inline;
		position: relative;		
	}
	.tooltip:hover:after{
		background: #FFFF00;
		background: rgba(0,0,0,1);
		border-radius: 5px;
		bottom: 26px;
		color: #fff;
		content: attr(title);
		left: -500%;
		padding: 5px 15px;
		position: absolute;
		z-index: 98;
		width: 220px;
	}
	.responsive-image{
        height:auto;
        width:100%;
    }
	.clear{
		clear:both;	
	}
	
	#menu {
 			display: block; 
 			background:url(menu_item.png);
 			font-size:36px; 
 			text-align: left; 
			color:#000;						
 		} 
 		#nav.js { 
 			display: none; 
			width:110%; 
			text-align: left; 
			margin-left: -40px;
			margin-top:30px;											
 		} 
 		ul { 
 			width:100%;			
 		} 
 		#nav li { 
 			width:120%; 
			background-color:#333; 			
			border-bottom:#FFF 2px solid;				
			list-style:none;
			z-index:100;			
			text-align: left;
			color:#FFF;
			height:45px;	
			margin-bottom: -1px;				
 		} 
		 li { 
            width:100%; 
            background-color:white;
            border-right:#FFF 2px solid;
			border-left:#FFF 2px solid;     
			border-top:#FFF 2px solid;                         
            list-style:none;
            z-index:100;						
         }
		progress{
			width:92%;
			background-color: #FF3300;
			border: 0;
			height: 18px;
			border-radius: 9px;	
		}		
		progress::-webkit-progress-bar {
			width:92%;
			background-color: #FFFFFF;
			border: 0;
			height: 18px;
			border-radius: 9px;	
		}
		progress::-webkit-progress-value {
			width:92%;
			background-color: #FFCC00;
			border: 0;
			height: 18px;
			border-radius: 9px;	
		}			
		.acidjs-rating-stars,
		.acidjs-rating-stars label::before
{
    display: inline-block;
}
 
.acidjs-rating-stars label:hover,
.acidjs-rating-stars label:hover ~ label
{
    color: #189800;
}
 
.acidjs-rating-stars *
{
    margin: 0;
    padding: 0;
}
 
.acidjs-rating-stars input
{
    display: none;
}
 
.acidjs-rating-stars
{
    unicode-bidi: bidi-override;
    direction: rtl;
}
 
.acidjs-rating-stars label
{
    color: #ccc;
}
 
.acidjs-rating-stars label::before
{
    content: "\2605";
    width: 60px;
    line-height: 33px;
    text-align: left;
    font-size: 46px;
    cursor: pointer;
}
 
.acidjs-rating-stars input:checked ~ label
{
    color: #f5b301;
}
 
.acidjs-rating-disabled
{
    opacity: .50;
     
    -webkit-pointer-events: none;
    -moz-pointer-events: none;
    pointer-events: none;
}
		
	a.nav:link {color: #FFF; text-decoration: none; }
	a.nav:visited {color: #FFF; text-decoration: none; }
	a.nav:hover {color: #9C9C9C; text-decoration: none; }
	a.nav:active {color: white; }

#timer {
	font-size:24px;
	text-align:center;  
}
<!--FADE IN IMAGES -->
#stage {
    margin: 1em auto;
    width: 382px;
    height: 292px;
  }
  #stage a:nth-of-type(1) {
    animation-name: fader;
    animation-delay: 4s;
    animation-duration: 1s;
    z-index: 20;
  }  
  #stage a:nth-of-type(n+2) {
    display: none;
  }

  @keyframes fader {
    from { opacity: 1.0; }
    to   { opacity: 0.0; }
 #stage2 {
    margin: 1em auto;
    width: 382px;
    height: 292px;
  }
  #stage2 a:nth-of-type(1) {
    
  }  
  #stage2 a:nth-of-type(n+2) {
    display: none;
  }
  @keyframes2 fader {
    from { opacity: 1.0; }
    to   { opacity: 0.0; }

}