@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Benne&display=swap');

body {
    background-color: black;
    /*font-family: 'EB Garamond', serif;*/
    /*font-family: gill-sans-nova, sans-serif;*/
    /*font-family: 'Open Sans', sans-serif;*/
    font-family: 'viaplay_sansregular';
    font-weight: 400;
    /*text-shadow: 2px 2px #000000;*/
}
html {
    scroll-behavior: smooth;
}

.font-garamond {
    background-color: black;
    font-family: 'EB Garamond', serif;
}

/*h1, h2, h3, h4, h5, h6 {*/
/*    font-family: 'Gothic A1', sans-serif;*/
/*    font-weight: 700;*/
/*}*/

h1 {
    font-family: 'Gothic A1', sans-serif;
    font-weight: 700;
    font-size: 3rem;
}

.parallax-window {
    min-height: 60vh;
    background: transparent;
}

hr {
    border-top:2px solid rgba(255, 255, 255, 0.51);
}

.navbar-black {
    /*background-color: #000!important;*/
}

.bg-black {
    background-color: #000!important;
}

.section-spacer {
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.cursor-pointer{
    cursor: pointer;
}
.videoLink {
}
.background-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.parallax-align-left {
    background-position-x: left!important;
}

.parallax-align-right {
    background-position-x: right!important;
}

.trailer-thumb {
    border: 2px solid #212d33;
}

.trailer-thumb:hover {
    border: 2px solid rgb(214,8,128);
}

.bar1, .bar2, .bar3 {
    width: 35px;
    height: 5px;
    background-color: #ffffff;
    margin: 6px 0;
    transition: 0.4s;
}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-9px, 6px);
    transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px);
    transform: rotate(45deg) translate(-8px, -8px);
}

.burger-button {
    padding: 1rem;
    background: rgba(0, 0, 0, 0.35);
    z-index: 99999;
    cursor: pointer;
}

.burger-button:hover {
    padding: 1rem;
    background: rgb(0, 0, 0);
    z-index: 99999;
    transition: .25s;
}

.imdb-button {
    max-height: 32px;
    margin-left:1rem;
    margin-right:1rem;
}

.known-for {
    font-size: 1.25rem;
    color: gray;
    border-left: 4px solid gray;
}

.actor-name {
    /*font-size: 1.25rem;*/
    color: gray;
}

.ar-container {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    background-size: cover;
    background-position: center;
}

.ar-4x3 {
    padding-top: 75%;
}

.hover-border {
    border: 1px solid black;
    transition: 150ms;
}

.hover-border:hover {
    border: 1px solid white;
}

.metadata-heading {
    /*background: -webkit-linear-gradient(#d6057c, #e12022);*/
    /*-webkit-background-clip: text;*/
    /*-webkit-text-fill-color: transparent;*/
    color: #dc1552;
}


.divider {
    height:2rem;
    background-color: #212d33;
}

a.no-underline:hover {
    text-decoration: none;
}

.contact-bg {
    background: rgb(214,8,128);
    background: linear-gradient(90deg, rgba(214,8,128,1) 0%, rgba(227,37,23,1) 100%);
}

.text-outline {
    -webkit-text-stroke-width: 2px;
    -webkit-text-stroke-color: #dc1552;
}

.dream-heading {
    font-size: 3rem;
    /*-webkit-text-stroke-width: 2px;*/
    /*-webkit-text-stroke-color: #dc1552;*/
    /*-webkit-text-stroke-color: #ffffff;*/
    color:white;
    /*font-family: 'Benne', serif;*/
    font-family: 'viaplay_sans_outlinem';
    text-transform: uppercase;
    line-height: 1;
}

p {
    font-size: 1.15rem;
}

.pink-div {
    background: rgb(214,8,128);
    background: linear-gradient(90deg, rgba(214,8,128,1) 0%, rgba(227,37,23,1) 100%);
    height: 4px;
    width: 150px;
    margin-bottom: 1.5rem;
}

.white-div {
    background: rgb(255,255,255);
    height: 4px;
    width: 150px;
    margin-bottom: 1.5rem;
}


.btn-outline-dream {
    color: rgb(214,8,128);
    border-color: rgb(214,8,128);
}

.btn-outline-dream:hover {
    color: rgb(255,255,255);
    background: linear-gradient(90deg, rgba(214,8,128,1) 0%, rgba(227,37,23,1) 100%);
}

.laurel-bg {
    background-image: url('/images/dreamer/laurel-corner.png');
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 50%;
}