/* Global style.
 *****************************************************************************/

body {
  font-family:      sans-serif;
  font-size:        12px;
  background-color: #f2f2f2;
}

a, a:hover, a:focus {
  text-decoration:  none;
}


/* Text boxes.
 *****************************************************************************/

.text-box {
  color:            #6b6b6b;
  background-color: white;
  border:           1px solid #dadada;
  border-radius:    4px;
  margin:           40px 0px;
  line-height:      1.7;
  text-align:       left;
  word-wrap:        break-word;
  overflow:         auto;
}

.text-box a {
  color:            #4e81a9;
}

.text-box a:hover,
.text-box a:focus {
  color:            #b8166d;
}

.text-box code {
  font-family:      monospace;
  font-size:        inherit;
  color:            inherit;
  background-color: inherit;
  border-radius:    initial;
  padding:          initial;
}


/* Main area. ______________________________________________________________ */

#main {
  padding:          45px 50px;
}

@media (max-width: 767px) {
  #main {
    padding:        20px 25px;
  }
}

#main h1 {
  color:            white;
  background-color: #4e81a9;
  font-size:        230%;
  font-weight:      normal;
  line-height:      1.1;
  text-align:       center;
  text-transform:   uppercase;
  padding:          8px;
  margin:           0px 0px 15px;
  clear:            both;
}

#main h2 {
  color:            #4e6189;
  font-size:        125%;
  font-weight:      bolder;
  line-height:      1.1;
  text-transform:   uppercase;
  border-bottom:    1px solid #4e6189;
  margin:           2em 0px 0.5em;
  clear:            both;
}


/* Sidebar. _________________________________________________________________ */

#sidebar {
  padding:          30px;
}

#sidebar h2 {
  color:            #4e81a9;
  font-size:        200%;
  font-weight:      normal;
  line-height:      1.1;
  text-align:       center;
  margin:           0px;
}

@media (max-width: 991px) {
  #sidebar {
    margin-top:     0px;
  }
}


/* Banner header.
 *****************************************************************************/

#banner {
  color:            white;
  background-color: black;
}

#banner .navbar {
  color:            initial;
  background-color: initial;
  border:           0px;
  border-radius:    0px;
  margin:           0px;
}

#banner .navbar-toggle {
  border:           0px;
  background-color: #4e81a9 !important;
}

#banner .navbar-toggle .icon-bar {
  background-color: white !important;
}

#banner .navbar-brand {
  color:            white;
  font-size:        20px;
  margin:           13px 0px;
}

/* Navigation menu. ________________________________________________________ */

#banner .navbar-nav > li > a {
  text-transform:   uppercase;
  color:            white;
  text-align:       right;
  line-height:      40px;
  padding:          18px 15px;
}

#banner .navbar-nav > li > a.active,
#banner .navbar-nav > li > a:hover,
#banner .navbar-nav > li > a:focus {
  color:            #4e81a9;
}

#banner .navbar-nav > li.dropdown > a::after {
  border-top:       4px solid;
  border-left:      4px solid transparent;
  border-right:     4px solid transparent;
  content:          "";
  height:           0px;
  width:            0px;
  display:          inline-block;
  margin-left:      4px;
  vertical-align:   middle;
}

#banner .navbar-nav .dropdown-menu {
  border:           none;
  border-radius:    0px;
  padding:          0px;
  margin:           0px;
  background-color: #666666;
}

#banner .navbar-nav > li.dropdown:hover > .dropdown-menu {
  display:          block;
}

#banner .navbar-nav .dropdown-menu > li > a {
  color:            white;
  font-size:        13px;
  line-height:      40px;
  display:          block;
  padding:          0px 15px;
}

#banner .navbar-nav .dropdown-menu > li > a:hover,
#banner .navbar-nav .dropdown-menu > li > a:focus {
  color:            white;
  background-color: #4e81a9;
}

@media (max-width: 767px) {
  #banner .navbar-brand {
    margin:         0px;
  }

  #banner .navbar-nav > li > a {
    line-height:    20px;
    padding:        10px 15px;
  }

  #banner .navbar-nav .dropdown-menu {
    box-shadow:     none;
    float:          none;
    position:       static;
    width:          auto;
  }

  #banner .navbar-nav .dropdown-menu > li > a {
    padding:        0px 25px;
  }
}


/* Logos footer.
 *****************************************************************************/

#logos {
  color:            black;
  background-color: white;
  padding:          20px 0px 20px;
}

#logos ul {
  list-style-type:  none;
  padding:          0px;
  margin:           0px;
  text-align:       center;
  font-size:        0;
}

#logos li {
  display:          inline-block;
  position:         relative;
  width:            16%;
  padding-bottom:   8%;
  margin:           0px 2%;
}

#logos li img {
  max-height:       100%;
  max-width:        100%;
  position:         absolute;
  top:              50%;
  left:             50%;
  -ms-transform:    translate(-50%, -50%);
  -webkit-transform:translate(-50%, -50%);
  transform:        translate(-50%, -50%);
}


/* Colophon footer.
 *****************************************************************************/

#colophon {
  color:            #909090;
  background-color: #1f1f1f;
  border-top:       1px solid #3a3a3a;
  padding:          10px 0px;
}

#colophon a {
  color:            #dadada;
}

#colophon a:hover,
#colophon a:focus {
  color:            white;
}

#legal,
#copyright {
  margin:           0px;
  padding:          10px 15px;
}

#legal {
  text-transform:   uppercase;
}

#copyright {
  text-align:       right;
}