/* ------------------------------------
Site: Hiptwist
CSS Author: Donia
Updated at: 8/15/11
Updated by: Donia
--------------------------------------*/


/* ------------------------------------
resets
--------------------------------------*/

html, body, ul, ol, li, form, fieldset, legend {
   margin: 0;
   padding: 0;
}

fieldset, img {
   border: 0;
}

legend {
   color: #000;
}

input, textarea, select, button {
   font-family: [];
   font-size: 110%;
   line-height: 1.1;
}

button {
  width: auto;
  overflow: visible;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  vertical-align: top;
  font-weight: normal;
}

abbr, acronym {
  border-bottom: .1em dotted;
  cursor: help;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

pre, code {
  font-family: 'Courier New', monospace, serif;
  font-size: 100%;
  line-height: 1.2;
}
/* Tell the browser to render HTML 5 elements as block */  
header, footer, aside, nav, article {  
    display: block;  
}
li {
	list-style: none;
}

/* ------------------------------------
elements
-------------------------------------*/
@media screen {
	body {
	    background-color:#000000;
		color:#FFFFFF;
		font: 100% Verdana, Arial, Helvetica, sans-serif;
		line-height: 1.3em;
		height: 100%;
		background: url(../Images/Smoke.jpg);
		background-repeat:repeat-y;
	    background-size:100% auto;
	}
	
	h1, h2, h3, h4, h5, h6 {
	    margin: 0 0 .5em;
	}

	h1 {
		color: #FFF;
		font-size: 21px;
		font-weight: bold;
		padding-bottom: 10px;
	}

	h2 {
		color: #FFF;
		font-size: 18px;
		font-weight: bold;
		padding-bottom: 10px;
	}

	h3 {
		color: #FFF;
		font-size: 16px;
		font-weight: bold;
		padding-bottom: 10px;
	}

	h4 {
		color: #FFF;
		font-size: 14px;
		font-style: italic;
		font-weight: normal;
		padding: 0 35px 0 20px;
	}

	h5 {
		color: #FFF;
		font-size: 14px;
		font-weight: normal;
		align: justify;
	}
	
	p {
		margin: 0;
		padding:0 0 20px 0;
		color:#FFF;
	}
	
	a:link {color: #FFF;}
	a:visited {color: #FFF;}
	a:focus {color: #FFF; outline: thin dotted;}
	a:hover {color: #FFF;}
	a:active {color: #e68f95;}
	
	input, textarea {
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		background-color#FFF:;
		color: #6666CC;
		font-weight:bold;
		border:#9966FF;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		padding:5px;
		width:300px; 
		font-size:90%;
		font-family:Arial, Helvetica, sans-serif;
		margin: 0 0 10px 0;
	}
	
	input.submit, input.button {
		background: url(../Images/button_blue.png) no-repeat;
		width:96px;
		height:51px;
		color:#FFF;
		font-weight:bold;
		vertical-align:baseline;
	}

	.contact_form {margin: 0 auto; width:75%;} /* name of form on contact page */
	.validate {margin: 0 auto; width:50%;} /* name of form for mail chimp */
/* ------------------------------------
Layout and Basic Structure
-------------------------------------*/
#container {
		width: 900px;
		margin: 10px auto; /*5px 5px 5px 5px; */
		padding:15px;
		overflow:auto;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px; 
		background:rgba(255,255,255,.2);
		}
		#bg_overlay {
		    width: 870px;
		    margin: 0 auto; /*5px 5px 5px 5px; */
		    padding:15px;
		    overflow:auto;
		    -webkit-border-radius: 5px;
	        -moz-border-radius: 5px;
		    border-radius: 5px;
			background:#333333; 
		    background:rgba(0,0,0,.75);
			}
			#main_text {
				font-size: 1em;
				padding: 25px;
				margin: 0;
				width: 820px;
			}		
			#col1, #col2 {
				float: left;
				width: 395px;
				padding: 15px 20px 0 20px;
				margin: 0;
				}
				#main_text ul, #col1 ul, #col2 ul {
					padding: 0 0 20px 25px;
				}
				#main_text li, #col1 li, #col2 li {
					list-style-type:circle;
				}
				#main_text .no_bullets li, #col1 .no_bullets li, #col2 .no_bullets li {
					list-style-type:none;
					padding: 0 0 15px 0;
				}				
			#wide_col {
				float: left;
				width: 500px;
				padding: 15px 10px 0 10px;
				margin: 0;
			}
			#skinny_col {
				float: left;
				width: 330px;
				padding: 15px 10px 0 10px;
				margin: 0;
			}
			#details {
				font-size: 1em;
				padding: 25px;
				margin: 0;
			}
			#menu {
				font-size: 1em;
				padding: 25px;
				margin: 0;
			}	
			img.right {
				float: right;
				border: 0px;
				margin: 20px 0 20px 20px;
			}
			img.upper_right {
				float: right;
				border: 0px;
				padding: 0 0 20px 20px;
			}
			img.lower_right {
				float: right;
				border: 0px;
				margin: 20px 0 0 20px;
			}	
			img.left {
				float: left;
				border: 0px;
				margin: 20px 20px 20px 0;
			}	
			img.upper_left {
				float: left;
				border: 0px;
				margin: 0 20px 20px 0;
			}	
			img.lower_left {
				float: left;
				border: 0px;
				margin: 20px 20px 0 0;
			}	
		#upcoming_events {
			float:right;
			width:300px;
			border-top: 1px solid gray;
			}	
			#upcoming_events ul {
				list-style-type: none;
				margin:0;
				padding:0;
				}	
				#upcoming_events li {
					display:inline;
					margin:0;
					padding:0;
				}	
		.Heading {
			font-weight: bold;
		}
		.ParagraphHeading {
			font-weight: bold;
		}
		.Recommended {
			font-size: smaller;
			font-weight: bold;
			color: #FFFF00;
		}
		.Testimonial {
			font-size: bigger;
			font-weight: normal;
		}
		.Announcement {
			font-size: bigger;
			font-weight: bold;
			color: #990066;
		}
		.title {
			font-size: bigger;
			font-weight: bold;
			padding: 25px;
			margin: 0;
		}
		.home_page_quotes {
			font-size: bigger;
			font-style: italic;
			text-align: center;
			float:left;
			width: 300px;
			color:#FFCC00;
			padding: 20px 25px;
		}
		.quotes {
			font-size: bigger;
			font-style: italic;
			text-align: center;
			float:left;
			width: 300px;
			color:#FFCC00;
			padding: 20px 40px 40px 40px;
			}
			.caption {
			   font-size: smaller;
			   font-style: italic;
			   text-align: center;
			}
		.image_with_caption {
		   float: right;
		   text-align: center;
		   margin: 20px;
		}
		.question {
		   margin: 0 0 5px 0;
		   font-style:italic;
		   font-weight:bold;
		}
		.answer {
		   margin: 0 0 40px 0;
		}
}

@media print {
	body {
		color:#000;
		background: #FFF;
		text-align: justify;
		font: 14px/1 'DejaVu Sans', 'URW Gothic L', 'Helvetica Neue', Helvetica, Arial, 'Mircosoft Sans Serif',  sans-serif;
	}
	
	h1, h2, h3, h4, h5, h6 {
	    margin: 0 0 .5em;
	}
	h1 {
		font-size: 21px;
		font-weight: bold;
		text-decoration: underline;
	}
	h2 {
		font-size: 18px;
		font-weight: bold;
		display: inline;
	}
	h3 {
		font-size: 16px;
		font-weight: bold;
		display: inline;
	}
	h4 {
		font-size: 20px;
		line-height: 20px;
		font-weight: bold;
		text-decoration: underline;
	}
	h5 {
		font-size: 14px;
		font-weight: normal;
		align: justify;
	}
	
	p {
	    margin: 0 0 1.5em;
		line-height: 1;
		padding-bottom:5px;
		font-size:14px;
	}
	
	a:link {color:#000000; text-decoration: underline;}
	a:visited {color:#333333;}
}
