@import url("./style/clearDefaults.css");
@import url("./style/fontsRentalmin.css");

*{
    margin: 0;
    padding: 0;
}
html {
    overflow: hidden;
    height: 100%;
  }
  
  body {
    height: 100%;
    overflow: auto;
  }
.background{
    background: rgb(255,96,0);
    background: linear-gradient(157deg, rgba(255,96,0,1) 0%, rgba(254,100,2,1) 18%, rgba(251,113,8,1) 41%, rgba(248,135,18,1) 62%, rgba(242,166,32,1) 84%, rgba(238,195,45,1) 100%);
}
.loginContainer{
    width: 16.61vw;
    height: 41.10vh;
    position: relative;
    top: 3.10vh;
    left: 2.03vw;
}
.loginContainer > h1{
    margin: 1.53vh 0 0 0;
    text-align: center;
}
.loginContainer > h2{
    margin: 5.23vh 0 0 0;
}
.loginContainer > h3{
    margin: 3.50vh 0 0 0;
}
.loginContainer > input[type=text]{
    margin: 0.40vh 0 0 0;
    border: none;
    width: 100%;
    position: relative;
    top: 0.93vh;
    text-indent: 1.02vh;
}
.loginContainer > input[type=password]{
    margin: 0.40vh 0 0 0;
    border: none;
    width: 100%;
    position: relative;
    top: 0.93vh;
    text-indent: 1.02vh;
}
.loginContainer > input[type=submit]{
    width: 8.28vw;
    height: 4.80vh;
    margin: 3.93vh 0 0 0;
    text-align: center;
    background-color: #FF6000;
    border-radius: 24px;
    position: relative;
    left: 4.17vw;
    border: none;
}
input:focus, textarea:focus, select:focus{
    outline: none;
}
.loginContainer > .divider{
    margin: 0 0 0 0;
    border-bottom: 1px solid #FF6000;
}
.whitePanel{
    width: 20.73vw;
    height: 46.10vh;
    background-color: #ffffff;
    border-radius: 16px;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.39);
    position: absolute;
    left: 39.64vw;
    top: 28.80vh;
}
.rentalminIso{
    width: 7.03vw;
    height: 13vh;
    position: absolute;
    left: 46.44vw;
    top: 10.17vh;
}
.rentalminLogo{
    width: 15vw;
    height: 6.10vh;
    position: absolute;
    left: 42.47vw;
    top: 83.85vh;
}
.loginStyle{
    width: 10.26vw;
    height: 4.07vh;
    text-align: center;
    border-style: solid;
    border-color: #FF6000;
    border-width: 3px;
    border-radius: 24px;
    position: relative;
    left: 3.18vw;
}
.loginStyle > p{
    margin: 1.24vh 0 0 0;
}
.dividerLines{
    margin: 0 0 0 0;
    width: 0.84vw;
    height: 1.72vh;
    position: relative;
    left: 15.77vw;
}

.shake { animation: shake .5s forwards ease-in;}
@keyframes shake {
  0% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(12px);
  }
  50% {
    transform: translateX(0px);
  }
  75% {
    transform: translateX(6px);
  }
  100% {
    transform: translateX(0px);
  }
}

@media only screen and (max-width: 768px) {
    /* For general iPad layouts */

    .loginContainer{
        width: 328px;
        height: 423px;
        position: relative;
        top: 31px;
        left: 41px;
    }
    .loginContainer > h1{
        margin: 15px 0 0 0;
        text-align: center;
    }
    .loginContainer > h2{
        margin: 58px 0 0 0;
    }
    .loginContainer > h3{
        margin: 36px 0 0 0;
    }
    .loginContainer > input[type=text]{
        margin: 8px 0 0 0;
        border: none;
        width: 100%;
        position: relative;
        top: 12px;
        text-indent: 13px;
    }
    .loginContainer > input[type=password]{
        margin: 8px 0 0 0;
        border: none;
        width: 100%;
        position: relative;
        top: 12px;
        text-indent: 13px;
    }
    .loginContainer > input[type=submit]{
        width: 162px;
        height: 49px;
        margin: 40px 0 0 0;
        text-align: center;
        background-color: #FF6000;
        border-radius: 24px;
        position: relative;
        left: 82px;
        border: none;
    }
    input:focus, textarea:focus, select:focus{
        outline: none;
    }
    .loginContainer > .divider{
        margin: 0 0 0 0;
        border-bottom: 1px solid #FF6000;
    }
    .whitePanel{
        width: 410px;
        height: 471px;
        background-color: #ffffff;
        border-radius: 16px;
        box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.39);
        position: absolute;
        left: 179px;
        top: 294px;
    }
    .rentalminIso{
        width: 139px;
        height: 138px;
        position: absolute;
        left: 314px;
        top: 103px;
    }
    .rentalminLogo{
        width: 294px;
        height: 63px;
        position: absolute;
        left: 236px;
        top: 857px;
    }
    .loginStyle{
        width: 202px;
        height: 48px;
        text-align: center;
        border-style: solid;
        border-color: #FF6000;
        border-width: 3px;
        border-radius: 24px;
        position: relative;
        left: 62px;
    }
    .loginStyle > p{
        margin: 17px 0 0 0;
    }
    .dividerLines{
        margin: 0 0 0 0;
        width: 16px;
        height: 17px;
        position: relative;
        left: 310px;
    }
   
}