/**
* @package   Dispatch App
* @version   1.0.0
* @copyright 2014. Styled by Silviu B.
*
* The responsive stylesheet for he Dispatch App.
* This file holds most of the styles we're going to use for the app and works in conjunction with "styles.css" and "animation.css" stylesheets. 
*/




/* iPhone 3 portrait */
/*@media (device-height: 480px) and (-webkit-max-device-pixel-ratio: 1) and (orientation:portrait) {
}*/
 
/* iPhone 3 landscape */
/*@media (device-height: 480px) and (-webkit-max-device-pixel-ratio: 1) and (orientation:landscape) {
}*/
 

 
/* iPhone 4 retina landscape */
/*@media (device-height: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:landscape) {
}*/
 


 
/* iPhone 5 landscape */
/*@media (device-height: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:landscape) {
}*/


/*////////////////////////////////////////////////////////////
Smartphones (portrait and landscape)       
////////////////////////////////////////////////////////////*/

/* Most Smartphones with this screen width */
@media only screen and (min-width : 320px) and (max-width : 480px) {

	.loginContainer {max-width:320px; margin-left:-160px; max-height:450px; margin-top:-240px;}
	.homeLogo {margin:30px auto 30px; }
	.loginForm {max-width:60%;}
}

/* iPhone 4 retina portrait */
@media (height: 480px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:portrait) {
	.loginForm {max-width:50%;}
}

/* iPhone 5 or iPod Touch 5th generation, portrait */
@media (height: 568px) and (-webkit-min-device-pixel-ratio: 2) and (orientation:portrait) {

	.loginContainer {max-width:320px; margin-left:-160px; max-height:450px; margin-top:-240px;}
	.homeLogo {margin:30px auto 30px; }
	.loginForm {max-width:60%;}
}



/*////////////////////////////////////////////////////////////
Smartphones (landscape)      
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-width : 321px) {

}*/


/*////////////////////////////////////////////////////////////
Smartphones (portrait)    
////////////////////////////////////////////////////////////*/

@media only screen and (max-width : 319px) {
	.loginContainer {width:100%; margin-left:-50%; height:100%; margin-top:0; top:0;}
	.homeLogo {margin:20px auto 10px; max-width:90px;}
	.loginForm {max-width:60%;}
	.loginForm .input-group {margin:5px 0;}
	.loginForm .loginSubmit {margin:20px auto 10px;}
	.copyright {bottom:10px;}

	.menuButton {height:20%; padding:10%;}
	.menuLabel {font-size:12px;}
}

@media only screen and (max-width : 319px) and (height : 480px) {
	.loginContainer {max-width:320px; margin-left:-50%; max-height:450px; margin-top:-240px; top:50%; left:50%;}
	.homeLogo {margin:30px auto 30px; }
	.loginForm {max-width:60%;}
	.homeLogo {/*margin:20px auto 10px;*/ max-width:120px;}
	.loginForm .input-group {margin:10px 0;}

	.menuButton {height:30%; padding:13%;}
	.menuLabel {font-size:14px;}
}


/*////////////////////////////////////////////////////////////
iPads (portrait and landscape) 
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {

}*/


/*////////////////////////////////////////////////////////////
iPads (landscape) 
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {

}*/


/*////////////////////////////////////////////////////////////
iPads (portrait) 
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {

}*/


/*////////////////////////////////////////////////////////////
Desktops and laptops
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-width : 1224px) {

}*/


/*////////////////////////////////////////////////////////////
Large screens
////////////////////////////////////////////////////////////*/

/*@media only screen and (min-width : 1824px) {

}*/


/*////////////////////////////////////////////////////////////
iPhone 4
////////////////////////////////////////////////////////////*/

/*@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {

}
*/