@media only screen and (max-width: 999px) {

	#menu_wrapper .a--title--main,
	#menu_wrapper .a--title--subtitle,
	#menu_wrapper .menu--button--left {
 	       display: unset;
	}

	.img--logo {
	        top: 1px;
	        transform: rotate(315deg);
	}

}



@media only screen and (max-width: 768px) {

    body {
        background-color: white;
        font-family: 'Arial';
    }

    h1 {
        font-size: 16px;
        font-size: 8vw;
    }

    h2 {
        font-size: 14px;
        font-size: 7vw;
    }

    .login_form {
        background-color: #fff;
        box-shadow: none;
        width: 100%;
    }

    label {
        width: 90%;
        font-size: 14px;
        font-size: 4vw;
    }

    .error {
        font-size: 14px;
        font-size: 5vw;
        width: 90%;
    }

    .show_password {
        font-size: 14px;
        font-size: 5vw;
        width: 90%;
    }

    input[type="text"], input[type="password"] {
        color: black;
        width: 90%;
        height: auto;
        font-size: 16px;
        font-size: 6vw;
        padding: 4px;
        margin-bottom: 10px;
        border-style: solid;
        border-radius: 5px;
        border-color: gray;
        background-color: rgba(0,0,0,0.15);
        transition: background-color 0.5s ease;
    }

    input[type=text]:focus, input[type=password]:focus {
        background-color: rgba(0,0,0,0.35);
    }

    .button--submit {
        color: white;
        background-color: dimgray;
        width: 90%;
        height: auto;
        font-size: 16px;
        font-size: 6vw;
        padding: 8px;
        border-style: solid;
        border-radius: 5px;
        border-color: gray;
    }

    #menu_wrapper {
        display: none;
    }

    #main_wrapper {
        padding: 0px;
    }

    .mobile_title {
        display: block;
    }

    #rooms_wrapper {
        padding-top: 20px;
    }

}