@font-face {
	font-family: 'OpenSans-Regular';
	src: local('?'), url('../fonts/OpenSans-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'CenturyGothic-Regular';
	src: local('?'), url('../fonts/CenturyGothic-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'MyriadPro-Regular';
	src: local('?'), url('../fonts/MyriadPro-Regular.otf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-Light';
	src: local('?'), url('../fonts/OpenSans-Light.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-LightItalic';
	src: local('?'), url('../fonts/OpenSans-LightItalic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-Italic';
	src: local('?'), url('../fonts/OpenSans-Italic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'glyphicons-halflings-regular';
	src: local('?'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-Semibold';
	src: local('?'), url('../fonts/OpenSans-Semibold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-Bold';
	src: local('?'), url('../fonts/OpenSans-Bold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-BoldItalic';
	src: local('?'), url('../fonts/OpenSans-BoldItalic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'OpenSans-SemiboldItalic';
	src: local('?'), url('../fonts/OpenSans-SemiboldItalic.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Regular';
	src: local('?'), url('../fonts/Roboto-Regular.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Bold';
	src: local('?'), url('../fonts/Roboto-Bold.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Medium';
	src: local('?'), url('../fonts/Roboto-Medium.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-BoldCondensed';
	src: local('?'), url('../fonts/Roboto-BoldCondensed.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Roboto-Thin';
	src: local('?'), url('../fonts/Roboto-Thin.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Raleway-Medium';
	src: local('?'), url('../fonts/Raleway-Medium.ttf') format('truetype');
	font-weight: normal;
	font-style: normal;
}


body{margin:0; padding:0;  width: 100%; height: 100%; font-weight: 300; font-family:"OpenSans-Regular",Helvetica,Arial, OpenSans, sans-serif;}
.header{background:#fff; border-top: 3px solid #0fa1b6;}
.logo {
    padding: 20px 0;
}

.bdr-btm-drk-green {
       margin-top: 27px;
    padding-bottom: 14px;
    text-align: right;
}

.navbar {
    border: 0 !important; 
}
.img-c {
    display: inline-block !important;
}
.team-member {
    min-height: 263px;
    position: relative;
    margin-bottom: 50px;
}
.mg {
    margin-top: 37px;
    padding-bottom: 24px;
}
.member {
	/*min-height: 50px;*/
    font-size: 13pt;
    font-weight: 500;
    margin-bottom: 10px;
}
.img-center{margin-top: 5px !important;}
.list{padding:20px 0;}
.list li{list-style-type:none; background:url(../images/tic.png) no-repeat 0px 20px; padding:15px 0 0 30px !important; font-size:17px; line-height:25px; padding-top:10px;}
.structr_bg{background:#f3f3f3; padding:8px 10px;}
.structr_p{font-size:16px; text-align:justify;}
.structr_h4{font-size:21px; color:#04272e;}
.master{padding-top:30px; padding-bottom:30px; display:table;}
.col_space{padding-top:30px;}
.img_width{width:100%;}
.news_hding{font-size:20px; color:#000;}
.glry_style{padding:20px 0px;}
.galry_spac{padding:20px 0;}
.career_bg{background:#f0f0f0; padding:30px 30px; margin:30px 0;}
.career_h1{font-size:38px; color:#0e9aae; line-height:54px; font-family: 'CenturyGothic-Regular'; padding-bottom:20px;}
.career_text_styl{font-size: 20px;
    word-spacing: 4px;
    display: inline-block;
    font-family: 'OpenSans-Semibold';}
.career_text {
    font-size: 20px;
    word-spacing: 4px;
   
}
.margg-tp{margin-top: 16px;}
.aply_btn{background:#0d94a8; color:#fff; font-size:16px; padding:8px 55px; border-radius:5px;}
.aply_btn:hover{background:#096a78; color:#fff; text-decoration:none;}




.lst{color:#171717; font-family: "Roboto-Regular",Helvetica,Arial, Open Sans, sans-serif; font-size:20pt;}
.servsuv {
    color: #2b2b2b !important;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;
    list-style: none;
    font-size: 12pt;
    background: #f9f9f9;
    border: 2px solid #f9f9f9;
    margin-bottom: 0;
    padding: 10px 10px;
}
.deg-course{margin-top: 23px;
    font-size: 13pt;
    text-transform: uppercase;
    font-weight: 600;
    font-family: "OpenSans-Regular",Helvetica,Arial, Open Sans, sans-serif;}
.eligiblity {
    margin-top: 23px;
    font-size: 13pt;
    text-transform: capitalize;
    font-weight: 600;
    font-family: "OpenSans-Regular",Helvetica,Arial, Open Sans, sans-serif;
}	
.course-durtion{color: #3f3f3f;
    font-size: 12pt;
    font-family: "OpenSans-Italic";}	
.servsuv li {
       padding: 0px 3px;
    word-spacing: 2px;
    border-bottom: 1px solid #e4e4e4;
	font-size:12pt;
}

.servsuv span{ background: url(../images/time.png) no-repeat 2px 0px;}

.dte{color:#737373; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif; font-size: 10pt;
    padding-left: 21px;
}

.marq-bg{background: #f9f9f9; border: 2px solid #f5f3f3;}

.servsuv li a {
    text-decoration: none;
	 color: #2b2b2b !important;
	 font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;
}

.email{
    color: #252525;
    font-size: 11pt;
    margin-top: 19px;
	padding-left: 56px;
    text-align: left;
	background: url(../images/phone-call.png) no-repeat 27px 1px;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;
}

.phone {
    color: #252525;
    font-size: 11pt;
    text-align: left;
    padding-left: 56px;
    margin-top: 11px;
    background: url(../images/email.png) no-repeat 27px 1px;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;

}

.pdf {
    color: #252525;
    font-size: 11pt;
    text-align: left;
    padding-left: 31px;
    margin-top: 11px;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;
}

.pdf-file{color: #f00;
    font-size: 14pt;}

.loader {
    border: 6px solid #b8b4a7;
    background-color: #fff;
    border-radius: 50%;
    text-align: center;
    display: inline-block;
    width: 90%;
    padding: 25% 0;
}

.ld-txt {
    font-size: 20pt;
    margin-top: 16px;
    font-family: "Roboto-Regular", Georgia, Times, serif;
    color: #101519;
    line-height: 1.2em;
}

.testi-nme {
    color: #0a7e8e;
    font-size: 13pt;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;
}
.testi-msg{color: #151515;
    font-size: 12pt;
    margin-top: 30px;
    font-family: "OpenSans", Georgia, Times, serif;}
.testi-tit{color:#000000; font-size: 21pt;
    margin-top: 28px;
    font-family: "Roboto-Regular", Georgia, Times, serif;}
.pddd{padding-bottom: 269px;}
.bg-testi{background: url(../images/bttm-bnnr.jpg) no-repeat; background-size: cover;
    background-attachment: fixed;
    background-position: 100% 10%;
    background-repeat: no-repeat;
    display: block;}
.bck-img{background: url(../images/banner01-.jpg) no-repeat; background-size: cover;
    min-height: 413px;
    background-attachment: fixed;
    background-position: 100% 10%;
    background-repeat: no-repeat;
    display: block;}
.bck-img-nur{background: url(../images/nurse-banner.jpg) no-repeat;
    min-height: 413px;
    background-size: cover;
    background-repeat: no-repeat;
    display: block;}	
.hos{color: #fff;
    font-size: 28pt;
    word-spacing: 4px;
    text-align: left;
    padding: 21px 43px;
    font-family: "Roboto-Bold",Helvetica,Arial, Open Sans, sans-serif;}

.txt-cntr{color: #fff;
    font-size: 15pt;
    padding-top: 10px;
    font-family: "Roboto-Light",Helvetica,Arial, Open Sans, sans-serif;
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}


@keyframes fadeInUp{
0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
}

100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
}

}


.miss{color:#010101; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif; font-size:16pt;}
.abt-us{color:#171717; font-family: "Roboto-Regular",Helvetica,Arial, Open Sans, sans-serif; font-size:20pt;}
.abt-txt{color:#424242; font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif; font-size:11pt;}	
.pd-btm{padding-bottom: 41px;}
.sid{padding:0;}
.right-side{text-align:right;}

.bttnn{right: 223px;
    top: -9px;
    z-index: 999;
    position: absolute;
}

.bg-drk-green {
    display: inline-block;
    position: relative;
    padding: 1px 62px;
	padding-right: 40px;
    border-radius: 10px;
    background: #058d85;
    background: -webkit-linear-gradient(to right, #058d85, #07b5ab, #058d85);
    background: linear-gradient(to right, #058d85, #07b5ab, #058d85);
}

.box-titlee1 {
    color: #fff;
    font-size: 14.6pt;
	font-weight: 600;
    margin-top: 13px;
    text-align: center;
    font-family: "Raleway",Helvetica,Arial, Open Sans, sans-serif;
    text-shadow: 0px 2px 2px rgba(150, 150, 150, 1);
}

.box-titlee2 {
    color: #fff;
    font-size: 14pt;
    margin-top: -12px;
    text-align: center;
    font-family: "Raleway",Helvetica,Arial, Open Sans, sans-serif;
	 text-shadow: 0px 2px 2px rgba(150, 150, 150, 1);
}

.spc{padding:0;}
.inr_banner{background:url(../images/iner-banner.jpg) no-repeat; min-height:184px; padding:30px 0 20px; background-size:100% 100%;}
.inner_heading{font-size:38px; color:#fff; text-transform:uppercase;}
.sub_heading{font-size:26px; color:#282828;}
.sub_hdng_line{background:#05707f; width:67px; height:3px;}
.about_p{font-size:17px; color:#101010; padding-top:12px; line-height:26px;}
.contnt_spprt{padding-bottom:5px;}
.border_btm{border-bottom:1px solid #d2d2d2;}
.director_info{padding:20px 0;}
.dirctr_msg{font-size:17px; color:#101010; line-height:26px; padding-bottom:20px;}
.about_img{padding:30px 0; text-align:center;}
.bg-mid{background-color:#fff; padding-bottom: 20px;}
.marg{text-align:center; padding: 43px 10px;}
.bg-addr{text-align:left; float:left;}
.addrr{color:#191919; font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif; font-size: 14pt; font-weight: bold;}
.addrss{color:#323232; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif; font-size: 12pt; text-align:left;}
.addrmail{color:#323232; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif; font-size: 12pt; text-align:left;}
.addrphone{color:#323232; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif; font-size: 12pt; text-align:left;}
.suss {
    margin-left: 15px;
	padding: 8px 0px;
}
.suss span{font-size:10pt; font-family: "OpenSans-SemiBold",Helvetica,Arial, Open Sans, sans-serif; text-transform:uppercase;}
.btn-suss {
    color: #fff;
    background-color: #10a9bf !important;
    border-color: #039bb0 !important;
}
.btn-suss:hover {
    color: #fff;
    background-color: #10a9bf !important;
    border-color: #039bb0 !important;
}
.foot-soc a {
    margin: 0 2px 0 0;
}
.foot-soc li {
    margin-right: 4px;
    display: inline-block;
}
.foot-soc {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    text-align: left;
}
i.fb{color: #8f8f8f !important;}
i.fb{color: #8f8f8f !important;}
i.fb{color: #8f8f8f !important;}


.foot-soc .foot-linkdin a i{background: #ededed; border: 2px solid #8f8f8f;}
.foot-soc .foot-facebk a i{background: #ededed; border: 2px solid #8f8f8f;}
.foot-soc .foot-g-plus a i {background: #ededed; border: 2px solid #8f8f8f;}
.foot-soc .foot-twittr a i {background: #ededed; border: 2px solid #8f8f8f;}
.foot-soc .foot-deviantart a i{background: #23323d;}
.foot-soc .foot-linkdin a:hover i {background: #0077b5; color: #fff !important;}
.foot-soc .foot-facebk a:hover i {background: #4893ce; color: #fff !important;}
.foot-soc .foot-twittr a:hover i {background: #00b8e6; color: #fff !important;}
.foot-soc .foot-g-plus a:hover i {background: #bb0000; color: #fff !important;}
.foot-soc .foot-deviantart a:hover i {background: #adc376;}
.foot-soc a i {
    width: 35px;
    height: 35px;
    line-height: 32px;
    font-size: 13pt;
    color: #fff;
    -webkit-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    text-align: center;
    border-radius: 24px;
    padding: 0;
}
.bg-whte{background-color:#fff; padding-bottom:10px;}
.icon-grd{color:#0ea1b6; font-size: 24pt;}
.head {
    background-color: #04b1a7;
    color: #fff;
    text-transform: uppercase;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;
}
.mg-top{margin-top: 21px;}

.fnc {

  // main variables, basically everything depends on $slidingAT
  $slidingAT: 1s;
  $slidingDelay: $slidingAT / 3 * 2;
  $maskAT: $slidingAT*0.7;
  $headingAT: $slidingAT * 1.5;
  $controlAT: $slidingAT/2;
  $easing: ease-in-out;
  $blendMode: luminosity;

  $contentLeft: 40%;
  $contentTop: 40%;
  
  $headingPadding: 30px;
  $headingFontSize: 100px;
  
  $maskTop: 15%;
  $maskRight: 100% - $contentLeft;
  $maskHeight: 67vh;
  $maskWidth: $maskHeight * 0.75;

  $black: #1F2833;

  /* you can add color names and their values here
  and then simply add classes like .m--blend-$colorName to .fnc-slide 
  to apply specific color for mask blend mode */
  $bgColors: (
    dark: lighten(#242424, 20%),
    green: #42605E,
    red: lighten(#6A0A0D, 10%),
    blue: #2D7791
  );

  &-slider {
    overflow: hidden;
    box-sizing: border-box;
    position: relative;
    height: 100vh;

    *, *:before, *:after {
      box-sizing: border-box;
    }

    &__slides {
      position: relative;
      height: 100%;
      transition: transform $slidingAT $slidingDelay;
    }
    
    // iterate through color map and set colors for specific classes
    @each $colorTheme, $bgColor in $bgColors {
      .m--blend-#{$colorTheme} {
        .fnc-slide__inner {
          background-color: lighten($bgColor, 20%);
        }

        .fnc-slide__mask-inner {
          background-color: $bgColor;
        }
      }

      .m--navbg-#{$colorTheme} {
        background-color: $bgColor;
      }
    }
  }

  &-slide {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: translate3d(0,0,0);

    &.m--before-sliding {
      z-index: 2 !important;
      transform: translate3d(100%,0,0);
    }

    &.m--active-slide {
      z-index: 1;
      transition: transform $slidingAT $slidingDelay $easing;
      transform: translate3d(0,0,0);
    }

    &__inner {
      position: relative;
      height: 100%;
      background-size: cover;
      background-position: center top;
      transform: translate3d(0,0,0);

      .m--global-blending-active &,
      .m--blend-bg-active & {
        background-blend-mode: $blendMode;
      }

      .m--before-sliding & {
        transform: translate3d(-100%,0,0);
      }

      .m--active-slide & {
        transition: transform $slidingAT $slidingDelay $easing;
        transform: translate3d(0,0,0);
      }
    }

    &__mask {
      $activeDelay: $slidingAT + $slidingDelay/3;
      $xOffset: 200px;
      $yOffset: 0;
      $deg: 10deg;

      overflow: hidden;
      z-index: 1;
      position: absolute;
      right: $maskRight;
      top: $maskTop;
      width: $maskWidth;
      height: $maskHeight;
      margin-right: $headingPadding * -3;
      // This line basically does all magic with masking effect. Very simple and elegant. Webkit only atm.
      clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 0, 6vh 0, 6vh 61vh, 44vh 61vh, 44vh 6vh, 6vh 6vh);
      transform-origin: 50% 0;
      transition-timing-function: $easing;

      .m--before-sliding & {
        transform: rotate($deg*-1) translate3d($xOffset,0,0);
        opacity: 0;
      }

      .m--active-slide & {
        transition: transform $maskAT $activeDelay, opacity $maskAT/2 $activeDelay;
        transform: translate3d(0,0,0);
        opacity: 1;
      }

      .m--previous-slide & {
        transition: transform $maskAT $slidingDelay/2, opacity $maskAT/2 $maskAT/2 + $slidingDelay/2;
        transform: rotate($deg) translate3d($xOffset*-1,0,0);
        opacity: 0;
      }

      &-inner {
        z-index: -1;
        position: absolute;
        left: 50%;
        top: 50%;
        width: 100vw;
        height: 100vh;
        margin-left: -50vw;
        margin-top: -50vh;
        background-size: cover;
        background-position: center center;
        background-blend-mode: $blendMode;
        transform-origin: 50% (100vh - $maskHeight) / 2;
        transition-timing-function: $easing;

        .m--before-sliding & {
          transform: translateY($yOffset) rotate($deg) translateX($xOffset*-1) translateZ(0);
        }

        .m--active-slide & {
          transition: transform $maskAT $activeDelay;
          transform: translateX(0);
        }

        .m--previous-slide & {
          transition: transform $maskAT $slidingDelay/2;
          transform: translateY($yOffset) rotate($deg*-1) translateX($xOffset) translateZ(0);
        }
      }
    }

    &__content {
      z-index: 2;
      position: absolute;
      left: $contentLeft;
      top: $contentTop;
    }

    &__heading {
      margin-bottom: 10px;
      text-transform: uppercase;

      &-line {
        overflow: hidden;
        position: relative;
        padding-right: 20px;
        font-size: $headingFontSize;
        color: #fff;
        word-spacing: 10px;

        &:nth-child(2) {
          padding-left: $headingPadding;
        }

        .m--before-sliding & {
          transform: translateY(100%);
        }

        .m--active-slide & {
          transition: transform $headingAT $slidingDelay*1.5;
          transform: translateY(0);
        }

        .m--previous-slide & {
          transition: transform $headingAT;
          transform: translateY(-100%);
        }

        span {
          display: block;

          .m--before-sliding & {
            transform: translateY(-100%);
          }

          .m--active-slide & {
            transition: transform $headingAT $slidingDelay*1.5;
            transform: translateY(0);
          }

          .m--previous-slide & {
            transition: transform $headingAT;
            transform: translateY(100%);
          }
        }
      }
    }

    &__action-btn {
      $hoverAT: 0.3s;
      $fontSize: 20px;
      $vertPadding: 5px;
      $lineHeight: $fontSize + $vertPadding*2;

      position: relative;
      margin-left: 200px;
      padding: $vertPadding 15px;
      font-size: $fontSize;
      line-height: 1;
      color: transparent;
      border: none;
      text-transform: uppercase;
      background: transparent;
      cursor: pointer;
      text-align: center;
      outline: none;

      span {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        perspective: 1000px;
        transform-style: preserve-3d;
        transition: transform $hoverAT;
        transform-origin: 50% 0;
        line-height: $lineHeight;
        color: #fff;

        &:before {
          content: "";
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          border: 2px solid #fff;
          border-top: none;
          border-bottom: none;
        }

        &:after {
          content: attr(data-text);
          position: absolute;
          left: 0;
          top: 0;
          width: 100%;
          height: 100%;
          line-height: $lineHeight;
          background: $black;
          opacity: 0;
          transform-origin: 50% 0;
          transform: translateY(100%) rotateX(-90deg);
          transition: opacity $hoverAT/2 $hoverAT/2;
        }
      }

      &:hover span {
        transform: rotateX(90deg);

        &:after {
          opacity: 1;
          transition: opacity $hoverAT/2;
        }
      }
    }
  }

  &-nav {
    z-index: 5;
    position: absolute;
    right: 0;
    bottom: 0;

    &__bgs {
      z-index: -1;
      overflow: hidden;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
    }

    &__bg {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;

      &.m--nav-bg-before {
        z-index: 2 !important;
        transform: translateX(100%);
      }

      &.m--active-nav-bg {
        z-index: 1;
        transition: transform $slidingAT $slidingDelay;
        transform: translateX(0);
      }
    }
    
    &__controls {
      font-size: 0;
    }

    &__control {
      $controlWidth: 100px;

      overflow: hidden;
      position: relative;
      display: inline-block;
      vertical-align: top;
      width: $controlWidth;
      height: 50px;
      font-size: 14px;
      color: #fff;
      text-transform: uppercase;
      background: transparent;
      border: none;
      outline: none;
      cursor: pointer;
      transition: background-color $controlAT;

      &.m--active-control {
        background: $black;
      }

      &-progress {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 2px;
        background: #fff;
        transform-origin: 0 50%;
        transform: scaleX(0);
        transition-timing-function: linear !important;

        .m--with-autosliding .m--active-control & {
          transform: scaleX(1);
        }

        .m--prev-control & {
          transform: translateX(100%);
          transition: transform 0.5s !important;
        }

        .m--reset-progress & {
          transform: scaleX(0);
          transition: transform 0s 0s !important;
        }

        .m--autosliding-blocked & {
          transition: all 0s 0s !important;
          transform: scaleX(0) !important;
        }
      }
    }
  }

}


/* NOT PART OF COMMON SLIDER STYLES */
$font: 'Open Sans', Helvetica, Arial, sans-serif;
$creditsAT: 0.7s;
$creditsWidth: 400px;

.demo-cont {
  overflow: hidden;
  position: relative;
  height: 100vh;
  perspective: 1500px;
  background: #000;
  
  &__credits {
    box-sizing: border-box;
    overflow-y: auto;
    z-index: 1;
    position: absolute;
    right: 0;
    top: 0;
    width: $creditsWidth;
    height: 100%;
    padding: 20px 10px 30px;
    background: #303030;
    font-family: $font;
    color: #fff;
    text-align: center;
    transition: transform $creditsAT;
    transform: translate3d(100%,0,0) rotateY(-45deg);
    will-change: transform;
    
    .credits-active & {
      transition: transform $creditsAT $creditsAT/3;
      transform: translate3d(0,0,0);
    }
    
    *, *:before, *:after {
      box-sizing: border-box;
    }
    
    &-close {
      position: absolute;
      right: 20px;
      top: 20px;
      width: 28px;
      height: 28px;
      cursor: pointer;
      
      &:before,
      &:after {
        content: "";
        position: absolute;
        left: 0;
        top: 50%;
        width: 100%;
        height: 2px;
        margin-top: -1px;
        background: #fff;
      }
      &:before {
        transform: rotate(45deg);
      }
      &:after {
        transform: rotate(-45deg);
      }
    }
    
    &-heading {
      text-transform: uppercase;
      font-size: 40px;
      margin-bottom: 20px;
    }
    
    &-img {
      display: block;
      width: 60%;
      margin: 0 auto 30px;
      border-radius: 10px;
    }
    
    &-name {
      margin-bottom: 20px;
      font-size: 30px;
    }
    
    &-link {
      display: block;
      margin-bottom: 10px;
      font-size: 24px;
      color: #fff;
    }
    
    &-blend {
      font-size: 30px;
      margin-bottom: 10px;
    }
  }
}

.example-slider {
  z-index: 2;
  transform: translate3d(0,0,0);
  transition: transform $creditsAT;
  
  .credits-active & {
    transform: translate3d($creditsWidth*-1,0,0) rotateY(10deg) scale(0.9);
  }

  .fnc-slide {

    &-1 {
      .fnc-slide__inner,
      .fnc-slide__mask-inner {
        background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/142996/blackwidow.jpg');
      }
    }
    &-2 {
      .fnc-slide__inner,
      .fnc-slide__mask-inner {
        background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/142996/captainamerica.jpg');
      }
    }
    &-3 {
      .fnc-slide__inner,
      .fnc-slide__mask-inner {
        background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/142996/ironman-alt.jpg');
      }

      .fnc-slide__inner:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(255,255,255,0.1);
      }
    }
    &-4 {
      .fnc-slide__inner,
      .fnc-slide__mask-inner {
        background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/142996/thor.jpg');
      }

      .fnc-slide__inner:before {
        content: "";
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0,0,0,0.2);
      }
    }
  }

  .fnc-slide__heading,
  .fnc-slide__action-btn,
  .fnc-nav__control {
    font-family: $font;
  }
}

/* COLORFUL SWITCH STYLES 
   ORIGINAL DEMO - https://codepen.io/suez/pen/WQjwOb */
$w: 180px;
$_baseW: 280;
$h: $w * 120 / $_baseW;
$br: $w * 50 / $_baseW;
$outerOffset: 5px;
$animTime: 0.5s;
$dotS: $w * 8 / $_baseW;
$dotLeft: $w * 204 / $_baseW;
$dotLeftOffset: $w * -125 / $_baseW;
$offS: $w * 64 / $_baseW;
$onLeft: $w * 162 / $_baseW;
$onTop: $w * 35 / $_baseW;
$onWidth: $w * 30 / $_baseW;
$onHeight: $w * 56 / $_baseW;
$cubIn: cubic-bezier(.52,-0.96,.51,1.28);
$cubOut: cubic-bezier(.67,-0.16,.47,1.61);

@mixin switchOn() {
  .colorful-switch__checkbox:checked ~ .colorful-switch__label & {
    @content;
  }
}

.colorful-switch {
  position: relative;
  width: $w;
  height: $h;
  margin: 0 auto;
  border-radius: $br;
  background: #cfcfcf;

  &:before {
    content: "";
    z-index: -1;
    position: absolute;
    left: -$outerOffset;
    top: -$outerOffset;
    width: $w + $outerOffset*2;
    height: $h + $outerOffset*2;
    border-radius: $br + $outerOffset;
    background: #314239;
    transition: background-color 0.3s;
  }

  &:hover:before {
    background: #4C735F;
  }

  &__checkbox {
    z-index: -10;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
  }

  &__label {
    z-index: 1;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    border-radius: $br;
    cursor: pointer;
  }

  &__bg {
    position: absolute;
    left: 0;
    top: 0;
    width: $w * 3;
    height: 100%;
    background: linear-gradient(90deg, #14DCD6 0, #10E7BD $w, #EF9C29 $w*2, #E76339 100%);
    transition: transform $animTime;
    transform: translate3d($w*-2,0,0);

    @include switchOn {
      transform: translate3d(0,0,0);
    }
  }

  &__dot {
    position: absolute;
    left: $dotLeft;
    top: 50%;
    width: $dotS;
    height: $dotS;
    margin-left: $dotS/-2;
    margin-top: $dotS/-2;
    border-radius: 50%;
    background: #fff;
    transition: transform $animTime;
    transform: translate3d(0,0,0);

    @include switchOn {
      transform: translate3d($dotLeftOffset,0,0);
    }
  }

  &__on {
    position: absolute;
    left: $onLeft;
    top: $onTop;
    width: $onWidth;
    height: $onHeight;
    transition: transform $animTime;
    transform: translate3d(0,0,0);

    @include switchOn {
      transform: translate3d($dotLeftOffset,0,0);
    }

    &__inner {
      position: absolute;
      width: 100%;
      height: 100%;
      transition: transform $animTime/2 0s $cubIn;
      transform-origin: 100% 50%;
      transform: rotate(45deg) scale(0) translateZ(0);

      @include switchOn {
        transition: transform $animTime/2 $animTime/2 $cubOut;
        transform: rotate(45deg) scale(1) translateZ(0);
      }

      &:before,
      &:after {
        content: "";
        position: absolute;
        border-radius: $dotS/2;
        background: #fff;
      }
      &:before {
        left: 0;
        bottom: 0;
        width: 100%;
        height: $dotS+1px;
      }
      &:after {
        right: 0;
        top: 0;
        width: $dotS+1px;
        height: 100%;
      }
    }
  }

  &__off {
    position: absolute;
    left: $dotLeft;
    top: 50%;
    width: $offS;
    height: $offS;
    margin-left: $offS/-2;
    margin-top: $offS/-2;
    transition: transform $animTime;
    transform: translate3d(0,0,0);

    @include switchOn {
      transform: translate3d($dotLeftOffset,0,0);
    }

    &:before,
    &:after {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      width: 100%;
      height: $dotS;
      margin-top: $dotS/-2;
      border-radius: $dotS/2;
      background: #fff;
      transition: transform $animTime/2 $animTime/2;

      @include switchOn {
        transition-delay: 0s;
      }
    }
    &:before {
      transform: rotate(45deg) scaleX(1) translateZ(0);

      @include switchOn {
        transform: rotate(45deg) scaleX(0) translateZ(0);
      }
    }
    &:after {
      transition-timing-function: $cubOut;
      transform: rotate(-45deg) scaleX(1) translateZ(0);

      @include switchOn {
        transition-timing-function: ease;
        transform: rotate(-45deg) scaleX(0) translateZ(0);
      }
    }
  }
}

.fnc {
  /* you can add color names and their values here
  and then simply add classes like .m--blend-$colorName to .fnc-slide 
  to apply specific color for mask blend mode */
}
.fnc-slider {
  overflow: hidden;
  box-sizing: border-box;
  position: relative;
  height: 72vh;
}
.fnc-slider *, .fnc-slider *:before, .fnc-slider *:after {
  box-sizing: border-box;
}
.fnc-slider__slides {
  position: relative;
  height: 100%;
  -webkit-transition: -webkit-transform 1s 0.66667s;
  transition: -webkit-transform 1s 0.66667s;
  transition: transform 1s 0.66667s;
  transition: transform 1s 0.66667s, -webkit-transform 1s 0.66667s;
}
.fnc-slider .m--blend-dark .fnc-slide__inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--blend-dark .fnc-slide__mask-inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--navbg-dark {
 /* background-color: #e9e9e9;*/
}
.fnc-slider .m--blend-green .fnc-slide__inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--blend-green .fnc-slide__mask-inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--navbg-green {
  /*background-color: #e9e9e9;*/
}
.fnc-slider .m--blend-red .fnc-slide__inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--blend-red .fnc-slide__mask-inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--navbg-red {
 /* background-color: #e9e9e9;*/
}
.fnc-slider .m--blend-blue .fnc-slide__inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--blend-blue .fnc-slide__mask-inner {
  background-color: #e9e9e9;
}
.fnc-slider .m--navbg-blue {
  /*background-color: #e9e9e9;*/
}
.fnc-slider-background-bg{background-color: #e9e9e9;}

.fnc-slide {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.fnc-slide.m--before-sliding {
  z-index: 2 !important;
  -webkit-transform: translate3d(100%, 0, 0);
          transform: translate3d(100%, 0, 0);
}
.fnc-slide.m--active-slide {
  z-index: 1;
  -webkit-transition: -webkit-transform 1s 0.66667s ease-in-out;
  transition: -webkit-transform 1s 0.66667s ease-in-out;
  transition: transform 1s 0.66667s ease-in-out;
  transition: transform 1s 0.66667s ease-in-out, -webkit-transform 1s 0.66667s ease-in-out;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.fnc-slide__inner {
     position: relative;
    height: 100%;
    background-size: cover;
    background-position: bottom;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}
.m--global-blending-active .fnc-slide__inner, .m--blend-bg-active .fnc-slide__inner {
  background-blend-mode: luminosity;
}
.m--before-sliding .fnc-slide__inner {
  -webkit-transform: translate3d(-100%, 0, 0);
          transform: translate3d(-100%, 0, 0);
}
.m--active-slide .fnc-slide__inner {
  -webkit-transition: -webkit-transform 1s 0.66667s ease-in-out;
  transition: -webkit-transform 1s 0.66667s ease-in-out;
  transition: transform 1s 0.66667s ease-in-out;
  transition: transform 1s 0.66667s ease-in-out, -webkit-transform 1s 0.66667s ease-in-out;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.fnc-slide__mask {
  overflow: hidden;
  z-index: 1;
  position: absolute;
  right: 60%;
  top: 15%;
  width: 50.25vh;
  height: 67vh;
  margin-right: -90px;
  -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 0, 6vh 0, 6vh 61vh, 44vh 61vh, 44vh 6vh, 6vh 6vh);
          clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, 0 0, 6vh 0, 6vh 61vh, 44vh 61vh, 44vh 6vh, 6vh 6vh);
  -webkit-transform-origin: 50% 0;
          transform-origin: 50% 0;
  -webkit-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
}
.m--before-sliding .fnc-slide__mask {
  -webkit-transform: rotate(-10deg) translate3d(200px, 0, 0);
          transform: rotate(-10deg) translate3d(200px, 0, 0);
  opacity: 0;
}
.m--active-slide .fnc-slide__mask {
  -webkit-transition: opacity 0.35s 1.22222s, -webkit-transform 0.7s 1.22222s;
  transition: opacity 0.35s 1.22222s, -webkit-transform 0.7s 1.22222s;
  transition: transform 0.7s 1.22222s, opacity 0.35s 1.22222s;
  transition: transform 0.7s 1.22222s, opacity 0.35s 1.22222s, -webkit-transform 0.7s 1.22222s;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  opacity: 1;
}
.m--previous-slide .fnc-slide__mask {
  -webkit-transition: opacity 0.35s 0.68333s, -webkit-transform 0.7s 0.33333s;
  transition: opacity 0.35s 0.68333s, -webkit-transform 0.7s 0.33333s;
  transition: transform 0.7s 0.33333s, opacity 0.35s 0.68333s;
  transition: transform 0.7s 0.33333s, opacity 0.35s 0.68333s, -webkit-transform 0.7s 0.33333s;
  -webkit-transform: rotate(10deg) translate3d(-200px, 0, 0);
          transform: rotate(10deg) translate3d(-200px, 0, 0);
  opacity: 0;
}
.fnc-slide__mask-inner {
  z-index: -1;
  position: absolute;
  left: 50%;
  top: 50%;
  width: 100vw;
  height: 100vh;
  margin-left: -50vw;
  margin-top: -50vh;
  background-size: cover;
  background-position: center center;
  background-blend-mode: luminosity;
  -webkit-transform-origin: 50% 16.5vh;
          transform-origin: 50% 16.5vh;
  -webkit-transition-timing-function: ease-in-out;
          transition-timing-function: ease-in-out;
}
.m--before-sliding .fnc-slide__mask-inner {
  -webkit-transform: translateY(0) rotate(10deg) translateX(-200px) translateZ(0);
          transform: translateY(0) rotate(10deg) translateX(-200px) translateZ(0);
}
.m--active-slide .fnc-slide__mask-inner {
  -webkit-transition: -webkit-transform 0.7s 1.22222s;
  transition: -webkit-transform 0.7s 1.22222s;
  transition: transform 0.7s 1.22222s;
  transition: transform 0.7s 1.22222s, -webkit-transform 0.7s 1.22222s;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.m--previous-slide .fnc-slide__mask-inner {
  -webkit-transition: -webkit-transform 0.7s 0.33333s;
  transition: -webkit-transform 0.7s 0.33333s;
  transition: transform 0.7s 0.33333s;
  transition: transform 0.7s 0.33333s, -webkit-transform 0.7s 0.33333s;
  -webkit-transform: translateY(0) rotate(-10deg) translateX(200px) translateZ(0);
          transform: translateY(0) rotate(-10deg) translateX(200px) translateZ(0);
}
.fnc-slide__content {
  z-index: 2;
  position: absolute;
  left: 40%;
  top: 40%;
}
.fnc-slide__heading {
  margin-bottom: 10px;
  text-transform: uppercase;
}
.fnc-slide__heading-line {
  overflow: hidden;
  position: relative;
  padding-right: 20px;
  font-size: 100px;
  color: #fff;
  word-spacing: 10px;
}
.fnc-slide__heading-line:nth-child(2) {
  padding-left: 30px;
}
.m--before-sliding .fnc-slide__heading-line {
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}
.m--active-slide .fnc-slide__heading-line {
  -webkit-transition: -webkit-transform 1.5s 1s;
  transition: -webkit-transform 1.5s 1s;
  transition: transform 1.5s 1s;
  transition: transform 1.5s 1s, -webkit-transform 1.5s 1s;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.m--previous-slide .fnc-slide__heading-line {
  -webkit-transition: -webkit-transform 1.5s;
  transition: -webkit-transform 1.5s;
  transition: transform 1.5s;
  transition: transform 1.5s, -webkit-transform 1.5s;
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}
.fnc-slide__heading-line span {
  display: block;
}
.m--before-sliding .fnc-slide__heading-line span {
  -webkit-transform: translateY(-100%);
          transform: translateY(-100%);
}
.m--active-slide .fnc-slide__heading-line span {
  -webkit-transition: -webkit-transform 1.5s 1s;
  transition: -webkit-transform 1.5s 1s;
  transition: transform 1.5s 1s;
  transition: transform 1.5s 1s, -webkit-transform 1.5s 1s;
  -webkit-transform: translateY(0);
          transform: translateY(0);
}
.m--previous-slide .fnc-slide__heading-line span {
  -webkit-transition: -webkit-transform 1.5s;
  transition: -webkit-transform 1.5s;
  transition: transform 1.5s;

  transition: transform 1.5s, -webkit-transform 1.5s;
  -webkit-transform: translateY(100%);
          transform: translateY(100%);
}
.fnc-slide__action-btn {
  position: relative;
  margin-left: 200px;
  padding: 5px 15px;
  font-size: 20px;
  line-height: 1;
  color: transparent;
  border: none;
  text-transform: uppercase;
  background: transparent;
  cursor: pointer;
  text-align: center;
  outline: none;
}
.fnc-slide__action-btn span {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  -webkit-perspective: 1000px;
          perspective: 1000px;
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform-origin: 50% 0;
          transform-origin: 50% 0;
  line-height: 30px;
  color: #fff;
}
.fnc-slide__action-btn span:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border: 2px solid #fff;
  border-top: none;
  border-bottom: none;
}
.fnc-slide__action-btn span:after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  line-height: 30px;
  background: #1F2833;
  opacity: 0;
  -webkit-transform-origin: 50% 0;
          transform-origin: 50% 0;
  -webkit-transform: translateY(100%) rotateX(-90deg);
          transform: translateY(100%) rotateX(-90deg);
  -webkit-transition: opacity 0.15s 0.15s;
  transition: opacity 0.15s 0.15s;
}
.fnc-slide__action-btn:hover span {
  -webkit-transform: rotateX(90deg);
          transform: rotateX(90deg);
}
.fnc-slide__action-btn:hover span:after {
  opacity: 1;
  -webkit-transition: opacity 0.15s;
  transition: opacity 0.15s;
}
.fnc-nav {
     z-index: 5;
    position: absolute;
    right: 0;
    left: 0;
    text-align: center;
    bottom: 0;
}
.fnc-nav__bgs {
  z-index: -1;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.fnc-nav__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.fnc-nav__bg.m--nav-bg-before {
  z-index: 2 !important;
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
}
.fnc-nav__bg.m--active-nav-bg {
  z-index: 1;
  -webkit-transition: -webkit-transform 1s 0.66667s;
  transition: -webkit-transform 1s 0.66667s;
  transition: transform 1s 0.66667s;
  transition: transform 1s 0.66667s, -webkit-transform 1s 0.66667s;
  -webkit-transform: translateX(0);
          transform: translateX(0);
}
.fnc-nav__controls {
  font-size: 0;
}

.fnc-nav__control {
    overflow: hidden;
    position: relative;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    width: 190px;
    height: 83px;
    font-size: 13pt;
    text-transform: uppercase;
    color: #000000;
    font-family: "MyriadPro-Regular", Helvetica, Arial, sans-serif !important;
    background: transparent;
    border: none;
    outline: none;
    cursor: pointer;
	border-right: 1px solid #a8a8a8 !important;
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
}

/*.fnc-nav__control {
  overflow: hidden;
  position: relative;
  display: inline-block;
  vertical-align: top;
  width: 100px;
  height: 50px;
  font-size: 14px;
  color: #fff;
  text-transform: uppercase;
  background: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  -webkit-transition: background-color 0.5s;
  transition: background-color 0.5s;
}*/
.bttn-txt{color:#000000;  /*font-family: "OpenSans", Georgia, Times, serif;*/ margin-top: 7px;}
.fnc-nav__control.m--active-control {
    background: #03ada3;
    background: -webkit-linear-gradient(to right, #03ada3, #37f0e5, #03ada3);
    background: linear-gradient(to right, #03ada3, #37f0e5, #03ada3);
	
}
.fnc-nav__control-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: #fff;
  -webkit-transform-origin: 0 50%;
          transform-origin: 0 50%;
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition-timing-function: linear !important;
          transition-timing-function: linear !important;
}
.m--with-autosliding .m--active-control .fnc-nav__control-progress {
  -webkit-transform: scaleX(1);
          transform: scaleX(1);
}
.m--prev-control .fnc-nav__control-progress {
  -webkit-transform: translateX(100%);
          transform: translateX(100%);
  -webkit-transition: -webkit-transform 0.5s !important;
  transition: -webkit-transform 0.5s !important;
  transition: transform 0.5s !important;
  transition: transform 0.5s, -webkit-transform 0.5s !important;
}
.m--reset-progress .fnc-nav__control-progress {
  -webkit-transform: scaleX(0);
          transform: scaleX(0);
  -webkit-transition: -webkit-transform 0s 0s !important;
  transition: -webkit-transform 0s 0s !important;
  transition: transform 0s 0s !important;
  transition: transform 0s 0s, -webkit-transform 0s 0s !important;
}
.m--autosliding-blocked .fnc-nav__control-progress {
  -webkit-transition: all 0s 0s !important;
  transition: all 0s 0s !important;
  -webkit-transform: scaleX(0) !important;
          transform: scaleX(0) !important;
}

/* NOT PART OF COMMON SLIDER STYLES */
body {
  margin: 0;
}

.demo-cont {
  overflow: hidden;
  position: relative;
  height: 100vh;
  -webkit-perspective: 1500px;
          perspective: 1500px;
/*  background: #000;*/
}
.demo-cont__credits {
  box-sizing: border-box;
  overflow-y: auto;
  z-index: 1;
  position: absolute;
  right: 0;
  top: 0;
  width: 400px;
  height: 100%;
  padding: 20px 10px 30px;
  background: #303030;
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
  color: #fff;
  text-align: center;
  -webkit-transition: -webkit-transform 0.7s;
  transition: -webkit-transform 0.7s;
  transition: transform 0.7s;
  transition: transform 0.7s, -webkit-transform 0.7s;
  -webkit-transform: translate3d(100%, 0, 0) rotateY(-45deg);
          transform: translate3d(100%, 0, 0) rotateY(-45deg);
  will-change: transform;
}
.credits-active .demo-cont__credits {
  -webkit-transition: -webkit-transform 0.7s 0.23333s;
  transition: -webkit-transform 0.7s 0.23333s;
  transition: transform 0.7s 0.23333s;
  transition: transform 0.7s 0.23333s, -webkit-transform 0.7s 0.23333s;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.demo-cont__credits *, .demo-cont__credits *:before, .demo-cont__credits *:after {
  box-sizing: border-box;
}
.demo-cont__credits-close {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 28px;
  height: 28px;
  cursor: pointer;
}
.demo-cont__credits-close:before, .demo-cont__credits-close:after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 2px;
  margin-top: -1px;
  background: #fff;
}
.demo-cont__credits-close:before {
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.demo-cont__credits-close:after {
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.demo-cont__credits-heading {
  text-transform: uppercase;
  font-size: 40px;
  margin-bottom: 20px;
}
.demo-cont__credits-img {
  display: block;
  width: 60%;
  margin: 0 auto 30px;
  border-radius: 10px;
}
.demo-cont__credits-name {
  margin-bottom: 20px;
  font-size: 30px;
}
.demo-cont__credits-link {
  display: block;
  margin-bottom: 10px;
  font-size: 24px;
  color: #fff;
}
.demo-cont__credits-blend {
  font-size: 30px;
  margin-bottom: 10px;
}

.example-slider {
  z-index: 2;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
  -webkit-transition: -webkit-transform 0.7s;
  transition: -webkit-transform 0.7s;
  transition: transform 0.7s;
  transition: transform 0.7s, -webkit-transform 0.7s;
}
.credits-active .example-slider {
  -webkit-transform: translate3d(-400px, 0, 0) rotateY(10deg) scale(0.9);
          transform: translate3d(-400px, 0, 0) rotateY(10deg) scale(0.9);
}
.example-slider .fnc-slide-1 .fnc-slide__inner,
.example-slider .fnc-slide-1 .fnc-slide__mask-inner {
  /*background-image: url("../images/banner-main1.jpg");*/
   /*background-image: url("../images/banner-main1-new.jpg");*/
   background-image: url("../images/college-new.jpg");
   
}


.example-slider .fnc-slide-2 .fnc-slide__inner,
.example-slider .fnc-slide-2 .fnc-slide__mask-inner {
  background-image: url("../images/college-event-new.jpg");
}
/*.example-slider .fnc-slide-7 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}*/

.example-slider .fnc-slide-3 .fnc-slide__inner,
.example-slider .fnc-slide-3 .fnc-slide__mask-inner {
  background-image: url("../images/college-courses-new.jpg");
}
.example-slider .fnc-slide-4 .fnc-slide__inner,
.example-slider .fnc-slide-4 .fnc-slide__mask-inner {
  background-image: url("../images/college-facility-new.jpg");
}
.example-slider .fnc-slide-4 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(255, 255, 255, 0.1);
}
.example-slider .fnc-slide-5 .fnc-slide__inner,
.example-slider .fnc-slide-5 .fnc-slide__mask-inner {
  /*background-image: url("../images/banner-main2.jpg");*/background-image: url("../images/college-infra-new.jpg");
}
.example-slider .fnc-slide-5 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}

.example-slider .fnc-slide-6 .fnc-slide__inner,
.example-slider .fnc-slide-6 .fnc-slide__mask-inner {
  background-image: url("../images/banner-main4.jpg");
}
.example-slider .fnc-slide-6 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}
/*.example-slider .fnc-slide-6 .fnc-slide__inner,
.example-slider .fnc-slide-6 .fnc-slide__mask-inner {
  background-image: url("../images/banner-main5.jpg");
}
.example-slider .fnc-slide-6 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}*/

/*.example-slider .fnc-slide-7 .fnc-slide__inner,
.example-slider .fnc-slide-7 .fnc-slide__mask-inner {
  background-image: url("../images/college-event-banner.jpg");
}
.example-slider .fnc-slide-7 .fnc-slide__inner:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.2);
}*/



.example-slider .fnc-slide__heading,
.example-slider .fnc-slide__action-btn,
.example-slider .fnc-nav__control {
  font-family: "Open Sans", Helvetica, Arial, sans-serif;
}

/* COLORFUL SWITCH STYLES 
   ORIGINAL DEMO - https://codepen.io/suez/pen/WQjwOb */
.colorful-switch {
  position: relative;
  width: 180px;
  height: 77.14286px;
  margin: 0 auto;
  border-radius: 32.14286px;
  background: #cfcfcf;
}
.colorful-switch:before {
  content: "";
  z-index: -1;
  position: absolute;
  left: -5px;
  top: -5px;
  width: 190px;
  height: 87.14286px;
  border-radius: 37.14286px;
  background: #314239;
  -webkit-transition: background-color 0.3s;
  transition: background-color 0.3s;
}
.colorful-switch:hover:before {
  background: #4C735F;
}
.colorful-switch__checkbox {
  z-index: -10;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.colorful-switch__label {
  z-index: 1;
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 32.14286px;
  cursor: pointer;
}
.colorful-switch__bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 540px;
  height: 100%;
  background: -webkit-linear-gradient(left, #14DCD6 0, #10E7BD 180px, #EF9C29 360px, #E76339 100%);
  background: linear-gradient(90deg, #14DCD6 0, #10E7BD 180px, #EF9C29 360px, #E76339 100%);
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform: translate3d(-360px, 0, 0);
          transform: translate3d(-360px, 0, 0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__bg {
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.colorful-switch__dot {
  position: absolute;
  left: 131.14286px;
  top: 50%;
  width: 5.14286px;
  height: 5.14286px;
  margin-left: -2.57143px;
  margin-top: -2.57143px;
  border-radius: 50%;
  background: #fff;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__dot {
  -webkit-transform: translate3d(-80.35714px, 0, 0);
          transform: translate3d(-80.35714px, 0, 0);
}
.colorful-switch__on {
  position: absolute;
  left: 104.14286px;
  top: 22.5px;
  width: 19.28571px;
  height: 36px;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__on {
  -webkit-transform: translate3d(-80.35714px, 0, 0);
          transform: translate3d(-80.35714px, 0, 0);
}
.colorful-switch__on__inner {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-transition: -webkit-transform 0.25s 0s cubic-bezier(0.52, -0.96, 0.51, 1.28);
  transition: -webkit-transform 0.25s 0s cubic-bezier(0.52, -0.96, 0.51, 1.28);
  transition: transform 0.25s 0s cubic-bezier(0.52, -0.96, 0.51, 1.28);
  transition: transform 0.25s 0s cubic-bezier(0.52, -0.96, 0.51, 1.28), -webkit-transform 0.25s 0s cubic-bezier(0.52, -0.96, 0.51, 1.28);
  -webkit-transform-origin: 100% 50%;
          transform-origin: 100% 50%;
  -webkit-transform: rotate(45deg) scale(0) translateZ(0);
          transform: rotate(45deg) scale(0) translateZ(0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__on__inner {
  -webkit-transition: -webkit-transform 0.25s 0.25s cubic-bezier(0.67, -0.16, 0.47, 1.61);
  transition: -webkit-transform 0.25s 0.25s cubic-bezier(0.67, -0.16, 0.47, 1.61);
  transition: transform 0.25s 0.25s cubic-bezier(0.67, -0.16, 0.47, 1.61);
  transition: transform 0.25s 0.25s cubic-bezier(0.67, -0.16, 0.47, 1.61), -webkit-transform 0.25s 0.25s cubic-bezier(0.67, -0.16, 0.47, 1.61);
  -webkit-transform: rotate(45deg) scale(1) translateZ(0);
          transform: rotate(45deg) scale(1) translateZ(0);
}
.colorful-switch__on__inner:before, .colorful-switch__on__inner:after {
  content: "";
  position: absolute;
  border-radius: 2.57143px;
  background: #fff;
}
.colorful-switch__on__inner:before {
  left: 0;
  bottom: 0;
  width: 100%;
  height: 6.14286px;
}
.colorful-switch__on__inner:after {
  right: 0;
  top: 0;
  width: 6.14286px;
  height: 100%;
}
.colorful-switch__off {
  position: absolute;
  left: 131.14286px;
  top: 50%;
  width: 41.14286px;
  height: 41.14286px;
  margin-left: -20.57143px;
  margin-top: -20.57143px;
  -webkit-transition: -webkit-transform 0.5s;
  transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
  transition: transform 0.5s, -webkit-transform 0.5s;
  -webkit-transform: translate3d(0, 0, 0);
          transform: translate3d(0, 0, 0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__off {
  -webkit-transform: translate3d(-80.35714px, 0, 0);
          transform: translate3d(-80.35714px, 0, 0);
}
.colorful-switch__off:before, .colorful-switch__off:after {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  height: 5.14286px;
  margin-top: -2.57143px;
  border-radius: 2.57143px;
  background: #fff;
  -webkit-transition: -webkit-transform 0.25s 0.25s;
  transition: -webkit-transform 0.25s 0.25s;
  transition: transform 0.25s 0.25s;
  transition: transform 0.25s 0.25s, -webkit-transform 0.25s 0.25s;
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__off:before, .colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__off:after {
  -webkit-transition-delay: 0s;
          transition-delay: 0s;
}
.colorful-switch__off:before {
  -webkit-transform: rotate(45deg) scaleX(1) translateZ(0);
          transform: rotate(45deg) scaleX(1) translateZ(0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__off:before {
  -webkit-transform: rotate(45deg) scaleX(0) translateZ(0);
          transform: rotate(45deg) scaleX(0) translateZ(0);
}
.colorful-switch__off:after {
  -webkit-transition-timing-function: cubic-bezier(0.67, -0.16, 0.47, 1.61);
          transition-timing-function: cubic-bezier(0.67, -0.16, 0.47, 1.61);
  -webkit-transform: rotate(-45deg) scaleX(1) translateZ(0);
          transform: rotate(-45deg) scaleX(1) translateZ(0);
}
.colorful-switch__checkbox:checked ~ .colorful-switch__label .colorful-switch__off:after {
  -webkit-transition-timing-function: ease;
          transition-timing-function: ease;
  -webkit-transform: rotate(-45deg) scaleX(0) translateZ(0);
          transform: rotate(-45deg) scaleX(0) translateZ(0);
}

.green-head{color:#0ea1b6; text-transform:uppercase; font-size: 26pt; font-family: "Roboto-Medium",Helvetica,Arial, Open Sans, sans-serif;}
.title-main{color:#262626; font-size: 16pt; margin-top: 10px; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;}
.min-txt{color:#373737; font-size: 11pt; font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;}
.main-txt{color:#181818; font-size: 26pt; font-family: "Roboto-Regular",Helvetica,Arial, Open Sans, sans-serif; margin-top: 68px;     margin-bottom: 5px;}
.txt-slog{color:#424242; font-size: 15pt; font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;}
.divider{background: #0ea1b6; display: block; width: 170px; height: 2px; margin: 0 auto;}
.divider1 {
    background: #010101;
    display: block;
    width: 48px;
    height: 2px;
	margin-bottom: 14px;
}
.dividerr {
    background: #0ea1b6;
    display: block;
    width: 170px;
    height: 2px;
    /* margin: 0 auto; */
}
.cors_list li{background:url(../images/tik-blt.png) no-repeat 3px 17px; list-style-type:none; padding:13px 0 0 27px; font-size:17px; color:#101010;}
.cors_egilbty li{background:url(../images/tik-blt.png) no-repeat 3px 17px; list-style-type:none; padding:13px 0 0 27px; text-align: justify; font-size:17px; color:#101010;}

.tbg{background-color: #f4f4f4;}
.dr-quali{color: #4e4e4e;
    font-size: 9pt;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;}
.dr-post{color:#4c4c4c; font-size: 12pt; margin-top: -4px;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;}
.dr-nme{color:#000000; font-size: 13pt;
    font-family: "OpenSans-Semibold",Helvetica,Arial, Open Sans, sans-serif;}
.pd-no{padding-left: 0;}
.pddm{padding-bottom:19px;}
.miss-txt{color: #474747;
    line-height: 1.4;
    font-size: 11pt;
    text-align: justify;
    font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;}
.img-width{display: -webkit-inline-box !important;
    max-width: 100% !important;
    height: auto !important;}
.padd-top{padding-top:45px;}	

i.fa.fa-facebook{color: #fff;}
i.fa.fa-twitter{color: #fff;}
i.fa.fa-linkedin{color: #fff;}

.foot-social .foot-facebook a i{background: #337ab7;}
.foot-social .foot-youtube a i {background: #e01e1e;}
.foot-social .foot-twitter a i {background: #68dcf9;}
.foot-social .foot-deviantart a i{background: #23323d;}
.foot-social .foot-facebook a:hover i {background: #4893ce;}
.foot-social .foot-twitter a:hover i {background: #00b8e6;}
.foot-social .foot-youtube a:hover i {background: #bb0000;}
.foot-social .foot-deviantart a:hover i {background: #adc376;}





.foot-social a i {
	width: 31px;
    height: 31px;
    line-height: 32px;
    font-size: 12pt;
    color: #fff;
    -webkit-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    text-align: center;
    border-radius: 20px;
    padding: 0;
}

.foot-social .social-youtube a i {
    background: #e01e1e;
}

.foot-social {
	    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    text-align: left;
	
}

.bordr-r{border-right: 1px solid #a7a7a7;}

.smll-fnt-menu {
    padding: 17px 24px !important;
}


.smll-menu li a:hover{background: #10a9bf;
  background: -webkit-linear-gradient(to bottom, #7389a3, #334b68); 
  background: linear-gradient(to bottom, #7389a3, #334b68);}

.smll-menu li a{text-decoration:none; color:#000000;  font-size: 13pt; font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;}

.smll-menu li{padding: 0px 25px;
    list-style: none;
    text-align: center;}

.smll-menu{position: absolute;
    text-align: center;
    float: none;
    left: 149px;
    top: 230px;
    padding-left: 0;
    margin-bottom: 0;
    display: -webkit-inline-box;
    text-transform: uppercase;
    background-color: #e8e8e8;}

.bg-bnner{position:relative; height: 72vh; background: url(../images/back-banner.jpg) center no-repeat; background-size: cover;}
.bg-main-bnnr{position:relative; /*min-height: 353px;*/ /*background: url(../images/banner-main.jpg) bottom center no-repeat;*/}

.fnt-menu{color: #fff !important;
    padding: 17px 20px !important;
	font-size: 11pt;
    font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;}
	
.fnt-menuu {
    color: #fff !important;
    padding: 8px 24px !important;
    font-size: 11pt;
    font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;
}

.thead-bg{border-top: 1px solid #0e8191;
    border-bottom: 1px solid #0e8191;
    border-top: 1px solid #0e8191;
    border-bottom: 1px solid #0e8191;
    background: #0b8b9e;
    background: -webkit-linear-gradient(to top, #0b8b9e, #11acc2);
    background: linear-gradient(to top, #0b8b9e, #11acc2);
    color: #fff; text-align: center !important;}

.testi-tit-mid {
    color: #000000;
    font-size: 19pt;
    margin-top: 24px;
    font-family: "Roboto-Regular", Georgia, Times, serif;
}

.table>thead>tr>th {
    text-align: center !important;
    padding: 10px 29px;
}

/*.table>tbody>tr>td {
    text-align: center !important;
}*/	

.dwn-small {
    padding: 0px 0 !important;
    background-color: #10a9bf !important;
   
}
.smlll-menu{padding:0 !important;}
.foot-social li{
	margin-right: 4px;
	display: inline-block;
}

.foot-social a{
	margin:0 2px 0 0;
}

.foot-social a:hover {
    color: #fff;
}

.navbar-brand {
    display: none;
}

.header-rt-info {
   /* padding: 0;*/
}

.side-bar{background: url(../images/seaptr.png) no-repeat 1px 10px;
    text-align: center;}

.side-barr{background: url(../images/smll-seaptr.png) no-repeat 1px 1px;
    text-align: center;
}
		
.bg-menu{border-top: 1px solid #0e8191; border-bottom: 1px solid #0e8191; border-top: 1px solid #0e8191;
    border-bottom: 1px solid #0e8191;
    background: #0b8b9e;
    background: -webkit-linear-gradient(to top, #0b8b9e, #11acc2);
    background: linear-gradient(to top, #0b8b9e, #11acc2); }

.navbar-header {
    margin-left: -4%!important;
}

.navbar-nav.navbar-center {
    display: block;
    text-transform: uppercase;
    margin: 0 auto;
    float: none;
    /* padding-top: 4px; */
}

.mega-dropdown-menu {
    padding: 14px 0px;
    border-radius: 9px;
    width: 100%;
    box-shadow: none;
    -webkit-box-shadow: none;
}

.pd{padding: 0px 30px;}

.bd-r {
    /*border-right: 1px solid #dcdcdc;*/
	background: url(../images/right-bd-r.png) no-repeat 290px 43px;
}

.bdr {
    border-left: 1px solid #0e8191;
}


.bdr-r {
    border-right: 1px solid #0e8191;
}

.bdr-b {
    border-left: 1px solid #0e8191;
    /* border-right: 1px solid #304661; */
}

i.fa.fa-facebook{color: #fff;}
i.fa.fa-twitter{color: #fff;}
i.fa.fa-linkedin{color: #fff;}


.foot-social .foot-linkedin a i{background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-facebook a i{background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-google-plus a i {background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-twitter a i {background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-deviantart a i{background: #23323d;}
.foot-social .foot-linkedin a:hover i {background: #0077b5;}
.foot-social .foot-facebook a:hover i {background: #4893ce;}
.foot-social .foot-twitter a:hover i {background: #00b8e6;}
.foot-social .foot-google-plus a:hover i {background: #bb0000;}
.foot-social .foot-deviantart a:hover i {background: #adc376;}

.footer-menu{ margin:0 auto; float:none; padding:20px 0 15px 0;}
.footer-menu a{text-decoration: none;
    padding: 0px 8px;
    font-family: 'OpenSans-Light';
    font-size: 12pt; }
.footer-menu a:hover{color:#fff000; }	
.footer-menu a:last-child{ border:none; }
.footer-menu a{color:#fff;}
.bg-foot {
    background-color: #0f2a38;
    display: block;
    padding: 10px 0px;
	border-top: 3px solid #09a097;
}

.divider2 {
    background: #fff;
    display: block;
    width: 48px;
    height: 2px;
    margin-bottom: 14px;
}
.footer-side{list-style:none; padding-left: 0;}
.footer-side li{
    line-height: 1.8;
    padding-left: 14px;
    background: url(../images/foot-arrw.png) no-repeat -1px 8px;}
.footer-side li a{color: #fff;
    font-size: 11pt;
    letter-spacing: 1px;
    text-decoration: none;
    font-weight: lighter;
    font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;
}
.footer-side li a:hover{color:#09a097;}

.addr {
    color: #fff;
    font-family: "CenturyGothic",Helvetica,Arial, Open Sans, sans-serif;
    font-size: 11pt;
    padding-left: 32px;
	padding-bottom: 10px;
    background: url(../images/tag3.png) no-repeat 1px -1px;
}

.addr-msg {
    color: #fff;
    font-family: "CenturyGothic",Helvetica,Arial, Open Sans, sans-serif;
    font-size: 11pt;
    padding-left: 32px;
    background: url(../images/tag2.png) no-repeat 1px -2px;
}

.addr-loc {
    color: #fff;
    font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;
    font-size: 11pt;
    padding-left: 32px;
	padding-bottom: 10px;
    background: url(../images/tag1.png) no-repeat 1px 2px;
}


.foot-head{color: #fff;
    font-size: 14pt;
    letter-spacing: 1px;
    font-family: "OpenSans",Helvetica,Arial, Open Sans, sans-serif;}
.mrg-tp{margin-top:10px;}
.mrg-tpp{margin-top: 16px;}
.logo-footbttm{padding-bottom:10px;}
.foot-cnt{color:#fff; font-size: 10pt; font-family: "OpenSans-Light",Helvetica,Arial, Open Sans, sans-serif;}
.hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #061f2c !important;
}

i.fa.fa-facebook{color: #fff;}
i.fa.fa-twitter{color: #fff;}
i.fa.fa-linkedin{color: #fff;}


.foot-social .foot-linkedin a i{background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-facebook a i{background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-google-plus a i {background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-twitter a i {background: #0a222e; border: 2px solid #0e425e;}
.foot-social .foot-deviantart a i{background: #23323d;}
.foot-social .foot-linkedin a:hover i {background: #0077b5;}
.foot-social .foot-facebook a:hover i {background: #4893ce;}
.foot-social .foot-twitter a:hover i {background: #00b8e6;}
.foot-social .foot-google-plus a:hover i {background: #bb0000;}
.foot-social .foot-deviantart a:hover i {background: #adc376;}

.foot-social a i {
    width: 45px;
    height: 45px;
    line-height: 45px;
    font-size: 17pt;
    color: #fff;
    -webkit-transition: background .3s ease-in-out;
    transition: background .3s ease-in-out;
    text-align: center;
    border-radius: 24px;
    padding: 0;
}
.pt{padding: 0px 8px;}
.copyrighttext{color: #fff;
    font-family: 'OpenSans-Light';
    word-spacing: 1px;
	letter-spacing: 1px;
    text-align: left;
    margin-top: 5px;
    font-size: 11pt;}
.lnk{color: #fff;
    text-align: right;
    margin-top: 5px;
	letter-spacing: 1px;
    font-family: 'OpenSans-Light';
    font-size: 11pt;}


@keyframes zoomIn{
0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
}

50% {
    opacity: 1;
}
}
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
	-webkit-transition: all .3s ease-out;
	-moz-transition: all .3s ease-out;
	-o-transition: all .3s ease-out;
	transition: all .3s ease-out;
}







.navbar-header{
	margin-left:-4%!important;
}

.navbar-left{
	margin-left:38.7px;
}

.navbar-right{
	margin-right:21px;
}

.navbar-inverse{
	border:none;
}

.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {
    border:none;
}

#sidebar-wrapper {
    z-index: 1000;
    position: fixed;
    right: 0;
    width: 320px;
    height: 100%;
    margin-right: -320px;
    overflow-y: auto;
    background: #222;
    -webkit-transition: all 0.4s ease-in-out 0s;
    -moz-transition: all 0.4s ease-in-out 0s;
    -ms-transition: all 0.4s ease-in-out 0s;
    -o-transition: all 0.4s ease-in-out 0s;
    transition: all 0.4s ease-in-out 0s;
}
.sidebar-nav {
    position: absolute;
    top: 8.2%;
    width: 320px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sidebar-nav li {
    position: relative;
    line-height: 20px;
    display: inline-block;
    width: 100%;
    font-size: 110%;
    font-weight: 800;
    text-transform: uppercase;
    outline: none;
}
.sidebar-nav li:before {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
    height: 100%;
    width: 3px;
    background-color: #1c1c1c;
    -webkit-transition: width .4s ease-in-out;
    -moz-transition: width .4s ease-in-out;
    -ms-transition: width .4s ease-in-out;
    transition: width .4s ease-in-out;
}
.sidebar-nav li:first-child a {
    color: #fff;
    background-color: #1a1a1a;
}
.sidebar-nav li:nth-child(2):before {
    color: #fff;
    background-color: #1a1a1a;
}
.sidebar-nav li:nth-child(3):before {
    background-color: #ec1b5a;
}
.sidebar-nav li:nth-child(4):before {
    background-color: #79aefe;
}
.sidebar-nav li:nth-child(5):before {
    background-color: #314190;
}
.sidebar-nav li:nth-child(6):before {
    background-color: #279636;
}
.sidebar-nav li:nth-child(7):before {
    background-color: #7d5d81;
}
.sidebar-nav li:nth-child(8):before {
    background-color: #ead24c;
}
.sidebar-nav li:nth-child(9):before {
    background-color: #2d2366;
}
.sidebar-nav li:nth-child(10):before {
    background-color: #35acdf;
}
.sidebar-nav li:hover:before, .sidebar-nav li.open:hover:before {
    width: 100%;
    -webkit-transition: width .4s ease-in-out;
    -moz-transition: width .4s ease-in-out;
    -ms-transition: width .4s ease-in-out;
    transition: width .4s ease-in-out;
}
.sidebar-nav li a {
    display: block;
    color: #ddd;
    text-decoration: none;
    padding: 10px 15px 10px 30px;
}
.sidebar-nav li a:hover, .sidebar-nav li a:active, .sidebar-nav li a:focus, .sidebar-nav li.open a:hover, .sidebar-nav li.open a:active, .sidebar-nav li.open a:focus {
    color: #fff;
    text-decoration: none;
    background-color: transparent;
}
.sidebar-nav > .sidebar-brand {
    height: 44px;
    font-size: 18px;
    line-height: 1.43;
}
.sidebar-nav .dropdown-menu {
    position: relative;
    width: 100%;
    padding: 0;
    margin: 0;
    border-radius: 0;
    border: none;
    background-color: #222;
    box-shadow: none;
}
#menu-toggle {
    z-index: 801;
    position: fixed;
    top: 0;
    right: .5%;
}
#sidebar-wrapper.active {
    right: 320px;
    width: 320px;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -ms-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
}
.toggle {
    margin: 0;
}
#to-top {
    position: fixed;
    right: .2%;
    bottom: .2%;
    z-index: 799;
}


@media(min-width: 768px){
	.contact-panel{
		width:50%;
	}
}

.social {
	z-index: 801;
	position: fixed;
	top: 10%;
	left: .5%;
	padding: 0;
	margin: 0;
	font-size: 100%;
	width:2.7%;
}
.social ul {
    background: #222;
}
.social ul li {
    list-style: none outside none;
    display: block;
    background: #222;
    padding: 0;
    margin: 0;
}

.nav>li>a:focus, .nav>li>a:hover {
    text-decoration: none;
    /*background-color: #222;*/
	background: #01606d;
/*  background: -webkit-linear-gradient(to bottom, #354c69,#1e3148); 
  background: linear-gradient(to bottom, #354c69,#1e3148);*/
}
.social i {
	width:100%;
	min-width: 50px;
	height: 100%;
	min-height: 50px;
	color: #FFF;
	background-color: #222;
    font-size: 22px;
    text-align: center;
    padding-top: 12px;
    -webkit-transition: all ease 0.3s;
    -moz-transition: all ease 0.3s;
    -ms-transition: all ease 0.3s;
    -o-transition: all ease 0.3s;
    transition: all ease 0.3s;
}
.social .fa-facebook:hover {
    background: #4060A5;
    border: 1px solid #4060A5;
}
.social .fa-twitter:hover {
    background: #00ABE3;
    border: 1px solid #00ABE3;
}
.social .fa-google-plus:hover {
    background: #e64522;
    border: 1px solid #e64522;
}
.social .fa-github:hover {
    background: #343434;
    border: 1px solid #343434;
}
.social .fa-linkedin:hover {
    background: #0094BC;
    border: 1px solid #0094BC;
}
.social .fa-stack-overflow:hover {
    background: #FEA501;
    border: 1px solid #FEA501;
}
.social .fa-skype:hover {
    background: #00C6FF;
    border: 1px solid #00C6FF;
}
.social .fa-stack-exchange:hover {
    background: #4D86C9;
    border: 1px solid #4D86C9;
}
.social .fa-rss:hover {
    background: #e88845;
    border: 1px solid #e88845;
}
#social-collapse:after {
    font-family: 'FontAwesome';
    content: "\f068";
    float: none;
    position: relative;
    color: white;
}
#social-collapse.collapsed:after {
    content: "\f067";
}
ol.linenums{
    counter-reset:linenumber;
}
ol.linenums li{
    list-style-type:none;
    counter-increment:linenumber;
}
ol.linenums li:before{
    content: counter(linenumber);
    float:left;
    margin-left:-4em;
    text-align:right;
    width:3em;
}

.mt {
    margin-top: 2%;
}

.masthead{
	display: table;
	position: relative;
	min-width: 100%;
	min-height: 100%;
	width: 100%;
	height: 100%;
	background: transparent url("../img/bg.jpg") no-repeat fixed 0px 0px / cover;
	z-index: 800;
	background-color:#000;
}

.text-white{
	color:#fff;
}

.text-vertical-center {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.text-vertical-center h1 {
	margin: 0;
	padding: 0;
	font-size: 4.5em;
	font-weight: 700;
}
section {
	/*padding-bottom: 7%;*/
}
.bg-inverse {
	color: #FFF;
	background-color: #333;
}
.centered {
	text-align: center;
}
.mt {
	margin-top: 2%;
}
.text-vertical-center {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}
.text-vertical-center h1 {
    margin: 0;
    padding: 0;
    font-size: 4.5em;
    font-weight: 700;
}
hr.small {
	max-width: 100px;
}

small{
	color: #040404!important;
    font-size: 94% !important;
}

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




@media only screen and (min-width:992px) and (max-width:1059px){
/*.hos {
    color: #fff;
    font-size: 28pt;
    word-spacing: 4px;
    text-align: left;
    margin-top: 0;
    padding: 10px 39px;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;
}*/
	
}

@media only screen and (min-width:768px) and (max-width:991px){
.logo {
    padding: 20px 11px !important;
    margin: 0 auto;
    text-align: center !important;
    display: table !important;}

}

@media only screen and (min-width:266px) and (max-width:502px){
.fnc-nav__control {
    overflow: hidden;
    position: relative;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    width: 394px;
    height: 48px;
    font-size: 13pt;
    text-transform: uppercase;
    color: #000000;
    font-family: "MyriadPro-Regular", Helvetica, Arial, sans-serif !important;
    background: transparent;
    border-right: 1px solid #a8a8a8;
    outline: none;
    cursor: pointer;
    -webkit-transition: background-color 0.5s;
    transition: background-color 0.5s;
}
}

@media only screen and (min-width:266px) and (max-width:767px){
.bttn-txt {
    margin-top: 16px !important;
    text-align: left !important;
    padding-left: 47px !important;
}

.testi-nme {
    text-align: center !important;
    
}	
	
.dr-quali{color: #4e4e4e; margin-bottom: 48px;
    font-size: 9pt;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif; text-align:center;}
.dr-post{color:#000000; font-size: 12pt; margin-top: -4px;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif; text-align:center;}
.dr-nme{color:#000000; font-size: 13pt;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif; text-align:center;}
.miss-txt{color: #474747;
    line-height: 1.4;
    font-size: 13pt;
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;}	
.img-cnt{text-align:center;}
.logo {
    padding: 20px 11px;
    margin: 0 auto;
    text-align: center !important;
    display: table;
}

.lst {
    text-align: center !important;
}

.loader {
   
      width: 58% !important;
    padding: 20% 0 !important;
    margin-bottom: 15px;
}

.bd-r {
    background: none !important;
}
.bdr-btm-drk-green {
    margin-top: 6px;
    padding-bottom: 1px;
	padding-left: 0;
    text-align: center !important;
}

.foot-social {
    list-style: none;
    padding-left: 0;
    padding-top: 14px;
    margin-bottom: 0px;
    text-align: center;
}
.right-side {
    text-align: center;
}

.phone {
    color: #252525;
    font-size: 11pt;
    text-align: center;
    padding-left: 0px;
    margin-top: 11px;
    background: none !important; 
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;
}

.email {
    color: #252525;
    font-size: 11pt;
    margin-top: 35px;
    padding-left: 0px;
    text-align: center;
    background: none !important; 
    font-family: "MyriadPro-Regular",Helvetica,Arial, Open Sans, sans-serif;
}

section {
     padding-bottom: 0% !important; 
}

.lnk {
    color: #fff;
    text-align: center;
    padding-top: 10px;
    font-family: 'OpenSans-Regular';
    font-size: 11pt;
}

.copyrighttext {
    color: #fff;
    font-family: 'OpenSans-Light';
    word-spacing: 2px;
    padding-bottom: 10px;
    text-align: center;
    font-size: 11pt;
}

.img-center{float:left !important;}

}

.disable-underline a, .disable-underline a:hover{ text-decoration:none;}


/*-------------------------
		CHAIRMAN DESKS
---------------------------*/
.chairman-desk{
	padding-top: 50px;
	padding-bottom:60px;
	background: rgb(243, 243, 243);
	text-align:center;
}
.chairman-desk .section-title-1 h2{
	font-weight: 500;
    /* font-style: italic; */
    text-shadow: 0px 0px 1px #000;
    color: #000;
	font-size:30px;
	margin-bottom:30px;
	padding:0 0 5px 0;
	position:relative;
}
.chairman-desk .section-title-1 h2:before {
	position: absolute;
	content: "";
	width: 150px;
	height: 2px;
	background-color: #d8d8d8;
	bottom: 0;
	left: 47%;
	margin-left: -40px;
}
.chairman-desk .section-title-1 h2:after {
	position: absolute;
	content: "";
	width: 50px;
	height: 2px;
	background-color: rgb(0, 155, 168);
	left: 0;
	bottom: 0;
	left: 50%;
	margin-left: -25px;
}
.chairman-desk p{font-style:italic; margin-bottom:5px; font-size:16px;}
.chairman-desk .login-container {
  /*height: 400px;*/
  /*width: 350px;*/
  padding: 30px;
  margin-bottom:20px;
  border-radius: 5px;
  background: rgb(0, 155, 168);
  position: relative;
  border: 2px solid rgb(0, 155, 168);
  box-shadow: 0px 0px 5px rgba(0,0,0,0.5);
}
.chairman-desk .login-container .profile-img img {
    border-radius: 50%;
	/*width:100px;
	height:100px;*/
	text-align:center;
	border: 3px solid rgb(255, 255, 255);
    box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
  }
.chairman-desk .login-container h1 {
    margin-bottom:10px;
	font-size:20px;
	color: rgb(255, 255, 255);
}
.chairman-desk .login-container h1 span{
	font-size:20px;
	color: rgb(255, 255, 255);
	font-weight:600;
}

.chairman-desk .login-container h2 {
    margin-bottom:0px;
	margin-top:20px;
	font-size:18px;
	font-weight:600;
	padding:0px;
	color: rgb(255, 255, 255);
}
.chairman-desk .login-container P {
    margin-bottom:10px;
	font-size:13px;
	color: rgb(255, 255, 255);
}

.chairman-desk  .login-container .description{
    margin-bottom: 20px;
	font-size:16px;
	font-style:italic;
	color: rgb(255, 255, 255);
}

.chairman-desk .login-container-1 {
  background: rgb(255, 255, 255);
  border: 2px solid rgb(255, 255, 255);
}
.chairman-desk .login-container-1 .profile-img img {
	border: 3px solid rgb(0, 155, 168);
	box-shadow: 0px 0px 6px rgba(0,0,0,0.5);
  }
.chairman-desk .login-container-1 h1 {
	color: rgb(0, 155, 168);
}
.chairman-desk .login-container-1 h1 span{
	color: rgb(0, 155, 168);
}

.chairman-desk .login-container-1 h2 {
	color: rgb(0, 155, 168);
}
.chairman-desk .login-container-1 P {
	color: rgb(0, 155, 168);
}

.chairman-desk .login-container-1 .description{
	color: rgb(0, 155, 168);
}


@media screen and (max-width: 1024px) {
	.chairman-desk .login-container {
		/*height: 250px;*/
		margin-bottom:40px;
	}
}

@media screen and (max-width: 600px) {
	.chairman-desk .login-container {
		/*height: 430px;*/
		margin-bottom:40px;
	}
	.chairman-desk .login-container h1 {
		font-size:20px;
	}


}