
.social_media_tall {
  display: flex;
  width: 100%;
    height:100%;
    background-color: #4d4d4e;
     -webkit-box-orient: vertical;
  -moz-box-orient: vertical;
  -webkit-box-direction: normal;
  -moz-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -moz-box-pack: center;
  -webkit-flex-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-flex-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
}

#iconslight > a {
  display: inline;
}

#iconslight > a {
  vertical-align: middle;
}

.large_square {
  width: 66.66% !important;
  height: 66.66vh !important;
}

.large_rectangle {
  width: 33% !important;
  height: 66.66vh !important;
}

.fullsize {
  width: 100% !important;
  height: 100vh !important;
}

.long_rectangle {
  width: 100% !important;
  height: 33.33vh !important;
}

.long_rectangle_info {
  width: 100% !important;
  height: 33.33vh !important;
}




.novato_pic {
  background-image: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0) ), url("/images/photos-14.jpg");
  background-size: cover;
  width: 100%;
  height:100%;
  color: #fff;
  background-position: top;
}

.san_rafael_pic {
  background-image: linear-gradient( rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0) ), url("/images/san_rafael.jpg");
  background-size: cover;
  width: 100%;
  height:100%;
  color: #fff;
}

.san_anselmo_pic {
  background-image: linear-gradient( rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0) ), url("/images/san_anselmo.jpg");
  background-size: cover;
  width: 100%;
  height:100%;
  color: #fff;
}

.cbp-ig-grid li:nth-child(-n+7) {
    border-top: none;
    list-style: none;   
}


.date_time_info {

}


.novato_week .day1 {
    border-top: 5px solid #ccc !important;
    border-bottom: 1px solid #ddd;
}

.novato_week .day2 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.novato_week .day3 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.novato_week .day4 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.novato_week .day5 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.novato_week .day6 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.novato_week .day7 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}





.san_rafael_week .day1 {
    border-top:  5px solid #ccc !important;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day2 {
    border-top:  5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day3 {
    border-top: 5px solid #f47820 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day4 {
    border-top: 5px solid #00bab3 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day5 {
    border-top: 5px solid #00bab3 !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day6 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_rafael_week .day7 {
    border-top:  5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}







.san_anselmo_week .day1 {
    border-top: 5px solid #ccc !important;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day2 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day3 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day4 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day5 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day6 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}

.san_anselmo_week .day7 {
    border-top: 5px solid #ccc !important;
    border-left: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
}


hr {
  width:95%;
}

.clear_space {
margin:0;
}

.money {
  text-align: -webkit-center;
  height: 50vh;
}

.moneybox {
  text-align: center;
  width:15%;
  display: inline-block;

}

.descriptionbox {
  text-align: left;
  width:30%;
  display: inline-block;
  font-size: .9em;
}

.moneybox2 {
  text-align: center;
  width:15%;
  display: inline-block;

}

.descriptionbox2 {
  text-align: left;
  width:30%;
  display: inline-block;
  font-size: .9em;
}


.cbp-ig-grid li {
    width: 60vw;
    float: none !important;
    height: 33%;
    text-align: left;
    text-align: center;
}

.cbp-ig-grid ul {
    padding-left: 0 !important;
    display: flex;

}


.frame {
  height: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}


.card {
  height: 100%;
  perspective: 800px;
}

.card:hover .flip {
  -webkit-transform: rotateX(180deg) translate3d(0, 0, 0);
          transform: rotateX(180deg) translate3d(0, 0, 0);
}
  
.card .flip {
  width: 100%;
  height: 100%;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transition: all 1s ease-in-out;
  transition: all 1s ease-in-out;
  -webkit-perspective: 1000px;
          perspective: 1000px;
}
  
.card .front, .card .back {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #FFF;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  border-radius: 3px;
  overflow: hidden;
  text-align: center;
}
  
.card .front {
  z-index: 2;
  -webkit-transform: rotateX(0);
          transform: rotateX(0);
}

.card .back {
  -webkit-transform: rotateX(180deg);
          transform: rotateX(180deg);
}


hr {
  margin-bottom: 10px;
}

.spacing09 {
    bottom: 0;
    margin-top: 5%;
    padding-left: 10px;
}

.spacing02 {
    padding-top: 25px;
}

.spacing10 {
    padding-top: 0;
    margin:0 !important;
    padding-left: 10px;
}



@media screen and (max-width: 25em) { 


.large_square {
  width: 80% !important;
  height: 66vh !important;
}

.large_rectangle {
  width: 20% !important;
  height: 66vh !important;
}

.cbp-ig-grid li {
  width: 100% !important;
}

.long_rectangle_info {
  width: 100% !important;
}

}


























/* (max-width 2560px) everything 2560px and more will be this... */

@media screen and (min-width: 160em) { 


.descriptionbox {
    width: 23%;
}

.descriptionbox2 {
    width: 23%;
}

}


/* (max-width 2560px) everything 2560px and less will be this... */

@media screen and (max-width: 160em) { 



.descriptionbox {
    width: 23%;
}

.descriptionbox2 {
    width: 23%;
}

}


/* (max-width 1440px) everything 1440px and less will be this... */

@media screen and (max-width: 90em) { 

.descriptionbox {
    width: 23%;
}

.descriptionbox2 {
    width: 23%;
}


}


/* (max-width 1024px) everything 1024px and less will be this... */

@media screen and (max-width: 64em) { 

.descriptionbox {
    width: 30%;
}

.descriptionbox2 {
    width: 30%;
}

}


/* (max-width 768px) everything 768px and less will be this... */

@media screen and (max-width: 48em) { 

h2 {
  text-align: center;
}

h3 {
  text-align: center;
}

.descriptionbox {
    width: 23%;
}

.descriptionbox2 {
    width: 23%;
}

.long_rectangle_info {
    height: 200px !important;
}


}

/* (max-width 425px) everything 425px and less will be this... */

@media screen and (max-width: 26.75em) { 

.descriptionbox {
    font-size: .5em;
    width: 23%;
}

.descriptionbox2 {
    font-size: .5em;
    width: 23%;
}

.moneybox {
    font-size: 1em;
}

.moneybox2 {
    font-size: 1em;
}

h3 {
    margin-top: 0.5em;
    margin-bottom: .5em;
}

h4 {
    font-size: 0.7em;
}


}


/* (max-width 375px) everything 375px and less will be this... */

@media screen and (max-width: 23.438em) { 



}


/* (max-width 320px) everything 320px and less will be this... */

@media screen and (max-width: 20em) { 


}


