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


HTML, BODY, #basic{
	height: 100%;
}


#basis{
	margin: auto;
	width: 800px;	/* width of basis */
	margin-bottom: -150px;
	display: table;
	height: auto;
	height: 100%;
	min-height: 100%;
	background-image: url(../images/basis-bg.gif);
	background-repeat: repeat-y;
}

#main{
	height: 100%;
}

#header{
	height: 100px;	/* height of header */
}

#content
{
}
#left{
	width: 200px;	/* width of left column */
	float: left;
	padding: 10px 0px 0px 8px;
}
#center{
	width: 200px;	/* width of center column */
	float: left;
	background-color: #330066;
}
#right{
	width: 570px;	/* width of right column */
	height:508px;
	overflow:auto;
	float: right;
	padding: 10px 8px 0px 0px;
}

#footer{
	width: 800px;	/* width of basis */
	margin: auto;
	height: 150px;	/* height of footer */
}


/*needed to make room for footer*/
#clearfooter{
	clear: both;
	height: 150px;	/* 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: #ffffff;
	behavior: url("js/csshover.htc");
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}
B, STRONG { font-weight: bold; }
I, EM { font-style: italic; }



A,
A:visited
{
	color: #d9220f;
	text-decoration: none;
}
A:hover
{
	color: #ff0000;
	text-decoration: underline;
}

H1
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	color: #d9220f;
	margin: 0px 0px 10px 0px;
}
H2
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	color: #000000;
	margin: 0px 0px 10px 0px;
}
H3
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #d9220f;
	margin: 0px 0px 10px 0px;
}
H4
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #000000;
	margin: 0px 0px 10px 0px;
}

P
{
	padding: 5px 0px 10px 0px;
}


#basis
{
}

/*** header **************************************************************/
#header
{
	background-image: url(../images/top.jpg);
	background-repeat: no-repeat;
	position: relative;
	background-color: #ffffff;
}

#header A#logo
{
	position: absolute;
	top: 15px;
	left: 20px;
	width: 60px;
	height: 50px;
}



/*** topmenu ***********************************/
#header .topmenu
{
	background-image: url(../images/topmenu-bg.gif);
	background-repeat: repeat-x;
	height: 20px;
	position: absolute;
	top: 80px;
	left: 0px;
	width: 800px;
}
#header .topmenu UL
{
}
#header .topmenu UL LI
{
	float: left;
	padding: 2px 0px 0px 0px;
	background-image: url(../images/topmenu-separator-bg.gif);
	background-repeat: no-repeat;
	background-position: 100% 1px;
}
#header .topmenu UL LI A,
#header .topmenu UL LI A:visited
{
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
	padding: 0px 20px 0px 20px;
}
#header .topmenu UL LI A:hover
{
	color: #ffff00;
}


/*** left ********************************************/
#left .box
{
	border: 1px solid #cccccc;
	background-color: #f7f7f7;
	margin-bottom: 10px;
}
#left .box H2
{
	background-image: url(../images/topmenu-bg.gif);
	background-repeat: repeat-x;
	height: 18px;
	padding: 2px 0px 0px 5px;
	color: #ffffff;
	font-size: 12px;
	margin: 0px;
}
#left .box .cnt
{
	padding: 5px;
	font-size: 11px;
}
#block-user-1
{
	font-size: 11px;
}
#block-user-1 UL
{
	padding-bottom: 0px;
}
#block-user-1 UL LI A.active
{
	font-weight: bold;
}



/*** right ADMIN ******************************/
#right FIELDSET
{
	border: 1px solid #cccccc;
	padding: 5px;
	margin-bottom: 10px;
}
#right TABLE
{
	width: 100%;
	margin-bottom: 10px;
}
#right TABLE TH,
#right TABLE TD
{
	font-size: 11px;
	padding: 2px;
}
#right TABLE TH
{
	font-weight: bold;
	color: #000000;
	font-size: 12px;
}
#right TABLE .ok TH,
#right TABLE .ok TD,
#right TABLE .error TH,
#right TABLE .error TD
{
	padding-left: 30px;
}
#right TABLE .region,
#right TABLE .module
{
	background-color: #DADADA;
}
#right H1.title
{
	font-size: 18px;
	margin: 0px 0px 10px 0px;
}

#right DL DT
{
	margin-top: 5px;
	font-weight: bold;
}




/*** breadcrumb *****************************/
.breadcrumb
{
	color: #000000;
	font-size: 11px;
	display: none;
}
.breadcrumb A,
.breadcrumb A:visited
{
	background-image: url(../images/breadcrumb-li-bg.gif);
	background-repeat: no-repeat;
	background-position: 100% 4px;
	padding: 0px 10px 0px 0px;
	margin-right: 1px;
}



/*** right *******************************/
#right
{
	padding-bottom: 10px;
}

/*** user-login **************************/
#user-login
{
}
#user-login .description
{
	display: none;
}






/*** designList ***************************************/
.designList
{
}
.designList TABLE,
.orderList TABLE
{
	border: 1px solid #e7e7e7;
}
#right .designList .designName
{
	font-size: 12px;
	font-weight: bold;
	color: #d9220f;
	width: 25%;
}
#right .designList TH,
#right .orderList TH
{
	padding: 3px 4px 3px 5px;
	border: none;
	background-image: url(../images/topmenu-bg.gif);
	background-repeat: repeat-x;
	color: #ffffff;
}
#right .designList TD,
#right .orderList TD
{
	border-bottom: 1px solid #e7e7e7;
	vertical-align: top;
	padding: 5px 3px 5px 5px;
	background-image: url(../images/td-bg.gif);
	background-repeat: repeat-x;
	background-position: 0px 100%;
}
.designList .img
{
}
.designList .img IMG,
.orderList .img IMG
{
	padding: 2px;
	background-color: #ffffff;
	border: 1px solid #e7e7e7;
	margin-right: 3px;
}
.designList
{
}





.orderList TD.img
{
	width: 120px;
}
.orderList TD.img A.title
{
	display: block;
	margin: 2px 0px 2px 0px;
	color: #999999;
	font-size: 9px;
}
.orderList TD.img A.title SMALL
{
	color: #d9220f;
	font-size: 9px;
}
#right .orderList .subtotal
{
	font-size: 15px;
	font-weight: bold;
	color: #d9220f;
}
#right .orderList TD.price
{
	font-size: 15px;
	font-weight: bold;
}
.orderList .price SMALL
{
	color: #999999;
	font-size: 9px;
	display: block;
	white-space: nowrap;
}


/*** design *********************************/
.design
{
}
.design .img
{
	margin-bottom: 15px;
}
.design .img IMG
{
	background-color: #ffffff;
	padding: 10px;
	border: 1px solid #e7e7e7;
	/*width: 500px;*/
}
.design .img A,
.design .img A:visited
.design .img A:hover
{
	text-decoration: none;
}
.design .img A SMALL
{
	font-size: 11px;
}
.design .img A:hover SMALL
{
	text-decoration: underline;
}
.images A
{
	display: block;
	margin-bottom: 20px;
}

A.view
{
	display: block;
	background-image: url(../images/icon-view.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 1px 0px 5px 18px;
}
A.edit
{
	display: block;
	background-image: url(../images/icon-edit.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 1px 0px 5px 18px;
}
A.delete
{
	display: block;
	background-image: url(../images/icon-delete.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 1px 0px 5px 18px;
}
A.manage
{
	background-image: url(../images/icon-manage.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
	padding: 0px 0px 0px 18px;
	margin: 0px 0px 3px -15px;
	display: block;
	height: 14px;
}
A.addDesign
{
	background-image: url(../images/icon-add-design.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
	padding: 0px 0px 0px 18px;
	margin: 0px 0px 3px -15px;
	display: block;
	height: 14px;
}
A.addOrder
{
	background-image: url(../images/icon-add-order.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
	padding: 0px 0px 0px 18px;
	margin: 0px 0px 3px -15px;
	display: block;
	height: 14px;
}
A.addRequest
{
	background-image: url(../images/icon-request.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	padding: 1px 0px 0px 18px;
	margin: 0px 0px 3px -15px;
	display: block;
	height: 14px;
}



/*** orderDetails *************************/
.orderDetails
{
}
.orderDetails .box
{
	border: 1px solid #e7e7e7;
	padding: 5px 3px 5px 5px;
	background-image: url(../images/td-bg.gif);
	background-repeat: repeat-x;
	background-position: 0px 100%;
	float: left;
	width: 47%;
	margin: 0px 3px 0px 3px;
}
.orderDetails .box H3
{
	margin: 0px 0px 10px 0px;
	border-bottom: 1px solid #e7e7e7;
	color: #000000;
	padding: 0px 0px 5px 0px;
}
#right .orderDetails .box TABLE
{
	margin: 0px;
}
.orderDetails .box TBODY,
.orderDetails .box THEAD,
.orderDetails .box TH
{
	vertical-align: top;
	border: none;
	font-weight: bold;
}
#right .orderDetails .box TABLE TD
{
	vertical-align: top;
	font-weight: normal;
	padding-left: 10px;
}
#right .orderDetails .box .price
{
	padding-bottom: 5px;
}
#right .orderDetails .box TD.price
{
	font-weight: bold;
	color: #d9220f;
	font-size: 14px;
}
#right .orderDetails .box TH.postage,
#right .orderDetails .box TH.discount
{
	background-image: url(../images/icon-postage.gif);
	background-repeat: no-repeat;
	background-position: 0px 1px;
	padding-left: 20px;
}
#right .orderDetails .box TH.discount
{
	background-image: url(../images/icon-discount.gif);
	background-position: 0px 6px;
}
#right .orderDetails .box .discount
{
	padding-top: 5px;
	border-top: 1px solid #e7e7e7;
}
#right .orderDetails .box .postage
{
	padding-bottom: 5px;
}

#right .orderDetails .box TD.subtotal
{
	text-align: right;
	font-weight: bold;
	color: #d9220f;
	font-size: 16px;
	border-top: 1px solid #e7e7e7;
}
#right .orderDetails .ownImages
{
	margin: 0px 0px 0px 0px;
	padding: 0px;
}

.orderDetails .ownImages A.ownImg,
.orderDetails .ownImages A:visited.ownImg
{
	text-decoration: none;
	float: left;
	width: 60px;
	text-align: center;
}
.orderDetails .ownImages IMG
{
	border: 1px solid #e7e7e7;
	padding: 2px;
	background-color: #ffffff;
	margin-bottom: 1px;
}
.orderDetails .ownImages A.ownImg SMALL
{
	font-size: 11px;
}
.orderDetails .ownImages A:hover.ownImg SMALL
{
	text-decoration: underline;
}





/*** paypal *******************************/
.paypal
{
}
.paypal .btn
{
	background-image: url(../images/btn-paypal.gif);
	background-repeat: no-repeat;
	width: 160px;
	height: 26px;
	margin: 20px auto 10px auto;
	border: 1px solid #FE0405;
	color: #FE0405;
	font-size: 0px;
}




/*** shirtTypes *****************************/
.shirtTypes
{
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
	padding: 5px 0px 5px 0px;
	margin-bottom: 10px;
}
.shirtType
{
	float: left;
	width: 80px;
}
.shirtType .title
{
	font-size: 11px;
	color: #000000;
	font-weight: bold;
	text-align: center;
	margin: 3px 0px 0px 0px;
}
.shirtType .img
{
}
.shirtType .price
{
	font-size: 11px;
	text-align: center;
}
.shirtType .price STRONG
{
	font-weight: bold;
	padding: 0px 0px 0px 4px;
	color: #d9220f;
	font-size: 12px;
}








/*** faq ******************************************/
.faq .questions
{
	margin-bottom: 15px;
	padding: 10px 0px 10px 0px;
	border-top: 1px solid #000000;
	border-bottom: 1px solid #000000;
}
.faq .questions LI,
.faq .answers DT
{
	background-image: url(../images/icon-question.gif);
	background-repeat:no-repeat;
	background-position: 0px 0px;
	padding: 0px 0px 5px 20px;
}
.faq .answers DD
{
	margin-bottom: 10px;
}


/*** policy *************************************/
.policy
{
}
.policy OL
{
	list-style: decimal;
	margin-left: 22px;
}
.policy OL LI
{
	margin-bottom: 3px;
}
.policy OL LI H4
{
	font-size: 14px;
	margin: 10px 0px 5px 0px;
}
.policy OL LI UL
{
	margin-left: 22px;
	list-style: square;
}



#node-form #edit-preview
{
	display: none;
}



/*** footer **************************************************************/
#footer
{
	background-image: url(../images/footer_home.jpg);
	background-repeat: no-repeat;
	background-position: 0px 20px;
	position: relative;
	background-color: #ffffff;
}

#footer .menu1
{
	background-image: url(../images/topmenu-bg.gif);
	background-repeat: repeat-x;
	height: 20px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 800px;
}
#footer .menu1 UL
{
}
#footer .menu1 UL LI
{
	float: left;
	padding: 2px 0px 0px 0px;
	background-image: url(../images/topmenu-separator-bg.gif);
	background-repeat: no-repeat;
	background-position: 100% 1px;
}
#footer .menu1 UL LI A,
#footer .menu1 UL LI A:visited
{
	color: #ffffff;
	font-weight: bold;
	text-decoration: none;
	padding: 0px 20px 0px 20px;
}
#footer .menu1 UL LI A:hover
{
	color: #ffff00;
}



#footer .menu2
{
	position: absolute;
	top: 103px;
	left: 0px;
	width: 800px;
	text-align: center;
	color: #cccccc;
}
#footer .copyright
{
	position: absolute;
	top: 123px;
	left: 0px;
	width: 800px;
	text-align: center;
	font-size: 11px;
	color: #777777;
	line-height: 12px;
}












