/** Main Template **/

body { text-align: center; background-color: #ebe7d5; overflow-x: hidden;  -webkit-font-smoothing: antialiased;
    font: normal 15px/1.5 "Helvetica Neue", Helvetica, Arial, Helvetica, Geneva, sans-serif;
    margin: 0; padding: 0;
    }
	
.alt { font: normal 14px/1.3 "Helvetica Neue", Helvetica, Arial, Helvetica, Geneva, sans-serif ; }
.alth2  {color: #aa0000; font-weight: 700;  }
.maroon { color: #880000; }
.italic  { font-family: "Lucida Calligraphy"; }

.block	 { margin: 16px 0; }
.block h2	 { line-height: 1.5;margin: 0; }
.block h3	 { line-height: 1.5;margin: 0; }
.block p	 { line-height: 1.5;margin: 0; }

.clear { clear: both; }
.c { text-align: center; }
.l { text-align: left; }
.r { text-align: right; }
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right{
    text-align: right
}
.fr { float: right; }
.fl { float: left; }
.i { font-style: italic; }
.b, .strong { font-weight: 700; }
.ar { position: absolute; right: 0; top: 0px; }
.ar img { padding-right: 12px; vertical-align: middle;}
.zt { margin-top: 0 !important; }
.ztb { margin-top: 0 !important; margin-bottom: 0 !important; }
.zb  {margin-bottom: 0 !important; }

.invalid	 { border: 2px solid red; }
.invalid_text	 { color: red;font-weight: 700; }
.laminate	 { width: 25%;display: inline-block;vertical-align: text-top;position: relative; }
.laminate .picture_height	 { margin-top: 70%; }
.laminate.picture .img_frame	 { width: 100%;height: 100%; }
.laminate.picture .img_frame img	 { width: 100%;height: auto; }
.last	 { margin-right: 0 !important; }

.shadow { -moz-box-shadow: 3px 1px 7px 4px rgba(0,0,0,.7); -webkit-box-shadow: 3px 1px 7px 4px rgba(0,0,0,.7); box-shadow: 3px 1px 7px 4px rgba(0,0,0,.7); 	}

/** row - box model Used in display image detail **/
.jprow { width: 100%; display: block; position: relative; }
.jprow>*{ float:left; display: block; position: relative;
	-moz-box-sizing:border-box; -webkit-box-sizing:border-box; 	-o-box-sizing:border-box;  -ms-box-sizing:border-box; 	box-sizing:border-box }
.jprow:after{ content:''; display:block; clear:both; height:0 }
.jprow:first-child>*{ padding-top:0!important }
.jprow>*{ margin-left:5%; }
.jprow>*:first-child { margin-left:0; }
.box_half { width: 47%; padding: 20px; }
.box-third { width: 29.5%; position: relative; }
.box-2third { width: 64%; position: relative; }
.box-qtr { width: 24.5%; position: relative; }
.box-3qtr { width: 69%; position: relative; }

a.disabled	 { text-decoration: none;color: #666; }
div.foot_pages	 { margin: 4px auto;text-align: center;padding-left: 20%;position: relative;line-height: 24px;margin-top: -22px; }
div.last_line	 { margin: 4px auto;text-align: center;width: 100%;position: absolute;line-height: 24px;top: 100%;color: #333;z-index: -1; }
h3	 { margin-top: 12px; }

/** Common  **/

#main h1 {color: #880000; }
#favorites_page h2 {color: #880000; font-family: "Lucida Calligraphy";text-align: center;font-weight: 500;}


a { text-decortation: none; }
th { text-align: center; }
.picture { position: relative; }
.picture p { margin: 0 0 0 1%; text-align: center;  }

#all { width: 95%; max-width: 900px; margin: 0 auto; padding: 0; text-align: left; position: relative; }
#all { width: 100%;}



#header h1	 { font-family: "Lucida Calligraphy";text-align: center;vertical-align: text-top;font-weight: 500;margin: 0;padding: 16px 0 4px 0; font-size: 23px;  }
.desktop #header h1 {font-size: 30px; }
.mobile #header h1 {font-size: 23px; }
#header h2	 { text-align: center; padding: 0;margin: 4px 0 16px 0; font-size: 18px; font-weight: 500;}
.desktop #header h2 { font-size: 20px; font-weight: 700;}
.mobile #header h2 { font-size: 16px; margin-top: -3px; margin-bottom: -16px; } /* Don't know why margin bottom needed */
#header h2.small	 { font-size: 16px; }
.mobile #header h2.small { display: none; }
#header h1 span { margin-left: 8px; }
.mobile #header h1 span { display: block; } /* Line Wrap */
.mobile .nomobile { display: none; }
.mobileonly { display: none; }
.mobile .mobileonly { display: block; }


#text_box { position: absolute; top: 10%; left: 53%; width: 43%; padding: 0px 1%; background-color: #ffffff; text-align: left; font-size: 14px; }
#text_box_john { position: absolute; top: 7.5%; left: 53%; width: 43.5%; padding: 0px 1%; background-color: #ffffff; text-align: left; font-size: 14px; line-height: 1.4;}
#text_box_gallery { position: absolute; top: 50%; left: 57%; width: 35%; padding: 0px 2%; background-color: #ffffff; text-align: left; font-size: 14px; line-height: 1.2; border:7px solid #dedcdd;}
#text_box_gallery_2 { position: absolute; top: 42%; left: 2%; width: 26%; padding: 0px 2%; background-color: #ffffff; text-align: left; font-size: 14px; line-height: 1.2;border:7px solid #dedcdd;}
#text_box_contact { position: absolute; top: 6%; left: 20%; width: 60%; padding: 0px 1%; background-color: #ffffff; text-align: left; font-size: 12px; }
#text_box_quality { position: absolute; top: 6%; left: 20%; width: 60%; padding: 0px 1%; background-color: #ffffff; text-align: left; font-size: 14px; }

#footer { position: relative;  padding: 0% 0px; clear: both; font-weight: 500 !important; z-index: 0;
	text-align: center; font-size: 12px !important; margin-top: 0px;
	clear: both; }
#footer p { font-weight: 500 !important; font-size: 11px !important; margin: 0px; line-height: 1.4; }
#footer .footer_categories {line-height: 1.4; font-size: 10px;}
#footer li { font-size: 10px !important; font-weight: 500 !important; display: inline-block; padding-right: 4px; }
#footer ul { margin: 0px; padding: 0px; }
#footer img.logo { width: 120px; margin: 8px 1% 0px 0; }
#footer h3 { margin: 0 0 8px 0; }
#footer .seperator { text-align: center; clear: both;} 
X#footer_bar {
	padding-left: 3000px;
	margin-left: -3000px;
	padding-right: 3000px;
	margin-right: -3000px;
	position: absolute; overflow: hidden; 
	top: 4px;
	height: 110px;
	z-index: -1; 
	border-top: 2px solid #6A685F;
	}
X.mobile #footer_bar { display: none; }

#footer_bar {
	margin: 20px 0;
	border-top: 2px solid #6A685F;
	}

.foot_pages a	 { padding: 0 1%;font-size: 12px;color: #000;display: inline-block; }
.foot_pages a.alt_type	 { padding: 0 2%; }
.foot_pages a.self	 { color: blue; }

/*** MailChimp Form ***/


.fb-follow { margin: 0px 0 0 0; float: right; text-align: right; padding: 16px 4px; width: 120px; height: 45px !important; overflow: hidden; }

.outside { width: 100%; position: relative; }
.inside { width: 100%; height: 100%; position: relative; text-align: center;}
.order_contact { display: inline-block; width: 207px; height: 27px;  z-index: 1; background: url("../images/template/contact-order-now.png") 0 -27px; }
.order_contact:hover { background: url("../images/template/contact-order-now.png")0 0; }
.join_mail_list { display: inline-block; width: 207px; height: 31px;  z-index: 1; background: url("../images/template/Join our email list.png") 0 -27px; }
.join_mail_list:hover { background: url("../images/template/Join our email list.png")0 0; }
.order_contact_dark { display: inline-block; width: 207px; height: 27px; background: url("../images/template/contact-order-now-d.png") 0 -27px; }
.order_contact_dark:hover { background: url("../images/template/contact-order-now-d.png")0 0; }
div#image_info.expanded+p { display: none; }
/** DISPLAY SINGLE & POP-UP **/
#display_image #screen { display: block; }
#single_box { position: relative; margin-top: -85px; z-index: 100;}
#pop_up { border: 8px solid black; z-index: 4; position: absolute; background-color: #fff; display:none;}
[ref=pop_up], [ref=click_close_only] { display: none; z-index: 4; position: absolute;  }
#result, #html_map {position: fixed; top: 10%; left: 20%; z-index:400;}
#html_page {} /** Used by Our South Bay Book and defined for it in book.css **/
.close { z-index:4; position: absolute; top: 4px; right:-96px; width: 32px; height: 32px; background: url('../images/template/close.png') no-repeat;}
#screen{ display:none; position:fixed; _position:absolute; /* hack for Internet explorer 6*/ 
	opacity: .7; /* Safari, Opera */ -moz-opacity:.7; /* FireFox */	filter: alpha(opacity=70); /* IE */
	height:100%; width:100%; top:0; left:0;
	background:#26221C; z-index:50;
	scroll: no-scroll;}

.outside { z-index: 3; border: 2px solid #000; background-color: #181313;
	padding: 24px 48px;
	-moz-border-radius:10px; -webkit-border-radius:10px; -opera-border-radius:10px; -khtml-border-radius:10px; border-radius:10px;-moz-box-shadow: inset 0px 0px 20px 5px #000, 10px 10px 30px 15px #181313; -webkit-box-shadow: inset 0px 0px 20px 5px #000, 10px 10px 30px 15px #181313; box-shadow: inset 0px 0px 20px 5px #000, 10px 10px 30px 15px #181313;
	width: 110%; margin-left: -10%; position: relative;}

.inside { z-index:3;  width: 100%;  position: relative; }
	
#main .outside h1 { background-color: rgba(255,255,255,.7); padding: 10px;
		  -moz-border-radius:8px; 	-webkit-border-radius:8px;   	-opera-border-radius:8px;  	-khtml-border-radius:8px; border-radius:8px;
			}
#main #single_main > img { -moz-box-shadow: 0 0 0 0 #000; -webkit-box-shadow: 0 0 0 0 #000; box-shadow: 0 0 0 0 #000; border: 3px solid white;}

#main .outside .nav { margin: 8px 0 0px -5%; }
#main .inside .nav { display: block;}
#single_main.pan { margin: 36px auto 16px; }
#image_info > div.expanded { -moz-box-shadow: inset 0px 0px 0px 0px #000; -webkit-box-shadow: inset 0px 0px 0px 0px #000; box-shadow: inset 0px 0px 0px 0px #000;  }

@media only screen and (max-width: 780px) {
  body.X {
    background-color: lightblue;
  }
  #main_menu {  }
  div#header { height: auto; }
  #header h1 {  margin: auto; } /*Force 2 lines */
  #header h2 { margin-top: -4px !important; }
 .nomobile { display: none; }
  	.container.books .col-4.sm-6 { width: 50% !important; max-width: 50% !important; flex: 50% !important; }
}


.big-form  {

	max-width: 400px;
	width: 100%;
	font-size: 115%;
}	
.big-form td select {    }
.big-form button, .big-form input, .big-form select, X.big-form textarea, X.big-form p {
    padding: 5px 10px;
    margin: 10px auto;
    padding: 5px 10px;
}

/** Updates Sept 2020 **/
@media only screen and (max-width: 780px) { .tagline { display: none; }}

#text_box_contact {
    left: 5%;
	width: 90%; }

@media only screen and (min-width: 780px) {
	#header h1 { font-size: 26px; }
	#text_box_contact {
		left: 10%;
		width: 80%; }}
@media only screen and (min-width: 960px) {
#header h1 {font-size: 30px; }}

@media only screen and (min-width: 1200px) {
	#text_box_contact {
		left: 20%;
		width: 60%; }}
		
img.photo[src*="Andhra-Pradesh-Sunflowers"], 
img.photo[src*="Andhra-Pradesh-Sunflowers"]:hover {
    height: 100%;
    width: auto;
    max-width: none;

    position: relative;
    left: 50%;
    transform: translateX(-50%);
}