@media screen and (min-width:600px) {

body{
    margin: 0 auto;
    background-image: url(bgs.png);
    background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    
}

.logos{
  display: block;
  width: 50vw;
  margin-top: 12.5vw;
  margin-left: auto;
  margin-right: auto;
}

.container1 {
  border: 5px solid;
}

#btn1{
  position: relative;
  display: block;
  width: 50vw;
  margin-left: auto;
  margin-right: auto;
  transition: 0.3s;
}

#btn1:hover {
  width: 60vw;
}


#load{
  display: block;
  width: 8%;
  margin-left: auto;
  margin-right: auto;
}

#loading {
  
    position: fixed;
    left: 19%;
    right: 19%;
    display: none;
    animation:spin 1s infinite  ;
}



@keyframes spin { 
   
    to { 
        transform:rotate(180deg); 
        
    } 
  }

}




@media screen and (max-width:599px) {
body{
    margin: 0 auto;
    background-image: url(bgs2.png);
    background-position: center;
    background-size:cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    
}

.logos{
  display: block;
  width: 90vw;
  margin-top: 50vw;
  margin-left: auto;
  margin-right: auto;
}

.container1 {
  border: 5px solid;
}

#btn1{
  position: relative;
  display: block;
  width: 90vw;
  margin-left: auto;
  margin-right: auto;
  transition: 0.3s;
}

#btn1:hover {
  width: 100vw;
}


#load{
  display: block;
  width: 13%;
  margin-left: auto;
  margin-right: auto;
}

#loading {
  
    position: fixed;
    left: 19%;
    right: 19%;
    display: none;
    animation:spin 1s infinite  ;
}



@keyframes spin { 
   
    to { 
        transform:rotate(180deg); 
        
    } 
  }

}
