/*///////////////////////////////////////////////////
CSS Document for Sue Crockett Photography
Media: Screen
/////////////////////////////////////////////////*/

/*------------------------------------------
Google custom search
------------------------------------------*/
#contentSresults{
	float:left;
	margin-left:30px;
	width: 747px;
	overflow: hidden;
}

/*------------------------------------------
General Layout
------------------------------------------*/



* {margin: 0; padding: 0;}

body {  
	font-family: Verdana, Helvetica, sans-serif;
	color: #797979;
	text-align: center;
	background: #9EC5C4 url(images/scp_gradient_bg_rpt.png) repeat-x;
	font-size: 70%;
	}
	
#cont {
	position: relative;
	text-align: left;
	margin: 0 auto;
	width: 780px;
	}
	
#cont-bg {background: url(images/scp_content_bg_rpt.png) repeat-y; float: left;}	
#cont-bg-top {background: url(images/scp_content_bg_top.png) no-repeat; width: 780px; min-height: 330px;}
img {
border: 0;
}


/*------------------------------------------
Header
------------------------------------------*/

#header {background: url(images/spc_banner_grad.gif) repeat-x bottom; width: 750px; margin: 0 0 0 15px; height: 97px;}
#logo {position: absolute; top: 29px; left: 43px;}

#search-bar {
	position: absolute; 
	left: 523px; 
	top: 39px; 
	height:25px;

}

#search-bar #keywords {
	border: 1px #9AB984 solid;
	padding: 3px;
	margin: 1px 10px 0 0;
	font-size: 11px;
	color: #797979;
	width: 140px;
	float: left;
}



#search-bar #submit-search {cursor: pointer;}

/*------------------------------------------
Added in for Custom Google Search 
------------------------------------------*/
#search-input{
	margin-bottom:6px;
}	
#submit-search {
	margin-top:0px;
}

/*------------------------------------------
Menu
------------------------------------------*/

	
ul#menu {
	background: url(images/scp_nav_bg.png) repeat-x 0 50%;
	margin: 0 0 0 15px;
	padding: 1px 0 1px 0;
	width: 750px;
	height: 30px;
	border-top: 1px #9AB984 solid;
	border-bottom: 1px #9AB984 solid;
	}

ul#menu li {
	list-style: none;
	display: inline;
	float: left;
	margin: 0;
	text-align: center;
	
	}
	
ul#menu a {
	display: block;
	float: left;
	font-size: 10px;
	color: #fff;
	font-weight: bolder;
	text-decoration: none;
	height: 30px;
	line-height: 30px;
	padding: 0 15px;
	border-right: 1px #fff solid;
	}
	
ul#menu li a:hover {background: url(images/scp_nav_hover.png) repeat-x ;}
ul#menu li#active a {background: url(images/scp_nav_active.png) repeat-x;}


/*------------------------------------------
Content-Index
------------------------------------------*/

#banner {
	width: 750px;
	height: 100px;
	background: url(images/spc_banner_index.jpg) no-repeat;
	margin: 0 0 0 15px; 
	display: inline;
	float: left;
	padding: 0 0 1px 0;
	border-bottom: 1px #9AB984 solid;
}

#i-col-left {
	width: 465px;
	float: left;
	display: inline;
	margin: 0 0 0 15px;
	padding: 25px;
}

#i-col-left p {line-height: 175%;}
#i-col-left p img {float: left; padding: 0 20px 20px 0;}

#quotebox {
	background: url(images/scp_quote_bgtopleft.gif) no-repeat left top;
	border-bottom: 1px #F2F5EE solid;
	margin: 0 0 20px 0;
	padding: 0 0 10px 0;
}

#quotebox p {
	line-height: 145%;
	color: #94B47D;
	font-size: 130%;
	font-family: Georgia, Times New Roman, Times, serif;
	padding: 30px 30px 0 30px;
}

#quotebox p.author {
	background: url(images/scp_quote_bgbottomright.gif) no-repeat right;
	color: #7EA563;
	text-align: right;
	padding: 10px 30px 30px 0;
	font-weight: bolder;
}

#i-col-right {
	float: left;
	padding: 25px 25px 25px 0;
	display: inline;
	margin: 0 15px 0 0 ;
}

/*------------------------------------------
Content-Articles Etc...
------------------------------------------*/

#pageheader {
	width: 750px;
	height: 40px;
	display: inline;
	margin: 0 0 0 15px;
	float: left;
	background: #E8EDE2;
	border-bottom: 1px #9AB984 solid;
	padding: 0 0 1px 0;
}

#pageheader h2 {
	float: left;
	color: #000;
	font-size: 22px;
	margin: 7px 0 0 0;
	font-weight: normal;
	text-indent: 28px;
}

#pageheader span {float: right; color: #729657; margin: 13px 20px 0 0;}
#pageheader a:link, #pageheader a:visited {color: #57918F; font-weight: bolder; text-decoration: underline;}
#pageheader a:hover, #pageheader a:active {color: #57918F; font-weight: bolder; text-decoration: none;}

#content {float: left; padding: 25px 25px 25px 0px; width: 470px;}
#content h3 {
	font-size: 175%;
	font-weight: normal;
	color: #000;
	border-bottom: 1px #E8EDE2 solid;
	padding: 0 0 10px 0;
	margin: 0 0 20px 0;
	background: url(images/scp_h3icon.gif) no-repeat right;
	clear: both;
}

#content h4 {
	text-align: right;
	color: #9AB984;
	font-size: 11px;
	margin: -15px 0 15px 0;
}

#content ul {
	float: left;
	clear: both;
	width: 200px;
	margin: 0 0 10px 20px;
	display: inline;
}

#content ul li {
	background: none;
	list-style: none;
	float: left;
	width: 180px;
	margin: 0 0 3px 0;
	background: url(images/scp_subsubnav_bullet.gif) no-repeat 0 50%;
	padding: 0 0 0 16px;
}

#content p {float: left; clear: both; width: 100%; line-height: 175%; margin: 5px 0 15px 0; text-align: justify;}
#content p img {float: left; clear: both; margin: 0 20px 20px 0; padding: 5px; border: 1px solid #E8EDE2;}

#content #magazines {
	float: left;
	clear: both;
	width: 480px;
	margin: 0 0 10px 0;
}

#content #magazines img {
	float: left;
	clear: none;
	margin: 0 7px 20px 0;
	padding: 2px;
	border: 1px solid #E8EDE2;
}

#content a:link, #content a:visited {color: #709455; text-decoration: underline;}
#content a:hover, #content a:active {color: #57918F; text-decoration: none;}

#content .btn-add {float: left; clear: both; width: 400px; margin-top: 10px; padding-left: 18px; background: url(images/scp_btn_add.png) no-repeat 0 3px;}

/*------------------------------------------
Order Form / Checkout...
------------------------------------------*/

#content dl {float: left; border-top: 1px solid #709455; padding: 10px; width: 450px;}	
#content dl.alt {background: #F1F4EE;}

#content p.subtotal {
	width: 460px;
	border-top: 1px solid #709455;
	border-bottom: 1px solid #709455;
	color: #FFF;
	font-weight: bolder;
	background: #709455;
	text-align: right;
	padding: 0 10px 0 0;
	float: left;
}

#content dt {font-size: 17px; color: #000;}
#content dt img {float: left; padding: 5px 10px 10px 0;}
#content dd.desc {padding: 5px 0 0 0;}
#content dd.price {text-align: right; font-weight: bolder;}
#content dd.remove {text-align: right;}

#btn-checkout {
	clear: both;
	width: 192px;
	height: 22px;
	margin: 15px 0 0 0;
	background: url(images/scp_btn_checkout.png) no-repeat 0 0;
}

#btn-checkout span {display: none;}
#checkoutform {margin-top: 15px;}

#orderform label, #orderform input, #orderform select, #orderform textarea, #checkoutform input {float: left; clear: both;}
#orderform input, #orderform textarea {border: 1px #A8B685 solid; padding: 2px; margin: 2px 0 15px 0; font-family: Verdana, Helvetica, sans-serif; font-size: 11px;}
#orderform input, #orderform label {width: 200px;} 
#orderform input#submit, #checkoutform input#submit { width: auto; border: 0;}
#orderform textarea {width: 300px; height: 100px;}
#orderform span {color: #CC0000;}

#order-payment {
	width: 460px;
	float: left; clear: both;
	margin-top: 10px;
	padding: 10px 0;
	border-top: 1px solid #709455;
}

#order-payment p {clear: both;}

#form-error {
	float: left;
	clear: both;
	padding: 5px 10px;
	margin: 10px 0;
	width: 100%;
	color: #FFF;
	background: #CC0000;
}

#form-error h4 {
	float: left;
	margin: 5px 0 0 0;
	padding: 0;
	font-size: 20px;
	color: #FFF;
	font-weight: bolder;
}

#form-error p {float: left; clear: both;}
.results h5 {font-size: 16px; margin-bottom: 5px;}

/*------------------------------------------
Subnav
------------------------------------------*/

#subnav {
	float: left;
	width: 220px;
	padding-left:28px;
	background: url(images/scp_subnav_topbgfade.png) no-repeat left top;
	margin: 0 0 0 15px;
	display: inline;
}

#subnavul {width: 192px; margin: 28px 0 0 0px;}

#subnavul li {
	background: none;
	list-style: none;
	float: left;
	margin: 0 0 1px 0;
	}
	
#subnav a {
	display: block;
	float: left;
	font-size: 10px;
	color: #729657;
	text-decoration: none;
	line-height: 22px;
	}

#subnavul li a { width: 192px; height: 22px; background:  url(images/scp_submenu_bg.png) no-repeat; padding: 0 0 0 24px;}
#subnavul li a:hover {background-position: 0 -22px; color: #567142;}
#subnavul li.active a, #subnavul li.active a:hover {width: 192px; height: 22px; background: url(images/scp_submenu_bg.png) no-repeat; background-position: 0 -44px;  font-weight: bolder; color: #518685;}

#subnav p { float: left; display: inline; margin: 15px 0 15px 30px; width: 183px; color: #9AB984; line-height: 150%; }
#subnav p a:link, #subnav p a:visited {color: #709455; text-decoration: none;}
#subnav p a:hover, #subnav p a:active {color: #57918F;text-decoration: underline;}

#subnav #plain {
	float: left;
	display: inline;
	color: #9AB984;
	margin: 25px 0 15px 30px;
}

#subnav #plain li {float: left; clear: both; border-bottom: 1px solid #DEE8D7;}

#subnav #plain li a {
	font-size: 11px;
	width: 180px;
	margin: 0;
	padding: 0;
	background: none;
}

#subnav #plain li a .active {background: none;}

#subnav #sub-copy {
	margin-top: 9px;
	float: left;
}
#subnav #sub-copy h4 {
	margin-bottom: 1px;
}
#subnav #sub-copy p {
	margin: 0;
	color: #797979;
	line-height: 175%;
}

#subnav #sub-copy a {
	display: inline;
	float: none;
	font-size: 11px;
	line-height: 175%;
}

/*------------------------------------------
SubSubNav
------------------------------------------*/

#subsubnavul {
	float: left;
	width: 140px;
	margin: 10px 0 15px 0px;
	display: inline;
}

#subsubnavul li {
	background: none;
	list-style: none;
	float: left;
	width: 150px;
	/*border-bottom: 1px solid #E8EDE2;*/
	margin: 0 0 1px 0;
	background: url(images/scp_subsubnav_bullet.gif) no-repeat 0 5px;
	padding: 0 0 5px 14px;
	
	}
	
#subsubnavul li a:link, #subsubnavul li a:visited, #subsubnavul .active a:hover  {color: #709455; text-decoration: none; line-height: 14px;}
#subsubnavul li a:hover, #subsubnavul li a:active {color: #57918F;text-decoration: underline;}
#subsubnavul .active {text-decoration: none; font-weight: bolder;}

/*------------------------------------------
PhotoFindBox
------------------------------------------*/

#i-photofind {
	width: 183px;
	background: #F2F5EE;
	border: 1px #9AB984 solid;
	padding: 15px 10px 10px 10px;
	float: left;
}

#i-photofind h2 {
	background: url(images/txt_find_my_photos.gif) no-repeat;
	border-bottom: 6px #9AB984 solid;
	text-indent: -10000px;
	line-height: 20px;
}

#i-photofind p {
	border: 1px #D5DEC9 solid;
	background: #F8FAF5;
	color: #709456;
	font-size: 90%;
	padding: 10px;
	margin: 10px 0 8px 0;
}

#i-photofind form {color: #000; position: relative;}
#i-photofind .clear {clear: both;}
#i-photofind #fp-showname {width: 182px;}
#i-photofind #fp-datesst, #i-photofind #fp-datesnd {width: 75px;}
#i-photofind .clear span {color: #858585;}
#i-photofind input, #i-photofind select {margin: 2px 0 8px 0; border: 1px #9AB984 solid; padding: 2px; font-size: 11px; color: #797979;}
#i-photofind #fp-keywords {width: 176px;}
#i-photofind #submit {border: 0; float: right;}

/*------------------------------------------
Photo Gallery
------------------------------------------*/

#photo-gallery {float: left; display: inline;}
#photo-gallery li {
	float: left;
	display: inline;
	width: 100px;
	height: 110px;
	list-style: none;
	text-align: center;
	margin: 7px 7px 20px 7px;
}

#photo-gallery .pg-box {
	float: left;
	display: inline;
	width: 100px;
	height: 100px;
	background: url(images/sue_photo_bg.png) no-repeat center center;
}

#photo-gallery img {margin-top: 14px;}
#photo-gallery li span {float: left; display: inline; margin: 2px 0 0 12px;}
#photo-gallery a:link, #photo-gallery a:visited {color: #518685; text-decoration: none;}
#photo-gallery a:hover, #photo-gallery a:active {color: #518685; text-decoration: underline;}
#photo-gallery .pg-add {padding-left: 15px; background: url(images/scp_btn_add.png) no-repeat 0 0;}
#photo-gallery .pg-info {margin-left: 2px; padding-left: 15px; background: url(images/scp_btn_info.png) no-repeat 0 0;}
.photo-img {float: left; padding: 3px; border: 1px #9AB984 solid;}

#photo-details {
	float: left;
	width: 448px;
	padding: 10px;
	margin: 15px 0 0 0;
	background: #F2F5EE;
	border: 1px #9AB984 solid;
}

#photo-details p {color: #709455; line-height: 135%; margin: 0; padding: 0;}
#photo-details .sprice {font-weight: bolder; margin: 0 0 10px 0;}
#photo-details .btn-add {padding-left: 15px; background: url(images/scp_btn_add.png) no-repeat 0 0;}

#photo-details a:link, #photo-details a:visited {
	float: left;
	margin-top: 15px;
	color: #518685;
	text-decoration: none;
}

#photo-details a:hover, #photo-details a:active {
	float: left;
	margin-top: 15px;
	color: #518685;
	text-decoration: underline;
}

#photo-back {margin-top: 10px; font-size: 12px; font-weight: bolder;}

/*------------------------------------------
Gallery
------------------------------------------*/

#content ul#imgs {
	float: left;
	width: 490px;
	margin: 0;
}

#content ul#imgs li {
	float: left;
	list-style: none;
	height: 110px;
	width: 96px;
	margin: 7px;
	padding: 4px;
	background: url(images/sue_photo_bg.png) no-repeat 0 0;
}

#content ul#imgs li img {padding: 10px 10px 0 10px;}
#content ul#imgs li span {float: left; clear: both; margin: 15px 0 0 0; width: 100%; }
#content ul#imgs li span a:link, #imgs li span a:visited {float: left; color: #518685; text-decoration: none;}
#content ul#imgs li span a:hover, #imgs li span a:active {float: left; color: #518685; text-decoration: underline;}
#content ul#imgs li .btn-view {margin-left: 10px; padding-left: 15px; background: url(images/scp_btn_info.png) no-repeat 0 0;}

#content ul#imgs li .new-btn-view {
	margin-left: 10px; 
	padding-left: 15px; 
}

#content ul#imgs li .btn-add {margin-top: 0; width: 20px; padding-left: 15px; background: url(images/scp_btn_add.png) no-repeat 0 0;}

/*------------------------------------------
Forms
------------------------------------------*/

#mail_form {margin: -20px 0 0 0; background-color: #FDFDFD; border: 1px solid #A8B685; padding: 20px 0 0 35px; float: left; width: 430px;}
#mail_form label {
	float: left;
	clear: both;
	width: 90px;            
	padding: 0 10px 0 0;
	font-weight:bold;
	color: #666;
}

#mail_form input, #mail_form textarea {
	float: left; 
	clear: both;
	margin-bottom: 10px;
	background: #FFF;
	border: 1px solid #A8B685;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 100%;
	padding: 2px;
	width: 300px;
}

#mail_form input { width: 200px;}

#mail_form .submit {border: 0; width: 52px; float: left; margin: 0 16px 10px 0; padding-bottom: 10px;}
.results td {padding: 20px 0 10px 0; border-bottom: 1px solid #A8B685;}

/*------------------------------------------
Attachments
------------------------------------------*/

.att {
	float: left;
	clear: both;
	width: 100%;
	margin: 5px 0;
	padding-bottom: 10px;
	border-bottom: 1px #E8EDE2 solid;
}

.att h5 {
	float: left;
	clear: both;
	width: 100%;
	padding-bottom: 5px;
	margin-bottom: 10px;
	border-bottom: 1px #E8EDE2 solid;
}

.att a {float: left; clear: both; margin: 0 0 3px 10px; background: url(images/scp_subsubnav_bullet.gif) no-repeat 0 50%; padding: 0 0 0 14px;}

#contactsent {
	float: left;
	display: inline;
	margin: 0 0 20px 0;
	padding: 10px 20px 10px 70px;
	border-bottom: 1px solid #9AB984;
	border-top: 1px solid #9AB984;
	background: #E8EDE2 url(images/scp_contactsent.gif) no-repeat 10px center;
	width: 380px;
}

/*------------------------------------------
Footer
------------------------------------------*/

#footer {
	float: left;
	background: url(images/scp_footer_bg.png) no-repeat;
	width: 780px;
	height: 47px;
	position: relative;
	}
	
#footer p {font-size: 90%; color: #fff; padding: 11px 0 0 25px;}
#footer p a:link {color: #fff; text-decoration: none;}
#footer p a:visited {color: #fff; text-decoration: none;}
#footer p a:hover {color: #fff; text-decoration: underline;}
#footer p a:active {color: #fff; text-decoration: none;}
#footer p span {position: absolute; right: 25px;}