@import url('https://fonts.googleapis.com/css?family=Lato:300,400,700|Libre+Baskerville:400,700|Prompt:400');
	
	body {
		font-family: "Lato",Helvetica Neue, Helvetica, Arial, sans-serif;/*Libre Baskerville*/
		font-size: 14px;
		line-height: 1.42857143;
		color: #333;
		background-color: #fff;
		padding-bottom:0;
	}
.thai { font-family: 'Prompt';}


	* { box-sizing: border-box;}
	.logo-con { padding-top:10px; padding-bottom:10px;}
	
	a { color:#1b274c;}
	.nav li.active a:hover {background:#1b274c !important; border:1px solid #1b2740;    color: #fff; }
	.nav li.active li a:hover {background:#cae5ff !important; border:1px solid #337ab7; }
	@media (min-width: 768px){
	
	
	.navbar-nav { float: none !important; text-align:center;}
	.navbar-nav>li {
		float: none !important; display:inline-block !important; padding: 0 10px;
	}
	.navbar-wrapper {
		margin-top: 0px; padding-top:20px;    
	}
	.navbar-nav>li  a { background:#FFF; border:1px solid #ededed; color:#1b274c;transition:all .5s;}
	
	.navbar-nav>li  li a { border:0;}
		.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
		background-color: #FFF;
		border-color: #ddd;
		border-bottom:0;
	}
	.navbar-nav li.active  a ,.nav .open>a:hover,.nav .open>a, .nav .open>a:focus{background:#1b274c; border:1px solid #1b2740; color:#fff;}
	.navbar-nav li.active li  a {background:#FFF !important; border:0px solid #ededed !important; border-bottom:0; color:#1b274c !important;} 
	
	
	}
	
	.nav li a:focus, .nav li a:hover{
        background-color: #ececec;
    border-color: #dedede;
}
	@media (max-width: 768px){
	/*.navbar-wrapper {padding-bottom: 20px;}*/
	.logo-con { padding-top:5px; padding-bottom:5px;}
	.logo-con img { width: 120px;height:79px; }
	.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
    background-color: #cae5ff;
    border-color: #337ab7;
}
.navbar-nav li.active  a  {background:#1b274c; border:1px solid #1b2740; color:#fff;}
	.nav li a {border:1px solid rgba(0,0,0,0) }
	}
	.navbar-wrapper {
		position: relative;
		top: 0;
		right: 0;
		left: 0;
		z-index: 20; background:#FFF;
	}
	
	.dropdown-menu {
		left:10px;
	 
	}
	.navbar-header { text-align: center;}
	
	
	
.block { display:block}

.border-b { border-bottom:solid 1px #eee; padding-bottom:20px;}
	/*padding*/
	.p-20 { padding:20px;}
	.pt-10 { padding-top:10px; }
		.pt-20 { padding-top:20px; }
		.pt-40 { padding-top:40px; }
		.ptb-10 { padding-top:10px; padding-bottom:10px;}
	.ptb-20 { padding-top:20px; padding-bottom:20px;}
	.ptb-40 { padding-top:40px; padding-bottom:40px;}
	.ptb-60 { padding-top:60px; padding-bottom:60px;}
	.pb-40 {  padding-bottom:40px;}
	.max-1980 { max-width:1980px; margin:auto;}
	.plr-15per { padding-left:15%; padding-right:15%;}
	.pb-3 { padding-bottom:3px !important;}
	.mb-3 {margin-bottom:3px;}
	.plr-10per { padding-left:10%; padding-right:10%;}
	
	.plr-5per { padding-left:5%; padding-right:5%;}
	/*padding*/
	
	/*margin*/
	.mb-0 { margin-bottom:0;}
	/*margin*/
	
	.bot10per { bottom:10%;}
	.bot0per { bottom:0%;}
	/*menu*/
	
	.navbar-toggle {
		position: relative;
		float: none;
		padding: 9px 10px;
		margin-top: 8px;
		margin-right: 0px;
		margin-bottom: 8px;
		background-color: #1b2a4b;
		background-image: none;
		border: 1px solid #000a1f;
		border-radius: 0px;
	}
	.navbar-toggle .icon-bar {
		display: block;
		width: 22px;
		height: 2px;
		border-radius: 1px;
		background: #fff;
	}
	@media (max-width: 768px){
	.navbar { margin-bottom:0px;}
	}
	
	.dropdown-menu .divider {
		height: 1px;
		margin:   0;
		overflow: hidden;
		background-color: #e5e5e5;
	}
	
	.dropdown-menu>li>a {
		display: block;
		padding: 15px 20px;}
	@media (max-width: 767px)
	 {
	.navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu>li>a {
		padding: 10px 15px 10px 25px;
		text-align: center;
		color: #337ab7;
		font-size: 12px;
		background: #FFF;
	}}
	/*menu*/
	/*carousel*/
	
	.carousel-inner > .item > img {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height:auto !important;
		min-height: 600px;
	}
	@media (min-width: 1420px){
		.carousel-inner > .item > img {
	transform: translate(0,-280px);
		}
	}
	@media (max-width: 768px){
	   .carousel-inner > .item > img { min-width: 200% !important;transform: translate(-30%,0);}
		
	}
	
	@media (max-width: 421px){
	   .carousel-inner > .item > img { min-width: 250% !important;transform: translate(-40%,0);}
		.navbar .container { padding:0;}
	}
	
	.btn-more {    width: 100%; border:1px solid #1b274c;
	   padding: 20px !important;
		border-radius: 0;
		background: #1b274c;
		color: #FFF;
	transition: all .5s}
		
   .btn-download{width: 300px; border:1px solid #952727;
	   padding: 20px !important;
		border-radius: 4px !important;
		background: #a93535;
		color: #FFF; margin-bottom:40px}
		
		.btn-download:hover { opacity:.8; color:#FFF;}
	
		
		
		a:hover { cursor:pointer; text-decoration:none;}
		
		.btn {font-family:Lato; border-radius:0; padding:10px 20px;}
		
		.btn-primary { background:#1b274c; border:solid 1px #1b2740;}
		
	/*box-shadow*/
	
	 .box-page:hover  .btn-primary{
		color: #fff;
		background-color: #286090;
		border-color: #204d74;
	}
	.box-page { box-shadow:0 2px 4px rgba(0,0,0,.5); background:#FFF; margin-bottom:20px;}
	/*typicon*/
	
	.box-page h1,.box-page h2,.box-page h3  {
		 
		 color:#1b274c !important; display:block;
	}
	
	/*typicon*/
	
	.h1, .h2, .h3, h1, h2, h3 {
		margin-top: 20px;
		margin-bottom: 20px; color:#1b274c;
	}
	
	h1.white { color:#FFF;}
	
	/*bg-sea*/
	.bg-container { padding:120px 0;}
	
	.bg-container-2 { padding:60px 0;}
	@media (max-width: 414px){
		
		.bg-container { padding:20px 0;}
		.carousel { margin-bottom:20px;}
		.container {
		padding-right: 10%;
		padding-left: 10%;
		margin-right: auto;
		margin-left: auto;
	}
		}
		
		
	.bg-top-cut{ background:url(../images/top-mask-w.png) no-repeat top; background-size:100% auto;}
	.bg-sea { background: url(../images/index/sea-bg.jpg); background-size:cover; }
	.bg-boat { background: url(../images/tour/boat-bg.png); background-size:cover; }
	.bg-blue { background:#1b2a4b;}
	.bg-li-grey{ background:#ededed;}
	.bg-boatsea { background:url(../images/banner01/bg.jpg); background-size:cover; }
	.white-8{ background:rgba(255,255,255,.5)}
	.bg-grey { background:#f5f5f5;}
	/*bg-sea*/
	/*footer*/
	
	footer { background:url(../images/shadow-top.png) top repeat-x; overflow:hidden; padding:40px 0; font-family:Lato;}
	footer  h4 { text-transform:uppercase; color:#1b274c; text-transform:capitalize;}
	
	footer p { margin-bottom:15px; color:#414042;}

	footer strong {color:#1b274c; font-weight:400;}
	
	.bottom-foot { background:#1b274c; color:#FFF; padding:20px}
	
	.bottom-foot  a { color:#FFF;}
	
	.bottom-foot p { color:#FFF; margin-bottom:0; font-family:Lato;	}

	@media (min-width: 714px){
		
	   footer .col-sm-4:nth-child(1) img {
		   width: 150px !important;
		   margin-top: 10px;
									   }
   
	   }
	@media (max-width: 714px){
		footer { text-align: center;}
	footer .col-sm-4:nth-child(1) img {
		width: 120px !important;
		margin-bottom: 10px;
		margin-top: 0px;
									}

	}
	/*footer*/
	
	/*border*/
	
	.bot-bor { border-bottom:solid 1px #eee; padding-bottom:10px; display:block;}
	
	/*img*/
	
	.box-page:hover  img { transition:all .5s;  
		transition-timing-function: linear;
	   
		-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
		filter: grayscale(100%);
	}
	
	/*tour trip*/
	
	.tour-trip-yatch { height:60vh; display:table; width:100%; text-align:center;}
	
	.tour-trip-yatch div { display:table-cell; vertical-align:middle; color:#FFF; z-index:2; background:rgba(0,0,0,.1)} 
	
	.tour-trip-yatch div h2 { color:#FFF; text-shadow:0 2px 4px rgba(0,0,0,.5)}
	
	.pattaya-bg { background: url(../trip/pattaya.jpg) center no-repeat; background-size: cover; position:relative;}
	
	.phuket-bg { background: url(../trip/phuket.jpg) center no-repeat; background-size: cover; position:relative;}
	
	.singapore-bg { background: url(../images/singapol/sg-pb.jpg) center no-repeat; background-size: cover; position:relative; height:60vh;}
	
	 .gallery-bg {background: url(../images/gallery/gallery.jpg) center no-repeat; background-size: cover; position:relative;}
	 
	  .contact-bg {background: url(../images/contact/contact.jpg) center no-repeat; background-size: cover; position:relative;}
	
	/*  anchor  */
	
	.anchor-topic { display:inline-block; text-align:center; margin:20px auto; border:solid 1px #1b274c; padding:30px  40px  20px  40px; position:relative; min-width:300px;}
	
	.anchor-topic:before { 
	content:""; background:url(../images/anchor.png) no-repeat top center ;
	position:absolute; 
	width:100%; height:62px; 
	top:-20px; left:0;}  
		
		.anchor-topic  h2 { text-transform:uppercase; font-size:50px; margin-bottom:0;}
		.anchor-topic  h3 { margin-top:0;}
		@media (max-width:768px){
			
				.anchor-topic  h2 { text-transform:uppercase; font-size:30px; }
				.sm-p-40 { padding:20px 10px 0 10px;}
				 
				.bot-bor {
					border-top: solid 1px #eee;
					border-bottom: solid 0px #eee;
					padding-bottom: 0px;
					padding-top: 20px;
					display: block;
				}
				.footer h4 { text-transform: uppercase;}

			}
				@media (max-width:414px){
			
			 
				 
				 .anchor-topic { padding:30px  20px  20px  20px; }
			}
			
			.anchor-topic  h3 { margin-tops:0;}
			
	/* anchor */
	.boat-ul {margin:0 !important;}
	.boat-ul img { width:100%;}
	
	.boat-ul .col-sm-4 { padding:0; }
	
	.boat-ul-li {}
	.boat-ul-li  a {margin:10px; display:block;  position:relative;}
	.boat-ul-li-detail { background:  rgba(27,39,76,.5); position:absolute; bottom:0; width:100%; padding:10px; box-sizing:border-box; color:#FFF;}
	.boat-ul-li-detail a *{ transition:all .5s;}
	a:hover  .boat-ul-li-detail{ height:100%;background: url(../trip/more.png) no-repeat center rgba(27,39,76,.5);}
	
	.boat-ul-li-detail li  h3{ color:#FFF; margin:0; margin-top:15px; } 
	
	.guest-day { background: url(../trip/day-ico.png) no-repeat left center; padding-left:35px; padding-top:10px; padding-bottom:5	px;}
	
	.guest-night{ background: url(../trip/night-ico.png) no-repeat left center; padding-left:35px;}
	
	@media screen and  (max-width:1013px) and (min-width:763px){
		
		
		.boat-ul-li-detail  .pull-right { display: block !important; float:left !important;}
				.boat-ul-li-detail { background: url(../trip/hover.png) bottom repeat-x; background-size: auto 90%;  	
		
		}
		
	}
	
	/*tour grop*/
	
	.tour div.col-sm-4:first-child .btn-more { background:url(../images/tour/bronce-bg.png) !important; border:0;}
	.tour div.col-sm-4:nth-child(2) .btn-more { background:url(../images/tour/silver-bg.png) !important; border:0;}
	.tour div.col-sm-4:nth-child(3) .btn-more { background:url(../images/tour/gold-bg.png) !important; border:0;}
	

.img-responsive { display:inline-block;}

/*boat*/

.boat-head{ background:url(../images/bg-blue-pattern.png);padding:15px; color:#FFF;}

.boat-head  h1 { color:#FFF !important; text-transform:uppercase;}

.bg-tour { overflow:hidden; background-size:cover; padding-top:20px; padding-bottom:20px; background:#16203a}

.bg-tour  h1,.bg-tour  h3,.bg-tour span { color:#FFF;}

.bg-tour span { border:1px solid #eee;padding:5px;   } 

.bg-tour  h1 { margin-top:5px; font-size:40px;}

.bg-tour  h3 { margin-bottom:15px; margin-top:10px;}

.table-boat {  overflow:hidden;box-shadow: 0 0 20px #040c21;}

.table-boat article {display: flex;}

.table-l {background:#1b274c; color:#FFF; display:inline-block; padding:10px; width:35%; box-sizing:border-box; float:left; border-bottom:1px #16203a solid; text-align:right; }

.table-r { background:url(../images/table/shadow-r.png) left repeat-y #FFF;padding:10px; width:65%; box-sizing:border-box; display:inline-block; float:left; border-bottom:1px #989596  solid; }

.on-img { position:absolute; top:20px; left:25px;}

.on-img.black * { color:#1b274c; }

.on-img.black span { border:1px solid #1b274c;}

.price-l { background:url(../images/table/price-bg.png); background-size: 100% auto;}
.price-l h3 { color:#FFF; text-transform:uppercase; padding:0px; margin:0;} 
.price-r { background:url(../images/table/siver.png); background-size:cover; min-height:47px; padding-top:13px;}

.price-r-detail {background:url(../images/table/shadow-r.png) left repeat-y #ccc;}
.price-r  .col-sm-6,.price-r-detail  .col-sm-6 { width:50%; float:left; padding-left:0; padding-right:0;}
.price-r  .col-sm-6:last-child { border-left:1px solid #aaa; margin-top:-13px; padding-top:13px; margin-bottom:-13px; padding-bottom:13px;padding-left:10px;}
.price-r-detail  .col-sm-6:last-child { border-left:1px solid #aaa;margin-top:-11px; padding-top:11px; margin-bottom:-11px; padding-bottom:11px;padding-left:10px;}
.price-r-detail em {font-style: normal;font-size:12px;color:#666; display: block;  }


/*col-sm-4*/


.price-r  .col-sm-4 { border-left:1px solid #999; margin-top:-13px; padding-top:13px; margin-bottom:-13px; padding-bottom:13px;padding-left:10px; width:33.333% !important;float:left;}
.price-r-detail  .col-sm-4 { border-left:1px solid #aaa;margin-top:-11px; padding-top:11px; margin-bottom:-11px; padding-bottom:11px;padding-left:10px;width:33.333% !important; float:left;}
.price-r  .col-sm-4:first-child { border-left:0px solid #aaa;}
.price-r-detail  .col-sm-4:first-child { border-left:0px solid #aaa}



/*col-sm-4*/
.price-l-detail,.price-r-detail { line-height:2;}


@media (max-width:667px){
	
	.table-boat { overflow-x: scroll; width:550px;}
	.table-boat article { width:550px;}
	
	
	}

.hero__example-link { max-height:400px; overflow:hidden;}

@media screen and (max-width:414px){
	
	
	.indicator{ display:none !important;}
	
	}

.sm-text-left { text-align:left;}
.sm-text-right { text-align:right;}

@media (max-width:768px){
			
			.sm-text-left { text-align:center;}
			.sm-text-right { text-align: center;}
	
	
	}
	
	.pb-0 { padding-bottom:0;}
	
	.col-a-blue a { color:#1f3886;}

	.clear {clear:both;float:none;}

	.h100 {height:100px;}


	@media (max-width:1200px){

			.hide-sm { display:none;}

	}
	.row-middle { text-align:center;}
	.row-middle  .col-sm-4{ float:none; display: inline-block;}

	p.white {color:#ccc;font-size:12px;}

	p.white a {color:#fff; }

	.pad-r-10 {padding-right:10px;}

	.pad-r-8 {padding-right:9px;}

/* EXTRAORDINARY str */
.ex-h { text-transform:uppercase; font-weight:300;}
.bg-ex { background-size:100% auto; padding:20px; background-position:center; font-size:16px }

.bg-ex h2 { font-weight:900; text-transform:uppercase; font-size:40px;}
@media (max-width:768px){ 
	.bg-ex { background-size:  auto 100%;padding:10px; }
	.bg-ex h2 {  font-size:30px;} 
	
	.bg-ex .pull-right { float:left !important;}

}



.bg-ex-1 { background-image:url(../join-yatch-trip/ex1.jpg); }

.bg-ex-2 { background-image:url(../join-yatch-trip/ex2.jpg); }

.bg-ex-3 { background-image:url(../join-yatch-trip/ex3.jpg); }


.bg-ex-4 { background-image:url(../join-yatch-trip/ex4.jpg); }

/* EXTRAORDINARY  end */


/* howto-box str */

.howto-box { 

	border:1px solid #e4e4e4; padding:15px 0; margin:5px 0 10px 0; background:#fafafa;
	
	}
	
	.step-toppic { background:#1e2c4c; color:#FFF; padding:15px; display:inline-block;}
	
	.step-yap { font-size:40px; text-transform:uppercase;}
	
	.step-toppic h3 { color:#FFF; margin:0; text-transform:uppercase; font-weight:300;}
	
	
	.howto-box .media-list { padding:10px 0px; font-size:16px;}
	
	.howto-box .media-list li { background-image: url(../howto/bullet.png); background-position: left; background-size:18px 18px; background-repeat:no-repeat; padding-left:30px;}
	
	.border-l { border-left:12px solid #d5d9e0; padding-left:30px; margin-top:100px; padding-bottom:20px;}
	.border-r { border-right:12px solid #d5d9e0; padding-right:30px; margin-top:100px;padding-bottom:20px;}
	
	.howto-box  h4 { text-transform:uppercase; font-weight:700; margin-bottom:0px;}
	.md-pt-40 {padding-top: 40px;}
	@media (max-width:768px){ 
		.md-pt-40,.pt-40 {padding-top: 20px;}
	.step-toppic h3 { font-size:20px; }
	.howto-box  .pull-right { float:left !important ; }
	.border-l  {border-left:0; padding-left:0px; margin-top:0px;}
	.border-r { border-right:0px solid #d5d9e0; padding-right:0px; margin-top:0px;}
	.step-yap { font-size:30px; text-transform:uppercase;margin:10px 0}
	}

.mw400 { width:100%;   max-width:400px !important;}
/* howto-box end */

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

		.text-sm-center * {text-align:center}

}