@charset "utf-8";

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
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, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table.table, caption, tbody, tfoot, thead, tr, th, td {border: 0;font-family: inherit;font-size: 100%;font-style: inherit;font-weight: inherit;margin: 0;outline: 0;padding: 0;vertical-align: baseline;}
-------------------------------------------------------------- */
:focus {outline: 0;}

ol, ul {list-style: none;}
table.table {border-collapse: separate;border-spacing: 0;}
caption, th, td {font-weight: normal;text-align: left;}
blockquote:before, blockquote:after,q:before, q:after {content: "";}
blockquote, q {quotes: "" "";}
a img{border: 0;}
figure{margin:0}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
/* -------------------------------------------------------------- */

body {
color:#333;
font-size:small;
font-family:Verdana, Geneva, sans-serif, "Trebuchet MS", Helvetica, sans-serif, Arial, Helvetica, sans-serif,"Arial Black", Gadget, sans-serif;
line-height:1.5;
background:#f1f1f1;
-webkit-text-size-adjust: none;
}


/* LINK SETTING
------------------------------------------------------------*/
a{color:#333333;text-decoration:none;}
a:hover{color:#b1b1b1;}
a:active, a:focus {outline:0;}


/* WHOLE PAGE
------------------------------------------------------------*/
#wrapper{
margin:0 auto;
padding:0 1%;
width:98%;
position:relative;
background:#fff;
overflow: hidden;
}

.inner{
margin:0 auto;
width:100%;
}

article h3 {
	margin: 0;
    font-size:13px;
}

article p {
	margin:0;
}

/*************
/* HEADER
*************/
#header{
height:110px;
}

#header h1{
padding:0;
margin: 0;
font-size:12px;
font-weight:normal;
text-indent:100%;
white-space:nowrap;
overflow:hidden;
}

/*************
/* LOGO
*************/
.logo{
float:left;
}

.logo p{float:left;}

.logo img{
width:auto;
float:left;
padding:10px 5px 0 10px;
}

.logo span{display:block;}

/*************
/* PHONE NUMBER
*************/
.info{
float:right;
padding-right:20px;
text-align:right;
}

.info .open{font-size:1.1em;margin:0;}


/*************
/* LOGO+PHONE NUMBER
*************/
.logo,.info .tel{
color:#ff0000;
font-size:20px;
font-weight:bold;
line-height:150%;
margin: 0;
}

.logo span,.info span{
color:#333;
font-size:.6em;
font-weight:normal;
}


/*************
/* SEARCH
*************/
#search p {
margin:0 0 20px;
float:right;
padding-right:10px;
clear:both;}

#search text {
width:150px;
padding:4px 10px;
font-size:14px;
line-height:1;
border:none;
outline:none;
background:none;
background-image:url(../images/.png);
background-repeat:no-repeat;}

#search submit {
width:22px;
padding:4px 0;
font-size:14px;
line-height:1;
border:none;
outline:none;
background:none;
background-image:url(../images/search.png);
background-repeat:no-repeat
margin-left:4px;
vertical-align:top;
text-indent:-9999px;}

#search #submit:hover {
background-position: 0 -32px;}


/**************************
/* BREADCRUMB LIST
**************************/

ul, li {
list-style-type:none;
padding:0;
margin:0;
}

#crumbs {
margin:10px 17px;
border:1px solid #dedede;
height:2.3em;
}


#crumbs li {
float:left;
line-height:2.3em;
padding-left:.75em;
color:#777;
}

#crumbs li a {
display:block;
padding:0 15px 0 0;
background:url(../../images/crumbs.gif) no-repeat right center;
}

#crumbs li a:link, #crumbs li a:visited {
text-decoration:none;
color:#777;
}

#crumbs li a:hover, #crumbs li a:focus {
color:#dd2c0d;
}



/**************************
/* MAIN IMAGE(TOP PAGE+SUB PAGE)
**************************/
#mainBanner{
margin:17px auto;
padding:0;
width:100%;
position:relative;
line-height:0;
min-height:360px;
}

#mainBanner img{
max-width:100%;
height:auto;
border:4px solid #ebebeb;
overflow:hidden;
position:relative;
list-style:none;
}

#mainBanner ul {
   list-style:none;
   margin:0;
   padding:0;
}

#mainBanner li {
   position:absolute;
   background:#fff;
   margin:0;
   padding:0;
}

.slogan1{
position: absolute;
max-width: 35%;
height: auto;
bottom: 10px;
right: 40px;
}

img.slogan {
border: none !important;
width: 300px;
}


.slogan1 h2{
padding-bottom:5px;
font-size:20px;
}


.slogan2{
position:absolute;
max-width:55%;
height:auto;
bottom:15px;
left:20px;
padding:10px 15px;
line-height:1.4;
color:#fff;
background-color: rgba(0,0,0,0.4);
-webkit-border-radius: 15px;
}

.slogan2 h2{
padding-bottom:5px;
font-size:20px;
margin:0;
font-weight:normal;
}

.slogan2 p{
	margin:0;
}

/**************************
/* GRID
**************************/
.gridWrapper{
padding-bottom:20px;
overflow: hidden;
}

* html .gridWrapper{height:1%;}
	
.grid{
float:left;
border-radius:5px;
background:#fff;
}

.box{
margin:0 5px;
padding:10px;
border:1px solid #ebebeb;
}

.box img{
max-width:100%;
height:auto;
border:4px solid #ebebeb;
}

.box h3{padding:10px 0 5px; margin:0; font-size: 13px;}

.box h3, .box p{text-align:left;}

.box p.readmore{
padding:10px 5px 5px;
text-align:right;
margin: 0;
}

.box p{
	margin: 0;
}


/**************************
/* INFOBOX
**************************/

.infoBox,
.priceBox{
	border: 1px solid #3194C5;
	background-color: #FFFFFF;
    margin: 10px 0;
}

.priceBox {
	padding: 5px;
}

.priceBox tr:first-child td{
	text-align: center;
}

.infoBox>tbody>tr>td {
	vertical-align: top;
    padding: 5px;
}

.infoBox td:first-child {
	vertical-align: middle;
}

.infoBox strong {
	font-weight: bold;
}

.infoBox img {
	max-width: 100%;
}

.priceBox img {
	display: block;
    margin: 0 auto;
}


/*************
MAIN CONTENTS
*************/
section.content article{
padding:20px;
margin-bottom:20px;
border:1px solid #ebebeb;
overflow:hidden;
}

* html section.content article{height:1%;}

section.content p{margin-bottom:5px;}

h3.heading{
font-weight:normal;
padding:0 10px;
line-height:36px;
color:#fff;
background:url(../../images/heading4.png) repeat-x 0 0;
margin:0;
font-size: 13px;
background-size: 100% 100%;
}

h2.heading{
font-weight:normal;
padding:0 10px;
line-height:36px;
color:#fff;
background:url(../../images/heading33.png) repeat-x 0 0;
margin:0;
font-size: 13px;
background-size: 100% 100%;
}


section.content img{
max-width:90%;
height:auto;
}

.tourAvailTable {
width: 675px;
height: 333px;
max-width: 100%;
    border:0;
}

.alignleft{
float:left;
clear:left;
margin:3px 10px 10px 0;
}

.alignright{
float:right;
clear:right;
margin:3px 0 10px 10px;
}

ul, li {
list-style-type:none;
padding:0;
margin:0;
}

#tourinfor{
margin-left: 20px;
padding-left: 0;
}

#tourinfor li{
list-style-type: disc;
}


.linklist img {
max-width: 100%;
margin: 0px 0px 15px 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
}

ol {
counter-reset: order;
}
ol li {
counter-increment: order;
display: block;
}
ol li:before {
content: "*" counter(order) ". ";
}

#gallery .grid img,.border{border:4px solid #ebebeb;}

.tourAvailTable {
	width: 675px;
    max-width: 100%;
}

.tourAvailNbTours {
	height: 363px;
}

.tourAvailNbTours1{
    height: 182px;
}

.tourAvailNbTours2{
    height: 257px;
}

.tourAvailNbTours3{
    height: 332px;
}

.tourAvailNbTours4{
    height: 407px;
}

.tourAvailNbTours5{
    height: 482px;
}

.tourAvailNbTours6{
    height: 557px;
}


.divider,divider2,divider3{
	height: 2px;
	display: block;
	margin: 90px 0;
}

.divider2 {
	margin-top:50px;
}

.divider3 {
	margin-top:20px;
}

.returntotop {
width:160px;
height:44px;
float:right;
} 


.returntotop2 {
float:right;
margin: 0px 20px 50px 0px;
} 
	
.returntotop2  img{
width:160px;
height:44px;
} 

.insideimg {
float:right;
margin: 20px 10px 30px 0px;
} 
	
.insideimg  img{
width:200px;
} 


/*************
TABLE
*************/
.priceTableContainer {
	margin:5px auto 15px auto;
}

table.table{
width:100%;
}

table.table td{
border-collapse:collapse;
background-color:#F9F9F9;
text-align:left;
padding:8px;
border:1px solid #D6D6D6;
line-height:20px;
}

table.table th{
background-color: #F5F5F5;
text-align: left;
padding: 8px;
white-space: normal;
color: #151515;
border-top: 1px solid #D4D4D4;
border-right: 4px solid #D4D4D4;
border-bottom: 1px solid #D4D4D4;
border-left: 1px solid #D4D4D4;
font-size: 13px;
font-weight: normal;
letter-spacing: 1px;
background-repeat: repeat-x;
background-position: top;
}


/*************
/* SIDEBAR
*************/
#sidebar ul{padding-top:10px;}

#sidebar li{
margin-bottom:10px;
padding-bottom:10px;
list-style:none;
border-bottom:1px dashed #ebebeb;
}

#sidebar li:last-child{
border:0;
margin-bottom:0px;
}

#sidebar li a{display:block;}

ul.list li{
clear:both;
margin-bottom:5px;
padding:5px 0;
overflow:hidden;
}

ul.pricelist li {
    display: inline;
    margin-right: 20px;
    }

#sidebar li2 a{display:block;}

ul.list li{
clear:both;
margin-bottom:5px;
padding:0px 0;
overflow:hidden;
}

ul.list li{height:1%;}

ul.list li img{
float:left;
margin-right:10px;
}

ul.list li{
font-size:12px;
line-height:1.35;
}

/*************
IMAGES
*************/
.aboutusimage {
    float: left;
    margin:5px 10px 5px 0;
}


/*************
/* FOOTER
*************/
#footer{
clear:both;
overflow:hidden;
padding:15px 10px 20px 10px;
background:#e8e8e8;
}

* html #footer{height:1%;}

#footer .grid{
padding:10px 0 5px;
margin:0;
background:transparent;
}

#footer #info .logo, #footer #info .info{float:none;}

#footer #info .info{
clear:both;
padding:10px 0 0 15px;
text-align:left;
}

#footer .logo{font-size:18px;}

#footer .info .tel,#footer .info .tel span,#footer #info .open{font-size:12px;}

ul.footnav,
div.footnav{
float:right;
width:600px;
padding:15px 0;
}

ul.footnav li{
float:left;
margin-bottom:5px;
padding:0 8px 0 8px;
border-right:1px solid #b6b6b6;
list-style-type:none;
margin-left: 10px;
padding-left: 0;
}

#footer a{color:#333;}

#footer a:hover{color:#888;}

.footnav h3 {
	margin: 0;
    font-size: 13px;
}

div.footnav td{
border-right:1px solid #b6b6b6;
float:left;
padding: 0 8px 5px 10px;
}

div.footnav td:hover{
color:#888;
cursor:pointer;
}


#mainNav strong{
	font-weight:normal;
}

/* FOR PC
------------------------------------------------------------*/
@media only screen and (min-width: 960px){
  nav#mainNav{
	padding:0 14px;
	clear:both;
	overflow:hidden;
	position:relative;
	background:url(../../images/topnavBg.png);
	}

	nav#mainNav ul li{
	float: left;
	position: relative;
	}
	
	nav#mainNav li.last{border-right:1px solid #ebebeb;}

	nav#mainNav ul li a{
	display: block;
	text-align: center;
	_float:left;
	font-size:13px;
	width:154px;
	height:45px;
	padding-top:15px;
	color:#333;
	background:url(../../images/topnavSep4.png);
	border-left:1px solid #ebebeb;
	}
	
	nav#mainNav table td{
	text-align: center;
	font-size:13px;
	width:154px;
	height:45px;
	padding-top:15px;
	color:#333;
	background:url(../../images/topnavSep4.png);
	border-left:1px solid #ebebeb;
	}

	nav#mainNav ul li a span,nav#mainNav ul li a strong,
    nav#mainNav table td strong{
	display:block;
	}

	nav#mainNav ul li a span,
    nav#mainNav table td span{
	color:#ff0000;
	font-size:10px;
	}

	nav div.panel{
	display:block !important;
	float:left;
	}

	a#menu{display:none;}

	nav#mainNav li.active a, nav#mainNav li a:hover,
    nav#mainNav table td:hover,
    nav#mainNav table td.mainNavSelected{
	color:#fff;
	background-position:0 -60px;
	padding-top:15px;
    cursor:pointer;
	}
	
	#mainBanner{margin-left:15px;}
	#subpage #mainBanner{margin:15px auto;}

	#wrapper,.inner{
	width:960px;
	padding:0;
	}
	
	#wrapper{padding-bottom:20px;}
	.wrapper2 { padding: 0 15px; }
	
	#main{
	float:right;
	width:717px;
	padding-right:15px;
	}
	
	#sidebar{
	float:left;
	width:195px;
	padding:15px 0 0 15px;
	overflow:hidden;
	}
	
	#sidebar article{
	padding:7px;
	margin-bottom:20px;
	border:1px solid #ebebeb;
	overflow:hidden;
	}
	
	/* whole grid */
	.gridWrapper{
	width:960px;
	margin:0 0 0 -10px;
	}
	
	#gallery article{padding:10px 0 10px 10px;}
	
	/* grid */
	.grid{
	float:left;
	width:300px;
	margin-left:20px;
    min-height: 365px;
	}
	
	#subpage .grid{width:auto;}
	
  #gallery .grid{
	width:auto;
	margin:10px 0 2px 10px;
	}
}


@media only screen and (max-width:959px){
	*{
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
	}
        
    div.footnav {
	width: 100%;
	}
	
	nav#mainNav{
	clear:both;
	width:100%;
	margin:0 auto;
	padding:0;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1, #f5f5f5), color-stop(0.5, #f0f0f0), color-stop(0.00, #f7f7f7));
	background: -webkit-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
	background: -moz-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
	background: -o-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
	background: -ms-linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
	background: linear-gradient(top, #f7f7f7 0%, #f0f0f0 50%, #f5f5f5 100%);
  border:1px solid #e4e4e4;
	}

	nav#mainNav a.menu{
	width:100%;
	display:block;
	height:40px;
	line-height:40px;
	font-weight: bold;
	text-align:left;
	}

	nav#mainNav a#menu span{padding-left:10px;}
	nav#mainNav > a span:before{content: "→ ";}
	nav#mainNav a.menuOpen span:before{content: "↓ ";}

	nav#mainNav a#menu:hover{cursor:pointer;}

	nav .panel{
	display: none;
	width:100%;
	position: relative;
	right: 0;
	top:0;
	z-index: 1;
	}

	nav#mainNav ul li,
    nav#mainNav td{
	float: none;
	clear:both;
	width:100%;
	height:auto;
	line-height:1.2;
	background:url(../images/bg.png);
	}

	nav#mainNav ul li a,
    nav#mainNav ul li.current-menu-item li a,
    nav#mainNav td{
	display: block;
	padding:15px 10px;
	text-align:left;
	border-bottom:1px dashed #ccc;
    color: #ff3366;
	}
	
	nav#mainNav ul li a span,
    nav#mainNav td span{padding-left:10px;}
	
	nav#mainNav ul li:first-child a,
    nav#mainNav td:first-child{
	border-top:1px solid #e4e4e4;
	}
	
	nav#mainNav ul li:last-child a,
    nav#mainNav td:last-child{border:0;}
	
	nav#mainNav ul li.active a,
    nav#mainNav td.mainNavSelected{	color:#cc0066;}
    
	.slogan1{
	max-width:43%;
	bottom:5px;
	right:2px;
	}
  
  	.slogan2{
	visibility:hidden;
	}

	.imglinkWrapper{
	margin:0px;
	float:auto;
	}
	
	.linklist img{
	margin:0px 0px 15px 15px;
	max-width:43%;
    height:auto;
	}
    
	nav div.panel{float:none;}
	
	#mainBanner{
	min-height:320px;
	}
	
	#subpage #mainBanner{max-width:720px;}
	
	#sidebar article{
	padding:7px 8px;
	}
	
	#sidebar li{
	float:auto;
	}

	#sidebar img{
	display: block;
	margin-bottom:10px;
 	margin-left:auto;
 	margin-right:auto;
	}

	#crumbs {
	width:100%;
	margin:10px 0 0 0%;
	}

	#crumbs li {
	float:left;
	line-height:2.6em;
	font-size:80%;
	}

	.grid{
    width:100%;
    height:100%;
    margin:10px 0 0 1%;
    }
    
    .box img{
	max-width:100px;
    }
	
	#gallery .grid{
	float:left;
	width:31%;
	margin:0 0 0 1%;
	}
	
	#footer .grid,#footer ul.footnav{
	float:none;
	width:100%;
	text-align:center;
	}
	
	#footer .grid img, #footer .info{float:none;}
	#footer .grid p{display:block;}
	#footer #info .info{float:none;text-align:center;}
	
	#footer.logo,#footer .info{
	width:100%;
	float:none;
	}
	
	#footer .logo p{float:none;display:block;}
	#footer .logo img{float:none;padding:0;}

	ul.footnav{
	clear:both;
	float:auto;
	}
	
	#footer a{
	font-size:12px;
	}
		
}


/* SMARTPHONE (LANDSCAPE) */
@media only screen and (max-width:640px){
	#header{
	height:auto;
	padding-bottom:20px;
	}
	
	#mainBanner{min-height:240px;}
    #header h1,.logo,.info{text-align:center;}
	
	.logo,.info{
	clear:both;
	width:100%;
	float:none;
	}
	
	.logo p{float:none;display:block;}
	.logo img{float:none;padding:0;}
	
	.box img{
	max-width:180px;
	float:left;
	margin-right:5px;
	}
	
	.box h3{padding-top:0;}

  .alignleft,.alignright{
	float:none;
	display:block;
	margin:0 auto 10px;
	}
	
	#gallery .grid{float:left;}
}

.myItineraryFrame {
	width: 100%;
    height: 600px;
}

/* SMARTPHONE (PORTRAIT) */
@media only screen and (max-width:480px){
	.grid{width:100%;}
	.box img{max-width:100px;}
	#mainBanner h2,#mainBanner p{font-size:80%;}
	}

	.logo,.info .tel{
	font-size:18px;
	}
	
	#mainNav strong {
  	font-weight: normal;
	}

/* SMARTPHONE (LANDSCAPE) */
@media only screen and (max-width:480px){
    #mainBanner{min-height:190px;} 
    }
	
/* SMARTPHONE (PORTRAIT) */
@media only screen and (max-width:360px){
	#mainBanner{min-height:140px;}
	}