/*
    Theme name: Vinski raj - aplikacija za kontrolo dostopa
    Author: Urban Puhek, OnOff Kreativna Agencija
    Version: 1.0
    Author URI: https://www.linkedin.com/in/urban-puhek-2227261b7/
    Theme URI: https://onoff.si/
*/

:root {
    --black: #1f1f1f;
}

/*******base.css*******/
body{
    font-family: Arial, Helvetica, sans-serif;
    padding: 0;
    margin: 0;
	padding-bottom: 30px;
    background-image: linear-gradient(rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6)), url('../app-glavinic/images/glavinic-ozadje.png');
    background-size: auto;
    background-repeat: repeat;
}

/*********************/
/*******login styling*******/
body.login div#login h1 a {
    background-image: url('../app-glavinic/images/glavinic-logo.png');
    background-size: contain;
    height: 150px;
    width: auto;
}

#login p, #login label, #nav a, #backtoblog a{
    color: var(--black) !important;
}

#loginform{
    background: transparent;
    border: none;
    box-shadow: none;
}

.login form .input, .login form input[type=checkbox], .login input[type=text] {
    background: transparent;
    border: 1px solid var(--black);
}

#wp-submit {
    background-color: transparent;
    border-color: var(--black);
    box-shadow: none;
    color: var(--black);
}

.login #login_error, .login .message, .login .success {
    border: 1px solid var(--black);
    background-color: transparent;
    box-shadow: none;
}

.wp-core-ui .button, .wp-core-ui .button-secondary{
    color: var(--black);
}

input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
    color: var(--black);
}

#lostpasswordform, #resetpassform{
    background-color: transparent;
    border: none;
}

.login #login_error, .login .message, .login .success {
    color: var(--black);
}

#login #backtoblog{
    display: none !important;
}

/*********************/
/*******home.css*******/
.content-container{
    display: block;
    height: 100%;
    width: 100%;
}

.gif{
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    background-color: red;
    margin-top: 20px;
    display: block;
}

.logo-container{
    width: 200px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 100px;
    padding-bottom: 75px;
}

.logo{
    width: 100%;
    height: auto;
}

.inner-container{
    display: block;
    vertical-align: middle;
}

.button-container{
    width: 30%;
    max-width: 500px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.open-button{
    width: 100%;
    height: 50px;
    outline: none;
    border: none;
    cursor: pointer;
    background-image: linear-gradient(to left, #ac1de1 , #0bccee, #ac1de1);
    background-size: 200%;
    transition: 0.6s;
    color: var(--black);
    font-family: 'GothamBold';
    font-size: 20px;
}

.other-container{
    width: 100%;
    position: fixed;
    bottom: 0;
    text-align: center;
    padding-bottom: 20px;
}

.other-txt{
    color: var(--black);
    text-decoration: none;
}

.welcome-txt, .welcome-txt-rnmbr{
    text-align: center;
    font-size: 24px;
    font-family: Arial, Helvetica, sans-serif;
}

.welcome-txt-rnmbr{
    font-weight: bold;
}


@media screen and (max-width: 960px) {
    .button-container{
        width: 80vw;
        padding-top: 3vh;
    }

    #lift-button-container{
        padding-top: 20px;
    }
    
    .logo-container{
        width: 175px;
        padding-top: 5vh;
        padding-bottom: 0;
    }

    .inner-container{
        vertical-align: top;
    }

}

/**********************************/

/*******login.css*******/
.form-login{
    text-align: center;
}

.icon {
    padding: 10px 5px;
    color: black;
    min-width: 30px;
    text-align: center;
    background-color: white;
  }

.input-container{
    display: -ms-flexbox; /* IE10 */
    display: flex;
    width: 100%;
    margin-bottom: 15px;
  }

.input-field{
    border: none;
    width: 100%;
}

*:focus{
    outline: none;
}

.form-container{
    width: 30%;
    max-width: 500px;
    height: auto;
    margin-left: auto;
    margin-right: auto;
}

.button-login, .button-door{
    width: 100%;
    height: 50px;
    outline: none;
    border: none;
    cursor: pointer;
    background-color: transparent;
    color: var(--black);
    font-family: Arial, Helvetica, sans-serif;
    font-size: 20px;
    font-weight: bold;
    font-style: normal;
    border: 1px solid var(--black);
}

.button-login{
	margin-top: 20px;
}

.button-door{
    margin-top: 20px;
}

.message-text{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 30px;
    font-weight: bold;
    font-style: normal;
    text-align: center;
    color: var(--black);
}

.message2-text{
   font-family: Arial, Helvetica, sans-serif;
    font-size: 30px;
    font-weight: bold;
    font-style: normal;
    text-align: center;
    color: var(--black);
}

.inner-container{
  display: table-cell;
  vertical-align: middle;
}

#messages{
    color: var(--black);
    padding: 10px;
    margin-top: 10px;
    text-align: center;
}

@media screen and (max-width: 960px) {
    .form-container{
        width: 80vw;
        padding-top: 200px;
    }

    .inner-container{
        vertical-align: top;
    }

    .button-door, .button-login{
        margin-top: 0;
    }
}