.loginlogo{
display: block;
margin-left: auto;
margin-right: auto;
text-align:center;
width:345px;
height:165px;
background: url('https://www.iviva.com/wp-content/uploads/2023/07/iviva-logo-1.svg') center center no-repeat;
}

.loginbox{
color: white;
margin:0 auto;
max-width:500px; 
box-shadow: 0px 0px 0px #BEE2F9;
padding: 25px 25px;
position: relative;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
background: #000000;
//position: fixed;
//bottom: 0;
//right: 0;
opacity: 0.7;
}
/*.loginbox{
border: 1px solid #F00;
}*/
/* Smartphones (portrait) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
/* Styles */
.loginbox{
      width: 100%;
      #padding-bottom: 100%;
      margin-left:auto;
      margin-right:auto;
   }
}

/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
.loginbox{
      #width: 500px;
      width: auto; 
      margin: 10px;
      #padding-bottom: 100%;
      margin-left:auto;
      margin-right:auto;
   }
}

/* iPads (landscape) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape) {
/* Styles */
.loginbox{
      #width: 500px;
      width: auto; margin: 10px;
     #padding-bottom: 25%;
    margin-left:auto;
    margin-right:auto;
   }
}

/* iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) {
/* Styles */
.loginbox{
      #width: 500px;
      width: auto; margin: 10px;
     #padding-bottom: 25%;
      margin-left:auto;
      margin-right:auto;
   }
}

/* Desktops and laptops ----------- */
@media only screen 
and (min-width : 1224px) {
/* Styles */
.loginbox{
     #width: 500px;
      width: auto; margin: 10px;
     #padding-bottom: 25%;
     margin-left:auto;
      margin-right:auto;
   }
}

/* Large screens ----------- */
@media only screen 
and (min-width : 1824px) {
/* Styles */
.loginbox{
      #width: 500px;
      width: auto;
     #padding-bottom: 25%;
      margin-left:auto;
      margin-right:auto;
   }
}
#loginid {
    background-color: rgba(193, 227, 230, 0.5);
}
#password {
    background-color: rgba(193, 227, 230, 0.5);
}