﻿/* Variables globales */
/*@import url("bootstrap-icons.min.css");*/
/* FUENTES DE GOOGLE FONTS */
@import url('https://fonts.googleapis.com/css?family=Montserrat:400,600&display=swap');

/* Media Query for Mobile Devices */
@media (max-width: 480px) and (orientation: portrait) {
    .input-group {
        padding-bottom: 2rem;
    }
}

/* Media Query for low resolution  Tablets, Ipads */
@media (min-width: 481px) and (max-width: 767px) and (orientation: portrait) {
    .input-group {
        padding-bottom: 2rem !important;
    }
}

@media (min-width: 481px) and (max-width: 767px) and (orientation: landscape) {
    .logo {
        margin: 0 !important;
    }
    .input-group {
        padding-bottom: 0rem !important;
    }

    .login-container {
        max-width: 600px;
    }
}

@media (min-width: 481px) and (max-width: 767px) and (orientation: portrait) {
    .input-group {
        padding-bottom: 2rem;
    }
}

/* Media Query for Tablets Ipads portrait mode */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .input-group {
        padding-bottom: 2rem;
    }

    .login-container {
        max-width: 600px;
    }
}

@media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    .input-group {
        padding-bottom: 1rem !important;
    }

    .login-container {
        max-width: 600px;
    }
}

/* Media Query for Laptops and Desktops */
@media (min-width: 1025px) and (max-width: 1280px) {
    .input-group {
        padding-bottom: 2rem !important;
    }

    .login-container {
        max-width: 600px;
    }
}

/* Media Query for Large screens */
@media (min-width: 1281px) {
    .login-container {
        max-width: 400px;
    }
}

html, body {
    font-family: 'Montserrat', sans-serif;
}

.login {
    background: rgb(14,27,42);
    background: linear-gradient(0deg, rgba(14, 27, 42, 1) 0%, rgba(15, 22, 29, 1) 100%);
}

.login-container {
    width: 100%;
    padding: 0 25px;
}

.logo {
    text-align: center;
}