/* Bob Sumatera Tours CSS */

@font-face {
  font-family: myCustomFont;
  src: url(fonts/Poppins-Regular.otf);
}

@font-face {
  font-family: myCustomFontBold;
  src: url(fonts/Poppins-Bold.otf);
}

@font-face {
  font-family: myCustomFontExtraBold;
  src: url(fonts/Poppins-ExtraBold.otf);
}

@font-face {
  font-family: myCustomFontItalic;
  src: url(fonts/Poppins-Italic.otf);
}

@font-face {
  font-family: myCustomFontBoldItalic;
  src: url(fonts/Poppins-BoldItalic.otf);
}

@font-face {
  font-family: myCustomFontMedium;
  src: url(fonts/Poppins-Medium.otf);
}

@font-face {
  font-family: myCustomFontImpact;
  src: url(fonts/impact.ttf);
}

.bg-yellow { background-color: #d99730; }
.bg-green { background-color: #43855c; }
.bg-brown { background-color: #bb7554; }
.bg-dark-green { background-color:#166633;}
.bg-red {background-color:#c2302c;}
.bg-dark-grey {background-color: #0d1b29;}

.color-yellow { color: #d99730; }
.color-green { color: #43855c; }
.color-brown { color: #bb7554; }
.color-darkgreen { color:#166633;}
.color-red {color:#c2302c;}
.color-dark-grey {color: #0d1b29;}


body {
	background:  #FFF;
	background-image:  url("../imgs/lake-toba-beautiful-scenery.jpg");
	background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  background-size: 100%;
  margin:  0px;
  font-family: myCustomFont, Arial, Helvetica, Sans Serif;
  line-height: 1.3;
}

div {
  max-width: 1280px;
  margin: auto;
}

h1 { display: block;
		font-size: 2em;
		margin-top: 0.67em;
		margin-bottom: 0.67em;
		margin-left: 0;
		margin-right: 0;
		font-weight: bold; }

h2 { display: block;
		font-size: 1.5em;
		margin-top: 0.83em;
		margin-bottom: 0.83em;
		margin-left: 0;
		margin-right: 0;
		font-weight: bold; }

h3 { display: block;
		font-size: 1.17em;
		margin-top: 1em;
		margin-bottom: 1em;
		margin-left: 0;
		margin-right: 0;
		font-weight: bold; }

h4 { display: block;
			margin-top: 1.33em;
			margin-bottom: 1.33em;
			margin-left: 0;
			margin-right: 0;
			font-weight: bold; }	

p { 
		display: block;
		margin-top: 1em;
		margin-bottom: 1em;
		margin-left: 0;
		margin-right: 0;
 }


li {display: list-item;} 	

ul {
		display: block;
		list-style-type: disc;
		margin-top: 0em;
		margin-bottom: 1 em;
		margin-left: 0;
		margin-right: 0;
		padding-left: 40px;

}					

main {max-width: 1280px; margin: auto; background:#fff; }

.right { float:right; padding-left:10px; }
.left { float:left; padding-right:10px;}
.texttransformnone { text-transform: none;}	

p.clear {
  clear: both;
}

.secondarytopnav { 
			text-transform: uppercase ; 
			padding: 1%; 
			display: inline-block;
			float: right;
			width: 50%;
			text-align: right;
			font-size:  90%;

		}
.secondarytopnav a{ color: #111; text-decoration: none;}
.secondarytopnav a:hover{ color: #196633;}
.secondarytopnav span{
		padding-left: 1%;
		padding-right: 1%;
	}

.socialtopnav { 
		padding: 1%; 
		display:inline-block; }

.socialtopnav a{ color:#fff; }
.socialicons {
  display: inline-block;
  text-align: center;
  width: 22px;
  height: 22px;
  border-radius: 25px;
  padding: 0.5em;
  background: #000;
  margin-right: 15px;
}


header { 
			max-width: 1280px;
  		margin: auto;
  		padding-top: 10px;
  		background:  #fff;
  	}
.secondarytopnav-wrapper { 	max-width: 900px; margin: auto; } 	

.topnav-overimage { 
		position: absolute; 
 	 	width: 100%;
 	 	background-color: rgba(0, 0, 0, 0.75);
		}

nav .topnav {
		display: block;
		text-align: center;
} 

nav .topnav a{
	  font-family: myCustomFontBold, Arial, Helvetica, Sans Serif;
	  font-size: 110%;
		text-decoration: none;
		display: inline-block;
		width:  15%;
		line-height:  1.2em;
		height:  40px;
		padding:  10px 0px 5px 0px;
		margin-right: 1%;
		text-transform: uppercase;
		float:  left;
}

nav .topnav a:link{ color: #FFF}
nav .topnav a:visited{color: #FFF;}
nav .topnav a:hover{ background-color: #000;}

.active{
	  background-color: #000;
}


.bobsumatralogo { 
		display:block; 
		text-align: center;
		padding: 0px;
		background-image: url("../imgs/header-logo-hills-background.gif");
		background-repeat: no-repeat;
  	background-position: bottom;
		}	

.bobsumatralogo img{ }			

footer {
	max-width: 1280px; 
	margin: auto; 
	text-align: center; 
	background-color: #FFF;
	background-image: url("../imgs/lake-toba-scenery-footer-bg.jpg");
	background-position: center;
	background-size: 100%;
	padding: 10px 0px 20px 0px;
}

nav .botnav {
		display: block;
		text-align: center;
}

nav .botnav span { }

nav .botnav a{
		font-family: myCustomFontBold, Arial, Helvetica, Sans Serif;
		text-decoration: none;
		display: inline-block;
		width:  15%;
		height:  30px;
		padding:  10px 0px 5px 0px;
		text-transform: uppercase;
}

nav .botnav a:link{ color: #000}
nav .botnav a:visited{color: #111;}

nav .copyrightnav a{
		font-family: myCustomFontMedium, Arial, Helvetica, Sans Serif;
		text-decoration: none;
		display: inline;
		padding:  0px 8px 0px 8px;
		border-right:  1px solid #000;
		font-size: 90%;

}

nav .copyrightnav a:link{ color: #000}
nav .copyrightnav a:visited{color: #111;}
nav .copyrightnav a:hover{color: #196633;}

nav .copyrightnav span{
		display: inline;
		padding:  0px 8px 0px 8px;
		font-size: 90%;
}

.block-cover { 
		position: relative;
  }

.block-cover-image-container { min-height: 250px; max-height: 700px; overflow: hidden; background: #43855c; }
.block-cover-image {  width: 100%;	}
.block-cover-title-container {
	   position: absolute;
	   top: 360px;
	   left: 50% ;
		}	
.block-cover h1{
	    font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif;
			color: #FFF;
			max-width: 400px;
			font-size: 2.5em;
			margin-top: 0.1em;
		  margin-bottom: 0em;
		}
.block-cover a{
	   	color: #FFF;
	   	text-decoration: none ;
			
		}	

.block-cover-image-container500 { min-height: 250px; max-height: 500px; overflow: hidden;}
.block-cover-title-container500 {
	   position: absolute;
	   top: 150px;
	   left: 30% ;
		}	

.blockbutton { 
		display:inline-block; 
		padding: 12px 40px 12px 40px;
		font-family: myCustomFontBold, Arial, Helvetica, Sans Serif; 
		text-transform:uppercase;
		border: 2px solid #fff;
	}

.blockbutton:hover { 
		background-color: #d99730;
	}

.blockbutton a { text-decoration:none; color: #fff;}	
.blockbutton a:hover { }


.blockbutton-white { 
		display:inline-block; 
		padding: 12px 40px 12px 40px;
		font-family: myCustomFontBold, Arial, Helvetica, Sans Serif; 
		text-transform:uppercase;
		border: 2px solid #000;
	}

.blockbutton-white:hover { 
		background-color: #43855c;
	}

.blockbutton-white  a { text-decoration:none; color: #000;}	
.blockbutton-white  a:hover { }


.subtitle-container {
	text-align: center;
	margin-top: 1%;
	margin-bottom: 1%;
}

.subtitle-container h2{
	font-family: myCustomFontBold, Arial, Helvetica, Sans Serif; 
	color: #FFF;
	font-size: 1.6em;
	display:inline-block; 

}

.subtitlebutton { 
		display:inline-block; 
		padding: 5px 10px 5px 10px;
		margin-bottom: 5px;
		font-family: myCustomFontBold, Arial, Helvetica, Sans Serif; 
		text-transform:uppercase;
		border: 2px solid #fff;
	}

.subtitlebutton:hover { 
		background-color: #d99730;
	}

.subtitlebutton a { text-decoration:none; color: #fff;}	
.subtitlebutton a:hover { }


.bookyourtripnow{  
	background-color: #43855c;
	/*background-color: rgba(25, 102,51, 0.85);*/
	}	

.bookyourtripnowh2 {  
	/*background-color: #43855c;*/
	font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif; 
	padding:  0px;
	margin:  0px;
	text-transform: uppercase;
	font-size: 1.8em;
	display: block;
	}	

.bookyourtripnowh1 {  
	font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif;
	color: #FFF;
	font-size: 2.5em;
	margin-top: 0em;
	margin-bottom: 0em;
	display: block;
	}

.bookyourtripnowh1 a{  
	color: #FFF;
	}								

.bookyourtripnow span { color: #FFF;}
.qrcode img{ width: 100%; }

.row { 
	padding:20px 0px 20px 0px; 
	max-width: 600px;
  margin: auto; 
  text-align: center;
}

.column70 {
  float: left;
  width: 70%;
}
.column20 {
  float: left;
  width: 20%;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;

}

article { 
			max-width: 1000px;
  		margin: auto;
  		padding: 10px 8px 0px 8px;
  		min-height: 200px;
  	}
article span {}

article h2 { 
		font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif; 
		text-transform: uppercase;	
		}

article h4 { 
		font-family: myCustomFontBold, Arial, Helvetica, Sans Serif;
	}

.circleicons {
  display: inline-block;
  text-align: center;
  width: 12px;
  height: 12px;
  border-radius: 12px;
  padding: 0em;
  background: #166633;
  margin-right:  2px;
}

.finalpromobox {  }
.finalpromoboxtext { 
		font-family: myCustomFontBoldItalic, Arial, Helvetica, Sans Serif; 
		max-width: 800px;
		padding: 1%;
		text-align: center;
	}

.medanmap {
  max-width: 800px;
  margin: auto;
}	

.medanmap img{ width:100%; }

.subtitlelocation { 
		text-transform: uppercase; 
		display: block; 
		font-size:90%;
		letter-spacing: 5px;
	}

b { font-family: myCustomFontBold, Arial, Helvetica, Sans Serif;  }


.tripadvisorcontainer {
	text-align: center;

}

.tripadvisorlogo {

	display: inline-block;
	max-width: 18%;
	padding:  0px 10px 10px 0px;
	text-align: center;
}

.tripadvisorlogo img{
	width: 100%;
}


.wonderfulindonesia {
	display: inline-block;
	max-width: 18%;
	padding:  0px 10px 10px 0px;
	text-align: center;
}

.wonderfulindonesia img{
	width: 100%;
}


.highlightsbox { 
	text-align: center;
}

.highlightsbox h2 { 
		font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif; 
		text-transform: uppercase;
		font-size:  250%;
		padding-top: 0px ;
		padding-bottom: 10px ;
		line-height: 0px;
		letter-spacing: 3px;
	
		}

.highlightsbox h4 { 
		font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif; 
		text-transform: uppercase;
		display: inline-block;
		font-size:  1.2em;
		}	


.thingstodotable { 
		display:table; 
		max-width: 900px;
		 }		

.thingstodo-col1 {
	display: table-cell;
	width: 50%;
	padding-bottom: 10px;
}

.thingstodo-col1 figure{
	display: inline-block;
	max-width:100%;

}

.thingstodo-col1 figure img{
	width:49%;
	padding:5px;
	display: inline-block;
	float: right;
}

.thingstodo-col2 {
	display:  table-cell;
	width:49%;
	padding-bottom: 10px;
}

.thingstodo-col2 figure{
	display: inline-block;
	max-width:100%;

}

.thingstodo-col2 figure img{
	width:50%;
	padding:5px;
	display: inline-block;
	float: left;
}


.inner-page-title-container {
	font-size: 2em;
  margin-bottom: 0.5em;
  position: absolute;
	width: 99%;
	bottom: 0;
}


.inner-page-title-container h1{
			font-family: myCustomFontImpact, Arial, Helvetica, Sans Serif;
			font-weight: normal;
			max-width: 100%;
			text-align: center;
		}

.lightbg { 
		background-image: url("../imgs/lightbg/light-background01.jpg");
		background-repeat: no-repeat;
  	background-position: top;
  	background-size:  cover;      
	}


.video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.sitemap a{ line-height:1.5em; font-weight:bold; font-size:130%; text-decoration:none; }
.sitemap a:hover{ color: #166633; text-decoration:underlined;}

.photogallery { text-align:center; padding-bottom:1%; }
.photogallery figure{ padding-bottom:2%; }
.photogallery img { max-width: 100%; }
.photogallery H2 { }
.photogallerytext { text-align:left; padding-bottom:1%; }

.backgroundsizecontain { background-size:contain; }


	.tile-menu { 
		width: 350px; 
		padding-bottom: 1%;	
		display: inline-block;
		margin: 0.3em;	
	}	

	.tile-menu a{ 
		text-decoration:none; 
		font-weight: bold;
		color: #000;
		transition: opacity 0.3s ease;
	}

	.tile-menu a:hover{ 
		 opacity: 0.6;
	}

	.tile-image {
    background: url(img/tileimage/default-feature-m.jpg) no-repeat center center;
    background-size: cover;
    padding-top: 72.5%;
    position: relative;
	}		

	.tile-block-size { 
		box-sizing: inherit;
		display: block;}

	.tile-label { 
		box-sizing: inherit;
		max-height: 30px; 
		border: 2px solid #000000; 
		display: block;
		text-transform:  uppercase;
		text-align: center;
		line-height: 1.1;
   		letter-spacing: .1em;
		margin: 0.3em 0 0 0;
		padding: 0.75em 0.25em;
		font-size:  110%;
		transition: background-color 0.3s ease;
		background-color: #43855c;
		}

.itenarary { list-style-type:none; padding-left: 0; list-style-position: inside; }

.itenarary li { 
	padding: 5px 0px 5px 0px; 
   }

 .breadcrumbs { 
		text-transform: uppercase; 
		display: block; 
		font-size:90%;
		letter-spacing: 2px;
		padding-top: 5px;
	}  

/**************************** Media Screen Size Option*****************************/
@media only screen and (max-width:1200px) {
.block-cover-image-container { max-height: 600px;}
}

/**************************** Media Screen Size Option*****************************/
@media only screen and (max-width:1000px) {
  
body {
	background:  #FFF;
	background-image: none;
}


 div {
  max-width: 800px;
	}
header { max-width: 800px;}
main { max-width: 800px;}
footer { max-width: 800px;}

	p.clear {
	visibility: hidden;
	}

nav .topnav a{
	  font-size: 90%;
		width:  15%;
		line-height:  1.2em;
		height:  40px;
		padding:  8px 0px 3px 0px;
}


nav .botnav span { display:block; }
nav .botnav a{ width: 30%; }
nav .copyrightnav span{
		display: block;
		padding:  0.4em 0 0.4em 0;
}

.block-cover-image-container { max-height: 440px; overflow: hidden;}
.block-cover-image-container500 { max-height: 380px; overflow: hidden;}

.block-cover-title-container {
	   position: absolute;
	   top: 220px;
	   left: 40% ;
		}	

.block-cover-title-container500 {
	   position: absolute;
	   top: 150px;
	   left: 30% ;
		}			

article { 
			max-width: 740px;
  		margin: auto;
  		padding-top: 10px;
  	}


.tripadvisorlogo {
	display: inline-block;
	max-width: 30%;
	padding:  0px 10px 10px 0px;
	text-align: center;
}

.tripadvisorlogo img{

	width: 80%;
}

.wonderfulindonesia {
	display: inline-block;
	max-width: 30%;
	padding:  0px 10px 10px 0px;
	text-align: center;
}

.wonderfulindonesia img{
	width: 100%;
}


.inner-page-title-container {
	font-size: 1.5em;
  margin-bottom: 0.5em;
  position: absolute;
	width: 99%;
	bottom: 0;
}



}/* end ipad screen options */


/***************************** start mobile screen options ******************************/
@media only screen and (max-width:600px) {


	p.clear {
	visibility: hidden;
	}
	
	.right { float:none; }
	.left { float:none;}	

	.fullwidthimage{ width:100%; }

.secondarytopnav { 
			display: block;
			float: none;
			width: 95%;
		}

.socialtopnav { display:block; text-align:right; padding-top:0px; }

.bobsumatralogo img { width:100%; }	

.topnav-overimage { display: none; }

nav .topnav {
		display: none;
} 

nav .botnav a{
		text-decoration: none;
		display: block;
		width:  100%;
		height: 30px;
		line-height: 30px;
		padding:  5px;
		float:  none;
		}

nav .copyrightnav a{
		display: block;
		border:  none;
		padding:  0.4em 0 0.4em 0;
}

nav .copyrightnav span{
		display: block;
		padding:  0.4em 0 0.4em 0;
}

.block-cover-image-container { 
		max-height: 320px; 
		overflow: hidden;
		
	}

.block-cover-title-container {
	   position: absolute;
	   top: 40%;
	   left: 10% ;
		}	
.block-cover h1{
	    font-family: myCustomFontExtraBold, Arial, Helvetica, Sans Serif;
			color: #FFF;
			max-width: 300px;
			font-size: 2.2em;
			margin-top: 0em;
		  margin-bottom: 0em;
		}

.block-cover-image-container500 { max-height: 300px; overflow: hidden;}	

	.block-cover-title-container500 {
	   position: absolute;
	   top: 20%;
	   left: 10% ;
		}		

.blockbutton { 
		padding: 8px 30px 8px 30px;
	}

.subtitle-container h2{
	margin-top: 1%;
	margin-bottom: 1%;
	display:block; 
	font-size: 1.4em;
}		

.subtitlebutton { 
		display:inline-block; 
		padding: 5px 10px 5px 10px;
		margin-bottom: 5px;
	}

footer { background:#FFF; }	

.column70 {
  float: none;
  width: 90%;
}
.column20 {
  float: none;
  width: 30%;
  padding: 10px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: block;
  clear: both;
  	}

article { 
			max-width: 440px;
  		margin: auto;
  		padding-top: 10px;
  		}	


.tripadvisorlogo {
	display: inline-block;
	max-width: 45%;
}

.tripadvisorlogo img{
	width: 80%;
}


.wonderfulindonesia {
	display: block;
	max-width: 100%;
	padding:  0px 0px 0px 0px;
	text-align: center;
}

.wonderfulindonesia img{
	width: 35%;
}


.thingstodo-col1 {
	display: block;
	width:80%;
	padding-bottom: 0px;
}

.thingstodo-col1 figure{
	padding-bottom: 10px;
}

.thingstodo-col1 figure img{
	float: right;
}

.thingstodo-col2 {
	display: block;
	width:80%;
	padding-bottom: 0px;
}

.thingstodo-col2 figure{
	padding-bottom: 10px;
}

.thingstodo-col2 figure img{
	float: right;
}

.highlightsbox h2 { 
		line-height: 0px;
		padding:  0px;
		}	


.inner-page-title-container {
	font-size: 1.5em;
  margin-bottom: 0.5em;
  position: absolute;
	bottom: 0;
}


.inner-page-title-container h1{
			max-width: 100%;
			text-align: center;
			font-family: myCustomFontImpact, Arial, Helvetica, Sans Serif;
		}





	} /* end mobile screen options */


