/* --------------------------------------------------------------------------------------------------------------------------------------------------
RESET & HTML ELEMENTS
-------------------------------------------------------------------------------------------------------------------------------------------------- */

blockquote, body, button, code, dd, div, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, img, legend, li, ol, p, pre, td, th, ul {margin:0; padding:0; border:0; vertical-align:baseline;}



address, blockquote, dl, fieldset, form, h1, h2, h3, h4, h5, h6, ol, p, table, ul {margin:15px 0;}
body {background:url("../design/bg.png") 0 0 repeat-x; font:0.8em/1.5 "arial", sans-serif;}
h1 {font-size:300%; font-weight:normal;}
h2 {font-size:220%; font-weight:bold;}
h3 {font-size:160%; font-weight:normal;}
h4, h5, h6 {font-size:130%; font-weight:normal;}
form ul {list-style:none;}
form li {display:block; padding-bottom:7px;}
form li label {display:block; padding-bottom:3px;}
input, select, textarea {font-size:100%; font-family:"arial",sans-serif;}
table.table {border-collapse:collapse; border-spacing:0;}
table.table th, table.table td {padding:7px 10px;}
table.table th {font-weight:bold;}
ul.ul {margin-left:20px; list-style:none;}
ul.ul li {padding-left:15px; background:url("../design/ul.gif") 0 25px no-repeat;}
ul.ul ul {margin:0 0 0 20px; list-style:none;}

img.bordered {
 border: 1px solid #962300;
 padding: 3px;
} 


img.left {margin: 10px 10px 10px 0;
    padding: 2px;}
img.right {margin: 10px 0 10px 10px;
   padding: 2px;}
/* --------------------------------------------------------------------------------------------------------------------------------------------------
LAYOUT
-------------------------------------------------------------------------------------------------------------------------------------------------- */

.main {width:985px; margin:0 auto;}
#header {position:relative; height:140px; overflow:hidden; background:url("../design/header001.png") 50% 0 no-repeat;}
#header #logo {position:absolute; top:60px; left:100px; margin:0; font-size:320%; line-height:1; letter-spacing:-1px; font-weight:normal;}
#header #logo span {font-weight:bold;}
#header #nav {position:absolute; top:50px; right:0px; list-style:none; font-size:130%;}
#header #nav li {display:inline;}
#header #nav li a {display:block; float:left; padding:6px 12px; text-decoration:none;}
#header #nav li a:hover {text-decoration:underline;}
#header #nav li.current a {border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-decoration:none;}
#section {overflow:hidden; padding:20px 0;}
#content {float:left; width:670px; text-align:justify;}
	.articles {margin:0; list-style:none;}
	.articles h2 {margin:0;}
	.articles h2 a {text-decoration:none;}



#content ul ul
{ margin: 2px 0 18px 16px;}

#content ul ul li
{ list-style-type: square;
  margin: 0 0 2px 0; 
  padding: 0 0 0 8px;}

#content ol
{ margin: 2px 0 0 24px;}

#content ol li
{ margin: 0 0 6px 0;}

#content a {color:#962300; text-decoration:none;}

#content a:hover {text-decoration: underline;}

#content h3 a {color:#962300;}


blockquote {
	font-style: italic;
	padding-left: 15px;
	padding-right: 15px;
	margin-bottom: 15px;
	margin-top: 15px;
	color: #7F7E64;	
}

blockquote.bordered {border: 1px solid #962300;}

.quote {padding: 15px 15px 15px 15px; text-align: left; text-align: center; border: 1px solid #962300; width: 400px; margin-left: auto;
   margin-right: auto; }

.calloutboxright {
float: right;
font-size: 16px;
border-left: 2px solid #962300;
padding:  0 10px 10px 10px;
margin: 1px 0 10px 10px;
}


.calloutboxleft {
float: left;
font-size: 16px;
padding:  0 10px 10px 10px;
border-right: 2px solid #962300;
margin: 1px 10px 10px 0px;
}

img.center {display: block;
    margin-left: auto;
    margin-right: auto;
}



	

	.articles .article-info {padding-bottom:10px;}
	.articles .article-info .comment {padding-left:18px; background:url("../design/comment.gif") 0 50% no-repeat;}
	.articles .article-info p {margin:0;}
	.gallery li {display:block; float:left; margin-right:10px;}
	.pagination {font-size:110%;}
	.pagination a {padding:5px 10px;}
	.pagination a.current {border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; text-decoration:none; font-weight:bold;}
	.more {text-align:right;}
	.more a {border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px; padding:6px 12px; text-decoration:none; font-weight:bold;}

#aside {float:right; width:250px;}
	.menu {list-style:none;}
	.menu li {display:inline;}
	.menu li a {display:block; padding:5px 5px; text-decoration:none;}
	.sponsors {margin:0; list-style:none; font-size:85%;}
	.sponsors li {padding:10px 0;}
	.sponsors li a {font-size:115%;}

#aside h4 {border: 1px solid #962300; font:  1.6em sans-serif;
 text-align: center;	margin-bottom: 5px;
	min-height: 0;
	padding: 5px 8px 6px;
}

#aside h3 {font:  1.6em sans-serif;
 text-align: left;	margin-bottom: 5px;
	min-height: 0;
	padding: 5px 8px 4px 6px;
}

#aside .menu li.current a {color:#962300; text-decoration:none; font-weight:bold;}


#footer {padding:30px 0; background:url("../design/footer.gif") 0 0 repeat-x;}
#footer p {margin:0;}

/* --------------------------------------------------------------------------------------------------------------------------------------------------
OTHERS
-------------------------------------------------------------------------------------------------------------------------------------------------- */

.box {min-height:1px; _height:49;}
.box:after {display:block; visibility:hidden; clear:both; line-height:0; font-size:0; content:".";}
.fix {float:none; clear:both; width:0; height:0; margin:0; padding:0; border:0; line-height:0; font-size:0;}
.left {float:left !important;}
.right {float:right !important;}
.t-left {text-align:left !important;}
.t-center {text-align:center !important;}.t-right {text-align:right !important;}
.t-justify {text-align:justify !important;}
.va-top {vertical-align:top !important;}
.va-middle {vertical-align:middle !important;}
.va-bottom {vertical-align:bottom !important;}
.nom {margin:0 !important;}
.nomt {margin-top:0 !important;}
.nomb {margin-bottom:0 !important;}
.hidden {position:absolute; left:-1000em; top:auto; width:1px; height:1px; overflow:hidden;}
.noscreen {display:none;}
.input-text {padding:5px;}
.input-submit {padding:3px;}

/* setup the responsive size of the container */
/* set the max-width to the actual width of the images and the width to the size when the browser width is less than the max-width */
/* margin:0 auto; centers the slideshow */
.slideshow {width:95%; max-width:640px; margin:0 auto; position:relative; overflow:hidden; border:1px solid solid #962300; padding:3px;} 


/* position the images and make them 100% width, display:block is used to remove the bottom padding that some browsers add to the images */
.slideshow img {position:absolute; top:0; left:-100%; width:100%; display:block;}

/* make the first image position:relative; to set the responsive height of the slideshow */
.slideshow img:first-child {position:relative;} 

/* the animation for each slide */
/* each slide is shown for 6 seconds and the total time for the 8 slides is 48 seconds with each slide delayed 6 seconds after the previous slide */
/* we need two animations for each image, one for Chrome, Safari and Opera, and the other for Firefox and Internet Explorer */
.slideshow img:nth-of-type(1) {-webkit-animation:autoplay 48s linear infinite 0s; animation:autoplay 48s linear infinite 0s;} 
.slideshow img:nth-of-type(2) {-webkit-animation:autoplay 48s linear infinite 6s; animation:autoplay 48s linear infinite 6s;}
.slideshow img:nth-of-type(3) {-webkit-animation:autoplay 48s linear infinite 12s; animation:autoplay 48s linear infinite 12s;}
.slideshow img:nth-of-type(4) {-webkit-animation:autoplay 48s linear infinite 18s; animation:autoplay 48s linear infinite 18s;}
.slideshow img:nth-of-type(5) {-webkit-animation:autoplay 48s linear infinite 24s; animation:autoplay 48s linear infinite 24s;}
.slideshow img:nth-of-type(6) {-webkit-animation:autoplay 48s linear infinite 30s; animation:autoplay 48s linear infinite 30s;}
.slideshow img:nth-of-type(7) {-webkit-animation:autoplay 48s linear infinite 36s; animation:autoplay 48s linear infinite 36s;}
.slideshow img:nth-of-type(8) {-webkit-animation:autoplay 48s linear infinite 42s; animation:autoplay 48s linear infinite 42s;}


/* animation keyframes one for Firefox and Internet Explorer, the other for Chrome, Safari and Opera */
/* the show time for each slide is 100/8 = 12.5% of the total time */
/* the slide in time is 1% and the slide out time is 12.5% + 1% = 13.5% */
/* you can adjust the slide in and out time to make it faster or slower */

@keyframes autoplay {
0% {left:-100%;}
1%, 12.5% {left:0;}
13.5%, 100% {left:100%;}
}
@-webkit-keyframes autoplay {
0% {left:-100%;}
1%, 12.5% {left:0;}
13.5%, 100% {left:100%;}
}