
/* ==================================================================== */
/*                                POSTS                                 */
/* ==================================================================== */

  .post h2 a, 
  .likeOtherH2As { 
    color: #b84f53; 
    font-weight: 700; 
    text-transform: uppercase; 
    font-size: 16px; 
  }

  .hentry.post h2 a, 
  .hentry .likeOtherH2As { 
    padding-right: 0; 
  } /* .hentry is the SMALL RED HEADING */

  .hentry .likeOtherH1As { 
    padding-right: 0; 
  } /* .hentry is the SMALL RED HEADING */

  .post h2 a:hover, 
  .likeOtherH2As:hover { 
    color: #000; 
    text-decoration:none; 
  } 

  .post-body{
    margin: 0px;
    padding: 0px;
  /*  font-size: 14px; */
    line-height: 20px;
    /*float: left;*/
    width: 100%;
  }

  .post-footer{
    margin:0; /* 28 apr 2020 */
  } 

  .comment-link{
    margin-$startSide:.6em;
  }

  /*#advert-1807-TT {
    background: url('https://1.bp.blogspot.com/-hFiw-S4LyfA/W1dkU0ntSkI/AAAAAAAAL7E/3DK0172Ve7ksqLQJ4Y3NbM093eEcQEC1ACLcBGAs/s1600/nesCastleBG.jpg') top center;
    background-size: cover; 
  }*/



/* ==================================================================== */
/*                         SHARE (not in use)                           */
/* ==================================================================== */

  .share-button-link-text { 
    display: block; 
    text-indent: 0; 
  }

  .post-share-buttons { 
    display: block; 
    width: 100%; 
    /*float: left; */
    margin-top: 40px;
    margin-bottom: 70px;

    a { 
      text-decoration: none;
    }

    .share-button-link-text {
      background: none !important;
    }
  
    .fb { 
      background: #375593;
      color: #fff;
      font-size: 21px;
      padding: 8px 15px;
      text-decoration: none;
      i { color: #375593; }

      /* a { 
        color:#fff;
        text-decoration:none;
      }
      */
    }

    .tw { 
      background: #0eb6f6;
      color: #fff;
      padding: 6px 15px;
      font-size: 23px;
      i { color: #0eb6f6; }
    }

    .pin { 
      background: #cb2027;
      padding: 8px 15px;
      color: #fff;
      font-size: 22px;
      i { color: #cb2027; }
    }

    .gp { 
      background: #dd4b39;
      padding: 8px 15px;
      color: #fff;
      font-size: 22px;
      i { color: #dd4b39; }
    }

    .ln { 
      background: #283e4a;
      padding: 8px 15px;
      color: #fff;
      font-size: 20px;
      i { color: #283e4a; }
    }
  }


/* ==================================================================== */
/*                              SPECIFIC                                */
/* ==================================================================== */

  .crest {
    width: 80px;
    height: 80px;
    padding: 20px;
    border-radius: 100%;
    display: inline-block;
    margin: 0 10px 10px 0;
  }

  .YA {
    background-color: #971512;
    background-image: -moz-linear-gradient(top, #cb4810, #971512);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#cb4810), to(#971512));
    background-image: -webkit-linear-gradient(top, #cb4810, #971512);
    background-image: -o-linear-gradient(top, #cb4810, #971512);
    background-image: linear-gradient(to bottom, #cb4810, #971512);
  }

  .WC {
    width: 210px;
  /*    #c0deaa
    #349357 */
  }

  .eurosportSpecific img {
    height: 138px;
  }

  /* -------- Databloom specific -------- */

    .db-elements { /* everywhere except homepage */
      display: none;
    }

    body.home {
      #back-wrap .databloom {
        background-position: bottom;
      }
      .db-elements {
        display: block;
      }

      #poolBG {
        width: 110%;
        height: 180%;
        position: absolute;
        left: -5%;
        filter: url(#displacementFilter);
        top: 20px;
        background-size: contain;
        background-repeat: repeat;
      }
    }

    #back-wrap.databloom-anim {
      .db-elements {
        height: 500px;
        width: 100vw;
        /*background: #111d33;*/
        background: none;
        position: absolute;
        top: 0; 
      }

      .db-bloom1 {
        width: 43vw;
        left: -90px;
        top: initial;
        bottom: -300px;
        position: absolute;
        /*transition: transform 150s;*/
        transform: none;
        transition: none;
      }


      .db-bloom2 {
        width: 50vw;
        left: 50vw;
        top: initial;
        bottom: 50px;
        position: absolute;
        transform: none;
        /*transition: transform 200s;*/
        transition: none;
      }

      .db-phone {
        max-width: 410px;
        width: 46vw;
        min-width: 310px;
        left: calc(((100vw - 1000px) / 2) + 80px);
        position: absolute;
        bottom: -80px;
      }
    }




/* ==================================================================== */
/*                            RELATED POSTS                             */
/* ==================================================================== */

  #related-posts {
    margin-top: 80px;

    h2 { 
      padding-bottom: 0;
    }

    a:hover { pointer: cursor; }

    #titles {
      position: absolute;
      top: 220px;
      width: calc( ( 100% - 60px ) / 4 );

      div {
        padding: 0 !important;
        text-align: left;
        margin: 0 !important;
        font-family: 'Titillium Web', sans-serif;
        font-weight: 700 !important;
        font-size: 18px;
        line-height: 1.3 !important;
      }
    }

    .related {
      position: relative;
      clip-path: polygon(
        0 34.92077px,
        0 100%,
        100% 100%,
        100% 210px,
        0 210px,
        0 200px,
        100% calc( 200px - 34.92077px),
        100% 0
      );

      h2 { 
        /*padding: 0px; 
        border-top: 1px solid #e5e5e5; 
        padding-top: 20px; 
        width: 100%; 
        font-size: 20px; 
        line-height: 1.2;*/
        display: none;
      }

      > div {
        display: flex;
        flex-wrap: wrap;

        a {
          margin-right: 20px!important; 
          padding: 0 !important;
          width: calc( ( 100% - 60px ) / 4 ) !important;
          display: inline-block;
          float: none !important;
          margin-bottom: 20px;
          margin-bottom: 80px;
          height: 200px;
          overflow: hidden;
          border: none !important;

          &:last-child {
            margin-right: 0 !important;
          }

          img { 
            width: 100% !important;
            height: auto !important;
            /*border: 1px solid #e5e5e5!important; */
            /*margin-right: 10px!important; } */
          }
        }
      }
    }

    .slopeManager {
      display: initial;
      height: calc( (1000px / 4) - 15px );
      height: 200px;
      display: none;
    }
  }




/* ==================================================================== */
/*                            IMAGE GALLERY                             */
/* ==================================================================== */

  .imgDiv {
    background-size: cover;
    background-position: center;
  }

  ul.imageGallery {
    list-style-type: none;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-padding-start: 0;
  }

  ul.imageGallery li {
    display: inline;
  }

  ul.imageGallery a.imgDiv {
    width: 33%;
    height: 280px;
    display: inline-block;
    display: inline-flex;
    background-size: cover;
    background-color: grey;
  }

  ul.imageGallery a.imgDiv.left {
    margin-left: 0;
  }

  ul.imageGallery a.imgDiv.right {
    margin-right: 0;
  }

  .imgDiv img {
    opacity: 0;
    width: 100%;
    max-height: 280px;
  }

  #descriptionText {
    z-index: 30000;
    position: fixed;
    width: 50%;
    /* height: 50px; */
    background: rgba(0,0,0,0.8);
    bottom: 77px;
    padding: 20px 25%;
    color: #fff;
    margin: 0;
    left: 0;

    display: none;
  }

  ul.imageGallery.relatedItems li {
    display: table-cell;
    display: inline-block;
    position: relative;
    width: 31%;
    padding-right: 1%;
    vertical-align: top;
  }

  ul.imageGallery.relatedItems a.imgDiv {
    width: 100%;
    height: 250px;
    padding-right: 3%;
  }

  ul.imageGallery.relatedItems .caption {
    /*width: 30%;*/
    display: block;
    padding-right: 20px;
  }

  ul.imageGallery.relatedItems .caption h2 {
    /*margin-top: 20px;*/
    font-weight: bold;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 1.3;
    height: inherit;
  }

  ul.imageGallery.relatedItems a.imgDiv {
    width: 100%;
    height: 250px;
    padding-right: 3%;
  }

  .relatedItems li {
    display: table-cell;
    display: inline-block;
    position: relative;
    width: 23%;
    padding-right: 1%;
    vertical-align: top;
  }  



/* ==================================================================== */
/*                             STATIC PAGE                              */
/* ==================================================================== */

  body.static_page {
    #main-wrapper { 
      /*width: 840px; */
    }
  }


/* ==================================================================== */
/*                           ITEM PAGE (post)                           */
/* ==================================================================== */

  body.item {
    #img_fullBleed {
      display: none;
    }

    .post-body img {
      max-width: 100%;
    }

    .labels {
      max-width: 500px;
      margin-top: 60px;
    }

    .headSection .labels {
      margin-top: 0;
      padding-bottom: 0;
    }
  
    #main-wrapper {
      /*width: 840px;*/
    }

    .imgDiv,
    .backWrapSpacer {
      margin-bottom: 40px;
    }

    a.imgDiv {
      min-height: 200px;
      display: block;
    
      &.img_main {
        width: 100%;
        height: 300px;
        position: relative;
  
        .slopeManager {
          position: absolute;
          height: 100%;
        }
      }
    }

    #blog-pager {
      float: none;
      width: 100%;
      margin: 20px 0 80px 0;
      
      span { 
        /*background: #23b5ab; */
        /*color: #fff; */
        /*padding: 10px; */
        /*float: right; */
        
        img { 
          vertical-align: bottom;
        }
      }
      
      a {
        color: #292929;
        vertical-align: bottom;
      }
    }


    &.backWrapImage {
      #back-wrap,
      .backWrapSpacer {
        background-image: none; /* 20 may 20 */
        display: block;
        background-size: 100% !important;
        background-position: initial;
        min-height: 250px;
      }

      .backWrapSpacer {
        min-height: calc(250px + 3.492077vw); /* 27 aug 26 */
        /*max-height: 29vh;*/
      }

      .topOfPageMenuSpacer {
        display: none;
      }
    }
  }

  body:not(.home) .homeScreen,
  body:not(.home) #overlayLink {
    display: none;
  }

  body.item.gradBg {
    /*background-image: linear-gradient(0deg, transparent, #efefef);
    background-image: linear-gradient(#e6e6e6 calc( (100% - 1000px) / 2 ), #fff calc( 100% - 1000px ));*/
    background: #f7f7f7;
    /*background-attachment: fixed;*/
  }

  body.item.gradBg {
    .smallHeader .topSlope:after {
      content: none;
    }
  
    .labels:not(.leftBorder) a {
      background: none;
    } 

    .labels.leftBorder:before {
      content: '';
      width: 100vw;
      left: 0;
      margin-top: -100px;
      height: 400px;
      position: absolute;
      background-image: linear-gradient(rgba(255,255,255,0), #fff, #fff, rgba(255,255,255,0));
      z-index: -1;
    }
  }




/* ==================================================================== */
/*                             SKILLS PAGE                              */
/* ==================================================================== */

  body.skills {
    .post-body.entry-content {
      max-width: 650px;
    }
  
    #ContactForm1 {
      margin: calc( 46px + 6vh ) 0 0 0; /* height of h1 plus padding-bottom */
      max-width: 300px;
      
      h3.skills {
        display: block;
      }
    }
  }

  body.skills #main, 
  body.contact #main,
  body.contact #ContactForm1 {
    max-width: 700px;
    margin-right: 60px;
  }

  body.skills #main-wrapper,
  body.contact #content-wrapper {
    display: flex;
  }



/* ==================================================================== */
/*                            CONTACT PAGE                              */
/* ==================================================================== */

  .contactLines {
    padding: 20px 0 50px 0;
  }

  .contactLine {
    white-space: nowrap;
    display: inline-block;
    color: #292929;
  }
  .contactLine:first-child {
    padding-right: 20px;
  }

  .contactLine img {
    width: 26px;
    vertical-align: middle;
    padding: 0 10px 4px 0px;
  }

  #ContactForm1 h3 {
    display: none;
  }

  body.contact #ContactForm1 h3.contactPage {
    display: block;
  }


  body.contact #main {
    padding-bottom: 20px;
  }

  .socials {
    /*display: flex;*/
    padding-top: 10px;

    a {
      margin-right: 28px;
    }

    img {
      width: 34px;
      height: auto;
      vertical-align: middle;
    }
  }

