body { 
											background-color: #999;
											background-image: url(../patern2.gif);
											background-repeat: repeat;}
											
											 
																						
									@font-face {
											font-family: pubcrawl;
											src: url(https://www.pubcrawlbrussels.com/barcrawl/css/pubcrawl.ttf);}	
											
									@font-face {
									font-family: beer;
									src: url(https://www.pubcrawlbrussels.com/barcrawl/css/beer.ttf);}
											
								
									
									
									
	@font-face {
    font-family: 'pubcrawl';
    src: url('./pubcrawl.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}


	@font-face {
    font-family: 'beer';
    src: url('./beer.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

	@font-face {
    font-family: 'original';
    src: url('./original.woff') format('woff');
    font-weight: normal;
    font-style: normal;}
	
	
	
.arrow{
    position: absolute;
    top: 95%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 5px solid #563e91;
    border-right: 5px solid #563e91;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    animation-delay: -0.4s;
}
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}				
		
									
									
									
									
									h1 {
									font-family: pubcrawl;
									font-size: 300%;
									color: #FF6900;
									text-shadow:   background: #91877b;
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;}
									
									
									h2 {
										
									font-family: pubcrawl;
									font-size: 220%;
									color: #FF6900;
									text-shadow:   background: #91877b;
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;}
	
									
									
									p.titlesfooter {
										
										font-family: arial;
										text-align: left;
										color: gray;
									font-size: 120%;}
									
													p.normal22{
									text-align: justify;
									font-family: arial;
									font-size: 130%;
									color: black;
									line-height: 140%;
									padding-right: 10px;
									padding-left: 10px;}
									
									p.beerexp{										
									font-family: beer;
									color: black;
									font-size: 250%;
									text-align: center;
									}
									
									p.beerexp2{
									font-family: pubcrawl;
									font-size: 250%;
									text-align: center;
									color:#FF6900;
									}
									
									
									
									p.normalleft{
									text-align: left;
									font-family: arial;
									font-size: 130%;
									color: black;
									padding-left: 8px;
									padding-right: 8px;}
									
									
																						
									p.list1 {
											line-height: 170%;
											font-size: 170%;
											font-family: arial;
											font-weight: bold;
											color: white;}
											
									p.new1 {
											line-height: 170%;
											font-size: 170%;
											font-family: arial;
											font-weight: bold;
											color: white;
											text-align:center;}
											
									.stepbox{
									background-color : background-color: rgba(255,  255,  255,  0.8);background: rgba(255,  255,  255,  0.8);color: rgba(255,  255,  255,  0.8);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 11px;
									margin: 0px;}
									
									
									.whiteshad{
									 box-shadow: 0 8px 20px 0 rgba(255, 255, 255, 0.4), 0 20px 20px 0 rgba(255, 255, 255, 0.39);
										
									}
									
												
									.stepboxblack{
									background-color : background-color: rgba(0,  0,  0,  0.8);background: rgba(0,  0,  0,  0.8);color: rgba(0,  0,  0,  0.8);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 11px;
									margin: 0px;}
									
									.booking0{
									background-color : black;
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 1px;
									border: solid 2px white;							
									}
									
									.booking1{
									color:black;
									background-color : green;
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									border: solid 4px #FF6900;							
									}
									
									.stepbox2{
									background-color : background-color: rgba(255,  255,  255,  0.8);background: rgba(255,  255,  255,  0.8);color: rgba(255,  255,  255,  0.8);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 7px;
									margin: 0px;}
									
						
											
									p.legend {
											color: #A0A0A0;
											font-size: 80%;
											font-family: arial;
											text-align: left;}
									

											
									p.copyright{
									
											font-family: arial;
											font-weight: bold;
											color: white;}
																		
									.book {color: red;}
									
									.img100{
									
									width: 100%;
									}
									
									p.daily {
									
									font-family: arial;
									color: white;
									line-height: 130%;
									font-size: 140%;
									text-align: justify;
									}
									
									p.dailycenter {
									
									font-family: arial;
									color: white;
									line-height: 130%;
									font-size: 140%;
									text-align: center;
									}
									
									p.dailyleft {
									
									font-family: arial;
									color: white;
									line-height: 130%;
									font-size: 140%;
									text-align: left;
									}
									
									p.gps {
									
									font-family: arial;
									color: white;
									line-height: 130%;
									font-size: 100%;
									text-align: left;
									}
											
									
									p.pubcrawl{
									font-family: pubcrawl;
											font-size: 220%;
											color: #FF6900;
									text-shadow:   background: #91877b;
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);}
											
									p.pubcrawlshad{
									
									font-family: pubcrawl;
									font-size: 220%;
									color: #FF6900;
									text-shadow:   background: #91877b;
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;
									}
											
									p.pubcrawlsm{
									font-family: pubcrawl;
											font-size: 170%;
											color: #FF6900;}
											
								
											
									p.desc{
									font-family: arial;
									font-size: 140%;
									color: #FF6A00;
									line-height: 130%;
									text-align:justify;
									border: 7px solid #303030;
									padding: 10px;
									background: black;
									}		
									
									.bkk{	background-color: #000000;
									opacity: 0.7;
									filter: alpha(opacity=70); /* For IE8 and earlier */
									padding: 10px;}
									
									
									.shadow {
									box-shadow: 4px 4px 10px #1E1E1E;
									 border-radius: 2px;}
									 
									
									
									.shadowround {
									box-shadow: 4px 4px 10px #1E1E1E;
									 border-radius: 6px;}
											
											
									.shadowonly{
									box-shadow: 4px 4px 10px #161616;}
		
		
									.noline {text-decoration: none}
									
								
	
																		
								
																		
.btnnn {
  -webkit-border-radius: 2;
  -moz-border-radius: 2;
  border-radius: 2px;
  font-family: pubcrawl;
  color: #ffffff;
  background: #000000;

  font-size:250%;
    border-bottom: 10px solid white;
  padding: 5px 2px 0px 10px;
    margin-bottom:5px;

}

.btnnn:hover {
  background: #1a2c38;
  text-decoration: none;
}				


									p.title2c {
									font-weight: 300;
									color: black;
									line-height: 100%;
									font-size: 200%;
									font-family: waffle;
									text-align: center;
									text-shadow:   background: #91877b;
									text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
									}
									
									.stepboxcustom{
									background-color : background-color: rgba(255,  255,  255,  0.8);background: rgba(255,  255,  255,  0.8);color: rgba(255,  255,  255,  0.8);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 11px;
									margin: 0px;}




bodycard {
  background-color: #252830;
  color: white;
  font-family: "Lato";
}


.container-fluidcard {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
          transform: translateY(-50%) translateX(-50%);
  width: 100%;
}


.mediacard {
  background-position: center;
  background-size: cover;
  height: 100%;
  position: absolute;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  width: 100%;
}
figure {
  height: 370px;
  overflow: hidden;
  position: relative;
}
figure a {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 3;
}
figure:hover .media {
  -webkit-transform: scale(1.25);
          transform: scale(1.25);
}
figcaption {
  color: #252830;
  height: calc(100% - 30px);
  margin: 15px;
  left: 0;
  position: absolute;
  top: 0;
  width: 250px;
}
.bodycard {
  background-color: white;
  bottom: 0;
  padding: 15px;
  position: absolute;
  width: 100%;
}
svg {
  height: inherit;
  width: 100%;
}
svg text {
  text-anchor: middle;
}
svg #alpha {
  fill: white;
}
svg .title {
  font-size: 28px;
  font-family: "Montserrat";
  letter-spacing: 5px;
}
svg #base {
  fill: white;
  -webkit-mask: url(#mask);
  mask: url(#mask);
}