@charset "utf-8";

body {
    margin: 0;
    padding: 0;
	font-family: 'Noto Sans', sans-serif;
}

.responsive-bar
{
display: none;
}

nav {
width: 100%;
height: 100px;
position: fixed;
top: 0;
left: 0;
padding: 10px 100px;
box-sizing: border-box;
transition: .5s;
z-index: 999;

}

.catalog
{
    font-size: 1rem;
    padding: 1rem 2rem;
    color: #fff;
    text-decoration: none;
    background: #0e7248;
}

nav.white
{
    background: rgb(255, 255, 255);
    box-shadow: 0px 1px 1px rgba(128, 128, 128, 0.774);
}

nav .logo {
    float: left;
}

nav .logo img {
    height: 80px;
    transition: .5s;
}

nav ul {
float: right;
margin-top: 8px;
padding: 0;
display: flex;

}

nav ul li {
list-style: none;
}


nav ul li a {
    line-height: 80px;
    color: #000;
    padding: 5px 20px;
    text-decoration: none;
    text-transform: uppercase;
    transition: .5s;

    }


    nav ul li a.active,
    nav ul li a:hover {
        color: #fff;
        background: rgb(204, 39, 27);
    
    }


@media (max-width: 1066px)
{


    .responsive-bar
    {
        display: block;
        width: 100%;
        height: 60px;
        background: white;
        position: fixed;
        top: 0;
        left: 0;
        padding: 5px 20px;
        box-sizing: border-box;
        z-index: 1000;

    }

    .responsive-bar .logo img
        {
            float: left;
            height: 50px;
        }

        .responsive-bar .menu img
{
       float: right;
      padding-top: 12px;
      cursor: pointer;

        }

        nav,
        nav.white
{
    background: #262626;
    height: 60px;
    padding: 0;
}

nav .logo
{
display: none;

}

nav ul
{

    position: absolute;
    width: 100%;
    top: 40px;
    background: white;
    float: none;
    display: none;
    left: 0;

}


nav ul.active
{

    display: block;
}

nav ul li
{
width: 100%;

}

nav ul li a
{
display: block;
padding: 0;
width: 100%;
text-align: center;
color: rgb(0, 0, 0);
}

}


.bioedenchim
{
    position: relative;
    width: 100%;
    height: 480px;
    top: 0;
    left: 0;  
    background-size: cover;
    background-image: url("../images/coloradobug.jpg");
    overflow: hidden;
}

.text-bioedenchim
{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
text-align: center;
z-index: 3;

}

.text-bioedenchim h3 {
    font-size: 3em;
    margin: 10px 0;
    color: #fff;
    text-transform: uppercase;
    text-shadow: 0 2px 2px rgb(10, 36, 3);
	font-family: "Times New Roman", Times, serif;
}

.text-bioedenchim p
{
    font-size: 1.4em;
    margin: 20px 0;
    color: #fff;
    text-transform: uppercase;
    padding-bottom: 36px;
    text-shadow: 0 1px 1px rgb(10, 36, 3);

}




@media (max-width: 840px)
{



.text-bioedenchim h3 {
    font-size: 2em;
    margin: 10px 0;
    color: #fff;
    text-transform: uppercase;
    text-shadow: 0 2px 2px rgb(10, 36, 3);
}

.text-bioedenchim p
{
    font-size: 1.2em;
    margin: 20px 0;
    color: #fff;
    text-transform: uppercase;
    padding-bottom: 36px;
    text-shadow: 0 1px 1px rgb(10, 36, 3);

}
}





/* Column container */
.row {  
    display: flex;

}


.side {
    flex: 16%;
    background-color: #f1f1f1;
    padding: 20px;
}

.side a
{
	text-decoration: none;
	color: black;
}

.side h3
{
    font-size: 19px;
    font-weight: bold;
	
}

.main {
    flex: 84%;
    background-color: white;
    padding: 20px;
    flex-flow: row wrap;
    display: flex;
	text-align: justify;
}


.seminte {
    width: 100%;
    padding: 20px;
    background: url(../images/semintemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.seminte p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.seminte a
{
    text-decoration: none;
    color: white;
}

.ingrasaminte {
    width: 100%;
    padding: 20px;
    background: url(../images/ingrasamintemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ingrasaminte p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.ingrasaminte a
{
    text-decoration: none;
    color: white;
}


.erbicide {
    width: 100%;
    padding: 20px;
	background: url(../images/erbicidemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.erbicide p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.erbicide a
{
    text-decoration: none;
    color: white;
}


.fungicide {
    width: 100%;
    padding: 20px;
    background: url(../images/fungicidemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.fungicide p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.fungicide a
{
    text-decoration: none;
    color: white;
}


.insecticide
{
    width: 100%;
    padding: 20px;
    background-color: #0e7248;
    background-repeat: no-repeat;
    background-size: cover;
}

.insecticide p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.insecticide a
{
    text-decoration: none;
    color: white;
}

.raticide {
    width: 100%;
    padding: 20px;
    background: url(../images/raticidemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.raticide p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.raticide a
{
    text-decoration: none;
    color: white;
}



.tratamente {
    width: 100%;
    padding: 20px;
    background: url(../images/tratamentemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.tratamente p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.tratamente a
{
    text-decoration: none;
    color: white;
}

.ustensile {
    width: 100%;
    padding: 20px;
    background: url(../images/ustensilemag.png);
    background-repeat: no-repeat;
    background-size: cover;
}

.ustensile p
{
    color: white;
    font-size: 20px;
    font-weight: bold;
}

.ustensile a
{
    text-decoration: none;
    color: white;
}


@media screen and (max-width: 700px) {
    .row {   
        flex-direction: column;

    }
}





























.product
{
position: relative;
width: 200px;
height: 356px;
box-shadow: 2px 3px 5px rgba(0,0,0,.25);
border-radius: 5px;
background-color: #0e7248;
overflow: hidden;
margin: 20px;

}

.product .imgbox
{
    height: 100%;
    box-sizing: border-box;
}

.product .imgbox img
{
display: block;
width: 100%;
}


.details
{
    position: absolute;
    bottom: -50px;
    background: rgb(255, 255, 255);
    padding: 10px;
    box-sizing: border-box;
    box-shadow: 0 0 0 rgba(0,0,0,0);
    transition: .5s;
    width: 100%;
}

.product:hover .details
{
bottom: 0;
box-shadow: 0 -5px 15px rgba(0,0,0,.25)
}

.details h2
{
    margin: 0;
    padding: 0;
    font-size: 16px;
    width: 100%;
}

.details h2 span
{
font-size: 18px;
color: #000;
font-weight: bold;
color:  rgb(204, 39, 27);

}

.details .price
{
    position: absolute;
    top: 10px;
    right: 20px;
    font-weight: bold;
    font-size: 18px;
}


.details a
{
    display: block;
    padding: 5px;
    color: #fff;
    margin: 15px 0 0;
    background: #0e7248;
    text-align: center;
    text-decoration: none;
    transition: .3s;
    cursor: pointer;
}

.details a:hover
{
background-color: #298860;
}


.footer
{
    position: relative;
    top: 0;
    left: 0;
    height: 100px;
    width: 100%;
    background-color: #0a3141;   
}



.footer1 p {
    overflow: hidden;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    color: #fff;
	text-align: center;

}





















	


