/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;

}
ul.nav,.jumbotron h1{
    font-family: 'Arvo',"Courier New",  serif;
}
ul.nav{
    font-size: 13px;
}
.jumbotron h1{
    margin-top: 0;
    margin-bottom: 50px;

}
.jumbotron p{
    margin-bottom: 50px;
    padding: 0 50px;
    font-weight: 100;
}
.jumbotron {
    text-align: center;
    background: url("../images/Hero_image.jpg");
    color: white;

}
.btn-lg{
    font-size: 36px;

}
#get_involve{
    background-color: #f5f5f5;
}
.code_image{
    padding-top: 30px;
    padding-bottom: 30px;
}
.homepage{
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;

}
.homepage p{
    font-size: 20px;
}
.homepage h2{
    color: #e74c3c;
    font-family: 'Arvo', "Courier New", serif;
     text-transform: uppercase;
}
.homepage h3{
    text-transform: uppercase;
    font-family: 'Arvo', "Courier New", serif;
    font-size: 26px;
    color: #e74c3c;
}
.homepage a {
    color: #e74c3c;
}
.homepage a:hover{
    opacity: .8;
    text-decoration: none;
    color: #e74c3c;
}
.homepage hr {
    border-color: #e74c3c;
    width: 150px;
    margin-top: 15px;
}
footer{
    background-color: #f74c3c;
    padding-top: 150px;
    padding-bottom: 30px;
    position: relative;
}
#back-to-top{
    position: absolute;
    bottom: 10px;
    right: 10px;
}
#back-to-top a{
    color: #333;
}
.modal-dialog{
    top:250px;
}

.modal-content{
    padding-top: 15px;
    padding-bottom: 10px;
}
.modal-content button.close{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 32px;
    background: white;
    border-radius: 13px;
    opacity: 1;
    width: 30px;
}
#exampleInputEmail1{
    font-size: 25px;
  height: 70px;
}

/*@Media Queries*/
@media (max-width: 1199px) {
    .jumbotron h1 {
        font-size: 56px;
        margin-bottom: 30px;
    }
    #jumbotron > div.container > form > div > p > a{
        display: flex;
    }
}
@media (max-width: 991px) {
    .jumbotron h1 {
        font-size: 44px;
    }
    .jumbotron p{
        padding:0 10px;
    }
    #get_involve .col-md-4 {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    #jumbotron > div.container > form > div > p > a{
       display: inline-block;
        margin-top: 15px;
    }
    iframe{
        width: 600px;
        height: 250px;
    }
}
@media (max-width: 767px) {
    .jumbotron h1 {
        font-size: 24px;
    }
    .jumbotron p{
        font-size: 15px;
        padding:0;
    }
    .btn-lg {
        font-size: 18px;
    }
    .homepage p{
        font-size: 18px;
    }
    footer img{
        width: 80%;
    }
    #jumbotron > div.container > form > div > p > a{
        margin-top: 15px;

    }
    #exampleInputEmail1{
        font-size: 15px;
        height: 50px;
    }
    iframe{
      width: 450px;
        height: 250px;
    }
}