/* Sections  */

.title {
    text-align: center;
    background-color: #c2f0fc;
}

.topcontent {
    text-align: center;
    background-color: #c2f0fc;
}

.usage {
    text-align: center;
    background-color: #c2f0fc;
    font-family: 'Montserrat', sans-serif;
}

.skills {
    background-color: #ffffff;
    text-align: center;
}

.work-experience {
    margin-top: 20px;
    background-color: #ffd1bd;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
}

.education {
    text-align: center;
    font-family: 'Montserrat', sans-serif;
}


/* Grid */

.work-grid {
    margin-top: 3%;
}


/* Text  */

.cursive {
    font-family: 'Dancing Script', cursive;
    padding-bottom: 3%;
}

.section-heading {
    margin-top: 3%;
    font-family: 'Montserrat', sans-serif;
}


/* Image Styles */

.skills-image-container {
    margin-top: 3%;
    vertical-align: top;
}

.title-image {
    max-width: 20%;
    max-height: 20%;
}

.skills-image {
    max-width: 7%;
    max-height: 7%;
}

.html-image {
    max-width: 10%;
    max-height: 10%;
}

.css-image {
    max-width: 4%;
    max-height: 4%;
}

.python-image {
    max-width: 20%;
    max-height: 20%;
}

.sql-image {
    max-width: 15%;
    max-height: 15%;
}

.js-image {
    max-width: 9%;
    max-height: 9%;
}


/* Carousel Styles */

.carousel-control-prev-icon,
.carousel-control-next-icon {
    height: 100px;
    width: 100px;
    outline: black;
    background-size: 100%, 100%;
    background-image: none;
}

.carousel-control-next-icon:after {
    content: '>';
    font-size: 55px;
    color: blue;
}

.carousel-control-prev-icon:after {
    content: '<';
    font-size: 55px;
    color: blue;
}

#skillsCarousel {
    margin-top: 10px;
    margin-bottom: 10px;
    padding-top: 3%;
    text-align: center;
}

@media only screen and (max-width: 700px) {
    .carousel-control-prev-icon:after {
        font-size: 25px;
    }
    .carousel-control-next-icon:after {
        font-size: 25px;
    }
}