@font-face { font-family: Oswald-Medium; src: url('../fonts/Oswald-Medium.ttf'); }
@font-face { font-family: Oswald-Regular; src: url('../fonts/Oswald-Regular.ttf'); }
@font-face { font-family: Oswald-Light; src: url('../fonts/Oswald-Light.ttf'); }
@font-face { font-family: Oswald-ExtraLight; src: url('../fonts/Oswald-ExtraLight.ttf'); }

/* ----------------------------- Vars */
:root {

	--gray-1: #f0f0f0;
	--gray-2: #555555;

	--size-1: 1502px;
	--size-2: 500px;
}


*{
	box-sizing:border-box;
}

body{
	font-family: Oswald-Light;
}

a{
	color: inherit;
	text-decoration: none;
}

a:hover{
	color: inherit;
	opacity: .8;
}

.text-gray-1{ color: var(--gray-1)  }
.text-gray-2{ color: var(--gray-2)  }
.bg-gray-1{ background-color: var(--gray-1)  }
.bg-gray-2{ background-color: var(--gray-2)  }

.max-width-2{ max-width: var(--size-2)  }

a:not(.product):hover img{
	opacity: 0.8
}



@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

@keyframes show-in {
	0% { opacity: 0 }
	100% { opacity: 1 }
}

@keyframes show-left {
	0% { transform: translateX(100px); opacity: 0 }
	100% { transform: translateX(0px); opacity: 1 }
}

@keyframes show-up {
	0% { transform: translateY(100px); opacity: 0 }
	100% { transform: translateY(0px); opacity: 1 }
}
@keyframes show-down {
	0% { transform: translateY(-100px); opacity: 0 }
	100% { transform: translateY(0px); opacity: 1 }
}

.spin{ animation: spin 1s linear infinite; }
.show-in{ animation: show-in 1s linear forwards; }
.show-in-2s{ animation: show-in 2s linear forwards; }
.show-left{ animation: show-left .5s linear forwards; }
.show-up{ animation: show-up .5s linear forwards; }
.show-down{ animation: show-down .5s linear forwards; }



.sbanner .carousel-item {
	transition: 3s ease-in-out;
}

.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
	transition: opacity 0s 3s;
}


.alert{ 
	padding: 8px 10px;
	font-size: 15px;
	letter-spacing: .5px;
	border-radius: 0px;
	box-shadow: 0px 0px 10px -7px;
}

.badge.sup{
	position: absolute;
	transform: translate(-10px, -5px);
	font-size: 60%;
	opacity: .9;
}

.body{ display: flex; width: 100% }

.body .sidebar{ width: 314px; color: var(--gray-2); font-size: 21px }
.body .sidebar .logo img{ width: 100%; max-width: 145px }
.body .sidebar .inner{ padding: 38px 64px; }

.sidebar nav a{
	display: block;
	margin-top: 5px
}

.sidebar nav .subitem{
	font-size:80%;
	border-left:1px solid;
	padding-left:10px;
}

.body .content{
	flex: 1;
	padding-right: 1px;
	word-break: break-word;
}

.page{
	
}

footer{
	background: #a8a8a8;
	color: #FFF;
}

footer .inner{
	padding: 80px 46px 40px 314px;
	display: flex
}

footer .logo{ width: 180px; opacity: 0; transition: all .5s; transform: translateX(-200px); }
footer.show .logo{ opacity: 1; transform: translateX(0px); }

footer .logo-gov{opacity: 0; transition: all .5s; transform: translateY(200px); }
footer.show .logo-gov{ opacity: 1; transform: translateY(0px); }
footer .logo-gov img{ max-height:100px }

footer .nav{
	width: 2000px;
	flex-direction: column;
	font-size: 20px;
	transition: all .5s;
	border-bottom: 3px solid;
}
footer.show .nav{ width: 200px; }


footer .nav a{
	display: block;
	margin-bottom: 5px;
}
footer .info{
	flex: 1;
	text-align: right
}

footer .copyright{ transition: all 3s; opacity: 0 }
footer.show .copyright{ opacity: 1 }


.line-white{ width: 100%; max-width: 410px; margin-right: 40px; height: 2px; background: #FFF }
.date{ position: relative; margin-bottom: 8px; display: inline-block; }
.date:after{position: absolute; content: ''; width: 31px; height: 5px; background: #e9af00; left: 50%; bottom: -8px; transform: translateX(-50%); }

.product{ color: var(--gray-2); overflow: hidden; }
.product .author{ font-size: 21px; }

.product.scroll{ opacity: 0; transition: all 1s; }
.product.scroll.show{ opacity: 1; }

.product.scroll .photo{ transform: translateY(300px); transition: all 0.5s; }
.product.scroll.show .photo{ transform: translateY(0); }

.product .photo{ overflow: hidden; background: rgba(255,255,255,.6); }

.product .photo img{transition:all 0.5s; max-width: 100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); max-height: 800px; }
.product:hover .photo img{max-height: 100%; width: auto; left:50%; top:50%; transform:translate(-50%,-50%) }

.product .photo .img-1{ transition:all .5s; opacity:1; }
.product:hover .photo .img-1{ opacity:1; opacity:0; }

.product .photo .img-2{ transition:all .5s; opacity:0; }
.product:hover .photo .img-2{ opacity:1; opacity:1; }

.carousel-caption { right: 50px; left: 50px; }
.carousel-indicators { justify-content: end; margin-right: 50px; margin-left: 50px; }


.rs span{ width: 39px; height: 39px; margin-left: 8px; display: inline-block; border-radius:100%; }
.rs span:hover{ border:1px solid #FFF }

.rs .tt{ background-image: url(../imgs/ico-tt.png) }
.rs .fb{ background-image: url(../imgs/ico-fb.png) }
.rs .ig{ background-image: url(../imgs/ico-ig.png) }




.page-text{ max-width: 880px; }
.internal-links{ max-width: 665px; margin-right: 40px }



.artist .name{ font-size: 23px; text-transform: uppercase; }

.hide{ display:none; }




.captcha{
	width:170px;
	margin: 10px 0;
	display:inline-block;
	background:rgba(0,0,0,0.1);
	padding:10px;
	text-align:left;
	border-radius:4px;
	font-weight:300;

}
.captcha span{
	float:right;
	line-height: 30px;
	font-size:13pt;
	font-weight: bolder;
	margin-right:10px;
}
.captcha .check{
	border-radius: 3px;
	width:30px;
	height: 30px;
	border: 2px solid green;
	display:inline;
	position: absolute;
	cursor: pointer;
}

/*Styles for check animation*/
.check .wrapper {
	width: 25px;
	display: inline;
	margin: 4em auto 0;
}

.check .checkmark {
	stroke: green;
	stroke-dashoffset: 745.74853515625;
	stroke-dasharray: 745.74853515625;
	-webkit-animation: dash 2s ease-out forwards;
	animation: dash 2s ease-out forwards;
}

@-webkit-keyframes dash {
	0% {
		stroke-dashoffset: 745.74853515625;
	}
	100% {
		stroke-dashoffset: 0;
	}
}

@keyframes dash {
	0% {
		stroke-dashoffset: 745.74853515625;
	}
	100% {
		stroke-dashoffset: 0;
	}
}
/*End check animation*/




