body {
    margin: 0 auto;
        background:url(images/logo/legionbg.jpg);
	font-family:"Myriad Pro", Myriad, Helvetica, Arial, sans-serif;
        font-weight:bold;
        font: 13px/22px; 
	text-align:center;
	line-height:1.4em;
	width:940px;
        background-attachment: fixed;
	border:2px solid #e7e2d7;
	padding:10px;
}

img

{ 

padding:5px;

}

h4 { color: blue; } 

b { color: blue; } 

a:link, a:visited {
	font-family:georgia, times, serif;
	font-weight:bold;
	color:#c17086;
	text-decoration:none;

	font-size:.8em;
}

a:hover {
	border-bottom:1px dotted #91476c;
}

a img {
	border:none;
}

header, section, article, footer, nav {
	padding:10px 20px 20px;
	margin:1%;
        background-color: rgba(240,248,255,0.3);
	border:2px solid #e7e2d7;
}

header, nav {
	display:block;
	position:center;
	text-align:center;
	border:2px solid #e7e2d7;
}

header img {
	position:absolute;
	left:20px;
	top:18px;
}



section#left {
	float:left;
	width:15%;
	text-align:center;
}

section#right {
	float:right;
	width:15%;
	text-align:center;
}

section ul {
	padding:0px;
	list-style:none;
	border-top:1px solid #e7e2d7;
	margin:14px 0px;
}

section li {
	margin:0px;
	padding:0px;
	list-style:none;
}

section li a:link, section li a:visited {
	float:left;
	width:96%;
	padding:3px 1%;
	border-bottom:1px solid #e7e2d7;
}



article {
	float:left;
	width:49%;

}

footer {
	display:block;
	clear:both !important;
	margin:10px;
}

footer a {
	margin:0px 5px;
}


blockquote {
        border : 2px solid #000;
        width: 90%;
        padding: 10px;
        background-color: #ccc;
}

#gallery {
  display:inline-block;
  list-style-type:none;
  position:relative;
  margin: 0px auto;
  padding: 0;
}
#gallery li {
  position: relative;
  float: left;
  display: block;
  margin: 10px;   
}
#gallery li:nth-child(3n+1) {clear: left}
 
#gallery li:focus {
  outline:0;
}
#gallery li img {
  width: 200px;
  display: block;
  cursor: pointer;
  padding: 5px;
  background: #fff; 
  position: relative;                              
  -webkit-box-shadow: #000 0px 0px 20px;
  -webkit-transition-property: width;
  -webkit-transition-duration:0.5s;
  -moz-box-shadow: #000 0px 0px 20px;
  -moz-transition-property: width;
  -moz-transition-duration:0.5s;  
  -o-transition-property: width;
  -o-transition-duration:0.5s;
  box-shadow: #000 0px 0px 20px; 
}
#gallery li:hover img {
  -webkit-box-shadow: #fff 0px 0px 3px;
  -moz-box-shadow: #fff 0px 0px 3px;
  box-shadow: #fff 0px 0px 3px;
}
#gallery li:focus img {
  width: 900px;
  z-index: 5;
  -webkit-box-shadow: #000 0px 0px 20px;
  -moz-box-shadow: #000 0px 0px 20px;
  box-shadow: #000 0px 0px 20px;
}
#gallery li:focus div:before {
  content:attr(title);
  display:block;
  position: absolute;
  bottom:5px;
  right:5px;
  padding: 5px 15px;
  background: rgba(0,0,0,.8);
  color:#fff;
  z-index: 9;
}
 
.absolute #gallery li {width: 210px; height: 160px;}
.absolute #gallery div  {
  -webkit-transition-property: width;
  -webkit-transition-duration:0.5s;
  -moz-transition-property: width;
  -moz-transition-duration:0.5s;
  -o-transition-property: width;
  -o-transition-duration:0.5s;
}
.absolute #gallery li:focus div {
  position:absolute;
  z-index:3;
  -moz-box-shadow: rgba(0,0,0,.7) 0px 0px 20px 2000px;
  -webkit-box-shadow: rgba(0,0,0,.7) 0px 0px 20px 2000px;
  box-shadow: rgba(0,0,0,.7) 0px 0px 20px 2000px;
} 
 
.absolute.center #gallery li:focus div {
  position:fixed;
  top: 30%;
  left: 50%;                
  margin-left: -215px;
  box-shadow: none;
}


.cssbutton{
background-color: rgba(240,248,255,0.3);
border: 2px #d1ec4c outset;
padding: 1px 4px;
color: black;
text-decoration: none;
font: bold 90% "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
}

.cssbutton:hover{
border-style: inset;
background-color: #E0F2F7;
padding: 2px 3px 0 5px; /*shift text 1px to the right and down*/
}

.cssbutton:visited{
color: black;
}

.cssbutton:active{
color: black;
}

table
{
	text-align:left;
        width: 650px;

}


	/* column container */
	.colmask {
		clear:both;
		float:left;
		width:100%;			
        /* width of whole page */
		overflow:hidden;		
        /* This chops off any overhanging divs */
	}
	/* common column settings */
	.colright,
	.colmid,
	.colleft {
		float:left;
		width:100%;
		position:relative;

	}
	.col1,
	.col2,
	.col3 {
		float:left;
		position:relative;
		padding:0 0 1em 0;
		overflow:hidden;
	}
	/* 2 Column (double page) settings */
	.doublepage {
		background:#;
	/* right column background colour */
	}
	.doublepage .colleft {
		right:50%;			
        /* right column width */
		background:#;		
        /* left column background colour */
	}
	.doublepage .col1 {
		width:46%;			
        /* left column content width (column width minus left and right padding) */
		left:52%;			
        /* right column width plus left column left padding */
	}
	.doublepage .col2 {
		width:46%;			
        /* right column content width (column width minus left and right padding) */
		left:56%;			
        /* (right column width) plus (left column left and right padding) plus (right column left padding) */
	}