body {
    background-color: #eee;
    margin: 1px auto auto auto;
    font-family: 'Rubik', sans-serif;
    padding-top: 0px;
    overflow-y: scroll;
}

.loginbox {
    padding: 10px 20px 20px 20px;
}

.border-1 {
    border: 3px solid #ed2f59;
}

.border-2 {
    border: 3px solid #2b3e5e;
}



.btn-huddle {
    background: #F2325C;
    color: white !important;
    box-shadow: 1px 1px 2px #908a8a;
}

    .btn-huddle:hover {
        color: white !important;
    }

.title-sec {
    border-bottom: 1px solid #ddd;
}

.checkbox-bg {
    height: 20px;
    width: 20px;
}

.login-box {
    background: #fff;
    box-shadow: 2px 2px 2px #ddd;
    border: 2px solid #ddd;
    border-top: none;
    padding: 15px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 38px;
    height: 24px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 16px;
        width: 16px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #f2325c;
}

input:focus + .slider {
    box-shadow: 0 0 1px #f2325c;
}

input:checked + .slider:before {
    -webkit-transform: translateX(16px);
    -ms-transform: translateX(16px);
    transform: translateX(16px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

    .slider.round:before {
        border-radius: 50%;
    }


/* Custom, iPhone Retina */
@media only screen and (max-width : 479px) {

    .login-box {
        width: 90%;
    }

    .total-border {
        width: 90%;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {


    .login-box {
        width: 90%;
    }

    .total-border {
        width: 90%;
    }
}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {

    .login-box {
        width: 50%;
    }

    .total-border {
        width: 50%;
    }
}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {

    .login-box {
        width: 30%;
    }


    .total-border {
        width: 30%;
    }
}