/*

Theme Name: Mystical Art

Author: Daniel Pearson <daniel@nanoo.org>

Author URI: http://wildberry-design.com/

Description: This theme was designed specifically for use by the Web site for Avraham Loewenthal's Tzfat Gallery of Mystical Art.

Version: 1.0

License: The Unlicense

License URI: license.txt

*/



/* =Reset rules from the HTML5 Boilerplate project

-------------------------------------------------------------- */



article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }

audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }

audio:not([controls]) { display: none; }

[hidden] { display: none; }



html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }

html, button, input, select, textarea { color: #222; }

body { margin: 0; font-size: 1em; line-height: 1.2; }



::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; }

::selection { background: #fe57a1; color: #fff; text-shadow: none; }



a { color: #00e; }

a:visited { color: #551a8b; }

a:hover { color: #06e; }

a:focus { outline: thin dotted; }

a:hover, a:active { outline: 0; }

abbr[title] { border-bottom: 1px dotted; }

b, strong { font-weight: bold; }

blockquote { margin: 1em 40px; }

dfn { font-style: italic; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }

ins { background: #ff9; color: #000; text-decoration: none; }

mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }

pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }

pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }



q { quotes: none; }

q:before, q:after { content: ""; content: none; }

small { font-size: 85%; }

sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sup { top: -0.5em; }

sub { bottom: -0.25em; }



ul, ol { margin: 1em 0; padding: 0 0 0 40px; }

dd { margin: 0 0 0 40px; }

nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }



img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }

svg:not(:root) { overflow: hidden; }

figure { margin: 0; }



form { margin: 0; }

fieldset { border: 0; margin: 0; padding: 0; }



label { cursor: pointer; }

legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }

button, input { line-height: normal; }

button, input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }

button[disabled], input[disabled] { cursor: default; }

input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }

input[type=search] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }

input[type=search]::-webkit-search-decoration, input[type=search]::-webkit-search-cancel-button { -webkit-appearance: none; }

button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }

textarea { overflow: auto; vertical-align: top; resize: vertical; }

input:valid, textarea:valid {  }

input:invalid, textarea:invalid { background-color: #f0dddd; }



table { border-collapse: collapse; border-spacing: 0; }

td { vertical-align: top; }



.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }







/* =Typical Pages

-------------------------------------------------------------- */



html, button, input, select, textarea {

	font-family: 'Crimson', serif;

}

body {

	width: 930px;

	margin: 0 auto;

	color: white;

	background-color: #83a7c0;

}

a, a:visited, a:link {

	color: white;

	text-decoration: none;

}

a:hover {

	text-shadow: white 0 0 6px;

}

.parenthetical {

	font-weight: normal;

	font-size: smaller;

}



#page-header {

	position: fixed;

	background-color: #83a7c0;

	width: 930px;

	top: 0;

	z-index: 100;

	border-bottom: 1px solid #b1d0e4;

	padding: 10px 0 5px;

}

#page-header > h1 { /* this isn't used anymore; this element is implemented with an img instead */

	margin: 0;

	display: inline-block;

	font-size: 15px;

	font-weight: 400;

	font-family: 'Cardo', serif;

	text-align: justify;

}

#page-header > img {

	vertical-align: bottom;

	padding-bottom: 4px;

}



#navigation {

	display: inline-block;

	font-size: 20px;

	padding: 0 0 0 50px;

	margin: 0;

}

#navigation > li {

	display: inline;

	margin: 0 8px;

}

#navigation > li > a {

	color: white;

}

#navigation > li.current-menu-item > a {

	color: black;

}



#main {

        padding-top: 95px;

	text-align: center;

	position: relative;

}

.page .column, .js .scrollable, .js .scrollable section {

	width: 450px;

}

.column {

	vertical-align: text-top;

	display: inline-block;

	*display: inline;

	zoom: 1;

}

#content.column {

	padding-right: 10px;

	text-align: justify;

}

#content > p {

	margin: 16px 0;

}

#picture {}

#picture > img {

	margin: 20px 40px;

}



.js .scrollable {

	position: relative;

	overflow: hidden;

	height: 460px;

}

.js .scrollable > div {

	position: absolute;

	width: 99999px;

}

.js .scrollable section {

	display: inline-block;

	*display: inline; zoom: 1;

	text-align: center;

}

.scroller {

	font-size: 12pt;

	text-align: center;

}

.scroller > .prev, .scroller > .next {

	display: inline-block;

	*display: inline; zoom: 1;

	width: 20px;

	height: 20px;

	cursor: pointer;

	margin: 0 6px;

	position: relative;

	top: 5px;

}

.scroller > .prev {

	background: url("resources/arrow-left.png");

}

.scroller > .next {

	background: url("resources/arrow-right.png");

}

.scroller > .prev.disabled, .scroller > .next.disabled {

	visibility: hidden;

}







/* =Gallery

-------------------------------------------------------------- */



.gallery-scroller {

	position: absolute;

	top: 50px;

	right: 0;

}

.js .gallery {

	position: relative;

	overflow: hidden;

	height: 1500px;

}

.js .gallery > div {

	position: absolute;

	width: 999999px;

}

.js .gallery-entry {

	display: inline-block;

	*display: inline; zoom: 1;

	vertical-align: top;

	width: 930px;

	height: 1500px;

	overflow: hidden;

}

.no-js .gallery-entry {

	border-bottom: 1px solid #b1d0e4;

}

.gallery-title {

	padding-top: 15px;

	margin: 0;

}

.gallery-expanded .gallery-title {

	padding: 40px 0 0;

}

.gallery-caption {

	font-style: italic;

}

.gallery-contracted .gallery-caption p {

	margin: 7px 0 0;

}

.gallery-expanded .gallery-caption p {

	margin: 3px 0 0;

}

.gallery-container {

/* This is a "shrink-wrap" container whose width is that of its contents. */

	display: inline-block;

	*display: inline; zoom: 1;

	position: relative;

}

.gallery-container > img {

	vertical-align: top;

}

.no-js .gallery-contracted {

	display: none;

}

.js .gallery-contracted {

	position: absolute;

	top: 0;

	right: -230px;

	width: 208px;

	text-align: left;

}

.gallery-expand {

	font-weight: bold;

	position: relative;

	top: 35px;

}

.gallery-expand:hover {

	color: white;

}

.js .gallery-expanded {

	display: inline-block;

	*display: inline; zoom: 1;

	width: 0px;

	overflow: hidden;

	margin-left: 15px;

}

.js .gallery-expanded-inner {

	position: relative;

	left: 450px;

	border: 1px solid #a0c2db;

	width: 408px;

	height: 408px;

	overflow: auto;

}

.gallery-explanation {

	text-align: justify;

	padding: 30px 10px 0;

}

.gallery-explanation > p {

	margin: 0 0 1em;

}

.gallery-print,

.gallery-close {

	position: absolute;

	top: 0;

	z-index: 999;

	border-bottom: 1px solid #a0c2db;

	border-left: 1px solid #a0c2db;

	line-height: 19px;

}

a.gallery-print,

a.gallery-close {

	color: #cfdde6;

}

.gallery-close {

	right: 0;

	width: 19px;

	font-family: sans-serif;

}

.gallery-print {

	font-size: 13px;

	right: 19px;

	padding: 0 7px;

}







/* =Custom scroll bars generated by fleXcroll.

-------------------------------------------------------------- */



div { outline: none !important; }

.scrollgeneric {

	line-height: 1px;

	font-size: 1px;

	position: absolute;

	top: 0; left: 0;

}



.vscrollerbase {

	width: 8px;

	border-left: 1px solid #a0c2db;

	background-color: transparent;

}

.vscrollerbar {

	width: 8px;

	background-color: #b8cbd9;

	border-radius: 4px;

}

.hscrollerbase {

	height: 10px;

	background-color: white;

}

.hscrollerbar {

	height: 10px;

	background-color: black;

}



.scrollerjogbox {

	width: 10px;

	height: 10px;

	top: auto; left: auto;

	bottom: 0px; right: 0px;

	background-color: gray;

}







/* =Store

-------------------------------------------------------------- */



#header-cover {

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	height: 167px;

	background-color: #83a7c0;

	z-index: 99;

}

#store-text {

	position: fixed;

	top: 165px;

width: 730px;

    padding: 0 100px;

	z-index: 100;

	text-align: justify;

	font-size: 11pt;

	border-bottom: 1px solid #b1d0e4;

}

#store-text-wide {

	position: fixed;

	top: 47px;

    width: 850px;

    padding: 0 100px;

	z-index: 100;

	text-align: justify;

	font-size: 11pt;

}

#store-proceed {

	position: absolute;

	bottom: 10px;

	right: 8px;

	padding: 1px 10px 2px;

}

#store-proceed > span {

	font-weight: bold;

}

#store-proceed > img {

	vertical-align: text-bottom;

}



#store-proceed, .store-item-add, .store-item-quantity {

	border: 1px solid #b6d5e9;

	background: #95b4c9;

	color: white;

	font-size: 13pt;

	line-height: 1.2;

}

.submit_order_button{

	border: 1px solid #b6d5e9;

	background: #95b4c9;

	color: white;

	font-size: 13pt;

	line-height: 1.2;

}

#store-shelf {

	position: absolute;  /*/msr absolute */

	text-align: center;

	padding: 70px 0 20px;



}

#store-list {

	position: relative;

}

.store-item {

	border-bottom: 1px solid #b1d0e4;

}

#store-list > .store-item {

	padding: 10px 0;

}

.store-item-picture {

	line-height: 175px;

	width: 170px;

}

#shipment-large {

    font-size:20px;

}



#shopping-cart .store-item-picture {

	line-height: 160px;

}

.qtybutton {

  color: white;

  border:none;

  background:#83a7c0;

  font-size:24px;

}

.qtycbutton:hover {

  color: #14396A;

  background: #468CCF;

  background: linear-gradient(top,  #468CCF,  #63B8EE);

  background: -ms-linear-gradient(top,  #468CCF,  #63B8EE);

  background: -webkit-gradient(linear, left top, left bottom, from(#468CCF), to(#63B8EE));

  background: -moz-linear-gradient(top,  #468CCF,  #63B8EE);

}

.submit_order_button{

    //background:black;

}

.store-thumbnail {

	cursor: pointer;

    cursor: -webkit-zoom-in;

    cursor: -moz-zoom-in;

    cursor: zoom-in ;

}

.store-item-details {

    width: 500px;

	text-align: justify;

	font-size: 14px;

}

.store-item-details > h2 {

	font-size: 24px;

	font-weight: bold;

	margin: 20px 0 0;

	text-align: left;

}

.store-item-details > h3 {

	font-size: 17px;

	font-weight: normal;

    word-spacing: normal;

    word-wrap:normal;

    text-align:left;

	margin: 0;

}

.toggle-explanation {

	font-weight: bold;

}

.no-js .toggle-explanation {

	display: none;

}

.store-item-price {

	padding-top: 20px;

    width: 60px;

	font-size: 24px;

	font-weight: bold;

}

.store-item-cart {

	padding-top: 16px;

	width: 170px;

	text-align: right;

}

.store-item-quantity {

	text-align: center;

	margin-right: 12px;

}

.js #store-list .store-item-quantity {

	display: none;

}

.no-js .store-item-add,

.no-js .store-item-remove {

	display: none;

}

.store-item-add {

	width: 95px;

	padding: 2px 6px;

}

a.store-item-remove {

	font-size: 13px;

	padding-right: 5px;

	text-decoration: underline;

}

.no-js .overlay {

	display: none;

}

.overlay {
	z-index: 9999;
	position: fixed;
	top: -999999px;
}

.store-item-fullpic {
height: 450px;
padding-right:50px;
        visibility: visible;
			cursor: pointer;
	cursor: -webkit-zoom-out;
        cursor: -moz-zoom-out;
        cursor: zoom-out;
	overflow-y: auto;
	overflow-x: hidden; 
}
-webkit-scrollbar-track {
      background-color: #ff0000;
} /* the new scrollbar will have a flat appearance with the set background color */
.store-item-fullpic .close, .store-fullpic-close {

	display: none;

}

.store-item-explanation {

	font-size: 14px;

	position: relative;

	top: 0;

	display: none;

	width: 650px;

	margin: -76px 0 0 auto;

}

.store-explanation-content {

	text-align: justify;

	padding: 30px 0 0;

}

.store-explanation-content > p {

	margin: 0 0 1em;

}

.store-fullpic-close,

.store-explanation-print,

.store-explanation-close {

	position: absolute;

	top: 0;

	border: 1px solid #a0c2db;

	line-height: 19px;

}

.store-explanation-print {

	border-right: 0;

}

a.store-explanation-print,

a.store-explanation-close {

	color: #cfdde6;

}

.store-fullpic-close,

.store-explanation-close {

	right: 0;

	width: 19px;

	font-family: sans-serif;

}

.store-explanation-print {

	font-size: 13px;

	right: 19px;

	padding: 0 7px;

}

.cart-header {

	border-bottom: 1px solid #b1d0e4;

	padding-bottom: 4px;

}

.cart-header .column {

	vertical-align: text-bottom;

}

.cart-header-title {

	width: 570px;

	text-align: left;

}

.cart-header-title > h2 {

	font-size: 24px;

	font-weight: bold;

	margin: 20px 0 0;

}

.cart-header-price {

	width: 170px;

    vertical-align:bottom;

}

.cart-header-qty {

	width: 170px;

	text-align: right;

    vertical-align:bottom;

}

.cart-header label{

    width:80px;

    line-height:23px;

    padding-left:5px;

    margin:5px;

    float:left;

}

#price-totals {

	text-align: right;

	margin-top: 15px;

	font-size: 17px;

}

#price-table {

	margin-top: 10px;

	display: inline-table;

	font-size: 19px;

}

.price-label {

	text-align: left;

}

.price-value {

	text-align: right;

	padding-left: 10px;

}

#price-line-total {

    display:none;

}

#price-line-discount {

    display:none;

}

#order-sent{

	margin-top:-100px;

	font-size: 18px;



}







/* =Print-specific rules

-------------------------------------------------------------- */



@media print {

  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; }

  a, a:visited { text-decoration: underline; }

  a[href]:after { content: " (" attr(href) ")"; }

  abbr[title]:after { content: " (" attr(title) ")"; }

  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }

  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }

  thead { display: table-header-group; }

  tr, img { page-break-inside: avoid; }

  img { max-width: 100% !important; }

  @page { margin: 0.5cm; }

  p, h2, h3 { orphans: 3; widows: 3; }

  h2, h3 { page-break-after: avoid; }

}



/*

 * vim: sts=0 sw=8 tw=80 noet

 */
 
.tl{text-align:left}
a.tu{text-decoration:underline}
 .tc{text-align:center}
/*  SECTIONS  ============================================================================= */

.section {
	clear: both;
	padding: 0px;
	margin: 0px;
}

/*  GROUPING  ============================================================================= */


.group:before,
.group:after {
    content:"";
    display:table;
}
.group:after {
    clear:both;
}
.group {
    zoom:1; /* For IE 6/7 (trigger hasLayout) */
}

/*  GRID COLUMN SETUP   ==================================================================== */

.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}

.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */


/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */

@media only screen and (max-width: 480px) {
	.col { 
		margin: 1%;
	}
}
 
 /*  GRID OF TWO   ============================================================================= */


.span_2_of_2 {
	width: 100%;
}

.span_1_of_2 {
	width: 49.2%;
}

/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

@media only screen and (max-width: 480px) {
	.span_2_of_2 {
		width: 100%; 
	}
	.span_1_of_2 {
		width: 100%; 
	}
}
 
 
 
 
 
 
 
 
 
 

