body {
    /* background-image: url("/assets/abobrinha1/abobrinha1-small.png");     */
    /* background-color: #195706 !important;  */
    /* background-image: 
        url("/assets/abobrinha1/abobrinha1-small.png"),   
        linear-gradient(to bottom, 
        #afdba0,    
        #bfeab1,    
            #87ba78,
            #afdba0
        ); */
  background-image: 
        url("/assets/abobrinha1/abobrinha1-small.png"),        
        linear-gradient(to bottom, 
            #387725,    
            #45972d,                               
            #45972d,
            #336c22,
            #254e19

        );    
    
        
}

html, body, body .container, body .container main {
    height: 100%;    
    max-height: 100%;
    /* overflow: hidden; */

}

.super-main {
    height: 100%;    
    width: 100%;
    overflow: auto;
    position: relative;
}

.opaque {
    opacity: 0.85;
}

.opaque-discrete {
    opacity: 0.9;
}

.no-opaque {
    opacity: 1 !important;
}

/* .dropdown {
    z-index: 203;
} */

.title {        
    position: fixed;
    left: 0;
    width: 100%;
    height: 80px;
    /* background-color:#254e19; */
    z-index: 100;    
    border-bottom: 1px rgb(175, 171, 171) dotted;  
 
}

.body {
    /* padding-top: calc(190px + 1rem); */
    padding-top: 90px;
}

.title div {
  float: left;
}

.title .icon {
    /* margin-right: 5px; */
    /* margin-top: 5px; */
    position: absolute;
    top: 20px;
    left: 15px;
}

.title .text > * {
    font-size: 30px;
    color: #254e19;
    font-family: "Lobster Two", sans-serif;
    font-weight: 400;
    font-style: normal;        
}

.title .text {
    background: none;
    height: 100%;
    position: absolute;
    left: 60px;
    top: 20px;
}

.body .categories {
    display: flex;             
    gap: 10px;                 
    overflow-x: auto;          
    padding: 10px;
    white-space: nowrap;    
}

.body .categories .category-item {
    width: 100px;
    margin: 15px;
    text-align: center;
    border-radius: 5px;
    background-color:  #5f872e;

    flex: 0 0 auto;      
    height: 50px; 
    display: flex;
    justify-content: center; 
}

.body .categories a {
    position: relative;
    color: white;
    margin-top: 15px;
}


.post-item .card-body h5 img {
    margin-right: 5px;
}

.post-item .card-body h5 a {
 color: #254e19; 

}

.card-title {
    border-bottom: 1px solid white;
    padding-bottom: 10px;
}


.underlined {
    text-decoration: underline;    
}

.tag {
    display: block;
    float: left;
    position: relative;
    border: 1px rgb(175, 171, 171) solid;
    padding: 5px;
    border-radius: 5px;    
    color: gray;     
    width: 100px;
    text-align: center;
}

.gradient {
    color: white !important;    
    background: linear-gradient(to right, #4a7a3c, #254e19, #2a6318, #3bad19,  #5f872e) !important;
}

.gradient1 {
    color: white !important;        
    background: linear-gradient(to right, #435f22, #5f872e, #688b3d, #6b8947, #55762f) !important;

}

.gradient2 {
    color: white !important;    
    background: linear-gradient(to right, rgb(192, 190, 190), rgb(102, 129, 92), rgb(71, 99, 61), rgb(73, 103, 62), rgb(41, 72, 29), rgb(17, 49, 5),  rgb(17, 49, 5), rgb(192, 190, 190)) !important;

}


.gradient3 {
    color: white !important;        
    background: linear-gradient(to right, #a1b688, #5f872e, #5f872e, #688b3d, #6b8947, #55762f) !important; 
}

.gradient-right-ligth {
    color: white !important;            
    background: linear-gradient(to right,                 
        #45972d,                               
        #45972d,                    
        #336c22,
        #254e19
    ) !important;     
}

.gradient-right-ligth2 {
    color: white !important;            
    background: linear-gradient(to right,                 
        #195a05,                               
        #278a09,                    
        #278a09,
        #254e19
    ) !important   
}

.small {
    font-size: 12px;
}

.right {
 float: right;
}

.left {
 float: left;
}

.ssmall {
   font-size: 10px;
}

.sumary, .metadata1, .metadata2 {
    float: left;
    position: relative;
    width: 100%;
}

.metadata1, .metadata2  {            
    min-height: 50px;
}

.metadata1 > div, .metadata2 > div {    
    float: left;
    margin-right: 10px;
    margin-top: 10px
}

.metadata1 > .date-info {
    float: right !important;
} 
 


@media (max-width: 767px) {
    .metadata1 > .date-info {        
        display: block;
    } 

    .metadata1 > div, .metadata2 > div {                    
        margin-top: 5px;
        margin-bottom: 5px;
    }    

    .btn-page {
        width: 100%;
    }
    
}