body {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

.color-primary-0 { color: #329900 }	/* Main Primary color */
.color-primary-1 { color: #3CBA00 }
.color-primary-2 { color: #37A900 }
.color-primary-3 { color: #2F8A04 }
.color-primary-4 { color: #2A7805 }

.color-announcement { color: #99CC99 }

#tournament {
    width: 100%;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
	border-collapse: collapse; 
}

#board {
	margin-left: auto;
    margin-right: auto;
    border: 1px solid #99CC99;
	border-collapse: collapse;    
}
#board td {
    font-size: 1em;
    border: 1px solid #99CC99;
    padding: 3px 7px 2px 7px;
}

#tournament td {
    font-size: 1em;
    border: 1px solid #99CC99;
    padding: 7px 7px 7px 7px;
}

#tournament th {
    font-size: 1.1em;
    text-align: left;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #99CC99;
    color: #FFFFFF;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
}

#tournament-title {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 4px;
    background-color: #99CC99;
    color: #FFFFFF;
	border-collapse: collapse;
    border: 1px solid #99CC99;
}

.board-image {
	width: 80px;
}

.tournament-winner-image {
	width: 75%;
    border: 1px solid #99CC99;
}

#rosterphotos {
	margin: auto;
	padding: 5px;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
	border-collapse: collapse; 
}

#rosterphotos td {
    font-size: 1em;
    border: 1px solid #99CC99;
	text-align: center;
    padding: 7px 7px 7px 17px;
}

#rosterphotos th {
    font-size: 1.1em;
    text-align: left;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #99CC99;
    color: #FFFFFF;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
}

#message {
    font-size: 1.3em;
    font-weight: bold;
    text-align: center;
    padding-top: 5px;
    padding-bottom: 4px;
    background-color: #99CC99;
    color: #FFFFFF;
    border: 1px solid #99CC99;
	border-collapse: collapse;    
}

#faq-question {
    font-size: 1.1em;
    font-weight: bold;
}

#faq-answer {
    font-size: 1.0em;
    font-weight: normal;
}

#paasl-title a:link, #paasl-title a:visited {
    display: block;
    font-weight: bold;
    color: #FFFFFF;;
    background-color: #000000;
    width: 495px;
    text-align: center;
    padding: 4px;
    text-decoration: none;
}

#paasl-title a:hover, #paasl-title a:active {
    background-color: #000000;
}

#tournament tr.alt td {
    color: #FFFFFF;
    background-color: #99CC99;
}

#tournament tr.alt a {
    color: #FFFFFF;
    background-color: #99CC99;
}

#tournament tr a {
    color: #999999;
    background-color: #FFFFFF;
}

div.container {
    width: 100%;
    margin: 0px;
    border: 1px solid gray;
    line-height: 150%;
	border-width: 0;
}


#announcement {
    width: 100%;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
	border-collapse: collapse; 
}

#announcement td {
    font-size: 1em;
    border: 1px solid #99CC99;
    padding: 7px 7px 7px 7px;
}
#announcement tr a {
    color: #999999;
    background-color: #FFFFFF;
}

#announcement tr.alt {
    color: #FFFFFF;
    background-color: #99CC99;
}

#announcement th {
    font-size: 1.2em;
    text-align: centre;
    padding-left: 5px;
    padding-top: 5px;
    padding-bottom: 5px;
    background-color: #99CC99;
    color: #FFFFFF;
    border-bottom: 1px solid #99CC99;
    border-top: none;
    border-left: 1px solid #99CC99;
    border-right: 1px solid #99CC99;
}

div.header, div.footer {
    font-weight: bold;
    padding: 0.5em;
    clear: left;
    color: #EEEEEE;
    background-color: #329900;
}

h1.header {
    font-weight: bold;
    font-size: 3.0em;
    padding-top: 0.5em;
    margin: 0;
}

div.left {
	font-size: 0.8em;
    float: left;
    width: 260px;
    margin: 0;
    padding: 1em;
	border-right: 1px solid gray;
}

div.left a {
    font-weight: normal;
	font-size: 0.8em;
	color: #2A7805;
}

div.content {
    margin-left: 260px;
    padding: 1em;
}

div.registration {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1em;
    font-weight: normal;
}

div.clickable-header {
	height:105px;
    font-weight: bold;
    padding: 0.5em;
    clear: left;
    color: #EEEEEE;
    background-color:#329900;
    
    /* Containing div must have a position value */ 
    position:relative; 
}

div.clickable-header a {
 position:absolute; 
 width:100%; 
 height:100%; 
 top:0; 
 left:0; 
 text-decoration:none; /* Makes sure the link doesn't get underlined */ 
 z-index:10; /* raises anchor tag above everything else in div */ 
 background-color:white; /*workaround to make clickable in IE */ 
 opacity: 0; /*workaround to make clickable in IE */ 
 filter: alpha(opacity=1); /*workaround to make clickable in IE */ 
}


#paaslrules {
	margin:1em 0;
    display: block;
    font-family: monospace;	
}


#photo-wall{ 
    margin: 0 0 30px 0; 
    padding: 0; 
    max-width: 100%; 
    list-style: none; 
    overflow: hidden; 
}

#photo-wall li{ 
    float: left; 
    width: 50%; 
    overflow: hidden;
}

#photo-wall li img{ 
    display: block;     
    border-left: 1px solid transparent;
    border-bottom: 1px solid transparent; 
    -webkit-transition: opacity 0.5s ease-out;  /* Saf3.2+, Chrome */
       -moz-transition: opacity 0.5s ease-out;  /* FF4+ */
        -ms-transition: opacity 0.5s ease-out;  /* IE10 */
         -o-transition: opacity 0.5s ease-out;  /* Opera 10.5+ */
            transition: opacity 0.5s ease-out;
}

#photo-wall:hover img{ 
    opacity: .5;  
}

#photo-wall li:hover img{ 
    opacity: 1; 
}

.oldie #photo-wall:hover img{ 
    filter: alpha(opacity=50); /* for older versions of IE */
}

.oldie #photo-wall li:hover img{ 
    filter: alpha(opacity=100); /* for older versions of IE */
}

#tournament-photos {
	margin-left: auto;
    margin-right: auto;
    border: none;
	border-collapse: collapse;    
}

.carousel{
  width:100%;
}
.panes{
  width:500%;
}

/*------------------------------------*\
    $CAROUSEL
\*------------------------------------*/
.carousel{
    overflow:hidden;
    width:100%;
}
.panes{
    list-style:none;
    position:relative;
    width:200%; /* Number of panes * 100% */
    overflow:hidden; /* This is used solely to clear floats, it does not add functionality. */
        
    -moz-animation:carousel 20s infinite;
    -webkit-animation:carousel 20s infinite;
    animation:carousel 20s infinite;
}
.panes > li{
    position:relative;
    float:left;
    width:50%; /* 100 / number of panes */
}
.carousel img {
    display:block;
    width:90%;
    max-width:90%;
}
.carousel h2{
    width:90%;
    font-size:1em;
    padding:0.5em;
    position:absolute;
    right:10px;
    bottom:10px;
    left:10px;
    text-align:right;
    color:#fff;
    background-color:rgba(0,0,0,0.75);
}

@-webkit-keyframes carousel{
    0%    { left:0; }
    25%   { left:0; }
    50%   { left:-100%; }
    75%   { left:-100%; }
    100%  { left:0; }
}

@keyframes carousel{
    0%    { left:0; }
    25%   { left:0; }
    50%   { left:-100%; }
    75%   { left:-100%; }
    100%  { left:0; }
}

@-moz-keyframes carousel{
    0%    { left:0; }
    25%   { left:0; }
    50%   { left:-100%; }
    75%   { left:-100%; }
    100%  { left:0; }
}


@-webkit-keyframes old-carousel{
    0%    { left:0; }
    11%   { left:0; }
    12.5% { left:-100%; }
    23.5% { left:-100%; }
    25%   { left:-200%; }
    36%   { left:-200%; }
    37.5% { left:-300%; }
    48.5% { left:-300%; }
    50%   { left:-400%; }
    61%   { left:-400%; }
    62.5% { left:-300%; }
    73.5% { left:-300%; }
    75%   { left:-200%; }
    86%   { left:-200%; }
    87.5% { left:-100%; }
    98.5% { left:-100%; }
    100%  { left:0; }
}

@keyframes old-carousel{
    0%    { left:0; }
    11%   { left:0; }
    12.5% { left:-100%; }
    23.5% { left:-100%; }
    25%   { left:-200%; }
    36%   { left:-200%; }
    37.5% { left:-300%; }
    48.5% { left:-300%; }
    50%   { left:-400%; }
    61%   { left:-400%; }
    62.5% { left:-300%; }
    73.5% { left:-300%; }
    75%   { left:-200%; }
    86%   { left:-200%; }
    87.5% { left:-100%; }
    98.5% { left:-100%; }
    100%  { left:0; }
}

@-moz-keyframes old-carousel{
    0%    { left:0; }
    11%   { left:0; }
    12.5% { left:-100%; }
    23.5% { left:-100%; }
    25%   { left:-200%; }
    36%   { left:-200%; }
    37.5% { left:-300%; }
    48.5% { left:-300%; }
    50%   { left:-400%; }
    61%   { left:-400%; }
    62.5% { left:-300%; }
    73.5% { left:-300%; }
    75%   { left:-200%; }
    86%   { left:-200%; }
    87.5% { left:-100%; }
    98.5% { left:-100%; }
    100%  { left:0; }
}


.first {
 -webkit-animation: bannermove 30s linear infinite;
    -moz-animation: bannermove 30s linear infinite;
     -ms-animation: bannermove 30s linear infinite;
      -o-animation: bannermove 30s linear infinite;
         animation: bannermove 30s linear infinite;
}
 
@keyframes "bannermove" {
 0% {
    margin-left: 0px;
 }
 100% {
    margin-left: -2125px;
 }
 
}
 
@-moz-keyframes bannermove {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-webkit-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-ms-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
 
}
 
@-o-keyframes "bannermove" {
 0% {
   margin-left: 0px;
 }
 100% {
   margin-left: -2125px;
 }
}

/*header*/
header {
 width: 800px;
 margin: 40px auto;
}
 
header h1 {
 text-align: center;
 font: 100 60px/1.5 Helvetica, Verdana, sans-serif;
 
}
 
header p {
 font: 100 15px/1.5 Helvetica, Verdana, sans-serif;
 text-align: justify;
}
 
/*photobanner*/
 
.photobanner {
 height: 233px;
 width: 3550px;
 margin-bottom: 80px;
}

#container {
 width: 1000px;
 overflow: hidden;
 margin: 50px auto;
 background: white;
}

.winners-image {
	width: 350px;
	height: 233px;
}



/* Tournament brackets */
table.bracket {
    border-collapse: collapse;
    border: none;
}

.bracket td {
    vertical-align: middle;
    width: 40em;
    margin: 0;
    padding: 10px;
}

.bracket td p {
    border-bottom: solid 1px black;
    margin: 0;
    padding: 5px 5px 5px 5px;
}

.bracket th{
    text-align:center;
}

/* LIST #1 */
#list1 { }
#list1 ul { list-style:none; text-align:center; border-top:1px solid #99CC99; border-bottom:1px solid #99CC99; padding:10px 0; margin:8;}
#list1 ul li { display:inline; text-transform:uppercase; padding:0 10px; letter-spacing:8px; }
#list1 ul li a { text-decoration:none; color:#99CC99; }
#list1 ul li a:hover { text-decoration:underline; }


/* LIST #2 */
#list2 { width:80%; }
#list2 ol { font-style:italic; font-family:Georgia, Times, serif; font-size:24px;  }
#list2 ol li { }
#list2 ol li p { padding:8px; font-style:normal; font-family:Arial; font-size:14px; border-left: 2px solid #999; }
#list2 ol li p em { font-style:bold; display:block; }

   
.menu ul li {
    display:block;
    float:left;
    padding:5px;
    font-weight: normal;
	font-size: 0.8em;
	color: #2A7805;
}

.menu ul li div {
    display:none;
}

.menu ul li div:target {
    display:block;
    font-weight: normal;
	font-size: 0.8em;
	color: #2A7805;
}

.answer,
#show,
#hide:target {
    display: none; 
}

#hide:target + #show,
#hide:target ~ .answer {
    display: inline; 
}


.sites,
#showsites,
#hidesites:target {
    display: none; 
}

#hidesites:target + #showsites,
#hidesites:target ~ .sites {
    display: inline; 
}