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


THIS CSS SHEET
-General tags (body,html,H's,a's, etc.)
-General DIVS and styles applied by section beginning at top of site page
	examples: wrappers,containers, header, main nav, content,indiv cols,footer,etc.
-Specific classes based on function and rarity of occurance or specificity
	examples: forms, front landing page, miscellanous classes and DIVS
-Misc styles, Turn offs and storage

Code comments below explain different CSS functions throughout this document. Please read carefully.


*/

/* general changes to background color, font-type and size and overall links */

/* TAGS */

body {
	/* change font family */
	font-family: Arial, Helvetica, sans-serif;
	
	/* overall background color - won't show up if you're using an image - may not work depending on the design */
	/* customize_body */ background-color:#FFF; /* customize_body */
	
	/* overall font color */
	/* customize_body */ color:#333; /* customize_body */
	
	/*overall background image */

}

@font-face {
	font-family: 'CirculaThinBold';
	src: url(http://verticalstreaming.com/themes/general_layout/circula-medium-webfont.eot);
	src: local('☺'), url(http://verticalstreaming.com/themes/general_layout/circula-medium-webfont.woff) format('woff'), url(http://verticalstreaming.com/themes/general_layout/circula-medium-webfont.ttf) format('truetype'), url(http://verticalstreaming.com/themes/general_layout/circula-medium-webfont.svg#webfont) format('svg');
	font-weight: normal;
	font-style: normal;
}

#containerWrap a:link, #containerWrap a:visited {
	/* customize_link */ color: #F60; /* customize_link */
	text-decoration:none;
}

#containerWrap a:hover, #containerWrap a:active, #containerWrap a:focus {
	/* customize_link_hover */ color: #F90; /* customize_link_hover */
	text-decoration:underline;
}

#containerWrap h1, #containerWrap h2, #containerWrap h3, #containerWrap h4, #containerWrap h5{
	margin:0;
        font-weight:700;
	/* customize_misc */ color: #666; /* customize_misc */
	/* customize_misc */ /* customize_misc */
	font-family: 'CirculaThinBold',Arial,sans-serif;
}

#containerWrap h1, #containerWrap h2, #containerWrap h3 {

}


#containerWrap p{ 
	font-size:1em; /* used in conjuction with body size in main.css - best overall fix for most browsers. please stick with em's instead of pixels since it's more accessible*/
}


#containerWrap em {
    font-style: italic;
}

#containerWrap strong {
	font-weight:700; /* equivalent to bold, but better */
}

#containerWrap #primaryContent li {
	list-style-position: outside;
	list-style-image: url(http://verticalstreaming.com/themes/general_layout/images/arrowRightBG.jpg);	
}

#containerWrap #primaryContent ul {
	margin-left:20px;	
}

#containerWrap h1 {
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/sectionTitleBgv3.jpg);
	background-position:left 0px;
	background-repeat:repeat-x;		
	font-size:1.75em; /* experiment and see what works best */
	padding:10px 0px 6px 30px; /* adds a bit of space and can also give some breathing room for background images */
	margin:10px 0px;
	color:#FFF;
}

#containerWrap h2 {  
	font-size:1.5em; 
	padding:8px 0px 5px 25px;
	margin:10px 0px;
	position:relative;
	left:0px;
	color:#FFF;
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/calloutTitleBGv3.jpg);
	background-position:left -5px;
	background-repeat:repeat-x;	
}


#containerWrap h3 {  
	font-size:1.3em; 
	padding:3px 0px 0px 0px;
    
}

#secondaryContent1 h3, #secondaryContent2 h3 {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #F90;   	
}

#secondaryContent1 h2, #secondaryContent2 h2 {
	font-size:1.25em; 	
}

#containerWrap h4 {  
	font-size:1.2em; 
	padding:5px 0px 5px 0px;
}

#container ul.nav li {
	/* this can be removed if you don't want separators between nav list elements */
	border-bottom-width: 1px;
	border-bottom-style: none;
	border-bottom-color: #630;
}

#container input, #container select, #container textarea {
	background-color:#FFF !important; /* overrides google toolbar's auto background coloring of common form elements - change to a custom color*/
	font-family: Arial, Helvetica, sans-serif;
	 border: 1px solid #8CC63F;
}

#container textarea {
    width:350px !important;	
}

#containerWrap .radioPair {
   padding:5px 0px;
}

#containerWrap .radioPair input {
   border-style:none;	
}

#containerWrap form .question {
	vertical-align:top;
	color:#666;
	font-weight:100;
}

#container input.formBlockSubmitButton {
  color:#F15A24;
  cursor:pointer;
}

#primaryContent td {
	font-weight:100;	
}

#containerWrap img {
	border: 0px; /* IE fix - since it sometimes draws border around linked images where you don't want them */
}

#containerWrap {
	background-color:#FFF;
	color:#666;
	text-align:left;

	
}

#container {

}

/* Header Elements */

#headerLogo {
	position:relative;
	top:-15px;
}

#headerNavWrap {
	width:100%;
	position:relative;
	top:0px; /* change this to change the nav position */
	left:0px;
}

#headerNav { /* if you want to change the height remember to scale the background image or turn the image off and just color the background*/
	background-color:#2AABE4;
	font-weight:700;

}

#headerNav ul {
	position:relative;
    left:20px;
	top:-10px;
	width:975px;
	overflow:hidden;
}

#headerNav ul li {
	padding: 8px 20px 8px 20px;
}


#headerNav ul li.first {
	border-left-style: none;
}

#headerNav a {
	text-decoration:none;
	background-position: left top;
	font-size:1.1em;
	font-family: 'CirculaThinBold',Arial,sans-serif;

}

#headerNav a:link, #headerNav a:visited {
    color:#FFF;
	text-decoration:none;
}

#headerNav a:hover, #headerNav a:active, #headerNav a:focus {
	color:#F90;
	text-decoration:none;
}


/* footer */
#footer a:link, #footer a:visited {
	text-decoration:underline;
}

#footer a:hover, #footer a:active {
	text-decoration:none;
}


#footerNav ul li {
	border-left-width: 1px;
	border-left-style: solid;
	border-left-color: #999;
}


/* DIV Background Changes and Hooks */

#headerWrap {
/* change this to change the headerWrap height - make sure to do the math on all elements heights inside or you might have a conflict*/
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/headerBGv3-09.jpg);
	background-position:left -36px;
	background-repeat:repeat-x;
	background-color:#2AABE4;
	border-bottom:1px dotted #FFF;

}

#header {
	height: 165px; /* change this to change the header height */
	background-color:#FFF;
	/* to align the site to the left send this elment to the left - float:left */
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/headerBGv3.jpg);
	background-position:left -18px;
	background-repeat:no-repeat;
}

#callUs {
   float:right;
   position:relative;
   top:-40px;
   right:40px;
}

#headerItems form {
	float:right;
	position:relative;
	top:-40px;
	right:20px;
}

#headerItems form h3 {
	color:#F90;
    padding-bottom:5px;	
}

#contentWrap {

}

#myContent {
	clear:both;
/* to align the site to the left send this elment to the left - float:left */
	min-height:700px;
	height:auto !important; /* hack for IE */
	padding-bottom:40px;
	margin-top:15px;

}

#primaryContentWrap {
	
}

#primaryContent {
	background-color:#FFF;
	min-height:600px;
	height:auto !important; /* hack for IE */
	padding-bottom:50px;
	padding-top:0px;
}

#secondaryContent1Wrap {
	background-color:#FFF;
}

#secondaryContent1 h3, #secondaryContent2 h3 {
	font-size:1em;
    padding:5px 0px 5px 5px;
	border-bottom-color:#663300;
	color:#FFF;

}

#secondaryContent1 h2, #secondaryContent2 h2 {
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/sideTitleBGv3.jpg);
	background-position:-6px -7px;
	background-repeat:repeat-x;	
}


#secondaryContent1 {

}

#secondaryContent1, #secondaryContent2 {

}

		/* for styling descending tree of sidebar auto-nav nav */

#secondaryContent1 ul.nav li {
	border-bottom-style: solid;
}

#secondaryContent1 ul.nav {
	font-family: 'CirculaThinBold',Arial,sans-serif;
	font-size:1.25em;
}

#secondaryContent1 ul.nav li a:link, #secondaryContent1 ul.nav li a:visited  {
	 color:#2AABE4;
}

#secondaryContent1 ul.nav li a:hover, #secondaryContent1 ul.nav li a:focus, #secondaryContent1 ul.nav li a:active {
     color:#F60;
}



#secondaryContent1 ul.nav li ul li {
}


#secondaryContent1Wrap {
}
#secondaryContent2Wrap {
	
}

#secondaryContent2 {

}

#footerWrap {
	background-color:#93CA4B;
	
}

#footer {
	/* to align the site to the left send this elment to the left - float:left */
	padding:20px 0px 10px 0px;
	color:#666;
	background-image:url(http://verticalstreaming.com/themes/general_layout/images/footerBGv3b.jpg);
	background-position:left top;
	background-repeat:no-repeat;
	background-color:#93CA4B;
}


#footerNav a:link, #footerNav a:visited {
    color:#666;
	text-decoration:none;
}


#footerNav a:hover, #footerNav a:focus, #footerNav a:active {
    color:#F90;
}

#footerNav {
  width:600px;
  position:relative;
  left:220px;
}

#footerNav p {
   padding:5px 0px;
}

#footerNav ul li.first {
	/* border-left-style: none;	*/
}

#footerNav ul li {
	font-size: 1.2em;
	padding-top: 8px;
	padding-right: 0px;
	padding-bottom: 8px;
	padding-left: 5px;
	list-style-type: none;
	list-style-image: none;
	list-style-position: outside;
	text-decoration:none;
	font-weight:700;
}


/* home page - most of these are modified throught the actual home.css */

#welcomeArea, #newsArea, #adArea {
	
}

#choiceOne, #choiceTwo, #choiceThree {
   
}

#mediaOne, #mediaTwo {
	
}


/* expandable block */

#container .expandableTitle {
      font-size:1.2em;
      font-weight:100;
      padding:5px 0px 5px 25px;
      margin-bottom:10px;
	  background-image:url(http://verticalstreaming.com/themes/general_layout/images/plusExpander.gif);
	  background-position:3px -2px;
	  background-repeat:no-repeat;
	  border: 1px solid #CCC;
}

#container .expandableTitle a:link,#container .expandableTitle a:visited  {
	color:#666;
        text-decoration:none;
}

#container .expandableTitle a:hover, #container .expandableTitle a:active, #container .expandableTitle a:focus {
	color:#F90;
        text-decoration:none;
}

/* handy styles for Tiny MCE content editor */

#container .padImageLeft {
	/* gives a image some breathing room - doesn't actually show up in the text editor however but it does in the Concrete5 editor */
	padding:0px 0px 0px 10px;
}

#container .padImageRight {
	/* gives a image some breathing room - doesn't actually show up in the text editor however but it does in the Concrete5 editor */
	padding:0px 10px 0px 0px;
}

#container .brclear {
	/* helps resolve floated element conflicts */
	clear:both;
	height:0;
	font-size:1px;
	line-height:0;
	margin:0;
}



/* Blog add on overrides and styling */

#myContent ul.ccm-blog-archive-list li {
	margin-top:15px;
}

#myContent ul.ccm-blog-archive-list ul {
	margin-bottom:15px;
}

#myContent .guestBook-formBlock label {
        padding:10px 0px;
}

#myContent .ccm-blog-post-suffix {
        padding:20px 0px;
}

#myContent .ccm-blog-archive-rss {
		padding:10px 0px;	
}

/* #myContent .ccm-blog-list-content h1 {
          display:none;
          visibility:hidden;
} */

#myContent h2 a:link, #myContent h2 a:visited, #myContent h2 a:focus, #myContent h2 a:hover, #myContent h2 a:hover {
 color:#FFF;
 text-decoration:none;
}

/* vs player overrides */

#player_container {
        height:300px;
}

/* testimonials styling */

#container .testimonial {
   border: 1px dotted #666;
   padding:10px;
  font-size:1.2em;
}

#container .testimonial p {
  font-weight:100;

}

#container .testimonial strong {
  font-size:.8em;
}
/* turn offs */

/*use these to "turn off/hide" via css different website elements that you don't want displayed, like perhaps the logo or logo text. 
  it doesn't actually get rid of them (you'd have to go into the actual php to do so) but it does hide them from view in almost all browsers.
*/


#someID, #logoText /* #headerLogo, #headerLogo img */{
   display:none;
   visibility:hidden;
}