/*
Theme Name: Marijoli Clear Theme
Theme URI: http://marijoli.com/
Description: Theme for marijoli.com based on the famous <a href="http://binarybonsai.com/kubrick/">Kubrick</a>.
Version: 1.0
Author: Asela Jayarathne
Author URI: http://ultrasupernew.com/
Tags: 

*/

/*==================================================
	M A I N   S T Y L E S
	
	* Last Updated	: YYYY/MM/DD
	* Author 		: Name <mail>
	* Color Key     :
	   * Deep Blue     : #000066 (example) 
	   * Apple Green   : #85b885
==================================================*/
@import 'css/reset.css';
@import 'css/utilities.css'; 
@import 'css/forms.css';

/* 
@import 'lib/forms.css';
*/

/*==================================================
	L A Y O U T 
	Basic page layout
==================================================*/
html {overflow-y: scroll;}
body { background: #fff; font: 10px/160% "Arial", sans-serif; text-align: center; color: #000; }
	#page { text-align: left; }
	   #content { padding: 30px 0;}
		#header { padding-top: 7px; }
		  #header .section-content { position: relative; }
		#footer { clear: both; color: #999; padding: 20px 0 60px 0;  }
		  #footer p { font-size: 1em; }
		  #footer a { color: #999; text-decoration: none; }
		  #footer a:hover { text-decoration: underline; }
    
.section-container { width: 100%; text-align: center; }
.section-content { width: 940px; margin: 0 auto; text-align: left; }

#content .section-content { width: 960px; position: relative; }
#content .highlight { color: #fa12f8 !important; }

/*==================================================
	C O M M O N  E L E M E N T S 
	Main HTML elements 
==================================================*/
h1 {}
h2 { font: 1.8em/100% "Arial", sans-serif; text-transform: uppercase; letter-spacing: 0px; padding-bottom: 0; margin-bottom: 20px; }
h3 { font: 1.8em/100% "Arial", sans-serif; }
li, p, td, th, dd, dt, label, legend { font-size: 1.2em; }
li li, td li, td p { font-size: 1em; }
a:link { color: #fa12f8; text-decoration: none; }
a:visited { }
a:hover { text-decoration: underline; }
a:active { }

table.generic { width: 818px;}
table.generic th, table.generic td { padding: 20px 0; background: transparent url(images/hr-gray-back.gif) bottom left repeat-x; vertical-align: top; }
table.generic .first th, table.generic .first td { padding-top: 0; }
table.generic th { text-align: left; width: 220px; font-weight: normal; }
table.generic td { padding: 20px;  }
table.generic td p { font-size: 12px !important; }
table.generic td ul { margin-right: -20px; }

table.size-table {width: 300px !important;}
table.size-table { border-top: 1px dotted #000;}
table.size-table th { text-align: center; color: #000; font-size: 14px; font-weight: bold; padding-top: 20px !important; }

table.stores th {}
table.stores td li { padding: 20px 0; background: transparent url(images/hr-gray-light.gif) bottom left repeat-x;  }
table.stores td li:first-child, table.stores td li.first { padding-top: 0; }
table.stores td li:last-child,table.stores td li.last { background: none; padding-bottom: 0; }


/*==================================================
	C O M M O N  S T Y L E S
 	Project specific common design elements   
 ==================================================*/
#header { padding-top: 30px; }
#header h1 a { display: block; width: 259px; height: 75px; margin-bottom: 20px; background: #fff url(images/logo.gif) top left no-repeat; text-indent: -9999em; }
#header div.cart { width: 185px; height: 32px; position: absolute; top: 0; right: 0; }
#header div.cart table { visibility: hidden; }
#header div.cart table input.wp_cart_checkout_button { visibility: visible; position: relative; top: -120px;}

#main-menu { position: absolute; bottom: -20px; right: 0; z-index: 200; text-transform: uppercase; }
#main-menu li { display: inline; }
#main-menu li.collapse a { padding-right: 30px; background: transparent url(images/main-menu-down-white.gif) center right no-repeat; }
#main-menu li.backstage a { margin-left: 0px; }
#main-menu a { display: block; float: left; color: #000; padding: 15px; text-decoration: none; }
#main-menu a:hover { color: #fa12f8; }
#main-menu li.collapse a:hover { color: #fa12f8; background: transparent url(images/main-menu-down-white.gif) center right no-repeat;}
#main-menu li.collapse a.current { color: #fa12f8; background: transparent url(images/main-menu-up-white.gif) center right no-repeat; }


body.archive #main-menu li.collection a,
body.single #main-menu li.collection a  { color: #fa12f8; background: transparent url(images/main-menu-up-white.gif) center right no-repeat; }


#sub-menu {  background: #fff; color: #000; text-transform: lowercase; }
#sub-menu ul { width: 600px !important;  }
#sub-menu li { display: inline; }
#sub-menu a { display: block; float: left; color: #000; padding: 15px; text-decoration: none; }
#sub-menu a:hover { color: #fa12f8; }
body.home #sub-menu,
body.page #sub-menu { display: none; position: absolute; top: 125px; z-index: 100; }

ul.subpage-menu { position: absolute; top: -27px; right: 10px; }
ul.subpage-menu li { display: inline; }
ul.subpage-menu li a { color: #fff; background: #999; text-decoration: none; padding: 4px 10px; }
ul.subpage-menu li a:hover, ul.subpage-menu li.ciurrent a { color: #000; background: #fff;}

a.post-edit-link { color: #fff; background: #000; padding: 10px; font-size: 12px; }

#backstage { color: #fff; width: 660px; height: 560px; position: absolute; top: 95px; right: 0; z-index: 100; display: none; }
#backstage a { color: #fff; }
#backstage table.wrap { width: 600px; height: 100%; margin: 0 auto;  }
#backstage table td { text-align: left; vertical-align: middle; }
#backstage table td.title { width: 170px; }
#backstage table td.content { padding-left: 20px; }

#backstage div.twitter { color: #fa12f8; margin-bottom: 20px; text-align: center; height: 120px; background: transparent url(images/backstage-twitter-bg.png) top left no-repeat; }
#backstage div.twitter table td.title a { display: block; height: 60px; width: 100%; text-indent: -9999em; }

#backstage div.blog {  height: 420px; background: transparent url(images/backstage-blog-bg.png) top left; }
#backstage div.blog td { padding: 30px 0; vertical-align: top; }
#backstage div.blog td.title a { text-align: left; float: right; display: block; height: 32px; width: 64px; text-indent: -9999em; 
                                background: transparent url(images/backstage-blog-title.png) top right no-repeat; }
#backstage div.blog table.blog-posts { height: 360px; margin: 0 0 0 20px; }
#backstage div.blog table.blog-posts td { vertical-align: top; padding: 0; font-size: 12px; }
#backstage div.blog table.blog-posts td p { font-size: 12px; }
#backstage div.blog table.blog-posts td a { text-decoration: none; }
#backstage div.blog table.blog-posts td p.date { color: #999; text-align: right; padding-top: 5px; }

div.entry img.alignleft { float: left; margin: 20px 20px 20px 0;}
div.entry img.alignright { float: right; margin: 20px 0 20px 20px;}
div.entry p { margin-bottom: 16px; }

div.page-navigation { }
div.page-navigation div { height: 20px; width: 18px; }
div.page-navigation div.previous { float: left; }
div.page-navigation div.next { float: right; }
div.page-navigation a { display: block; width: 18px; height: 20px; text-indent: -9999em; }
div.page-navigation .previous a { background: transparent url(images/page-navigation-arrows.gif) top left no-repeat; }
div.page-navigation .next a { background: transparent url(images/page-navigation-arrows.gif) top right no-repeat; }
div.page-navigation .previous a:hover { background: transparent url(images/page-navigation-arrows.gif) bottom left no-repeat; }
div.page-navigation .next a:hover { background: transparent url(images/page-navigation-arrows.gif) bottom right no-repeat; }


/*==================================================
	P A G E S
 	Page specific styles  
 ==================================================*/

/* Product archive (listing) */
body.archive div.post { width: 226px; height: 226px; float: left; margin: 0 14px 14px 0; display: inline; position: relative; }
body.archive div.post .wrap { padding: 23px; }
body.archive div.post img { width: 180px; height: 160px; }
body.archive div.post h3 a { display: block; color: #000; font: 18px/100% "Arial", serif; font-style: normal; text-decoration: none;
                             position: absolute; bottom: 20px; left: 21px; width: 130px; }
body.archive div.post p.price { color: #666; font: 13px/100%; text-align: right;
                                 position: absolute; bottom: 20px; right: 20px; width: 50px; }

body.archive div.post a.post-edit-link { position: absolute; top: 0; right: 0; display: none; }
body.archive div.post:hover a.post-edit-link { display: block; }

/* Page */
body.page a.post-edit-link { }
body.page #content { padding-top: 50px; }


/* Home */
body.home #content { background: #1b1b19; padding: 0; }

/* Single Item */
body.single .column { float: left; position: relative; }
body.single #content .wrap { }

body.single div.buy div { margin-bottom: 20px;  } 
body.single div.buy h3 { } 
body.single div.entry_data { width: 220px; }
body.single div.galerry_wrap { width: 460px !important;  border: 1px solid #fff;}
body.single div.buy div.price p { font-size: 1.8em; line-height: 100%;} 
body.single div.buy div.order h3 {margin-bottom: 10px;}
body.single div.buy div.order form { font-size: 12px;  }
body.single div.buy div.order form select { width : 120px; margin-left: 20px;}
body.single div.buy div.order form input.wp_cart_button { margin-top: 10px; }
body.single div.buy div.order .sizing { margin-top: 5px; }
body.single div.buy div.order a { color: #000; }
body.single div.buy div.order a:hover { text-decoration: none; }

body.single div.buy div.shopping-cart .wrap { padding: 0 20px 20px 0; font-size: 12px; }
body.single div.buy div.shopping_cart { padding: 0 !important; margin: 0 !important;}
body.single div.buy div.shopping-cart h3 {margin-bottom: 10px; padding-top: 20px; text-transform: uppercase; }
body.single div.buy div.shopping-cart th { padding-bottom: 3px; font-weight: bold; font-size: 11px; text-align: center; }
body.single div.buy div.shopping-cart td { font-size: 12px;  }
body.single div.buy div.shopping-cart td.remove-item { text-align: right !important; }
body.single div.buy div.shopping-cart td.remove-item input { vertical-align: text-bottom; }
body.single div.buy div.shopping-cart td a { color: #000;}
body.single div.buy div.shopping-cart td.sub-total { padding-top: 5px; }
body.single div.buy div.shopping-cart input.wp_cart_checkout_button { margin: 10px 0 0 0; }
body.single div.buy div.shopping-cart tr.total-row td { text-align: right !important; }
body.single div.buy div.shopping-cart tr.total-row td.title { font-size: 11px; }


body.single .jcarousel-container { padding: 0 20px 20px 0;  }
body.single .carousel-gallery { margin-bottom: 0;  padding-left: 20px;}
body.single .jcarousel-scroll {display: none; }

/* body.single .carousel-controls { position: absolute; width: 220px; left: 480px; top: 300px; } */

body.single .carousel-controls-inner a { border: 1px solid #fff; }
body.single .carousel-controls-inner a.active { border: 1px solid #fa12f8; }
body.single .carousel-controls-inner a img { border: none; height: 60px; width: 60px; }


/* Press */
body.page-id-9 form { padding: 0 0 20px 0; position: relative; }
body.page-id-9 form p { margin-bottom: 20px;  }
body.page-id-9 form label { display: block; width: 220px; text-align: right; position: relative; }
body.page-id-9 input#pwbox-9 { background: #efefef; border-top: solid #ddd; border-width: 1px 0 0 0; font-size: 12px; padding: 5px; width: 568px;
                               position: absolute; left: 240px; top: 0;}

body.page-id-9 input[type="submit"] { background: transparent url(images/btn-enter.gif) top left no-repeat; border:none; width: 140px; height: 41px; text-align:center; text-indent: -9999em; 
                                      margin: 20px 0 0 240px; }
body.page-id-9 #content table.generic img { width: 100px; height: 89px; margin-right: 10px;}


/* size info */
body.page-id-215 h3 {padding-bottom: 30px;}
body.page-id-215 table { border-top: none; }

/*bespoke */
body.page-id-7 .entry { margin-left: 10px; }
