body {

	background:#FFFFFF url(../workshop-cusco/chocolate-workshop-cusco-background-loading.jpg) no-repeat center center fixed; 
	background-size:100% auto;
	-webkit-background-size: cover;
	   -moz-background-size: cover;
	     -o-background-size: cover;
	        background-size: cover;
	-webkit-font-smoothing: antialiased;
	-webkit-overflow-scrolling: touch;
	line-height: 1.5em;
	font-size:14px;
	font-family: Arial;
	font-weight: normal;
}
	
		
									
									
	@font-face {
    font-family: 'waffle';
    src: url('./waffle.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}	

	@font-face {
    font-family: 'workshop';
    src: url('./workshop.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;

}

		a {color: #01A681 !important;}
a:hover {color: #FF6900 !important;}							
									
									
									h1 {
									font-family: arial;
									font-size: 800%;
									color: white;
							
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;
									line-height:60%;}
									
									
									h2 {
										
									font-family: original;
									font-size: 400%;
									line-height:120%;
									color: white;
								
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;}
									
									
											h3 {
										
									font-family: arial;
									font-size: 200%;
									line-height:110%;
									color: white;
							
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;}
									
									
									p.ntext {	
									font-family: arial;
									font-size: 100%;
									color: #FF6900;
					
									text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									text-align:center;}
									
									p.title {
									
									font-weight: 300;
									color: black;
									line-height: 100%;
									font-size: 300%;
									font-family: waffle;
									text-align: center;
								
									text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7);
									}
									
									p.ttb{
										font-family:arial;
										color:black;
										font-size:120%;
										text-align:justify;
										line-height:120%;
										
									}
									
									p.tt{
										font-family:original;
										color:black;
										font-size:180%;
										text-align:justify;
										line-height:120%;
										
									}
									
									p.ttw{
										font-family:original;
										color:white;
										font-size:180%;
										text-align:left;
										line-height:200%;
										
									}			
									
									p.ttwj{
										font-family:arial;
										color:white;
										font-size:180%;
										text-align:justify;
										line-height:200%;
										
									}
									
									p.faq{
										font-family:original;
										color:#FF6900;
										font-size:250%;
										text-align:left;
										line-height:80%;
							
										text-shadow: 0 3px 1px rgba(0, 0, 0, 0.7);
									}
	
									
									
									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: 155%;
									}
									
									p.normal22w{
									text-align: justify;
									font-family: arial;
									font-size: 130%;
									color: black;
									line-height: 140%;
									
									}
									
									
									p.normalleft2{
									text-align: left;
									font-family: arial;
									font-size: 130%;
									color: black;
									line-height: 190%;
									
									}	
									p.normalcenter{
									text-align: center;
									font-family: arial;
									font-size: 130%;
									color: black;
									line-height: 110%;
									
									}
									
									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.orgi{										
									font-family: original;
									color: black;
									font-size: 250%;
									text-align: left;
									line-height:100%;
									
									}
									
									
									p.label{										
									font-family: arial;
									color: white;
									font-size: 100%;
									text-align: left;
									line-height:100%;
											}
									
									
							
									
									p.qst{
									text-align: left;
									font-family: original;
									font-size: 240%;
									color: #FF6900;
									padding-left: 2px;
									line-height:130%;
									
									}
									
									
									p.ans{
									text-align: justify;
									font-family: original;
									font-size: 180%;
									line-height: 120%;
									color: white;
									padding-left: 10px;
									padding-top: 5px;
									margin-top:-15px;
									}
									
									
																						
									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 : rgba(255,  255,  255,  0.85);background: rgba(255,  255,  255,  0.85);color: rgba(255,  255,  255,  0.85);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 11px;
									margin: 0px;}
									
											.stepboxsans{
									background-color : rgba(255,  255,  255,  0.85);background: rgba(255,  255,  255,  0.85);color: rgba(255,  255,  255,  0.85);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 19px;
									}
									
												p.titletop {
									
									font-weight: 300;
									color: white;
									line-height: 100%;
									font-size: 300%;
									font-family: beer;
									text-align: center;
						
									text-shadow: 0 1px 0 rgba(0, 0, 0, 0.7);
									}
									
									
										.stepboxthin{
									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: 3px;
									margin: 0px;}
									
												
									.stepboxblackk{
									background-color : rgba(0,  0,  0,  1);background: rgba(0,  0,  0,  1);color: rgba(0,  0,  0,  1);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
									padding: 11px;
									margin: 0px;}
									
									.stepboxblackk2{
									background-color :rgba(0,  0,  0,  0.4);background: rgba(0,  0,  0,  0.4);color: rgba(0,  0,  0,  0.4);
									box-shadow: 4px 4px 10px #1E1E1E;
									border-radius: 2px;
								
									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: 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.listnot{
									
									font-family: original;
									font-size: 180%;
									color: black;
									text-align:left;
									line-height:200%;
									}
									
									
								.icon-bar {
										width: 22px; 
										height: 2px;
										background-color: #B6B6B6;
										display: block;
										transition: all 0.2s;
										margin-top: 4px
									}
 
									.navbar-toggler {
									  border: none;
									  background: transparent !important;
									}
									
									.navbar-toggler .top-bar {
  transform: rotate(45deg);
  transform-origin: 10% 10%;
}
 
.navbar-toggler .middle-bar {
  opacity: 0;
}
 
.navbar-toggler .bottom-bar {
  transform: rotate(-45deg);
  transform-origin: 10% 90%;
}
 
.navbar-toggler.collapsed .top-bar {
  transform: rotate(0);
}
 
.navbar-toggler.collapsed .middle-bar {
  opacity: 1;
}
 
.navbar-toggler.collapsed .bottom-bar {
  transform: rotate(0);
}

											
									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;
									}
									
										.stepboxmargin{
									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-top: 12px;
									margin-bottom: 12px;}
									
									
									.newshadow{
										
									-webkit-box-shadow: 7px -7px 20px 0px rgba(0,0,0,0.75);
									-moz-box-shadow: 7px -7px 20px 0px rgba(0,0,0,0.75);
									box-shadow: 7px -7px 20px 0px rgba(0,0,0,0.75);
										
									}
											
									
									
								
											
									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;}
									
									
							
									 
									
									
									.shadowround {
									box-shadow: 4px 4px 10px #1E1E1E;
									 border-radius: 6px;}
											
											
									.shadow{
									box-shadow: 4px 4px 10px #161616;}
		
		
									.noline {text-decoration: none}
									
									.revtitle{
									font-family: arial;
									font-size:140%;
									line-height:100%;
									font-weight: bold;
									text-align:left;	
									color:black;
									margin-bottom: 0.3em;
									}
									
									.rev{
									font-family: arial;
									font-size:120%;
									line-height:140%;	
									text-align:justify;
									color:black;
									}
									
							
									
.bg { 

  /* Full height */
  height: 100%; 

  /* Center and scale the image nicely */
  background-position: center;
  background-position: center; background-repeat: no-repeat;
  background-size: cover;
}
								
	
																		
								
				.btn-danger, .btn-danger:hover, .btn-danger:active, .btn-danger:visited {
    background-color: #FF6900 !important;
}


									p.title2c {
									font-weight: 300;
									color: black;
									line-height: 100%;
									font-size: 200%;
									font-family: waffle;
									text-align: center;
		
									text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);
									}
									
									.stepboxcustom{
									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;}
									
									
									
header .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: black;
  opacity: 0.5;
  z-index: 1;
}



@media (max-width: 320px) {	
}

@media (max-width: 767px) {
	#generic_price_table .generic_content{
		margin-bottom:75px;
	}
}
@media (min-width: 768px) and (max-width: 991px) {
	#generic_price_table .col-md-3{
		float:left;
		width:50%;
	}
	
	#generic_price_table .col-md-4{
		float:left;
		width:50%;
	}
	
	#generic_price_table .generic_content{
		margin-bottom:75px;
	}
}
@media (min-width: 992px) and (max-width: 1199px) {
}
@media (min-width: 1200px) {
}
#generic_price_table_home{
	 font-family: 'Raleway', sans-serif;
}


.demo-pic{
	margin: 0 auto;
}
.demo-pic:hover{
	opacity: 0.7;
}

#generic_price_table_home ul{
	margin: 0 auto;
	padding: 0;
	list-style: none;
	display: table;
}
#generic_price_table_home li{
	float: left;
}
#generic_price_table_home li + li{
	margin-left: 10px;
	padding-bottom: 10px;
}
#generic_price_table_home li a{
	display: block;
	width: 50px;
	height: 50px;
	font-size: 0px;
}
#generic_price_table_home .blue{
	background: #3498DB;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .emerald{
	background: #2ECC71;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .grey{
	background: #7F8C8D;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .midnight{
	background: #34495E;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .orange{
	background: #E67E22;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .purple{
	background: #9B59B6;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .red{
	background: #E74C3C;
	transition:all 0.3s ease-in-out 0s;
}
#generic_price_table_home .turquoise{
	background: #1ABC9C;
	transition: all 0.3s ease-in-out 0s;
}

#generic_price_table_home .blue:hover,
#generic_price_table_home .emerald:hover,
#generic_price_table_home .grey:hover,
#generic_price_table_home .midnight:hover,
#generic_price_table_home .orange:hover,
#generic_price_table_home .purple:hover,
#generic_price_table_home .red:hover,
#generic_price_table_home .turquoise:hover{
	border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
	transition: all 0.3s ease-in-out 0s;
}
#generic_price_table_home .divider{
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
	padding: 20px;
}
#generic_price_table_home .divider span{
	width: 100%;
	display: table;
	height: 2px;
	background: #ddd;
	margin: 50px auto;
	line-height: 2px;
}
#generic_price_table_home .itemname{
	text-align: center;
	font-size: 50px ;
	padding: 50px 0 20px ;
	border-bottom: 1px solid #ddd;
	margin-bottom: 40px;
	text-decoration: none;
    font-weight: 300;
}
#generic_price_table_home .itemnametext{
    text-align: center;
    font-size: 20px;
    padding-top: 5px;
    text-transform: uppercase;
    display: inline-block;
}
#generic_price_table_home .footer{
	padding:40px 0;
}

.price-heading{
    text-align: center;
}
.price-heading h1{
	color: #666;
	margin: 0;
	padding: 0 0 50px 0;
}
.demo-button {
    background-color: #333333;
    color: #ffffff;
    display: table;
    font-size: 20px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px;
    margin-bottom: 50px;
    outline-color: -moz-use-text-color;
    outline-style: none;
    outline-width: medium ;
    padding: 10px;
    text-align: center;
    text-transform: uppercase;
}
.bottom_btn{
	background-color: #333333;
    color: #ffffff;
    display: table;
    font-size: 28px;
    margin: 60px auto 20px;
    padding: 10px 25px;
    text-align: center;
    text-transform: uppercase;
}
.demo-button:hover{
	background-color: #666;
	color: #FFF;
	text-decoration:none;
	
}
.bottom_btn:hover{
	background-color: #666;
	color: #FFF;
	text-decoration:none;
}

											.equal {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}




    .card {
      position: relative;
      width: 90%;
      max-width: 400px;
      height: 550px;
      border-radius: 20px;
      overflow: hidden;
      color: white;
      background: url('../background-cocoa-beans-hands.jpg') center/cover no-repeat;
      box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
      display: flex;
      flex-direction: column;
      justify-content: flex-end;
      transition: transform 0.4s ease;
    }

    .card:hover {
      transform: translateY(-10px) scale(1.02);
      box-shadow: 0 12px 35px rgba(0, 0, 0, 0.4);
    }

    .overlay {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: linear-gradient(to top, rgba(0,0,0,0.7), rgba(0,0,0,0.2));
    }

    .content {
      position: relative;
      z-index: 2;
      padding: 20px;
      text-align: center;
    }

    .content h2 {
      font-size: 1.8rem;
      margin-bottom: 20px;
      text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
    }

    .buttons {
      display: flex;
      justify-content: center;
      gap: 15px;
    }

    .buttons button {
      padding: 10px 20px;
      border: none;
      border-radius: 25px;
      font-size: 1rem;
      cursor: pointer;
      transition: all 0.3s ease;
    }

    .buttons button:first-child {
      background: rgba(255,255,255,0.9);
      color: #333;
    }

    .buttons button:last-child {
      background: #e67e22;
      color: white;
    }

    .buttons button:hover {
      transform: scale(1.1);
      box-shadow: 0 5px 15px rgba(0,0,0,0.3);
    }

    @media (max-width: 500px) {
      .content h2 {
        font-size: 1.4rem;
      }
      .buttons button {
        font-size: 0.9rem;
        padding: 8px 16px;
      }
    }