@font-face {
	font-family: "GermaniaOne";
	src: url("fonts/GermaniaOne-Regular.ttf");
}
@font-face {
	font-family: "Monserrat";
	src: url("fonts/Montserrat-Regular.ttf");
}
@font-face {
	font-family: "MonserratBold";
	src: url("fonts/Montserrat-Bold.ttf");
}
@font-face {
	font-family: "MonserratBlack";
	src: url("fonts/Montserrat-Black.ttf");
}
@font-face {
	font-family: "MonserratMedium";
	src: url("fonts/Montserrat-Medium.ttf");
}

@font-face {
	font-family: "RubikExtraBold";
	src: url("fonts/Rubik-ExtraBold.ttf");
}
@font-face {
	font-family: "RubikBold";
	src: url("fonts/Rubik-Bold.ttf");
}
@font-face {
	font-family: "RubikSemiBold";
	src: url("fonts/Rubik-SemiBold.ttf");
}
@font-face {
	font-family: "RubikRegular";
	src: url("fonts/Rubik-Regular.ttf");
}
@font-face {
	font-family: "RubikLight";
	src: url("fonts/Rubik-Light.ttf");
}


.kaiser-title {
	font: 80px solid black;
	font-family: "Monserrat";
	padding: 0.5rem 1rem;
	display: block;
}
.kaiser-text {
	font-family: "Monserrat";
	/*display: block;*/
}
.kaiser-medium {
	font-family: "MonserratMedium";
	/*display: block;*/
}
.kaiser-black {
	font-family: "MonserratBlack";
	/*display: block;*/
}
.kaiser-bold {
	font-family: "MonserratBold";
	/*display: block;*/
}
.rubik-light {
	font-family: "RubikLight";
	/*display: block;*/
}
.rubik-regular {
	font-family: "RubikRegular";
	/*display: block;*/
}
.rubik-semi-bold {
	font-family: "RubikSemiBold";
	/*display: block;*/
}
.rubik-bold {
	font-family: "RubikBold";
	/*display: block;*/
}
.rubik-extra-bold {
	font-family: "RubikExtraBold";
	/*display: block;*/
}


.germania-regular {
	font-family: "GermaniaOne";
	display: block;
}
.primary-text-shadow {
	text-shadow: 4px 4px 4px rgba(175, 10, 32, 1);
}
.secondary-text-shadow {
	text-shadow: 4px 4px 4px rgba(180, 135, 27, 1);
}
.white-text-shadow {
	text-shadow: 4px 4px 4px white;
}
.black-text-shadow {
	text-shadow: 4px 4px 4px black;
}

.kaiser-medium-warning-text-below-input {
	font-size: 15px;
	display:none;
	color: #AF0A20;
}

.hidden {
	visibility: hidden;
}
.hidden-element{
	display: none;
}

/*
html {
    font-size: 1rem;
	background-color: #1D1F20;
}
*/

.glider {
	overflow: hidden;
}
.map {
	height: 300px;
	width: 100%;
}

input[type=text].item-finder {
	border: none;
	border-bottom: 1px solid white;
	background-color: RGBA(0, 0, 0, 0);
	color: white;
	width: 80%;
}

input[type=text].item-finder:focus {
	border: none;
	border-bottom: 2px solid white;
	background-color: RGBA(0, 0, 0, 0);
	box-shadow: none;
	outline: none;
	transition: all ease-in-out .2s;
}

input[type=text].phone-item-finder {
	border: none;
	border-bottom: 2px solid rgba(0, 40, 45, 1);
	background-color: rgba(0, 0, 0, 0);
	color: black;
	width: 80%;
	/*
	display: inline-block;
	position: relative;
	overflow: hidden;
	*/
}

input[type=text].phone-item-finder:focus {
	background-color: RGBA(0, 0, 0, 0);
	box-shadow: none;
	outline: none;
}


.text-intro {
	text-align: center;
	color :  red;
	font-size: 36px;
}

.align-left {
	text-align: left;
}

.align-right {
	text-align: right;
}

.link-red {
	color: rgba(232, 57, 56, 1);;
}
.link-red:hover {
	color: rgba( 255, 255, 255, 1);;
}

.navbar-kaiser {
	background-color: rgba(175, 10, 32, 1);
}

.h-80 {
	height: 80%;
}
.h-100 {
	height: 100%;
}

.w-70 {
	width: 80%;
}
.w-80 {
	width: 80%;
}
.w-90 {
	width: 90%;
}

.w-100 {
	width: 100%;
}

.max-w-100 {
	max-width: 100%;
}

.text-align-middle {
	top: 50%;
	bottom: 50%;
}

.navbar-kecomer-icon {
	background-size: 100%;
	height: 75px;
	width: 75px;
	margin-left: auto;
	margin-right: auto;
}

.navbar-kecomer-letters {
	height: 40px;
	width: 100px;
}



.active-kecomer {
	background:  rgba(241, 119, 54, 1);
	color: white;
	transform: skew(-20deg);
	border-radius: 5px;
	text-align: center;
}

.active-kecomer-text {
	color: white;
	transform: skew(20deg);
	border-radius: 100px;
	padding: 0.5rem 1rem;
	display: block;
}

a.active-kecomer-text:hover {
	color: white;
}
a.kecomer-text:hover {
	color: rgba(241, 119, 54, 1);
}


.marked-border-blue {
	border : 1px;
	border-color: blue;
}

.container-logo-main {
	align-items: center;
	align-content: center;
	width: 100%;
}

.logo-main {
	align-self: center;
	height: 40%;
	width: 40%;
}

.banner-mini {
	height: 150px;
	width: 250px;
	border-color: rgb(0, 0, 0);
	border-style: solid;
	border-width: 0px 1px 1px 1px;
	border-radius: 5%;
}

.footer {
	position: static;
	left: 0;
	bottom: 0;
	width: 100%;
	background-color:rgba(180, 135, 27, 1);
	color: white;
	text-align: center;
}
.center-text {
	text-align: center;
}
.center {
	display:flex;
	margin-left: auto;
	margin-right: auto;
}
.center-y{
	display:flex;
	justify-content: center;
	
}
.center-x{
	display:flex;
	justify-content: center;
}
.flex-row {
	display: flex;
	flex-direction: row;
}
.flex-column {
	display: flex;
	flex-direction: column;
}

.flex-row-space {
	display: flex;
	justify-content: space-between;
}

.flex-row-evenly {
	display: flex;
	justify-content: space-evenly;
}

.flex-row-start {
	display: flex;
	justify-content: flex-start;
}

.glider-img {
	border-radius: 20px 20px;
}

.text-intro-shadow {
	text-shadow: 3px 3px rgb(145, 255, 0);
}


.pointer-hover:hover {
	cursor: pointer;
}




/*Colores*/
.color-primary {
	color: #AF0A20;
	/*color: rgba(175, 10, 32, 1);*/
}
.color-secondary {
	color: #B4871B;
}
.color-secondary-light {
	color: #B4871B;
}
.color-primary-hex {
	color: #AF0A20;
}

.color-white {
	color: white;
}
.color-black {
	color: black;
}
.color-red {
	color: red;
}
.color-green {
	color: green;
}
.color-yellow {
	color: rgb(255, 213, 27);
}
.color-bronze {
	color: rgb(205, 127, 50);
}
/*Colores*/


/*Fondos Backgrounds*/

.brick-container {
	background-image: url("../../img/home/background_bricks.webp");
	background-repeat: no-repeat; 
	background-size: cover;
	/*width: 100%;*/
}
.brick-ck-container {
	background-image: url("../../img/home/background_bricks_CeveceriaKaiser.webp");
	/*width: 100%;*/
	background-repeat: no-repeat; 
	background-size: cover;
}
.brick-ck-container-sm {
	background-image: url("../../img/home/background_CerveceriaKaiser_sm.webp");
	width: 100%;
	height: 800px;
	background-repeat: no-repeat; 
	background-size: cover;
}
.brick-ck-container-sm-golden {
	background-image: url("../../img/home/background_bricks_CeveceriaKaiser_sm_golden.webp");
	/*width: 100%;*/
	background-repeat: no-repeat; 
	background-size: cover;
}

.brick-ck-container-stick {
	background-image: url("../../img/home/background_bricks_CeveceriaKaiser.webp");
	width: 100%;
	background-repeat:repeat-y;
}

.ck-container-stick {
	background-image: linear-gradient(
		rgba(255, 255, 255, 0.4),
		rgba(255, 255, 255, 0.4)
	), url("../../img/main/Cerveceria_Kuster_white_without_background.webp");
	width: 100%;
	height: auto;
	background-size: 80%; 
	background-repeat: no-repeat; 
	/*background-repeat: repeat-y; */
	background-position: center;
	background-attachment: fixed;
}

.man-container-top {
	background-image: linear-gradient(
		rgba(255, 255, 255, 0.2),
		rgba(255, 255, 255, 0.2)
	), url("../../img/home/sensistive_man_2.png");
	background-repeat:no-repeat;
	background-size: 60%;
	background-position: left top;
	/*width: 100%;*/
}
.man-container-top-sm {
	background-image: linear-gradient(
		rgba(255, 255, 255, 0.2),
		rgba(255, 255, 255, 0.2)
	), url("../../img/home/sensistive_man_2.png");
	background-repeat:no-repeat;
	background-size: 200%;
	background-position: top right;
	/*width: 100%;*/
}

.man-container-bottom {
	background-image: linear-gradient(
		rgba(255, 255, 255, 0.2),
		rgba(255, 255, 255, 0.2)
	), url("../../img/home/sensistive_man_2.png");
	background-repeat:no-repeat;
	background-size: 70%;
	background-position: left bottom;
	/*width: 100%;*/
}
.man-container-bottom-sm {
	background-image: linear-gradient(
		rgba(255, 255, 255, 0.2),
		rgba(255, 255, 255, 0.2)
	), url("../../img/home/sensistive_man_sm.png");
	background-repeat:no-repeat;
	background-size: 200%;
	background-position: right bottom;
	/*width: 100%;*/
}

.contact-us-container {
	background-image: linear-gradient(
		rgba(0, 0, 0, 0.2),
		rgba(0, 0, 0, 0.2)
	), url("../../img/home/cremas_kaiser_contactanos.webp");
	background-repeat : no-repeat;
	background-size : cover;
	background-position: center;
}

.background-primary {
	background-color: #AF0A20;
}
.background-primary-light {
	background-color: rgba(175, 10, 32, 0.5);
}
.background-secondary {
	background-color: #b4871b;
	/*background-color: rgba(180, 135, 27, 1);*/
}
.background-secondary-light {
	background-color: rgba(180, 135, 27, 0.5);
}
.background-transparent {
	background-color: transparent;
}
.background-green {
    background-color: rgba(0, 166, 88, 1);
}
.background-red {
    background-color: rgba(232, 57, 56, 1);
}
.background-white {
	background-color: white;
}
.background-body-focus {
    background-color: rgba(233, 236, 239, 0.8);
}
.background-black {
    background-color: black;
}
.background-white-light {
	background-color: rgba( 255, 255, 255, 0.8);
}

/*Fondos*/

/*
Cajas / Cuadros / Boxes / Squares
*/

.product-batch-info-box{
	background-color: white;
	border-radius: 10px;
	border-color: #AF0A20;
	border: 10px solid #AF0A20;
}

.comment-box{
	background-color: white;
	border-radius: 10px;
	border-color: #B4871B;
	border: 10px solid #B4871B;
}
/*
Cajas / Cuadros / Boxes / Squares
*/



/*Botones*/

.btn-kaiser-main {
	background-color: rgba(175, 10, 32, 1);
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;
	font-size : 30px;
	font-family: "Monserrat";
}
  
.btn-kaiser-main:hover {
	background-color: rgba(140, 7, 25, 1);
    transition: background-color 300ms;
}

.btn-kaiser-main-sm {
	background-color: rgba(175, 10, 32, 1);
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;
	font-size : 20px;
	font-family: "Monserrat";
}
  
.btn-kaiser-main:hover {
	background-color: rgba(140, 7, 25, 1);
    transition: background-color 300ms;
}

.btn-kaiser-secondary {
	background-color: rgba(180, 135, 27, 1);
	border: none;
	color: white;
	padding: 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	margin: 4px 2px;
	cursor: pointer;
	border-radius: 16px;
	font-size : 30px;
	font-family: "Monserrat";
}
  
.btn-kaiser-secondary:hover {
	background-color: rgba(144, 108, 21, 1);
    transition: background-color 300ms;
}


/*Botones*/

.row-selected td {
    background-color: rgba(0, 166, 88, 1) !important; /* Add !important to make sure override datables base styles */
 }

.horizontal-scrollmenu {
	max-width: 100%;
	/*overflow: auto;*/
	overflow-x: auto;
}

.media-scroller {
	overflow-x: auto;
	align-items: stretch;
	display: grid;
	grid-auto-flow: column;
}

.media-scroller-lg {
	overflow-x: auto;
	align-items: stretch;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 24%;
}

.media-scroller-md {
	overflow-x: auto;
	align-items: stretch;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 46%;
}

.media-scroller-sm {
	overflow-x: auto;
	align-items: stretch;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: 75%;
}
.div-overflow{
	overflow:auto;
}

.dot-on-image {
	position: absolute;
	margin-top: 5%;
	margin-left: 5%;
	padding-left: 3%;
	padding-right: 3%;
	padding-top: 2%;
	background-color: rgb(255, 81, 0);
	border-radius: 50%;
}

.text-on-image {
	color: white;
}

.image-navbar-main {
	position:relative;
	margin-bottom : -100px;
}
.image-navbar-phone {
	position:relative;
	margin-bottom : -50px;
}

.input-icon {
	margin-top: 3px;
	position :sticky
	/*
	right: -15px;
	transition: right 0.2s;
	*/
}

.no-borders {
	border: none;
}

.cart-icon {
	margin-right: 0%;
}

.times-new-roman-text {
	font-family: "Times New Roman", normal, sans-serif;
	padding: 0.5rem 1rem;
	display: block;
}

.font-size-big {
	font-size : 22px;
}

.step-image {
	height: 125px;
	width: 125px;
	/*max-width: 100%;*/
	border-style: solid;
	border-width: 8px;
	border-color: rgba(180, 135, 27, 1);
	position:relative;
	border-radius: 50%;
	margin-left: 2rem;
	margin-right: -60px;
}

.step-image-sm {
	height: 75px;
	width: 75px;
	border-style: solid;
	border-width: 8px;
	border-color: rgba(180, 135, 27, 1);
	position: relative;
	border-radius: 50%;
	margin-left: 2rem;
	margin-right: -30px;
}

.know-beer-sm{
	position: relative;
	margin-right: 0px;
	height: 400px;
}

.bottle-home-md {
	position: relative;
	z-index: 2;
	margin-left: 30%;
	max-height: 800px;
}

.bottle-home-sm {
	position: relative;
	z-index: 2;
	height: 300px;
}


.bottle-line-md {
	position: absolute;
	margin-top: -100px;
	margin-left: -200px;
	border: 4px solid white;
	border-radius: 50% 50% 50% 50%;
	width: 100%;
	display: block;
	z-index: 1;
}

.bottle-line-sm {
	position: absolute;
	align-self: right;
	margin-top: -50px;
	margin-left: 40%;
	border: 2px solid white;
	border-radius: 50% 50% 50% 50%;
	width: 50%;
	display: block;
	z-index: 1;
}
	


/*
Links
*/
.white-link-to-golden {
	color:white;
}
.white-link-to-golden:hover {
	color: #B4871B;
}
.white-link {
	color:white;
}
.white-link:hover {
	color: white;
}
.golden-link-to-goldener {
	color: #B4871B;
}
.golden-link-to-goldener:hover {
	color:rgba(144, 108, 21, 1);;
}

@keyframes animate-something {
	0% {
		transform: scale(0, .025);
	}
	50% {
		transform: scale(1, .025);
	}
}

@media (prefers-reduced-motion: no-preference) {
	.step-image-animation {
	  animation: animate-something 1s 1;
	}
}

/* Apartado para Ordenes */
.order-text{
	width:100px;
	overflow:hidden;
	height:50px;
	line-height:50px;
}

/*
p {
	width: 200px;
	border: 1px solid;
	padding: 2px 5px;
  
	/* Both of the following are required for text-overflow */
	/*
	white-space: nowrap;
	overflow: hidden;
  }
  */
  
  .overflow-clip {
	text-overflow: clip;
  }
  
  .overflow-ellipsis {
	text-overflow: ellipsis;
  }
  
  .overflow-string {
	text-overflow: " [..]";
  }

  .ltr > p {
	direction: ltr;
  }
  
  .rtl > p {
	direction: rtl;
  }

.smart-link-button-div{
	border-color: #B4871B;
	border-style: dotted;
}
.smart-link-social-icon{
	background-color: white;
	border-radius: 50%;
}

.image-hoja-de-cata {
	max-width: 80%;
}