/* Retina-specific stuff here */
@media 
(-webkit-min-device-pixel-ratio: 2), 
(min-resolution: 192dpi) { 
    div.bg-home {
            /*height: 100%;*/
            background: no-repeat;
            background-image: url(../img/image_banner@2x.png);
            background-size: 400px;
            background-position: left bottom;
        }
    
        
    
}
body,
        html {
            height: 100%;
        }
        
        .bg-home {
            height: 100%;
            background: no-repeat;
            background-size: 400px;
            background-image: url(../img/image_banner.png);
            background-position: left bottom;
        }
        
        .video-wrap {
            background-color: black;
            display: none;
            position: absolute;
            top: 0;
            width: 100%;
            height: 100%;
            transition: opacity 0.4s ease-out;
        }
        
        .index-video {
            width: 100%;
            height: 100%;
            overflow: hidden;
            max-width: calc(100vh * 1.77);
            margin: 0 auto;
            position: fixed;
            left: 50%;
            transform: translateX(-50%);
        }
        
        .close-video {
            position: absolute;
            top: 30px;
            right: 20px;
            z-index: 100;
            color: white;
            font-size: 20px;
            cursor: pointer;
        }
        
        .close-video-text {
            position: absolute;
            top: 30px;
            right: 55px;
            z-index: 100;
            color: white;
            font-size: 20px;
        }
        
        .home-content {
            background-color: #003152;
            height: 100%;
            text-align: center;
            padding: 80px 50px 0 0;
            margin-left: 40%;
            color: white;
        }
    .home-content .logo-main {
            
            padding-bottom: 40px
        }
        
        .home-content p {
            padding: 0px 100px 50px 100px;
            font-size: 15px
        }
        
        #go-to-stories {
            color: white;
            font-size: 15px;
            border: 2px white solid;
            padding: 12px;
            margin-bottom: 20px;
        }

        

/* Small only */
@media screen and (max-width: 39.9375em) {
    
    div.bg-home {
            height: auto;
            background: no-repeat;
            background-image: url(../img/image_banner_mobile.png);
            background-position: left bottom;
        }
    
    div.home-content {
            text-align: center;
            padding: 40px 50px 0 10%
        }
    div.home-content h1 {
            font-size: 40px;
        }
    .home-content p {
            padding: 0px 10px 50px 10px;
        }
    
      div.home-content {
            background-color: #003152;
            height: 100%;
            text-align: center;
            padding: 100px 0 0 0;
            margin: 0;
            color: white;
        }
    
}

/* Medium and up */
@media screen and (min-width: 40em) {}

/* Medium only */
@media screen and (min-width: 40em) and (max-width: 63.9375em) {}

/* Large and up */
@media screen and (min-width: 64em) {}

/* Large only */
@media screen and (min-width: 64em) and (max-width: 74.9375em) {}