/*!
 * Start Bootstrap - Grayscale Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    width: 100%;
    height: 100%;
    font-family: 'open_sansregular';
    color: #000;
}

html {
    width: 100%;
    height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6,
.title {
    margin: 0 0 25px;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
}

p {
    margin: 0 0 15px;
    line-height: 1.5;
}

@media(min-width:768px) {
    p {
        margin: 0 0 15px;
        line-height: 1.6;
    }
}

a {
    color: #30a9e0;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

a:hover,
a:focus {
    text-decoration: none;
    color: #1d9b6c;
}

.light {
    font-weight: 400;
}

.navbar-default {
    background-color: #fff;
    border: 0px solid #fff;
    border-top: 3px solid #62328c;
    margin: 0;
} 
.navbar-default .navbar-toggle, .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    background-color: transparent;
    border: 0px solid;
    margin-top: 30px;
}
#nav-icon2 {
  width: 38px;
  height: 38px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}


/* Icon 2 */

#nav-icon2 {
}

#nav-icon2 span {
  display: block;
  position: absolute;
  height: 4px;
  width: 50%;
  background: #62328c;
  opacity: 1;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon2 span:nth-child(even) {
  left: 50%;
  border-radius: 0 9px 9px 0;
}

#nav-icon2 span:nth-child(odd) {
  left:0px;
  border-radius: 9px 0 0 9px;
}

#nav-icon2 span:nth-child(1), #nav-icon2 span:nth-child(2) {
  top: 0px;
}

#nav-icon2 span:nth-child(3), #nav-icon2 span:nth-child(4) {
  top: 13px;
}

#nav-icon2 span:nth-child(5), #nav-icon2 span:nth-child(6) {
  top: 26px;
}

#nav-icon2.open span:nth-child(1),#nav-icon2.open span:nth-child(6) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

#nav-icon2.open span:nth-child(2),#nav-icon2.open span:nth-child(5) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#nav-icon2.open span:nth-child(1) {
  left: 5px;
  top: 7px;
}

#nav-icon2.open span:nth-child(2) {
  left: calc(50% - 5px);
  top: 7px;
}

#nav-icon2.open span:nth-child(3) {
  left: -50%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(4) {
  left: 100%;
  opacity: 0;
}

#nav-icon2.open span:nth-child(5) {
  left: 5px;
  top: 16px;
}

#nav-icon2.open span:nth-child(6) {
  left: calc(50% - 5px);
  top: 16px;
}


.navbar-brand {
    height: auto;
}
.call {
    float: right;
    font-size: 18px;
    color: #666;
    padding: 15px 0;
}
.call span {
    padding-left: 15px;
}
.call i {
    padding-right: 10px;
}
.nav.navbar-nav {
    background-color: #30a9e0;
    color:#fff;
    margin: 0;
}
.nav.navbar-nav li a {
    color: #fff;
    padding: 20px 15px;
  font-family: 'Montserrat';
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    background-color: #593582;
    color: #fff;
}

@media (max-width: 991px) {
    .navbar-collapse {
        padding: 0;
    }
    .call {
        float: none;
    }
    .call + br {
        display: none;
    }
    .nav.navbar-nav li a {
        padding: 15px 20px;
    }
}
.intro {
    width: 100%;
    height: 100vh;
    padding: 119px 0 100px 0;
    text-align: center;
    position: relative;
    color: #fff;
    background-color: #000;
    background-image: url(../images/sak-building.jpg);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
    background-position: center center;
  min-height: 400px;
}
.intro::before {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  content: '';
  background-color: rgba(0, 0, 0, 0.35);
}
#slides {
  position: absolute !important;
  left: 0;
  top: 0;
  width: 100%;
  height: 100% !important;
  z-index: 0;
}


.intro .intro-body {
    height: 100vh;
    text-align: left;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flex;
    display: -o-flex;
    display: flex;
    align-items: center;
}

.intro .intro-body .brand-heading {
    font-size: 26px;
    letter-spacing: -0.5px;
}
.intro .intro-body .brand-heading span {
    font-size: 20px;
}

.intro .intro-body .intro-text {
    font-size: 14px;
    font-style: italic;
}

@media (min-width:768px) {
    .intro {
        padding: 0;
    }

    .intro .intro-body {
            padding-top: 119px;
    }
    .intro .intro-body .brand-heading {
        font-size: 40px;
      line-height: 50px;
    }

    .intro .intro-body .brand-heading span {
        font-size: 30px;
    }
    .intro .intro-body .intro-text {
        font-size: 16px;
    }
}

.btn-circle {
    width: 70px;
    height: 70px;
    margin-top: 15px;
    padding: 7px 16px;
    border: 2px solid #fff;
    border-radius: 100%!important;
    font-size: 40px;
    color: #fff;
    background: 0 0;
    -webkit-transition: background .3s ease-in-out;
    -moz-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
}

.btn-circle:hover,
.btn-circle:focus {
    outline: 0;
    color: #fff;
    background: rgba(255,255,255,.1);
}

.btn-circle i.animated {
    -webkit-transition-property: -webkit-transform;
    -webkit-transition-duration: 1s;
    -moz-transition-property: -moz-transform;
    -moz-transition-duration: 1s;
}

.btn-circle:hover i.animated {
    -webkit-animation-name: pulse;
    -moz-animation-name: pulse;
    -webkit-animation-duration: 1.5s;
    -moz-animation-duration: 1.5s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-timing-function: linear;
}

@-webkit-keyframes pulse {    
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
}

@-moz-keyframes pulse {    
    0% {
        -moz-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -moz-transform: scale(1.2);
        transform: scale(1.2);
    }

    100% {
        -moz-transform: scale(1);
        transform: scale(1);
    }
}

section {
    padding: 50px 0;
}


#map {
    width: 100%;
    height: 400px;
}

.btn {
    border-radius: 0;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 400;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}

.btn-default {
    border: 1px solid #30a9e0;
    color: #30a9e0;
    background-color: transparent;
}

.btn-default:hover,
.btn-default:focus {
    border: 1px solid #30a9e0;
    outline: 0;
    color: #000;
    background-color: #30a9e0;
}
.planWrap h4 {
  padding: 20px 0;
  font-size: 18px;
  margin: 0;
}
.planImg {
  position: relative;
}
.planImg > img {
  width: 100%;
}
.planOverlay {
  position: absolute;
  display: block;
  opacity: 0;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: rgba(94, 51, 136, 0.9);
  transition: all 0.5s ease-in-out;
}
.planImg:hover .planOverlay {
  opacity: 1;
}
.planImg:hover + h4 {
  color: #5f3389;
}


.faciWrap {
  padding: 0 0 30px 0;
}
.faciWrap h4 {
  padding: 20px 0;
  font-size: 18px;
  margin: 0;
}
.faciImg {
  position: relative;
}
.faciImg > img {
    width: 100%;
}
.faciOverlay {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  transition: all 0.5s ease-in-out;
  text-align: center;
}
.faciImg:hover .faciOverlay {
  background-color: rgba(94, 51, 136, 0.9);
}
.faciOverlay > div {
  text-align: center;
}
.faciicon {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  text-align: center;
  background-color: #30a9e0;
  display: inline-block;
  transition: all 0.5s ease-in-out;
  position: relative;
}
.faciicon img.white {
  position: absolute;
  top: 17px;
  left: 17px;
  opacity: 1;
  transition: all 0.5s ease-in-out;
}
.faciicon img.black {
  position: absolute;
  top: 17px;
  left: 17px;
  opacity: 0;
  transition: all 0.5s ease-in-out;
}
.faciOverlay:hover .faciicon img.black {
  opacity: 1;
}
.faciOverlay:hover .faciicon img.white {
  opacity: 0;
}
.faciOverlay .title {
  color: #000;
  font-size: 16px;
  font-weight: normal;
  display: inline-block;
  margin-bottom: 0;
  padding-top: 5px;
  text-transform: uppercase;
  transition: all 0.5s ease-in-out;
}
.faciOverlay:hover .title {
  color: #fff;
}

.faciOverlay:hover .faciicon {
  background-color: #fff;
}

.panel-group .panel.panel-default {
  background-color: transparent;
  border: 1px solid #e8e8e8;
  border-radius: 0;
  box-shadow: none;
}

.panel-default > .panel-heading {
  background-color: #f7f7f7;
  border: 0px solid #e8e8e8;
  border-bottom: 1px solid #e8e8e8;
  color: #333;
  border-radius: 0;
  transition: all 0.5s ease-in-out;
  padding: 0;
  margin-bottom: -1px;
}

.panel-default > .panel-heading:hover {
  color: #000;
}

.panel-default > .panel-heading a {
  display: block;
  padding: 15px;
}

.panel-default > .panel-heading a:hover, .panel-default > .panel-heading a:focus {
  color: #000;
}

.panel-default > .panel-heading h4 {
  font-size: 14px;
  font-weight: 600;
  text-transform: none;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
  border: 0px solid;
  padding: 10px 15px;
}

.panel-default > .panel-heading {
  position: relative;
}
.panel-default > .panel-heading.minus {
  background-color: transparent;
}

.panel-default > .panel-heading:after {
  font-family: 'FontAwesome';
  position: absolute;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #e8e8e8;
  text-align: center;
  line-height: 25px;
  top: 9px;
  right: 9px;
  content: "\f107";
  transition: all 0.5s ease-in-out;
  font-weight: normal !important;
}

.panel-default > .panel-heading.plus:after {
  content: "\f107";
}

.panel-default > .panel-heading.minus:after {
  content: "\f106";
  line-height: 22px;
  background-color: #5d3387;
  color: #fff;
  border: 1px solid #5d3387;
}

.panel-group .panel + .panel {
  margin-top: 0;
}

* {
  outline: none !important;
}

.content-section {
  background-color: #191919;
  color: #8c8c8c;
  padding: 100px 0 0;
}
.content-section h4 {
  padding: 20px 0 15px 0;
  position: relative;
}
.content-section h4:after {
  width: 80px;
  height: 1px;
  content: "";
  background-color: #303030;
  position: absolute;
  left: 0;
  bottom: 0;
}

ul.social {
  list-style: none;
  padding: 20px 0 0 0;
}
ul.social li {
  list-style: none;
  display: inline-block;
  padding-right: 15px;
}
ul.social li a {
  width: 30px;
  height: 30px;
  text-align: center;
  line-height: 30px;
  border-radius: 50%;
  background-color: #333;
  display: block;
  color: #636363;
}
ul.social li a:hover {
  color: #fff;
}

ul.footerlist {
  list-style: none;
  padding: 0px 0 0 0;
}
ul.footerlist li {
  list-style: none;
  line-height: 30px;
}
ul.footerlist li a {
  color: #636363;
}

.address {
  padding: 5px 0 10px 24px;
}
.address .fa-fw {
    margin-left: -28px;
    margin-right: 10px;
    color: #30a9e0;
}
.content-section input.field, .content-section textarea {
  width: 100%;
  height: 38px;
  padding: 5px 10px;
  background-color: #303030;
  color: #8c8c8c;
  border: 0px solid;
  margin-bottom: 10px;
}
.content-section textarea {
  height: 100px;
}
.content-section .btn {
  padding: 10px 15px;
}
.btn.btn-primary {
  background-color: #30a9e0;
}

footer {
    padding: 30px 0;
    margin-top: 50px;
    border-top: 1px solid #303030;
}

footer p {
    margin: 0;
}
img {
  max-width: 100%;
}
::-moz-selection {
    text-shadow: none;
    background: #30a9e0;
    color: #fff;
}

::selection {
    text-shadow: none;
    background: #30a9e0;
    color: #fff;
}

img::selection {
    background: 0 0;
}

img::-moz-selection {
    background: 0 0;
}

body {
    webkit-tap-highlight-color: #30a9e0;
}
.planouter {
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  display: -o-flex;
  display: flex;
}
.planWrap {
  flex:1;
  padding: 5px;
}
@media (max-width: 767px) {
  .navbar-default .navbar-toggle, .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
    margin-top: 16px;
  }
  .navbar-brand > img {
    width: 100px;
  }
  .intro {
    padding: 50px 0;
  }
  .call {
    text-align: center;
  }
  .call span {
    display: block;
  }
  .planouter {
    display: block;
  }
  .planWrap {
    flex:;
    width: 49%;
    display: inline-block;
    vertical-align: top;
  }

}
@media (max-width: 479px) {
  .planWrap {
    width: 100%;
  }
}

ul.list1 {
  list-style: none;
  padding: 0;
}