/** Maom Font Family and Color **/

  body {
    font-family: Lato, "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: #555459;

  }

/** Top Navbar **/

  /** Make top Navbar always appear **/
  .navbar {
    opacity: 1;
    margin-top: -0px;
  }

  /** Logo in Navbar positioning **/
  .navbar-brand {
    padding-top: 20px;
  }

  /** Menu button on small screens **/
  .navbar-toggle {
    background-color: #49b6d6!important;
    border-color: #49b6d6!important;
  }

  /** Links styling in Navbar **/
  .navbar-default .navbar-nav>li>a {
    color: #404b55;
    font-size: 1rem;
    font-weight: 700;
  }

/** Intro Section

  /** Intro section push below top navbar, remove padding **/
  .intro {
      /*margin-top: 80px;*/
  }

/** New Smaller Intro Section

  /** Intro Small Height **/
  .intro-small {
    min-height: 300px;
    background-attachment: initial;
  }

  .intro-schedule {
    height: 100px!important;
    background-image: url(../images/backgrounds/bg.jpg)!important;
    -webkit-background-size: cover;
            background-size: cover;
  }

  /** Intro small padding **/
  section.intro-small {
    padding: 25px 0;
  }

  /** Put Small Intro Text in Box **/
  .intro-small .intro-section {
    background-color: rgba(0,0,0,0)!important;
    padding: 50px 50px;
    border-radius: 25px;
  }

  /** Small Intro Header1 Styling **/
  .intro-small .intro-section h1 {
      color: #fff;
      padding: 0px 0;
      padding-bottom: 10px;
      line-height: 1.3em;
      font-size: 3.0rem;
      letter-spacing: -2px;
      text-shadow: 0 1px 10px rgba(0,0,0,.5);
      font-weight: 900;
  }

  /** Small Intro Header1 Font Size on Mobile **/
  @media (max-width: 1024px) {
    .intro-small .intro-section h1 {
      font-size: 2.4rem!important;
    }
  }

  /** Small Intro Header2 Styling **/
  .intro-small .intro-section h2 {
    color: #fff;
    padding: 0px 0;
    padding-bottom: 30px;
    line-height: 1.3em;
    font-size: 22px;
  }

  /** Images Background for different Small Intro Sections **/

    /*.intro-providers {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
    }

    .intro-rhc {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
    }

    .intro-contact {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
    }

    .intro-about {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
    }

    .intro-faq {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
    }

    section.intro-programs {
        background-image: url(images/bg.jpg)!important;
        -webkit-background-size: cover;
                background-size: cover;
        padding: 0;
    }*/

/** New Small Intro Slider section (used for Other programs) **/

    #intro .intro-slider-small, #intro .intro-slider-small .item {
        height: 350px;
    }
    #intro .intro-slider-small .container {
        padding: 0;
    }
    #intro .intro-slider-small .owl-controls {
        position: absolute;
        top: 50%;
        margin-top: -27px;
        width: 100%;
    }
    #intro .intro-slider-small .owl-controls .owl-prev {
        float: left;
        margin: 0 10px;
    }
    #intro .intro-slider-small .owl-controls .owl-next {
        float: right;
        margin: 0 10px;
    }
    @media (max-width: 1200px) {
        .intro .intro-section {
            max-width: 100%;
        }
    }
    @media (max-width: 767px) {
        #intro .intro-slider-small .owl-controls {
        }
    }

/** Modification to Big Intro section **/

  /** Background Image **/
  .intro {
      background-image: url(../images/backgrounds/bg.jpg);
      background-attachment: initial;
      background-size: 100%;
      background-position: 0% 100%;
      -webkit-background-size: cover;
              background-size: cover;
  }

  /** Make Intro-section area wider to fit more text **/
  .intro .intro-section {
    max-width: 80%;
  }

  @media (max-width: 767px) {
      .intro .intro-section {
          max-width: 100%;
      }
  }

  /** Optimizing Intro Size and Intro Section box for Mobile **/
  @media (max-width: 375px) {
    .intro-big {
      min-height: 500px;
      padding-top: 50px;
    }

  }
  @media (max-width: 320px) {
    .intro-big {
      padding-top: 35px;
    }
  }

  /** Put Big Intro Text in Box **/
  .intro-big .intro-section {
    background-color: rgba(0,0,0,0)!important;
    padding: 0px 0;
    border-radius: 25px;
  }

  /** Big Intro Header1 Styling **/
  .intro-big .intro-section h1 {
      color: #fff;
      padding: 20px 0;
      padding-bottom: 10px;
      line-height: 1.3em;
      font-size: 3.0em;
      letter-spacing: -2px;
      text-shadow: 0 1px 10px rgba(0,0,0,.5);
      font-weight: 900;
  }

  /** Big Intro Header1 font-size on mobile view **/
  @media (max-width: 480px) {
    .intro-big .intro-section h1 {
      font-size: 3.0rem!important;
    }
  }

  /** Big Intro Header2 Styling **/
  .intro-big .intro-section h2 {
  color: #fff;
  padding: 0px 0;
  padding-bottom: 30px;
  line-height: 1.3em;
  font-size: 22px;
  }

  /** Big Intro Paragraph Text Styling **/
  .intro-section p {
    color: white;
  }

  a.start {
    color: #49b6d6;
    font-weight: 600;
    font-size: 16px;
  }
  a:hover.start {
    color: white;
  }

  /** Big Intro Custom button Styling **/
  .btn-custom-home {
      color: #49b6d6;
      border-color: #49b6d6;
  }

  .btn-custom-home:hover {
      color: #fff;
      background-color: #49b6d6;
  }

/** Layout for Detail Pages of website **/

  .page-description {
    background: #f9f9f9;
    padding: 50px 0;
  }
  .page-details {
    padding: 50px 0;
  }

/** Space between different section, make smaller (Disabled because it messes up scrolling) **/
  /** section {
    padding: 25px 0;
  } **/

  /** Space below section title **/
  .section-head {
  margin-bottom: 40px;
  }

/** Button Styling **/
  /** Add rounded corners to buttons **/
    .btn {
      border-radius: 30px;
      white-space: normal;
      margin-bottom: 10px;
    }

    /** Change Success Color to Enara's color **/
      .btn-success {
        background-color: #49b6d6!important;
        border-color: #49b6d6!important;
      }

  /** Color changes to button default **/
    .btn-default {
      border-color: #49b6d6;
      color: #49b6d6;
    }
    .btn-default:hover {
      background-color: #49b6d6!important;
      border-color: #49b6d6;
      color: white!important;
    }
    .btn-default:focus {
      background-color: transparent;
      border-color: #49b6d6;
      color: #49b6d6;
    }

  /** Size changes to buttom small **/
    .btn-xs {
      font-size: 15px!important;
    }

    @media (max-width: 767px) {
      .btn-xs {
        width: 100%;
      }
    }

/** Modal Popups **/

  /** Make Modal popup appear over top navbar **/
  .modal {
    z-index: 10000;
  }

  /** Make Modal popup shift under top navbar **/
  .modal-dialog {
    margin-top: 90px;
    text-align: left;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
  }

  /** Modal Title **/
  .modal-title {
    text-align: center;
    color: #49b6d6;
  }

/** Un-ordered list in Services Modal **/
  ul.program {
    padding-left: 30px;
  }

  li.program {
    list-style: initial;
  }

/** Chagnes to Features Section (Used for Enara Difference) **/

  /** Change background of section to be able to adjust image opacity **/
  .features {
    background-color: transparent;
    position: relative;
    overflow: hidden;
  }

  .features:before {
      content: ' ';
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      z-index: 1;
      opacity: 0.25;
      background-image: url(../../images/screenshots/introscreen/ipad1.jpg);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 100%;
      -ms-background-size: cover;
      -o-background-size: cover;
      -moz-background-size: cover;
      -webkit-background-size: cover;
      background-size: cover;
  }

  /** Eliminate margin-top for each difference (feature) **/
  .features .features-right {
    margin-top: 0;
  }

  /** Changes to Each difference positioning **/
  .client-data {
    border-right: 0px solid #e1e1e1;
    margin-bottom: 50px;
    float: left;
  }
  .client-image {
    float: left;
  }
  .client-image i {
    border: 7px solid #f2f2f2;
    border-radius: 50%;
    color: #49b6d6;
  }
  .client-name {
    float: none;
    padding: 15px 0 0 110px;
  }
.testemonial .client-data {
    width: 100%;
    float: none;
    text-align: center;
}
.testemonial .client-image, .testemonial .client-name {
    display: inline-block;
    vertical-align: middle;
    float: none;
    padding-top: 0;
}

/** Modification to How it works section **/

  /** Width of each screen (for text alignment) **/
  @media (min-width: 768px) {
    .screen p {
      padding-right: 10%;
      padding-left: 10%;
    }
  }

  @media (max-width: 768px) {
    .screen {
      padding-right: 5%;
      padding-left: 5%;
    }

    /** For pic description alignment **/
    .screen p {
      min-height: 125px;
    }
  }


  /** How it works slider controllers **/

    /** margins for small screen **/
    @media (max-width: 480px) {
      .screens .owl-next {
          right: -15px;
          z-index: 100;
          margin-top: 25px;
      }
      .screens .owl-prev {
          left: -20px;
          z-index: 100;
          margin-top: 25px;
      }
    }

    @media (min-width: 992px) {
      .screens .owl-next {
        right: -26px;
      }
    }

    .owl-theme .owl-controls .owl-buttons div.disabled
    {
        display: none;
    }

/** Team section of About page **/

  .team {
    float: left;
    padding: 60px 0 0 20px;
    text-align: center;
  }


  ol {
    padding-left: 50px;
  }

/** Styling for panel collapsable, used for FAQs and Enara Programs details **/
  .panel-default>.panel-heading {
    background-color: #49b6d6;
    border-color: #ddd;
    border: 0px;
    color: white;
    border-radius: 30px;
  }

  .panel-group .panel {
    border-radius: 30px;
  }

  .panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: white;
  }

/** Overlapping Circles for Other Programs Page **/

    .page-description.other-programs {
      height: 400px;
        position: relative;
    }

    .circles-holder {
        position: absolute;
        height: 100%;
        left: 50%;
        margin-left: -310px;
        margin-top: -25px;
    }
    div.circle {
      width: 420px;
      height: 300px;
      position: absolute;
      border-radius: 50%;
    }
    .circle-popup {
        position: fixed;
        top: 80px;
        left: 0;
        background: rgba(255,255,255,0.8);
        color: #000;
        height: auto;
        width: 100%;
        padding: 30px;
        display: none;
        text-align: left;
        z-index: 300;
    }
    .circle-popup:hover {display: block !important;}
    .circle-popup p {
        font-size: 18px;
        line-height: 1.6;
    }

    @media (max-width: 767px) {
      .circles-holder .btn-xs {
        width: auto;
      }
        .circle-popup {
            display: none !important;
        }
    }
    .outer {
      background-color: rgba(73,182,214, 0.5);
      z-index: 10;
    }
    .outer:hover {
      background-color: rgba(73,182,214, 0.8);
    }
    .mid {
      background-color: rgba(167,169,171, 0.5);
      z-index: 15;
    }
    .mid:hover {
      background-color: rgba(73,182,214, 0.8);
    }

    #outer1 {
      left: 0px;
      top: 0px;
      padding-top: 100px;
      padding-right: 180px;
      padding-left: 00px;
    }

    #outer2 {
      left: 200px;
      top: 0px;
      padding-left: 175px;
      padding-top: 100px;
    }
    .circle-middle {
        width: 220px;
        height: 300px;
        overflow: hidden;
        position: absolute;
        left: 200px;
        z-index: 300;
    }
    #midw1 {
      left: 0px;
      top: 0px;
      overflow: hidden;

    }

    #mid1 {
      left: -200px;
      top: 0px;
      text-align: center;
      padding-left: 200px;
      padding-top: 100px;
    }

    .btn-xs {
      font-size: 15px!important;
      padding: 10px 20px;
    }
    @media (max-width: 640px) {
        .page-description {
            height: 615px;
            padding: 20px 0;
        }
      .circles-holder {
        margin-left: -150px;
      }
        div.circle {
            width: 300px;
            height: 360px;
        }
        #outer1 {
            padding-top: 30px;
            padding-right: 0;
        }
        #outer2 {
            padding-left: 0;
            padding-top: 95px;
            top: 180px;
            left: 0;
        }
        .circle-middle {
            left: 0;
            top: 180px;
            width: 300px;
            height: 180px;
        }
        #midw1 {
            top:-180px;
        }
        #mid1 {
            padding-right: 0;
            padding-top: 25px;
            padding-left: 0 ;
            top: 180px;
            left: 0;
        }
    }

/** New Free Flow Two Section for Random stuff **/

  /** Random Section 1 **/
  .random-section-1 {
    background: #49b6d6;
    color: white;
    padding: 50px 0;
  }

  .btn-random {
      background-color: transparent;
      color: #fff;
      border-color: #fff;
  }

  .btn-random:hover {
      color: #49b6d6;
      background-color: #fff;
      border-color: #f9f9f9;
  }

  /** Random Section 2 **/

  /** Random Section 1 **/
  .random-section-2 {
    background-image: url(../../images/screenshots/introscreen/ipad3.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    -ms-background-size: cover;
    -o-background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
    color: white;
    padding: 50px 0;
  }







body{background-color:#000;height:100%;position: relative;}
html{height:100%;}
.btn-slide{background:transparent;font-size:78px;width:32px;opacity:0.4;}
    .btn-slide:hover{background:transparent;opacity:0.9;}
.logo{margin-top:100px;}
.intro{background-position:center 100%;background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("../images/backgrounds/bg.jpg");}
.intro-big{min-height:100%;height:auto !important;height:100%;}
.intro-big .intro-section{padding:0 55px;}
.intro .intro-slider, .intro .intro-slider .item{height: 100% !important;}
.owl-carousel{position:static !important;}
.owl-carousel .owl-wrapper-outer{position:absolute;top:0;left:0;right:0;bottom:0;}
.owl-carousel .owl-wrapper{position:absolute;top:0;bottom:0;}
#intro .intro-slider .owl-controls .owl-prev {position:absolute;left:40px;top:50%;margin-top:-27px;z-index:10;}
#intro .intro-slider .owl-controls .owl-next {position:absolute;right:40px;top:50%;margin-top:-27px;z-index:10;}
#intro .intro-slider .owl-pagination{position:absolute;bottom:54px;left:0;right:0;z-index:10;}
.nav-login{position:absolute;bottom:0;left:0;right:0;background: rgba(0, 0, 0, 0) linear-gradient(rgba(73, 182, 214, 0.7), rgba(73, 182, 214, 0.7)) repeat scroll 0 0;
    border-top: 1px solid #fff;color: white;font-size: 18px;padding-bottom:8px;padding-top:7px;text-align:center;z-index:12;}

@media screen and (max-width:480px){
    .intro-big .intro-section{padding:0 20px;}
    .logo{margin-top:20px;}
    #intro .intro-slider .owl-controls .owl-prev{left:10px;}
    #intro .intro-slider .owl-controls .owl-next{right:10px;}
}