/* CSS Document */

body {
margin:0 auto;
margin:5%;
background:#EDD267 url(images/honeycomb.jpg);
background-repeat:repeat;
}

#container {
max-width:960px;
width:100%;
height:auto;
background:#FED27C;
margin:0 auto;
font-size:16px;
}

#header {
background-image:url(images/header.jpg);
background-color:#000000;
border:2px solid #FF0066;
}

#header img {
width:100%;
max-width:960px;
height:auto;
background-image:  url(images/header.jpg);
background-repeat:no-repeat;
}

#primary_nav {
display:inline;
width:100%;
height:auto;
margin:0 auto;
float: left;
background-color:pink;
}

#primary_nav ul {
display: inline;
width:100%;
height:auto;
margin:0 auto;
padding:0;
}

#primary_nav li {
list-style-type:none;
margin:0 auto;
padding:10px 15px 10px 25px;
float:left;
}

#primary_nav li a {
margin:0 auto;
padding:0;
color:#000000;
text-decoration:none;
font-size:18px;
font-family:verdana;
border-top:#000;
border-bottom:#fff;
}

#primary_nav li a:visited {
color:#313131;
}

#primary_nav li a:hover {
color:#FF0066;
text-decoration:underline;
font-weight:bold;
}

.paypal_bee {
width:150px; 
height:auto;
margin:0 auto;
float:left;
}


#main {
width:100%;
max-width:960px;
height:auto;
margin-top:0;
background:#FED27C;
}

.content {
width:100%;
max-width:900px;
height:auto;
background:#FED27C;
margin:0 auto;
padding:0;
font-size:16px;
float:left;
}

p {
margin-left:25px;
}

h3 {
margin-top:25px;
margin-left:10px;
}

span.pink {
color:#FF0066;
font-size:18px;
font-weight:bold;
margin-left:5px;
}

.computer_bee_index {
width:200px;
height:auto;
float:right;
}

textarea {
width:95%;
height:250px;
margin:0 auto;
}

td {
background-color:#fff;
}

#footer {
clear:both;
width:100%;
max-width:960px;
height:265px;
margin:0 auto;
background-color:#000000;
border-top:2px solid #FF0066;
border-bottom:2px solid #FF0066;
}

.foot_links {
width:100%;
height:auto;
margin: 10px auto;
text-align:center;
}

.foot_links a:link {
color:#fff;
}      

.foot_links a:visited { 
color:#FEAF10;
}  

.foot_links a:hover { 
color:pink;
font-weight:bold;  
}

.copyright {
width:100%;
height:auto;
text-align:center;
margin:15px 0;
color:#fff;
}

/* iPads (portrait) ----------- */
@media only screen and (min-width : 769px) {

.content {
margin-left:5px;
width:83%;
}

#primary_navtoggle,
.primary_nav_icon {display:none;}

#secondary_navtoggle,
.secondary_nav_icon {display:none;}
}

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

.content {
margin-left:5px;
width:98%;
}

#primary_navtoggle,
.primary_nav_icon {display:none;}

#center {
margin-top:8px;
}
}

@media only screen and (max-width : 667px) {

#primary_navtoggle {display:none;}
#primary_navtoggle:not(:checked) ~ #primary_nav {position:absolute;}

.primary_nav_icon {
display:block;
background-color:#f8647e;
color:#ffffff;
cursor:pointer;
width:100%;
height:31px;
margin:0 auto;
padding:5px 0px;
font-weight:bold;
border-top:#d03131;
}

#primary_nav {
display:block;
width:100%;
height:auto;
margin:0 auto;
padding:0px;
top:-541px;
}

#primary_nav li {
display:block;
width:96%;
margin:0 auto;
padding:5px 8px 5px 8px;
text-align:center;
border-bottom:1px solid #fff;
}

#primary_nav li a {
display:block;
width:100%;
float: left;
margin: 0 auto;
padding: 0px;
}
}

@media only screen and (max-width : 640px) {

#primary_nav {
top:-537px;
}

#secondary_nav {
width:100%;
}
 
.content {
width:98%;
}
}

@media only screen and (max-width : 480px){ 

h1 {
font-size:24px;
font-family:verdana;
text-align:center;
margin:0 auto;
}
}

@media only screen and (max-width : 414px){

}

@media only screen and (max-width : 375px){

#primary_nav {
top:-495px;
}
}

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

#primary_nav {
top:-491px;
}
}

@media only screen and (max-width : 320px) {

#primary_nav {
top:-377px;
}

.content {
width:95%; /* 288 / 320 */
}
}