body { 
padding: 0; margin: 0;
font-family: Tahoma, Calibri, "Trebuchet MS", sans-serif;
font-size: 13px; 
text-align: center; 
color: #222;
background: #F4F4F4 url(images/bg.jpg) no-repeat top center;
}




/* HTML 5 
========================================== */
header, section, footer,
aside, nav, article, figure {
display: block;
}


/* LINKS 
========================================== */

a, .title { 
color: #3F67B1; 
text-decoration: none; 
}

.title {
font-size: 11px;
}

a:hover, #Footer a:hover { 
color: #0099CC; 
text-decoration: none; 
}

header a { color: #1085BB; }
header a:hover { color: #000; }

a img { 
border: none; 
}

a:active, a:focus { outline: none; }

.btn  {
color: #FFF;
padding: 4px 12px 6px;
font-size: 12px;
font-weight: bold;
background: #002D62;
border-radius: 5px;
display: inline-block;
text-align: center;
margin: 0 0 5px;
line-height: 16px;
}

.btn:hover  {
color: #FFF;
background: #1085BB;
}

.btn.color1 { background: #990000; }
.btn.color2 { background: #0099CC; }
.btn.color3 { background: #ED4E08; }
.btn.color4 { background: #215968; }
.btn.color5 { background: #921e75; }


.red-text {color:#FF3300;}

.btn.color1:hover, .btn.color2:hover, .btn.color3:hover , .btn.color4:hover, .btn.color5:hover {
background: #1085BB;
}


.btn2 {
display: block;
font-size: 12px;
color: #1071BB;
}

.btn2:before {
content: "\2022 ";
display:inline-block;
margin-right: 5px;
}

.btn2:hover {
color: #002D62;
}

input.button, a.button {
border: none;
font: bold 12px arial; 
background: #999;
margin: 0;
color: #FFF;
padding: 4px 15px 3px;
border-radius: 5px;
}

a.button { padding: 5px 15px; }

input.button:hover, a.button:hover {
background: #666;
cursor: pointer;
}


/* HEADERS  
========================================== */

h1, h2, h3, h4, h5, h6 { 
margin: 10px 0; 
padding: 0;
font-family: Calibri, "Trebuchet MS", sans-serif;  
font-weight: normal;
color: #0099CC;
}

h1 { font-size: 22px; margin-bottom: 20px; color: #FF3300; text-transform: uppercase; }
h2 { font-size: 18px; color: #006699; line-height: 20px; }
h3 { font-size: 18px; color: #FF3300; }
h4 { font-size: 16px; }
h5 { font-size: 14px; font-weight: bold;  }
h6 { font-size: 14px; color: #000; font-weight: bold; margin: 0; }

#Home .colStyle h2 { margin: 5px 0 0;}


/* LIST 
========================================== */

/* 1st level */
ul, ol { 
margin: 0px 5px; 
padding: 0;
}

li { 
padding-left: 10px; 
margin: 0px; 
list-style-type: none; 
background: url(images/bullet.png) no-repeat left 7px; 
}

ol { 
padding-left: 25px;
}

ol li { 
padding-left: 0px; 
background: none; 
list-style-type: decimal; 
}

ol.alpha li { 
list-style-type:lower-alpha; 
}

/* block level */
ul.block li, ol.block li { 
margin-bottom: 10px; 
}

ul.block li li, ol.block li li { 
margin-bottom: 2px; 
}

/* 2nd level */
ul li ul, ol li ol, ol li ul { 
margin: 5px 20px; 
padding: 0;
}

ul li li { 
background-image: none; 
list-style-type: circle;
padding-left: 0;
}

ol li li { 
list-style-type: lower-roman; 
}


/* Input Textarea
========================================== */

form { 
margin: 0; 
padding: 0;
}

input.text, textarea {
padding: 3px 5px 0;
color: #888;
font: normal 12px tahoma;
border: 1px solid #DDD;
border-radius: 5px;
margin: 4px 0;
display: block;
width: 300px;
}

input.text { height: 25px; }

input.text:hover, textarea:hover, input.login:hover { border: 1px solid #bbb; }

input.btn {
border: none;
font: bold 9px arial; 
text-transform: uppercase;
background: #1085BB;
margin: 0;
padding: 4px 8px;
}

input.btn:hover {
background: #000;
}

header input.btn {
margin-right: 8px;
padding: 3px 0;
width: 50px;
}

input.login {
border: 1px solid #ddd;
border-radius: 5px;
color: #999;
font-size: 10px;
width: 125px;
margin: 0 0 10px 10px;
padding: 2px 5px;
}

::-webkit-input-placeholder { color: #666; font-size: 9px; }
:-moz-placeholder { color: #666; font-size: 9px; } /* Firefox 18- */
::-moz-placeholder { color: #666; font-size: 9px; }/* Firefox 19+ */
:-ms-input-placeholder { color: #666; font-size: 9px; }


/* Table
========================================== */

table { border-collapse:collapse; }
table, td { margin: 0; padding: 0; }
td { vertical-align: top; }

.tblData {
background: #F7F7F7;
color: #333;
font-size: 11px;
border-top: 1px solid #333;
border-left: 1px solid #333;
}

.tblData td {
padding: 3px 15px;
border-bottom: 1px solid #333;
border-right: 1px solid #333;
}

.tdHeader2 {
background: #5395A8;
color: #FFF;
font-weight: bold;
text-transform:uppercase;
}

.tdHeader {
background: #B6DDE8;
color: #000;
font-weight: bold;
text-transform:uppercase;
}

.tdAlt {
background: #DAEEF3;
}

/*.tblData  tr:nth-child(even) {
background: #DAEEF3;
}*/

/* member login & signup page */

.tbl td { padding: 5px 10px; }



/* Image
========================================== */

.imgLogo { display:block; }
.imgBlock { display:block; }
.imgIcon { vertical-align: middle; margin-right: 5px; }
.imgStyle { border: 1px solid #000; }
a .imgStyle { border: 1px solid #EEE; }
a:hover .imgStyle { border: 1px solid #000; }



/* MISC
========================================== */

.alignRight { text-align: right; }
.alignCenter { text-align: center; }
table.alignCenter { margin: 0 auto; text-align: left; }
.valignMiddle { vertical-align: middle; }
.valignTop { vertical-align: top; }
img.alignCenter { margin: 0 auto; display: block;}

.highlight { color: #222; font-size: 14px; line-height: 22px;}



#Home p { margin: 10px 0 12px; }
#Sub p {  margin: 15px 0; }

small { font-size: 11px; }

hr {
border: none;
border-top: 1px dotted #ccc;
height: 1px;
background: none;
visibility: hidden;
}

.hr {
height: 10px;
background: url(images/dots.png) repeat-x center left;
}

.hr hr {
border: none;
background: none;
display: none;
}

blockquote {
margin: 0;
padding: 25px 45px;
background: #e9e9e9;
line-height: 18px;
color: #555;
}

blockquote:first-letter {
font-size: 15px;
}

img{-ms-interpolation-mode:bicubic;}

/* clearfix */
.cf:before, .cf:after {
content: " "; /* 1 */
display: table; /* 2 */
}
.cf:after { clear: both; }
/** For IE 6/7 only - Include this rule to trigger hasLayout and contain floats. **/
.cf { *zoom: 1; }


/* LAYOUT
========================================== */

#Container {
width: 990px;
margin: 10px auto;
text-align: left;
background: #fff;
}

header {
width: 940px;
margin: 25px 25px 0; 
}

#logo {
float: left;
width: 450px;
padding-bottom: 20px;
}

#login-tab a {
display: block;
background: #EEE;
border: 1px solid #DDD;
border-bottom: none;
padding: 6px 2px;
text-align: center;
color: #333;
font-weight: bold;
}

#login-tab a:hover {
background: #DDD;
}

#login-tab a.active {
background: #DDD;
}

#login {
margin-top: 0px;
text-align: left;
border: 1px solid #DDD;
background: #EEE;
padding: 5px 10px 8px 10px;
}

#social {
margin: 10px 0 5px;
}

.ddsmoothmenu2{
border-top: 1px solid #333;
border-bottom: 3px solid #333;
}

#Main {
width: 100%;

}


/* Home
========================================== */

#Home {
background: url(images/bg-home.jpg) no-repeat top left;
margin-top: -18px;
border-top: 3px solid #FFF;
/* border-top: 3px solid #000; */
line-height: 18px;
}

article { margin: 12px 0; }
.tn { float: left; width: 75px;}
.tn img { border: 1px solid #000; }
.info { float: right; width: 600px; }

.colStyle {
padding:10px;
background:#E3E3E3;
width: 320px;
border-radius: 10px;
}

.bg-01 {
background: #D8ECFC;
padding: 20px;
border-radius: 10px;
}


/* Sub pages
========================================== */

#Sub {
background: url(images/bg-sub.jpg) no-repeat top left;
margin-top: -4px;
border-top: 3px solid #000;
line-height: 20px;
}

#banner { background: #fff; }

#Content {
float: left;
width: 700px;
margin-left: 30px;
padding: 20px 0 50px;
}

#Sub #Content { padding-top: 30px; }

#Sidebar {
float: right;
width: 200px;
margin-right: 20px;
padding: 27px 0;
}

#Sub #Sidebar {
padding-top: 30px;
}

.tnLink {
background: #2E4570;
width: 190px;
padding:  1px 1px 8px;
text-align: center;
text-transform: uppercase;
font: bold 10px tahoma;
margin: 40px auto 0;
border-radius: 10px;
}
.tnLink a { color: #FFF;}
.tnLink a:hover { color:#fff; }
.tnLink:hover { background: #1085BB; }
.tnLink img { display: block; margin-bottom: 7px; border-radius: 9px 9px 0 0; }


.tnLink-above {
background: #2E4570;
width: 190px;
padding:  1px 1px 1px 1px;
text-align: center;
text-transform: uppercase;
font: bold 10px tahoma;
margin: 40px auto 0;
border-radius: 10px;
}
.tnLink-above a { color: #FFF;}
.tnLink-above a:hover { color:#fff; }
.tnLink-above:hover { background: #1085BB; }
.tnLink-above img { display: block; margin: 0px; padding: 0px; border-radius: 0px 0px 10px 10px; }


ul.subLink, ul.subLink li {
margin: 0;
padding: 0;
list-style-type: none;
}

ul.subLink {
padding: 15px 0;
background: #002D62;
border-radius: 10px;
}

ul.subLink li { margin: 0 0 0 0; }

ul.subLink a {
display: block;
color: #FFF;
background: #002D62 url(images/bullet2.png) no-repeat 12px 12px;
padding: 5px 25px;
text-decoration: none;
}

ul.subLink a:hover {
background-color: #0099CC;
color: #FFF;
}

#board h2 { padding-left: 10px; background: #333; color: #fff;}
#board h4 { margin-top: 30px; }
#medal h4 { margin-top: 50px; }
#educator td { text-align: center; padding: 10px;}

/* Footer
========================================== */

#Footer {
width: 930px;
margin: 0 auto;
text-align: left;
padding: 10px 30px 20px;
color: #999;
text-transform: uppercase;
font-size: 10px;
}

#Footer a {
color: #666;
}

#Footer b { color: #1085BB; font-weight: normal; }

#copy { float: left; width: 500px;}
#iwi { float: right; width: 200px;}
#iwi a { color: #aaa;  }

#toTop {
width:80px;
text-align:center;
padding:5px;
position:fixed; /* this is the magic */
bottom:50px; /* together with this to put the div at the bottom*/
right:50px;
cursor:pointer;
display:none;
color:#FFF;
background: #666;
font-size:10px;
text-transform: uppercase;
z-index: 10;
border-radius: 3px;
}

#toTop:hover { background: #1085BB; }

#researchBriefs ul {
margin: 15px 0;
}

#researchBriefs ul li {
margin-bottom: 10px;
}

#tabs {
font-size: 90%;
margin: 20px 0;
width: 460px;
margin: 0 auto;

}
#tabs ul {
float: left;
width: 100%;
padding-top: 4px;
}
#tabs li {
margin-left: 8px;
list-style: none;
}
* html #tabs li {
display: inline; /* ie6 double float margin bug */
}
#tabs li,
#tabs li a {
float: left;
}
#tabs ul li a {
text-decoration: none;
padding: 8px;
color: #0073BF;
font-weight: bold;
}
#tabs ul li.active {
background: #CEE1EF url(img/nav-right.gif) no-repeat right top;
}
#tabs ul li.active a {
background: url(img/nav-left.gif) no-repeat left top;
color: #333333;
}
#tabs div {
background: #CEE1EF;
clear: both;
padding: 20px;
min-height: 200px;
}
#tabs div h3 {
text-transform: uppercase;
margin-bottom: 10px;
letter-spacing: 1px;

#tabs div p {
line-height: 150%;
}