/* RESPONSIVE LAYOUT */
    
     @media (max-width: 1366px) {
   
   .main {
    width:100%; 
   }
   
   
 }



@media only screen and (min-width: 360px) and (max-width: 768px) {

    .flex-container{
width:100%;
}

.main .aboutinfo .phone {
 display:none !important; 
}

.bannerWrapper, .bannerFade, .bottombanner {
  display:none !important; 
}
         
        }
    
    
    
    
    
    
    
    
    
    
     a {
       text-decoration:underline; 
      }

/* FOR YOUTUBE VIDEOS */

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;

}
.videoWrapper iframe {
  position: absolute;
  /*top: 0;
  left: 0;*/
  width: 100%;
  height: 100%;

}


body {
  font-family: Arial, Helvetica, sans-serif;
  font-size:10px;
 
}

h1 {
  color:#0364c1;
  font-size:3.5em;
}

h2 {
 color:#2b78c2;
 font-size:2.2em;
}


h3 {
 color:green;
 margin-top:0px;
 margin-bottom:4px;
 margin-left:5px;
 padding-top:5px;
 font-size:2.8em;
}

h3 a {
 text-decoration:none; 
 color:green;
}

h3 a:hover {
 opacity:0.7; 
}

h4 {
 color:orange;
 font-size:2em;
 margin-bottom:8px;
 /*margin-bottom:-15px;*/
 
}

h5 {
 margin: -1px 10px -1px 5px;
 font-size:2em;
}

 a:hover {
       opacity:0.7; 
      }
      
      a {
       text-decoration:none; 
      }
      
ul li {
 font-size:1.5em; 
 
}

 p {
 font-size:1.5em; 

}

blockquote {
 font-size: 1.5em;

}
      
 .challenge {
     width:70%;
     display:block;
     margin-left:auto;
     margin-right:auto;
     font-size:3em;
     border: 5px red dotted;
     background-color:yellow;
     color:#2b78c3;
     padding:10px;
     text-align:center;
    } 
    
    .challenge a {
     text-decoration:underline; 
    }
      
.wrapper {
  
 background-image: url("/Pictures/SitePictures/BookBackgroundSeamless.jpg");
	  background-attachment: fixed;
    background-repeat:repeat;
    background-position:left top;
    background-position:bottom right;
    position:relative;
}

/*.menu {
 width:100%;
 height:auto;
 margin-bottom:-30px;
}*/

.main {
  width:96%;
  margin-left:auto;
  margin-right:auto;
  display:block;
  margin-bottom:10px;
  margin-top:10px;
  background: rgba(255, 255,255, 0.6);
  padding: 2px 7px 2px 7px;
   border: 1px solid #fff;
  box-shadow: 0 0 0 1px #bbb;
}

/*.main p {
 font-size:14px; 
}*/



.mainImage {
  width: 90%;
  height: auto;
  display:block;
  margin:5px;
  margin-left:auto;
  margin-right:auto;
}

figcaption {
 display:block;
 font-size:12px;
 margin-left:auto;
 margin-right:auto;
 width:90%;
 color:blue;

}


.reviewersContainer {
   width:96%;
   display:block;
   margin-left:auto;
   margin-right:auto;
   /*background-color:green;*/
   overflow:hidden;
   position:relative;
}

.reviewersColumn {
  width:50%;
  display:block;
  float:left; 
  
}

.reviewersHeading {
  width:100%;
  display:block;
  float:left;
}


.reviewers {
  width:100%;
  margin-bottom:5px;
  background-color:#B0E0E6;
  overflow:hidden;
 
}

.reviewers p {
/* font-size:12px;*/
 margin:5px;
}

.reviewerImage {
 width:25%;
 float:left;
 margin-right:10px;
 margin-left:10px;
 /*border-radius:4px;*/
 padding-bottom:10px;
 
}

.blogsection {
  width:50%;
  margin:0 auto;
}

.blog {
 /*background-color:red;*/
 width:38%;
 margin-left:1%;
 float: left;
 /*overflow:hidden;*/
}

.blogPosts {
 background-color:#e0ffff;
 border: 1px solid #B0E0E6;
 margin-bottom:5px;
 overflow:hidden;

}

.blogPosts p {
 /* font-size:12px;*/
  margin:5px;
  padding-bottom:5px;
}

.comments {
 width:90%;
 display:block;
 margin-left:auto;
 margin-right:auto;
 color:blue;
}

.archive {
  float:left;
  display:block;
  /*background-color:orange;*/
  width:10%;
  margin-left:1%;
  overflow:hidden;
 
}

.archivePosts li {
/* font-size:12px;*/
 text-align:left;
 margin-left:-15px;
 

}


.archivelist {

 margin-top:8px;
}

/* BANNER PICTURES */

.bannerWrapper {
/*width:100%;
margin-left:auto;
 margin-right:auto;
 text-align:center; */

}

.bannerFade .bottombanner {
  margin-top:1em;
  height:320px;
  display:block;
  margin-left:auto;
  margin-right:auto;
}


.bannerFade {
 /* width:100%;
  height:250px;
  display:block;
  margin-left:auto;
  margin-right:auto;
  max-width:1300px;*/
}

.bottombanner {
  margin-top:1em;
  width:97%;
  height:auto;
  display:block;
  margin-left:auto;
  margin-right:auto;
  /*max-width:1300px;*/
}



/* CONTACTS */
.Contacts {
  /*background-color: #7bd5e0;*/
 /* width:96%;
  padding: 50px 0 30px 0;
  margin-left:auto;
  margin-right:auto;
  color:black; 
  border:2px solid #2b78c3;
  background: rgba(43, 120, 195, 0.6);
  margin-bottom:20px;*/
 }

.Contacts p {
 text-align:center;
 margin-bottom:-45px;
 font-size:1.5em;
}

.contactslist {
 padding-bottom: 20px;
 font-size:1.8em;
}

.email {
  width:30px;
  height:auto;
  /*margin-right:5px;
  margin-top:5px;*/
}

.message {
  /*margin-right:5px;
  margin-top:5px;*/
  width:100px;
  height:auto;
}


.subscribe {
  width:94%;
  display:block;
  margin-left:auto;
  margin-right:auto;
   border: 1px solid #fff;
  box-shadow: 0 0 0 1px #bbb;
  padding:30px;
  background: rgba(43, 120, 195, 0.6);
 
}

/* Safari 7.1+ */

_::-webkit-full-page-media, _:future, :root .safari_only {

  background-color:#2b78c3; 

}



.seva-form {
  margin-top:50px;
  width:60%;
  display:block;
  margin-left:auto;
  margin-right:auto;
}

.socialmediawrapper {
  width:60%;
  display:block;
  margin-left:auto;
  margin-right:auto;
  text-align:center;
  
}

.cont-button {
 background-color:#2b78c3;
 color:white;
 font-size:1.5em;
 padding:20px;
 display:block;
  margin-left:auto;
  margin-right:auto;
  border:none;
  border-radius:5px;
}

/* MODAL POP-UPS */

.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 50px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
  margin-bottom:50px;
   }
   

/* Modal Content */
.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  /*width: 45%;   /* ADJUST CONTENT WIDTH HERE */
}

.modal-content p {
 font-size:0.8vw;

}

/* The Close Button */
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

 
 #myBtn {
  border:none;
  /*background-color: rgba(207,12,8,0.1);*/
  padding:2px;
  font-size:1em;
  font-family: "Times New Roman", Times, serif;
 }
 
 #myBtn:hover {
  cursor: pointer;
  background-color: rgba(207,12,8,0.3);
  transition:0.75s;
 }