﻿/* accordion tweaks 16/04/2019 - ulzgw */
#content .sys_GenericAnswerShowHide{border-color: #b2cce0;}
#content .sys_GenericQuestionShowHide{border-color: #b2cce0; padding: 1.075rem 1.075rem 0.75rem 0.875rem;}
#content .sys_GenericAnswerShowHide{ padding: 0.875rem; margin: 0 0 .5625rem 0;}

/* Event page */
#content #wonderEventPage .sys_wonderImageTitle{position: relative;}
#content #wonderEventPage h1{color: #005597; margin: 0 0 10px 0; padding:  0; font-size: 2em;}
#content #wonderEventPage .sys_wonderImageTitle h1{position: absolute; background: #fff; color: #005597; bottom: 0; left: 0; margin: 0; padding: 10px 10px 10px 0;}
#content #wonderEventPage .sys_wonderImageTitle img{width: 100%; height: auto;}
#content #wonderEventPage .sys_wonderTime {margin-bottom: 10px;color: #005597; padding: 0; font-size: 1.3em;  line-height: 1.5;}
#content #wonderEventPage .sys_wonderDescription.largeText{margin-bottom: 10px;background: #efefef; padding: 10px; font-size: 1.3em; line-height: 1.5;}
#content #wonderEventPage .sys_wonderEventAttribute {display:block; margin-bottom: 10px;} 
#content #wonderEventPage .sys_wonderWarning {padding: 8px 8px; line-height: 1.5em; color: #18194f; padding-left: 40px; background: #f1d6bd url("/wonder/images-multimedia/decorative/icon-warning.png") no-repeat 8px 50%; background-size: 24px;}

#content #WonderEventList .sys_wonderEvent{margin-bottom: 1em; border-bottom: 1px solid #005597; padding-bottom: 1em;}
#content #WonderEventList .sys_wonderEventAttribute {display:block; padding: 0;margin-bottom: 4px;}
#content #WonderEventList h2{margin-top: 0;}
#content #WonderEventList .sys_wonderTitle{color: #005597; margin: 0; font-size: 1.4em;}
#content #WonderEventList a.sys_wonderTitle h3{color: #005597; text-decoration:none;}
#content #WonderEventList a.sys_wonderTitle{text-decoration:none; }
/*#content #WonderEventList .sys_wonderImage{width: 160px; height: 200px; background-size: auto 100%; background-position: 50% 50%; background-repeat:no-repeat;}*/

#content #WonderEventList .sys_wonderTime {color: #005597; padding: 0; font-size: 1.2em;}

#content #WonderFilter ul{padding: 0; float: none;}
#content #WonderFilter ul li {display:inline-block; list-style-type:none; margin: 0 0px 5px 0;}
#content #WonderFilter ul li a{color: #1a296b; background: #efefef;display:block; border: 1px solid #005597; padding:10px 12px; text-decoration:none;}
#content #WonderFilter ul li a:hover{background: #1a296b; text-decoration:none; color: #fff; border-color: #005597}


#content .largeText{font-size: 1.5em; line-height: 1.75;}

/* Listing page hack to hide descrition that is output to aid searching ulzag 24/4/19 */
.onlyForSearchPurposes {
    display: none;
}



#bottom {display:none;} 


#wrapper #bottom{width: 100%; background-color: #e6e7e8; color: #353535; border:none;}
#wrapper #bottom h2, #bottom a{color: #353535;}


#wrapper #content .sys_boxWithDottedBorder {width: 100%;}


#WonderBanner,
#WonderBanner h1{color: #fff; }
#WonderBanner h1{font-size: 1.3em; line-height: 1.15em; margin-bottom: 1em;}
#WonderBanner h1 strong{font-size: 2.1em; line-height: 1.4em; margin-bottom: 1em;}

#WonderBanner strong{font-size: 1.4em; }

#WonderBanner .sys_twoColumns_3070{background: #18194f; padding: 0;}
#WonderBanner .sys_twoColumns_3070 div{margin: 0;}
#WonderBanner .sys_twoColumns_3070 .sys_one_3070{padding: 20px;}
#WonderBanner .sys_twoColumns_3070 .sys_two_3070{width: 66.65%; text-align:right;}
#WonderBanner .sys_twoColumns_3070 .sys_two_3070 img{width: 100%; height: auto; text-align:right;}
#content #WonderBanner a.CTA-EventCalendar{font-size: 1.2em; font-weight:bold; background-color: #007ca7;}
#content #WonderBanner a.CTA-EventCalendar:hover{background-color: #009bbd;}




#wrapper #content .largeText{font-size: 1.8em; line-height: 1.4em; color: #007ca7; padding: .5em 0; margin-bottom: .5em;}


#content ul.fancyList {border-bottom: 1px solid #e6e7e8; padding: 0 0 .5em 0; margin-bottom: 1em;}
#content ul.fancyList li{list-style-type:none; margin: 0; width: 100%;}
#wrapper #content ul.fancyList li a{background: transparent url("/it-services/images/decorative/bg-arrow-right.png") no-repeat scroll right 10px top 50% / 12px auto; text-decoration:none; display:block; border-bottom: 1px solid transparent; padding: 8px 50px 8px 4px;}
#wrapper #content ul.fancyList li a:hover{text-decoration:none; background-color: #e6e7e8; border-color: #e6e7e8;}



#wrapper #content ul.fancyList li a.CTA-plainDownloadFile{font-size: inherit; color: inherit; border:none; background-image: url("/it-services/images/decorative/bg-icon-download.png"); background-size: 24px auto;}
#wrapper #content ul.fancyList li a.CTA-plainDownloadFile:hover{color: #000;}


/**** tweaks to table - removal of alternative row colours - ulzgw - 17/04/2019 ****/
#content .filteredTableInputWrapper{padding: 12px; background: #b2cce0; margin-bottom: .5rem;}
#content .filteredTableInputWrapper input{padding: 8px; border: none;}
#content .filteredTableInputWrapper label{color: #18194f; font-weight:bold;}
#content table tbody tr:first-child th {background-color: #18194f; font-size: 1rem; padding: 14px 8px;}
#content table th *{color: #007ca7; margin: 1.8rem 0 .4rem 0;}
#content table th.tableDateHeader{background: #fff;}
#content table th{border:none;}
#content table tr, 
#content table tr td {border-left: none; border-right: none; border-top: none; border-bottom: 1px solid #ccc;}
#content table tr:hover td, #content table tr.sys_alt:hover td,
#content table tr:active td, #content table tr.sys_alt:active td{background: #eee;}
#content table td, #content table tbody tr.sys_alt td{background-color: inherit; border: inherit;}




.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;
}




/**** tweaks to rotating banner - ulzgw - 16 May 2019 ****/
#wrapper #content .banner .slide__text{width: 50%;}
#wrapper #content .banner .slideHeading h2::first-line{font-weight:bold; }
#wrapper #content .banner .subText{border-top: 2px solid #fff; padding-top: 10px;width: auto; font-weight:bold; font-size: 1.2rem; line-height: 1.6rem;}













#content .sys_jumpLinkList {list-style-type:none;}
#content .sys_jumpLinkList li{display:inline-block; margin: 0 0 .5em 0;}
#content .sys_jumpLinkList li::after{content:" / "; color: #ccc;}
#content .sys_jumpLinkList li:last-child::after{content:""}
#content .sys_jumpLinkList li a{}
#wrapper #content .sys_jumpLinkList li a:hover{text-decoration:none; border-color: #000;}

#wrapper #content .sys_boxWithDarkBackground{background: #18194f;}


/* VIDEO STYLES*/
#content .sys_video{width: 100%; height: 443px; margin-bottom: 1rem;}
#content .sys_video .sys_video-thumbnail{width: 100%; height: 100%;}
#content .sys_video #thevideo{height: 443px;}


/* Table fix - uses the responsive fix */

.responsivetable {
    clear: both;
    display: block;
    margin-bottom: 2em;
    max-width: 100%;
    overflow-x: scroll;}

@media screen and (max-width: 967px) {
.homepageVideo{width: auto; height: 498px;}

    
  
}



@media screen and (max-width: 767px) {
#content .sys_video{width: 100%; height: 266px; }
#content .sys_video #thevideo{height: 266px;}

  
/**** tweaks to rotating banner - ulzgw - 16 May 2019 ****/
#wrapper #content .banner .slide__text{width: auto;}
#wrapper #content .banner .subText{border: none; padding-top: 0;font-size: 1.1rem; line-height: 1.5rem;}
  
  

}


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

#content .sys_video{width: 100%; height: 266px; }
#content .sys_video #thevideo{height: 266px;}

}


