

    @media
only screen and (-webkit-min-device-pixel-ratio: 1.5),
only screen and (-o-min-device-pixel-ratio: 3/2),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5){

  html,
  body{
    width:100%;
    overflow-x:hidden;
	background-color:#FFFFFF;
  }

}


     
	body {
		font-family:Calibri, Arial, Geneva, sans-serif; 
		font-size:0.9em;
		color:#000000;
		text-align:center;
		font-size:100%;
		margin:0px;
		
	}
	
		a img
	{
		border:none;
	
	}
	a {
		color:#000;
		text-decoration:none;
	}
	
	a:hover{
		color:#000;
		text-decoration:underline;
	}

	#outer_container {
		height: 100%;
		width: 100%;
	}
	
	
	

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 3; /* Sit on top */
  padding-top: 20%; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}	
	
	
	
	
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */


@media only screen and (max-width: 760px)  {	
	
	#container {
		margin: 0 auto;   
		text-align: left; 
		width: 100%;
		text-align:center;
	}	
	
	#header {
		height: auto;
		width: 98%;
		text-align: center;
		float: left;
		margin-top: 20px;
	}

	#header img{
		max-width:100% !important;
	}		
	
	table {
		width:100%;
		
	}
	
	#login_table{
		text-align:left;
		width:320px;
		margin-bottom:40px;
		
	}	



	#frmRequest input#username, #frmRequest input#password {
    font-size: 12px;
    height: 20px;
    width: 80%;
	
	}		
	
	.img_btn, .img_btn_first {
	float:left;
	width:42%;
	height:auto;
	margin-left:5%;
	margin-top:2%;
		
		
	}
	
	
	
	.img_btn img, .img_btn_first img{
	width:100%;
		
		
	}

	.img_text{

	float:left;
	width:85%;
	height:auto;
	margin-left:5%;
	font-size:26px;
	font-weight:bold;
	text-align:left;
		
		
	}		
	
	
	
	
	
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */


@media only screen and (min-width: 761px) and (max-width: 1199px)  {	
	
	
	
	
	#container {
		margin: 0 auto;   
		text-align: left; 
		width: 100%;
		text-align:center;
	}	
	
	#header {
		height: auto;
		width: 96%;
		text-align: center;
		float: left;
		margin-top: 20px;
		padding:2%;
	}

	#header img{
		max-width:100% !important;
	}	
	
	table {
		width:100%;
		
	}
	
	#login_table{
		text-align:left;
		width:320px;
		margin-bottom:40px;
		
	}		
	
	#login_input {
		width: 373px;
		height:32px;
		background-image: url("/mtec/images/sc-trainee-login-textfield.jpg");
	}

	#frmRequest input#username, #frmRequest input#password {
	background-color: rgba(0, 0, 0, 0);
    border: 0 none;
    color: #666666;
    display: inline;
    float: left;
    font-size: 12px;
    height: 20px;
    margin-bottom: 0;
    margin-left: 8px;
    margin-top: 7px;
    padding: 0;
    text-align: left;
    width: 355px;
	
	}		
	
	.img_btn {
	float:left;
	width:20%;
	height:auto;
	margin-left:7%;
	margin-top:2%;
		
		
	}
	
	.img_btn_first {

	float:left;
	width:20%;
	height:auto;
	margin-left:12%;
	margin-top:2%;
		
		
	}	
	
	
	
	.img_btn img, .img_btn_first img{
	width:100%;
		
		
	}

	.img_text{

	float:left;
	width:80%;
	height:auto;
	margin-left:12%;
	font-size:26px;
	font-weight:bold;
	text-align:left;
		
		
	}		
	
	
	
	
	}
	
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */


@media only screen and (min-width: 1200px)   {		
	
	
	
	#container {
		margin: 0 auto;   
		text-align: left; 
		width: 1200px;
		min-height:1075px;
		background-image: url("/mtec/images/long-shadow.jpg");
		background-repeat: repeat-y;
		text-align:center;
	}	
	
	#header {
		height: auto;
		width: 96%;
		text-align: center;
		float: left;
		margin-top: 20px;
		padding:2%;
	}
	
	table {
		width:100%;
		
	}
	
	#login_table{
		text-align:left;
		width:320px;
		margin-bottom:40px;
		
	}	
	
	#login_input {
		width: 373px;
		height:32px;
		background-image: url("/mtec/images/sc-trainee-login-textfield.jpg");
	}

	#frmRequest input#username, #frmRequest input#password {
	background-color: rgba(0, 0, 0, 0);
    border: 0 none;
    color: #666666;
    display: inline;
    float: left;
    font-size: 12px;
    height: 20px;
    margin-bottom: 0;
    margin-left: 8px;
    margin-top: 7px;
    padding: 0;
    text-align: left;
    width: 355px;
	
	}	
	
	.img_btn {
	float:left;
	width:20%;
	height:auto;
	margin-left:7%;
	margin-top:2%;
		
		
	}
	
	.img_btn_first {

	float:left;
	width:20%;
	height:auto;
	margin-left:12%;
	margin-top:2%;
		
		
	}	
	
	
	
	.img_btn img, .img_btn_first img{
	width:100%;
		
		
	}

	.img_text{

	float:left;
	width:80%;
	height:auto;
	margin-left:12%;
	font-size:26px;
	font-weight:bold;
	text-align:left;
		
		
	}	
	
	
	
	
}
	