HTML
{
    SCROLLBAR-FACE-COLOR: #eeeeee;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
    SCROLLBAR-SHADOW-COLOR: #d5d5d5;
    SCROLLBAR-3DLIGHT-COLOR: #000000;
    SCROLLBAR-ARROW-COLOR: #000000;
    SCROLLBAR-TRACK-COLOR: #ffffff;
    SCROLLBAR-DARKSHADOW-COLOR: #000000
}
BODY
{
    SCROLLBAR-FACE-COLOR: #eeeeee;
    SCROLLBAR-HIGHLIGHT-COLOR: #ffffff;
    SCROLLBAR-SHADOW-COLOR: #d5d5d5;
    SCROLLBAR-3DLIGHT-COLOR: #000000;
    SCROLLBAR-ARROW-COLOR: #000000;
    SCROLLBAR-TRACK-COLOR: #ffffff;
    SCROLLBAR-DARKSHADOW-COLOR: #000000
}
.boxes img {border:1px #c0c0c0 solid;border-radius:3px;margin:8px;box-shadow: 1px 1px 1px rgba(136, 136, 136, 0.61)}
 
.alphabet{background:url('/images/alphabet_box.gif') top left no-repeat;  display:table-cell;text-align:center;height:26px;width:28px;margin:2px;FONT-FAMILY:  "Roboto Condensed",verdana, arial, helvetica;    FONT-SIZE: 16px;    TEXT-DECORATION: none;color:#5a5a5a;font-weight:bold;float:left;padding-top:3px}
a.alphabet:visited{color:#5a5a5a;}
a.alphabet:hover{background:url('/images/alphabet_box.gif') top left no-repeat;background-position:0 -34;color:#5a5a5a;}

.boxes {
	padding: 10px;
	 background-color: #ffffff;
	border:1px solid #c0c0c0; 
	border-radius:6px;
	box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.1);
	 
}

.navlinks {
	font-family: "Roboto Condensed",Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	color: #000000;
	text-decoration: none;
}
 
 .loginbox 
 {
     background: url(/images/h_bg.gif) top left repeat;
	 
	FONT-SIZE: 11px; padding-top:8px;padding-left:4px;padding-right:4px;
	 height:22px; 
	 
}
 
 
BODY
{
    PADDING-RIGHT: 0px;
    PADDING-LEFT: 0px;
    PADDING-BOTTOM: 0px;
    MARGIN: 0px;
    PADDING-TOP: 0px;
    BACKGROUND-COLOR: #F3F4F5
}

.dirlist
{
text-decoration: underlined; font-family: "Roboto Condensed",Arial, Helvetica, sans-serif; font-size: 13px; font-weight: bold; color: #000000
}
 
 
A.top_tab:link {font-size:15px;color:black;text-decoration:none}
A.top_tab:visited {font-size:15px;color:black;text-decoration:none}
A.top_tab:active {font-size:15px;color:black;text-decoration:none}
A.top_tab:hover {font-size:15px;color:#EC8C55;background:#FDF1EA;text-decoration:underline}

.top_tab_main{font-size:15px;font-weight:bold}
A.top_tab_main:link {font-size:15px;color:white;text-decoration:none}
A.top_tab_main:visited {font-size:15px;color:white;text-decoration:none}
A.top_tab_main:active {font-size:15px;color:white;text-decoration:none}
A.top_tab_main:hover {font-size:15px;color:#ffffff;background:#EF9A6B;text-decoration:underline}


BODY
{
    FONT-FAMILY: "Roboto Condensed",verdana,arial,Georgia,Trebuchet MS
}

h1,h2,h3,h4,h5,h6 {	 
 

	 
	FONT-family: "Roboto Condensed",Trebuchet MS, arial, helvetica;
	 
color: #000;
background-color: #c0c0c0;
line-height: 2em;
box-shadow: 1px 1px 1px #dadada;
	
}
h1{
	padding:		2px 20px 2px 20px;height:34px;
}
h5{ 
	padding:		6px 20px 2px 20px;
}
h3,h2{padding:		6px 20px 2px 20px;}

h1{font-size:16px}
.oldbg{D9C5BA}
  


TD,p
{
    FONT: 16px "Roboto Condensed",arial,Trebuchet MS, arial, helvetica
}

A:link
{
    COLOR: #420203; 
}
A:visited
{
    COLOR: #420203; 
}
A:hover
{
    COLOR: #000000; 
   
}

 
.oldlink{#3a76d6}
.op{#AC460A}

.breadcrumb{
 FONT-SIZE: 11px;
 LINE-HEIGHT: 20px; 
 FONT-FAMILY: verdana; 
 LETTER-SPACING: -0.5pt; 
 VALIGN: middle
  
}
DIV.logo
{
    BORDER-RIGHT: #666666 1px solid;
    PADDING-RIGHT: 0px;
    BORDER-TOP: #666666 1px solid;
    PADDING-LEFT: 0px;
    PADDING-BOTTOM: 0px;
    VERTICAL-ALIGN: middle;
    BORDER-LEFT: #666666 1px solid;
    PADDING-TOP: 14px;
    BORDER-BOTTOM: #666666 1px solid;
    BACKGROUND-COLOR: #f3f3f3;
    TEXT-ALIGN: center
}
a.blackhover{text-decoration:none;color:black;}
A.blackhover:hover{text-decoration:underline;}

DIV.title
{
    PADDING-LEFT: 20px;
    FONT: 20pt "Roboto Condensed",arial;
    COLOR: #1778cb;
    LETTER-SPACING: 4px
}
.smallstuff
{
font: 11px "Roboto Condensed",arial;
padding-left:5px;
}


#menubar
{
  background-image: url(/images/tabbg14.gif) 
}
#menubar2
{
     background-image: url(/images/tabs23.gif) 
}
DIV.menubar
{
    PADDING-RIGHT: 4px;
    PADDING-LEFT: 20px;
    FONT: 8pt "Roboto Condensed",Trebuchet MS;
    VERTICAL-ALIGN: middle;
    
    COLOR: #666666
}
DIV.menubar A:link
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
DIV.menubar A:visited
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
DIV.menubar A:hover
{
    COLOR: #cc0000;
    TEXT-DECORATION: none
}
#sidebar
{
    BORDER-RIGHT: #000000 1px solid;
    PADDING-TOP: 25px;
    match: 
}
DIV.sidebar
{
    PADDING-RIGHT: 20px;
    PADDING-LEFT: 20px;
    FONT-SIZE: 8pt;
    LINE-HEIGHT: 13pt
}
DIV.sidebar_block
{
    BORDER-RIGHT: #cccccc 1px dashed;
    PADDING-RIGHT: 10px;
    BORDER-TOP: #cccccc 1px dashed;
    DISPLAY: block;
    PADDING-LEFT: 10px;
    PADDING-BOTTOM: 10px;
    BORDER-LEFT: #cccccc 1px dashed;
    PADDING-TOP: 10px;
    BORDER-BOTTOM: #cccccc 1px dashed;
    BACKGROUND-COLOR: #f5f5f5;
    TEXT-ALIGN: left
}
DIV.nav_block
{
    BORDER-RIGHT: #cccccc 1px solid;
    PADDING-RIGHT: 10px;
    BORDER-TOP: #cccccc 1px solid;
    DISPLAY: block;
    PADDING-LEFT: 10px;
    PADDING-BOTTOM: 10px;
    BORDER-LEFT: #cccccc 1px solid;
    PADDING-TOP: 10px;
    BORDER-BOTTOM: #cccccc 1px solid;
    BACKGROUND-COLOR: #f5f5f5;
    TEXT-ALIGN: left
}
TD.nav
{
    FONT-WEIGHT: bold;
    FONT-SIZE: 14px;
    LINE-HEIGHT: 20px;
    FONT-FAMILY: "Roboto Condensed",arial;
    LETTER-SPACING: -0.5pt;
    VALIGN: middle
}
A.nav:link
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
A.nav:visited
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
A.nav:hover
{
    FONT-WEIGHT: bold;
    COLOR: #000000;
    TEXT-DECORATION: none
}
TD.sitestats_details
{
    FONT-SIZE: 7pt;
    COLOR: #444444;
    LINE-HEIGHT: 10pt
}
TD.sitestats-totals
{
    FONT-SIZE: 7pt;
    COLOR: #aaaaaa;
    LINE-HEIGHT: 9pt;
    FONT-STYLE: italic
}
TD.sitestats_users
{
    FONT-SIZE: 7pt;
    COLOR: #d5d5ef;
    LINE-HEIGHT: 10pt
}
#footer
{
    BORDER-TOP: #000000 1px solid;
    font-size:11px
}
TD.footer
{
    PADDING-RIGHT: 2px;
    PADDING-LEFT: 2px;
    FONT-SIZE: 11px;
    PADDING-BOTTOM: 2px;
    COLOR: #666666;
    PADDING-TOP: 2px; 
    TEXT-ALIGN: right
}
DIV.content
{
    PADDING-RIGHT: 0px;
    PADDING-LEFT: 0px;
    PADDING-BOTTOM: 15px;
    PADDING-TOP: 15px
}

.input_box{font-family: "Roboto Condensed",Trebuchet MS, Arial, Helvetica; font-size: 12px; font-weight: normal; color: #000000; background-color: #eeeeee; border: 1px solid #333300; vertical-align: middle}
.input_button{font-family: "Roboto Condensed",Trebuchet MS, Arial, Helvetica; font-size: 10px; font-weight: bold; color: #000033; background-color: #CCCCCC; border: 1px solid #000000; vertical-align: middle}


DIV.dashedborderleft
{
  
     
}


DIV.dashedfullborder
{
    BORDER-RIGHT: #cccccc 1px dashed;
    BORDER-LEFT: #cccccc 1px dashed;
    BORDER-TOP: #cccccc 1px dashed;
    BORDER-BOTTOM: #cccccc 1px dashed;
    PADDING-RIGHT: 1px;
     
    PADDING-LEFT: 1px;
    PADDING-BOTTOM: 10px;
     
    PADDING-TOP: 1px;
     
}

DIV.fullborder
{
	padding:		2px 10px 2px 10px;
	background:		rgb(231,231,231);
	border-bottom:	1px solid rgb(0,0,0);
	border-left:	1px solid rgb(0,0,0);
	border-right:	1px solid rgb(0,0,0);
	border-top:	1px solid rgb(0,0,0);

     
}

DIV.dashedborderright
{
    BORDER-LEFT: #cccccc 1px dashed;
    PADDING-RIGHT: 10px;
     
    PADDING-LEFT: 10px;
    PADDING-BOTTOM: 10px;
     
    PADDING-TOP: 10px;
     
}

A.blockheader:link
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
A.blockheader:visited
{
    COLOR: #3a76d6;
    TEXT-DECORATION: none
}
A.blockheader:hover
{
    COLOR: #000000;
    TEXT-DECORATION: none
}




DIV.articles-editheader {
	BORDER-RIGHT: #000000 1px solid; BORDER-TOP: #000000 1px solid; MARGIN-LEFT: 4px; BORDER-LEFT: #000000 1px solid; BORDER-BOTTOM: #000000 1px solid
}
DIV.articles-panel {
	BORDER-RIGHT: #cccccc 1px dashed; PADDING-RIGHT: 10px; BORDER-TOP: #cccccc 1px dashed; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; FONT: "Roboto Condensed",8pt Trebuchet MS; BORDER-LEFT: #cccccc 1px dashed; MARGIN-RIGHT: 10px; PADDING-TOP: 10px; BORDER-BOTTOM: #cccccc 1px dashed; BACKGROUND-COLOR: #ffffff
}
DIV.articles-title {
	FONT: 10pt "Roboto Condensed",Trebuchet MS, arial, helvetica; COLOR: #1778cb
}
DIV.articles-credit {
	FONT-SIZE: 8pt; PADDING-BOTTOM: 3px; COLOR: #999999
}
DIV.articles-content {
	PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; FONT: 8pt "Roboto Condensed",Trebuchet MS, arial, helvetica; TEXT-ALIGN: left
}
DIV.articles-footer {
	PADDING-LEFT: 20px
}
DIV.articles-nav {
	PADDING-LEFT: 3px; FONT-SIZE: 8pt; COLOR: #999999; PADDING-RIGTH: 3px
}
TABLE.articles-exception {
	BORDER-RIGHT: #cccccc 0px dashed; PADDING-RIGHT: 0px; BORDER-TOP: #cccccc 0px dashed; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; FONT: 8pt "Roboto Condensed",Trebuchet MS; BORDER-LEFT: #cccccc 0px dashed; MARGIN-RIGHT: 0px; PADDING-TOP: 0px; BORDER-BOTTOM: #cccccc 0px dashed; BACKGROUND-COLOR: #ffffff
}
TABLE.articles-message {
	BORDER-RIGHT: #cccccc 0px dashed; PADDING-RIGHT: 0px; BORDER-TOP: #cccccc 0px dashed; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; FONT: 8pt "Roboto Condensed",Trebuchet MS; BORDER-LEFT: #cccccc 0px dashed; MARGIN-RIGHT: 0px; PADDING-TOP: 0px; BORDER-BOTTOM: #cccccc 0px dashed; BACKGROUND-COLOR: #ffffff
}
UL {
list-style-image: url(/images/bullet.gif);
}
.question_heading {font-weight:bold;background-color:efefef;width:100%}
div.successMessage   { background: url(http://www.compositiontoday.com/images/success.png) 0.5em center no-repeat #d6ebcc;}
div.errorMessage  {    background: url(http://www.compositiontoday.com/images/error.png) 0.5em center no-repeat #ffeacc;}
div.messageBox {  margin: 15px 0;}
div.messageBox   {    padding: 0.125em 0.5em 0.25em 25px;    font-weight: normal;}




#SecondaryNav {
 margin-left: 20px;
 padding-left: 8px;
 height: 30px;
 background: #ffffff;
 color: #383D42;
}

 
 

#SecondaryNav ul {
 padding: 0; margin: 0;
}

#SecondaryNav li {
 display: inline; 
 padding-top: 5px;
}

#SecondaryNav li a {
 margin-top: 5px;
 color: #383D42;
 padding-left: 12px;
 padding-right: 12px;
 line-height: 20px;
 height: 20px;
 border-right: 1px solid #F1F2EB;
 text-decoration: none;
 display: block;
 float: left;
}

#SecondaryNav li a:hover { background: #EF9A6B; }
#SecondaryNav li a.current:hover { background: #564B42; }

#SecondaryNav li a.current {
 font-size: 12px;
 font-weight: bold;
 text-decoration: none;
 color: #FFF;
 background: #564B42;
}
@media all and ( max-width: 60em )
		{
         
.collapse{ display:none}
}

 .videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
     
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 80%;
	height: 80%;
    
}