/*

	MOBILE STYLESHEET

 */


/*

	RETINA DISPLAY UNIVERSAL

 */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
	body {
    	font-size: +2em;
	}
}



/*

	NAVIGATION RETINA

 */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
	#navContainer {
		height: +2em;
		font-size: 
	}

}



/*

	LANDING PAGE SLOGAN/NAME

 */


/* Mobile */
@media screen and (max-width: 1099px){

	#slogan {
		clear: both;
		padding-left: 0.5em;
		overflow: auto;
		margin-top: 3em;
	}

	#sloganLeft h1 {
		color: #5F9EA0;
		font-size: 3em;
	}

	#sloganLeft {
		text-align: center;
	}

	#sloganRight {
		text-align: center;
		color: #8B8B8B;
		font-style: italic;
		margin-right: 2em;
	}

	#bio {
		text-align: center;
		padding-right: 2em;
	}

}


/*	Retina main */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
	#main {
		clear: both;
		overflow: auto;
	}

	#portfolio-image {
		text-align: center;
	}

	#portfolio-image img {
		border-radius: 25em;
		width: 10em !important;
		height: auto;
		border: 5px solid #CFCFCF;
	}
}



/* 

	Landing Page About

*/


/* Mobile Image*/
@media screen and (max-width: 1099px){
	#main {
		clear: both;
		overflow: auto;
	}

	#portfolio-image {
		text-align: center;
	}

	#portfolio-image img {
		border-radius: 25em;
		width: 200px;
		height: auto;
		border: 5px solid #CFCFCF;
	}
}

/* Mobile About */
@media screen and (max-width: 659px){
	#about {
		margin-top: 1.5em;
		border-top: .175em dotted #5F9EA0;
	}

	#about h2 {
		color: #8FBBBC;
		text-align: center;
	}

	#about h4 {
		text-align: center;
	}

	#skills ul{		
		list-style-type: none;
		text-align: center;
		padding-left: 0em;
	}

	#skills p {
		text-align: center;
	}

	#skills strong {
		color: #FFF;
	}

	#currentStatus {
		padding: 0em 1.5em 0em 1.5em;
	}

	#currentStatus strong {
		color: #FFF;
	}
}



/*

	Footer

*/



/* FOOTER RETINA */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
	#footer {
		line-height: 72px !important;
	}

	#footer img {
		width:72px !important;
	}
}




/*

	PORTFOLIO DESIGN

 */


/* Mobile Portfolio */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 

	#floater {
		float: none !important;
		width: 90%;
		padding: 1em;
		margin-right: 2em;
		margin-top: 3em;
		position: static;
	}

	#floater h1 {
		color: #C9E5E7;
		text-align: center;
	}

	#floater p#sub {
		text-indent: 1em;
		line-height: 1.5em;
		font-style: italic;
	}

	#floater img {
		border-radius: 5em;
		border: .2em solid #FFF;
		width: 10em;
		height: auto;
		display: block;
		margin: auto;
	}

	#projectContainer {
		float: none !important;
		width: 90%;
		margin-right: 2em;
		padding-left: 1.5em;
	}

	.project {
		padding-left: 1.5em;
		padding-right: 2em;
		margin-bottom: 3em;
	}

	.consecutive {
		border-top: .3em dotted #FFF;
	}

	.project h1 {
		font-size: 3em;
		margin-bottom: .35em;
		/* font-size: 5em;
		font-family: "LeagueGothic";*/
		color: #FFF;
	}

	.project h3 {
		font-style: italic;
		font-weight: lighter;
		color: #5F9EA0;
		margin-top: 0em;
		margin-bottom: .7em;
	}

	.project strong {
		color: #FFF;
	}

	.project a {
		color: #FFF;
		font-weight: bold;
	}

	.project p {
		line-height: 1.3em;
	}

	p.note {
		font-size: 0.4em;
		color: #7A7A7A;
	}

}

@media screen and (max-width: 659px){
		#floater {
		float: none !important;
		width: 90%;
		padding: 1em;
		margin-right: 2em;
		margin-top: 3em;
		position: static;
	}

	#floater h1 {
		color: #C9E5E7;
		text-align: center;
	}

	#floater p#sub {
		text-indent: 1em;
		line-height: 1.5em;
		font-style: italic;
	}

	#floater img {
		border-radius: 5em;
		border: .2em solid #FFF;
		width: 10em;
		height: auto;
		display: block;
		margin: auto;
	}

	#projectContainer {
		float: none !important;
		width: 90%;
		margin-right: 2em;
		padding-left: 1.5em;
	}

	.project {
		padding-left: 1.5em;
		padding-right: 3em;
		margin-bottom: 3em;
	}

	.consecutive {
		border-top: .2em dotted #FFF;
	}

	.project h1 {
		font-size: 3em;
		margin-bottom: .35em;
		/* font-size: 5em;
		font-family: "LeagueGothic";*/
		color: #FFF;
	}

	.project h3 {
		font-style: italic;
		font-weight: lighter;
		color: #5F9EA0;
		margin-top: 0em;
		margin-bottom: .7em;
	}

	.project strong {
		color: #FFF;
	}

	.project a {
		color: #FFF;
		font-weight: bold;
	}

	.project p {
		line-height: 1.3em;
	}

	p.note {
		font-size: 0.7em;
		color: #7A7A7A;
	}
}