/* Header Parallax Element Style*/ 
.paral {
    min-height: 700px;
    background-attachment: fixed;
    background-size: cover;
    background-position: 50% 50%;
}

.paralsec0 {
    min-height: 800px !important;
}
    
/* Paragrapgh for Parallax Section */ 
.paral p {
    font-size: 24px;
    color: darkgrey;
    text-align: center;
    line-height: 60px;
}
    
/* Heading for Parallax Section */ 
.paral h1 {
    color: darkslategrey;
    font-size: 60px;
    text-align: center;
    padding-top: 40px;
    line-height: 100px;
}
    
/* Image for Parallax Section */ 
.paralsec-jcpx {
    background-image: url("img/parallax-backgrounds/nightingale.jpeg");
}

.paralsec-nwpc {
    background-image: url("img/parallax-backgrounds/nwpc.png");
}

.paralsec-classes {
    background-image: url("img/parallax-backgrounds/clases.jpg");
}

.paralsec-hikershack {
    background-image: url("img/parallax-backgrounds/hikershack.jpg");
}

.paralsec-e-wills {
    background-image: url("img/parallax-backgrounds/e-wills.jpg");
}

.paralsec-what-to-wear {
    background-image: url("img/parallax-backgrounds/what-to-wear.jpg");
}

.paralsec-origami {
    background-image: url("img/parallax-backgrounds/origami.jpg");
}

.paralsec-it-blog {
    background-image: url("img/parallax-backgrounds/it-blog.jpg");
}

.paralsec-record-index {
    background-image: url("img/parallax-backgrounds/record-index.jpg");
}

.paralsec-mot4c {
    background-image: url("img/parallax-backgrounds/mot4c.jpg");
}

.paralsec-jcpx-games {
    background-image: url("img/parallax-backgrounds/jcpx-games.jpg");
}

.paralsec-cv {
    background-image: url("img/parallax-backgrounds/curriculum.jpg");
}

.paralsec-it-voting {
    background-image: url("img/parallax-backgrounds/it-voting.jpg");
}

.paralsec-4-in-a-row {
    background-image: url("img/parallax-backgrounds/4-in-a-row.jpg");
}
    
/* Add more images for more sections */
    
/* Remove Bottom Margin from Jumbotron */
.jumbotron{
    margin-bottom: 0;
}

.parallax-content {
	border-radius: 20px;
    background-color: #E3F2FD;
    animation: fadeIn 2s;
    -webkit-animation: fadeIn 2s;
    -moz-animation: fadeIn 2s;
    -o-animation: fadeIn 2s;
    -ms-animation: fadeIn 2s;
}


.parallax-content .btn, .parallax-content {
    opacity: 100% !important;
}

@keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:0.7;}
}

@-moz-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:0.7;}
}

@-webkit-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:0.7;}
}

@-o-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:0.7;}
}

@-ms-keyframes fadeIn {
    0% {opacity:0;}
    100% {opacity:0.7;}
}

@media screen and (max-width: 992px) {
    #butterfly {
        z-index: 0;
        position: absolute;
        left: 0px;
        top: 2400px;
    }

    .display-3 {
        width: 100% !important;
        font-size: 2.5em !important;
    }

    .lead {
        font-size: 1em !important;
    }
}