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

 

body {
background-color: #ccc;
 }
#main {
margin:auto;
font-family:Verdana, Arial, sans-serif;
font-size:18px;
width:60%;
background-color:#eaeaea;
padding:20px;
 } 
 #main p {
font-family:Verdana, Arial, sans-serif;
font-size:18px;
width:65%; 
margin:auto;
padding-bottom:12px;
 } 

#list {
height:400px;
  width:300px;
  margin:auto;
}
  #list ul {
  height:400px;
  width:300px;
  margin:auto;
  }
#list li a:link {
float: left;
width: 220px;
color: #008000;
padding: 3px;
text-decoration: none;
font-weight:300;
border:1px solid black;
background-color: #ffffff;
text-align: center;
border-radius:15px;
}
#list a:visited {
color: #008000;
background-color: #fff;
}
#list li a:hover {
color: #b30000;
background-color: #eaeaea;
border:1px solid black;
} 
#list a:active {
color: #008000;
background-color: #fff;
}
#list li {
display: inline;
}  


p {
font-family: Verdana, Arial, sans-serif;
font-size:15px;;
width: 60%;
 }
 em {
 color: #e0353b;
 font-weight: bold;
  }
h1 {
color: #800080;
text-decoration: underline;
text-align:center;
}    

h2 {
color: #000000;
font-style:oblique; 
text-align:center;
font-size:medium;
}
 h3 {
color: #000000;
border-bottom:2px solid blue;
padding:8px; 
background-color:#c0c0c0;
text-align:center; 
color:#800080;
}

ul li {
 line-height:2.0;
 font-size:17px; }
a:link {
color: #008000; /* green */
}
a:visited {
color: #008000;
}
a:hover {
color: #b30000; 
}
a:active {
color: #008000; 
} 
.box {
border:1px solid green;
padding:3px;
font-style:oblique;
font-size:mediium;
padding:10px;
width:55%;
color:#b30000; } 

@media only screen and (max-device-width: 720px) {
/* define mobile specific styles come here */
 div#main {
 width:90%;
 font-size:1.5vw;
 margin:0px;
  }
 div#list {
 width:90%;
 font-size:1.5vw;
 height:250px;
 margin:10px;
  }
  
    
  div#main p {
  width:80%; }
  
 h1 {
 font-size: 20px !important;
} 
h2 {
 font-size: 18px !important;
}  h3 {
 font-size: 16px !important;
}
}
