/* * * * * * *
 * screen resize styles
 */

body { 
	min-width: 320px ;
}	
body .container_12,
body .container_16 { 
	margin: 0 auto; 
	/*max-width: 960px;*/
	max-width: 1280px; 
	
	}
	
 ul#fancybox li img {
 	max-height: 120px ;
 }


.big-screen { display: block ; }
.small-screen { display: none ; }

@media screen {
	.print-only {
		display: none ;
	}
}
	
@media screen and (max-width: 1280px){
	body {
		xbackground: blue ;
	}
	
	.site-outline ul li a {
			padding-left: 0.5em ; 
			padding-right: 0.5em ;

			
			
		} 
	
}

@media screen and (max-width: 1024px){

	
	
body {
	xbackground: red ;
	}
	
	.container_16 ,
	.container_12 {	
		width:98%; 
		}

	.site-outline ul li a {
			padding-left: 0.6em ; 
			padding-right: 0.6em ;
			font-size: 1em ;
			
			
		} 

	


	.spotlight-row-2 .text {
		min-height: 10em ;	    	
	}	
	
	.xsite-social {
		xdisplay: none ;
	}
	
}

@Media screen and (max-width: 900px) {

 		ul#fancybox li img {
 			max-height: 95px ;
	 }
 	
	body {
	xbackground: pink ;
	}
	
	.site-header .site-description {
    	font-size: 1.8em;
	}
	
	.site-outline ul li a {
		padding-left: 0.4em ; 
		padding-right: 0.4em ;
		font-size: 0.9em ;
	} 
	
	.site-book a {
		font-size: .85em ;
		xpadding: 0 ;
	}
	
}

@media screen and (max-width: 800px) {
 	
	body {
	xbackground: gold ;
	}
	
	.site-outline ul li a {
		padding-left: 0.5em ; 
		padding-right: 0.5em ;
		font-size: 0.85em ;
	} 
	
	.banner-full-width-wrapper {
		padding: 1em 0 ;
	}
	
	.banner-image {
		width: 100% ;
		float: none ;
	}
	.banner-text {
		width: 100% ;
		float: none ;
		height: 10em ;
	}
	.banner-text {
		height: 12em ;
	}
	
	.divSpotlightContainer .grid_3 {
		width: 48% ;
		margin-bottom: 5% ;
	}
	
	.spotlight-row-2 .text {
		min-height: 8em ;	    	
	}	
	
	
	
	.award-category-listing .grid_3 {
		width: 48% ;
		margin-bottom: 5% ;
	}
	

	
	footer .container_16 .company-details { width: 85% ; margin-bottom: 5% ; }
	footer .container_16 .grid_8 { width: 98% ; margin-bottom: 5% ; }
	
	footer .site-sponsors {
		text-align : left ;
	}
	footer .site-sponsors a {
		float: left ;
	}
	footer .site-links {
		margin-top: 2em ;	
		text-align: left ;
	}
		
}	
	


@media screen and (max-width: 768px){
	
		ul#fancybox li img {
 	max-height: 90px ;
 }
	
	.small-screen {
		display: block ;
	}	
	
	.big-screen {
		display: none ;
	}
	
	.site-social {
		display: none ;
	}
	

		
	.grid_9.container-content {
		width: 98% ;	/* lns has disappeared .. */
		border-width: 0 ;
		padding-left: 0 ;
	}	
		
	
		
	
	.jqmWindow {
		margin-left: -290px;
    	width: 580px;	
    	height: 350px ;
	}
	
	.container-sponsors .grid_8 ,
	.container-sponsors .grid_4 {
		width: 98% ;
	}
		.container-sponsors .sponsors a {
			margin-bottom: 1em ;
		}
	
	
	.container-sponsors iframe {
		width: 100% !important ;
	}
}


@media screen and (max-width: 720px) {
	
	.award-category-listing .grid_4 {
		width: 98% ;
		margin-bottom: 5% ;
	}
	
	.award-category-listing .grid_4 img {
		width: 100% ;
	}
	
	.container-button-links .grid_4 {
		width: 98% ;
		margin-bottom: 1em ;
	}
	.container-button-links a {
		max-width: 360px ;
		margin: 0 auto ;
	}
	
}	




@media screen and (max-width: 600px) {
	
		
	.container-sponsors .grid_3,
	.container-sponsors .grid_9 {
		width: 98% ;
	}
		
	.container-sponsors div img {
		margin-top: 0.25em ;
	}
	
	.profile-photo-sponsor {
		float: none ;
		margin-left: 0 ;
	}
	

	.jqmWindow {
		top: 10%;
		margin-left: -195px;
	    width: 390px;	
	    height: 300px ;
	    
		}	
}

@media screen and (max-width: 540px) {
	
	.divSpotlightContainer .grid_3 {
		width: 98% ;
	}
	
		.divSpotlightContainer .grid_4 {
		width: 98% ;
	}
	
	.divSpotlight.winners .title {
		min-height: 1.5em ;
	}
	.spotlight-row-2 .text {
		min-height: 3em;
	}

}



@media screen and (max-width: 480px){


	
	.container-button-links a {
		max-width: 300px ;
		margin: 0 auto ;
	}
	
	.banner-text {
		height: 13em ;
	}
		
	
	.divSpotlightContainer .grid_3 {
		width: 98% ;
	}
		.divSpotlight p {
			min-height: 1em ;
		}
	
	
	.award-category-listing .grid_3 {
		width: 98% ;
	}
	.award-category-listing .grid_3 .text {
		min-height: 1em ;
		padding: 1em 0 ;
	}
	

	.jqmWindow {
	    top: 5%;
		margin-left: -150px;
    	width: 300px;	
    	height: 300px ;
	}	
	
	footer .container_16 .site-logo { width: 23% ; margin-bottom: 5% ; }  
	footer .container_16 .company-details { width: 73% ; margin-bottom: 5% ; }
	footer .container_16 .site-links { width: 98% ; margin-bottom: 5% ; }
	footer .container_16 .site-sponsors { width: 98% ; margin-bottom: 5% ; }
	footer .container_16 .site-links ul ,
	footer .container_16 .site-sponsors ul {
		float: none ;
		margin: 0 ;
		padding: 0 ;
	}
	
		footer .site-sponsors a {
			max-width: 29.2% ;
			margin: 0 2% ;
			float: left ;
			text-align: center ;
		}
	
}

@media screen and (max-width: 360px){

	.banner-text {
		height: 15em ;
	}
}

@media screen and (max-width: 320px){
		
	.jqmWindow {
	    top: 5%;
		margin-left: -150px;
    	width: 300px;	
    	height: 300px ;
	}
	
}

/* mobile menu */
/* Keep this separate to other styles affecteding 768px */
@media screen and (max-width: 768px) {

	.container-mobile-bar .grid_8 {
		padding: 1em 0 ;
	}
	
	.grid_navicon {
		padding-top: 0.85em ;
	}
	
	a.mobile-toggle {
		color: white ;
		padding-bottom: 0.25em ;
   	}
	   	a.mobile-toggle > i {
		   	margin-right: 0.25em ;
	   		font-size: 0.95em ;
	   	}
	    
  /* The dropdown menu - "floats over the content" */
	.container-mobile-bar {
		
	}
	.container-mobile-menu {
		position: relative ;
	}
	.mobile-menu {
 		position: absolute ;
 		top: 0 ;
 		left: 0 ;
 		right: 0 ;
 		z-index: 104 ;
 		
 		padding: 0 0 1em 0 ;
 		background: #7f7eb8  ;
 	}
	
 	.mobile-menu ul {
 		margin: 0  ;
 		padding: 0 ;
 		text-align: left ;
 	}
 
    .mobile-menu ul li {
        list-style: none;
     }
  
    .mobile-menu-links a {
        display: block;
        padding: .65em 0.5em ; 
        color: #FFFFFF ;
        text-decoration: none ;
        text-indent: -1.15em ;
        padding-left: 2em; 
    }
    	.mobile-menu-links li.section-label  ,
    	.mobile-menu-links li.level-1 {
    	/* 	border-bottom: 1px solid #FFFFFF ; */
    	}
    
    	.mobile-menu-links li.section-label a {
  			color: #FFFFFF ;
  		}
  		.mobile-menu-links li.section-label li a {
  			color: #FFFFFF ;
  			padding-left: 10% ;
        	padding-left: 3em; 
  		} 
  		.mobile-menu-links li.section-label li.category-label a {
  			color: #FFFFFF ;
        	padding-left: 3em;
  		}
    	.mobile-menu-links li.section-label li.category-label li a {
  			color: #FFFFFF ;
        	padding-left: 3em;
  		} 
    
    .mobile-menu-links ul {
    	display: none ;		/* hide the sub-navs - toggle later */
    }
 
 	.mobile-menu-links a.menu-item-header:before {
 		content: "\00B1";	/* +/1 sign */
 	}
 
    .mobile-menu-links a:before {
        content: "\00bb" ; 			/* "\2192";	/* --> sign */
        padding-right:7px; 
    }
    .mobile-menu-links li a:hover {
    	color: white !important ;
    	background-color: #00AEEF !important ;
    }	    

	.site-social {
		text-align: left ;
		padding-left: 1em ;
	}
	
	.site-social {
		padding-top: 1.65em ;
		width: 100% ;
		font-size: 0.8em;
	}
	.site-social a ,
	.site-social a:link ,
	.site-social a:visited {
		background: transparent ;
		color: white ;
		margin-right: 1em ;
		font-size: 1.7em ; 		
	}
		.site-social a:hover {
			background: #00AEEF ;
			color: #FFFFFF ;
		}
}


@media print {
	
	body {
		font-size: 13px ;
	}
		
	.no-print {
		display: none ;
	}
	
	.print-only {
		display: block ;
	}
	
	.banner-image,
	.banner-text {
		width: 48% ;
	}
	
	.banner-text {
	padding: 0 ;
	}
	
	.xcontainer-button-links .grid_4 {
		float: none ;
	}
	
	
	
	#main .grid_9,
	.container_12 .grid_9_content {	
		width: 98% ;		/* lns is now hidden */
		border-left-width: 0px ;
	}
	#main .grid_6 {
		width: 73% ;		/* lns is now hidden */  
	}
	
	.site-sponsors {
		font-size: 0.8em ;
	}
	
	.site-sponsors img {
		max-width: 70px ;
	}
	


}