/*
   *****************************
   ******** HOME PAGE **********
   *****************************
*/

/* HOME PAGE SLIDER */
* {
    box-sizing: border-box;
}

#header_extras, #header_inner {
    z-index: 999999;
    position: relative;

}

.fgallerybackground {
    margin-left:  -1000px;
    margin-right: -1000px;
    padding-left:  1000px;
    padding-right: 1000px;
    background-image: url( '/assets/uploads/2016/05/EnspiraBackground.jpg' );
    position: absolute;
    margin-top: -61px;
    width: 3000px;
    overflow: hidden;
}

@media (max-width: 768px) {
    .fgallerybackground {
        margin-top: 35px;
    }
}

@media (min-width: 992px) {
    .entry {
        /*margin-top: 180px; // To clear the header*/
    }
}

.fgallery {
    /*  background: clear; */
    height: 350px;
    /* Ensure the slider appears behind everything else */
    z-index: -999999;
    width: 100%;
}

.flickity-viewport
{
}
/*
.gallery-cell {
  width: 55%;
  height: 350px;
  margin-right: 45%;
}

.gallery-cell-image {
  display: block;
  max-height: 100%;
  margin: 0;
  max-width: 100%;
  height: 350px;
  width: 400px;
  z-index: -1;
}
*/

.gallery-cell {
    width: 95%;
    margin-right: 85%;
    /*   line-height: 350px; */
    font-size: 80px;
    color: white;
    z-index: -1;
    text-align: center;
}

.gallery-cell-image {
    z-index: -1;
}

div#homepageherosection {
    text-align: center;
}


/* Call out section with Hero Icons */
.homepageherosectionheader {
    color: #696869;
    font-size: 60px;
    font-family: bariolweb, 'Open Sans', sans-serif;
    padding-top: 40px;
    text-align: center;
    margin-bottom: 25px;
}

.homepageherosectiontext {
    color: #696869;
    font-family: bariolweb, 'Open Sans', sans-serif;
    font-size: 22px;
    line-height: 30px;
    margin-bottom: 45px;
    padding-top: 20px;
    text-align: center;
}


.divCircle {
    border-radius: 50%;
    behavior: url(PIE.htc); /* remove if you don't care about IE8 */
}

.homePageCircle {
    width: 80px;
    height: 80px;
    margin: auto;
    vertical-align: middle;
    margin-bottom: 15px;
}

.homePageCircleStart {
    background: #3fb494;
    border: 1px solid #3fb494;
}

.homePageCircleScale {
    background: #d74b51;
    border: 1px solid #d74b51;
}
.homePageCircleSecure {
    background: #ae62a7;
    border: 1px solid #ae62a7;
}

.homePageCircleTitle {
    color: #696869;
    font-size: 32px;
    font-family: bariolweb, 'Open Sans', sans-serif;
    padding-top: 40px;
    text-align: center;
    margin-bottom: 25px;
}

.homepageActionButtons {
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
}

/* Buttons at the bottom of hero section */
.homepageActionButton, .homepageActionButtonBlue, .homepageActionButtonGreen,
.homepageActionButtonRed, .homepageActionButtonPurple, .homepageActionButtonWhite,
.homepageActionButtonGrey {
    margin-bottom: 5px;
    min-width: 130px;
    display: inline-block;
    height: 40px;
    padding-top: 8px;
    border: 2px solid #b6b6b6;
    border-radius: 4px;
    font-size: 14px;
    vertical-align: middle;
    text-align: center;
}

.homepageActionButton + .homepageActionButton {
    margin-left: 3px;
}

/* Clear buttons with rollovers */
.homepageActionButton:hover, .homepageActionButton a:hover {
    color: #fff !important;
    text-decoration: none;
}

.homepageActionButtonGreen:hover, .homepageActionButtonGreen a:hover {
    background-color: #3fb494;
    color: #fff !important;
    border-color: #3fb494;
    text-decoration: none;
}

.homepageActionButtonRed:hover, .homepageActionButtonRed a:hover {
    background-color: #d74B51;
    color: #fff !important;
    border-color: #d74B51;
    text-decoration: none;
}

.homepageActionButtonPurple:hover, .homepageActionButtonPurple a:hover {
    background-color: #ae62a7;
    color: #fff !important;
    border-color: #ae62a7;
    text-decoration: none;
}

.homepageActionButtonBlue:hover, .homepageActionButtonBlue a:hover {
    background-color: #0f8dc0;
    color: #fff !important;
    border-color: #0f8dc0;
    text-decoration: none;
}

.homepageActionButtonWhite:hover, .homepageActionButtonWhite a:hover {
    background-color: #0f8dc0;
    color: #fff !important;
    border-color: #0f8dc0;
    text-decoration: none;
}


.homepageActionButtonGreen:hover, .homepageActionButtonGreen a:hover {
    background-color: #3fb494;
    color: #fff !important;
    border-color: #3fb494;
    text-decoration: none;
}


/* Blue buttons with rollovers */
.homepageActionButtonBlue
{
    border: 2px solid #0f8dc0;
    background-color:  #0f8dc0;
    color: #fff !important;
    font-weight: bold;
}

.homepageActionButtonBlue:hover, .homepageActionButtonBlue a:hover {
    color: #0f8dc0 !important;
    text-decoration: none;
}


/* Green buttons with rollovers */
.homepageActionButtonGrey
{
    border: 2px solid #58595b;
    background-color:  #58595b;
    color: #fff !important;
    font-weight: bold;
}

.homepageActionButtonGrey:hover, .homepageActionButtonGrey a:hover {
    color: #58595b !important;
    text-decoration: none;
}


/* Red buttons with rollovers */
.homepageActionButtonRed
{
    border: 2px solid #d74b51;
    background-color:  #d74b51;
    color: #fff !important;
    font-weight: bold;
}

.homepageActionButtonRed:hover, .homepageActionButtonRed a:hover {
    color: #d74b51 !important;
    text-decoration: none;
    border: 2px solid #d74b51;
}


/* Purple buttons with rollovers */
.homepageActionButtonPurple
{
    border: 2px solid #a362a7;
    background-color:  #a362a7;
    color: #fff !important;
    font-weight: bold;
}

.homepageActionButtonPurple:hover, .homepageActionButtonPurple a:hover {
    color: #a362a7 !important;
    text-decoration: none;
}

.red_background_hover:hover    { background-color: #d74b51; border-color: #d74b51; }
.purple_background_hover:hover { background-color: #a362a7; border-color: #a362a7; }
.blue_background_hover:hover   { background-color: #0f8dc0; border-color: #0f8dc0; }
.yellow_background_hover:hover { background-color: #e98d23; border-color: #e98d23; }
.green_background_hover:hover  { background-color: #3fb494; border-color: #3fb494; }
.grey_background_hover:hover   { background-color: #58595b; border-color: #58595b; }
.white_background_hover:hover  { background-color: #ffffff; border-color: #6fb8d6; }


div#brickwall {
    position: absolute;
    background-image: url('/assets/uploads/2016/05/EnspiraBackground.jpg');
    width: 100%;
    height: 80px;
    top: 0px;
    left: 0px;
}

#craigsquotebackground {
    margin-top: 45px;
    padding: 25px;
    background-color: #138fbf;
    color: #fff;
    margin-left: -8000px;
    margin-right: -8000px;
    padding-top: 80px;
    padding-bottom: 80px;
}

#craigsquotecontent {
    padding: 0 8000px 0 8000px;
}

#industry-specialisation-background {
    background-color: #ac66a5;
    margin: 0 -8000px 0 -8000px;
    padding: 40px 5px 40px 5px;
    text-align: center;
}

#industry-specialisation-content {
    padding: 0 8000px 0 8000px;
}

.industry-specialisation-header {
    color: #fff;
    font-size: 38px;
    font-family: bariolweb, "Open Sans", arial, sans-serif  !important;
    min-height: 50px;
    margin: 35px auto 0 auto;
    text-align: center;
    padding: 20px 5px 10px 5px;
    width: 100%;
}

.industry-specialisation-box {
    border: 2px solid #fff;
    border-radius: 6px;
    display: grid;
    font-size: 24px;
    font-family: bariolweb, "Open Sans", arial, sans-serif  !important;
    font-weight: bold;
    margin: 0 auto 8px;
    min-height: 115px;
    text-align: center;
    place-items: center;
}

.industry-specialisation-box:hover {
    background-color: #fff;
    color: #686968 !important;
    cursor: pointer;
    text-decoration: none;
}


.industry-specialisation-link {
    color: #fff !important;
    text-decoration: none !important;
}

.industry-specialisation-link:hover {
    color: #686968 !important;
    text-decoration: none !important;
}




#workshopbackground {
    background-color: #e6e6e6;
    color: #666;
    margin: 0 -8000px 0 -8000px;
    padding: 40px 5px 40px 5px;
    text-align: center;
}

#workshopcontent {
    padding: 0 8000px 0 8000px;
}


.upcomingworkshopsHeader {
    font-size: 38px;
    font-family: bariolweb, "Open Sans", arial, sans-serif  !important;
    min-height: 50px;
    margin: 35px auto 0 auto;
    text-align: center;
    padding: 20px 5px 10px 5px;
    width: 100%;
}

#workshops {
    padding: 10px;
    margin: auto;
    background-color: #e6e6e6;
}

img {
    border-radius:6px;
}

section {
    padding:5px;
    margin:5px;
}

/* STRUCTURE */
#workshopwrap {
    width:920px;
    margin:0 auto;
    /*  background-color: #0f8dc0; */
    padding:0;
}

#left {
    width:280px;
    float:left;
}

#middle {
    width:280px;
    /* Account for margins + border values */
    float:left;
}

#right {
    width:280px;
    float:left;
}

/************************************************************************************
MEDIA QUERIES
*************************************************************************************/
/* for 980px or less */
@media screen and (max-width: 980px) {
    #workshopwrap {
        width:94%;
    }

    #left {
        width:20%;
        padding:1% 4%;
    }

    #middle {
        width:20%;
        padding:1% 4%;
        margin:0 0 5px 5px;
        float:right;
    }

    #right {
        clear:both;
        padding:1% 4%;
        width:auto;
        float:none;
    }

    header,footer {
        padding:1% 4%;
    }
}

/* for 700px or less */
@media screen and (max-width: 600px) {
    #left {
        width:auto;
        float:none;
    }

    #middle {
        width:auto;
        float:none;
        margin-left:0;
    }

    #right {
        width:auto;
        float:none;
    }
}

/* for 480px or less */
@media screen and (max-width: 480px) {
    header {
        height:auto;
    }

    h1 {
        font-size:2em;
    }

    #right {
        display:none;
    }
}

header,#left,#middle,#right {
    margin-bottom:5px;
}

/*
#workshopwrap, header, #content, #middle, #right, footer {
	border: solid 1px #ccc;
}
*/
#footer_inner {
    margin-top:-40px!important;
    border-top:none;
}


/* PULL QUOTES / TESTIMONIALS */

span.pullquote3 {
    border-top: 2px solid #888 !important;
    border-bottom: none;
    font-family: bariolweb, "Open Sans", arial, sans-serif  !important;
    font-style: italic !important;
    font-weight: normal !important;
}

.testimonial_author_name {
    text-align: right;
    font-family: bariolweb, 'Open Sans', sans-serif;
    font-size: 12px;
    font-weight: bold;
}