﻿
footer {
    align-self:end;
    position:sticky;
}

@media (min-width: 1200px){
    #PaginaPrincipal {
      max-width:99%;
    }

}
@media (prefers-reduced-motion: reduce) {
    .btn {
        transition: none;
    }
}

@media (min-width: 768px) {
    header.masthead {
        padding-top: 17rem;
        padding-bottom: 12.5rem;
    }

        header.masthead .masthead-subheading {
            font-size: 2.25rem;
            font-style: italic;
            line-height: 2.25rem;
            margin-bottom: 2rem;
        }

        header.masthead .masthead-heading {
            font-size: 4.5rem;
            font-weight: 700;
            line-height: 4.5rem;
            margin-bottom: 4rem;
        }
}

header.masthead {
    padding-top: 10.5rem;
    padding-bottom: 6rem;
    text-align: center;
    color: #fff;
    background-image: url(../Imagenes/Fondos/Fondo.jpg);
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: center center;
    background-size: cover;
}

header.masthead .masthead-subheading {
        font-size: 1.5rem;
        font-style: italic;
        line-height: 1.5rem;
        margin-bottom: 25px;
        font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

header.masthead .masthead-heading {
    font-size: 3.25rem;
    font-weight: 700;
    line-height: 3.25rem;
    margin-bottom: 2rem;
    font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}



.btn:hover {
    color: #212529;
    text-decoration: none;
}

.btn:focus, .btn.focus {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(254, 209, 54, 0.25);
}

.btn.disabled, .btn:disabled {
    opacity: 0.65;
}

a.btn.disabled,
fieldset:disabled a.btn {
    pointer-events: none;
}

.btn-primary {
    color: #fff;
    background-color: #fed136;
    border-color: #fed136;
}

.btn-primary:hover {
        color: #fff;
        background-color: #fec810;
        border-color: #fec503;
}

.btn-primary:focus, .btn-primary.focus {
        color: #fff;
        background-color: #fec810;
        border-color: #fec503;
        box-shadow: 0 0 0 0.2rem rgba(254, 216, 84, 0.5);
 }

.btn-primary.disabled, .btn-primary:disabled {
        color: #fff;
        background-color: #fed136;
        border-color: #fed136;
}

.btn-primary:not(:disabled):not(.disabled):active, .btn-primary:not(:disabled):not(.disabled).active, .show > .btn-primary.dropdown-toggle {
        color: #fff;
        background-color: #fec503;
        border-color: #f3bd01;
}

.btn-primary:not(:disabled):not(.disabled):active:focus, .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .btn-primary.dropdown-toggle:focus {
            box-shadow: 0 0 0 0.2rem rgba(254, 216, 84, 0.5);
}
.btn-xl {
    padding: 1.25rem 2.5rem;
    font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-size: 1.125rem;
    font-weight: 700;
}

.bg-light {
    background-color: #f8f9fa !important;
}

a.bg-light:hover,
a.bg-light:focus,
button.bg-light:hover,
button.bg-light:focus {
    background-color: #dae0e5 !important;
}

.text-muted {
    color: #6c757d !important;
}

.img-fluid {
    max-width: 100%;
    height: auto;
}

#portfolio .portfolio-item {
    max-width: 25rem;
    margin-left: auto;
    margin-right: auto;
}

#portfolio .portfolio-item .portfolio-link {
        position: relative;
        display: block;
        margin: 0 auto;
}

#portfolio .portfolio-item .portfolio-link .portfolio-hover {
            display: flex;
            position: absolute;
            width: 100%;
            height: 100%;
            background: rgba(254, 209, 54, 0.9);
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity ease-in-out 0.25s;
}

 #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
                font-size: 1.25rem;
                color: white;
 }

 #portfolio .portfolio-item .portfolio-link:hover .portfolio-hover {
            opacity: 1;
 }

#PortafolioTextoCard {
    font-size: 1.2rem;
    font-weight: 700;
    margin-bottom: 0;
    text-align: center;
    font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color:#FFF;
}

 #portfolio .portfolio-item .portfolio-caption {
        padding: 1.5rem;
        text-align: center;
        background-color: #fff;
 }

 #portfolio .portfolio-item .portfolio-caption .portfolio-caption-heading {
            font-size: 1.5rem;
            font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            font-weight: 700;
            margin-bottom: 0;
 }

 #portfolio .portfolio-item .portfolio-caption .portfolio-caption-subheading {
            font-style: italic;
            font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }

 /*CARDS*/
#Cards {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
}

#CardsContent {
    list-style:none;
    text-align:center;
}

*, *::before, *::after {
    box-sizing: border-box;
}

#portfolio .portfolio-item {
    max-width: 25rem;
    margin-left: auto;
    margin-right: auto;
}

    #portfolio .portfolio-item .portfolio-link {
        position: relative;
        display: block;
        margin: 0 auto;
    }

        #portfolio .portfolio-item .portfolio-link .portfolio-hover {
            display: flex;
            position: absolute;
            width: 100%;
            height: 100%;
            background: rgba(254, 209, 54, 0.9);
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: opacity ease-in-out 0.25s;
        }

            #portfolio .portfolio-item .portfolio-link .portfolio-hover .portfolio-hover-content {
                font-size: 1.25rem;
                color: white;
            }

        #portfolio .portfolio-item .portfolio-link:hover .portfolio-hover {
            opacity: 1;
        }

    #portfolio .portfolio-item .portfolio-caption {
        padding: 1.5rem;
        text-align: center;
        background-color: #fff;
    }

        #portfolio .portfolio-item .portfolio-caption .portfolio-caption-heading {
            font-size: 1.5rem;
            font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
            font-weight: 700;
            margin-bottom: 0;
        }

        #portfolio .portfolio-item .portfolio-caption .portfolio-caption-subheading {
            font-style: italic;
            font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        }

.portfolio-modal .modal-dialog {
    margin: 1rem;
    max-width: 100vw;
}

.portfolio-modal .modal-content {
    padding-top: 6rem;
    padding-bottom: 6rem;
    text-align: center;
}

    .portfolio-modal .modal-content h2 {
        font-size: 3rem;
        line-height: 3rem;
    }

    .portfolio-modal .modal-content p.item-intro {
        font-style: italic;
        margin-bottom: 2rem;
        font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    }

    .portfolio-modal .modal-content p {
        margin-bottom: 2rem;
    }

    .portfolio-modal .modal-content ul.list-inline {
        margin-bottom: 2rem;
    }

    .portfolio-modal .modal-content img {
        margin-bottom: 2rem;
    }

.portfolio-modal .close-modal {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    width: 3rem;
    height: 3rem;
    cursor: pointer;
    background-color: transparent;
}

    .portfolio-modal .close-modal:hover {
        opacity: 0.3;
    }

.bg-light {
    background-color: #f8f9fa !important;
}

a.bg-light:hover, a.bg-light:focus,
button.bg-light:hover,
button.bg-light:focus {
    background-color: #dae0e5 !important;
}

.page-section {
    padding: 2rem 0;
}

    .page-section h2.section-heading {
        font-size: 2.5rem;
        margin-top: 0;
        margin-bottom: 1rem;
    }

    .page-section h3.section-subheading {
        font-size: 1rem;
        font-weight: 400;
        font-style: italic;
        font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        margin-bottom: 4rem;
    }

.container {
    width: 100%;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 576px) {
    .container {
        max-width: 100%;
    }

    .col-sm-6 {
        /*flex: 0 0 50%;*/
        max-width: 100%;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 720px;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }
}

@media (max-width: 767.98px) {
    .navbar-expand-md > .container,
    .navbar-expand-md > .container-fluid,
    .navbar-expand-md > .container-sm,
    .navbar-expand-md > .container-md,
    .navbar-expand-md > .container-lg,
    .navbar-expand-md > .container-xl {
        padding-right: 0;
        padding-left: 0;
    }
}

@media (min-width: 768px) {
    .navbar-expand-md > .container,
    .navbar-expand-md > .container-fluid,
    .navbar-expand-md > .container-sm,
    .navbar-expand-md > .container-md,
    .navbar-expand-md > .container-lg,
    .navbar-expand-md > .container-xl {
        flex-wrap: nowrap;
    }
}

@media (min-width: 992px) {
    .navbar-expand-lg > .container,
    .navbar-expand-lg > .container-fluid,
    .navbar-expand-lg > .container-sm,
    .navbar-expand-lg > .container-md,
    .navbar-expand-lg > .container-lg,
    .navbar-expand-lg > .container-xl {
        flex-wrap: nowrap;
    }
}

@media (max-width: 991.98px) {
    .navbar-expand-lg > .container,
    .navbar-expand-lg > .container-fluid,
    .navbar-expand-lg > .container-sm,
    .navbar-expand-lg > .container-md,
    .navbar-expand-lg > .container-lg,
    .navbar-expand-lg > .container-xl {
        padding-right: 0;
        padding-left: 0;
    }
}

.container-fluid, .container-xl, .container-lg, .container-md, .container-sm {
    width: 100%;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 795px) {
    .container-md, .container-sm, .container {
        max-width: 800px;
    }

}

@media (min-width: 768px) {
    .container-md, .container-sm, .container {
        max-width: 100%;
    }

}

@media (min-width: 992px) {
    .container-lg, .container-md, .container-sm, .container {
        max-width: 960px;
    }
}

@media (min-width: 1200px) {
    .container-xl, .container-lg, .container-md, .container-sm, .container {
        max-width: 1140px;
    }
}

.navbar .container,
.navbar .container-fluid,
.navbar .container-sm,
.navbar .container-md,
.navbar .container-lg,
.navbar .container-xl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

@media (max-width: 575.98px) {
    .navbar-expand-sm > .container,
    .navbar-expand-sm > .container-fluid,
    .navbar-expand-sm > .container-sm,
    .navbar-expand-sm > .container-md,
    .navbar-expand-sm > .container-lg,
    .navbar-expand-sm > .container-xl {
        padding-right: 0;
        padding-left: 0;
    }
}


@media (min-width: 576px) {
    .navbar-expand-sm > .container,
    .navbar-expand-sm > .container-fluid,
    .navbar-expand-sm > .container-sm,
    .navbar-expand-sm > .container-md,
    .navbar-expand-sm > .container-lg,
    .navbar-expand-sm > .container-xl {
        flex-wrap: nowrap;
    }
}

@media (min-width: 1200px) {
    .navbar-expand-xl > .container,
    .navbar-expand-xl > .container-fluid,
    .navbar-expand-xl > .container-sm,
    .navbar-expand-xl > .container-md,
    .navbar-expand-xl > .container-lg,
    .navbar-expand-xl > .container-xl {
        flex-wrap: nowrap;
    }
}

@media (max-width: 1199.98px) {
    .navbar-expand-xl > .container,
    .navbar-expand-xl > .container-fluid,
    .navbar-expand-xl > .container-sm,
    .navbar-expand-xl > .container-md,
    .navbar-expand-xl > .container-lg,
    .navbar-expand-xl > .container-xl {
        padding-right: 0;
        padding-left: 0;
    }
}

.navbar-expand > .container,
.navbar-expand > .container-fluid,
.navbar-expand > .container-sm,
.navbar-expand > .container-md,
.navbar-expand > .container-lg,
.navbar-expand > .container-xl {
    padding-right: 0;
    padding-left: 0;
}

.navbar-expand > .container,
.navbar-expand > .container-fluid,
.navbar-expand > .container-sm,
.navbar-expand > .container-md,
.navbar-expand > .container-lg,
.navbar-expand > .container-xl {
    flex-wrap: nowrap;
}


.text-center {
    text-align: center !important;
}

.text-uppercase {
    text-transform: uppercase !important;
}

section#contact .section-heading {
    color: #fff;
    font-family: "Segoe UI Light","Segoe UI","Segoe","Tahoma","Helvetica","Arial","sans-serif";
}

.text-muted {
    color: #6c757d !important;
}

.row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -0.75rem;
    margin-left: -0.75rem;
}


.col-sm-6 {
    position: relative;
    width: 100%;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
}

.mb-4 {
    margin-bottom: 1.5rem !important;
}


/*DETALLE*/
#TituloDetalles {
    
    font-size: 2rem !important;
}

#TextoDetalles {
    border-top: 1px solid #cc8A00 !important;
    font-size: 18px !important;
}

#TablaDetalles {
    max-width: 486px;


}


/*SISTEMAS*/

#BotonSistemasTexto {
    color: #FFF !important;
    text-decoration: none !important;
    font-size: 1rem;
}

#ChechBox {
    width:22px;
}

#BotonSistemasIcono {
    color: #FFF;
    font-size:25px;
}

.BotonSistemas {
    border-color: #cc8A00 !important;
    color: #FFF !important;
    background-color: #cc8A00 !important;

}

/*FORMULARIOS*/


.form-control {
    border-radius: 0px;
}

.form-control:hover, .form-control:focus {
    border: 1px solid #424242 !important;

}

#Formulario {
    background-color: #FFF !important;
}

#SubFormulario {
    border: 1px solid #424242 !important;
    border-radius:1px;
}

#TituloPrincipal {
    font-size: 2rem;
    margin-top: 0;
    font-weight: 500;
    line-height: 1.2;
}

#TituloSecundario {
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 1rem;
    font-weight: 500;
    line-height: 1.2;
    color: #cc8A00;
}

#Texto {
    font-size: 1rem;
    font-weight: 400;
    font-style: italic;
    font-family: "Droid Serif", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    margin-bottom: 4rem;
}

#label {
    color: #000;
    font-weight: 600;
}


.dropdown-formularios{
    background-color:#FFF !important;
    color:#000;
}