BODY{
font:80% Arial, Helvetica, sans-serif;
line-height:1.3em;
padding:0;
margin:0;
background:url(../images/cmg/bg_page.gif);
}
A{
color:#CD202C;
text-decoration:none;
}
A:hover{
color:#9A1822;
text-decoration:underline;
}
#header{
border-top:10px solid #CD202C; /* change this color for each atlas */
}

#header img {
	margin: 5px 0px 10px 15px;
}


#headLinks{
display:inline;
float:right;
margin-top:15px;
margin-right:24px;
font:12px Arial, Helvetica, sans-serif;
color:#ccc;
}

#container{
width:990px;
margin-left:auto;
margin-right:auto;
background:#FFFFFF;
}
#menuCol{
width:260px;
display:inline;
float:left;
padding-left:15px;
margin-right:24px;
}
#menuSearch{
height:40px;
background:url(../images/cmg/search_bg.jpg) repeat-x;
position: relative;
margin-bottom: 15px;
}


#txtSearch{
	width: 184px;
	height:15px;
	position: absolute;
	top: 10px;
	left: 10px;
	padding: 2px;
	padding-left:5px;
	font: 12px Arial, Helvetica, sans-serif;
	color:#666;
}

#menuSearch a {
	position: absolute;
	top: 9px;
	left: 205px;
}


#menuCol H1{
font:bold 14px verdana,arial,helvetica,sans-serif;
margin:0;
margin-left:10px;

}
#menuCol UL{
padding:0;
margin-left:9px;
margin-right:14px;
margin-top:12px;
border-top:1px dotted #333333;
font:bold 12px Arial, Helvetica, sans-serif;
}
#menuCol LI{
margin-left:0;
padding:10px 0px;
list-style-type:none;
border-bottom:1px dotted #333333;
}

#dynamicContentCol{
width:690px;
display:inline;
float:left;
position:relative;
}

#iotw {
width:424px;
height:306px;
display:inline;
float:left;
cursor: pointer;
position:relative;
margin-right:20px;
}
#iotwImg{
width:424px;
height:306px;
border:0;
margin:0;
padding:0;
}
#iotwDetails{
position:absolute;
width:321px;
height:54px;
background:#003366;			/* change this color for each site */
filter:alpha(opacity=88);
opacity:0.88;
right:0px;
bottom:0px;
text-align:right;
line-height:1em;
padding:0 15px;
}
#iotwTitle,
#iotwText{
margin:0;
font:12px verdana,arial,helvetica,sans-serif;
color:#fff;
}
#iotwTitle{
margin-top:5px;
font-weight:bold;
}
#iotwText{
margin-top:5px;
margin-bottom:5px;
}

/* My Image Sets panel */

#sampleSlideset{
width:202px;
height:300px;
display:inline;
float:left;
font:12px Verdana, Arial, Helvetica, sans-serif;
color:#666666;
}
#sampleSlideset H1{
font: bold 14px arial,helvetica,sans-serif;
color:#fff;
padding:8px 16px;
margin-top:0px;
background-color:#CD202C; 	/* change this color for each atlas */
}
#sampleSlideset H2{
padding-top:0px;
margin-top:8px;
margin-bottom:5px;
}
#sampleSlideset P.findImages{
font-size:0.9em;
text-align:right;
margin-bottom:0px;
}

#isProcess{
list-style-type:none;
margin:0;
padding:0;
margin-top:5px;
margin-bottom:3px;
line-height:1.2em;
font-size:0.9em;
}

#isProcess LI{
padding:4px 0px;
}
#isProcess LI IMG{
vertical-align:text-top;
margin-right:8px;
}

#sampleIS LI{
margin-bottom:10px;
}
#sampleIS IMG.isIcon{
margin-right:10px;
vertical-align:text-top;
float:left;
}


#imagesets-creating-container,
#imagesets-user-container{
border:1px solid #C9C1CE;
border-top:none;
height:108px;
background:url(../images/cmg/bg_imgSets.jpg) 160px 10px no-repeat;
padding:10px;

}

#imagesets-user-container UL{
line-height:1.7em;
}
#imagesets-creating-container UL{
/*line-height:1.2em;
font-size:0.9em;
margin-bottom:10px;*/
}
#imagesets-creating-container P.description{
width:140px;
font-size:0.9em;
font-weight:bold;
}
#imagesets-sample{
margin-top:10px;
border:1px solid #C9C1CE;
padding:0px 10px;
font-size:0.9em;
}

/* End My Image Sets panel */

DIV.row{
margin-bottom:24px;
}
DIV.rowElement,
DIV.rowElementLeft{
width:202px;
display:inline;
float:left;
}
DIV.rowElement{
margin-left:20px;
}
DIV.rowElement IMG,
DIV.rowElementLeft IMG{
padding:3px;
}
DIV.rowElementTitle{
border-left:1px solid #CD202C; 	/* change this color for each atlas */
border-right:1px solid #CD202C; /* change this color for each atlas */
background:#CD202C; 			/* change this color for each atlas */
padding:6px;
color:#fff;
}
DIV.rowElementTitle H1{
font: bold 1.2em arial,helvetica,sans-serif;
}

div.rowElement div.rating,
div.rowElementLeft div.rating {
cursor: default;
display:block;
border-left:1px solid #ccc;
border-right:1px solid #ccc;
border-bottom:1px solid #ccc;
}

div.rowElementRating .stars-text { 
display: block;
float: right;
text-align:right;
font:1em arial,helvetica,sans-serif;
}

DIV.rowElementRating{
font:10px Arial, Helvetica, sans-serif;
padding:5px 5px;
}
DIV.rowElementImgDetails{
/*this DIV is needed to give the left and right borders for DIV.rowElementImage and DIV.rowElementLegend
IE6 does not render the right or left border on rowElementLegend (because of the presence of the height property)*/
border-left:1px solid #ccc;
border-right:1px solid #ccc;
}
DIV.rowElementImage{
text-align:center;
}
DIV.rowElementLegend{
font:11px Arial, Helvetica, sans-serif;
line-height:1.5em;
border-top:1px dashed #CCC;
border-bottom:1px dashed #CCC;
height:49px;
padding:10px;
overflow:hidden;
}


#footer{
width:auto;
clear:both;
position:relative;
background:#fff;
border-top:1px dotted #CCC;
margin:0 24px;
}


/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: block; height:1%;}