/*
    Theme Name: Lejan-Theme
    Description: Lejan-Theme
    Author: Tareq Fawakhiri
    Author URI: http://fawakhiri.com
    Version: 1.0
*/
@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,600,700,300);
@import url(https://fonts.googleapis.com/css?family=Roboto+Slab:400,700,300);
* {
    padding: 0;
    margin: 0;
    outline: none
}
.sticky,
.wp-caption,
.wp-caption-text,
.gallery-caption,
.bypostauthor {}body,
html {
    height: 100%
}
body {
    overflow-x: hidden;
    background: #444e58;
    font-family: 'Open Sans', sans-serif;
    font-size: 13px;
    font-weight: 400;
    color: #888;
    -webkit-font-smoothing: antialiased;
    -moz-font-smoothing: antialiased;
    -webkit-text-stroke: 1px rgba(0, 0, 0, .10);
}
a {
    color: #000;
    text-decoration: none
}
a,
a:hover {
    outline: none!important
}
iframe {
    width: 100%;
    height: 100%;
}
body h1,
body h2,
body h3,
body h4,
body h5 {
    font-weight: 400;
    line-height: 1.4;
    color: #222;
    margin-top: 0;
    letter-spacing: .2px;
    margin-bottom: 12px;
    font-family: verdana
}
h1 {
    font-size: 26px
}
h2 {
    font-size: 26px
}
h3 {
    font-size: 22px
}
h4 {
    font-size: 18px
}
h5 {
    font-size: 16px
}
h6 {
    font-size: 14px
}
.float-left {
    float: left!important
}
.float-right {
    float: right!important
}
.clear {
    clear: both;
    line-height: 0;
    font-size: 0
}
button {
    border: none
}
select,
textarea,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.uneditable-input {
    display: inline-block;
    height: 40px;
    padding: 4px 6px;
    font-size: 14px;
    line-height: 20px;
    border: none;
    color: #555;
    font-family: verdana;
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
header.cs-heading-title {
    float: left;
    width: 100%;
    border-bottom: 1px solid #e9e9e9;
    margin-bottom: 15px;
}
header.cs-heading-title h2 {
    float: left
}
.cs-section-title {
    font-size: 20px;
    line-height: 25px;
    margin-bottom: 10px
}
.widget-title h2 {
    color: #272727
}
.cs-post-title {
    color: #333;
    font-weight:bold;
    font-size: 14px;
    margin-bottom: 10px;
    line-height: 1.2;
    font-weight: 400;
}
.cs-page-title {
    font-size: 24px
}
.widget-title {
    margin: 0 0 16px 0
}
.bgcolrhvr:hover {
    color: #fff!important
}
figure {
    position: relative
}
figcaption {
    position: absolute
}
article figure {
    float: left;
    position: relative
}
figure img {
    float: left;
    width: 100%
}
p {
    margin-bottom: 15px;
    line-height: 1.8;
    letter-spacing: .02em
}
.fullwidth {
    float: left;
    width: 100%
}
ul,
li {
    list-style: none;
}
.element_size_100 {
    float: left;
    padding: 0;
    width: 100%
}
.element_size_75 {
    float: left;
    padding: 0 15px 0 15px;
    width: 75%
}
.element_size_50 {
    float: left;
    padding: 0 15px 0 15px;
    width: 50%
}
.element_size_25 {
    float: left;
    padding: 0 15px 0 15px;
    width: 25%
}
.wrapper.wrapper_boxed {
    max-width: 1080px;
    margin: 50px auto;
    background-color: #fff;
    box-shadow: 0 0 12px 1px rgba(0, 0, 0, .3)
}
.wrapper.wrapper_boxed {
    margin: 50px auto
}
.wrapper {
    background: #fff;
    margin: 8px 0;
    position: relative
}
.wrapper:before,
.wrapper:after {
    content: '';
    width: 98%;
    height: 8px;
    top: -8px;
    position: absolute;
    left: 1%;
    background: #21958f;
}
.wrapper:after {
    top: auto;
    bottom: -8px
}
#header {
    position: relative;
    z-index: 100;
    min-height: 112px
}
body.woocommerce header form {
    clear: none
}
.searcharea {
    position: relative
}
.searcharea a {
    color: #888;
    line-height: 32px;
    font-size: 16px;
    padding: 0 0 0 18px;
    border-left: 1px dotted #e6e6e6
}
#searchbox {
    float: left;
    display: none;
    position: absolute;
    right: -25px;
    top: 40px;
    width: 336px;
    border: 7px solid #e7e7e7;
    box-shadow: 0 0 3px rgba(0, 0, 0, .5);
    z-index: 9999
}
#searchbox input {
    float: left;
    width: 278px;
    height: 48px;
    border-radius: 0
}
#searchbox button {
    height: 48px;
    width: 44px;
    color: #fff;
    cursor: pointer;
    font-size: 16px
}
#mainheader {
    background: #fff;
    position: relative;
    z-index: 9999;
    padding-bottom: 25px;
    top: 0!important;
}
#rightheader {
    padding-top: 18px
}
#mainheader.scroll-to-fixed-fixed {
    box-shadow: 0 5px 5px rgba(0, 0, 0, .4);
    /* background: rgba(255, 255, 255, .9); */
    padding: 0;
    /* margin-top: 32px; */
}
.scroll-to-fixed-fixed #logo img {
    width: 160px !important;
    margin-top: 5px;
}
.scroll-to-fixed-fixed #rightheader {
    padding-top: 10px;
}
nav.navigation a {
    font-weight: 400;
    font-family: verdana;
    -webkit-transition: all .10s linear;
    -moz-transition: all .10s linear;
    -ms-transition: all .10s linear;
    -o-transition: all .10s linear;
    transition: all .10s linear
}
nav.navigation>ul>li {
    float: left;
    position: relative;
    padding: 0 20px;
    line-height: inherit
}
nav.navigation>ul>li:before {
    content: '\f142';
    font-family: FontAwesome;
    font-size: 9px;
    color: #d3d3d3;
    position: absolute;
    left: 0;
    top: 12px
}
nav.navigation>ul>li:first-child:before {
    display: none
}
nav.navigation>ul>li>a {
    float: left;
    font-size: 14px;
    height: 32px;
    font-weight: 400;
    line-height: 30px;
    color: #666;
    z-index: 999;
    position: relative;
    border-radius: 2px
}
nav.navigation ul ul li.current-menu-item:hover>a {
    color: #fff!important
}
nav.navigation ul ul>li:hover>a {
    color: #fff!important;
    background: #21958f;
}
.navigation ul ul {
    float: left;
    position: absolute;
    top: 35px;
    padding: 15px 10px;
    right: 0;
    z-index: 998;
    border-radius: 6px;
    background: rgba(255, 255, 255, .96);
    box-shadow: 4px 4px 12px rgba(0, 0, 0, .2);
    width: 195px;
    opacity: 0;
    visibility: hidden;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transform: translateY(-20px);
    -moz-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    transform: translateY(-20px);
    -webkit-transition: all .6s cubic-bezier(.86, 0, .07, 1);
    -moz-transition: all .6s cubic-bezier(.86, 0, .07, 1);
    -ms-transition: all .6s cubic-bezier(.86, 0, .07, 1);
    -o-transition: all .6s cubic-bezier(.86, 0, .07, 1);
    transition: all .6s cubic-bezier(.86, 0, .07, 1);
}
.navigation ul ul li {
    float: left;
    width: 100%;
    position: relative;
    border-top: 1px solid #e8e8e8
}
.navigation ul ul li:first-child {
    border-top: none
}
.navigation ul ul li h2 {
    font-size: 20px;
    line-height: 24px
}
.navigation ul ul ul {
    RIGHT: 100%;
    top: 0;
}
.navigation ul ul a {
    width: 100%!important;
    display: block;
    padding: 10px 10px;
    margin: 0;
    font-weight: 400;
    text-transform: n;
    font-size: 13px;
    color: #666;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.navigation ul ul a:hover {
    /* color: #fff !important; */
    background: #21958f;
}
.navigation ul li:hover>ul {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
}
.selectnav {
    display: none
}
.outer-newsticker {
    float: left;
    width: 100%;
    overflow: hidden;
    height: 48px;
    background: #615659 !important;
    position: relative;
}
.announcement-ticker {
    float: left;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.announcement-ticker .cls-noresult-found.pagenone {
    margin: 0;
    width: 38%
}
.announcement-ticker .cls-noresult-found.pagenone i {
    float: left;
    font-size: 26px;
    margin: 12px 0 0 10px
}
.announcement-ticker .cls-noresult-found.pagenone h1 {
    color: #fff;
    font-size: 26px;
    margin: 6px 0 0 10px;
    float: left
}
.announcement-ticker h5 {
    float: left;
    line-height: 48px;
    background: #21958f;
    color: #fff;
    font-weight: 400;
    position: relative;
    padding-right: 20px;
    margin-bottom: 0;
}
.announcement-ticker h5:before {
    content: '';
    width: 70px;
    position: absolute;
    left: -70px;
    top: 0;
    height: 100%;
    background: #21958f;
}
.announcement-ticker h5:after {
    content: '';
    position: absolute;
    right: -6px;
    top: 50%;
    margin-top: -5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 0 6px 6px;
    border-color: transparent transparent transparent #21958f;
}
.cls-news-ticker li a {
    font-weight: 400;
    color: #fff;
    line-height: 46px
}
.ticker-wrapp {
    margin-left: 160px;
}
.ticker-wrapp .ticker-controls li {
    line-height: 12px;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    float: left;
    list-style: none;
    margin: 0 4px 0 0
}
.ticker-wrapp .ticker-controls li a {
    margin: 0 0 0 0;
    vertical-align: middle;
    letter-spacing: 0;
    height: 24px;
    display: table-cell;
    text-align: center;
    color: #fff;
    font-weight: 400
}
.ticker-wrapp .ticker-controls {
    float: left;
    bottom: auto;
    top: 13px;
    width: auto;
    left: auto;
    right: 20px;
    position: absolute
}
.ticker-wrapp .flexslider ul.flex-direction-nav li {
    margin: 0 2px
}
.ticker-controls li a {
    width: 22px;
    position: relative;
    left: 0;
    top: 0;
    margin: 0;
    height: 22px;
    border-radius: 2px;
    line-height: 22px;
    /* background: rgba(0, 0, 0, .1) */
}
.ticker-controls li a:hover {
    background: rgb(33, 149, 143);
}
.ticker-controls li.stop,
.ticker-controls li.resume,
.ticker-controls li.play {
    display: none!important
}
#banner figure,
#banner figure img {
    float: left;
    width: 100%
}
#banner .flexslider li figcaption {
    width: 100%;
    top: auto;
    bottom: 0;
    padding: 50px 0;
    opacity: 0;
    -webkit-transform: translateY(40%);
    -moz-transform: translateY(40%);
    -ms-transform: translateY(40%);
    -o-transform: translateY(40%);
    transform: translateY(40%);
    -webkit-transition: all .900s linear;
    -moz-transition: all .900s linear;
    -ms-transition: all .900s linear;
    -o-transition: all .900s linear;
    transition: all .900s linear;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .85) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, .85)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .85) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .85) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .85) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .85) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#d9000000', GradientType=0)
}
#banner .flexslider li.flex-active-slide figcaption {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
}
#banner .flexslider li figcaption h2 {
    font-weight: 400;
    font-size: 36px;
    margin-bottom: 5px
}
#banner .flexslider li figcaption p {
    color: #fff;
    font-size: 14px;
    margin-bottom: 0
}
#banner .flexslider .container {
    padding: 0 100px;
    position: relative;
    display: block
}
#banner .flexslider .container:before {
    content: '';
    display: block;
    float: left;
    position: absolute;
    left: 70px;
    top: 0;
    width: 1px;
    height: 100%;
    background: #494e50
}
#banner .flexslider .flex-control-nav {
    display: none
}
#banner .flexslider .flex-direction-nav {
    width: 40px;
    left: 6%;
    margin: 0 0 0 0;
    top: auto;
    bottom: 160px
}
#banner .flexslider .flex-direction-nav li:first-child {
    height: 70px;
    position: relative
}
#banner .flexslider .flex-direction-nav li:first-child:before {
    content: '\f040';
    font-family: FontAwesome;
    font-size: 14px;
    position: absolute;
    left: 7px;
    bottom: -3px;
    width: 26px;
    height: 26px;
    border-radius: 26px;
    color: #7b7e7e;
    line-height: 24px;
    text-align: center;
    border: 1px solid #7b7e7e
}
#banner .flexslider .flex-direction-nav li a {
    position: relative;
    float: left;
    width: 40px;
    height: 40px;
    top: 0;
    margin: 0
}
#banner .flexslider .flex-direction-nav li a em {
    color: #7b7e7e
}
#banner .flexslider .flex-direction-nav li a:hover em {
    color: #fff
}
#main {
    position: relative;
    z-index: 88;
}
.home .our_causes {
    padding-top: 38px;
    background: url(images/img-world-map.png) no-repeat center top
}
.services-container {
    float: left;
    background: url(img/xbg-parralax-activity.jpg) repeat left top;
    margin-bottom: 55px;
}
.services-container:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #212121;
    opacity: .95;
}
.services-container .container {
    position: relative;
    z-index: 999
}
.services-container header.cs-heading-title {
    float: left;
    width: 100%;
    margin-bottom: 40px;
    overflow: hidden;
    border-bottom: none;
    text-align: center
}
.services-container header.cs-heading-title h2 {
    color: #fff;
    display: inline-block;
    vertical-align: top;
    float: none;
    position: relative;
    font-size: 30px;
    font-weight: 400
}
.services-container header.cs-heading-title h2:before,
.services-container header.cs-heading-title h2:after {
    content: '';
    width: 9999px;
    height: 4px;
    border-top: 1px solid #393939;
    border-bottom: 1px solid #393939;
    position: absolute;
    top: 15px;
    left: 100%;
    margin-left: 20px
}
.services-container header.cs-heading-title h2:after {
    content: '';
    left: auto;
    right: 100%;
    margin-left: 0;
    margin-right: 20px
}
a.btnshowmore {
    display: block;
    font-size: 10px;
    line-height: 20px;
    padding: 0 15px;
    color: #999;
    font-family: verdana;
    border: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .1), 0 0 1px #fff inset;
    text-transform: uppercase;
    margin-top: 3px;
    background: #f8f8f8;
    background: -moz-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(248, 248, 248, 1)), color-stop(100%, rgba(232, 232, 232, 1)));
    background: -webkit-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -o-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -ms-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: linear-gradient(to bottom, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e8e8e8', GradientType=0);
    margin-bottom: 10px;
}
a.btnshowmore:hover,
a.btnshowmore:focus {
    background: #f8f8f8
}
.blog {
    float: left;
    width: 100%
}
.blog-grid {
    width: 103%;
    margin-bottom: 20px;
}
.blog.blog-grid .latest-news article {
    float: left;
    width: 30.33%;
    margin-left: 3%;
    margin-bottom: 3%;
    position: relative;
    overflow: hidden;
    padding: 0
}
.blog-grid article figure {
    width: 100%;
    float: left
}
.blog-grid article figure img {
    width: 100%;
    float: left;
    position: relative;
    z-index: 1;
    -webkit-transition: all .3s ease-in;
    -moz-transition: all .3s ease-in;
    -ms-transition: all .3s ease-in;
    -o-transition: all .3s ease-in;
    transition: all .3s ease-in
}
.blog-grid article:hover figure img {
    -webkit-transform: scale(1.4);
    -moz-transform: scale(1.4);
    -ms-transform: scale(1.4);
    -o-transform: scale(1.4);
    transform: scale(1.4);
    -webkit-transition: all 4s ease-in;
    -moz-transition: all 4s ease-in;
    -ms-transition: all 4s ease-in;
    -o-transition: all 4s ease-in;
    transition: all 4s ease-in
}
.blog-grid article figure:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    z-index: 10;
    bottom: 0;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, .31) 58%, rgba(0, 0, 0, .93) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(36%, rgba(0, 0, 0, 0)), color-stop(58%, rgba(0, 0, 0, .31)), color-stop(100%, rgba(0, 0, 0, .93)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, .31) 58%, rgba(0, 0, 0, .93) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, .31) 58%, rgba(0, 0, 0, .93) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, .31) 58%, rgba(0, 0, 0, .93) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 36%, rgba(0, 0, 0, .31) 58%, rgba(0, 0, 0, .93) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#ed000000', GradientType=0);
    -webkit-transition: all .325s linear;
    -moz-transition: all .325s linear;
    -ms-transition: all .325s linear;
    -o-transition: all .325s linear;
    transition: all .325s linear
}
.blog-grid article:hover figure:before {
    background: -moz-linear-gradient(top, rgba(0, 0, 0, .51) 0%, rgba(0, 0, 0, .93) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(0, 0, 0, .51)), color-stop(100%, rgba(0, 0, 0, .93)));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, .51) 0%, rgba(0, 0, 0, .93) 100%);
    background: -o-linear-gradient(top, rgba(0, 0, 0, .51) 0%, rgba(0, 0, 0, .93) 100%);
    background: -ms-linear-gradient(top, rgba(0, 0, 0, .51) 0%, rgba(0, 0, 0, .93) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, .51) 0%, rgba(0, 0, 0, .93) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#82000000', endColorstr='#ed000000', GradientType=0)
}
.blog-grid article .text {
    float: left;
    width: 100%;
    position: absolute;
    left: 0;
    z-index: 20;
    bottom: 0;
    padding: 20px 16px;
    padding-bottom: 6px
}
.blog-grid article .text .cs-post-title a {
    color: #fff
}
.blog-grid article .text p {
    display: none;
    color: #fff
}
h6.cat-department {
    overflow: hidden;
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    margin: 0 0 3px 0
}
.cat-department span {
    display: block;
    vertical-align: top;
    position: relative;
    float: left
}
.cat-department span:before {
    content: '';
    position: absolute;
    left: 100%;
    bottom: 5px;
    width: 9999px;
    display: block;
    vertical-align: top;
    height: 1px;
    margin-left: 5px;
    background: #6ab8f4
}
.our_staff {
    float: left;
    width: 100%;
    margin-bottom: 40px
}
.cycle-slideshow {
    float: left;
    width: 100%;
    height: 448px;
    overflow: hidden
}
.our_staff.our-carousel ul ul li {
    width: 100%
}
.our_staff.our-carousel {
    margin-left: 0;
    position: relative
}
.our_staff.our-carousel article {
    float: none;
    width: 220px;
    margin-right: 20px
}
.our_staff.our-carousel article p {
    white-space: normal
}
.our_staff article figure,
.our_staff article figure img {
    float: left;
    width: 100%;
    overflow: hidden
}
.our_staff article figure figcaption {
    float: left;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .40);
    opacity: 0;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all .150s linear .150s;
    -moz-transition: all .150s linear .150s;
    -ms-transition: all .150s linear .150s;
    -o-transition: all .150s linear .150s;
    transition: all .150s linear .150s
}
.our_staff article:hover figure figcaption {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transition: all .150s linear;
    -moz-transition: all .150s linear;
    -ms-transition: all .150s linear;
    -o-transition: all .150s linear;
    transition: all .150s linear
}
a.btnreadmore {
    display: inline-block;
    vertical-align: top;
    width: 54px;
    height: 54px;
    line-height: 54px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    border-radius: 54px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -27px;
    margin-top: -27px;
    opacity: 0;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all .150s linear;
    -moz-transition: all .150s linear;
    -ms-transition: all .150s linear;
    -o-transition: all .150s linear;
    transition: all .150s linear
}
.our_staff article:hover figure figcaption a.btnreadmore {
    opacity: .9;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%);
    -webkit-transition: all .150s linear .150s;
    -moz-transition: all .150s linear .150s;
    -ms-transition: all .150s linear .150s;
    -o-transition: all .150s linear .150s;
    transition: all .150s linear .150s
}
.our_staff article .text {
    padding-top: 15px;
    float: left;
    width: 100%;
    padding-bottom: 5px
}
.our_staff article {
    float: left;
    width: 100%;
    padding-bottom: 4px;
    border-bottom: 2px solid #c70808;
    -webkit-transition: all .25s linear;
    -moz-transition: all .25s linear;
    -ms-transition: all .25s linear;
    -o-transition: all .25s linear;
    transition: all .25s linear
}
.our_staff article .cs-post-title {
    margin-bottom: 5px
}
.our_staff article .text h6 {
    color: #666;
    letter-spacing: 1px;
    margin-bottom: 10px
}
.post-options li {
    float: left;
    line-height: 20px;
    font-size: 12px;
    color: #666
}
.post-options li a {
    color: #666
}
.post-options li em {
    margin-right: 6px
}
.our_staff .post-options li {
    width: 100%;
    margin: 0;
    line-height: 30px;
    border-top: 1px dashed #dfdfdf
}
.center {
    position: absolute;
    right: 0;
    top: -52px
}
.center a {
    position: relative;
    left: 0;
    margin: 5px 0 0 6px;
    float: left;
    width: 54px;
    height: 20px;
    font-size: 16px;
    line-height: 20px;
    padding: 0 10px;
    font-family: verdana;
    border: 1px solid #ddd;
    border-radius: 2px;
    box-shadow: 0 0 3px rgba(0, 0, 0, .1), 0 0 1px #fff inset;
    text-transform: uppercase;
    background: #f8f8f8;
    background: -moz-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(248, 248, 248, 1)), color-stop(100%, rgba(232, 232, 232, 1)));
    background: -webkit-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -o-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: -ms-linear-gradient(top, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    background: linear-gradient(to bottom, rgba(248, 248, 248, 1) 0%, rgba(232, 232, 232, 1) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#e8e8e8', GradientType=0);
    text-align: center
}
.center a i {
    color: rgba(0, 0, 0, .2);
    line-height: 20px
}
.center a:hover {
    background: #f8f8f8
}
.our_courses {
    /* float: left; */
    /* width: 100%; */
    /* margin-left: -2%; */
    /* margin-bottom: 30px; */
}
.our_courses li {
    list-style-type: none!important;
    display: inline;
    font-size: 0
}
.our_courses li article {
    display: inline-block;
    width: 100%;
    font-size: 11px;
    /* margin-left: 2%; */
    padding: 15px;
    /* margin-bottom: 2%; */
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.our_courses article h5 {
    margin: 0;
    font-weight: 400;
    line-height: 20px;
    float: left
}
.our_courses article h5 a {
    color: #fff
}
.course-program {
    display: block;
    float: right;
    font-size: 11px;
    line-height: 20px;
    letter-spacing: 1px;
    color: #fff;
    text-transform: uppercase
}
.blog-medium article {
    float: left;
    width: 100%;
    margin-bottom: 30px
}
.blog-medium article figure {
    float: left;
    width: 200px;
    overflow: hidden
}
.blog-medium article figure .flexslider figcaption {
    display: none
}
.col-md-12 .blog.blog-medium article figure,
.col-md-9 .blog.blog-medium article figure {
    height: 150px!important
}
.blog-medium article figure ~ .blog_text .text {
    margin-left: 230px
}
.blog-medium article .text p {
    margin-bottom: 0
}
.blog-medium article.no-image .text {
    margin-left: 0
}
.blog-medium article figure img {
    float: left;
    width: 100%
}
.blog-medium article .post-options {
    width: 100%;
    float: left;
    margin-bottom: 13px
}
.blog-medium article figcaption {
    float: left;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0, 0, 0, .4);
    -webkit-transition: all .150s linear 00.150s;
    -moz-transition: all .150s linear 00.150s;
    -ms-transition: all .150s linear 00.150s;
    -o-transition: all .150s linear 00.150s;
    transition: all .150s linear 00.150s;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%)
}
.blog-medium article:hover figcaption {
    opacity: 1;
    -webkit-transition: all .150s linear 0;
    -moz-transition: all .150s linear 0;
    -ms-transition: all .150s linear 0;
    -o-transition: all .150s linear 0;
    transition: all .150s linear 0;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%)
}
.blog-medium article:hover a.btnreadmore {
    opacity: 1;
    -webkit-transition: all .150s linear 00.150s;
    -moz-transition: all .150s linear 00.150s;
    -ms-transition: all .150s linear 00.150s;
    -o-transition: all .150s linear 00.150s;
    transition: all .150s linear 00.150s;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%)
}
.our-sponcers {
    float: left;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 35px
}
.our-sponcers .flexslider {
    float: left;
    width: 100%;
    text-align: center
}
.our-sponcers .flexslider ul.slides li {
    width: 154px;
    height: 110px;
    margin-right: 5px;
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.our-sponcers .flexslider ul.slides li a {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    width: 160px;
    height: 110px
}
.our-sponcers .flexslider ul.slides li a img {
    width: auto;
    float: none;
    display: inline-block;
    vertical-align: top
}
.our-sponcers .flex-control-nav,
.our-sponcers .flex-direction-nav {
    display: none
}
.our-sponcers header.cs-heading-title {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    overflow: hidden;
    border-bottom: none;
    text-align: center
}
.our-sponcers header.cs-heading-title h2 {
    display: inline-block;
    vertical-align: top;
    float: none;
    position: relative;
    font-size: 30px;
    font-weight: 400
}
.our-sponcers header.cs-heading-title h2:before,
.our-sponcers header.cs-heading-title h2:after {
    content: '';
    width: 9999px;
    height: 4px;
    border-top: 1px solid #e9e9e9;
    border-bottom: 1px solid #e9e9e9;
    position: absolute;
    top: 15px;
    left: 100%;
    margin-left: 20px
}
.our-sponcers header.cs-heading-title h2:after {
    content: '';
    left: auto;
    right: 100%;
    margin-left: 0;
    margin-right: 20px
}
#footer-widgets {
    /* background-size: cover; */
    /* border-top: 1px solid #e7e7e7; */
    margin-top: 50px;
    position: relative;
    z-index: 10;
    color: #fff;
    /* box-shadow: 0 20px 20px rgba(0, 0, 0, .05) inset; */
}
#footer-widgets .container {
    position: relative;
    z-index: 99
}
#footer-widgets:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: #F5F6F8;
    opacity: .95;
}
#footer-widgets .widget {
    float: left;
    width: 23.50%;
    margin-left: 2%
}
#footer-widgets .widget:first-child {
    margin-left: 0
}
#footer-widgets .cs-section-title {
    color: #ccc;
    font-weight: 400;
    font-size: 16px
}
#footer-widgets header.cs-heading-title {
    border-bottom: 1px solid #383838;
    margin-bottom: 25px
}
#footer-widgets .cs-section-title em {
    margin-right: 8px
}
#footer {
    float: left;
    width: 100%;
    text-align: center;
    /* padding-bottom: 40px; */
    margin-top: 25P;
    position: relative;
}
#footer .container {
    position: relative
}
a#btngotop {
    display: block;
    position: absolute;
    right: 0;
    bottom: 6px;
    color: #21958f;
    float: left;
    width: 30px;
    height: 30px;
    border-radius: 4px;
    text-align: center;
    line-height: 27px;
    border: 1px solid #21958f;
}

a#btngotop:hover{
    background: #21958f;
    color:white;
}
#footer p.copright {
    padding-left: 15px;
    padding-top: 14px;
    font-size: 11px;
    color: #61565a;
}
#footer p.copright a {
    color: #61565a;
}
#footer header {
    float: left;
    width: 100%;
    margin-bottom: 40px;
    overflow: hidden;
    border-bottom: none;
    text-align: center
}
#footer header a {
    color: #fff;
    display: inline-block;
    vertical-align: top;
    float: none;
    position: relative;
    font-size: 30px;
    font-weight: 400
}
#footer header a:before,
#footer header a:after {
    content: '';
    width: 9999px;
    height: 4px;
    border-top: 1px solid #393939;
    border-bottom: 1px solid #393939;
    position: absolute;
    top: 15px;
    left: 100%;
    margin-left: 20px
}
#footer header a:after {
    content: '';
    left: auto;
    right: 100%;
    margin-left: 0;
    margin-right: 20px
}
.breadcrumb {
    float: left;
    width: 100%;
    min-height: 100px;
    background: #333
}
.breadcrumb-inner {
    height: 105px;
    padding-top: 35px
}
.subtitle h1 {
    float: left;
    margin: 0 12px 0 0;
    position: relative;
    color: #fff;
    font-weight: 400
}
.subtitle p {
    color: #999;
    padding: 8px 0 0 0;
    margin: 0 0 0 0
}
.section-heading {
    font-size: 20px
}
.followus,
.followus a {
    float: left;
    width: 100%
}
#footer-widgets .followus a {
    color: #fff
}
.followus a {
    line-height: 25px;
    font-size: 13px;
    color: #666;
    margin-bottom: 4px
}
.followus a em,
.follow-tweet i {
    font-size: 18px;
    margin-right: 10px
}
.follow-tweet {
    color: #107f9b
}
.blog figure,
.event figure,
.courses figure {
    overflow: hidden
}
.blog.blog-large {
    float: left;
    width: 100%
}
.blog.blog-large article,
.postlist.blog article {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 40px;
    padding: 0 0 22px 0;
    border-bottom: 1px solid #e9e9e9
}
.blog.blog-large article figure,
.blog.blog-large article figure img {
    width: 100%
}
.blog.blog-large article figure {
    margin: 0 0 28px 0
}
.blog.blog-large article .text {
    padding: 0 0 0 75px
}
.blog.blog-large article .calendar-date {
    float: left;
    width: 53px;
    min-height: 65px;
    border-radius: 5px;
    border: 4px solid #d2d1d0;
    text-align: center;
    background: #f7f7f7;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2)
}
.blog.blog-large article .calendar-date span {
    padding: 4px 0;
    width: 100%;
    font-size: 12px;
    font-weight: 700;
    display: inline-block;
    text-transform: uppercase;
    border-bottom: 1px solid #d2d1d0;
    font-family: verdana
}
.blog.blog-large article .calendar-date time {
    font-size: 20px;
    color: #333;
    width: 100%;
    font-weight: 700;
    display: inline-block;
    font-family: verdana
}
.blog.blog-large article:hover .calendar-date {
    background: #565656
}
.blog.blog-large article:hover .calendar-date span,
.blog.blog-large article:hover .calendar-date time {
    color: #fff
}
.post-options {
    float: left;
    width: 100%;
    margin: 0 0 10px 0
}
.post-options li {
    float: left;
    color: #888;
    font-size: 11px;
    font-weight: 400;
    margin-left: 19px;
    letter-spacing: .02em;
    text-transform: capitalize
}
.post-options li:first-child {
    margin-left: 0
}
.post-options li a {
    color: #888
}
.post-options li i,
.post-options li em {
    color: #999;
    margin-right: 6px
}
.btnshare {
    position: absolute;
    left: 13px;
    bottom: 35px;
    width: 28px;
    height: 28px;
    color: #999;
    line-height: 27px;
    text-align: center;
    border-radius: 60%;
    border: 1px solid #d2d1d0;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2)
}
.btnshare:hover {
    color: #fff
}
.blog-grid_v1 .post-categories {
    float: left;
    margin: 0;
    position: absolute;
    left: 0;
    bottom: -7px
}
.blog-grid_v1 .post-categories li {
    float: left;
    margin: 0 10px 0 0
}
.blog-grid_v1 .post-categories li:before {
    background: none
}
.blog-grid_v1 .post-categories li a {
    color: #666;
    font-size: 12px;
    font-weight: 600;
    background: #fff;
    padding: 0 10px 0 0
}
.cs-readmore {
    text-transform: uppercase
}
.blog.blog-grid_v1 {
    float: left;
    width: 103%;
    margin: 0 0 40px -3%
}
.blog.blog-grid_v1 article {
    float: left;
    width: 30.2%;
    margin: 0 0 0 3%;
    padding: 0 0 20px 0;
    position: relative;
    border-bottom: 1px solid #c70808
}
.blog.blog-grid_v1 article figure,
.blog.blog-grid_v1 article figure img {
    width: 100%;
    overflow: hidden
}
.blog.blog-grid_v1 article .text {
    padding: 15px 0 0 0;
    float: left
}
.blog.blog-grid_v1 article .text time {
    color: #666;
    float: left;
    width: 100%;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 10px
}
.blog.blog-grid_v1 article .text time i {
    font-size: 12px;
    color: #999;
    margin: 0 10px 0 0
}
.blog.blog_detail,
.blog.blog_detail article .detail_figure,
.blog.blog_detail article .detail_text {
    float: left;
    width: 100%
}
.blog.blog_detail article {
    margin-bottom: 18px;
}
.blog.blog_detail article .detail_figure {
    margin-bottom: 20px
}
.blog.blog_detail article .detail_figure img {
    width: 100%
}
.blog.blog_detail .post-options {
    border-bottom: 1px solid #e9e9e9;
    padding: 0 0 12px 0
}
.post-tags {
    float: left;
    width: 100%;
    margin-bottom: 28px
}
.post-tags ul {
    margin-bottom: 0
}
.post-tags ul li {
    float: left;
    list-style-type: none!important
}
.post-tags ul li i {
    float: left;
    color: #999;
    margin-top: 4px;
    margin-right: 10px
}
.post-tags ul li a {
    color: #666;
    font-weight: 600;
    margin-right: 4px;
    text-transform: capitalize
}
.share-post {
    float: right;
    color: #888f95;
    margin-top: -6px;
    padding: 5px 20px;
    border-radius: 1px;
    background: #faf8f8;
    font-weight: 800;
    border: 1px solid #ddd;
    text-transform: uppercase;
    box-shadow: 0 0 2px rgba(0, 0, 0, .1);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.share-post i {
    margin-right: 10px;
    color: #888f95
}
.about-author {
    float: left;
    width: 100%;
    padding: 40px;
    margin-bottom: 28px;
    box-shadow: 0 0 4px rgba(0, 0, 0, .2);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.about-author figure {
    float: left;
    width: 54px;
    height: 54px
}
.about-author figure img {
    width: 100%
}
.about-author .text {
    margin-left: 86px
}
.about-author .text h2 {
    font-size: 16px;
    color: #000;
    font-weight: 400;
    text-transform: capitalize
}
#comments {
    margin-bottom: 40px
}
#comments ul {
    margin-left: 0
}
#comments ul li {
    width: 100%;
    float: left;
    list-style: none
}
#comments .heading {
    margin-bottom: 35px
}
#comments .thumblist {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-bottom: 25px
}
#comments .thumblist figure {
    float: left;
    opacity: 1
}
#comments .thumblist figure img {
    float: left;
    width: 100%
}
#comments .text {
    margin-left: 80px;
    position: relative;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
#comments .text header {
    float: left;
    width: 100%;
    margin-bottom: 5px
}
#comments .text header h5 {
    float: left;
    color: #000;
    font-size: 16px;
    font-weight: 400;
    margin: 0 10px 0 0
}
#comments .text header time {
    float: left;
    color: #666;
    font-size: 12px;
    font-weight: 600;
    font-size: 11px;
    line-height: 2.5;
    letter-spacing: 1px;
    text-transform: capitalize;
    padding-right: 10px
}
#comments .text p {
    margin-bottom: 10px
}
#comments .text a.reply {
    font-size: 11px;
    color: #999;
    font-weight: 600;
    line-height: 2.5;
    text-transform: uppercase
}
.children {
    float: left;
    width: 100%;
    position: relative;
    padding-left: 48px
}
.children figure {
    position: relative;
    width: 50px;
    z-index: 99;
    box-shadow: 0 15px 0 #fff;
    margin-top: 4px
}
.children:after {
    content: "";
    position: absolute;
    left: 48px;
    top: -68px;
    width: 1px;
    height: 50px;
    border-left: 2px solid #d3d3d3
}
#comments ul li.level-2,
#comments ul li.level-3 {
    padding-left: 50px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
#respond {
    margin-bottom: 25px;
    font-family: verdana
}
#respond form p {
    float: left;
    margin-bottom: 25px;
    position: relative;
    width: 100%
}
#respond form p label {
    width: 100%;
    color: #6e6a68;
    font-size: 14px;
    font-weight: 400;
    text-transform: capitalize;
    margin-bottom: 10px;
    line-height: 22px
}
#respond form p label span {
    color: #b8b8b8;
    font-size: 12px;
    font-weight: 300;
    display: inline-block;
    vertical-align: top;
    margin-left: 6px
}
#respond .icon-input {
    display: block;
    float: left;
    width: 100%;
    position: relative
}
#respond .icon-input i {
    position: absolute;
    top: 7px;
    left: 0;
    display: block;
    float: left;
    width: 40px;
    line-height: 28px;
    text-align: center;
    height: 28px;
    border-right: 1px solid #ededed;
    z-index: 9999;
    color: silver
}
#respond form p input[type="text"],
#respond form textarea {
    height: 40px;
    width: 100%;
    border: 1px solid #d2d2d2;
    padding-left: 45px;
    color: silver;
    position: relative;
    text-transform: lowercase!important
}
.wpcf7 form p input[type="text"],
.wpcf7 form p input[type="tel"],
.wpcf7 form p textarea,
.wpcf7 form p input[type="email"] {
    height: 40px;
    /* width: 100%; */
    border: 1px solid #d2d2d2;
    padding-left: 15px;
    color: silver;
    position: relative;
    display: inline-block;
    border-radius: 3px;
    color: black;
    margin-bottom: 10px;
}
.wpcf7 form p span {
    margin: 5px 0;
    /* float: left; */
    /* width: 100% */
}
.label_input{
    /* border:1px solid red; */
    display:inline-block;
    width: 150px !important;
    float: none !important;
}
#respond form textarea {
    height: 124px;
    padding: 15px
}
#respond form p input,
#respond form p textarea,
.wpcf7 form p input,
.wpcf7 form p textarea {
    color: silver;
    resize: none;
    font-weight: 400;
    font-size: 12px;
    position: relative
}
#respond form p input[type="text"] {
    position: relative
}
#respond form p input:focus,
#respond form p textarea:focus,
.wpcf7 form p input:focus,
.wpcf7 form p textarea:focus {
    border: 1px solid #29688a;
    transition: all .5s ease-in-out 0s
}
#respond .comment-form-author,
#respond .comment-form-numbr {
    float: left;
    width: 49.2%!important
}
#respond .comment-form-email,
#respond .comment-form-subject {
    float: right;
    width: 49.2%!important
}
#respond form p input[type="submit"],
.wpcf7 form p input[type="submit"],
#respond form p button {
    float: left;
    border: none;
    color: #fff;
    padding: 7px 20px;
    font-size: 14px;
    margin: 0 13px 0 0;
    text-transform: capitalize
}
#respond form p .comment-note {
    font-size: 11px;
    color: #999;
    margin-top: 11px;
    word-spacing: 2px;
    font-style: italic;
    text-transform: capitalize;
    display: inline-block;
    font-family: 'Open Sans', sans-serif
}
div.wpcf7-validation-errors {
    float: left;
    border-color: red
}
div.wpcf7-response-output {
    margin: 0 .5em 1em 0;
    padding: .2em 1em
}
#respond form input.valid,
#respond form input.valid:focus,
#respond form textarea.valid,
#respond form textarea.valid:focus {
    background: #def3bd;
    border: 1px solid #4a8a10!important;
    color: #4a8a10
}
#respond form input.frm_error,
#respond form input.frm_error:focus,
#respond form textarea.frm_error,
#respond form textarea.frm_error:focus {
    background: #f9f9f9;
    border: 1px solid #000!important
}
.pagination {
    float: left;
    width: 100%;
    text-align: center;
    display: inline-block
}
.pagination ul {
    display: inline-block
}
.pagination ul li {
    display: inline
}
.pagination ul li a {
    position: relative;
    float: left;
    color: #666;
    font-size: 12px;
    padding: 8px 16px;
    margin-left: -1px;
    border: 1px solid #ddd;
    text-transform: uppercase;
    font-family: 'Open Sans', sans-serif
}
.pagination ul li a:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    top: -3px;
    left: 0;
    display: none
}
.pagination ul li a:hover:before,
.pagination ul li a.active:before {
    display: block
}
.pagination ul li.next a,
.pagination ul li.prev a {
    line-height: 23px
}
.map-section {
    float: left;
    width: 100%
}
.map-section iframe {
    width: 100%;
    height: 361px
}
.text-area {
    text-align: center;
    width: 100%;
    margin-bottom: 40px;
    border-bottom: 1px solid #f1f1f1
}
.text-area p {
    font-size: 14px;
    font-weight: 600;
    padding-bottom: 10px
}
.course-detail,
.course-detail article,
.course-detail article figure,
.course-detail article figure img {
    float: left;
    width: 100%
}
.course-detail article figure {
    margin-bottom: 20px
}
.course-detail .detail_text {
    float: left
}
.course-detail article .post-options {
    padding: 0 0 15px 0;
    margin-bottom: 20px;
    list-style-type: none;
    border-bottom: 1px solid #e9e9e9
}
.addmition-info {
    margin: 8px 0 0 14px;
    width: 228px;
    float: right;
    font-size: 12px;
    color: #333;
    margin-bottom: 30px;
    line-height: 1.6;
    box-shadow: 0 0 4px rgba(0, 0, 0, .2);
    font-family: verdana
}
.addmition-info .header {
    float: left;
    width: 100%;
    padding: 8px 20px;
    background: #333;
    color: #fff;
    font-size: 16px;
    margin-bottom: 15px;
    font-weight: 400;
    text-transform: capitalize
}
.addmition-info .text {
    padding: 20px;
    line-height: 1.8
}
.addmition-info .text h6 {
    position: relative;
    float: left;
    width: 100%;
    font-weight: 400;
    margin-top: 0;
    padding-bottom: 10px
}
.addmition-info .text h6:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 70px;
    height: 1px;
    border-bottom: 1px solid #ccc
}
.event.eventdetail {
    width: 100%;
    float: left;
    margin: 0
}
.detail_inner {
    width: 100%;
    float: left;
    border: 1px solid #e0e0e0;
    box-shadow: 0 0 2px rgba(0, 0, 0, .2);
    margin-bottom: 30px;
    padding: 0 20px;
    background-color: #f5f5f5;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.event.eventdetail article {
    width: 100%;
    float: left
}
.detail_inner .text .post-options li {
    margin-left: 0;
    margin-bottom: 10px
}
.post-options li {
    list-style-type: none!important
}
.detail_inner figure {
    width: 228px;
    height: 170px;
    background-color: #282828;
    border: 2px solid #fff;
    margin: -30px 0 0 0;
    box-shadow: 0 0 5px #ccc
}
.event.event-detail .text {
    margin: 0 0 0 250px;
    position: relative;
    overflow: auto
}
.detail_inner .text .post-options {
    padding-right: 140px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.detail_inner .text .btn {
    position: absolute;
    right: 0;
    bottom: 25px
}
.post-options ul li span.hd {
    color: #999;
    margin-left: 1px
}
.detail_inner .text .text_info {
    width: 100%;
    float: left;
    border-bottom: 1px dotted #d8d8d8;
    padding: 10px 0 12px;
    margin: 0 0 15px 0
}
.detail_inner .text .text_info time {
    font-size: 11px;
    color: #666;
    font-weight: 600;
    display: inline-block;
    margin: 0 0 0 10px
}
.detail_inner .text .text_info a {
    float: left
}
.detail_inner .text .post-categories {
    padding: 20px 0 15px 0;
    margin-bottom: 20px;
    border-bottom: 1px dotted #d8d8d8
}
.detail_inner .text .post-categories li:before {
    display: none
}
.detail_inner .text .post-categories li {
    color: #666
}
.detail_inner .text .post-categories li a {
    background-color: #999;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    padding: 1px 5px;
    margin: 0 10px 0 0;
    text-transform: uppercase
}
.detail_inner .text .post-categories li time {
    line-height: 20px
}
.detail-buttons {
    width: 100%;
    float: left;
    margin: 0 0 30px 0
}
.detail-buttons ul {
    width: 100%;
    float: left;
    margin: 0
}
.detail-buttons ul li {
    float: left;
    margin: 0 0 0 18px
}
.detail-buttons ul li:first-child {
    margin-left: 0
}
.detail-buttons ul li a {
    display: block;
    text-transform: uppercase;
    padding: 8px 18px;
    color: #fff;
    font-size: 14px;
    font-family: verdana;
    font-weight: 400
}
.btn.cs-btncancel {
    background: #f2a8a8
}
.btn.cs-btnbook {
    background: #f2a8a8
}
.btn.cs-btnfree {
    background: #409f74
}
@charset "utf-8";
.event {
    width: 100%;
    float: left
}
.event.eventlisting {
    width: 100%;
    float: left;
    margin: 0 0 10px 0
}
.event.eventlisting article {
    width: 100%;
    float: left;
    border-bottom: 1px solid #e9e9e9;
    margin-bottom: 25px;
    padding-bottom: 25px
}
.event.eventlisting article:last-of-type {
    padding-bottom: 0;
    border-bottom: none
}
.event.eventlisting article figure {
    float: left;
    width: 230px;
    font-size: 0
}
.event.eventlisting article .text {
    float: none;
    overflow: auto;
    position: relative
}
.event.eventlisting article figure ~ .text {
    margin: 0 0 0 250px
}
.event.eventlisting article .text .btn {
    position: absolute;
    right: 0;
    bottom: 15px
}
.event-texttop .post-categories li {
    color: #666;
    font-size: 11px
}
.event-texttop .post-categories li time {
    line-height: 22px;
    font-weight: 400;
    text-transform: none
}
.event-texttop .post-categories li:before {
    display: none
}
.event-texttop {
    float: left;
    margin-bottom: 40px;
    position: relative;
    padding-left: 12px;
    border-left: 3px solid #d5d5d5;
    width: 100%
}
.event-texttop:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%;
    height: 1px;
    border-bottom: 1px dotted #ccc
}
.event-texttop .post-categories {
    margin-bottom: 0
}
.event.eventlisting article .text .post-options {
    padding-right: 140px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.event.eventlisting article .text .post-options li {
    margin-left: 0;
    margin-bottom: 10px
}
.event-texttop p {
    margin: 0
}
.event-texttop ul {
    float: left
}
.event-texttop ul li {
    float: left;
    margin-right: 10px;
    line-height: 18px;
    text-transform: uppercase
}
.event.eventlisting article .text .event-texttop ul li a {
    background-color: #999;
    display: inline-block;
    margin: 2px;
    padding: 0 5px;
    color: #fff;
    text-transform: uppercase;
    font-size: 11px
}
.event.eventlisting article .text .event-texttop ul li span {
    font-size: 11px;
    color: #666
}
.event.eventlisting article .text .post-options {
    float: left
}
.event.eventlisting article .text .post-options ul li i {
    margin-right: 8px;
    margin-left: 1px;
    color: #999;
    width: 10px
}
.event.eventlisting article .text .post-options ul li {
    font-weight: 400;
    color: #999;
    font-size: 11px;
    padding-right: 10px;
    width: 100%
}
.event.eventlisting article .text .post-options ul li span,
.event.eventlisting article .text .post-options ul li time {
    color: #666
}
.event.event-gridview {
    width: 102%;
    margin-bottom: 40px;
    margin-left: -2%
}
.event.event-gridview article {
    width: 31%;
    display: inline-block;
    vertical-align: top;
    margin: 0 0 2% 2%;
    border-bottom: none;
    padding-bottom: 0
}
.event-gridview article figure .btn {
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 9999
}
.event.event-gridview article figure {
    margin-bottom: 20px;
    width: 100%;
    position: relative;
    overflow: hidden
}
.event.event-gridview article figure:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0, 0, 0, .6)
}
.event.event-gridview article figure figcaption {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    opacity: 0;
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease
}
.event.event-gridview article figure figcaption .cs-buynow {
    padding: 0;
    position: absolute;
    top: 50%;
    line-height: 38px;
    width: 130px;
    text-align: center;
    left: 50%;
    margin: -16px 0 0 -65px
}
.event.event-gridview article:hover figure:before,
.event.event-gridview article:hover figure figcaption {
    opacity: 1
}
.event.event-gridview article .text {
    padding-left: 0;
    float: left;
    width: 100%
}
.event.event-gridview article figure .post-categories {
    position: absolute;
    left: 10px;
    bottom: 8px;
    z-index: 99999;
    width: 95%;
    margin: 0
}
.event.event-gridview article figure .post-categories li a {
    padding: 4px 6px;
    font-size: 11px;
    text-transform: uppercase;
    color: #fff;
    margin: 0 2px 2px 0;
    background: rgba(153, 153, 153, .5);
    float: left
}
.event.event-gridview article figure .post-categories li:before {
    display: none
}
.event.event-gridview article .text .event-texttop {
    border-bottom: none;
    padding: 0 0 0 12px;
    margin: 0 0 15px 0;
    position: relative
}
.event.event-gridview article .text .event-texttop:before {
    height: 70px;
    top: 0;
    display: none
}
.event.event-gridview article .text .post-options ul li {
    border-top: 1px dashed #d8d8d8;
    width: 100%;
    padding: 7px 0;
    margin: 0
}
#filter-list {
    float: right
}
#filter-list ul li {
    float: left
}
#filter-list ul li a {
    background: rgba(153, 153, 153, .5);
    color: #fff;
    float: left;
    font-size: 11px;
    margin: 0 2px 2px 0;
    padding: 4px 6px;
    text-transform: uppercase
}
.courses.courses-gridview {
    width: 102%;
    float: left;
    margin-bottom: 10px;
    margin-left: -2%
}
.courses.courses-gridview article {
    margin-left: 2%;
    margin-bottom: 2%;
    width: 31%;
    float: none;
    display: inline-block;
    vertical-align: top
}
.courses.courses-gridview article .text .post-categories li {
    font-weight: 600;
    color: #666
}
.courses.courses-gridview article .text .post-options ul li {
    margin: 0
}
.courses {
    width: 100%;
    float: left;
    margin-bottom: 10px
}
.courselisting.courses article {
    position: relative;
    float: left;
    margin-bottom: 30px
}
.courselisting.courses article figure figcaption,
.eventlisting.event article figure figcaption {
    background: rgba(0, 0, 0, .4);
    float: left;
    height: 100%;
    opacity: 0;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transition: all .15s linear .15s;
    -moz-transition: all .15s linear .15s;
    -o-transition: all .15s linear .15s;
    -ms-transition: all .15s linear .15s;
    transition: all .15s linear .15s;
    width: 100%
}
.courselisting.courses article:hover figure figcaption,
.eventlisting.event article:hover figure figcaption {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: all .15s linear;
    -moz-transition: all .15s linear;
    -o-transition: all .15s linear;
    -ms-transition: all .15s linear;
    transition: all .15s linear
}
.courselisting.courses article:hover figure figcaption .btnreadmore,
.eventlisting.event article:hover figure figcaption .btnreadmore {
    opacity: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: all .15s linear .15s;
    -moz-transition: all .15s linear .15s;
    -o-transition: all .15s linear .15s;
    -ms-transition: all .15s linear .15s;
    transition: all .15s linear .15s
}
.courselisting.courses article .text .post-options {
    padding: 15px 94px 0 0;
    border-top: 1px dashed #ccc
}
.courselisting.courses article .post-categories {
    color: #666;
    margin-bottom: 10px
}
.courselisting.courses article .post-categories li:before {
    display: none
}
.courselisting.courses article .text .post-options ul li {
    float: left;
    margin: 0 15px 6px 0
}
.courselisting.courses article .text .event-texttop .cs-post-title {
    margin: 0 0 25px
}
.courselisting.courses article .text .btn {
    position: absolute;
    right: 0;
    bottom: 10px
}
.courselisting.courses article .text .btn-apply {
    margin-top: -40px
}
.courselisting.courses article .text {
    float: none;
    padding: 0
}
.courselisting.courses article figure {
    float: left;
    width: 230px;
    height: 172px;
    background: #666
}
.courselisting.courses article figure ~ .text {
    margin: 0 0 0 250px
}
.courses.courses-gridview article .text .event-texttop {
    border: none;
    border-bottom: 1px dashed #bfbfbf;
    margin: 0 0 14px 0;
    padding: 18px 0 10px 0
}
.courses.courses-gridview article .text .event-texttop:before {
    display: none
}
.courses.courses-gridview article .text .post-options ul li {
    border: none;
    margin-bottom: 12px;
    margin-right: 6px
}
.courses.courses-gridview article figure {
    text-align: center;
    position: relative;
    float: left;
    width: 100%;
    height: 168px;
    background: #666
}
.courses.courses-gridview article figure figcaption {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out
}
.courses.courses-gridview article figure figcaption:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0
}
.courses.courses-gridview article:hover figure figcaption:before {
    opacity: .5
}
.courses.courses-gridview article figure figcaption a {
    float: none;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -10px 0 0 -32px
}
.courses.courses-gridview article:hover figure figcaption {
    opacity: 1
}
.courselisting.courses header {
    width: 100%;
    float: left;
    border-bottom: 1px solid #e9e9e9;
    padding-bottom: 20px;
    margin-bottom: 30px
}
.courselisting.courses header .cs-section-title {
    float: left;
    margin: 0
}
.sortby {
    float: right;
    margin: 0;
    border: 1px solid #ccc;
    margin-bottom: 18px
}
.sortby li {
    float: left;
    border-right: 1px solid #ccc
}
.sortby li.bgcolr a {
    color: #fff
}
.sortby li a {
    display: block;
    padding: 5px 12px 5px 12px;
    font-size: 11px;
    color: #666;
    text-transform: uppercase
}
.sortby li:last-child {
    border-right: none
}
.sortby li a:hover {
    color: #fff
}
.password_protected {
    float: left;
    width: 100%;
    text-align: center;
    margin: 50px 0 90px 0
}
.protected-icon {
    display: inline-block;
    width: 150px;
    height: 150px;
    position: relative;
    border-radius: 100%;
    margin-bottom: 30px
}
.protected-icon a {
    position: absolute;
    top: 50%;
    left: 50%;
    color: #fff;
    font-size: 20px;
    margin: -36px 0 0 -26px
}
.password_protected h3 {
    color: #999;
    font-size: 22px;
    font-weight: 300;
    padding: 0 0 30px 0;
    position: relative;
    margin: 0 0 0 0
}
.password_protected form {
    position: relative;
    display: inline-block;
    width: 440px
}
.password_protected form input[type="password"],
.password_protected form input[type="text"] {
    background-color: #fff;
    border: 1px solid #d2d2d2;
    border-radius: 4px;
    box-shadow: 0 0 3px 2px #eaeaea;
    color: silver;
    display: inline-block;
    height: 50px;
    padding: 0 0 0 60px;
    width: 100%
}
.password_protected form label {
    float: left;
    width: 100%;
    margin-bottom: 0
}
.password_protected form label:before {
    content: "\f13e";
    color: #bcbcbc;
    width: 50px;
    height: 48px;
    background-color: #f4f4f4;
    position: absolute;
    top: -1px;
    left: 1px;
    border-radius: 4px 0 0 4px;
    -moz-border-radius: 4px 0 0 4px;
    -webkit-border-radius: 4px 0 0 4px;
    padding: 11px 0 0 0;
    font-size: 18px;
    font-family: fontAwesome;
    margin-top: 2px;
    border-right: 1px solid #d2d2d2
}
.password_protected form input[type="submit"] {
    padding: 12px 26px;
    position: absolute;
    right: 5px;
    top: 4px;
    color: #fff;
    border: none;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    text-transform: uppercase
}
.pagenone {
    text-align: center;
    margin: 50px 0 90px 0;
    float: left;
    width: 100%
}
.pagenone .password_protected {
    margin: 0 0 0 0
}
.pagenone .password_protected form label:before {
    content: "\f002";
    background-color: transparent;
    border: none
}
.pagenone .password_protected form input[type="text"] {
    padding: 0 0 0 12px
}
.pagenone i {
    margin: 0 0 12px 0;
    display: inline-block;
    font-size: 60px
}
.pagenone h1 {
    font-size: 40px;
    font-weight: 200;
    margin: 0 0 6px 0;
    display: block
}
.pagenone h4 {
    color: #3333331;
    font-size: 20px;
    font-weight: 300;
    padding: 0 0 0 0;
    position: relative;
    margin: 0 0 30px 0
}
.gallerysec {
    width: 101%;
    float: left;
    margin-bottom: 35px
}
.gallerysec ul {
    list-style: none;
    float: left;
    margin: 0 0 0 -5px;
    width: 100%
}
.gallerysec ul li {
    float: left;
    margin: 0 0 3px 3px;
    width: 24.6%
}
.gallerysec ul li figure {
    width: 100%;
    float: left;
    position: relative;
    cursor: pointer
}
.gallerysec ul li figure img {
    float: left;
    width: 100%
}
.gallerysec ul li figure figcaption {
    float: left;
    width: 100%;
    position: absolute;
    background: rgba(0, 0, 0, .5);
    height: 100%;
    opacity: 0;
    transition: all .2s ease-out 0s;
    -moz-transition: all .2s ease-out 0s;
    -o-transition: all .2s ease-out 0s;
    -webkit-transition: all .2s ease-out 0s
}
.gallerysec ul li figure:hover figcaption {
    opacity: 1
}
.gallerysec ul li figure figcaption i {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    cursor: pointer;
    opacity: 0;
    transform: scale(-2);
    -ms-transform: scale(-2);
    -moz-transform: scale(-2);
    -webkit-transform: scale(-2);
    -o-transform: scale(-2);
    transition: all 1.1s ease-in-out -.8s;
    -moz-transition: all 1.1s ease-in-out -.8s;
    -o-transition: all 1.1s ease-in-out -.8s;
    -webkit-transition: all 1.1s ease-in-out -.8s;
    color: #fff;
    font-size: 20px;
    padding: 11px 0 0 0;
    margin: -20px 0 0 -25px;
    text-align: center;
    border-radius: 3px
}
.gallerysec ul li:hover figure figcaption i {
    opacity: 1;
    transform: scale(1, 1);
    -ms-transform: scale(1, 1);
    -moz-transform: scale(1, 1);
    -webkit-transform: scale(1, 1);
    -o-transform: scale(1, 1)
}
.gallerysec a i,
.loadmore i {
    margin-right: 5px
}
.gallerysec .gallery-three-col li {
    float: left;
    margin: 0 0 3px 3px;
    width: 33%
}
.gallerysec ul li.video-gallery-img figure figcaption i,
.gallerysec ul li.video-gallery-img figure figcaption {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
}
.gallerysec .gallery-three-col li figure figcaption i,
.gallerysec .gallery-two-col li figure figcaption i {
    float: left;
    height: 50px;
    left: 50%;
    margin: -15px 0 0 -25px;
    position: absolute;
    top: 50%;
    width: 50px
}
.gallerysec .gallery-three-col li figure figcaption i {
    padding-top: 16px
}
.gallerysec .gallery-two-col li {
    float: left;
    margin: 0 0 3px 3px;
    width: 49.5%
}
.gallerysec .gallery-two-col li figcaption i {
    padding-top: 15px
}
#undercontruction {
    float: left;
    width: 100%;
    margin: 0 0 0 0
}
.undercunst-box {
    text-align: center
}
#midarea {
    float: left;
    width: 100%;
    position: relative;
    text-align: center;
    color: #fff
}
#undercontruction #midarea h1 {
    font-weight: bold!important;
    font-size: 34px!important;
    margin-bottom: 10px!important
}
.undercunst-box {
    padding: 40px 0;
    padding-bottom: 0
}
.undercunst-box footer {
    display: inline-block;
    padding: 30px 0;
    text-align: center
}
#midarea p {
    color: #9d9d9d;
    margin-bottom: 40px
}
#midarea h4 {
    margin-bottom: 27px
}
#undercontruction .countdownit {
    width: 100%;
    float: left;
    text-align: center
}
#undercontruction .countdownit .hasCountdown {
    width: auto;
    background-color: transparent;
    box-shadow: none
}
#undercontruction .countdown_section:after {
    display: none
}
#undercontruction .countdownit #defaultCountdown {
    display: inline-block
}
#undercontruction .countdownit span {
    display: inline-block
}
#undercontruction .countdownit span.countdown_section {
    width: 128px;
    box-shadow: 0 0 1px #818181;
    height: 114px;
    border: 3px solid #fff;
    margin-bottom: 8px;
    text-transform: uppercase;
    margin-right: 25px;
    font-size: 18px;
    font-weight: bolder;
    position: relative;
    color: #fff
}
#undercontruction .countdownit span.countdown_section:last-child {
    margin-right: 0
}
#undercontruction .countdownit span.countdown_section:first-child:before {
    content: '';
    display: none
}
#undercontruction .countdownit span.countdown_section:before {
    content: ':';
    color: #d5d5d5;
    font-size: 50px;
    position: absolute;
    left: -22px;
    top: 20px;
    text-shadow: none
}
#undercontruction .countdownit span.countdown_section .countdown_amount {
    background: none;
    border: none;
    box-shadow: none;
    font-size: 68px;
    letter-spacing: -5px;
    font-weight: 800;
    padding-top: 7px;
    height: auto;
    line-height: 68px;
    color: #fff
}
ul li {
    list-style: disc outside none;
    line-height: 23px;
}
ul ul {
    margin-right: 20px;
}
ol ol {
    margin-left: 20px
}
table {
    max-width: 100%;
    background-color: transparent
}
th {
    text-align: left
}
table {
    width: 100%;
    margin-bottom: 20px
}
table>thead>tr>th,
table>tbody>tr>th,
table>thead>tr>td,
table>tbody>tr>td {
    padding: 8px;
    line-height: 1.428571429;
    vertical-align: top;
    border-top: 1px solid #ddd;
    border: 1px solid #ddd
}
table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd
}
table>caption+thead>tr:first-child>th,
table>colgroup+thead>tr:first-child>th,
table>thead:first-child>tr:first-child>th,
table>caption+thead>tr:first-child>td,
table>colgroup+thead>tr:first-child>td,
table>thead:first-child>tr:first-child>td {
    border-bottom: 0
}
table>tbody+tbody {
    border-top: 2px solid #ddd
}
p ins {
    color: #999
}
dl dd {
    margin-left: 20px
}
address {
    font-style: italic
}
header ul li,
.event ul li,
.blog ul li,
.widget ul li,
.flexslider ul li,
.gallery ul li,
.woocommerce ul li,
.address-info ul li,
.list_styles ul li,
.courses ul li {
    list-style: none
}
.address-info {
    float: left;
    width: 100%
}
.address-info li {
    float: left;
    width: 100%;
    padding: 10px 0;
    font-size: 14px;
    border-bottom: 1px dotted #bfbfbf
}
.address-info li:last-child {
    border-bottom: none
}
.address-info li i {
    float: left;
    vertical-align: top;
    width: 25px;
    height: 25px;
    border-radius: 60%;
    text-align: center;
    line-height: 25px;
    font-size: 10px;
    color: #fff;
    background: #333
}
.address-info li p {
    float: none;
    margin: 0 0 0 35px
}
.succ_mess {
    background-color: #def3bd;
    border: 1px solid #4a8a10;
    border-radius: 4px;
    color: #4a8a10;
    float: left;
    font-size: 12px;
    padding: 15px 25px 15px 40px;
    width: 100%;
    position: relative
}
.cs-map-1,
.succ_mess {
    margin-bottom: 30px
}
.succ_mess:before {
    content: "\f00c";
    color: #4a8a10;
    left: 20px;
    position: absolute;
    top: 20px;
    font-family: fontAwesome
}
.succ_mess p {
    margin: 0
}
.outer-newsticker .container {
    width: 1050px
}
ul.post-categories {
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    margin: 0 0 3px;
    overflow: hidden;
    width: 100%
}
.post-categories li:before {
    background: none repeat scroll 0 0 #6ab8f4;
    bottom: 8px;
    content: "";
    display: block;
    height: 1px;
    left: 100%;
    margin-left: 5px;
    position: absolute;
    vertical-align: top;
    width: 9999px
}
ul.post-categories li {
    display: block;
    float: left;
    position: relative;
    vertical-align: top;
    margin-right: 3px
}
ul.post-categories li a,
ul.post-categories li {
    color: #888;
    font-weight: 600
}
.our_staff div.post-options ul {
    margin-left: 0
}
.latest-news ul.post-categories li a,
.latest-news ul.post-categories li {
    color: #fff;
    text-transform: uppercase
}
.blog .mejs-audio .mejs-volume-button,
.blog .mejs-audio .mejs-time-rail,
.blog .mejs-audio .mejs-mute,
.blog .mejs-audio .mejs-time {
    display: none!important
}
.blog .mejs-audio {
    width: 60px!important
}
.blog .mejs-audio.mejs-container .mejs-controls div,
.blog .mejs-audio.mejs-container .mejs-controls {
    height: 60px
}
.blog .mejs-audio.mejs-container .mejs-controls {
    top: 0;
    bottom: auto;
    background: transparent;
    border-radius: 100%
}
.blog .mejs-audio.mejs-container .mejs-controls,
.blog .mejs-audio.mejs-container {
    background-color: transparent
}
.blog .mejs-audio .mejs-controls .mejs-button button {
    left: 17px;
    top: 10px;
    outline: none!important;
    background: url(images/xsprites.png.pagespeed.ic.Ya7OEpM8FX.webp);
    background-position: -9px -6px;
    width: 24px;
    height: 25px
}
.blog .mejs-audio .mejs-controls .mejs-pause button {
    background-position: -34px -5px;
    left: 15px
}
.blog article.cls-post-audio figure,
.blog article.cls-post-video figure {
    height: 294px;
    width: 100%;
    background-color: #7f7f7f
}
.col-md-12 .blog article.cls-post-audio figure,
.col-md-12 .blog article.cls-post-video figure {
    height: 396px
}
.blog-medium article.cls-post-audio figure,
.blog-medium article.cls-post-video figure {
    height: 149px;
    width: 200px
}
.blog-medium article.cls-post-audio figcaption,
.blog-medium article.cls-post-video figcaption {
    opacity: 1;
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -ms-transform: translateX(0%);
    -o-transform: translateX(0%);
    transform: translateX(0%)
}
.blog.blog-medium article figure figcaption .audiowrapp {
    margin: -25px 0 0 -25px
}
.blog article.cls-post-audio figure figcaption,
.blog article.cls-post-video figure figcaption {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5)
}
.blog article figure figcaption .audiowrapp {
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -20px 0 0 -20px
}
.blog article.cls-post-video figure figcaption a {
    width: 60px;
    height: 60px;
    border-radius: 100%;
    color: #fff;
    text-align: center;
    position: absolute;
    left: 50%;
    top: 50%;
    margin: -20px 0 0 -20px;
    padding-top: 18px
}
#footer-widgets .pagenone h1 {
    color: #fff
}
#footer .language-sec {
    display: inline-block;
    margin: 10px -20px 0 0
}
#footer #lang_sel_list.lang_sel_list_vertical {
    width: auto
}
#footer #lang_sel_list.lang_sel_list_vertical ul {
    border-top: none
}
#footer #lang_sel_list.lang_sel_list_vertical li {
    float: left;
    margin: 0 5px 0 0!important;
    width: auto
}
#footer #lang_sel_list.lang_sel_list_vertical ul a,
#footer #lang_sel_list_list ul a:visited {
    background: rgba(255, 255, 255, .1);
    border: none;
    padding: 4px 10px
}
#footer #lang_sel_list a {
    color: #888
}
#footer #lang_sel_list img.iclflag {
    top: 0
}
figure.featured-img {
    margin-bottom: 20px;
    float: left
}
.breadcrumbs {
    float: right;
    padding: 10px 0 0 0
}
.breadcrumbs ul li {
    float: left;
    position: relative;
    line-height: 16px;
    list-style: none;
    padding: 2px 10px;
    color: #fff;
    background-color: rgba(255, 255, 255, .1);
    border-right: 1px solid #333;
    font-size: 10px;
    text-transform: uppercase
}
.breadcrumbs ul li a {
    display: block;
    text-transform: uppercase;
    font-size: 10px;
    color: #ccc
}
.breadcrumbs ul li a:hover {
    color: #fff
}
.portfolio-detail-sidebar {
    float: left;
    width: 100%;
    border: 1px solid #f1f1f1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 30px
}
.portfolio-detail-sidebar>h6 {
    font-weight: normal;
    background: #707070;
    color: #fff!important;
    line-height: 40px;
    font-size: 12px;
    text-transform: uppercase;
    position: relative;
    padding: 0 20px;
    margin-bottom: 20px
}
.portfolio-detail-sidebar>h6:before {
    content: '';
    position: absolute;
    left: 0;
    bottom: -6px;
    width: 0;
    height: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 6px 6px 0 0;
    border-color: #707070 transparent transparent transparent
}
.portfolio-detail-sidebar>p {
    padding: 0 20px;
    margin-bottom: 20px;
    font-size: 12px
}
.portfolio-detail-sidebar ul,
.portfolio-detail-sidebar li {
    float: left;
    width: 100%
}
.portfolio-detail-sidebar li {
    list-style: none;
    padding: 10px 0 10px 20px;
    position: relative;
    border-top: 1px solid #f1f1f1;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
idebar li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 30%;
    height: 2px;
    background: #f1f1f1
}
.portfolio-detail-sidebar li span.pull-left {
    font-size: 14px
}
.portfolio-detail-sidebar li:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 30%;
    height: 2px;
    background: #f1f1f1
}
.portfolio-detail-sidebar li .text {
    padding-left: 38px
}
.portfolio-detail-sidebar li .text span {
    color: #a5a5a5;
    float: left;
    font-size: 11px;
    font-weight: 300;
    margin-bottom: 0;
    margin-top: -1px;
    font-family: Raleway, sans-serif;
    font-weight: 200;
    text-transform: uppercase
}
.portfolio-detail-sidebar li .text p {
    color: #585858;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.4;
    margin-bottom: 0;
    text-transform: uppercase;
    width: 100%;
    float: left
}
.post-btn {
    float: left;
    display: inline-block
}
.post-btn a {
    font-size: 13px;
    color: ##888888;
    margin-left: 15px
}
.post-btn a i {
    font-size: 16px
}
.post-btn a.nextpost i {
    margin-left: 8px
}
.post-btn a.prevpost i {
    margin-right: 8px
}
.head-top {

    float: left;

    width: 100%;

    padding: 15px 0;

}

.head-top .left-col {

    float: left;

    width: 100%;

}

.head-top .left-col ul {

    padding:1px 0 0  0;

    margin: 0;

    list-style: none;
    float: left;
    width: 100%;

}

.head-top .left-col ul li {

float: left;

padding: 0 20px 0 0;

position: relative;

line-height: 13px;

list-style: none;
}

.head-top .left-col ul li:before {

content: '.';

position: absolute;

right: 10px;

font-weight: bold;

top: -3px;

font-size: 16px;

color: #000;
}

.head-top .left-col ul li:last-child:before {

    display: none;

}

.head-top .left-col ul li a {


color: #000;

text-transform: uppercase;

text-decoration: none;
}

.right-col {

    float: right;

    width: 100%;

}

.topbar-social {
    float: right;
    font-size: 16px;
    margin-top: -2px;
    padding: 0;
}
.topbar-social ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.topbar-social ul li {
    float: left;
    list-style: none;
    margin: 0 0 0 10px;
}
.topbar-social ul li:first-child{
    margin: 0;
}
.topbar-social ul li a {
    float: left;
    border-radius: 100%;
    color: #000;
    height: 28px;
    line-height: 28px;
    text-align: center;
    width: 28px;
    font-size: 15px;
}

.topbar-social ul li a:hover{
    border:1px solid rgba(0,0,0,0);
    background: #21958f;
    color:white;
}
ul#menus li a:hover{
    color: #21958f;
}
.pagination ul li a:hover:before, .pagination ul li a.active:before{
    
    display: block;
    color: #409f74!important;
    background-color: #409f74!important;
    content: '';
    position: absolute;
    width: 100%;
    height: 3px;
    top: -3px;
    left: 0;
}
body{
    background-color: #5c6371;
    background-size: 100%;
}
.sites-menu{
    overflow: auto;
    height: 220px !important;
    margin: 50px 0;
    padding: 10px;
    border: 1px solid #fdfdfd;
    color: white;
    background: #ffffff;
    padding: 0 !important;
}
.sites-menu li{
    text-align: center;
    color: white;
    border-bottom: 1px solid #848484;
    border-top: 1px solid #ffffff;
    padding: 10px;
}
.sites-menu li:first-child{
    border-top:0;
}
.sites-menu li:last-child{
    border-bottom:0;
}
.sites-menu li:hover{
    background: #1e293d;
}
.sites-menu li:hover a{
    color: white;
}
.sites-menu li.active{
    background: #21958f;
    border-top: 0;
}
.sites-menu li.active a{
    color: white;
}
.courses-list{
  padding:0;
}
ol {
	counter-reset: li;
	list-style: none;
	font: 15px 'trebuchet MS', 'lucida sans';
	padding: 0;
	margin-bottom: 4em;
	text-shadow: 0 1px 0 rgba(255,255,255,.5);
}

.rounded-list a:not(.header){
    position: relative;
    display: block;
    padding: .4em .4em .4em 2em;
    *
    padding: .4em;
    margin: .5em 0;
    background: #ddd;
    color: #444;
    text-decoration: none;
    border-radius: .3em;
    transition: all .3s ease-out;
}

.rounded-list a:not(.header):hover{
    background: #eee;
}

.rounded-list a:not(.header):hover:before{
    transform: rotate(360deg);  
}

.rounded-list a:not(.header):before{
    content: counter(li);
    counter-increment: li;
    position: absolute;
    left: -1.3em;
    top: 50%;
    color: white;
    margin-top: -1.3em;
    background: #21958f;
    height: 2.6em;
    width: 2.6em;
    line-height: 30px;
    border: .3em solid #fff;
    text-align: center;
    font-weight: bold;
    border-radius: 2em;
    transition: all .3s ease-out;
}
#EC_previousMonth,#EC_nextMonth{
    margin: 10px 0;
    display:inline-block;
}

@media only screen and (max-width: 768px) {
    nav.navigation>ul {
        display: none
    }
    .js #nav {
        display: none
    }
    .js .selectnav {
        display: block
    }
    .wrapper.wrapper_boxed{
        margin:0 !important;
    }
    input,textarea{
        width:100% !important;
    }
    #logo img{
        width:100% !important;
    }
    .head-top .left-col ul li{
        line-height:20px;
    }
    .topbar-social{
        display:none;
    }
    ul li{
        list-style:none;
    }
    .sites-menu{
        margin:0;
    }
    .courses-list li{
        width:100%;
    }
    .courses-list {
        padding: 0 15px;
    }
    .wrapper:before, .wrapper:after{
        width:100%;   
    }

}
.courses-list{
  padding:0;
}
.courses-list li a{
    color: #737371;
    font-weight:bold;
}
.courses-list li{
  list-style:none;
  padding-left: 0;
    color: #737371;
}
.courses-list li:before{
    content: "\f02d";
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
  padding:0.15em  1.5em 0.5em 0;
  margin-bottom:0.2em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.rounded-list a.header{
    font-size: 16px;
    font-weight: 400;
    border-bottom: 1px solid #e9e9e9;
    margin-bottom: 15px;
    line-height: 25px;
    margin-bottom: 10px;
    padding-bottom: 5px;
    display: block;
    width: 100%;
}
select {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 3px 6px;
    margin: 10px 0 7px;
    width: 250px;
    background-color: #21958f;
    color: white;
    letter-spacing: -.04em;
    font-weight: bold;
    border: 0;
}
.wpcf7-textarea{
    width:100%;
    height:200px !IMPORTANT;
}
.wpcf7-not-valid{
    border:1px solid red !important;
}
.wpcf7-submit{
    color: #fff !important;
    background-color: #337ab7;
    border-color: #2e6da4 !important;
    border-radius: 3px;
}
.wpcf7-validation-errors{
    color: #a94442;
    width: 100%;
    background-color: #f2dede;
    border: 1px solid #ebccd1 !important;
    padding: 10px !important;
}
.wpcf7-mail-sent-ok{
    color: #3c763d;
    background-color: #dff0d8;
    width: 100%;
    border: 1px solid #d6e9c6 !important;
    padding: 10px !important;
}



/****************************/
@font-face {
	font-family: 'icomoon';
	src:url('fonts/icomoon.eot');
	src:url('fonts/icomoon.eot?#iefix') format('embedded-opentype'),
		url('fonts/icomoon.woff') format('woff'),
		url('fonts/icomoon.ttf') format('truetype'),
		url('fonts/icomoon.svg#icomoon') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* Common styles of menus */

.dl-menuwrapper {
	width: 100%;
	max-width: 300px;
	float: left;
	position: relative;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-perspective-origin: 50% 200%;
	perspective-origin: 50% 200%;
	z-index: 999999999999999;
}

.dl-menuwrapper:first-child {
	/* margin-right: 100px; */
	margin-bottom: 15px;
	display: none;
}

.dl-menuwrapper button {
	background: #21958f;
	border: none;
	width: 48px;
	height: 45px;
	text-indent: -900em;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	outline: none;
	/* position: absolute; */
	/* left: -66px; */
	/* z-index: 999999999999999999999999999999999999999999999999999999; */
}

.dl-menuwrapper button:hover,
.dl-menuwrapper button.dl-active,
.dl-menuwrapper ul {
	background: #21958f;
}

.dl-menuwrapper button:after {
	content: '';
	position: absolute;
	width: 68%;
	height: 5px;
	background: #fff;
	top: 10px;
	left: 16%;
	box-shadow: 
		0 10px 0 #fff, 
		0 20px 0 #fff;
}

.dl-menuwrapper ul {
	padding: 0;
	list-style: none;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.dl-menuwrapper li {
	position: relative;
	list-style: none;
}

.dl-menuwrapper li a {
	display: block;
	position: relative;
	padding: 15px 20px;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	color: #fff;
	outline: none;
}

.no-touch .dl-menuwrapper li a:hover {
	background: rgba(255,248,213,0.1);
}

.dl-menuwrapper li.dl-back > a {
	padding-left: 30px;
	background: rgba(0,0,0,0.1);
}

.dl-menuwrapper li.dl-back:after,
.dl-menuwrapper li > a:not(:only-child):after {
	position: absolute;
	top: 0;
	line-height: 50px;
	font-family: 'icomoon';
	speak: none;
	-webkit-font-smoothing: antialiased;
	content: "\e000";
	color: white;
}

.dl-menuwrapper li.dl-back:after {
	left: 10px;
	color: white;
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

.dl-menuwrapper li > a:after {
	right: 10px;
	color: rgb(255, 255, 255);
}

.dl-menuwrapper .dl-menu {
	/* margin: 5px 0 0 0; */
	position: absolute;
	width: 100%;
	opacity: 0;
	pointer-events: none;
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.dl-menuwrapper .dl-menu.dl-menu-toggle {
	transition: all 0.3s ease;
}

.dl-menuwrapper .dl-menu.dl-menuopen {
	opacity: 1;
	pointer-events: auto;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);
	list-style: none;
}

/* Hide the inner submenus */
.dl-menuwrapper li .dl-submenu {
	display: none;
}

/* 
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link. 
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen > a,
.dl-menu.dl-subview li.dl-subview > a {
	display: none;
}

.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen > .dl-submenu > li {
	display: block;
	margin-right: 0;
}

/* Dynamically added submenu outside of the menu context */
.dl-menuwrapper > .dl-submenu {
	position: absolute;
	width: 100%;
	top: 50px;
	left: 0;
	margin: 0;
}

/* Animation classes for moving out and in */

.dl-menu.dl-animate-out-1 {
	-webkit-animation: MenuAnimOut1 0.4s;
	animation: MenuAnimOut1 0.4s;
}

.dl-menu.dl-animate-out-2 {
	-webkit-animation: MenuAnimOut2 0.3s ease-in-out;
	animation: MenuAnimOut2 0.3s ease-in-out;
}

.dl-menu.dl-animate-out-3 {
	-webkit-animation: MenuAnimOut3 0.4s ease;
	animation: MenuAnimOut3 0.4s ease;
}

.dl-menu.dl-animate-out-4 {
	-webkit-animation: MenuAnimOut4 0.4s ease;
	animation: MenuAnimOut4 0.4s ease;
}

.dl-menu.dl-animate-out-5 {
	-webkit-animation: MenuAnimOut5 0.4s ease;
	animation: MenuAnimOut5 0.4s ease;
}

@-webkit-keyframes MenuAnimOut1 {
	0% { }
	50% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
	}
	75% {
		-webkit-transform: translateZ(-372.5px) rotateY(15deg);
		opacity: .5;
	}
	100% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut2 {
	0% { }
	100% {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut3 {
	0% { }
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut4 {
	0% { }
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut5 {
	0% { }
	100% {
		-webkit-transform: translateY(40%);
		opacity: 0;
	}
}

@keyframes MenuAnimOut1 {
	0% { }
	50% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		transform: translateZ(-250px) rotateY(30deg);
	}
	75% {
		-webkit-transform: translateZ(-372.5px) rotateY(15deg);
		transform: translateZ(-372.5px) rotateY(15deg);
		opacity: .5;
	}
	100% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
}

@keyframes MenuAnimOut2 {
	0% { }
	100% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0;
	}
}

@keyframes MenuAnimOut3 {
	0% { }
	100% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
}

@keyframes MenuAnimOut4 {
	0% { }
	100% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
}

@keyframes MenuAnimOut5 {
	0% { }
	100% {
		-webkit-transform: translateY(40%);
		transform: translateY(40%);
		opacity: 0;
	}
}

.dl-menu.dl-animate-in-1 {
	-webkit-animation: MenuAnimIn1 0.3s;
	animation: MenuAnimIn1 0.3s;
}

.dl-menu.dl-animate-in-2 {
	-webkit-animation: MenuAnimIn2 0.3s ease-in-out;
	animation: MenuAnimIn2 0.3s ease-in-out;
}

.dl-menu.dl-animate-in-3 {
	-webkit-animation: MenuAnimIn3 0.4s ease;
	animation: MenuAnimIn3 0.4s ease;
}

.dl-menu.dl-animate-in-4 {
	-webkit-animation: MenuAnimIn4 0.4s ease;
	animation: MenuAnimIn4 0.4s ease;
}

.dl-menu.dl-animate-in-5 {
	-webkit-animation: MenuAnimIn5 0.4s ease;
	animation: MenuAnimIn5 0.4s ease;
}

@-webkit-keyframes MenuAnimIn1 {
	0% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
	20% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		opacity: 0.5;
	}
	100% {
		-webkit-transform: translateZ(0px) rotateY(0deg);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn2 {
	0% {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn5 {
	0% {
		-webkit-transform: translateY(40%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		opacity: 1;
	}
}

@keyframes MenuAnimIn1 {
	0% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
	20% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		transform: translateZ(-250px) rotateY(30deg);
		opacity: 0.5;
	}
	100% {
		-webkit-transform: translateZ(0px) rotateY(0deg);
		transform: translateZ(0px) rotateY(0deg);
		opacity: 1;
	}
}

@keyframes MenuAnimIn2 {
	0% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn5 {
	0% {
		-webkit-transform: translateY(40%);
		transform: translateY(40%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-1 {
	-webkit-animation: SubMenuAnimIn1 0.4s ease;
	animation: SubMenuAnimIn1 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-2 {
	-webkit-animation: SubMenuAnimIn2 0.3s ease-in-out;
	animation: SubMenuAnimIn2 0.3s ease-in-out;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-3 {
	-webkit-animation: SubMenuAnimIn3 0.4s ease;
	animation: SubMenuAnimIn3 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-4 {
	-webkit-animation: SubMenuAnimIn4 0.4s ease;
	animation: SubMenuAnimIn4 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-in-5 {
	-webkit-animation: SubMenuAnimIn5 0.4s ease;
	animation: SubMenuAnimIn5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimIn1 {
	0% {
		-webkit-transform: translateX(50%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn2 {
	0% {
		-webkit-transform: translateX(100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn5 {
	0% {
		-webkit-transform: translateZ(-200px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn1 {
	0% {
		-webkit-transform: translateX(50%);
		transform: translateX(50%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn2 {
	0% {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn5 {
	0% {
		-webkit-transform: translateZ(-200px);
		transform: translateZ(-200px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1;
	}
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-1 {
	-webkit-animation: SubMenuAnimOut1 0.4s ease;
	animation: SubMenuAnimOut1 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-2 {
	-webkit-animation: SubMenuAnimOut2 0.3s ease-in-out;
	animation: SubMenuAnimOut2 0.3s ease-in-out;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-3 {
	-webkit-animation: SubMenuAnimOut3 0.4s ease;
	animation: SubMenuAnimOut3 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-4 {
	-webkit-animation: SubMenuAnimOut4 0.4s ease;
	animation: SubMenuAnimOut4 0.4s ease;
}

.dl-menuwrapper > .dl-submenu.dl-animate-out-5 {
	-webkit-animation: SubMenuAnimOut5 0.4s ease;
	animation: SubMenuAnimOut5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimOut1 {
	0% {
		-webkit-transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(50%);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut2 {
	0% {
		-webkit-transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(100%);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut3 {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut4 {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut5 {
	0% {
		-webkit-transform: translateZ(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-200px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut1 {
	0% {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(50%);
		transform: translateX(50%);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut2 {
	0% {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut3 {
	0% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut4 {
	0% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut5 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-200px);
		transform: translateZ(-200px);
		opacity: 0;
	}
}

/* No JS Fallback */
.no-js .dl-menuwrapper .dl-menu {
	position: relative;
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}

.no-js .dl-menuwrapper li .dl-submenu {
	display: block;
}

.no-js .dl-menuwrapper li.dl-back {
	display: none;
}

.no-js .dl-menuwrapper li > a:not(:only-child) {
	background: rgba(0,0,0,0.1);
}

.no-js .dl-menuwrapper li > a:not(:only-child):after {
	content: '';
}

/* Colors for demos */

/* Demo 1 */
.demo-1 .dl-menuwrapper button {
	background: #c62860;
}

.demo-1 .dl-menuwrapper button:hover,
.demo-1 .dl-menuwrapper button.dl-active,
.demo-1 .dl-menuwrapper ul {
	background: #9e1847;
}

/* Demo 2 */
.demo-2 .dl-menuwrapper button {
	background: #e86814;
}

.demo-2 .dl-menuwrapper button:hover,
.demo-2 .dl-menuwrapper button.dl-active,
.demo-2 .dl-menuwrapper ul {
	background: #D35400;
}

/* Demo 3 */
.demo-3 .dl-menuwrapper button {
	background: #08cbc4;
}

.demo-3 .dl-menuwrapper button:hover,
.demo-3 .dl-menuwrapper button.dl-active,
.demo-3 .dl-menuwrapper ul {
	background: #00b4ae;
}

/* Demo 4 */
.demo-4 .dl-menuwrapper button {
	background: #90b912;
}

.demo-4 .dl-menuwrapper button:hover,
.demo-4 .dl-menuwrapper button.dl-active,
.demo-4 .dl-menuwrapper ul {
	background: #79a002;
}

/* Demo 5 */
.demo-5 .dl-menuwrapper button {
	background: #744783;
}

.demo-5 .dl-menuwrapper button:hover,
.demo-5 .dl-menuwrapper button.dl-active,
.demo-5 .dl-menuwrapper ul {
	background: #643771;
}