/* CSS Document */

.active
{
	background-color:#9C7A52 !important;
	color:white !important;
}
.nav-item a
{
	color:white;
}

.color_titulo
{
	color: #782606 !important;
}
.text-primary
{
	color: #491707 !important;
	font-style:inherit !important;	
}
.marco2 {
    background: #78321C;
    width: 100%;
    padding: 10px 0;
    margin-bottom: 20px;
    color: #fff;
    font-size: 30px;
    text-align: center;
	border-width: 9px 9px 9px 9px;
	border-style: solid dashed dashed dashed;
    border: double 10px #fff;
    border-radius: 4px;
}
.marco {
	color: #fff;
	background: #78321C;
    padding: 5px;
    border-width: 8px 8px 8px 8px;
    border-style: solid solid solid solid;
    border-color: #491707 #491707 #491707 #491707;
    font-style: normal;
    margin-bottom: 5px;
    display: block;
    overflow: hidden;
}
.page-heading {
    font: 700 15px/26px "PT Sans", sans-serif;
    text-transform: uppercase;
    position: relative;
    padding: 15px 0;
    text-align: center;
    color: #7cc2cb;
    margin: 0 0 10px;
    z-index: 0;
}

.form-control {
  
    border-radius: 15px;
}

.texto-chocolate
{
	z-index: -100;
    position: absolute;
	top:1px;
	left:1px;
    color: #fff;
	overflow: auto;
	/*font-size: 5px;*/
}


  
  .fondo-blanco
	{
		background-image: url('../images/principal/fondo-blanco.jpg') !important;
		background-repeat: no-repeat !important;;
		background-attachment: fixed !important;;
	} 


.producto:hover {
    -webkit-transform:scale(1.1);
	-webkit-box-shadow:0px 0px 10px #C0A99E;
}
.producto{
	-webkit-transition-duration: 0.5s;
}

/* 
Extra small devices (portrait phones, less than 544px) 
No media query since this is the default in Bootstrap because it is "mobile first"
*/
h1 {font-size:1rem;} /*1rem = 16px*/
/*
####################################################
M E D I A  Q U E R I E S
####################################################
*/

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Bootstrap 4 breakpoints
*/
/* Small devices (landscape phones, 544px and up) */
@media (min-width: 544px) {  
  h1 {font-size:1.0rem;} /*1rem = 16px*/
}

/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
@media (min-width: 768px) {  
  h1 {font-size:1.0rem;} /*1rem = 16px*/
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
  h1 {font-size:2.5rem;} /*1rem = 16px*/
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {  
  h1 {font-size:3rem;} /*1rem = 16px*/ 
  
}

/*
::::::::::::::::::::::::::::::::::::::::::::::::::::
Custom media queries
*/

/* Set width to make card deck cards 100% width */
@media (min-width: 950px) and (max-width:1100px) { 
  h1 {font-size:2.75rem;color:red;} 
}