#wrapper {margin: 0 auto; overflow: hidden;}


header {
	height: 135px; margin: 0; 
    background-size: cover;
    top: 0;
    width: 100%;
    z-index: 999;
}

header .row{
    max-width: 1980px;
    position: relative;
}


@media only screen and (min-width: 479px){
    
 header .header__logo {
    position: absolute;
    display: inline-block;
    top: 0;
    left: 0;
    width: 243px;
	height: 90px;
    background-image: url("/SiteElements/Images/Base/logo.png");
    background-repeat: no-repeat;}
    
}

.header__logo {
    position: absolute;
    display: inline-block;
    top: 0;
    left: 0;
    width: 90px;
    height: 90px;
    background-image: url("/SiteElements/Images/Base/logo.png");
    background-repeat: no-repeat;
}

header .show-for-sr {
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    width: 1px;
}




section {
    position: relative;
    min-height: 300px;
    padding: 0;
    margin-bottom: 2em;
}

.row {
    margin: 0 auto;
    max-width: 76rem;
    width: 100%;
}


#wrapper .sys_banner-wrapper img{width: 100%!important; height:auto!important;}


 h1{color: #005597; font-size: 2.6em; font-weight: bold; text-align:center;}




.row .sys_cms-form-control {margin: 0; padding: 0; width: 100%;  }

.row .sys_cms-form-body{padding: 0; margin: 0;}
.row .sys_cms-form-body .sys_cms-form-item {padding-left: 0;}
.row .sys_cms-form-body li input, 
.row .sys_cms-form-body li select, 
.row .sys_cms-form-body li textarea, 
.row .sys_cms-form-body li label, 
.row .sys_cms-form-body li .sys_legend, 
.row .sys_cms-form-body li .sys_fieldlabel,
.row .sys_form-submit{font-family:circular; font-size: 1.3em;}

.row .sys_cms-form-body .sys_cms-form-item input,
.row .sys_cms-form-body .sys_cms-form-item select{padding:  10px 6px; border: 1px solid #ccc;}

.row .sys_cms-form-body .sys_namesubelement input{width: 100%;}
.row .sys_cms-form-body input.sys_medium{width: 48%;}
.row .sys_cms-form-body select.sys_large  {width: 49%;}

.row .sys_form-submit{padding: 12px 16px; background: #005597; color: #fff; border: 2px solid transparent; cursor:pointer;}
.row .sys_form-submit:hover{border-color: #005597; background:none; color: #005597;}




#homepageimagewrapper {display: block; margin-bottom: 1em; position: relative; width: 100%;}
#homepageimagewrapper img.sys_bannerImage{width: 100%; height: auto;}
#homepageimagewrapper .searchcontainer {margin-top: 14px; background-color: #000; display: block; padding: 20px 10px;}

#homepageimagewrapper .sys_search-query-control{margin: 0;}
#homepageimagewrapper .sys_search-query-control input{width: 800px; margin: 0px 10px 0px 0px; font-size: 1.51em; padding: 18px 10px;border:none;}
#homepageimagewrapper .sys_search-query-control .sys_button {margin: 0; border-radius:0px; cursor:pointer; background-color: #007ca7; color: #fff; padding: 15px 8px; width:auto; display:inline-block; border: 2px solid transparent;}
#homepageimagewrapper .sys_search-query-control .sys_button:hover {background-color:transparent; border-color: #fff; color:#fff;}
     
.homepageCTAwrapper{margin-bottom: 0; margin-top: 1em;}

.homepageCTAwrapper .sys_fourColumns .sys_one,
.homepageCTAwrapper .sys_fourColumns .sys_two,
.homepageCTAwrapper .sys_fourColumns .sys_three,
.homepageCTAwrapper .sys_fourColumns .sys_four{border:none; padding: 0; margin-right: 10px; width: 24.2095%;}
.homepageCTAwrapper .sys_fourColumns .sys_four{margin-right: 0;}


.homepageCTAwrapper .sys_fourColumns a.ugStudyCTA{font-size: 1.5em; padding: 34px 80px 34px 10px;}

.homepageCTAwrapper p{margin: 0;}
.homepageCTAwrapper a span{display:block; height: 0;}

.homepageCTAwrapper a.ugStudyCTA{text-align:left; background-repeat:no-repeat; margin-bottom: 4px;background-image: url("/siteelements/images/prospectus/course-icons-new/bg-icon-white-trans-arrow-right.png"); display:block; text-decoration:none; color: #fff; background-color: #1a296b; font-size: 1.8em; line-height: 1.1em; padding: 34px 66px 34px 10px; background-position: 94% 50%;}
.homepageCTAwrapper a.ugStudyCTA:hover{text-decoration:none; color: #fff; background-color: #18194f;}
.homepageCTAwrapper a.ugStudyCTA.ugStudyEnquiry{background-image: url("/siteelements/images/prospectus/course-icons-new/bg-icon-white-trans-enquiry.png");}
.homepageCTAwrapper a.ugStudyCTA.ugStudyMortarboard{background-image: url("/siteelements/images/prospectus/course-icons-new/bg-icon-white-trans-mortarboard.png");}

#socialMediaIcons{position: absolute; top: 20px; right: 20px; z-index: 300;}
#socialMediaIcons img{margin-left: 6px; height: 28px; width: auto;}


#wrapper .sys_banner-wrapper {background: #000;}







/* Campaign layout with Video and CTA */
#videoAndCTAWrapper{position:relative; height: 440px;}

#campaignVideoAndCTA{text-align:center;}

#campaignVideoAndCTA .campaignIntro{background: #efefef; padding: 2em 14%; margin-bottom: 1em; font-size: 1.5em; color: #1a296b;}

#campaignVideoAndCTA #thevideo {width: 100%; height: 440px; position: absolute; top: 0; left: 0; z-index:1;}
#campaignVideoAndCTA .sys_video-thumbnail {display:block; width: 100%; height: 440px; z-index:2; position: absolute; top: 0; left: 0; background-size: cover; background-position: 50%;}
#campaignVideoAndCTA .sys_video {width: 100%; height: 440px; position: relative;}
#campaignVideoAndCTA .sys_video .sys_inner {padding: 45% 3em; width: auto;bottom: 0; position:absolute; top: 0; left: 0; right: 0;}
#campaignVideoAndCTA .sys_video-play {z-index: 100;position: absolute; top: 0; left: 0; right: 0; bottom: 0;}
#campaignVideoAndCTA .sys_video-play:hover {cursor: pointer;}
#campaignVideoAndCTA .sys_video-text{position:absolute; margin: auto auto; bottom: 0; right: 0; top: 0; text-align:right; width: 42%; color: #18194f;}
#campaignVideoAndCTA .sys_video-text .sys_video-title{display:none; color: #18194f; text-align:right; font-size: 1.4em; line-height: 1.2em;}
#campaignVideoAndCTA .sys_video:hover .sys_video-button{background-size: 100%; border-color: #18194f; background-color: transparent; background-image: url("/ugstudy/clearing/2017/images/decorative/bg-playbutton.png"); }
#campaignVideoAndCTA .sys_video-button {border: 2px solid transparent; background: #DE1B5C url("/ugstudy/clearing/2017/images/decorative/bg-playbutton-white.png") no-repeat; position: absolute; right: 0; bottom: 0; top: 0; left: 0; margin: auto auto; width: 70px; height: 70px; background-size: 100%;}




#videoAndCTAWrapper #CTAsection, #videoAndCTAWrapper .video{position:absolute; top: 0; bottom: 0;}
#videoAndCTAWrapper #CTAsection{float: right; width: 30%; right: 0; color: #fff; font-family: arvo;}

#videoAndCTAWrapper .video{float: left; width: 69%; left: 0;}
#videoAndCTAWrapper .campaignCTA a{background: #DE1B5C url("/Campaigns/Images/bg-whitearrow.png") no-repeat left 50% bottom 22%; font-size: 3.3rem; text-decoration:none; color: #fff; position: absolute; top: 0; left: 0; bottom: 0; right: 0; display:block; padding: 1em; border: 4px solid transparent;}
#videoAndCTAWrapper .campaignCTA a:hover{-webkit-transform: scale(0.95); -ms-transform: scale(0.95); transform: scale(0.95); transition:all 0.5s ease;}

#videoAndCTAWrapper .campaignCTA,
#videoAndCTAWrapper .campaignCTA.small{position:relative;  clear:both;}

#videoAndCTAWrapper .campaignCTA{margin-bottom: 12px; height: 100%;}
#videoAndCTAWrapper .campaignCTA.small a{background-color: #005597; padding: .8em 80px .6em .6em; font-size: 1.4rem;  height: 1.6em; background-position: top 50% right 10px; text-align:left; background-size: 30px auto; }




/* ***** MOBILE STYLES ***** */
@media only screen and (max-width: 967px) {  
#homepageimagewrapper {height: auto;}
#homepageimagewrapper .searchcontainer {position:relative; width: auto; left: 0; right: 0;}
#homepageimagewrapper .sys_search-query-control input {width: 74%;}
#homepageimagewrapper .sys_search-query-control .sys_button {width: 12%}
  
.sys_threeColumns .sys_one, 
.sys_threeColumns .sys_two, 
.sys_threeColumns .sys_three {margin-bottom: 14px; margin-left: 0; width: 32.38%;}
  
.homepageCTAwrapper .sys_fourColumns .sys_one,
.homepageCTAwrapper .sys_fourColumns .sys_two,
.homepageCTAwrapper .sys_fourColumns .sys_three,
.homepageCTAwrapper .sys_fourColumns .sys_four{margin-bottom: 14px; margin-left: 0; width: 23.9165%;}
  
.homepageCTAwrapper .sys_fourColumns a.ugStudyCTA{margin-bottom: 0;background-size: 34px; padding: 24px 50px 24px 10px;}



}





@media only screen and (max-width: 767px) {
header {height: 100px; background:none;}
header .header__logo {height: 90; width: 243px; background-image: url("/SiteElements/Images/Base/logo.png");}   

h1{font-size: 2em;}
    
#campaignVideoAndCTA .campaignIntro {background: #efefef; padding: 8px 10px; font-size: 1.25em;}
    
#videoAndCTAWrapper{height: 320px;}
#campaignVideoAndCTA #thevideo {height: 320px;}
#campaignVideoAndCTA .sys_video-thumbnail {height: 320px;}
#campaignVideoAndCTA .sys_video {height: 320px;}
    

#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA a{padding: 8% 18%;font-size: 2.4rem; background-position: bottom 18% left 50%; }
#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA.small a{height: 22px;padding: 14px 24px 14px 8px; font-size: 1.1rem; background-position: top 50% right 2px; background-size: 20px;}

.row .sys_cms-form-body .sys_namesubelement input{width: 98%;}
.row .sys_cms-form-body input.sys_medium{width: 98%;}
.row .sys_cms-form-body select.sys_large  {width: 100%;}
.row .sys_cms-form-body .sys_namesubelement{width: 100%; clear:both;}
    
    
    
    
#homepageimagewrapper {float: left; height: 100%;}
#homepageimagewrapper .searchcontainer {top: 0;}
#homepageimagewrapper .sys_search-query-control input {font-size: inherit; width: 70%; margin: 20px 0;}
#homepageimagewrapper .sys_search-query-control .sys_button {width: auto; margin: 20px 10px;}
a span {display: inline;}
#socialMediaIcons{top: 10px; right: 10px; bottom: auto;}
  
.homepageCTAwrapper .sys_fourColumns a.ugStudyCTA{background-size: 34px; padding: 20px 50px 20px 10px;}
.homepageCTAwrapper .sys_fourColumns a.ugStudyCTA span{display:none;}
   
    
}


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


h1{color: #005597; font-size: 1.6em;}
#campaignVideoAndCTA .campaignIntro {background: #fff; padding: 0; font-size: 1.2em;}
    
   
#videoAndCTAWrapper{height: 244px;}
#videoAndCTAWrapper .sys_video,
#videoAndCTAWrapper #thevideo,
#videoAndCTAWrapper .sys_video-thumbnail{width: 100%; height: 180px; }
    
#campaignVideoAndCTA #videoAndCTAWrapper #CTAsection,
#campaignVideoAndCTA #videoAndCTAWrapper .video{position: relative;display:block; margin-bottom: 1.5em; width: 100%;}
#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA {height: auto;}
#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA a{font-size: 1.8em; background-position: top 50% right 10px; position:relative; background-size: 34px; text-align:left; padding: 14px 60px 14px 10px;}
#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA a:hover{-webkit-transform: none; background-color: #9b2a68;}
#campaignVideoAndCTA #videoAndCTAWrapper .campaignCTA.small a{height: auto;font-size: 2em; padding-right: 60px; background-position: top 50% right 10px; position:relative; text-align:left; padding-left: 12px; background-size: 34px;}
  
#homepageimagewrapper .sys_search-query-control input {width: 87%; margin-bottom: 0;}
#homepageimagewrapper .sys_search-query-control input.sys_button {width: 91% ; margin-bottom: 10px;}
#socialMediaIcons{position: relative; top: 0; right: 0; display:block; background: #005597; padding: 6px;}
    
    
}