/**
 * HTML5 ✰ Boilerplate
 *
 * style.css contains a reset, font normalization and some base styles.
 *
 * Credit is left where credit is due.
 * Much inspiration was taken from these projects:
 * - yui.yahooapis.com/2.8.1/build/base/base.css
 * - camendesign.com/design/
 * - praegnanz.de/weblog/htmlcssjs-kickstart
 */


/**
 * html5doctor.com Reset Stylesheet (Eric Meyer's Reset Reloaded + HTML5 baseline)
 * v1.6.1 2010-09-17 | Authors: Eric Meyer & Richard Clark
 * html5doctor.com/html-5-reset-stylesheet/
 */
html, body, body div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

html, body {
    font-family: Verdana,Arial,Geneva,Helvetica,sans-serif;
    font-size: 62.5%;
    height: 100%;
}
body {
    background-color: #E9E9E9;
    font-size: 1em;
}

img {max-width:100%;}
ul {list-style:none;}
h1 {font-size: 3em; margin:0.5em 0 0.5em 0;}
h2 {font-size: 2em;}
a {color:#000; text-decoration:none;}



#pageHeader
{
  background-color:#692D73;
  border-bottom:8px solid #A54EB9;
  width: 100%;
}
.headerImg {float:left;width:49.28%;}

#subHeader
{
  background-color:#333333;
  min-height: 4em;
  width: 100%;
  margin-bottom:1.97%;
}
.links 
{
  /*font-size: 1.5em;
  float:left;
  margin: 1em; 
  color:#FFF;*/
  color: #FFFFFF;
  display: inline-block;
  font-size: 1.5em;
  margin: 0.7em;
  float:left;
}
.links a
{
  color:#FFF;
}

.social
{
  float:right;
  width: 19.5em\9; /* IE8 and below */
}
.socialIcon
{ 
  font-size:4em;
  color:#FFF;     
  border:2px solid #FFF;
  border-radius:10px;
}
.socialIcon:hover
{ 
  background-color:#fff;
  border-color:#fff;
  color:#692D73;
}

.wrapper
{
  max-width: 97em;
  margin:0 auto;
  position: relative;
  /*padding: 0 1em;*/
  /*border:1px solid #000;*/
}


/* ************ SEARCH FORM ************ */
/*
.autocomplete-suggestions { border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; font-size: 1.8em;}
.autocomplete-selected { background: #EDD9F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #A54EB9; }
*/

form.search {
    clear: none;
    display: block;
    float: left;
    margin-top: 1.5%;
    position: relative;
    width: 33%;
}
form.search label {
    display: block;
    height: 0;
    position: absolute;
    text-indent: -999em;
    width: 0;
}
form.search .input {
    background-color: #FFFFFF;
    border: medium none;
    border-radius: 3px;
    color: #444444;
    font-size: 2em;
    padding: 0.3em 2em 0.3em 0.3em;
    width: 87%;
}
form.search .submit {
    padding: 2%;
    position: absolute;
    right: -0.7em;
    z-index: 3;
}
.autocomplete-suggestions { border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; font-size: 1.8em;}
.autocomplete-selected { background: #EDD9F0; }
.autocomplete-suggestions strong { font-weight: normal; color: #A54EB9; }

  
.atoz
{
  background-color: #A84ABA;
  border: 2px solid #FFFFFF;
  border-radius: 10px;
  color: #FFFFFF;
  float: left;
  font-size: 2em;
  margin: 1.5% 2% 0 4%;
  padding: 0.425% 1.063%;
  text-align: center;
  width: 2em;
}
.atoz a
{color:#ffffff;}

/* ************ END SEARCH FORM ************ */

/* ************ HOME PAGE SEARCH FORM ************ */
#hpSearch-bg
{
    background-color: #A84ABA;
    border-radius: 10px;
    float: right;
    padding: 0.73%;
    position: relative;
    width: 82%; 
}
    
#hpSearch-box 
{
  position: relative;
  width: 100%;
  margin: 0;
}

#hpAutocomplete-ajax {
    font-size: 3em;
    color: #ddd;
    border-width: 0;
    background: transparent;
    width: 85%;
    padding: 0.3em 0 0.3em 0.2em;
    color: #333;
    outline: none;
}
/*
#hpAutocomplete-ajax input[type="text"] {
    width: 86%;
    padding: 0.3em 0 0.3em 0.2em;
    color: #333;
    outline: none;
}
*/

#hpSearch-form {
    /*height: 40px;*/
    border: 1px solid #eee;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    -webkit-box-shadow: inset 2px 2px 4px #ccc;
    -moz-box-shadow: inset 2px 2px 4px #ccc;
    box-shadow: inset 2px 2px 4px #ccc;
    overflow: hidden;
}

#hpSearch-button {
    position: absolute;
    top: 1px;
    right: 1px;
    height: 1.96em;
    width: 4em;
    font-size: 2.71em;
    color: #fff;
    text-align: center;
    line-height: 1em;
    border-width: 0;
    -webkit-border-radius: 0px 4px 4px 0px;
    -moz-border-radius: 0px 4px 4px 0px;
    border-radius: 0px 4px 4px 0px;
    background-color: #bbb;
    background: -moz-linear-gradient(top, #aaaaaa 0%, #b9b9b9);
    background: -webkit-gradient(linear, left top, left bottom, from(#aaaaaa), to(#b9b9b9));
    -moz-box-shadow: inset 0px 2px 4px #9a9a9a;
    -webkit-box-shadow: inset 0px 2px 4px #9a9a9a;
    box-shadow: inset 0px 2px 4px #9a9a9a;
    cursor: pointer;
}

.hpAtoz
{
    background-color: #A84ABA;
    border-radius: 10px;
    color: #FFFFFF;
    float: left;
    font-size: 3em;
    padding: 0.525em 0;
    text-align: center;
    width: 14%;
} 
/* ************ END HOME PAGE SEARCH FORM ************ */

/* ************ HOME PAGE ICONS FIRST ROW ************ */
.firstLevelContainer
{
  background-color: #333333;
  margin: 2.063% 1.0315%;
  padding: 2.063%;
  border-radius:10px;
  overflow: auto;
}

li.firstLevel, li.secondLevel, li.thirdLevel
{
  border-radius: 10px;
  float:left;
  padding: 1.032% 0;
  text-align: center;
  vertical-align: top;
}
li.firstLevel
{
  background-color: #A84ABA;
  width: 23%;
  margin: 0 1%;
}
li.firstLevel.selected
{
  background-color:#1F1F1F;
}
li.firstLevel.selected [class^="icon-hbc"]:hover, li.firstLevel.selected [class*=" icon-hbc"]:hover
{color:#EDD9F0;}

li.firstLevel span
{font-size:10em;}
/*
li.firstLevel div
{margin: 2.2em;height:3em;}
*/
li.firstLevel h2
{color:#fff;font-size:1.75em;line-height: 1.1em; margin:0 0.25em;/* 1em;*/}

li.firstLevel a
{ color:#fff;}

li.firstLevel [class^="icon-hbc"]:hover, li.firstLevel [class*=" icon-hbc"]:hover
{color:#333333;}
/* ************ END HOME PAGE ICONS FIRST ROW ************ */


/* ************ HOME PAGE ICONS SECOND ROW ************ */
li.secondLevel
{
  background-color: #333333;
  /*height: 12em;
  margin: 0.5em 0.7em;*/
  margin: 0 0.93%;
  width: 14.8%;  
}
li.secondLevel span
{font-size:10em;}

li.secondLevel h2
{font-size:1.75em; /*height:2em;*/font-weight: normal;margin:0 0.25em;}

li.secondLevel a
{ color:#fff;}

li.thirdLevel
{
  width:24.5%;
  font-size:0.9em;
  
  background-color:Purple;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
}
li.thirdLevel a
{
  color:#FFF;
}

.list1, .list2, .list3, .list4
{
  overflow:auto; display:none;
}

/* ************ END HOME PAGE ICONS SECOND ROW ************ */



.clear{clear:both;}








#pageFooter
{
  background-color:#333333;
  margin-top:2em;
  color:#FFF;
}  
#pageFooter a
{
  color:#FFF;
}  
.footerLinks, .copyright
{
  display:inline-block;
  width:40%;
  vertical-align: middle;
  /*IE7*/
  *display: inline;
  zoom: 1;
}  
#pageFooter .wrapper ul
{
  width:75%;
}  
#pageFooter .wrapper ul li /*:nth-child(2)*/
{
  display:inline-block;
  width:48%;
    /*IE7*/
  *display: inline;
  zoom: 1;
}









@media only screen and (max-width: 37.5em) /* 600 / 16 */
{
  .headerImg {width:auto;}
  .atoz {margin:0 2%;}
  form.search { width:69%; margin-top: 0;}
  form.search .submit {padding: 0.2em 0.45em; right: 0.7em;}

  .links
  {
    display: block;
    text-align: center;
    margin:0;
    font-size:1.8em;
    float:none;
  }
  .social 
  {
    display:none;
  }

}

@media only screen and (max-width: 35.625em) /* 570 / 16 */
{
  body{font-size:0.8em;}
  
  .searchHomePage {font-size:0.9em;}
  
  li.secondLevel:nth-child(4n) 
  {
     clear:both;
  }
  li.secondLevel
  {
     width: 31.2%;
     margin: 1% 0.93%;
  }
}

@media only screen and (max-width: 30em) /* 480 / 16 */
{
  .searchHomePage {font-size:0.8em;}
}

@media only screen and (max-width: 25em) /* 400 / 16 */
{
  .copyright{display:block;width:100%;}
  .footerLinks{width:70%;text-align:center;}
}


@media only screen and (max-width: 20em) /* 320 / 16 */
{
  body{font-size:0.8em;}
  li.firstLevel {font-size:0.8em;}
}