/* ================================= */
/* Body and Universal Reset */
/* ================================= */

* {
    margin:  0;
    padding: 0;
}

html {
    background: #282828;
    min-height: 100%;
}

body {
    background: #FFFFFF;
    height:     auto;
    position:   relative;
}

#container {
}

#popupWindowCaller {
    display: none;
}

.clear {
    clear:  both;
    width: 100%;
}

img {
    border: none;
}

::selection {
    background: #393E42;
    color:      #FFFFFF;
}

::-moz-selection {
    background: #393E42;
    color:      #FFFFFF;
}

.video_iframe {
    width: 100%;
    height: 0;
    padding-top: 56.25%;
    position: relative;
    margin-bottom: 20px;
}

.video_iframe iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* Hover transitions */

/* In-active opacity transition */
.resourcesListingThumb .arrow_overlay,
.learningsListingThumb .arrow_overlay,
.widget_title {
    transition: opacity .1s ease-in;
}

/* Opacity Hover transition */
.arrow_overlay:hover,
.learningsListingThumb .arrow_overlay:hover,
a:hover .widget_title {
    transition: opacity 100ms ease-in;
}

/* BG & text transition */
.topic_box .title {
    transition: background-color .1s ease-in, color .1s ease-in;

}

/* BG transition - Hover */
.topic_box:hover .title {
    transition: background-color 100ms ease-in, color 100ms ease-in;
}

/* ================================= */
/* Defaults */
/* ================================= */

.rounded {
    border-radius: 4px;
}

.transition {
    transition: all linear 0.2s;
}

.light_bottom_border {
    border-bottom: solid 1px #D7D7D7;
}

.light_top_border {
    border-top: solid 1px #D7D7D7;
}

.underline {
    border-bottom:  1px solid #3FB5E8;
    padding-bottom: 5px;
}

.margin_bottom {
    margin-bottom: 15px;
}

.notopmargin {
    margin-top: 0;
}

/* ================================= */
/* Typography */
/* ================================= */

#content ul.noContent li:before, #content .noContent ul li:before, #content .flexslider ul li:before {
    content: '';
}

#content ul.noContent li, #content .noContent ul li, #content .flexslider ul li {
    text-indent: 0;
    margin-left: 0;
}

/* ================================= */
/* Header */
/* ================================= */

.header_top {
    position: relative;
    z-index: 1;
    width: 100%;
    font-size: 14px;
    padding: 8px 0;
    background-color: #ffffff;
}

.header_top .container_24 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header_top .container_24::before,
.header_top .container_24::after {
    display: none;
}


/* HEADER SEARCH BAR STYLES */
.linebg {
    background: url("/images/backgrounds/eces-body-top-bg.png") #FFFFFF top center repeat;
    height: 5px;
}



.member_text i {
    padding-right: 5px;
    color: #52426D;
}

.member_text a {
    color:       #52426D !important;
    font-weight: bold;
}

.member_text a:hover {
    color:       #3FB5E8 !important;
    font-weight: bold;
}

.bar_padding {
    padding:    6px 5px 6px 5px;
    margin-top: 5px;
}

.joint_box {
    float: left;
}

.joint_box input[type=text],
.joint_box.custom_select > span,
.joint_box.custom_select select,
.joint_box button {
    height: 26px !important;
}

.joint_box input[type=text] {
    border-radius: 5px 0px 0px 5px;
    padding:       4px;
    border-color:  #D7D7D7;
    margin-right:  0px;
    min-width:     180px;
}

.joint_box button {
    color:         #FFFFFF;
    padding:       4px 9px 4px 9px !important;
    border-radius: 0px 5px 5px 0px;
    border:        none;
    background:    #3FB5E8; /* Old browsers */
    background:    linear-gradient(to bottom, #3FB5E8 0%, #39A3D1 100%); /* W3C */
    line-height:   15px !important;
    outline:       none;
}

.joint_box button i {
    color:                  #FFFFFF;
    text-shadow:            none;
    font-size:              16px;
    -webkit-font-smoothing: antialiased;
}

/* HEADER STYLES */
.header_fill {
    height:   66px;
    position: relative;
    float:    left;
    width:    100%;
    display:  none;
}

#header {
    display:  block;
    width:    100%;
    padding:  10px 0;
    position: relative;
    z-index:  2;
    box-shadow: 0 3px 15px 0 rgba(0,0,0,0.1);
}

#header .container_24 {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

#header .container_24::before,
#header .container_24::after {
    display: none;
}

#header a.logo {
    max-width: 100%;
    padding-right: 30px;
    display: block;
}

#header a.logo img {
    max-width: 100%;
    height: auto;
}

.topmenu {
    margin-bottom: 10px;
    margin-left: -10px;
    margin-right: -10px;
}

.topmenu ul {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.topmenu ul li {
    list-style:   none;
    float:        left;
    position:     relative;
}

.topmenu ul li a {
    font-family:    'Montserrat', sans-serif;
    color:          #8372a1;
    font-size:      13px;
    font-weight:    600;
    padding:        5px 10px;
    display:        block;
}

.topmenu ul li a:hover {
    color: #9679C5;
}

.topmenu .divider {
    background: url("/images/backgrounds/top-menu-divider.png") no-repeat center;
    color:      #B6C0CB;
    margin-top: -6px;
    width:      10px;
    height:     30px;
    font-size:  18px;
}

.topmenu .divider.hide {
    display: none;
}

.mobile_header_items {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    margin-right: -10px;
}

.mobile_header_items a {
    padding: 10px;
    font-size: 24px;
    color: #272727;
    cursor: pointer;
    margin-left: 10px;
    transition: all 0.2s ease;
}

.mobile_header_items a:hover,
.mobile_header_items .active_mobile_launch {
    color: #3FB5E8
}

.mobile_search_bar {
    width: 100%;
    height: 0px;
    padding-top: 0px;
    overflow: hidden;
    transition: all 0.4s ease;
}

.mobile_search_bar.active {
    height: 26px;
    padding-top: 10px;
}

.mobile_search_bar .header_search_bar {
    width: 100%;
}

.mobile_search_bar .header_search_bar form {
    display: flex;
}

.mobile_search_bar .header_search_bar .joint_box {
    flex-grow: 1;
    flex-shrink: 1;
}

.mobile_search_bar .header_search_bar .joint_box.last {
    flex-grow: 0;
    flex-shrink: 0;
}

.mobile_search_bar .member_links {
    display: none;
}


/* ================================= */
/* Main Navigation */
/* ================================= */

#mainNav {
    width: calc(100% + 20px);
    margin-left: -10px;
    margin-right: -10px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

#mainNav li {
    list-style: none;
    position: relative;
}

#mainNav > li {
    margin: 0;
}

#mainNav > li.first {
    margin-left: 0;
}

#mainNav > li.first a {
    border-left:   0;
    padding-right: 39px;
    padding-left:  38px;
}

#mainNav > li.last {
    margin-left: 0;
}

#mainNav > li.last a {
    border-right: 0;
}

#mainNav li a {
    padding:      5px 10px;
    font-size:    14px;
    margin:       0px 0px;
    font-weight:  400;
    color:        #3fb5e8;
    display:      block;
}

#mainNav > li > a {
    text-align: center;
    font-size: 13px;
    font-weight: 600;
}

#mainNav li a:hover {
    color: #64557C;
}

#mainNav li a:active, #mainNav li.current > a {
    color: #64557C !important;
}

#mainNav ul,
.topmenu ul ul {
    position:           absolute;
    width:              220px; /* left offset of submenus need to match (see below) */
    top:                -999px;
    box-shadow:         0px 1px 6px rgba(0, 0, 0, 0.6);
    border-bottom:      4px solid #39A3D1;
    flex-direction:     column;
}

#mainNav ul li,
.topmenu ul ul li {
    width: 100%;
}

#mainNav li:hover, .topmenu ul li:hover {
    visibility: inherit; /* fixes IE7 'sticky bug' */
}

#mainNav li:hover ul,
#mainNav li.sfHover ul,
.topmenu ul li:hover ul,
.topmenu ul li.sfHover ul {
    left:    0;
    top:     100%; /* match top ul list item height */
    z-index: 99;
}

#mainNav li:hover li ul,
#mainNav li.sfHover li ul,
.topmenu ul li:hover li ul,
.topmenu ul li.sfHover li ul {
    top: -999em;
}

#mainNav li li:hover ul,
#mainNav li li.sfHover ul,
.topmenu ul li li:hover ul,
.topmenu ul li li.sfHover ul {
    left: 220px; /* match ul width */
    top:  0;
}

#mainNav li li:hover li ul,
#mainNav li li.sfHover li ul,
.topmenu ul li li:hover li ul,
.topmenu ul li li.sfHover li ul {
    top: -999em;
}

#mainNav li li li:hover ul,
#mainNav li li li.sfHover ul,
.topmenu ul li li li:hover ul,
.topmenu ul li li li.sfHover ul {
    left: 220px; /* match ul width */
    top:  0;
}

/* Drop Down UL */
#mainNav ul li a {
    font-family: Arial, helvetica, sans-serif;
    margin:      0;
    padding:     9px 20px;
    font-size:   13px;
    font-weight: normal;
    color:       #000000;
    background:  #EDEDED;
    border:      none;
    text-shadow: none;
}

.topmenu ul ul li a {
    font-family:    Arial, helvetica, sans-serif;
    margin:         0;
    padding:        9px 20px;
    text-transform: none;
    text-align:     left;
    font-size:      13px;
    font-weight:    normal;
    color:          #000000;
    background:     #EDEDED;
    border:         none;
    text-shadow:    none;
}

#mainNav ul li a:hover,
#mainNav ul li a:active,
.topmenu ul ul li a:hover,
.topmenu ul ul li a:active {
    background: #39A3D0; /* Old browsers */
    background: linear-gradient(to bottom, #39A3D0 0%, #3FB5E8 100%); /* W3C */
    border:     none;
    color:      #FFFFFF;
}

#mainNav ul li a:active,
#mainNav ul li.current > a,
.topmenu ul ul li a:active,
.topmenu ul ul li.current > a {
    color:              #52CBEF;
    box-shadow:         none;
}

/* ================================= */
/* Mobile Navigation */
/* ================================= */

/* Resets for container */
#mobile_nav {
    position: absolute;
    top:      0;
    z-index:  9999;
    right:    0;
    width:    40%;
    float:    left;
    margin:   0;
    padding:  0;
}

/* Background colour for menu and active icon/button */
html.mobile_nav_is_active,
#mobile_nav .mobile_nav_wrap {
    background-color: #363A39;
}

#mobile_nav .mobile_nav_wrap,
#mobile_nav ul li,
#mobile_nav ul li a {
    box-sizing: border-box;
}


/* Actual Menu Wrapper - Important stuff */
#mobile_nav .mobile_nav_wrap {
    position:   fixed;
    width:      80%;
    float:      left;
    right:      -80%;
    box-shadow: 0 0 0 #000000;
    height:     100%;
    z-index:    98;
    overflow:   auto;
    display:    block;
}

#mobile_nav .mobile_nav_wrap_active {
    right: 0;
}

html,
#mobile_nav .mobile_nav_wrap {
    transition: right 0.2s linear;
}

html {
    position: relative !important;
    width:    100%;
    right:    0;
}

html.mobile_nav_is_active {
    right: 80%;
}

html.mobile_nav_is_active,
html.mobile_nav_is_active body {
    /* overflow : hidden; */
    position: relative;
    height:   100%;
}

#mobile_nav ul {
    float:         none;
    position:      relative;
    top:           0;
    left:          0;
    display:       block;
    width:         100%;
    list-style:    none;
    margin:        0 auto !important;
    padding:       0 !important;
    border-top:    5px solid #363A39;
    border-bottom: 5px solid #363A39;
}

#mobile_nav ul li {
    width:         100%;
    display:       block;
    padding:       0 25px;
    float:         left;
    width:         100%;
    border-bottom: 1px solid #444444;
}

#mobile_nav ul li a {
    color:       #FFFFFF;
    font-size:   18px;
    display:     block;
    float:       left;
    width:       100%;
    font-weight: bold;
    padding:     12px 0;
}

#mobile_nav ul li a:active {
    text-shadow: -1px -1px 0 #111111;
}

#mobile_nav ul li.child a {
    font-weight:  normal;
    padding-left: 20px;
    font-size:    13px;
}

#mobile_nav ul li.child2 a {
    padding-left: 50px;
    font-size:    12px;
}

/* ================================= */
/* Sidebar */
/* ================================= */

#sidebar {
    margin-top: 0px;
}

#subNav {
    border-bottom: none;
}

#sidebar .widget {
    margin-top: 10px;
}

#sidebar #subNav li.subNavHeading {
    padding-left: 0;
    margin: 0 0 5px 0;
}

#sidebar #subNav li.subNavHeading a {
    color:           #8b70b2;
    font-weight:     bold;
    text-transform:  capitalize;
    text-decoration: none;
    font-size:       20px;
}

#sidebar #subNav li.subNavHeading a:hover {
    color: #3fb5e8;
}

#content #sidebar #subNav li.subNavHeading:before {
    content: none;
}

#sidebar #subNav li {
    position: relative;
    color: #333333;
    text-indent: 0;
    margin-left: 0;
    padding-left: 20px;
    line-height: 1.2;
    padding-top: 6px;
    padding-bottom: 6px;
}

#sidebar #subNav li a {
    color: inherit;
    padding: 0px;
    text-decoration: none;
}

#sidebar #subNav li a:hover {
    color: #8b70b2;
}

#sidebar #subNav li:before {
    content:      "\203A \00a0";
    position:     absolute;
    top:          8px;
    left:         5px;
    color:        inherit;
    font-size:    13px;
    margin-right: 5px;
    line-height:  15px;
}

#content #sidebar ul#subNav {
    padding: 0;
    padding-bottom: 8px;
    margin:  0px 0px 10px 0px;
}

#content #sidebar #subNav li.down > a {
    color:       #8b70b2;
    font-weight: bold;
}

#content #sidebar #subNav li.child a {
}

#content #sidebar #subNav li.child {
    border-top:   none;
    padding-top:  4px;
    padding-left: 32px;
}

#content #sidebar #subNav li.childChild {
    font-size:    11px;
    border-top:   none;
    padding-top:  4px;
    padding-left: 50px;
}

#content #sidebar #subNav li.childChild:before {
    font-size:   11px;
    margin-left: 28px;
}

#sidebar #subNav li.child:before {
    font-size:   11px;
    margin-left: 14px;
}

#sidebar #subNav ul {
    margin: 5px 0 5px 0px;
}

/* Target Area box - sidebar */
#sidebar .blue_box {
    padding:    14px 17px;
    margin-top: 0px;
    min-height: 0;
}

#sidebar .blue_box h2 {
    color: inherit;
    font-size:   19px;
    line-height: 22px;
}

#sidebar .list_style ul li {
    padding: 4px 0px !important;
}

#sidebar .list_style ul li a {
    font-weight: normal;
}

#sidebar ul li:before, #sidebar .list_style ul li:before {
    padding-right: 0px;
    padding-left:  0px;
}

/* Latest Resc - sidebar widget */
#sidebar .articles span {
    margin-bottom: 10px;
}

/* ================================= */
/* Content */
/* ================================= */

#content {
    padding-top:      0px;
    padding-bottom:   0px;
    width:            100%;
    display:          block;
    background-color: #e9eff2;
}

.home #content {
    padding-top:    0px;
    padding-bottom: 0px;
}

#content.two_column {
    position: relative;
    z-index: 0;
    background-color: #ffffff;
}

#content.two_column .container_24 {
    display: flex;
}

#content.two_column .container_24::before,
#content.two_column .container_24::after {
    display: none;
}

#content.two_column #sidebar {
    position: relative;
    order: -1;
    padding: 35px 30px;
    padding-left: 0;
}

#content.two_column #sidebar::after {
    content: '';
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100vw;
    height: 100%;
    background-color: #e9eff2;
}

#content.two_column .padding {
    padding-top: 35px;
    padding-right: 0;
}

#copy p, #copy table, #copy ul, #copy ol {
    margin: 0 0 20px 0;
}

#copy ul, #copy ol {
    margin-left: 18px;
}

.home #copy {
    background: none;
}

#copy {
    margin-top: 0px;
}

#copy .padding {
    padding: 60px 60px 50px 60px;
}

.copy_bg_wrapper {
    background-color: #ffffff;
}

.header_banner {
    position: relative;
    text-align: center;
    background-size: cover;
    background-position: center;
}

.inner_temp_h1 {
    font-size: 35px;
    line-height: 1.1;
}

.header_banner .overlay {
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0,0,0,0.4);
}

.header_banner.bg_image {
    padding-top: 30%;
    border: solid 5px #FFFFFF;
    border-radius: 3px;
    box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.5);
}

.header_banner.bg_image .banner_text {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    width: 80%;
    transform: translate(-50%, -50%);
}

.header_banner.bg_image .inner_temp_h1 {
    color: #ffffff;
}

#content .header_banner.bg_image .banner_text #breadcrumbs a {
    color: #ffffff;
}

.header_banner + #breadcrumbs {
    margin-bottom: 30px;
    margin-top: 20px;
}

body.full-width .header_banner.bg_image {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}


/* ================================= */
/* Home */
/* ================================= */

/* Home Page Banner */
.home_banner_section {
    position: relative;
    z-index: 1;
    overflow: hidden;
}

.home_banner_section .container_24 {
    display: flex;
}

.home_banner_section .container_24::before,
.home_banner_section .container_24::after {
    display: none;
}

.home_banner_section .banner_side::after {
    content: '';
    display: block;
    background-color: #52426d;
    position: absolute;
    z-index: -1;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100vw;
}

.home_banner_section .banner_side .home_banner_overlay {
    content: '';
    display: block;
    background-image: url("/images/backgrounds/home-banner-overlay.png");
    position: absolute;
    z-index: 2;
    left: -104px;
    top: 0;
    bottom: 0;
    width: 536px;
}

.home_banner_section .flexslider {
    background-color: transparent;
    margin: 0;
}

#homeBanner {
    position: absolute;
    z-index: 1;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

#homeBanner .flex-viewport,
#homeBanner .slides,
#homeBanner .slides li {
    height: 100%;
}

#homeBanner .slides li {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#homeBanner .slides li img {
    visibility: hidden;
}

#homeBannerText {
    height: 100%;
    display: flex;
    min-height: 310px;
    z-index: 2;
}

#homeBannerText .slides {
    height: 100%;
    display: flex;
}

#homeBannerText .slides li {
    display: flex !important;
    flex-direction: column;
    justify-content: center;
}

#homeBannerText:not(.loaded) .slides li + li {
    display: none !important;
}

#homeBannerText .slides .banner_text {
    position: static;
    width: 50%;
    padding-top: 20px;
    padding-bottom: 20px;
}

#homeBannerText .flex-control-nav {
    position: absolute;
    z-index: 20;
    right: 30px;
    bottom: 30px;
    margin: 0;
    text-align: right;
}


/* Target Area box */

.home_banner_section .target_side {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.home_banner_section .target_side .blue_box {
    margin-top: 0;
}

.home_banner_section .target_side::after {
    content: '';
    display: block;
    background-image:
        url("/images/backgrounds/bluebox.jpg"),
        linear-gradient(to bottom, #2698df 0%, #30a3e2 25%, #3fb5e7 50%, #4fc6ee 75%, #57d2f1 100%);
    background-repeat:
        no-repeat,
        repeat-x;
    background-position:
        left center,
        center center;
    background-size:
        auto 100%,
        100% 100%;
    position: absolute;
    z-index: -1;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100vw;
}

.blue_box {
    margin-top:    27px;
    margin-top:    27px;
    padding:       17px 22px;
    padding-right: 0;
    min-height:    0px;
    font-size:     16px;
    line-height:   18px;
}

.blue_box h2 {
    color:         #ffffff;
    font-size:     26px;
    line-height:   30px;
    margin-bottom: 10px;
}

.blue_box h2 a {
    color: inherit;
}

.blue_box.list_style ul {
    margin-bottom: 20px !important;
}

.target_area_button a.button.purple {
    font-size: 13px;
    padding-left: 5px;
    padding-right: 5px;
    width: 294px;
    max-width: 100%;
}

/* Home Content Area */

.home_content_section {

}

.home_content_section .row {
    display: flex;
}

.home_content_section .row > * {
    padding-top: 30px;
    padding-bottom: 30px;
}

.home_content_section .widget {
    margin: 0;
}

.home_content_text {
    font-weight: bold;
    width: calc(100% - 265px);
    position: relative;
    padding-top: 20px;
}

.homegirl {
    float:    right;
    position: absolute;
    bottom:   -2px;
    right:    0;
}


/* List style  - special - used on blue box on the home page for example */

.list_style ul {
    margin-left:   5px !important;
    margin-bottom: 0px !important;
}

.list_style ul li a {
    color: #FFFFFF;
}

.list_style ul li a:hover {
    color: #9CF7FF;
}

.list_style ul li {
    color:       #FFFFFF;
    margin-left: 22px !important;
    padding:     5px 0px !important;
    text-indent: -24px !important;
}

.list_style ul li:before {
    margin-right: 12px;
    font-weight:  normal;
    font-size:    13px;
    line-height:  15px;
}

/* ======================================================== */
/* Topics Page Styles & Global Styles used on any resource page*/
/* ======================================================== */
.topic_box_clear {
    display: none;
}

/* resource listing boxes */
.shadowWrapper {
    float:        left;
    width:        40px;
    padding-left: 9px;
    box-sizing:   border-box;
}

.resourcesWrapper,
.learningWrapper {
    margin-bottom: 25px;
}

.learningsListingContainer,
.resourcesListingContainer {
    width:      100%;
    box-sizing: border-box;
}

#copy .learningsListingContainer p,
#copy .resourcesListingContainer p {
    line-height:   18px;
    margin-bottom: 10px;
}

.learningsListingContainer .icons i,
.resourcesListingContainer .icons i {
    color:        #3FB5E8;
    margin-right: 15px;
    font-size:    24px;
}

/* if has image */
.resourcesListingThumb,
.learningsListingThumb {
    width:              107px;
    margin-right:       10px;
    float:              left;
    box-sizing:         border-box;
    padding-right:      1px;
    border-right:       6px #3FB5E8 solid;
}

.learningsListingContainer.learningsListingContainerWImage,
.resourcesListingContainer.resourcesListingContainerWImage {
    width: calc(100% - 117px);
    float: left;
}

.resourcesListingThumb img,
.learningsListingThumb img {
    width:  100%;
    height: auto;
}

.resourcesListingThumb .arrow_overlay,
.learningsListingThumb .arrow_overlay {
    position:        relative;
    width:           99px;
    height:          99px;
    background-size: 100% auto;
    overflow:        hidden;

}

.arrow_overlay img.arrow,
.learningsListingThumb .arrow_overlay img.arrow {
    position: absolute;
    bottom:   8px;
    right:    8px;
    height:   24px;
    width:    24px;
}

.arrow_overlay:hover,
.learningsListingThumb .arrow_overlay:hover {
    opacity: 0.7;
}

.widget.resc {
    margin-top: 0;
}

.widget.resc .widget_content h2,
.learningsListingContainer h2,
.resourcesListingContainer h2 {
    font-size:     20px;
    margin-bottom: 10px;
    line-height:   1.2;
}

.learningsListingContainer h2 a,
.resourcesListingContainer h2 a {
    font-size:     inherit;
    line-height:   inherit;
    font-weight:   bold;
    color:         #000000;
}

.learningsListingContainer h2 a:hover,
.resourcesListingContainer h2 a:hover {
    color: #8875B5;
}

.widget.resc .widget_content {
    padding: 9px 9px;
}

.resource_objectives {
    display:    block;
    background: #E9EFF2;
    padding:    20px 20px 5px;
    box-sizing: border-box;
    border:     1px solid #D5DDE5;
    margin:     0 0 20px;
    float:      left;
    width:      100%;
}

.resource_objectives_content {
    float: right;
    width: 79%;
}

.resource_objectives_content h2 {
    font-size:     18px;
    color:         #9CA7B1;
    margin-bottom: 0;
}

.resource_objectives_icon {
    width:  15%;
    float:  left;
    margin: 0 10px 10px;
}

/* Topic box */

.topic_box {
    border-bottom: 1px #59BFEB solid;
    width:         32%;
    box-sizing:    border-box;
    float:         left;
    margin-right:  2%;
}

.topic_box .title {
    color:         #000000;
    min-height:    30px;
    font-weight:   bold;
    font-size:     14px;
    line-height:   15px;
    padding:       10px;
    background:    #E9EFF2;
    border-bottom: 1px #59BFEB solid;
}

.topic_box.topmargin {
    margin-top: 10px;
}

.topic_box.last {
    margin-right: 0;
}

.topic_box .overlay_bg {
    background: url("/images/backgrounds/overlay-black-fade.png") repeat-y 50px 0px;
}

.topic_box .arrow_overlay {
    position:        relative;
    width:           100%;
    background-size: 100% auto !important;
}

.topic_box .arrow_overlay img.arrow {
    position: absolute;
    bottom:   3px;
    right:    3px;
    z-index:  2;
    height:   15px;
    width:    15px;
}

.topic_box .title .vert {
    display:    table;
    min-height: 30px;
}

.topic_box .title span {
    display:        table-cell;
    vertical-align: middle;
}

.topic_box:hover .title {
    background: #52426D;
    color:      #FFFFFF;
}

.topic_box .arrow_overlay:hover {
    opacity: 1;
}

/* ================================= */
/* Resourcee Listing */
/* ================================= */

.resc_listings_wrapper {
    padding: 25px 0;
    margin-bottom: 0px;
}

.srch_container {
    margin-bottom: 20px;
}

.srch_container form {
    display: flex;
    flex-wrap: wrap;
    margin: -5px;
}

.srch_container form > * {
    padding: 5px;
}

.srch_container form > *.topic_srch_mobile {
    flex-grow: 1;
    flex-shrink: 1;
}

.srch_container input,
.srch_container button {
    height: 33px;
}

.srch_container .custom_input input[type="text"] {
    margin-top: 0;
}

.srch_container button {
    padding: 5px 15px;
}

.srch_rslt {
    font-weight:    700;
    margin-top:     0px;
    padding:        30px 0 10px 0;
    font-size:      24px;
    line-height:    28px;
    color:          #8B70B2;
    text-transform: capitalize;
}

.srch_rslt strong {
    color: #3FB5E8;
}

/* ================================= */
/* Pagination For the Resources page & normal Page nav */
/* ================================= */
.pagnav_bar_cotainer {
    display:    block;
    border-top: solid 1px #D5DCDF;
    margin:     5px 5px 5px 0;
    width:      100%;
    box-sizing: border-box;
    padding:    15px 0 10px;
}

.displaying_box {
    padding-top: 12px;
    font-style:  italic;
    width:       30%;
}

#copy p.nextprevnav {
    float:         right;
    margin-top:    0;
    margin-right:  2%;
    margin-bottom: 0 !important;
    line-height:   0.8;
}

.pagnav_bar_cotainer .left, .pagnav_bar_cotainer .right, .pagnav_bar_cotainer .nextprevcurrentpage, .pagnav_bar_cotainer .nextprevlink, .pagnav_bar_cotainer .nextprevdisabled {
    float:      left;
    padding:    10px 15px;
    border:     solid 1px #359DCA;
    color:      #FFFFFF;
    background: #2379A7; /* Old browsers */
    background: linear-gradient(to bottom, #3FB4E7 0%, #3392BB 100%); /* W3C */
}

.pagnav_bar_cotainer a.nextprevlink {
    color: #FFFFFF;
}

.pagnav_bar_cotainer .nextprevnav span {
    margin-bottom: 0;
}

.pagnav_bar_cotainer .nextprevlink:hover {
    background: #65C3EC; /* Old browsers */
    background: linear-gradient(to bottom, #65C3EC 0%, #3492BB 100%); /* W3C */
    color:      #FFFFFF;
}

.pagnav_bar_cotainer .nextprevlink:active {
    background: #39A3D1; /* Old browsers */
    background: linear-gradient(to bottom, #39A3D1 0%, #328FB7 100%); /* W3C */
    box-shadow: inset 3px 0px 5px 0px rgba(0, 0, 0, 0.3);
    color:      #EBF7FC !important;
}

.pagnav_bar_cotainer .nextprevcurrentpage {
    color:      #3FB5E8;
    background: #E9EFF2 !important;
}

.pagnav_bar_cotainer .nextprevdisabled {
    color: #FFFFFF;
}

.pagnav_bar_cotainer .nextprevdisabled:hover {

}

.pagnav_bar_cotainer .left {
    border-top-left-radius:    5px;
    border-bottom-left-radius: 5px;
}

.pagnav_bar_cotainer .nextprevcurrentpage {

}

.pagnav_bar_cotainer .nextprevlink {

}

.pagnav_bar_cotainer .right {
    border-top-right-radius:    5px;
    border-bottom-right-radius: 5px;
}

/* ======================================================== */
/* Resource View Page Styles*/
/* ======================================================== */

/* Add fav bar and social buttons */

.favourites {
    width: 80%;
    float: left;
    margin-bottom: 20px;
}

.addthis_wrapper {
    display: inline-block;
    position: relative;
    border: 1px solid #e2e6e8;
    border-radius: 8px;
    padding: 12px 15px 9px;
    min-width: 120px;
    min-height: 20px;
}

.addthis_wrapper.float_right {
    margin-bottom: 20px;
    margin-left: 30px;
}

.addthis_wrapper.bottom {
    margin-top: 20px;
}

.addthis_wrapper > .label {
    position: absolute;
    top: 0;
    left: 10px;
    transform: translateY(-50%);
    padding-left: 5px;
    padding-right: 5px;
    background-color: #ffffff;
    border-radius: 3px;
    color: #8b70b2;
    font-weight: bold;
    font-size: 11px;
    line-height: 10px;
    font-family: 'Montserrat', sans-serif;
}

.addthis_wrapper > p,
.addthis_wrapper > p > a {
    margin-bottom: 0 !important;
}


/* Media Box - video & audio Container styles */
#media_box {
    float:  right;
    margin: 0px 0px 20px 25px;
    width:  50%;
}

#media_box h3 {
    display:   block;
    font-size: 18px;
    padding:   15px 10px 0px 20px;
    color:     #FFFFFF;
}

#media_box .video {
    background:     #979696; /* Old browsers */
    background:     linear-gradient(to bottom, #979696 0%, #ADADAD 100%); /* W3C */
    padding-bottom: 20px;
}

#media_box .audio {
    background:     #9A9999;
    padding-bottom: 20px;
}

#resource_video {
    width:        93% !important;
    height:       100px;
    margin-left:  auto;
    margin-right: auto;
    display:      block;
}

#resource_audio {
    margin-left:        auto;
    margin-right:       auto;
    width:              93%;
    box-sizing:         border-box;
    display:            block;
}

/* Published download resource box */
.view_box_wrapper {
    margin-top: 15px;
}

.published_box {
    width:        57%;
    margin-right: 3%;
    background:   #3FB5E8;
    float:        left;

    min-height:   108px;
}

h4.headingwhite {
    color:         #FFFFFF;
    font-size:     18px;
    line-height:   22px;
    margin-bottom: 5px;
    font-weight:   normal;
}

.published_box .content {
    width:   35%;
    color:   #FFFFFF;
    padding: 20px 5px 20px 20px;
    float:   left;
}

.published_box .vert {
    display:        table;
    vertical-align: middle;
    float:          right;
    margin:         0px 20px;
    min-height:     100%;
}

.published_box .vert .inner_vert {
    display:        table-cell;
    vertical-align: middle;
}

.published_box .button.purple,
.survey_box .button {
    font-size: 13px;
}

.button.purple i {
    padding-right: 5px;
}

/* Survey box */
.survey_box {
    width:      40%;
    float:      left;
    min-height: 69px;
    background: url("/images/backgrounds/survey_bg.png") no-repeat right top #8B70B2;
}

.survey_box .button {
    margin-top:  5px;
    font-weight: normal;
}

.survey_box .padding_ {
    padding: 20px;

}

/* Reflections Area */

.reflections_contaner {
    margin: 10px 0;
}

.reflections_contaner .button {
    float: left;
    margin-right: 20px;
    margin-bottom: 10px;
}

.reflections_contaner .favourites {
    width: auto;
    margin-bottom: 0;
}

.reflections_contaner .addthis_wrapper {
    margin-top: 2px;
}

.Reflections_form .button {
    margin-bottom: 8px;
    margin-top:    22px;
}

/* other styles for the resources view page */

.viewall {
    margin-top: 10px;
    float:      right;
}

/* ================================= */
/* Learning Module */
/* ================================= */
/*
.section_output #media_box {
    float: left;
    margin: 0px 25px 20px 0px;
}*/

.section_output .published_box {
    float:              right;
    width:              50%;
    padding:            25px 21px;
    margin-right:       0;
    margin-left:        25px;
    box-sizing:         border-box;
    margin-bottom:      20px;
    min-height:         0px;
}

.section_output .published_box h3 {
    width:   53%;
    float:   left;
    color:   #FFFFFF;
    padding: 10px 0 0 0;
}

.section_output .published_box .button.purple,
.survey_box .button {
    float: right;
}

.pagination {
    margin: 26px 0 20px;
}

/* Circle Pagnav - Steps */
.line_through {
    background: url("/images/backgrounds/learningmodule-line.png") repeat-x left center;
}

.line_through .white_space {
    background:    #FFFFFF;
    width:         auto;
    padding-right: 10px;
}

.learning_steps_container {
    margin:       35px 0;
    margin-right: auto;
    margin-left:  auto;
    text-align:   center;
    width:        80%;
}

.learning_steps_container .step_circle {
    background: #FFFFFF;
    padding:    0 2%;
    margin:     0 3%;
    width:      4%;
    float:      none;
    display:    inline-block;
}

.learning_steps_container .step_circle a, .learning_steps_container .step_circle span {
    float:         none;
    display:       inline-block;
    font-size:     14px;
    font-weight:   700;
    width:         40px;
    color:         #FFFFFF;
    text-align:    center;
    padding-top:   10px;
    box-sizing:    border-box;
    height:        40px;
    border-radius: 40px;
    background:    #3EB3E6; /* Old browsers */
    background:    linear-gradient(to bottom, #3EB3E6 0%, #3AA7D6 100%); /* W3C */
}

.learning_steps_container .step_circle a:hover, .learning_steps_container .step_circle a:focus, .learning_steps_container .step_circle.selected a {
    background: #52426D !important;
    color:      #FFFFFF;
}

.learning_steps_container .step_circle.exam a, .learning_steps_container .step_circle.exam span {
    width:                 80px;
    padding-top:           11px;
    border-radius:         0px;
}

.learning_steps_container .step_circle.inactive span, .learning_steps_container .step_circle.inactive a, .learning_steps_container .step_circle.inactive a:hover {
    background: #D3D3D3 !important;
    cursor:     default;
}

/* IF IE 7 */

.lt-ie8 .learning_steps_container .step_circle {
    display: block !important;
    float:   left !important;
}

/* ================================= */
/* Exam Module */
/* ================================= */
.question_group {
    margin: 27px 0;
}

.question_group_box_inner {
    padding-left: 20px;
    padding-top:  15px;
}

.question {
    margin: 20px 0
}

.question_content {
    width: 93%;
    float: left;
}

.question_number {
    font-size:   24px;
    width:       7%;
    line-height: 30px;
    float:       left;
}

.question_title {
    margin-bottom: 15px;
}

.answer {
    padding: 3px 0;
}

.answer input[type="radio"] {
    margin-right: 5px;
}

.answer .radio_select {
    width:        2%;
    min-width:    19px;
    float:        left;
    margin-right: 1%;
    padding-top:  1px;
}

.answer .txt {
    width: 92%;
    float: left;
}

/* Results section */

#exam_results .exam_results_container {
    background: #FBFBFB;
    padding:    23px 40px;
    margin:     29px 23px;
}

.exam_results_container .center {
    width:        43%;
    margin-right: auto;
    margin-left:  auto;
}

.exam_results_container .result h2 {
    font-size:     24px;
    float:         left;
    width:         39%;
    line-height:   33px;
    padding:       6px 10px 6px 0;
    margin-bottom: 0;
    color:         #D3D3D3;
}

.exam_results_container .result i {
    padding-right: 5px;
}

.exam_results_container .result span {
    float:       left;
    width:       56%;
    display:     block;
    padding-top: 1px;
    font-size:   31px;
    color:       #ADE038;
    font-weight: bold;
    line-height: 40px;
}

.exam_results_container .result span.Fail, .question_number.incorrect_answer, .incorrect_answer {
    color: #C30000;
}

.question_number.correct_answer, .correct_answer {
    color: #ADE038;
}

#exam_results_answers .question_group_box_inner {
    padding-bottom: 30px;
    padding-left:   38px;
    padding-right:  23px;
}

#exam_results_answers .question_answers {
    border:        2px solid #FBFBFB;
    border-top:    5px solid #FBFBFB;
    padding:       15px;
    margin-bottom: 10px;
}

#exam_results_answers .question_answers h4 {
    display:       block;
    font-size:     23px;
    padding-right: 10px;
    line-height:   28px;
    float:         left;
}

#exam_results_answers .question_answers .blackout {
    color: #000000;
}

.question_answers .blackout div {
    padding-top: 7px;
    display:     block;
    float:       left;
    width:       95%;
}

#exam_results_answers .question_answers h4.title {
    margin:      10px 0 5px;
    font-size:   15px;
    line-height: 20px;
    display:     block;
}

/* button styles for the bottom of the page */
.line_through div.white_space {
    padding-right: 10px;
    display:       inline-block;
}

.exam_button_container {
    margin-top: 30px;
}

.exam_button_container .button {
    float: left;
}

.exam_button_container .white_space.second {
    /* this get's rid of the line between the two buttons on the exam page */
    margin-left: -3px;
}

/* ================================= */
/* Widgets */
/* ================================= */

.widget {
    margin-top:    15px;
    margin-bottom: 10px;
    border:        solid 1px #D7D7D7;
    box-sizing:    border-box;
}

.widget_title {
    display: flex;
    align-items: center;
    position: relative;
    padding: 12px 15px 14px 20px;
    background-image: linear-gradient(to bottom, #32a6e3 0%, #4bc3ec 100%);
}

.widget_title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 2px;
    background-image: linear-gradient(to right, #8b70b2 0%, #3fb5e8 100%);
}

a:hover .widget_title {
    opacity: 0.80;
}

a:hover .widget_title .icon {
    transform: scale(1.3);
}

.widget_title .icon {
    color: #ffffff;
    flex-grow:   0;
    flex-shrink: 0;
    font-size: 18px;
    margin-left: 10px;
    transform: scale(1);
    transition: all 20ms linear;
}

.widget_title h2 {
    flex-grow:   1;
    flex-shrink: 1;
    color:       #FFFFFF;
    margin:      0;
    font-weight: 600;
    font-size:   18px;
    line-height: 1.2;
}

.widget_content h2 a,
.widget_content h2 {
    font-size:     16px;
    line-height:   20px;
    color:         #000000;
    margin-bottom: 10px;
}
.featuredBlog .widget_content h2 a, .featuredBlog .widget_content h2 {
    padding-bottom: 3px;
}
.widget_content {
    background: #FFFFFF;
    padding:    15px 15px 10px 14px;
}

.home_page .widget_content {
    min-height: 100px;
}

.widget_content ul {
    margin-bottom: 0 !important;
}

.widget_content ul li {
    font-weight:   bold;
    margin-left:   0px !important;
    margin-bottom: 5px;
}

.widget_content ul li:before {
    margin-right: 3px;
    font-size:    13px !important;
}

.widget_date {
    padding:          0px 0 4px;
    margin:           4px 20px 10px 0px;
    text-align:       center;
    width:            53px;
    background-color: #3FB5E8;
    text-transform:   uppercase;
    float:            left;
    color:            #FFFFFF;
    font-size:        14px;
    font-weight:      bold;
}

.widget_date h2 {
    font-weight:    bold;
    font-size:      24px;
    line-height:    23px;
    text-transform: none;
    color:          #FFFFFF;
    margin:         5px 10px 0px 10px;
}

.widget .blogDate {
    color:         #000000;
    font-style:    italic;
    display:       block;
    margin-bottom: 13px;
    line-height:   14px;
}

.widget_content p {
    margin-bottom: 10px !important;
    line-height:   20px;
}

.widget_form_row {
    margin:     3px 0;
    text-align: right;
}

.widget_form_row label {
    width:        21.5%;
    text-align:   left;
    margin-right: 2%;
    display:      inline-block;
}

.widget_form_input {
    text-align:    right;
    width:         73%;
    padding-right: 1%;
    display:       inline-block;
}

.widget_form_input input {
}

.widget_form_button {
    margin-top:    7px;
    padding-right: 1%;
    text-align:    right;
}

.articles h2.featuredArticle a:hover,
.widget_content h2.featuredArticle a:hover {
    color: #8B70B2;
}

.articles span {
    font-style:    italic;
    display:       block;
    font-size:     11px;
    line-height:   13px;
    margin-bottom: 5px;
}

#copy .articles p.last {
    margin-bottom: 0 !important;
}

/* ================================= */
/* Register Form & Login Styles */
/* ================================= */
#membership-signupPage #content table.Details {
    background: #FFFFFF;
}

#membership-signupPage #content table.Details h2 {
    color: #FFFFFF;
}
.members_regform_heading {
    margin-top: 50px;
    margin-bottom: 30px;
}
.requiredFields {
    text-align: right;
}

.pass_styles {
    margin-left: 25%;
    padding-top: 11px;
    display:     block;
}
.pass_styles input {
    margin-top: 16px;
}

.pass_styles.forgotpass input {
    margin-top: 0px;
}
.pass_styles a {
    display: inline-block;
    padding: 1px 0;
    clear:   right;
}

.textinput.Turing {
    width:        66%;
    margin-top:   6px;
    float:        right;
    margin-right: 0;
}

/* ================================= */
/* Member Page Styles */
/* ================================= */

/* Members home */
.member_Welcome {
    margin-bottom: 0px;
}

.member_Welcome h2 {
    text-transform: capitalize;
    margin-bottom:  5px;
}

a .members_button {
    background: #FBFBFB;
    margin-top: 20px;
    width:      31%;
    float:      left;
    padding:    15px;
    box-sizing: border-box;
    min-height: 189px;
    text-align: center;
    color:      #000000;
}

a .members_button.centre {
    margin-right: 3%;
    margin-left:  3%;
}

.members_button:hover {
    background: #52426D;
    color:      #FFFFFF;
}

.members_button:hover h3, .members_button:hover i {
    color: #FFFFFF;
}

.members_button i {
    font-size: 60px;
    color:     #52426D;
}

.members_button h3 {
    line-height: 20px;
}

.members_button .icon_container {
    margin-bottom: 20px;
}

/* Members Exams Pages */
.members_table {
    padding: 0px 0 30px;
    margin:  30px 0 20px;
}

.members_table .cell {
    float:        left;
    margin-right: 10%;
}

.members_table thead tr {
    background: none;
}

.members_table thead tr td.title {
    border-bottom: 1px solid #3FB5E8;
    font-size:     15px;
    color:         #3FB5E8;
    text-shadow:   none;
}

.members_table tr td:first-child, .members_table tr td, .members_table tr td:last-child {
    border:        none;
    border-bottom: 1px solid #D8D8D8;
}

.members_table i {
    margin-right: 6px;
    font-size:    14px;
}

.members_table a {
    margin-right: 15px;
}

.members_table td.star {
    padding-right: 0;
    width:         20px;
}

.members_table .star a {
    margin: 0;
}

.members_table td.star i {
    color:     #3FB5EB;
    font-size: 17px;
}

.members_table td.star a i:hover {
    color:     #E1E7ED;
    font-size: 17px;
}
.members_table .options {
    min-width: 148px;
}

/* ================================= */
/* Blog */
/* ================================= */

.displaying {
    text-align: center;
}

p.nextprevnav {
    display:    block;
    text-align: center;
    margin:     0px 0 0 0;
}

.blogListingThumb {
    float:        left;
    width:        17%;
    margin-right: 4%;
    text-align:   center;
}

.blogListingContainerWImage {
    float: left;
    width: 79%;
}

#content .blogListingContainer p {
    margin: 0 0 10px 0;
}

.blogDate {
    color: #CCCCCC;
}

.blogAddThisTop {
    float: right;
    width: 124px;
}

.blogMetaInfo {
    background-color: #F5F5F5;
    margin:           10px 0;
    overflow:         hidden;
    padding:          10px 10px;
}

.blogMetaInfo,
.blogMetaInfo a {
    color: #999999;
}

/* ================================= */
/* Footer */
/* ================================= */

#footer_partners {
    background-color: #52426d;
    color: #ffffff;
    padding-top: 50px;
    padding-bottom: 50px;
    text-align: center;
}

#footer_partners h2 {
    color: inherit;
    margin-bottom: 40px;
}

#footer_partners .partners {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#footer_partners .partners .image_wrap {
    box-sizing: border-box;
    padding: 5px;
}


#footer_subscribe {
    padding-top: 50px;
    padding-bottom: 50px;
}

body:not(.home_page) #footer_subscribe {
    background-color: #52426d;
    color: #ffffff;
}

body:not(.home_page) #footer_subscribe h4 {
    color: inherit;
}

body:not(.home_page) #footer_subscribe #subForm > div input {
    border: 0 !important;
}

#footer_subscribe h4 {
    color: #3fb5e8;
    font-family: 'Montserrat', sans-serif;
    text-align: center;
    font-size: 24px;
    line-height: 1.2;
    font-weight: bold;
    margin-bottom: 20px;
}

#footer_subscribe #subForm {
    display: flex;
    margin-top: 50px;
}

#footer_subscribe #subForm > div {
    flex-grow: 1;
    flex-shrink: 1;
    position: relative;
    padding-right: 20px;
}

#footer_subscribe #subForm > div label {
    position: absolute;
    left: 0;
    bottom: 100%;
    margin-bottom: 5px;
    font-size: 14px;
    font-family: 'Montserrat', sans-serif;
    font-weight: bold;
}

#footer_subscribe #subForm > div input {
    height: 100%;
}

#footer_subscribe #subForm > div input:invalid {
  background: #ffffff;
}

#footer_subscribe #subForm > button {
    font-size: 16px;
}

@media only screen and (max-width: 767px) {
    #footer_subscribe #subForm {
        flex-direction: column;
        margin-top: 0;
    }

    #footer_subscribe #subForm > div {
        padding-right: 0;
        padding-bottom: 20px;
    }

    #footer_subscribe #subForm > div label {
        position: static;
    }

    #footer_subscribe #subForm > div input,
    #footer_subscribe #subForm > button {
        height: 45px;
    }
}


#footer {
    background-color: #3fb5e8;
    color: #ffffff;
    padding-top: 50px;
    padding-bottom: 50px;
}

#footer a {
    color: inherit;
    transition: all 0.2s ease;
}

#footer a:hover {
    color: #52426d;
}

#footer .row {
    display: flex;
    align-items: center;
}

#footer .footer_list {
    flex-grow: 1;
    flex-shrink: 1;
}

#footer .footer_list ul {
    margin-left: -5px;
    margin-right: -5px;
    width: calc(100% + 10px);
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

#footer .footer_list ul li {
    padding-left: 5px;
    padding-right: 5px;
}

#footer .footer_logo {
    flex-shrink: 0;
    flex-grow: 0;
    margin-left: 50px;
}

#footer_credit {
    padding: 50px 0;
    color: #888;
    font-style: italic;
    font-size: 12px;
}

#footer_credit img {
    margin-top: 20px;
    max-width: 70%;
}

.site_by {
    display: block;
    padding: 10px 0 0;
}

.footerNav {
    margin-bottom: 10px;
}

#footer_bottom li {
    display:    inline;
    list-style: none;
}

.byLine {
    white-space: nowrap;
}

.byLine span {
    position: relative;
    display:  inline-block;
    top:      -6px;
    margin:   0 3px 0;
}

#footer_bottom {
    background: #52426D;
    font-size:  13px;
    color:      #FFFFFF;
    padding:    23px 0;
}

#footer_bottom a {
    color: #FFFFFF;
}

#footer_bottom ul {
    margin-bottom: 0px;
}

#footer_bottom li {
    margin-right: 10px;
}

#footer_bottom .right {
    text-align: right;
}

#footer_bottom li a {
    color: #FFFFFF;
}

#footer_bottom li a:hover, #footer_bottom .right a:hover {
    color: #EEEEEE;
}

/* ================================= */
/* Sitemap */
/* ================================= */

#content ul.sitemap {
    list-style: none;
    margin:     0px;
    padding:    0px;
}

ul.sitemap li a {
    padding: 5px 0px 3px;
    display: block;
}

ul.sitemap a:hover {
    color: #000000;
}

ul.sitemap li.sitemapHeading > a {
    font-size:     16px;
    padding:       10px 5px;
    margin:        0px 0px 0px;
    border-bottom: 1px solid #DDDDDD;
    font-weight:   bold;
    display:       block;
}

ul.sitemap li.sitemapHeading > a:hover {
    background:    #EEEEEE;
    border-bottom: 1px solid #AAAAAA;
}

.byLine {
    white-space: nowrap;
}

.byLine span {
    position: relative;
    display:  inline-block;
    top:      -5px;
    margin:   0 3px 0;
}

/* ================================= */
/* Breadcrumbs */
/* ================================= */

#breadcrumbs {
    display: block;
    width:   100%;
}

#content #breadcrumbs ul {
    list-style: none;
    margin:     6px 0 0;
    display:    block;
    position:   relative;
    text-align: center;
}

#content #breadcrumbs ul li {
    display: inline;
    padding: 0 5px 0 0;
}

#content #breadcrumbs ul li::before {
    content: none;
}

#content #breadcrumbs ul li a {
    padding:   0 5px 0 0;
    color:     #969B9D;
    font-size: 14px;
}

#content #breadcrumbs ul li a:hover {
    color: #8B70B2;
}

#content span.breadcrumbDivider {
    color:       #969B9D;
    padding:     0;
    display:     inline-block;
    font-size:   16px;
    line-height: 14px;
}

#content #breadcrumbs ul li a.currentBreadcrumb {
    font-weight:    bold;
    text-transform: none;
}

/* ================================= */
/* Enquiry Form */
/* ================================= */

.required_fields_heading {
    font-size: 11px;
}

.form_required i, .required_fields_heading i {
    color: #FF0000;
}

.form_label, .form_required, .form_field {
    margin: 6px 0;
}

.form_label {
    width:   20%;
    padding: 7px 0 0 0;
    clear:   both;
}

.form_required {
    width:   5%;
    padding: 10px 0 0 0;
}

.form_field {
    width:      75%;
    min-height: 30px;
}

#content .errorInput {
    background: url(/images/icons/error.gif) no-repeat right 3px #FFFFFF;
    box-shadow: #E59595 0 0 4px;
    border:     1px solid #CC0000;
}

.imageVerification * {
    vertical-align:  middle;
    margin:          0 5px 0 0;
    text-decoration: none !important;
}

.imageVerification input {
    width: 25%;
}

.errorText {
    color: #CC0000;
}

input.hintText, .form_note {
    color: #999999;
}

/* ================================= */
/* Form Fields Inputs */
/* ================================= */

input, textarea, select {
    font-family: Arial, Helvetica, sans-serif;
    font-size:   12px;
    outline:     none;
}

input[type="text"], input[type="email"], input[type="number"], input[type="url"], input[type="password"], textarea, select {
    width:         100%;
    border-radius: 3px;
    padding:       6px;
    border:        1px solid #BABABA;
    box-shadow:    rgba(255, 255, 255, 0) 0 0 4px;
    transition:    box-shadow linear 0.2s, border linear 0.2s;
    box-sizing:    border-box;
}

input[type="text"]:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus {
    border:     1px solid #37BBEB !important;
    box-shadow: #37BBEB 0 0 4px !important;
}

/* Custom Select Boxes */

.custom_select, .custom_select_style2 {
    position: relative;
}

.custom_select select {
    background:                 transparent;
    -webkit-appearance:         none;
    appearance:                 none;
    -moz-appearance:            none;
    position:                   relative;
    width:                      100% !important;
    height:                     26px !important;
    line-height:                13px;
    padding-right:              34px;
    z-index:                    10;
    max-width:                  223px;
    border-left:                1px solid #D7D7D7;
    border-top-right-radius:    0px !important;
    border-bottom-right-radius: 0px !important;
    border:                     0;
    outline:                    none;
}

/* dynamically created SPAN, placed below the SELECT */
.custom_select span {
    position:    absolute;
    top:         0;
    float:       left;
    left:        0;
    right:       0;
    height:      26px;
    text-indent: 10px;
    background:  #F1F3F5 url(/images/backgrounds/select_dropdown.png) no-repeat right center;
    color:       #716C6C;
    cursor:      default;
    z-index:     1;
    text-align:  left;
    font-size:   13px;
    text-shadow: 0px 1px 0px rgba(255, 255, 255, 1);
}

/* Custom Select Box Style 2 */

.custom_select_style2 select {
    background:         transparent;
    -webkit-appearance: none;
    appearance:         none;
    -moz-appearance:    none;
    position:           relative;
    z-index:            10;
    width:              100% !important;
    height:             33px !important;
    line-height:        15px;
    border:             none;
    padding:            6px 28px 6px 6px;
}

.custom_select_style2 span {
    position:      absolute;
    bottom:        0;
    float:         left;
    left:          0;
    right:         0;
    height:        31px;
    text-indent:   10px;
    background:    #F1F3F5 url(/images/backgrounds/select_dropdown_style_2.png) no-repeat right top;
    border-radius: 3px;
    color:         #716C6C;
    cursor:        default;
    z-index:       1;
    border:        1px solid #B7B8B8;
    text-align:    left;
    font-size:     13px;
    text-shadow:   0px 1px 0px rgba(255, 255, 255, 1);
}

/* Custom Shadow for Input Boxes */
.shadow_input {
    box-shadow: inset 1px 1px 2px 0px rgba(0, 0, 0, 0.1) !important;
}

.shadow_input:hover {
    box-shadow: inset 1px 1px 3px 0px rgba(0, 0, 0, 0.2) !important;
}

input[type="text"].shadow_input:focus, .shadow_input input[type="text"].shadow_input:active {
    box-shadow: inset 1px 1px 3px 0px rgba(0, 0, 0, 0.2) !important;
}

/* Custom Rounded Input Box's */

.custom_input {
    position: relative;
    width:    100%;
}

.custom_input ::-webkit-input-placeholder {
    font-style:  italic;
    color:       #A3A3A3;
    font-size:   11px;
    line-height: 17px;
}

.custom_input :-moz-placeholder {
    /* Firefox 18- */
    font-style:  italic;
    color:       #A3A3A3;
    font-size:   11px;
    line-height: 17px;
}

.custom_input ::-moz-placeholder {
    /* Firefox 19+ */
    font-style:  italic;
    color:       #A3A3A3;
    font-size:   11px;
    line-height: 17px;
}

.custom_input :-ms-input-placeholder {
    font-style:  italic;
    color:       #A3A3A3;
    font-size:   11px;
    line-height: 17px;
}

.custom_input input[type=text] {
    border-radius: 15px;
    margin-top:    2px;
    padding:       6px 26px 6px 12px;
    font-size:     15px;
}

.custom_input input[type=submit] {
    padding:       7px 11px !important;
    border-radius: 4px;
}

/*custom magnifiying glass */
.custom_input input[type=image] {
    position: absolute;
    top:      9px;
    right:    9px;
}

/* ================================= */
/* Tables */
/* ================================= */

table.invisibleTable tr:hover .mceLayout td {
    border-top: 1px solid #CCCCCC;
}

table.invisibleTable tr .mceLayout td table {
    margin: 10px 0 5px !important;
}

/* ================================= */
/* Buttons */
/* ================================= */

input[type="submit"], button, .button {
    padding:       15px 30px;
    background:    #3fb5e8;
    display:       inline-block;
    font-size:     13px;
    font-weight:   600;
    line-height:   1.2;
    color:         #FFFFFF;
    text-align:    center;
    cursor:        pointer;
    width:         auto;
    border:        0;
    border-radius: 8px;
    transition:    all 0.2s ease;
}

input[type="submit"]:hover, button:hover, .button:hover {
    background: #55cff0;
    color: #FFFFFF;
    text-decoration: none;
}

input[type="submit"]:active, button:active, .button:active {
    background: #289ae0;
    outline:    0;
}

.button.small {
    padding: 6px 16px;
    font-size: 12px;
}

.button.large {
    padding:     15px 40px;
    font-size:   16px;
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4);
}

.button.purple {
    background: #8b70b2;
}

.button.purple:hover {
    background: #a289c6;
}

.button.purple:active {
    background: #52426d;
}

/* ================================= */
/* Errors / Info / Caution */
/* ================================= */

.error_box, .info_box {
    margin:       0 0 15px 0;
    padding:      15px;
    border-width: 3px;
    border-style: solid;
    color:        #555555;
}

.error_box {
    border-color:     #C30000;
    background-color: #FFF2ED;
    color:            #C30000;
}

.info_box {
    border-color:     #D5F296;
    background-color: #F2FCDC;
}

#content .error_box ul {
    margin-bottom: 0;
}

.info_box i {
    margin: 0 8px 0 0;
}

/* ================================= */
/* Message Boxes */
/* ================================= */

.msg_box {
    position:     relative;
    margin:       20px 0;
    padding:      10px 10px 10px 45px;
    width:        640px;
    width:        94.2%;
    border-width: 2px;
    border-style: solid;
    /* border-radius: 5px; */
    color:        #555555;
}

.msg_box.info {
    background:   #E1F2F7 url('/images/icons/information.png') no-repeat 15px 11px;
    border-color: #C5E4ED;
}

.msg_box.success {
    background:   #F2FCDC url('/images/icons/accept.png') no-repeat 15px 11px;
    border-color: #D5F296;
}

.msg_box.caution {
    background:   #FFFCD9 url('/images/icons/error.png') no-repeat 15px 11px;
    border-color: #F5F0AE;
}

.msg_box.error {
    background:   #FFF2ED url('/images/icons/exclamation.png') no-repeat 15px 11px;
    border-color: #F5C2AE;
}

.msg_box a.close {
    position: absolute;
    top:      3px;
    right:    0px;
    padding:  5px 10px;
}

/* ================================= */
/* Icons */
/* ================================= */

.small-icon {
    font-size: 14px;
}

.medium-icon {
    font-size:      22px;
    vertical-align: middle;
}

.large-icon {
    font-size:      35px;
    vertical-align: middle;
}

/* ================================= */
/* TinyMCE */
/* ================================= */

.editor {
    width: 100%;
}

.mini_editor {
}

#content .mceEditor table {
    margin: 0;
}

/* ====================================== MODULES ====================================== */

/* ================================= */
/* Locations / Locator Module */
/* ================================= */

#locationSearch {
    font-size:   11px;
    line-height: 20px;
    color:       #FFFFFF;
    padding:     20px 9px;
    background:  #ED5C33;
    position:    relative;
    margin:      0 0 18px 0;
}

.locationSearchHeading {
    font-size:   16px;
    font-weight: bold;
}

#content #locationSearch span.locationIcon {
    background-image: url(/images/buttons/locator_icon.png);
    bottom:           16px;
}

#locationSearch input[type="text"] {
    width:        80%;
    padding:      3px 33px 3px 7px;
    height:       16px;
    line-height:  16px;
    background:   #CCCCCC !important;
    border-color: #FFFFFF !important;
    color:        #FFFFFF;
    font-size:    11px;
    margin-top:   4px;
}

::-webkit-input-placeholder {
    color: #999999;
}

:-moz-placeholder {
    color: #999999;
}

#locationSearch input[type="text"]:focus {
    box-shadow: #FFFFFF 0 0 4px !important;
}

#locationSearch input[type="image"] {
    position: absolute;
    right:    14px;
    bottom:   21px;
}

#location_search_map {
    height: 600px;
}

.state-box {
    margin-bottom: 20px;
}

#store-location-text li {
    margin-bottom: 10px;
}

.location_num {
    background:  url(/images/backgrounds/locator_num_bg.png) no-repeat;
    color:       #FFFFFF;
    width:       20px;
    height:      27px;
    text-align:  center;
    font-weight: bold;
    padding:     2px 0 0;
}

.location_content {
    margin-left: 27px;
}

#store-location-text h2 {
    margin-bottom: 10px;
}

#store-location-text h3 {
    margin-bottom: 5px;
}

#store-location-text h3 a {
    color: #1E1E1E;
}

.contactDetailsTable td {
    padding: 0 10px 10px 0;
}

a.phoneLink {
    color: #1E1E1E;
}

#location_map {
    height: 300px;
}

.people_wrapper {
}

.people_person {
}

.people_person a, .people_person a:active {
    display:       block;
    border-bottom: 1px solid transparent;
    padding:       0 0 8px;
    margin:        0 0 8px;
}

.people_person a:hover {
    border-bottom: 1px solid #ED5C33;
}

.people_person img {
    display:    block;
    text-align: center;
}

img.people_person_image, .people_person img {
    border: 4px solid #EEEEEE;
}

.people_person a:hover img {
    border: 4px solid #ED5C33;
}

.people_person a:hover p {
    color: #ED5C33;
}

.people_person p {
    display:     block;
    font-weight: bold;
    font-size:   13px;
    margin:      0 !important;
    padding:     8px 0 0;
    color:       #111111;
}

.people_person p span {
    font-weight: normal;
    font-style:  italic;
    font-size:   12px;
}

/* ================================= */
/* FAQs Module */
/* ================================= */

.faq_title {
    cursor: pointer;
}

#content .resource_faqs > .faqs {
    margin: 0;
}

/* ====================================== PLUGINS ====================================== */

/*
 * jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */

/* Browser Resets */
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus {
    outline: none;
}

.slides,
.flex-control-nav,
.flex-direction-nav {
    margin:     0;
    padding:    0;
    list-style: none;
}

/* FlexSlider Necessary Styles
*********************************/
#content .flexslider ul, .flexslider {
    margin:  0 0 0;
    padding: 0;
}

.flexslider .slides > li {
    display:                     none;
    -webkit-backface-visibility: hidden;
}

/* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {
    width:   100%;
    display: block;
}

.flex-pauseplay span {
    text-transform: capitalize;
}

.flexslider li {
    position: relative;
}

.banner_text h2 {
    font-size: 40px;
    line-height: 1.2;
    color: #FFFFFF;
}

.banner_text p {
    font-weight: normal;
    color: #FFFFFF;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
}

.banner_text .button {
    margin-top: 30px;
}

/* Clearfix for the .slides element */
.slides:after {
    content:     ".";
    display:     block;
    clear:       both;
    visibility:  hidden;
    line-height: 0;
    height:      0;
}

html[xmlns] .slides {
    display: block;
}

* html .slides {
    height: 1%;
}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {
    display: block;
}

/* FlexSlider Default Theme
*********************************/
.flexslider {
    margin:     10px 0 5px;
    background: #FFFFFF;
    position:   relative;
    zoom:       1;
    overflow:   hidden;
}

.flex-viewport {
    max-height: 2000px;
    transition: all 1s ease;
}

.loading .flex-viewport {
    max-height: 300px;
}

.flexslider .slides {
    zoom:   1;
    margin: 0;
}

.carousel li {
    margin-right: 5px
}

.flexslider ul, .flexslider ol {
    margin-bottom: 0 !important;
}

.flexslider ul li {
    margin-bottom: 0 !important;
    padding:       0 !important;
}

/* Direction Nav */
.flex-direction-nav a {
    width:       36px;
    height:      39px;
    margin:      -20px 0 0;
    display:     block;
    background:  url(/images/backgrounds/bg_direction_nav.png) no-repeat 0 0;
    position:    absolute;
    top:         -150px;
    cursor:      pointer;
    text-indent: -9999px;
    opacity:     0;
    transition:  all .3s ease;
}

.flex-direction-nav .flex-next {
    background-position: 0 -39px;
    right:               -36px;
}

.flex-direction-nav .flex-prev {
    left: -36px;
}

.flexslider:hover .flex-next {
    opacity: 1;
    right:   0;
}

.flexslider:hover .flex-prev {
    opacity: 1;
    left:    0;
}

.flex-direction-nav .disabled {
    opacity: .3 !important;
    cursor:  default;
}

/* Control Nav */
.flex-control-nav {
    pointer-events: none;
    position:       absolute;
    bottom:         6%;
    left:           0.5%;
    text-align:     center;
    margin-bottom:  0;
}

.flex-control-nav li {
    display:     inline-block;
    zoom:        1;
    *display:    inline;
    margin-left: 9px;
}

.flex-control-paging li a {
    width:          17px;
    height:         17px;
    display:        block;
    background:     #d6d6d6;
    cursor:         pointer;
    font-size:      0;
    border-radius:  50%;
    position:       relative;
    transition:     all 0.2s ease;
    pointer-events: all;
}

.flex-control-paging li a:hover {
    background: #8b70b2;
}

.flex-control-paging li a.flex-active {
    background: #8b70b2;
}

.flex-control-thumbs {
    margin:   5px 0 0;
    position: static;
    overflow: hidden;
}

.flex-control-thumbs li {
    width:  25%;
    float:  left;
    margin: 0;
}

.flex-control-thumbs img {
    width:   100%;
    display: block;
    opacity: .7;
    cursor:  pointer;
}

.flex-control-thumbs img:hover {
    opacity: 1;
}

.flex-control-thumbs .active {
    opacity: 1;
    cursor:  default;
}

/* **********************************************************************************
    Tipsy
    ********************************************************************************** */
a.tooltip {
    color: #8B70B2!important;
}
a.tooltip:hover {
    color: #CDA7FF!important;
}
.tipsy {
    font-size: 10px;
    position:  absolute;
    padding:   5px;
    z-index:   100000;
}

.tipsy-inner {
    background-color: #000000;
    color:            #FFFFFF;
    max-width:        200px;
    padding:          5px 8px 4px 8px;
    text-align:       center;
}

/* Rounded corners */
.tipsy-inner {
    border-radius: 3px;
}

/* Uncomment for shadow */
/*.tipsy-inner { box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; }*/

.tipsy-arrow {
    position:    absolute;
    width:       0;
    height:      0;
    line-height: 0;
    border:      5px dashed #000000;
}

/* Rules to colour arrows */
.tipsy-arrow-n {
    border-bottom-color: #000000;
}

.tipsy-arrow-s {
    border-top-color: #000000;
}

.tipsy-arrow-e {
    border-left-color: #000000;
}

.tipsy-arrow-w {
    border-right-color: #000000;
}

.tipsy-n .tipsy-arrow {
    top:                 0px;
    left:                50%;
    margin-left:         -5px;
    border-bottom-style: solid;
    border-top:          none;
    border-left-color:   transparent;
    border-right-color:  transparent;
}

.tipsy-nw .tipsy-arrow {
    top:                 0;
    left:                10px;
    border-bottom-style: solid;
    border-top:          none;
    border-left-color:   transparent;
    border-right-color:  transparent;
}

.tipsy-ne .tipsy-arrow {
    top:                 0;
    right:               10px;
    border-bottom-style: solid;
    border-top:          none;
    border-left-color:   transparent;
    border-right-color:  transparent;
}

.tipsy-s .tipsy-arrow {
    bottom:             0;
    left:               50%;
    margin-left:        -5px;
    border-top-style:   solid;
    border-bottom:      none;
    border-left-color:  transparent;
    border-right-color: transparent;
}

.tipsy-sw .tipsy-arrow {
    bottom:             0;
    left:               10px;
    border-top-style:   solid;
    border-bottom:      none;
    border-left-color:  transparent;
    border-right-color: transparent;
}

.tipsy-se .tipsy-arrow {
    bottom:             0;
    right:              10px;
    border-top-style:   solid;
    border-bottom:      none;
    border-left-color:  transparent;
    border-right-color: transparent;
}

.tipsy-e .tipsy-arrow {
    right:               0;
    top:                 50%;
    margin-top:          -5px;
    border-left-style:   solid;
    border-right:        none;
    border-top-color:    transparent;
    border-bottom-color: transparent;
}

.tipsy-w .tipsy-arrow {
    left:                0;
    top:                 50%;
    margin-top:          -5px;
    border-right-style:  solid;
    border-left:         none;
    border-top-color:    transparent;
    border-bottom-color: transparent;
}

/* =============================================[ Member Faves ] */
.fave i {
    color: #E1E7ED;
}

.not-fave i {
    color: #FFFFFF;
}


#feedback {
    box-sizing: border-box;
    position: fixed;
    z-index: 1000;
    width: 220px;
    height: auto;
    right: -220px;
    top: 25%;
    background: #FFF;
    padding: 20px 20px 20px;
    box-shadow: 0 0 20px 0 rgba(0,0,0,0.15);
    transition: all 500ms ease;
}

#feedback.open {
    right: 0;
}

#feedback i {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 18px;
    transition: color 200ms ease;
    cursor: pointer;
}

#feedback i:hover {
    color: #3FB5E9;
}

#feedback h4 {
    margin-bottom: 15px;
}

#feedback [type=radio] {
    position: absolute;
    visibility: hidden;
}

#feedback [type=radio] + label {
    position: relative;
    display: block;
    padding-left: 28px;
    margin: 0 0 10px;
    transition: color 200ms ease;
}

#feedback [type=radio] + label:hover {
    color: #3FB5E9;
}

#feedback [type=radio] + label:before {
     content: '';
     display: block;
     width: 16px;
     height: 16px;
     position: absolute;
     top: 0;
     left: 0;
     border: 1px solid #DDD;
     border-radius: 100%;
     background: #FFF;
 }

#feedback [type=radio] + label:after {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    position: absolute;
    top: 4px;
    left: 4px;
    border-radius: 100%;
    background: #3FB5E9;
    transition: all 200ms ease;
    opacity: 0;
    transform: scale(0);
}

#feedback [type=radio]:checked + label:after {
    opacity: 1;
    transform: scale(1);
}

#feedback .button {
    margin-top: 15px;
}

#feedback .title {
    position: absolute;
    background: #FFF;
    padding: 8px 12px;
    transform: rotate(90deg) translateX(-50%);
    transform-origin: 0 0;
    left: 0px;
    margin: 0;
    top: 50%;
    border: 1px solid #ddd;
    border-top: none;
    color: #555;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 8px 8px 0 rgba(0,0,0,0.05);
}