@charset "utf-8";

html {
    width: 100%; height: 100%;
    -webkit-font-smoothing: antialiased;
    font-size: 62.5%;
}

body {
    overflow-x: hidden;
    color: #000; background-color: #fff;
    webkit-tap-highlight-color: rgba(255,255,255,.2);
/*
    font-family: NotoSansThaiRegular, sans-serif;
    font-weight: normal;
    font-size: 16px;
    font-size: 1.6rem;
    line-height: 1.6em;
*/
  font-family: "Sarabun",sans-serif !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  font-size: 1.6rem !important;
  line-height: 1.5 !important;
  --s-heading:"Kanit",sans-serif !important
  --s-body:"Sarabun",sans-serif !important;
  --s-body-line-height:1.5;
}

header {
  height: 34px;
  background-color: #E9ECEF;
}

.hbanner {
    /* margin: 4rem auto 0; */
    margin: 0 auto;
    min-height: 16.25rem;
    width: 100%; height: 575px;
    position: relative;
    background-color: #dde5ea;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
}

.hbanner::before {
    position: absolute;
    display: block;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(52,56,81,0.35);
}

.xbanner {
    margin: 0 auto;
    min-height: 14.25rem;
    width: 100%; 
    position: relative;
    background-color: #BED4DF;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover;
  /* background-image: linear-gradient(180deg, rgba(58, 58, 58, 0.4), rgba(58, 58, 58, 0.4)), url(../images/blog-bg1.jpg); */
}

.xbanner::before {
    position: absolute;
    display: block;
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(52,56,81,0.35);
}

.banner_wrap {
    position: absolute;
    margin: auto;
    top: 55%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
    color: rgba(255,255,255,0.8);
    width: 100%;
    max-width: 90%;
    z-index: 1;
}

.banner_wrap .banner_title {
    /* font-size: 2.0em; */
    color: #fff;
}
.banner_wrap .banner_meta {
    font-size: 1.4em;
    color: #fff;
}


#mainNav {
    color: #fff; background: #4A897C;
    padding-top: 4px; padding-bottom: 4px;
    -webkit-transition: height .5s, line-height .5s; /* Safari */
    transition: height .5s, line-height .5s;

    box-shadow: 0px 2px 3px 0px rgba(51, 51, 51, 0.1);
    -webkit-box-shadow: 0px 2px 3px 0px rgba(51, 51, 51, 0.1);
    -moz-box-shadow: 0px 2px 3px 0px rgba(51, 51, 51, 0.1);
    -o-box-shadow: 0px 2px 3px 0px rgba(51, 51, 51, 0.1);

}
#mainNav .navbar-nav .nav-item .nav-link {
    color: #fff;
    font-family: Prompt;
    font-weight: normal;
    font-size: 16pt;
    text-align: left;
}
#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
    color: #FFC107;
    background-color: transparent;
    text-decoration: none;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}
#mainNav .navbar-toggler {
    color: #2C2C2C;
    border-color: #f5f5f5;
}

#mainNav .navbar-brand {
    color: #fff;
    margin: 0; padding: 0;
    display: inline-block;
    font-family: Prompt;
    font-weight: 600;
    font-size: 16pt;
    -webkit-transition: all .5s;
    transition: all .5s;
}
#mainNav .navbar-brand:focus, #mainNav .navbar-brand:hover {
    color: #FFC107;
    background-color: transparent;
    text-decoration: none;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}
#mainNav .navbar-brand.active {
    color: #FFC107;
    background-color: transparent;
    text-decoration: none;
    padding: 0 0px;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}

.dropdown-menu {
  margin: 0;
  padding: 5px 0;
  color: #fff;
  font-family: Prompt;
  font-weight: normal;
  font-size: 16pt;
  line-height: 1.2em;
  text-align: left;
  list-style: none;
  background-color: #4A897C;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  /* border: 1px solid #ccc; */
  border-top: 0px solid #ccc;
  border-left: 0px solid #ccc;
  border-right: 0px solid #ccc;
  border-bottom: 0px solid #ccc;
  border-radius: 0px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
.dropdown-item {
  color: #fff;
  padding-left: 15px;
  padding-top: 3px;
  padding-bottom: 3px;
}
.dropdown-item:hover {
  color: #FFC107;
  background-color: transparent;
  text-decoration: none;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}

#slidex {
  margin-top: 0px;
  margin-bottom: 0px;
  background-color: #A8D1C9;
}
#slidex .caption-sm {
  position: absolute;
  right: 23%;
  bottom: 15px;
  left: 23%;
  z-index: 10;
  padding-top: 30px;
  padding-bottom: 15px;
  text-align: center;
}
#slidex .caption-sm h1 {
  color: #fff;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}

#slidex .caption-lg {
  position: absolute;
  right: 27%;
  bottom: 75px;
  left: 27%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: center;
}
#slidex .caption-box {
  color: #fff;
  background-color: #4A897C;
  border-radius: 12px !important;
  opacity: 0.75;
  z-index: 1;
}
#slidex .caption-box h1 {
  color: #fff;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}

.bg-dark-green {
  background-color: #4A897C;
}
.bg-light-green {
  background-color: #A8D1C9;
}
.dark-shadow {
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}
.bit-shadow {
  text-shadow: 1px 1px 2px rgba(00,00,00,0.75);
}

.dark-green-panel {
  color: #fff;
  background-color: #4A897C;
}
.dark-green-panel a {
  color: #fff;
}
.light-green-panel {
  color: #063F39;
  background-color: #A8D1C9;
}
.light-green-panel a {
  color: #063F39;
}
.contact-panel {
  color: #063F39;
  background-color: #A8D1C9;
}

.contact-panel a {
  color: #063F39;
}

.contact-form {
  color: #fff;
  background-color: #4A897C;
  text-shadow: 1px 1px 2px rgba(00,00,00,0.75);
  border-radius: 12px !important;
}

/*
#slidex {
  position: relative;
  margin: auto;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}
#slidex .land-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: #fff;
  background-color: #4A897C;
  border-radius: 12px !important;
  opacity: 0.75;
  z-index: 1;
}
.land-box h1 a {
  color: #fff;
  text-shadow: 1px 1px 2px rgba(00,00,00,0.75);
}
#slidex .contact-row {
  position: absolute;
  color: #fff;
  background-color: #4A897C;
  opacity: 0.75;
  z-index: 1;
}
*/

.breadcrumb {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 0.15rem 0rem 0.45rem 0rem;
  margin-bottom: 1rem;
  list-style: none;
  background-color: transparent;
  border-radius: 0.25rem;
  border-bottom: 0px solid #E9ECEF;
}

.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
  color: #868e96;
  content: ">";
}

h1 {
    font-family: Prompt;
    font-weight: 700;
    line-height: 1.0em;
}
h2,
h3,
h4,
h5,
h6 {
    font-family: ThaiSansNeueBold;
    font-weight: 700;
}
/*
h1 { font-size: 1.8em; }
h2 { font-size: 2.2em; }
h3 { font-size: 2.0em; }
h4 { font-size: 1.8em; }
h5 { font-size: 1.6em; }
h6 { font-size: 1.4em; }
*/
h1 { font-size: 20pt; }
h2 { font-size: 20pt; }
h3 { font-size: 18pt; }
h4 { font-size: 16pt; }
h5 { font-size: 14pt; }
h6 { font-size: 12pt; }

.heading1 {
  font-family: Prompt;
  font-weight: 700;
  font-size: 20pt;
  line-height: 1.1em;
}
.heading2 {
  font-family: ThaiSansNeueBold;
  font-weight: 700;
  font-size: 22pt;
}
.heading3 {
  font-family: ThaiSansNeueBold;
  font-weight: 700;
  font-size: 20pt;
}
.heading4 {
  font-family: ThaiSansNeueBold;
  font-weight: 700;
  font-size: 18pt;
}
.heading5 {
  font-family: ThaiSansNeueBold;
  font-weight: 700;
  font-size: 16pt;
}
.heading6 {
  font-family: ThaiSansNeueRegular;
  font-weight: 400;
  font-size: 14pt;
}

.fontSize24pt { font-size: 24pt; }
.fontSize22pt { font-size: 22pt; }
.fontSize20pt { font-size: 20pt; }
.fontSize18pt { font-size: 18pt; }
.fontSize16pt { font-size: 16pt; }
.fontSize14pt { font-size: 14pt; }
.fontSize12pt { font-size: 12pt; }
.fontSize10pt { font-size: 10pt; }
.fontWeight700 { font-weight: 700; }
.fontWeight400 { font-weight: 400; }
.lineHeight11em { line-height: 1.1em; }
.lineHeight12em { line-height: 1.2em; }
.lineHeight14em { line-height: 1.4em; }

.fontPrompt { font-family: Prompt; line-height: 1.1em; }
.fontThaiSansNeueRegular { font-family: ThaiSansNeueRegular; }
.fontThaiSansNeueBold { font-family: ThaiSansNeueBold; }

.text-blue { color: #1D76BC; }
.text-white { color: #fff; }
.text-white-grey { color: #bbb; }
.text-red { color: #E60000; }
.text-orange { color: #F15A29; }
.text-grey { color: #4d4d4d; }
.text-gold { color: #E1C17E; }
.text-green { color: #063F39; }
.bg-grey { background-color: #E9ECEF; }
.bg-darkgreen { background-color: #063E39 !important; }

.head-underline {
    margin: 0 auto;
    width: 125px; height: 5px;
    background-color: #333;
    border-radius: 2px;
}
.head-underline-green {
    margin: 0 auto;
    width: 125px; height: 5px;
    background-color: #245F2C;
    border-radius: 2px;
}
.head-underline-info {
    margin: 0 auto;
    width: 125px; height: 5px;
    background-color: #17A2B8;
    border-radius: 2px;
}


@media (min-width: 576px) {
    h2.topic {
      color: #A40001;
      font-family: CenturyGothic, ThaiSansNeueBold;
      font-weight: bold;
      font-size: 24pt;
      line-height: 1.0em;
    }
}

@media (min-width: 768px) {
  body {
    font-size: 18px;
    font-size: 1.8rem;
    line-height: 1.6em;
  }
/*
  .card img {
    height: 11em;
  }
*/

  #slider .carousel-dcaption {
    position: absolute;
    right: 15%;
    top: 25px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
  }
  #slider .carousel-dcaption h1 {
    font-style: 20pt;
  }
  #slider .carousel-dcaption h4 {
    font-style: 16pt;
  }
}

@media (min-width: 992px) {
    header { 
      height: 63px; 
      background-color: #E9ECEF;
    }
    #mainNav {
      width: 100%;
      height: 63px;
      z-index: 999;
      padding-top: 1px;
      line-height: 63px;
      -webkit-transition: height .5s, line-height .5s; /* Safari */
      transition: height .5s, line-height .5s;
      background-color: #4A897C;
    }
    #mainNav .navbar-nav .nav-item .nav-link {
      color: #fff;
      padding: 0 25px 0 0px;
      font-family: Prompt;
      font-weight: normal;
      font-size: 12pt;
    }
    .nav-link.active, .nav-link:hover {
      color: #FFC107;
      background-color: transparent;
    }
    #mainNav .navbar-brand {
      color: #fff;
      margin: 0; padding: 0;
      display: inline-block;
      font-family: Prompt;
      font-weight: bold;
      font-size: 14pt;
      -webkit-transition: all .5s;
      transition: all .5s;
    }

    .dropdown:hover>.dropdown-menu {
      display: block;
    }
    .dropdown-item {
      padding: 0 15px 0 12px;
      color: #fff;
      font-family: Prompt;
      font-weight: normal;
      font-size: 10pt;
      line-height: 1.6em;
    }

    h1 { font-size: 24pt; }
    h2 { font-size: 24pt; }
    h3 { font-size: 22pt; }
    h4 { font-size: 20pt; }
    h5 { font-size: 18pt; }
    h6 { font-size: 16pt; }

    .heading1 {
      font-family: Prompt;
      font-weight: 700;
      font-size: 28pt;
      line-height: 1.1em;
    }
    .heading2 {
      font-family: ThaiSansNeueBold;
      font-size: 28pt;
    }
    .heading3 {
      font-family: ThaiSansNeueBold;
      font-size: 24pt;
    }
    .heading4 {
      font-family: ThaiSansNeueBold;
      font-size: 22pt;
    }
    .heading5 {
      font-family: ThaiSansNeueBold;
      font-size: 20pt;
    }
    .heading6 {
      font-family: ThaiSansNeueBold;
      font-size: 18pt;
    }

  #slider .carousel-dcaption {
    position: absolute;
    right: 15%;
    top: 50px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
  }
  #slider .carousel-dcaption h1 {
    font-style: 24pt;
  }
  #slider .carousel-dcaption h4 {
    font-style: 20pt;
  }
}

@media (min-width: 1200px) {
    header { 
      height: 63px; 
      background-color: #E9ECEF;
    }
    .container-fluid {
      /* width: 1250px; */
      padding-right: 15px;
      padding-left: 15px;
      margin-right: auto;
      margin-left: auto;
    }
    #mainNav {
      width: 100%;
      height: 63px;
      z-index: 999;
      padding-top: 1px;
      line-height: 63px;
      -webkit-transition: height .5s, line-height .5s; /* Safari */
      transition: height .5s, line-height .5s;
      background-color: #4A897C;
    } 
    #mainNav .navbar-nav .nav-item .nav-link {
      color: #fff;
      padding: 0 30px 0 0px;
      font-family: Prompt;
      font-weight: normal;
      font-size: 14pt;
    }
    .nav-link.active, .nav-link:hover {
      color: #FFC107;
      background-color: transparent;
    }
    #mainNav .navbar-brand {
      color: #fff;
      margin: 0; padding: 0;
      display: inline-block;
      font-family: Prompt;
      font-weight: bold;
      font-size: 16pt;
      -webkit-transition: all .5s;
      transition: all .5s;
    }

    .dropdown:hover>.dropdown-menu {
      display: block;
    }
    .dropdown-item {
      padding: 0 25px 0 15px;
      color: #fff;
      font-family: Prompt;
      font-weight: normal;
      font-size: 12pt;
      line-height: 1.6em;
    }

  #slider .carousel-dcaption {
    position: absolute;
    right: 15%;
    top: 100px;
    left: 15%;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
  }
  #slider .carousel-dcaption h1 {
    font-style: 28pt;
  }
  #slider .carousel-dcaption h4 {
    font-style: 22pt;
  }
}

a.head-section {
  text-shadow: 2px 2px 3px rgba(00,00,00,0.5);
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

a:hover.head-section, 
a:focus.head-section {
  text-decoration: none;
  text-shadow: 2px 2px 3px rgba(00,00,00,0.5);
  -ms-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}

.card {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  min-width: 0;
  /* height: 100%; */
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
  box-shadow: 0 5px 10px rgba(0,0,0,0.16), 0 5px 10px rgba(0,0,0,0.23);
}
.card:hover {
  -webkit-box-shadow: 0px 0px 8px 0px rgba(23, 162, 184, 0.45);
  -moz-box-shadow:    0px 0px 8px 0px rgba(23, 162, 184, 0.45);
  box-shadow:         0px 0px 8px 0px rgba(23, 162, 184, 0.45);
  -ms-transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
  -moz-transition: all 0.5s ease;
  -o-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
.card-header {
  padding: 0.15rem 0.5rem 0 0.75rem;
}
.card-title {
  margin-bottom: 0.45rem;
  font-family: Prompt;
  font-size: 12pt;
  font-weight: 700;
  /* text-shadow: 1px 1px 2px rgba(00,00,00,0.75); */
}
.card-body {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  padding: 0.5rem 0.5rem 0.5rem 0.5rem;
  font-family: "Sarabun",sans-serif !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  font-size: 1.5rem !important;
  line-height: 1.4 !important;
}
.card-deck .card-none {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 0 0%;
        flex: 1 0 0%;
    -ms-flex-direction: column;
        flex-direction: column;
    margin-right: 15px;
    margin-bottom: 0;
    margin-left: 15px;
}
.card-footer {
  padding: 0;
  background-color: rgba(0, 0, 0, 0.03);
  border-top: 0px solid rgba(0, 0, 0, 0.125);
  font-family: ThaiSansNeueRegular;
  font-size: 18pt;
  line-height: 1.0em;
}
.card-header.bg-green { background-color: #084B46; }

.cards-wrapper {
  display: flex;
  justify-content: center;
}
/*
.card img {
  max-width: 100%;
  max-height: 100%;
}
.card {
  margin: 0 0.5em;
  box-shadow: 2px 6px 8px 0 rgba(22, 22, 26, 0.18);
  border: none;
  border-radius: 0;
}
.carousel-inner {
  padding: 0em;
}
*/
.carousel-control-prev,
.carousel-control-next {
  width: 5vh;
  height: 5vh;
  top: 50%;
  transform: translateY(-50%);
}

.carousel-indicators {
  margin-bottom: -10px;
  list-style: square;
}
.carousel-indicators li {
  box-sizing: content-box;
  -ms-flex: 0 1 auto;
  flex: 0 1 auto;
  width: 25px;
  height: 0px;
  margin-right: 3px;
  margin-left: 3px;
  text-indent: -999px;
  cursor: pointer;
  background-color: #fff;
  background-clip: padding-box;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  opacity: .5;
  transition: opacity 0.6s ease;
}

a {
    color: #28A745; /* #00839B; */
    /* border-bottom: 1px dotted #AE8422; */
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}

a:hover,
a:focus {
    color: #063F39;
    text-decoration: none;
    /* border-bottom: 1px dotted #333; */
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

input[type='text'], 
input[type='email'], 
textarea {
  /*  font: normal 18px NotoSansThaiRegular, sans-serif; */
  font-family: "Sarabun",sans-serif !important;
  font-weight: 400 !important;
  font-size: 15px !important;
  font-size: 1.5rem !important;
  line-height: 1.5 !important;
  border-radius: 12px !important;
  resize: none;
}

#slider {
    margin-top: 0px;
    margin-bottom: 0px;
    text-align: center;
    /* background-color: #BACAD3; */
}
#slider .carousel-caption {
  position: absolute;
  right: 15%;
  bottom: 110px;
  left: 15%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}
.carousel.carousel-fade .carousel-item {
    display: block;
    opacity: 0;
    transition: opacity ease-out .7s;
}
.carousel.carousel-fade .carousel-item.active {
    opacity: 1 !important;
}

#slider .carousel-dcaption {
  position: absolute;
  right: 5%;
  bottom: 5px;
  left: 5%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  text-shadow: 2px 2px 3px black, 0 0 25px grey, 0 0 5px darkblue;
}
#slider .carousel-dcaption h1 {
  font-style: 14pt;
}
#slider .carousel-dcaption h4 {
  font-style: 12pt;
}




#banner {
  background-color: #D1D2D4;
}
#map {
    width: 100%;
    height: 450px;
}

.page-item.active .page-link {
  z-index: 2;
  color: #fff;
  background-color: #6C757D;
  border-color: #6C757D;
}

.fadein { opacity: 0; padding-top:10px; }

footer {
    font-weight: normal;
    font-size: 14px !important;
    font-size: 1.4rem !important;
    line-height: 1.5 !important;
    color: #fff; background-color: #4A897C; /* #063e39; */
    text-shadow: 1px 1px 2px rgba(00,00,00,0.75);
}
footer a {
    color: #fff;
    -webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
}
footer a:hover,
footer a:focus {
    color: #fff;
    text-decoration: underline;
    /* text-shadow: 2px 2px 3px rgba(00,00,00,0.75); */
}

.footer-section {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    /* z-index: 1; */
}
.footer-section::before {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: "";
    background-color: #282923;
    opacity: 0.80;
    /* z-index: -1; */
}

.no-margin { margin: 0; }
.no-margin-left { margin-left: 0; }
.no-margin-right { margin-right: 0; }
.no-padding { padding: 0; }
.no-padding-left { padding-left: 0; }
.no-padding-right { padding-right: 0; }

.form-group { margin-bottom:0px !important; }  
.form-control-feedback { top:0px !important; } 

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } 
.embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.opacity img
{
    opacity:0.9;
}
.opacity img:hover
{
    opacity:1;
}

.zoom img
{
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
}
.zoom img:hover
{
    transform: scale(1.09);
}

.grey-geo {
  background-image: url(../images/grey-geo.png);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #464646;
}

.grey-diamond {
  background-image: url(../images/grey-diamond.png);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.project-bg {
  background-image: url(../images/bwp-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.property-bg {
  background-image: url(../images/search-bg2.jpg);
  background-position: center bottom;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.blog-bg {
  background-image: url(../images/blog-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.agent-bg {
  background-image: url(../images/agent-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.contact-bg {
  background-image: url(../images/contact-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #171940;
}

.granit-bg {
  background-image: url(../images/granit-bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #f7f7f7;
}

.light-orange-row {
  margin:0px;
  color: #333;
  background-color: #E9ECEF;
  line-height: 1.4em;
}
.light-orange-row:hover {
  color: #000;
  background-color: #CCC;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.light-orange-row a {
    color: #063F39;
    text-shadow: 2px 2px 3px rgba(255,255,255,0.5);
}
.light-orange-row a:hover {
    color: #28A745;
    text-decoration: none;
    text-shadow: 2px 2px 3px rgba(255,255,255,0.5);
}

.content {
  position: relative;
  margin: auto;
  overflow: hidden;
}

.content .content-overlay {
  background-color: rgba(48, 152, 157, 0.4);
  position: absolute;
  height: 99%;
  width: 100%;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  -webkit-transition: all 0.4s ease-in-out 0s;
  -moz-transition: all 0.4s ease-in-out 0s;
  transition: all 0.4s ease-in-out 0s;
}

.content:hover .content-overlay{
  opacity: 1;
}

.content-image{
  width: 100%;
}

.content-details {
  position: absolute;
  text-align: center;
  padding-left: 1em;
  padding-right: 1em;
  width: 100%;
  top: 50%;
  left: 50%;
  opacity: 0;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

.content:hover .content-details{
  top: 50%;
  left: 50%;
  opacity: 1;
}

.content-details h6{
  color: #fff;
  font-weight: 500;
  letter-spacing: 0.15em;
  margin-bottom: 0.5em;
  text-transform: uppercase;
}

.content-details p{
  color: #fff;
  font-size: 0.8em;
}

.fadeIn-bottom{
  top: 80%;
}

.fadeIn-top{
  top: 20%;
}

.fadeIn-left{
  left: 20%;
}

.fadeIn-right{
  left: 80%;
}

.embed-responsive-27by9::before {
  padding-top: 33.33%;
}

/*
*
* ==========================================
* CUSTOM UTIL CLASSES
* ==========================================
*
*/

.btn-circle {
  width: 45px;
  height: 45px;
  line-height: 45px;
  text-align: center;
  padding: 0;
  border-radius: 50%;
}

.btn-circle i {
  position: relative;
  top: -1px;
}

.btn-circle-sm {
  width: 65px;
  height: 65px;
  line-height: 35px;
  font-size: 0.9rem;
}

.btn-circle-lg {
  width: 95px;
  height: 95px;
  line-height: 95px;
  font-size: 1.1rem;
}

.btn-circle-xl {
  width: 125px;
  height: 125px;
  line-height: 125px;
  font-size: 2.8rem;
}

.btn-primary {
/*
  color: #fff;
  background-color: #053B3A;
  border-color: #007bff;
*/
  border-radius: 12px;
}
.btn-primary:hover {
/*
  color: #fff;
  background-color: #00312D;
  border-color: #053B3A;
*/
}

.btn-info {
  border-radius: 12px;
}

.btn-light {
  color: #212529;
  background-color: #f8f9fa;
  border-color: #f8f9fa;
  border-radius: 12px;
}
.btn-light:hover {
  color: #212529;
  background-color: #e2e6ea;
  border-color: #dae0e5;
}

.btn-warning {
  color: #212529;
  background-color: #ffc107;
  border-color: #ffc107;
  border-radius: 12px;
}

.btn-success {
  color: #fff;
  background-color: #28a745;
  border-color: #28a745;
  border-radius: 12px;
}