@charset "utf-8";
/* CSS Document */

#sections { margin-bottom:20px; }
	#sections ul ul { border-left:solid 1px #CCC; margin-left:25px; }
	#sections div   { padding:5px 10px; background:#E8EEF7; margin:3px; border:solid 1px #D8E2F1; cursor:move; color:#333; }
	#sections span  { float:right; margin-left:5px; border-left:solid 1px #D8E2F1; padding-left:5px; }
		#sections div.hidden { visibility:visible; background:#DDD; }

.placeholder { border: dashed 1px #ccc; background-color:#FFFFCC; padding:5px 0; margin:3px; }

#typeModule .uploadifyQueue { margin-left:145px; width:400px; }

#typeModule #thumbImage, #typeModule #thumbIcon { max-width:500px; background:url("../images/transparent.gif"); }

#sectionSections { width:70%; text-align:center; margin-bottom:2%; margin:0 auto; }
	#sectionSections li  { position:relative; display:inline-block; margin:1%; width:47%; vertical-align:top; text-align:center; }
	#sectionSections a   { display:block; }		
	#sectionSections img { width:100%; transition: all .2s ease-in-out; }			
		#sectionSections li:hover img { transform: scale(1.05); box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.65); }
	
	#sectionSections h4  { padding:0; padding:3%; color:#333; font-size:1.3em; transition:all .3s ease-in-out; background:#eee; }		
		#sectionSections a:hover h4 { color:#111; background:#ddd; }		
	
#thumbImage { max-width:500px; margin:0 auto; }


/* ==========================================================================
   Media Queries
   ========================================================================== */ 

   
@media only screen and (max-width:1300px) {		
	
	#sectionSections { width:80%; }
}

@media only screen and (max-width:1000px) {		
	
	#sectionSections { width:90%; }
}

@media only screen and (max-width:800px) {		
	
	#sectionSections { width:100%; }
	
}		
   
@media only screen and (max-width:550px) {		
	
	#sectionSections li { width:90%; }
}			

@media only screen and (max-width:300px) {		
	
	#sectionSections li { width:auto; display:block; }
}