.app-login{
    .app-loading-contant{
        height: 100%;
        width: 100%;
        background: #8e9eab;  /* fallback for old browsers */
        background: -webkit-linear-gradient(45deg, #8e9eab, #eef2f3);  /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(45deg, #8e9eab, #eef2f3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        display: flex;
        justify-content: center;
        align-items: center;
        .loadingCircle{
            width: 80px;
            height: 80px;
            border-radius: 100%;
            border:5px solid rgba(255, 255, 255, .6);
            border-top-color: #fff;
            animation: loadingRole 2s linear infinite;
            background: linear-gradient(30deg, #7BC6CC, #BE93C5);
            box-shadow: 0 0 20px #8e9eab;
        }
        @keyframes loadingRole {
            0% {transform: rotate(0);}
            100% {transform: rotate(360deg);}
        }
    }
    .app-login-contant{
        width: 100%;
        height: 100%;
        min-height: 400px;
        
        background: #8e9eab;  /* fallback for old browsers */
        background: -webkit-linear-gradient(45deg, #8e9eab, #eef2f3);  /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(45deg, #8e9eab, #eef2f3); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: center;

        .ibizLogo{
            width: 86px;
            height: 40px;

            margin-top: 15vh;
            margin-left: 6vw;

            align-self:flex-start;

            filter: drop-shadow(-4px 4px 5px #8e9eab);
        }

        .app-login-form{
            width: 90vw;
            min-height: 240px;
            margin-top: 40px;
            border-radius: 10px;
            background-color: white;
            
            display: flex;
            flex-direction: column;
            justify-content: space-around;

            box-shadow: -4px 4px 5px #8e9eab;

            ion-item{
                border-radius: 10px;
            }
            
            .ion-no-margin{
                margin: auto;
                --background: linear-gradient(30deg, #7BC6CC, #BE93C5) !important;
                --background-activated:linear-gradient(30deg, #5FC3E4, #E55D87) !important;
                font-size: 1.2rem;
                --border-radius: 20px;
                margin-top: 20px;
                height: 38px;
                width: 92%;
            }
            
            ion-input{
                --background:#f1f1f1 !important;
                border-radius: 20px;
                width: 90% !important;
                height: 44.8px !important;
                margin:auto;
                margin-top: 1vh;
                --padding-start:20px !important;
                --color:#8e9eab;
            }

            ion-label{
                --color:#8e9eab;
                margin-left: 5vw;
                font-size: 1rem !important;
            }

            .visitor{
              margin-top: -15px;
              .ion-visitor{
                --color-activated:#f1f1f1;
              }
            }
        }
        // .thirdParty{
        //     width: 90vw;
        //     height: 40px;
        //     margin-top: 20px;
        //     background-color: white;
        //     display: flex;
        //     justify-content: space-around;
        //     align-items: center;
        //     border-radius: 10px;
        //     box-shadow: -4px 4px 5px #5a5a5a;
        // }
    }
}

