/* Variables de color */
:root {
  --primary: #07c8cc;
  --secondary: #d2d3d5;
  --primaryDark: #00877d;
}

/* LOGIN FORM STYLES */
body.ic-Login-Body #footer.ic-Login-footer {
    display: none !important;
}
body.ic-Login-Body div#main.ic-Layout-columns {
    display: flex;
    align-items: center;
}
body.ic-Login-Body .ic-Login-header__logo {
    flex: auto !important;
    justify-content: center;
    display: flex;
    width: 100%;
}
body.ic-Login-Body .ic-Login-header__logo img {
    margin: 1em;
    margin-bottom: 0;
}
.ic-Login__actions {
    flex-direction: column;
}
.ic-Login__actions .ic-Login__actions-timeout {
    margin-bottom: 1em;
    flex-direction: row;
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
}
.ic-Login__forgot {
    margin-left: 2em;
    font-weight: bold;
}
.ic-Form-control.ic-Form-control--login {
    width: 100%;
}
.ic-Login__actions input.Button.Button--login {
    width: 100%;
    background-color: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.ic-Login__body input[type=text].ic-Input, .ic-Login__body input[type=password].ic-Input {
    border: 0;
    border-bottom: 2px solid var(--primary);
}
.ic-Login__body input[type=radio], .ic-Login__body input[type=checkbox] {
    margin: 0;
}
.ic-Login__content {
    border-radius: 1rem;
}
/* Curso plantilla */
.enFila{
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   align-items: center;
}
.enFila a{
   text-decoration: none !important;
}
a.ic_txt{
   text-align: center;
   padding: .5em 7px;
   margin: 0.5em;
   color: #ffffff;
   font-weight: bold !important;
   width: 25%;
   border-radius: .5em;
   display: flex;
   flex-direction: column;
   align-items: center;
   text-decoration: none !important;
}
a.ic_txt:hover {
    opacity: .8;
}
a.ic_txt img{
   min-height: 60px;
   max-height: 60px;
   border-radius: 100%;
   max-width: 60px;
   margin: 0 10px 5px;
}
.ic_txt.primary{
   background-color: var(--primary);
   color: #000;
}
a.ic_txt.primary:hover {
    background-color: var(--primaryDark);
}
.ic_txt.secondary{
   background-color: var(--secondary);
}
.ic_txt.primaryDark{
   background-color: var(--primaryDark);
}
.ic_txt.borderText {
    background-color: transparent;
    border: 1px solid var(--primaryDark);
    border-radius: 2rem;
    color: var(--primaryDark);
    padding: 1px 2em;
    width: auto;
    min-width: 115px;
}
a.ic_txt img{
   min-height: 60px;
   max-height: 60px;
   border-radius: 100%;
   max-width: 60px;
   margin: 0 10px 5px;
}
a img:hover{
   opacity: .7;
   transition: opacity .2s ease-in-out;
}
img.css-14qsel8-view--inlineBlock-img {
    display: none;
}
.activities_inline {
    display: flex;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
}
.activity {
    width: 45%;
    margin: 1em;
}
/* Fin curso plantilla */

/* CUSTOM MOBILE */

@media only screen and (max-device-width : 768px) {
    #f1_container {
        height: 100%;
        background-image: linear-gradient(transparent, transparent 80%, var(--ic-brand-Login-body-bgd-shadow-color)),var(--ic-brand-Login-body-bgd-image);
        background-size: cover;
        background-position-x: 50%, center;
    }

    #f1_container.fade {
        -webkit-animation: fadeInFromNone 0.5s ease-out;
        -moz-animation: fadeInFromNone 0.5s ease-out;
        -o-animation: fadeInFromNone 0.5s ease-out;
        animation: fadeInFromNone 0.5s ease-out;
        animation-fill-mode: forwards;
    }

    .mobileLogin-Header {
        background-image: var(--ic-brand-Login-logo) !important;
        background-position: center;
        background-repeat: no-repeat;
        background-size: 100%;
        min-height: 156px;
        margin-bottom: 10%;
        margin-top: 10%;
    }

    #f1_card {
        width: 296px;
        height: auto;
        background-color: var(--ic-brand-Login-Content-inner-bgd);
        position: fixed;
        padding: 15px;
        border-radius: 1rem;
        margin-top: 25%;
    }
    .forgotBlock a.forgot-password.flip-to-back {
        color: #000;
        font-weight: bold;
    }
    #f1_card button.Button.Button--primary.Button--block {
        color: #fff;
        font-weight: bold;
    }
    #f1_card input.ic-Input {
        border: 0;
        border-bottom: 2px solid var(--primary);
    }
    a.ic_txt{
       width: 90%;
    }
    .activities_inline {
        justify-content: center;
        flex-wrap: no-wrap;
        flex-direction: column;
    }
    .activity {
        width: 100%;
        margin: 1em 0;
    }
    .ic_txt.borderText {
        border-radius: 2rem;
        min-height: 35px;
        justify-content: center;
    }
}

@media (max-width: 1080px) {
    .activities_inline {
        justify-content: center;
        flex-wrap: no-wrap;
        flex-direction: column;
    }
    .activity {
        width: 100%;
        margin: 1em 0;
    }
}
/* END CUSTOM MOBILE */