﻿
/* Start fixing EI button text overlay issue when Paypal button appear on small screen  */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .section.appeal-left-content > div.tile > div.tile {
        width: auto !important;
    }

        .section.appeal-left-content > div.tile > div.tile:first-child {
            min-width: 320px;
        }

    donateformapp .column {
        flex-basis: auto;
    }

    .appeal-donation-form.tile {
        min-width: 100%;
    }
}
/* End fixing */


/***Start clock style  ***/



.count-clock {
    /*color: #ffffff;*/
    text-align: center;
    position: relative;
    /*text-shadow: 0 0 20px rgba(10, 175, 230, 1),  0 0 20px rgba(10, 175, 230, 0);*/
    
}
.count-clock > .time {
        letter-spacing: 0.05em;
        font-size: 80px;
        padding: 5px 0;
    }
.count-clock > .date {
        letter-spacing: 0.1em;
        font-size: 24px;
    }
.count-clock > .text {
        letter-spacing: 0.1em;
        font-size: 12px;
        padding: 20px 0 0;
    }



.clock-container {
    margin-top: 30px;
    margin-bottom: 30px;
    display: flex;
  }
.clock-col {
    text-align: center;
    margin-right: 10px;
    margin-left: 10px;
    min-width: 90px;
    position: relative;
}
     /*.clock-col:not(:last-child):before,
     .clock-col:not(:last-child):after,*/ 
     .clock-separator{
      content: "";
      /*background-color: rgba(255,255,255,.3);*/
      opacity:0.3;
      height: 5px;
      width: 5px;
      border-radius: 50%;
      display: block;
      position: absolute;
      right: -15px;
    }
    .clock-separator:first-child {
        top: 35%;
     }
    .clock-separator:last-child {
        top: 50%;
     }
     /*.clock-col:not(:last-child):before {
      top: 35%;
    }
     .clock-col:not(:last-child):after {
      top: 50%;
    }*/
  
.clock-timer {
      /*color: #fff;*/
      font-size: 3.2rem;
      text-transform: uppercase;
      margin:0px !important;
    }
  
.clock-label {
    /*color: rgba(255,255,255,.55);*/
    opacity: 0.55;
    text-transform: uppercase;
    
    font-size: .7rem;
    margin-top: 10px;
  }


@media (max-width: 825px) {
  .clock-container {
    flex-direction: column;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
  }


    .clock-col {
     min-width:60px;
    }
    /*.clock-col:before,
    .clock-col:after,*/ 
    .clock-separator {
      display: none!important;
    }
  
}
/***End clock style****/