/*  D E V E L O P E R   C U S T O M I Z A B L E   S T Y L E S    */
/*  State of Delaware - CLF 2012 - May 2012  */




/*  C O N T E N T   A R E A   C U S T O M   B A C K G R O U N D  */

/* User content area - graphical background style controls */
/* Uncomment styles to activate. Replace green-background png files with your files.
As coded, the background assumes it stretches from left to right in the content area,
then repeats from top to bottom. You can edit the repeat behavior to suit your graphic.
Note that the 'overflow: auto' line should remain to prevent box model problems. You have
basic Photoshop templates for each of these items. */

#mcaw1 {
	padding-top:			0px;
}
	
	
	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcaw1 {
 		/* 
background:				url('/usr/img/CLF_back_mcaw1_small.png');
		background-repeat:      repeat-y;
 */
				
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcaw1 {
 		/* 
background:				url('/usr/img/CLF_back_mcaw1_large.png');
		background-repeat:      repeat-y;
 */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcaw1 {
 		/* 
background:				url('/usr/img/CLF_back_mcaw1_large.png');
		background-repeat:      repeat-y;
 */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcaw1 {
 	   	/* 
background:             url('/usr/img/CLF_back_mcaw1_small.png');
		background-repeat:      repeat-y;
		overflow:				auto;
	    background-position: 	162px 0px;
 */
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcaw1 {
		/* 
background:             url('/usr/img/CLF_back_mcaw1_large.png');
		background-repeat:      repeat-y;
		overflow:				auto;
		background-position: 	216px 0px;
 */
		}}



/*  N A V   S I D E B A R   B A D G E S   */
/* Controls for the two badges that can appear in the navigation bar. In most
cases, simply leaving these styles alone is OK. You will use the badge template
.PSDs and badge naming conventions. You will also add or remove badge code from
the nav bar .shtml file. This means you will never need to edit the items below.
But, they're here, in case you need to make an edit. You have Photoshop templates
for each of these items. */

#nav_badges .badge1 {
	background-repeat:	no-repeat;
	border:				1px solid #646464;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#nav_badges .badge1 {
		background:				url('/usr/img/CLF_badge1_U17.png');
		width:					272px;
		height:					160px;			
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#nav_badges .badge1 {
		background:				url('/usr/img/CLF_badge1_U17.png');
		width:					272px;
		height:					160px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#nav_badges .badge1 {
		background:				url('/usr/img/CLF_badge1_U17.png');
		width:					272px;
		height:					160px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#nav_badges .badge1 {
		background:				url('/usr/img/CLF_badge1_U9.png');
		width:					144px;
		height:					80px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#nav_badges .badge1 {
		background:				url('/usr/img/CLF_badge1_U12.png');
		width:					192px;
		height:					112px;	
		}}
		

#nav_badges .badge2 {
	background-repeat:	no-repeat;
	border:				1px solid #646464;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#nav_badges .badge2 {
		background:				url('/usr/img/CLF_badge2_U17.png');
		width:					272px;
		height:					160px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#nav_badges .badge2 {
		background:				url('/usr/img/CLF_badge2_U17.png');
		width:					272px;
		height:					160px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#nav_badges .badge2 {
		background:				url('/usr/img/CLF_badge2_U17.png');
		width:					272px;
		height:					160px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#nav_badges .badge2 {
		background:				url('/usr/img/CLF_badge2_U9.png');
		width:					144px;
		height:					80px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#nav_badges .badge2 {
		background:				url('/usr/img/CLF_badge2_U12.png');
		width:					192px;
		height:					112px;	
		}}



/*  C U S T O M   H E A D E R   I M A G E   */

/*  Uncomment items in this section if you want to use a custom header image. 
(By default, the header image pulls from Delaware.gov, not from the local
folder.) You have Photoshop templates for each of these items. NOTE that you
should use the template to create the source images. This is to get the best
image-to-K .JPG compression and also to incorporate the top and side shadows,
which are too complex to be layered over a raw image by CSS. */

/* WANT NO HEADER IMAGE? (Showing the slimline bar only?) Leave this code alone.
Instead, see the headerImage.shtml file. */


#hgp1 .headerPhoto {
    background-repeat:	no-repeat;
} 

    /* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#hgp1 .headerPhoto {
		background:				url('/usr/img/CLF_headerPhoto_hgp_U9.jpg');
		width:				    729px;
		height:                 99px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#hgp1 .headerPhoto {
	    background:				url('/usr/img/CLF_headerPhoto_hgp_U12.jpg');
		width:				    972px;
		height:                 132px;
		}}


/* Sitewide Custom Styles */

/* BEGIN SLIDESHOW SIZE B DO NOT CHANGE UNLESS INSTRUCTED TO DO SO */
.camera_wrap {
	display: none;
	position: relative;
	z-index: 1000;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.camera_wrap {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.camera_wrap {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.camera_wrap {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.camera_wrap {
		width: 100%; /* changed from 70 to 80 for use with connect box, changed to 100 to remove connect box - jeff*/
		float:left;
        }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.camera_wrap {
		width: 100%; /* changed from 70 to 80 for use with connect box, changed to 100 to remove connect box - jeff*/
		float:left;
		}}
/* END SLIDESHOW SIZE B DO NOT CHANGE UNLESS INSTRUCTED TO DO SO */




/* MOBILE NAV MENU BKG */
#nav_open_button1, #nav_open_button2, #nav_close_button1, #nav_close_button2 {
    background-image:	url('/usr/img/CLF_menu_bkg_ag.jpg');
	background-position:		top left;
	background-repeat:			repeat-x;
	position:relative;
	z-index: 9999;
	}
	
    /* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) {
	#nav_open_button1, #nav_open_button2, #nav_close_button1, #nav_close_button2 {
		background-image:   none;
		}}



#mcaw1_full {
	padding-top:			0px;
}
	
	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcaw1_full {

		background-repeat:      no-repeat;
		background-color:		#ffffff;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcaw1_full {

		background-repeat:      no-repeat;
		background-color:		#ffffff;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcaw1_full {

		background-repeat:      no-repeat;
		background-color:		#ffffff;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcaw1_full {
/* 	   	background:             url('/usr/img/CLF_dhr_macw1full_back_972.png'); */
		background-repeat:      no-repeat;
		background-color:		#ffffff;
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcaw1_full {
/* 		background:             url('/usr/img/CLF_dhr_macw1full_back_972.png'); */
		background-repeat:      no-repeat;
		background-color:		#ffffff;
/* 		margin-top:				-10px; */
		}}


#mcaw2_full {
	padding-top:			0px;
}
	
	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcaw2_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcaw2_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcaw2_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcaw2_full {
		/* 
		background:             url('/private/CLF30/img/CLF_back_mcaw2_U9.png');
		background-repeat:      repeat-y;
	    background-position: 	161px 0px;
	    overflow:				auto;
 */
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcaw2_full {
		/* 
		background:             url('/private/CLF30/img/CLF_back_mcaw2_U12.png');
		background-repeat:      repeat-y;
		overflow:				auto;
		background-position: 	215px 0px;
 */
		}}
	

#mcaw3_full {
	padding-top:			0px;
}
	
	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcaw3_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcaw3_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcaw3_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcaw3_full {
	
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens*/ 
	@media screen and (min-width:996px) {
	#mcaw3_full {
		
		}}
	

#mcaw4_full {
	padding-top:			0px;
	/* 
	background:             url('/private/CLF30/img/CLF_sidebar_rule_U12.png');
	background-repeat:      repeat-y;
 */
    }
	
	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcaw4_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcaw4_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcaw4_full {
	    background-color:		#FFFFFF;
	    background:				none;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcaw4_full {
	    background-position: 	161px 0px;
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcaw4_full {
		background-position: 	215px 0px;
		}}
    	
    	

/*  CONTENT AREA USER HOMEPAGE FULL WIDTH */

#mcauser1_full {}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcauser1_full {
		width:					100%;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcauser1_full {
		width:					100%;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcauser1_full {
		width:					100%;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcauser1_full {
		float:					right;
	    width:                  728px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcauser1_full {
		float:					right;
		width:					972px;
		}}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcauser_hdr1_full {
		margin-left:			11px;
		margin-right:			11px;
		margin-top:				0px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcauser_hdr1_full {
		margin-left:			11px;
		margin-right:			11px;

		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcauser_hdr1_full {
		margin-left:			11px;
		margin-right:			11px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcauser_hdr1_full {
		width:              728px;
		margin-left:        18px;
		margin-top:			-23px;
	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcauser_hdr1_full {
		width:				972px;
		margin-left:        24px;
		margin-top:			-35px;
		}}


/* Wrappers for main content area user content, below full-width in-article header (mcauuser_cont) */
/* This is the true content area. User content is placed in here */
#mcauser_cont1_full {
	/* specify width and overflow hidden to prevent wide content from
	blowing up the CLF left-to-right */
	overflow:			hidden;
	border:				0px solid green;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcauser_cont1_full {
		margin-left:			11px;
		margin-right:			11px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcauser_cont1_full {
		margin-left:			11px;
		margin-right:			11px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcauser_cont1_full {
		margin-left:			11px;
		margin-right:			11px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcauser_cont1_full {
		width:              728px;
		margin-left:        18px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcauser_cont1_full {
		width:				972px;
		margin-left:        24px;
		}}



/*  NAV STYLES ONLY FOR HOMEPAGE FULL WIDTH */

/* Wrappers for nav (mcanav) */
#mcanav1_full {
	border:				0px solid green;
	background:			#FFFFFF;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcanav1_full {
	    width:				100%;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcanav1_full {
	    width:				100%;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcanav1_full {
	    width:				100%;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcanav1_full {
	    display:none;
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcanav1_full {
		display:none;
		}}
	
#mcanav2_full {
	border:				0px solid red;
	overflow:           hidden;
	}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#mcanav2_full {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#mcanav2_full {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#mcanav2_full {
		margin-left:		0px;
        margin-right:		0px;
        }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#mcanav2_full {
		display:none;
        }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#mcanav2_full {
		display:none;
		}}






/* CONNECT CONTAINER ON THE HOMEPAGE */   
	#connectbox {  }


	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connectbox {
		display:none;
        }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connectbox {
		display:none;
        }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connectbox {
		display:none;
        }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connectbox {
		float:					right;
		width:					20%; /* Changed from 218px jeff */
		height:					255px;
		margin:					0px 0px 0 0px;
		background-color:       #FFFFFF;
		background:             url('/usr/img/ag_connectbox_sm.jpg');
		background-repeat:      repeat-y;
        }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connectbox {
		float:					right;
		width:					20%; /* Changed from 290px jeff */
		height:					292px;
		margin:					0px 0px 0px	0px;
		background-color:       #FFFFFF;
		background:             url('/usr/img/ag_connectbox_bg.jpg');
		background-repeat:      repeat-y;
		}}
		

/* Paragraph Text and Color Style */
#connect P {
    margin-top:         0em;
    margin-bottom:      0.5em;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect P {
		font-size:      	0.9em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect P {
		font-size:      	0.9em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect P {
		font-size:      	0.9em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect P {
		font-size:      	0.9em;
		line-height:    	1.1em;
		margin-bottom:      0.9em;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect P {
		font-size:      	0.9em;
		line-height:    	1.6em;
		margin-bottom:      1.0em;
		}}


/* NEWS CONTAINER ON THE HOMEPAGE */   

#news a, #news a:link, #news a:active, #news a:visited {
	text-decoration:	none;
	color:				#0055a4;
	}

#news a:hover {
    text-decoration:    none;
    color:				#91292a;
    }


/* HR Style for AG Blue HR */
hr.banner {
		height: 2px;
		color: #0055a4;
		background-color: #0055a4;
		margin-left: 0px;
		margin-right: 0px;
	}


 #connectbox2 { color: #222222; }
 
 	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connectbox2 {
		background-color:       	#ffffff;
		margin-top:					0px;
		*margin-top:				0px;
        }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connectbox2 {
		background-color:       	#ffffff;
		margin-top:					0px;
		*margin-top:				0px;
        }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connectbox2 {
		background-color:       	#ffffff;
		margin-top:					0px;
		*margin-top:				0px;
        }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connectbox2 {
		display:none;
        }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connectbox2 {
		display:none;
		}}


/* Latest News Header on Homepage */
#connectbox2 .connect_banner {
	background-position:		top left;
	background-repeat:			repeat-x;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connectbox2 .connect_banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connectbox2 .connect_banner {
		background-image:		url('/usr/img/ag_banner_bkg757.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connectbox2 .connect_banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		width:					618px;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connectbox2 .connect_banner {
		display:none;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connectbox2 .connect_banner {
		display:none;
		}}
 
 



#news2 a, #news2 a:link, #news2 a:active, #news2 a:visited {
	text-decoration:	underline;
	color:				#0055a4;
	
	}

#news2 a:hover {
    text-decoration:    none;
    color:				#91292a;
    }	
 
 
 
 /* NEWS AREA AND PARAGRAPH STYLES */
	.news_date {
			font-style:		italic;
			text-align:		left;
			display:		block;
			color: 			#646464;
			font-size:		12px;
			padding-left:	18px;
			padding-right:	18px;
				} 
	.news_title a, .news_title a:link, .news_title a:visited, .news_title a:active {

			display:			block;
			text-align:			left;
			text-decoration:	underline;
			font-size:14px;
			padding-bottom:		0px;
			color:				#ffffff;
			padding-left:		18px;
			padding-right:		18px;
				}
				
	.news_title a:hover {
			color:				#ffffff;
			display:			block;
			text-align:			left;
			font-size:14px;
			text-decoration:	none;
			padding-bottom:		0px;
			padding-left:		18px;
			padding-right:		18px;
}

	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.news_title a, .news_title a:link, .news_title a:visited, .news_title a:active, .news_title a:hover {
			font-size:14px;
		}}

				
.news_wrapper .news_desc {
	display:none;
}

.news_wrapper{
	margin-bottom:10px;
}


/* LAYOUT DIVS (ADDED BY MATT C.) */
.table-wrap {
        width:100%;
     }
    .table-wrap div {
        margin:0;  
    }
    .row-wrap {
        clear:both;
    }
    .clear {clear:both;}
    
    .left-td {
        float:left;
        width:25%;
        padding:2%;
    }
    .right-td {
        float:left;
        width:40%;
        padding:2%;
     }
    
    .left-td2 {
        float:left;
        width:45%;
        padding:2%;
    }
    .right-td2 {
        float:left;
        width:23%;
        padding:2%;
     }



   	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.table-wrap-home {
	    width:100%;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.table-wrap-home {
	    width:100%;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.table-wrap-home {
	    width:100%;
	    }}
	      
     /* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.table-wrap-home {
        width:100%;
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.table-wrap-home {
	    width:100%;
		}}
	
/* FOR THE INTERIOR PAGES 3 COLUMN LAYOUT */

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.left-td-3col {
	    max-width:100%;
        padding:2%;
    	position: relative;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.left-td-3col {
	    max-width:100%;
        padding:2%;
    	position: relative;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.left-td-3col {
	    max-width:100%;
        padding:2%;
    	position: relative;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.left-td-3col {
	    float:left;
        width:30%;
        padding:1%;
    	position: relative;
    	/* border-left: 1px solid #0055a4; */
	    }}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.left-td-3col {
		float:left;
        width:30%;
        padding:1%;
    	position: relative;
    	/* border-left: 1px solid #0055a4; */
		}}


/* Latest News Header on Homepage */
.left-td-3col .banner {
	background-position:		top left;
	background-repeat:			repeat-x;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.left-td-3col .banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.left-td-3col .banner {
		background-image:		url('/usr/img/ag_banner_bkg757.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.left-td-3col .banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.left-td-3col .banner {
		background-image:		url('/usr/img/ag_banner_bkg218.jpg');
		width:					218px;
		height:					40px;
		margin-top:				0px;
		margin-bottom:			20px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.left-td-3col .banner {
		background-image:		url('/usr/img/ag_banner_bkg290.jpg');
		width:					290px;
		height:					54px;
		margin-top:				0px;
		margin-bottom:			20px;
		}}
 
/* Latest News Header on Homepage */
.left-td-1col .banner {
	background-position:		top left;
	background-repeat:			repeat-x;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.left-td-1col .banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.left-td-1col .banner {
		background-image:		url('/usr/img/ag_banner_bkg757.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.left-td-1col .banner {
		background-image:		url('/usr/img/ag_banner_bkg618.jpg');
		max-width:				100%;
		height:					54px;
		margin-top:				0px;
		/* display:             none; */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.left-td-1col .banner {
		background-image:		url('/usr/img/ag_banner_bkg218.jpg');
		width:					684px;
		height:					40px;
		margin-top:				0px;
		margin-bottom:			20px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.left-td-1col .banner {
		background-image:		url('/usr/img/ag_banner_bkg290.jpg');
		width:					913px;
		height:					54px;
		margin-top:				0px;
		margin-bottom:			20px;
		}}

		
#CLF_ON section .heading1 {
    color:				#222222;
    margin-top:         0.5em;
    margin-bottom:      0.5em;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON section .heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON section .heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON section .heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON section .heading1 {
		*font-weight:		bold;
		font-size:      	0.8em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		11px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON section .heading1 {
		*font-weight:		bold;
		font-size:      	1.2em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		12px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}


.heading1 {
    color:				#222222;
    margin-bottom:      0.5em;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
		.heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
		.heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.heading1 {
		*font-weight:		bold;
		font-size:      	1.0em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		15px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.heading1 {
		*font-weight:		bold;
		font-size:      	0.8em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		11px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.heading1 {
		*font-weight:		bold;
		font-size:      	1.2em;
		line-height:    	1.6em;
		margin-bottom:      0.2em;
		padding-top:		12px;
		*padding-top:		8px;
		padding-left:		25px;
		padding-right:		0px;
		}}


#connect .icon_facebook {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_facebook {
		background:				url('/private/CLF30/img/CLF_sm_facebook_U12.png');
		width:					24px;
		height:					24px;				
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_facebook {
		background:				url('/private/CLF30/img/CLF_sm_facebook_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_facebook {
		background:				url('/private/CLF30/img/CLF_sm_facebook_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_facebook {
		background:				url('/private/CLF30/img/CLF_sm_facebook_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_facebook {
		background:			url('/private/CLF30/img/CLF_sm_facebook_U12.png');
		width:					24px;
		height:					24px;	
		}}
		

#connect .icon_twitter {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_twitter {
		background:				url('/private/CLF30/img/CLF_sm_twitter_U12.png');
		width:					24px;
		height:					24px;				
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_twitter {
		background:				url('/private/CLF30/img/CLF_sm_twitter_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_twitter {
		background:				url('/private/CLF30/img/CLF_sm_twitter_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_twitter {
		background:				url('/private/CLF30/img/CLF_sm_twitter_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_twitter {
		background:				url('/private/CLF30/img/CLF_sm_twitter_U12.png');
		width:					24px;
		height:					24px;	
		}}


#connect .icon_youtube {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_youtube {
		background:				url('/private/CLF30/img/CLF_sm_youtube_U12.png');
		width:					24px;
		height:					24px;			
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_youtube {
		background:				url('/private/CLF30/img/CLF_sm_youtube_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_youtube {
		background:				url('/private/CLF30/img/CLF_sm_youtube_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_youtube {
		background:				url('/private/CLF30/img/CLF_sm_youtube_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_youtube {
		background:				url('/private/CLF30/img/CLF_sm_youtube_U12.png');
		width:					24px;
		height:					24px;	
		}}



#connect .icon_flickr {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_flickr {
		background:				url('/private/CLF30/img/CLF_sm_flickr_U12.png');
		width:					24px;
		height:					24px;				
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_flickr {
		background:				url('/private/CLF30/img/CLF_sm_flickr_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_flickr {
		background:				url('/private/CLF30/img/CLF_sm_flickr_U12.png');
		width:					24px;
		height:					24px;	
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_flickr {
		background:				url('/private/CLF30/img/CLF_sm_flickr_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_flickr {
		background:				url('/private/CLF30/img/CLF_sm_flickr_U12.png');
		width:					24px;
		height:					24px;	
		}}


#connect .icon_instagram {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_instagram {
		background-image:		url('/private/CLF30/img/CLF_sm_instagram_U12.png');
		width:					24px;
		height:					24px;		
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_instagram {
		background-image:		url('/private/CLF30/img/CLF_sm_instagram_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_instagram {
		background-image:		url('/private/CLF30/img/CLF_sm_instagram_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_instagram {
		background-image:		url('/private/CLF30/img/CLF_sm_instagram_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_instagram {
		background-image:		url('/private/CLF30/img/CLF_sm_instagram_U12.png');
		width:					24px;
		height:					24px;	
		}}



#connect .icon_vimeo {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_vimeo {
		background-image:		url('/private/CLF30/img/CLF_sm_vimeo_U12.png');
		width:					24px;
		height:					24px;		
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_vimeo {
		background-image:		url('/private/CLF30/img/CLF_sm_vimeo_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_vimeo {
		background-image:		url('/private/CLF30/img/CLF_sm_vimeo_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_vimeo {
		background-image:		url('/private/CLF30/img/CLF_sm_vimeo_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_vimeo {
		background-image:		url('/private/CLF30/img/CLF_sm_vimeo_U12.png');
		width:					24px;
		height:					24px;	
		}}



#connect .icon_soundcloud {
	background-size:	100% 100%;
	background-repeat:	no-repeat;
	border:				0px;
	float:				left;
	margin-right:		8px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#connect .icon_soundcloud {
		background-image:		url('/private/CLF30/img/CLF_sm_soundcloud_U12.png');
		width:					24px;
		height:					24px;		
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#connect .icon_soundcloud {
		background-image:		url('/private/CLF30/img/CLF_sm_soundcloud_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#connect .icon_soundcloud {
		background-image:		url('/private/CLF30/img/CLF_sm_soundcloud_U12.png');
		width:					24px;
		height:					24px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#connect .icon_soundcloud {
		background-image:		url('/private/CLF30/img/CLF_sm_soundcloud_U9.png');
		width:					18px;
		height:					18px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#connect .icon_soundcloud {
		background-image:		url('/private/CLF30/img/CLF_sm_soundcloud_U12.png');
		width:					24px;
		height:					24px;	
		}}

/* VIDEO CONTAINER FOR YOUTUBE, VIMEO, ETC. (ADDED BY MATT C.) */

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.weekly-message {
		position: relative;
   	 	padding-bottom: 56.25%;
   		padding-top: 30px; height: 0; overflow: hidden;
   }}

	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.weekly-message {
		position: relative;
   	 	padding-bottom: 56.25%;
   		padding-top: 30px; height: 0; overflow: hidden;
   }}

	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.weekly-message {
		position: relative;
   	 	padding-bottom: 56.25%;
   		padding-top: 30px; height: 0; overflow: hidden;
   }}

	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.weekly-message {
    	top: 0;
    	left: 0;
    	float: left;
    	margin-right: 10px;
	    }}

	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.weekly-message {
    top: 0;
    left: 0;
    float: left;
    margin-right: 10px;
	}}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.weekly-message iframe,
	.weekly-message object,
	.weekly-message embed {
	    position:absolute;
    	top: 0;
   		left: 0;
    	max-width: 100%;
    	max-height: 100%;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.weekly-message iframe,
	.weekly-message object,
	.weekly-message embed {
	    position:absolute;
    	top: 0;
   		left: 0;
    	max-width: 100%;
    	max-height: 100%;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.weekly-message iframe,
	.weekly-message object,
	.weekly-message embed {
    	position:absolute;
    	top: 0;
   		left: 0;
    	max-width: 100%;
    	max-height: 100%;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.weekly-message iframe,
	.weekly-message object,
	.weekly-message embed {
    	top: 0;
    	left: 0;
    	width: 350px;
    	height: 197px;
	    }}

	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.weekly-message iframe,
	.weekly-message object,
	.weekly-message embed {
    top: 0;
    left: 0;
    width: 500px;
    height: 281px;
	}}


/* LOCATIONS PAGES CONTAINER FOR GOOGLE MAP AND QR-CODE (ADDED BY MATT C.) */

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.map-on {
	    display:none;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.map-on {
	    display:none;
	    }}


	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.map-off {
    	display:none;
	    }}
	    
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.map-off {
    	display:none;
	    }}

	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.map-off {
    	display:none;
	}}



/* All Header Images on Interior Pages */
#banner {
	background-position:		top left;
	background-repeat:			repeat-x;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#banner {
		background-image:		url('/usr/img/h1_interior_header618.png');
		max-width:				100%;
		height:					98px;
		margin-top:				-15px;
		/* display:             none; */
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#banner {
		background-image:		url('/usr/img/h1_interior_header757.png');
		max-width:				100%;
		height:					120px;
		margin-top:				-15px;
		/* display:             none; */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#banner {
		background-image:		url('/usr/img/h1_interior_header618.png');
		width:					618px;
		height:					98px;
		margin-top:				-15px;
		/* display:             none; */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#banner {
		background-image:		url('/usr/img/h1_interior_header567.png');
		width:					567px;
		height:					90px;
		margin-top:				-15px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#banner {
		background-image:		url('/usr/img/h1_interior_header757.png');
		width:					757px;
		height:					120px;
		margin-top:				-20px;
		}}


/* H1 Text and Color Style */
#banner H1 { color:				#FFFFFF; }

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#banner H1 {
		color:				#FFFFFF;
		font-size:      	1.2em;
		line-height:    	1.0em;
		margin-bottom:      0.2em;
		padding-left:		6.0em;
		padding-top:		2.0em;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#banner H1 {
		color:				#FFFFFF;
		font-size:      	1.2em;
		line-height:    	1.0em;
		margin-bottom:      0.2em;
		padding-left:		7.0em;
		padding-top:		2.5em;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#banner H1 {
		color:				#FFFFFF;
		font-size:      	1.2em;
		line-height:    	1.0em;
		margin-bottom:      0.2em;
		padding-left:		6.0em;
		padding-top:		2.0em;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#banner H1 {
		color:				#FFFFFF;
		font-size:      	1.1em;
		line-height:    	1.0em;
		margin-bottom:      0.2em;
		padding-left:		6.0em;
		padding-top:		2.0em;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#banner H1 {
		color:				#FFFFFF;
		font-size:      	1.5em;
		line-height:    	1.0em;
		margin-bottom:      0.2em;
		padding-left:		6.0em;
		padding-top:		2.0em;
		}}


.connect_indent {
	padding-left: 25px;
	padding-top: 10px;
}

.p_indent {
	padding-left: 25px;
}
	

/* Main Content Area Link Styles */
#CLF_ON section a, #CLF_ON section a:link, #CLF_ON section a:active, #CLF_ON section a:visited {
	text-decoration:	underline;
	color:				#0055a4;
	}

#CLF_ON section a:hover {
    text-decoration:    none;
    color:				#91292a;
	
    }


/* Div Style for Related Information (Small Size Text) */
.realted {
    color:          	#222222;
    margin-top:         0em;
    margin-bottom:      0.5em;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.related {
		font-size:      	0.8em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.related {
		font-size:      	0.8em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.related {
		font-size:      	0.8em;
		line-height:    	1.5em;
		margin-bottom:      0.9em;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.related {
		font-size:      	0.8em;
		line-height:    	1.6em;
		margin-bottom:      0.9em;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.related {
		font-size:      	0.8em;
		line-height:    	1.6em;
		margin-bottom:      1.0em;
		}}

	.related p {text-align:center;}


/* Local Footer: Agency BKG Style */
#ftra1 {
	background-image:			url('/usr/img/CLF_menu_bkg_ag.jpg');
	background-position:		top left;
	background-repeat:			repeat-x;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#ftra1 {
		padding-top:			0.8em;
		padding-bottom:			1.0em;
		padding-left:			11px;
		padding-right:			9px;
		font-size:				0.7em;			
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#ftra1 {
		padding-top:			0.8em;
		padding-bottom:			1.0em;
		padding-left:			11px;
		padding-right:			11px;
		font-size:				0.8em;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#ftra1 {
		padding-top:			0.8em;
		padding-bottom:			0.0em;
		padding-left:			8px;
		padding-right:			11px;
		font-size:				0.8em;

		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#ftra1 {
		padding-top:			0.6em;
		padding-bottom:			0.6em;
		padding-left:			3px;
		padding-right:			9px;
		font-size:				0.8em;
			
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#ftra1 {
		padding-top:			0.8em;
		padding-bottom:			0.8em;
		padding-left:			12px;
		padding-right:			12px;
		font-size:				0.9em;
		line-height:			1.5em;
		
		}}
	

#ftra2 {}
#ftra3 {}
#ftra4 {}





/* User Image Calls */

/* For each image, you will need the master class call and all eight responsive media queries. Copy, paste, and customize them, as needed. */

/* For each image, replace "myImageClassName" with the class name you have selected for that image. */

/* For each image, replace "myImageName" with the name of the file. (And, of course, make sure you have your custom image saved in the /usr/img/ directory.) */

/* For each image, replace the width and height of 0px with your image's width and height. */

/* Alternate: List your the image's NAME for each responsive condition. Do not specify an width/height. (Delete both width and height tags in each code section.) Then, use a pre-built imageShape class. See the zsample_imageElements file for more information about how to handle sample images. Point being, what is shown below is an example of how to a) list the image name and b) specify the image width/height. You may not need to do it this way--there is a library of common image size/placement classes to support you. */

/* In your code, ensure you include the 1px image call, alt tag, title tag, and class name. See the CLF_zsample_imageElements.shtml file in the samples folder for examples. */

/* If your image should NOT display on mobile, for EACH of the three touch44/11 conditions, comment out the background, width, and height attributes. Then uncomment the "display: none" attribute. */



/* Main Title Image Styles for SOS Homepage */

.title_logo {
	background-repeat:	no-repeat;
	border:				0px;
}


.main_title {
	background-repeat:	no-repeat;
	position:			relative;
	border:				0px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.main_title {
		display:none;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.main_title {
		display:none;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.main_title {
		display:none;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.main_title {
		max-width:				729px;
		height:					75px;
		margin-top:				-9px; 
		*margin-top:			-9px;
		position:				absolute;
		z-index:				10000;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.main_title {
		max-width:				972px;
		height:					100px;
		margin-top:				-12px;
		*margin-top:			-12px;
		position:				absolute;
		z-index:				10000;
		}}
		
		
.main_title2 {
	background-repeat:	no-repeat;
	position:			relative;
	border:				0px;
}


	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.main_title2 {
		max-width:				100%;
		margin-bottom: 			-5px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.main_title2 {
		max-width:				100%;
		margin-bottom: 			-5px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.main_title2 {
		max-width:				100%;
		margin-bottom: 			-4px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.main_title2 {
		display:none;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.main_title2 {
		display:none;
		}}









/* Small Icons, i.e. PDF, RSS, etc. */
.icons {
	background-repeat:	no-repeat;
	float:				left;
	margin-right:		5px;
	border:				0px;
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.icons {
		width:					30px;
		height:					30px;
		/* display:             none; */
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.icons {
		width:					30px;
		height:					30px;
		/* display:             none; */
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.icons {
		width:					30px;
		height:					30px;
		/* display:             none; */
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.icons {
		width:					30px;
		height:					30px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.icons {
		width:					30px;
		height:					30px;	
		}}
		
		
		
/*  A G E N C Y    L O G O S   */

/* Logo calls. The Great Seal is the default State Agency image. Each of the images
below can be replaced with a version of the Agency logo. Sizing should remain "as is."
E.g., for the footer, logos may appear "really small." This is correct. You have 
Photoshop templates for each of these items. */


#ftr1 .logo_agency {
	background-repeat:	no-repeat;
	border:				0px solid red;
}


	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#ftr1 .logo_agency {
		background:				url('/usr/img/CLF_ftr_logo_ag_small.png');
		max-width:				34px;
		height:					34px;
		margin-left:			-7px;
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#ftr1 .logo_agency {
		background:				url('/usr/img/CLF_ftr_logo_ag_small.png');
		max-width:				34px;
		height:					34px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#ftr1 .logo_agency {
		background:				url('/usr/img/CLF_ftr_logo_ag_small.png');
		max-width:				34px;
		height:					34px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#ftr1 .logo_agency {
		background:				url('/usr/img/CLF_ftr_logo_ag_small.png');
		max-width:				34px;
		height:					34px;	
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#ftr1 .logo_agency {
		background:				url('/usr/img/CLF_ftr_logo_ag_large.png');
		max-width:				42px;
		height:					42px;	
		}}







/* ELASTISLIDE STYLES */

.elastislide-list {
	list-style-type: none;
	display: none;
}

.no-js .elastislide-list {
	display: block;
}

.elastislide-carousel ul li {
	min-width: 20px; /* minimum width of the image (min width + border) */
}

.elastislide-wrapper {
	position: relative;
	background-color: #fff;
	margin: 0 auto;
	min-height: 60px;
	box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
}

.elastislide-wrapper.elastislide-loading {
	background-image: url('/usr/img/loading.gif');
	background-repeat: no-repeat;
	background-position: center center;
}

.elastislide-horizontal {
	padding: 10px 40px;
}

.elastislide-vertical {
	padding: 40px 10px;
}

.elastislide-carousel {
	overflow: hidden;
	position: relative;
	margin-top:140px;
}




	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.elastislide-carousel {
		overflow: hidden;
		position: relative;
		margin-top:0px;
	}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.elastislide-carousel {
		overflow: hidden;
		position: relative;
		margin-top:0px;
	}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.elastislide-carousel {
		overflow: hidden;
		position: relative;
		margin-top:0px;
	}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.elastislide-carousel {
		overflow: hidden;
		position: relative;
		margin-top:70px;
	}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.elastislide-carousel {
		overflow: hidden;
		position: relative;
		margin-top:90px;
	}}
	
	
	
	

.elastislide-carousel ul {
	position: relative;
	display: block;
	list-style-type: none;
	padding: 0;
	margin: 0;
	-webkit-backface-visibility: hidden;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
}

.elastislide-horizontal ul {
	white-space: nowrap;
}

.elastislide-carousel ul li {
	margin: 0;
	-webkit-backface-visibility: hidden;
}

.elastislide-horizontal ul li {
	height: 100%;
	display: inline-block;
	*display: inline;
	zoom: 1;
}

.elastislide-vertical ul li {
	display: block;
}

.elastislide-carousel ul li a {
	display: inline-block;
	*display: inline;
	zoom: 1;
	width: 100%;
}

.elastislide-carousel ul li a img {
	display: block;
	border: 2px solid white;
	max-width: 100%;
}

/* Navigation Arrows */

.elastislide-wrapper nav span {
	position: absolute;
	background: #0055a4 url('/usr/img/nav.png') no-repeat 4px 3px;
	width: 23px;
	height: 23px;
	border-radius: 50%;
	text-indent: -9000px;
	cursor: pointer;
	opacity: 0.8;
}

.elastislide-wrapper nav span:hover {
	opacity: 1.0
}



	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	.elastislide-horizontal nav span {
		top: 50%;
		left: 10px;
		margin-top: -11px;
	    }}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	.elastislide-horizontal nav span {
		top: 50%;
		left: 10px;
		margin-top: -11px;
	    }}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	.elastislide-horizontal nav span {
		top: 50%;
		left: 10px;
		margin-top: -11px;
	    }}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	.elastislide-horizontal nav span {
		top: 70%;
		left: 10px;
		margin-top: -11px;
	}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	.elastislide-horizontal nav span {
		top: 70%;
		left: 10px;
		margin-top: -11px;
	}}



.elastislide-vertical nav span {
	top: 10px;
	left: 50%;
	margin-left: -11px;
	background-position: -17px 5px;
}

.elastislide-horizontal nav span.elastislide-next {
	right: 10px;
	left: auto;
	background-position: 4px -17px;
}

.elastislide-vertical nav span.elastislide-next {
	bottom: 10px;
	top: auto;
	background-position: -17px -18px;
}


/*  EXTRA IMAGE SIZES AND CLASSES

	If you need to use more images or more image sizes there are some below. Just place your image in the usr/img/ file folder. Then in your HTML file change the class to the desired size, i.e. .image_small, .image_regular, etc. And rename your img tag src to whatever image name you choose.
	
	If you desire the image to not be alined with the left side of the page, simply uncomment the "float: right;" and "margin-left: 10px;" block and delete the "float:left" and margin-right:8px;" blocks.
	
	Note: Images must be cropped to the "blue - U12/7" screen size, so an image with a class of ".image_small" MUST be cropped to 100 pixels wide and 75 pixels high if it is to look acceptable.
	
	
 */		


#CLF_ON .image_small {
	display:                in-line;
	float:                  left;
	margin-right:			8px;
	border:					0px;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_small {
		width:					80px;
		height:					60px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_small {
		width:					80px;
		height:					60px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_small {
		width:					80px;
		height:					60px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_small {
		width:					80px;
		height:					60px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_small {
		width:					100px;
		height:					75px;	
		}}
	



#CLF_ON .image_regular {
	display:                in-line;
	float:                  left;
	margin-right:			8px;
	border:					0px;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_regular {
		width:					125px;
		height:					94px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_regular {
		width:					170px;
		height:					128px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_regular {
		width:					170px;
		height:					128px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_regular {
		width:					170px;
		height:					128px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_regular {
		width:					200px;
		height:					150px;	
		}}
	



#CLF_ON .image_medium {
	display:                in-line;
	float:                  left;
	margin-right:			8px;
	border:					0px;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_medium {
		width:					200px;
		height:					150px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_medium {
		width:					260px;
		height:					195px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_medium {
		width:					260px;
		height:					195px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_medium {
		width:					260px;
		height:					195px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_medium {
		width:					300px;
		height:					225px;	
		}}
	

	

#CLF_ON .image_large {
	display:                in-line;
	float:                  left;
	margin-right:			8px;
	border:					0px;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_large {
		width:					300px;
		height:					225px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_large {
		width:					300px;
		height:					225px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_large {
		width:					350px;
		height:					263px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_large {
		width:					350px;
		height:					263px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_large {
		width:					450px;
		height:					338px;	
		}}
	

		
		
#CLF_ON .image_xlarge {
	display:                in-line;
	float:                  left;
	margin-right:			8px;
	border:					0px;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_xlarge {
		max-width:				100%;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_xlarge {
		max-width:				100%;

		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_xlarge {
		width:					450px;
		height:					338px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_xlarge {
		width:					410px;
		height:					308px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_xlarge {
		width:					600px;
		height:					450px;
		}}
		
/* added tobacco for testing the table on the tobacco pages - Jeff Reed */		
#tobacco
{
width:100%;
border-collapse:collapse;
}
#tobacco td, #tobacco th 
{
font-size:1em;
border:1px solid #CCCCCC;
padding:3px 7px 2px 7px;
}
#tobacco th 
{
font-size:1.1em;
text-align:left;
padding-top:5px;
padding-bottom:4px;
background-color:#A7C942;
color:#ffffff;
}
#tobacco tr.alt td 
{
color:#000000;
background-color:#EAF2D3;
}
/* end of tobacco - Jeff Reed */		

/* added shadow box for investor protection page - Jeff Reed */	
#shadbox {
	border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	width: 310px;
	/* height: 180px; */
	border-radius: 20px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
	float: left;
}
#shadbox a.special, #shadbox a.special:link, #shadbox a.special:active, #shadbox a.special:visited {
	text-decoration: none;
}

#shadboxfull {
	border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	width: 666px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
}
#shadboxfull a.special, #shadbox a.special:link, #shadbox a.special:active, #shadbox a.special:visited {
	text-decoration: none;
}

/* end of shadow box - Jeff Reed */	

/* added linksbox to float links to the right of the page - Jeff Reed */	
#linksbox {
	border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	width: 150px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
	float: right;
}
/* end of linksbox - Jeff Reed */	

/* added linksboxleft to float links to the left of the page - Jeff Reed */	
#linksboxleft {
	border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	width: 150px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
	float: left;
}
/* end of linksboxleft - Jeff Reed */	

/* added linksboxcenter to float links to the center of the page - Jeff Reed */	
#linksboxcenter {
	border: 1px solid #999;
	padding: 10px;
	width: 150px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
	float: center;
	display: block;
    margin-left: auto;
    margin-right: auto;
}
/* end of linksboxcenter - Jeff Reed */	

/* added news100pct - Jeff Reed */	
#news100pct {
	border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	margin-left: 35px;
    margin-right: 25px;
	width: auto;
	float: center;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
	text-decoration:	none;
}
	
#news100pct a, #news100pct a:link, #news100pct a:active, #news100pct a:visited {
	text-decoration:	none;
	color:				#0055a4;
	}

#news100pct a:hover {
    text-decoration:    none;
    color:				#91292a;
    }
/* end of news100pct - Jeff Reed */	

#newsfull {
    border: 1px solid #999;
	padding: 10px;
	margin: 10px;
	width: 666px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	background-color: #e4eeff;
	box-shadow: 0px 0 10px #666;
}
	
#newsfull a, #newsfull a:link, #newsfull a:active, #newsfull a:visited {
	text-decoration:	none;
	color:				#0055a4;
	}

#newsfull a:hover {
    text-decoration:    none;
    color:				#91292a;
    }
	
#CLF_ON .image_slim {
	display:                in-line;
	float:                  right;
	margin-right:			8px;
	border:					2px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	box-shadow: 0px 0 15px #666;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_slim {
		width:					88px;
		height:					132px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_slim {
		width:					131x;
		height:					197px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_slim {
		width:					131x;
		height:					197px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_slim {
		width:					131x;
		height:					197px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_slim {
		width:					175px;
		height:					263px;	
		}}

#CLF_ON .thumbs  {
		width:					120px;
		height:					80px;	
		}		

#CLF_ON .image_slim1 {
	display:                in-line;
	float:                  right;
	margin-right:			8px;
	border:					2px;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	box-shadow: 0px 0 15px #666;
	/* 
	float:					right;
	margin-left:			10px;
 	*/
}

	/* orange - touch44/11 -serves 320x480 portrait */
	@media screen and (min-width:320px) and (max-width:479px) {
	#CLF_ON .image_slim1 {
		width:					100px;
		height:					57px;	
		}}
	
	/* brown - touch44/11 -serves 320x480 landscape and 480x800 portrait */
	@media screen and (min-width:480px) and (max-width:639px) {
	#CLF_ON .image_slim1 {
		width:					200x;
		height:					114px;
		}}
	
	/* yellow - touch44/11 -serves ??? screens */
	@media screen and (min-width:640px) and (max-width:799px) {
	#CLF_ON .image_slim1 {
		width:					200x;
		height:					114px;
		}}
	
	/* green - U9/5 - serves 800x600 screens */
	@media screen and (min-width:800px) and (max-width:995px) {
	#CLF_ON .image_slim1 {
		width:					200x;
		height:					114px;
		}}
	
	/* blue - U12/7 - serves 1024x768 screens */
	@media screen and (min-width:996px) {
	#CLF_ON .image_slim1 {
		width:					289px;
		height:					165px;	
		}}
		
.tab20 { margin-left: 19px; }	
.noshow { display:none; }	
showdiv {display:show;}	