@charset "utf-8";

/* CSS Document */


/*
font-family:'Avenir LT W01 35 Light';
font-family:'AvenirLTW01-35LightObli';
font-family:'Avenir LT W01 45 Book';
font-family:'AvenirLTW01-45BookObliq';
font-family:'Avenir LT W01 55 Roman';
font-family:'AvenirLTW01-55Oblique';
font-family:'Avenir LT W01 65 Medium';
font-family:'AvenirLTW01-65MediumObl';
font-family:'Avenir LT W01 85 Heavy';
font-family:'AvenirLTW01-85HeavyObli';
font-family:'Avenir LT W01 95 Black';
font-family:'AvenirLTW01-95BlackObli';
font-family:'Myriad W01 Regular';
font-family:'Myriad W01 It';
font-family:'Myriad W01 SmBd';
font-family:'Myriad W01 SmBd It';
font-family:'Myriad W01 Bd';
font-family:'Myriad W01 Bd It';
font-family:'Rockwell W01 Bold';
font-family:'Calibri W01 Regular 904604';
font-family:'MHei HK Medium';
font-family:'MHei HK Bold';
font-family:'MHei HK Heavy';
font-family:'Microsoft JhengHei';
*/

ol {
    margin-bottom: 0;
    padding-left: 25px
}

.loginBox {
    font-family: 'MHei HK Medium', 'Microsoft JhengHei', serif;
    margin-bottom: 30px
}

.loginBox h3 {
    font-family: 'MHei HK Heavy', 'Microsoft JhengHei', serif;
    margin-top: 0;
    color: #fff
}

.loginSection {
    background-color: #8fc31f;
    padding: 25px 25px 5px 25px;
    height: 310px;
    -webkit-border-top-right-radius: 15px;
    -webkit-border-top-left-radius: 15px;
    -moz-border-radius-topright: 15px;
    -moz-border-radius-topleft: 15px;
    border-top-right-radius: 15px;
    border-top-left-radius: 15px
}

.btnSubmit {
    font-family: 'MHei HK Medium', 'Microsoft JhengHei', serif;
    width: 75px
}

a.forgotText {
    display: block;
    font-family: 'MHei HK Medium', 'Microsoft JhengHei', serif;
    color: #fff;
    margin: 8px 0
}

a.forgotText:hover,
a.forgotText:focus {
    text-decoration: underline
}

.createAccSection {
    background-color: #7aa61a;
    padding: 15px 25px 0 25px;
    height: 60px;
    -webkit-border-bottom-right-radius: 15px;
    -webkit-border-bottom-left-radius: 15px;
    -moz-border-radius-bottomright: 15px;
    -moz-border-radius-bottomleft: 15px;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px
}

.createAccSection h3 {
    font-family: 'MHei HK Heavy', 'Microsoft JhengHei', serif;
}

.createAccSection h3 a {
    color: #FFFFFF;
    text-decoration: none;
}

a.btnTeacherAcc {
    display: block;
    font-family: 'MHei HK Bold', 'Microsoft JhengHei', serif;
    font-size: 18px;
    margin: 0 -25px;
    padding: 10px 25px;
    border-bottom: solid 1px rgba(255, 255, 255, 0.5);
    color: #fff
}

a.btnTeacherAcc:hover,
a.btnTeacherAcc:focus {
    color: #4fc1ea;
    text-decoration: none
}

a.btnStudentACC {
    display: block;
    font-family: 'MHei HK Bold', 'Microsoft JhengHei', serif;
    font-size: 18px;
    padding: 10px 0;
    color: #fff
}

a.btnStudentACC:hover,
a.btnStudentACC:focus {
    color: #e55729;
    text-decoration: none
}

.btnTeacherAcc img,
.btnStudentACC img {
    vertical-align: bottom
}

.container .jumbotron {
    padding: 5px 25px;
    background: url(../../images/jumbotron_750x370.jpg) bottom center no-repeat;
    height: 370px;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px
}

.jumbotron h2 {
    font-family: 'MHei HK Heavy', 'Microsoft JhengHei', serif;
    font-size: 30px;
}

.jumbotron p {
    font-family: 'MHei HK Bold', 'Microsoft JhengHei', serif;
    font-size: 18px;
}

.stepHeader {
    color: #000;
    font-family: 'MHei HK Heavy', 'Microsoft JhengHei', serif;
    line-height: 30px;
    padding: 45px 0
}

.step {
    background: url(../../images/step_bg.png) 0 0 no-repeat;
    width: 132px;
    height: 148px;
    padding-top: 13px
}

.stepNumber {
    color: #fff;
    font-family: 'Rockwell W01 Bold', 'arial', serif;
    font-size: 34px
}

.stepName {
    color: #00b034;
    font-family: 'MHei HK Medium', 'Microsoft JhengHei', serif;
    font-size: 22px;
    line-height: 22px
}

.stepDescription {
    font-family: 'MHei HK Medium', 'Microsoft JhengHei', serif;
    font-size: 16px;
    margin: 20px 0 40px 0;
    padding: 15px;
    background-color: #f0f0f0;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px
}

.stepDescription p {
    margin: 0
}

.arrowContainer {
    text-align: center
}

a.teacherText {
    color: #00b7ee
}

a.teacherText:hover,
a.teacherText:focus {
    color: #00b7ee;
    text-decoration: underline
}

a.studentText {
    color: #f39800
}

a.studentText:hover,
a.studentText:focus {
    color: #f39800;
    text-decoration: underline
}

@media (max-width:767px) {
    .loginBox {
        height: 370px
    }
    .btnBack,
    .btnSubmit,
    .btnCancel {
        width: 100%
    }
    .stepHeader {
        font-size: 36px;
        text-align: center
    }
}

@media (min-width:768px) {
    .btnBack {
        margin-left: -15px
    }
    .stepDescription {
        display: none
    }
    .stepHeader {
        font-size: 32px;
        text-align: center
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .loginBox h3 {
        font-size: 20px
    }
    .stepHeader {
        font-size: 36px;
        text-align: center
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .stepHeader {
        font-size: 24px;
        line-height: 30px;
    }
}