
/*=====Home Cards===========================================*/
div#home.card-container{top:-20px; background-color: #eee;margin-bottom: -80px; /*background: url(images/repeated-square.png) repeat;*/}
div#home .card{max-width: 250px;background:#fefefe; margin:15px 15px;}
div#home div.card {text-align: center; border-left:5px solid;cursor: pointer;}
div#home div.card div.card-title{background: #ffffff80;    border-bottom: 1px solid #9a9a9a;border-left: 1px solid #9a9a9a;border-right: 1px solid #9a9a9a;}
div#home div.card div.card-title h2 {font-size: 1.5rem; font-weight: 500;text-transform: uppercase;letter-spacing: 0.001rem;}
div#home div.card a{color: #f58021;}
div#home div.card:hover a{color: #0062A9;}
div#home div.card:hover div.card-title {background-color: #fff; }
div#home div.card .card__image-holder {padding-bottom: 60%!important;background-color: rgb(2, 148, 203);}
div#home div.card img {width: 45%;padding-top: 1.0rem;}
div#home div.identify {background: #a09696;font-size: 1.0rem;color: #fff;height: 1.5rem;text-transform: uppercase;padding-top: 0.5rem;letter-spacing: 0.1rem;}
/* Home Color Swatches for Landing */
div#home .orange{border-color:transparent!important;}
div#home .blue{border-color:transparent!important;}
div#home .gold{border-color:transparent!important;}
div#home .light-grey{border-color:transparent!important;}
div#home .medium-grey{border-color:transparent!important;}
div#home .orange:hover{border-color: #f58021!important;}
div#home .blue:hover{border-color: #0062a9!important;}
div#home .gold:hover{border-color: #e9ce00!important;}
div#home .light-grey:hover{border-color: #dbdbd2!important;}
div#home .medium-grey:hover{border-color: #5c5d5f!important;}
/* Home Media Query for Cards */
@media (max-width: 1024px){
div#home .card{max-width: 9rem;}
div#home div.card div.card-title h2 {font-size: 1rem;}}
/*======LANDING PAGE CARDS SECTION==========================================*/ 
.card-container {top: -100px;position: relative;}
a.btn {
  background: #0062a9;
  border-radius: 4px;
  box-shadow: 0 2px 0px 0 rgba(0, 0, 0, 0.25);
  color: #ffffff;
  display: inline-block;
  padding: 6px 30px 8px;
  position: relative;
  text-decoration: none;
  -webkit-transition: all 0.1s 0s ease-out;
  transition: all 0.1s 0s ease-out;
  z-index: 1000!important;
}
.no-touch a.btn:hover {
  background: #00a2ad;
  box-shadow: 0px 8px 2px 0 rgba(0, 0, 0, 0.075);
  -webkit-transform: translateY(-2px);
          transform: translateY(-2px);
  -webkit-transition: all 0.25s 0s ease-out;
  transition: all 0.25s 0s ease-out;
}
.no-touch a.btn:active,
a.btn:active {
  background: #008a93;
  box-shadow: 0 1px 0px 0 rgba(255, 255, 255, 0.25);
  -webkit-transform: translate3d(0, 1px, 0);
          transform: translate3d(0, 1px, 0);
  -webkit-transition: all 0.025s 0s ease-out;
  transition: all 0.025s 0s ease-out;
}
div.cards {
  margin: 80px auto;
  max-width: 100%;
  text-align: center;
}
div.card {
  background: #ffffff;
  display: inline-block;
  margin: 8px;
  max-width: 300px;
  -webkit-perspective: 1000;
          perspective: 1000;
  position: relative;
  text-align: left;
  -webkit-transition: all 0.3s 0s ease-in;
  transition: all 0.3s 0s ease-in;
  width: 300px;
  z-index: 1;
  border-bottom: solid 5px;
}
div.card img {
  max-width: 300px;
}
div.card .card__image-holder {
  background: rgba(0, 0, 0, 0.1);
  height: 0;
  padding-bottom: 75%;
}
div.card div.card-title {
  background: #ffffff;
  padding: 6px 15px 10px;
  position: relative;
  z-index: 0;
}
div.card div.card-title a.toggle-info {
  border-radius: 32px;
  height: 32px;
  padding: 0;
  position: absolute;
  right: 15px;
  top: 10px;
  width: 32px;
}
div.card div.card-title a.toggle-info span {
  background: #ffffff;
  display: block;
  height: 2px;
  position: absolute;
  top: 16px;
  -webkit-transition: all 0.15s 0s ease-out;
  transition: all 0.15s 0s ease-out;
  width: 12px;
}
div.card div.card-title a.toggle-info span.left {
  right: 14px;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
div.card div.card-title a.toggle-info span.right {
  left: 14px;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
div.card div.card-title h2 {
  font-size: 24px;
  font-weight: 700;
  letter-spacing: -0.05em;
  margin: 0;
  padding: 0;
}
div.card div.card-title h2 small {
 
    display: block;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: -0.025em;
    line-height: 1.9rem;
}

div.card div.card-description {
  padding: 0 15px 10px;
  position: relative;
   font-size: 1.0rem;
    line-height: 1.5rem;
}
div.card div.card-actions {
  box-shadow: 0 2px 0px 0 rgba(0, 0, 0, 0.075);
  padding: 10px 15px 20px;
  text-align: center;
}
div.card div.card-flap {
  background: #d9d9d9;
  position: absolute;
  width: 100%;
  -webkit-transform-origin: top;
          transform-origin: top;
  -webkit-transform: rotateX(-90deg);
          transform: rotateX(-90deg);
}
div.card div.flap1 {
  -webkit-transition: all 0.3s 0.3s ease-out;
  transition: all 0.3s 0.3s ease-out;
  z-index: -1;
}
div.card div.flap2 {
  -webkit-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
  z-index: -2;
}
div.cards.showing div.card {
  cursor: pointer;
  opacity: 0.2;
  -webkit-transform: scale(0.88);
          transform: scale(0.88);
}
.no-touch div.cards.showing div.card:hover {
  opacity: 0.94;
  -webkit-transform: scale(0.92);
          transform: scale(0.92);
}
div.card.show {
  opacity: 1 !important;
  -webkit-transform: scale(1) !important;
          transform: scale(1) !important;
          float: none;
          border: solid 1px #dbdbd2!important;
          border-bottom: none!important;
}
div.card.show div.card-title a.toggle-info {
  background: #ff6666 !important;
}
div.card.show div.card-title a.toggle-info span {
  top: 15px;
}
div.card.show div.card-title a.toggle-info span.left {
  right: 10px;
}
div.card.show div.card-title a.toggle-info span.right {
  left: 10px;
}
div.card.show div.card-flap {
  background: #ffffff;
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
}
div.card.show div.flap1 {
  -webkit-transition: all 0.3s 0s ease-out;
  transition: all 0.3s 0s ease-out;
}
div.card.show div.flap2 {
  -webkit-transition: all 0.3s 0.2s ease-out;
  transition: all 0.3s 0.2s ease-out;
}

div.card div.card-actions {
    box-shadow: 0 2px 0px 0 rgba(0, 0, 0, 0.075);
    padding: 10px 15px 20px;
    text-align: center;
}
/*========= End of Landing Pages Cards Section ========================*/
/*========= Banner Color Sections ===========================================*/
.banner-color{border-bottom: solid 45px #e6e6e6;}
.orange{border-color: #f58021!important;}
.blue{border-color: #0062a9!important;}
.gold{border-color: #e9ce00!important;}
.light-grey{border-color: #dbdbd2!important;}
.medium-grey{border-color: #5c5d5f!important;}
.pagenav-landing {
    background-image:url('/globalimage/facelift/image_headers/subpage_header.jpg');
    background-position: center bottom, center center;
    background-repeat: repeat-x, no-repeat;
    background-size: auto auto, cover;
    clear: both;
    height: 174px;
    margin-top: 5px;
    padding-top: 178px;
    position: relative;
    text-align: left;
    top: -131px;
    width: 100%;
    z-index: 1;}
.first_ltr, .page_title, .pg_ul {text-shadow: 2px 2px 3px #000000db;}
.first_ltr{margin-top: 128px!important}
.page_title {margin: 173px 0 0 -2px!important;width: 92%!important;}
.a2a_kit.a2a_kit_size_32.a2a_default_style {
    position: relative;
    top: -88px;
    z-index: 2;
    background-color: transparent!important;
    right: -89%;
}
.share_button {
    position: relative;   
    margin-top: 0px;
    margin-right: 10px;
    top: -12px;
}
.children-landing {background-image: url(/images/services_for_children_banner.jpg)!important;}
.families-landing {background-image: url(/images/families_banner.jpg)!important;}
.adults-landing{background-image: url(/images/adult_banner_2020.jpg)!important;}
.help-landing{background-image: url(/images/resources_banner.jpg)!important;}
.apply-landing{background-image: url(/images/apply_online_banner.jpg)!important;}
/*====Intro Text for Landing Page ====*/
.intro-landing{
    position: relative;
    text-align: left;
    top: -65px;
    width: 80%; 
    font-size: 1.2rem;
    margin: 0 auto;
    padding-left:15px;
  }

  /* adil changes */
  .cards br {
    display: none;
  }

  @media only screen and (max-width: 1323px) {
    .cards br {
      display: initial;
    }
  }
 @media only screen and (max-width: 1352px) {
  .intro-landing {top:0px; margin-bottom: 25px;}
  .card-container {top: -62px;}
}
 @media only screen and (max-width: 1352px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {
    top: -21px;
    right: -87%;
}
 @media only screen and (max-width: 1154px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {
    
    right: -85%;
}

 @media only screen and (max-width: 1024px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -80%;
}
 @media only screen and (max-width: 998px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -75%;
}
 @media only screen and (max-width: 955px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -70%;
}
 @media only screen and (max-width: 910px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -65%;
}
 @media only screen and (max-width: 865px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -60%;
}
 @media only screen and (max-width: 815px) {
.a2a_kit.a2a_kit_size_32.a2a_default_style {    
    right: -55%;
}