main {
	/* Accounts for navbar header */
	position:relative;
	top:48px;
	/* Accounts for navbar footer */
	margin-bottom: 56px;


}

body {
	text-align: center;
	background-color: black;

}

h1 {
	font-family: 'Abel', sans-serif;
	font-size: 36px;
	font-weight: normal;
	margin-bottom: 15px;
	}

.card {
	border-color: #774C77;
}

.card-header {
	background-color: #3D003D;
	color: white;
	font-family: 'Quicksand', sans-serif;
	border-bottom: 3px solid #774C77;
}

.card-img-top {
    width: 100%;
    height: 23vw;
    object-fit: cover;
}

.container {
	background-color: white;
}
/* FONTS */
.super {
	font-family: 'Supermercado One', cursive;
}

.nunito {
	font-family: 'Nunito', sans-serif;
}

.modak {
	font-family: 'Modak', cursive;
}

.quicksand {
	font-family: 'Quicksand', sans-serif;
}
/* End Fonts */

/* Parallax */

.bgimg-1, .bgimg-2, .bgimg-3, .bgimg-4 {
    position: relative;
    opacity: 1;
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}

.bgimg-1 {
    background-image: url(clarinet.jpg);
		min-height: 350px;
}

.bgimg-2 {
    background-image: url(band.jpg);
    min-height: 350px;
}

.bgimg-3 {
    background-image: url(electronic1.jpg);
    min-height: 350px;
}

.bgimg-4 {
    background-image: url(about.jpg);
    min-height: 350px;
}

.caption {
	position: absolute;
	left: 0;
	top: 50%;
	width: 100%;
	text-align: center;
	color: #774C77;
	border-color: black;
}

.caption span.border {
    background-color: #3D003D;
    color: #fff;
    padding: 20px;
    letter-spacing: 3px;
		font-size: 36px;

}

/* End parallax */

nav.bottom {
	border-bottom: 3px solid #774C77;
}

nav.top {
	border-top: 3px solid #774C77;
}

.borderA{
	border: solid;
	border-width: 1px;
	border-color: gray;
}


.video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/* responsive design */
@media only screen and (min-width:576px){
        /* styles for browsers larger than 576px; */
    }

@media only screen and (min-width:768px){
        /* styles for browsers larger than 768px, a bootstrap custom size; */
				main {
					/* Accounts for navbar header */
					position:relative;
					top:63px;
					/* Accounts for navbar footer */
					margin-bottom: 56px;
				}
    }
@media only screen and (min-width:992px){
        /* styles for browsers larger than 992px; */
    }
@media only screen and (min-width:1200px){

    }
@media only screen and (max-device-width:480px){
       /* styles for mobile browsers smaller than 480px; (iPhone) */
    }
@media only screen and (device-width:768px){
       /* default iPad screens */
    }
    /* different techniques for iPad screening */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
      /* For portrait layouts only */
    }

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
      /* For landscape layouts only */
    }