/**
    * Stylesheet created by Mobile District, 2009 Eric Veren
	* This style sheet in its original format validates according to W3C standards. In conjunction 
	  with the (X)HTML used in the layout, the page is web standards compliant and error free. 
	  Please make sure to add IE-specific styling	to the 'ie_fixes.css' file to preserve the 
	  standards compliance.
**/

/* ================================================================================================= 
# [Table of contents] 
#  
# 0. CSS Imports
# 1. Globals / styling that all other classes and id's extend (body, headers, anchors, block-levels)
# Layout 
# 	2a. Container / #outer_shell
# 	3a. Header
# 	3b. Top Menu
# 	3c. Main Navigation
# 	4a. Banner / banner title
# 	4b. Login elements / login messages
# 	5a. Content wrapper / Conent left and right sections
# 	5b. Side ads
#	5c. Side menu
#	6a. Content bottom / push
#   7a. Footer elements
#   8a. Landing page styles
#   8b. Single column internal page styless
#   9a. Major content features
#
#  !! Specific styling that isn't contingent to layout is in 'formatting.css'
# =============================================================================================== */


/* ===================>> 0. IMPORTS <<========================================================== */
@import url("resets.css"); /* reset all base styles and browser defaults */
@import url("formatting.css"); /* content formatting for divs, reusable classes, styling elements */


/* ===================>> 1. GLOBALS <<========================================================== */
body {
    background: #c5cbd0 url('../../images/layout/bgd_internal_page.jpg') 0 0 repeat-x; margin:0;
	font:normal 0.83em/1.1 Arial, Helvetica, Verdana, sans-serif;
	color:#333;
}

h1, h2, h3, h4, h5 { line-height:1; font-weight:bold; margin:1em 0 .15em ; }
	
h1 { font:normal 1.5em/1.05 "Myriad Pro", "Myriad", Helvetica, Arial, Verdana, sans-serif; }
h2 { font-size:1.3em; }
h2.sectionHeader { border-bottom:1px solid #214859; color:#214859;}
h3 { font-size:1.25em; }
h4 { font-size:1.1em; }
h5 { font-size:0.9em; } 

a { text-decoration:none; outline:none; color:#0066CC;}
a:hover {color:#aaa;}
a img {	background:none; border:none; }

hr { border:0; height:1px; size:1px; color:#aaa; background:#aaa; margin:.75em 0; }
p {padding:0 .6em 1em 0;}
blockquote {margin:1.5em 2.2em; padding:.8em 1.25em; border:2px solid #ddd; border-width:0 2px; background:#f5f5f5; }
fieldset {border:1px solid #ccc; padding:1em; margin:1.25em 0;}
fieldset legend {font-weight:bold; margin-bottom:1.25em;}


/* ===================>> 2. LAYOUT <<================================================== */

/* 2.a ------------------------------------------------------- */
#outer_shell {
    width: 964px; max-width: 964px; margin:0 auto; position:relative; min-height:100%; height:auto !important;
}

/* 3.a ------------------------------------------------------- 
#header {height:106px; position:relative; background: url('../../images/layout/bgd_header.jpg') 0 0 no-repeat;}
*/



/* 3.b ------------------------------------------------------- */
#top_menu {position:absolute; right:16px; padding-left:5px; background: url('../../images/layout/bgd_topmenu_left.gif') 0 0 no-repeat;}
	#top_menu .middle {min-width:208px; height:22px; background: url('../../images/layout/bgd_topmenu.gif') 0 0 repeat-x; float:left;}
	#top_menu .right {width:5px; height:22px; background: url('../../images/layout/bgd_topmenu_right.gif') 0 0 no-repeat; float:left;}
	
	#top_menu ul { overflow:auto; color:#fff; }
	#top_menu li { float:left; display:block; padding:2px 10px; background: url('../../images/layout/topmenu_divider.gif') 100% 50% no-repeat;}
		#top_menu li.end {background:none;}
	#top_menu li a { color:#fff; text-decoration:none;}
	#top_menu li a:hover { color:#ff0; }


/* 3.c ------------------------------------------------------- */
#main_nav {position:absolute; right:14px; top:42px; padding-left:8px; background: url('../../images/layout/bgd_navbox_left.gif') 0 0 no-repeat;}
	#main_nav .middle {min-width:420px; height:45px; background: url('../../images/layout/bgd_navbox.gif') 0 0 repeat-x; float:left;}
	#main_nav .right {width:8px; height:45px; background: url('../../images/layout/bgd_navbox_right.gif') 0 0 no-repeat; float:left;}
	
	#main_nav ul { overflow:auto; color:#fff; }
	#main_nav li { float:left; display:block; padding:14px 11px 0 11px; font:bold 1.1em Helvetica, Arial, sans-serif; }
	#main_nav li a { color:#dee9eb; text-decoration:none;}
	#main_nav li a:hover { color:#fff; }
		#main_nav li.cart a { background: url('../../images/layout/cart.gif') 100% 40% no-repeat; padding-right:22px;}
		#main_nav li.cart a:hover { background-image: url('../../images/layout/cart_hover.gif');}


/* 4.a ------------------------------------------------------- */
#banner {height:87px; position:relative; background: url('../../images/layout/bgd_banner_internal.jpg') 0 0 no-repeat;}

	h1.banner-title {position:absolute; z-index:3; top:21px; left:20px; font:normal 2.65em 'Myriad Pro', Helvetica, Arial, sans-serif; color:#fff; background:none; padding:0; margin:0; }
	#yspnc_internal {position:absolute; z-index:2; top:54px; width:358px; height:17px; background: url('../../images/layout/yspnc_trans.png') 0 0 no-repeat;}
	
	
	ul.banner-btns {position:absolute; top:36px; left:47px; z-index:2;}
		.banner-btns li {margin-bottom:7px;}
		.banner-btns li a {height:49px; width:197px; display:block; cursor:pointer;}
			li#banner_btn_1 a {background: url('../../images/layout/banner_btn1.jpg') 0 0 no-repeat;}
			li#banner_btn_1 a:hover {background-image: url('../../images/layout/banner_btn1_hover.jpg');}
			li#banner_btn_2 a {background: url('../../images/layout/banner_btn2.jpg') 0 0 no-repeat;}
			li#banner_btn_2 a:hover {background-image: url('../../images/layout/banner_btn2_hover.jpg');}
			li#banner_btn_3 a {background: url('../../images/layout/banner_btn3.jpg') 0 0 no-repeat;}
			li#banner_btn_3 a:hover {background-image: url('../../images/layout/banner_btn3_hover.jpg');}
			
#banner_overlay {display:none;}

/* 4.b ------------------------------------------------------- */
#login { height:155px; width:210px; padding:10px 15px; background: url('../../images/layout/login_box.png') 0 0 no-repeat; position:absolute; top:27px; right:-12px; z-index:3;}
#login label {font-size:0.83em; color:#666;}
	.login-input {color:#aaa; border:2px solid #939393; height:21px; padding:2px 0 2px 5px; width:200px; margin-bottom:5px; 
		background: url('../../images/layout/bgd_login_input.jpg') 0 0 repeat-x;
	}
	#login_btn {background: url('../../images/layout/login_btn.jpg') 0 0 no-repeat; height:29px; width:74px; border:none; cursor:pointer; float:right; margin-top:3px;}
	#login_btn:hover {background-image: url('../../images/layout/login_btn_hover.jpg');}

	#login_btn2 {background: url('../../images/layout/login_btn.jpg') 0 0 no-repeat; height:29px; width:74px; border:none; cursor:pointer; margin-top:0px;}
	#login_btn2:hover {background-image: url('../../images/layout/login_btn_hover.jpg');}
	
	.login-options {float:left; margin-top:4px; font-size:0.7em; width:130px; }
		.login-options ul { }
		.login-options ul li {padding-bottom:6px; }
		.login-options a {color:#888;}
		.login-options a:hover {color:#000;}
		
	#login_messages {display:none; position:absolute; top:173px; right:8px; z-index:2; width:190px; background:#333; border:2px solid #FF9900; padding:17px 6px 6px; font-size: 0.9em; color:#f90;} 
		
	#internal_loggedin {position:absolute; top:0; right:16px; padding-left:7px; background:url('../../images/layout/loggedin_left.jpg') 0 0 no-repeat;}
		#internal_loggedin .middle {height:27px; padding:9px 4px 0; background: url('../../images/layout/loggedin_bgd.jpg') 0 0 repeat-x; float:left;}
		#internal_loggedin .right {width:7px; height:36px; background: url('../../images/layout/loggedin_right.jpg') 0 0 no-repeat; float:left;}
		#internal_loggedin a.log-out {font-weight:bold; font-size:0.9em; }
	
/* 5.a ------------------------------------------------------- */
#content_wrapper {width:964px; margin:16px 0; background:url('../../images/layout/bgd_content_internal.jpg') center top repeat-y;}
#content {min-height:223px; padding:20px 14px 0 20px; background:url('../../images/layout/bgd_content_top_internal.jpg') 0 0 no-repeat;}

.content-left {float:left; position:relative; width:645px;  }
.content-right {float:right; position:relative; width:265px; }
	.content h1 {color:#163A50; margin-bottom:1em; background:#dce9f1; padding:4px 0 4px 7px; border:1px solid #d0dae0; border-width:1px 0; }
	.content ul, .content ol { margin-left:1.5em; padding-bottom:1em;}
	.content ul li {list-style-type:disc;}
	.content ol li {list-style-type:decimal; padding-bottom:.3em;}
	
	.content-right h3, .content-right h4, .content-right h5 {padding:0 0 0 16px; margin:.5em 0 .3em; }
	.content-right h5 {font-size:1em;}
	.content-right p {margin-left:1.5em; padding-bottom:1em;}
	
	
/* 5.b ------------------------------------------------------- */
.side-ad { height:140px; width:218px; padding:10px 19px 10px 14px; background:url('../../images/layout/sidead_bgd.png') 0 0 no-repeat; margin:15px 0 10px 0; float:right;}
	.side-ad .title {color:#fff; font-size:1.1em; font-weight:bold; display:block; line-height:24px; }
	.side-ad .content {padding-top:9px; font-size:0.9em;}
	.side-ad .order-now {margin-top:5px; clear:right;}
		a.order-now img {border:none;}
	

/* 5.c ------------------------------------------------------- */
.side-menu { margin:0px 0 25px 0px;}
	.side-menu ul { width:235px; list-style:none; margin:0; padding:0 0 0 1px; border-bottom:1px solid #E1E1E2;}
	.side-menu ul li { width:234px; list-style-type:none; border-style:solid; border-width:1px 1px 0 0; border-color:#dadada #E1E1E2 #dadada #B8B8B9;}
	.side-menu ul li a { height:24px; padding:10px 0 0 18px; display:block; background:url('../../images/layout/sidemenu_item.jpg') 0 0 no-repeat;
		color:#444; text-decoration:none; font-size:1.1em;
	}
	.side-menu ul li a:hover { background-image:url('../../images/layout/sidemenu_item_hover.jpg'); color:#222; }

	.side-menu h3.title {margin:0 0 .3em; color:#7E9299}

/* 6.a ------------------------------------------------------- */
#content_bottom {margin-bottom:-1px; height:60px; background: url('../../images/layout/bgd_content_btm_internal.jpg') 0 0 no-repeat; clear:both;}
#push {height:57px; clear:both; overflow:hidden;}

/* 7.a ------------------------------------------------------- */
#footer {
	position:relative; 
	width: 100%; height:57px;
    margin:-57px auto 0 auto;
    background:url('../../images/layout/bgd_footer.jpg') 0 0 repeat-x;	
	color:#ccc; font-size:0.85em; line-height:1.3;
}
	.footer-content { width:904px; margin:0 auto; padding:15px 30px 0 30px;}
		.footer-content a {color:#ccc; font-weight:bold; }
		.footer-content a:hover {color:#fff; }
		
	.footer-content .left { text-align:left;}
	.footer-content .right { text-align:right;}
	.footer-content .middle { text-align:center; }	
		.footer-content .middle a { color:#ffd75d;}
		.footer-content .middle a:hover { color:#fff;}

/* 8.a ------------------------------------------------------- */
#landing_page {background: #c5cbd0 url('../../images/layout/bgd_landing_page.jpg') 0 0 repeat-x;}
#landing_page #banner {height:233px; background-image: url('../../images/layout/bgd_banner_landing.jpg');}
#landing_page #content_wrapper {background-image: url('../../images/layout/bgd_content_landing.jpg');}
#landing_page #content {min-height:214px; background-image: url('../../images/layout/bgd_content_top_landing.jpg');}
#landing_page #content_bottom {height:35px; background-image: url('../../images/layout/bgd_content_btm_landing.jpg');}
#landing_page .side-ad {float:none;}
#landing_page #banner_overlay {display:block; position:absolute; top:22px; right:2px; z-index:1;}

/* 8.b ------------------------------------------------------- */
#one_column #content_wrapper {background-image: url('../../images/layout/bgd_content_landing.jpg');}
#one_column #content {min-height:214px; background-image: url('../../images/layout/bgd_content_top_internal_onecol.jpg');}
#one_column #content_bottom {height:35px; background-image: url('../../images/layout/bgd_content_btm_landing.jpg');}
#one_column .side-ad {float:none;}
#one_column .content-left {float:left; position:relative; width:910px;  }
#one_column .content-right { display:none; width:0;}

/* 9.a ------------------------------------------------------- */
.myImages-box {width:640px; position:relative; margin:.5em 0 1.5em;}

	.myImages-box .top {height:39px; background:url('../../images/layout/myImages_top.gif') 0 0 no-repeat;}
	.myImages-box .bottom {height:16px; background:url('../../images/layout/myImages_btm.gif') 0 0 no-repeat;}
	.myImages-box .middle {min-height:50px; padding:0 10px 10px; background:url('../../images/layout/myImages_bgd.gif') 0 20px repeat-y; overflow:auto; }
	
	.myImages-box h3.title {margin:0; color:#fff; line-height:34px; padding-left:12px;}

.myImages-box_gm {width:570px; position:relative; margin:.5em 0 1.5em;}
	.myImages-box_gm .top {height:30px; background:url('/images/layout/myImages_top_gm4_570x30.jpg') 0 0 no-repeat;}
	.myImages-box_gm .bottom {height:16px; background:url('/images/layout/myImages_btm_gm_570.gif') 0 0 no-repeat;}
	.myImages-box_gm .middle {min-height:32px; padding:0 10px 10px; background:url('/images/layout/myImages_bgd_gm570.gif') 0 20px repeat-y; overflow:auto; }
	
	.myImages-box_gm h3.title {margin:0; color:#fff; line-height:30px; padding-left:12px;}

	
	.myImages-preview {float:left; }
		.img-case {padding:3px; background:#fff; float:left; margin-right:5px; border:1px solid #7e949d;}
		.img-case img {border:1px solid #000;}
	
	.myImages-utils {float:right; overflow:auto; }
		.myImages-utils a {float:left;}
		.myImages-utils a.btn-view { height:28px; width:80px; margin-right:7px; display:block; background:url('../../images/layout/btn_view.jpg') 0 0 no-repeat;}
		.myImages-utils a.btn-view:hover { background-image:url('../../images/layout/btn_view_hover.jpg');}
		
		
		a.btn-editcreategal { height:30px; width:219px; margin-right:7px; display:block; background:url('/images/layout/btn_galleries.jpg') 0 0 no-repeat;}
		a.btn-editcreategal:hover { background-image:url('/images/layout/btn_galleries_hover.jpg');}
		
		
		.myImages-utils a.btn-edit { height:28px; width:80px; display:block; background:url('../../images/layout/btn_edit.jpg') 0 0 no-repeat;}
		.myImages-utils a.btn-edit:hover { background-image:url('../../images/layout/btn_edit_hover.jpg');}
		.myImages-utils a.btn-ordernow { height:29px; width:179px; clear:left; margin-top:11px; display:block; background:url('../../images/layout/btn_ordernow_orange.jpg') 0 0 no-repeat; }
		.myImages-utils a.btn-ordernow:hover { background-image:url('../../images/layout/btn_ordernow_yellow.jpg');}
		
		.myImages-utils .invites {float:left; clear:left; margin-top:61px; width:210px;}
		.myImages-utils input.invite { float:left; margin-right:5px; width:150px; padding:2px; border:1px solid #444; color:#888; font-size:0.85em; }
		.myImages-utils a.btn-send { height:22px; width:40px; display:block; background:url('../../images/layout/btn_send.jpg') 0 0 no-repeat; }
		.myImages-utils a.btn-send:hover { background-image:url('../../images/layout/btn_send_hover.jpg');}