body {
    background-color:rgba(237, 214, 168, 0.59);
    color:rgb(51, 51, 51);
    font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size:14px;
    line-height:20px;
    text-size-adjust:100%;
    -webkit-tap-highlight-color:rgba(0, 0, 0, 0);
}

.main-content {
    width:320px;
}
/* Colors */

.bg-light{ 
    background-color: rgba(237, 214, 168, 0.59);

}

.border-tim {
    border-color: #5e005e;
}

.border-ken {
    border-color: black;
}

.story {
    font: normal bolder 14px/20px 'Montaga', Arial, serif;
}

.about {
    font: normal bolder 14px/20px 'Montaga', Arial, serif;
}

.shop {
    font: normal bolder 14px/20px 'Montaga', Arial, serif;
}


/* Custom elements */
/* Main width breakpoints */


#trough-image {
    width: 320px;
    height: 160px;
}

.ruler {
    border-top: 3px solid black;
}

.border-10 {	
    border-width: 10px; 
}

.h-50 {
    height: 13rem;
}

.w-84 {
    width: 19rem;
}

.h-84 {
    height: 19rem;
}

.w-88 {
    width: 20rem;
}

.h-88 {
    height: 20rem;
}

.text-xxs {
    font-size: .5rem;
}

/* Small (sm) */
@media (min-width: 640px) { 
    .sm\:w{
        width: 320px;
    }
    .sm\:w-84 {
        width: 19rem;
    }
    
    .sm\:h-84 {
        height: 19rem;
    }
    
    .sm\:w-88 {
        width: 20rem;
    }
    
    .sm\:h-88 {
        height: 20rem;
    }


    .nav-svg{
        width: 352.6px;
        height: 132.45px;
    }
    #trough-image {
        width: 320px;
        height: 160px;
    }
 }

/* Medium (md) */
@media (min-width: 768px) { 
    .md\:w{
        width: 768px;
    }
    .md\:w-84 {
        width: 19rem;
    }
    
    .md\:h-84 {
        height: 19rem;
    }
    
    .md\:w-88 {
        width: 20rem;
    }
    
    .md\:h-88 {
        height: 20rem;
    }


    .nav-svg{
        width: 394px;
        height: 148px;
    }
    #trough-image {
        width: 376px;
        height: 188px;
    }
 }

/* Large (lg) */
@media (min-width: 1024px) { 
    .lg\:w{
        width: 768px;
    }
    .lg\:w-84 {
        width: 19rem;
    }
    
    .lg\:h-84 {
        height: 19rem;
    }
    
    .lg\:w-88 {
        width: 20rem;
    }
    
    .lg\:h-88 {
        height: 20rem;
    }


    .nav-svg{
        width: 394px;
        height: 148px;
    }
    #trough-image {
        width: 376px;
        height: 188px;
    }
 }

/* Extra Large (xl) */
@media (min-width: 1280px) { 
    .xl\:w{
        width: 1200px;
    }
    .xl\:w-84 {
        width: 19rem;
    }
    
    .xl\:h-84 {
        height: 19rem;
    }
    
    .xl\:w-88 {
        width: 20rem;
    }
    
    .xl\:h-88 {
        height: 20rem;
    }

    #trough-image {
        width: 500px;
        height: 250px;
    }
 }