@import url('https://fonts.googleapis.com/css?family=Poppins');
/*------------------------------*/
/* ------ site wide styles -----*/ 
/*------------------------------*/
html {
  height: 100%;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  position: relative;
  margin: 0;
  min-height: 100%;
    padding-bottom: 4.5rem;
	font-family: 'Poppins', sans-serif;
	font-size: 16px;
}
p, li {
	color: #6c6c6f;
	font-size: 0.875em;
}
h1, h2, h3, h4, h5, h6 {
	color: #323233;
	text-transform: uppercase;
}

/* ------- text colours ------- */
.yellow-text {
	color: #fed136;
}
.gold-text {
	color: #C7A323;
}
.gold-text a {
	color: #C7A323;
	text-decoration: none;
}
/* ---------- padding ---------- */
.padding-t-5 {
	padding-top: 5px;
}
.padding-t-10 {
	padding-top: 10px;
}
.padding-t-15 {
	padding-top: 15px;
}
.pt-7{
    padding-top: 5rem;
}

.padding-b-20 {
	padding-bottom: 20px;
}
.padding-b-40 {
	padding-bottom: 40px;
}
/* ---------- margin ---------- */
.margin-t-5 {
	margin-top: 5px;
}
.margin-t-10 {
	margin-top: 10px;
}
.margin-t-15 {
	margin-top: 15px;
}
.mt-7{
    margin-top: 5rem !important;
}


/* ---------- center align content ---------- */

.center-align-text {
	text-align: center;
}
.center-align-content {
	margin: auto 0;
}


/* ------- center align content end  ------- */


.cursor-style{
	cursor: pointer;
}
button.close span{
	color: #DAA520 !important;
}

/* ---------- buttons ---------- */
.red-button{
    background-color: #F44336;
    color: #ffffff;
}
.gold-button{
	background-color: #FFD700;
	color: #000000;
	border-radius: 0px;
}

.gold-button:hover{
	background-color: transparent;
	color: #000000;
	border-color: #FFD700;
}

.back-to-band-members button{
	font-size: 1.2em;
}

.back-to-band-members a {
	text-decoration: none;
}

/*-------------------------------------*/
/* ------ standard card elements ------*/ 
/*-------------------------------------*/

.card{
	border-radius: 0px;
}
.card-body{
	padding: 1rem;
}

/*------------------------------*/
/* ------ footer elements ------*/ 
/*------------------------------*/

footer {
    background-color: #191917;
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
}
active footer p {
	color: #ffffff;
}
.social-icons {
	color: #ffffff;
}
.social-icons:hover {
	color: #fed136;
}

.dpp{
	color: #ffffff; 
	text-decoration: none;
	padding-right: 8px;
	font-size: 0.875em;
}

.dpp:hover {
	color: #fed136;
	text-decoration: none;
}
/* ----------------------------- */
/* ---------- nav bar ---------- */
/* ----------------------------- */



/* ---------- animated toggle buttons ---------- */
.icon-bar {
	width: 22px;
	height: 2px;
	background-color: #fed136;
	display: block;
	transition: all 0.2s;
	margin-top: 4px
}
.navbar-toggler {
	border: none;
	background: transparent !important;
}
.navbar-toggler .top-bar {
	transform: rotate(45deg);
	transform-origin: 10% 10%;
}
.navbar-toggler .middle-bar {
	opacity: 0;
}
.navbar-toggler .bottom-bar {
	transform: rotate(-45deg);
	transform-origin: 10% 90%;
}
.navbar-toggler.collapsed .top-bar {
	transform: rotate(0);
}
.navbar-toggler.collapsed .middle-bar {
	opacity: 1;
}
.navbar-toggler.collapsed .bottom-bar {
	transform: rotate(0);
}
/* -------- end animated toggle buttons -------- */

.navbar-brand span {
	color: #fed136;
	font-size: 25px;
	font-weight: 700;
	letter-spacing: 0.1em;
}
.navbar-brand {
	color: #fff;
	font-size: 25px;
	font-weight: 700;
	letter-spacing: 0.1em;
}
.navbar-nav .nav-item .nav-link {
	padding: 1.1em 1em!important;
	font-size: 115%;
	font-weight: 500;
	letter-spacing: 1px;
	color: #fff;
}
.navbar-nav .nav-item .nav-link:hover {
	color: #fed136;
}
.navbar-expand-lg .navbar-nav .dropdown-menu {
	border-top: 3px solid #fed136;
}
.dropdown-item:hover {
	background-color: #000000;
	color: #fed136;
}
nav {
	-webkit-transition: padding-top .3s, padding-bottom .3s;
	-moz-transition: padding-top .3s, padding-bottom .3s;
	transition: padding-top .3s, padding-bottom .3s;
	border: none;
	background-color: #191917;
}
nav li {
	font-size: 13px;
}
nav li a {
	font-size: 13px;
}
.navbar-nav .nav-item .nav-link {
	padding: 1.1em 1em!important;
	font-size: 100%;
	font-weight: 500;
	letter-spacing: 0px;
}
.navbar-dark .navbar-nav .active>.nav-link, .navbar-dark .navbar-nav .nav-link.active {
	color: #fed136;
}
.shrink {
	padding-top: 0;
	padding-bottom: 0;
	background-color: #191917;
}
.banner {
	background-image: url("../images/main-logo.jpg");
	text-align: center;
	color: #fff;
	background-repeat: no-repeat;
	background-attachment: scroll;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 400px;
}
.banner-text {
	padding: 200px 0 150px 0;
}
.banner-heading {
	font-family: 'Lobster', cursive;
	font-size: 75px;
	font-weight: 700;
	line-height: 100px;
	margin-bottom: 30px;
	color: #fff;
}
.banner-sub-heading {
	font-family: 'Libre Baskerville', serif;
	font-size: 30px;
	font-weight: 300;
	line-height: 30px;
	margin-bottom: 50px;
	color: #fff;
}
.btn-banner {
	padding: 5px 20px;
	border-radius: 10px;
	font-weight: 700;
	line-height: 1.5;
	text-align: center;
	color: #fff;
	text-transform: uppercase;
}
.text-intro {
	width: 90%;
	margin: auto;
	text-align: center;
	padding-top: 30px;
}
.navbar-nav .nav-item .nav-link {
	font-size: 120%;
	padding: 1em !important;
}

.dropdown-menu {
	border: none;
	border-radius: 0;
}



/* ----------------------------- */
/* ---- normal content ---- */
/* ----------------------------- */


.facebook-live-stream{
	opacity: 1;
}

.facebook-live-stream:hover{
	cursor: pointer;
	opacity: 0.8;
}


.col-6-half-cover{
	opacity: 1;
}

.col-6-half-cover:hover{
	cursor: pointer;
	opacity: 0.5;
}

/* ----------------------------- */
/* ---- nav bar mobile view ---- */
/* ----------------------------- */

@media (max-width:992px) {
.navbar-nav {
	background-color: #000;
	border-top: 1px solid #fed136;
	border-bottom: 1px solid #fed136;
	color: #fff;
	z-index: 1;
	margin-top: 5px;
}
.navbar-nav .nav-item .nav-link {
	padding: 0.6em 1em!important;
	font-size: 130%;
	font-weight: 500;
	text-align: center;
}
.dropdown-item {
	text-align: center;
	font-size: 105%;
}
.banner-text {
	padding: 150px 0 150px 0;
}
.banner-heading {
	font-size: 30px;
	line-height: 30px;
	margin-bottom: 20px;
}
.banner-sub-heading {
	font-size: 10px;
	font-weight: 200;
	line-height: 10px;
	margin-bottom: 40px;
}
}

@media (max-width:768px) {
.banner-text {
	padding: 150px 0 150px 0;
}
.banner-sub-heading {
	font-size: 23px;
	font-weight: 200;
	line-height: 23px;
	margin-bottom: 40px;
}
}

/* ------------------------------ */
/* -------- contact us ------- */
/* ------------------------------ */

.img-fixed-height {
    object-fit: cover;
    width: 100%;
    max-height: 200px;
}

.info-card-border{
    border: 0px;
}

/* ------------------------------ */
/* -------- cd page ------- */
/* ------------------------------ */


 .cd-card-body-border{
    border: 0px !important;
    
}

/* ------------------------------ */
/* -------- modal  -------------- */
/* ------------------------------ */

.modal{
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 767px) {

    .modal {
        text-align: center;
    }

}


/* ------------------------------ */
/* -------- media queries ------- */
/* ------------------------------ */

/* ------------------------------ */
/* -- index social media plugins -- */
/* ------------------------------ */


@media (max-width: 767px) {
.facebook-hide-desktop {
	display: none !important;
}
.facebook-show-mobile {
	display: block !important;
	text-align: center;
}
.twitter-timeline {
	width: 90% !important;
	margin: 0 auto;
}
	.center-align-text-mob {
	text-align: center !important;
}
	.mob-margin-b-10 {
	margin-bottom: 10px !important;
}
    	.mob-margin-b-20 {
	margin-bottom: 20px !important;
}
    .mob-padding-b-10{
        padding-bottom: 10px !important;
    }
        .mob-padding-b-20{
        padding-bottom: 20px !important;
    }
		.mob-margin-b-20 {
	margin-bottom: 20px !important;
}
	.desktop-hide-content{
		display: none;
	}
	.mobile-show-content{
		display: block !important;
	}

}

@media (max-width: 768px) {
		.mobile-hide-content{
		display: none;
	}
}


@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : portrait) { 
	.ipad-display-none{
		display: none !important;
	}
	.card-img-overlay { 
	text-align: center;
}
	.card-img-overlay a{
		float: none !important;
	}
}