@charset "utf-8";
/* CSS Document */

@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700|Lora:400italic|Montserrat:400,700|Raleway:400,100,200,300,500,600,700,800|Dancing+Script");
@import url("css/bootstrap.css");
@import url("css/icons.css");
@import url("css/typography.css");
@import url("css/scrollbar.css");
@import url("css/animate.css");
@import url("cloudslider/css/cloudslider.css");
@import url("cubeportfolio/css/cubeportfolio.css");
@import url("nivo-lightbox/nivo-lightbox.css");
@import url("nivo-lightbox/themes/default/default.css");
@import url("css/click-hover-effects.css");
@import url("owl-carousel/assets/owl.carousel.css");
@import url("owl-carousel/assets/owl.theme.default.min.css");
@import url("css/theme.css");
@import url("css/color.css");
@import url("css/superslides.css");
@import url("css/jquery.kwicks.css");

/* ==========================================================================
   NOTE:
   Please put your custom css styles after this line to make it easy
   for you to manage your website whenever a new version of this template 
   is available.
   ========================================================================== */


/* educare */
.list-blue-bullets {
    list-style: none;
    padding:0;
    margin:0;
    margin-bottom:20px;
}

.list-blue-bullets li { 
    padding-left: 1em; 
    text-indent: -.7em;
}

.list-blue-bullets li:before {
    content: "\f111"; /* fa-circle */
    font-family: FontAwesome;
    color: #25aae1;    
    margin-right: 10px;
    font-size:9px;
    position:relative;
    top: -1px;
}

.list-blue-ticks {
    list-style: none;
    padding:0;
    margin:0;
    margin-bottom:20px;
}

.list-blue-ticks li { 
    padding-left: 2em; 
    text-indent: -17px;
    margin-top: 20px;
}

.list-blue-ticks li:before {
    content: "\f058"; /* fa-check-circle */
    font-family: FontAwesome;
    color: #25aae1;    
    font-size:18px;
    position:relative;
    top: 2px;
    left: -12px;
}

.fa-blue{
    color:#25aae1;
}

/*p.testimonial{
    padding:20px;
}

p.testimonial:nth-of-type(odd) {
    background: #f0f4f9;
}*/

.highlight-box{
    line-height: 12px;
    padding:6px;
    padding-left:24px;
    margin-top:24px;
    margin-bottom:24px;
    color: white !important;
}
.highlight-box h3, .highlight-box p{
    padding:0px; margin:0px;
    margin-left:58px;
    color: white !important;
}
.highlight-box span{
    float:left;
    font-size:48px;
}
.highlight-box a{
    color:white !important;
    text-decoration: none;
}
.highlight-box a:hover{
    text-decoration:underline;
}

.promotion-box{
    line-height: 12px;
    padding:6px;
    padding-left:24px;
    margin-top:24px;
    margin-bottom:24px;
    color: white !important;
    overflow:hidden;
    position:relative;
    height:80px;
}
.promotion-box-cicle{
    width:120px;
    height:120px;
    float:left;
    margin-right:20px;
    overflow:hidden;
    position:absolute;
    left:10px;
    top:-20px;
    border-radius: 60px;
    text-align: center;
    background-color:white;
}
.promotion-box-cicle h3{
    padding-top:8px;
    font-weight:400;
    text-transform: uppercase;
    font-size:14px !important;
    line-height: 20px;
}
.promotion-box-cicle strong{
    display:block;
    font-size:38px;
    margin-bottom:3px;
}
.health-light .promotion-box-cicle{
    border: 8px solid #ee73a4;
}
.health-light .promotion-box-cicle h3{
    color: #f3007e !important;
}
.sport-light .promotion-box-cicle{
    border: 8px solid #7ebee7;
}
.sport-light .promotion-box-cicle h3{
    color: #36a9e1 !important;
}
.education-light .promotion-box-cicle{
    border: 8px solid #f1ab68;
}
.education-light .promotion-box-cicle h3{
    color: #f39200 !important;
}
.charities-light .promotion-box-cicle{
    border: 8px solid #acde57;
}
.charities-light .promotion-box-cicle h3{
    color: #95c11f !important;
}
.promotion-box-content{
    padding-left: 140px;
}

.panel-body{
    padding:26px;
}


.btn-arrow{
    padding-right: 40px;
    background-image: url("../img/buttons/arrow.png") !important;
    background-repeat: no-repeat;
    background-position: right;
    border: none;
    color: white !important;
}
.btn-arrow:hover{
    text-decoration: none !important;
}

@media (min-width:760px){
    .dark-nav{
	background-color:black;
    }

    .dark-nav a,
    .dark-nav .dropdown-toggle span.fa,
    .dark-nav li.active span.fa,
    .dark-nav li a:hover span.fa,
    .dark-nav li a:focus span.fa,
    .dark-nav li a.active span.fa{
	color:rgb(255, 255, 255) !important;
    }

    .dark-nav a:hover, 
    .dark-nav a:focus, 
    .dark-nav a.active
    .dark-nav .open a{
	color:#25aae1 !important;
    }

}

.no-break-right a{
    padding-left:5px !important;
}

.line-break-right > a:before{
    content:'';
    width:1px;
    height:20px;
    position:absolute;
    top:50%;
    margin-top:-10px;
    left:-1px;
    background:#fff;
    opacity:0.2;
    filter:alpha(opacity=20);
}
@media (min-width:768px){
    .navbar-brand{
	line-height: 70px;
    }
}
@media (max-width:767px){
    .navbar-brand{
	line-height:50px !important;
    }
}
.top-nav-collapse .navbar-brand{
    height:50px !important;
    line-height:50px !important;
}
@media (min-width:768px){
    .top-nav-collapse .search-cart{
	margin-top:5px;
	margin-bottom: 0px;
    }
}
.centralise-menu{
    float:none !important;
    width: 100%;
}
@media (min-width:768px){
    .centralise-menu li + li > a.seperator:before{
	content:'';
	width:1px;
	height:30px;
	position:absolute;
	top:40%;
	margin-top:-10px;
	left:-1px;
	background:rgba(255,255,255,0.6);
    }

    .seperator{
	text-align:center;
    }
}

#query{
    padding:0px;
    padding-right:30px;
    margin:0px;
    margin-top:14px;
    border: 0px none white;
    border-right: 1px #CCCCCC solid;
    width:120px;
    display:none;
}

#query_go{
    display:none;
    font-weight: 300;
    background-color:white;
    padding:0px;
    margin:0px;
    margin-top:8px;
    margin-bottom:5px;
}

#query:focus {
    outline: none !important; 
    border: 0px none white !important;
    border-right: 1px #CCCCCC solid !important;
}

.lead .h1{
    font-size: 60px;
    font-weight: 300;
}

.lead{
    padding-bottom: 20px;
}

.background-grey{
    background-color:#e7e7e8;
}

.button-grid{
    margin-top:40px;
}

.button-grid .btn{
    margin-right:15px;
    margin-bottom:10px;
}

/*---------- icons ------------ */

.icon-white-circle{
    border-radius: 50%;
    width: 120px;
    height: 120px; 
    border: 6px white solid;
    margin-left:auto;
    margin-right:auto;
}

.icon-white-circle span{
    width: 80px;
    height: 80px;
    display: block;
    margin: 0 auto;
    margin-top:15px;
    font-size: 74px;
    line-height: 80px;
    text-align: center;
}

.info-circle{
    border-radius: 50%;
    width: 120px;
    height: 120px; 
    border: 6px white solid;
    margin-left:auto;
    margin-right:auto;
    color:white !important;
    text-align: center;
    line-height: 0px !important;
}

@media (min-width:768px){
    .background-dots{
	position:relative;
    }
    .background-dots:before{
	content:"";
	position:absolute;
	top:5px;
	left:20%;
	right:0;
	bottom:0;
	width:60%;
	height:60px;
	background-image:url('/img/decor/info-gram-dots.png');
	background-repeat:repeat-x;
	background-position: 0 25%;
    }
}


.info-circle-style-1 h3, .info-circle-style-1 h3,
.info-circle-style-1 h4, .info-circle-style-1 h4
{
    color: white !important;
}

.info-circle-style-1 span{
    margin-top:12px;
    font-size:32px;
}
.info-circle-style-1 h3{
    padding:0px;
    margin:0px;
    font-weight: 600;
}
.info-circle-style-1 h4{
    padding:0px;
    margin:0px;
    font-size:10px;
}
.info-circle-style-2{
    padding-top:28px;
}

.info-circle-style-2 h3{
    padding:0px;
    margin:0px;
    font-weight: 600;
    color:white;
}
.info-circle-style-2 h4{
    padding:0px;
    margin:0px;
    font-size:22px;
    font-weight: 300;
    line-height: 18px;
    color:white;
}

.info-circle-style-3 span,
.info-circle-style-4 span{
    margin-top:22px;
    font-size:58px;
}

.info-circle-style-2-subtext,
.info-circle-style-3-subtext
{
    text-align: center;
}
.info-circle-style-2-subtext h5{
    font-weight: 600;
    font-size:26px;
    line-height: 18px;
}
.info-circle-style-2-subtext h5 span{
    font-weight: 300;
    font-size:12px;
    line-height: 6px;
}
.info-circle-style-3-subtext h3{
    font-weight:600;
}
.info-circle-style-3-subtext p{
    font-size:12px;
}

.info-circle-style-4-subtext{
    text-align: center;
    font-size: 14px;
    font-weight: 600;
}

/* ---------- programmes-------------- */

.programme-grid{
    background-color:white;
    padding:40px;
}

.programme-list h3, .programme-grid h3{
    margin-top:0px;
}

.programme-grid .col-sm-6{
    margin-bottom:40px;
}

.programme-list img, .programme-grid img, .greyscale{
    //filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    //filter: gray; /* IE6-9 */
    //-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
    border: 1px solid white;
    outline: 1px solid grey;
}

.programme-list img:hover, .programme-grid img:hover, .greyscale:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
}

.programme-list hr{
    margin-top:35px;
    margin-bottom:35px;
}

.programme-details{
    margin-bottom:40px;
}

.programme-details h2{
    font-size:36px;
}

.programme-synopsis{
    //text-align: justify;
}

.programme-details .programme-synopsis{
    font-size:22px;
}

.programme-details .programme-image img{
    max-height:250px;
}

.programme-details .programme-image span {
    position: absolute;
    left: 178px;
    top: 0px;
    border-radius: 50%;
    width: 140px;
    height: 140px; 
    text-align: center;
    padding-top:35px;
    line-height:20px;
    background-color:#25aae1;
    color: white;
    border: 3px white solid;
}
.programme-details .programme-image span strong {
    font-size:28px;
}
.programme-details .programme-image span small{
    display:block;
    font-size:10px;
    margin-top:-5px;
}


@media screen and (max-width: 768px) {
    .programme-details .programme-image span {
	left: 25px;
	top: 240px;
	width: 100px;
	height: 100px; 
	padding-top:20px;
	line-height:20px;
	color: white;
	border: 3px white solid;
    }
}

/* adjust for porgrammes with multi-user data */

.programme-image.multi-user img{
    margin-top:70px;
    max-height:180px;
}

.programme-image.multi-user span{
    position: absolute;
    left: 90px;
    top: 10px;
    border-radius: 50%;
    width: 95px;
    height: 95px; 
    padding-top:20px;
    line-height:20px;
    border: 2px white solid;
}

.programme-image.multi-user span strong {
    font-size:20px;
}

/* ----------- logos -------------- */

.logo-grid {
    font-weight:600;
    background-color: #FFFFFF;
    padding-top: 24px;
    padding-bottom:28px;
 }

.logo-grid img{
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
    /*
    border: 1px solid white;
    outline: 1px solid grey;
    */
    margin-bottom: 15px;
    max-width: 150px;
    margin-left:auto;
    margin-right:auto;
}

.logo-grid img:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
}

.logo-grid .col-md-3, .logo-grid .col-md-6{
    min-height:200px;
    text-align: center;
}

/* ------------ arrow-boxes --------- */

.arrow-box {
    position: relative;
    padding:20px;
    padding-left:28px;
    padding-bottom:28px;
    min-height:280px;
    margin-bottom:40px;
    color: white;
}
.arrow-box:after {
    top: 100%;
    left: 20%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-width: 15px;
    margin-left: -15px;
}
.arrow-box h3{
    color: white !important;
}

.arrow-box.generic-light:after
{
    border-top-color: #999999;
}
.arrow-box.charities-light:after
{
    border-top-color: #95c11f;
}
.arrow-box.sport-light:after
{
    border-top-color: #36a9e1;
}
.arrow-box.health-light:after
{
    border-top-color: #f3007e;
}
.arrow-box.education-light:after
{
    border-top-color: #f39200;
}
.arrow-box.testimonial-light{
    color:inherit;
    background-color:#f0f4f9; 
    min-height:min-content;
    margin-bottom:20px;
    padding-bottom:10px;
}
.arrow-box.testimonial-light:after{
    border-top-color: #f0f4f9;
}
.testimonial-source{
    padding-left:20px;
    padding-top: 0px;
    margin-top: 0px;
}
.arrow-box.transparent{
    opacity: 0.8;
}

/*.arrow-box.transparent p, .arrow-box.transparent span{
    opacity: 1 !important;
}*/

.arrow-box .btn, .online-demo-content .btn{
    background-color:white !important;
    border-color:white !important;
    color:black !important;
}

.arrow-box .btn:hover, .online-demo-content .btn:hover{
    background-color:black !important;
    border-color:black !important;
    color:white !important;
}


/* ------------- triangles ----------- */


.hr-break{
    position:relative;
    background-color:#939598;
    height:1px !important;
    width:100% !important;
    margin-bottom:35px;
}

.hr-break:after {
    content:'';
    position: absolute;
    left: 52%;
    margin-left: -48px;
    width:45px;
    height: 23px;
    background-image: url("../img/decor/arrow.png");
}


.next-arrow-white {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding-bottom:3%;
    background-color: rgba(255, 255, 255, 1);
    left:0;
}
.next-arrow-white:before, .next-arrow-white:after {
    content:'';
    position: absolute;
    bottom: 99%;
    width: 50%;
    padding-bottom:inherit;
    background-color: inherit;
}
.next-arrow-white:before {
    right: 50%;
    -ms-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -ms-transform: skewX(45deg);
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
}
.next-arrow-white:after {
    left: 50%;
    -ms-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -ms-transform: skewX(-45deg);
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
}

.next-arrow-grey {
    position: absolute;
    bottom: 0;
    width: 100%;
    padding-bottom:3%;
    background-color: rgba(231, 231, 231, 1);
    left:0;
}
.next-arrow-grey:before, .next-arrow-grey:after {
    content:'';
    position: absolute;
    bottom: 99%;
    width: 50%;
    padding-bottom:inherit;
    background-color: inherit;
}
.next-arrow-grey:before {
    right: 50%;
    -ms-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -ms-transform: skewX(45deg);
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
}
.next-arrow-grey:after {
    left: 50%;
    -ms-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -ms-transform: skewX(-45deg);
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
}


.next-triangle-white, .next-triangle-grey{
    overflow:hidden;
    position:relative;
    display:block;
    padding-bottom:20px;
}


@media only screen and (min-width : 768px) {
    .next-triangle-white, .next-triangle-grey{
	padding-bottom:60px;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .next-triangle-white, .next-triangle-grey{
	padding-bottom:80px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .next-triangle-white, .next-triangle-grey{
	padding-bottom:120px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1601px) {
    .next-triangle-white, .next-triangle-grey{
	padding-bottom:150px;
    }
}

/*
 * Off Canvas
 * --------------------------------------------------
 */

.sidebar-offcanvas h2{
    font-size:16px;
    font-weight:600;
}

.sidebar-offcanvas .sidebar-seperator, hr{
    color:#acacac;
    border-color:#acacac;
}

@media screen and (max-width: 767px) {
    .row-offcanvas {
	position: relative;
	-webkit-transition: all 0.25s ease-out;
	-moz-transition: all 0.25s ease-out;
	transition: all 0.25s ease-out;
    }

    .row-offcanvas-left
    .sidebar-offcanvas {
	left: -50%;
    }

    .row-offcanvas-left.active {
	left: 50%;
    }

    .sidebar-offcanvas {
	position: absolute;
	top: 0;
	width: 50%;
	margin-left: 12px;
    }
}

.copyright{
    color:#696c6e !important;
    font-size:17px;
    margin-right:3px;
    margin-top: 24px;
    font-weight: normal;
}

a{
    text-decoration:none;
}

.container p a{
    color:rgb(52,121,183);
    text-decoration:none;
    font-weight: 400;
}
.container p a:hover{
    color:rgb(20,100,160);
    text-decoration:underline;
}

/* override the above general link styling for buttons */
.container p a.btn{
    color: #FFFFFF !important;
    text-decoration: none !important;
}

#slides{
    margin-top:120px;
}
@media screen and (max-width: 768px) {
    #slides{
	margin-top:40px;
    }
}

.mega-element h3, .mega-element h4, .mega-element p, .mega-element li, .mega-element i
{
    color: #FFFFFF; 
}

.mega-element h3{
    margin-top: 0px;
}

.mega-menu-sector, .mega-menu-sector-container 
{
    height: 64px;
}

.mega-element a:hover .mega-menu-sector-container i.fa-chevron-right
{
    color: #000000;
}

.mega-menu-sector p
{
    padding-top: 10px;
}

.mega-menu-sector i
{
    font-size:30px;
    margin-top: 15px;
}

.mega-menu-sector h4
{
    margin-top: 20px;
}

.mega-menu-sector p
{

}


#tweets {
    margin-bottom: 15px;
}
#tweets li, .tweets_txt{
    padding-left:0px;
    font-size: 14px !important;
}

.resp-tabs-list li:first-of-type{
    margin-left:18%;
}
@media screen and (max-width: 988px) {
    .resp-tabs-list li:first-of-type{
	margin-left:0px;
    }
}
.collapse-title{
    position: relative;
}
.collapse-icon{
    position: absolute;
    right: -20px;
    font-size:30px;
    color: #999999;
    top:32px;
    margin-right:40px;
    cursor: pointer;
}


.homepage-captions
{
    position: absolute;
    bottom: 400px;
    width: 100%;
}

.homepage-captions h1
{
    font-size: 96px !important;
    font-weight: 800 !important;
    line-height: 120px !important;
    letter-spacing: -6px;
    padding: 0px !important;
    margin: 0px !important;
}

.homepage-captions h2
{
    font-size: 46px !important;
    font-weight: 800 !important;
    line-height: 46px !important;
    padding: 0px !important;
    margin: 0px !important;
    letter-spacing: -1px;
}

@media screen and (max-width: 768px) {
    .homepage-captions
    {
	position: absolute;
	bottom: 65%;
    }

    .homepage-captions h1
    {
	font-size: 32px !important;
	line-height: 32px !important;
	letter-spacing: normal;
    }

    .homepage-captions h2
    {
	font-size: 18px !important;
	line-height: 18px !important;
	letter-spacing: normal;
	font-weight: 600 !important;
    }
}


			

.absolute-center {
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
  align-items: center;
}

.accordion-title{
    padding:16px;
    padding-left:0px;
    cursor: pointer;
}
.accordion-title h4{
    margin: 0px;
    padding: 0px;
    font-size:16px;
}
.accordion-title h4:hover{
    color: #3884b4;
}
.educare-accordion{
    margin-bottom:10px;
    border-bottom: 1px solid #DEDEDE;
}
.accordion-content{
    padding: 26px;
    background-color: #DEDEDE;
}
.accordion-icon{
    float:right;
}
.icon-blue{
    color: #25aae1;
}

/* rich editor user content formatting */
.smart-float-image-left
{
    margin: 0px 20px 20px 0px;
    float: left;
    max-width: 300px;
    height: auto;
}
.smart-float-image-right
{
    margin: 0px 0px 20px 20px;
    float: right;
    max-width: 300px;
    height: auto;
}

.smart-image-full-width
{
    max-width: 100%;
    height: auto;
}

/* feature grid */
.feature-grid .col-xs-2, 
.feature-grid .col-sm-1
{
    text-align: center;
}
.feature-grid span{
    /*color: #36a9e1;*/
    color: #999999;
    font-size: 48px;
    
}
.feature-grid h3{
    padding:0px;
    margin:0px;
    font-weight: 600;
    font-size:18px;
}

.embed-responsive{
    margin-bottom:28px;
}

.programme-partners img
{
    margin-right: 10px;
}

/*

#e4s{
    background-color: #007ec3;
    color:white;
}
#e4h{
    background-color: #ba0066;
    color:white;
}
#e4e{
    background-color: #ea5b1b;
    color:white;
}
#blue{
    background-color: #36a9e1;
    color:white;
}

*/

.lms-buttons #e4h:active, .lms-buttons #e4h:focus, .lms-buttons #e4h:hover
{
    background-color: #ba0066 !important;
    border-color: #ba0066 !important;
    color:white !important;   
}

.lms-buttons #e4s:active, .lms-buttons #e4s:focus, .lms-buttons #e4s:hover
{
    background-color: #007ec3 !important;
    border-color: #007ec3 !important;
    color:white !important;   
}

.lms-buttons #e4e:active, .lms-buttons #e4e:focus, .lms-buttons #e4e:hover
{
    background-color: #ea5b1b !important;
    border-color: #ea5b1b !important;
    color:white !important;   
}

.lms-buttons #blue:active, .lms-buttons #blue:focus, .lms-buttons #blue:hover
{
    background-color: #36a9e1 !important;
    border-color: #36a9e1 !important;
    color:white !important;
}

.lms-buttons #platinum:active, .lms-buttons #platinum:focus, .lms-buttons #platinum:hover
{
    background-color: #999999 !important;
    border-color: #999999 !important;
    color:white !important;
}

#sliding_panel_container_xs{
    cursor: pointer;
}

#sliding_panel_container, #sliding_panel_container_xs{
    position:absolute;
    bottom:60px;
    z-index:100;
    width:100%;
    height: 180px;
}
.sliding_panels, .sliding_panels_xs{
    width: 360px;
    list-style: none;
    padding:0px;
    margin-left:auto;
    margin-right:auto;
    -webkit-transition: width 0.5s; /* Safari */
    transition: width 0.5s;
    transition-timing-function: ease;
}
.sliding_panels li, .sliding_panels_xs li{
    float:left;
    list-style: none;
    width: 180px;
    overflow:hidden;
    height: 180px;
    -webkit-transition: width 0.5s; /* Safari */
    transition: width 0.5s;
    transition-timing-function: ease;
}

.kwicks_icon{
    float:left;
    width:100%;
    max-width:200px;
    color:white;
    text-align: center;
    font-size:80px;
    height: 180px;
    margin-right:40px;
}
.kwicks_icon h2{
    color: white;
    text-transform: uppercase;
    margin:0px;
    padding:0px;
    font-size:16px;
}
.kwicks_content p{
    margin:0px;
    padding:0px;
    margin-bottom:5px;
}
.kwicks_content a{
    color:white;
    font-weight:600;
}
.kwicks_content{
    float:left;
    margin-top:20px;
    height: 180px;
    color:white;
    max-width:400px;
}


.kwicks_expanded_full{
    width:1012px !important;
}
.kwicks_expanded{
    width:664px !important;
}
.kwicks_collapsed{
    width: 114px !important;
}


@media screen and (max-width: 992px) {
    
    .kwicks_expanded_full{
	width:790px !important;
    }
    .kwicks_expanded{
	width:542px !important;
    }
    .kwicks_expanded .kwicks_icon{
	max-width:120px !important;
    }
    .kwicks_content{
	font-size:13px;
	max-width:340px;
    }
    .kwicks_collapsed{
	width: 70px !important;
    }
    
}

/*
.sliding_panels_xs{
    width:100%;
}
.sliding_panels_xs li{
     width:33.3%;
}
*/
.sliding_panels_xs img{
    width:70%;
}
.sliding_panels_xs h2{
    font-size:14px;
}

.partner-container{
    height:200px;
    position: relative;
    margin-bottom:40px !important;
}
.partner-title{
    position:absolute;
    top:180px;
    width:80%;
    margin-left:5%;
    text-align: center;
}

.programme-item h3{
    padding-top:0px !important;
    margin-top:0px !important;
}
.programme-item img{
    margin-top:5px;
}

#slides{
    background-color:black;
}

.collapse-content{
    margin-bottom:40px;
}


@media only screen and (max-width : 480px) {
    .next-triangle-white, .next-triangle-grey{
	padding-bottom:0px;
    }
    .lead .h1{
	font-size:34px !important;
    }
    
    .collapse-icon{
	position: absolute;
	right: -20px;
	font-size:22px;
	color: #999999;
	top:19px;
	margin-right:40px;
	cursor: pointer;
    }
}

.post-horizontal .h3, .post-horizontal .h3 a, .programmes-list .h3, programmes-list .h3 a{
    margin-top:0px; padding-top:0px;
}
.post-horizontal .thumb-wraper{
    margin-top:5px;
    padding-left:20px;
    padding-right:10px;
}
.programmes-list .img-responsive{
    margin-top:5px;
    margin-left:10px;
    margin-right:10px;
}

@media only screen and (max-width : 1024px) {
    .post-horizontal .h3, .post-horizontal .h3 a, .programmes-list .h3, programmes-list .h3 a{
	margin-top:auto; padding-top:auto;
    }
    .post-horizontal .thumb-wraper, .programmes-list .img-responsive{
	margin-top:5px;
	padding-left:0px;
	padding-right:0px;
    }
    .programmes-list .img-responsive{
	margin-top:auto;
	margin-left:auto;
	margin-right:auto;
    }
}

.kwicks_icon img{
    width:100px;
}

#login-form fieldset, #register-form fieldset
{
    background-color: #e7e7e8;
}


.multi-user-discounts{
    margin-top:100px;
}

.multi-user-discounts h3{
    font-size:18px;
}
.multi-user-discounts table td{
    font-size:12px;
    padding-left:0px !important;
    margin-left:0px;
}

.online-demo-button{
    width:40px;
    overflow:hidden;
    position:relative;
    display:none;
    z-index:1000;
    min-height:200px;
    
}
.online-demo-collapsed{
    background-image: url("../img/decor/online-demo-arrow.png");
    background-repeat: no-repeat;
    background-position-y: -8px;
    cursor:pointer;
}
.screen-icon{
    color:white;
    text-align: center;
    font-size:18px;
    margin-top:10px;
}
.demo-text{
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
    transform: rotate(-90deg);    
    font-weight:500;
    font-size:18px;
    position:relative;
    top: 110px;
}
.online-demo-container{
    display:none;
    background-image: url("../img/decor/online-demo-background.png");
    background-repeat: no-repeat;
    background-position-y: -3px;
    overflow:hidden;
    margin-bottom:20px;
}

.online-demo-title{
    font-weight:500;
    font-size:18px;
    margin-left:10px;
    margin-top:5px;
    margin-right:5px;
}
.online-demo-title i{
    color:white;
    margin-right:10px;
}
.close-demo{
    float:right;
    margin-top:3px;
    margin-right:1px;
    cursor:pointer;
}
.online-demo-content{
    margin-top:10px;
    padding-left:20px;
    padding-top:20px;
    padding-right:20px;
    padding-bottom:8px;
    font-weight:400;
    color:white;
}
.online-demo-content p{
    line-height: 19px !important;
    font-size:14px;
}
.online-alternative{
    padding-left:20px;   
    margin-top:-15px;
}
.online-alternative img{
    max-width:100px;
    margin-right:20px;
    float:left; 
}
.online-alternative h3{
    color:white !important;
    font-size:18px;
    font-weight: 600;
    margin-bottom:3px;
}
.online-alternative p{
    color:white;
    margin:0px;
    font-size:13px;
}

.online-demo-button{
    position:fixed;
    right:0px;
    top: 160px;
    width:40px;
    z-index:1001;
    cursor: pointer;
}

.online-demo-container a{
    color:white !important;
}
.online-demo-container a:hover{
    color:white;
    text-decoration: underline;
}
.online-alternative .btn{
    background-color:white;
    border-color:white;
    font-size:12px;
    padding:2px;
    color:black !important;
    letter-spacing: 0px;
    padding-left:6px;
    padding-right:6px;
    margin-top:10px;
}
.online-alternative .btn:hover{
    background-color:black;
    border-color:black;
    color:white !important;
    text-decoration: none;
}

#participant_login_fieldset{
    position:relative;
    width: 400px;
    margin-left: auto;
    margin-right: auto;
}

#participant_login_fieldset.register-page
{
    margin-left: 0px;
    margin-right: 0px;
}

#participant_login_fieldset .form-group
{
    margin-bottom: 20px;
}

#participant_login_rollover{
    position:absolute;
    width: 200px;
    height: 282px;
    top: 0px;
    left: 420px;
    display:none;
    color:white;
    padding: 20px;
    font-size: 13px;
    z-index:100;
}
#participant_login_rollover h3{
    color:white !important;
    font-size:18px;
    margin-top: 0px;
    padding-top:0px;
    margin-bottom: 5px;

}

#live_chat_toggle{
    position:fixed;
    right:0px;
    top: 150px;
    width:40px;
    height:100px;
    overflow:hidden;
    z-index:1001;
    cursor: pointer;
}
#live_chat_toggle:hover{
    background-color:black !important;
    color:white !important;
}

.live_chat_text{
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
    transform: rotate(-90deg);    
    font-weight:500;
    font-size:18px;
    position:relative;
    top: 20px;
}

#free_trial_toggle{
    display: block;
    position:fixed;
    right:0px;
    top: 366px;
    width:40px;
    height:140px;
    overflow:hidden;
    z-index:1001;
    cursor: pointer;
}
#free_trial_toggle:hover{
    background-color:black !important;
    color:white !important;
}

.free_trial_text{
    display: block;
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
    transform: rotate(-90deg);    
    font-weight:500;
    font-size:18px;
    position:relative;
    top: 60px;
}

#free_trial_toggle span
{
    color: black;
}

#free_trial_toggle:hover span 
{
    color: white;
}

#online_demo_toggle{
    display: block;
    position:fixed;
    right:0px;
    top: 162px;
    width:40px;
    height:180px;
    overflow:hidden;
    z-index:1001;
    cursor: pointer;
}
#online_demo_toggle:hover{
    background-color:black !important;
    color:white !important;
}

.online_demo_text{
    display: block;
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
    transform: rotate(-90deg);    
    font-weight:500;
    font-size:18px;
    position:relative;
    top: 100px;
}

#online_demo_toggle span
{
    color: black;
}

#online_demo_toggle:hover span
{
    color: white;
}

#slide_restriction{
    height:400px;
}

@media only screen and (max-height : 490px){
    #online_demo_toggle
    {
	display: none;
    }
}

@media only screen and (max-height : 670px){
    #free_trial_toggle
    {
	display: none;
    }
}

@media only screen and (max-width : 768px) {
    #programme_description{
	padding-right:60px;
    }
    .collapse-icon
    {
	margin-right: 24px;
    }
    
    .logo-grid img
    {
	max-width: 120px;
    }
    
    .logo-grid
    {
	padding-bottom: 40px;
    }
    
    .feature-grid h3
    {
	margin-bottom: 10px;
    }
    
    #slides h1
    {
	font-size: 40px;
    }
    
    .arrow-box
    {
	min-height: auto;
	margin-bottom: 20px;
    }
    
    #participant_login_fieldset{
	width: 320px;
    }
    
    .heapBox .holder
    {
	width: 232px !important;
    }
    
    .heapBox .heap .heapOptions
    {
	width: 257px !important;
    }
    
    #login-button
    {
	margin-top: 10px;
    }
    .arrow{
	bottom: 30px !important;
    }
    #slide_restriction{
	height:200px;
    }
    
    .navbar .container
    {
	padding-left: 5px;
	padding-right: 0px;
    }
    
    .search-cart
    {
	right: 30px !important;
    }
    
    .info-circle-style-1, .info-circle-style-2, .info-circle-style-3, .info-circle-style-4
    {
	width: 80px;
	height: 80px;
    }

    .info-circle-style-2
    {
	padding-top: 18px;
    }
    
    .info-circle-style-1 span, .info-circle-style-2 span, .info-circle-style-3 span, .info-circle-style-4 span
    {
	font-size: 28px;
    }
    
    .info-circle-style-1 h3, .info-circle-style-2 h3, .info-circle-style-3 h3, .info-circle-style-4 h3, .info-circle-style-1 h4, .info-circle-style-2 h4, .info-circle-style-3 h4, .info-circle-style-4 h4
    {
	font-size: 16px;
    }
}

#content .table tr:first-child td, #content .table tr:first-child th
{
    background-color: #E7E7E7 !important;
}

#content .table p
{
    margin-bottom: 0px;
}

.online-demo-content p a.btn{
    color: #000000 !important;
    text-decoration: none !important;
}

.kwicks_content{
    cursor:pointer;
}

#programme_description .arrow-box
{
    min-height: auto !important;
}

.homepage_top_banner{
    position: absolute;
    z-index: 1001;
    width:100%;
}
.homepage_top_banner img{
    width:100%;
}


/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 296px) {
    .homepage_top_banner{
	top: 95px;
    }
}

@media only screen and (min-width : 297px) {
    .homepage_top_banner{
	top: 50px;
    }
}

@media only screen and (min-width : 480px) {
    .homepage_top_banner{
	top: 50px;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {
    .homepage_top_banner{
	top: 125px;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {
    .homepage_top_banner{
	top: 125px;
    }
}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {
    .homepage_top_banner{
	top: 125px;
    }
}

.homepage_top_banner_close{
    position:absolute;
    right:5px;
    top:4px;
   /*color: #666666;*/
    cursor: pointer;
}

.homepage_side_banner{
    position:absolute;
    right: 0px;
    top: 260px;
    z-index: 1001;
    max-width: 300px;
}
.homepage_side_banner img{
    max-width: 300px;
}

.homepage_side_banner_close{
    position:absolute;
    right:5px;
    top:4px;
    color: #666666;
    cursor: pointer;
    font-size:22px;
}

.silver-tabs{
    margin-bottom:35px;
    border-bottom: solid 5px #007ec3;
}
.silver-tabs a{
    margin-right: 10px !important;
    background-color: #eee !important;
    border-bottom: 0px !important;
    margin-bottom: 1px !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}
.silver-tabs .active a{
    background-color: #007ec3 !important;
    color: white !important;
}

.programme-library-container{
    margin-bottom: 15px;
}

.programme-library-container h3{
    height: 50px;
    background-color: #007ec3 !important;
    font-size: 14px;
    font-weight: 600;
    margin: 0px;
    padding: 8px;
    
}
.programme-library-container h3 a{
    color: white !important;
}
.programme-library form{
    margin-left: 80px;
    margin-right: 80px;
    margin-bottom: 45px;
}
.programme-library form input{
    border-color: #999999;
}
.programme-arrow-down {
  margin-top:50px;
  position:absolute;
  top:0;
  left:48%;
  width:0; 
  height:0; 
  border-left:10px solid transparent;
  border-right:10px solid transparent;   
  border-top:10px solid #007ec3;
}
.display-as-new{
    position: absolute;
    bottom:15px;
    right:15px;
}
.twitter-typeahead{
    display:block !important;
}


.tt-hint {
    color: #999;
}

.tt-menu { /* UPDATE: newer versions use tt-menu instead of tt-dropdown-menu */
    margin-top: 12px;
    padding: 8px 0;
    background-color: #fff;
    border: 1px solid #ccc;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
    padding: 3px 20px;
    font-size: 18px;
    line-height: 24px;
    cursor: pointer;
}

.tt-suggestion.tt-cursor { /* UPDATE: newer versions use .tt-suggestion.tt-cursor */
    color: #fff;
    background-color: #0097cf;
}

.tt-suggestion p {
    margin: 0;
    cursor: pointer;
}
.tt-selectable:hover{
    color: white;
    background-color: #007ec3;
}
.overlay{
    padding-bottom: 40px !important;
}
.overlay form input, .overlay form textarea{
    background-color: white !important;
    color: black !important;
}
.overlay label{
    font-size: 16px;
    text-shadow: 1px 1px #000000;
}

.highlight
{
    background-color: #25AAE1;
    color: #FFFFFF;
}

.landing-page-circle
{
    background-color: #25AAE1;
    border-radius: 50%;
    width: 120px;
    height: 120px;
    padding: 10px;
    padding-top: 20px;
    text-align: center;
}

.landing-page-circle span
{
    line-height:80% !important;
    color: #FFFFFF;
    text-align: center;
    font-size: 16px;
}
.landing-page-circle strong{
    line-height: 130%;
    font-size:24px;
}

.landing-page-form-container
{
    padding: 30px;
    background-color: #25AAE1;
    border-radius: 10px;
}

.landing-page-form-container label
{
    color: #FFFFFF;
}

.landing-page-form-container label sup
{
    color: #000000;
}

.landing-page-form-container button
{
    background-color: #000000;
}

.landing-page-form-container button:hover
{
    background-color: #666666;
}

.landing-page-form-container h2
{
    text-transform: uppercase;
    color: #FFFFFF;
}

.style2 .fa-star
{
    color: #FFFFFF;
}

.landing-page blockquote footer:before
{
    content: "";
    display: none;
}

.landing-page blockquote footer
{
    font-size: 14px;
}

.landing-page blockquote.style2
{
    border-left-color: #CCCCCC;
}

.landing-page .alt-list
{
    margin-top: 24px;
}

.landing-page .alt-list li
{   
    font-size: 18px;
    line-height: 1;
    margin-bottom: 20px;    
}

.landing-page .alt-list li .fa
{   
    font-size: 24px; 
    color: #25AAE1;   
}


.landing-page small.education-dark,
.landing-page i.fa.education-dark
{
    /*color: #ea632d;*/
    color: #ea5b1b;
    background: transparent !important;
}

.landing-page small.education-light,
.landing-page i.fa.education-light
{
    /*color: #f28d2c;*/
    color: #f39200;
    background: transparent !important;
}

.landing-page small.sport-dark,
.landing-page i.fa.sport-dark

{
    /*color: #f39200;*/
    color: #007ec3;
    background: transparent !important;
}

.landing-page small.sport-light,
.landing-page i.fa.sport-light
{
    /*color: #59a1cf;*/
    color: #36a9e1;
    background: transparent !important;
}

.landing-page small.health-dark,
.landing-page i.fa.health-dark
{
    /*color: #cf307c;*/
    color: #ba0066;
    background: transparent !important;
}

.landing-page small.health-light,
.landing-page i.fa.health-light
{
    /*color: #e72582;*/
    color: #f3007e;
    background: transparent !important;
}

.landing-page small.charities-dark,
.landing-page i.fa.charities-dark
{
    /*color: #77a42a;*/
    color: #379e32;
    background: transparent !important;
}

.landing-page small.charities-light,
.landing-page i.fa.charities-light
{
    color: #95c11f;
    background: transparent !important;
}

.landing-page .btn-primary{
    border: none;
}

/* TEMPORARY */
.landing-page{
    margin-top: 30px;
}

/* always put these at end for cascading */

.generic-light
{
    background-color: #999999;
}
.generic-dark
{
    background-color: #555655;
}

.education-dark
{
    /*background-color: #ea632d;*/
    background-color: #ea5b1b !important;
}

.education-light
{
    /*background-color: #f28d2c;*/
    background-color: #f39200 !important;
}

.sport-dark
{
    /*background-color: #f39200;*/
    background-color: #007ec3 !important;
}

.sport-light
{
    /*background-color: #59a1cf;*/
    background-color: #36a9e1 !important;
}

.health-dark
{
    /*background-color: #cf307c;*/
    background-color: #ba0066 !important;
}

.health-light
{
    /*background-color: #e72582;*/
    background-color: #f3007e !important;
}

.charities-dark
{
    /*background-color: #77a42a;*/
    background-color: #379e32 !important;
}

.charities-light
{
    /* background-color: #8cbd3a;*/
    background-color: #95c11f !important;
}