/* ctug.ca main.css */

/* reset defaults */
*{
	outline: none;
}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
} 
table { 
	border-collapse:collapse; 
	border-spacing:0; 
} 
fieldset,img {  
	border:0; 
} 
address,caption,cite,code,dfn,em,strong,th,var { 
	font-style:normal; 
	font-weight:normal; 
} 
ol,ul { 
	list-style:none; 
} 
caption,th { 
	text-align:left; 
} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:before,q:after { 
	content:''; 
} 
abbr,acronym {
	border:0; 
}

/* main layout */
html{
	font-size:100%;
    overflow-y: scroll;
    }
body{
	font-size:63%;
	font-family: Arial, Helvetica, Sans-Serif;
	color:#555;
	padding:0 1em;
	background:#fff url('../images/bg.gif') repeat-x;
	}
#wrapper{
	width:94em;
	margin:0 auto;
}

.contentArea { min-height:340px; margin-bottom: 20px; margin-top: 10px; }

/* main top navigation */

#navTop {
	margin-bottom: 2em;
	width:94em;
	height:24px;
	text-align:center;
	background-color:Transparent;
}
#navTop ul{
	margin-top:12px;
}
#navTop li{
	display: inline;
	list-style-type: none;
	padding: 0 0 0 0.5em;
}

#navTop li a{
	color: #fff;
	font-size: 1.25em;
	padding: 0.5em;
	text-decoration: none;
}

#navTop li a:hover{
	color: #c78087;
	text-decoration: none;
}

/* right column navigation */
#navRight li{
	background: url("../images/arrow_right.png") no-repeat left center;
	list-style: none;
	list-style-position:inside;
	margin: 5px 0;
}

#navRight li a{
	padding-left: 1em;
}

*+html #navRight li a{
	padding-left: 1em;
}

* html #navRight li a{
	padding-left: 0.5em;
}

/* =footer */
#footer {
    background: #fff url('../images/bgFooter.gif') repeat-x;
	width:100%;
    clear:both;
    min-height: 20px;
}

#footer-inner{
	width:94em;
	display: block;
	margin-left: auto;
	margin-right: auto;
	padding: 3px 0 10px 0;
}

#footer p {	color: #0f1816; font-size: 1.1em; margin: 0 0 1.5em .5em; }

#navfooter { }

#navfooter a { border: 0; font-weight: normal; text-decoration:none; }
#navfooter a:link,
#navfooter a:visited { color: #6d8782; }
#navfooter a:hover { color: #444; }

#navfooter li {
	color: #888;
	display: block;
	float: left;
	font-size: 1.2em;
	margin: 0;
	padding: 5px;
}

.navfooterShare
{
	color: #6d8782;
	font-size: 1.2em;
	margin: 0;
	padding: 5px;
	font-weight:normal;
	float:left;
}

.navfooterShare a 
{ 
	float: right;
	padding: 0 5px 0 0;
}



#footer .divider {
	
	font-size: 1.2em;
	color: #888;
	padding: 0 4px;
	font-weight:normal;
}

/*GRIDS */
/* Set styles common among all grids - all grid divs must be assigned this class */
.generic{
	float:left;
	padding-top:1em;
	margin-bottom:2em;

}
/* Sets styles for any 'start' grids - this class MUST be given to a grid that is the first in a horizontal series */
.clear:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clear {
	display: inline-block;
	clear:both;
}

* html .clear {
height: 1%;
}
/* Sets styles for any 'end' grids - this class MUST be given to a grid that is the last in a horizontal series */
.end{
	margin-left:0 !important;
	margin-right:0 !important;
}
/* 220px */
.twotwenty{
	width:22em;
	margin-right:2em;
}
/* 280px */
.twoeighty{
	width:28em;
	margin-right:2em;
}
/* 340px */
.threeforty{
	width:34em;
	margin-right:2em;
}
/* 400px */
.fourhun{
	width:40em;
	margin-right:2em;
}
/* 460px */
.foursixty{
	width:46em;
	margin-right:2em;
}
/* 520px */
.fivetwenty{
	width:52em;
	margin-right:2em;
}
/* 580px */
.fiveeighty{
	width:58em;
	margin-right:2em;
}
/* 640px */
.sixforty{
	width:64em;
	margin-right:2em;
}
/* 700px */
.sevenhun{
	width:70em;
	margin-right:2em;
}
/* 760px */
.sevensixty{
	width:76em;
	margin-right:2em;
}
/* 820px */
.eighttwenty{
	width:82em;
	margin-right:2em;
}
/* 880px */
.eighteighty{
	width:88em;
	margin-right:2em;
}
/* 940px */
.nineforty{
	width:94em;
}

/* =headings */
h1{
	color:#0f1816;
	font-size:3em;
	margin:0.6em;
	font-style:italic;
	line-height:1.2em;
}
h2{
	color:#2d4742;
	text-align:left;
	font-size:2em;
	margin-bottom:1em;
	line-height:0.9em;
}

h2.sub {
	color: #6d8782;
	margin-bottom:1.5em;
}

h3{
	text-align:left;
	color: #6d8782;
	font-size:1.6em;
	margin-bottom:1.2em;
	line-height:1.2em;
	font-variant:normal;
}

h4{
	color:#0f1816;
	font-size:1.4em;
	margin-top:.8em;
	margin-bottom:.8em;		/*1.5em;*/
	line-height:1.1em;
	font-variant:small-caps;
}
h4.rssText { padding-top:25px;}
h5{
	color:#6d8782;
	font-size:1.3em;
	margin-bottom:1.5em;
	line-height:1.5em;
	font-variant:small-caps;
}
h6{
	color:#0f1816;
	font-size:1.2em;
	margin-bottom:1em;
	line-height:1.2em;
}

/* =a */
a { border: 0; font-weight: normal; text-decoration:none;	color:#ac414c; }
a:hover { color: #c78087; text-decoration:underline; }

/* table */

table {
	border-collapse: collapse;
	margin: 10px 0;
}

td {
	border: 1px solid #9dafab;
	border-top: 0;
	color: #555;
	font-size: 1.2em;
	line-height: 1.4em;
	padding: 5px;
	text-align: left;
	vertical-align: top;
}

th {
	background-color: #ced7d5;
	border: 1px solid #9dafab;
	color: #444;
	font-size: 1.3em;
	font-weight: normal;
	padding: 8px;
	text-align: center;
	vertical-align: top;
}

/*td.session { background-color: #ced7d5; vertical-align:middle}*/

/* misc */

.notify { color:Navy; }

.generic em{
	font-style:italic;
	font-weight:inherit;
}

.generic strong{
	font-weight:bold;
}

.branding {
    font-family:MS Sans Serif;
	font-size: 1.4em;
	font-weight:bold;
	color: #3c5f58;
}

/* for mini CTUG logo */
.brandingSmall {
	color: #3c5f58;
    font-family:MS Sans Serif;
	font-size: 1.4em;
	font-weight:bold;
	padding: 5px 0 0 20px;
	background-image: url("../images/ctugLeaf.jpg");
	background-repeat:no-repeat;
}

.rss {
	background: url("../images/RSSIcon.png") no-repeat right 1px;
	border: none;
	padding-right: 13px !important;
	text-decoration:none;
	padding-top:0;
	font-size: 1.0em;
}

.amp{ 
	font-family:Baskerville, "Goudy Old Style", "Palatino", "Book Antiqua", serif;
	font-style:italic;
	font-weight:normal;
	line-height:inherit;
}
.raquo{
	font-weight:normal;
	font-size: 1.5em;
}
abbr{
	border-bottom:1px dotted #666;
	border-color:inherit;
	cursor:help;
}

address {  font-size: 1.2em; font-style: normal; line-height: 1.4em; margin: 1.3em 0; }

.title { font-size: 1.3em; margin-top: 1em; 
	 
}

.label {
	color:#6c010c;
	margin: 0 .2em 0 1em;
}

.clear{
	clear:both;
}
.right-float{ /* Float any item to the right */
	float:right;
	margin-left:2em;
	margin-right:0;
}
.left-float{ /* Float any item to the left */
	float:left;
	margin-right:2em;
	margin-left:0;
}
.center-float{ /* Float any item in the center */
	margin: 0 auto;
}

.spacer {
	margin-left:20px;
}

.hidden {
    visibility:collapse;
}

hr { color: #ced7d5; height:1px; margin: 10px 0; clear:both; }

/* image styles */

img{
	font-size:1em;
}

img.withBorder { border:1px solid #9dafab;}

img.center-img {
		display:block;
		margin: 1em auto;
}
img.left-img{ /* Float any image to the LEFT and give it some margin */
	font-size:1em;
	float:left;
	padding:2px;
	border:1px solid #9dafab;
	margin-bottom:1.8em;
	margin-right:2em;
	margin-top:0.3em;
}
img.right-img{ /* Float any image to the RIGHT and give it some margin */
	font-size:1em;
	float:right;
	padding:2px;
	border:1px solid #9dafab;
	margin-bottom:1.8em;
	margin-left:2em;
	margin-top:0.3em;
}

/* list styles */
ul{
	margin: 1.8em;
	list-style:none;
}

ul.pointForm{
	margin: .8em;
	list-style:square inside;
}
ul.pointFormIndented{
	margin: .5em 3em 1em;
	padding:0;
	list-style:square inside;
}
ul li{
	font-size:1.2em;
	line-height:1.5em;
}
ul li.caption{ /* Apply this class to the first list item in a list to give it a caption */
	font-variant:small-caps;
	list-style:none;
	color:#000;
}
li > ul, li > ol{
	margin-bottom:0;
	margin-left:5em;
}
li > ul li, li > ol li{
	font-size:1em;
}
ol{
	margin-bottom:1.8em;
	list-style:decimal inside;
}
ol li{
	font-size:1.2em;
	line-height:1.5em;
}
	
dl {
	margin: 0 0 2.5em 2.0em;
}

dt {
	font-size: 1.2em;
	font-weight: bold;
	line-height: 1.4em;
	padding: 0;
}

dd {
	font-size: 1.2em;
	line-height: 1.4em;
	margin: 0 0 .5em 1em;
}

/* =p */
.generic p{
	font-size:1.2em;
	line-height:1.5em;
	margin-bottom:1em;
}

.callOut p {
	margin: 1.2em;
	padding:0;
}

blockquote p{
    
	font-size:1.2em!important;
	line-height:1.5em!important;
	margin-bottom:1.5em!important;
	font-weight:bold;
}

blockquote p cite{
	font-style:normal;
	
}

p.abstract {
	margin:1em;
}

ol.abstract {
	margin:1em 1em 1em 10em ;
}
	

/* header styles */

.header {
	background: url("../images/ctugBanner.jpg") no-repeat 0 10px;
	color: #fff;
	height: 70px;
}

.header h1 {
	top:40px;
	right:10px;
	height:70px;
	width:500px;
	overflow: hidden;
	text-indent: -999em;
}

.header h1 a {
	display: block;
	height: 100%;
	width: 100%;
}

.header p {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	margin-top: 20px;
	margin-right: 20px;
	color: #6c010c;
	font-weight:normal;
}

/* tabbed navigation */

.tabnav {
	background: url("../images/bgTabs.jpg") repeat-x 0 bottom;
	height: 30px;
	margin-bottom: 20px;
	padding: 0;
}

.tabnav li {
	height: 38px;
	float: left;
	list-style-type: none;
	padding: 0 11px 0 5px;
}

.tabnav li a {
	border: 0;
	display: block;
	text-decoration: none;
}

.tabnav li a span {
	/*display: block;
	padding: 3px 5px;*/
}

	.tabnav li a.selected {
		background: url("../images/bgTabCurrent.jpg") no-repeat center bottom;
		color: #462f31;
		padding-bottom: 5px;
	}

	.tabnav li a.hover 
	{
		background-color: #ebefee;		/*Red;*/
	}

	.tabnav li a.selected {
		/* background-color: #ebefee;*/
	}

/* tabbed page classes */

.tabContainer {
        width: 100%;
        }

.tabTwoCol {
		width: 45%;
		margin: 1em 1em 1em 0;
}

.tabThreeCol {
		width: 30%;
		margin: 1em 1em 1em 0;
	
}
.tabThreeCol h4 {
		width: 50%;
		border-bottom: 1px solid #ced7d5;
	
}

/* boxes and callouts */

.block { padding: 8px 20px; }

.citeBox {
		background-image:url('../../images/brandingBox.gif');
		height: 60px;
}

.greyRndBox{ }
	/* create rounded corners for greyRndBox */
	
	.bl {background: url("../images/bottomLeft.gif") 0 100% no-repeat #ebefee; min-height:270px; } 
	.br {background: url("../images/bottomRight.gif") 100% 100% no-repeat; min-height:270px;} 
	.tl {background: url("../images/topLeft.gif") 0 0 no-repeat; min-height:270px;} 
	.tr {background: url("../images/topRight.gif") 100% 0 no-repeat; padding:10px; min-height:270px;} 

.greyRndBox h2{
	text-align:center;
}
.greyRndBox h3{
	color:#6d8782;
}

.specialBox {
	
	background-color: #fff;
	width:50%;
	padding: 1em;
	margin: 1em auto;
	text-align:center;
	border-top: 2px solid #acaaaa;
	border-bottom: 2px solid #acaaaa;
}

/* callout Box */
.callOut {
	 background-color: #fff;
	 border: 1px solid #9dafab;
	 margin: 2em;
	 padding: 0 5px 0 10px;
}
.callOut h4 {
	
	margin:1.2em;
}
.callOut h5 {
	
	margin:1.2em;
}

.callOut ul,ol {
	
	margin:1.6em;
}

/* news classes */

 .newsblock  {
	margin: 1.6em 1em 0 0;
	border-bottom:  1px dashed #9dafab;
}
 .newsblock p {
	margin: 1em 0;
}
 .newsblock h3 {
	color: #000;
}

 .newsblocklast {
	border:  none;
}

/* media archive listings */

.mediaItem li {
    font-family: Verdana Arial helvetica Sans-Serif;
    font-size: 1.2em;
	padding: .5em;
}

.mediaItem li p {
		font-size:1.0em;
		margin:0;
}

/* events */

.sessionData { 	background-color: #ebefee; }

.vendorTracks {	background-color: #f4e5e7; }

/* joining form */

.formElement { width:100%; clear:both; float:left}
.formLabel { width:200px; text-align:right; line-height:2em; margin-right: 10px; float:left; font-size:1.2em;}
.formText { text-align:left; line-height:2em;float:left; font-size:1.2em;}

.surveyElement { width:100%; clear:both; float:left; margin: 0; padding: 0;}

.surveyElement tr td { border: 0px; }
.surveyHeader { width: 100%; text-align: left; line-height: 2.1em; font-size: 1.2em; } 
.surveyLabel { width:240px; text-align:right; line-height:1.6em; margin: 0 10px; padding-left:20px; float:left; font-size:1.2em;  }
.surveyText { text-align:left; float:left; font-size:1.1em; margin:0; padding:0}


/* registration wizards */

.field
{
	border: 0px solid black;
	background-color: inherit; /*Yellow;*/
	margin: 8px 0 0 0;
	padding: 0;
	clear:both;
	font-size:12px;
	width:98%;
	overflow:auto;
}

.wizContent p
{
	padding: 0 30px;
}

.fieldHeader
{
	background-color: inherit; /*Gray;*/
	padding-left:10%;
	font-size:1em;
	clear:both;
	float:left;
	width:90%;
	font-style:italic;
	margin: 10px 0 10px 0;
}

.fieldLabel 
{
	background-color: inherit; /*Blue;*/
	margin: 0 0 0 30px;
	padding: 2px 0 0 0;
	width: 240px;
	text-align:right;
	clear:both;
	float:left;
}

.fieldMandatory
{
	background-color: inherit; /*Green;*/
	color: Red;
	font-weight:bold;
	width: 8px;
	padding:3px 0px 0px 4px;
	text-align:right;
	float:left;
}

.fieldData
{
	background-color: inherit; /*Gray;*/
	padding: 1px 0 0 2px;
	width: 330px;
	text-align:left;
	float:left;
}

.fieldText
{
	background-color: inherit; /*Aqua;*/
	padding: 2px 0 0 4px;
	width: 300px;
	text-align:left;
	float:left;
	font-size:14px;
	color: Green;
}

.fieldData input
{
	background-color: inherit;	/*Maroon;*/
	margin-left: 2px;
	padding-left: 2px;
}

.fieldError
{
	background-color: inherit;	/*Orange;*/
	color: Red;
	font-style: italic;
	font-family: Times New Roman;
	font-size: 12px;
	clear:both;
	margin: -8px 0 0 285px;
}

.validationError
{
	background-color: inherit;
	color: Red;
	font-style: italic;
	font-family: Times New Roman;
	font-size: 12px;
}

.fontCourier
{
	 font-family:Courier;
}

.fontBold
{
	font-weight: bold;
}

.fontLarger
{
	font-size:larger;
}

.fontUnderline
{
	text-decoration: underline;
}

.fontColorRed
{
	color:Red;
}

.fontColorGreen
{
	color:Green;
}

.floatRight
{
	float:right;
}

.floatLeft
{
	float:left;
}

.wizContent
{
    min-height:370px; width:700px; border:solid 1px Gray; padding: 3px 12px 3px 8px;
}

.wizPager
{
	width:700px; padding:6px;
}

.noticeMandatory
{
	margin-top:20px; clear:both;float:left;font-size:12px;font-family:Times New Roman;font-style:italic;color:Red;
}

.wizProgressBackground 
{
	position: fixed;
	top: 0;
	left: 0;
	
	background-color:Black;
	filter:alpha(opacity=5);
	opacity:0.01;
	
	height: 100%;
	width: 100%;
	min-height: 100%;
	min-width: 100%
}

.wizProgress
{
	background-color:#CF4342;
	color:#fff;
	width: 150px;
	height: 24px;
	text-align: center;
	vertical-align: middle;
	position: fixed;
	bottom: 50%;
	left: 45%;
}