html { height: 100%; }

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
* html .clearfix { zoom: 1; }
*:first-child+html .clearfix { zoom: 1; }

body { height: 100%; background-color: #eaeaea; background-image: url('images/body-bg.png'); background-repeat: repeat-x; background-position: center top; }
#page { position: relative; min-height: 100%; _height: 100%; margin: 0 auto; width: 1030px; }
.pagebox { position: relative; float: left; clear: both; }

.menu a { color: #555; text-decoration: none; font-weight: bold; }
.menu a:hover { color: #b02021; }

#header { height: 165px; width: 1030px; background-image: url('images/page-bg.png'); background-repeat: repeat-y; }
#header #logo { margin-left: 45px; }
#header #nav { /*overflow: hidden;*/ position: absolute; left: 0; bottom: 0; display: block; width: 1018px; height: 60px; margin: 0 6px; border-bottom: 1px solid #999; background-image: url('images/menu-bg.png'); background-repeat: repeat-x; }
#header #nav li { float: left; width: 145px; height: 60px; text-align: center; background-image: url('images/menu-bg.png'); background-repeat: repeat-x; }
#header #nav .selected { background-position: 0 -60px; }
#header #nav a { position: relative; margin: 11px 0 0 0; padding: 20px 0 0 0; display: block; height: 29px; color: #666769; font-size: 15px; font-weight: bold; font-family: Trebuchet MS, Trebuchet, Arial, sans-serif; text-decoration: none; }
#header #nav a:hover { color: #b02021; }
#header #nav .selected a { color: #333; }
#header #nav .divider a { border-right: 1px solid #e2e2e2; }

.icon { display: block; width: 50px; height: 50px; left: 50px; top: -30px; position: absolute; overflow: hidden; background: url('images/icons.png'); }
#icon-home { background-position: left top; }
#icon-courses { background-position: left -50px; }
#icon-schools { background-position: left -100px; }
#icon-accommodation { background-position: left -150px; }
#icon-student-services { background-position: left -200px; }
#icon-photos { background-position: left -250px; }
#icon-videos { background-position: left -300px; }
#icon-social-programme { background-position: left -350px; }

#topnav { float: right; margin-right: 35px; display: inline; }
#topnav li { float: left; height: 35px; text-align: center; }
#topnav .name { margin: 5px 0 0 0; }
#topnav .divider { border-right: 1px solid #e5e5e5; margin: 0 10px 0 0; padding: 0 10px 0 0; }
#extras { display: inline; float: right; clear: right; margin: 15px 35px 0 0; }
#extras .phone, #extras .discount { float: left; padding: 10px 10px 0; }
#enrol { display: inline-block; width: 104px; height: 24px; color: #fff; margin: 0 0 0 10px; padding: 10px 0 0 30px; text-decoration: none; font-weight: bold; background-image: url('images/enrol-button.png'); }

.sicon { display: inline-block; width: 20px; height: 20px; overflow: hidden; background: url('images/icons.png'); background-position: -70px 0; }
#sicon-visa { background-position: -70px top; }
#sicon-student-zone { background-position: -70px -30px; }
#sicon-about-us { background-position: -70px -60px; }
#sicon-media { background-position: -70px -90px; }
#sicon-faqs { background-position: -70px -120px; }
#sicon-agents { background-position: -70px -150px; }
#sicon-contact-us { background-position: -70px -180px; }

#navbar { overflow: hidden; height: 41px; width: 1030px; background-image: url('images/page-bg.png'); background-repeat: repeat-y; }
#navbar .bar { overflow: hidden; border-bottom: 1px solid #999; height: 40px; margin: 0 6px; width: 1018px; }

#search { z-index: 20; position: absolute; right: 12px; top: 5px; width: 200px; background-image: url('images/search-button.png'); background-repeat: no-repeat; background-position: 0 -29px; }
#search #criteria { float: left; position: relative; top: 0; left: 0; height: 21px; width: 161px; border: 0; outline: none; background-color: #fff; font-family: Arial, Helvetica, serif; font-size: 12px; color: #666; padding: 8px 0 0 0; margin: 0 0 0 8px; background-image: url('images/search-button.png'); background-repeat: repeat-x; background-position: 0 -58px; }
#search .submit { background-image: url('images/search-button.png'); background-repeat: repeat-x; background-position: 0 0; cursor: pointer; outline: none; border: 0; float: right; width: 31px; height: 29px; }

#breadcrumb { float: left; width: 1018px; color: #8e9092; font-size: 14px; font-weight: bold; font-family: Trebuchet MS, Trebuchet, Arial, sans-serif; }
#breadcrumb li { display: block; float: left; height: 19px; padding: 11px 25px 10px 5px; background-repeat: no-repeat; background-image: url('images/breadcrumb.png'); background-position: right -40px; }
#breadcrumb li a { color: #fff; text-decoration: none; }
#breadcrumb .inside { float: left; padding: 11px 5px 10px 10px; height: 19px; background-image: url('images/bars.png'); background-position: 0 -280px; background-repeat: repeat-x; }
#breadcrumb .start { padding: 0 20px 0 0; height: 40px; background-image: url('images/breadcrumb.png'); background-repeat: no-repeat; background-position: right top; }

#content { width: 1018px; padding: 0 6px; background-image: url('images/content-bg.png'); background-repeat: repeat-y; }
#photos { width: 1018px; padding: 0 6px; background-image: url('images/dark-bg.png'); background-repeat: repeat-y; }

#sidenav ul { list-style:none; margin: 0; padding: 0; } /* reset */
#sidenav li { list-style:none; margin: 0; padding: 0; } /* reset */
#sidenav { display: block; float: left; width: 235px; padding: 20px 25px 20px 20px; }
#sidenav li { display: block; }
#sidenav a { color: #555; text-decoration: none; font-family: Trebuchet MS, Trebuchet, Arial, sans-serif; }
#sidenav a:hover { color: #b02021; }
#sidenav #currentlink a:hover { color: #fff; }
#sidenav .divider { border-bottom: 1px solid #dcdcdc; padding: 0 0 3px 0; margin: 0 0 3px 0; }
#sidenav .sub { border-top: 1px solid #dcdcdc; padding: 3px 0 0 0; margin: 3px 0 0 0; }
#sidenav .sub li { padding: 0 0 0 0px; margin: 0 0 0 20px; }
#sidenav .sub .divider { padding: 0 0 2px 10px; margin: 0 0 2px 10px; }
#sidenav .selected { font-weight: bold; }

#sidenav #current { margin-bottom: 2px; position: relative; background-repeat: repeat-x; }
#sidenav #currentlink { color: #fff; font-weight: bold; line-height: 35px; padding: 0 0 0 10px; display: block; margin: 0 -17px 0 0; background-image: url('images/sidenav-arrow.png'); background-repeat: no-repeat; height: 35px; }
#sidenav #current ul li { }
#sidenav #current img { position: absolute; top: 0; left: -5px; }

#sidenav h1, #sidenav h2, #sidenav h3, #sidenav h4, #sidenav h5, #sidenav h6 { color: #555; font-weight: bold; border-bottom: 1px dotted #b5b5b5; margin: 0 20px 5px 0; padding: 0 0 4px 0; }
#sidenav p { border-bottom: 1px solid #dcdcdc; margin: 0 20px 10px 0; padding: 0 0 10px 0; }



#editable { padding: 20px 0 0 0; }
#editable h1, #editable h2, #editable h3, #editable h4, #editable h5, #editable h6 { margin-left: 255px; padding: 0 25px 20px 25px; }
#editable p  { margin-left: 255px; padding: 0 25px 20px 25px; }
#editable ul  { margin-left: 270px; padding: 0 25px 20px 25px; list-style-position: outside; list-style-type: disc; }
#editable ul li { padding: 0 5px 5px 0; }
#editable img { margin-left: 280px; }
/* reset everything when it's inside a table */
#editable table { margin: 0 0 20px 280px; /*display: block;*/ }
#editable table p { margin: 0; padding: 0 0 20px 0; }
#editable table img { margin: 0 0 20px 0; }
#editable table h1, #editable table h2, #editable table h3, #editable table h4, #editable table h5, #editable table h5
{ margin: 0; padding: 0 0 10px 0; }
#editable table ul { margin: 0 0 0 15px; padding: 0 0 20px 0; }
/* reset again... */
#editable table table { margin: 0; }

/* main form styles */

#editable form { margin: 0 0 20px 270px; width: 730px; }
#editable fieldset { border: 1px solid #ddd; background-color: #f5f5f5; padding: 10px; margin: 0 0 10px 0; }
#editable label { font-size: 12px; font-weight: bold; color: #555; line-height: 18px; }

#editable input[type="text"], #editable select { width: 300px; margin: 0 0 10px 0; border: 1px solid #bbb; outline: none; padding: 5px; font-size: 12px; color: #555; background-color: #fff; }
#editable textarea { width: 400px; margin: 0 0 10px 0; border: 1px solid #bbb; outline: none; padding: 5px; font-size: 12px; color: #555; background-color: #fff; }

* #editable input[type="submit"] { color: #fff;text-align: left; background-color: #b11f22; background-image: url('images/enrol-button.png'); border: none; width: 135px; height: 35px; margin: 0 0 0 0; padding: 0 0 0 10px; font-weight: bold; }

#editable form p { margin: 0; padding: 5px; }
#editable form h4 { font-weight: bold; margin: 0 0 5px 0; padding: 5px; }
#editable form .options { margin: 0 0 20px 0; padding: 0; list-style: none; border: 1px solid #ddd; border-bottom: 0; }
#editable form .options p { border-bottom: 1px solid #ddd; }
#editable form .options .chosen { color: #fff; background-position: 0 -5px; }
#editable form .options li { padding: 0 0 0 0; margin: 0; }
#editable form .options label { display: block; padding: 3px; border: 0; border-bottom: 1px solid #ddd; background-color: #fff; margin: 0; background-image: url('images/bars.png'); background-position: 0 -285px; }
#editable form input[type="radio"] { margin: 0 5px 0 0; }
#editable form table { margin: 0; }

#editable .tab-menu { display: none; margin: 0; padding: 0; list-style: none; -moz-border-radius: 0; border: 0; background: none; }
#editable form .continue { display: none; width: 114px; height: 24px; color: #fff; margin: 0; padding: 10px 0 0 20px; text-decoration: none; font-weight: bold; background-image: url('images/submit-button.png'); }

#editable .ui-tabs { border: 0; }

/* Enrol Form */

#editable #enrol-form { margin: -20px 0 0; width: 910px; border: 1px solid #ddd; display: block; background-color: #f5f5f5; padding: 30px 53px 65px; }
#enrol-form fieldset { position: relative; margin: 30px 10px -30px; padding: 0; z-index: 50; background-color: #f5f5f5; border: none; overflow: visible; -webkit-margin-collapse: separate }
#enrol-form fieldset.loading { background: url('/content/plugins/CourseCalculator/img/ajax-loader-sg.gif') no-repeat 722px bottom; }
#enrol-form fieldset legend { position: absolute; top: -21px; left: 5px; border: 1px solid #ddd; width: 60px; padding: 2px 10px; font-weight: bold; text-align: center; background: #fff; }
#enrol-form fieldset div.fieldset-wrapper { padding: 0; margin: -1px -1px 32px -1px; border: 1px solid #ddd; background-color: #fff; }

#enrol-form fieldset .submit-back, #enrol-form fieldset .submit-next { position: absolute; bottom: -9px; color: #fff; text-align: left; background-color: #f5f5f5; background-image: url('images/enrol-button.png'); border: none; width: 135px; height: 35px; margin: 0 0 0 0; padding: 0 0 0 10px; font-weight: bold; }
#enrol-form fieldset .submit-next { right: 10px; }
#enrol-form fieldset .submit-back { left: 10px; background-image: url('images/enrol-button-back.png'); padding: 0 13px 0 0; text-align: right; }

#enrol-form fieldset#enrol-2 legend { left: 90px; }
#enrol-form fieldset#enrol-3 legend { left: 175px; }
#enrol-form fieldset#enrol-4 legend { left: 260px; }
#enrol-form fieldset#enrol-5 legend { left: 345px; }
#enrol-form fieldset#enrol-6 legend { left: 430px; }
#enrol-form fieldset#enrol-7 legend { left: 515px; }
#enrol-form fieldset#enrol-8 legend { left: 600px; }
#enrol-form fieldset#enrol-9 legend { left: 685px; }
#enrol-form fieldset#enrol-10 legend { left: 770px; }
#enrol-form fieldset:last-child legend { border-bottom-color: #fff; z-index: 20; }

#enrol-form h1, #enrol-form h2, #enrol-form h3, #enrol-form h4 { margin: 10px -60px; padding: 0; }
#enrol-form h1 { margin: 0px 15px 5px; }

#enrol-form .fieldset-wrapper .fieldset-content { margin: 5px 200px; }
#enrol-form .fieldset-wrapper .fieldset-content .fieldset-content-wide { margin: 0 -200px 10px; overflow: hidden; }
#enrol-form .fieldset-wrapper .fieldset-content .fieldset-content-wide h3 { margin-left: 140px; margin-right: 140px; }
#enrol-form .fieldset-wrapper .fieldset-content .fieldset-content-wide .fieldset-content-wide-content { margin: 0 0 10px; }
#enrol-form .fieldset-wrapper .fieldset-content h3.fieldset-collapse { background: #fff url('/system/admin/images/icons/arrow_up.png') no-repeat 100% 50%; cursor: pointer; }
#enrol-form .fieldset-wrapper .fieldset-content h3.fieldset-collapse.collapsed { background-image: url('/system/admin/images/icons/arrow_down.png'); border-bottom: 1px dotted #B11F22; }

#enrol-form ul { margin: 0; padding: 0; }
#enrol-form label { display: block; float: left; width: 120px; margin: 0 10px 0 0; }
#enrol-form .errors { color: #e23a31; }
#enrol-form .instruction { font-weight: bold; color: #666; margin: -10px 0 10px 120px; }
#enrol-form select { width: 307px; padding-left: 1px; }
#enrol-form input.text { width: 295px; }
#enrol-form textarea { width: 270px; padding-right: 30px; }
#enrol-form p.error { margin: -10px 0 10px 130px; color: #b02021; font-style: italic; }

#enrol-form .slider-wrapper { position: relative; margin: 0 12px 14px 16px; padding: 5px 0 8px; text-align: left; }
#enrol-form .slider-wrapper p.error { margin: 20px 0 -20px 0; padding: 0; }
#enrol-form .slider-wrapper.invalid, #enrol-form .slider-wrapper.validating, #enrol-form .slider-wrapper.valid { background: url('/content/plugins/CourseCalculator/img/ajax-loader.gif') no-repeat 100% 8px; margin-right: 8px; padding-right: 28px; }
#enrol-form .slider-wrapper.invalid { background-image: url('/system/admin/images/icons/exclamation.png'); }
#enrol-form .slider-wrapper.valid { background-image: url('/system/admin/images/icons/accept.png'); }

#enrol-form .error input, #enrol-form .error textarea, #enrol-form .error select { border-color: #b02021; }
#enrol-form input.invalid, #enrol-form input.validating, #enrol-form input.valid, #enrol-form textarea.invalid, #enrol-form textarea.validating, #enrol-form textarea.valid, #enrol-form select.invalid, #enrol-form select.validating, #enrol-form select.valid { border-color: #ffee80; background: url('/content/plugins/CourseCalculator/img/ajax-loader.gif') no-repeat 283px 50%; }
#enrol-form input.invalid, #enrol-form input.validating, #enrol-form input.valid, #enrol-form textarea.invalid, #enrol-form textarea.validating, #enrol-form textarea.valid { width: 270px; padding-right: 30px; }
#enrol-form select.invalid, #enrol-form select.validating, #enrol-form select.valid { padding-right: 28px; }
#enrol-form input.invalid, #enrol-form textarea.invalid, #enrol-form select.invalid { border-color: #b02021; background-image: url('/system/admin/images/icons/exclamation.png'); }
#enrol-form input.valid, #enrol-form textarea.valid, #enrol-form select.valid { border-color: #99ff99; background-image: url('/system/admin/images/icons/accept.png'); }

#enrol-form dl { width: 620px; margin: 10px -65px; padding: 0; border-bottom: 1px solid #ddd; }
#enrol-form dl dt { clear: left; float: left; width: 200px; margin: 0; padding: 5px; border-top: 1px solid #ddd; font-weight: bold; }
#enrol-form dl dd { float: left; width: 400px; margin: 0; padding: 5px; border-top: 1px solid #ddd; }
#enrol-form dl dt, #enrol-form dl dd { font-weight: bold; }

#enrol-form .options { margin: 0 0 20px 0; }
#enrol-form .options label { width: 100%; float: none; }

#enrol-form .cost-matrix { border: 1px solid #ccc; border-collapse: separate; margin: 0 auto; }
#enrol-form .cost-matrix td, #enrol-form .cost-matrix th { border-top: 1px solid #ddd; padding: 5px; }
#enrol-form .cost-matrix thead th { font-weight: bold; text-align: center; background: #ddd; }
#enrol-form .cost-matrix tbody th { font-weight: bold; color: #B11F22; }
#enrol-form .cost-matrix tbody td { font-size: 75%; text-align: center; width: 45px; padding: 6px 0 0; }
#enrol-form .cost-matrix tbody td.weeks { width: 0px; }
#enrol-form .cost-matrix tbody td.weeks select { display: none; }
#enrol-form .cost-matrix tbody td input { margin: 0 auto; display: block; }
#enrol-form .cost-matrix tbody td label { margin: 0 auto; float: none; display: block; width: auto; font-weight: normal; font-size: 100%; }
#enrol-form .cost-matrix tr.error td.error { text-align: left; width: auto; }
#enrol-form .cost-matrix tr.error p.error { margin: 0; }

#enrol-form #enrol-form-summary { position: absolute; bottom: 1px; left: 50%; margin: 0 0 0 -235px; width: 470px; z-index: 51; }
#enrol-form #enrol-form-summary dl { width: 100%; border: none; margin: 0; }
#enrol-form #enrol-form-summary dl dt, #enrol-form #enrol-form-summary dl dd { display: block; float: left; clear: none; padding: 0 2% 0 0; width: 26%; border: none; text-align: right; }
#enrol-form #enrol-form-summary dl dt:after { content: ':'; }
#enrol-form #enrol-form-summary dl dd { text-align: left; padding: 0 0 0 2%; width: 20%; }
#enrol-form #enrol-form-summary dl dd#cost-total:before { content: '£'; }


#base { height: 145px !important; overflow: hidden; margin: 0 !important; }

#home { width: 1018px; padding: 0 6px; background-image: url('images/page-bg.png'); background-repeat: repeat-y; }
#welcome img { position: absolute; left: -42px; }
.areas { background-color: #fff; display: inline; width: 1018px; /*background-image: url('images/base-bg.png'); background-repeat: repeat-y; background-position: center;*/ }

/* colours */

.blue   #current {  background-image: url('images/sidenav-current-blue.png'); /*background-position: left 0px;*/ }
.orange #current {  background-image: url('images/sidenav-current-orange.png'); /*background-position: left -35px;*/ }
.green  #current {  background-image: url('images/sidenav-current-green.png'); /*background-position: left -70px;*/ }
.purple #current {  background-image: url('images/sidenav-current-purple.png'); /*background-position: left -105px;*/ }
.red    #current {  background-image: url('images/sidenav-current-red.png'); /*background-position: left -140px;*/ }
.yellow #current {  background-image: url('images/sidenav-current-yellow.png'); /*background-position: left -175px;*/ }
.grey   #current {  background-image: url('images/sidenav-current-grey.png'); /*background-position: left -210px;*/ }
.white  #current {  background-image: url('images/sidenav-current-white.png'); /*background-position: left -145px;*/ }

.white #breadcrumb li a { color: #666769; }

.blue   #currentlink { background-position: right 1px; }
.orange #currentlink { background-position: right -32px; }
.green  #currentlink { background-position: right -65px; }
.purple #currentlink { background-position: right -98px; }
.red    #currentlink { background-position: right -131px; }
.yellow #currentlink { background-position: right -164px; }
.grey   #currentlink { background-position: right -197px; }
.white  #currentlink { background-position: right -230px; }

#photos #sidenav #currentlink { background-position: right -264px; }

.blue    .bar { background-position: 0 0; }
.orange  .bar { background-position: 0 -40px; }
.green   .bar { background-position: 0 -80px; }
.purple  .bar { background-position: 0 -120px; }
.red     .bar { background-position: 0 -160px; }
.yellow  .bar { background-position: 0 -200px; }
.grey    .bar { background-position: 0 -240px; }
.white   .bar { background-position: 0 -280px; } 

#footer { border-top: 1px solid #ddd; padding: 20px 26px 20px 26px; width: 978px; background-image: url('images/page-bg.png'); background-repeat: repeat-y; }
#footer .menu { overflow: hidden; }
#footer .menu li { display: inline; }
#footer .menu .divider { border-right: 1px solid #555; margin: 0 10px 0 0; padding: 0 10px 0 0; }
#footer .menu a { font-size: 11px; text-decoration: none; }

/* jquery lightbox styles */

#jquery-overlay { position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; }
#jquery-lightbox { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0; }
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box { position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#lightbox-container-image { padding: 10px; }
#lightbox-loading { position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#lightbox-nav { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext { width: 49%; height: 100%; zoom: 1; display: block; }
#lightbox-nav-btnPrev { left: 0; float: left; }
#lightbox-nav-btnNext { right: 0; float: right; }
#lightbox-container-image-data-box { font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; padding: 0 10px 0; }
#lightbox-container-image-data { padding: 0 10px; color: #666; }
#lightbox-container-image-data #lightbox-image-details { width: 70%; float: left; text-align: left; }
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber { display: block; clear: left; padding-bottom: 1.0em; }
#lightbox-secNav-btnClose { width: 66px; float: right; padding-bottom: 0.7em; }

.social-buttons {float:right;width:300px;}
.footer-left {float:left;width:630px;}
