:root {
  --main-color: #dcd2c2;
  --second-color: #f3f0e6;
}
/*------------------------------------------------------

	Theme Name: Cartel
	Type: Layout css
	Author: UDTHEMES
	Author URI: http://udthemes.com

/*------------------------------------------------------

	CSS TOB: 

	1. RESETS
	2. COMMONS
	3. STRUCTURAL
	4. TYPO & LINKS
	5. MISC
		
---------------------------------------------------------*/

/*--------------------------------------------------------
	1.RESETS & MISC
--------------------------------------------------------*/

html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
}

header,
nav,
section,
article,
aside {
  display: block;
}

/*--------------------------------------------------------
	2.COMMONS
--------------------------------------------------------*/

body {
  background: #fff;
  font: 15px/19px "OpenSans", sans-serif;
  color: #000;
}

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}

/*body#index {*/
/*background-color: white;*/
/*background-image: url('../images/index/i_index_01.jpg');*/
/*background-repeat: no-repeat;*/
/*background-position: center center;*/
/*-webkit-background-size: cover;*/
/*-moz-background-size: cover;*/
/*-o-background-size: cover;*/
/*background-size: cover;*/
/*}*/

/*body#index1 {*/
/*background-color: white;*/
/*background-image: url('../images/index/i_index_01.jpg');*/
/*background-repeat: no-repeat;*/
/*background-position: center center;*/
/*-webkit-background-size: cover;*/
/*-moz-background-size: cover;*/
/*-o-background-size: cover;*/
/*background-size: cover;*/
/*}*/

/*body#index2 {*/
/*background-color: white;*/
/*background-image: url('../images/index/i_index_02.jpg');*/
/*background-repeat: no-repeat;*/
/*background-position: center center;*/
/*-webkit-background-size: cover;*/
/*-moz-background-size: cover;*/
/*-o-background-size: cover;*/
/*background-size: cover;*/
/*}*/

/*body#index3 {*/
/*background-color: white;*/
/*background-image: url('../images/index/i_index_03.jpg');*/
/*background-repeat: no-repeat;*/
/*background-position: center center;*/
/*-webkit-background-size: cover;*/
/*-moz-background-size: cover;*/
/*-o-background-size: cover;*/
/*background-size: cover;*/
/*}*/

.F-Frank {
  font-family: "FrankRuhlLibre";
}
.f-16 {
  font-size: 16px;
}
.f-18 {
  font-size: 18px;
}
.f-22 {
  font-size: 22px;
  line-height: 22px;
}

/*--------------------------------------------------------
	3.STRUCTURAL 
--------------------------------------------------------*/
.search-control2 {
  display: none !important;
}
.ban {
  position: relative;
  margin: 0 auto;
  top: 0px;
  float: left;
  width: 100% !important;
  height: 100%;
  overflow: hidden;
  visibility: hidden;
}
.ban2 {
  position: absolute;
  top: 0px;
  left: 0px;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.7);
}
.box-ban {
  cursor: default;
  position: relative;
  top: 0px;
  left: 0px;
  width: 100% !important;
  height: 971px;
  overflow: hidden;
}
.logo-ban {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
/*.image{
	width: 100%;
	height: 100% !important;
	}*/
#wrapper {
}
.wrapper {
  display: block;
  min-height: 100%; /* real browsers */
  height: auto !important; /* real browsers */
  height: 100%; /* IE6 bug */
  /*padding-bottom: 100px;*/
  /*margin-bottom: -100px;*/ /* เธเธณเธซเธ™เธ” margin-bottom เนƒเธซเน‰เธ•เธดเธ”เธฅเธšเน€เธ—เนˆเธฒเธเธฑเธšเธ„เธงเธฒเธกเธชเธนเธ‡เธ‚เธญเธ‡ footer */
}

.wrapper-project {
  display: block;
  min-height: 100%; /* real browsers */
  height: auto !important; /* real browsers */
  height: 100%; /* IE6 bug */
  padding-bottom: 50px;
  margin-bottom: -50px; /* เธเธณเธซเธ™เธ” margin-bottom เนƒเธซเน‰เธ•เธดเธ”เธฅเธšเน€เธ—เนˆเธฒเธเธฑเธšเธ„เธงเธฒเธกเธชเธนเธ‡เธ‚เธญเธ‡ footer */
}
.menuBar {
  height: 50px;
  width: 100%;
  /* background-color: #aba683; */
/*   background-color: var(--main-color); */
	background-color: #9a9a74;
  position: fixed;
  overflow: hidden;
  top: 0;
  z-index: 10;
}
.menuBar-index {
  height: 50px;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.container {
  max-width: 960px;
  margin: 20px auto;
}
.menuLogo {
  float: right;
}
.menuLogo img {
 max-height: 74px;
 margin: -15px 0px 0px 0;
}
.footer {
  height: 50px; /* เธ„เธงเธฒเธกเธชเธนเธ‡เธ‚เธญเธ‡ footer */
  display: block;
  text-align: center;
  background-color: #aba683;
}
@media all and (min-width: 480px) {
  .container {
    padding: 0px 24px 0px 24px;
  }
  .footer {
    padding: 24px 0 24px 0;
  }
}
/*@media all and (min-width: 720px) {
  .container {
    padding: 0px 48px 0px 48px;
  }
  .footer {
    padding:30px 0 30px 0;
  }
}*/

/*--------------------------------------------------------
	iv.--TYPOGRAPHY & LINKS & SELECTION
--------------------------------------------------------*/

/*font & color*/
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Work Sans", "OpenSans", sans-serif;
  letter-spacing: 0;
  margin-bottom: 20px;
  color: #000;
}
h1 span,
h2 span,
h3 span,
h4 span,
h5 span,
h6 span {
  font-family: "Work Sans", "OpenSans", sans-serif;
  font-weight: normal;
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
  text-decoration: none;
  border-bottom: 0 !important;
}
a {
  color: #000;
  text-decoration: none;
}
a:hover {
  color: #8d7f1b;
  text-decoration: none;
}
p {
	font-family: "Montserrat", serif;
/*   font-family: "Work Sans", "OpenSans", sans-serif;
  font-family: 'Playfair Display','OpenSans', sans-serif; */
  margin-bottom: 0px;
}
.font-playfair-display {
  font-family: "Playfair Display", "OpenSans", sans-serif;
}
.font-Work-Sans {
  font-family: "Work Sans", "OpenSans", sans-serif;
}

/*sizes*/
h1 {
  font-size: 90px;
  line-height: 74px;
}
h2 {
  font-size: 80px;
  line-height: 66px;
}
h2.person-name {
  font-size: 35px;
  line-height: 35px;
  margin-bottom: 30px;
}
h3 {
  font-size: 70px;
  line-height: 58px;
}
h4 {
  font-size: 60px;
  line-height: 48px;
}
h5 {
  font-size: 30px;
  line-height: 28px;
}
h6 {
  font-size: 22px;
  line-height: 20px;
}

/*highlight selection*/
::selection,
::-moz-selection {
  background: #ff0000;
  color: #fff;
}
::-moz-selection {
  background: #ff0000;
  color: #fff;
}
::-webkit-selection {
  background: #ff0000;
  color: #fff;
}

.center {
  text-align: center;
}
.bottom-padding {
  padding-bottom: 20px;
}

/*--------------------------------------------------------
	v.--MISC
--------------------------------------------------------*/

.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.left {
  float: left !important;
}
.right {
  float: right !important;
}
.last {
  margin: 0 0 50px 0;
}

/* ---------------------------ADD CSS */
.bg-theme {
  background-color: #ddd;
}
.pointer {
  cursor: pointer;
}
.bold {
  font-weight: bold;
}
.margin-0 {
  margin: 0;
}
.open-nav {
  padding: 15px 0 0 32px;
  font-size: 20px;
  cursor: pointer;
  color: #ffffff;
}
.open-nav img {
  margin-top: 5px;
}
/* The Overlay (background) */
.overlay {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */
  height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 999; /* Sit on top */
  left: 0;
  top: 0;
  background-color: rgb(255, 255, 255); /* Black fallback color */
  background-color: rgba(255, 255, 255, 0.8); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
  color: #666;
  position: relative;
  top: 10%; /* 25% from the top */
  left: 10%;
  width: 100%; /* 100% width */
  /*max-width:350px;*/
  /*height:100%;*/
  text-align: left; /* Centered text/links */
  margin: 30px auto 0 auto; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 50px;
  line-height: 45px;
  color: #666;
  display: block; /* Display block instead of inline */
  transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover,
.overlay a:focus {
  color: #313131;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
  position: absolute;
  top: -2px;
  left: 25px;
  font-size: 40px;
}

.menu-copyright {
  /*padding-top:50%;*/
  /*position:absolute;
	bottom:0;*/
  position: relative;
  margin: 0px 0 20px 0;
  color: #313131;
  padding-left: 8px;
}
.sub-menu {
  text-align: left;
  /*padding-left: 20px;*/
}
.sub-menu a {
  font-size: 35px;
  line-height: 22px;
}
/*career*/
.career-p p {
  color: gray;
  font-size: 12px;
}
/*---------------------*/

/* When the height of the screen is less than 450 pixels, change the font-size of the links and position the close button again, so they don't overlap */
@media screen and (max-width: 450px) {
  .overlay a {
    font-size: 31px;
    line-height: 35px;
  }
  .sub-menu a {
    font-size: 25px;
    line-height: 18px;
  }
  /*.overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }*/
}

@media screen and (max-height: 450px) {
  /*.overlay a {
        font-size: 20px;
    }*/
  /*.overlay .closebtn {
        font-size: 40px;
        top: 15px;
        right: 35px;
    }*/
}
.headText h5 {
  padding: 30px 0 20px 0;
  font-size: 30px;
  line-height: 25px;
  text-transform: uppercase;
}
.padding-right-0 {
  padding-right: 0;
}
.padding-left-0 {
  padding-left: 0;
}
th {
  text-align: left;
  font-weight: bold;
}
.tb-head {
  background-color: #eeede8;
  font-weight: bold;
}
.img-w-thumb {
  width: 100%;
}
.w-thumb {
  margin: 0;
}

.w-thumb [class*="col-"] {
  padding: 0px;
}
@media all and (max-width: 991px) {
  input.form-control.search {
    display: inline-block;
    width: 100%;
    font-size: 12px;
    margin: 5px 0;
    padding-right: 15px;
  }
  .padding-right-0 {
    padding-right: 15px;
  }
}
.contact-address {
  max-width: 350px;
  text-align: center;
  margin: 0 auto;
}
#map {
  width: 100%;
  height: 300px;
  background-color: #ccc;
  margin-bottom: 50px;
}
.career-text {
  margin: 0 40px;
}
.activities-row-1 {
  margin: 30px 0 0 0;
  padding-bottom: 15px;
  border-bottom: 1px solid #999;
}
.activities-row-1 div[class*="col-"] {
  padding: 0px 0px;
  /*position:relative;*/
}
.box-a-img {
  margin: 5px 5px;
  position: relative;
  /*width: 100%;*/
  padding-top: 100%;
}
.box-a2-img {
  margin: 5px 5px;
  position: relative;
  width: 100%;
  padding-top: 100%;
}
.activities-row-2 {
  margin: 0;
  padding: 15px 0 0 0;
}

.activities-row-2 div[class*="col-"] {
  padding: 0px 0px;
}
.activities-view-text {
  max-width: 800px;
  margin: 0;
  text-align: center;
}
.activities-view-text h5 {
  font-size: 24px;
}
.about-text {
  max-width: 800px;
  margin: 0 auto;
}
.people-img {
  max-width: 1200px;
  margin: 20px auto 20px auto;
}
.about-img {
  /*max-width:1500px;*/
  max-width: 1200px;
  margin: 0 auto;
}
.philo-img1 {
  display: none;
}
@media all and (max-width: 991px) {
  .philo-img1 {
    display: block;
  }
  .philo-img2 {
    display: none;
  }
}
.people-text {
  max-width: 800px;
  margin: 0 auto;
}

.hoverImage {
  overflow: hidden;
}
.hoverImage:hover {
  cursor: pointer;
}
.hoverImage:hover img {
  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}

/* -----------Work hover */
.img-w-thumb {
  opacity: 1;
  display: block;
  width: 100%;
  transition: 0.5s ease;
  backface-visibility: visible;
}
.img-w-text {
  transition: 0.5s ease;
  height: 100%;
  width: 100%;
  background-color: #aba683;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.7;
}
.img-w-name {
  color: #fff;
  font-size: 16px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  text-align: center;
}

/* -----------Activities hover */
.a-hoverImage {
  overflow: hidden;
}
.a-hoverImage:hover {
  cursor: pointer;
}
.img-a-thumb {
  opacity: 1;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.img-a2-thumb {
  opacity: 1;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  height: 100%;
  /*width: 100%;*/
}
.img-a-text {
  transition: 0.5s ease;
  height: 50%;
  width: 100%;
  background-color: #989898;
  position: absolute;
  top: 50%;
  left: 0px;
  opacity: 0.9;
  overflow: hidden;
}
.img-a2-text {
  transition: 0.5s ease;
  height: 50%;
  width: 100%;
  background-color: #989898;
  position: absolute;
  top: 50%;
  left: 0px;
  opacity: 0.9;
  overflow: hidden;
}
.img-a-name p {
  margin: 0;
}
.img-a2-name p {
  margin: 0;
}
.img-a-name {
  width: 90%;
  color: #fff;
  font-size: 12px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.img-a2-name {
  width: 90%;
  color: #fff;
  font-size: 12px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
}
.workPage {
  max-width: 1500px;
  width: 100%;
  padding: 0 20px;
  margin: 0 auto;
}
.div-map-work {
  font-size: 12px;
  line-height: 12px;
}
.dot-map {
  width: 8px;
  cursor: pointer;
  position: relative;
  z-index: 9;
}
.div-text {
  cursor: context-menu;
  position: relative;
  background-color: #fff;
}
.w-map-textBox {
  font-size: 12px;
  z-index: 999;
  padding: 20px;
  position: absolute;
  top: 220px;
  left: 50%;
  margin-left: -300px;
  width: 600px;
  /*max-height:700px;*/
  background: rgb(
    171,
    166,
    131
  ); /* Fallback for older browsers without RGBA-support */
  background: rgba(171, 166, 131, 0.7);
  /* background: var(--second-color); */
}
.people-name {
  font-weight: 500;
  margin: 0;
  padding-top: 10px;
}
.people-position {
  font-size: 12px;
}
.contact-input {
  color: #000000;
  width: 100%;
  height: auto;
  padding: 0.7rem 1rem;
  border: none;
  background: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  box-shadow: none;
  font-size: 0.875rem;
  -webkit-transition: all 0.2s ease-in 0s;
  transition: all 0.2s ease-in 0s;
}
.search-control {
  /*margin: 5px 0;*/
  display: block;
  width: 100%;
  height: 45px;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 1.42857143;
  color: #555;
  background-color: #fff;
  background-image: none;
  border: 0px solid #ccc;
  /* border-radius: 4px; */
  /* -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); */
  /* box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); */
  /* -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; */
  /*-o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;*/
  /*transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;*/
}
input.search-control.search {
  border-bottom: 1px solid rgba(0, 0, 0, 0.3);
  display: inline;
  font-size: 14px;
  height: 45px;
  padding: 5px 0;
  /*width: 140px;*/
}
.search-btn-white {
  background-color: #ffffff;
  border: 1px solid #ccc;
}
.searchBox {
  width: 100%;
  padding: 0px 0;
  /*height: 45px;*/
  /* border-bottom: 1px solid #ccc; */
  /* border-top: 1px solid #ccc; */
}
.form-control.inline {
  /*font-size: 12px;*/
  margin: 5px 0;
}
input.form-control.search {
  display: inline;
  font-size: 12px;
  margin: 5px 0;
  max-width: 140px;
}
.m-viewWork {
  float: right;
  padding-top: 10px;
  font-size: 12px;
  margin: 9px 2px 9px 0;
}
.m-viewWork a span {
  font-size: 17px;
  color: #ccc;
  margin: 0 5px;
}
.m-viewWork a span.active {
  color: #000;
}
.search-border-right {
  border-right: 1px solid #ccc;
}
@media all and (max-width: 991px) {
  .search-border-right {
    border-right: none;
  }
  .w-map-textBox {
    top: 450px;
    width: 320px;
    margin-left: -160px;
    /*max-height:700px;*/
  }
}

/*
 * Port folio 
 ****************************/

img.hide {
  opacity: 0;
}

img.show {
  opacity: 1;
}

.project-thumbnail {
  cursor: pointer;
  position: relative;
  width: 210px;
  height: 140px;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.5);
}

.project-thumbnail img {
  /*filter:url(filters.svg#grayscale);
	filter: gray;
	-webkit-filter:grayscale(1);
	 -webkit-backface-visibility: hidden;  Fix for transition flickering 

		
	-webkit-transition: all linear 0.3s;
     -moz-transition: all linear 0.3s;
       -o-transition: all linear 0.3s;
          transition: all linear 0.3s;*/
}

.project-thumbnail img:hover {
  filter: none;
  /*	-webkit-filter:grayscale(0);*/
}

.project-thumbnail .thumbnail-film {
  width: 0%;
  height: 0%;
  top: 0;
  left: 0;
  position: absolute;

  background-color: rgba(0, 0, 0, 0);

  -webkit-transition: background-color linear 0.2s;
  -moz-transition: background-color linear 0.2s;
  -o-transition: background-color linear 0.2s;
  transition: background-color linear 0.2s;
}

/*
.project-item:hover .project-thumbnail .thumbnail-film{

	background-color:rgba(0, 0, 0, 0.5); 
}

.project-item.disabled:hover .project-thumbnail { cursor: default;}
.project-item.disabled:hover .project-thumbnail .thumbnail-film{
	background-color:rgba(0, 0, 0, 0.0);
}
*/

#project-container {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.8);
  display: none;
}

.project-fullscreen-inner {
  height: 100%;
}

#project-container .btn-toolbar {
  margin-top: 0;
  margin-bottom: 0;
}

.project-type-list-container {
  /*	margin-top:0;*/
  margin-top: 19px;
}

.project_title {
  width: 600px;
  margin: 0 auto;
  text-align: center;
  color: #ccc;
  position: absolute;
  top: 10px;
  left: 50%;
  margin-left: -300px;
  font-size: 20px;
  text-shadow: #333 0 -1px;
}

.bullet-list.project-type-list {
  height: 42px;
  position: relative;
  /*margin-left:80px;*/
}

.bullet-list .project-type-list li {
  background: url(../img/bullet_square.png) left top no-repeat;
  margin-left: 52px;
  font-size: 11px;
  text-indent: 10px;
}

.bullet-list.project-type-list li:first-child {
  margin-left: 0;
}
.bullet-list.project-type-list li.mini {
  /*width:80px;*/
  /*position:absolute;
	left:-80px;
	top:0;*/
}

.bullet-list.project-type-list li a:hover,
.bullet-list.project-type-list li a.selected {
  color: #ebed95;
}

.project-list-container {
  margin-top: -21px;
  width: 100%;
  position: relative;

  /*height:600px;
	overflow-y:scroll;*/
}

.project-list-all {
  /*border-top:1px solid white;*/
  margin-left: -5px;
  overflow: auto;
}
.project-list-all li:first-child {
  border-top: 1px solid #bec3a0;
  /* 	padding: 5px 0 15px; */
}
.project-list-all li {
  /*background:red;*/
  overflow: hidden;
  font-size: 11px;
}
.project-list-all li span {
  display: block;
  float: left;
  margin: 4px 0;
}

.project-list-all .list-name {
  width: 70%;
}
/* .project-list li.column-right {margin: 0 0 0 45px;} */
/* .project-list li.column-left {clear:both;} */

.project-list {
  position: relative;
}

.project-item {
  width: 210px;
  height: 200px;
  margin: 10px 15px 15px;

  /*float:left;*/
  position: absolute;
}

.project-item.disabled {
  cursor: default;
}

.project-item h3 {
  border-top: 1px solid white;
  font-size: 11px;
  line-height: 1.6em;
  font-family: "gotham_lightregular";
  font-weight: normal;
}

.project-list-item {
  cursor: pointer;
}

.project-list-item:hover {
  color: #ebed95;
}

.project-list-item.no-image a:hover {
  color: #fff !important;
}

/*
 * Port folio  Full screen
 ****************************/

.portfolio-nav-container {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 40px;
  background-color: rgb(0, 0, 0);
  background-color: #aba683;
  z-index: 3;
}

.portfolio-nav-container .project-title {
  font-weight: bold;
  font-size: 11px;
  line-height: 1;
  text-align: center;
  width: 200px;
  margin: 0px auto;
  color: #ffffff;
}

.portfolio-nav-container .project-title div {
  color: #ffffff;
  display: inline;
  height: 40px;
  line-height: 40px;
}

.portfolio-nav-container .project-title div span {
  display: inline-block;
  vertical-align: middle;
  line-height: 9px;
}

.portfolio-nav-container .project-title small {
  font-size: 11px;
}

.portfolio-nav {
  position: absolute;
  top: 14px;
  width: 80px;
  font-weight: bold;
  font-size: 11px;
  line-height: 1;
  color: #666;
}

.portfolio-nav strong {
  color: #b17045;
  font-weight: bold;
}

.portfolio-nav i {
  position: absolute;
  top: 0;
}

.portfolio-nav:hover {
  color: #eeefb5;
}

.portfolio-nav-prev {
  left: 5%;
}

.portfolio-nav-prev i {
  left: -20px;
}

.portfolio-nav-next {
  right: 5%;
  text-align: right;
}

.portfolio-nav-next i {
  right: -20px;
}

.portfolio-nav-label {
  border-top: 1px solid white;
  padding: 10px 5px;
  width: 80px;

  position: absolute;
  bottom: 64px;
  left: 30px;
  z-index: 1;
}

.preload {
  background: url(../img/preload6.gif) left top no-repeat;
  width: 40px;
  height: 9px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -20px;
  margin-top: -5px;
  z-index: 1;
  opacity: 0.3;
}

.project-info {
  font-size: 14px;
  position: fixed;
  bottom: 40px;
  max-width: 400px;
  width: 100%;
  max-height: calc(100vh - 40px);
  background-color: rgba(255, 255, 255, 0.9);
}

.project-info.full_bg {
  top: 0px;
}

.project-info-inner {
  /* max-height: calc(100vh - 120px);
	height: calc(100vh - 120px); */
  width: 100%;
  padding: 10px 20px;
  z-index: 9999;
}

.project-info-inner .jspVerticalBar {
  right: -5px;
}

.project-info h4 {
  font-family: "gotham_lightregular";
  font-weight: normal;
  font-size: 11px;
  line-height: 1;
  margin: 4px;
  color: #fff;
}

.project-info-inner .detail {
  display: flex;
}

.project-info-inner p {
  margin-right: 5px;
}

.project-info-inner p.bold,
.project-info-inner p strong {
  font-weight: 600;
}

.project-info ul li span.label {
  background: none;
  width: 100px;
}

.project-info dt {
  width: 70px;
  font-size: 11px;
  float: left;
}

.project-info dd {
  margin-left: 80px;
}

.project-info .info-sign {
  /*background:url(../img/info-sign.jpg) left top no-repeat;*/
  font-weight: bold;
  position: absolute;
  top: -22.5px;
  left: 0;
}

.btn-toggle-info {
  display: inline-block;
  margin-right: 3px;
  cursor: pointer;
  background: url(../img/sprite.png) -120px -20px no-repeat;
  width: 25px;
  height: 15px;
}

.btn-toggle-info.showing {
  background-position: -120px 0px;
}

.btn-toggle-info:hover {
  color: #eeefb5;
}

.btn-toggle-info i {
  background-color: white;
  border: 2px solid white;
  margin-top: -3px;
}
.btn-toggle-info:hover i {
  background-color: #eeefb5;
  border: 2px solid #eeefb5;
}

.btn-close.btn-big {
  background: url(../img/sprite.png) -80px 0 no-repeat;
  width: 26px;
  height: 26px;
  position: absolute;
  top: 70px;
  right: 30px;
  border: none;
  cursor: pointer;
  z-index: 400;
}

.nextContainer,
.prevContainer {
  position: absolute;
  height: 80px;
  width: 60px;
  top: 50%;
  margin-top: -40px;

  -webkit-transition: background-color linear 0.2s;
  -moz-transition: background-color linear 0.2s;
  -o-transition: background-color linear 0.2s;
  transition: background-color linear 0.2s;
}

.nextContainer {
  right: 0;
}
.prevContainer {
  left: 0;
}

.nextContainer:hover,
.prevContainer:hover {
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.3);
}

.next,
.prev {
  display: block;
  background: url(../img/sprite.png) left top no-repeat;
  width: 40px;
  height: 50px;
  margin-top: -25px;
  position: absolute;
  top: 50%;
  right: -20px;

  z-index: 400;

  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;

  -webkit-transition: linear 0.2s;
  -moz-transition: linear 0.2s;
  -o-transition: 0.2s;
  transition: 0.2s;
}

.next {
  background-position: -40px 0;
  right: 10px;
}
.prev {
  background-position: 0 0;
  left: 10px;
}

.selectorsBlock {
  position: absolute;
  left: 50%;
  bottom: 50px;
  z-index: 500;
}
.selectors {
  overflow: hidden;
}
.selectors .item {
  width: 5px;
  height: 5px;
  background-color: #ddd;
  background-color: rgba(255, 255, 255, 0.4);
  margin: 0 5px;
  float: left;
}

.selectors .item:hover {
  background-color: white;
}
.selectors .item.current {
  background-color: white;
}

#main-nav a.btn-facebook,
#main-nav a.btn-googlemap {
  display: inline-block;
  width: 15px;
  height: 15px;
  background: url(../img/icon-facebook.png) left top no-repeat;
}
#main-nav a.btn-googlemap {
  background: url(../img/google-map.jpg) left top no-repeat;
}

.imagewall-container {
  overflow: hidden;
  width: 100%;
  margin-top: 0;
  background: rgb(122, 111, 87);
  background: rgba(122, 111, 87, 0.7);
}

.imagewall {
  position: relative;
  width: 7000px;
  height: 100%;
}

.imagewall > div {
  height: 100%;
  position: relative;
  float: left;
}

.imagewall.animating {
  -webkit-transition: all 0.5s;
  -khtml-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.imagewall img {
  height: 100%;
  /* 	float:left; */
  max-height: 100%;
  width: auto;
  max-width: none;

  -webkit-transition: all 0.5s;
  -khtml-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.underline {
  text-decoration: underline !important;
}
.hover-theme:hover {
  color: #8d7f1b;
}

.pj-name {
  width: 180px;
  float: left;
}
.pj-i-button {
  width: 20px;
  float: right;
}

@media all and (max-width: 991px) {
  .portfolio-nav-prev {
    left: 1%;
  }
  .portfolio-nav-next {
    right: 1%;
  }
  .portfolio-nav-container .project-title {
    width: 130px;
  }
  .pj-name {
    width: 110px;
  }
  .pj-i-button {
    width: 20px;
  }
}

#block_data_row p {
  margin-bottom: 5px;
}

input:disabled::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #ccc;
}
input:disabled:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #ccc;
}
input:disabled::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #ccc;
}
input:disabled:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #ccc;
}
.paging {
  width: 100%;
  max-width: 1200px;
  margin: 10px auto 40px auto;
  text-align: center;
}
.paging img {
  margin: 0 5px;
  cursor: pointer;
}
/*.block-body-w{
	margin-top: 5px;
}
.block-content-w{
	padding: 0 10px 0 10px;
	}
.block-work{
	width: 100% !important; 
	padding: 0px;
	float: left;
	margin-top: 15px;
	margin-bottom: 15px;
}
.block-work:hover{
  transition: .5s ease;
  width:100%;
  background-color: #aba683;
  opacity: 0.6;
}
.block-work img{
	width: 100%;
	height: auto;
	margin-bottom: -10px;
}
.detail-work{
	padding: 15px;
	margin-top: 5%;
	margin-bottom: -10px;
}
.detail-work h5{ 
	padding-bottom: 5px;
	color: #000;
	line-height: 20px;
	padding-left: 5px;
	font-size: 18px;
	margin-top: -10px;

}
.detail-work p{
	color: #acacac;
	padding-left: 5px;
	font-size: 13px;
	margin-bottom: 15px;
	margin-top: -30px;
	padding-top: 5px;
}*/

input.form-control.search {
  display: inline;
  font-size: 12px;
  margin: 5px 0;
  max-width: 140px;
}
a.main-menu:hover,
a.main-menu:focus {
  text-decoration: none;
}
.sub-menu > a:hover,
.sub-menu > a:focus {
  text-decoration: none;
}
.main-menu,
.sub-menu > a {
  font-family: "Work Sans", "OpenSans", sans-serif;
  text-decoration: none !important;
  font-weight: normal;
}

/* mohit css start here */


/* .work-sans-<uniquifier> {
  font-family: "Work Sans", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
} */

img.home_page_center_logo {
  width: 44%;
}