/* winsome .css */
@import 'reset.css';

/* dark_grey: #171613 */

body { background-color: #000; color: #FFF; font-family: 'Trebuchet MS', Geneva, Arial, Helvetica, sans-serif; font-size: 87.8%; color: #FFF; margin: 0 auto; padding: 0; height: 100%; width: 100%; }
a { color: rgba( 170, 0, 0, 1); text-decoration: none; }
h1, h2, h3, h4, h5, h6 { font-family: 'Century Gothic', Arial, Helvetica, sans-serif; margin-bottom: .75em; text-transform: uppercase; }
h1, h2, h3 { font-weight: bold; line-height: 1.1em; padding: 0 0 .5em 0; }
h2 { border-bottom: 1px solid #999; font-size: 170%; }
h3 { border-bottom: 1px solid #555; font-size: 130%; }
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #FFF; }
p, ul, ol { margin-bottom: 1em; }
p { line-height: 1.25em; }

strong { font-weight: bold; }
em { font-style: italic; }

.button { background-color: rgba(210, 0, 0, 0.38); border-radius: 4px; color: #FFF; padding: .5em .75em; text-decoration: none; }
.button:hover { background-color: rgba(240, 0, 0, 0.39); }

#overlay { background: rgba(0,0,0,0.6); height: 100%; width: 100%; margin: auto; position: fixed; top: -9999em; right: -9999em; bottom: -9999em; left: -9999em; z-index: 9; }
#modal { margin: auto; display: table; padding: 20px; width: 900px; position: fixed; top: -9999em; right: -9999em; bottom: -9999em; left: -9999em; z-index: 10; }
#modal .content .close { height: 6px; position: absolute; top: 6px; right: 6px; }
#modal .content .button { background: #FFF; border-radius: 0; }
#modal .content .button a { display: inline-block; text-indent: -9999em; }
#modal .content .button a:after { content: 'x'; height: 100%; width: 100%; position: absolute; top: 0; left: 0; text-indent: 0; }
#modal .content { display: table-cell; margin: auto; text-align: center; vertical-align: middle; position: relative; }
#modal .content .frame { display: inline-block; position: relative; }
#modal .content img { border: 10px solid #FFF; }

#site_page { width: 950px; margin: 0 auto; color: #FFF; background: #2B2823 url(/design/img/bg_new_dummy.jpg) no-repeat center top; }

#site_header { position: relative; clear: both; width: 100%; height: 225px; margin: 0 auto 50px auto; color: #FFF; }
  #logo { float: left; margin: 20px 0 0 20px; width: 279px; height: 58px; }
  #logo a { display: block; height: 100%; width: 100%; text-indent: -9999em; }
  .topswap { position: absolute; z-index: 1; top: 0px; left: 417px; float: left; width: 150px; height: 265px; background: transparent url(/design/img/swap/1.jpg) no-repeat left top;}
  #banner { position: absolute; top: 60px; left: 570px; float: left; width: 355px; height: 200px; background: transparent url(/design/img/bg_banner.png) no-repeat left top; }
  .topnav { position: absolute; font-family: 'Century Gothic', Arial, Helvetica, sans-serif; bottom: 3px; left: 15px; clear: both; color: #CC0000; font-size: 18px; text-transform: uppercase; margin: 0; padding: 0; z-index: 2; }
  .topnav li { font-size: 14px; float: left; margin: 0 3px 0 0; padding: 0; list-style: none;}
  .topnav li a { color: #BF2201; text-decoration: none; padding: 5px; }
  .topnav li a:hover { background-color: #BF2201; color: #FFF; }

#site_content { color: #FFF; clear: left; width: 900px; min-height: 500px; margin: 40px auto 0 auto; padding: 0 0 20px 0; position: relative; overflow: hidden; }
.box { background: transparent url(/design/img/bg_box.png) repeat-y left 20px; background-size: 100%; padding: 1.5em; margin-bottom: 1em; position: relative; }
.box h3 { border-bottom-color: #222; }
/*.box:after {  content: ""; display: block; height: 100%; width: 100%; position: absolute; top: 0; left: 0; z-index: 0; }*/
.column { }
.column.left { float: left; position: relative; margin: 10px 0 0 20px; padding: 0; width: 37em; }
.column.right {float: right; margin: 10px 20px 0 0; padding: 0 0 0 0; width: 320px; }
.column.right .box { clear: both; overflow: hidden; position: relative;}
.columnn.right ul li { list-style: none; margin: 0 0 1em -15px; padding-left: 18px; background: transparent url(/design/img/bullet_star.gif) left .3em no-repeat; font-size: 1.14em; }
.column.right .node { padding: 0; }
.column.right .header { display: none; clear: both; width: 340px; height: 60px; background: transparent url(/design/img/bg_header_torn.png) no-repeat left top; margin: 0 0 -30px 0px; padding: 0;}
.column.right .content { box-sizing: border-box; clear: both; display: block; width: 100%; margin: 0 0 0 0; padding: 0 10px 0 10px; /*background: transparent url(/design/img/bg_rightcol_tile.png) repeat-y left 20px;*/}
.column.right h3 { }
#studentTestimonials { position: relative; float: left; }
#studentTestimonials cite { position: relative; }
#studentTestimonials #nextstudent {  position: absolute; right: 10px; margin: -20px 0 0 0; }
#studentTestimonials .quote { float: left; margin: 20px 0 0 0; padding: 0; width: 50px; height: 18px; font-size: 6.6em; font-family: "Trebuchet MS", Georgia, "Times New Roman", Times, serif; color: #AC5031; }
#studentTestimonials .quote.right { float: right; margin-top: 10px;}
.column.right .footer { display: none; clear: both; width: 340px; height: 16px; background: transparent url(/design/img/bg_footer_torn.png) no-repeat left top; margin: 0; padding: 0; }

#site_footer { color: #898989; clear: both; float: none; width: 100%; margin: 0; padding: 150px 0 20px 0; background: #171613 url(/design/img/bg_footer.jpg) no-repeat -1px 0; margin: 0; text-align: center; }

.home #site_content { }
.home #site_content #homemovie { display: none; position: absolute; z-index: 1; top: 5px; left: 10px; width: 220px; height: 300px; padding: 13px 0 0 13px; background: transparent url(/design/img/bg_homemovie.gif) left top no-repeat; }
.home .column.left { padding-top: 440px; }
.home #site_content:before { background: url('/design/img/bg_home.jpg') no-repeat 0 0; background-size: 527px 426px; content: ''; display: block; height: 424px; width: 100%; position: absolute; top: 0; left: 0; }

.news { }
.news ul {}
.news ul li { border-bottom: 1px solid #222; padding: 1em 0; }

.classes {}
.classes #classesTable { border: 1px solid #555; margin: 10px auto 1em auto; padding: 2px; border-collapse: separate; }
.classes #classesTable th,
.classes #classesTable td { color: #DDD; font: 12px/1.1em Arial; text-align: left; padding: 10px 13px; border: 2px solid #222; border-left: none; border-bottom: none; background-color: rgba(190, 170, 130, 0.15); background-size: cover; }
.classes #classesTable tr:first-child th { border-top: none; }
.classes #classesTable tr th:last-child,
.classes #classesTable tr td:last-child { border-right: none; }
.classes #classesTable th { font-weight: bold; }

.teams {}
.teams .box{ overflow: hidden; }
.teams .box img { float: left; margin-right: 20px; }

.bio {}
.bio .box { overflow: hidden; }
.bio .box h3 span { font-size: .8em; display: block; }
.bio .box img { float: left; margin: 0 20px 20px 0; }
.bio .box img:nth-child(3) { float: right; margin: 0 0 20px 20px; }
.bio .box:nth-child(3) img { margin-bottom: 80px; }

.articles {}
.articles .left .box { padding: 1.5em; margin-bottom: 1em; position: relative; }

.article {}
.article #site_content { width: 700px; }
.article .img_left { float: left; margin: 0 20px 20px 0; width: 340px; }
.article .img_left img { margin-bottom: 1em; }
.article .img_left p { font-size: .8em; }
/*.article .left .box { padding: 1.5em; margin-bottom: 1em; position: relative; }*/
/*.article .left .box:after { background: transparent url(/design/img/bg_rightcol_tile.png) repeat-y left 20px; background-size: 100%; content: ""; display: block; height: 100%; width: 100%; opacity: 0.1; position: absolute; top: 0; left: 0; z-index: 0; }*/
.article .terms { display: none; }

.photos ()
.photos #photo_gallery {}
.photos #photo_gallery { }
.photos #photo_gallery .item { box-sizing: border-box; cursor: pointer; height: auto; width: 33.33333%; padding: 7px; }
.photos #photo_gallery .item img { box-sizing: border-box; border: 10px solid #FFF; height: auto; width: 100%; }