/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
    color: #fff;
}

/* Custom default button */
.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
    color: #333;
    text-shadow: none; /* Prevent inheritance from `body` */
    background-color: #fff;
    border: .05rem solid #fff;
}

#mainLogo {
    margin-top: 11px;
    max-width: 60%;
}

@media (min-width: 768px) {
    #mainLogo {
        margin-top: 60px;
        max-width: 100%;
    }
}

/*
 * Base structure
 */

html,
body {
    height: 100%;
    background-color: black;
}

body {
    color: #fff;
}

main {
    overflow: hidden;
    padding: 0 !important;
}

#drawer {
    background-color: black;
}

#backgroundable-content {
  background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fbanner.png");
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-position: center top;
  background-size: contain;
  padding-top: 200px;
}

@media (min-width: 992px) {
    #backgroundable-content {
      /*padding-top: 450px;*/
      padding-top: 20%;
    }
}

/*
@media (min-width: 1200px and min-height: 1200px) {
    #backgroundable-content {
      padding-top: 550px;
    }
}
*/

.show-more-link {
    display: block;
    padding-left: 0;
    margin-left: 0;
    font: normal normal 300 12px/12px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}


.cover-container {
    max-width: 42em;
}

@media (min-width: 48em) {
  .masthead-brand {
      float: left;
  }
  .nav-masthead {
      float: right;
  }
}

.video-iframe {

    width: 100%;
}

@media (min-width: 768px) {
    .video-iframe {
        width: 640px;
        height: 360px;
    }
}

@media (min-width: 992px) {
    .video-iframe {
        width: 740px;
        height: 416px;
    }
}

@media (min-width: 1200px) {
    .video-iframe {
        width: 860px;
        height: 484px;
    }
}

@media (min-width: 1400px) {
    .video-iframe {
        width: 1200px;
        height: 675px;
    }
}

#drawerButtonHolder {
    height: 25px;
    margin-top: -25px;
}

#drawerButton {
    width: 26px;
    height: 25px;
    margin-left: 38px;
    background-color: #9E9E9E;
}

#drawerButton i {
    width: 16px;
    height: 16px;
}

.sidenav {
    background-color: none;
    overflow: hidden;
    display: inline-block;
    width: auto;
    margin: 26px auto 12px auto;
}

.sidenav a {
    float: left;
    display: block;
    background-color: none;
    text-align: center;
    padding: 10px 30px;
    text-decoration: none;
    text-align: center;
    font: normal normal 500 28px/34px Roboto;
    letter-spacing: 0.32px;
    color: #FFFFFF;
    text-transform: uppercase;
}

@media only screen and (min-height: 968px) {
    .sidenav a {
        padding: 20px 30px;
    }
}

.topnav {
    background-color: none;
    overflow: hidden;
    display: inline-block;
    width: auto;
    margin: 26px auto 12px auto;
}

.topnav a {
    float: left;
    display: block;
    background-color: none;
    text-align: center;
    padding: 4px 20px;
    text-decoration: none;
    text-align: center;
    font: normal normal 500 16px/21px Roboto;
    letter-spacing: 0.32px;
    color: #FFFFFF;
    text-transform: uppercase;
}

@media only screen and (max-width: 550px) {
    .topnav a {
        padding: 4px 6px;
    }
}

#nav-holder {
    width:100%;
}

.topnav a:first-of-type {
    padding-left: 0;
}

.topnav a:last-of-type {
    padding-right: 0;
}

.live-image {
    width: 442px;
    height: 84px;
}


.content-box {
    background-color: black;
}

#content {
    margin-bottom:28px;
    width: 90%;
}

#footer {
    box-shadow: 0px -5px 1px 0px #98191E80;
    margin-top: 14px;
    padding: 50px;
    padding-top: 20px;
    margin-bottom: 200px;
}

#contentHeader {
    text-align: center;
    color: #FFFFFF;
    padding-top: 28px;
    padding-bottom: 20px;
    font: normal normal 600 26px/36px Lora;
    letter-spacing: 0.74px;
}

@media only screen and (min-width: 768px) {
    #contentHeader {
        text-align: left;
        padding-left: 50px;
        padding-bottom: 30px;
        font: normal normal 600 37px/47px Lora;
    }
}


#contentBody {
    padding-bottom: 40px;
}

@media only screen and (min-width: 992px) {
    #contentBody {
        padding-left: 50px;
    }
}

.news-image {
    width: 260px;
    height: 160px;
}

.news-date {
    padding-top: 12px;
    text-align: left;
    font: normal normal 500 14px/30px Lora;
    color: #C9252F;
    letter-spacing: 0px;
    width: 260px;
}

.news-title {
    text-align: left;
    font: normal normal 700 28px/36px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
    text-transform: uppercase;
    width: 260px;
}

.news-text {
    text-align: left;
    font: normal normal 400 16px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
    width: 260px;
}

.events-text {
    text-align: left;
    font: normal normal 400 16px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}
.date-day {
    display: block;
    height: auto;
    text-align: left;
    font: normal normal 700 60px/79px Roboto;
    letter-spacing: 1.2px;
    color: #7E7E7E;
}
.date-month {
    text-align: left;
    font: normal normal 400 30px/39px Roboto;
    letter-spacing: 6px;
    color: #7E7E7E;
}

.date-year {
    display: block;
    height: auto;
    text-align: left;
    font: normal normal bold 20px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.date-link {
    display: block;
    height: auto;
    text-align: right;
}

.date-link a {
    text-decoration: underline;
    font: normal normal bold 20px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
    text-align: right;
}

.news-cell {
}

@media only screen and (min-width: 720px) {
    .news-image {
    }
}


@media only screen and (max-width: 720px) {
    .news-text {
    }
    .date-day {
        font: normal normal 600 40px/56px Lora;
        letter-spacing: 0.8px;
        line-height: 40px;
    }
    .date-month {
        font: normal normal 600 10px/18px Lora;
        letter-spacing: 2px;
    }
    .news-cell {
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .news-image {
    }
    .live-image {
        padding-left: 15px;
    }
}

.footer-header {
    text-align: left;
    font: normal normal 700 22px/30px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
}

.footer-menu-item {
    text-align: left;
    font: normal normal 500 16px/20px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
    text-decoration: none;
}

#mailing-list-anchor {
    text-decoration: underline;
    font: normal normal 700 16px/20px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}


@media only screen and (min-width: 720px) and (max-width: 1200px) {
    .footer-header {
        font: normal normal 700 20px/20px Roboto;
        padding-bottom:5%;
    }
    .footer-menu-item {
        font: normal normal 500 14px/14px Roboto;
    }

    #mailing-list-anchor {
        font: normal normal 700 14px/14px Roboto;
    }
}

#footer-bottom {

    border-top: 1px solid #707070;
    margin-top: 18px;
    padding-top: 13px;
}

.event-row {
    padding-top: 20px;
}

.event-text {
    padding-top: 20px;
}

.event-title {
    text-align: left;
    font: normal normal 700 24px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
            line-clamp: 2;
    -webkit-box-orient: vertical;
}


.event-place {
    text-align: left;
    font: normal normal 400 18px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* number of lines to show */
            line-clamp: 2;
    -webkit-box-orient: vertical;
}

.event-details {
    text-align: left;
    font: normal normal 400 18px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

.tickets-button {
    width: 80px;
    height: 30px;
    background: #C9252F 0% 0% no-repeat padding-box;
    box-shadow: -3px 3px 2px #98191E7F;
    border: 1px solid #98191E7F;
    text-align: left;
    font: normal normal 700 14px/19px Roboto;
    letter-spacing: 0.28px;
    color: #000000;
    margin: 5px;
    text-transform: uppercase;
    text-align: center;
    border-radius: 20px;
}

.fb-button {
    width: 80px;
    height: 30px;
    background: #7E7E7E 0% 0% no-repeat padding-box;
    box-shadow: -3px 3px 2px #98191E7F;
    border: 1px solid #98191E7F;
    text-align: left;
    font: normal normal 700 14px/19px Roboto;
    letter-spacing: 0.28px;
    color: #000000;
    margin: 5px;
    text-transform: uppercase;
    text-align: center;
    border-radius: 20px;
}

.small-date {
    text-align: left;
    font: normal normal 700 16px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.small-titleplace {
    text-align: left;
    font: normal normal 700 18px/24px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
}

.small-details {
    text-align: left;
    font: normal normal 400 14px/22px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

.small-tickets-button {
    background: #C9252F 0% 0% no-repeat padding-box;
    border: 1px solid #98191E7F;
    height: 30px;
    width: 80px;
    border-radius: 20px;
    text-align: center;
    font: normal normal bold 12px/16px Roboto;
    letter-spacing: 0.24px;
    color: #000000;
    text-transform: uppercase;
}

.small-fb-button {
    background: #7E7E7E 0% 0% no-repeat padding-box;
    border: 1px solid #7E7E7E;
    height: 30px;
    width: 80px;
    border-radius: 20px;
    text-align: center;
    font: normal normal bold 12px/16px Roboto;
    letter-spacing: 0.24px;
    color: #000000;
    text-transform: uppercase;
}

#band-photos {
    margin-left: auto;
    margin-right: auto;
}

#band-info-members-list {
    color: #C9252F;
}

#contacts-form {
    background: #000000 0% 0% no-repeat padding-box;
}

#contact-holder {
    width: 100%;
    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 0 !important;
    padding-right: 0 !important;
}

.music-release {
    margin-top: 20px;
    margin-bottom: 20px;
}

.image-container {
    width: 290px;
    height: 290px;
}


@media only screen and (min-width: 420px) {
    .image-container {
        width: 390px;
        height: 390px;
    }
}

.music-release h1 {
    text-align: left;
    font: normal normal 600 20px/30px Lora;
    letter-spacing: 0px;
    color: #C9252F;
    width:80%;
    display: inline;
    margin-bottom:0;
}

.music-release .timeframe {
    text-align: right;
    font: normal normal 600 20px/30px Lora;
    letter-spacing: 0px;
    color: #7E7E7E;
    display: inline;
    width:20%;
    padding-right: 13%;
    float:left;
}

.music-release .release-description {
    text-align: left;
    font: normal normal 500 20px/30px Lora;
    letter-spacing: 0px;
    color: #7E7E7E;
    padding-left: 3%;
}

.music-release .releases-play {
    font-size: 30px;
    position: absolute;
    bottom:20px;
    right:15px; 
    width:30px;
    height:30px;
    color: white;
}
.band-photo-filler {
    width: 100px;
    height: 250px;
}

.band-photo-name {
    text-align: center;
    font: normal normal 700 24px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.band-photo-role {
    text-align: center;
    font: normal normal 500 20px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

#photo-mera {
    margin-right:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Fmera.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

#photo-alex {
    margin-left:20px;
    margin-right:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Falex.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

#photo-ani {
    margin-left:20px;
    margin-right:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Fani.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

#photo-bratoev {
    margin-left:20px;
    margin-right:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Fbratoev.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

#photo-kolev {
    margin-left:20px;
    margin-right:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Fkolev.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

#photo-eddie {
    margin-left:20px;
    background-image: url("/?originalUrl=https%3A%2F%2Fdeadscapeofficial.com%2Fimages%2Fband%2Feddie.png");
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
}

.band-info-p {
    text-align: left;
    font: normal normal 400 16px/22px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

#band-info {
    margin-top: 40px;
    margin-bottom: 20px;
}

.music-release-name {
    text-align: center;
    font: normal normal 700 24px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.buy-music-button {
    width: 115px;
    height: 30px;
    background: #C9252F 0% 0% no-repeat padding-box;
    border: 1px solid #98191E7F;
    border-radius: 20px;
    opacity: 1;
    font: normal normal 700 14px/19px Roboto;
    letter-spacing: 0.28px;
    color: #000000;
    text-transform: uppercase;
}

.stream-music-button {
    width: 115px;
    height: 30px;
    background: #7E7E7E 0% 0% no-repeat padding-box;
    border: 1px solid #98191E7F;
    border-radius: 20px;
    opacity: 1;
    font: normal normal 700 14px/19px Roboto;
    letter-spacing: 0.28px;
    color: #000000;
    text-transform: uppercase;
}

.contact-form-label {
    text-align: left;
    font: normal normal 500 16px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.asterisk {
    color: #FF0000;
}

#contact-form-submit-button {
    width: 99px;
    height: 30px;
    background: #C9252F 0% 0% no-repeat padding-box;
    border: 1px solid #98191E7F;
    border-radius: 50px;
    font: normal normal 700 14px/19px Roboto;
    letter-spacing: 0.28px;
    color: #000000;
}

.contact-form-hint {
    text-align: left;
    font: normal normal 400 16px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}


.contact-form-heading {
    text-align: left;
    font: normal normal 500 26px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}

.contact-form-access-promo-heading {
    text-align: left;
    font: normal normal 500 21px/25px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
}
.contact-form-primary {
    text-align: left;
    font: normal normal 500 20px/30px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
}
.contact-form-secondary {
    font: normal normal 400 20px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

.contact-card {
    margin-left: 5px;
    padding-left: 0;
    padding-bottom: 20px;
    margin-bottom: 10px;
}

@media only screen and (min-width: 720px) {
    .contact-card {
        width: 85%;
    }
}

.contact-card-underline {
    border-bottom: 1px solid #303030;
}

.link-button {
    width: 151px;
    height: 39px;
    background: #C9252F 0% 0% no-repeat padding-box;
    border: 1px solid #98191E7F;
    border-radius: 50px;
    font: normal normal 700 18px/24px Roboto;
    text-transform: uppercase;
    letter-spacing: 0.28px;
    color: #000000;
}

.link-button-a {
    width: 99px;
}

.links-holder-row {
    width: 100%;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
}

.links-title {
    text-align: center;
    font: normal normal 300 22px/30px Roboto;
    letter-spacing: 0px;
    color: #C9252F;
    
}

.btn-link {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
    background: #212121;
    border-radius: 10px;
    width: 100%;
    padding: 0;
    padding-left: 7px;
    margin: 0;
    text-align: left;
    line-height: 45px;
    height: 45px;
    text-decoration: none;
}

.btn-link span {
    height: 45px;
    line-height: 45px !important;
    display: inline-block;
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    font: normal normal 300 14px/12px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
}

.btn-link img {
    height: 20px;
    width: 20px;
    padding-right: 5px;
    margin-bottom: 5px;
    display: none;
}

@media only screen and (min-width: 768px) {
    .btn-link {
        margin-top: 15px;
        margin-bottom: 15px;
        height: 30px;
        line-height: 30px;
        width: 95%;
    }

    .btn-link span {
        height: 30px;
        line-height: 30px !important;
        width: 80%;
        font: normal normal 300 24px/26px Roboto;
    }
    .btn-link img {
        display: block;
    }
}


@media only screen and (min-width: 400px) {
    .btn-link {
        height: 80px;
        line-height: 80px;
    }

    .btn-link span {
        height: 80px;
        line-height: 80px;
    }
}

@media only screen and (min-width: 400px) and (max-width: 1200px) {
    .btn-link span {
        font: normal normal 600 13px/18px Lora;
    }

    .btn-link img {
        display: inline-block;
        margin: 0;
        margin-bottom: 10px;
        height: 40px;
        width: 40px;
    }
}

@media only screen and (min-width: 1200px) {
    .btn-link span {
        font: normal normal 600 15px/20px Lora;
    }

    .btn-link img {
        display: inline-block;
        margin: 0;
        margin-bottom: 10px;
        height: 55px;
        width: 55px;
    }
}


.news-body {
    padding: 0;
    display: inline;
}

#privacy-policy h1 {
    text-align: left;
    font: normal normal medium 31px/66px Lora;
    letter-spacing: 0px;
    color: #C9252F;
}


#privacy-policy h2 {
    text-align: left;
    font: normal normal bold 30px/36px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
    text-transform: uppercase;
}

#privacy-policy h3 {
    text-align: left;
    font: normal normal bold 30px/36px Roboto;
    letter-spacing: 0px;
    color: #FFFFFF;
}

#privacy-policy p {
    text-align: left;
    font: normal normal normal 20px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}

#privacy-policy strong {
    color: #AAAAAA;
}

#privacy-policy ul {
    text-align: left;
    font: normal normal normal 20px/30px Roboto;
    letter-spacing: 0px;
    color: #7E7E7E;
}