/* Created on 4-Apr-2022 2:08:54 PM */

#header{
  width:100%;
  margin:0px auto;
  background:white;
}

img{
  max-width:100%;
  }

body{
  background-image: url("images/valvebody3.jpg");
  max-width:100%
  max-height:100%
}

#col1 {
  width:25%;
  height:500px;
  float:left;
}
    
#col2 {
  width:25%;
  float:left;
}
  
#col3 {
  width:25%;
  float:left;
}
  
#col4 {
  width:25%;
  float:left;
}

#dr_col1 {
  width:20%;
  height:500px;
  float:left;
}
    
#dr_col2 {
  width:20%;
  float:left;
}
  
#dr_col3 {
  width:20%;
  float:left;
}
  
#dr_col4 {
  width:20%;
  float:left;
}

#dr_col5 {
  width:20%;
  float:left;
}

#tr_col1 {
  width:33%;
  height:500px;
  float:left;
}
    
#tr_col2 {
  width:33%;
  float:left;
}
  
#tr_col3 {
  width:33%;
  float:left;
}

#df_col1 {
  width:100%;
  height:500px;
  float:left;
}
  
ul{
  display:table;
  margin: 0 auto;
  text-align: left;
  }
  
#footer{
  position:fixed;
  width:100%;
  background:white;
  bottom:0px;
}
          
@media screen and (max-width:1120px) {
    #col1 {
    width:33%;
    }
    #col2 {
    width:33%;
    }
    #col3 {
    width:33%;
    }
    #col4 {
    width:100%;
    }
  }

@media screen and (max-width:1180px) {
    #dr_col1 {
    width:25%;
    }
    #dr_col2 {
    width:25%;
    }
    #dr_col3 {
    width:25%;
    }
    #dr_col4 {
    width:25%;
    }
    #dr_col5 {
    width:100%;
    }
  }

@media screen and (max-width:955px) {
    #dr_col1 {
    width:33%;
    }
    #dr_col2 {
    width:33%;
    }
    #dr_col3 {
    width:33%;
    }
    #dr_col4 {
    width:100%;
    }
    #dr_col5 {
    width:100%;
    }
  }

@media screen and (max-width:900px) {
    #tr_col1 {
    width:50%;
    }
    #tr_col2 {
    width:50%;
    }
    #tr_col3 {
    width:100%;
    }
  }
      
@media screen and (max-width:850px) {
    #col1 {
    width:50%;
    }
    #col2 {
    width:50%;
    }
    #col3 {
    width:50%;
    }
    #col4 {
    width:50%;
    }
  }

@media screen and (max-width:730px) {
    #dr_col1 {
    width:50%;
    }
    #dr_col2 {
    width:50%;
    }
    #dr_col3 {
    width:100%;
    }
    #dr_col4 {
    width:100%;
    }
    #dr_col5 {
    width:100%;
    }
  }
    
@media screen and (max-width:600px) {
    #col1 {
    width:100%;
    }
    #col2 {
    width:100%;
    }
    #col3 {
    width:100%;
    }
    #col4 {
    width:100%;
    }
    #tr_col1 {
    width:100%;
    }
    #tr_col2 {
    width:100%;
    }
    #tr_col3 {
    width:100%;
    }
  }

@media screen and (max-width:500px) {
    #dr_col1 {
    width:100%;
    }
    #dr_col2 {
    width:100%;
    }
    #dr_col3 {
    width:100%;
    }
    #dr_col4 {
    width:100%;
    }
    #dr_col5 {
    width:100%;
    }
  }
 
@media screen and (max-width:360px) {
  body{
    width:360px}
  }