/* CSS Document */



body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td, cite { 	
	margin : 0; 
	padding : 0 }


	


body, p, th, td{
	font-family: 'Open Sans', sans-serif;
	color:#00f}
	
body{
	background-color:#CCCCFF}
	


	
h1.colour{color:#FF0000;
padding-bottom:20px}
	
	
#facebook{

	padding-top:10px;}
	
#fixed_sidebar{
	position:fixed;
	top:10px;
	left:50%;
	margin-left:-446px;
	padding:5px
	}
	
#fixed_quote{
	position:fixed;
	top:170px;
	right:50%;
	margin-right:-557px;
	width:150px;
	padding:inherit;
	font-style:italic;
	font-size:140%;
	}	
#high_fixed_quote{
	position:fixed;
	top:20px;
	right:50%;
	margin-right:-557px;
	width:150px;
	padding:inherit;
	font-style:italic;
	font-size:140%;
	}	


		

	
#female{
	position:absolute;
	left:652px;
	top:726px}
	
#male{
	position:absolute;
	left:771px;
	top:396px}
	
#smilingboy{	
	position:absolute;
	left: 798px;
	top: 114px
	}

#redstar{
	position:absolute;
	left:682px;
	top:197px}


#starburst{	
	position:absolute;
	left:733px;
	top:548px}	 
#smallbluestar{	
	position:absolute;
	left:725px;
	top:409px}	
#greenstar{	
	position:absolute;
	left:30px;
	top:150px}
	
#purplestar{	
	position:absolute;
	left:41px;
	top:255px}
	
#bluestar{	
	position:absolute;
	left:105px;
	top:365px}
	
#yellowstar{	
	position:absolute;
	left:68px;
	top:911px}
	

#mauvestar{	
	position:absolute;
	left:119px;
	top:162px}
	
#allcontent{
	position:relative;
	background-color:#FFFFFF;
	width:800px;
	margin-left:auto;
	margin-right:auto;
	
	border-right-width: 0px;
	border-left-width: 0px;
	border-right-style: none;
	border-left-style: solid;
	border-right-color: #FFFFFF;
	border-left-color: #FFFFFF;
	
	}
	
#allcontent p{
	font-size:110%;
	line-height:1.5em;
	padding-right:5px;
	padding-left:5px}
	
/*this is the styling for the main content of the page*/	
#content{
	width:600px;
	float:right;
	padding-top:20px;
	padding-bottom:20px;
	padding-right: 50px}
	

	
#fixed_sidebar{visibility:hidden}

a.links {
	font-weight:bolder;
	font-style:italic;
	color:#0000FF;
	background-color:#FFFF99
	}
	
a.book {
	color:#0000FF;
	background-color:#FFFF99
	}	
	
a {
	text-decoration: none}	
a.closed{
	font-style:italic;
	color:#f00}
a.ads img{padding-top:20px}	
	
#content p.home{
	font-size:170%;
	text-align:left;
	padding-bottom:20px}/*this gives more spacing between paragraphs in line with the larger font*/
	
#content p.homepink {
	font-size:170%;
	text-align:left;
	padding-bottom:20px; /*this gives more spacing between paragraphs in line with the larger font*/
	color:#FF00CC}
	
#content p.homered {
	font-size:170%;
	text-align:left;
	padding-bottom:20px; /*this gives more spacing between paragraphs in line with the larger font*/
	color:#f00}

	
#content p.homelarger{
	font-size:200%;
	
	font-weight:bold;
	text-align:left;
	padding-bottom:20px}/*this gives more spacing between paragraphs in line with the larger font*/	

		
#content p.about{
	font-size:130%;
	padding-bottom:10px}
	

		
#content p.largered{
	font-size:190%;
	color:#f00;
	font-weight:bold;
	padding-bottom:10px}


#content p.largegreen{
	font-size:170%;
	color:#33cc33;
	font-weight:bold;
	padding-bottom:10px}	
	
#content p.aboutmore{
	font-size:130%;
	padding-bottom:10px;
	border-bottom:dashed;
	border-bottom-color:#00f;
	border-bottom-width:medium;
	}
	
#content p.italic{
	font-size:130%;
	padding-bottom:10px;
	font-style:italic}	
	
#content p.italicbolder{
	font-size:170%;
	font-weight:bold;
	
	font-style:italic}	
	


#content p.booklist{
padding-left:20px;
padding-bottom:25px;
font-size:120%;}

a.booklist {
	font-style:italic;
	font-size:120%;
	color:#00f;
	}


	
h3.about{
	font-weight:bold;
	font-size:140%}
	
h2{
font-size:1.3em;
padding-top:10px}
	
	
/*this is the end of styling for the main content of the page*/	
ul{
	width:110px;
	list-style:none;
	position:relative;
	text-decoration:none;
	padding-left:10px;
	padding-top:20px}
	
li{
	position:relative}
	
li a{
	height: 120px;
	width: 120px;
	text-decoration: none;
	text-indent:-1000em;
	display: block;
	outline:none
}


/*using display block makes the above a work with the image */

/*BUTTONS*/
#navheader #nav li#home a {background-position: 0 0}
#navheader #nav li#info a {background-position: 0 -120px}
#navheader #nav li#times a {background-position: 0 -240px}
#navheader #nav li#place a {background-position: 0 -360px}
#navheader #nav li#why a {background-position: 0 -480px}
#navheader #nav li#contact a {background-position: 0 -600px}
#navheader #nav li#reviews a {background-position: 0 -720px}
#navheader #nav li#faqs a{background-position: 0 -840px}

/*OVER STATES*/
#navheader #nav li#home a:hover {background-position: -120px 0}
#navheader #nav li#info a:hover {background-position: -120px -120px}
#navheader #nav li#times a:hover {background-position: -120px -240px}
#navheader #nav li#place a:hover {background-position: -120px -360px}
#navheader #nav li#why a:hover {background-position: -120px -480px}
#navheader #nav li#contact a:hover {background-position: -120px -600px}
#navheader #nav li#reviews a:hover {background-position: -120px -720px}
#navheader #nav li#faqs a:hover {background-position: -120px -840px}

/*PRESSED STATES*/
#navheader #nav li#home a:active {background-position: -240px 0}
#navheader #nav li#info a:active {background-position: -240px -120px}
#navheader #nav li#times a:active {background-position: -240px -240px}
#navheader #nav li#place a:active {background-position: -240px -360px}
#navheader #nav li#why a:active{background-position: -240px -480px}
#navheader #nav li#contact a:active {background-position: -240px -600px}
#navheader #nav li#reviews a:active {background-position: -240px -720px}
#navheader #nav li#faqs a:active {background-position: -240px -840px}

/*ON STATES*/

#navheader.home #nav li#home a {background-position:-360px 0 }
#navheader.info #nav li#info a {background-position: -360px -120px}
#navheader.times #nav li#times a {background-position: -360px -240px}
#navheader.place #nav li#place a {background-position:-360px -360px}
#navheader.why #nav li#why a{background-position: -360px -480px}
#navheader.contact #nav li#contact a {background-position: -360px -600px}
#navheader.reviews #nav li#reviews a {background-position: -360px -720px}
#navheader.faqs #nav li#faqs a {background-position: -360px -840px}




li#home a, 
li#info a,
li#times a,
li#place a,
li#why a,
li#contact a,
li#reviews a,
li#faqs a,

li#home a:active, 
li#info a:active,
li#times a:active,
li#place a:active,
li#why a:active,
/*was there a line missing here */
li#contact a:active,
li#reviews a:active,
li#faqs a:active,

li#home a:hover,   
li#info a:hover,   
li#times a:hover, 
li#place a:hover, 
li#why a:hover,   
li#contact a:hover,  
li#reviews a:hover,   
li#faqs a:hover {background-image:url(images/nav-newnames-bright-smallfile.png)}
	
/*styling for when page */

table.whentable{

	width:600px;
	border-collapse:collapse;
	margin-top:20px;
	margin-bottom:20px}
	
table.whentable td, .whentable th{
	border:solid 2px #0066ff}
	
table.whentable td{
	width:14.28%}
	
table.whentable th{
	font-size:160%;
	padding:10px 0 10px 0}
	
.trdays{
	text-align:center;
	font-weight:bold}

p.closed{
	color:#f00}
	

	

p.background{
	color:#f00;
	background-color:#FFFF00}
	
/*end of styling for when page */

/*styling for contact page */
#content.contact{
	margin: 15px 0 0 0;
	padding: 0
}
	
#content fieldset{
	width:450px;
	border:2px solid #ff0;
	padding: 10px
}
	
#content legend{
	font-weight:bold;
	font-size:120%;
	padding:5px;
	margin: 0 5px 0 5px
}
	

	
#content label.fixedwidth{
	display:block;
	width:240px;
	float:left;
	line-height: 120%;
	font-size: 110%
}
	
#content input{
	line-height:150%}
	
#content .buttonarea input{
	background:#00f;
	color:#ff0;
	font-weight:bold;
	font-size:120%;
	padding:5px;
	text-align:center}
	
#content p.contactfield{
	margin:10px 0 10px 0;
	font-size: 110%;
	padding: 0
}
	
	
/*end of styling for contact page */
/*styling for where page*/

#content.location p{
	padding-left:30px;
	font-size: 110%;
	line-height: 1.5em}
	
#content .map{
	padding-left:30px}

/*styling for where page*/
blockquote{
	
	padding-top:20px;
	margin-top:20px;
	font-size:1.25em;
	font-style:italic}
	
cite{
	float:right;
	padding-right:15px}


#hidden{
	display:none}

#weather{
border:#f00 3px solid}
#weather p{
color:#f00;
font-size:150%}

#tree{
	position:absolute;
	left:613px;
	top:595px;
}
a.christmas{
color:#f00;
font-style:italic
}
a.largered{
color:#f00;
font-style:italic;
font-size:26px;
}
img.party{
	margin:20px}

/*snow stuff 
 end of snow stuff*/


.snowflake {

position: fixed;
color: #FFFFFF;
}


 #netmumsnom{
 position:absolute;
 left:752px;
 top:140px;}
 
 img.banner{float:right;
 padding-right:50px;}
 
 em{font-size:x-large}
 
 /*styling for list on the about page page*/
 ul.about{width:500px;
 padding-top:0;
 margin-left:2em;
 list-style-type:square;
 list-style-position:outside;
 font-size:130%;}
 li.about{padding-bottom:5px}
 /*end of styling for about page */




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



/* Footer */





* {
  font-family: 'Open Sans', sans-serif;
}

.footer-distributed{
	background: #00f;
	box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.12);
	box-sizing: border-box;
	width: 100%;
	font: 'Open Sans', sans-serif;
	text-align: left;
	padding: 50px 60px 40px;
	overflow: hidden;
}

section {
  width: 100%;
  display: inline-block;
  background: #ccc;
  height: 60vh;
  text-align: center;
  font-size: 22px;
  font-weight: 700;
  text-decoration: underline;
}


/* Footer left */

.footer-distributed .footer-left{
	float: left;
}

/* The company logo */

.footer-distributed h3{
	color:  #ffffff;
	font: normal 36px 'Open Sans', sans-serif;
	margin: 0 0 10px;
}

.footer-distributed h3 span{
	color:  #5383d3;
}

/* Footer links */

.footer-distributed .footer-links{
	color:  #ffffff;
	margin: 0 0 10px;
	padding: 0;
}

.footer-distributed .footer-links a{
	display:inline-block;
	line-height: 1.8;
	text-decoration: none;
	color:  inherit;
}

.footer-distributed .footer-company-name{
	color:  #ffffff;
	font-size: 14px;
	font-weight: normal;
	margin: 0;
}

/* Footer social icons */

.footer-distributed .footer-icons{
	margin-top: 40px;
}

.footer-distributed .footer-icons a{
	display: inline-block;
	width: 35px;
	height: 35px;
	cursor: pointer;
	background-color:#FFFF00;
	border-radius: 2px;

	font-size: 20px;
	color: #0000CC;
	text-align: center;
	line-height: 35px;

	margin-right: 3px;
	margin-bottom: 5px;
}

/* Footer Right */

.footer-distributed .footer-right{
	float: right;
}

.footer-distributed .footer-right p{
	display: inline-block;
	vertical-align: top;
	margin: 15px 42px 0 0;
	color: #ffffff;
}

/* The contact form */

.footer-distributed form{
	display: inline-block;
}

.footer-distributed form input,
.footer-distributed form textarea{
	display: block;
	border-radius: 3px;
	box-sizing: border-box;
	background-color:  #1f2022;
	box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.1);
	border: none;
	resize: none;

	font: inherit;
	font-size: 14px;
	font-weight: normal;
	color:  #d1d2d2;

	width: 400px;
	padding: 18px;
}

.footer-distributed ::-webkit-input-placeholder {
	color:  #5c666b;
}

.footer-distributed ::-moz-placeholder {
	color:  #5c666b;
	opacity: 1;
}

.footer-distributed :-ms-input-placeholder{
	color:  #5c666b;
}


.footer-distributed form input{
	height: 55px;
	margin-bottom: 15px;
}

.footer-distributed form textarea{
	height: 100px;
	margin-bottom: 20px;
}

.footer-distributed form button{
	border-radius: 3px;
	background-color:  #33383b;
	color: #ffffff;
	border: 0;
	padding: 15px 50px;
	font-weight: bold;
	float: right;
}

/* If you don't want the footer to be responsive, remove these media queries */

@media (max-width: 1000px) {

	.footer-distributed {
		font: bold 14px sans-serif;
	}

	.footer-distributed .footer-company-name{
		font-size: 12px;
	}

	.footer-distributed form input,
	.footer-distributed form textarea{
		width: 250px;
	}

	.footer-distributed form button{
		padding: 10px 35px;
	}

}

@media (max-width: 800px) {

	.footer-distributed{
		padding: 30px;
	}

	.footer-distributed .footer-left,
	.footer-distributed .footer-right{
		float: none;
		max-width: 300px;
		margin: 0 auto;
	}

	.footer-distributed .footer-left{
		margin-bottom: 40px;
	}

	.footer-distributed form{
		margin-top: 30px;
	}

	.footer-distributed form{
		display: block;
	}

	.footer-distributed form button{
		float: none;
	}
}

/* Footer */
 


 
