/*
Theme Name: Baloney Pony
Description:
Version: 1.0.1
Author: Aebard
Author URI: http://www.neongenital.com
Template: enfold
*/



/*Add your own styles here:*/

/* #top .fullsize .template-blog .post .entry-content-wrapper > *, 
#top .fullsize .template-blog .post .entry-content-wrapper {
max-width: 100%!important;} */

.read-more-link{
  margin-top:10px !important;
  color:#161616;
  a:link {
      font-weight: bold;
      font-family: sans-serif;
      vertical-align: middle;
  }
}

.read-more-link:after, .special-heading-inner-border{
    background:linear-gradient(90deg, #f7931e, #f7931e, #ed1c24, #ed1c2400);
    height:1px !important;
    border:none !important;
    opacity:1;
}

.av-special-heading {
    .av-special-heading-tag {
        font-family: 'Eva Heading';
        /* , 'Times New Roman', Times, serif; */
        text-transform: uppercase;
        /* transform-origin: 0 50%;
        transform: scale(60%, 100%); */
        
        /* font-stretch: 75%;  */
        
    }
    h1{
        font-size:6em;
        &~.special-heading-border{height:6em;}
    }
    h2{
        font-size:4em;
        &~.special-heading-border{height:4em;}
    }
    h3{
        font-size:3em;
        &~.special-heading-border{height:3em;}
    }
    h4{
        font-size:2.5em;
        &~.special-heading-border{height:2.5em;}
    }
    .special-heading-border{
        /* height:4em; */
    }
}

.post-meta-infos {
    display:none;
}

.bp-comm-frame {
    article {
        .blog-meta, .image-overlay{
            display:none !important;
        }

        .post_delimiter{
            display:none !important;
        }

        .big-preview, .small-preview {
            padding:0 !important;
            border:1px #f7931e solid;
            border-width:1.5px 1.5px 0px 1.5px;
            box-shadow: #fF7711 0px 0px 8px;
            img {
                border-radius:0 !important;

            }
        }

        header {
            color:#f7931e;
            font-family:sans-serif;
            font-size:0.6em;
            margin:0;
            display:flex;
            text-transform:uppercase;
            gap:6px;
            h2 {
                color:#f7931e;
                margin:0;
                text-transform: uppercase !important; 
                padding:10px 0px !important;
            }
            &:before, &:after{
                flex:1;
                content:" ";
                display:block;
                background-color:#f7931e;
                box-shadow: #fF7711 0px 0px 8px;

            }
        }
    }

}

/*MAke this address better*/
.bp-title-card-listing>article{
    display:flex;
    gap:10px;
    .blog-meta {
        display:block;
        width:initial !important;
        margin:0 !important;
        padding:0 !important;
        overflow: initial !important;

        figure{

            min-width:150px;
            max-width:150px;
            /* min-width:100px;
            max-width:100px; */
            display:flex;
            flex-direction: column;
            border:1px #f7931e solid;
            border-width:1px 1px 0px 1px;
            overflow:hidden;
            border-radius:2px;
            background-color: RGBA(0,0,0,0.5);
            
            &~.image-overlay {
                display:none !important;
            }

            img{
                min-width:inherit;
                max-width:inherit;
            }
            figcaption{
                color:#f7931e;
                font-family:sans-serif;
                font-size:0.6em;
                margin:0;
                display:flex;
                text-transform:uppercase;
                gap:6px;
                &:before, &:after{
                    flex:1;
                    content:" ";
                    display:block;
                    background-color:#f7931e;
                }
            }

        }
    }

    .entry-content-wrapper{
        flex:1;
        margin:0 !important;
        max-width:initial !important;
    }


    header~p{
        padding:10px;
    }


}

.bp-title-card{
    text-transform: uppercase !important;
    font-weight: bold;
    font-size:1.3em;
    margin: 10px 0px;
    padding:10px;
    user-select:none;

    h1, h2{
        text-transform: uppercase !important;
        font-family: 'Eva Heading';
        text-align:left;
        /* , 'Times New Roman', Times, serif; */
        /* transform-origin: 0 50%;
        transform: scale(60%, 100%); */
        margin:0;
        line-height:0.8;
    }

    h2 {
        font-size: 2em;
    }
    h1 {
        font-size: 4em;
    }
    
    time {
        display:block;
        font-family:Arial, Helvetica, sans-serif;
    }
}

.hex3 {
  /* background: red; */
  /* -webkit-clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%); */
  /* clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%); */
  /* clip-path: polygon(86.603% 0%, 28.868% 0%, 0% 50%, 28.868% 100%, 86.603% 100%, 115.47% 50%, 86.603% 0%); */
  clip-path: polygon(75% 6.699%, 25% 6.699%, 0% 50%, 25% 93.302%, 75% 93.302%, 100% 50%);
}

.comment-count {
    background-color:#c43523 !important;
    /* box-shadow: #FFFF00 0px 0px 10px !important; */
    border-radius: 0px;
    clip-path: polygon(75% 6.699%, 25% 6.699%, 0% 50%, 25% 93.302%, 75% 93.302%, 100% 50%);
}

.av-main-single-comipa_comic{
    display:flex;
    gap:20px;
    justify-content:stretch;
    .comipa-content{
        flex:1;
    }

    .post_delimiter {
        display: none !important;
    }

    header {
        text-transform: uppercase;
        padding:10px;
        margin-bottom:20px;
        h1,h2,h3,h4,h5,h6{
            font-family: 'Eva Heading';
        }
        .post-title{
            font-size:4em !important;
            padding:0px !important;
            line-height: 1em;
        }
        .post-subtitle {
            font-size:2em !important;
            padding:0px 5px !important;
            text-align: center;
            margin:0;
        }
    }

}

/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */


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

    .header_bg{
        &:after {
            width:750px !important;
        }
    }

    .logo.avia-svg-logo a {
        max-width: calc(100vw - 780px) !important;
      }

}

@media only screen and (min-width: 767px) {
  /* Add your Desktop Styles here */

header{
  background-color: rgbA(22, 22, 22, 0.5) !important;
}

#header_main {
  background-image: url("header_coda.svg");
  background-size: auto 77%;
  background-repeat: no-repeat;
  background-position: center left;
}

.header_bg{
  background: #161616;
  &:after {
    content:"";
    background: #161616;
    height:48px;
    top:0;
    /* width:650px; */
    width:700px;
    /* width:1000px; */
    display:block;
    position:absolute;
    right:0;
    clip-path: path("M 0,0 L 58,58 H 1000 l 58,-58 z");
  }
  &:before {
    content:"";
    display:block;
    position:absolute;
    height: calc(100% - 20px);
    top:10px;
    width:100%;
    left:0;
    background: linear-gradient(to right,#c43523, #dec400,#34701c);
  }
}

.av-logo-container{
  /* &:before{
    content:"w";
    height:100%;
    width:50px;
    background-image: 
    position:absolute;
    left:-20px;
    top:0;
  } */
}

.logo.avia-svg-logo a {
  max-height:calc(100% - 20px) !important;
  max-width: calc(100vw - 720px);
  top:10px;
  padding:5px;
  img,svg{
    width:100%;
  }
}
.main_menu {
  top:13px;
  .sub-menu{
    /* margin-top:2px; */
    background-color: #161616 !important;
    font-family: "Century Gothic";
    text-transform: uppercase;
    color:#FFF !important;
    letter-spacing: 0.2em;
    font-weight: normal;
  }
}
.main_menu ul:first-child>li>a {
  height:26px !important;
  line-height:24px !important;
  /* padding-bottom:5px; */



  font-size:20px;
  font-family: "Century Gothic";
  text-transform: uppercase;
  color:#FFF !important;
  letter-spacing: 0.2em;
  font-weight: normal;

  .avia-menu-fx{
    /* bottom:-4px !important; */
  }

}

#avia-menu{
    >li.menu-item:nth-last-of-type(2) a{
        font-weight:bold !important;
    }
    .bold-btn a{
        font-weight:bold !important;
    }
}


.logged-in #avia-menu .hide-on-loggedin, .hide-on-loggedout {display:none} 
.logged-in #avia-menu .hide-on-loggedout {display:inherit;} 


.av-menu-button-colored {
  /* margin:10px; */
  box-sizing: border-box;
  padding:5px;
  .avia-menu-text{
    box-sizing: border-box;
  }
}

    

}


/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media  only screen and (max-width: 767px), 
        only screen and (orientation: landscape) and (max-height: 480px) {

            .comipa-page {
    &:not(.comipa-page-primary){
        display:none;
    }
    &.comipa-page-primary {
        display:block !important;
        a.comipa-page-link-next{display:block !important;}
        a.comipa-page-link-prev{display:none !important;}
    }
}

.comipa-display-toggle {
    display:none;
}

.comipa-spread-secondary {
    display:none !important;
}

#comipa-nav {
    .nav-single{
        display:inline-block;
    }
    .nav-spread{
        display:none;
    }
}

    .admin-bar {
        a[name=comic] {
            top:0px !important;
        }
        .comipa-media-img {
            max-height: calc(100vh - 50px - 82px - 46px);
            min-height:600px;
            &.zoom{max-height:1800px;}
        }
    }
    
    a[name=comic] {
        position:absolute !important;
        top:0px !important;
    }
    .comipa-media-img {
        max-height: calc(100vh - 50px - 82px);
        min-height:600px;
        &.zoom{max-height:1800px;}
    }

    .avia-post-nav {
        display: none
    }


}

@media only screen and (orientation: landscape) and (max-height: 480px) {
    .admin-bar {
        .comipa-media-img {
            max-height: 150vh; 
        }
    }
    .comipa-media-img {
        max-height: 150vh; 
    }
}

  /* Add your Mobile Styles here */
@media  only screen and (max-width: 767px) {
  #header_main {
    background-image: url("header_coda.svg");
    background-size: auto 77%;
    background-repeat: no-repeat;
    background-position: center left;
  }

  .header_bg{
    background: #161616;
    &:after {
      content:"";
      background: #161616;
      height: calc(100%);
      top:0;
      /* width:150px; */
     
      width: calc(7.5% + 130px);
      display:block;
      position:absolute;
      right:0;
      clip-path: path("M 0,0 L 68,68 H 1000 l 68,-68 z");
    }
    &:before {
      content:"";
      display:block;
      position:absolute;
      height: calc(100% - 20px);
      top:10px;
      width:100%;
      left:0;
      background: linear-gradient(to right,#c43523, #dec400,#34701c);
    }
  }

  .logo.avia-svg-logo a {
    &>svg, &>img{
        max-height:calc(100% - 20px) !important;
        max-width:calc(100% - 50px) !important;
    }
    
    /* top:10px; */
    padding:5px;
  }


  .av-special-heading {
    h1{
        font-size:3em;
        &~.special-heading-border{height:3em;}
    }
    h2{
        font-size:2em;
        &~.special-heading-border{height:2em;}
    }
    h3{
        font-size:1.5em;
        &~.special-heading-border{height:1.5em;}
    }
    h4{
        font-size:1.2em;
        &~.special-heading-border{height:1.2em;}
    }

}

.bp-title-card-listing>article {
    flex-direction: column;
    figure{
        display:block !important;
        width:100%;
        max-width:initial !important;
    }

}



}



/* Century Gothic */

@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/CenturyGothic-BoldItalic.woff2') format('woff2'),
        url('fonts/CenturyGothic-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: block;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/CenturyGothic-Bold.woff2') format('woff2'),
        url('fonts/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/CenturyGothic.woff2') format('woff2'),
        url('fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('fonts/CenturyGothic-Italic.woff2') format('woff2'),
        url('fonts/CenturyGothic-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: block;
}

/* Times New Roman Bold Condensed */

@font-face {
    font-family: 'Eva Heading';
    src: url('fonts/TimesNewRomanMTStd-BoldCond.woff2') format('woff2'),
        url('fonts/TimesNewRomanMTStd-BoldCond.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

/* Seven Segment */

@font-face {
    font-family: 'Eva Timer';
    src: url('fonts/7segment.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

/* Chicago */

@font-face {
    font-family: 'Chicago';
    src: url('fonts/Chicago.woff2') format('woff2'),
        url('fonts/Chicago.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: block;
}

/* Helvetica */

@font-face {
    font-family: 'Helvetica';
    src: url('fonts/Helvetica-BoldOblique.woff2') format('woff2'),
        url('fonts/Helvetica-BoldOblique.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: block;
}

@font-face {
    font-family: 'Helvetica';
    src: url('fonts/Helvetica.woff2') format('woff2'),
        url('fonts/Helvetica.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

@font-face {
    font-family: 'Helvetica';
    src: url('fonts/Helvetica-Oblique.woff2') format('woff2'),
        url('fonts/Helvetica-Oblique.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: block;
}

@font-face {
    font-family: 'Helvetica';
    src: url('fonts/Helvetica-Bold.woff2') format('woff2'),
        url('fonts/Helvetica-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: block;
}


