/* Up tp 480px */

.box {
	width:90%;
	padding:0 5% 0 5%;
	}
#wrapper {width:100%;}
#header {
	height:250px;
	background:url(../images/mobile-header-bkg.png) repeat-x;
	}
#footer {
	background:url(../images/footerTop-bkg.png) repeat-x top;
	width:100%;
	height:650px;}
	
#logo {	padding-left:50%; margin-left:-127px;}
#tagline {
	display:block;
	height:53px;
	margin-top:20px;
	background:url(../images/mobile-tagline.png) no-repeat top  center;
	text-indent:-9999px;
	}
#tagline {
	display:block;
	height:53px;
	margin-top:20px;
	background:url(../images/mobile-tagline.png) no-repeat top  center;
	text-indent:-9999px;
	}

/*======= Contact Icons ======*/
#contact-icons {
	float:left;
	list-style:none;
	margin: 0 0 0 -87px; padding:0 0 0 50%;}
#contact-icons li {
	float:left;
	margin: 15px 40px 0 0; padding:0;
	display:block;}
#phoneIcon {
	background:url(../images/m-icon-phone.png) no-repeat bottom left;
	width:33px; height:27px; 
	display:block;
	text-indent:-9999px;
	}
#emailIcon {
	background:url(../images/m-icon-email.png) no-repeat bottom left;
	width:31px; height:26px; 
	display:block;
	text-indent:-9999px;
	}
#twitterIcon {
	background:url(../images/m-icon-twitter.png) no-repeat bottom left;
	width:38px; height:26px; 
	display:block;
	text-indent:-9999px;
	}


/*======= Headings ======*/

#webdesign {
	background:url(../images/mobile-heading-webDesign.png) no-repeat bottom left;
	height:16px; width:114px;
	display:block;
	text-indent:-9999px;
	margin-bottom:25px;
	padding-top:50px;
	}
#userexperiencedesign {
	background:url(../images/mobile-heading-userInterface.png) no-repeat bottom left;
	height:16px; width:216px;
	display:block;
	text-indent:-9999px;
	margin-bottom:25px;
	padding-top:150px;
	}
#creativework {
	background:url(../images/mobile-heading-creativeWork.png) no-repeat bottom left;
	height:16px; width:143px;
	display:block;
	text-indent:-9999px;
	margin-bottom:25px;
	padding-top:150px;
	}
#aboutme h2 {
	background:url(../images/heading-aboutMe.png) no-repeat bottom left;
	height:26px; width:148px;
	display:block;
	text-indent:-9999px;
	margin-bottom:20px;
	padding-top:75px;
	}

#findme h2 {
	background:url(../images/heading-findMe.png) no-repeat bottom left;
	height:26px; width:115px;
	display:block;
	text-indent:-9999px;
	margin-bottom:20px;
	padding-top:100px;
	}


#aboutme p {
	margin-bottom:10px;}
	
#info {padding-bottom:25px;}


/*======= Contact Form ======*/

#contactme {display: none;}




/*======= Social Media ======*/

#facebook {
	background:url(../images/social-facebook.png) no-repeat top left;
	height:42px; width:42px;
	display:block;
	text-indent:-9999px;}
#twitter {
	background:url(../images/social-twitter.png) no-repeat top left;
	height:42px; width:42px;
	display:block;
	text-indent:-9999px;}
#linkedin {
	background:url(../images/social-linkedin.png) no-repeat top left;
	height:42px; width:42px;
	display:block;
	text-indent:-9999px;}
#daysofdesign {
	background:url(../images/social-rss.png) no-repeat top left;
	height:42px; width:42px;
	display:block;
	text-indent:-9999px;}
#social-networks {
	float:left;
	list-style:none;}
#social-networks li {
	float:left;
	margin: 0 10px 0 0; padding:0;
	display:block;}
#info {
	display:block;
	clear:both;
	padding-top:20px;}
	
#info p a {
	color:#000;
	text-decoration:none;}

p {
	color:#1f1f1f;
	text-shadow: 0px 1px 0px #8D8D8D;}


/*======= Content ======*/


#content ul a { text-decoration: none;}

#content ul  {padding-left:50%; margin-left:-140px;}

.screen {
	border:#FFF 4px solid;
	-moz-box-shadow: 0 1px 4px #3e3e3e;
	-webkit-box-shadow: 0 1px 4px #3e3e3e;
	box-shadow: 0 1px 4px #3e3e3e;
	padding:0; margin:0 auto 25px auto;
	width:280px; height:200px 
}