.home.cf-2026 .site {
    background: rgb(239, 70, 59);
}

.get-involved-intro.cc_get_involved{
    display: none;
}

.home.cf-2026 .roundel.date-time {

    position: fixed;
    right: 40px;
    z-index: 99999999;
    width: 160px;
    height: auto;
    /* display: none; */
}

.home.cf-2026 .roundel.date-time img {
    width: 100%;
    height: auto;

}

.home.cf-2026 .logo-image{
    display: none;
}

.cf-2026 .logo-image.home-only {
    display: none;
}

body.cf-2026.phase-0 .logo-image.home-only.red-logo,
 .logo-image.logo-2026-home-only{
position: absolute;
    top:100px;
}

.page-id-2899.cf-2026 .logo-image.artpage-only {
   display: block;

}

.page-id-2899.cf-2026 .logo-image.home-only{

   opacity: 0;
   pointer-events: none;
}


@media screen and (min-width: 768px) {
   body.cf-2026.phase-0 .logo-image.home-only.red-logo,
   .logo-image.logo-2026-home-only {
        /* review */
        /* top: 200px; */
 top: 150px;
        max-height: 30vh;

}
}


@media screen and (min-width: 1200px) {
  body.cf-2026.phase-0.logo-image.home-only.red-logo
   {
       /* review */
       top: 250px;

}
}


/* dirty overrides - too much messy css going atm!! */
.logo-image.logo-2026-home-only { 
display: block!important;
    position: absolute;
    margin: auto;
    max-width: 400px;
    left: 0;
    right: 0;
    opacity:0.8;//resolve legibility - review css details later

}

@media screen and (min-width: 1200px) {
    .logo-image.logo-2026-home-only { 
    max-width: 20vw;
    }
}

.home.cf-2026.toggled-on .roundel.date-time {
    top: 150px;
}


.home.cf-2026 #colophon {
    display: none;
}


.home.cf-2026 #mailchimp {
    background: rgb(239, 70, 59);
    padding-bottom: 40px;
    padding-top: 40px;
    position: absolute;
    bottom: 0;
    width: 100%;
    display: none;
}


.home.cf-2026 .cta-buttons {
    margin-top: 60vh;
    /* display: flex; */
    display: none;
    width: 100%;
    // color: #fff;
}

.cta-button {
    display: flex;
    flex-grow: 1;
    text-align: center;
    margin: 20px;
    justify-content: center;
    text-transform: uppercase;
       background-color: white;
     color: rgb(239, 70, 59);
    border-radius: 40px;
    box-sizing: border-box;
}


.cta-button:hover {
  background-color: rgb(239, 70, 59);
  color: white;
    border-radius: 40px;
    border: 1px solid white;
}

@media screen and (max-width: 768px) {
    .home.cf-2026 .cta-buttons {
        margin-top: 70vh;
        flex-flow: column;
    }

}


.home #main{

   min-height: calc(100vh + 150px)!important;
}




.home.cf-2026.phase-0 .bg
/* .page-id-2899 .page.cf-2026.phase-0 .bg */
{

    width: 100%;
    height: auto;
    // background: #fffaed;
    background-color: rgb(239, 70, 59);
    // background-image: url('https://thecallyfestival.co.uk/site/wp-content/themes/thecallyfestival_2015/art-2026/src/img/BG_HORZ.png');
    background-size: cover;
    background-position: center;
    /* display: flex; */
    z-index: 7;
    /* position: fixed; */
    position: absolute;
    left: 0;
    /* top:0;  
       // review this value */
    right: 0;
   bottom: 150px;
   top:45px;
}

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

    .home.cf-20265.phase-0 .bg {
        top: 50px;
    }

    body.toggled-on .home.cf-2026.phase-0 .bg {
        top: 160px;
    }
}


@media screen and (min-width: 992px) {
    .home.cf-2026.phase-0 .bg{
    
        top:108px;
     }
}

.page.page-id-2899 a.logo-image.artpage-only {
    display: flex;
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
}


.home.cf-2026.phase-0 .bg::before {
 content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: auto;
    height: auto;
    background-image: url('https://thecallyfestival.co.uk/site/wp-content/themes/thecallyfestival_2015/art-2026/src/img/BG_VERT.png');
    background-size: cover;

    /* background: linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 10vw) calc(100% - 10vw) no-repeat,
        radial-gradient(at 0% 100%, #fff000 0%, transparent 27%),
        #d83930; */

    padding: 5vw;
    box-sizing: content-box;

    /* clip-path: polygon(0% 0%, 0% 100%, 5% 100%, 5% 5%, 95% 5%, 95% 95%, 5% 95%, 5% 100%, 100% 100%, 100% 0%); */

    clip-path: polygon(0% 0%, 0% 100%, 5vw 100%, 5% 5vw, 95% 5vw, 95% calc(100% - 5vw), 5% calc(100% - 5vw), 5% 100%, 100% 100%, 100% 0%)
}

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

    .is-horizontal .home.cf-2026.phase-0 .bg {
        background-color: rgb(239, 70, 59);
        // background-image: url('https://thecallyfestival.co.uk/site/wp-content/themes/thecallyfestival_2015/cf-2026/src/img/BG_VERT.png');

    }

    .is-horizontal .home.cf-2026.phase-0 .bg::before {
       clip-path: polygon(0% 0%, 0% 100%, 5vh 100%, 5vh 5vh, calc(100% - 5vh) 5vh, calc(100% - 5vh) calc(100% - 5vh), 0% calc(100% - 5vh), 0% 100%, 100% 100%, 100% 0%);
        /* clip-path: polygon(0% 0%, 0% 100%, 5vh 100%, 5vh 5vh, 95% 5vh, 95% calc(100% - 5vh), 0% calc(100% - 5vh), 0% 100%, 100% 100%, 100% 0%) */
    }
}


@media screen and (min-width: 1200px) {
    
        .home.cf-2026.phase-0 .bg::before {
clip-path: polygon(0% 0%, 0% 100%, 2.5vh 100%, 2.5vh 2.5vh, calc(100% - 2.5vh) 2.5vh, calc(100% - 2.5vh) calc(100% - 2.5vh), 0% calc(100% - 2.5vh), 0% 100%, 100% 100%, 100% 0%);        /* clip-path: polygon(0% 0%, 0% 100%, 5vh 100%, 5vh 5vh, 95% 5vh, 95% calc(100% - 5vh), 0% calc(100% - 5vh), 0% 100%, 100% 100%, 100% 0%) */
    }
}


.is-vertical .home.cf-2026.phase-0 .bg {
    // background-image: url('https://thecallyfestival.co.uk/site/wp-content/themes/thecallyfestival_2015/art-2026/src/img/BG_VERT.png');
    clip-path: polygon(0% 0%, 0% 100%, 5vw 100%, 5% 5vw, 95% 5vw, 95% calc(100% - 5vw), 5% calc(100% - 5vw), 5% 100%, 100% 100%, 100% 0%)

}

.art-item {

    display: flex;
    width: 100%;
    height: 100%;
    position: relative;
}

.description {
   position: absolute;
   bottom: 0vh;
   left: 0;
   right: 0;
   margin: 5vw;
   display: flex;
   height: 20vw;
   padding: 10px;
   max-width: 1200px;
   width: calc(100% - 10vw);
}




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

   .description {
       bottom: 0vh;//30%;

    }

    body.is-horizontal .description {
       bottom: 0vw;//100px;
    }
   
}

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

   .description {

       /* bottom: 10vh; */
       margin: auto;
    }
    body.is-horizontal .description {
       bottom: 5vw;
    }
   
}
@media screen and (min-width: 1200px) and (max-height: 800px) {
    body.is-horizontal .description {
        bottom:2.5vw;
    }
}


/* @media screen and (min-width: 1200px) and (max-height: 800px){

   .description {
 
    }
    body.is-horizontal .description {
       bottom: 150px;
    }
   
}

@media screen and (min-width: 1800px) {

   .description {

       bottom: 30vh;
       margin: auto;
    }
   
} */


.description .description-item-image {
   width: 100%;
   height: 100%;
   /* object-fit: cover; */
   /* object-position: center; */
   background-position: center 100%;
   background-repeat: no-repeat;
   background-size:contain;
   position: relative;
   display: flex;
   overflow: hidden;
}

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

   .description .description-item-image {

       max-width: 800px;
       margin: auto;

    }
   
   
}

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

   .description .description-item-image {
       /* max-width: 800px; */
       margin: auto;
    }
   
}


.art-item .art-item-image {
   width: 100%;
   height: 100%;
   /* object-fit: cover;
   object-position: center; */
   background-position: bottom center;
   background-repeat: no-repeat;
   background-size: contain;
}


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

    .art-item .art-item-image {
        /* object-fit: cover;
        object-position: center; */
        background-position:center 50%;
        background-repeat: no-repeat;
        background-size: cover;
    }


}

@media screen and (min-width: 1200px) {
   
   .art-item .art-item-image {
       /* object-fit: cover;
       object-position: center; */
       background-position:center 50%;
       background-repeat: no-repeat;
       background-size: auto;
   }
  
}



:root{
   --content-padding-top: 100px; //100vh;
}
  @media screen and (min-width: 768px) {
    :root{
      --content-padding-top: 0px;
      }
}
/*
@media screen and (min-width: 1200px) {
    :root{
      --content-padding-top:600px;
      }
}
 @media screen and (min-width:420px) and (max-height: 800px) {
  :root{
      --content-padding-top: 200px;
      }
}

@media screen and (min-width:420px) and (max-height: 1200px) {
  :root{
      --content-padding-top: 400px;
      }
} */



.home.cf-2026.phase-0 .content-page-wrap{
   position: relative;
   width: 100%;
   padding-top: var(--content-padding-top);//100vh;
   z-index: 20;
   max-width: 800px;
   margin: auto;
   padding-left: 5vw;
   padding-right: 5vw;
   height: 100vh;//100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  
}

 @media screen and (max-width:  768px) {
.home.cf-2026.phase-0 .content-page-wrap{
      font-size: 14px;
      text-align: center;
      }
}

 @media screen and (max-width:  1200px) {
.home.cf-2026.phase-0 .content-page-wrap{
      font-size: 14px;
      text-align: center;
      }
}


.home.cf-2026.phase-0 .content-page-wrap p.buttons{
    justify-content:space-around;
    flex-flow: row;
    display: flex;
}



@media screen and (max-width: 600px) {
    .home.cf-2026.phase-0 .content-page-wrap p.buttons{
    display: flex;
    flex-flow: column;
    }

}


.home.cf-2026.phase-0 .content-page-wrap p.buttons a{
color: rgb(239, 70, 59);
background-color: white;
padding: 10px 20px;
border-radius: 40px;
margin:5px;
white-space: nowrap;
text-decoration: none;
position: relative;
display: flex;
}

.page.home.cf-2026.phase-0{

   position: absolute;
   width: 100%;
   height: 100vh;
   left: 0;
   top: 0;
}



.page.cf-2026.phase-0 .art-item.centered .art-item-image {
   /* object-fit: cover;
   object-position: center; */
   background-position:center 50%;
   background-repeat: no-repeat;
   background-size:contain;
}


.page.page-id-29.cf-2026 a.logo-image{
    display: none; /* hide default logo on artpage  + also the other one* - only display the artbox x cally logo :*/
}

.page.page-id-2899 a.logo-image.artpage-only{
   display:flex;
}