/* Start reset */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    /*margin: 0;*/
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}
body {
    line-height: 1;
}
ol, ul {
    list-style: none;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}

html {
    box-sizing: border-box;
}

*, *:before, *:after {
    box-sizing: inherit;
}

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

/* End reset */

body {
    background: #0076BE;
    font-family:"VAGRoundedLight", Arial, sans-serif;
}

h1 {
    font-family: "VAGRoundedBold";
    color: #484EA8;
    text-transform: uppercase;
    font-size: 30px;
    margin-bottom: 10px;
}

form.form {

    margin-top: 20px;

}

#return-bar {

    width: 100%;
    background-color: #333;
    padding: 10px;
    margin-bottom: 0;
    text-align: center;
    font-size: 20px;

}

#return-bar a {

    color: #FFF;
    width: 100%;

}

.container {
    width: 960px;
    margin: 0 auto;
}

.circle {
    width: 60px;
    height: 60px;
    border-radius: 30px;
    display: inline-block;
}

.icon {
    overflow: hidden;
    text-indent: -200px;
    display: block;
    width: 100%;
    height: 100%;
}

.clock-time {
    border: 2px solid #F0832F;
    height: 60px;
    border-radius: 30px;
    position: relative;
    padding-right: 10px;

}

.clock-time .clock {
    display: inline-block;
    width: 60px;
    height: 60px;
    border: 4px solid #F0832F;
    border-radius: 30px;
    position: absolute;
    top: -2px;
    left: -2px;
    background: url('/images/student/nocn/clock-hands.png') 25px 5px no-repeat;
}

.clock-time .time {
    color: #F0832F;
    height: 60px;
    line-height: 60px;
    margin: 0 0 0 70px;
}

.large-icons {
    text-align: center;
    /* float: left; */
    /* margin-left: 200px; */
}

.box {
    border-radius: 15px;
    border: 12px solid;
    display: inline-block;
}

.purple-border {
    border-color: #484EA8;
}

.large-icons .box {
    width: 560px;
    height: 420px;
}

.large-icons .box + .box {
    margin-left: 20px;
}

.large-icons .icon {
    text-indent: 0;
    text-align: center;
    position: relative;
    font-size: 51px;
    color: #FFFFFF;
}

.large-icons .icon span {
    position: absolute;
    display: block;
    bottom: 15px;
    width: 100%;
    text-transform: uppercase;
}

.medium-icons {
    margin-left: 20px;
    text-align: center;
    float: left;
}

.medium-icons .box {
    width: 175px;
    height: 175px;
    /*float: left;*/
}

.medium-icons .box {
    display: block;
}

.medium-icons .box + .box {
    margin-top: 10px;
}

.medium-icons .icon {
    text-indent: 0;
    position: relative;
    text-align: center;
    color: #FFFFFF;
    font-size: 25px;
}

.medium-icons .icon span {
    position: absolute;
    display: block;
    bottom: 7px;
    width: 100%;
}

.medium-icons .icon span.small-text {
    font-size: 15px;
    line-height: 18px;
    bottom: 5px;
}

.pull-right {
    float: right;
}

.header {
    border-bottom: 10px solid #484EA8;
}

.header .container {
    height: 100%;
    padding: 20px 0 0 20px;
}

.header li {
    float: left;
}

.header li:last-child {
    float: right;
}

.header li + li {
    margin-left: 25px;
}

.content {
    margin-top: 80px;
    margin-bottom: 80px;
    background: #FFFFFF;
    border: 12px solid #484EA8;
    border-radius: 15px;
    padding: 15px;
}

.content p {

    margin-bottom: 5px;

}

.page-student-home .content {
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
}

#howitworkstoptips {
    display: none;
}

.footer {
    border-top: 3px solid #A6A8AB;
}

.footer .logos li {
    float: left;
    margin-top: 13px;
}

.bar {
    height: 100px;
}

.white {
    background: #FFFFFF;
    color: #FFFFFF;
}

.orange {
    background: #F0832F;
    color: #F0832F;
}

.grey {
    background: #cccccc;
    color: #cccccc;
}

/* alerts */

.alert {
    width:899px;
    margin:6px auto 0 auto;
    padding:8px 35px 8px 14px;
    text-shadow:0 1px 0 rgba(255, 255, 255, 0.5);
    background-color:#fcf8e3;
}

.alert,
.alert h4 {
    color:#c09853;
}

.alert h4 {
    margin:0;
}

.alert .close {
    position:relative;
    top:-2px;
    right:-21px;
    line-height:20px;
}

.alert-success {
    color:#468847;
    background-color:#dff0d8;
}

.alert-success h4 {
    color:#468847;
}

.alert-danger,
.alert-error {
    color:#b94a48;
    background-color:#f2dede;
}

.alert-danger h4,
.alert-error h4 {
    color:#b94a48;
}

.alert-info {
    color:#3a87ad;
    background-color:#d9edf7;
}

.alert-info h4 {
    color:#3a87ad;
}

.alert-block {
    padding-top:14px;
    padding-bottom:14px;
}

.alert-block > p,
.alert-block > ul {
    margin-bottom:0;
}

.alert-block p + p {
    margin-top:5px;
}

#sidebar {
    width: 215px;
}

/* --- INDEPENDENT --- */
ul#independent-subjects {
    margin:0;
    padding:0;
}

ul#independent-subjects li {
    list-style-type:none;
    float:left;
    height:75px;
    width:140px;
    padding:0;
    margin:0 10px 10px 0;
    background:url('/images/student/independent-overlay.png') top left repeat-x;
}

ul#independent-subjects li a, ul#independent-subjects li strike {
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    height:75px;
    width:140px;
    padding:2px;
    color:#43A8D1;
}

ul#independent-subjects li a {
    text-decoration:none;
}

#dj-popup {
    display: none;
}

/* header icons */
.home-icon { background: url('/images/student/nocn/home-icon.png') center no-repeat; }
.calendar-icon { background: url('/images/student/nocn/calendar-icon.png') center no-repeat; }
.messages-icon { background: url('/images/student/nocn/messages-icon.png') center no-repeat; }
.alert-icon { background: url('/images/student/nocn/alert-icon.png') center no-repeat; }
.settings-icon { background: url('/images/student/nocn/settings-icon.png') center no-repeat; }
.logout-icon { background: url('/images/student/nocn/logout-icon.png') center no-repeat; }

/* content icons */
.exam-icon { background: url('/images/student/nocn/exam-icon.png') center 20px no-repeat; }
.mock-exam-icon { background: url('/images/student/nocn/mock-exam-icon.png') center 20px no-repeat; }
.english-functional-skills-icon { background: url('/images/student/nocn/english-functional-skills-icon.png') center 5px no-repeat;  }
.maths-functional-skills-icon { background: url('/images/student/nocn/maths-functional-skills-icon.png') center 10px no-repeat;  }
.reports-icon { background: url('/images/student/nocn/reports-icon.png') center 10px no-repeat;  }
.exam-prep-icon { background: url('/images/student/nocn/exam-prep-icon.png') center 10px no-repeat;  }
.progress-icon { background: url('/images/student/nocn/progress-icon.png') center 10px no-repeat;  }

/* fonts */
@font-face{ font-family:"VAGRoundedBold"; src:url("/fonts/e043dd77-7cee-4a3c-b628-822e3bdbc8ac.eot?#iefix"); src:url("/fonts/e043dd77-7cee-4a3c-b628-822e3bdbc8ac.eot?#iefix") format("eot"),url("/fonts/5b73c12f-4a5a-4d8c-81be-1babf4a3f3dd.woff") format("woff"),url("/fonts/5638af5b-03a3-4601-a279-943ee3b29448.ttf") format("truetype"),url("/fonts/40964335-0b3a-4c89-895c-1e8f58438faa.svg#40964335-0b3a-4c89-895c-1e8f58438faa") format("svg"); }
@font-face{ font-family:"VAGRoundedLight"; src:url("/fonts/8eb3a61c-2df5-402f-aacc-7733752abec6.eot?#iefix"); src:url("/fonts/8eb3a61c-2df5-402f-aacc-7733752abec6.eot?#iefix") format("eot"),url("/fonts/67ca5d86-3357-4491-aa9f-6e7ff54b2e2e.woff") format("woff"),url("/fonts/888f8505-0e2c-41e8-af58-21279dda85e5.ttf") format("truetype"),url("/fonts/ca4650e2-5aa3-4755-9c6d-256cbb4f5115.svg#ca4650e2-5aa3-4755-9c6d-256cbb4f5115") format("svg"); }
@font-face{ font-family:"VAGRoundedCyrillicLight"; src:url("/fonts/cfded46d-b6db-4662-9a79-2f7cdec7f921.eot?#iefix"); src:url("/fonts/cfded46d-b6db-4662-9a79-2f7cdec7f921.eot?#iefix") format("eot"),url("/fonts/3862659b-7941-4553-a44a-c16953d58474.woff") format("woff"),url("/fonts/1ea56a4f-b74a-473e-a0c4-f24c49776e2e.ttf") format("truetype"),url("/fonts/3f4616f2-5928-4a40-a5ef-747ea3fa58e5.svg#3f4616f2-5928-4a40-a5ef-747ea3fa58e5") format("svg"); }
@font-face{ font-family:"VAGRoundedCyrillicBold"; src:url("/fonts/8bc6e8df-4689-413a-8c5e-72186510443b.eot?#iefix"); src:url("/fonts/8bc6e8df-4689-413a-8c5e-72186510443b.eot?#iefix") format("eot"),url("/fonts/a4954137-cb23-430c-97ff-d290317a6458.woff") format("woff"),url("/fonts/ac4e9c01-ba01-407c-a0d0-8bd6a3b330c5.ttf") format("truetype"),url("/fonts/815585a0-7463-466f-b9dc-abde0c43b27a.svg#815585a0-7463-466f-b9dc-abde0c43b27a") format("svg"); }