/*
Theme Name: SSarley Art
Theme URI: http://finesas.com
Author: Jacob Cohen
Author URI: http://fn5x.com
Description: The theme for Stephanie Sarley's Wordpress Site
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: art
*/

/*hoveract*/
@keyframes hoveract{from {color: inherit;}to {color: rgba(246,216,252,1);}}
@-moz-keyframes hoveract{from {color: inherit;}to {color: rgba(246,216,252,1);}}
@-webkit-keyframes hoveract{from {color: inherit;}to {color: rgba(246,216,252,1);}}
@-o-keyframes hoveract{from {color: inherit;}to {color: rgba(246,216,252,1);}}

/*hoveract2*/
@keyframes hoveract2{from {opacity: 1;}to {opacity: .7;}}
@-moz-keyframes hoveract2{from {opacity: 1;}to {opacity: .7;}}
@-webkit-keyframes hoveract2{from {opacity: 1;}to {opacity: .7;}}
@-o-keyframes hoveract2{from {opacity: 1;}to {opacity: .7;}} 

/*comments*/

ul.post-comments{
	margin: 0;
}

li.comment{
	margin: 40px;
	font-size: 14px;
}
li.comment .comment-body{
	border-bottom: 1px solid #ccc;
	padding: 0 0 20px;
}

li.comment div.reply{
	text-align: right;
	margin: -5px 10px -15px 0;
}

li.comment .comment-body p{
	margin: 25px 15px 0;
}

.comment-author img{
	display: inline-block;
}
em.comment-awaiting-moderation{
	margin: 0 0 0 5px;
	font-size: 10px;
	color: #c30;
}
.comment-meta.commentmetadata{
	font-size: 10px;
	margin: 5px 0 0 0;
}

.comment-author cite.fn,
.comment-author span.says{
	margin: 5px 0;
	font-size: 80%;
}

.commentForm input[type='text'],
.commentForm textarea{
	border: 1px solid #000;
}

.commentForm textarea:hover,
.commentForm input[type='text']:hover{
	border-color: #ccc;
}
.commentForm p.logged-in-as{
	font-size: 60%;
}

h3.comment-reply-title{
	padding: 0 0 5px;
}
.comment-reply-title small{
	font-size: 57%;
}
.comment-reply-title small a{
	color: #666;
}
section>div.commentForm,
section>div.comments{
	border-top-width: 1px;
	min-height: 0;
	padding: 10px 0 15px;
	margin: -1px 0 0;
}
.comment-notes{
	font-size: 55%;
}
.comment-form-comment,
.comment-form-author,
.comment-form-email{
	margin: 10px 0;
}
.comment-form-comment label,
.comment-form-author label,
.comment-form-email label{
	display: block;
	font-size: 70%;
	padding: 0 0 0 2px;
}
.comment-form-comment textarea{
	width: 95%;
	height: 50px;
	padding: 10px 20px;
}
.comment-form-comment label{
	display: none;
}
label[for='wp-comment-cookies-consent']{
	font-size: 60%;
	top: -2px;
	position: relative;
}
.comment-form-author input,
.comment-form-email input{
	padding: 5px 10px;
}
.form-submit input.submit{
	padding: 5px 10px;
	margin: 5px 0 0;
}

/*common*/
*{
	margin: 0;
	padding: 0;
}
*:focus {
    outline: none;
}
html,body{
	font-size: 1em;
	width: 100%;
	margin: 0;
	color: #000;
	font-family: Helvetica Neue, Helvetica, Arial, san serif;
	letter-spacing: .075rem;
	font-weight: 400;
	cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="25" style="font-size: 20px;"><text y="22">%F0%9F%8D%8A</text></svg>'), auto;
}
a{
	color: #000;
	text-decoration: none;
	cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="25" style="font-size: 20px;"><text y="22">%F0%9F%A5%9B</text></svg>'), auto;
}
a:hover{
animation: hoveract .2s;
-moz-animation: hoveract .2s; /* Firefox */
-webkit-animation: hoveract .2s; /* Safari and Chrome */
-o-animation: hoveract .2s; /* Opera */
color: rgba(246,216,252,1);
cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="25" style="font-size: 20px;"><text y="22">%F0%9F%A5%9B</text></svg>'), auto;
}
ul{
	list-style-type: none;
}
section .videoGallery .wp-video{
    display: inline-block;
    max-width: 26.8%;
    min-width: 0;
}
.videoGallery .wp-video video{
    display: block!important;
	width: 99.9%;
    border: 2px solid #000;
}
.videoGallery .wp-video video,
.videoGallery .wp-video video:hover{
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="19" height="25" style="font-size: 20px;"><text y="22">%F0%9F%A5%9B</text></svg>'), auto;
}
.videoGallery .wp-video video:hover{
	opacity: .7;
}
section .nln .wp-video{
	max-width: 100%;
	min-width: 100%;
	display: block;
}
.wp-video video{
	width: 100%;
	height: auto;
	display: block;
}
/*
.wp-video video::-webkit-media-controls {
  display: none;
}*/

.wp-video video::-web-media-controls-download-button{
	display: none;
}

video::-webkit-media-controls-enclosure {
    overflow:hidden;
}

video::-webkit-media-controls-panel {
    width: calc(100% + 30px); /* Adjust as needed */
}
img{
	max-width: 100%;
	    height: auto;
}
h1, h2, h3, h4 ,h5 ,h6{
	font-size: 100%;
	margin: 0;
	font-weight: 400;
}
div#wrapper{
	width: 100%;
	background: #fff;
}
div#inner{
	max-width: 1010px;
	width: 100vw;
	margin: 0 auto;
	background: #fff;
}
header, section, footer{
	width: calc(100% + 1px);
}
header h1, header nav, footer #end{
	width: 100%;
}
header h1, header nav{
	background: #000;
	color: #fff;
}
header h1{
	padding: 1% 0 0;
	font-size: 250%;
}
header h2{
	float: right;
    margin: -3.3em 18px 0;
    font-size: 130%;
    color: #fff;
}
header a{
	color: #fff;
	letter-spacing: .175rem;
}
header h1 a{
	padding: 1.5% 0 1% 5%;
	display: inline-block;
}
header nav{
	font-size: 130%;
	padding: 1.2% 0 1%;
}
header nav div{
	width: 86%;
	margin: 0 auto;
}
.hide{
	display: none;
}
nav div *{
	list-style: none;
}
nav ul{
	margin: 0;
}
header nav ul li{
	display: inline-block;
	margin: 0 2.6% 1.4% 0;
}
section>div{
	border: 4px solid #000;
	max-width: 100%;
	min-height: 33rem;
	padding: 0 0 4%;
	font-size: 113%;
}
footer{
	padding: .5% 0;
	text-align: right;
}
section div.nln{
	padding: 0;
}
section .aligncenter{
	margin: 0 auto;
	text-align: center;
}
section .nln p{
	line-height: 0;
}
section .nln img{
	width: 100%;
	height: auto;
	display: block;
}
dl{
	margin: 0;
}
section>div>*{
 margin: 2%;
}
section>div .gallery{
    margin: 0 0 5%;
}
section div.nln *, section>div .gallery *{
	padding: 0;
	margin: 0;
}
section .videoGallery{
	text-align:center;
}
section>div .gallery dl,
section .videoGallery .wp-video{
	display: inline-block;
	width: 27.7%;
	margin: 9.9% 2.8% 0;
}
section>div .twoCol{
	width: 35%;
	margin: 7.5% 0 0 7.5%;
	display: inline-block;
}
.twoCol p{
	margin: 11px 0 0 5px;
}
section>div#store .gallery dl{
	width: 32%;
}
section>div#store .gallery dl span{
	margin: 0 auto;
}
dl *{
	display: block;
}
section>div .gallery dl span{
	display: block;
	margin: 2% auto 0;
	text-align: center;
}
section>div .gallery dl img{
	width: 100%;
	margin: 0 auto;
	border: 2px solid #000;
}
dl dt{
	cursor: pointer;
}
dd{
/*     position: absolute; */
    text-align: center;
/*     width: 20.6%; */
    min-width: 262px;
}
section div a:hover img, dl dt:hover img{
	animation: hoveract2 .75s;
	-moz-animation: hoveract2 .75s; /* Firefox */
	-webkit-animation: hoveract2 .75s; /* Safari and Chrome */
	-o-animation: hoveract2 .75s; /* Opera */
	opacity: .7;
}
/*aboot*/
section #be3{
	margin: 5% 0 5% 2%;
}
section #be3 h3{
	font-weight: 500;
}
/*store*/
#store div.items{
	display: inline-block;
	margin: 0 2.8% 10%;
	text-align: center;
	width: 93%;
	font-size: 140%;
}
#store div h1{
	width: 100%;
	margin: 5.5% 0 0% 3%;
	padding: 0 0 .2%;
	border-bottom: 2px solid #000;
	width: 93%;
	text-align: right;
	font-size: 113%;
}
#store form input[type="submit"]{
	display: block;
	margin: 0 auto;
	background: #fff;
	border: 2px solid #000;
	border-radius: 5px;
	font-size: 1.2rem;
	padding: 2% 4%;
	text-align: center;
	cursor: pointer;
}
#store form input[type="submit"]:hover{
	background: #000;
	color: #fff;
	cursor: pointer;
}
#store a#vwcrt{
	float: left;
	cursor: pointer;
}
#store nav{
	width: 98%;
	border-bottom: 3px solid #000;
	padding: 0 0 0 2%;
	margin: 0;
	font-size: 130%;
}
#store nav a{
	width: 13%;
	text-align: center;
	display: inline-block;
	padding: 2% 0;
}
#store #chkout{
	font-size: 1.2rem;
}
#chkout dt{
	padding: 3% 2% 2%;
}
#chkout dt input[name="quantity"]{
	font-size: 1.1rem;
	padding: 1%;
	width: 30%;
	text-align: right;
}
#chkout table{
	width: 100%;
	text-align: right;
	font-size: 1.2rem;
	border-collapse: collapse;
}
#chkout table th{
	padding: 0 0 .375rem;
}
#chkout table td{
	padding: .375rem 0;
}
#chkout table .btm td{
	padding: .375rem 0 0;
	font-size: 1.05rem;
}
#chkout table tr .lal{
	text-align: left;
	padding-left: .375rem;
}
#chkout table tr.btmln>*{
	border-bottom: 3px solid #000;
}
#chkout table tr.topln>*{
	border-top: 3px solid #000;
}
#chkout table tr.wpspsc_checkout_form td form{
	padding: .75rem 0 0;
}
.wp_cart_empty_cart_section, .wp_cart_visit_shop_link{
	width: 100%;
	text-align: center;
	font-size: 1.3rem;
	margin: 15% 0 -12%;
}
/*links*/
section div #lnks{
	width: 80%;
	margin: 10% auto 30%;
	text-align: center;
	font-size: 1.3rem;
	border: 2px solid #000;
	padding: 10% 0;
	box-shadow: 10px 10px 0px #000;
}
section div #lnks p{
	margin: 0 0 4%;
}

/*video gallery*/

#wrapper section #huge_it_videogallery{
	background-color: #fff;
	box-shadow: none;
	padding: 0;
	margin: 20px auto;
	margin-bottom: 0;
}
section>div>section{
	margin: 0;
}
#wrapper #huge_it_videogallery .huge_it_big_li,
#wrapper section #huge_it_videogallery li a,
#wrapper section #huge_it_videogallery li img{
	border-radius: 0;
}
#wrapper #huge_it_videogallery li img{
	max-width: 100%;
}
#wrapper #huge_it_videogallery .huge_it_big_li{
	margin: 10% 2.8% 0!important;
}

#wrapper section #huge_it_videogallery li .infoLayer{
	display: none!important;
}
#wrapper section #huge_it_videogallery li .overLayer{
	border-radius: 0;
}
#wrapper section #huge_it_videogallery li:hover .overLayer{
	-webkit-transition: opacity 0.2s linear;
	-moz-transition: opacity 0.2s linear;
	-ms-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
	opacity: 0.3;
	display: block;
	background: rgba(246,236,252,1);;
}
.videowall-endscreen{
	display: none;
}