@media screen and (max-width: 2560px){
	.home-margin-content{
		padding-top: 30%; 
		padding-left: 2%;
	}
	.home-margin-grid{
		margin-top: 10%;
	}
	
	.img-hex-border .mark-hex{
		position: absolute;
		z-index: 999;
		width: 210px;
		min-height: 240px;
		background: url("img/project/mark-hex.png") no-repeat center;
		background-size: cover;
	}
	.img-hex-border img{
		width: 210px;
		min-height: 240px;
		max-height: 240px;
		
		-webkit-transform: scale(0.98);
	    transform: scale(0.98);
	    -webkit-transition: all .4s; /* Safari */
	    transition: all .4s;
	}
	.img-hex-border .hover-wrapper{
	    margin-left: 40px;
		width: 210px;
		min-height: 240px;
		max-height: 240px;
		position: absolute;
	/* 	background: rgba(48,133,163,.35); */
		   top: 0;
		   left: 14%;
		opacity: 0;
		-webkit-transition: all .2s ease-out; /* Safari */
	    transition: all .2s ease-out;
	}
	
	.project-height{
	height: 507px;
	}
	.project-hover{
	padding-left: 0px;
	padding-right: 10px; padding-left : 10px; padding-top: 11px;
	}
	.width-index-page{
		width: 80%;
	}
	.width-about-page{
		width: 80%; 
		margin: auto;
	}
		
	.navbar-collapse.collapse {
	    padding-left: 400px;
	    padding-right: 400px;
	}
}
@media screen and (max-width: 1440px){
	.navbar-collapse.collapse {
	    padding-left: 200px;
	    padding-right: 200px;
	}
	.home-margin-content{
		padding-top: 5%;
		padding-left: 20%;
	}
	.home-margin-grid{
		margin-top: 10%;
	}
	.project-height{
	height: 410px;
	}
	.project-hover{
	padding-left: 0px;
	padding-right: 10px; padding-left : 10px; padding-top: 11px;
	}
	.project-text-modal{
	font-size: 18px;
	min-height: 32px;
	}
	.modal-content {
	    width: 781px;
	    height: 512px;
    top: 5%;
/*     left: 0%; */
	}

}

@media screen and (max-width: 1366px){

	.project-text-modal{
	font-size: 18px;
	min-height: 24px;
	}
	.modal-content {
	    width: 781px;
	    height: 512px;
	   top: 20%;
/*     left: -15%; */
	}
	.
	.project-height {
    	height: 380px;
	}
	.project-left-img{
	    max-height: 128px;
	    max-width: 258px;
	    height: 100%;
	}
	.img-hex-border .hover-wrapper {
	    left: 7%;
	}
	
	.project-left-link {
    font-size: 14px;
	}
	.project-left-link-empty {
    font-size: 14px;
	}

}

@media screen and (max-width: 1200px) {

	.img-hex-border .hover-wrapper{
		max-height: 209px;
	}
	.img-hex-border .mark-hex,
	.img-hex-border img{
		max-height: 209px;
	}

	.carousel-control-circle.circle-styled-2 > .glyphicon{
		-ms-transform: scale(0.8,0.8); /* IE 9 */
	    -webkit-transform: scale(0.8,0.8); /* Safari */
	    transform: scale(0.8,0.8);
	}

	.carousel-control-circle.circle-styled-2.left{ 
/* 	left: -30px;  */
	width: 30px; 
	}
	.carousel-control-circle.circle-styled-2.right{ 
/* 	right: -30px;  */
	width: 30px; 
	}
}

@media screen and (max-width: 1024px){
	.bg-bigleaf {
	    background: url(img/bg-bigleaf.png);
	    background-repeat: no-repeat;
	    background-position: 64% 9%;
	    /* min-height: 340px; */
	}
	.navbar-collapse.collapse {
	    padding-left: 50px;
	    padding-right: 50px;
	}
	.fb-share-pad{
		padding-left: 85%;
	}
	.shop-width{
		padding-left: 2%;
		padding-right: 2%;
	}
	.carousel-inner {
	    padding-bottom: 0px;
	}
	.container {
	    width: 100%;
	}
	.about-padding{
		width: 100%; 
		margin: 0;
	}
	.width-about-page{
		width: 90%; 
		margin: auto;
	}
	.width-index-page{
		width: 100%;
	}	
	
	.nav-logo .navbar-nav {
    margin-top: 54px;
/*     margin-left: -24px; */
    /* margin-bottom: 90px; */
}
	.nav-logo .nav>li>a{
	    font-size: 28px;
	    padding: 15px 28px;
	}
	.home-margin-content{
		padding-top: 0%; padding-left: 5%; padding-right:5%;
	}
	.home-margin-grid {
	    margin: auto;
	    margin-top: 5%;
	}
	
	.img-hex-border .mark-hex{
		position: absolute;
		z-index: 999;
		width: 140px;
		min-height: 160px;
		background: url("img/project/mark-hex.png") no-repeat center;
		background-size: cover;
	}
	.img-hex-border img{
		width: 140px;
		min-height: 160px;
		max-height: 160px;
		
		-webkit-transform: scale(0.98);
	    transform: scale(0.98);
	    -webkit-transition: all .4s; /* Safari */
	    transition: all .4s;
	}
	.img-hex-border .hover-wrapper{
		width: 140px;
		min-height: 160px;
		max-height: 160px;
		position: absolute;
	/* 	background: rgba(48,133,163,.35); */
		top: -2%;
    	left: 14%;
		opacity: 0;
		-webkit-transition: all .2s ease-out; /* Safari */
	    transition: all .2s ease-out;
	}
	
	.project-height{
	height: 308px;
	}
	.project-mobile-height{
	height: 662px;
	}
	.project-hover{
	padding-left: 0px;
	padding-right: 10px; padding-left : 10px; padding-top: 11px;
	}
	
	.nav-logo .navbar-header .logo{
	width: 100%;
	}
	
	.nav-logo .navbar-header .logo a img{
	width: 25%;
	}
	
	.project-left-img{
	    max-height: 102px;
	    max-width: 258px;
	    height: 100%;
	}


	.carousel-control-circle.circle-styled-product.left{ 
		left: 20px;
		width: 40px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-product.right{ 
		right: 20px;
		width: 40px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-product > .glyphicon-chevron-left{ background-position: bottom left; }
	.carousel-control-circle.circle-styled-product:hover > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-product:active > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-product:focus > .glyphicon-chevron-left{
		background-position: bottom left;
	}
	
	.carousel-control-circle.circle-styled-product > .glyphicon-chevron-right{ background-position: bottom right; }
	.carousel-control-circle.circle-styled-product:hover > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-product:active > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-product:focus > .glyphicon-chevron-right{
		background-position: bottom right;
	}
	
	.carousel-control-circle.circle-styled-project.left{ 
		left: -70px;
		width: 40px;
		top:25%;
	}
	.carousel-control-circle.circle-styled-project.right{ 
		right: -70px;
		width: 40px;
		top:25%;
	}
	.carousel-control-circle.circle-styled-project > .glyphicon-chevron-left{ background-position: bottom left; }
	.carousel-control-circle.circle-styled-project:hover > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-project:active > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-project:focus > .glyphicon-chevron-left{
		background-position: bottom left;
	}
	
	.carousel-control-circle.circle-styled-project > .glyphicon-chevron-right{ background-position: bottom right; }
	.carousel-control-circle.circle-styled-project:hover > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-project:active > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-project:focus > .glyphicon-chevron-right{
		background-position: bottom right;
	}
	
	.gd-thum-2:hover {
    height: 70px;
    width: 95%;
    font-size: 22px;
	}
	.gd-thum-2 {
	    left: 5px;
	    width: 95%;
	}
	.modal-content {
	    width: 781px;
	    height: 512px;
	    top: 11%;
/* 	    left: -14%; */
	}
	.project-text-modal{
		min-height: 50px; 
		padding-left:30px; 
		font-size: 24px;
	}
	.project-left-link {
    font-size: 23px;
        padding-left: 13px;
        padding-right: 13px;
	}
	.project-left-link-empty{
	 font-size: 23px;
	     padding-left: 13px;
	     padding-right: 13px;
	}
}

@media screen and (max-width: 991px){
	.nav-logo .nav>li>a{
		font-size: 28px;
		padding: 0px 20px;
	}
	.navbar.affix{
/* 	height: 72px; */
	}
	
	#home-navigator .navbar-nav {
    margin-top: 110px;
	}	
	
	#home-navigator .navbar-nav{
		margin-top: 90px;
		margin-bottom: 50px;
		text-align: center;
	}
	.navbar.affix #home-navigator .navbar-nav{
		margin-top: 25px;
		margin-bottom: 25px;
		text-align: center;
	}

	.img-hex-border .hover-wrapper{
		max-height: 146px;
	}
	.img-hex-border .mark-hex,
	.img-hex-border img{
		min-height: 146px;
	}

	.carousel-control-circle.circle-styled-2 > .glyphicon{
		-ms-transform: scale(0.7,0.7); /* IE 9 */
	    -webkit-transform: scale(0.7,0.7); /* Safari */
	    transform: scale(0.7,0.7);
	}
	.nav-logo .navbar-header .logo {
	    left: 0px;
	    width: 991px;
	}
	.carousel-control-circle.circle-styled-2.left{ 
/* 	left: -50px;  */
	}
	.carousel-control-circle.circle-styled-2.right{ 
/* 	right: -50px;  */
	}
}

@media screen and (max-width: 834px){
	.navbar-collapse.collapse {
	    padding-left: 26px;
	    padding-right: 26px;
	}
	.nav-logo .navbar-header .logo {
/* 	    left: 9px; */
	    width: 834px;
	}
	.container {
	    width: 100%;
	}
	.shop-width {
	    padding-left: 7%;
	    padding-right: 7%;
	}
	.project-left-link {
    font-size: 20px;
    height: 39px;
    padding-left: 20px;
    padding-right: 20px;
	}
	.project-left-link-empty {
    font-size: 20px;
    height: 39px;
    padding-left: 20px;
    padding-right: 20px;
	}
	.project-place-title {
	    font-size: 46px;
	}
	.place-font-size{
		font-size: 27px;
	}
	.modal-content {
	    width: 771px;
	    height: 491px;
	    top: -6%;
/* 	    left: -14%; */
	}
	.project-text-modal{
	min-height: 50px; 
	padding-left:30px; 
	font-size: 24px;
	}
	.project-modal-content {
	    background-repeat: no-repeat;
	   background-size: 771px 491px;
	    background-color: transparent;
	    border-color: white;
	}
	.img-hex-border .mark-hex {
	    width: 129px;
	    min-height: 160px;
	}
	.img-hex-border .mark-hex, .img-hex-border img {
	    min-height: 146px;
	}
	.img-hex-border img {
	    width: 129px;
	    min-height: 146px;
	    max-height: 160px;
	}
	.img-hex-border img {
	    transform: scale(0.98);
	}
}

@media screen and (max-width: 768px){
.mt-xs{ margin-top: 15px;}

	.navbar-collapse.collapse {
	    padding-left: 67px;
	    padding-right: 67px;
	}
	.fb-share-pad{
		padding-left: 81%;
	}
	.shop-width{
		padding-left: 2%;
		padding-right: 2%;
	}
	.container {
	    width: 100%;
	}
	.project-left-img{
		max-height:102px; 
		max-width: 200px;
		height: 100%;
	}
	
	.project-left-mobile-img {
	    max-height: 149px;
	    max-width: 258px;
	    height: 100%;
	}
	
	.about-padding{
		width: 100%; 
		margin: 0;
	}
	.width-index-page{
		width: 100%;
	}	
	.home-margin-content{
		padding-top: 0%; padding-left: 0%;
	}
	.home-margin-grid{
		margin-top: 15%;
	}
	.bg-bigleaf{
		background: url('img/bg-bigleaf.png');
		background-repeat:no-repeat;
	    background-position: 57% 14%;
	/* 	min-height: 340px; */
	}	
	.ThaiSans-block {
		font-size: 20px;
		line-height: 2.1em;
	}
	
	.nav-logo .nav>li>a{
		font-size: 22px;
		padding: 15px 40px;
	}
	.home-margin-grid{
		margin-top: 10%;
		margin-left: 5%;
	}
	.nav-logo.affix .navbar-header .logo a img{
	max-width: 100px;
	}
	
	.nav-logo .navbar-header .logo a img{
		      width: 17%;
			    max-width: 200px;
/* 			    margin-left: 321px; */
	}
	#home-navigator .navbar-nav:first-child{
/* 		margin-top: 30px !important; */
	}

/* 	.navbar.affix #home-navigator .navbar-nav:first-child{ */
/* 		margin-top: 20px !important; */
/* 	} */
	
	#home-navigator .navbar-nav{
		margin-top: 24px !important;
		margin-bottom: 8px !important;
		text-align: center;
/* 		padding: 10px 10px; */
/* 		margin-right: 40px; */
/* 		margin-left: 30px; */
	}
	
/* 	.navbar.affix #home-navigator .navbar-nav{ */
/* 		margin-top: 30px !important; */
/* 	} */

	.nav-logo .nav>li>a{
		display: inline-block;
		padding : 10px 10px;
		border-bottom: 0px;
	}
	

	.navbar-header{
		position: relative;
	}
	button.navbar-toggle{
		z-index: 900;
	}
	nav.navbar{
/* 		min-height: 100px; */
	}
	
	.carousel-control-circle.circle-styled-2 > .glyphicon {
		top: 40%;
	}
	.carousel-control-circle.circle-styled-2 > .glyphicon{
		-ms-transform: scale(0.8,0.8); /* IE 9 */
	    -webkit-transform: scale(0.8,0.8); /* Safari */
	    transform: scale(0.8,0.8);
	}

	.carousel-control-circle.circle-styled-2.left{ 
		left: 100px;
		width: 40px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-2.right{ 
		right: 100px;
		width: 40px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-2 > .glyphicon-chevron-left{ background-position: bottom left; }
	.carousel-control-circle.circle-styled-2:hover > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-2:active > .glyphicon-chevron-left,
	.carousel-control-circle.circle-styled-2:focus > .glyphicon-chevron-left{
		background-position: bottom left;
	}
	
	.carousel-control-circle.circle-styled-2 > .glyphicon-chevron-right{ background-position: bottom right; }
	.carousel-control-circle.circle-styled-2:hover > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-2:active > .glyphicon-chevron-right,
	.carousel-control-circle.circle-styled-2:focus > .glyphicon-chevron-right{
		background-position: bottom right;
	}

	#section-projects .title-project{
		text-align: center;
	}

	#carousel-leafaround{
		margin-top: 80px;
	}

	.img-hex-border-fixed.img-hex-border a img{
		min-height: 266px !important;
	}

	.single .one-page{
		padding-top: 90px;
		padding-bottom: 90px;
	}
	
	.project-height{
	height: 308px;
	}
	.project-mobile-height{
	height: 492px;
	}
	.project-hover{
	padding-left: 0px;
	padding-right: 10px; padding-left : 10px; padding-top: 11px;
	}
	
	.width-about-page{
		width: 100%; 
		margin: 0 auto;
	}
	
	#carousel-leafaround .carousel-inner img{
	margin: 0px auto;
	}

	.modal-body{
		padding: 0px;
	}
	.project-modal-content{
		background-repeat: no-repeat; 
	    background-size: 746px 438px;
		background-color: transparent; 
		border-color: white;
	}
	.project-text-modal{
	min-height: 0px; 
	padding-left:30px; 
	color: white; 
	font-size: 16px;
	}
	.project-modal-body{
		padding-left: 20px; 
		padding-right: 20px;
	}
	.nav-logo .navbar-header .logo{
/* 	left: 92px; */
	width: 768px;
	}
	
	.gd-thum-2:hover {
    height: 70px;
    width: 95%;
    font-size: 22px;
	}
	.gd-thum-2 {
	    left: 2px;
	    width: 95%;
	}
	.next-prev-text-right {
	    padding: 2px 19px 0px 11px;
	}
	.next-prev-text-left {
	    padding: 2px 2px 0px 19px;
	}
	
	.carousel-control-circle.circle-styled-product.left{ 
		left: 40px;
		width: 40px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-product.right{ 
		right: 40px;
		width: 40px;
		top:20%;
	}
	.padding-social-mobile{
		padding-left: 17px;
	}
	.carousel-inner {
	    padding-bottom: 50px;
	}
	
	.modal-content {
	    width: 746px;
	    height: 438px;
	    top: 1%;
/* 	    left: 0%; */
	}
	.project-text-modal{
		min-height: 50px; 
		padding-left:30px; 
		font-size: 24px;
	}
	
	.img-hex-border .hover-wrapper {
	   	top: -7%;
    	left: 10%;
	}
	
	.title-project {
	    padding-left: 0px;
	    padding-right: 0px;
	}
}

@media screen and (max-width: 767px) {
  .carousel-inner > .item.next,
  .carousel-inner > .item.active.right {
      left: 0;
      -webkit-transform: translate3d(100%, 0, 0);
      transform: translate3d(100%, 0, 0);
  }
  .carousel-inner > .item.prev,
  .carousel-inner > .item.active.left {
      left: 0;
      -webkit-transform: translate3d(-100%, 0, 0);
      transform: translate3d(-100%, 0, 0);
  }

}

@media screen and (max-width: 736px) {
	.project-left-img{
		max-height:60px; 
		max-width: 258px;
		height: 100%;
	}
	.project-height{
		height: 180px;
	}
	.project-left-link{
	    width:90%;
        height: 27px;
	    font-size: 14px;
	}
	.project-left-link-empty{
	    width:90%;
        height: 27px;
	    font-size: 14px
	}
	.nav>li>a{
		padding: 2px 5px;
	}
	.project-text-modal{
	padding-left:0px; 
	font-size: 13px;
	}
	.modal-content{
    width: 70%;
    height: 40%;
    top: 15%;
/*     left: 17%; */
	}
	
	.project-left-mobile-img {
	    max-height: 141px;
	    max-width: 258px;
	    height: 100%;
	}
	.project-mobile-height{
		height: 552px;
	}
}

@media screen and (max-width:600px){
	.project-left-mobile-img {
	    max-height: 121px;
	    max-width: 258px;
	    height: 100%;
	}
	.project-mobile-height{
		height: 450px;
	}
}
@media screen and (max-width: 480px) {
	.about-padding{
		width: 100%; 
		margin: 0;
	}
	.home-margin-content{
		padding-top: 0%; padding-left: 0%; padding-right: 0%;
	}
	.home-margin-grid{
		margin-top: 15%;
		margin-left: 0%;
	}
	.bg-bigleaf{
		background: url('img/bg-bigleaf.png');
		background-repeat:no-repeat;
		background-position: 45% 31%;
    	background-size: 200px 200px;
	}	
	.ThaiSans-block {
		font-size: 14px;
		line-height: 2.1em;
	}
	.product-title-fsize{
		font-size: 70%;
	}
	.img-hex-border .hover-wrapper{
		width: 140px;
		min-height: 160px;
		max-height: 160px;
		position: absolute;
	/* 	background: rgba(48,133,163,.35); */
		top: -5%;
    	left: 0%;
		opacity: 0;
		-webkit-transition: all .2s ease-out; /* Safari */
	    transition: all .2s ease-out;
	}
	
	
	#home-navigator .navbar-nav:first-child {
	    margin-top: 15px !important;
	}
	.img-hex-border.img-hex-border-fixed{
		width: 132px !important;
		height: 152px !important;
	}

	.img-hex-border-fixed.img-hex-border a img{
		min-height: 152px !important;
	}

	.img-hex-border .hover-content{
		top:30%;
	}

	.footer{
		text-align: center;
	}
	.footer .container{
		padding-top: 10px;
		padding-left: 10px;
		padding-right: 10px;
	}

	.footer .container:before,
	.footer .container:after{
		content: none;
	}

	.footer .social-inline{
		float: none;
	}
	
	.ico-lan{
		background: url('img/th_en-ico_2.png') no-repeat;
		width: 46px;
		height: 44px;
		display: inline-block;
	}
	
	.project-left-mobile-img {
	    max-height: 89px;
	    max-width: 258px;
	    height: 100%;
	}
	.project-mobile-height{
		height: 360px;
	}
	
	.img-hex-border .hover-wrapper {
	    top: -10%;
	    left: 22%;
	}
}

@media screen and (max-width: 425px) {
	.carousel-control-circle.circle-styled-project.left{ 
		left: -70px;
		width: 40px;
		top:17%;
	}
	.carousel-control-circle.circle-styled-project.right{ 
		right: -70px;
		width: 40px;
		top:17%;
	}
	.img-hex-border .mark-hex {
	    width: 120px;
	    min-height: 160px;
	}
	.img-hex-border .mark-hex, .img-hex-border img {
	    min-height: 146px;
	}
	.img-hex-border img {
	    width: 120px;
	    min-height: 146px;
	    max-height: 160px;
	}
	.img-hex-border img {
	    transform: scale(0.98);
	}
	
	.fb-share-pad{
		padding-left: 65%;
	}
	#columns-rec {
	    column-count: 1;
	}
	#columns-relate{
		 column-count: 1;
	}
	.blog-image-width{
		padding-top: 5px;
		padding-left:0px;
		padding-right:0px;
	}
	.tag-header {
	    min-width: 50px;
	    font-size: 13px;
	   	padding: 1px 5px 4px 5px;
	}
	.tag {
	    min-width: 50px;
	    font-size: 13px;
	    padding: 1px 5px 4px 5px;
	}
	.padding-social-mobile{
		padding-left: 13px;
	}
	.container {
	    width: 100%;
	}
	.carousel-inner {
	    width: 135%;
	    left: -61px;
	    padding-bottom: 30px;
	}
	.nav-logo.affix .navbar-header .logo a img{
	max-width: 100px;
	}
	
	.nav-logo .navbar-header .logo a img{
		max-width: 200px;
		margin-left: 90px;
		width: 25%;
		margin: 0 auto;
	}
	
	.nav-logo .navbar-header .logo{
	left: 0px;
	width: 414px;
	}
	
	.project-place-title{
		font-size: 26px;"
	}
	
	.modal-content {
    width: 100%;
    height: 32%;
/*     top: 0%; */
/*     left: 0%; */
	}
	
	.project-text-modal{
	padding-left:10px; 
	padding-right: 10px;
	font-size: 13px;
	height: 17px;
	}
	
	.project-mobile-height{
	height: 256px;
	}
	
	.project-left-mobile-img{
	    max-height: 69px;
	    max-width: 105px;
	    height: 100%;
	}
	
	.gd-thum-2:hover {
    height: 70px;
    width: 95%;
    font-size: 22px;
	}
	.gd-thum-2 {
	    left: 3px;
	    width: 95%;
	}
	.next-prev-text-right {
	    padding: 8px 13px 0px 13px;
	}
	.next-prev-text-left {
	    padding: 7px 4px 0px 11px;
	}
	
	.carousel-control-circle.circle-styled-product.left{ 
		left: -35px;
		top:23%;
	}
	.carousel-control-circle.circle-styled-product.right{ 
		right: -35px;
		top:23%;
	}
	
	.project-place-title {
	    font-size: 35px;
	    line-height: 30px;
	}
	.place-font-size {
	    font-size: 24px;
	}
	
	.project-modal-content {
        background-size: 391px 201px;
	}
	.modal-content {
	    width: 391px;
	    height: 201px;
	    top: 1%;
/* 	    left: 0%; */
	}
	.project-text-modal{
		min-height: 10px; 
		padding-left:10px; 
		font-size: 16px;
	}
	.mobile-logo-style-nc{
		margin-top: -10px !important;
	    margin-left: 225px !important;
	    max-width: 159px !important;
	    width: 154px !important;
	}
	.mobile-logo-style{
		    margin-top: 2px !important;
		    margin-left: 225px !important;
		    max-width: 150px !important;
		    width: 150px !important;
	}
	
	.category-span{
		font-size: 44px;
		margin-top: 20px;
		margin-left: 30px;
	}
	.carousel-control-circle.circle-styled-2 > .glyphicon{
		-ms-transform: scale(0.5,0.5); /* IE 9 */
	    -webkit-transform: scale(0.5,0.5); /* Safari */
	    transform: scale(0.5,0.5);
	}
	
	.project-modal-body {
		padding-left: 8px;
		padding-right: 8px;
	}
	
	.project-detail-popup {
		padding-left: 23px;
		padding-right: 23px;
	}
}

@media screen and (max-width: 375px) {
.mt-xlg{ margin-top: 115px;}
.mt-mlg{ margin-top: 100px;}
.mt-xmlg{ margin-top: 75px;}
.mt-lg{ margin-top: 20px;}
.mt-45{ margin-top: 45px;}
.mt-lmd{ margin-top: 35px;}
.mt-md{ margin-top: 30px;}
.mt-smd{ margin-top: 20px;}
.mt-lsm{ margin-top: 15px;}
.mt-sm{ margin-top: 10px;}
.mt-xs{ margin-top: 5px;}
.mt-none{ margin-top: 0px !important; }

.mb-xxlg{ margin-bottom: 125px;}
.mb-xlg{ margin-bottom: 115px;}
.mb-lg{ margin-bottom: 60px;}
.mb-md{ margin-bottom: 30px;}
.mb-sm{ margin-bottom: 10px;}
.mb-xs{ margin-bottom: 5px;}
.mb-none{ margin-bottom: 0px !important; }

	.img-hex-border .mark-hex {
	    width: 120px;
	    min-height: 160px;
	}
	.img-hex-border .mark-hex, .img-hex-border img {
	    min-height: 146px;
	}
	.img-hex-border img {
	    width: 120px;
	    min-height: 146px;
	    max-height: 160px;
	}
	.img-hex-border img {
	    transform: scale(0.98);
	}

	.place-font-size{
		font-size: 16px;
	}
	.list-inline > li {
	    padding-right: 0px;
	    padding-left: 0px;
	}
	.padding-social-mobile {
    	padding-left: 13px;
	}
	.fb-share-pad{
		padding-left: 62%;
	}
	.blog-image-width{
		padding-top: 5px;
		padding-left:0px;
		padding-right:0px;
	}
	.tag-radius {
	    border-radius: 4px;
	}
	.carousel-inner {
        width: 140%;
	    left: -63px;
	    padding-bottom: 30px;
	}
	.nav-logo.affix .navbar-header .logo a img{
	max-width: 100px;
	}
	.navbar-header {
   	 height: 70px;
	}

	.nav-logo .navbar-header .logo a {
	    width: 91%;
	}
	.nav-logo .navbar-header .logo a img{
		max-width: 100px;
		width: 55%;
	}
	.project-left-mobile-img {
	    max-height: 69px;
	    max-width: 98px;
	    height: 100%;
	}
	.project-mobile-height{
		height: 230px;
	}
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	h3, .h3 {
	    font-size: 20px;
	}
	
	.mao-wrap-text-blog {
	    font-size: 15px;
	}
	
	.project-left-link {
    font-size: 12px;
        padding-left: 13px;
        padding-right: 13px;
	}
	.project-left-link-empty{
	 font-size: 12px;
	     padding-left: 13px;
	     padding-right: 13px;
	}
	
	.project-modal-content {
		background-size: 347px 204px;
	}
	
	.project-text-modal{
		min-height: 10px; 
		padding-left:10px; 
		font-size: 11px;
	}
	.modal-content {
	    width: 347px;
	    height: 204px;
	    top: 1%;
/* 	    left: 0%; */
	}
	
	.carousel-control-circle.circle-styled-product.left{ 
		left: -35px;
		top:23%;
	}
	.carousel-control-circle.circle-styled-product.right{ 
		right: -35px;
		top:23%;
	}
	
	.tag-header {
	    min-width: 50px;
	    font-size: 13px;
	   	padding: 1px 5px 4px 5px;
	}
	.tag {
	    min-width: 50px;
	    font-size: 13px;
	    padding: 1px 5px 4px 5px;
	}
	
	.one-page{
	    padding-top: 20px;
    	padding-bottom: 40px;
	}
	.img-hex-border .hover-wrapper {
	    top: -7%;
	    left: 19%;
	}
	.mobile-logo-style-nc{
		margin-top: -10px !important;
	    margin-left: 193px !important;
	    max-width: 159px !important;
	    width: 154px !important;
	}
	.mobile-logo-style{
		margin-top: 3px !important;
	    margin-left: 193px !important;
	    max-width: 159px !important;
	    width: 154px !important;
	}
	.category-span{
		font-size: 39px;
		margin-top: 20px;
		margin-left: 30px;
	}
	
	.carousel-control-circle.circle-styled-2 > .glyphicon{
		-ms-transform: scale(0.5,0.5); /* IE 9 */
	    -webkit-transform: scale(0.5,0.5); /* Safari */
	    transform: scale(0.5,0.5);
	}
	
	.project-modal-body {
		padding-left: 8px;
		padding-right: 8px;
	}
	
	.project-detail-popup {
		padding-left: 23px;
		padding-right: 23px;
	}
	
	.carousel-control-circle.circle-styled-project.left{ 
		left: -70px;
		width: 40px;
		top:17%;
	}
	.carousel-control-circle.circle-styled-project.right{ 
		right: -70px;
		width: 40px;
		top:17%;
	}
}

@media screen and (max-width:360px){
	.nav-logo .navbar-header .logo a {
	    width: 86%;
	}
	
	.project-modal-content {
		background-size: 347px 204px;
	}
	
	.modal-content {
		width: 347px;
		height: 204px;
		top: 1%;
/* 		left: 0%; */
	}
	
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	h3, .h3 {
	    font-size: 18px;
	}
	
	.mao-wrap-text-blog {
	    font-size: 13px;
	}
	.mobile-logo-style-nc{
		margin-top: -10px !important;
	    margin-left: 195px !important;
	    max-width: 159px !important;
	    width: 154px !important;
	}
	.mobile-logo-style{
		margin-top: 3px !important;
	    margin-left: 195px !important;
	    max-width: 159px !important;
	    width: 154px !important;
	}
}

@media screen and (max-width: 325px) {
	.list-inline {
	    margin-left: -11px;
	}
	.padding-social-mobile {
    	padding-left: 13px;
	}
	.gd-thum-2:hover {
	    height: 70px;
	    width: 94%;
	    font-size: 22px;
	}
	.gd-thum-2 {
	    left: 5px;
	    width: 94%;
	}
	.blog-image-width{
		padding-top: 5px;
		padding-left:0px;
		padding-right:0px;
	}
	.carousel-inner {
	    width: 148%;
	    left: -64px;
	    padding-bottom: 30px;
	}
	.nav-logo.affix .navbar-header .logo a img{
	max-width: 100px;
	}
	.nav-logo .navbar-header .logo a img{
		max-width: 100px;
	    margin-left: 15px;
	}

	.project-mobile-height{
	height: 244px;
	}
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	
	.nav-logo .navbar-header .logo a {
    width: 100%;
    margin-left: -10%;
	}
	.project-left-mobile-img {
	    max-height: 51px;
	    max-width: 258px;
	    height: 100%;
	}
	
	.carousel-control-circle.circle-styled-product.left{ 
		left: -30px;
		top:20%;
	}
	.carousel-control-circle.circle-styled-product.right{ 
		right: -30px;
		top:20%;
	}
	
	#wrapper {
	    width: 95%;
	    margin: auto;
	}
	.project-modal-content {
	  background-size: 297px 186px;
	}
	
	.project-text-modal{
		min-height: 0px; 
		padding-left:5px; 
		font-size: 12px;
	}
	
	.img-hex-border .hover-wrapper {
    	left: 12%;
	}
	
	.modal-content {
		width: 297px;
		height: 186px;
		top: 1%;
/* 		left: 0%; */
	}
}

@media  screen and (min-width: 412px) {
	.mt-lg {
	    margin-top: 20px;
	}
	h3, .h3 {
	    font-size: 18px;
	}
	.mao-wrap-text-blog {
	    font-size: 15px;
	}
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
}

@media  screen and (min-width: 414px) {
	.mt-lg {
	    margin-top: 20px;
	}
	h3, .h3 {
	    font-size: 21px;
	}
	.mao-wrap-text-blog {
	    font-size: 18px;
	}
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}

}


@media screen and (min-width: 425px) {
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
}

@media screen and (min-width: 768px) {
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	.card-img-xx{
		height: auto;  
		width: 70%; 
		padding-top: 5px;
	}
	.nav-logo .navbar-right {
/* 		margin-right: -60px !important; */
	}
	.card-img-xx{
		height: auto;  
		width: 100%; 
		padding-top: 5px;
	}
	h3, .h3 {
	    font-size: 20px;
	}
}
@media screen and (min-width: 834px){
	.nav-logo .navbar-right {
	    margin-right: -38px;
	}
}
@media screen and (min-width: 960px) {
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	.card-img-xx{
		height: auto;  
		width: 100%; 
		padding-top: 5px;
	}
	h3, .h3 {
	    font-size: 24px;
	}
}

@media screen and (min-width: 1024px) {
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 2;
	}
	.card-img-xx{
		height: auto;  
		width: 100%; 
		padding-top: 5px;
	}
}

@media screen and (min-width: 1100px) {
	#columns {
		-webkit-column-count: 4;
		-moz-column-count: 4;
		column-count: 4;
	}
	
	.card-img-xx{
		height: auto;  
		width: 100%; 
		padding-top: 5px;
	}
}	
@media screen and (min-width: 1440px) {
	.project-left-img{
	max-height:137px; max-width: 205px;height: 100%;
	}

}
@media screen and (min-width: 1920px) {
	.project-left-img{
	max-height:173px; max-width: 260px;height: 100%;
	}
}
@media screen and (min-width: 2560px) {
	.project-left-img{
	max-height:235px; max-width: 352px;height: 100%;
	}
}