html{height:100%;}

body {
        background-color: #000; overflow: hidden; 
        font-family:'VisbyCF-Light';font-weight:normal;font-size:12pt; color:black; overflow-x: hidden;
        margin: 0
    }

    @font-face {
        font-family: 'VisbyCF-Regular';
        src: local('Visby/VisbyCF-Regular.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Regular.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Regular.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Regular.ttf')  format('truetype'); /* Safari, Android, iOS */
    }

    @font-face {
        font-family: 'VisbyCF-Medium';
        src: local('Visby/VisbyCF-Medium.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Medium.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Medium.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Medium.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Medium.ttf')  format('truetype'); /* Safari, Android, iOS */
    }

    @font-face {
        font-family: 'VisbyCF-Light';
        src: local('Visby/VisbyCF-Light.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Light.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Light.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Light.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Light.ttf')  format('truetype'); /* Safari, Android, iOS */
    }


    @font-face {
        font-family: 'VisbyCF-Thin';
        src: local('Visby/VisbyCF-Thin.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Thin.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Thin.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Thin.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Thin.ttf')  format('truetype'); /* Safari, Android, iOS */
    }

    @font-face {
        font-family: 'VisbyCF-Heavy';
        src: local('Visby/VisbyCF-Heavy.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Heavy.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Heavy.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Heavy.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Heavy.ttf')  format('truetype'); /* Safari, Android, iOS */
    }

    @font-face {
        font-family: 'VisbyCF-Bold';
        src: local('Visby/VisbyCF-Bold.eot'); /* IE9 Compat Modes */
        src: url('Visby/VisbyCF-Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
        url('Visby/VisbyCF-Bold.woff2') format('woff2'), /* Super Modern Browsers */
        url('Visby/VisbyCF-Bold.woff') format('woff'), /* Pretty Modern Browsers */
        url('Visby/VisbyCF-Bold.ttf')  format('truetype'); /* Safari, Android, iOS */
    }





.layer_bg{
  position: fixed;top: 50%;left: 0;width: 100%; height:100%; -webkit-transform: translate(0,-50%);
    transform: translate(0, -50%);
}

.lua{height: 90%; position: absolute; top: 50%; -webkit-transform: translate(0,-50%);
    transform: translate(0, -50%);}

.logo_svg{fill:#fff; width:18vw;}
.logo_top{position: absolute; left:0; top: 40%; width:100%;text-align: center;}

.logo_top .molds {color:#DA291C;}
.logo_top .casting {color:#DE7C00;}
.logo_top .metals {color:#707372;}

.logo_top a span {font-size: 16px; font-family: 'VisbyCF-Light'; letter-spacing: 3px; line-height: 30px;  padding:12px; width: 280px; display: inline-block; margin:0 auto; margin-bottom: 10px;}
.logo_top .molds span {border:1px solid #DA291C;}
.logo_top .casting span {border:1px solid #DE7C00;}
.logo_top .metals span {border:1px solid #707372;}

.logo_top a:hover {text-decoration: none;}
.logo_top a span:hover{text-decoration: none; color:white;  transition: all 800ms linear;}
.logo_top .molds span:hover {background-color: #DA291C;}
.logo_top .casting span:hover {background-color: #DE7C00;}
.logo_top .metals span:hover {background-color: #707372;}



.tagline {position: absolute; left:0; top: 75%; width:100%;text-align: center;}
.tagline span{font-size: 22px; font-family: 'VisbyCF-Light'; letter-spacing: 3px; line-height: 30px; color:white; display: inline-block; width: 300px;}

@media screen and (min-width: 441px) and (max-width: 680px) {
  .lua{width: 100vw;}
 
  .logo_svg{width:200px;}
 /*.lua {height: unset; max-width: 95%; max-height: 90%;}
 .logo_svg{width:50vw;}*/

}


@media screen and (min-width: 0px) and (max-width: 440px) {
  .lua{width: 100vw;}
 
  .logo_svg{width:200px;}
 /*.lua {height: unset; max-width: 95%; max-height: 90%;}
 .logo_svg{width:50vw;}*/

}