body {
	background-color: #f7f7f7;
}

a {
	color: #e0d1bf;
	text-decoration: none;
}
nav a,  footer a {
	color:#b39879;
}

p {
  margin-bottom: 1rem;
}

ul {
	list-style: none;
}

/* Main Nav */
nav {
  height: 3em;
    background: #f7f7f7;
}

h1 {
  font-size: 3em;
  line-height: 1.4em;
}

h2 {
  font-size: 2em;
  margin-bottom: 1rem;
  color: #575c5d;
}

h3 {
	font-size: 1.5em;
}

.nav {
	width: 100%;
	height: 5rem;
	position: fixed;
	top: 0;
	z-index: 1001;
	border-bottom: 1px solid #b39879;
	background: #f7f7f7;
}

 
.nav-links li {
	border-left: 2px solid #cccccc;
}
 
.nav-links li a {
  color: #b39879;
  
}
 
/* Main content */
.artspace {min-height: calc( 100vh - 2rem)}
.section {
	display: grid;
    grid-template-columns: 33% 33% 34%;
    grid-gap: 0;
    margin: 0;
	padding: 5rem 0 0 0;
}
.section.gallery {
	grid-template-columns: 10% auto 10%;
	background-color:#f7f7f7;
}
 
.section.gallery .col-1-2 img { height: 85vh; /*max-width:100%*/ }
.section .col-1-2 { grid-column: span 2;}
.section .col-1-3 { grid-column: span 3;}
.section.gallery .col-1-2 {overflow: hidden;height: 90vh;}

.section .col-3 {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 1rem;
	width: min-cotent;
}

.container {
	padding: 0;
	text-align: left;
	position: relative;
}

.artistArtLarge {
	width: 500px;
    height: auto;
    position: relative;
    margin: 0 auto;
    text-align: center;
}

.artistArtLarge img {max-height: 100%;padding: 1rem;max-width: 100%;}
.artistArtLarge .nineframe img  {padding: 0.2em;}
.artSpec { margin-top: 2rem;}
.artSpec .contact { display: flex; justify-content: space-between; clear: both;}
.artSpec .contact h3 span { font-size: 11px; font-size: 0.8rem; font-weight: 100;}
.views {width: 40%; min-width: 150px; float: right; text-align: left;}
.artspace .col-1-2 { background-color: #FFFFFF;}
.viewbutton {cursor: pointer;color: #8c6942;clear: both;}
.three-columns {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap:4rem;
    width: 94%;
    margin-right: auto;
    margin: 2rem auto;
}
.three-columns.mini {width:100%; padding-right: 1%; grid-gap: 1rem;}
.artrelative {text-align: center;position: relative;background-color: white;padding: 1em;}
a .artrelative, .artrelative a {color: #43484b;}
.dark, .bio { margin: 0;  }
.dark p { margin: 2rem;}
.dark h1, .dark h2  { margin: 1rem 2rem;}
.dark  { background-color: rgba(0, 0, 0, 0.82); height: 100%}
.newart { background-color: #0e0e0e; padding: 2rem 0.5rem; text-align: center;}
.taupe {background-color: #f7f7f7; color: #656565; }
.gold {	background: #f9f9f9; color: #13120c; }
.textbloc{padding: 2rem 4rem; display: flex; flex-direction: column; justify-content: center;}
.textbloc p {	margin: 1rem 0; font-size: 0.9em;	max-width:700px;}
.textdark {	padding: 0 4rem 2rem 4rem;}
.textdark  img{max-width: 100%; height: auto;}
.carousel2 {padding: 2rem 0;} 
.carouselbloc { position: relative; width: 80%;  }
.mtop {margin: 7rem 5rem; }
.rel { position: relative; }
.img-gal {max-width: 100%;height: auto;position: sticky;} 
.img-MC {width:100%; margin: 0 auto;}
.sidetext {margin: 1rem 2rem;}
.textbox {
    padding: 2rem 4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.overtext1 {
	position: absolute; 
	padding: 2rem;
	color: #43484b;
	width:calc( 33% - 1rem);
	top: 1em;
	right: 1em;
}
.basket {width:100%; padding: 2rem 0;}
.overtext {position: absolute; padding: 2rem;color: #f7f7f7;bottom: 0;width:100%;background: rgb(0,0,0);background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 50%, rgba(0,0,0,0) 100%);} 
.overtext h2 {color: #FFFFFF;}
.dark p.caption, .caption { font-size: small; }
.artistRep{width:100%; text-align: center;}
#mainpic{height:auto; transition:3s; overflow:hidden; position: relative;}
#mainpic.hide{width:0;transition:3s; }
#reppic{height: 0; transition:3s; overflow:hidden;position: relative;}
.sizerep{background-image: url('/img/sizeRepR.jpg');width:700px;height:517px; margin: 1rem auto;padding:0;}
.sizerep p{font-size:0.9em;color: #555555; }
.sizerepimg img {border: 1px solid #cccccc; -webkit-box-shadow: 9px 9px 12px -8px rgba(0,0,0,0.75);
-moz-box-shadow: 9px 9px 12px -8px rgba(0,0,0,0.75);
box-shadow: 9px 9px 12px -8px rgba(0,0,0,0.75);}
.sizerepimg.frame img { padding:0.1rem; background-color: #111111; border: 5px solid #252424;}
.border  {border: 1px solid #cccccc; margin-top: 1rem; }
.trayframe {margin-top: 1rem; background-color:#111111; border: 4px solid #252424; }
.nineframe {margin-top: 1rem; background-color:#111111; border: 4px solid #252424;}
/*shopping cart */
.productBox, .productBoxF {overflow: hidden;
		display: flex;
		justify-content: space-between;
		line-height: 1.5em;
        text-align: left;
        width: 100%;
        padding: 0.2rem;
        margin: 8px 0;
		background-color: #ffffff;
		border-bottom: 1px solid #ccccac
    }
	.productBoxF label {}
	.removeItem {background-color: #e3b16e;padding: 0.2rem 0.2rem 0 0.2rem;}	
	#orderTotalsDisplay {width: 50%;margin-left: 35%;}
	#checkout_Buttons input[type="submit"]{float:right; margin-left: 1rem; cursor: pointer;}
	form {max-width: 900px;}
/* Form style */
label {
    font-size: .875rem;
    color: #4d4d4d;
    cursor: pointer;
    display: block;
    font-weight: 400;
    line-height: 1.5;
    margin-bottom: 0;
}
.titleinput input, .nameinput input, .halfforminput input, .forminput input, .forminput textarea, .forminput select {
    padding: 6px; line-height: 1.6rem; background-color: #fff; width: calc(100% - 10px); color: #222; border:0; margin: 5px 0; 
}
.titleinput {
    width: 12%;
    float: left;
    margin: 0;
}
.nameinput {
    width: 44%;
    float: left;
    margin: 0;
}
.halfforminput {
    display: inline-block;
    padding: 6px 0;
    width: 49.5%;
    color: #222;
    margin: 5px 0;
}
select {
    -webkit-appearance: none!important;
    border-radius: 0;
    background-color: #FAFAFA;
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgeD0iMTJweCIgeT0iMHB4IiB3aWR0aD0iMjRweCIgaGVpZ2h0PSIzcHgiIHZpZXdCb3g9IjAgMCA2IDMiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDYgMyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+PHBvbHlnb24gcG9pbnRzPSI1Ljk5MiwwIDIuOTkyLDMgLTAuMDA4LDAgIi8+PC9zdmc+);
    background-position: 100% center;
    background-repeat: no-repeat;
    border-style: solid;
    border-width: 1px;
    border-color: #ccc;
    padding: .5rem;
    font-size: .875rem;
    font-family: "Helvetica Neue",Helvetica,Roboto,Arial,sans-serif;
    color: rgba(0,0,0,0.75);
    line-height: normal;
    border-radius: 0;
    height: 2.3125rem;
	width: 100%;
}
.contact form {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-gap: 20px;
}

.contact form label {
  display: block;
}

.contact form p {
  margin: 0;
  position:relative;
}

.contact form .full {
  grid-column: 1 / span 2;
}

.contact form button, .contact form input, .contact textarea {
  width: 100%;
  padding: 1em;
  border: 1px solid #524c5a;
  color: #000;
  border-radius: 4px;
}

.contact form button {
  background: #f7c22b;
  color: #fff;
  border: 0;
  text-transform: uppercase;
}

.contact form button:hover,.contact form button:focus {
  background: #8f8b95;
  color: #fff;
  outline: 0;
  transition: background-color 2s ease-out;
}
.ardluck {display: none;}

form input[type="submit"], .submitbutton {
	background-color:#5a5f5d ; color:#FFF; padding: 1rem; border-radius:5px; border: 0; 
	font-size: 16px; width:auto; font-family: 'Sarabun', sans-serif;
}
 
form input[type="submit"]:hover, .submitbutton:hover, .socialblob:hover {
	background-color:#b2a39f;
}
.artworkfrm { /*display: flex;*/ 	justify-content: space-between;}
 
  
/* Media */
@media screen and (min-height: 800px) {
	.artistArtLarge {width: 600px;}
}
@media screen and (min-height: 1000px) {
	.artistArtLarge {width: 700px;}
}
@media screen and (min-height: 1200px) {
	.artistArtLarge {width: 800px; max-width: 100%}
}
@media screen and (min-height: 1400px) {
	.artistArtLarge {width: 1000px;max-width: 100%}
}

@media screen and (max-width: 1100px) {
	.artworkfrm {flex-direction:column}
}
@media screen and (max-width: 1000px) {
	.line { background: #b39879}
	.nav-links li { border-left: 0;}
	.section.gallery, .section, .footer, .contact form, .section .col-1-2, .section .col-3 {grid-template-columns: 1fr; padding: 0;}
	.section:first-of-type{margin-top:5rem;}
	.section .col-1-2 { padding: 1rem 2rem;}
	.textdark { padding: 2rem;}
	.top-container h1 { margin: 2rem 0 0; line-height: 1.2}
	.section-grid {	margin: 0;}
	.three-columns { grid-template-columns: repeat(2, 1fr);}
	.three-columns.mini { grid-template-columns: repeat(3, 1fr);}
	.row > .mini { grid-template-columns: repeat(3, 1fr);}
	.artistArtLarge { width: 50%;}
}
	
@media screen and (max-width: 800px) {
	.three-columns { grid-template-columns: 1fr; }
	.three-columns.mini { grid-template-columns: repeat(3, 1fr);}
	.artistArtLarge { width: 60%;}
	.bar-left { float: unset;}
	.section.gallery .col-1-2 img {height: 50vh;}
	#reppic {overflow: scroll;}
	.clsbtn {left: 0; right: auto;}
	.prevbtn {top: 1px;}
	.textbloc {padding: 2rem;}
}
@media screen and (max-width: 580px) {
	.artistArtLarge {width: 100%; margin-top: 2rem;}
	.artistArtLarge img {padding: 0}
	.trayframe {border: 7px solid #252424; }
	.nineframe {border: 1px solid #252424;}
	.section.gallery .col-1-2 {width: 100%;padding: 0;}
	.carouselbloc .overtext {position: relative; padding: 0 2rem; }
	#orderTotalsDisplay {width: 100%; margin-left: 0;}
	.removeItem {padding: 0;margin-left:0.2rem}
	#addingbasket p {display: none;}
	#addingbasket div {padding: 0.1rem;}
	footer form {flex-direction: column;min-width: 1px;}
	footer form div {width: 96%;margin: 0.2rem 0;}
}
@media screen and (max-width: 420px) {
	.img-prt {width: 70%; left: 15%;}
	.mtop {margin: 7rem 1rem 1rem;}
}
.zoom {display:inline-block;position: relative;}
.zoom img {display: block;}
.zoom img::selection { background-color: transparent;}