@charset "UTF-8";
/* CSS Document */

form ul li {
    list-style:none !important;
}

.breakpoint_display{
    position:absolute;
    bottom:0;
    left:0;
    display:block;
    background-color:#FFF;
    color:#CCC;
    display:none;
}
.header {
    background: #F1F1F1;
}
.clear_{
    clear:both;
}
.clear_left{
    clear:left;
}
.content-container{
    padding-right:1%;
/*    overflow:visible !important;*/
}

/*ie10 hack*/
a.overlay_header{
    border-right: 1px solid transparent;
    background:url(../images/trans.gif) top left repeat;
}

a.overlay{
    border-right: 1px solid transparent;
    background:url(../images/trans.gif) top left repeat;
}



/* hack */
.nav_Programmes .nav_Feature{
    display: none;
}
.Program .header-p{
    display: none;
}
.ecotourism .header-p{
    display: none;
}

h2.basic-title{
    clear: left;
    margin-bottom: 0;
    margin-top: 5px;
}
.basic-clear{
    margin-bottom: 20px;
}


.feature_ .video-overlay{
    transition: all .1s ease-in-out;
}
.feature_:hover .video-overlay{
    transition: all .1s ease-in-out;
    background-position-y: 59%;
}

.feature_ .feature_bg{
    transition: all .1s ease-in-out;
}
.feature_:hover .feature_bg{
    transition: all .1s ease-in-out;
    background-position-y: 53%;
}
/* --------------------------------------------------- */
/* Vacancies */
/* --------------------------------------------------- */
ul.main_job_list li .job_left{
    width:35%;
    float:left;
}
ul.main_job_list li .job_right{
    width:65%;
    float:left;
}
ul.main_job_list li{
    list-style: none!important;
    border-bottom:1px #e1e1e1 solid;
    padding: 3px 0;
}
ul.main_job_list{
    margin-left: 0;
    border-top:1px #e1e1e1 solid;
    margin-bottom: 40px;
}
a.apply_button{ 
    background-color:#50a52c;
    padding:8px 10px;
    color:#fff;
    font-size:15px;
    font-weight:600;
    line-height:18px;
    display:block;
    margin-bottom:10px;
    float: left;
    margin-right:0px;
    box-shadow:2px 2px 0px #DDD;
    text-decoration: none;
    float: right;
}
a.apply_button:hover{ 
    background-color:#469525;
    color: #fff;
}
.VacancyNewForm #Form_Form,
.VacancyApply #Form_Form{
    width:100%;
    max-width: 100%;
}
.VacancyNewForm #Form_Form,
.VacancyApply #Form_Form{
    width:100%;
    background-color:#f1f1f1;
    padding: 0 2% 2% 2%;
}
.VacancyNewForm ul.declaration_items li,
.VacancyApply ul.declaration_items li{
    font-size: 12px!important;
    line-height: 15px;
}
.VacancyNewForm #Form_Form .FormHeading,
.VacancyApply #Form_Form .FormHeading{
    border-bottom: 1px solid #ccc;
    padding-bottom: 4px;
}
.VacancyNewForm #Form_Form input,
.VacancyNewForm #Form_Form textarea,
.VacancyApply #Form_Form input,
.VacancyApply #Form_Form textarea{
    max-width: 96%;
}
.VacancyNewForm #Form_Form .optionset ul,
.VacancyNewForm #Form_Form .optionset li,
.VacancyApply #Form_Form .optionset ul,
.VacancyApply #Form_Form .optionset li{
    list-style-image: none;
    list-style-type: none;
}
.VacancyNewForm #Form_Form .optionset li,
.VacancyApply #Form_Form .optionset li{
    margin-right: 15px;
    float: left;
    height:30px;
}
.VacancyNewForm #Form_Form .field,
.VacancyApply #Form_Form .field{
    clear:both;
}
.VacancyNewForm #Form_Form .optionset,
.VacancyApply #Form_Form .optionset{

}
.VacancyNewForm #Form_Form h3.do_you_suffer,
.VacancyApply #Form_Form h3.do_you_suffer{
    border-bottom: none;
    font-size: 18px;
    color: #333;
}
.VacancyNewForm option,
.VacancyApply option{
    display: none;
}
.VacancyNewForm select.dropdown option,
.VacancyApply select.dropdown option{
    display:block;
}
h3.vacancynewformtitle{
    background-color: #F1F1F1;
    padding: 15px 2% 15px 2%;
    margin-bottom: 0;
    color: #000;
    width:100%;
}
.Form_finished .main_job_list{

}
.Form_finished h3.vacancynewformtitle{
    display:none;
}

.vacancies-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;

}

.Vacancies.link .vacancies-submenu {
    display: none;
}

.Vacancies.current .vacancies-submenu {
    display: block;
}

.vacancy-container {
    box-sizing: border-box;
    width: calc(50% - 8px);
    display: inline-block;
    padding: 20px;
    background-color: #f1f1f1;
    margin-bottom: 15px;
}

.vacancy-container:nth-child(odd) {
    margin-right: 15px;
}

.sidebar ul.vacancies-submenu li a {
    padding-left: 15px;
    background-color: #819093;
    color: #fff;
}

@media(max-width: 800px) and (min-width: 632px){
    .vacancy-container {
        width: 100%;
    }
    .vacancy-container:nth-child(odd) {
        margin-right: 0px;
    }
}

@media(max-width: 560px) {
    .vacancy-container {
        flex-basis: 100%;
    }
    .vacancy-container:nth-child(odd) {
        margin-right: 0px;
    }
}

/* --------------------------------------------------- */
/* Content Layout */
/* --------------------------------------------------- */	
.main {
    padding-top:15px;
}
.cms_content,
.cms_content p,
.cms_content ul li{
    font-size:15px;
    margin-bottom:15px;
}
.cms_content ul li{
    margin:0;
    list-style: url(../images/bullet.png);
}
.left-50,
.right-50{
    width:50%;
    float:left;
}
/* --------------------------------------------------- */
/* Columns */
/* --------------------------------------------------- */
.col_{
    float:left;
    width:33%;
    overflow:hidden;
}
.inner_{
    margin:0 15px;
}
.col_ iframe{
    width:100%;
}

.fourCol .col_{
    float:left;
    width:25%;
    overflow:hidden;
}

.fourCol .pos1,
.fourCol .pos2,
.fourCol .pos3{
    width:33.3%;

}

.fourCol .col_ .inner_,
.fourCol .col_ .inner_ .feature_bg{
    margin-left:15px;
}


.Home .fourCol .pos1,
.Home .fourCol .pos2,
.Home .fourCol .pos3{
    width:33.3%;

}


/* --------------------------------------------------- */
/* Feature Panel */
/* --------------------------------------------------- */
.feature_{
    overflow:hidden;
    position:relative;
    margin-bottom:15px;
    height:200px;
}
.feature_ .inner_{
    background-color:#F1F1F1;
    height:300px;
    margin-right:0;
}
.video_feature_.feature_ .feature_bg{
    margin-left:15px;
}
.feature_ .feature_bg{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    overflow:hidden;
    margin:0 0%;
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center center;
    border-radius:2px;
    overflow:hidden;
}
.feature_ .feature_bg.calendar{
    width:90%;
}
.feature_ .inner_ .feature_bg img{
    border:none;
    min-width:100%;
}
.feature_ .inner_ .youtubethumb{
    background-size:150%;
}
.feature_ .content{
    top:0;
    width:100%;
}
.feature_ a.overlay{
    position:absolute;
    top:0;
    width:100%;
    height:100%;
    display:block;
    text-indent:-999px;
    overflow:hidden;
}
.typography .feature_ .content h3{
    background:url(../images/feature-title-bg-white.png) repeat;
    position:absolute;
    bottom:0;
    width:85%;
    padding:2% 8% 2% 5%;
    color:#222;
    font-size:18px;
    line-height:18px;
    font-weight:600;
    margin:0;
}

.staffProfile .content h3{
    height: 26px;
}

.feature_ .moreinfo{
    background:url(../images/feature-title-bg-white.png) repeat;

    color:#FFF;
    position:absolute;
    top:100%;
    width:85%;
    padding:0 8% 0% 5%;
}
.feature_ .moreinfo p{
    color:#222;
    font-size:14px;
    line-height:16px;
    margin:0;
    padding-bottom:10px;
}
.feature_ .video-overlay{
    background:url(../images/video-overlay.png) no-repeat;
    background-position:center center;
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}
.feature_ .specialIcon{
    height:100%;
    background-repeat:no-repeat;
    background-size:80%;
    background-position:50% 50%;
    width:90%;
}
.typography .feature_ .iconTitle .moreinfo{
    display:none;
}
.typography .feature_ .iconTitle h3{
    text-align:center;
    background:none;
    width:79%;
    font-weight:600;
    line-height:100%;
    margin-bottom:5%;
}
.fourCol .widget,
.widget{
    overflow:hidden;
    position:static;
}
.widget .inner_{
    background-color:#f1f1f1;
    padding:0 10%;
}
.widget p{
    color:#fff;
}
.widget h4{
    color:#888;
    text-transform:uppercase;
    letter-spacing:2px;
    font-size:10px;
    line-height:12px;
    font-weight:700;
    margin-bottom:0;
    padding-bottom:4px;
    padding-top:12px;
}
.tpp_drop{
    background:url(../images/dropdown-arrow.gif) #e0e0e0 no-repeat center right;
    box-shadow: 2px 2px 0px #c6c8c7;
    cursor:pointer;
    padding:4% 0% 3% 4%;
    color:#222;
    font-size:15px;
    line-height:17px;
    font-weight:600;
    border-radius:3px;
    width:90%;
}
.hasCustomSelect{
    clear:left;
    padding:0px;
    border-width: 1px;
}

/* --------------------------------------------------- */
/* Programs */
/* --------------------------------------------------- */
.program_links{
    width:20%;
    margin-left:4%;
    float:right;
    margin-bottom:15px;
    margin-top:5px;
}
.program_links a.icon{
    background-repeat:no-repeat;
    background-color:#f1f1f1;
    background-position:50% 50%;
    background-size:80%;
    color:#222;
    font-weight:600;
    display:block;
    line-height:14px;
    text-align:center;
    padding:60% 5% 5% 5%;
    margin-bottom:10px;
    text-decoration:none;
}




.program_links a.questionnaire_icon{
    background-repeat:no-repeat;
    background-color:#f1f1f1;
    background-position:50% 50%;
    background-size:80%;
    color:#222;
    font-weight:600;
    display:block;
    line-height:14px;
    text-align:center;
    padding:5% 5% 5% 5%;
    margin-bottom:10px;
    text-decoration:none;
    font-size: 12px;
    font-weight: 400;
}

.program_links a.course_contact{
    background-image:url(../images/contact-for-website.jpg);
    text-decoration: none;
}
.program_links a.graduate_profile{
    background-image:url(../images/icon-alumni.jpg);
    text-decoration: none;
}
.program_links a.endorsement{
    background-image:url(../images/icon-useful-documents.jpg);
    text-decoration: none;
}
.program_links a.industry_training{
    background-image:url(../images/icon-industry-training.jpg);
    text-decoration: none;
}
.program_links a.video_gallery{
    background-image:url(../images/icon-video-web.jpg);
    text-decoration: none;
}
.program_links a.image_gallery{
    background-image:url(../images/gallery-web-icon.jpg);
    text-decoration: none;
}
.program_links a.occupational_outlook{
    background-image:url(../images/occupational.jpg);
    text-decoration: none;
}
.program_links a.download_brochure{
    background-image:url(../images/icon-brochure.jpg);
    text-decoration: none;
}
.program_links a.download_questionnaire{
    background-image:url(../images/icon-questionnaire.jpg);
    background-position:50% 10%;
}
.program_links a.download_questionnaire .sub{
    font-size: 12px;
    font-weight: 400;
}
.program_links a.enrolment{
    background-image:url(../images/icon-enrolment.jpg);
    text-decoration: none;
}
.program-tutors{
    margin-left: -15px;
}
.program-tutors .col_{
    width:33.3%;
}
ul.program-stats{
    list-style: none;
    margin:0;
    width:98%;
}
ul.program-stats li{
    list-style: none;
    background-color: #F1F1F1;
    padding:5px 2%;
    margin:0;
    display: flex;
    /*overflow: hidden;*/
}
ul.program-stats li:nth-child(even){
    background-color:  #f8f8f8;
}
.stat-label{
    width:35%;
    float:left;
    padding-right: 2%;
    font-weight:600;

}
.stat-val{
    float: right;
    width:59%;
}

.stat-val p{
    margin: 0 !important;
}

.kis-header{
    width:98%;
    float:left;
    padding-right: 2%;
    font-weight:800;
    overflow: hidden;
}
.kis-label{
    width:40%;
    float:left;
    padding-right: 5%;
    font-weight:600;
    padding-left: 2%;

}
.kis-val{
    float: right;
    width: 53%;
    word-wrap: break-word;
    overflow: hidden;
} 	

.program-footnotes{
    margin-top: 20px;
    font-style: italic;
}

.program-content{

    width:75%;
}
.program_links .students_sidebar_feats .col_{
    width:100%;
}
.program_links .students_sidebar_feats .col_ .inner_{
    margin:0;
}
.program_links .students_sidebar_feats .col_ .inner_ .feature_bg{
    margin: 0;
}
.typography .students_sidebar_feats .feature_ .content h3,
.typography .students_sidebar_feats .feature_ .content .moreinfo{
    width: 92%;
    padding-right: 8%;
}
.typography .students_sidebar_feats{
    margin-top: 20px;
}
.typography .prgr_1:before{
    content: "Graduate Profiles";
    font-weight: 600;
    font-size:18px;
}
.pdfRight{
    width: 25%;
}

.main .content .tutor_sidebar_title {
    font-weight: 600;
    font-size: 18px;	
    margin-bottom: -20px;
}

/* --------------------------------------------------- */
/* Staff Member */
/* --------------------------------------------------- */
.staffProfile .feature_bg{
    margin-left:15px;
}
.typography p.feature-title-smaller{
    font-size:12px;
    line-height: 12px;
    margin-bottom: 2px;
    font-weight: 600;
}
.staffphoto_{
    float:right;
    margin-left:20px;
}
.staff .typography .feature_ .moreinfo p{
    font-size: 12px;
    line-height: 12px;
}
.cms_content .staff.col_{
    width: 25%;
}
.staff .cms_content .col_ .feature_bg{ 
    width: 95%;
}
/* --------------------------------------------------- */
/* PDF's/LinkLists */
/* --------------------------------------------------- */
ul.pdfs, ul.links{
    list-style:none;
    margin:40px 0 0 0;
}
ul.pdfs li, ul.links li{
    list-style:none;
    margin-bottom:5px;
}
ul.pdfs li a{
    display:block;
    background:url(../images/pdf-icon.gif) no-repeat 10px 15px #f1f1f1;
    padding:15px 0px 10px 65px;
    text-decoration: none;
    border-radius: 5px;
    background-size: 35px;
}
ul.links li a{
    display:block;
    background:url(../images/icon-external.png) no-repeat 10px 7px #f1f1f1;
    padding:15px 0px 10px 65px;
    text-decoration: none;
    border-radius: 5px;
    background-size: 30px;
}
ul.pdfs li a:hover{
    background:url(../images/pdf-icon.gif) no-repeat 10px 15px #e6e8e8;
    background-size: 35px;
}
ul.links li a:hover {
    background:url(../images/icon-external.png) no-repeat 10px 7px #e6e8e8;
    background-size: 30px;
}
ul.pdfs li h3, ul.links li h3{
    margin-bottom:5px;
    font-size:18px;
    line-height:15px;
}
ul.pdfs li a:hover h3, l.links li a:hover h3{
    color:#000;
}
ul.pdfs li p, ul.links li p{
    margin-bottom:0;
    color:#999;
    font-size:13px;
}
/* --------------------------------------------------- */
/* Header Slider / Static Image */
/* --------------------------------------------------- */	
.header-pic-wrap{
    background-color:#FFF;
}
.header-slider{
    height:260px;
    position:relative;
    overflow:hidden;
    max-width:1300px;
    margin:0 auto;
}
.no-image{
    height:150px;
    overflow:hidden;
    background-color:#d0d6d7;
    background:url(../images/no-image.jpg) #d0d6d7 repeat-x top left;
}
.no-image .header-image .title{
    margin-bottom:10px;
}
.no-image .header-image .title .header-p{
    display:none;
}

.header-image-effect{
    background-color:#333;
    width:0%;
    height:360px;
    position:absolute;
    top:0;
}
.header-image .headerImageInner{
    width:960px;
    height:345px;
    margin:0 auto;
}
.header-image .basicImage .image{
    height:345px;
}
.header-image .basicImage .image img{
    position:absolute;
    left:0%;
}
.header-image .basicImage .header_overlay{
    position:relative;
}
.header-image .basicImage .header_overlay{
    width:1300px;
    height:345px;
    margin:0 0 0 -170px;
}
.header-image .title{
    width:80%;
    text-align:left;
    margin-left:-5%;
    position:absolute;
    bottom:0;
    margin-bottom:45px;
}
.header-image .title h2{
    display: block;
    clear: both;
}
.has-icon .title{
    padding-left:90px;
}
.header-specialIcon{
    width:80px;
    height:80px;
    overflow: hidden;
    position: absolute;
    top:0px;
    left:0;
    background-color: #f1f1f1;
    border-radius: 5%;
}
.header-specialIcon img{
    width:120%;
    margin-top: 0px;
    margin-left: -8px;
    position: absolute;
}
.header-image .title h2 p {
    background:url(../images/header-title-bg.png) repeat;
    color:#222324;
    font-size:38px;
    line-height:48px;
    font-weight:700;
    letter-spacing:-1px;
    clear: both;
    margin:0;
    text-transform:uppercase;
    text-shadow:none;
    display: inline;
    padding: 2px;
}


.header-image .title h2.header-level p {
    font-size: 16px;
    line-height: 38px;
    padding: 0 7px;
    font-weight: 600;


}
.header-image .title h2 p br{
    width: 50px;

}
.header-image .title p{
    clear:left;
    margin-top:10px;
    color:#fff;
    display:inline;
    font-size:20px;
    line-height:23px;
    font-weight:600;
    text-shadow:1px 1px 1px #000;
    background:url(../images/header-title-black-bg.png) repeat;
}
.header-image .title .header-p{
    margin-top:10px;
    margin-bottom:10px;
    width:95%;
}
.header-image .title .header-p p{
    margin:0;
}
.header-pager{
    position:relative;
    width:1084px;
    height:0px;
    margin:0 auto;
}
.header-pager ul.paging{
    position:absolute;
    margin-top:-40px;
}
.header-pager ul.paging li{
    padding:0;
    float:left;
    height:14px;
    width:14px;
    overflow:hidden;
    background-color:#FFF;
    margin-right:7px;
    border-radius:2px;
    cursor:pointer;
    display:none;
}
.header-pager ul.paging li.current{
    background-color:#FFF;
}
.header-pager ul.paging li.pLeft,
.header-pager ul.paging li.pRight{
    background-image:url(../images/paging-arrows.png);
    background-repeat:no-repeat;
    background-color:transparent;
    width:23px;
    height:23px;
    display:block;
    margin-top:-4px;
}
.header-pager ul.paging li.pLeft{
    background-position:0 0;
    margin-right:8px;
}
.header-pager ul.paging li.pLeft:hover{
    background-position: 0 -23px;
}
.header-pager ul.paging li.pRight{
    background-position:-23px 0;
    margin-left:3px;
}
.header-pager ul.paging li.pRight:hover{
    background-position: -23px -23px;
}
.header-image a.overlay_header{
    position:absolute;
    top:0;
    width:100%;
    height:350px;
    display:block;
    text-indent:-999px;
    overflow:hidden;
}
/* --------------------------------------------------- */
/* Blog / News */
/* --------------------------------------------------- */
.blogSummary{
    width: 266px;
    margin-left: 1%;
    margin-bottom: 15px;
    float: left;
    height: 250px;
    overflow: hidden;
    position: relative;
    border:1px solid #ddd;
    box-shadow: 2px 2px 0 #f1f1f1;
}
.blogSummary h2.postTitle{
    background-color: #fff;
    padding: 2% 4%;
    margin: 0;
    font-size: 18px;
    line-height: 22px;
}
.blogSummary h2.postTitle a{
    text-decoration: none;
    color: #222324;
}
.blogSummary a.summary_readmore{
    position: absolute;
    bottom: 0;
    display: block;
    width: 96%;
    padding: 2% 4%;
    background-color: #f1f1f1;
    text-decoration: none;
}
.blogSummary a.summary_readmore:hover{
    background-color:#515151;
    color: #fff;
}
.blogSummary .summary_preview{
    padding: 4%;
    font-size: 14px;
}
.pagination{
    clear: both;
}
.pagination ul.PageNumbers{
    list-style: none;
    margin:20px 0 0 0;
    padding: 0;
    background-color: #f1f1f1;
    float: left;
    height: 30px;
    overflow: hidden;
    border-radius: 5px;
}
.pagination ul.PageNumbers li{
    list-style: none;
    float: left;
}
.pagination ul.PageNumbers li a{
    display: block;
    min-width: 50px;
    border-left:1px solid #fff;
    border-right: 1px solid #ccc;
    height: 30px;
    line-height: 30px;
    overflow: hidden;
    text-align: center;
    text-decoration: none;
}
.pagination ul.PageNumbers li a.prev{
    border-left: none;
}
.pagination ul.PageNumbers li a.next{
    border-right: none;
}
.pagination ul.PageNumbers li a.disabled{
    cursor: default;
    color: #ccc;
}
.pagination ul.PageNumbers li.active a{
    background-color: #50a52c;
    color: #fff;
    border-left: none;
}
/* --------------------------------------------------- */
/* Contact Us */
/* --------------------------------------------------- */
.contact #Form_Form{
    width:65%;
    float: right;
    background-color:#f1f1f1;
    padding: 1% 2% 1% 2%;
    clear: none;
    max-width: 800px;
}
.contact #contact-main{
    width:30%;
    float: right;
}


fieldset.optionset {
	clear:left;
}



.contact #contact-main td{
	padding: 18px;
}

.contact #contact-main h4{
	margin-top: 24px;
}

.contact #contact-main h4:first-child{
	margin-top: 0;
}

.contact .content form input.text, 
.contact .content form textarea, 
.contact .content form .textajaxuniquetext, 
.contact .content form select{
    width: 96%;
    margin-top: 5px;
}
.contact label.left{
    float: left;
    clear: left;
    margin-right: 2%;
    min-width: 28%;
    margin-top: 10px;
}
.contact .middleColumn{
    float: left;
    min-width: 65%;
}
.contact form #Form_Form_EditableTextField14_Holder .middleColumn,
.contact form #Form_Form_EditableTextField15_Holder .middleColumn,
.contact form #Form_Form_EditableTextField20_Holder .middleColumn{
    width: 100%;
}
.contact form input#Form_Form_EditableTextField14,
.contact form #Form_Form_EditableTextField15,
.contact form #Form_Form_EditableTextField20{
    max-width:96%;
}

#Form_Form_EditableFormHeading9{
    font-size: 15px;
    float: left;
    clear: left;
    min-width: 30%;
    display: block;
    font-weight: bold;
    color: #333333;
}

#EditableRadioField8{
    clear:both;
}


#EditableRadioField8 > legend, #EditableRadioField16 > legend {
    padding-top: 15px;
    float: left;
    
}

#EditableRadioField8 > legend {
	padding-right: 24%;
}

#EditableRadioField16 > legend {
	padding-right: 12%;
}

.contact #EditableRadioField16 .middleColumn {
	min-width: 10%;	
}

.contact .optionset li{
    float: left;
    margin-top: 10px;
	margin-right: 15px;
}
.contact #Form_Form_EditableTextField5_Holder label.left,
.contact #Form_Form_EditableTextField6_Holder label.left,
.contact #Form_Form_EditableTextField7_Holder label.left{
    width:auto;
    min-width: 1%;
    clear: none;
}
.contact #Form_Form_EditableTextField5_Holder label.left,
.contact #Form_Form_EditableTextField6_Holder label.left,
.contact #Form_Form_EditableTextField7_Holder label.left{
    margin-top: 15px;

}
.contact #Form_Form_EditableTextField5_Holder .middleColumn,
.contact #Form_Form_EditableTextField6_Holder .middleColumn,
.contact #Form_Form_EditableTextField7_Holder .middleColumn{
    width:10%;
    min-width: 5%;
    margin-top: 5px;
    margin-right: 3%;
}

.contact .dropdown .middleColumn{
    /* clear: left; */
}
.contact .Actions:after{
    display:none;
}
.contact .Actions{
    margin-top: 15px;

}
.contact #Form_Form ul,
.contact #Form_Form li{
    list-style-image: none;
    list-style-type: none;
}
.contact #Form_Form li{
    margin-right: 15px;
}

#Form_Form span.message{
    max-width:563px	
}

@media only screen and (max-width: 960px) {
    .contact #Form_Form { width: 96%;}
    #Form_Form_EditableFormHeading9 { font-size: 12px;     min-width: 30%;}
    #Form_Form_EditableFormHeading10{ font-size: 12px; }
    #EditableRadioField8 > legend { padding-right: 20%;}
    .contact #Form_Form_EditableTextField5_Holder .middleColumn, .contact #Form_Form_EditableTextField6_Holder .middleColumn, .contact #Form_Form_EditableTextField7_Holder .middleColumn{
        width: 5%;
    }
}
/* --------------------------------------------------- */
/* MAINZ Customization */
/* --------------------------------------------------- */
/*
.mainz .header-image .title{
        width:55%;
}
.mainz .header-image .header-p{
        width:55%;
}
.mainz .header-image .header-p p{
        color:#222324;
        text-shadow:none;
}
*/
.mainz .footer a.enrol{
    background-color:#21a6d7;
}
.mainz .footer a.enrol:hover{
    background-color:#0c8ebe;
}
/* Video Page ----- */
.Video iframe.youtube{
    width:100%;
    height:500px;
}
.video-embed{
    margin-bottom:20px;
}
/* MAINZ sider */
.mainz-floating-logo {
    position: absolute;
    z-index: 1000;
    right: 0px;
    top: 10px;
}

.mainz-floating-image {
    max-width: 200px;
}

/* --------------------------------------------------- */
/* TOOLTIPS creates a hover over pop up */
/* --------------------------------------------------- */


.tooltip{
    display:inline;
    position:relative;
    color:rgb(51, 51, 51)!important;
    text-decoration:none;
}
.tooltip:hover{text-decoration:none;color:rgb(51, 51, 51)!important;}
.tooltip:hover:after{
    background:#111;
    background:rgba(0,0,0,.8);
    border-radius:5px;
    bottom:18px;
    color:#fff;
    content:attr(data-title);
    display:block;
    left:25%;
    padding:5px 15px;
    position:absolute;
    white-space:pre-line;
    z-index:998;
    width:200px;
    height:auto;
}
.tooltip:hover:before{
    border:solid;
    border-color:#111 transparent;
    border-width:6px 6px 0 6px;
    bottom:12px;
    content:"";
    display:block;
    left:25%;
    position:absolute;
    z-index:999;
}

/* --------------------------------------------------- */
/* LATEST NEWS customizations */
/* --------------------------------------------------- */

.latest_news_section ul li {
    list-style: none;
    margin: 15px 10px 10px -10px;
    padding-right:5px;
    line-height:18px;
    /*white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;*/
}

.latest_news_section ul li p {
    color:grey;
    font-size:12px;
    line-height:14px;
}

.BlogHolder .latest_news_section.blogSummary {
    height: auto;
}

.BlogHolder .latest_news_section.blogSummary a {
    text-decoration:none;
}

.BlogHolder blog_container {
    display:table;
}

/* ######################################################################## */
/* BREAKPOINT 1175px */
/* ######################################################################## */
@media only screen and (max-width: 1175px) {
    #vid-custom-1{
        width:90%!important;
        left:5%!important;
    }
    #bp1175{display:block;}
    .main {
        padding-top:15px;
    }
    .header .brand{
        margin-bottom:0px;
        width:350px;
    }
    .header-image .title{
        position:absolute;
        bottom:0;
        width:90%;
        left:40px;
        padding-right:0;
        overflow:hidden;
        margin-left:0%;
        margin-bottom:45px;
    }
    .mainz-floating-logo {
        right: 0px;
        top: 10px;
    }

    .mainz-floating-image {
        max-width: 160px;
    }	
}
/* ######################################################################## */
/* BREAKPOINT 960px */
/* ######################################################################## */
@media only screen and (max-width: 960px) {
    .cms_content,
    .cms_content p,
    .cms_content ul li{
        font-size:14px;
        margin-bottom:14px;
    }
    .cms_content ul li{
        margin:0;
    }
    #vid-custom-1{
        width:96%!important;
        left:2%!important;
    }
    .vid-custom-2{
        height:400px!important;
    }
    .pp_description{
        font-size:12px;
        line-height:16px;
    }
    #bp960{display:block;}
    .main {
        padding-top:15px;
    }
    .header-image .title .header-p p{
        font-size:14px;
        line-height:15px;
    }	
    .header-slider{
        height:200px;
    }

    .tablet-nav .header .brand{
        margin-bottom:00px;
    }
    .tablet-nav .header .inner{
        padding-right:0;
    }
    .header-image .headerImageInner{
        width:640px;
        margin:0 auto;
        height:250px;
    }
    .header-image .basicImage .header_overlay{
        width:960px;
        height:200px;
        margin:0 0 0 -160px;
    }
    .header-image .basicImage .image img{
        width:960px;
    }
    .header-image .title{
        left:40px;
        position:absolute;
        bottom:0;
        margin-bottom:15px;
        margin-left:0;
    }
    .has-icon .title{
        padding-left:72px;
    }
    .header-specialIcon{
        width:65px;
        height:65px;
    }
    .header-specialIcon img{
        margin-left: -6px;
    }
    .Home .header-image .title{
        margin-bottom:35px;
    }
    .header-image .title h2 p{
        font-size:30px;
        line-height:37px;
        padding-right:0px;
        padding-left:0px;
        padding-top:2px;
        padding-bottom:0px;
    }

    .header-image .title p{
        font-size:17px;
        line-height:20px;
    }
    .feature_{
        margin-bottom:15px;
        height:160px;
    }
    .typography .feature_ .content h3{
        font-size:16px;
        line-height:16px;
    }
    .staffProfile .content h3{
        height: 24px;
    }

    .typography .feature_ .content .moreinfo,
    .typography .feature_ .content .moreinfo p{
        font-size:10px;
        line-height:11px;
    }
    .feature_ .video-overlay{
        background:url(../images/video-overlay-med.png) no-repeat;
        background-position:center center;
    }
    .no-image{
        height:150px;
        overflow:hidden;
    }
    .no-image .header-image .title{
        margin-bottom:8px;
    }
    .staff .cms_content .col_{
        width: 33.3%;
    }
    .program_links a.download_questionnaire .sub{
        font-size: 10px;
    }
    .blogSummary{
        width: 48%;
    }
    .contact #Form_Form{
        width:96%;
        float: none;
        border:1px solid #e1e1e1;
        padding-bottom: 2%;
    }
    .contact #contact-main{
        width:100%;
        float: none;
    }
    .typography .intro {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 15px;
        font-weight:600;
    }
    .Home .widget{
        clear: both;
        width:100%!important;
        height: 90px!important;
    }
    .Home .col_{
        width:33%;
    }
    .Home .widget .choose_item_{
        float:left;
        width:33%;
    }
    .Home .widget .inner_{
        padding:0 20px;
    }
    .Home .widget H4{
        letter-spacing: 0;
    }
    .mainz-floating-image {
        max-width: 140px;
    }
    .mainz-floating-logo {
        right: 0px;
        top: 10px;
    }	
}
/* ######################################################################## */
/* BREAKPOINT 800px */
/* ######################################################################## */
@media only screen and (max-width: 800px) { 
    .col_{
        width:50%;
    }
    .tablet-nav .content-container{
        margin-left:0;
        padding-right:10px;
    }
    .feature_ .video-overlay{
        background:url(../images/video-overlay-med.png) no-repeat;
        background-position:center center;
    }

    .program-tutors .col_{
        width:50%;
    }
    .pdfRight{
        width: 33%;
    }
    .mainz-floating-image {
        max-width: 100px;
    }
    .mainz-floating-logo {
        right: 0px;
        top: 10px;
    }	
    .program_links a.icon{
        font-size:12px;
        line-height: 12px;
    }
}
/* ######################################################################## */
/* BREAKPOINT 640px */
/* ######################################################################## */
@media only screen and (max-width: 640px) {
    .cms_content,
    .cms_content p{
        font-size:12px;
        line-height:14px;
        margin-bottom:12px;
    }
    .cms_content ul li{
        font-size:12px;
        line-height:20px;
    }
    #vid-custom-1{
        width:96%!important;
        left:2%!important;
    }
    .vid-custom-2{
        height:360px!important;
    }
    .vid-custom-3{
        width:100%!important;
        height:85%;
        float:left;
    }
    .pp_description{
        display:none!important;
    }
    .vid-custom-2 iframe{
        width:100%!important;
        height:100%!important;
    }
    #vid-custom-1 .pp_details{
        width:100%!important;
        clear:left!important;
        padding-bottom:20px!important;
    }
    #bp640{display:block;}
    .header-slider{
        height:130px;
    }
    .tablet-nav .header .brand{
        margin-bottom:20px;
    }
    .tablet-nav .header .inner{
        padding-top:10px;
    }
    .main .inner{
        padding:0;
    }
    .content-container{
        padding:0;
    }
    .cms_content,
    .cms_title{
        padding-left:20px;
    }
    .header .primary{
        width:100%;
        height:0px;
        background-color:#F00;
    }
    .program_links a.icon{
        font-size:10px;
        line-height: 12px;
    }

    .header-image .headerImageInner{
        width:50%;
        margin:0 auto;
        height:130px;
        position:relative;
    }
    .header-image .basicImage .header_overlay{
        width:640px;
        height:170px;
        margin:0 0 0 -160px;
    }
    .header-image .basicImage .image img{
        width:640px;
    }
    .header-image .title,
    .mainz .header-image .title{
        left:20px;
        bottom:0px;
        width:150%;
        margin-left:-50%;
        margin-bottom:20px;
        position:absolute;
    }
    .has-icon .title{
        padding-left:54px;
    }
    .header-specialIcon{
        width:48px;
        height:48px;
    }
    .header-specialIcon img{
        margin-left: -4px;
    }
    .header-image .title h2 p{
        font-size:18px;
        line-height:23px;
        padding-right:0px;
        padding-left:0px;
        padding-top:2px;
        clear:left;
    }
    .header-image .title p{
        font-size:12px;
        line-height:14px;
    }
    .header-pager ul.paging{
        margin-left:20px;
        margin-top:-28px;
    }
    .content .feature_ .inner_,
    .content .feature_ .inner_ .feature_bg{
        margin-left:10px;
    }
    .feature_ .video-overlay{
        background:url(../images/video-overlay-med.png) no-repeat;
        background-position:center center;
        position:absolute;
        top:0;
        left:0;
    }
    .typography .feature_ .content h3{
        font-size:13px;
        line-height:13px;
    }
    .staffProfile .content h3{
        height: 20px;
    }	
    .feature_{
        margin-bottom:9px;
        height:110px;
    }
    .overflow_{
        width:100%!important;
    }

    .fourCol .col_,
    .fourCol .pos3{
        width:33.3%;
    }
    .fourCol .pos1,
    .fourCol .pos2{
        width:33.3%;
    }
    .fourCol .col_ .inner_,
    .fourCol .col_ .inner_ .feature_bg{
        margin-left:15px;
    }
    .header-image .title .header-p{
        display:none;
    }
    .header-image .title .header-h{
        margin-bottom:0px;
    }
    .no-image{
        height:100px;
        overflow:hidden;
    }
    .no-image .header-image{
        height:100px;
    }
    .no-image .header-image .headerImageInner{
        height:100px;
    }
    .no-image .header-image .title{
        margin-bottom:8px;
    }
    .staff .cms_content .col_{
        width: 33.3%;
        height: 140px;
    }
    .program-tutors .col_{
        width:33.3%;
    }
    .blogSummary{
        width: 98%;
        margin-left: 1%;
        float: left;
        height: 300px;
        overflow: hidden;
        position: relative;
        border:1px solid #ddd;
    }
    .Home .col_{
        width:50%;
    }
    .Home .pos4{
        width:33%;
    }
    .Home .widget H4{
        letter-spacing: 0;
        font-size: 9px;
        text-transform: none;
        font-weight: normal;
    }
    .Home .widget .tpp_drop{
        font-size: 13px;
    }

    .mainz-floating-image {
        max-width: 80px;
    }
    .mainz-floating-logo {
        right: 5px;
        top: 115px;
    }	
    .ecotourism
    {
        top: 105px;
    } 	
    .pageheader
    {
        top: 5px;
    }	
}
/* ######################################################################## */
/* BREAKPOINT 410px */
/* ######################################################################## */
@media only screen and (max-width: 410px) { 
    .col_{
        width:100%;
    }
    .fourCol .col_,
    .fourCol .pos3,
    .fourCol .pos2,
    .fourCol .pos1{
        width:33%;
        height: 100px;
    }

    .feature_{
        margin-bottom:9px;
        height:120px;
    }

    .feature_ .video-overlay{
        background:url(../images/video-overlay-med.png) no-repeat;
        background-position:center center;
    }
    #vid-custom-1{
        width:100%!important;
        left:0%!important;
    }
    .vid-custom-2{
        height:280px!important;

    }
    .staff .cms_content .col_{
        width: 50%;

    }
    .program-tutors .col_{
        width:50%;
    }
    .typography .intro {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 14px;
        font-weight:600;
    }
    .pdfRight{
        width: 40%;
    }
    .Home .col_{
        width:50%;
    }
    .Home .pos4{
        width:33%;
    }
    .Home .widget .choose_item_{
        float:none;
        width:100%;
    }
    .Home .widget .inner_{
        padding:0 10px;
    }
    .Home .widget{
        clear: both;
        width:100%!important;
        height: 230px!important;
    }

    .mainz-floating-image {
        max-width: 60px;
    }
    .mainz-floating-logo {
        right: 0px;
        top: 125px;
    }

    .ecotourism
    {
        top: 115px;
    } 
    .pageheader
    {
        top: 5px;
    }

    .program_links a.icon{
        font-size:10px;
        line-height: 10px;
    }
}

/* ######################################################################## */
/* BREAKPOINT 360px */
/* ######################################################################## */
@media only screen and (max-width: 360px) {
    .program_links a.icon{
        font-size:6px;
        line-height: 8px;
    }
}

/* ######################################################################## */
/* Calendar Pop-up */
/* ######################################################################## */

#calendar-content {display:none;}

/* Overlay */
#simplemodal-overlay {background-color:#000;}

/* Container */
#simplemodal-container {height:615px; width:815px; color:#bbb; background-color:#333;}
#simplemodal-container .simplemodal-data {padding:8px;}
#simplemodal-container code {background:#141414; border-left:3px solid #65B43D; color:#bbb; display:block; font-size:12px; margin-bottom:12px; padding:4px 6px 6px;}
#simplemodal-container a {color:#ddd;}
#simplemodal-container a.modalCloseImg {background:url(../images/x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer;}
#simplemodal-container h3 {color:#84b8d9;}

/* Form Customizations */
body form input.numeric {
    width: 170px;
}

.ApplicationForReEnrolmentMethodOfPaymentStep.enrolment-form label.left,
.AdultAndCommunityEnrolmentCitizenshipDetailsStep.enrolment-form label.left,
.ApplicationForEnrolmentMethodOfPaymentStep.enrolment-form label.left,
.ApplicationForEnrolmentCitizenshipDetailsStep.enrolment-form label.left {
    float:none;
}


h3 .course-link {
    color: #495051;
    text-decoration: none;
}

.nz_govt_logo {
    background-image:url(../images/All-of-govt_NZ_Gov_sm.jpg);
    width: 40%;
    float: right;
    padding-top: 25px;
    padding-right: 5px;
    background-image: none !important;

}

.kis_heading {
    float: left;
}


@media only screen and (max-width: 960px){
    .nz_govt_logo {
        width: 40%;
        float: none;
        padding-top: 5px;
        padding-bottom: 10px;
        padding-right: 50px;
        background-image: none !important;			
    }
}


table {
    border: none !important;
    border-spacing: 3px;
    border-collapse: collapse;

}

table td, table th{
    padding: 5px 2%;
}
table tbody th {
    text-align: left;
    background-color: transparent;
}
.cms_content table p {
    margin: 0;
}
table tr:nth-child(odd){
    background-color: #F1F1F1;
}

table tr:nth-child(even) {
    background-color: #f8f8f8;
}

.goog-te-gadget-simple {
    border: none !important;
    padding: 5px !important;
    padding-bottom: 4px !important;
}

#google_translate_element {
    float: right;
    /* position: relative; */
    /* right: 308px; */
    margin-left: 10px;
}

.goog-te-gadget-simple .goog-te-menu-value span {
    font-family: "proxima-nova", Arial, Helvetica, sans-serif;
}

@media only screen and (max-width: 640px){

    #google_translate_element {
        display:none;
    }
}

.goog-te-gadget-simple .goog-te-menu-value {
    color: #656f70 !important;
}


/********************************
   PROGRAM GALLERY 'CYCLE'
   ******************************/


.slideshow-container {
    position: relative;
}

.cycle-slideshow {
    overflow: hidden;
    max-height: 700px;
    margin: auto;

}

.cycle-slide {
    padding: 10px;
}

.cycle-next, .cycle-prev {
    position: absolute;
    z-index: 101;
    border-radius: 50%;
    -webkit-transition: border-color .3s;
    transition: border-color .3s;
    top: 50%;
    width: 40px;
    height: 40px;
    cursor: pointer;

    -webkit-transform: translate(0, -50%);

    -ms-transform: translate(0, -50%);

    transform: translate(0, -50%);
    border: rgba(255, 255, 255, 0) solid 3px;
}

.cycle-next > div:hover, .cycle-prev > div:hover {
    border-color: rgba(0, 0, 0, 1);
}

.cycle-next {
    right: -30px;
}
.cycle-next > div {
    position: absolute;
    display: inline-block;
    border-bottom: rgba(0, 0, 0, 0.2) solid 3px;
    border-right: rgba(0, 0, 0, 0.2) solid 3px;
    width: 15px;
    height: 15px;
    top: 28%;
    left: 50%;
    -webkit-transform: rotate(-45deg) translate(-50%, -50%);
    -ms-transform: rotate(-45deg) translate(-50%, -50%);
    transform: rotate(-45deg) translate(-50%, -50%);
}

.cycle-prev {
    left: -30px;
}

.cycle-prev > div {
    position: absolute;
    display: inline-block;
    border-bottom: rgba(0, 0, 0, 0.2) solid 3px;
    border-left: rgba(0, 0, 0, 0.2) solid 3px;
    width: 15px;
    height: 15px;
    top: 61%;
    left: 38%;
    -webkit-transform: rotate(45deg) translate(-50%, -50%);
    -ms-transform: rotate(45deg) translate(-50%, -50%);
    transform: rotate(45deg) translate(-50%, -50%);
}

.cycle-pager {
    position: absolute;
    bottom: 4%;
    right: 3%;
    z-index: 101;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    cursor: pointer;
}
.cycle-pager div {
    display: inline-block;
    margin-left: .5rem;
    margin-right: .5rem;
    border-radius: 50%;
    width: 0.7rem;
    height: 0.7rem;
    -webkit-transition: background-color .9s, border-color 1.8s;
    transition: background-color .9s, border-color 1.8s;

}


.program-gallery-header h2 {
    display: inline-block;
}
.gallery-link {
    float: right;
    margin-top: 35px;

}

h4.price-title {
    margin-top: 30px;

}

/********************************
     JOB VACANCY RECAPTCHA
 *******************************/

.field.recaptcha label {
    display: none;
}

.field.recaptcha #recaptcha_privacy a {
    color: black;
}

.field.recaptcha #recaptcha_table {
    border: none !important;

}

.field.recaptcha #recaptcha_area {
    margin-bottom: 10px; 
}

.field.recaptcha #recaptcha_response_field {
    padding-left: 5px;
}

.field.recaptcha img {
    background: none;
}

.field.recaptcha table td {
    background-color: white;
}


/********************************
     CONTACT FORM FIX
 *******************************/

#UserForm_Form {
    clear: none;
}

#contact-main {
    margin-right: 20px;
}


/********************************
     INTERNATIONAL STUDENT
 *******************************/
table.refund-policy-international {
    margin-top: 8px;
    margin-bottom: 8px;
    margin-left: -3px;
    width: calc(100% + 6px);
}

table.refund-policy-international th {
    padding: 8px 15px;
    background-color: #FFF;
    text-align: left;
    border: 2px solid #F1F1F1;
}

table.refund-policy-international td {
    background-color: #FFF;
    border: 2px solid #F1F1F1;
}

/********************************
        REFER A FRIEND
 *******************************/
.refer-heading-wrap {
    background-color: #4da721;
    width: 100vw;
    margin-left: -15px;
    margin-top: -15px;
}

.refer-heading-wrap .left {
    padding-left: 15px;
}
.refer-heading-wrap .right {
    padding-right: 15px;
}

.refer-heading-wrap > .inner {
    max-width: 1140px;
    margin: auto;
    padding: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
            justify-content: space-between;
    width: 100%;
}

.refer-heading-wrap .title > * {
    vertical-align: middle;
    display: inline-block;
}

.refer-heading-wrap .title {
    margin-bottom: 15px;
}

.refer-heading-wrap .title .icon {
    margin-right: 10px;
}

.refer-heading-wrap h1 {
    text-transform: uppercase;
    font-size: 1.6rem;
    color: #ffec02;
}

.refer-heading-wrap .heading p {
    color: #ffec02;
    font-weight: 700;
    font-size: 2.2rem;
    line-height: 2.4rem;
}

.intro-wrap {
    margin: 35px 0;
}


.intro-wrap .intro p {
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.8rem;
    text-align: left;
    color: #727677;
}

.intro-wrap .subtitle {
    font-size: 2.3rem;
    font-weight: 600;
    line-height: 2.6rem;
    color: #46b019;
}

.intro-wrap .terms {
    font-size: 1.3rem;
    color: #46b019;
}

.refer-form .form-step {
display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
            justify-content: space-between;
}

.refer-form #uff p {
    font-size: 1.8rem;
text-align: center;
line-height: 2rem;
color: #727677;
}

.refer-form .userformsgroup.nolabel{
    padding: 0;
    margin: 0;
    border: 0;
}

.refer-form form {
    position: relative;
}

.refer-form form .Actions {
    position: absolute;
    bottom: 15px;
    right: 20px;
    text-align: left;
    width: calc(100% - 40px);
}

.refer-form form .Actions .action {
    float: right;
}

.refer-form .form-step > .userformsgroup:nth-of-type(2) > .middleColumn, .refer-form .form-step > .userformsgroup > .middleColumn > .userformsgroup {
    padding: 20px;
    border-radius: 0;
    border: 0;
}

.refer-form .form-step > .userformsgroup:nth-of-type(2), .refer-form .form-step > .userformsgroup > .middleColumn > .userformsgroup {
    margin-bottom: 10px;
}

.refer-form .form-step > .userformsgroup > .middleColumn > .userformsgroup {
    background-color: #f1f1f1;
}

.refer-form .form-step > .userformsgroup:nth-of-type(2) {
    background-color: #dfe9d1;
    padding-bottom: 70px;
}

.refer-form .field .middleColumn input {
    width: 95%;
}
.refer-form .form-step > .userformsgroup {
    border: 0;
}

.refer-form .field .middleColumn, .refer-form .field label{
    display: inline-block;
}

.refer-form .field .middleColumn {
    max-width: 350px;
}

.refer-form .field label{
    min-width: 110px;
    font-size: .9rem;
}

.refer-form h3 {
    margin-bottom: 25px
}


.Program .refer.feature_ {
    height: 110px;
}

.Program .refer.feature_ .inner_ {
    margin: 0;
}

.Program .refer.feature_ .specialIcon {
    width: 85%;
    height: 70%;
    left: 50%;
    top: 43%;
    transform: translate(-50%, -50%);
    
}

.Program .refer.feature_  .iconTitle h3 {
    width: calc(100% - 20px);
    font-size: 15px;
    padding: 5px 10px;

}
@media (max-width: 800px){
    .Program .refer.feature_ .specialIcon {
        width: 100%;
        height: 80%;
    }

    .Program .refer.feature_  .iconTitle h3 {
        font-size: 12px;    
    }
    .Program .refer.feature_ {
        height: 90px;
    }
}

@media (max-width: 640px){
    .Program .refer.feature_ .specialIcon {
        margin-left: 0px;
    }
}

@media (max-width: 500px){
    .Program .refer.feature_ .specialIcon {
        height: 75%;
    }

    .Program .refer.feature_ {
        height: 80px;
    }
}

@media (max-width: 640px){
    .refer-form .form-step {
        -ms-flex-wrap: wrap;flex-wrap: wrap;
    }

    .refer-form .form-step > .userformsgroup {
        width: 100%;
    }

    .intro-wrap > * {
        padding: 10px;
    }
}

@media (min-width: 640px){
    .intro-wrap > * {
        width: 49%;
    }

    .refer-form .form-step > .userformsgroup {
        width: 49%;
    }

    .refer-heading-wrap .left {
        width: calc(50% - 15px);
    }
    .refer-heading-wrap .right {
        width: calc(48% - 15px);
    }
    .refer-form form .Actions {
        width: calc(49% - 40px);
    }
    .refer-heading-wrap {
        margin-left: -25px;
        margin-right: -25px;
    }

    .refer-heading-wrap > * {
        padding: 10px;
    }

    .intro-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
                justify-content: space-between;
    }
}
@media (min-width: 800px){
    .refer-heading-wrap .heading p {
        font-size: 2.9rem;
        line-height: 3.2rem;
    }
}

@media (min-width: 1165px){
    .refer-heading-wrap {
        margin-left: calc((1111px - 100vw)/2);
    }
}

.kis-link {
    margin-bottom: 5px;
    display: block;
}