﻿/******************************************************************
*  Named classes and ID-based styles                              *
******************************************************************/

/* All # styles are elements that can only occur once on a page  */

#page /* Root div tag that contains all other elements */ {
    width: 860px;
    margin: 0 auto 0 auto;
    padding: 0 5px;
}

#header /* Header area with menu and logo */ {
    width: 850px;
    background: white;
    position: relative;
    margin: 10px 0 10px 0;
    padding: 0;
    clear: both;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

#menu /* Menu div element within which the list and list items of the menu reside */ {
    clear: both;
    width: 850px;
    padding: 0;
    padding-bottom: 25px;
    margin-top: 10px;
    margin-bottom: 20px;
}

#subMenu {
    clear: both;
    width: 850px;
    padding: 15px 0 5px 0;
    margin-top: 0;
    margin-bottom: -10px;
    border-bottom: 1px solid rgb(203, 203, 203);
}

#main /* Main content area */ {
    width: 850px;
    margin-bottom: 30px;
    _height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
    background-color: #f2f2f2;
    padding: 0;
    border-bottom: solid 2px #d5d5d5;
}

#footer /* Footer with copyright and address */ {
    color: #999;
    padding: 10px 0;
    text-align: center;
    line-height: normal;
    margin: 35px 0 0 0;
    font-size: .9em;
}

#contentColumnHeader /* Like single content column, but for the header image */ {
    background-color: White;
    background-repeat: round;
    margin: 0 0 10px 0;
    width: 834px;
    height: 200px;
    float: left;
    padding: 8px;
}

#contentColumnBillboard /* Header with background image */ {
    background-color: White;
    background-repeat: round;
    margin: 0 0 30px 0;
    height: 200px;
    width: 834px;
    float: left;
    padding: 8px;
}

#contentColumnSingle /* Single content column in 1-column layouts */ {
    background-color: White;
    margin: 10px 10px 10px 10px;
    width: 815px;
    float: left;
    padding: 8px;
}

.singleColumnBelowBillboard /* Single content column used below billboards */ {
    background-color: White;
    margin: 10px 0;
    width: 850px;
    float: left;
    padding: 8px 0;
}

.singleColumnBelowBillboard p /* Single content column used below billboards */ {
    font-size: 1.3em;
}
.separator {
    border-bottom: 1px solid silver;
    margin-bottom: 40px;
    padding-bottom: 30px;
}

#contentColumnSingleFlyer /* Single content column in 1-column layouts using the large, flyer style */ {
    background-color: White;
    margin: 10px 10px 10px 10px;
    width: 834px;
    float: left;
    padding: 8px;
    text-align: center;
}
#contentColumnSingleFlyer div {
    margin-top: 25px;
    color: #5c6a73;
}
#contentColumnSingleFlyer div p {
    font-size: 1.5em;
    margin-bottom: 45px;
}
#contentColumnSingleFlyer div ol {
    font-size: 1.5em;
    line-height: 1.5em;
    list-style-position: inside;
}
#contentColumnSingleFlyer div ul {
    font-size: 1.5em;
    line-height: 1.5em;
    list-style-position: inside;
}
#contentColumnSingleFlyer div h1 {
    font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    font-weight: 300;
    text-align: center;
    line-height: 55px;
    margin-bottom: 40px;
}
#contentColumnSingleFlyer div h2 {
    font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    font-weight: 300;
    text-align: center;
    line-height: 1.5em;
    margin-bottom: 40px;
    font-size: 2em;
}
#contentColumnSingleFlyer div h3 {
    font-family: "Segoe UI", "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
    font-weight: 300;
    text-align: center;
    line-height: 55px;
    margin-bottom: 40px;
    font-size: 1.75em;
}
#contentColumnSingleFlyer div.bulletHost {
    margin: 0 auto;
    padding: 0;
}
#contentColumnSingleFlyer div.unselectedBullet {
    margin: 6px 11px; 
    padding: 0;
}
#contentColumnSingleFlyer div.selectedBullet {
    margin: 6px 11px; 
    padding: 0;
}
#contentColumnSingleFlyer div.separator  {
    border-bottom: 1px solid silver;
    margin-bottom: 40px;
    padding-bottom: 30px;
}
#contentColumnSingleFlyer div div.twoColumns {
    width: 365px;
    float: left;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
}
#contentColumnSingleFlyer div div.threeColumns {
    width: 230px;
    float: left;
    margin-bottom: 0;
    padding-bottom: 0;
    padding-left: 20px;
    padding-right: 20px;
}
#contentColumnSingleFlyer div div.clearfix {
    margin-bottom: 0;
    padding-bottom: 0;
}

#contentColumnMain /* Main (typically left) content column for 2-column layouts */ {
    width: 510px;
    float: left;
}

#contentColumnSecondary /* Secondary (typically right) content column for 2-column layouts */ {
    width: 340px;
    float: left;
}

.contentColumnFlyerMain /* Main (typically left) content column for 2-column layouts */ {
    width: 510px;
    float: left;
    margin: 0px;
}

.contentColumnFlyerSecondary /* Secondary (typically right) content column for 2-column layouts */ {
    width: 320px;
    float: left;
    margin: 0;
}

#ads /* Div container for all ad elements adorning the page (does not include inline ads that are part of the main content) */ {
    width: 1000px;
    background: White;
    position: relative;
    margin: 10px auto 0 auto;
    padding: 0;
}

#adTower /* Container for all tower ads (typically located on the right edge of the page outside the content area) */ {
    position: absolute;
    left: 875px;
    top: 100px;
    display: block;
}

#adHorizontalTop /* Container for the horizontal ad at the top of the page */ {
    text-align: center;
    width: 850px;
}

#usercontrols {
    margin-top: 20px;
    margin-right: 15px;
    float: right;
    text-align: right;
}

#logo /* Div element containing the logo */ {
    display: block;
    float: left;
    text-align: left;
    position: relative;
    margin: 25px 0 20px 0;
    font-size: larger;
}

.quoter {
	font-size: 1.2em;
	line-height: 1;
	text-align: center;
	margin: -8px 0 8px 0;
}
#contentColumnSecondary div p.quoter {
	text-align: right;
}
#contentColumnSingleFlyer .contentColumnFlyerSecondary div p.quoter {
	text-align: right;
    font-size: 1.1em;
}
.quote {
	color: white;
	margin: 30px 10px 0 25px;
	padding: 7px 15px 10px 15px;
	border-radius: 10px;
}
#contentColumnSecondary div p.quote {
	text-align: left;
}
#contentColumnSingleFlyer .contentColumnFlyerSecondary div p.quote {
	text-align: left;
    font-family: Calibri, Verdana, 'Lucida Grande', 'Lucida Sans Unicode', Arial, Calibri, sans-serif;
    font-size: 15px;
    line-height: 1.3em;
    margin: 30px 0 0 35px;
    padding: 7px 15px 10px 15px;
}
p.quoteArrow {
    margin: -5px 0 0 260px;
    text-align: right;
    background-image: url('/Images/Styles/SpeechBubbleArrowTraining.png');
    background-repeat: no-repeat;
    height: 10px;
    width: 40px;
}
#contentColumnSingleFlyer .contentColumnFlyerSecondary div p.quoteArrow {
    margin: -5px 0 10px 270px;
    text-align: right;
    background-image: url('/Images/Styles/SpeechBubbleArrowTraining.png');
    background-repeat: no-repeat;
    height: 20px;
    width: 40px;
}

#pageAdorner1, #pageAdorner2, #pageAdorner3 {} /* Currently unused empty div tags available for styling purposes (located inside the page div tags) */
#bodyAdorner1, #bodyAdorner2, #bodyAdorner3 {} /* Currently unused empty div tags available for styling purposes (located inside HTML body tags) */


/* Classes used to reset formatting options */
.standardContent {} /* Used to reset to standard text formatting within special elements, in particular content columns */


/* Classes that indicate various types of data */
.date {} /* Date elements */
.price {} /* Pricing information */

.contentLive {} /* Live content */
.contentOnline {} /* Online content */
.contentVideo {} /* Video content */
.contentMentoring {} /* Mentoring content */
.contentOnSite {} /* On-site content */
.contentCustomized {} /* Customized content */


.advertisement {}

/* Various class names used for images */
.personImage 

/* Various named classes used to create special highlighting effects (and such) */

.selectedMenu {} /* This class gets assigned to the li element that represents a selected menu item */

.alert {} /* Content formatted in a way that draws more attention from a user (such as "just 3 days to go!") */

.error /* General highlight for error information */ {
    color: Red;
}

.field-validation-error /* Field validation error information */ {
    color: #ff0000;
}

.input-validation-error /* Input validation error information */ {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors /* Validation summary errors */ {
    background-color: rgb(255, 204, 204);
    padding: 8px;
    border-radius: 5px;
    font-weight: bold;
    color: #c00;
}

.validation-summary-errors li {
    padding: 0;
    list-style: none;
}

/* these classes control the display of the Events Media pages*/
.showHideLink {
    float: right;
}

.eventEdit ul {
    list-style: none;
}

.sessionFrame {
    background-color: ghostwhite;
    padding: 5px;
    margin: 5px;
}

.eventFrame {
    background-color: #e8eef4;
    padding: 5px;
}

.dayFrame {
    background-color: rgb(208, 227, 251);
    padding: 5px;
}

/* Bullet selections */

div.bulletHost {
    margin: 0 auto;
    padding: 0;
    clear: both; 
}
div.selectedBullet {
    width: 10px; 
    height: 10px; 
    border: 1px solid rgb(118, 121, 124);
    -ms-border-radius: 50%;
    border-radius: 50%; 
    background-color: transparent; 
    margin: 5px 10px;
    padding: 0;
    float: left;
    cursor: pointer;
}
div.unselectedBullet {
    width: 8px; 
    height: 8px; 
    border: 1px solid transparent;
    -ms-border-radius: 50%;
    border-radius: 50%; 
    background-color: rgb(118, 121, 124); 
    margin: 6px 11px; 
    padding: 0;
    float: left;
    cursor: pointer;
}

