@charset "UTF-8";
/* RESET */
/********************************************************/
/********************************************************/
*{box-sizing:border-box;}
html,body{margin:0;padding:0;font-family: 'Niramit', sans-serif;}
.cf,.clear,.clearfix{clear:both;}
img{max-width:100%;}
.grecaptcha-badge{display:none !important;}
.spacer{float:left;width:100%;height:100px;display:block;}
/********************************************************/
/********************************************************/
/*
font-family: 'Niramit', sans-serif;


TEXT COLORS:
--------------------------
dark green/blue:    042e33
red:                e01021
footer grey         cccccc
footer link teal    70dcd0

OTHER COLORS:
--------------------------
button green        c2d327
background blue     e2f3ef

*/


/* General */
header{
    display:block;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    height:60px;
    background:#e2f3ef;
    z-index: 10000;
}
nav:after{
    position:absolute;
    width:90%;
    height:90%;
    top:5%;
    left:5%;
    opacity: 0;
    z-index: -1;
    display:block;
    content:'';
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    border-radius: 150px;
    -webkit-box-shadow: 0px 5px 12px #aaa;
    -moz-box-shadow: 0px 5px 12px #aaa;
    box-shadow: 0px 5px 12px #aaa;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
    -webkit-transition-delay: 150ms;
    -moz-transition-delay: 150ms;
    transition-delay: 150ms;
}
header.shadowed nav:after{
    opacity:.2;
}

#mobilenav{
    display:none;
}

.iconlogo{
    position: absolute;
    top:0;
    left:15px;
    width:50px;
    height:60px;
    background-image:url('../img/logo-icon.png');
    background-repeat:no-repeat;
    background-position: center;
    background-size:40px;
    display:none;
    opacity:0;
    -webkit-transition-delay: 300ms;
    transition-delay: 300ms;
}
.iconlogo.on{
    display:block;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.iconlogo.op{
    opacity:1;
}
.iconlogo.noop{
    opacity:0;
}
.iconlogo.int.noop,
.iconlogo.int.op,
.iconlogo.int.on,
.iconlogo.int{
    opacity:1;
    display:block;
}




nav{
    background:#e2f3ef;
    display:block;
    width:100%;
    position:relative;
    float:left;
}
nav ul{
    display:block;
    width:auto;
    position:relative;
    float:left;
    margin: 0 0 0 53px;
    padding: 0;
    list-style:none;
    background:#e2f3ef;
}
nav ul:after{
    position:absolute;
    width:90%;
    height:90%;
    top:5%;
    left:5%;
    opacity: 0;
    z-index: -1;
    display:block;
    content:'';
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    border-radius: 150px;
    -webkit-box-shadow: 0px 5px 12px #aaa;
    -moz-box-shadow: 0px 5px 12px #aaa;
    box-shadow: 0px 5px 12px #aaa;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
    -webkit-transition-delay: 150ms;
    -moz-transition-delay: 150ms;
    transition-delay: 150ms;

}
nav ul:hover:after{
    opacity:.2;
}
header.shadowed nav ul:after{
    display:none;
}
nav ul li{
    float:left;
    display:block;
    position: relative;
}
nav ul li a{
    float:left;
    display:block;
    position: relative;
    padding: 20px 25px;
    color:#042e33;
    font-size:16px;
    line-height: 20px;
    font-weight:700;
    letter-spacing: 3px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
nav ul li a:hover{
    color:#042e33;
    background:#c8e3dc;
    text-decoration:none;
}

#trainer{
    position: absolute;
    background-color:#c2d327;
    top:0;
    right:0;
    height:60px;
    padding: 20px 60px 20px 50px;
    line-height:20px;
    color:#042e33;
    font-weight:700;
    letter-spacing: 3px;
    font-size:16px;
    text-transform:uppercase;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    background-image:url('../img/trainer-icon.png');
    background-repeat:no-repeat;
    background-position: left 10px center;
}
#trainer:hover{
    background-color:#afbf1e;
    text-decoration:none;
}
#trainer:before{
    content: '';
    display:block;
    position: absolute;
    right:100%;
    top:0;
    height:60px;
    width:60px;
    border-right:30px solid #c2d327;
    border-top:30px solid #c2d327;
    border-left:30px solid transparent;
    border-bottom:30px solid transparent;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
#trainer:hover:before{
    border-right:30px solid #afbf1e;
    border-top:30px solid #afbf1e;
}
#trainer:after{
    content: '';
    display:block;
    position: absolute;
    right:0;
    top:0;
    height:30px;
    width:30px;
    border-right:15px solid #fc595d;
    border-top:15px solid #fc595d;
    border-left:15px solid transparent;
    border-bottom:15px solid transparent;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
#trainer:hover:after{
    border-right:15px solid #e01021;
    border-top:15px solid #e01021;
}


/* MARQUEE */

#marquee{
    margin: 60px 0 0 0;
    background:#e2f3ef;
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 50px 0 0 0;
    border-bottom: solid #fff 30px;
}

#logo{
    max-width:400px;
    display:block;
    width:100%;
    position:relative;
    float:left;
    height:80px;
    margin: 0 0 10px 0;
}

#slider{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
#slider .image{
    height:100%;
    width:50%;
    display:block;
    position: absolute;
    top:0;
    right:0;
    height:450px;
}
#slider .image .img{
    background-repeat:no-repeat;
    background-position:center;
    background-size: contain;
    height:100%;
    width:100%;
    display:block;
    position: absolute;
    top:0;
    right:0;
}
#slider .textbox{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 100px 55% 130px 76px;
    min-height:450px;
}
#slider h2{
    font-size:48px;
    letter-spacing: 5px;
    text-transform: uppercase;
    color:#e01021;
    max-width:450px;
    font-weight:700
}
#slider h3{
    font-size:23px;
    letter-spacing: 5px;
    text-transform: uppercase;
    color:#042e33;
    font-weight:700;
    max-width:300px;
}
#slider p{
    font-size:20px;
    color:#042e33;
}
#slider a.marbutton{
    color:#042e33;
    padding: 8px 22px 8px 50px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    display:block;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    background:#c2d327;
    float:left;
    position:relative;
    background-image:url('../img/marbutton-plus.png');
    background-repeat:no-repeat;
    background-position: left 15px center;
}
#slider a.marbutton:hover{
    text-decoration:none;
    background-color: #afbf1e;
}

#controls{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 0 0;
    top:25px;
}
.accent{
    position:absolute;
    top:50%;
    left:0;
    width:100%;
    display:block;
    height:2px;
    background: #23c3b3;
    background: -moz-linear-gradient(left, #23c3b3 0%, #6dbd50 50%, #f13243 100%);
    background: -webkit-linear-gradient(left, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    background: linear-gradient(to right, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23c3b3', endColorstr='#f13243',GradientType=1 );
}
.accent:before{
    content: '';
    display:block;
    position: absolute;
    height: 8px;
    width:8px;
    background:#23c3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    top:-3px;
    left:-3px;
}
.accent:after{
    content: '';
    display:block;
    position: absolute;
    height: 8px;
    width:8px;
    background:#f13243;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    top:-3px;
    right:-3px;
}
.triangle{
    z-index: 50;
    display:block;
    width:30%;
    position:relative;
    float:left;
    margin: 0 5% 0 0;
    text-align: center;
    height:180px;
}
.colorborder{
    width:316px;
    height:187px;
    position:absolute;
    top:-4px;
    left:8px;
    z-index: 2;
    opacity:0;
    overflow: hidden;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.triangle.active .colorborder{
    opacity:1;
}
.colorborder:before{
    position:absolute;
    content:'';
    height:100%;
    width:50%;
    left:0;
    top:0;
    display:block;
    border-left:79px solid transparent;
    border-top:94px solid transparent;
}
.colorborder:after{
    position:absolute;
    content:'';
    height:100%;
    width:50%;
    right:0;
    top:0;
    display:block;
    border-right:79px solid transparent;
    border-top:94px solid transparent;
}


.triangle:nth-child(1) .colorborder:before{
    border-right:79px solid #23c3b3;
    border-bottom:94px solid #23c3b3;
}
.triangle:nth-child(2) .colorborder:before{
    border-right:79px solid #6dbd50;
    border-bottom:94px solid #6dbd50;
}
.triangle:nth-child(3) .colorborder:before{
    border-right:79px solid #f13243;
    border-bottom:94px solid #f13243;
}
.triangle:nth-child(1) .colorborder:after{
    border-left:79px solid #23c3b3;
    border-bottom:94px solid #23c3b3;
}
.triangle:nth-child(2) .colorborder:after{
    border-left:79px solid #6dbd50;
    border-bottom:94px solid #6dbd50;
}
.triangle:nth-child(3) .colorborder:after{
    border-left:79px solid #f13243;
    border-bottom:94px solid #f13243;
}
.triangle:hover{
    cursor:pointer;
}
.triangle.active:after{
    content: '';
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    height:100px;
    width:100px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    -webkit-box-shadow: 0px 60px 100px #888;
    -moz-box-shadow: 0px 60px 100px #888;
    box-shadow: 0px 60px 100px #888;
    z-index: -1;
    opacity:.6;
}
.triangle > span{
    width:300px;
    height:180px;
    z-index: 4;
    display:inline-block;
    *display:inline;
    *zoom:1;
    position: relative;
}
.triangle > span:before{
    position:absolute;
    content:'';
    height:100%;
    width:50%;
    left:0;
    top:0;
    display:block;
    border-right:75px solid #fff;
    border-bottom:90px solid #fff;
    border-left:75px solid transparent;
    border-top:90px solid transparent;
}
.triangle > span:after{
    position:absolute;
    content:'';
    height:100%;
    width:50%;
    right:0;
    top:0;
    display:block;
    border-left:75px solid #fff;
    border-bottom:90px solid #fff;
    border-right:75px solid transparent;
    border-top:90px solid transparent;
}
.triangle:nth-child(3){margin: 0;}

.triangle > span p{
    z-index: 50;
    position:absolute;
    font-size:20px;
    color:#042e33;
    font-weight:bold;
    letter-spacing: 3px;
    text-transform:uppercase;
    position:absolute;
    top:140px;
    display:block;
    width:100%;
}

.triangle .plus{
    position:absolute;
    top:50px;
    left:50%;
    -webkit-transform: translate(-50%,0);
    -moz-transform: translate(-50%,0);
    -ms-transform: translate(-50%,0);
    -o-transform: translate(-50%,0);
    transform: translate(-50%,0);
    display:block;
    width:80px;
    height:80px;
    -webkit-border-radius: 40px;
    -moz-border-radius: 40px;
    border-radius: 40px;
    border:2px solid #23c3b3;
    z-index: 60;
}
.triangle:nth-child(2) .plus{
    border:2px solid #6dbd50;
}
.triangle:nth-child(3) .plus{
    border:2px solid #e01021;
}
.triangle .plus .circ{
    position:absolute;
    top:50%;
    left:50%;
    display:block;
    z-index: 70;
    width:60px;
    height:60px;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    border-radius: 30px;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.triangle:nth-child(1).active .plus .circ{
    background: #23c3b3;
}
.triangle:nth-child(2).active .plus .circ{
    background: #6dbd50;
}
.triangle:nth-child(3).active .plus .circ{
    background: #e01021;
}

.triangle .plus .circ:before{
    content:'';
    background:#23c3b3;
    display: block;
    position: absolute;
    width:25px;
    height:2px;
    transform-origin: center;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}
.triangle .plus .circ:after{
    content:'';
    background:#23c3b3;
    display: block;
    position: absolute;
    width:25px;
    height:2px;
    transform-origin: center;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform: translate(-50%,-50%) rotate(90deg);
    -moz-transform: translate(-50%,-50%) rotate(90deg);
    -ms-transform: translate(-50%,-50%) rotate(90deg);
    -o-transform: translate(-50%,-50%) rotate(90deg);
    transform: translate(-50%,-50%) rotate(90deg);
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.triangle.active .plus .circ:after{
    -webkit-transform: translate(-50%,-50%) rotate(0deg);
    -moz-transform: translate(-50%,-50%) rotate(0deg);
    -ms-transform: translate(-50%,-50%) rotate(0deg);
    -o-transform: translate(-50%,-50%) rotate(0deg);
    transform: translate(-50%,-50%) rotate(0deg);
}


.triangle:nth-child(2) .plus .circ:after,
.triangle:nth-child(2) .plus .circ:before{
    background: #6dbd50;
}
.triangle:nth-child(3) .plus .circ:after,
.triangle:nth-child(3) .plus .circ:before{
    background: #e01021;
}
.triangle.active .plus .circ:after,
.triangle.active .plus .circ:before{
    background: #ffffff;
}


/* FEATURED */

#featured{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background-image:url('../img/home-feat-bg.gif');
    background-repeat:no-repeat;
    background-position: center;
    padding: 80px 0;
    z-index: 0;
}
.col1{
    width:51%;
    float:left;
    display:block;
    position:relative;
    z-index: 5;
}
.col2{
    width:51%;
    display:block;
    position:absolute;
    top:0;
    right:0;
}
#featured .block{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 60px 0 60px 100px;
    min-height: 400px;
}
#featured .textarea{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 40px 150px 40px 100px;
}
#featured .textarea h3{
    color:#e01021;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:25px;
}
#featured .textarea h4{
    color:#042e33;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:18px;
    max-width:240px;
}



#featured .col1 .block{
    margin: 160px 0 30px 0;
}
#featured .col2 .block{
    margin: 30px 0 160px 0;
    background:#d9e9e6;
}
#featured .block:after{
    content: '';
    z-index: -1;
    height:90%;
    width:90%;
    top:5%;
    left:5%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0px 20px 90px #aaa;
    -moz-box-shadow: 0px 20px 90px #aaa;
    box-shadow: 0px 20px 90px #aaa;
    display:block;
    position: absolute;
}
.fakeall,
.block .all{
    position: absolute;
    bottom: 0;
    right:0;
    width:60px;
    height:60px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:13px;
    padding: 20px 0 0 0;
    background:#70dcd0;
    color:#042e33;
}
.fakeall:before,
.block .all:before{
    content: '';
    position: absolute;
    bottom: 100%;
    right:0;
    width:60px;
    height:60px;
    border-top: 30px solid transparent;
    border-left: 30px solid transparent;
    border-right:30px solid #70dcd0;
    border-bottom:30px solid #70dcd0;
}
.fakeall:after,
.block .all:after{
    content: '';
    position: absolute;
    bottom: 0;
    right:100%;
    width:60px;
    height:60px;
    border-top: 30px solid transparent;
    border-left:30px solid transparent;
    border-right:30px solid #70dcd0;
    border-bottom:30px solid #70dcd0;
}
.block .all,
.block .all:after,
.block .all:before{
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.block .all:hover{
    text-decoration:none;
    background:#56cec0;
}
.block .all:hover:after,
.block .all:hover:before{
    border-right:30px solid #56cec0;
    border-bottom:30px solid #56cec0;
}
.contentwrap{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0 0 0 0;
}
.contentwrap .tag{
    background:#c2d327;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size:12px;
    font-weight:bold;
    float:left;
    padding: 2px 6px;
}
.contentwrap h5{
    display:block;
    clear:both;
    width:100%;
    position:relative;
    float:left;
    font-size:20px;
    margin: 4px 0 12px 0;
    padding: 0 50px 20px 0;
    font-weight:bold;
    letter-spacing: 3px;
    text-transform: uppercase;
    border-bottom: 1px solid #70dcd0;
}
.contentwrap p{
    padding: 0 70px 0 0;
    font-size:15px;
}
.contentwrap a.readmore{
    font-weight:bold;
    letter-spacing: 3px;
    text-transform: uppercase;
    color:#042e33;
    font-size:14px;
    padding: 0 0 0 30px;
    background-image:url('../img/marbutton-plus.png');
    background-repeat:no-repeat;
    background-position:left center ;
    background-size:13px;
}

.projectpag{
    display:block;
    width:auto;
    position:relative;
    clear:both;
    float:left;
    margin: 0;
    padding: 0;
    list-style: none;
}
.projectpag a,.projectpag span{
    background:#fc595d;
    width:auto;
    display:block;
    min-width:50px;
    height:50px;
    font-size:20px;
    line-height: 20px;
    text-align: center;
    border-left:solid 1px rgba(0,0,0,0.1);
    float:left;
    padding: 15px;
    color:#fff;
    -webkit-border-radius: 0px;
    -moz-border-radius: 0px;
    border-radius: 0px;
}
.projectpag a:hover{
    text-decoration: none;
    background:#e95054;
}
.projectpag a:first-child,.projectpag span:first-child{
    -webkit-border-radius: 5px 0 0 5px;
    -moz-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    border-left: none;
}
.projectpag a:last-child,.projectpag span:last-child{
    -webkit-border-radius: 0 5px 5px 0;
    -moz-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
}
.projectpag span{
    background:#f13243;
    border:none;
}
.projectpag span + a{
    border:none;
}

#librarySearch,
#librarySearchInt{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 30px 0 170px 0;
}
#librarySearch h2,
#librarySearchInt h2{
    color:#042e33;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:20px;
    margin: 0 0 20px 0;
}
#librarySearch h2:after,
#librarySearchInt h2:after{
    content: '_';
    position: relative;
    bottom: 8px;
}
#searchbutton{
    color:#042e33;
    padding: 8px 22px 8px 40px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display:block;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    background:#c2d327;
    float:left;
    position:relative;
    background-image:url('../img/search.png');
    background-repeat:no-repeat;
    background-position: left 15px center;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    border:none;
}
#searchbutton:hover{
    cursor:pointer;
    background-color: #afbf1e;
	text-decoration: none;
}


#resource-featured{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
#offset{
    display:block;
    width:100%;
    position:relative;
    float:left;
    top:-60px;
    margin: 0 0 160px 0;
}

.feat-brick{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#70dcd0;
    /* padding: 110px 60px 80px 60px; */
    padding: 60px 40px 60px 40px;
    height:400px;
    background-repeat:no-repeat;
    background-position: top 20px left 40px;
    background-size: 40px;
}
.feat-brick.doc{
    background-image:url('../img/resource-icon-doc.png');
}
.feat-brick.video{
    background-image:url('../img/resource-icon-video.png');
}
.feat-brick.webinar{
    background-image:url('../img/resource-icon-webinar.png');
}
.feat-brick:after{
    content: '';
    z-index: -1;
    height:90%;
    width:90%;
    top:5%;
    left:5%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-box-shadow: 0px 30px 120px #aaa;
    -moz-box-shadow: 0px 30px 120px #aaa;
    box-shadow: 0px 30px 120px #aaa;
    display:block;
    position: absolute;
}

.feat-brick .tag{
    background:#c2d327;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-size:12px;
    font-weight:bold;
    float:left;
    padding: 2px 6px;
}
.feat-brick h3{
    display:block;
    width:100%;
    position:relative;
    float:left;
    color:#042e33;
    text-transform: uppercase;
    /* letter-spacing: 3px; */
    letter-spacing: 2px;
    font-weight:bold;
    /* font-size:24px;
    line-height: 32px; */
    font-size:18px;
    line-height: 22px;
    margin: 10px 0 20px 0;
}
.midd{
    top:-60px;
}
.optionbar{
    display:block;
    width:100%;
    position:absolute;
    bottom: 0;
    left:0;
    height:60px;
    background:#e2f3ef;
}
.optionbar a.main{
    display:block;
    width:100%;
    position:relative;
    float:left;
    height:60px;
    padding: 20px 40px;
    line-height: 20px;
    color:#042e33;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:14px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.optionbar a.main:hover{
    background:#ccf0e8;
    text-decoration: none;
}

.optionbar a.view{
    position: absolute;
    top:0;
    right:0;
    height:60px;
    width:80px;
    padding: 20px 0 0 0;
    line-height: 20px;
    background:#c2d327;
    color:#042e33;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    font-size:14px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.optionbar a.view:hover{
    background-color: #afbf1e;
    text-decoration: none;
}
.optionbar a.view:before{
    content: '';
    position: absolute;
    bottom: 0;
    right:100%;
    width:60px;
    height:60px;
    border-top: 30px solid transparent;
    border-left:30px solid transparent;
    border-right:30px solid #c2d327;
    border-bottom:30px solid #c2d327;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.optionbar a.view:hover:before{
    border-right:30px solid #afbf1e;
    border-bottom:30px solid #afbf1e;
}







footer{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background-color:#042e33;
    background-image:url('../img/footer-bg.gif');
    background-repeat:no-repeat;
    background-position: left bottom;
}
.footerblock{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 130px 50px 40px 50px;
    height:380px;
    top:-100px;
}
.footerblock.emma-e{
    height:420px;
}
.tweetheader{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.tweetheader .icon{
    float:left;
    width:70px;
    height:70px;
    display:block;
    margin: 0 12px 0 0;
    background-color:#fff;
    border:1px solid #70dcd0;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    background-image:url('../img/logo-icon.png');
    background-repeat:no-repeat;
    background-position: left 12px top 15px;
    background-size: 40px;
}
.tweetheader .namebox{
    margin: 14px 0 0 0;
    float:left;
    display: block;
}
.tweetheader .name{
    font-size:18px;
    line-height: 18px;
    letter-spacing: 1px;
    color:#042e33;
    font-weight:bold;
}
.tweetheader .handle{
    margin: 6px 0 0 0;
    float:left;
    display: block;
    clear:both;
    font-size:16px;
    line-height: 18px;
    letter-spacing: 1px;
    color:#595959;
}
.tweetheader .handle a{
    color:#595959;
}
.tweetbox{
    color:#595959;
    display:block;
    width:100%;
    position:relative;
    float:left;
    line-height: 1.5em;
    font-size:16px;
    margin: 15px 0 0 0;
}
.tweetbox a{
    color:#595959;
    text-decoration: underline;
}
.tweetbox a.hashtag,
.tweetbox a.handle{
    text-decoration:none;
}
.twitterlink{
    position: absolute;
    top:40px;
    color:#012e33;
    right:40px;
}
.twitterlink i{
    color:#23c3b3;
}
.twitterlink:hover{
    text-decoration: underline;
    color:#012e33;
}


.footerblock form{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
#subscribe{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
a[name="subscribeForm"]{
    position: relative;
    top:-170px;
    height:0px;
}
#subscribe input[type="text"],
#subscribe input[type="email"]{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:transparent;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    border:none;
    outline:none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
#subscribe input:invalid,
#subscribe input:required,
#subscribe input:-moz-submit-invalid{
    outline:none;
    border:none;
}

#subscribe .inputholder{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 6px 6px 6px 40px;
    margin: 0 0 8px 0;
    background-repeat:no-repeat;
    background-position: left 14px center;
}
#subscribe .inputholder.formE,
#subscribe .inputholder.formE{
    background-color:#f9dddd;
    margin: 0 0 4px 0;
}
.emmaerror{
    display:block;
    width:100%;
    position:relative;
    float:left;
    font-size:12px;
    margin: 0 0 7px 0;
    padding: 0 5px 0 40px;
    line-height: 12px;
    font-weight:bold;
    color:#f13243;
}
#subscribe .inputholder.user{background-image:url('../img/login-user-icon.png');}
#subscribe .inputholder.email{background-image:url('../img/login-email-icon.png');}

#subscribe button{
    color:#042e33;
    padding: 8px 22px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display:block;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    background:#c2d327;
    float:left;
    position:relative;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    border:none;
}
#subscribe button:hover{
    cursor:pointer;
    background-color: #afbf1e;
}


.success{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.success h4{
    color: green;
    text-transform: uppercase;
    font-size: 22px;
    line-height: 28px;
    font-weight: bold;
    letter-spacing: 3px;
}
.success p{
    color: #595959;
    line-height: 1.5em;
    font-size: 16px;
}

.footerblock h5{
    padding: 0 50px;
    text-transform: uppercase;
    font-size:22px;
    line-height: 28px;
    font-weight:bold;
    letter-spacing: 3px;
    height:50px;
    display:block;
    top:36px;
    left:0;
    width:100%;
    position:absolute;
}
.footerblock h6{
    padding: 0 50px;
    font-size:15px;
    font-weight:400;
    letter-spacing: 1px;
    height:50px;
    display:block;
    top:63px;
    left:0;
    width:100%;
    position:absolute;
}
.footerblock:after{
    content: '';
    height:1px;
    width:340px;
    background:#70dcd0;
    display:block;
    left:0;
    top: 100px;
    position:absolute;
    z-index: 5;
}










.footertext{
    color:#fff;
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0 25% 20px 20px;
}
.footertext h6{
    display:block;
    width:100%;
    position:relative;
    float:left;
    text-transform: uppercase;
    font-size:24px;
    line-height: 33px;
    font-weight:bold;
    letter-spacing: 3px;
    margin: 0 0 20px 0;
}
.footertext h6 span{
    display:block;
    width:100%;
    position:relative;
    float:left;
    line-height: 23px;
    font-size:16px;
}
.footertext p{
    margin: 0 0 150px 0;
    font-size:17px;
    max-width:380px;
}


.loginbox{
    display:block;
    width:100%;
    position:relative;
    float:left;
    max-width:360px;
}
.loginbox h6{
    display:block;
    width:100%;
    position:relative;
    float:left;
    text-transform: uppercase;
    font-size:18px;
    font-weight:bold;
    letter-spacing: 3px;
    color:#fff;
    margin: 0 0 12px 0;
}
.loginbox p{
    line-height: 28px;
    color:#cccccc;
    margin: 0 0 5px 0;
}

.contactlinks{
    list-style:none;
    padding: 0;
    margin: 0;
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.contactlinks li{
    float:left;
    display:block;
    line-height: 16px;
}
.contactlinks li span{
    color:#c2d327;
    margin: 0 4px 0 0;
}
.contactlinks li a{
    color: #70dcd0;
}
.contactlinks li:last-child{
    margin: 0 0 0 15px;
    padding: 0 0 0 15px;
    border-left: 1px solid #ccc;
}



#loginform{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 25px 0;
}
.loginbox .inputholder{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#fff;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 6px 6px 6px 40px;
    margin: 0 0 8px 0;
    background-repeat:no-repeat;
    background-position: left 14px center;
}
.loginbox .inputholder.user{background-image:url('../img/login-user-icon.png');}
.loginbox .inputholder.password{background-image:url('../img/login-pwd-icon.png');}
.loginbox .inputholder input{
    display:block;
    width:100%;
    position:relative;
    float:left;
    border:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
#loginform input[type="submit"]{
    color:#042e33;
    padding: 8px 32px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display:block;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    background:#c2d327;
    float:left;
    position:relative;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    border:none;
}
#loginform input[type="submit"]:hover{
    cursor:pointer;
    background-color: #afbf1e;
}
a.register{
    margin: 0 0 0 24px;
    padding: 8px 0;
    display:block;
    letter-spacing: 3px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    float:left;
    position:relative;
    text-decoration: none;
    color:#fff;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
a.register:hover{
    color:#c2d327;
}
a.register:after{
    content: '';
    width:100%;
    height:1px;
    display:block;
    background:#fff;
    position: absolute;
    bottom: 7px;
    left:0;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
a.register:hover:after{
    background:#c2d327;
}

#copyright{
    color:#ccc;
    font-size:14px;
    padding:  0 0 40px 0;
    line-height: 14px;
}
#copyright span.footerlink{
    display:inline-block;
    *display:inline;
    *zoom:1;
    margin: 0 0 0 12px;
    padding: 0 0 0 15px;
    border-left:1px solid #ccc;
}
#copyright span.footerlink a{
    color:#70dcd0;
    text-decoration: underline;
}

#social{
    display:block;
    width:auto;
    position:relative;
    float:right;
    bottom: 12px;
}
#social a{
    width:34px;
    height:34px;
    display:block;
    -webkit-border-radius: 25px;
    -moz-border-radius: 25px;
    border-radius: 25px;
    border:1px solid #ccc;
    color:#ccc;
    padding: 7px 0 0 0;
    font-size:13px;
    text-align: center;
    float:left;
    margin: 0 0 0 15px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
#social a:hover{
    background:#ccc;
    color:#042e33;
}



















/* SELECT */
/* --------------------------------- */
.customselect{
    float:left;
    display:block;
    width:100%;
    position:relative;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    background:#fff;
}
.customselect.open{
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
}
.customselect:focus,
.customselect:hover{
    -webkit-box-shadow: 0px 0px 15px #ddd;
    -moz-box-shadow: 0px 0px 15px #ddd;
    box-shadow: 0px 0px 15px #ddd;
    cursor:pointer;
}

/* SPAN */
/* --------------------------------- */
.customselect span{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 8px 40px 8px 10px;
    z-index: 5000;
    line-height: 18px;
    background: #fff;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    overflow-wrap: break-word;
}
.customselect span.active,
.customselect.open span:hover{
    color: #042e33;
    background: #f2f2f2;
    -webkit-box-shadow: 0px 5px 10px #777;
    -moz-box-shadow: 0px 5px 10px #777;
    box-shadow: 0px 5px 10px #777;
}
.customselect span:focus{
    outline:none;
    -webkit-box-shadow: 0px 0px 15px #aaa;
    -moz-box-shadow: 0px 0px 15px #aaa;
    box-shadow: 0px 0px 15px #aaa;
}
.customselect span:active,
.customselect.open span:focus{
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.customselect.pre span{
    padding-left:40px;
}
.customselect.pre span:before{
    color:#aaa;
    position: absolute;
    content:'\f03a';
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
    position:absolute;
    top:50%;
    left:10px;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
}
.customselect.open span{
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
}
.customselect span:after{
    position:absolute;
    top:50%;
    right:10px;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
    content: '\f078';
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
    color:#aaa;
}

/* LIST */
/* --------------------------------- */
.customselect ul{
    list-style:none;
    margin: 0;
    padding: 0;
    width:100%;
    position:absolute;
    float:left;
    display:none;
    top:100%;
    left:0;
    background:#fff;
    z-index: 100000;
    border-top:1px solid #70dcd0;
    -webkit-box-shadow: 0px 7px 20px #aaa;
    -moz-box-shadow: 0px 7px 20px #aaa;
    box-shadow: 0px 7px 20px #aaa;
}
.customselect.open ul{
    display:block;
    -webkit-border-radius: 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}
.customselect ul li{
    line-height: 18px;
    padding: 8px 10px;
}
.customselect ul li.focused{
    color: #042e33;
    background: #e2f3ef;
}

.customselect.pre ul li{
    padding-left:40px;
    overflow-wrap: break-word;
}
.customselect ul li:hover{
    background:#e2f3ef;
}
.customselect ul li:last-child.focused,
.customselect ul li:last-child:hover{
    -webkit-border-radius: 0 0 10px 10px;
    -moz-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}



/* #INTERIOR */

#title{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 70px 0 0 0;
    margin: 60px 0 0 0;
}
#page{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 60px 0 160px 0;
}
#page.int{
    padding: 60px 0 120px 0;
}
#title h1,
#title #h1{
    color:#e01021;
    letter-spacing: 3px;
    font-size:27px;
    text-transform:uppercase;
    font-weight:bold;
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 2px 0;
    padding: 0 0 50px 0;
}
#title:after,
#title #h1:after{
    content: '';
    width:50%;
    left:50%;
    bottom:0px;
    height:2px;
    display:block;
    position:absolute;
    background: #f13243;
}
#title h1:after,
#title #h1:after{
    content: '';
    width:100%;
    left:0;
    bottom:-2px;
    z-index: 4;
    height:2px;
    display:block;
    position:absolute;
    background: #23c3b3;
    background: -moz-linear-gradient(left, #23c3b3 0%, #6dbd50 50%, #f13243 100%);
    background: -webkit-linear-gradient(left, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    background: linear-gradient(to right, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23c3b3', endColorstr='#f13243',GradientType=1 );
}

/* SUBNAV */
#subnav{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.sideBar,
.sideNav{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.sideNav ul{
    list-style: none;
    margin: 0;
    padding: 0;
    display:block;
    width:100%;
    position:relative;
    float:left;
    list-style: none;
}
.sideNav ul li{
    float:left;
}
.sideNav ul li a{
    float:left;
    display:block;
    color:#042e33;
    padding: 10px 10px;
    letter-spacing: 2px;
    font-size:12px;
    text-transform:uppercase;
    position: relative;
}
.sideNav ul li.selected a:hover,
.sideNav ul li.selected a{
    font-weight:bold;
    background:#e2f3ef;
}
.sideNav ul li a:hover{
    text-decoration: none;
}
.sideNav ul li a:after{
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    content: '';
    width:100%;
    bottom:0px;
    display:block;
    position: absolute;
    background:#70dcd0;
    height:1px;
    left:0;
    opacity:0;
}
.sideNav ul li a:hover:after{
    opacity: 1;
}

/* PAGE STYLES */
#page h1{
    letter-spacing: 2px;
    font-size:22px;
    font-weight:600;
    text-transform:uppercase;
    margin: 0 0 18px 0;
    padding: 0 0 18px 0;
    position:relative;
}
#page h2{
    color:#042e33;
    letter-spacing: 3px;
    font-size:22px;
    text-transform:uppercase;
    font-weight:bold;
    display:block;
    width:100%;
    position:relative;
    float:left;
    clear:both;
    margin: 0 0 15px 0;
    padding: 0 0 15px 0;
}
#page h1:after,
#page h2:after{
    content: '';
    width:500px;
    max-width:50%;
    display:block;
    position:absolute;
    bottom: 0px;
    height:1px;
    background:#70dcd0;
}
#page h3{
    font-size:20px;
    font-weight:bold;
}
#page h4{
    font-size:18px;
    font-weight:bold;
}
#page ul{list-style:square;}
#page ul, #page ol{
    padding: 0 0 0 20px;
}

#page p a,
#page li a{
    color:#e01021;
    text-decoration: underline;
}

/* PREV-NEXT */
#prevnext{
    margin: 0 0 140px 0;
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.pnblock{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 10px 30px 20px 30px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.pnblock:hover{
    background: #e2f3ef;
}
.pnblock span{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 10px 30px 10px 50px;
    color:#042e33;
    letter-spacing: 3px;
    font-size:14px;
    text-transform:uppercase;
    font-weight:bold;
    border-bottom: 1px solid #70dcd0;
    background-image:url('../img/prev-arrow-green.png');
    background-repeat:no-repeat;
    background-position: left 15px center;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
.pnblock:hover span{background-position: left 0px center;}
.pnblock.nextblock span{
    text-align: right;
    padding: 10px 50px 10px 30px;
    background-image:url('../img/next-arrow-green.png');
    background-repeat:no-repeat;
    background-position: right 15px center;
}
.pnblock.nextblock:hover span{background-position: right 0px center;}












/* RESOURCES */
#resource-featured-int{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0 0 200px 0;
}
#librarySearchInt{
    padding: 30px 0 120px 0;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e2f3ef+39,ffffff+100 */
    background: #e2f3ef; /* Old browsers */
    background: -moz-linear-gradient(top, #e2f3ef 39%, #ffffff 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #e2f3ef 39%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #e2f3ef 39%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e2f3ef', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
}
.intoffset{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 40px 0;
}


/* STAFF */
#staff{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 40px 0 200px 0;
}
.infobar{
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    height: auto;
    min-height:80px;
    z-index: 100;
    padding: 20px;
    background: #e2f3ef;
}
.infobar h3{
    margin: 0 0 5px 0;
    letter-spacing: 2px;
    font-size:18px;
    line-height:22px;
}
.infobar h4{
    margin: 0;
    letter-spacing: 2px;
    font-size:13px;
    font-weight:600;
    text-transform:uppercase;
}

.feat-brick .color{
    top:0;
    left:0;
    right:0;
    bottom:0;
    position: absolute;
    z-index: 50;
    display:block;
    background:#70dcd0;
    opacity:0;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.feat-brick:hover .color{
    opacity:.7;
}
.feat-brick .image{
    top:0;
    left:0;
    right:0;
    bottom:80px;
    position: absolute;
    z-index: 40;
    display:block;
    background-repeat:no-repeat;
    background-position: center;
    background-size: cover;
}
.fullbio{
    position:absolute;
    top:55%;
    left:50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: 80;
    background-color:#c2d327;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 4px 15px 4px 30px;
    background-image:url('../img/staff-plus.png');
    background-repeat:no-repeat;
    background-position: center left 12px;
    letter-spacing: 2px;
    font-size:13px;
    font-weight:600;
    text-transform:uppercase;
    opacity:0;
    color:#042e33;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    -webkit-transition-delay: 200ms;
    transition-delay: 200ms;
}
.fullbio:hover{
    text-decoration:none;
    color:#042e33;
}
.feat-brick:hover .fullbio{
    top:50%;
    opacity:1;
}

/* STAFF DETAIL */
#linebar{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 140px 0;
}
#linebarline{
    width: 100%;
    z-index: 4;
    height: 2px;
    display: block;
    float:left;
    background: #23c3b3;
    background: -moz-linear-gradient(left, #23c3b3 0%, #6dbd50 50%, #f13243 100%);
    background: -webkit-linear-gradient(left, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    background: linear-gradient(to right, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23c3b3', endColorstr='#f13243',GradientType=1 );
}
#linebar:after{
    content: '';
    width: 50%;
    left: 50%;
    bottom: 0px;
    height: 2px;
    z-index: -1;
    display: block;
    position: absolute;
    background: #f13243;
}
.feat-brick.detail{
    float:left;
    width: 300px;
    height: 350px;
    margin: 0 30px 50px 0;
}
.col.bio h1{
    letter-spacing: 2px;
    font-size:22px;
    font-weight:600;
    text-transform:uppercase;
    margin: 0 0 18px 0;
    padding: 0 0 18px 0;
    position:relative;
}
.col.bio h1:after{
    position: absolute;
    content:'';
    background:#23c3b3;
    bottom: 0;
    left:330px;
    display:block;
    width:780px;
    height:1px;
}
#page .col.bio .feat-brick h3{
    font-size:19px;
}
#page .col.bio .feat-brick h4{
    font-size:13px;
}





/* PROJECTS LISTING */

#featured.all{
    padding: 0 0 200px 0;
    background-image:none;
}
#featured.all .col1 .block{
    margin: 0px 0 0px 0;
}
#featured.all .col1 .block{
    margin: 0px 0 70px 0;
}
#featured .col2 .block{
    margin: 140px 0 0 0;
}
.paginate{
    text-align: center;
    padding-top:150px;
}


/* CONTACT */
#submitBtn{
    color:#042e33;
    padding: 8px 22px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    display:block;
    letter-spacing: 3px;
    margin: 0 0 90px 0;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    background:#c2d327;
    float:left;
    position:relative;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    border:none;
}
#submitBtn:hover{
    cursor:pointer;
    background-color: #afbf1e;
}

.contact form{
    margin: 0 -15px;
}
.contact form div[class*="col-"]{
    width:100%;
    max-width:100%;
}
.meetingcontact form input[type="text"],
.meetingcontact form input[type="email"],
.meetingcontact form input[type="tel"],
.contact form input[type="text"],
.contact form input[type="email"],
.contact form input[type="tel"]{
    width:100%;
    border-color:#70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.contact form select{
    max-width:500px;
    border-color:#70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.meetingcontact form .control-label,
.contact form .control-label{
    margin-bottom: 3px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    width:100%;
    max-width:100%;
    color:#042e33;
}
.contact form textarea{
    min-height:120px;
    height:180px;
    border-color:#70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}



.mapheader{
    display:block;
    width:100%;
    position:relative;
    float:left;
    height:60px;
    text-align: center;
    margin: 0 0 20px 0;
}
.mapheader:after{
    height:2px;
    background:#70dcd0;
    display:block;
    content:'';
    width:100%;
    position:absolute;
    top:40px;
    left:0;
    z-index: -1;
}
.mapheader .icon{
    height:60px;
    display:block;
    width:100%;
    position:relative;
    float:left;
    background-image:url('../img/mapicon.png');
    background-repeat:no-repeat;
    background-position: center top 0px;
}
#contactaddress{
    display:block;
    width:100%;
    position:relative;
    float:left;
    color: #e01021;
    letter-spacing: 3px;
    font-size: 27px;
    text-transform: uppercase;
    font-weight: bold;
    text-align: center;
    margin: 0 0 10px 0;
}

a.contactlink{
    width:100%;
    text-align:center;
    float:left;
    font-size:19px;
    color: #042e33;
    margin: 4px 0 0px 0;
}
a.contactlink.lastlink{
    margin: 4px 0 80px 0;
}

#onmaps{
    display:block;
    width:100%;
    position:relative;
    float:left;
    text-align: center;
    letter-spacing: 1px;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: bold;
    color:#042e33;
    text-decoration:underline;
    -webkit-transition: all 100ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 100ms ease;
    -o-transition: all 100ms ease;
    transition: all 100ms ease;
}
#onmaps:before{
    position: relative;
    content: "";
    display:inline-block;
    *display:inline;
    *zoom:1;
    width:10px;
    height:10px;
    margin: 0 10px 0 0;
    background-image:url('../img/marbutton-plus.png');
    background-repeat:no-repeat;
    background-position:  center;
    background-size: 10px;
}
#onmaps:hover{color:#e01021;}


/* DASHBOARD */

.dash{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background-image:url('../img/dash-bg.gif');
    background-repeat:no-repeat;
    background-position:top center;
    background-size: 100%;
    background-color: #e2f3ef;
}
.whitepage{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#fff;
    padding: 60px;
}
.frmLogin{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 30px 60px 15px 60px;
    margin: 0 0 60px 0;
    border:1px solid #70dcd0;
}
#page .frmLogin h2{
    padding: 0;
    margin:  0 0 20px 0;
    border:  none;
    display:block;
    width:100%;
    position:relative;
    float:left;
}
#page .frmLogin h2:after{display:none;}

.frmLogin .form-group{
    display:block;
    width:40%;
    position:relative;
    float:left;
    padding: 0 15px 0 0;
}
.frmLogin .form-group.login-group{
    width:20%;
    padding: 0;
}


.frmLogin .form-group input[type="text"],
.frmLogin .form-group input[type="password"]{
    display:block;
    width:100%;
    position:relative;
    float:left;
    border:none;
    -webkit-appearance:none;
    -moz-appearance:none;
    -ms-appearance:none;
    -o-appearance:none;
    appearance:none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}
.frmLogin .inputholder{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#fff;
    border: 1px solid #70dcd0;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 6px 6px 6px 40px;
    margin: 0 0 8px 0;
    background-repeat:no-repeat;
    background-position: left 14px center;
}
.frmLogin .inputholder.user{background-image:url('../img/login-email-icon.png');}
.frmLogin .inputholder.password{background-image:url('../img/login-pwd-icon.png');}
.frmLogin .forgot{
    display:block;
    width:100%;
    position:relative;
    float:left;
    color:#042e33;
    font-size:14px;
}
.frmLogin .forgot a{
    color:#042e33;
    font-style:italic;
}
label.securelabel{
    display:block;
    width:100%;
    position:relative;
    float:left;
    color: #e01021;
    letter-spacing: 1px;
    font-size: 16px;
    /* text-transform: uppercase; */
    font-weight: bold;
    margin: 0 0 5px 0;
}
.frmLogin #submitBtn{
    width:100%;
    margin: 30px 0 0 0;
    padding: 17px 35px 13px 35px;
    font-size:18px;
    line-height: 20px;
}


/* TRAININGS LISTINGS */
#trainings{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 30px 0;
}
.training{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    margin: 0 0 30px 0;
    padding: 45px 50px 80px 50px;
}
#page .training h3{
    color: #042e33;
    letter-spacing: 3px;
    font-size: 23px;
    text-transform: uppercase;
    font-weight: bold;
    line-height: 30px;
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 12px 0;
}
.training .nextdate{
    float:left;
    display:block;
    background:#fff;
    padding: 4px 8px;
    color: #042e33;
    font-size: 14px;
    font-weight: bold;
    margin: 0 0 30px 0;
}
.training .nextdate span{
    letter-spacing: 2px;
    text-transform: uppercase;
}

.actionbar{
    display:block;
    height:51px;
    position: absolute;
    bottom: 0;
    left:0;
    width:100%;
    z-index: 3;
    border-top:1px solid #70dcd0;
}
.actionbar .noEventAlert {
	display: inline-block;
	font-size: 14px; 
	font-weight: 600;
	letter-spacing: 1px; 
	line-height:17px; 
	padding: 7px 50px 10px 50px; 
}
.findcert{
    height:50px;
    xfloat:left;
    width:auto;
	display: inline-block;
    padding: 10px 0px;
    color:#042e33;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 30px;
    font-weight: bold;
	margin-bottom: 15px;
}
.findcert i{
    font-size:20px;
    margin: 0 14px 0 0;
}
.findcert:hover,.findcert:focus{
	color: #70dcd0;	
}

.actionbar a.register-training{
    position: absolute;
    top:0;
    right:0;
    height:50px;
    width:auto;
    padding: 10px 20px 10px 10px;
    background:#c2d327;
    color:#042e33;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.actionbar a.register-training:hover{
    background-color: #afbf1e;
    text-decoration: none;
}
.actionbar a.register-training:before{
    content: '';
    position: absolute;
    bottom: 0;
    right:100%;
    width:50px;
    height:50px;
    border-top: 25px solid transparent;
    border-left:25px solid transparent;
    border-right:25px solid #c2d327;
    border-bottom:25px solid #c2d327;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.actionbar a.register-training:hover:before{
    border-right:25px solid #afbf1e;
    border-bottom:25px solid #afbf1e;
}

.actionbar a.learnmore-training{
    position: absolute;
    top:0;
    left:0;
    height:50px;
    width:auto;
    padding: 10px 10px 10px 20px;
    background:#23c3b3;;
    color:#042e33;
    text-align: center;
    font-size: 14px;
    line-height: 30px;
    text-transform: uppercase;
    letter-spacing: 3px;
    font-weight:bold;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.actionbar a.learnmore-training:hover{
    background-color: #20b1a3;
    text-decoration: none;
}
.actionbar a.learnmore-training:before{
    content: '';
    position: absolute;
    bottom: 0;
    left:100%;
    width:50px;
    height:50px;
    border-top: 25px solid #23c3b3;;
    border-left:25px solid #23c3b3;;
    border-right:25px solid transparent;
    border-bottom:25px solid transparent;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
}
.actionbar a.learnmore-training:hover:before{
    border-left:25px solid #20b1a3;
    border-top:25px solid #20b1a3;
}

/* TRAINING DETAIL */

.regForm{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 50px 100px;
    margin: 20px 0 150px 0;
}
.regForm label.major{
    display:block;
    font-size:25px;
    width:100%;
    font-weight:400;
    position:relative;
    float:left;
    color:#042e33;
    margin: 0 0 14px 0;
    padding: 0 0 4px 0;
    border-bottom: 1px solid #70dcd0;
}
.regForm label.major .sub-label{
    font-size:14px;
    color:#e01021;
}

.chunk{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 30px 0;
}
.pod{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 12px 0;
}
.inputcell{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.inputcell.half:first-child{
    width:49%;
    margin: 0 1% 0 0;
}
.inputcell.half:last-child{
    width:49%;
    margin: 0 0 0 1%;
}
.inputcell.third{
    width:32%;
    margin: 0 2% 0 0;
}
.inputcell.third:last-child{
    margin: 0;
}
.regForm h4{
    text-transform:uppercase;
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 30px 0;
    padding: 0 0 30px 0;
}
.regForm h4:after{
    content: '';
    width:60%;
    display:block;
    position: absolute;
    left:0;
    bottom: 0;
    height:1px;
    background:#70dcd0;
}
.regForm label{
    display:block;
    width:100%;
    position:relative;
    float:left;
    color:#042e33;
    font-weight:600;
    margin: 0 0 2px 0;
    padding: 0 0 0 5px;
}
.regForm label span{
    color:#e01021;
}
.paymentoption{
    position:relative;
    float:left;
    width:32%;
    margin: 0 1% 0 0;
    display:block;
    background:#fff;
    min-height:100px;
    padding: 12px 20px 15px 40px;
    border:2px solid #fff;
}
.paymentoption input:checked + .showline{
    position: absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    display:block;
    border: 3px solid #23c3b3;
}
.paymentoption input{
    float:left;
    margin: 0 15px 15px 0;
    position: absolute;
    top:15px;
    left:15px;
}
.paymentoption h5{
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    float:left;
    width:auto;
    min-height:35px;
}
.paymentoption h6{
    display:block;
    width:100%;
    position:relative;
    float:left;
    font-size:22px;
    letter-spacing: 2px;
    font-weight:bold;
    margin: 0;
}


.regForm input[type="text"],
.regForm input[type="email"],
.regForm input[type="tel"]{
    width:100%;
    border-color:#70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding:8px 15px;
    border:1px solid #70dcd0;
}
.regForm select{
    height:42px;
    padding:5px 15px;
    width:100%;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border:1px solid #70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

#page #showEventDetails{
    display:block;
    width:100%;
    position:relative;
    float:left;
    list-style: none;
    margin: 0;
    padding: 0;
}
#page #showEventDetails li{
    display:none;
    /* display:block; */
    width:100%;
    position:relative;
    float:left;
    padding: 15px 20px;
    margin: 10px 0;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    background:#cfede6;
}
#page #showEventDetails li.active{
    display:block;
}
#page #showEventDetails li h4{
    font-size:15px;
    line-height: 15px;
    margin: 0 0 8px 0;
    padding: 0;
    border:none;
}
#page #showEventDetails li h4:after{display:none;}
#page #showEventDetails li p{
    font-size:13px;
    line-height: 14px;
    margin: 0 0 5px 0;
}



.regForm .control-label{
    margin-bottom: 3px;
    letter-spacing: 2px;
    text-transform: uppercase;
    font-size:14px;
    font-weight:bold;
    width:100%;
    max-width:100%;
    color:#042e33;
}
.regForm textarea{
    padding:8px 15px;
    width:100%;
    min-height:120px;
    height:130px;
    border:1px solid #70dcd0;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}
.contactset{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0 0 0 10px;
    margin: 10px 0 0 0;
}

#payment{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 10px 0 10px 0;
    padding: 0 0 0 10px;
}
#payment input{
    float:left;
    margin: 3px 3px 10px 0;
}
#payment label{
    float:left;
    width:auto;
}
#payment .node{
    float:left;
    font-size:16px;
    line-height: 20px;
}
#payment .orpayment{
    float:left;
    margin: 0 30px;
    color: #042e33;
    font-size:18px;
    line-height: 20px;
    font-weight:bold;
}
.chunk #submitBtn{
    margin: 0;
}


/* CONFIRMATION PAGE */
.result{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 60px 70px 70px 70px;
    border: 2px solid #70dcd0;
}
.result:after{
    padding: 15px 0 0 0;
    text-align: center;
    font-size:30px;
    color:#fff;
    content:'\f00c';
    font-weight:900;
    font-family:'Font Awesome 5 Free';
    width:70px;
    height:70px;
    display:block;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    position:absolute;
    top:60px;
    left:-35px;
    background:#70dcd0;


}
.resultheading{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
span.ref{
    font-size:14px;
    color:#777;
    font-weight:bold;
}
#page .resultheading h4{
    color:#042e33;
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 20px 0 8px 0;
    font-size:30px;
    font-weight:normal;
}

.eventarea{
    display:block;
    width:auto;
    position:relative;
    float:left;
    padding: 3px 22px 10px 70px;
    background:#e2f3ef;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
}
#page .eventarea h4{
    margin: 10px 0 8px 0;
    text-transform:uppercase;
    font-size:15px;
}
#page .eventarea p{
    font-size:13px;
    line-height: 16px;
    margin: 0 0 2px 0;
    color:#3b3b3b;
}
.eventarea:before{
    font-size:40px;
    content: '\f274';
    font-weight: 400;
    color:#66c8b9;
    font-family:'Font Awesome 5 Free';
    position:absolute;
    top:15px;
    display:block;
    height:40px;
    line-height: 40px;
    left:18px;
}

.pricing{
    clear:both;
    margin: 40px 0 25px 0;
    display:block;
    width:100%;
    position:relative;
    float:left;
}
.lineitem{
    display:block;
    width:100%;
    position:relative;
    float:left;
    border-bottom: 1px solid #444;
}
.lineitem .title{
    width:70%;
    float:left;
    display:block;
}
.lineitem .theprice{
    float:left;
    width:30%;
    font-size:25px;
    text-align: right;
}
.top{
    display:block;
    width:100%;
    position:relative;
    float:left;
    font-size:14px;
    color:#444;
}
.bottom{
    display:block;
    width:100%;
    position:relative;
    float:left;
    font-size:23px;
    line-height: 23px;
    padding: 3px 0 5px 0;
}
.payment{
    display:block;
    width:100%;
    position:relative;
    float:left;
    text-align: right;
}
#page .payment h3{
    margin: 15px 0 0 0;
    font-size:30px;
}
#page .payment p{
    margin: 0 0 10px 0;
}
.pdfButton{
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f95157+0,f13243+100 */
    background: #f95157; /* Old browsers */
    background: -moz-linear-gradient(top, #f95157 0%, #f13243 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #f95157 0%,#f13243 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f95157 0%,#f13243 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f95157', endColorstr='#f13243',GradientType=0 ); /* IE6-9 */
    color:#fff;
    padding: 10px 20px 10px 45px;
    float:right;
    font-weight:bold;
    font-size:18px;
    clear:both;
    position: relative;
    width:auto;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: -2px 2px 0px #c52432;
    -moz-box-shadow: -2px 2px 0px #c52432;
    box-shadow: -2px 2px 0px #c52432;
}
.pdfButton:hover{
    color:#fff;
    text-decoration: none;
    background: #f13243;
}
.pdfButton:active{
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    top:2px;
    right:2px;
    background: #c52432;
}

.pdfButton:before{
    content: '\f1c1';
    font-weight:900;
    font-family:'Font Awesome 5 Free';
    font-size:18px;
    color:#fff;
    position:absolute;
    top:50%;
    left:15px;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
}

.infoarea{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 40px;
    margin: 50px 0 0 0;
    color:#042e33;
}
.infoarea ol {
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 14px 0 0 0;
}
.infoarea ol li{
    line-height: 20px;
    margin: 0 0 15px 0;
}


/* DASHBOARD */


#page h2.dashwelcome{
    font-weight:400;
    text-transform: none;
    font-size:30px;
}
#page h2.dashwelcome strong{font-weight:bold;}
#page h2.dashwelcome:after{display:none;}
#page .trainingblock h2:after{
    width:100%;
    max-width:100%;
    height:2px;
    background: #23c3b3;
    background: -moz-linear-gradient(left, #23c3b3 0%, #6dbd50 50%, #f13243 100%);
    background: -webkit-linear-gradient(left, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    background: linear-gradient(to right, #23c3b3 0%,#6dbd50 50%,#f13243 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#23c3b3', endColorstr='#f13243',GradientType=1 );

}
#page p.trainingintro{
    font-size:20px;
    line-height: 1.2em;
    margin: 0 0 40px 0;
    display:block;
    width:100%;
    position:relative;
    color:#042e33;
    float:left;
}

#page h2.mainheading{
    font-size:30px;
    margin-top: 30px;
}
.trainingblock{
    display:block;
    width:100%;
    position:relative;
    float:left;
    background:#e2f3ef;
    padding: 40px 80px;
    margin: 0 0 20px 0;
}


.group{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 30px 0;
    padding: 0 0 30px 0;
    border-bottom: 1px dashed #888;
}
.group:last-child{
    border:none;
}
#page .group h3{
    margin: 10px 0 3px 0;
    line-height: 30px;
    font-size:25px;
}
.group .group-tagline{
    display:block;
    width:100%;
    position:relative;
    float:left;
    font-size:13px;
    font-weight:bold;
    line-height: 8px;
    margin: 0 0 10px 0;
}
.group .desc p{
    font-size:14px;
    line-height: 16px;
}

.group ul li h4{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0 0 2px 0;
    margin: 15px 0 0 0;
    color: #f13243;
    font-size:16px;
    line-height: 20px;
    border-bottom: 1px dotted #aaa;
}
.trainingblock p,
.trainingblock > ul li{
    font-size:14px;
    line-height: 16px;
}
.trainingblock > ul,
.trainingblock > ol{
    list-style: square;
    padding: 0 0 0 20px;
    margin: 0 0 20px 0;
}
.trainingblock > ol{list-style:decimal;}
.trainingblock > ul li{margin: 0 0 5px 0;}


#page .trainingblock .group ul{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 0;
    margin: 10px 0 0 0;
    list-style:none;
}

#page .trainingblock .group ul li{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 6px 0;
}
#page .trainingblock .group ul li a{
    text-decoration:none;
    color:#042e33;
    padding: 3px 0 7px 25px;
    font-size:14px;
    font-weight:bold;
    display:block;
    position:relative;
    float:left;
}
#page .trainingblock .group ul li a:hover{
    color:#e01021;
}
#page .trainingblock .group ul li a span.underline{
    position: relative;
}
#page .trainingblock .group ul li a span.underline:after{
    position: absolute;
    width:100%;
    height:1px;
    content:'';
    display:block;
    background:#042e33;
    bottom:1px;
    left:0;
    -webkit-transition: all 100ms ease;
    -moz-transition: all 100ms ease;
    -ms-transition: all 100ms ease;
    -o-transition: all 100ms ease;
    transition: all 100ms ease;
}
#page .trainingblock .group ul li a:before{
    content: '\f15c';
    font-weight:900;
    font-family:'Font Awesome 5 Free';
    position: absolute;
    color:#042e33;
    font-size:18px;
    top:50%;
    left:0;
    -webkit-transform: translate(0,-50%);
    -moz-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    transform: translate(0,-50%);
}

#page .trainingblock .group ul li a.link:before{content:'\f0c1';}
#page .trainingblock .group ul li a.zip:before{content:'\f1c6';}
#page .trainingblock .group ul li a.doc:before,
#page .trainingblock .group ul li a.docx:before{content:'\f1c2';}
#page .trainingblock .group ul li a.xls:before,
#page .trainingblock .group ul li a.xlsx:before{content:'\f1c3';}
#page .trainingblock .group ul li a.ppt:before,
#page .trainingblock .group ul li a.pptx:before{content:'\f1c4';}
#page .trainingblock .group ul li a.pdf:before{content:'\f1c1';}
#page .trainingblock .group ul li a.mp3:before{content:'\f1c7';}
#page .trainingblock .group ul li a.mov:before,
#page .trainingblock .group ul li a.wmp:before,
#page .trainingblock .group ul li a.wmv:before,
#page .trainingblock .group ul li a.mp4:before{content:'\f1c8';}
#page .trainingblock .group ul li a.jpg:before,
#page .trainingblock .group ul li a.jpeg:before,
#page .trainingblock .group ul li a.png:before,
#page .trainingblock .group ul li a.gif:before{content:'\f1c5';}


.approval{
    display:block;
    width:100%;
    position:relative;
    float:left;
    padding: 15px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background:#c9e7e0;
}
.approval p{
    margin: 0;
    font-weight: bold;
    color:#042e33;
}

.utilities{
    display:block;
    width:auto;
    position:relative;
    float:right;
}
.utilities a{
    float:left;
    width:auto;
    min-width:130px;
    font-size:18px;
    padding: 12px 20px;
    background:#23c3b3;
    margin: 0 0 0 2px;
    color:#fff;
    font-weight:bold;
    text-align: center;
}
.utilities a:hover{
    text-decoration:none;
    background:#1faa9c;
}
.utilities a.active,
.utilities a.active:hover{
    color:#042e33;
    background:#fff;
}

.tabs{
    display:block;
    width:auto;
    position:relative;
    float:left;
}
.tabs a{
    text-transform:uppercase;
    float:left;
    width:auto;
    min-width:130px;
    font-size:18px;
    padding: 12px 20px;
    background:#23c3b3;
    margin: 0 2px 0 0;
    color:#fff;
    font-weight:bold;
    text-align: center;
}
.tabs a:hover{
    background:#1faa9c;
    cursor:pointer;
    text-decoration: none;
}
.tabs a.active,
.tabs a.active:hover{
    color:#042e33;
    background:#fff;
}
#tabs{
    display:block;
    width:100%;
    position:relative;
    float:left;
}
#tabs .tab{
    display:block;
    width:100%;
    position:relative;
    float:left;
}

/* MEETING ATTENDEE */

.formnotice{
    display:block;
    width:100%;
    position:relative;
    float:left;
    margin: 0 0 30px 0;
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius: 8px;
    padding: 20px;
    font-size:20px;
}
.errorbox{
    background: #fef2c9;
    border: 1px solid #c3bf68;
}
.successbox{
    background: #ccfcba;
    border: 1px solid #47c63f;
}


.brief {
	background: none !important;
	padding-bottom: 0px !important;
}
.brief hr {
	border-top: 1px solid #89dcd1;
	margin: 20px 0px;
}
.brief #submitBtn {
	border-radius: 20px;
}
.brief .textarea {
	background-color: #e2f3ef;
	padding: 40px 40px 40px 80px !important;
}
.brief .brief-heading {
	color: #042e33;
	font-size: 22px;
	font-weight: 600;
	letter-spacing: 2px;
	margin-bottom: 10px;
	text-transform: uppercase;
}
.brief .brief-subheading {
	font-size: 15px;
	font-weight: 600;
	letter-spacing: 2px;
	margin-bottom: 10px;
	text-transform: uppercase;
}
.brief .brief-icons {
	margin: 0px;
	padding: 0px;
}
.brief .brief-icons > li {
	float: left;
	list-style-type: none;
	text-align: center;
	margin: 0 10px 10px 0;
}
.brief .brief-icons > li a {
	display: inline-block;
	width: 55px;
	height: 55px;
	background-size: 100%;
	background-position: center center;
}





/*
TEXT COLORS:
--------------------------
dark blue:          042e33
red:                e01021
teal                70dcd0
green               c2d327

OTHER COLORS:
--------------------------
footer grey         cccccc
light bg blue       e2f3ef

*/
/*  */