@charset "utf-8";
/* ------------------------
Site: NTSpectacular.com
Author: Rishi kesh bhandari
Updated: 24/03/2013
Updated By: Rishi kesh bhandari
------------------------ */

/* CSS Document */

/* clearing the default margin, border and padding because they may be different across browsers, */
* {
	margin: 0;
	border: 0;
	padding: 0;
	
}
body{
	width:80%;
	margin:0% 10%;
	font-family:Arial, Helvetica, sans-serif;
	background: rgba(255,225,255, 0.4);
}

header, nav, section, article, footer  {
	display:block;
}
strong {
	text-decoration: underline;
	font-weight: bold;
}

h1 {
	font-family: Verdana, Tahoma, Helvetica, Arial, Sans-Serif;
	font-size: x-large;
}

p,ul {font-size: small;}

 
li:empty {display:none}

li {
	list-style: none;
}

a:link {
	text-decoration: none;
	color: #4C99E6;
}

a:visited {
	text-decoration: none;
	color: #998833;
}

a:hover {
	text-decoration: underline;
	color: #8FBA0A;
}

a:active {
	text-decoration: none;
	color: #ffffff;
}

#pagearea{
	background-color:#cccccc;
	margin:10px 10px 10px 10px;
	width:960px;
	width:auto;
	-moz-box-shadow: 0 0 5px 5px #7a7b7a;
	-webkit-box-shadow: 0 0 5px 5px #7a7b7a;
	box-shadow: 0 0 5px 5px #7a7b7a;
}

header {
	background-color: #336699;
	color: #E6B24C;
	text-align:center;
	font-family:Verdana, Geneva, sans-serif;
	text-shadow: 1px 4px 1px #ffffff;
	

}
header h1 {
	font-size:34px;
	line-height:44px;
	padding:11px 0;

}


header h2 {
	font-size:22px;
	line-height:22px;
	padding: 10px 0;	
}


/* start navigation items */

nav
{
	float: left;
	width: 100%;
	background: #333333;
	margin: 0 0 2% 0;
}

nav ul
{
	margin: 0;
	padding: 0;
}

nav ul li
{
	width:20%;
	display: inline;
	float:left;
}

nav li a
{
	padding: 10px 0 10px 0;
	display: block;
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	border: 1px solid #000000;
	
	-moz-border-radius:10px;
	-webkit--border-radius:10px;
	border-radius:10px;
}

nav li a:hover { background: #336699; }


/* end navigation items */

section h2{

	margin:10px 10px 10px 10px;	
	text-shadow: 1px 3px 1px  #737274;
}
section h3{
	font-size:16px;
	margin:10px 10px 10px 10px;	
	text-shadow: 1px 3px 1px  #737274;
}

section p {
	margin:10px 10px 10px 10px;
}

section ul {
	margin:10px 10px 10px 10px;
}
section ul li {
	
	margin: 5px;
}




/* event table */
.eventtable { width: 96%; margin: 2%;}
table caption {
	
	font-weight: bold;
	padding: 10px 0 10px 0;
}

table {
	font-size: small;
	
}
th {
	border-width: 1px;
	color:#336699;
	padding: 5px;
	border-style: solid;
	border-color: #336699;
	background-color: #E6B24C;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}


td {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #ffffff;
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

/* end event table */

/* start contact form */
.contact{
	text-align:left;
}
fieldset {
	border: 1px solid black;
	margin: 10px;
	-webkit-border-radius: 10px ;
	-moz-border-radius: 10px;
	border-radius: 10px;
}
legend { padding:5px;
	border:2px dotted #000000} /* Border width, style and colour */
form {
	width:80%;
	margin: 20px auto;
  
	-webkit-border-radius: 10px ;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

span {
	clear: both;
	padding: 10px;
}

input[type=text], textarea, select {
	border:2px solid #999;
	font-size:16px;
	width:60%;
	display:block;
	margin: 10px;
	outline: none;

	-webkit-border-radius: 10px ;
	-moz-border-radius: 10px;
	border-radius: 10px;
	}

form ul li {
	list-style: none;
}

input[type=submit] {
	margin: 15px;
	background-color: #4C99E6;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: solid 1px #CCC;
	font-size:14px;
	color: #ffffff;
	text-shadow: 2px 2px 4px #000000;
 }
 
 
input[type=submit]:hover {
	background-color: #E6B24C;
 }
/* end form */


/* images gallery */

figure {
	max-width: 400px;
}
figure p {
	vertical-align: text-top;
	} 

figure p img {
	margin:10px;
	-moz-border-radius: 15px 0 15px 0;
	-webkit--border-radius: 15px 0 15px 0;
	border-radius: 15px 0 15px 0;
	-moz-transition:-moz-transform 2s; /* Firefox 4 */
    -webkit-transition:-webkit-transform 2s; /* Safari and Chrome */
    -o-transition:-o-transform 2s; /* Opera */
	
}
figure p img:hover {
transform:rotate(5deg);
-moz-transform:rotate(5deg); /* Firefox 4 */
-webkit-transform:rotate(5deg); /* Safari and Chrome */
-o-transform:rotate(5deg); /* Opera */
}
/* end image gallery*/
footer{
	clear: both;
	background-color: black;
	text-align: center;
	overflow:hidden;
	opacity: 0.7;
}

footer p {
	color: #ffbf00;
	margin: 10px ;
}


/* media queries ----*/

/* ------- media queries to adjust body width according to viewport ----------------- */

@media only screen and (max-width: 825px) {
	body {
		width:90%;
		margin-left:5%;
		margin-right:5%
	}
	figure p img {
		width: 100%;
		height: auto;
	}
}


@media only screen and (max-width: 560px) {
	body {
		width:96%;
		margin-left:2%;
		margin-right:2%
	}
	figure p img {
		width: 100%;
		height: auto;
	}
}