/* cmsms stylesheet: home modified: 10/20/18 07:32:57 */
/* Responsive breakpoints */
/* ==========================================================================
   Typographic
   ========================================================================== */
/* line 7, ../scss/home.scss */
figcaption {
  text-align: right;
  	/*@media screen and (max-width: $break-medium-width), screen and (max-height: $break-medium-height){
  		font-size:1em * $mediumFactor;
  	}
  
  	@media screen and (max-width: $break-smaller-width), screen and (max-height: $break-smaller-height){
  		font-size:1em * $smallerFactor;
  	}
  
  	@media screen and (max-width: $break-small-width), screen and (max-height: $break-small-height){
  		font-size:1em * $smallFactor;
  	}*/
}

/* ==========================================================================
   Layout
   ========================================================================== */
/* 

	In order to keep the footer at the bottom of the page, an absoultely positioned 
	layout is used to place the header, footer and content areas.

*/
@media screen and (min-height: 336px) {
  /* The content container leaves space for footer and a margin ( 3em ) */
  /* line 38, ../scss/home.scss */
  #contentContainer {
    position: absolute;
    top: 0;
    bottom: 3em;
  }

  /* Footer and content container elements are "sized" using the left and right values */
  /* line 45, ../scss/home.scss */
  #contentContainer, footer {
    overflow: hidden;
  }

  /* line 50, ../scss/home.scss */
  #contentBox {
    position: absolute;
    top: 11.32em;
    overflow: hidden;
    bottom: 0;
  }

  /* line 60, ../scss/home.scss */
  footer {
    position: absolute;
    bottom: 10px;
  }
}
/* Footer and content container elements have smaller margins at low settings*/
@media screen and (min-width: 1051px) {
  /* line 70, ../scss/home.scss */
  #contentContainer, footer {
    right: 5em;
    left: 5em;
  }
}
@media screen and (max-width: 1050px) {
  /* line 70, ../scss/home.scss */
  #contentContainer, footer {
    left: 10px;
    right: 10px;
  }
}
@media screen and (max-width: 465px) {
  /* line 70, ../scss/home.scss */
  #contentContainer, footer {
    left: 0px;
    right: 0px;
  }
}

/* line 92, ../scss/home.scss */
#contentBox {
  width: 100%;
}
@media screen and (max-width: 683px), screen and (max-height: 758px) {
  /* line 92, ../scss/home.scss */
  #contentBox {
    top: 9.5em;
  }
}
@media screen and (max-width: 600px), screen and (max-height: 600px) {
  /* line 92, ../scss/home.scss */
  #contentBox {
    top: 8.07em;
  }
}
@media screen and (max-width: 465px), screen and (max-height: 500px) {
  /* line 92, ../scss/home.scss */
  #contentBox {
    top: 6.55em;
  }
}
@media screen and (max-width: 427px), screen and (max-height: 380px) {
  /* line 92, ../scss/home.scss */
  #contentBox {
    top: 5.3155em;
  }
}
@media screen and (max-width: 380px) {
  /* line 92, ../scss/home.scss */
  #contentBox {
    top: 4.88em;
  }
}
/* line 116, ../scss/home.scss */
#contentBox figure {
  position: absolute !important;
  left: 0;
  right: 0;
  top: 1em !important;
  bottom: 1em !important;
  display: none;
  max-height: 100%;
}
/* line 128, ../scss/home.scss */
#contentBox figure:first-child {
  display: block;
  top: 0;
}
/* line 134, ../scss/home.scss */
#contentBox figure img {
  display: block;
  margin-left: auto;
  margin-right: auto;
  max-width: 90%;
  max-height: 90%;
}

/* This applies when layout is not absolute */
@media screen and (max-height: 336px) {
  /* line 147, ../scss/home.scss */
  #contentBox {
    height: 333px;
    position: relative;
    margin-top: 1.33333em;
    margin-left: auto;
    margin-right: auto;
    top: 0;
  }

  /* line 156, ../scss/home.scss */
  footer {
    margin: 10px;
  }
}
