.responsive {
  max-width: 100%;
   width: 100%;
  height: auto;
}

.res-2 {
    width: 100%;
    max-width: 300px;
     min-width: 200px;
     height: auto;
    
}


.res-2-1 {
    width: 100%;
    max-width: 150px;
     min-width: 80px;
     height: auto;
    
}

.res-2-2 {
    width: 100%;
    max-width: 200px;
     min-width: 100px;
      max-height: 200px;
        min-height: 150px;
     height: auto;
    
}


.res-1 {
     width: 100%;
    max-width: 30px;
     min-width: 30px;
     height: auto;
    
}



.res-1-1 {
     width: 100%;
    max-width: 27px;
     min-width: 27px;
     height: auto;
    
}


.res-1-2 {
     width: 100%;
    max-width: 200px;
     min-width: 27px;
     height: auto;
    
}

.res-3 {
    width: 100%;
    max-width: 300px;
     min-width: 200px; 
     height: auto;
    
}




.res-4 {
    width: 100%;
    max-width: 200px;
      min-width: 100px;
     height: auto;
    
}



.res-5 {
    width: 100%;
    max-width: 300px;
     min-width: 300px; 
     height: auto;
    
}


.res-6 {
    width: 100%;
    max-width: 450px;
    
  min-width: 300px; 
     height: auto;
    
}


main {
  display: flex;
  justify-content: center;
}



#respTable1{
  width:100%;
	max-width:600px;

  
}


#respTable2{
  width:90%;
	max-width:300px;
	margin:20px auto;
  
}


#respTable3{
  width:100%;
	max-width:800px
		min-width:500px;
	margin:20px auto;
  
}





#respTable4{
  width:100%;
	max-width:300px;
	height: auto;
  
}


#respTable5{
  width:100%;
	max-width:300px;
	height: auto;
  
}


#respTable6{
  width:100%;
	max-width:800px;
	min-width:500px;
	height: auto;
  
}


table {
  width:90%;
	max-width:1200px;
	margin:20px auto;
  
  
}



tr:nth-child(odd) {
  background-color: white;
}

th {
  background-color: white;
  color: white;
}

th,
td {
  text-align: left;
  padding: 0.5em 1em;
  
}

td::before {
  display: none;
  
 
}






@media screen and (max-width: 800px) {
    
#respTable3 {
  max-width: 100%;
    width: 100%; 
 }



    
 table {
   border: 0;
   width: 100%;
   max-width: 800;

   box-shadow: none;
 
   
   
 }
 
 


 thead {
   position: absolute;
   opacity: 0;
 }
  
 tbody {
 
   min-width: 19em;
   max-width: 25em;
 }

 tr {
   border-top: 2px solid #3c3c3b;
   border-bottom: 2px solid #3c3c3b;
   display: block;
   margin-bottom: 1em;
   
   }
 

 td {
   border-bottom: 1px solid #3c3c3b;
   display: block;
 
 }
 


 td::before {
   
   font-weight: bold;
   margin-right: auto;
   padding-right: 1em;
   
     
 }

 td:last-child {
   border-bottom: 0;
    
 }
}