@charset "UTF-8";
/* CSS Document - mbhuju@gmail.com */



@media screen and (max-width: 1024px){
	#frame{ width:95%;}
	#contentframe{ width:95%;}
	#footerframe{ width:95%;}
	
	#box{ width:84%; height:auto; padding:2%;}
	
	nav { font-size:.8300em; width:98%; text-transform:uppercase; font-family:'Raleway', Arial, Helvetica, sans-serif; font-weight:500; }
	
	#workframe{ width:95%; padding-bottom:20px;}
	#work1{ width:30%; margin-right:5%;}
	#work2{ width:30%; margin-right:5%;}
	#work3{ width:30%;}
	
	}

@media screen and (max-width: 980px){
	nav { font-size:12px; }
	nav ul li a:link, nav ul li a:active, nav ul li a:visited { padding: 10px 11px; }
	
	#work1{ width:30%; margin-right:5%;}
	#work2{ width:30%; margin-right:5%;}
	#work3{ width:30%;}
	.sampleimg{ border:10px solid #FFFFFF; margin:10px; max-width:82%;}
	
	}
	
	
@media screen and (max-width: 800px){
	nav { font-size:10px; }
	nav ul li a:link, nav ul li a:active, nav ul li a:visited { padding: 10px 8px; }
	
	
	#footerframe{ width:90%;}

	
	#box{ padding:3%;}
	
	#frame25{ width:100%; float:none; margin-left:0;}
	
	#footer1{ width:100%; float:none; text-align:center;}
	#footer2{ width:40%; padding-bottom:70px;}
	#footer3{ width:20%;}
	#footer4{ width:40%;}
	.fbfooter{ display: inline;}
	
	
	
	#frame50{ width:100%; float:none; margin-bottom:30px;}
	
	}

@media screen and (max-width: 640px){
	
	.smallheader{ display: inline;}
	.mainheader{ display:none;}
	
	#work1{ width:32%; margin-right:2%;}
	#work2{ width:32%; margin-right:2%;}
	#work3{ width:32%;}
	.sampleimg{ border:10px solid #FFFFFF; margin:10px; max-width:80%;}
	#work a:link, #work a:active, #work a:visited  { font-size:16px; }
	
	#homeleft{ width:95%; margin-right:0; float:none; padding: 0; text-align:center; margin:0 auto;}
	#homeright{ width:95%; float:none; margin:20px auto 0 auto;}
	
	#portfolio1{ width:45% ; margin-right:5%;}
	#portfolio2{ width:45% ; margin-right:5%;}
	#portfolio3{ width:45% ; margin-right:5%;}
	#portfolio4{ width:45%  ;}
	
	#footer1{ width:100%; text-align:center; float:none;}
	#footer2{ width:100%; text-align:center; float:none; padding-bottom:50px;}
	#footer3{ width:40%; padding-bottom:50px; margin-left:10%;}
	#footer4{ width:40%; padding-bottom:50px; margin-left:10%;}
	
	.imgright{ float:none; margin-left:0px; width:100%; margin-bottom:30px;}
	
	#photo{ width:46%; float:left; padding:2%; text-align:center;}
	
	
	
	#navframe{ height:40px;}
	#menu {width:102px; height:30px; display: block; background:url(../images/menu-icon.png) no-repeat; cursor: pointer; }
	nav { margin:0 auto; width:100%; }
	nav { font-size:.9em; }
	nav.js {display: none;}
	nav ul {width:100%; background:#340054;}
	nav li {width:100%;}
	nav ul ul{ position: relative;}
	nav ul ul ul{ position:static;}
	}


@media screen and (max-width: 360px){
	#work1{ width:100%; margin-right:0; float:none;}
	#work2{ width:100%; margin-right:0; float:none;}
	#work3{ width:100%; margin-right:0; float:none;}
	#footerframe{ margin-top:40px;}
	
	#footer3{ width:50%; padding-bottom:50px; margin-left:0;}
	#footer4{ width:50%; padding-bottom:50px; margin-left:0%;}
	
	#portfolio1, #portfolio2, #portfolio3, #portfolio4{ width:100% ; margin-right:0; float:none;}
	
	}
	



@media screen and (min-width: 641px) {
#menu {
display: none;
}