@font-face {font-family: "Play-Regular"; 
	src: local("Play-Regular"), url("../fonts/Play-Regular.woff2") format("woff2"), url("../fonts/Play-Regular.woff") format("woff"), url("../fonts/Play-Regular.ttf") format("truetype");}
@font-face {font-family: "Play-Bold"; 
	src: local("Play-Bold"), url("../fonts/Play-Bold.woff2") format("woff2"), url("../fonts/Play-Bold.woff") format("woff"), url("../fonts/Play-Bold.ttf") format("truetype");}

@media screen and (max-width: 850px) {
	.main .title {font-size: 60px !important; line-height: 22px !important;}
	.main .title img {width: 420px !important;}
	.main .info b {font-size: 23px !important; line-height: 44px !important;}
	.main .info span {font-size: 15px !important;}
	.main:before {width: 102px !important; height: 120px !important; top: -150px !important; right: 54% !important;}
	.main:after {width: 120px !important; height: 120px !important; top: -150px !important; left: 52% !important;}
	.gradient .bottom {padding: 35px 0 !important;}
	.gradient .bottom .flex.work {font-size: 20px !important;}
}

body {text-align: center; font-style: normal; color: #d8a743; background-color: black; margin: 0 0 0 0;}
video {position: absolute; z-index: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.75; display: flex; justify-content: center; align-items: center; overflow: hidden;}
.gradient {position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; display: block; 
	background-image: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.7) 100%);}
.gradient .bottom {transition: padding 0.3s ease-in-out; position: absolute; display: flex; bottom: 0; width: 100%; padding: 50px 0;}
.gradient .bottom .flex {transition: flex 0.3s ease-in-out, font-size 0.3s ease-in-out; flex: 2 1 0px; padding: 15px;}
.gradient .bottom .flex.work {flex: 2 1 0px; font-size: 24px; background-image: url("../images/work.png"); text-transform: uppercase; color: white;}

.play-regular {font-family: "Play-Regular", sans-serif; font-style: normal;}
.play-bold {font-family: "Play-Bold", sans-serif; font-style: normal;}

.main {position: fixed; z-index: 2; top: 47%; left: 0; width: 100%; padding: 0 0 0 0;}
.main .title {transition: font-size 0.4s ease-in-out, line-height 0.4s ease-in-out; 
	display: block; width: 100%; font-size: 100px; line-height: 35px; color: white; text-transform: uppercase; padding: 20px 0; text-shadow: 3px 11px rgba(0, 0, 0, 0.5), -3px 11px rgba(0, 0, 0, 0.5);}
.main .title img {transition: width 0.4s ease-in-out; width: 580px;}
.main .info b {transition: font-size 0.4s ease-in-out, line-height 0.4s ease-in-out; color: white; font-size: 32px; font-weight: 400; line-height: 60px; text-transform: uppercase; text-shadow: black 1px 3px;}
.main .info span {transition: font-size 0.4s ease-in-out; font-size: 21px; text-shadow: black 1px 3px;}
.main:before {transition: width 0.4s ease-in-out, height 0.4s ease-in-out, top 0.4s ease-in-out, right 0.4s ease-in-out; 
	content: ""; background-image: url("../images/95_odshb.svg.png"); background-size: 100% 100%; width: 170px; height: 200px; display: inline-block; position: absolute; right: 53%; top: -230px;}
.main:after {transition: width 0.4s ease-in-out, height 0.4s ease-in-out, top 0.4s ease-in-out, right 0.4s ease-in-out;
	content: ""; background-image: url("../images/dshv.png"); background-size: auto 100%; width: 200px; height: 200px; display: inline-block; position: absolute; left: 51%; top: -230px;}