td:nth-child(2), td:nth-child(4)  {
  color: #fff;
}
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 95%;
  max-width: 768px;
  margin: 50px auto auto auto;
  font-size: 12px;     
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}
.cd-main-content h1 {
    font-size: 28px;
    /* font-family: "Roboto", sans-serif; */
}

@media only screen and (min-width: 768px) {
 
  .cd-main-content h1 {
    font-size: 34px;
    /* font-family: "Roboto", sans-serif; */
 }    
 .cd-main-content {
    height: 100%;
    font-size: 12px; 
 }
 .cd-container {
    font-size: 12px; 
 }  
}
@media only screen and (min-width: 1170px) {
  .cd-main-content h1 {
    font-size: 40px;
    /* font-family: "Roboto", sans-serif; */
 }    
 .cd-main-content {
    height: 100%;
    font-size: 15px; 
 }
 .cd-container {
    font-size: 15px; 
 }      
}
.cd-scrolling-bg h1,
.cd-scrolling-bg h2,
.cd-scrolling-bg h3,
.cd-scrolling-bg h5,
.cd-scrolling-bg h6 {
  color: #fff;
}
@media (max-width: 768px) {
  ul.gallery li{width:135px;
  /* height:160px; */ 
  padding:5px;margin:7px 5px 5px 7px}
  .cd-container ul {width:100%!important}
  ul.gallery{font-size:12px;}
}
@media only screen and (min-width: 768px) {
  .cd-top {
    right: 20px;
    bottom: 20px;
  }
  ul.gallery li{
      width:200px;
      /* height:190px; */
      padding:5px;margin:15px 15px 15px 0px}
  .cd-container ul {width:100%!important}    
}
@media only screen and (min-width: 1024px) {
  .cd-top {
    height: 60px;
    width: 60px;
    right: 30px;
    bottom: 30px;
  }
  ul.gallery li{width:200px;
  /* height:190px; */
  padding:5px;margin:15px 15px 15px 0px}
  .cd-container ul {width:100%!important}     
}
ul.gallery{list-style:none;list-style-image:none;list-style-type:none;font-size:16px;padding-left:5%;}
ul.gallery li{display:block;float:left;text-align:left;background-color:#fff;color:#000}
ul.gallery li h4 {margin-top:-8px}
ul.gallery li img {width:200px;margin:0px 0;}
.cd-container .items {
    margin: 0px auto;
    padding-bottom:5%;
    display:block;
    /* display:table-cell; */
}
.cd-container ul {display:relative;margin:auto auto}
.extract p {
    font-size: 16px;    
}
.cd-footer.cd-color-2 {
  background-color: #c4dec7; 
  color: #3d3536;  
}
h3 a:hover {
  text-decoration: underline;
}
.blue {
    background-color: aqua;
}
footer.cd-footer {
  position: relative;
  height: 100px;
  min-height: 100px;
  height: auto !important;
  display: block;
  z-index: 1;
  color: #fff;
  clear:both;
  padding: 25px;
  background: #c4dec7 url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNgYGCoBwAAhACA4hd0BQAAAABJRU5ErkJggg%3D%3D") top left repeat;
  -webkit-box-shadow: inset 0px 3px 3px 1px rgba(0,0,0,0.3);
  -moz-box-shadow: inset 0px 3px 3px 1px rgba(0,0,0,0.3);
  box-shadow: inset 0px 3px 3px 1px rgba(0,0,0,0.3);  
}
footer.cd-footer p {
    font-size: 20px;
    font-style: italic;   
}
footer.cd-footer h2 {
    font-size: 22px;
    font-weight: bold;
    /* font-family: "Roboto", sans-serif; */
}