/*
Theme Name: qzrstudio
Theme URI: http://underscores.me/
Author: QZR Studio
Author URI: https://qzrstudio.com/
Description: Description
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: qzrstudio
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

qzrstudio is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/

@import url("font/founders-grotesk-text.css?v=2");

* {
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	-webkit-text-size-adjust: 100%;
}
body{
	font-family: 'founders_grotesk', sans-serif;
	font-size: 23px;
    line-height: 1.2;
}

body.bkg-black{
	color: white;
	background-color: black;
}
img{
	border: 0;
}
ul li{
	list-style: none;
}
a{
	text-decoration: none;
	color: black;
}
body.bkg-black a{
	color: white;
}
.button a,
.newsletter input[type="submit"],
.qzr_form button[type="submit"]{
	background-color: black;
    color: white;
    padding: 3px 5px;
    cursor: pointer;
	border: 0;
	text-transform: uppercase;
	display: inline-block;
}

.qzr_form button[type="submit"] {
	margin-top: 20px;
}

body.bkg-black .button a{
	background-color: white;
    color: black;
}
.button a,
.single-video #content .button a{
	color: white;
	text-decoration: none;
}
.single-project #content .button a{
	text-decoration: none;
}
#page.it .en,
#page.en .it{
	display: none;
}

/* HEADINGS */

h3{
	font-size: 2.3em;
	font-weight: 400;
}
h2{
	font-size: 2.3em;
	font-weight: 300;
}


/* COLONNE */
.main-column {
	position: relative;
	margin: 0 auto;
	height: auto;
	max-width: 1060px;
}

.column-of-1 { width: 100% }
.column-of-2 { width: 50% }
.column-of-3 { width: 33.33% }
.column-of-4 { width: 25% }
.column-of-5 { width: 20% }
.double-column-of-3 { width: 66.66% }
.columns-1  { width:  10% }
.columns-2  { width:  20%; }
.columns-3  { width:  30%; }
.columns-4 	{ width:  40%; }
.columns-5 	{ width:  50%; }
.columns-6 	{ width:  60%; }
.columns-7 	{ width:  70%; }
.columns-8 	{ width:  80%; }
.columns-9 	{ width:  90%; }
.columns-10 { width:  100%; }

.column-of-1,
.column-of-2,
.column-of-3,
.column-of-4,
.column-of-5,
.double-column-of-3,
.columns-1,
.columns-2,
.columns-3,
.columns-4,
.columns-5,
.columns-6,
.columns-7,
.columns-8,
.columns-9,
.columns-10{
	position: relative;
}

/* PADDING */
.small-col-padding{
	padding-left: 10px;
	padding-right: 10px;
}
.col-padding {
	padding-left: 25px;
	padding-right: 25px;
}
.double-col-padding {
	padding-left: 50px;
	padding-right: 50px;
}
.row-padding {
	padding-top: 25px;
	padding-bottom: 25px;
}
.double-row-padding {
	padding-top: 50px;
	padding-bottom: 50px;
}
.right-padding{
	padding-right: 25px;
}

.left { float: left; }
.right { float: right; }
.center {
	position: relative;
	margin: 0 auto;
}
.clear { clear: both; }

.panel-grid{
	position: relative;
	background: white;
}
body.bkg-black .panel-grid{
	background: black;
}

.small-font{
	font-size: 0.61em;
}
.medium-font{
	font-size: 0.82em;
}
.big-font{
	font-size: 2.3em;
}

.first-of-page{
	padding-top: 140px;
}
.end-of-page{
	padding-bottom: 80px;
}

/* PLACEHOLDER */
::-webkit-input-placeholder {
	color: white;
}
:-moz-placeholder {
	color: white;
	opacity:  1;
}
::-moz-placeholder {
	color: white;
	opacity:  1;
}
:-ms-input-placeholder {
    color: white;
}
::-ms-input-placeholder {
    color: white;
}

/* HEADER */

#site-navigation a{
	position: fixed;
	z-index: 1;
	padding-top: 20px;
	padding-bottom: 20px;
	width: 160px;
	text-align: center;
	text-transform: uppercase;
    text-decoration: none;
}
#site-navigation-mobile{
	position: fixed;
    z-index: 2;
    top: 0;
    width: 100%;
}
#site-navigation a.active span{
	border-bottom: 3px solid black;
}
body.bkg-black #site-navigation a.active span{
	border-bottom: 3px solid white;
}
#site-navigation .top-navigation{
	left: 50%;
	transform: translateX(-50%);
}
#site-navigation .bottom-navigation{
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
}
#site-navigation .left-navigation{
	margin-top: 80px;
	top: 50%;
	left: 0;
	transform-origin: 0 0;
	transform: rotate(-90deg);
}
#site-navigation .right-navigation{
	margin-top: 80px;
	top: 50%;
	right: 0;
	transform-origin: 100% 0;
	transform: rotate(90deg);
}
.reverie-menu li a{
	text-decoration: none;
}
.reverie-menu li.active a{
	text-decoration: underline;
}
header  .site-branding{ 
    background-color: white;
	padding: 10px;
    border-bottom: 1px solid black;
}
body.bkg-black header .site-branding{ 
    background-color: black;
	color: white;
    border-bottom: 1px solid white;
}
header .hamburger{
	-webkit-transform: translate3d(0, 0, 0); 
	z-index: 99;
    border: 0;
    background-color: white;
}
body.bkg-black header .hamburger{
    background-color: black;
}
header #site-navigation-mobile .mobile-menu{
	position: fixed;
	width: 100%;
    background-color: white;
    overflow: hidden;
	text-align: center;
	border-bottom: 1px solid black;
	display: none;
}
header #site-navigation-mobile .mobile-menu li.active{
	background-color: black;
}
header #site-navigation-mobile .mobile-menu li.active a{
	color: white;
}
header #site-navigation-mobile .mobile-menu li{
	display: none;
}
header #site-navigation-mobile .mobile-menu li:nth-child(-n+4){
	display: block;
}
header #site-navigation-mobile .mobile-menu.full li{
	display: block;
}
body.bkg-black header #site-navigation-mobile .mobile-menu{
    background-color: black;
	border-bottom: 1px solid white;
}
body.bkg-black header #site-navigation-mobile .mobile-menu li.active{
	background-color: white;
}
body.bkg-black header #site-navigation-mobile .mobile-menu li.active a{
	color: black;
}
body.bkg-black header .hamburger .hamburger-segment{
	background: white;
}
header .hamburger .hamburger-segment{
	height: 2px;
	width: 25px;
	background: black;
	display: block;
	opacity: 1;
	margin-top: 5px;
	-webkit-transition: -webkit-transform 0.15s linear;
	-moz-transition: -moz-transform 0.15s linear;
	-ms-transition: -ms-transform 0.15s linear;
	transition: transform 0.15s linear;
	-webkit-transform-origin: 50% 50%;
	-moz-transform-origin: 50% 50%;
	-ms-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
}
header .hamburger .hamburger-segment:nth-child(2) {
	-webkit-transition: opacity 0.1s linear;
	-o-transition: opacity 0.1s linear;
	-ms-transition: opacity 0.1s linear;
	-moz-transition: opacity 0.1s linear;
	transition: opacity 0.1s linear;
}
header #site-navigation-mobile.active .hamburger .hamburger-segment:nth-child(1) {
	-webkit-transform: rotate(45deg) translate3d(5px, 5px, 0);
	-o-transform: rotate(45deg) translate3d(5px, 5px, 0);
	-ms-transform: rotate(45deg) translate3d(5px, 5px, 0);
	-moz-transform: rotate(45deg) translate3d(5px, 5px, 0);
	transform: rotate(45deg) translate3d(5px, 5px, 0);
}
header #site-navigation-mobile.active .hamburger .hamburger-segment:nth-child(2) {
	opacity: 0;
}
header #site-navigation-mobile.active .hamburger .hamburger-segment:nth-child(3) {
	-webkit-transform: rotate(-45deg) translate3d(5px, -5px, 0);
	-o-transform: rotate(-45deg) translate3d(5px, -5px, 0);
	-ms-transform: rotate(-45deg) translate3d(5px, -5px, 0);
	-moz-transform: rotate(-45deg) translate3d(5px, -5px, 0);
	transform: rotate(-45deg) translate3d(5px, -5px, 0);
}	

/* FOOTER */
footer{
	position: relative;
	background: white;
	text-align: center;
	border-top: 1px solid black;
	font-size: 0.52em;
	text-transform: uppercase;
}
footer li{
	padding: 0 10px;
	display: inline-block;
}
body.bkg-black footer{
	background: black;
	border-color: white;
}
body.bkg-black footer li.languages a {
    border-left: solid 1px white;
}
body.bkg-black footer li.languages a:first-child {
	border: 0;
}
footer li.languages a{
	border-left: solid 1px black;
	padding: 0 5px;
}
footer li.languages a.active{
	text-decoration: underline;
}
footer li.languages a:first-child {
	border: 0;
}

/* HOME */
#primary{
	position: relative;
}
h3.widget-title{
	padding-top:30px;
	padding-bottom:80px;
}

.panel-grid .border{
	border-top: 1px solid black;
}
.background-image-widget{
	position: fixed; 
	width: 100%; 
}
.background-image-widget .main-column{
	max-width: none;
}
.background-image-widget img{
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
	width: 100%; 
	visibility: hidden;
}
.background-image-widget img.active{
	visibility: visible;
}

/* PASSWORD */
form.protected-post-form{
	padding-bottom: 30px;
}
form.protected-post-form input{
	width: 100%;
	padding: 30px 0;
	font-size: 2.3em;
	background: black;
	color: white;
    border: 0;
    border-bottom: 1px solid white;
}
.password-form .text{
	font-size: 0.52em;
}
.white-password form.protected-post-form input{
	background: white;
    border-color: black;
	color: black;
}

.white-password input::-webkit-input-placeholder {
	color: black;
}
.white-password input:-moz-placeholder {
	color: black;
	opacity:  1;
}
.white-password input::-moz-placeholder {
	color: black;
	opacity:  1;
}
.white-password input:-ms-input-placeholder {
    color: black;
}
.white-password input::-ms-input-placeholder {
    color: black;
}

/* REVERIE */

.reverie-menu{
	position: fixed;
	width: 100%;
	left: 0;
}
.projects-grid .project .image,
.artworks-grid .artwork .image{
	position: relative;
	background-size: cover;
    background-position: center center;
	padding-top: 60%;
}
.projects-grid .project .image .cover,
.artworks-grid .artwork .image .cover,
.video-list .video .image .cover{
	display: none;
	position: absolute;
	background-color: black;
	opacity: 0.2;
	width: 100%;
	top: 0;
	bottom: 0;
}
.projects-grid .project a,
.artworks-grid .artwork a{
	display: block;
	margin-bottom: 50px;
}
.projects-grid .project a:hover .cover,
.artworks-grid .artwork a:hover .cover,
.video-list .video a:hover .cover{
	display: block;
}
.projects-grid .project .info,
.artworks-grid .artwork .info,
.news .info,
.video .info{
	font-size: 0.61em;
	margin-top: 10px;
}
.project-content .image,
.artwork-content .image{
	background-size: cover;
	background-position: center center;
	padding-top: 60%;
}
.single-artwork .category,
.single-project .date{
	text-align: right;
}


/* ART MOOD ON */
.news-list{
	padding-top: 80px;
}
.news-list .footer{
	position: relative;
}
.news-list .news {
	padding-bottom: 40px;
}
.news-list hr.instagram-border{
	border-bottom: 1px solid black;
	color: white;
}
.news .image{
	position: relative;
	display: block;
	background-size: cover;
    background-position: center center;
	padding-top: 60%;
	margin-bottom: 10px;
}
.news .image .cover{
	display: none;
	position: absolute;
	background-color: black;
	opacity: 0.2;
	width: 100%;
	top: 0;
	bottom: 0;
}
.news a:hover .cover{
	display: block;
}
.news-list .news .info,
.news .excerpt{
	margin-top: 30px;
}
.news .title{
	text-decoration: underline;
}
.news .date{
	text-align: right;
}
.news-next{
	position: absolute;
    width: 100%;
    bottom: 0;
}
.news-next .column-of-3{
	z-index: 2;
}
.news-navigation{
	position: fixed;
	width: 100%;
	bottom: 64px;
	opacity: 0;
	transition: opacity 0.5s;
	z-index: 1;
}
.news-navigation.active{
	opacity: 1;
	transition: opacity 0.5s;
}
.news-archive .page-title{
	text-align: right;
	text-decoration: underline;
    margin-bottom: 50px;
}
.news-archive .archive-section{
	margin-bottom: 60px;
}
.news-archive .date span{
	padding: 20px;
	line-height: 1;
	background-color: black;
	color: white;
	display: inline-block;
}
.news-archive .news a{
	display: block;
	margin-bottom: 50px;
}
.news-archive .news.hidden{
	display: none;
}
.news-archive .show-more{
	text-align: center;
}
.news-archive .show-more .show-more-button{
	position: relative;
	display: inline-block;
    width: 50px;
    height: 50px;
    border: 1px solid black;
    border-radius: 50%;
	cursor: pointer;
}
.news-archive .show-more .show-more-button div:first-child{
    position: absolute;
	height: 1px;
    background: black;
    width: 26px;
    margin-top: 24px;
    margin-left: 12px;
}
.news-archive .show-more .show-more-button div:last-child{
    position: absolute;
	height: 26px;
    background: black;
    width: 1px;
    margin-top: 12px;
    margin-left: 24px;
}
.news-archive .show-more span{
	cursor: pointer;
}
.entry-content p{
	padding-bottom: 20px;
}
.single-news{
	padding-top: 80px;
	padding-bottom: 40px;
}
.single-news .image{
	position: relative;
	display: block;
	background-size: cover;
    background-position: center center;
	padding-top: 60%;
	margin-bottom: 10px;
}
.single-news .date{
	text-align: right;
}
.single-news #content p img,
.single-video #content p img,
.single-project #content p img,
.single-artwork #content p img{
	width: 120%;
	height: auto;
}
.single-news #content p,
.single-video #content p,
.single-project #content p,
.single-artwork #content p,
.excerpt{
	width: 83.33%;
}
.single-news figure,
.single-video figure,
.single-project figure,
.single-artwork figure{
	width: 100% !important;
}
.single-news figure img,
.single-video figure img,
.single-project figure img,
.single-artwork figure img{
	width: 100%;
    height: auto;
}
.single-news #content a,
.single-video #content a,
.single-project .project-content a,
.single-artwork .artwork-content a{
	text-decoration: underline;
}
.single-news #content span,
.single-video #content span,
.single-project #content span,
.single-artwork #content span{
    text-justify: none;
	font-family: 'founders_grotesk', sans-serif !important; 
}
.single-news #content p,
.single-video #content p,
.single-project #content p,
.single-artwork #content p,
.single-news #content p *,
.single-video #content p *,
.single-project #content p *,
.single-artwork #content p *,
.excerpt {
	font-family: 'founders_grotesk', sans-serif !important; 
	font-size: 21px !important;
    line-height: 25.2px !important;
    text-align: left;
}
figcaption{
	text-align: right;
    padding-bottom: 20px;
	font-size: 0.61em;
}

/* VIDEO  */

.video-list .featured,
.single-video .featured {
	padding-top: 80px;
}
.featured iframe{
	width: 100%;
	position: relative;
	display: block;
	background-size: cover;
    background-position: center center;	
}
.featured .category{
	text-align: right;
}
.featured .title{
	text-align: center;
}
.featured .title a{
	text-decoration: underline;
}
.featured .category{
	color: red;
	text-transform: uppercase;
}
.video-list .categories{
	border-top: 1px solid black;
	font-size: 2.3em;
}
.video-list ul{
	width: 100%;
	text-align: justify;
	/*display: table;
	table-layout: fixed;*/
}
.video-list ul li{
	display: inline;
	width: auto;
	text-align: center;
}
.video-list ul:after {
	content: "";
	display: inline-block;
	width: 100%;
}

.video-list ul li span{
	cursor: pointer;
}
.video-list ul li span.active{
	text-decoration: underline;
}
.video-list ul li:first-child {
	text-align: left;
}
.video-list ul li:last-child {
	text-align: right;
}
.video .image{
	position: relative;
	display: block;
	background-size: cover;
    background-position: center center;
	padding-top: 60%;
}
.video .info {
	padding-top: 5px;
	padding-bottom: 25px;
	text-transform: uppercase;
}
.video .info .category{
	color: red;
}
.video .info .title{
	max-height: 15px;
}
.single-video .category{
	color: red;
}
body .single-video{
	padding-bottom: 50px
}


/* OTHER */
.newsletter, .qzr_form{
	padding-top: 100px;
}
.newsletter input[type="text"],
.newsletter input[type="email"] {
	width: 100%;
	border: 0;
	border-bottom: 1px solid black;
	padding: 10px 0;
}
.newsletter .mc4wp-form-fields p{
	padding: 10px 0;
}
.instagram-wrapper li{
	position: relative;
}
.instagram-wrapper li a:hover:before{
	content: '';
	position: absolute;
	width: 100%;
	top: 0;
	bottom: 0;
	background: black;
	opacity: 0.2;
}


/* Slider nav */

.owl-prev,
.owl-next {
	/*text-shadow: 0px 0px 6px rgba(100, 100, 100, 1);*/
	position: absolute;
	top: 50%;
	left: 15%;
}
.owl-next {
	left: auto;
	right: 15%;
}
.owl-prev:after,
.owl-next:after {
	content: "";
	position: absolute;
	top: 0;
	left: -25px;
	font-size: 7em;
	line-height: 0;
	text-align: center;
	color: white;
	transform: translate(-50%,0) rotate(45deg);
	text-indent: 0;
	border-left: 3px solid white;
	border-bottom: 3px solid white;
	width: 50px;
	height: 50px;
	margin-top: -30px;
}
.owl-next:after {
	left: 25px;
	transform: translate(-50%,0) rotate(-135deg);
}

.page-template-template-wrapped .main-column {
	padding: 0 10px;
	padding-top: 60px;
	padding-bottom: 200px;
}

.qzr_form ::-webkit-input-placeholder {
	color: #999;
}
.qzr_form :-moz-placeholder {
	color: #999;
	opacity:  1;
}
.qzr_form ::-moz-placeholder {
	color: #999;	
	opacity:  1;
}
.qzr_form :-ms-input-placeholder {
	color: #999;
}
.qzr_form ::-ms-input-placeholder {
    color: #999;
}


/* Custom Selects */

.qzr_form .options-wrapper {
	min-height: 27px;
	font-family: 'founders_grotesk', sans-serif;
	font-size: 23px;
	color: #000;
}
.qzr_form .options-current {
	cursor: pointer;
	position: relative;
}
.qzr_form .options-current:after {
	/*content: '';*/
	background-image: url(img/arrow_down.svg);
	height: 15px;
	width: 15px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	top: 7px;
	right: 10px;
	transition: all 0.2s linear;
}
.qzr_form .options-current:hover:after {
	/*top: 15px;*/
}
.qzr_form .opened .options-current:after {
	transform: rotate(180deg);
}
.qzr_form .opened .options-current:hover:after {
	/*top: 5px;*/
}

.qzr_form  p {
	padding: 0;
}

.qzr_form .options-list {
	list-style: none;
	/*padding: 27px 0;*/
	background: #fff;
}

.qzr_form .options-list li {
	color: #999;
}

.options-list label {
	font-size: 16px;
}

.qzr-form .options-item {
	background: #e0e0e0;
	padding: 5px 20px 0;
	cursor: pointer;
	transition: background 0.2s linear;
}
.qzr_form .options-item:hover {
	background: white;
}

.qzr_form textarea {
	font-size: 11px;
	padding-top: 10px;
	border: 0;
	/*border-bottom: 1px solid #000;*/
	resize: none;
	width: 100%;
	overflow-x: hidden;
	transition: min-height 0.2s ease-in-out;
	min-height: 1px;
}

.qzr_form .item {
	padding: 3px 5px;
	cursor: pointer;
	display: inline-block;
	width: 100%;
	border-bottom: 1px solid #000;
	padding: 10px 0;
}

.qzr_form .item label {
	width: 100%;
}

.qzr_form .item input {
	padding: 10px 0;
	width: 100%;
	border: 0;
}

.qzr_form .options-list label, .qzr_form .options-list input {
	width: auto;
}

.qzr_form textarea.opened {
	/*min-height: 250px;*/
	min-height: 150px;
}


.qzr_form .textarea-field {
	/*line-height: 0;*/
}

.page-template-template-wrapped h3.widget-title {
	padding-top: 100px;
	padding-bottom: 25px;
	text-decoration: underline;
    font-size: 23px;
}

*:focus {
	outline: none;
}


.qzr_form .item input[type="checkbox"]{
	width: 16px;
	height: 16px;
	padding: 0;
	display: inline-block;
	border: 1px solid black;
	-webkit-appearance: none;
	background: white; 
	position: relative;
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	cursor: pointer;
	border-radius: 50%
}
.qzr_form .item input[type="checkbox"]:checked:after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 2px;
	background: black;
	border-radius: 50%
}

.qzr_form .item input[type="radio"]{
	width: 16px;
	height: 16px;
	padding: 0;
	display: inline-block;
	border: 1px solid black;
	-webkit-appearance: none;
	background: white; 
	position: relative;
	float: left;
	margin-right: 5px;
	margin-bottom: 5px;
	cursor: pointer;
	border-radius: 50%;
	margin-top: 9px;
}
.qzr_form .item input[type="radio"]:checked:after {
	content: '';
	position: absolute;
	top: 2px;
	left: 2px;
	right: 2px;
	bottom: 2px;
	background: black;
	border-radius: 50%;
}

.qzr_form .item textarea {
	min-height: 100px;
}

input[type="submit"], button[type="submit"] {
	font-size: 14px;
}

.player-embed {
	position: relative;
	margin: 20px auto;
	max-width: 320px
}
footer.row-padding {
	padding-bottom: 55px;
}