/** Section 1 - General **/
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700|Covered+By+Your+Grace|Roboto:400,300,700);

.montserrat {font-family: 'Montserrat', sans-serif;}
.roboto     {font-family: 'Roboto', sans-serif;}
.covered    {font-family: 'Covered By Your Grace', cursive;}
.times      {font-family: 'Times New Roman', serif;}
.arial      {font-family: Arial, Helvetica, sans-serif;}
.helvetica-neue {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.bold       {font-weight: bold;}
.italic     {font-style : italic;}
.light      {font-weight: 200;}

h1, h2, h3, h4, p, a, span {text-shadow:white 1px 1px 1px;}

a, a:link, a:hover, a:visited {color:inherit;}

a.button        {display: block; padding: 10px 25px; width: 200px; font-size: 20px; text-shadow: none;}
a.button.round  {border-radius: 30px;}
a.button.orange {background-color: #f78805; color:white;}
a.button.green  {background-color: #789a1b; color:white;}
a.button.comprar{text-align: center; margin:0 auto; width:150px; padding:5px 10px; font-size: 16px;}

.fs18       {font-size: 18px;}
.fs20       {font-size: 20px;}
.fs24       {font-size: 24px;}
.fs45       {font-size: 45px;}
.fs47       {font-size: 47px;}
.fs65       {font-size: 65px;}

.mt0        {margin-top:0px;}
.mt10       {margin-top:10px;}
.mt25       {margin-top:25px;}
.mt50       {margin-top:50px;}
.mt100      {margin-top:100px;}
.mt200      {margin-top:200px;}

.brown      {color:#4c463f;}

.full-width {width:100%;}

.debug      {border:1px solid red;}


body            {background: url('../images/background.gif'); background-repeat-x: no-repeat;
                    background-size: cover; background-position: top center;}
#top-logo       {margin-top:35px;}
#menu #navbar ul{display: block; float: none; margin: 0 auto; max-width:765px;
                    text-transform: uppercase; color:#4c463f; font-size: 18px; letter-spacing: 2px;  }

.nav>li.active>a {border-bottom:3px solid #708627;}
.nav>li>a:focus, .nav>li>a:hover {border-bottom:3px solid #708627;}

#info           {margin-top: 60px;}
#info h1        {font-weight: normal; font-size: 80px; color:#4c463f;}

.vaso           {margin-top:100px;}



#colores        {margin-top:100px;}
#colores h2     {color:#4c463f;}
.color          {margin-left:50px; margin-top:10px;}
.color img      {display: inline-block;}
.color          {color:#4c463f; font-size: 23px;}
.nombre-color   {margin-top:28px;}

#contacto textarea {height:100px;}
#contacto .button {background-color:#f78805; color:white; border-radius: 30px; border:none; padding: 10px 25px;}
#contacto input[type='text'],
#contacto input[type='email'],
#contacto textarea  {padding:5px; border:3px solid #e4e4e4;}

#info-contacto  {border-top:2px solid #e4e4e4; border-bottom:1px solid #e4e4e4; padding:30px 0 50px 0;}
#info-contacto .gray {color:#b1b1b1;}
#info-contacto .social-thumb {max-width:58px; margin-right:10px;}

#footer ul      {list-style: none; padding-left: 0;}
#footer ul.gray {color:#b1b1b1;}
#footer ul li   {}

.glucosa        {color:#789a1b !important;}
#tiendaframe 	{height:1400px;}

#tamanos img        {z-index:1;}
#tamanos img.hover  {position:absolute; z-index:0;}

@media screen and (max-width: 768px) {
    #info-contacto h2 {text-align: center;}
    #info-contacto .social-thumb {margin:auto; display: block;}

    #menu {display:none;}
    #top-logo {display:none;}
    #info{margin-top:none;}
    #info h1 {text-align:center;}
    #info p {text-align:center;}
    #info a {text-align:center; margin:auto;}

    #footer img {display: block; margin:auto;}
    #footer ul  {text-align: center;}
}