@import url('https://fonts.googleapis.com/css?family=K2D');

body {
    width: 100%;
    margin: 0;
    padding: 0;
    font-family: 'K2D', sans-serif, monospace, serif;
    font-weight: normal;
    overflow-x: hidden;
}

.nav-wrapper {
    width: 100%;
    background-color: rgb(13, 12, 12);
    color: #fff;
    margin: 0;
    padding: 0;
    border-bottom: 2px #F39200 solid;
}

a {
    color: #fff;
    text-decoration: none;
    transition: 0.2s ease;
    font-weight: normal;
}

a:hover {
    color: #F39200;
}

.nav-bar {
    padding: 20px;
}

.nav-bar h3 {
    display: inline-block; 
    font-weight: normal;
    font-size: 20px;
}

.nav-bar h3 span {
    color: #F39200;
    font-weight: bolder;
}

span {
    color: #F9B233;
}

h2 {
    font-weight: normal;
}

.parallax{
    min-height: 500px; 
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin: 0;
}

#header{
  position: absolute;
  z-index: 1000;
  top: 200px;
  left: 200px;
}

.text-box{
	height: 600px;
	padding: 50px;
}

@media only screen and (max-device-width: 1024px) {
    .parallax {
        background-attachment: scroll;
    }
}

.parallax-home {
    background-image: url("../IMG/Banner1.jpg");
}

.parallax-splitter {
    background-image: url("../IMG/Banner2.jpg");
}

.container {
    width: 100%;
    margin: 0;
    padding: 0;
    background-color: rgb(48, 48, 48);
    color: #fff;
}

.container .content {
    width: 80%;
    margin: auto;
    padding-top: 20px;
}

.content h2 {
    font-weight: normal;
}

.tiles {
    text-align: center;
}

.tiles a {
    transition: inherit;
}

.tiles a:hover {
    color: #fff;
}

.tiles div {
    width: 30%;
    display: inline-block;
    background-color: #3C3C3B;
    padding: 10px;
    transition: 0.2s;
    border-radius: 5px;
}

.tiles i {
    transition: 0.2s;
}

.tiles div:hover i {
    color: #F39200;
}

.tiles div:hover {
    box-shadow: 0 8px 17px 2px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2);
}

.img-resp {
    max-width: 175px;
    height: auto;
    transition: 0.2s ease; 
}

.content center img:hover {
    max-width: 200px;
    height: auto;
}

footer {
    background-color: rgb(13, 12, 12);
    margin: 0;
    border-top: 2px #F39200 solid;
    color: #fff;
}

footer .content {
    padding: 30px;
}

footer .content a {
    display: inline; 
    float: right; 
}

footer .content a:hover {
    margin-right: 1%;
}

footer .content p {
    display: inline;
}

footer .credit {
    background-color: rgb(20, 20, 20);
    padding: 5px;
}

.img-gallery {
    width: 500px;
    height: auto;
    border-radius: 5px;
}