﻿
/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 280px;
}

body {
    padding-bottom: 20px;
    font-family: Lato,'Helvetica Neue',Helvetica,Arial,sans-serif
}

h1, h2, h3, h4, h5, h6 {
    font-family: Lato,'Helvetica Neue',Helvetica,Arial,sans-serif;
    font-weight: 700
}

header.masthead {
    position: relative;
    background-color: #343a40;
    background: url(../img/bg-masthead2.jpg) no-repeat center center;
    background-size: cover;
    padding-top: 50rem;
    padding-bottom: 50rem
}

    header.masthead .overlay {
        position: absolute;
        background-color: #212529;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: .3
    }

    header.masthead h1 {
        font-size: 2rem
    }

@media (min-width:768px) {
    header.masthead {
        padding-top: 12rem;
        padding-bottom: 12rem
    }

        header.masthead h1 {
            font-size: 3rem
        }
}

.showcase .showcase-text {
    padding: 3rem
}

.showcase .showcase-img {
    min-height: 30rem;
    background-size: cover
}

@media (min-width:768px) {
    .showcase .showcase-text {
        padding: 7rem
    }
}

.features-icons {
    padding-top: 7rem;
    padding-bottom: 7rem
}

    .features-icons .features-icons-item {
        max-width: 20rem
    }

        .features-icons .features-icons-item .features-icons-icon {
            height: 7rem
        }

            .features-icons .features-icons-item .features-icons-icon i {
                font-size: 4.5rem
            }

        .features-icons .features-icons-item:hover .features-icons-icon i {
            font-size: 5rem
        }

.testimonials {
    padding-top: 7rem;
    padding-bottom: 7rem
}

    .testimonials .testimonial-item {
        max-width: 18rem
    }

        .testimonials .testimonial-item img {
            max-width: 12rem;
            -webkit-box-shadow: 0 5px 5px 0 #adb5bd;
            box-shadow: 0 5px 5px 0 #adb5bd
        }

.call-to-action {
    position: relative;
    background-color: #343a40;
    background: url(../img/bg-masthead.jpg) no-repeat center center;
    background-size: cover;
    padding-top: 7rem;
    padding-bottom: 7rem
}

    .call-to-action .overlay {
        position: absolute;
        background-color: #212529;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        opacity: .3
    }

footer.footer {
    padding-top: 4rem;
    padding-bottom: 4rem
}

img.pequeña {
    width: 70px;
    height: 50px;
    display: block;
    margin: auto;
}

img.mediana {
    width: 120px;
    height: 100px;
    display: block;
    margin: auto;
}

img.grande {
    width: 400px;
    height: 200px;
    display: block;
    margin: auto;
}

div.centrar {
    display: block;
    margin: auto;
}

.loader {
    border: 16px solid #f3f3f3;
    border-radius: 50%;
    border-top: 16px solid #3498db;
    width: 10px;
    height: 10px;
    -webkit-animation: spin 2s linear infinite; /* Safari */
    animation: spin 2s linear infinite;
}

/* Safari */
@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

.hide {
    opacity: 0;
}

.divForm {
    display: flex;
    justify-content: center;
    align-items: center;
}

.parallax {
    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.tableFixHead {
    height: 400px;
}

    .tableFixHead th {
        position: sticky;
        top: 0;
    }

/* Just common table stuff. Really. */
table {
    border-collapse: collapse;
    width: 100%;
}

th, td {
    padding: 8px 16px;
}
