/* CSS Document */

html,body{margin:0;padding:0}

html{background:#252525 url(images/bg.jpg) repeat-x;}

a{
text-decoration:none;
color:#000;
}

a img{
text-decoration:none;
border:none;
}

h1,h2,h3,h4,h5,h6{
margin: 10px 0 0 20px;
}

body{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:white;
}

td p{
text-align:justify;
}

/*MENU*/

ul#menu{
display:block;
width:760px;
height:50px;
padding:0;
margin:0;
list-style-type:none;
background:transparent url(images/menu.jpg) no-repeat;
}

ul#menu li{
float:left;
list-style-type:none;
}

ul#menu li span{
display:none;
}

li#menu-01,li#menu-01 a{
width:190px;
height:50px;
display:block;
}

li#menu-01 a:hover,li#menu-01-selected{
width:190px;
height:50px;
display:block;
background:url(images/menu.jpg) 0 -50px no-repeat;
}

li#menu-02,li#menu-02 a{
width:190px;
height:50px;
display:block;
}

li#menu-02 a:hover,li#menu-02-selected{
width:190px;
height:50px;
background:url(images/menu.jpg) -190px -50px no-repeat;
}

li#menu-03,li#menu-03 a{
width:190px;
height:50px;
display:block;
}

li#menu-03 a:hover,li#menu-03-selected{
width:190px;
height:50px;
background:url(images/menu.jpg) -380px -50px no-repeat;
}

li#menu-04,li#menu-04 a{
width:190px;
height:50px;
display:block;
}

li#menu-04 a:hover,li#menu-04-selected{
width:190px;
height:50px;
background:url(images/menu.jpg) -570px -50px no-repeat;
}


/*MENU END*/

#container{
width:760px;
margin: 15px auto 1px;
background-color:#EBEFF3;
border:1px solid #CCC;
}

ul#header{
background-color:#2EABE3;
width:760px;
height:150px;
list-style-type:none;
padding:0;
margin:0;
}

ul#header li{
float:left;
}

#content{
background:#EBEFF3;
width:760px;
color:#000;
}

#footer{
background:#FFF;
width:760px;
color:#000;
text-align:right;
}

#reflection{
margin:0 auto;
padding:0;
border:0;
background:transparent url(images/reflection.png) no-repeat;
display:block;
width:760px;
height:114px
}

p#footer{
margin:0;
}

#footer p{
margin: 0 10px 10px;
}

/* Accordion CSS */

#accordion {
	margin:0;
}

h2.toggler {
clear:both;
border: 0;
border-right-color: #ddd;
border-bottom-color: #ddd;
font-family: 'Andale Mono', sans-serif;
font-size: 12px;
margin: 0;
padding: 3px 5px 1px;
}

.cyan{
background: #33CCFF url(images/cyan-bg.jpg) repeat-x;
color:#000;
}

.magenta{
background: #FF3399;
color:#000;
}

.yellow{
background: #FFF200 url(images/yellow-bg.jpg) repeat-x;
color:#000;
}

.k{
background: #FFF url(images/abtus-bg.jpg) repeat-x;
}

div.element{
background:url(images/print.png) top right no-repeat;
color:#000;
}

element.style{
color:#FFF;
}

div.element p, div.element h4 {
	margin:0px;
	padding:4px;
}

blockquote {
	padding:5px 20px;
}

/*THUMBNAIL for SHOWCASE START*/

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:link,.thumbnail:visited,.thumnail:hover,.thumbnail:active{
text-decoration:none;
color:black;
padding:0 0 0 0;
margin:0 0 0 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}


.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #EBEFF3;
padding: 5px;
left: auto;
border: 10px ridge #B4D9CE;
visibility: hidden;
color: black;
text-decoration: none;
width:300px; /*width is declared to solve the unneccessary auto-break that occur in IE when space or hypens are applied*/
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: auto;
left: auto; /*position where enlarged image should offset horizontally */
}