/******************************************************************************/
/*       <link href="css/styles.css" type="text/css" rel="stylesheet" />      */
/******************************************************************************/
/*                     styles for experimentful.com            2008           */
/******************************************************************************/ 
@import url("reset.css");


HTML, BODY, .basic{
	/*height: 100%;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}


.basis{
	margin: auto;
	width: 970px;	/* width of basis */
	margin-bottom: -50px;
	display: table;
	height: auto;
	/*
	height: 100%;
	min-height: 100%;
	*/
}

.main{
	height: 100%;
}

.header{
	height: 69px;	/* height of header */
}

.content
{
}
.left{
	width: 480px;	/* width of left column */
	float: left;
}
.center{
	width: 210px;	/* width of center column */
	float: left;
}
.right{
	width: 155px;	/* width of right column */
	float: right;
}

.footer{
	width: 970px;	/* width of basis */
	margin: auto;
	height: 50px;	/* height of footer */
}


/*needed to make room for footer*/
.clearfooter{
	clear: both;
	height: 50px;	/* height of footer */
}
* > HTML .clearfooter {
	float: left;
	width: 100%;
}/* ie mac styles */


/*** standard classes ***********************************************************************************************/
.separator1{
	height: 1px;
	font-size: 1px;
	display: block;
}
.separator2{
	height: 2px;
	font-size: 1px;
	display: block;
}
.separator3{
	height: 3px;
	font-size: 1px;
	display: block;
}
.separator5{
	height: 5px;
	font-size: 1px;
	display: block;
}
.separator10{
	height: 10px;
	font-size: 1px;
	display: block;
}
.separator20{
	height: 20px;
	font-size: 1px;
	display: block;
}
.separator50{
	height: 50px;
	font-size: 1px;
	display: block;
}

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






/*** follow sections can edit *****************************************************************************/
BODY
{
	background-color: #1a3265;
	behavior: url("js/csshover.htc");

}



A,
A:visited
{
	color: #49aae9;
	text-decoration: none;
}
A:hover
{
	color: #000000;
	text-decoration: underline;
}

.basis
{
	background-image: url(../images/basis-bg.png);
	background-repeat: repeat-y;
}



/*** header **************************************************************/
.header
{
	background-image: url(../images/header-bg.png);
	background-repeat: no-repeat;
	position: relative;
}
.logo
{
	position: absolute;
	top: 10px;
	left: 0px;
}
.logo IMG
{
	width: 303px;
	height: 29px;
}
.slogan
{
	position: absolute;
	top: 40px;
	left: 50px;
}
.slogan IMG
{
	width: 470px;
	height: 23px;
}



/*** navigation ************************************/
.navigation
{
	background-color: #49aae9;
	height: 33px;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
}
.navigation UL
{
	padding: 13px 0px 0px 66px;
}
.navigation UL LI
{
	font-size: 13px;
	display: inline;
	font-family: Tahoma, Arial, Helvetica, sans-serif;
}
.navigation UL LI A,
.navigation UL LI A:visited
{
	color: #ffffff;
	padding: 0px 15px 0px 0px;
}
.navigation UL LI A:hover
{
	color: #ffffff;
}




/*** content **************************************************************/
.content
{
	padding: 10px 0px 0px 80px;
}


.left
{
	position: relative;
	padding: 0px 16px 10px 0px;
}


.post, 
.page
{
	position: relative;
}
.post H3, 
.page H3
{
	font-size: 22px;
	font-weight: normal;
	color: #e6601c;
	border-bottom: 1px solid #dfdfdf;
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 2px 0px;
}
.post H3 A, 
.page H3 A,
.post H3 A:visited, 
.page H3 A:visited
{
	color: #e6601c;
	text-decoration: none;
}
.post H3 A:hover, 
.page H3 A:hover
{
	text-decoration: underline;
}
.post .date, 
.page .date
{
	position: absolute;
	top: -1px;
	left: -68px;
	width: 50px;
	border-bottom: 1px solid #ffffff;
	text-align: center;
	font-size: 10px;
	color: #ffffff;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
}
.post .date SMALL, 
.page .date SMALL
{
	display: block;
	font-size: 17px;
	margin: -3px 0px 0px 0px;
	font-weight: bold;
}
.post P, 
.page P
{
	padding: 5px 0px 10px 0px;
}
.post .info, 
.page .info
{
	background-color: #f6f6f6;
	border: 1px solid #dfdfdf;
	padding: 3px 5px 3px 5px;
	font-size: 10px;
	color: #9d9d9d;
	margin-bottom: 10px;
}
.post .info .comment A, 
.page .info .comment A
{
	background-image: url(../images/comments.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 0px 0px 0px 15px;
}
.post B,
.page B,
.post STRONG,
.page STRONG
{
	font-weight: bold;
}
.post I, .page I,
.post EM, .page EM
{
	font-style: italic;
}
.post UL LI, .page UL LI
{
	background-image: url(../images/post-li-bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 9px;
	padding: 3px 0px 0px 12px;
}
.post OL, .page OL
{
	margin-left: 20px;
	list-style-type: decimal;
}

.comment_list H2, 
.comment_leave H2
{
	font-weight: normal;
	font-size: 16px;
	color: #e6601c;
	margin: 0px 0px 5px 0px;
}


.comment_list{}
.comments_rss{background: url(../images/icon-rss.jpg) 0 0 no-repeat; padding: 2px 0 0 20px;}
.comment_list li{margin: 15px 0px;}
.comment_list li .comment_avatar{float: left; margin: 5px 10px 4px 2px;}
.comment_list li .comment_text{float: right; width: 435px; color: #666; font-size: 11px;}
.comment_list li .info{
	clear:both; 
	display:block; 
	margin: 3px 0 0 0; 
	background-color: #f6f6f6;
	border: 1px solid #dfdfdf;
	padding: 3px 5px 3px 5px;
	font-size: 10px;
	color: #9d9d9d;
}
.comment_leave { margin-top: 15px;}
.comment_leave input{ margin-top: 2px;width: 150px;}
.comment_leave textarea{ width: 450px; height: 120px; margin: 5px 0}




/*** center ***************************************************************/
.center
{
	margin-top: -80px;
	background-color: #0072bc;
	background-image: url(../images/center-bg.png);
	background-repeat: no-repeat;
	background-position: 0px 90px;
	position: relative;
	padding-bottom: 10px;
}
.center .shadow
{
	position: absolute;
	top: 7px;
	left: 210px;
	width: 10px;
	height: 63px;
	background-image: url(../images/center-shadow-bg.gif);
	background-repeat: no-repeat;	
}
.center H2
{
	font-size: 16px;
	text-transform: uppercase;
	color: #49aae9;
	padding: 20px 13px 20px 0px;
	text-align: right;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
}
.center H2 BIG
{
	font-size: 18px;
	color: #ffffff;
	display: block;
	margin: 0px 0px 0px 0px;
}

.center .rss
{
	position: absolute;
	top: -15px;
	left: -30px;
}
.center .rss IMG
{
	width: 93px;
	height: 89px;
}

/*** man **********************/
.center .man
{
	position: relative;
	height: 495px;
}
.center .man IMG.man
{
	position: absolute;
	top: -10px;
	left: 25px;
	display: block;
	width: 200px;
	height: 517px;
}
.center .man IMG.legend
{
	position: absolute;
	top: 155px;
	left: 37px;
	width: 75px;
	height: 19px;
}


/*** btns ***************/
.center .btns
{
	padding: 0px 0px 10px 8px;
}
.center .btns A
{
	display: block;
	font-size: 0px;
	width: 190px;
	height: 57px;
	margin: 0px 0px 5px 0px;
	padding: 0px 0px 0px 0px;
}




/*** right ************************************************************/
.right
{
	color: #abcee1;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	padding-right: 10px;
	position: relative;
}
.right #menu
{
	margin-top: -20px;
}

.right A,
.right A:visited
{
	color: #abcee1;
}
.right A:hover
{
	color: #ffffff;
}
.right LI
{
	background-image: url(../images/li-bg.gif);
	background-repeat: no-repeat;
	background-position: 0px 5px;
	padding: 0px 0px 2px 10px;
}
.right H3
{
	font-size: 14px;
	border-bottom: 1px solid #abcee1;
	padding: 0px 0px 3px 0px;
	margin: 0px 0px 5px 0px;
}


.right .widget
{
	margin: 20px 0px 0px 0px;
	position: relative;
}
.basis .right .widget_text
{
	display: none;
	margin: 0px 0px 0px 0px;
}


/*** widget_search ***********************/
#searchform
{
	background-image: url(../images/search-bg.png);
	background-repeat: no-repeat;
	background-position: 10px 0px;
	position: relative;
	padding: 0px 0px 10px 10px;
	height: 27px;
}
#searchform LABEL,
#searchform H2
{
	display: none;
}
#searchform INPUT#s
{
	background-color: transparent;
	border: none;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	font-size: 15px;
	font-weight: bold;
	color: #0072bc;
	padding: 3px;
	width: 150px;
	height: 20px;
}
#searchform INPUT#searchsubmit
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0px;
	color: #ffffff;
	background-image: url(../images/search-btn.png);
	background-repeat: no-repeat;
	width: 28px;
	height: 27px;
	background-color: transparent;
	border: none;
	position: absolute;
	top: 0px;
	left: 170px;
}



/*** newsletter **************************************/
#sectionNewsletter
{
	position: relative;
	height: 129px;
	margin-bottom: 20px;
}
#sectionNewsletter .textwidget
{
	position: absolute;
	top: 0px;
	left: 12px;
	width: 209px;
	height: 129px;
	background-image: url(../images/newsletter-bg.png);
	background-repeat: no-repeat;
}
#sectionNewsletter .textwidget CENTER
{
	text-align: left;
}
#sectionNewsletter .textwidget H3
{
	padding: 12px 0px 0px 5px;
	font-size: 15px;
}

#sectionNewsletter .textwidget TABLE
{
	padding: 0px;
	display: block;
}


#sectionNewsletter .textwidget SMALL
{
	display: block;
	font-size: 10px;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	padding-bottom: 7px;
	margin-left: 10px;
}
#sectionNewsletter .textwidget INPUT
{
	background-image: url(../images/newsletter-input-bg.png);
	background-repeat: no-repeat;
	width: 116px;
	height: 15px;
	padding: 2px;
	border: none;
	background-color: transparent;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	margin-left: 7px;
}
#sectionNewsletter .textwidget INPUT.btn
{
	background-image: url(../images/newsletter-btn-bg.png);
	padding: 0px;
	width: 54px;
	height: 19px;
	position: absolute;
	top: 76px;
	left: 140px;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
}


#sectionNewsletter .reasons
{
	position: absolute;
	top: 110px;
	right: 0px;
	font-family: "Myriad Pro", Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	background-image: url(../images/arrow-reasons.gif);
	background-repeat: no-repeat;
	background-position: 100% 6px;
	padding-right: 10px;
	color: #0072bc;
}


/*** sectionAds160x600 ********************************/
#sectionAds160x600
{
	background-image: url(../images/center-ads-bg.png);
	background-repeat: no-repeat;
	background-position: 10px 3px;
	padding: 0px 0px 0px 42px;
	width: 160px;
	height: 600px;
}
#sectionAds160x600 H3
{
	display: none;
}









/*** footer **************************************************************/
.footer
{
	background-color: #1a3265;
	color: #ffffff;
	position: relative;
}
.footer .menu
{
}
.footer .menu UL
{
	padding: 10px 0px 0px 0px;
}
.footer .menu UL LI
{
	border-right: 1px solid #ffffff;
	display: inline;
	padding: 0px 10px 0px 10px;
}
.footer .menu UL LI.last
{
	border: none;
}
.footer .menu UL LI A,
.footer .menu UL LI A:visited
{
	color: #ffffff;
	text-decoration: none;
}
.footer .menu UL LI A:hover
{
	text-decoration: underline;
	color: #ffffff;
}

.footer .copyright
{
	position: absolute;
	top: 10px;
	right: 0px;
	padding: 0px 10px 0px 0px;
}


/*** .content styles ***/
.content{
}
.content h3{
	margin: 0 0 10px 0;
}


/* lists */
.content ul li {margin-left: .25em;}
.content ul li{ 
	padding: 0 0 4px 11px;
}

.content OL
{
	margin-bottom: 15px;
}
.content OL LI
{
	margin-bottom: 6px;
}


