﻿#pgFilterPanel.pgFunding{}
#pgFilterPanel.pgFunding .inner{padding: 1em;}
#pgFilterPanel.pgFunding select{width: 100%; padding: 12px 6px; border-color: #1a296b; margin: 0 0 .4em 0;}
#content input[type=checkbox]{padding: 0; margin: 0}

#pgFilterPanel.pgFunding .pgFilterBox {width: 31%; padding: 0 3% 20px 0;}
#pgFilterPanel.pgFunding .pgFilterBox.pgMode {padding-right: 0;}

#pgFilterPanel.pgFunding .pgFilterBox.pgInclude{}
#pgFilterPanel.pgFunding .pgFilterBox.applyFilter{display:block;float:right; margin: 0; width: 31%;

padding-right: 7px;}
#content #pgFilterPanel.pgFunding .applyFilter .CTA-ArrowRoundRight{padding: 14px 60px 14px 8px; background-color: #007ca7;}
#content #pgFilterPanel.pgFunding .applyFilter .CTA-ArrowRoundRight:hover{background-color: transparent;}





#pgFilterPanel.pgFunding .sys_searchbox{display:block; width: 97.5%; margin-bottom: 14px; border-color: #18194f;}

#pgFilterPanel.pgFunding h2{font-size: inherit; font-weight:bold; margin-bottom: 4px;}



#pgFilterPanel{background: #efefef; margin-bottom: 1.5em; float:left; width: 100%;}
#pgFilterPanel .pgFilterBox{padding: 2%; float:left; width: 15%;}
#pgFilterPanel .subject{padding: 2%; width: 50%; margin-left: 2%;}


#pgFilterPanel .applyFilter .filterButton{background-image: url("/siteelements/images/base/internal/cta-icons/white/bg-icon-white-right-arrow.png");
  font-weight:bold; 
  display:block; 
  text-decoration:none; 
  height: auto; 
  clear:both;
  background-color: #007ca7;
  color: #fff; 
  text-align:left; 
  padding: 10px 60px 10px 8px; 
  background-size: 18px auto; 
  background-position: right 10px top 50%; 
  background-repeat:no-repeat; 
  margin-bottom: 4px;
  border: 2px solid transparent;
  float:right; }


#content #pgFilterPanel .applyFilter .filterButton:hover {background-color: transparent; color: #18194f; border-color: #18194f; text-decoration:none; background-image: url("/siteelements/images/base/internal/cta-icons/Colour/bg-icon-blue5-right-arrow.png");}

#pgFilterPanel #levelSelect input, #pgFilterPanel #yearSelect input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
    }

#pgFilterPanel #levelSelect .radiobutton, #pgFilterPanel #yearSelect .radiobutton {
  position: absolute;
  left: 0px;
  top: 2px;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border: 1px solid #18194f;
  border-radius: 50%;
  
}


#pgFilterPanel #levelSelect label, #pgFilterPanel #yearSelect label{
	position: relative;
    top: 0;
    left: 0;
	display: block;
	padding: 5px 3px 5px 28px;
	cursor: pointer;
    font-weight:normal;}



/* On mouse-over, add a grey background color */
#pgFilterPanel #levelSelect input:hover ~ .radiobutton, #pgFilterPanel #yearSelect input:hover ~ .radiobutton{border-color: transparent; background-color: #007ca7;}

#pgFilterPanel #levelSelect input:checked ~ .radiobutton, #pgFilterPanel #yearSelect input:checked ~ .radiobutton {background-color: #18194f;}
#pgFilterPanel #levelSelect .radiobutton:after, #pgFilterPanel #yearSelect .radiobutton:after {content: ""; position: absolute; display: none;}

#pgFilterPanel #levelSelect input:checked ~ .radiobutton:after, #pgFilterPanel #yearSelect input:checked ~ .radiobutton:after {display: block;}

/* Style the indicator (dot/circle) */
#pgFilterPanel #levelSelect .radiobutton:after, #pgFilterPanel #yearSelect .radiobutton:after {
  top: 6px;
  left: 6px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
}

#pgFilterPanel label {margin-right: 1em;}
#pgFilterPanel .subject label{position:absolute; top: 0; visibility:hidden;  font-weight:500;}
#pgFilterPanel .subject select{padding: 12px 6px; border-color: #1a296b; margin: 0 0 1em 0; width: 100%}

#content #pgSearchFilterList .courseCard h3{border-bottom: 2px solid #efefef; width: auto; display:inline; margin-bottom: 1em;}

#content #pgSearchFilterList .courseCard:hover h3{border-color: #005597;}
#content #pgSearchFilterList .courseCard {border-right: 1px solid #ddd; position:relative;}
#content #pgSearchFilterList .courseCard a{position:absolute; top: 0; left: 0; right: 0; bottom: 0; color: transparent;}
#wrapper #content #pgSearchFilterList .courseCard a:hover{color: transparent;}


#content #pgSearchFilterList .courseCard .courseInfo{padding: 1em;}
#content #pgSearchFilterList .courseCard .courseDescription{border-right: 2px solid #efefef; padding: 1em;}
#content #pgSearchFilterList .courseCard .courseDescription div{display:block; margin-top: .8em;}

#wrapper #content #pgSearchFilterList .courseInfo h4:first-child{margin: 0;}
#wrapper #content #pgSearchFilterList h4{margin: .7em 0 0 0;}


#content #pgSearchFilterList .courseCard {
    width: auto;
    border: 2px solid #efefef;
    padding: 0;
    margin: 2em auto;
    display: grid;
    display:-ms-grid;
    grid-template-columns:70% auto;
    -ms-grid-columns:70% auto;
}

#content #pgSearchFilterList .courseDescription {
    -ms-grid-column: 1;    
}

#content #pgSearchFilterList .courseInfo {
    -ms-grid-column: 2;    
}

#toolBar {
    border: none;
}

.sys_factfileItem {
    width: 100%;
    display: table;
    background-image: none !important;
    margin-bottom: 2px;
}
.sys_factfileLabel, .sys_factfileTextField {
    border: 1px solid #EFEFEF;
    vertical-align: middle;
    padding: 10px 6px;
    display: table-cell;
    margin-bottom: 2px;
}
.sys_factfileLabel {
    background-color: #EFEFEF;
    width: 38.5%;
    font-weight: bold;
    color: #18194f;
}

#content .sys_factfileTextField p {
    margin-bottom: 0;
}
.showhideIsClosed p, .showhideIsOpen p {width: 90%;}
.sys_detailImage {
    min-height: 74px;
    position: relative;
    margin-bottom: 1em;
}
.sys_detailImage img {
    width: 100%;
    height: auto;
}
.sys_detailImage h1 {
    color: #005597;
    font-size: 2em;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #fff;
    margin-bottom: 0;
    padding: 12px 16px 12px 0;
    max-width: 80%;
}
#wrapper #content a.CTA-Arrow, #wrapper #content a.CTA-ArrowRoundRight, #wrapper #content a.pgStudyCTA, #wrapper #content a.ugStudyCTA, #wrapper #content #pgStudyteaching a, #wrapper #content #pgStudyApply a, #wrapper #content #pgStudyDownload a, #wrapper #content #pgStudyDownloadChina a, #wrapper #content #contactWeb a, #wrapper #content a.pgStudyJumpLinkChina, #content #pgStudyRPA a, #wrapper #content #contactTel a {
    background-image: url("/SiteElements/Images/Base/Internal/CTA-icons/White/bgArrowWhiteRound.png");
    background-color: #007ca7;
    border: 2px solid transparent;
    font-weight: bold;
    display: block;
    text-decoration: none;
    height: auto;
    color: #fff;
    text-align: left;
    padding: 10px 60px 10px 8px;
    background-size: 18px auto;
    background-position: right 10px top 50%;
    background-repeat: no-repeat;
    margin-bottom: 4px;
}
.possibleMultiple:not(:last-of-type)::after {
    content: ", ";
}
#wrapper #content h3.relatedCourses {
    margin-bottom: 0px;
}
#wrapper #content .relatedCourses a:link {
    display: block;
    text-decoration: none;
    padding: 6px;
}
#wrapper #content .relatedCourses a:hover {
    color: #fff;
    background-color: #005597;    
}
.introParagraph {
    font-size: 1.6em;
    color: #18194F;
    font-weight: normal;
    margin-bottom: 2em;
}
.introParagraph ul, .introParagraph ol{
    list-style: none outside none;
    font-size: inherit;
    margin: 0 0 1em 0;
    padding-left:5px;
}
.introParagraph ul li, .introParagraph ol li{
    margin-left: 30px;
    margin-bottom: .5em; 
    list-style-position:outside;
}
.introParagraph ul li{
    list-style-type:square;
}
.introParagraph ol li{
    list-style-type:decimal;
}
#content p.moduleDisclaimer {
    font-size:0.9em !important;
    color: #666;
}
.studentQuote {
    display: grid;
    grid-template-columns: 2fr 3fr;
    margin: 3em 0;
}
.studentQuoteFullWidth {
    display: block;
    margin: 3em 0;
}
blockquote {
    border: none;
    padding-left: 80px;
    font-size: 1.6em;
    line-height: 1.2em;
}
blockquote::before {
    width: 60px;
    height: 60px;
    background-size: 60px;
}
.blockquoteImage {
    position: relative;
    display: inline-block;
    width: 250px;
    max-height: 250px;
}

.blockquoteImage img {
    width: 100%;
    max-width: 250px;
    height: auto;
    display: block;
    position: relative;
    z-index: 2;
}

.blockquoteImage::before {
    content: "";
    display: table;
    clear: both;
}

.blockquoteImage::after {
    position: absolute;
    top: -25px;
    right: -25px;
    width: 100%;
    height: 100%;
    display: block;
    border: solid 6px #009bbd;
    z-index: 1;
    content: "";
}

.studentQuote cite {
    margin-top: 1em;
    color: #009bbd;
}
.courseVideoContainer {
    position: relative;
    overflow: hidden;
    padding-top: 61.5%;
    margin: 1em 0;
}
.courseVideoIframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}
#content #SearchResults_List .sys_itemslist .sys_subitem:nth-child(even),
#content #AZListing_List.sys_datarepeatercontrol .sys_itemsList .sys_subitem:nth-child(even) {
    background-color: #eee;
}

#content ul li, #content ol li {margin-left: 30px;margin-bottom: .5em; list-style-position:outside;}
#content ul li li, #content ol li li{margin-top: .5em;}
#content ul li{list-style-type:square;}
#content ol li{list-style-type:decimal;}

@media screen and (max-width: 767px){
.studentQuote, .studentQuoteFullWidth {
    display: block;
    margin: 1em 0;
}
.studentQuote {
    margin-top:3em;
}
.sys_detailImage h1, .introParagraph {
    margin-left: 0.5em;
}
    
    
    
    
    
   #pgFilterPanel.pgFunding .pgFilterBox {width: 100%; padding: 0 0 10px 0;}
    
    #pgFilterPanel.pgFunding .pgFilterBox.applyFilter{width: 100%; float:left;}
    
    
   #pgFilterPanel .pgFilterBox{margin-bottom: .5em; width: 90%;}
#pgFilterPanel .subject{width: 90%; margin: 0; } 
   
    
  
#content #pgSearchFilterList .courseCard {
    width: auto;
    border: 2px solid #efefef;
    padding: 0;
    margin: 2em auto;
    display: block;
}
    #content #pgSearchFilterList .courseCard .courseInfo{display:block; width: 100%; padding-top: 0;}
    
    #wrapper #content #pgSearchFilterList .courseDescription{border:none;}

    
    
    
  body #wrapper #content .sys_search-query-control input{margin-right: 1%; width: 66%; display: inline-block; padding: 14px 3%;}
body #wrapper #content .sys_search-query-control .sys_button {width: 25%; padding: 13px 3%; margin-right: 0; display:inline-block;}

    
}






#content .opendayPromo {
    margin-bottom: 1em;
}
#content .opendayPromo a, #content .otherYearLink a {  
background-image: url("/siteelements/images/base/internal/cta-icons/white/bg-icon-white-right-arrow.png");
font-weight: bold;
display: block;
text-decoration: none;
height: auto;
clear: both;
color: #fff;
text-align: left;
padding: 10px 60px 10px 8px;
background-size: 18px auto;
background-position: right 10px top 50%;
background-repeat: no-repeat;
margin-bottom: 4px;
border: 2px solid transparent;
}
#content .opendayPromo a {
background-color: #DE1B5C;
}
#content .otherYearLink a {
background-color: #007ca7;
}
#content .opendayPromo a:hover, #content .otherYearLink a:hover {
background-color: transparent;
color: #18194f;
border-color: #18194f;
text-decoration: none;
background-image: url("/siteelements/images/base/internal/cta-icons/Colour/bg-icon-blue5-right-arrow.png");
}

