@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,200,100&subset=latin,cyrillic);
@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css);
	
	body {
		margin: 0;
		padding: 0;
		font-family: Roboto, sans-serif;
        font-weight: 300;
        font-size: 16px;
	}
	
	#results{
		font-size: 19px;
		color: gray;
	}
	
	.bottom{
		box-sizing: border-box;
		color:white;
		background-color: #6C725C;
		width: 100%;
		padding: 10px 10% 10px 10%;
		height: auto;
		font-family: Roboto, sans-serif;
        font-weight: 300;
        font-size: 12px;
	}
	
	table{
		width: 100%;
		border: 0px;
	}
	
	tr.top{
		background-color: #6A9F26;
		color: white;
		box-sizing: border-box;
	}
	
	td{
		border-bottom: 1px solid #6A9F26;
	}
	
	.error{
		color:Red;
		padding:5px;
	}
	
	a{
		color:gray;
		text-decoration: none;	
	}
	
	a:hover{
		color:gray;
		text-decoration: underline;
	}
		
	.container {
		margin-left: auto;
		margin-right: auto;
		max-width: 100%;
		height: auto;
		box-sizing: border-box;
	}
	
	#main{
		box-sizing: border-box;
		background-color: #6A9F26;
		width: 100%;
		height: auto;
		//overflow: auto;	
	}
	
	#section1{
		box-sizing: border-box;
		padding: 5px 10% 5px 10%;
		background-color: white;
		width: 100%;
		height: auto;
		overflow: auto;	
	}
	
	#section2{
		box-sizing: border-box;
		padding: 10px 10% 10px 10%;
		background-color: #F5F5F5;
		width: 100%;
		height: auto;
		overflow: auto;
		height: auto;	
	}
	
	#body{
		box-sizing: border-box;
		padding: 10px 10% 50px 10%;
		background-color: #F5F5F5;
		width: 100%;
		height: auto;
		overflow: auto;
		height: auto;	
	}
    
    h1{
    	margin: 50px 15px 20px 0px;
    	padding: 0px;
    	font-family: Roboto, sans-serif;
        font-weight: 100;
        font-size: 35px;
	}
    
    .small{
    	color:gray;
    	font-size: 15px;
    }
    
    h2{
	   	margin: 45px 15px 15px 0px;
    	padding: 0px;
    	font-family: Roboto, sans-serif;
        font-weight: 200;
        font-size: 28px;
        color: #FEA42F;
    }
    
    select{
	    width: 100%;
        font-size: 15px;
        font-weight: 200;
        box-sizing: border-box;
        margin: 2px 0 5px 0;
        border-radius: 0px 0px 0px 0px;
        border: 2px solid #6A9F26;
        padding: 7px;
        -webkit-appearance: none;
		-moz-appearance: none;
		appearance: none;
		color:darkgray;
		background-color: white;
		align-content: center;
    }
    
    input{
	    width: 100%;
        font-size: 15px;
        font-weight: 200;
        padding: 7px;
        box-sizing: border-box;
        margin: 2px 0 5px 0;
        border-radius: 2px 2px 2px 2px;
        border: 2px solid #6A9F26;
        color:gray;
    }
    
     input.fuckOFF{
	    width: 100%;
	    min-width: 320px;
        font-size: 15px;
        font-weight: 200;
        padding: 7px;
        box-sizing: border-box;
        margin: 2px 0 5px 0;
        border-radius: 2px 2px 2px 2px;
        border: 2px solid #6A9F26;
        color:gray;
    }
    
    input[type=file]{
	   width: 100%;
        font-size: 15px;
        font-weight: 200;
        padding: 7px;
        box-sizing: border-box;
        margin: 2px 0 5px 0;
        border-radius: 2px 2px 2px 2px;
        border: 2px solid #6A9F26;
        color:gray;
        background-color: white;
    }
    
    textarea{
	    width: 100%;
        font-size: 15px;
        font-weight: 200;
        padding: 7px;
        box-sizing: border-box;
        margin: 2px 0 5px 0;
        border-radius: 2px 2px 2px 2px;
        border: 2px solid #6A9F26;
    }
    
    .button{
		background-color: #6A9F26;
		border-radius: 3px 3px 3px 3px;
		color: white;
		margin-top: 20px;
		padding: 10px;
		border: none;
		box-sizing: border-box;
		font-size: 18px;
		width: 100%;
	}
	
	.buttonRed{
		background-color: red;
		border-radius: 3px 3px 3px 3px;
		color: white;
		margin-top: 20px;
		padding: 10px;
		border: none;
		box-sizing: border-box;
		font-size: 18px;
		width: 100%;
	}
	
	.button2{
		background-color: #6A9F26;
		border-radius: 3px 3px 3px 3px;
		color: white;
		margin-top: 10px;
		padding: 3px;
		border: none;
		box-sizing: border-box;
		font-size: 12px;
		width: auto;
		float: right;
	}
	
	.button3{
		background-color: #6A9F26;
		border-radius: 3px 3px 3px 3px;
		color: white;
		margin-top: 5px;
		margin-bottom: 5px;
		margin-right: 5px;
		padding: 10px;
		border: none;
		box-sizing: border-box;
		font-size: 18px;
		width: auto;
		min-width: 0px;
	}
	
	.button4{
		background-color: #6A9F26;
		border-radius: 3px 3px 3px 3px;
		color: white;
		margin-top: 5px;
		margin-bottom: 5px;
		margin-right: 5px;
		padding: 10px;
		border: none;
		box-sizing: border-box;
		font-size: 12px;
		width: auto;
		min-width: 0px;
	}
	
	label{
		color:#6A9F26;
		font-weight: 350;
		font-size: 16px;
	}
	
	.studentWrap{
		overflow: auto;
		margin-bottom: 25px;
		//padding-bottom: 25px;
		width: 100%;
	}
		
	.studentDiv{
		width: 100%;
		height: auto;
	}
	
	.studentPhoto{
			-webkit-transform: rotate(120deg);
			-moz-transform: rotate(120deg);
			-o-transform: rotate(120deg);
			-ms-transform: rotate(120deg);
			transform: rotate(120deg);
		}
	
		
	
	@media screen and (min-width: 600px) {
			
		.container {
			margin-left: auto;
			margin-right: auto;
			max-width: 800px;
			height: auto;
			box-sizing: border-box;
		}
		
		#results{
			font-size: 19px;
			color: gray;
		}
		
		#main{
			box-sizing: border-box;
			padding: 0px 10% 0px 10%;
			background-color: #6A9F26;
			width: 100%;
			height: auto;
			//overflow: auto;	
		}

		#section1{
			box-sizing: border-box;
			padding: 5px 10% 5px 10%;
			background-color: white;
			width: 100%;
			color:white;
		}
		
		#section2{
			box-sizing: border-box;
			padding: 10px 10% 20px 10%;
			background-color: #F5F5F5;
			width: 100%;
			height: auto;
		}
		
		#body{
			box-sizing: border-box;
			padding: 10px 25% 50px 25%;
			background-color: #F5F5F5;
			width: 100%;
			height: auto;
		}
		
    	h1{
	    	margin: 50px 15px 20px 0px;
	    	padding: 0px;
	    	font-family: Roboto, sans-serif;
	        font-weight: 200;
	        font-size: 35px;
    	}
    	
		table{
			width: 100%;
			border: 0px;
		}
		
		tr.top{
			background-color: #6A9F26;
			color: white;
			box-sizing: border-box;
		}
		
		td{
			border-bottom: 1px solid #6A9F26;
		}
    	
    	.small{
	    	color:gray;
	    	font-size: 15px;
    	}
    	
    	h2{
		   	margin: 45px 15px 15px 0px;
	    	padding: 0px;
	    	font-family: Roboto, sans-serif;
	        font-weight: 200;
	        font-size: 28px;
	        color: #FEA42F;
	    }
    	
    	select{
		    width: 40%;
		    min-width: 320px;
	        font-size: 15px;
	        font-weight: 200;
	        box-sizing: border-box;
	        margin: 2px 0 5px 0;
	        border-radius: 0px 0px 0px 0px;
	        border: 2px solid #6A9F26;
	        padding: 7px;
	        -webkit-appearance: none;
			-moz-appearance: none;
			appearance: none;
			color:darkgray;
			background-color: white;
			align-content: center;
	    }
	    
	    input{
		    width: 40%;
		    min-width: 320px;
	        font-size: 15px;
	        font-weight: 200;
	        padding: 7px;
	        box-sizing: border-box;
	        margin: 2px 0 5px 0;
	        border-radius: 2px 2px 2px 2px;
	        border: 2px solid #6A9F26;
	        color:gray;
	    }
	    
	    input.small{
		    width: 20%;
		    min-width: 120px;
	        font-size: 15px;
	        font-weight: 200;
	        padding: 7px;
	        box-sizing: border-box;
	        margin: 2px 0 5px 0;
	        border-radius: 2px 2px 2px 2px;
	        border: 2px solid #6A9F26;
	        color:gray;
	    }
	    
	    input[type=file]{
		    width: 40%;
		    min-width: 320px;
	        font-size: 15px;
	        font-weight: 200;
	        padding: 7px;
	        box-sizing: border-box;
	        margin: 2px 0 5px 0;
	        border-radius: 2px 2px 2px 2px;
	        border: 2px solid #6A9F26;
	        color:gray;
	        background-color: white;
	    }
	    
	    textarea{
		    width: 40%;
		    min-width: 320px;
	        font-size: 15px;
	        font-weight: 200;
	        padding: 7px;
	        box-sizing: border-box;
	        margin: 2px 0 5px 0;
	        border-radius: 2px 2px 2px 2px;
	        border: 2px solid #6A9F26;
	    }
	    
	    .blur{
		    background-color: rgba(238,101,25, 0.7);
		    border-radius: 2px 2px 2px 2px;
		    box-sizing: border-box;
	        padding: 15px 30px 15px 30px;
	    }
	    
	    .button{
			background-color: #6A9F26;
			border-radius: 3px 3px 3px 3px;
			color: white;
			margin-top: 20px;
			padding: 10px;
			border: none;
			box-sizing: border-box;
			font-size: 18px;
			width: 40%;
			min-width: 320px;
		}
		
		.buttonRed{
			background-color: red;
			border-radius: 3px 3px 3px 3px;
			color: white;
			margin-top: 20px;
			padding: 10px;
			border: none;
			box-sizing: border-box;
			font-size: 18px;
			width: 40%;
			min-width: 320px;
		}
		
		.button2{
			background-color: #6A9F26;
			border-radius: 3px 3px 3px 3px;
			color: white;
			margin-top: 20px;
			padding: 10px;
			border: none;
			box-sizing: border-box;
			font-size: 12px;
			width: auto;
			min-width: 0;
		}
		
		.button3{
			background-color: #6A9F26;
			border-radius: 3px 3px 3px 3px;
			color: white;
			margin-top: 5px;
			margin-bottom: 5px;
			margin-right: 5px;
			padding: 10px;
			border: none;
			box-sizing: border-box;
			font-size: 18px;
			width: auto;
			min-width: 0;
		}
		
		label{
			color:#6A9F26;
			font-weight: 350;
			font-size: 16px;
		}
		
		.studentWrap{
			overflow: auto;
			margin-bottom: 25px;	
			box-sizing: border-box;	
		}
		
		.studentDiv{
			float: left;
			width: 33.33%;
			height: auto;
			box-sizing: border-box;
		}
		
		.studentPhoto{
			-webkit-transform: rotate(90deg);
			-moz-transform: rotate(90deg);
			-o-transform: rotate(90deg);
			-ms-transform: rotate(90deg);
			transform: rotate(90deg);
		}
	    
	}
	
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape) {
  .ipad-landscape { 
	  
	  input.small{
	    width: 20%;
	    min-width: 120px;
	    font-size: 15px;
	    font-weight: 200;
	    padding: 7px;
	    box-sizing: border-box;
	    margin: 2px 0 5px 0;
	    border-radius: 2px 2px 2px 2px;
	    border: 2px solid #6A9F26;
	    color:gray;
	}
	
  } 
}
		
@media screen and (-webkit-min-device-pixel-ratio:0) { 
  select,
  textarea,
  input {
    font-size: 16px;
  }
  .studentPhoto{
			-webkit-transform: rotate(0deg);
			-moz-transform: rotate(0deg);
			-o-transform: rotate(0deg);
			-ms-transform: rotate(0deg);
			transform: rotate(0deg);
		}
}