/*
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
General
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/

html {
    position: relative;
    min-height: 100%;
}

body{
  padding-bottom: 150px;
  background-color: #f2f2f2 !important;
}

@media (max-width: 574px) {
  body{
  padding-bottom: 220px;
  }
}


/*
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Header
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/

/*header{
	background-color: #ffffb3 !important;
}*/

header{ 
	display:block;
}

nav{
     font-size: 1.2rem;
}

#nav1{
	background-color: white !important;
}

#nav2{
	background-color: #5d0049 !important;
}

.navbar2th{
  background-color: #80808070; 
  border-radius: 2px;
 }

 .navbarBeMute{

  border-radius: 2px;
 }

.navbar {
    padding: 0.2rem 1rem !important;
}

.navbar-light .navbar-nav .active>.nav-link{
    color: white !important;
    font-weight: bold;
}

.nav-link {
	color: white !important;
}

@media screen and (min-width: 1501px) {
  .textSize{
    font-size: 1.3rem;
  }
}

@media screen and (min-width: 1201px) and (max-width: 1500px) {
  .textSize{
    font-size: 1.2rem;
  }
}

@media screen and (max-width: 1200px) {
  .textSize{
    font-size: 1.1rem;
  }
}


/*Index*/
.imgIndex{
	width:100%;
}

@media screen and (min-width: 1800px) {
  .imgIndex{
	width:80%;
	}
}


/*--------search-bar-----------*/

.btn-outline-success {
    color: black !important;
    background-color: transparent;
    background-image: none;
    border-color: black !important;
}

/*-----------------------------*/


.colorHeader{
  width:100%;  
  background-color: #c6c5c3ad;
}

.logoRed{
  width: 32px;
}

.spanLogo{
	position: absolute;
	right:20px;
	top:15px;
  }

@media (max-width: 992px) {
  .logoRed{
    width: 25px;
  } 

  #nav a {
	text-align:left !important;
	}
}

#nav {
width:auto;
margin:0 auto;
list-style:none;
}

#nav a {
display:block;
text-align:center;
text-decoration:none; 
}



.LogoBeMuteTempleate {
    display: block;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    width:135px;
}

@media screen and (max-width: 750px) {
	.LogoBeMuteTempleate {
	    width:110px;
	}	
}

/*
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
Footer
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
*/

.colorFT{
  background-color: white;
  border-top: 7px solid #5d0049;
}

.container{
  padding-bottom: 0px !important;
  padding-top: 2px !important;
  max-width: 90% !important;
}

@media screen and (min-width: 1401px) {
	.containerBig{
		max-width: 70% !important;
	}

	.sizeFontFooter{
    	font-size: 1.2rem !important;
	}
}

@media screen and (min-width: 1000px) and  (max-width: 1400px){
	.sizeFontFooter{
    	font-size: 1.1rem !important;
	}
}

.containerFooter{
    max-width:100% !important;
}

.sizeFontFooter{
    font-size: 1.0rem;
}

.footerCSS {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.textWhite{
  color: black;
}

/********************* Shopping Demo-2 **********************/

.tituloProducto{
		color: black !important;
		font-weight: bold;
}

.demo{
	padding:45px 0
}

.product-grid2{
	font-family:'Open Sans',sans-serif;
	position:relative;
}

.product-grid2 .product-image2{
	overflow:hidden;position:relative
}

.product-grid2 .product-image2 a{
	display:block
}

.product-grid2 .product-image2 img{
	width:100%;height:auto
}

.product-image2 .pic-1{
	opacity:1;transition:all .5s
}

.product-image2{
	border-radius: 15px;
}

.product-grid2:hover .product-image2 .pic-1{
	opacity:0
}

.product-image2 .pic-2{
	width:100%;
	height:100%;
	opacity:0;
	position:absolute;
	top:0;
	left:0;
	transition:all .5s
}

.product-grid2:hover .product-image2 .pic-2{
	opacity:1
}

.product-grid2 .product-new-label{
	background-color:#3498db;
	color:#fff;
	font-size:17px;
	padding:5px 10px;
	position:absolute;
	right:0;
	top:0;
	transition:all .3s
}
.product-grid2:hover .product-new-label{
	opacity:0
}
.product-grid2 .product-content{
	padding:20px 10px;
	text-align:center
}
.product-grid2 .title{
	font-size:18px;
	margin:0 0 7px;
	font-weight: bold;
	color:#5d0049 !important;
}

.product-grid2 .title2{
	font-size:14px;
	margin:0 0 7px;
	font-weight: bold;
}

.title3{
	font-size:18px;
	margin:0 0 7px;
	font-weight: bold;
	color:#5d0049 !important;
}

.product-grid2 .price{
	color:#303030;
	font-size:15px
}

.product-grid2 .masProductos{
	position: absolute;
	width: 30px;
	top:10px;
	right:10px;
	z-index:1;
}

#rowQuienesSomos{
	background-image:url(/Ruben/public/img/bellezaNat.jpg);
	background-repeat: no-repeat;
	background-size: cover;
	height: 100%;
}

/*Paginacion*/

.pageActive{
	background-color:#5d0049 !important;
	color:white !important;
}

.pageInactive{
	color:black !important;
}

@media screen and (max-width:990px){
	.product-grid2{
		margin-bottom:30px
	}
}

.zoom {
  transition: transform .2s;
}

.zoom:hover {
  transform: scale(1.1);
}

.dropdown-item.active, .dropdown-item:active {
    background-color: #5d0049 !important;
}

/*Quienes Somos*/
.imgQuienesSomos{
	width:80%; 
	border: 4px solid white;
}

@media screen and (max-width:1000px){
	.imgQuienesSomos{
		width:50%; 
		border: 4px solid white;
	}
}

@media screen and (min-width:1500px){
	.imgQuienesSomos{
		width:60%; 
		border: 4px solid white;
	}
}

/*Contacto*/
.publicidadExpress{
	width:200px !important; 
	height: 200px !important; 
	height:auto; 
	border-radius: 15px; 
	border: 2px solid #5d0049;
}


@media screen and (min-width:1500px){
	.publicidadExpress{
	width: 250px !important; 
	height: 250px !important; 
	}
}

@media screen and (min-width:1800px){
	.publicidadExpress{
	width: 300px !important; 
	height: 300px !important; 
	}

	.widthContacto{
	max-width: 80% !important; 
	margin-left: 10% !important;
	}	
}