@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400');
body {background-color:#fafafa;font-family:'Source Sans Pro', sans-serif;color:#707072;font-size:17px;overflow:auto;margin:0;padding:0}
p {color:#666;line-height:1.8em}
p a{color:#666;text-decoration:none;transition:color 0.40s ease-in-out}
p a:hover{color:#bf9c62}
a {color:#666;text-decoration:none;transition:color 0.40s ease-in-out}
a:hover {color:#bf9c62}
img {text-align:center;max-width:98%;height:auto}
/* Classes------------------------------------- */
h1 {color:#000; 
	font-size:26px;letter-spacing:-0.02em; font-family: 'Source Sans Pro', sans-serif; font-weight:300; margin: 0px; padding-top: 15px}
h2 {font-family:'Source Sans Pro', sans-serif;font-size:14px;margin: 0px; padding: 0px; font-weight:300;letter-spacing:0.02em;}
.reddot {
	color: #ed1c24;
	}
/* Arrows------------------------------------- */

.outerleft {
    display: table;
    position: fixed;
    height: 100%;
    width: 70px;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

.left {
    margin-left: 30px;
    width: 70px;
}

.outerright {
    display: table;
    position: fixed;
    height: 100%;
	right: 0px;
    width: 70px;
}
.right {
    margin-right: 0px;
    width: 70px;
}


.left img, .right img{
    width: 45px;
}

/* image popup------------------------------------- */
.shadow { max-height: 820px; 
	box-shadow: 0px 24px 25px -4px rgba(221,221,221,1); 
	margin-top: 33px;
	pointer-events: none; -khtml-user-select: none;
    -o-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    user-select: none;
	-webkit-animation: fadein 1s;-moz-animation: fadein 1s;-ms-animation: fadein 1s;-o-animation: fadein 1s;animation: fadein 1s}
	@keyframes fadein {from{ opacity: 0; }to{ opacity: 1; }}
.close {
  position: fixed;
  right: 0px;
  top: 0px;
  width: 50px;
  height: 50px;
  z-index: 500;
}
.close:before, .close:after {
  position: absolute;
  left: 24px;
  top: 6px;
  content: ' ';
  height: 35px;
  width: 2px;
  background-color: #767676;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}
/* Div ids------------------------------------- */
#wrapper {
	margin:0 auto;
	max-width:1600px;
	width:100%;
	}
#painting {
	text-align:center;
	width:100%;
	font-size:16px; 
	line-height: 1.15em;
	}
/* Responsive adjusts------------------------------------- */
@media only screen and (max-width:1600px) {
.close {
  width: 30px;
  height: 30px;
}

.left img, .right img{
    width: 40px;
}

#painting { 
	line-height: 1em;
	}
.close:before, .close:after {
  left: 15px;
  top: 4px;
  content: ' ';
  height: 24px;
  width: 2px;
}
.buttonlight {
    font-size: 0.60em;
    padding:16px 26px;
}
    #collectorspreview {
  display: none;
  }
.shadow {max-height:548px;}
h1 {font-size:22px;}
}
/* Phone screen------------------------------------- */
@media only screen and (max-width:500px) {
#wrapper {
	max-width:98%;
	}
	
.outerleft, .outerright {
    display: none;
}

}
