/* GLOBAL STYLES
-------------------------------------------------- */
/* Padding below the footer and lighter body text */


/*


Main Colors: #010326;
Button:#23468C;


*/
body {
  padding-top: 0rem;
  padding-bottom: 0rem;
  color: #5a5a5a;
}

h1, h2, h3 {
  
}

.detail {
    box-shadow: 3px 4px 5px 3px rgba(0,0,0,.2);
    margin-bottom: 20px;
    margin-left: 0px;
    margin-right: 0px;
}

.detail img {
    width: 100%;
    max-height: 220px;
}

.detail-box {
    margin-left: 20px;
}

.detail-box h4 {
    font-size: 2rem;
    line-height: 28px;
    font-weight: bold;
    color: #23468c;
    padding-top: 10px;
    margin-bottom: 10px;
    letter-spacing: 1px;
}


.campus-header {
    font-size: 2rem;
    line-height: 28px;
    font-weight: bold;
    color: #fff;
    padding: 10px;
    margin-top:0px!important;
    margin-bottom: 10px;
    letter-spacing: 1px;
    background-color:#23468c;
}

.detail-box p{
    margin-bottom: 14px;
    font-size: 13px;
    line-height: 20px;
    text-align: justify;
    margin-right: 10px;
}

.detail-box  a{

  text-decoration: none;
  color: #23468c;
  font-weight:bold;
}

.detail-box p a:hover{
    color: #27c74c;
    border-bottom: 1px dotted #27c74c;
}

.detail-box p i.fas{
  color: #23468c;
}

.detail-box ul{
  padding: 0px;
  margin: 0px;
  margin-bottom: 10px;
}

.detail-box ul li{
      list-style-type: none;
    
    margin-right: 10px;
    font-size: 1rem;
    line-height: 26px;
    font-weight: 400;
    color: #000;
   
    padding: 2px 6px;
  
}



.detail-box h6{
    font-size: 14px;
    line-height: 18px;
}

.detail-box h6 i.fa{
  color: #23468c;
}

.detail-box h6 span{
  float: right;
  font-family: 'Bree Serif', serif;
  font-size: 18px;
  line-height: 22px;
  font-weight: 400;
  color: #27c74c;  
  margin-right: 10px;
}

.detail-box ul {
  margin-top:25px;
}

@media (max-width: 991.98px) { 
.detail img {
    width: 100%;
    max-height: 100%;
}

.detail-box ul {
  margin-top:0px;
}
}

.carousel-item:after {
  content:"";
  display:block;
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  right:0;
  background:rgba(0,0,0,0.4);
}

.detail-body{
  padding: 40px 0;
}

.title{
  padding-bottom: 30px;
}


.eligibal{
    padding: 20px;
    border: 1px solid #eee;
    background-color: rgba(239, 238, 238, 0.19);
}

.arrow-up {
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #fcfcfc;
    margin-top: -31px;
    position: absolute;
    right: 50px;
    z-index: 9999;
}

.eligibal p{
  font-size: 13px;
  line-height: 20px;
}




.titlebar-card {
    position:relative;
    margin:20px 0px 0px 0px;
    width:100%;
    min-height:200px;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,.1);
    border-radius:10px;
    transition:0.5s;
}
.titlebar-card:hover {
    box-shadow:0 30px 70px rgba(0,0,0,.2);
}
.titlebar-card .box {
    position:relative;
    top:50%;
    left:0;
    text-align:center;
    padding:0px 0px 0px 0px;
    box-sizing:border-box;
    width:100%;
}
.titlebar-card .box .img {
    width:100%;
    margin:0 auto;
    overflow:hidden;
}
.titlebar-card .box .img img {
    width:100%;
    height:100%;
}
.titlebar-card .box h2 {
    font-size:20px;
    color:#262626;
    margin:20px auto;
}
.titlebar-card .box h2 span {
    font-size:14px;
    background:#23468c;
    color:#fff;
    display:inline-block;
    padding:4px 10px;
    border-radius:.25rem;
}
.titlebar-card .box p {
    color:#262626;
}
.titlebar-card .box span {
    display:inline-flex;
}
.titlebar-card .box ul {
    margin:0;
    padding:0;
}
.titlebar-card .box ul li {
    list-style:none;
    float:left;
}
.titlebar-card .box ul li a {
    display:block;
    color:#aaa;
    margin:0 10px;
    font-size:20px;
    transition:0.5s;
    text-align:center;
}
.titlebar-card .box ul li:hover a {
    color:#e91e63;
    transform:rotateY(360deg);
}


.sidebar-card {
    position:relative;
    margin:20px 0px 20px 0px;
    width:100%;
    min-height:200px;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,.1);
    border-radius:10px;
    transition:0.5s;
}
.sidebar-card:hover {
    box-shadow:0 30px 70px rgba(0,0,0,.2);
}
.sidebar-card .box {
    position:relative;
    top:50%;
    left:0;
    text-align:center;
    padding:20px;
    box-sizing:border-box;
    width:100%;
}
.sidebar-card .box .img {
    width:120px;
    height:120px;
    margin:0 auto;
    border-radius:50%;
    overflow:hidden;
}
.sidebar-card .box .img img {
    width:100%;
    height:100%;
}
.sidebar-card .box h2 {
    font-size:20px;
    color:#262626;
    margin:20px auto;
}
.sidebar-card .box h2 span {
    font-size:14px;
    background:#23468c;
    color:#fff;
    display:inline-block;
    padding:4px 10px;
    border-radius:.25rem;
}
.sidebar-card .box p {
    color:#262626;
}
.sidebar-card .box span {
    display:inline-flex;
}
.sidebar-card .box ul {
    margin:0;
    padding:0;
}
.sidebar-card .box ul li {
 margin-left:20px;
}
.sidebar-card .box ul li a {
    display:block;
    color:#aaa;
    margin:0 10px;
    font-size:20px;
    transition:0.5s;
    text-align:center;
}
.sidebar-card .box ul li:hover a {
    color:#e91e63;
    transform:rotateY(360deg);
}

/* ----- */

.main-card {
    position:relative;
    margin:20px 0px 20px 0px;
    width:100%;
    min-height:200px;
    background:#fff;
    box-shadow:0 10px 25px rgba(0,0,0,.1);
    border-radius:10px;
    transition:0.5s;
}
.main-card:hover {
    box-shadow:0 30px 70px rgba(0,0,0,.2);
}
.main-card .box {
    position:relative;
    top:50%;
    left:0;
    text-align:center;
    padding:20px;
    box-sizing:border-box;
    width:100%;
}
.main-card .box .img {
    width:120px;
    height:120px;
    margin:0 auto;
    border-radius:50%;
    overflow:hidden;
}
.main-card .box .img img {
    width:100%;
    height:100%;
}
.main-card .box h2 {
    font-size:20px;
    color:#262626;
    margin:20px auto;
}
.main-card .box h2 span {
    font-size:14px;
    background:#23468c;
    color:#fff;
    display:inline-block;
    padding:4px 10px;
    border-radius:.25rem;
}
.main-card .box p {
    color:#262626;
}
.main-card .box span {
    display:inline-flex;
}
.main-card .box ul {
    margin:0 0 0 20px;
    padding:0;
}
.main-card .box ul li {
 
 
}
.main-card .box ul li a {
    display:block;
    color:#aaa;
    margin:0 10px;
    font-size:20px;
    transition:0.5s;
    text-align:center;
}
.main-card .box ul li:hover a {
    color:#e91e63;
    transform:rotateY(360deg);
}



.prereq-course {
  height:210px!important;
}


@media (max-width:1199px) {
  .prereq-course {
  height:177px!important;
}

}


@media (max-width:768px) {
  .prereq-course {
  height:129px!important;}

  .post-slide .post-mobile {
    padding-top:10px!important;
    background-color: #F5F5F6;
    height: 270px;
}



}

@media (max-width: 575px){

  .course-list-left {
  padding:0px!important;
}

.course-list-right {
  padding:0px!important;
}
}

.rundateText {
  padding:0px 0px 0px 0px;
  margin-bottom:0px;
}
.row-striped:nth-of-type(odd){
  background-color: #fdfdfd;
  border-left: 4px #ffa500  solid;
}

.row-striped:nth-of-type(even){
  background-color: #ffffff;
  border-left: 4px #efefef solid;
}

.row-striped {
    padding: 15px 0;
}

.social-box .box{
    background: #23468c;
    color:white;
    border-radius: 5px; 
    padding: 20px 10px;
    margin: 20px 0px;
    cursor: pointer;
    transition: all 0.5s ease-out;
}

.social-box .box:hover{
   box-shadow: 0 0 6px #4183D7;
}

.social-box .box .box-text{
    margin:20px 0px;
    font-size: 15px;
    line-height: 3px;
    font-weight:bold;
}

.social-box .box .box-btn a{
    text-decoration: none;
    color: #4183D7;
    font-size: 16px;
}

.fa{
     color:#4183D7;
}


#videoBG {
    position:fixed;
    z-index: -1;
}
@media (min-aspect-ratio: 16/9) {
    #videoBG {
        width:100%;
        height: auto;
    }
}
@media (max-aspect-ratio: 16/9) {
    #videoBG { 
        width:auto;
        height: 100%;
    }
}
@media (max-width: 767px) {
    #videoBG {
        display: none;
    }
   
}


.overlay {
    background: #3f51b540;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}

.overlay2 {
   background: #0000005e;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
}
.main-content2020 {
    height: 500px;
}
.cta2020 {
    overflow: hidden;
    background: linear-gradient(rgba(29, 200, 205, 0.65),
    rgba(29, 205, 89, 0.2)),
    url(../img/ctabg.jpg) fixed center center;
    background-size: cover;
    padding: 80px 0;
}

.cta2020 h2 {
  color: #fff;
}


.logo {
  max-width: 180px;
  margin-top:3.25rem;
  margin-left:1rem;
}

.logo-footer {
  max-width: 250px;
  margin-top:1rem;
} 

.btn-primary {
  color: #fff;
  background-color: #00B285;
 
}

.btn-primary:hover {
  background-color:#b0a295;
  
}


h1.outline, .outline {
  display: none;
}


.error,
.success {
  display: none;
}

.success {
  font-size:1.4em;
}

/* NAVIGATION */

.navbar {

  height: 90px;
  color: black;
  letter-spacing: 0.025em;
  transition: background-color 0.2s linear, box-shadow 0.2s linear;
}

.nav-item a {
  box-sizing: border-box;
  font-size:1em;
  margin:0 7px 0 7px;
  font-weight:500;
}

.nav-item a:focus, .nav-item a:hover {
    background-color:#1b7abf;
    box-sizing: border-box;
    color: #fff;
    
} 

.text-box {
  z-index: 20;
}

.gradientbg {
 
}

.text-box p {  
  margin-bottom:0px;
  font-size:1.5rem;
  line-height: 50px;
  text-align: center;
  
}



/*Theme Color */

.nav-item-hero {
  /*background-color:#2a2760;
  border-radius: 10px;*/
  margin-top:5px;
  padding:0px 3px;
  font-weight:500;
  font-size:1.2rem!important;
  outline: 1px solid white;

}

.nav-item-hero:hover {
  background-color:#2a2760;
 /* border-radius: 10px;*/
  outline: 1px solid white;

}

 .navbar-button {
  margin-top:10px;
}


.navbar-nav {
  margin-top:49px;
}

/*Theme Color */ 

.navbar.solid-nav {
  background-color: #23468c;
  transition: background-color 0.2s linear, box-shadow 0.2s linear;
  box-shadow: 0 1px 2px #5D5C61;
}

.navbar.transparent-nav {
  background-color: rgba(255,255,255,0);
  transition: background-color 0.2s linear, box-shadow 0.2s linear;
  box-shadow: none;
}

.navbar-alt {
  height: 30px;
  color: #fff;
  letter-spacing: 0.025em;
  transition: background-color 0.2s linear, box-shadow 0.2s linear;
}

.nav-link {
  color: rgba(255,255,255,1);
}
/* Theme Color */ 

.navbar-alt.solid-nav {
  background-color: #557A95;
  transition: background-color 0.2s linear, box-shadow 0.2s linear;
  box-shadow:none;
}



.custom-toggler {
  border-color:orange;
}

.custom-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,165,0, 0.7)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.mobile-font {
  font-size:.8rem;
  font-weight:500;
}

.number-font {
  font-size:.8rem;
  font-weight:500;
}



.navbar-brand {
  padding-top:0rem;
  text-align:right;
}




/* Social Networks */

.navbar .social-networks {
    text-align: center;

 
}

.navbar .social-networks a {
    font-size: 25px;
    color: #f9f9f9;
   padding:0 15px 0 15px;
    transition: 0.2s;
}

.navbar .social-networks a:hover {
    text-decoration: none;
}

.navbar .facebook:hover {
    color: #0077e2;
}

.navbar .linkedin:hover {
    color: #0077b5;
}

.navbar .twitter:hover {
    color: #00aced;
}

.b-right {
  border-right:1px solid black;
 
}

.b-left {
   border-left:1px solid black;
}

/* .dropdown-submenu {
    position: relative;
}

.dropdown-submenu>.dropdown-menu {
    top: 0;
    left: 100%;
    margin-top: -6px;
    margin-left: -1px;
    -webkit-border-radius: 0 6px 6px 6px;
    -moz-border-radius: 0 6px 6px;
    border-radius: 0 6px 6px 6px;
}

.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}

.dropdown-submenu>a:after {
    display: block;
    content: " ";
    float: right;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    border-width: 5px 0 5px 5px;
    border-left-color: #ccc;
    margin-top: 5px;
    margin-right: -10px;
}

.dropdown-submenu:hover>a:after {
    border-left-color: #fff;
}

.dropdown-submenu.pull-left {
    float: none;
}

.dropdown-submenu.pull-left>.dropdown-menu {
    left: -100%;
    margin-left: 10px;
    -webkit-border-radius: 6px 0 6px 6px;
    -moz-border-radius: 6px 0 6px 6px;
    border-radius: 6px 0 6px 6px;
} */
/* PARALLAX JUMBOTRON */

/*.jumbotron {
  margin:15px 0px 0px 0px;
  border-radius:0px;
  background: 
    linear-gradient(
      rgba(0, 0, 250, 0.25), 
      rgba(125, 250, 250, 0.45)
    ),
    url(../img/covers/cover-1.jpg);
  background-repeat: no-repeat;
  background-size: cover !important;
  background-attachment: fixed;
  color:white !important;
  height:380px;
  padding: 2rem 2rem;
} */


.jumbotron {
  margin:0px 0px 0px 0px;
  border-radius:0px;
  height:380px;
}

.jumbotron-mission {
  margin:15px 0px 0px 0px;
  border-radius:0px;
  background: 
    linear-gradient(
      rgba(85,122,149, 0.95), 
      rgba(115,149,174, 0.25)
    ),
    url(../img/covers/cover-1.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  color:white !important;
  height:380px;
}
.mission .text-muted {
  color: #7395ae !important;
}

.jumbotron-service {
    background: 
      linear-gradient(
        rgba(40, 40, 40, 0.35), 
        rgba(0, 0, 0, 0.65)
      ),
      url(../img/covers/cover-7.jpg);
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.jumbotron-service .text-muted {
  color:#1b7abf !important;
}


.jumbotron-about {
    background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(255, 255, 255, 0.95)
      ),
      url(../img/covers/cover-3.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  height:350px;
}

.jumbotron-about .featurette h1 {
  color:#fff;
  font-size:3.8rem;
  text-align:center;
  font-weight:bold;
}


.jumbotron-blog {
    background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(255, 255, 255, 0.45)
      ),
      url(../img/covers/about-cover.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  height:350px;
}

 

.jumbotron-about .text-muted {
  color:#1b7abf !important;
  text-shadow: 1px 1px #404040;
}

.blog-link a{
  color:#fff;
  text-shadow: 1px 1px #404040;
}

.jumbotron h2 {
  color:#fff;
  text-shadow: 1px 1px #404040;
}

.jumbotron p {
  color:#fff;
}

.page-scroll {
  height:5000px;
}

.main-heading {
  margin-bottom:0rem;
  padding-top:12.6rem;
  height:280px;
}

.divider {
  border-top: 4px solid orange;
}

/* SPLIT BG */

.split-bg {
   background:#212531;
  background: linear-gradient(to right bottom, #2f3441 50%, #212531 50%);
}

.split-bg h2{
  color:#fff;
}

.download-col {
  padding:0 10px 0 10px;
}

.download  {
  text-decoration: none;
  color: #fff;
  width:100%;
}

.form-links a{
  font-weight:500;
}



/* tree */

/* generic flexbox shortcuts */
[F]         { display: flex }
[R]         { flex-direction: row    } /* horizontal: row of 1:N columns (FBL default) */
[C]         { flex-direction: column } /* vertical: column of 1:N rows   */
[W]         { flex-wrap: wrap }

/* Prevents (inadverted) text selection by user (when double, double clicking) */
[no-select] { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;
              user-select: none; -moz-appearance : none; -webkit-appearance: none }

/* Show element outlines for debugging (use in <body> tag) */
[outlines="1"] * { outline: 1px dashed purple }

/* Color to show nesting level for debugging (use in <body> tag) */
[hover="1"] :not(section) :hover { background-color: rgba(255,0,0,.2) }

/*
    KNOT LOGIC
    'branch' - 1:N 'node',1:N 'node.step' and 1:N 'step'
    'node'   - 1:N 'node' and 1:N 'step'
    'step'   - 1 data-symbol

    You can use flexbox shortcut attributes R (horizontal) and C (vertical) to 
    determine the nesting direction of 'branch'es and 'node's. (R) is optional
    as horizontal is the default direction. 

    (Depending on orientation of the knots, all kinds of nestings might work,
     but that will require trial and error, fiddling.)

    SPECIFICATIONS
    1) 'branch' has no specific rules, but acts as a container for 'node's
       and to distinguish from 'node' and 'step'. 
       Add your own rules for specific 'branch' styling like fonts,colors,border,spacing.

    2) 'node' and 'step' only use :before and :after to position and draw
       connecting lines.

       'node'      horizontal line attachement
       'step'      vertical
       'node.step' both

    3) 'node.step' can be empty (no 'data-symbol'), in which case it will only
       draw cross lines.

    4) 'start' and 'stop' values are used to prevent drawing of
       starting and ending lines.

    5) Knot 'lft', 'ctr' and 'rgt' values define how sibling nodes are connected
       'lft' - left hand node, only one
       'ctr' - center nodes, can be more than one 
       'rgt' - right hand node, only one

    My motivation for use of 'data-* attributes' instead of classes is they
    are easy accessible as javascript variables:

    someElement.dataset.chart
    someElement.dataset.knot
    someElement.dataset.symbol
    
*/

/***************/
/* Chart Setup */
/***************/
/* If you want the knots distributed as-is, remove 'align-items' */
[data-chart]        { display: flex; align-items: center } /* [OPTIONAL], try! */
[data-knot]         { display: flex; flex-grow: 1 }        /* [MANDATORY] */

/* default alignments */
[data-knot]         { justify-content: center }
[data-knot*="node"] { align-items: stretch    }
[data-knot*="step"] { align-items: flex-start } 

/* this code keeps the lines connect to the symbols */
[data-knot]         { position: relative; z-index: 1 } /* new stacking context */
[data-knot]:before,
[data-knot]:after   { position: absolute; z-index: -1; content: '' }
/* put some character in 'content' to keep track when debugging */

/* Horizontal lines ('node') setup */
[data-knot]:before  { top   :  1px } /* adjust -+1 for thickess of outlines */
[data-knot]:after   { bottom: -1px }

[data-knot*="node"]:before,[data-knot*="node"]:after
{ height: 0px /* for IE11 */; width: 50% }

/* Vertical lines ('step') setup */
[data-knot*="step"]:before,[data-knot*="step"]:after
{ width: 0px /* for IE11 */; left: 50%; right: 50% }

/* positioning of the lines ('lft','ctr','rgt') */
[data-knot*="ctr"]:before,[data-knot*="ctr"]:after
{ width: 100%; left: 0 }

/* (EITHER) Handles document reading direction (dir="ltr" in <body>) */
[dir="ltr"] [data-knot*="lft"]:before, [dir="ltr"] [data-knot*="lft"]:after { left : 50% }
[dir="ltr"] [data-knot*="rgt"]:before, [dir="ltr"] [data-knot*="rgt"]:after { right: 50% }
[dir="rtl"] [data-knot*="lft"]:before, [dir="rtl"] [data-knot*="lft"]:after { right: 50% }
[dir="rtl"] [data-knot*="rgt"]:before, [dir="rtl"] [data-knot*="rgt"]:after { left : 50% }

/* (OR) For use without [dir]
[data-knot*="lft"]:before, [data-knot*="lft"]:after { left : 50% }
[data-knot*="rgt"]:before, [data-knot*="rgt"]:after { right: 50% }
*/

/* line coloring */
[data-knot*="node"]:before,[data-knot*="node.step"]:after,
[data-knot*="step"]:before,[data-knot*="step"]:after { outline: 1px solid #c1c1c1 }

/* no line drawing cases */
[data-knot="step"]:after, /* notice the missing '*' */
[data-knot*="start"]:before ,[data-knot*="stop"]:after { outline: none }

/*
    responsive sizes: T/B p1(320,6) p2(1280,24) and L/R p1(320,4) p2(1280,16)
    modify these to meet specific requirements.
*/
[data-knot*="step"]         { padding: 1.875vmin 1.25vmin }
[data-knot*="step"]:before  { height : 1.875vmin }              /* Same height as [data-step] T/B padding */
[data-knot*="step"]:after   { height : calc(100% - 1.875vmin) } /* pct to from below (minus T/B padding) */

/****************/
/* Symbol Setup */
/****************/
/*
    Chart 'data-symbol's, flexbox intended use

    FBL (V)     FBL (H)      Any
    --------    -------      -------
    (S)ymbol -> (H)eader  -> content
             -> (C)ontent -> content
             -> (F)ooter  -> content
*/
[data-symbol],
[data-symbol]>*         { display: flex }   /* S,H,C,F are flexbox parent containers */
[data-symbol]>*>*       { flex-grow: 1 }    /* sets default to 'fill' for content of H,C,F */

[data-symbol]           { flex-direction: column  } /* a column of 1:N rows */
[data-symbol]>.header   { align-items: center }

/* styling */
[data-symbol]           { text-decoration: none; color: currentColor; background-color: transparent }

[data-symbol]>.header {
    padding: .25rem .5rem; text-align: center; border-radius: 50%;

    /* responsive sizes: p1(320,50) p2(1920,180) */
    width : calc(8.125vmin + 74px);
    height: calc(8.125vmin + 74px);

    /*
        responsive fontsize: p1(320,6) p2(1920,20)
        Whether this works as expected depends on the minimum browser
        fontsize set by the user (content may overflow .header when set >6px)

        Tested defaults on W10:
        Edge2020 overflows, while Chrome, Firefox and IE11 do not
    */
    font-size: calc(.875vmin + 8.2px)
}

[clr="0"]       { background-color: Gainsboro; color: black }
.header,        /* .header here saves coding html */
[clr="1"]       { background-color: #23468c; color: #fff; font-weight:bolder;}
[clr="2"]       {/* background-color: #1e1e1e; color: Yellow ; font-weight: bolder*/
background:url(../img/envira-brands.png)  no-repeat center center;
background-color:#fff; 
font-weight:bolder;
color:#9c9c9c;

       }
[clr="3"]       { background-color: #ffcc01; color: #1e1e1e; font-weight: bolder }

/**************************************/
/* Google Material Component inspired */
/**************************************/
[icon] {
    display: inline-flex;
    justify-content: center; align-content: center; align-items: center;

    /* responsive sizes: p1(320,14) p2(1280,32) */
    width      : calc(1.875vmin + 8px);
    height     : calc(1.875vmin + 8px);
    line-height: calc(1.875vmin + 8px);
    font-size  : calc(1.875vmin + 8px);
    /*
        A bit overdone for just one icon, use inline SVG instead,
        or create a small (subset) iconfont at https://icomoon.io

        icon list: https://material.io/resources/icons/?style=baseline
    */
    font-family: 'Material Icons';

    font-weight: normal; font-style: normal; letter-spacing: normal;
    text-transform: none; white-space: nowrap; word-wrap: normal;

    opacity: 1; /* GMC uses <1 here and 1 on :hover */

    -moz-font-feature-settings: 'liga';
    font-feature-settings     : 'liga';
    -moz-osx-font-smoothing   : grayscale;
}

/******************/
/* simple banding */
/******************/
[band] { display: flex; flex-flow: row wrap;
         justify-content: center; align-content: center;
         padding: calc(5vh + 48px) calc(19.5vw - 54.4px) }
/*
    responsive padding
    T/B: p1(320,64) p2(1920,144) => y = 0.5x   + 48
    L/R: p1(320, 8) p2(1920,320) => y = 0.195x - 54.4

    This construction keeps content nicely center aligned within
    given space.
*/
/* [OPTIONAL] */
@media screen and (max-width: 319px) { [band] { padding: 1.5rem   8px } }
@media screen and (min-width:1921px) { [band] { padding: 1.5rem 320px } }

/***********************/
/* Some extra eyecandy */
/***********************/
[data-symbol]>.header {
    box-shadow: 0px 2px 1px -1px rgba(0,0,0,.20),
                0px 1px 1px  0px rgba(0,0,0,.14),
                0px 1px 3px  0px rgba(0,0,0,.12);   /* GMC elevation 1dp */
}
[data-symbol]>.header:hover:not(:focus)  { transform: scale(1.01) }
[data-symbol]>.header:active:not(:focus) { transform: scale(0.995);
    box-shadow: 0px 3px  5px -1px rgba(0,0,0,.2),
                0px 5px  8px  0px rgba(0,0,0,.14),
                0px 1px 14px  0px rgba(0,0,0,.12);  /* GMC elevation 5dp */
}
[data-symbol]>.header:hover {
    box-shadow: 0px 3px  5px -1px rgba(0,0,0,.2),
                0px 6px 10px  0px rgba(0,0,0,.14),
                0px 1px 18px  0px rgba(0,0,0,.12);  /* GMC elevation 6dp */
}
/*
    ALGEBRA for responsive sizing

    ALL responsive sizes in this document use the 'point-slope' variation
    of the 'definition of a straight line: y=mx+b':
    (https://www.mathsisfun.com/algebra/line-equation-point-slope.html)

    y - y1 = y1 + m(x - x1) <=> y = y1 + m(x - x1)

    For points:
    p1 = (x1,y1) - size at minimum viewport size (x1 default  320px)
    p2 = (x2,y2) - size at maximum viewport size (x2 default 1280px)
    (using 320px and 1280px will create a full step each 160px)

    where:
    m = (y2 - y1) / (x2 - x1) ('Slope')
    x = fixed value of 100vmin, 100vh or 100vw ('X-intercept')
    b = y1 - (m * x1) ('Y-intercept')

    X-axis = viewport size
    Y-axis = element size

    Substituted equation to use:
    y = y1 + (y2 - y1) / (x2 - x1) * (x - x1)

    NOTES
    - Use VMIN for viewport width/height independed results (like fonts)
    - Use VW/VH for viewport width/height dependend results (width,height,margin,padding)
    - Do not use VMAX for x, it will yield results that are to large.

    EXTRA
    Helpfull hands-on graphical tool/demo I created on GeoGebra
    'ERS linear equations' https://www.geogebra.org/m/gct3bvsp
    (E)asy (R)esponsiveness (S)system
*/
/*Now the CSS Created by R.S*/
* {margin: 0; padding: 0;}

.tree ul {
    padding-top: 20px; position: relative;
  
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
}

.tree li {
  float: left; text-align: center;
  list-style-type: none;
  position: relative;
  padding: 20px 5px 0 5px;
  
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
}

/*We will use ::before and ::after to draw the connectors*/

.tree li::before, .tree li::after{
  content: '';
  position: absolute; top: 0; right: 50%;
  border-top: 1px solid #ccc;
  width: 50%; height: 20px;
}
.tree li::after{
  right: auto; left: 50%;
  border-left: 1px solid #ccc;
}

/*We need to remove left-right connectors from elements without 
any siblings*/
.tree li:only-child::after, .tree li:only-child::before {
  display: none;
}

/*Remove space from the top of single children*/
.tree li:only-child{ padding-top: 0;}

/*Remove left connector from first child and 
right connector from last child*/
.tree li:first-child::before, .tree li:last-child::after{
  border: 0 none;
}
/*Adding back the vertical connector to the last nodes*/
.tree li:last-child::before{
  border-right: 1px solid #ccc;
  border-radius: 0 5px 0 0;
  -webkit-border-radius: 0 5px 0 0;
  -moz-border-radius: 0 5px 0 0;
}
.tree li:first-child::after{
  border-radius: 5px 0 0 0;
  -webkit-border-radius: 5px 0 0 0;
  -moz-border-radius: 5px 0 0 0;
}

/*Time to add downward connectors from parents*/
.tree ul ul::before{
  content: '';
  position: absolute; top: 0; left: 50%;
  border-left: 1px solid #ccc;
  width: 0; height: 20px;
}

.tree li a{
  border: 1px solid #ccc;
  padding: 5px 10px;
  text-decoration: none;
  color: #666;
  font-family: arial, verdana, tahoma;
  font-size: 11px;
  display: inline-block;
  
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  
  transition: all 0.5s;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
}

/*Time for some hover effects*/
/*We will apply the hover effect the the lineage of the element also*/
.tree li a:hover, .tree li a:hover+ul li a {
  background: #c8e4f8; color: #000; border: 1px solid #94a0b4;
}
/*Connector styles on hover*/
.tree li a:hover+ul li::after, 
.tree li a:hover+ul li::before, 
.tree li a:hover+ul::before, 
.tree li a:hover+ul ul::before{
  border-color:  #94a0b4;
}

/*Thats all. I hope you enjoyed it.
Thanks :)*/

/* CAROUSEL
-------------------------------------------------- */


.carousel {
  margin-bottom: 0rem;

}

.carousel-image {
  max-width: 100%;
} 
.carousel-caption a {
    font-size: 1.5rem;
    line-height: 1.3;
}

.carousel-number a {
  text-decoration: none;
  color: #fff !important;
  transition: color .7s;
}

.carousel-number a:hover {
  text-decoration: none;
  color: #77e3fd !important;
}


.carousel-number button:hover {
  text-decoration: none;
  color: #91DDF7 !important;
}


.carousel-heading {
  font-weight: normal;
  line-height: 1;
  font-size: 4rem;
  margin-bottom:0rem;
  color: #fff;
  text-align: center;
}

.carousel-backdrop {
  border-radius: .3rem;
}


.text-lg {
  font-weight:bold;
  font-size:2rem !important;
  color: white;
}

.main-subheader{
  font-size:1.5rem !important;
  line-height: 2.0625rem !important;
  margin-bottom:0px;
  
  margin-top:10px;
}

.carousel-caption {
  bottom: 3rem;
  z-index: 10;
  top: 45%;
  transform: translateY(-50%);
  bottom: initial;
  max-width: 100%;
  right:auto;
  left:auto;
  /*margin-left: auto;
  margin-right: auto;*/
  text-align:left;
  /* background-color:rgba(71,70,74,.75); */
  padding:0px 0px 0px 0px;
}

.carousel-caption p {
  max-width:100%;
  font-weight:lighter;
  /*margin-left:auto;
  margin-right:auto;*/
}


/* Search Icon */

 .searchbar{
    margin-bottom: auto;
    margin-top: auto;
    height: 60px;
    background-color: #010326;
    border-radius: 30px;
    padding: 10px;
    }

  .searchbar a {
    text-decoration: none;
  }

    .search_input{
    color: white;
    border: 0;
    outline: 0;
    background: none;
    width: 0;
    caret-color:transparent;
    line-height: 40px;
    transition: width 0.4s linear;
    }

    .search_input::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #fff;
  font-weight:500;
  opacity: 1; /* Firefox */
}


    .searchbar:hover > .search_input{
    padding: 0 10px;
    width: 450px;
    caret-color:red;
    transition: width 0.4s linear;
    }

    .searchbar:hover > .search_icon{
    background: white;
    color: #e74c3c;
    }

    .search_icon{
    height: 40px;
    width: 40px;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    color:white;
    text-decoration:none;
    }



/* Search Icon 2 */

 .searchbar2{
    position:relative;
    margin-bottom: auto;
    margin-top: auto;
    height: 60px;
    background-color:#23468C;
    border-radius: 30px;
    padding: 10px;
    z-index:1;
    }

  .searchbar2 a {
    text-decoration: none;
  }

    .search_input2{
    color: white;
    border: 0;
    outline: 0;
    background: none;
  
    line-height: 40px;

    padding: 0 10px;
    width: 450px;
    caret-color:red;
    transition: width 0.4s linear;
    }

    .search_icon2{
    height: 40px;
    width: 40px;
    float: right;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    text-decoration:none;

    background: white;
    color: #e74c3c;
    }


.search_input2::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #fff;
  font-weight:500;
  opacity: 1; /* Firefox */
}

/* Button */

.btn-view-all {
    color: #fff;
    background-color: #23468C;
    border-radius:20px;
    font-weight:500;
    padding-top:17px;    
}

.main-register {
  font-size:2rem!important;
  width:70%;
  border-radius:0px;
}

.btn-view-all2 {
    color: #fff;
    background-color: #23468C;
    border-radius:20px;
    font-weight:500;
    padding:10px;  
    font-size:1.4rem;
    width:25%;  
}

.btn-view-all:hover, .btn-view-all2:hover {
    color:#fff;
    background-color: #39BFA7;
}

.ts {
  text-shadow: 1px 1px #404040;
}

.main-carousel .carousel-item {
        background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/covers/cover-3.jpg) no-repeat center center fixed; 
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  height: 54rem;
  background-color: #777;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.main-carousel .carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  /* height: 39rem; */
}

.main-carousel .carousel-indicators li {
  margin-top:-4%;
}

.carousel-icon {
 font-size:4rem;
}

/* ---- HIGHLIGHT CARDS */

.swrap {
    display: flex;
    background: white;
    padding: 1rem 1rem 1rem 1rem;
    border-radius: 0.5rem;
    box-shadow: 6px 6px 10px -5px rgba(0,0,0,0.1);
    margin-bottom: 2rem;
    transition:background 1s ease;
} 

.swrap:hover {
    background: #47464a;
    color: white;
}

.ico-wrap {
    margin: auto;
}

.mbr-iconfont {
    font-size: 4.5rem !important;
    color: #1b7abf;
    margin: 1rem;
    padding-right: 1rem;
}
.vcenter {
    margin: auto;
}

.mbr-section-title3 {
    text-align: left;
}
h2 {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}
.display-5 {
    font-family: 'Source Sans Pro',sans-serif;
    font-size: 1.4rem;
}
.mbr-bold {
    font-weight: 700;
}

 p {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    line-height: 25px;
}
.display-6 {
    font-family: 'Source Sans Pro',sans-serif;
    font-size: 1rem;}



/* COURSES CAROUSEL */

.MultiCarousel { float: left; overflow: hidden; padding: 0px; width: 100%; position:relative; }
    .MultiCarousel .MultiCarousel-inner { transition: .4s ease all; float: left; }
        .MultiCarousel .MultiCarousel-inner .item { float: left;}
        .MultiCarousel .MultiCarousel-inner .item > div {}
    .MultiCarousel .leftLst, .MultiCarousel .rightLst { position:absolute; border-radius:50%;top:calc(50% - 20px); }
    .MultiCarousel .leftLst:hover, .MultiCarousel .rightLst:hover { color:white; }
    .MultiCarousel .leftLst { left:0; }
    .MultiCarousel .rightLst { right:0; }
    
        .MultiCarousel .leftLst.over, .MultiCarousel .rightLst.over { pointer-events: none; background:#ccc; }

.course-header h2 {
  margin-top:40px;
  line-height:60px !important;
  text-align:center;
  font-weight: 500;
  font-size:4rem;
  line-height:2;
  color:#fff;
  
  text-align:center;
}

.coursecontent h1 {
  font-size:2.3rem;
  color:#23468c;
}

/* Theme Color */ 

.course-header-banner {
  /* background-color:#010326; 
  border-bottom:3px solid #1b7abf; 
  margin-bottom:2rem;*/
}


/* REMOVED

.button-readmore {
  display: inline-block;
  background-color:rgba(255,255,255,1);
  text-decoration: none;
  border-radius: 300px;
  border: 1px solid rgba(255,255,255,0.3); 
  color: rgba(0,0,0,1);
  height:60px;
  width: 60px;
  position: relative;
  text-transform: uppercase;
  overflow: hidden;
  transition: all 0.35s;
}
.button-readmore:hover {
  width: 159px;
  border: 1px solid #fff; 
  color: #000;
}
.button-readmore span {
  position: absolute;
  display: inline-block;
  top: 0;
  left: 54px;
  width: 159px;
  height: 44px;
  line-height: 58px;
  text-align: center;
  transition: left 0.25s;
}
.button-readmore:hover span {
  left: 0;
}
.button-readmore:before {
  position: absolute;
  top: 4px;
  left: 8px;
  content:"...";
  display: block;
  height: 44px;
  width: 44px;
  font-weight: 600;
  font-size: 24px;
  text-align: center;
  transition: left 0.35s;
}
.button-readmore:hover:before {
  left: -37px;
}

*/

/* CONTENT CARD */

.content-card {
  background: #fff;
  color: #222222;
  padding: 20px;
  padding-left: 50px;
  box-sizing: border-box;
  box-shadow: 0 2px 4px rgba(34, 34, 34, 0.12);
  position: relative;
  overflow: hidden;
  min-height: 120px;
}
.content-card p {
  font-size: 22px;
  line-height: 1.5;
  margin: 0;
  max-width: 100%;
}
.content-card cite {
  font-size: 16px;
  margin-top: 10px;
  display: block;
  font-weight: 200;
  opacity: 0.8;
}
.content-card:before {
  font-family: Georgia, serif;

  position: absolute;
  top: 10px;
  left: 10px;
  font-size: 5em;
  color: rgba(238, 238, 238, 0.8);
  font-weight: normal;
}
.content-card:after {
  font-family: Georgia, serif;

  position: absolute;
  bottom: -110px;
  line-height: 100px;
  right: 0px;
  font-size: 25em;
  color: rgba(238, 238, 238, 0.8);
  font-weight: normal;
}
@media (max-width: 640px) {
  .content-card:after {
    font-size: 22em;
    right: -25px;
  }
}
.content-card.blue-card {
  background: #0078FF;
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
}
.content-card.blue-card:before, .content-card.blue-card:after {
  color: #5FAAFF;
}

/* QUOTE CARD */

.quote-card {
  background: #fff;
  color: #222222;
  padding: 20px;
  padding-left: 50px;
  box-sizing: border-box;
  box-shadow: 0 2px 4px rgba(34, 34, 34, 0.12);
  position: relative;
  overflow: hidden;
  min-height: 120px;
}
.quote-card p {
  font-size: 22px;
  line-height: 1.5;
  margin: 0;
  max-width: 80%;
}
.quote-card cite {
  font-size: 16px;
  margin-top: 10px;
  display: block;
  font-weight: 200;
  opacity: 0.8;
}
.quote-card:before {
  font-family: Georgia, serif;
  content: "“";
  position: absolute;
  top: 10px;
  left: 10px;
  font-size: 5em;
  color: rgba(238, 238, 238, 0.8);
  font-weight: normal;
}
.quote-card:after {
  font-family: Georgia, serif;
  content: "”";
  position: absolute;
  bottom: -110px;
  line-height: 100px;
  right: 0px;
  font-size: 25em;
  color: rgba(238, 238, 238, 0.8);
  font-weight: normal;
}
@media (max-width: 640px) {
  .quote-card:after {
    font-size: 22em;
    right: -25px;
  }
}
.quote-card.blue-card {
  background: #0078FF;
  color: #ffffff;
  box-shadow: 0 1px 2px rgba(34, 34, 34, 0.12), 0 2px 4px rgba(34, 34, 34, 0.24);
}
.quote-card.blue-card:before, .quote-card.blue-card:after {
  color: #5FAAFF;
}


/* --- COURSE CARDS --- */


.post-slide {
    margin: 0 15px;
    position: relative;
    background: #FFF;
}
.post-slide .post-img {
    position: relative;
    overflow: hidden;
}
.post-slide .post-img img {
    width: 100%;
    height: auto;
}
.post-slide .over-layer {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    background: rgba(0, 0, 0, 0.6);
    transition: all 0.30s ease;
}
.post-slide:hover .over-layer {
    opacity: 1;
}
.post-slide .post-link {
    margin: 0;
    padding: 0;
    position: relative;
    top: 45%;
    text-align: center;
}
.post-slide .post-link li {
    display: inline-block;
    list-style: none;
    margin: -9px 0 0;
}
.post-slide .post-link li a {
    color: #FFF;
    font-size: 39px;
}
.post-slide .post-link li a:hover {
    color: #FF8B3D;
    text-decoration: none;
}
.post-slide .post-date {
    position: absolute;
    top: 70%;
    left: 0%;
}
.post-slide .date {
    display: inline-block;
    border-radius: 3px 0 0 3px;
    padding: 5px 10px;
    color: #FFF;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    background: #333;
    float: left;
}

.post-slide .post-prereq {
    position: absolute;
    top: 10%;
    left: 0%;
}

.post-slide .prereq {
    display: inline-block;
    border-radius: 3px 0 0 3px;
    padding: 5px 10px;
    color: #FFF;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
    background: #333;
  
}

.post-slide .month {
    display: inline-block;
    border-radius: 0 3px 3px 0;
    padding: 5px 13px;
    color: #fff;
    font-size: 15px;
    font-weight: bold;
    background: #1b7abf;
}
.post-slide .post-content {
    padding: 30px;
    background-color: #efefef33;
    height:270px;
}

.course-list .post-slide .post-content {
  height:auto;
}

.coursecontent .post-slide .post-content  {
  height:auto;
}

.post-slide h3 {
  line-height:1;
}

.post-slide .post-title {
    margin: 0 0 0px 0;
}
.post-slide .post-title a {
    font-size: 17px;
    font-weight: bold;
    color: #333;
    display: inline-block;
    transition: all 0.3s ease 0s;
}
.post-slide .post-title a:hover {
    text-decoration: none;
    color: #FF8B3D;
}

.post-slide .post-subtitle {
    font-size: .9rem;
    font-weight: bold;
    color: #333;
    display: inline-block;
    transition: all 0.3s ease 0s;
    padding-top:0;
    padding-bottom:0;
}

.post-slide .post-description {
    font-size: 14px;
    line-height: 22px;
    color: #444444;
    padding: 0 0 0 0;
}

.post-content p {
  font-size: 14px;
    line-height: 22px;
    color: #444444;
    padding: 0 0 0 0;
}

.post-slide .read-more {
    color: #333;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    position: relative;
    transition: color 0.20s linear;
}
.post-slide .read-more:hover {
    text-decoration: none;
    color: #FF8B3D;
}
.post-slide .read-more:after {
    content: "";
    position: absolute;
    width: 30%;
    display: block;
    border: 1px solid #FF8B3D;
    transition: all 0.30s ease;
}
.post-slide .read-more:hover:after {
    width: 100%;
}


@media only screen and (max-width: 479px) {
    .post-slide .month {
        font-size: 14px;
    }
    .post-slide .date {
        font-size: 14px;
    }
}
div.clanky .row {
    padding-top: 35px;
}

/**********************
/***** Services *******
/*********************/
/*@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css'); */
section{
  padding: 15px 0 15px;
}
section .section-title{
  text-align:center;
}
#what-we-do{
  background:#ffffff;
}
#what-we-do .card{
  padding: 1rem!important;
  border: none;
  margin-bottom:1rem;
  -webkit-transition: .5s all ease;
  -moz-transition: .5s all ease;
  transition: .5s all ease;
}
#what-we-do .card:hover{
  -webkit-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
  -moz-box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
  box-shadow: 5px 7px 9px -4px rgb(158, 158, 158);
}
#what-we-do .card .card-block{
  padding-left: 50px;
    position: relative;
}
#what-we-do .card .card-block a{
  color: #007b5e !important;
  font-weight:900;
  text-decoration:none;
}
#what-we-do .card .card-block a i{
  
  
}


.card-title {
  font-size:1.55rem;
}

#what-we-do .card:hover .card-block a i{
  display:none;
  font-weight:900;
  
}
#what-we-do .card .card-block:before{
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
    position: absolute;
    font-size: 30px;
    color: #23468c;
    left: 0;
  -webkit-transition: -webkit-transform .2s ease-in-out;
    transition:transform .2s ease-in-out;
}
#what-we-do .card .block-1:before{
    content: "\f4fe";
}
#what-we-do .card .block-2:before{
    content: "\f058";
}
#what-we-do .card .block-3:before{
    content: "\f534";
}
#what-we-do .card .block-4:before{
    content: "\f5fd";
}
#what-we-do .card .block-5:before{
    content: "\f201";
}
#what-we-do .card .block-6:before{
    content: "\f0c0";
}
#what-we-do .card:hover .card-block:before{
  /*-webkit-transform: rotate(360deg);
  transform: rotate(360deg);  */
  -webkit-transition: .5s all ease;
  -moz-transition: .5s all ease;
  transition: .5s all ease;
}

/* css list with numeber circle background -------------- */

.numberlist{
  ;
}

.numberlist ul{
                counter-reset: li;
                list-style: none;
                *list-style: decimal;
                font: 15px 'trebuchet MS', 'lucida sans';
                padding: 0;
            
}

.numberlist ul ul{
                margin: 0 0 0 2em;
            }

.numberlist li{
                position: relative;
                display: block;
                padding: .2em .4em .4em 1em;
                *padding: .4em;
                margin: .5em 0;
                font-weight:bold;
               
                font-size:1.1rem;
                text-decoration: none;
                -moz-border-radius: .3em;
                -webkit-border-radius: .3em;
                border-radius: .3em;
            }

/*.numberlist li:hover{
                background: #23468c;  
                color:gold;
            }
*/

.numberlist .fa-li{
                padding-top: 2px;
                /*position: absolute;*/
                left: -1.3em;
                top: 38%;
                margin-top: -.99em;
                background: #23468c;
                height: 2.3em;
                width: 2.3em;
                line-height: 1.6em;
                border: .3em solid #fff;
                text-align: center;
                font-weight: 900;
                -moz-border-radius: 2em;
                -webkit-border-radius: 2em;
                border-radius: 2em;
                color:gold;
                z-index:0;
            }

/* End css list with numeber circle background -------------- */

/* Branch Box */
.branch-box {
  
}

.branch-box h2 {
  font-size:2.5rem;
  text-align: center;

}
.branch-box h3 {
  font-size:2rem;
  text-align: center;
  color:white;
  font-weight:bold;
 
}

.rounded-bg {
  background-color:#23468c;
  height: 250px;
  width:250px;
  margin-left:auto;
  margin-right:auto;
}

/*.branch-box ul li {
  list-style-type: none;
  font-weight:bold;
  padding:10px;
  font-size:1.2rem;
}
*/
.branch-box p {
  text-align: center;
  font-size:2rem;
  line-height: 2;
}

.branch-box ul li {
  z-index: 1;
}

/* Info Boxes */

@import "//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css";
@import "http://fonts.googleapis.com/css?family=Roboto:400,500";

.box {
  background-color:rgba(255,255,255,0);
  z-index: 1;
}

  .box > .icon { 
      text-align: center; position: relative; 
  }
.box > .icon > .image { 
  position: relative; 
  z-index: 2; 
  margin: auto; 
  width: 88px; 
  height: 88px; 
  border: 8px 
  solid white; 
  line-height: 88px; 
  border-radius: 50%; 
  background: #000; 
  vertical-align: middle; 
}

.box > .icon:hover > .image { 
  background: #3a7d9d; 
  transition:background .4s ease;
}

.box > .icon > .image > i { 
  font-size: 36px !important; 
  color: gold !important; 
}

.box > .icon:hover > .image > i { 
  color: white !important; 
}

.box > .icon > .info { 
  height:325px;
  margin-top: -24px; 
  background: rgba(255, 255, 255, 1); 
  border: 1px solid #e0e0e0; 
  padding: 15px 0 10px 0; 
  -webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.24);
  -moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.24);
  box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.24);
  transition:box-shadow 2s ease, background 2s ease;
}

.box > .icon:hover > .info {  
  border-color: #e0e0e0; 
  color: white; 
  -webkit-box-shadow: 4px 6px 14px 2px rgba(0,0,0,0.57);
-moz-box-shadow: 4px 6px 14px 2px rgba(0,0,0,0.57);
box-shadow: 4px 6px 14px 2px rgba(0,0,0,0.57);
  transition:box-shadow 2s ease, background 2s ease;
}



.box > .icon > .info > h3.title { 
  font-family: "Roboto",sans-serif !important; 
  font-size: 2.2rem; 
  color: #666; 
  font-weight: 500; 
  margin-top:1rem;
}

.box > .icon > .info > p { 
  font-family: "Roboto",sans-serif !important; 
  font-size: 16px; 
  color: #666; 
  line-height: 2em; 
  margin: 0px 20px 20px 20px;
}

.box > .icon > .info > p:hover { 
  

}



.box .space { 
  height: 30px; 
}

/* -- Course TABS --*/

.blogShort{ border-bottom:1px solid #ddd;}
.add{background: #333; padding: 10%; height: 300px;}

.nav-sidebar { 
    width: 100%;
    padding: 0px 0; 
    border-right: 1px solid #ddd;
    text-align: right;

}
.nav-sidebar a {
    color: #333;
    -webkit-transition: all 0.08s linear;
    -moz-transition: all 0.08s linear;
    -o-transition: all 0.08s linear;
    transition: all 0.08s linear;
    text-decoration: none;
    padding:10px 10px 10px 10px;
}
.nav-sidebar .active a { 
    cursor: default;
    background-color: #0b56a8; 
    color: #fff; 
}

.nav-sidebar ul li {
  text-align: center;
  padding:10px 0px 10px 0px;
  font-size:1.4rem;
  background:color:black;
}

.nav-sidebar a:hover {
  background-color:#cdcdcd;
}

.nav-sidebar .active a:hover {
    background-color: #E50000;   
}
.nav-sidebar .text-overflow a,
.nav-sidebar .text-overflow .media-body {
    white-space: nowrap;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis; 
}

.btn-blog {
    color: #ffffff;
    background-color: #E50000;
    border-color: #E50000;
    border-radius:0;
    margin-bottom:10px
}
.btn-blog:hover,
.btn-blog:focus,
.btn-blog:active,
.btn-blog.active,
.open .dropdown-toggle.btn-blog {
    color: white;
    background-color:#0b56a8;
    border-color: #0b56a8;
}
article h2{color:#333333;}
h2{color:#0b56a8;}
 .margin10{margin-bottom:10px; margin-right:10px;}
 
/* Skewed Bg */

@-webkit-keyframes colorSwapper {
  0% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
  50% {
    background-color: #da5b45;
    background-image: -webkit-linear-gradient(#da5b45, #955fad);
    background-image: linear-gradient(#da5b45, #955fad);
  }
  100% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
}
@-moz-keyframes colorSwapper {
  0% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
  50% {
    background-color: #da5b45;
    background-image: -webkit-linear-gradient(#da5b45, #955fad);
    background-image: linear-gradient(#da5b45, #955fad);
  }
  100% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
}
@keyframes colorSwapper {
  0% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
  50% {
    background-color: #da5b45;
    background-image: -webkit-linear-gradient(#da5b45, #955fad);
    background-image: linear-gradient(#da5b45, #955fad);
  }
  100% {
    background-color: #955fad;
    background-image: -webkit-linear-gradient(#955fad, #da5b45);
    background-image: linear-gradient(#955fad, #da5b45);
  }
}
@-webkit-keyframes solidColor {
  0% {
    background-color: #955fad;
  }
  50% {
    background-color: #da5b45;
  }
  100% {
    background-color: #955fad;
  }
}
@-moz-keyframes solidColor {
  0% {
    background-color: #955fad;
  }
  50% {
    background-color: #da5b45;
  }
  100% {
    background-color: #955fad;
  }
}
@keyframes solidColor {
  0% {
    background-color: #955fad;
  }
  50% {
    background-color: #da5b45;
  }
  100% {
    background-color: #955fad;
  }
}


.nm {
  position:relative;
  z-index:20;
  margin-top:-170px;
}

.skewed-bg {
  position:relative;
  z-index:0;
  height:600px;
   background: 
      url(../img/covers/black-cover.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;

  padding: 200px 0;
  -webkit-transform: skew(0deg, -10deg);
  -moz-transform: skew(0deg, -10deg);
  -ms-transform: skew(0deg, -10deg);
  -o-transform: skew(0deg, -10deg);
  transform: skew(0deg, -10deg);
  margin-top: -200px;
  margin-bottom:350px;
}
.skewed-bg .content {
  -webkit-transform: skew(0deg, 10deg);
  -moz-transform: skew(0deg, 10deg);
  -ms-transform: skew(0deg, 10deg);
  -o-transform: skew(0deg, 10deg);
  transform: skew(0deg, 10deg);
  text-align: center;
}
.skewed-bg .content .stitle {
  padding-top: 70px;
  font-weight: normal;
  font-size:4rem;
}
.skewed-bg .content .text {
  width: 60%;
  margin: 25px auto;
  color: #dadada;
  font-size:1.5rem;
  margin-bottom:4rem;
}

.footer {
  padding-top: 300px;
}
.footer .credits {
  text-align: center;
  color: #666;
}
.footer .credits .link {
  color: #00B285;
  text-decoration: none;
}

.p15 {
  padding-left:15px;
  padding-right:15px;
  padding-top:35px;
  padding-bottom:35px;
}

.z1 {
  z-index:1;
}

.z0 {
  z-index:0;
}


/*Skewers */
.sk-tl {
    z-index: 10;
    position: absolute;
    left: 0;
    top: 0;
    border-width: 35vh 100vw 0 0;
    border-style: solid;
    border-color: #557a95 transparent transparent transparent;
}


.sk-br {
    z-index: 0;
    position: absolute;
    left: 0;
    bottom: 0;
    border-width: 0 0 35vh 100vw;
    border-style: solid;
    border-color: transparent transparent #557a95 transparent;
}

.sk-brw {
    z-index: 10;
    position: absolute;
    left: 0;
    bottom: 0;
    border-width: 0 0 35vh 100vw;
    border-style: solid;
    border-color: transparent transparent #fff transparent;
}

.sk-brb {
    z-index: 10;
    position: absolute;
    left: 0;
    bottom: 0;
    border-width: 0 0 35vh 100vw;
    border-style: solid;
    border-color: transparent transparent #557a95 transparent;
}


/* --- WRAP ---*/

  .wrap {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    background-color:#fff;
  }

  .wrap:before, .wrap:after {
    content:'';
    position: absolute;
    bottom: 0;
    width: 50%;
    background-color: inherit;
    padding-bottom:3%;
  }
  .wrap:before {
    right: 50%;
    -ms-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -ms-transform: skewX(45deg);
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
  }
  .wrap:after {
    left: 50%;
    -ms-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -ms-transform: skewX(-45deg);
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
  }

  .main-carousel .wrap {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    background-color:#fff;
  }

  .main-carousel .wrap:before, .wrap:after {
    content:'';
    position: absolute;
    bottom: 0;
    width: 50%;
    background-color: inherit;
    padding-bottom:3%;
  }
  .main-carousel .wrap:before {
    right: 50%;
    -ms-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    transform-origin: 100% 100%;
    -ms-transform: skewX(45deg);
    -webkit-transform: skewX(45deg);
    transform: skewX(45deg);
  }
  .main-carousel .wrap:after {
    left: 50%;
    -ms-transform-origin: 0 100%;
    -webkit-transform-origin: 0 100%;
    transform-origin: 0 100%;
    -ms-transform: skewX(-45deg);
    -webkit-transform: skewX(-45deg);
    transform: skewX(-45deg);
  }


.b-wrap {
   
  border-radius:0px;
  background: 
    linear-gradient(
      rgba(35, 70, 140, 1), 
      rgba(255,255,255, 1)
    );
  /*background: 
    linear-gradient(
      rgba(125, 250, 250, 0.25), 
      rgba(85,122,149, 1)
    ),
    url(../img/feature-banner.jpg);  */
  /*background-attachment: fixed;*/
  color:white !important;
}

/*.b-wrap {
   
  border-radius:0px;
  background: 
    linear-gradient(
      rgba(125, 250, 250, 0.25), 
      rgba(145, 221, 247, 0.95)
    ),
    url(../img/feature-banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  color:white !important;
}*/

/*.b-wrap {
   
  border-radius:0px;
  background: 
    linear-gradient(
      rgba(0, 0, 250, 0.25), 
      rgba(125, 250, 250, 0.45)
    ),
    url(../img/feature-banner.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  color:white !important;
}*/

/* MARKETING CONTENT
-------------------------------------------------- */

/* Center align the text within the three columns below the carousel */
.marketing .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.marketing h2, h3 {
  font-weight: 400;
}
.marketing .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}


.mission {
  margin-top: 0px;
}

/* Multi Color Border */

.c-border {
  text-align: center;
  position: relative;
  line-height: 100px;
  background: #fff;
  width: 100%;
}

.c-border:after {
  background: linear-gradient(to right, #3e9ad9 25%,#3e9ad9 25%, #7fc33c 50%, #7fc33c 50%, #3e9ad9 75%, #3e9ad9 75%);
  position: absolute;
  content: '';
  height: 4px;
  right: 0;
  left: 0;
  top: 0;
}


/* Featurettes
------------------------- */

.featurette-divider {
  margin: 5rem 0; /* Space out the Bootstrap <hr> more */
}

/* Thin out the marketing headings */
.featurette-heading {
  font-weight: 300;
  line-height: 1;
  letter-spacing: -.05rem;
}


.index-main {
  margin-top:50px;
}

/* ABOUT US */ 

.about-us {
  margin-top:1rem;
}

.about-us h2 {
  text-align: center;
  font-size:2.5rem;
  margin-top:40px;
  font-weight: bold
}

.card-caption {
  line-height: 1.1;
}

/* --------- ONE --------- */ 

.transition {
  transition: .3s cubic-bezier(.3, 0, 0, 1.3)
}
.three .transition {
  transition: .7s cubic-bezier(.3, 0, 0, 1.3)
}
.five .transition {
  transition: .5s cubic-bezier(.3, 0, 0, 1.3)
}

.one {
  list-style: none;
  padding: 0;
  margin: 40px 0;
}
.one > li {
  background: #FFFFFF;
  border: 1px solid rgba(150,150,150,0.29);
  -moz-box-shadow: 0px 0px 18px 0px rgba(103,85,85,0.39);
  box-shadow: 0px 0px 18px 0px rgba(103,85,85,0.39);
  width: 250px;
  height: 400px;
  display: inline-block;
  margin: 0 10px;
  text-align: center;
}
.one > li img {
  margin-top: 60px;
}
.one > li:hover img {
  margin-top: 30px;
}
.one > li:hover {
  -moz-box-shadow: 0px 0px 5px 0px rgba(103,85,85,0.25);
  box-shadow: 0px 0px 5px 0px rgba(103,85,85,0.25);
}
.one > li:hover span {
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  bottom: -400px;
}
.one > li:hover h3 {
  color: rgba(255,255,255,1);
  margin-top: 25px;
}
.one > li .wrapper {
  overflow: hidden;
  position: absolute;
  width: 250px;
  height: 400px;
}
.one > li span {
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  height: 500px;
  width: 500px;
  background: #23468c;
  display: block;
  position: absolute;
  bottom: -300px;
  left: -125px;
}
.one > li span img {
  margin-top: 10px;
  width: 50px;
}
.one > li span:hover {
  background: #00B285;
}
.one > li h3 {
  margin-top: 40px;
  color: rgba(255,255,255,1);
}
.one > li h3 em {
  display: block;
  font-style: normal;
  text-transform: uppercase;
  font-weight: 300;
  font-size: 12px;
  margin-top: 5px;
}
.one .social {
  list-style: none;
  text-align: center;
  margin: 10px 0 0 0;
  padding: 10px;
}
.one .social li {
  opacity: 0;
  display: inline-block;
  padding: 5px;
}
.one > li:hover .social li {
  opacity: 0.5;
}
.one .social li a {
  cursor: pointer;
  display: block;
  font-weight:bold;
  color:black;
  text-decoration: none;
}
.one .social li a:hover {
  opacity: 0.5;
}
.one .social li img {
  width: 24px;
}

 @-webkit-keyframes arrow {
 0% {
background-position: center top;
}
 50% {
background-position: center 10px;
}
 100% {
background-position: center top;
}
}
 @-moz-keyframes arrow {
 0% {
background-position: center top;
}
 50% {
background-position: center 10px;
}
 100% {
background-position: center top;
}
}
 @keyframes arrow {
 0% {
background-position: center top;
}
 50% {
background-position: center 10px;
}
 100% {
background-position: center top;
}
}



/* SERVICE ICONS --- */

/* Theme Color */

.service-icons {
  background:#557A95;
  padding-top:1rem;
  padding-bottom:1rem;
  z-index: -1;
  padding:5px;
}

.service-icons a img {
  position: relative;
  padding-top:1rem;
  z-index: 0;
  max-width:80px;
}

.service-bg {
  margin-left:10px;
  margin-right:10px;
}


.service-icons h3 {
  position:relative;
  color: #fff;
  text-align: center;
  font-size:1.2em;
  margin-top:10px;
  z-index: 0;
  font-weight:500;
}

.service-icons a {
  text-decoration: none;
  
}

/*.service-icons a:hover {
  border:10px solid #000;
} */

.image-link {
  transition: box-shadow .3s;
  margin-bottom:5px;
}

.service-thumb {
    max-width:225px;
    height:166px;
    position:absolute;
    display:block;
    max-width:100%;
    z-index: 0;
}

.image-link:hover {
  box-shadow: 0 0 5px 0 rgba(255,255,255, 0.8);
 /* box-shadow: 1px 1px #47c9f6,
              2px 2px #47c9f6,
              3px 3px #47c9f6; */
  transition: box-shadow .3s;
}


/*
.dental-hygiene-icon {
   background: url("../img/icons/gen-dental-care.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.dental-hygiene-icon:hover {
   background: url("../img/icons/gen-dental-care-hover.png") no-repeat;
}

.dentistry-kids-icon {
   background: url("../img/icons/gen-dentistry-kids.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.dentistry-kids-icon:hover {
   background: url("../img/icons/gen-dentistry-kids-hover.png") no-repeat;
}

.sedation-icon {
   background: url("../img/icons/gen-sedation.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.sedation-icon:hover {
   background: url("../img/icons/gen-sedation-hover.png") no-repeat;
}

.braces-icon {
   background: url("../img/icons/gen-braces.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.braces-icon:hover {
   background: url("../img/icons/gen-braces-hover.png") no-repeat;
}

.whitening-icon {
   background: url("../img/icons/cos-whitening.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.whitening-icon:hover {
   background: url("../img/icons/cos-whitening-hover.png") no-repeat;
}

.vaneer-icon {
   background: url("../img/icons/cos-veneer.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.vaneer-icon:hover {
   background: url("../img/icons/cos-veneer-hover.png") no-repeat;
}

.invisalign-icon {
   background: url("../img/icons/cos-invisalign.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.invisalign-icon:hover {
   background: url("../img/icons/cos-invisalign-hover.png") no-repeat;
}

.dentures-icon {
   background: url("../img/icons/cos-dentures.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.dentures-icon:hover {
   background: url("../img/icons/cos-dentures-hover.png") no-repeat;
}

.implants-icon {
   background: url("../img/icons/rest-dental-implants.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.implants-icon:hover {
   background: url("../img/icons/rest-dental-implants-hover.png") no-repeat;
}

.extract-icon {
   background: url("../img/icons/reset-tooth-extract.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.extract-icon:hover {
   background: url("../img/icons/reset-tooth-extract-hover.png") no-repeat;
}

.crown-icon {
   background: url("../img/icons/rest-crown-bridge.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.crown-icon:hover {
   background: url("../img/icons/rest-crown-bridge-hover.png") no-repeat;
}

.inlay-icon {
   background: url("../img/icons/rest-inlay-onlay.png") no-repeat;
   height: 125px;
   width: 125px;
   margin:auto;
   margin-top:1rem;
}

.inlay-icon:hover {
   background: url("../img/icons/rest-inlay-onlay-hover.png") no-repeat;
}
*/

/* ASSOCIATIONS */

.associations img {
  text-align: center;
  margin: auto;
  display: block;
  opacity: 0.4;
  margin-bottom:5px;
}

.top-row-associations img {
  max-width:350px !important;
}

/* REVIEWS
-----------------*/


.reviews{
    padding:30px 0px;
     background:#212531;
  background: linear-gradient(to right bottom, #2f3441 50%, #212531 50%);
}

.reviews hr {
  border-top:1px solid #fff;
}

.reviews span {
  font-size:.8rem;
  line-height: .4rem;
}

.reviews-heading {
  font-weight: 300;
  color: #fff;
  font-size:3rem !important;
  line-height: 1;
  letter-spacing: -.05rem;
}

.box-part{
    background:#FFF;
    border-radius:.5rem;
    padding:40px 10px;
    margin:15px 0px;
    height:300px;
}

.box-part .title {
  margin-top:1rem;
}

.text{
    margin:20px 0px;
}

/* BLOG
----------------*/

.blog-container {

  background-color: #fff;
  padding-top: 20px;




}

.blog-container::before {
 
}

.blog-title {
  margin-bottom:0rem;
  padding-top:9rem;
  color:#fff;
}

.blog-title a {
  text-decoration: none;
  color: #fff;
  font-weight: 400;
}

.blog-header-link {
  text-decoration: none;
  color: #5a5a5a;
}

.blog-header-link:hover {
  color: #7f7f7f;
  text-decoration: none;
}

.blog-subheader-link {
  color:#47c9f5;
}

.blog-subheader-link:hover {
  color:#47c9f5;
}



.blogcontent .lead {
  line-height: 1.5rem;
}

.sub-header {
  font-size:2em;
}

.ft-blog-subheader {
  font-size: .8rem;
  color:#47c9f5;
}

.ft-blog-header {
  font-weight:500;
}

.blog-subheader {
  font-size: .8rem;
  color:#47c9f5;
}

.blog-subheader-grey {
  color:#d0d0d0;
}

.blog-header {
  font-weight:500;
}

.sidebar-header {
  font-size:1.5em;
}

.sidebar ul {
  list-style: none;
  padding-left:0;
}

.sidebar ul li{
  margin-left:20px;
}

.category-link a {
  text-decoration: none;
  color: #676767;
  font-size: 1.2em;
}

.category-link a:hover {
  color: #557a95;
}

.archive-link a {
  text-decoration: none;
  color: #676767;
  font-size: 1em;
}

.archive-link a:hover {
  color: #7fc33c;
}

.latest-header {
  font-size:1.1rem;
  margin-left: 5px;
  font-weight: 500;
}

.latest-subheader {
  margin-left:5px;
  font-size: .7rem;
  color:#47c9f5;
  font-weight: bold;

}

.search-header {
  font-size:2rem;

  font-weight: 500;
  margin-top:0;
  line-height: 0.85em;
}

.search-subheader {
  
  font-size: .7rem;
  color:#47c9f5;
  font-weight: bold;
  float:left;
  clear:right;
  margin-top:2em;
 
}

.search-content {
  margin-bottom:0px;
  clear:both;
}

.btn-info {
  background-color:#557a95;
  border-color:#557a95;
}

.btn-info:hover{
  background-color:#938e94;
  border-color:#938e94;
}


/* COURSE CONTENT */


.course-container {
  /*margin-top: -20px;*/
  background-color: #fff;
  padding-top: 0px;
  border-width: 2px 1px 0 1px;
  /*border-style: solid;
  -webkit-border-image: -webkit-gradient(linear, 0 100%, 0 0, from(#c0c0c0), to(rgba(0, 0, 0, 0))) 1 100%;
  -webkit-border-image: -webkit-linear-gradient(top, #c0c0c0, rgba(0, 0, 0, 0)) 1 100%;
  -moz-border-image: -moz-linear-gradient(top, #c0c0c0, rgba(0, 0, 0, 0)) 1 100%;
  -o-border-image: -o-linear-gradient(top, #c0c0c0, rgba(0, 0, 0, 0)) 1 100%;
  border-image: linear-gradient(to bottom, #c0c0c0,rgba(0, 0, 0, 0),rgba(0, 0, 0, 0)) 1 45%;*/




}

.course-container::before {
 
}

.course-title {
  margin-bottom:0rem;
  padding-top:9rem;
  color:#fff;
  display:none;
}

.course-title a {
  text-decoration: none;
  color: #fff;
  font-weight: 400;
}

.course-header-link {
  text-decoration: none;
  color: #5a5a5a;
}

.course-header-link:hover {
  color: #7f7f7f;
  text-decoration: none;
}

.course-subheader-link {
  color:#47c9f5;
}

.course-subheader-link:hover {
  color:#47c9f5;
}

.course-cat-box {
  background-color:orange;
  max-height:100px;
  text-align: center;

}

.course-cat-box a {
  font-size: 1rem;

}

.rundates {
  font-size:1.5rem;
  padding:10px 5px 10px 5px;
  margin-left:0px;
  outline:1px solid #ddd;
}

.rundate-header {
  color:#0b56a8;
  font-weight: bold;
  width: 100%;
}

.course-cat-border {
  border-left:1px solid grey;
  border-right:1px solid grey;
}

.course-cat-box p {
  font-size:.8rem;
  line-height: .9;
  padding: 0;
  padding:14px 0 0 0 ;
  font-weight:bold;

}

.course .lead {
  line-height: 1.5rem;
}

.sub-header {
  font-size:2em;
}

.ft-course-subheader {
  font-size: .8rem;
  color:#47c9f5;
}

.ft-course-header {
  font-weight:500;
  text-align: center;
}

.course-subheader {
  font-size: .8rem;
  color:#47c9f5;
}

.course-subheader-grey {
  color:#d0d0d0;
}

.course-header {
  font-weight:500;
}

.coursecontent .lead {
  line-height: 1.5rem;
}

/*Couse Day Breakdown */

.post-slide .post-m-title {
    margin: 0 0 20px 0;
}
.post-slide .post-m-title a {
    font-size: 17px;
    font-weight: bold;
    color: #333;
    display: inline-block;
    transition: all 0.3s ease 0s;
}

/* PAGINATION STATION */

div.pagination {
    padding: 4px;
    margin-left:auto;
    margin-right:auto;
    display: block;
    text-align: center;

}


/* Theme Color */
div.pagination a {
    padding: 2px 7px 2px 7px;
    margin: 2px;
    border: 1px solid #557a95;
    zoom: 100%;
    text-decoration: none; /* no underline */
    color: #fff;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    background-color: #557a95;
    font-weight:500;
    transition: background-color .5s, border .5s;
}
div.pagination a:hover, div.pagination a:active {
    border: 1px solid #938e94;
    color: #fff;
    background-color: #938e94;
}
div.pagination span.page_current {
    padding: 2px 7px 2px 7px;
    margin: 2px;
    border: 1px solid #938e94;

    * zoom: 100%;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    font-weight: bold;
    background-color: #938e94;
    color: #FFF;
}
div.pagination span.page_disabled {
    padding: 2px 7px 2px 7px;
    margin: 2px;
    border: 1px solid #EEE;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;

    * zoom: 100%;

    color: #DDD;
}

* span.elipsis {zoom:100%}


/* GALLERY VIEWER & SLIDER
------------------*/
 
.carousel-indicators li {
  width: 100px;
  height:auto;
}


#return-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    background: rgb(85,122,149, 0.7);
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: background 0.3s linear;
    -moz-transition: background 0.3s ease;
    -ms-transition: background 0.3s ease;
    -o-transition: background 0.3s ease;
    transition: background 0.9s ease;
}
#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
    left: 16px;
    top: 13px;
    font-size: 19px;
    -webkit-transition: background 0.3s ease, top 0.3 ease;
    -moz-transition: background 0.3s ease, top 0.3 ease;
    -ms-transition: background 0.3s ease, top 0.3 ease;
    -o-transition: background 0.3s ease, top 0.3 ease;
    transition: background 0.3s ease, top 0.3 ease;
}
#return-to-top:hover {
    background: rgb(176,162,149, 0.7);

}
#return-to-top:hover i {
    color: #fff;
    top: 5px;
}


.cta-contact-bg {
  background-color:#4C7BD9;

  
}

.cta-contact {
  height:200px

}

.cta-contact {
  color:#fff !important;
}

.cta-contact h2{
  border-right:1px solid white;
  font-size:4rem!important;
  color:#fff;

}
/******contact wrap******/

section.contact-wrap{
    padding: 5rem 0;
    position: relative;
    background: url("../img/covers/contactwrap.jpg") no-repeat center center fixed;
    background-size: cover;
}

.contact-wrap {
  font-family: "Roboto",sans-serif !important; 
}

.contact-wrap h2 {
  font-size:2.5rem;
  font-weight:bold;
}

.cta {
    padding-top: 5rem;
    padding-bottom: 5rem;
}
.cta .cta-inner {
    position: relative;
    background: rgba(255, 255, 255, 0.7);
    padding: 3rem;
    margin: .5rem;
    box-shadow: 0px 0px 10px 0px #00000059;
}
.contactForm {
    width: 100%;
    max-width: 484px;
    border-radius: 5px;
    margin: auto;
    padding: 30px 40px 20px;
    
}
.contactForm .form-control{
    border-radius: 0px;
    border: none;
    border-bottom: 1px solid #222222;
    background-color: transparent !important;
    color: #222222;
    margin-bottom: 2rem;
    outline:none;
}
.contactForm ::placeholder{color: #222222;}
input.btn-login {
    display: block;
    margin: auto;
    text-align: center;
    background-color: #3dce8c;
    border: 1px solid #3dce8c;
     border-radius: 3px;
     font-size: 14px;
    color: #ffffff;
    cursor: pointer;
    text-transform: uppercase;
    padding: 10px 50px;
    outline: none;
     box-shadow: 0px 0px 10px 0px #00000059;
}
/* ==== OLD SLIDER ==== REMOVE 
.h-slider ul {
        list-style: none outside none;
        padding-left: 0;
        margin: 0;
    }

    .slider .item{
        margin-bottom: 60px;
    }

    .content-slider li{
        background-color: #ed3020;
        text-align: center;
        color: #FFF;
    }

    .content-slider h3 {
        margin: 0;
        padding: 70px 0;
    }
    .slider{
        max-width: 100%; 
    }

  .main-slider {
    display:block;
    margin-left:auto;
    margin-right:auto;
    max-width:550px;
    
  }

  .main-slider img {
    max-width:100%;
  }
*/ 

.h-275 {
  height:275px;
}


/* MAP 
----------------*/

.map {
  line-height: 0;
}

/* FOOTER */

/* Theme Color */

#myFooter {
    background-color:#23468c;
    color: white;
    padding-top: 0px;
}

#myFooter .footer-copyright {
    background-color: #23468c;
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: center;
    font-size:.7rem;
    font-weight:bold;

}

#myFooter .footer-copyright a {
  /* color:#7f7f7f; */
  transition:color .7s;
  color: #fff;
}

#myFooter .footer-copyright a:hover {
  color:#47c9f6;
}

#myFooter .row {
    margin-bottom: 0px;
}

#myFooter .navbar-brand {
    margin-top: 45px;
    height: 65px;
}

#myFooter .footer-copyright p{
    margin: 10px;
   /* color:#7f7f7f; */
   color: #fff;
   padding-bottom: 0px;
   padding-top: 0px;
}

#myFooter ul {
    list-style-type: none;
    padding-left: 0;
    line-height: 1.7;
}

#myFooter h2 {
    font-size: 13px;
    color: white;
    font-weight: 600;
    margin-top: 0px;
    transition: color: 1s;
   
}

#myFooter .sidebar-header {
  font-size:20px;
}

#myFooter .hours-list h2 {
  font-size:20px;
}

#myFooter .category-footer ul li{
  font-size:.75rem;
}

#myFooter a {
    color: #fff;
    text-decoration: none;
}

#myFooter a:hover,
#myFooter a:focus {
    text-decoration: none;
    color: #47c9f6;
    transition: color 1s;
}

#myFooter .social-networks {
    text-align: center;
    padding-top: 30px;
    padding-bottom: 16px;
}

#myFooter .social-networks a {
    font-size: 32px;
    color: #f9f9f9;
    padding: 10px;
    transition: 0.2s;
}

#myFooter .social-networks a:hover {
    text-decoration: none;
}

#myFooter .facebook:hover {
    color: #0077e2;
}

#myFooter .linkedin:hover {
    color: #0077b5;
}

#myFooter .twitter:hover {
    color: #00aced;
}

#myFooter .btn {
    color: white;
    background-color: #557a95;
    border-radius: 5px;
    border: none;
    width: 150px;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    line-height: 25px;
    font-weight:500;
}

#myFooter .btn:hover {
    background-color: #b0a295;

}

.email-size {
  font-size:.85em;
}

.hours-list {
  font-size:1rem;
}



#modalRegistrationForm .modal-content{
  overflow:hidden;
}
a.h2{
    color:#007b5e;
    margin-bottom:0;
    text-decoration:none;
    font-size:1.5rem;
}
#modalRegistrationForm .form-control {
    height: 56px;

  padding-left:30px;
}

/* Theme Color */
#modalRegistrationForm .btn {
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}

#modalRegistrationForm .submit {
    border-top-right-radius: 30px;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}

button.submit span{
  padding-left:3rem;
  padding-right:2rem;
  font-size:1rem;
  font-weight: 500;
}

#modalRegistrationForm .form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #47464a;
    outline: 0;
    box-shadow: none;
}



#modalRegistrationForm .modal-content{
  overflow:hidden;
}


/*-------------------------------------------------*/
#modalPreRegistrationForm .modal-content{
  overflow:hidden;
}
a.h2{
    color:#007b5e;
    margin-bottom:0;
    text-decoration:none;
    font-size:1.5rem;
}
#modalPreRegistrationForm .form-control {
    height: 56px;

  padding-left:30px;
}

/* Theme Color */
#modalPreRegistrationForm .btn {
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}

#modalPreRegistrationForm .submit {
    border-top-right-radius: 30px;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}



#modalPreRegistrationForm .form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #47464a;
    outline: 0;
    box-shadow: none;
}



#modalPreregistrationForm .modal-content{
  overflow:hidden;
}

a.h2{
    color:#007b5e;
    margin-bottom:0;
    text-decoration:none;
    font-size:1.5rem;
}
#modalContactForm .form-control {
    height: 56px;
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
  padding-left:30px;
}

/* Theme Color */
#modalContactForm .btn {
    border-top-right-radius: 30px;
    border-bottom-right-radius: 30px;
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}

#modalContactForm .submit {
    border-top-right-radius: 30px;
    border-top-left-radius: 30px;
    border-bottom-right-radius: 30px;
    border-bottom-left-radius: 30px;
  padding-right:20px;
  background:#47464a;
  border-color:#47464a;
}

button.submit span{
  padding-left:3rem;
  padding-right:2rem;
  font-size:1rem;
  font-weight: 500;
}

#modalContactForm .form-control:focus {
    color: #495057;
    background-color: #fff;
    border-color: #47464a;
    outline: 0;
    box-shadow: none;
}

/* Theme Color */ 
#modalContactForm .top-strip{
  height: 155px;
    background: #000;
    transform: rotate(141deg);
    margin-top: -94px;
    margin-right: 190px;
    margin-left: -130px;
    border-bottom: 65px solid #23468c;
    border-top: 10px solid #23468c;
}
#modalContactForm .bottom-strip{
  height: 155px;
    background: #000;
    transform: rotate(112deg);
    margin-top: -110px;
    margin-right: -215px;
    margin-left: 300px;
    border-bottom: 65px solid #23468c;
    border-top: 10px solid #23468c;
}

.map-link a {
  text-decoration: none;
  color: #fff !important;
  transition: color .7s;

}

.map-link a:hover {
  text-decoration: none;
  color: #77e3fd !important;
}

.email-link a {
  text-decoration: none;
  color: gold !important;
  transition: color .7s;
  float: right;
    /* text-align: right; */
    margin-right: -410px;
    font-weight: bold;
    margin-top:-20px;
    font-size:.8rem;
}

.email-link a:hover {
  text-decoration: none;
  color: #77e3fd !important;
}

.email-display i {
  color:gold;
}

.lightblue {
  color: orange;
}

.modal-open {
    overflow: scroll;
    padding-right:0px !important;
    padding-left: -17px !important;
}


/**************************/
/****** modal-lg stips *********/
/**************************/
#modalContactForm .modal-lg .top-strip {
    height: 155px;
    background: #47464a;
    transform: rotate(141deg);
    margin-top: -106px;
    margin-right: 457px;
    margin-left: -130px;
    border-bottom: 65px solid #557a95;
    border-top: 10px solid #557a95;
}
#modalContactForm .modal-lg .bottom-strip {
    height: 155px;
    background: #47464a;
    transform: rotate(135deg);
    margin-top: -115px;
    margin-right: -339px;
    margin-left: 421px;
    border-bottom: 65px solid #557a95;
    border-top: 10px solid #557a95;
}

.input-group button {
  pointer-events: none;
}

@media screen and (max-width: 767px) {
    #myFooter {
     text-align:left;
    }
}
/* RESPONSIVE CSS
-------------------------------------------------- */

@media (min-width: 40em) {
  /*
  .carousel-caption p {
    font-size: 1.35rem;
    line-height: .8;
  }*/

  .featurette-heading {
    font-size: 45px;
  }
 

}

@media (min-width: 62em) {
  .featurette-heading {
    margin-top: 0rem;
  }
}

/* ----------------- MEDIA QUERIES ---------------*/
/* ===============================================*/


@media (max-width: 1200px) { 

  .nav-sidebar ul li {
    font-size:1.3rem;
  }

.one > li {
 width:225px;
 margin: 0 0;
}

.one > li .wrapper {
  width:223px; 
}

.one > li span {
    width:460px; 
}


.main-slider {
    display:block;
    margin-left:auto;
    margin-right:auto;
    max-width:450px;
    
  }

.service-icons h3 {
  font-size:.8em;
}

.main-carousel .carousel-item {
        background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/covers/cover-3.jpg) no-repeat center center fixed;

}
.top-row-associations img {
    max-width:280px!important;
    margin-top:10px;
  }

}

@media (max-width: 991.98px) { 

[data-symbol]>.header {
    padding: .25rem .5rem; text-align: center; border-radius: 50%;

    /* responsive sizes: p1(320,50) p2(1920,180) */
    width : calc(8.125vmin + 54px);
    height: calc(8.125vmin + 54px);

    /*
        responsive fontsize: p1(320,6) p2(1920,20)
        Whether this works as expected depends on the minimum browser
        fontsize set by the user (content may overflow .header when set >6px)

        Tested defaults on W10:
        Edge2020 overflows, while Chrome, Firefox and IE11 do not
    */
    font-size: calc(.875vmin + 3.2px)
}

  .box > .icon > .info > h3.title {

    font-size: 2rem;

    margin-top: 1rem;
}

.branch-box {
  
}

.branch-box h2 {
  font-size:2.5rem;
  text-align: center;
  margin-bottom:0px;

}
.branch-box h3 {
  font-size:1.9rem;
}

.rounded-bg {

  height:200px;
  width:200px;

}

.branch-box ul li {
  padding:10px 10px 10px 0px;
  font-size:1rem;
}

  .skewed-bg .content .text {
    width: 88%;
}

.navbar {
  margin-top:0px;
  height: auto;

}

.navbar-nav {
  margin-top:5px;
}

  .top-row-associations img {
    max-width:280px!important;
  }
  .associations img {
    max-width:250px;
  } 

.main-carousel .carousel-item {
        background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/covers/cover-3.jpg)no-repeat center center fixed;

}


 /* drowndown old

  .d-down {
  margin-top: 0px;
  background-color:#fff;
  padding-left:0px;
  padding-right:0px;
  text-align:center;
  }

  .d-down li {
  border-bottom:solid 1px #cecece;
  } */

.carousel-caption {

  top:57%;
  left:0%;
}

.logo {
  margin-top:0px;
  max-width:140px;
}

    .d-down {
  margin-left:auto;
  margin-right:auto;
  display:block;

  background-color:#23468c;

  padding-left:0px;
  padding-right:0px;
  text-align:center;
  max-width:80%;
  -webkit-border-radius:10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
  }

  .d-down li {
  text-align: center;
  }

  .navbar-services {
    display:none;
  }

  .carousel-heading{
    font-size:4em;
  }

.nav-item a:focus, .nav-item a:hover {
    border-radius: 10px;
    padding-left: 0px;
    /* box-sizing: border-box; */
    color: #fff;
    margin-left: 0px;
    margin-right: 0px;
}

.nav-item a{
  font-size:1.5rem;
}


.box-part{
    padding:40px 10px;
    margin:15px 0px;
    height:380px;
}

.w42 {
  width: 44.5%;
}

.main-carousel .carousel-item {
  height: 38rem;
}

.service-icons h3 {
  font-size:.7em;
}


}

@media (min-width: 768px) { 


  .featurette-image {
    text-align:center;
    display: block;
    margin-left:auto;
    margin-right: auto;
    max-width: 100%;
  }

  

}

@media (max-width: 768px) { 

.cta-contact h2{
 
  font-size:3.2rem!important;
  
}


  .btn-view-all2 {

    width: 65%;
}

  .wwd-m {
    margin-top:0px!important;
  }

  .card-text {
    margin-bottom: 0;
    text-align: center;
    font-size: 1.2rem;
}

  .card-title {
    text-align: center;
}


#what-we-do .card .card-block:before {
  position:relative;
  text-align:center;
  display:block;
  font-size:77px;
}
  #what-we-do .card .card-block {
    padding-left:0px;
  }

  .nav-sidebar { ;
    padding: 0px 0; 
    border-right: none;
    text-align: center;
}

.course-container {
  padding-top: 0px;
}

.one > li {
 width:225px;
 margin: 0 10px;
}

.one > li .wrapper {
  width:223px; 
}

.one > li span {
    width:460px; 
}


  .branch-box ul li {
  padding-left:20px;
  font-size:1rem;
}

  .box > .icon > .info > p {
    font-size: 23px;
}



  .skewed-bg {
  
  height:1194px;
  margin-bottom:800px;
 
}

.top-row-associations img {
    max-width:200px!important;
  }
.main-carousel .carousel-item {
        background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/covers/cover-3.jpg)no-repeat center center fixed;

}

  .service-icons h3 {
  font-size:.9em;
}

  .associations img {
    max-width:150px;
  }

  .mission {
    height:475px;
  }

  #myFooter li {
    font-size:.85rem;
    text-align:center;
  }

  #myFooter h5 {
    text-align:center;
  }

.reviews span {
  font-size:.8rem;
  line-height: .4rem;
}

.box-part{
  height:350px;
}

.carousel-heading {
  font-size: 2.9rem;
}

.main-subheader {
  font-size:1.5em !important;
}
.carousel-caption p {
    font-size: 1rem;

  }

   .main-subheader {
  font-size:1.8em;
 } 

   .main-subheader p {
  margin-left:auto;
  margin-right:auto;
  display:block;
 } 



  .carousel-caption {
    padding:0px 0px 0px 0px;
  }


.main-carousel .carousel-item {
  height: 40rem;
}

.tl {
  line-height:35px;
  padding-bottom:0rem;
}

.w42 {
  width: 43%;
}

.text-lg {
  font-weight:bold;
  font-size:1.9rem !important;
  color: white;
}


#myFooter h2 {
  text-align: center; 
}

.search-bar {
  margin-top:1em;
}

.sidebar-header {
  text-align: center;
}

.category-link {
  text-align: center;
}

.archive-link {
  text-align: center;
}

.sidebar ul li {
  margin-left:0;
}

.search_input2 {
  width:270px;
}



}

@media (max-width:640px) {
  [data-symbol]>.header {
    padding: .25rem .5rem; text-align: center; border-radius: 50%;

    /* responsive sizes: p1(320,50) p2(1920,180) */
    width : calc(8.125vmin + 24px);
    height: calc(8.125vmin + 24px);

    /*
        responsive fontsize: p1(320,6) p2(1920,20)
        Whether this works as expected depends on the minimum browser
        fontsize set by the user (content may overflow .header when set >6px)

        Tested defaults on W10:
        Edge2020 overflows, while Chrome, Firefox and IE11 do not
    */
    font-size: calc(.875vmin + 3.2px)
}

  .jumbotron-service {
     height:300px;
  }

  .jumbotron-about {
       height:330px;
    }

    .carousel-heading {
  font-size: 2.3rem;
}

.main-subheader {
  font-size:1.3em !important;
}
.carousel-caption p {
    font-size: .5rem;

  }

  .carousel-caption a{
    font-size:2em;
  }
 
 .carousel-number a {
  font-size: 1rem !important;
 }

 .main-carousel .carousel-item {
        background: 
      linear-gradient(
        rgba(40, 40, 40, 0.25), 
        rgba(0, 0, 0, 0.45)
      ),
      url(../img/covers/cover-3.jpg)no-repeat center center fixed;

}

.mrn2 {
  margin-right:-20px;
}

}

@media (max-width: 576px) {

.cta-contact h2{
 
  font-size:2.2rem!important;
  
}

.cta-contact h3 {
    font-size:1.5rem;
}

  .numberlist .fa-li {
    left:.1em;
  }

.one > li {
 width:100%;
 margin: 0 0px;
}

.one > li .wrapper {
  width:90%; 
}

.one > li span {
    width:460px; 
}


.branch-box ul {
  text-align: center;
  padding-left:0px;
  margin-top:10px;
}

.branch-box ul li {
  text-align: center;
  padding-left:0px;
  font-size:1.3rem;
}

.mobile-margin {
  margin-top:-17px!important;
}

  .top-row-associations img {
    max-width:150px!important;
  }

  .associations img {
    max-width:100%;
  }


.reviews span {
  font-size:.8rem;
  line-height: .4rem;
}


.box-part{
    padding:40px 10px;
    margin:15px 0px;
    height:300px;
}

.carousel-caption {
  top: 58%;
  margin-right:0%!important;
  transform: translateY(-50%);
}



.searchbar:hover > .search_input {

    width: 281px;


}

.search_input2 {
  width:170px;
}

.main-carousel .carousel-item {
  height: 43rem;
  background-attachment: scroll;

}

.w42 {
  width: 41.5%;
}

#btn_cont {
  position:static;
}

#btn_cont span{
  position: relative;
  margin-top: .2rem;
  font-size: .7rem;
}

.box > .icon > .info > p {
    font-size: 18px;
}




}

@media (max-width: 380px) {

  .coursecontent h1 {
    font-size: 1.5rem;
}

 .mission {

    height:560px;
  }

  .mission .lead {
    font-size:1.1rem;
  }

  .carousel-number a {
  font-size:.8rem;
}
  
  .mobile-font {
    font-size:.8rem;
  }

  .main-carousel .carousel-item {
    height:50rem;
  }

  .carousel-caption {
    top: 54%;
    margin-right: 0%!important;
    transform: translateY(-50%);
}
}