*{
    box-sizing: border-box;
}
body {
    background: linear-gradient(to bottom, rgba(0,0,0,0.7), rgba(0,0,0,0.1)), url("image/background.jpg");
    /* background-image: url("image/background.jpg"); */
}
#wrapper{
    width: 960px;
    margin: auto;
}
#header{
    /* background: burlywood ;
    color: #fff; */
    background: linear-gradient(to right, #F3F9A7, #CAC531); 
    display: flex; 
}
#header h2{
    flex-basis: 80%; 
    text-align: center; 
    color: rgb(89, 25, 167);
    text-shadow: 2px 2px 8px #1d54a8;
    margin: auto;  
}
 
#logo{
    width: 120px;
    height: 120px; 
    padding: 2px;
    flex-basis: 0%; 
    margin-right: 3%;
} 
#main-content{
    display: flex;
    height: 500px;
}
#content h2{
    text-align: center;
}
#content{
    flex-basis: 70%;
    background-image: url("image/farm.jpg");
}
#cambien{
    display: flex;
    height: 250px;
    text-align: center;
    margin-top: -10px;
    color: red;
}
#nd{
    flex-basis: 33%;
    border-style: inset;
    width: 150px;
    height: 200px;
}
img#nd1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
h2#nhietdo{
    margin-top: -15%;
    margin-bottom: -10%;
}
#da{
    flex-basis: 33%;
    border-style: inset;
    width: 100px;
    height: 200px;
}
img#da1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
h2#doam{
    margin-top: -15%;
    margin-bottom: -10%;
}
#ph{
    flex-basis: 33%;
    border-style: inset;
    width: 100px;
    height: 200px;
}
img#ph1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
h2#doph{
    margin-top: -15%;
    margin-bottom: -10%;
}
#thietbi{
    display: flex;
    height: 250px;
    text-align: center;
    margin-top: -30px;
    color: black;
}
#bom{
    flex-basis: 33%;
    border-style: inset;
    width: 100px;
    height: 200px;
}
img#bom1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
#bom h3{
    margin-top: -30px;
}
#bom h2{
    margin-top: -20px;
}
#den{
    flex-basis: 33%;
    border-style: inset;
    width: 100px;
    height: 200px;
}
img#den1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
#den h3{
    margin-top: -30px;
}
#den h2{
    margin-top: -20px;
}
#loa{
    flex-basis: 33%;
    border-style: inset;
    width: 100px;
    height: 200px;
}
img#loa1
{
    margin:5px;
    width: 100px;
    height: 100px;
}
#loa h3{
    margin-top: -30px;
}
#loa h2{
    margin-top: -20px;
}
#slidebar{
    flex-basis: 40%;
    border-style: inset;
}
#slidebar h2{
    border: double;
    text-align: center;
    margin-top: -0.2%;
    background-color: chartreuse;
}
table, tr, th {
  border: 1px solid black;
  margin-left: 10%;
  margin-top: -5%;
  background-color: pink;
}
#footer{
    background: rgb(99, 151, 64);
    background: linear-gradient(to right, #b7c9ad, #57b4bb); 
    padding: auto;
    display: flex; 
}
#footer #Diachi{
    flex-basis: 70%;  
}
/* #Diachi ul{
    list-style-type: none;  
} */
#footer #Lienhe{
    flex-basis: 30%; 
}

.hehe:hover {
    transition-duration: 0.5s;
    background-color: #1588df;
    color: White;
  }
.hehe1:hover {
    transition-duration: 0.5s;
    background-color: #33df15;
    color: White;
}

