a.btn, span.btn, button.btn, .wys a.btn, .wys span.btn, .wys button.btn{ 
    display: table;
    padding: 16px 30px;
    font-size: 18px;
    border: 1px solid #73B72B;
    color: #73B72B;
    transition: all 200ms;
    font-weight: unset;
    border-radius: 5px;
    background: transparent;
}

/*button.btn.active{ background-color: #c0c0c0 }*/

a.btn:hover, span.btn:hover, button.btn:hover, .wys a.btn:hover, .wys span.btn:hover, .wys button.btn:hover{ background:#f36018; text-decoration: none; border:1px solid #f36018; color:#fff }

.paddbtm-100, .pagelayout, .pagelayout-noflex{ padding-bottom: 50px } @media ( min-width: 992px ){ .paddbtm-100{ padding-bottom: 100px } .pagelayout, .pagelayout-noflex{ padding-bottom: 80px } }

input[type="text"], input[type="password"], input[type="number"], input[type="email"], input[type="tel"], input[type="url"], input[type="color"], textarea, select{  border-color: #EBEBEB; background-color: #fff; color: #77787b }


.page--.pb{ padding-bottom: 40px } .main .sidebar, .main .page-panel{ margin-top: 20px } .main .page-panel.page-heading+.page-panel{ margin-top: 20px }
.page-panel{ padding-right: 20px; padding-left: 20px }
.mainbar>.page-panel{ padding-right: 0; padding-left: 0 }
.page-panel.panel-bgcolour{ padding-top: 30px ; padding-bottom: 30px }

@media( max-width: 767px ){
 .page-panel .row>div+div{ margin-top: 40px }
}

@media( min-width: 992px ){
 .page--.pb{ padding-bottom: 80px } .main .sidebar, .main .page-panel{ margin-top: 40px } .main .page-panel.page-heading+.page-panel{ margin-top: 20px }
 .page-panel.panel-bgcolour{ padding-top: 60px ; padding-bottom: 60px }
 .page-panel .banners{ padding:0; margin-bottom: 0; }
 .page-panel .row>div .wys:nth-child(n + 2) { padding-top: 30px; } 
 .page-panel .row>div .wys.add-icon::before{ content:""; display: block; width: 50px; height: 50px; float: left; margin-right: 20px; background-image: url('../images/SVS_Logo_White_out.svg'); background-size: cover; }
 .page-panel .row>div .wys.add-icon>*{ width: calc(100% - 70px); float: left; }
}


@media( max-width: 1200px ){ .page-panel{ padding-right: 40px; padding-left: 40px; } }

/* .pagelayout */

.pagelayout .sidebar{ min-height: 49px; padding-bottom: 30px }
@media ( max-width: 991px ){
 .pagelayout .sidebar ul.loading{ display: none }
}
@media ( min-width: 992px ){
 
 .pagelayout{ display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap }
 .pagelayout .sidebar, .pagelayout .mainbar{ width: 100% } 
 .pagelayout .sidebar{ max-width: 350px; padding-right: 80px }
 .pagelayout .sidebar+.mainbar{ max-width: calc( 100% - 350px ) }
 .pagelayout .sidebar form.loading{ display: none }
      
}

.pagelayout .sidebar ul li>a{ transition: all .3s; font-size: 18px; text-transform: uppercase; color: #303641;}
.pagelayout .sidebar ul a, .pagelayout .sidebar ul span{ display: block; padding: 7px 20px }

.pagelayout .sidebar ul li.level-0>a{ display: none; }
.pagelayout .sidebar ul li.level-0>span{ color: #f36018 !important; text-transform: uppercase; font-weight: bold; }

.pagelayout .sidebar ul li.active>a, .pagelayout .sidebar ul li.active>span, .pagelayout .sidebar ul li:hover>a, .pagelayout .sidebar ul li:hover>span{ color:#73B72B }

.pagelayout .sidebar ul li.active.active-parent>a, .pagelayout .sidebar ul li.active.active-parent>span{ background-color: transparent }
.pagelayout .sidebar ul li.level-2>a, .pagelayout .sidebar ul li.level-2>span{ padding-left: 5px }

/* Home page */

.page--.page-home .previews{ padding: 20px 0 }
.page--.page-home .previews a.h2{ display: inline-block; margin-bottom: 20px; color: #221e1f }
.page--.page-home .previews a.btn{ display: block; padding-top: 12px; padding-bottom: 12px; font-size: 1.0625rem; text-align: center; background-color: #fcf20e; color: #000 }
.page--.page-home .previews .snippet .wys, .page--.page-home .previews .event-preview .events{ margin-bottom: 20px }
.page--.page-home .home-page .page-panel{ margin-top: 0; margin-bottom: 0; padding-top: 20px; padding-bottom: 20px }
.page--.page-home .home-page{ background-color: #f1f1f2 }
.page--.page-home .home-page .home-column{ padding: 20px; background-color: #FFF }
@media( max-width: 991px ){
 .page--.page-home .previews .container>.row>div+div{ margin-top: 20px }
}
@media( min-width: 992px ){
 .page--.page-home .previews,.page--.page-home .home-page .page-panel{ padding-top: 40px; padding-bottom: 40px  }
 .page--.page-home .previews .container>.row>div+div{ border-left: solid #a7a9ac 1px }
 .page--.page-home .previews .snippet .wys, .page--.page-home .previews .event-preview .events{ min-height: 100px }
 .page--.page-home .previews .news-letters, .page--.page-home .previews .event-preview{ padding-bottom: 4px } 
 .page--.page-home .home-page .home-column{ min-height: 100%; min-height: 100%; padding: 20px 23px }
 
 
 .page--.page-home .previews a.btn{ position: relative; backface-visibility: hidden; overflow: hidden; z-index: 1 }
 .page--.page-home .previews a.btn:before{ display: block; content: ''; position: absolute; top: 100%; right: 0; bottom: 0; left: 0; background-color: rgba( 0, 0, 0, .1 ); z-index: -1; -webkit-transition: top 200ms ease; transition: top 200ms ease }
 .page--.page-home .previews a.btn:HOVER:before{ top: 0% }
 
 
}

/* Heading Text */

.page-panel .wys+.wys{ margin-top: 20px }
.wys-heading-text{ position: relative; border-top: solid #f36018 1px }
.wys-heading-text a.open-content{ display: block; width: 50px; height: 50px; background-color: transparent; position: absolute; top: 14px; right: 0 }
.wys-heading-text:not( .open ) a.open-content:before, .wys-heading-text a.open-content:after{ content: ''; display: block; position: absolute; background-color: #f36018 }
.wys-heading-text:not( .open ) a.open-content:before{ width: 3px; height: 20px; top: 5px; left: 50%; margin-left: -1.5px }
.wys-heading-text a.open-content:after{ width: 20px; height: 3px; top: 13px; left: 50%; margin-left: -10.5px }

.wys-heading-text .content{ max-height: 0; overflow: hidden; -webkit-transition: ease max-height 700ms; transition: ease max-height 700ms }
.wys-heading-text.open .content{ max-height: 4000px }

.wys-heading-text>.open-content+h2, .wys-heading-text>.open-content+h3, .wys-heading-text>.open-content+h4{ padding-right: 60px; line-height: 24px; font-size: 22px; margin-top: 15px;  }
.page-panel .row>div .wys.wys-heading-text:nth-child(n + 2){ padding-top: 0px; }

@media ( min-width: 992px ){
 .page-panel .wys+.wys{ margin-top: 40px }
 .page-panel .wys.wys-heading-text+.wys.wys-heading-text{ margin-top: 14px }
}

@media ( max-width: 991px ){
  .wys-heading-text.open .content{ max-height: 5000px }
}


/* Snippet Panel */

.snippet-- .snippet{ padding: 40px 0 }
@media( min-width: 992px ){
 .snippet-- .snippet{ padding: 80px 0 }      
}

/* Snippet Panel - Styling */

.snippet--.homep-snippet-1 .snippet{ background-color: #e2f3f6 }
.snippet--.homep-snippet-2 .snippet{ background-color: #44c8f5 }

/* Event preview */

.event-preview .event{ position: relative; padding-left: 91px } .event-preview .event:after{ display: table; content: ''; clear: both }
.event-preview .event .date{ float: left; width: 56px; margin-left: -70px; text-align: center; padding: 6px 0; background-color: #44c8f5; color: #fff; font-size: 0.75rem; line-height: 1.7em }
.event-preview .event .date b{ display: block; color: #fcf20e; font-size: 1.375rem }
.event-preview .event .summary{ font-size: 0.875rem; line-height: 1.5em }
.event-preview .event .summary b{ font-weight: 400 }
@media( max-width: 991px ){
 .event-preview .event+.event{ margin-top: 20px }
}

/* News preview */

.news-preview{ padding: 20px 0 }
.news-preview h2{ margin-bottom: 40px; text-align: center }
.news-preview .news{ position: relative } .news-preview .news:after{ display: table; content: ''; clear: both }
.news-preview .news{ margin-bottom: 40px }
.news-preview .news.has-image{ position: relative; padding-left: 220px }
.news-preview .news a.btn{ padding-top: 6px; padding-bottom: 6px }
.news-preview .news .image{ float: left; width: 180px; margin-left: -220px }
html:not( .brw-ie ) .news-preview .news .image img{ width: 180px; height: 180px; object-fit: cover }

@media( min-width: 992px ){
 .news-preview{ padding: 40px 0 }
}

/* Banners */

.banners{ margin-top: 40px; padding: 0 20px }
.banners .box{ height: 100%; position: relative; transition: all .2s ease-in-out; }
.banners .box:hover{ transform: scale(1.1); }
.banners .banner a, .banners .banner span{ display: block }
.banners .banner .btn{ display: table; margin: 20px auto -50px auto; border: 1px solid #fff; color: #fff; background: transparent; transition: all 1s; }
.banners .banner a:hover .btn{ background-color: #f36018; }
.banners .banner a.box, .banners .banner span.box{ color: #303641 }
.banners .banner a.box.dark, .banners .banner span.box.dark{ color: #FFF }
.banners .banner .img-bg{ padding-bottom: 40%; background-size: 250px; background-size: contain; }
.banners .banner .ContentContainer{ 
    display: table;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    text-align: center;
}

.banners .banner .content{ 
    display: table-cell;
    vertical-align: middle;
    padding: 0 45px;
}

.banners .banner .set-bg{ 
    top: 5px;
    bottom: 0;
    left: 5px;
    right: 0;
    position: absolute;
    width: calc(100% - 110px);
    height: calc(100% - 110px);
    margin: 50px;
}

.banners .banner .set-bg-shaped{ 
    top: 0px;
    bottom: 0;
    left: 0px;
    right: 0;
    position: absolute;
    height: 100%;
}

.banners .banner .set-bg.no-img{ 
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    margin: 0;
}


.banners .banner .content b{ 
    font-family: 'PlayfairDisplay-Bold', 'Open Sans'; font-size: 30px; letter-spacing: .5px;
}


.banners .hexagon {
    /* background: url(../images/C2HexagonLandscape.svg); */
    background-size: cover;
    /* background-position: center; */
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 100;
}

.page-panel .banners .row>div:first-child{ padding-left: 20px; }
.page-panel .banners .row>div:last-child{ padding-right: 20px; }

.page-home .banners.banner-cols-3>.row>.banner:nth-child(2){ padding: 0 20px; }

.banners .ContentUnder.banner .ContentContainer{ display: table; width: 100%; height: auto; position: relative; top: 0; left: 0; right: 0; bottom: 0; text-align: center; }
.banners .ContentUnder.banner .ContentContainer .content{ display: table-cell; vertical-align: top; text-align: center; width: 100%; padding-top: 20px; font-weight: bold; }
.banners .ContentUnder.banner .ContentContainer .content > b{ font-weight: bold; text-transform: uppercase; }


@media( min-width: 992px ){
    .banners{ margin: 40px 0; padding: 0 70px }
}
@media screen and (max-width: 1600px){
    .banners .banner .content b{ font-size: 26px; }
}
@media screen and (max-width: 1200px) and (min-width: 992px){
    .banners .banner .content b{ font-size: 20px; }
    .banners .banner .btn { margin: 10px auto -55px auto; }
}
@media screen and (max-width: 1400px) and (min-width: 992px){
    .banners{ margin: 80px 0; padding: 0 100px }
}
@media screen and (max-width: 1250px) and (min-width: 767px){
    .banners {
        margin: 0;
        padding: 0 20px;
    }
}
@media screen and (max-width: 992px) and (min-width: 767px){
    .banners { 
        margin-top: 20px;
    }

}

@media( max-width: 767px ){.banners .banner+.banner{ margin-top: 40px } }
@media screen and (max-width: 1200px) and (min-width: 767px){
    .banners .banner{ margin-top: 0px; padding: 0 5px; }   
    .banners .banner .content b{ font-size: 18px; }
}
@media screen and (max-width: 991px) and (min-width: 767px){
.banners .banner .img-bg{ padding-bottom: 50%; background-size: 250px; background-size: contain; }
}

@media( max-width: 450px ){ .banners .banner .content{ padding: 20px 65px; font-size: 14px;} .banners .banner .content b{ font-size: 22px;} }
@media( max-width: 360px ){ .banners .banner .content{ line-height: 18px; } .banners .banner .btn{ margin-top: 10px; } }


/* Banners & Carousel Banners */

.banner .box{ padding-bottom: 14px; text-align: center; color: #221e1f } .banner .box.dark{ color: #FFF }
.banner span.content{ display: block }
.banner span.content b{ font-size: 1.25rem; font-weight: 400 }
.banner span.img-bgX{ padding: 0; width: 70px; height: 70px; margin: 0 auto }

/* Sliding testimonials */

.testimonials--{ padding: 40px 0 10px 0; text-align: center }
.testimonials-- h2{ margin-bottom: 20px }
.testimonials-- .testimonials-container{ position: relative; margin-top: 40px; padding: 0 60px }
.testimonials-- .clip{ overflow: hidden; margin-left: -10px; margin-right: -10px }
.testimonials-- .reel{ display: flex; position: relative; left: 0  }
.testimonials-- .testimonial{ -webkit-box-flex: 0; -webkit-flex: 0 0 200%; -ms-flex: 0 0 200%; flex: 0 0 200%; max-width: 200%; padding-right: 100% }
@media ( min-width: 992px ){
 .testimonials--{ padding: 60px 0 40px 0 }
 .testimonials-- h2{ margin-bottom: 40px }
}

/* Sliding testimonials - Styling */
.testimonials--{ background-color: #bce0fd }
.testimonials-- .testimonial .padding{ display: inline-block; margin-top: 40px; padding: 30px; border-top: solid #444 2px }
.testimonials-- .testimonial .image{ height: 140px; background-size: contain; background-position: center; background-repeat: no-repeat }

/*  Sliding testimonials - Arrows */

.testimonials-- a.arrow{ position: absolute; top: 50%; margin-top: -25px }
.testimonials-- a.prev.arrow{ left: 20px }
.testimonials-- a.next.arrow{ right: 20px }


/* Accreditations */

.accreds--{ padding: 40px 0; text-align: center }
.accreds-- h2{ margin-bottom: 20px }
.accreds-- .accreds-container{ position: relative; padding: 0 60px }
.accreds-- .clip{ overflow: hidden; margin-left: -10px; margin-right: -10px }
.accreds-- .reel{ display: flex; position: relative; left: 0  }
@media ( min-width: 992px ){
 .accreds--{ padding: 60px 0 }
 .accreds-- h2{ margin-bottom: 60px }
}

.accreds-- .accreditation{ -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; padding: 0 10px }
@media ( min-width: 576px ){
 .accreds-- .accreditation{ -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50% }
}
@media ( min-width: 768px ){
 .accreds-- .accreditation{ -webkit-flex: 0 0 33.3333%; -ms-flex: 0 0 33.3333%; flex: 0 0 33.3333%; max-width: 33.3333% }
}
@media ( min-width: 992px ){
 .accreds-- .accreditation{ -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25% }
}
@media ( min-width: 1200px ){
 .accreds-- .accreditation{ -webkit-flex: 0 0 20%; -ms-flex: 0 0 20%; flex: 0 0 20%; max-width: 20%; padding: 0 10px }     
}

/* Accreditations - Styling */
.accreds-- .accreditation span.padding, .accreds-- .accreditation a.padding, .accreds-- .accreditation span.image{ display: block }
.accreds-- .accreditation .padding{ padding: 0 }
.accreds-- .accreditation .image{ height: 140px; background-size: contain; background-position: center; background-repeat: no-repeat }

@media ( min-width: 1400px ){ 
 .accreds-- .accreds-container{ padding: 0  }      
}

/* ccreditations - Arrows */
.accreds-- a.arrow{ position: absolute; top: 50%; margin-top: -25px }
.accreds-- a.prev.arrow{ left: 20px }
.accreds-- a.next.arrow{ right: 20px }

/* Registration Form */


.page-webform .page-heading{ text-align: center }
.page-webform .shaded-area{ background-color: #F2F4F7; padding: 40px 20px }
.page-webform .registration-form{ max-width: 800px; margin: 0px auto 0px auto; }

.add-padding{ color: #f36018; margin: 40px 0; }

@media( min-width: 992px ){
 .page-webform .shaded-area{ margin-top: 40px; padding-bottom: 80px }
}


/* Google Map */

.google-map{ height: 100vh; margin-top: 40px }
@media( max-width: 991px ){
 .googlemap--{ padding-right: 30px }
}
@media( min-width: 992px ){
 .google-map{ height: 600px; margin-top: 80px }
}





