* {
margin:0;
padding:0;
}

/*
Set initial font styles
*/
body {
   text-align: left;
   font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
   line-height: 1em;
   background: url(images/background.gif) repeat-x #353535;
   color: #333;
}

div { font-size: 1em; }

img { border: 0; }

p { padding:0; margin:0; }

a,
a:link
a:active {
   text-decoration: underline;
   background-color: inherit;
   color: #0b7e04;
}

a:visited {
   text-decoration: underline;
   background-color: inherit;
  color: #0b7e04;                /* a different color can be used for visited links */
}


/* remove underline on hover and change color */
a:hover {
   text-decoration: none;
   color: #0ed002;
}


.card {
	display: inline;
	float: left;
	width: 200px;
	height: 200px;
	margin: 5px;
	padding: 5px 0;
	text-align: center;
	background: white;
	border: 1px solid #666;
	overflow:auto;
	}

.card .card-title {
	margin: 0 0 5px 0;
	font-size: 10px;
	font-weight:bold;
	}
.card img{
	margin:0 auto; padding:0;
	border: 1px;
	border-color: black;
	}
.card .card-desc {
	margin: 0px 0px; padding:0;
	text-align: center;
	font-size: 11px;
	font-family: verdana, sans-serif;
	}
.detail {
        text-align: center;
        min-width: 435px;
	min-height: 300px;
	margin: 5px;
	padding: 10px 0;
	background: white;
	padding: 20px;
	}
.detail .card-title {
	margin: 0 0 5px 0;
	font-size: 11px;
	font-weight:bold;
	}
.detail img{
	margin:0 auto; padding:0;
	border: 1px;
	text-align: center;
	border-color: black;
	}
.detail .card-desc {
	margin: 5px 10px; padding:0;
	border: 1px solid #ddd;
	width: 650px;
	text-align: left;
	font-size: 11px;
	font-family: verdana, sans-serif;
	}


/*****************
basic layout
*****************/
div#pagewrapper {
   width:750px;
   margin: 0 auto;
   border: 0px solid #fff;
}
div#top_nav {
   padding:0;
   margin:0;
   position:relative;
   height:22px;
}
div#top_nav img {
   padding-top:8px;
   padding-left: 10px;
}
div#header {
   height: 219px;
   width: 750px;
   margin-top:7px;
   padding:0;
   background-color: #222;
}

div#content {
   background: url(images/bg_content.gif) repeat-y;
   height:100%;
   font-size:11px;
}
div#content div#con_l {
   background-color: #fff;
   display: inline;
   float: left;
   padding:20px 15px 0px;
   width: 470px;
   height:100%;
   text-align: justify;
}
div#content div#con_r {
   background-color: #505050;
   display: inline;
   float: left;
   padding:10px 0px;
   width: 250px;
   height:100%;
}
div#content div#con_r a,
a:link
a:active
{ color: #00b838; text-decoration:none;}
div#content div#con_r a:hover { text-decoration:underline; }

div#content ul {
   display:block;
   margin-left:30px;
   list-style: none;
}
div#content ul li {
   background: url(images/li.gif) 0% 5px no-repeat;
   padding-left: 12px;
}
div#content div#con_r ul li {
   color: #fff;
}

div#footer {
   clear:both;       /* keep footer below content and menu */
   color: #c0c0c0;
   background-color: #434343;
   border-bottom:1px solid #0b7e04;
   font-size:10px;
   height:45px;
   padding:2px 12px;
}
div#footer a,
a:link
a:active {
   text-decoration: none;
   background-color: inherit;
   color: #ddd;
}
div#footer a:hover {
   text-decoration: underline;
}
.ex {
   display:inline;
   float:left;
   margin:0;
   padding:0;
}
.ey {
   display:inline;
   float:right;
   margin:0;
   padding:0;
}

/* as we hid all hr for accessibility we create new hr with extra div element */
div.hr {
   height: 1px;
   margin: 1em;
   border-bottom: 1px dotted black;
}


div#con_r div.he {
   font-size: 10px;
   padding: 2px 0px;
   margin: 0;
   color: #fff;
   background: url(images/h1.gif) 4% 50% no-repeat #434343;
   width:225px;
   height:17px;
   padding-left: 25px;
   text-align:left;
}

div#content h1 {
   color: #222;
   font-size: 12px;
   text-align: left;
/* some air around the text */
   padding: 1px 7px;
/* set borders around header */
   border-left: 4px solid #e63119;
   line-height: 16px;
/* and some air under the border */
   margin: 0 0 1.5em 0;
}
div#content h3 {
   color: #294B5F;
   font-size: 1.3em;
   line-height: 1.3em;
   margin: 0 0 0.5em 0;
}
div#content h4 {
   color: #294B5F;
   font-size: 1.2em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
div#content h5 {
   font-size: 1.1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
h6 {
   font-size: 1em;
   line-height: 1.3em;
   margin: 0 0 0.25em 0;
}
/* END HEADINGS */

/* TEXT */
p {
   font-size: 1em;
   margin: 0 0 1.5em 0;  /* some air around p elements */
   line-height:1.4em;
   padding: 0;
}
blockquote {
   border-left: 10px solid #ddd;
   margin-left: 10px;
}
pre {
   font-family: monospace;
   font-size: 1.0em;
}
strong, b {
/* explicit setting for these */
   font-weight: bold;
}
em, i {
/* explicit setting for these */
   font-style:italic;
}

/* Wrapping text in <code> tags. Makes CSS not validate */
code, pre {
 white-space: pre-wrap;       /* css-3 */
 white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
 white-space: -pre-wrap;      /* Opera 4-6 */
 white-space: -o-pre-wrap;    /* Opera 7 */
 word-wrap: break-word;       /* Internet Explorer 5.5+ */
 font-family: "Courier New", Courier, monospace;
 font-size: 1em;
}

pre {
   border: 1px solid #000;  /* black border for pre blocks */
   background-color: #ddd;
   margin: 0 1em 1em 1em;
   padding: 0.5em;
   line-height: 1.5em;
   font-size: 90%;   /* smaller font size, as these are usually not so important data */
}

/* END TEXT */

/* LISTS */
div#main ul,
div#main ol,
div#main dl {
  font-size: 1.0em;
   line-height:1.4em;
   margin: 0 0 1.5em 0;
}
div#main ul li,
div#main ol li {
   margin: 0 0 0.25em 3em;
}

div#dl dt {
   font-weight: bold;
   margin: 0 0 0.25em 3em;
}
div#dl dd {
   margin: 0 0 0 3em;
}
.ftab td {height: 22px; padding: 2px;}
.gap_t { width: 350px; height: 100px; background-color: #fff; border: 1px solid #ccc; }
.gap_f { width: 170px; background-color: #fff; border: 1px solid #ccc;}
.gap_req { width: 170px; height:15px; background-color: #fff; border: 1px solid #ccc; font: bold 11px Arial; }
.fbut { width: 100px; height: 20px; font-weight: bold; color:#fff; background-color: #888; border: none; }
/* END LISTS */

