/*
Theme Name: This is the place you told me about
Web: vesaire.studio
*/





/*--------------------------------------------------------------
# General 
--------------------------------------------------------------*/


html, body 
{
   height:100%;
   margin:0;
   padding:0;
   outline:none;
    
}


body
{
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x:hidden;

        }


ul,li, p, h1, h2
{
margin:0;
padding:0;
list-style:none;
}



.desktop_gallery
{
display:block;
height: 100% !important;
}

.mobile_gallery
{
display:block;
}


.slick-slide img:hover {
cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}


.swiper-slide{
    height: 500px;
    width: auto !important;
}


.swiper-slide img 
{
height: 100%;
    max-height: 500px;
}

img
{
width:100%;
height:100%;
}


.bigscreen
{
display:inline-block;
}


.mobile_gallery
{
display:none;
}


.smallscreen
{
display:none;
}

/* Font */

/* crimson-text-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Crimson Text';
  font-style: normal;
  font-weight: 400;
  src: url('https://theplaceyoutold.me/about/wp-content/themes/v1.0/assets/fonts/crimson-text-v19-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* crimson-text-italic - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Crimson Text';
  font-style: italic;
  font-weight: 400;
  src: url('https://theplaceyoutold.me/about/wp-content/themes/v1.0/assets/fonts/crimson-text-v19-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* noto-sans-regular - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: url('https://theplaceyoutold.me/about/wp-content/themes/v1.0/assets/fonts/noto-sans-v39-latin_latin-ext-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* noto-sans-italic - latin_latin-ext */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 400;
  src: url('https://theplaceyoutold.me/about/wp-content/themes/v1.0/assets/fonts/noto-sans-v39-latin_latin-ext-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


a:link, a:active
{
color:black;
text-decoration:none;
        }

a:visited, a:hover
{
color:black;
  text-decoration: underline solid black;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
        }


.owl-carousel-holder {
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity:0;
        }

.owl-carousel {
    z-index: 999999999 !important;
}

.owl-carousel img
{
height:34vw;
width:auto;
z-index: 9999999999;
}


.owl-carousel .owl-item{
 position: relative;
  min-height: 1px;
  float: left;
  -webkit-backface-visibility: unset !important;
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}




.item figure
{
margin:0px;
        }


.item figcaption
{
padding-top:5px;
        }


.stopscrolling
{
overflow-y:unset;

        }





/* Main Menu */


.menu
{
font-family: 'Crimson Text';
font-size:30px;
position:fixed;
top:0px;
right:20px;
width:calc(50% - 20px);
padding: 20px 0px 20px 20px;
  background: white;
  text-align: right;
}


.title
{
font-family: 'Crimson Text';
font-size:30px;
position:fixed;
top:0px;
left:20px;
width: calc(50% - 20px);
background: white;
padding: 20px 20px 20px 0px;
        }


.info
{
font-family: 'Noto Sans';
font-size: 13px;
position:fixed;
left:20px;
bottom:20px;
        }

.imprint
{
font-family: 'Noto Sans';
font-size: 13px;
right:20px;
bottom:20px;
position:fixed;
        }


.mobile_info
{
display:none;
}







/* Canvas Menu */

.canvas_menu
{
position:fixed;
background:white;
z-index: 99999999999;
width:300px;
    right: -380px;
height:100%;
top:0px;
font-family: 'Noto Sans';
font-size:13px;
padding-top:42px;
padding-right:40px;
padding-left:40px;
padding-bottom:20px;
transition: all 0.5s ease-out allow-discrete;
}

.show
{
position:fixed;
right:0px;
transition: all 0.5s ease-out allow-discrete;
}


.main_menu
{
    padding-left:170px;
}

.artist_menu
{
    padding-left:170px;
}


.performance_menu
{
    padding-left:170px;
}

.artist_headline
{
    padding-top:40px;

}



.space_headline
{
    padding-top:40px;

}

ul#menu-4
{
padding-top:60px;
        }


.headline_artist_text
{
font-family: 'Crimson Text';
font-size:22px;
font-weight:400;
    padding-bottom: 20px;
    display: block;
        }



/* Centered Column */


.centered_text
{
width: 100%;
    display: flex;
    justify-content: center;
overflow-y: auto;
    align-items: center;
    padding-top: 8%;
    padding-bottom:60px;
    scrollbar-width: none;
    opacity:0;
}

.centered_text p
{
width:600px;
font-family: 'Crimson Text';
    font-size: 22px;
    line-height: 26px;

}

.centered_text p img
{
padding:0px 20px 0px 20px;
width: calc(100% - 40px);
}


.centered_text .figcaption
{
display:block !important;
}
      

.centered_image
{
height:100%;
width:100%;
display:flex;
justify-content:center;
align-items:center;
}


.centered_image img
{
width: auto;
    height: 550px;
    position: relative;
}


.figure
{
display:table;
}


.figcaption
{
padding:0px 20px 20px 20px;
font-family:Noto Sans;
font-size:13px;
line-height: 16px;
display: table-caption; 
caption-side: bottom ;
}


.centered_image .figcaption {
    padding: 0px 20px 0px 0px;
    opacity:0;

}


.centered_image img:hover + .figcaption {
    padding: 0px 20px 0px 0px;
    opacity:100;
    cursor:pointer;
    transition: all 0.5s ease-out allow-discrete;
}


 


/* Cookie Banner */

.cookiemodal {
    width: auto;
    padding: 15px 40px 20px 15px;
    background: white;
    text-align: left;
font-family: 'Crimson Text';
font-size:18px;
z-index:99999999999;
}
       

.cookiemodal button{
padding: 6px 20px 9px 20px;
font-family: 'Crimson Text';
font-size:18px;
border:1px solid black;
color:black;
background:white;
margin-left:15px;
font-weight:400;
}


.cookiemodal button:hover{
padding: 6px 20px 9px 20px;
font-family: 'Crimson Text';
font-size:18px;
border:1px solid black;
color:white;
background:black;
margin-left:15px;

cursor:pointer;
}


.cookiemodal_holder
{
position: fixed;
    bottom: 0px;
    right: 0px;
    display: flex;
    justify-content: flex-end;
    width: 100%;
}




/*--------------------------------------------------------------
# Responsive
--------------------------------------------------------------*/



/*notebook*/


@media (min-width: 1200px) and (max-width: 1780px) {


.bigscreen
{
    display:none;
}

.smallscreen
{
    display:block;
}

ul#menu-4
{
padding-top:0px;
        }


.title
{
    font-size:30px;
}

.menu
{
    font-size:30px;
}

.info
{
width: 280px;
font-family: Noto Sans;
font-size:13px;
}

.centered_text p
{
   width:450px;
   font-size:20px;
   line-height:24px;
}

.centered_text 
{
width: 100%;
    display: flex;
    justify-content: center;
    overflow-y: scroll;
    align-items: center;
    padding-top: 10%;

}

.headline_artist_text
{
   font-size:24px;
   line-height:28px;
font-weight:400;
font-family:'Crimson Text';
}

.centered_text p img
{
padding:0px 20px 0px 20px;
width: calc(100% - 40px);
}

.centered_image img
 {
    width: auto;
    height: 400px;
    position: relative;
}


.figcaption {
    padding: 0px 20px 20px 20px;
    font-family: Noto Sans;
    font-size: 12px;
    line-height: 16px;
}


}




/* Tablet Landscape  */
@media (min-width: 980px) and (max-width: 1199px){

.cookiemodal {
font-size:16px;
}
     
     
     
ul#menu-4 {
    padding-top: 0px;
}


.bigscreen
{
    display:none;
}

.smallscreen
{
    display:block;
}

.title
{
    font-size:20px;
}

.menu
{
    font-size:20px;
}

.imprint
{
font-family: Noto Sans;
font-size:13px;
}


.info
{
width: 280px;
font-family: Noto Sans;
font-size:13px;
}


.centered_text p
{
  width:420px;
   font-size:18px;
   line-height:22px;
    
}

.headline_artist_text
{
   font-size:18px;
   line-height:22px;
font-weight:400;
font-family:'Crimson Text';
}

.centered_image img
{
width: 300px;
    height: auto;
    position: relative;
}

.figcaption {
    padding: 0px 20px 20px 20px;
    font-family: Noto Sans;
    font-size: 12px;
    line-height: 16px;

}


 }



/* Tablet Portrait */

@media (min-width: 768px) and (max-width: 979px){

.bigscreen
{
    display:none;
}

.smallscreen
{
    display:block;
}


body
{
overflow-x:hidden;
}


.cookiemodal_holder {
        position: fixed;
        bottom: 0px;
        right: 0px;
        display: flex;
        justify-content: center;
        width: 100%;
        background: white;
}

.mobile_info
{
display:block;
padding-left:20px;
width:50%;
padding-top:40px;
padding-bottom:20px;
    font-family: 'Noto Sans';
        font-size: 12px;
        line-height:15px;
}





ul#menu-4
{
padding-top:0px;
        }

.canvas_menu {
    padding-top: 20px;
 }


.headline_artist_text {
  font-size: 22px;
   font-family: Crimson Text;
   line-height:26px;
}

.centered_text p {
        width: calc(100% - 40px);
        padding: 20px;
        font-family: Crimson Text;
        font-size: 20px;
        line-height: 24px;
}

.centered_text  {
width: 100%;
  display: block;
  overflow-y: unset;
  padding:100px 0px 0px 0px;

}

.centered_text p img {
        padding: 0px 0px 0px 0px;
        width: 100%;
}

.title {
font-size: 24px;
        position: absolute;
        top: 20px;
        left: 20px;
        width: 380px;
        line-height: 26px;
        padding: 0px;
}

.menu {
  font-size: 24px;
  position: absolute;
  top: 0px;
  right: 20px;
  width: unset;
  line-height: 26px;
}

.info
{
display:none;
}

.imprint
{
    display:none;
}

.centered_image img
{
width: 300px;
    height: auto;
    position: relative;
}

.figcaption {
    padding: 0px 0px 20px 0px;
    font-family: Noto Sans;
    font-size: 12px;
    line-height: 16px;
  
}

.desktop_gallery
{
display:none;
}

.mobile_gallery
{
display:block;
padding-left:20px;
padding-right:20px;
width:calc(100% - 40px);
padding-top:100px;
}

.mobile_image
{
margin:0px;
}

.mobile_gallery img
{
padding-bottom:0px;
}

}



/* Smartphone Landscape */
@media (min-width: 565px) and (max-width: 767px) {


.bigscreen
{
    display:none;
}

.smallscreen
{
    display:none;
}

body
{
overflow-x:hidden;
}


.stopscrolling
{
overflow-y:hidden;

        }

.cookiemodal_holder {
        position: fixed;
        bottom: 0px;
        right: 0px;
        display: flex;
        justify-content: center;
        width: 100%;
        background: white;
}


.mobile_info
{
        display: block;
        padding-left: 20px;
        width: 65%;
        padding-top: 40px;
        padding-bottom: 20px;
        font-family: 'Noto Sans';
        font-size: 12px;
        line-height:15px;
}


ul#menu-4
{
padding-top:0px;
        }

.canvas_menu {
    padding-top: 20px;
    font-size:13px;
    line-height:17px;
 }


.headline_artist_text {
font-family: 'Crimson Text';
        font-size: 19px;
        line-height: 22px;
}

.centered_text p {
    width: calc(100% - 40px);
    padding: 20px;
font-family: 'Crimson Text';
        font-size: 19px;
        line-height: 22px;
}

.centered_text  {
width: 100%;
  display: block;
  overflow-y: unset;
  padding:100px 0px 0px 0px;

}

.centered_image{
 height:calc(100% - 100px);
 }
 
.centered_text p img {
padding: 0px 0px 0px 0px;
        width: 100%;
}

.title {
  font-size: 19px;
  position: absolute;
  top: 20px;
  left: 20px;
  width: 150px;
  line-height: 22px;
  padding:0px;
}

.menu {
  font-size: 19px;
  position: absolute;
  top: 0px;
  right: 20px;
  width: unset;
  line-height: 21px;
}

.info
{
display:none;
}

.imprint
{
    display:none;
}

.centered_image img
{
        width:240px;
        height: auto;
        position: relative;
        max-height:300px;
        padding-top:40px;
}

.figcaption {
    padding: 0px 0px 20px 0px;
    font-family: Noto Sans;
    font-size: 12px;
    line-height: 16px;
   
}

.desktop_gallery
{
display:none;
}

.mobile_gallery
{
display:block;
padding-left:20px;
padding-right:20px;
width:calc(100% - 40px);
padding-top:100px;
}

.mobile_image
{
margin:0px;
}

.mobile_gallery img
{
padding-bottom:0px;
}

}



/* Smartphone Portrait */

@media (min-width: 120px) and (max-width: 564px) {

.bigscreen
{
    display:none;
}

.smallscreen
{
    display:none;
}


body
{
overflow-x:hidden;
}


.stopscrolling
{
overflow-y:hidden;

        }

.cookiemodal_holder {
        position: fixed;
        bottom: 0px;
        right: 0px;
        display: flex;
        justify-content: center;
        width: 100%;
        background: white;
}


.mobile_info
{
        display: block;
        padding-left: 20px;
        width: 65%;
        padding-top: 40px;
        padding-bottom: 20px;
    font-family: 'Noto Sans';
        font-size: 12px;
        line-height:15px;
        height:40px;
}


ul#menu-4
{
padding-top:0px;
        }

.canvas_menu {
    padding-top: 20px;
    font-size:13px;
    line-height:17px;
 }


.headline_artist_text {
font-family: 'Crimson Text';
        font-size: 19px;
        line-height: 22px;
}

.centered_text p {
    width: calc(100% - 40px);
    padding: 20px;
font-family: 'Crimson Text';
        font-size: 19px;
        line-height: 22px;
}

.centered_text  {
width: 100%;
  display: block;
  overflow-y: unset;
  padding:100px 0px 0px 0px;

}

.centered_image{
 height:calc(100% - 100px);
 }
 
.centered_text p img {
padding: 0px 0px 0px 0px;
        width: 100%;
}

.title {
  font-size: 19px;
  position: absolute;
  top: 20px;
  left: 20px;
  width: 150px;
  line-height: 22px;
  padding:0px;
}

.menu {
  font-size: 19px;
  position: absolute;
  top: 0px;
  right: 20px;
  width: unset;
  line-height: 21px;
}

.info
{
display:none;
}

.imprint
{
    display:none;
}

.centered_image img
{
        width:240px;
        height: auto;
        position: relative;
        max-height:300px;
        padding-top:40px;
}

.figcaption {
    padding: 0px 0px 20px 0px;
    font-family: Noto Sans;
    font-size: 12px;
    line-height: 16px;
   
}

.swiper-slide {
    height: 300px !important;
    width: auto !important;
}

.swiper-slide img{
    height: 300px !important;
    width: auto !important;
}

.desktop_gallery
{
display:none;
}

.mobile_gallery
{
display:block;
padding-left:20px;
padding-right:20px;
width:calc(100% - 40px);
padding-top:100px;
}

.mobile_image
{
margin:0px;
}

.mobile_gallery img
{
padding-bottom:0px;
}

}

