﻿body {
 margin: 0 auto;
 padding: 0;
 font-size: 2em; 
 font-family: 'Archivo Narrow', sans-serif, Arial;
 background-color: #6a6b6f;
 background-image: url(/Images/bgfade.jpg);
 background-repeat: repeat-x;
}
a:link {
 color: #0000ff;
}
a:active {
 color: #0000ff;
}
a:visited {
 color: #0000ff;
}
a:hover {
 color: #0000ff;
}
.wrapper {
 width: 100%;
 max-width: 1200px;
 margin: 0 auto;
 padding: 0;
 background-color: #fff;
 border-bottom-right-radius: 1em;
 border-bottom-left-radius: 1em;
}
header {
 width: 100%;
 margin: 0 auto;
 padding: 0;
}
#logo {
 width: 45%;
 float: left;
 padding: 0;
 padding-left: .5em;
 margin: 0 auto;
}
#logo img {
 width: 100%;
 max-width: 280px;
}
header:after {
 content: '';
 clear: both;
 display: table;
}
#navbar {
 width: 100%;
 background-color: #55b947;
}
nav {
 width: 100%;
 margin: 0 auto;
 padding: 0em;
 padding-top: .75em;
 padding-bottom: .75em;
}
p {
 padding-left: .8em;
 padding-right: .8em;
 line-height: 1.35em;
}
ul li {
 line-height: 1.35em;
}
h1 {
 font-size: 2em;
 padding: 0em;
 padding-left: .35em;
 color: #55b947;
 margin-bottom: 0em;
}
h2 {
 font-size: 1.5em;
 padding: 0em;
 padding-left: .5em;
 color: #55b947;
}
#middle {
 width: 100%;
 padding: 0;
 background-image: url("/Images/shadow.jpg");
 background-repeat: repeat-x;
}
#middle:after {
 content: '';
 clear: both;
 display: table;
}
#content {
 width: 70%;
 float: left;
 padding-top: 1em;
 padding-bottom: 1.5em;
 background-repeat: no-repeat;
 background-position-x: center;
 overflow: hidden;
}
#sidebar {
 width: 29.8%;
 float: right;
 padding: 0;
 padding-top: 1em;
 margin: 0 auto;
 text-align: center;
}
#sidebar img {
 width: 90%;
 max-width: 400px;
 margin-bottom: 1em;
}
.text-bold {
 font-weight: bold;
}
.gray-info-bubble {
 border: solid;
 background-color: #f0f0f0;
 border-radius: .75em;
 border-color: #000;
 border-width: 1px;
 padding: .75em;
 padding-top: 0em;
 margin: 1em;
 margin-top: 0em;
 color: #000;
 line-height: 1.35em;
}
.clear-info-bubble {
 border: solid;
 background-color: #F5F5DC;
 border-radius: .75em;
 border-color: #000;
 border-width: 1px;
 padding: .75em;
 padding-top: 0em;
 margin: 1em;
 margin-top: 0em;
 color: #000;
}
.title {
 font-size: 2em; 
 font-weight: bold; 
 text-align: center;
 margin: 0 auto;
 padding: 0;
 padding-top: .25em;
 line-height: 1em;
}
.yellow-info-bubble {
 border: solid;
 background-color: #ffff66;
 border-radius: .5em;
 border-color: #000;
 border-width: 1px;
 padding: .75em;
 margin: 1em;
 margin-top: 0em;
 color: #000;
 line-height: 1.35em;
}
.white-info-bubble {
 background-color: #fff;
 color: #07744d;
 font-weight: bold;
 padding-left: .5em;
 padding-right: .5em;
 text-align: center;
 border-radius: .5em;
}
footer {
 font-size: .8em;
 text-align: center;
 color: #fff;
 padding: .5em;
}
.location-img {
 width: 65%;
 margin: 0 auto;
 padding: 0;
 text-align: center;
 float: right;
}
.location-img img {
 width: 90%;
 margin-top: 3px;
 margin-bottom: 3px;
 border-radius: 3px;
 -moz-box-shadow: 3px 3px 3px black;
 -webkit-box-shadow: 3px 3px 3px black;
 box-shadow: 3px 3px 3px black;
 border: solid;
 border-color: #000;
 border-width: 1px;
}
.media-container {
 width: 100%;
 padding-top: .8em;
 padding-bottom: .8em;
}
.media-container:after {
 content: '';
 clear: both;
 display: table;
}
.media-left {
 width: 48%;
 float: left;
 margin: 0 auto;
 text-align: center;
}
.media-left img {
 width: 94%;
 max-width: 280px;
 margin-top: 5px;
 margin-bottom: 5px;
 border-radius: 5px;
 -moz-box-shadow: 5px 5px 5px black;
 -webkit-box-shadow: 5px 5px 5px black;
 box-shadow: 5px 5px 5px black;
 border: solid;
 border-color: #000;
 border-width: 1px;
}
.media-right {
 width: 48%;
 float: right;
 margin: 0 auto;
 text-align: center;
}
.media-right img {
 width: 94%;
 max-width: 280px;
 margin-top: 5px;
 margin-bottom: 5px;
 border-radius: 5px;
 -moz-box-shadow: 5px 5px 5px black;
 -webkit-box-shadow: 5px 5px 5px black;
 box-shadow: 5px 5px 5px black;
 border: solid;
 border-color: #000;
 border-width: 1px;
}
.media-name {
 font-weight: bold;
}
.progressbar {
 padding: 0;
 padding-bottom: 1em;
 margin: 0;
 text-align: center;
 font-size: 2em;
 line-height: .5em;
}
.page-pic {
 width: 45%;
 max-width: 400px;
 float: right;
 padding: 0;
 margin: 0 auto;
 margin-right: 1em;
 text-align: center;
}
.page-pic img {
 width: 100%;
 max-width: 576px;
}
.page-pic-shadow {
 width: 45%;
 max-width: 400px;
 float: right;
 padding: 0;
 margin: 0 auto;
 margin-right: 1em;
 margin-left: 1em;
 text-align: center;
}
.page-pic-shadow img {
 width: 100%;
 max-width: 450px;
 margin-top: 5px;
 margin-bottom: 5px;
 border-radius: 5px;
 -moz-box-shadow: 5px 5px 5px black;
 -webkit-box-shadow: 5px 5px 5px black;
 box-shadow: 5px 5px 5px black;
 border: solid;
 border-color: #000;
 border-width: 1px;
}
#test-act {
 text-align: left;
 font-size: .8em;
 font-style: italic;
}
#test-gre {
 text-align: left;
 font-size: .8em;
 font-style: italic;
}
#test-sat {
 text-align: left;
 font-size: .8em;
 font-style: italic;
}
#test-teasv {
 text-align: left;
 font-size: .8em;
 font-style: italic;
}
#greenbar {
 width: 100%;
 margin: 0;
 padding: 0;
 background-color: #55b947;
 height: 5px;
 font-size: 0px;
}
.boldgreen {
 font-size: 1.5em;
 font-weight: bold;
 color: #55b947;
}
#phone {
 text-align: right;
 font-size: 3em;
 font-weight: bold;
 padding-right: .5em;
 padding-top: .25em;
 float: right;
}

/* HIDE SLIDESHOW ON ALL PAGES - SHOW WITH PAGE STYLE */
#slider1_container {
 display: none;
 visibility: hidden;
}
#greenbar {
 display: none;
 visibility: hidden;
}


/* HIDE ALL SIDEBARS WITH THIS STYLESHEET - SHOW WITH PAGE STYLES */
#courses-offered {
 display: block;
 visibility: visible;
}

/* BEGIN RESPONSIVE */

@media (min-width: 1200px) {
 body {
  font-size: 1.25em;
 }
}
@media (min-width: 980px) and (max-width: 1199px) {
 body {
  font-size: 1.15em;
 }
 #phone {
  padding-top: .35em;
 }
}
@media (min-width: 768px) and (max-width: 979px) {
 body {
  font-size: 1em;
 }
 #phone {
  padding-top: .5em;
 }
}
@media (min-width: 481px) and (max-width: 767px) {
 body {
  font-size: .9em;
 }
 #phone {
  padding-top: .6em;
 }
 nav {
  padding: 0;
 }
 #content {
  width: 100%;
  float: none;
  border-bottom-right-radius: 0px;
 }
 #sidebar {
  width: 100%;
  float: none;
 }
 .green-info-bubble {
  font-size: 1.5em;
 }
}
@media (min-width: 0px) and (max-width: 480px) {
 body {
  font-size: .8em;
 }
 header {
  text-align: center;
 }
 #logo {
  float: none;
  width: 100%;
  padding-left: 0;
 }
 #phone {
  width: 100%;
  float: none;
  text-align: center;
 }
 nav {
  padding: 0;
 }
 #content {
  width: 100%;
  float: none;
  border-bottom-right-radius: 0px;
 }
 #sidebar {
  width: 100%;
  float: none;
 }
 .green-info-bubble {
  font-size: 1.4em;
 }
 #contact-pic {
 display: none;
 visibility: hidden;
 }
}


