/* Default CSS */
/* Generated by the CoffeeCup HTML Editor - www.coffeecup.com */


    
    body {                                                                                                                                                                                                                                                                      
    color: #000000; 
    font-family: Arial, Helvetica, sans-serif;
    background-color: #eaeaea;
    font-size: 16px;
    } 
    
    p {
    color: #000000;
    font-size: 16px;
	  width:90%;
    }
    
	em {
	color:#000000; }
	
	#list {
	width:200px;
	height:300px; }
  
	ul li {
 font-size:17px; }
   
	masthead {
	width:1320;
	height:240px;
	margin:auto;
	 }
    #masthead img {
    border-radius: 50px;
	 } 
   
   div.trailer {
   width:80%;
   height:80%; } 
   
   #snl {
 width:65%;
 height:65%;
 margin:20px; }
   
    
figure {
  padding: 4px;
  margin: auto;
  text-align:center; 
  padding-bottom:8px;
}

figcaption {
  background-color: transparent;
  color: #000000;
  font-style: italic;
  padding: 2px;
  text-align: center;
  margin-top:-10px;
}
	  
          
* {
  box-sizing: border-box;
}

/* Create two unequal columns that floats next to each other */
.column {
  float: left;
  padding: 10px;
  color: #000000; 
  margin-top:0px;
}

.left {
  width:45%;
  color: #000000;
background-color: transparent; 
padding: 0px 20px 0px 20px;
font-size:16px;
font-family:Arial, Helvetica, sans-serif; 
}

.right {
  width: 48%; 
  color: #000000;
background-color: #add8e6; 
padding: 10px;
font-size:16px;
font-family:Arial, Helvetica, sans-serif;
margin-top:80px;  
margin-left:30px;
border:1px solid black;
border-radius:25px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
} 
      

 img {
margin: 10px;
background-color: transparent;
max-width:100%;
height:auto;
}
#masthead img {
margin:0px; }
  
#list {
height:300px;
  width:300px;
  margin:auto;
}
  #list ul {
  height:300px;
  width:300px;
  margin:auto;
  }
#list li a:link {
float: left;
width:250px;
color: #008000;
padding: 3px;
text-decoration: none;
font-weight:300;
border:1px solid black;
background-color: #ffffff;
text-align: center;
border-radius:15px;
}    

#list li a:visited {
color: #008000;
background-color: #ffffff; }

#list li a:hover {
color: #800080;
background-color: #eaeaea;
border:1px solid black; 
font-weight:bold;
}  

#list li a:active {
color: #008000;
background-color: #ffffff; }


#list li {
display: inline;
}

a:link {
color:#008000;
}
a:visited {
color: #008000;
}
a:hover {
color: #b30000; 
}
a:active {
color: #008000; 
}  


 h1 {
    color: #75816b;   
    text-decoration: underline;
    text-align: center;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
    }
    h2 {
    color:#000;
    font-family:, Arial, Helvetica, sans-serif;
    font-weight: bold;
    text-decoration: underline;
    font-size:large;
    }
    h3 {
    color: #000000;
    font-weight: 400;
    font-size:large;
    line-height:1.5;
	background-color:#ffffff;
	padding:8px;
	border:1px solid blue;
	text-align:center;
    }
   
    h3 em {
    color: #6f4e37;
	font-weight:500;
    text-decoration:underline;
     } 
     
     h3 i {
     color: #b30000;
     text-decoration:none; } 
     
    .more {
    text-align:right; font-weight:400; font-size:large;}  
    
      

 @media screen and (max-device-width: 600px) { 
 
 
  .left { 
  float:none;
  width: 100%; }
  
  .right {
  float:none;
  width: 100%;
  margin:0px;
  }  
  

@media only screen and (max-device-width: 600px) {
/* define mobile specific styles come here */
 div#masthead {
 width:100%;
 margin:0px;
 font-size:1rem; }
 
 img {min-width:100%;
 float:none; }  
 
  div#list {
 font-size:1rem;
 width:50%;
 margin:0px;
  }   

  h1 {
 font-size: 20px !important;
}
h3 {
 font-size: 19px !important;
}
  h4 {
 font-size: 18px !important;
}
}