/*  
Theme Name: Fireproof Games Microsite
Theme URI: http://www.wmelon.co.uk
Description: Theme designed by <a href="http://www.wmelon.co.co">WaterMelon</a>.
Version: 1.0
Author: WaterMelon
Author URI: http://www.wmelon.co.uk*/

/* CSS Document */

@font-face {
    font-family: 'CaslonAnt';
    src: url('fonts/CaslonAnt_ROOM.woff2') format('woff2'),
        url('fonts/CaslonAnt_ROOM.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TrajanPro';
    src: url('fonts/TrajanPro3-Regular.woff2') format('woff2'),
        url('fonts/TrajanPro3-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

html {position: relative;  min-height: 100%; scroll-behavior: smooth; }
body { font-family: 'DM Sans', sans-serif; font-style: normal;  font-size:16px; line-height:23px; color:#FFF; background-color:#000; padding:0px; margin: 0 ; min-height: 100%; overflow-x:hidden; }
.body_container {max-width:1400px; width:auto;  display:block; height:auto; margin:0px auto; padding:0px 50px; position:relative;}
body.live-nav {overflow:hidden !important;}

h1 {font-size:68px;  font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:0px; margin:0px;}
h2 {font-size:48px; line-height:54px; font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:10px 0px 20px; margin:0px;}
h3 {font-size:36px; line-height:39px; font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:10px 0px 20px; margin:0px;}
h4 {font-size:28px; line-height:33px; font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:10px 0px 15px; margin:0px;}
h5 {font-size:22px; line-height:27px; font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:0px 0px 10px; margin:0px;}
h6 {font-size:19px; line-height:22px; font-weight:bold; font-weight: 900;font-style: normal;text-align: left;letter-spacing: -1px;color: #ffffff; display:block; padding:3px 0px 10px; margin:0px;}

h1 img {height:auto; width:170px; padding:0px; }

blockquote {display:block; font-size:50px; line-height: 55px; font-weight:300; font-style:italic;}
blockquote p {display:block; padding:0px; margin:0px 0px 20px;}

a.fade, .fade, .fade img {zoom: 1; filter: alpha(opacity=100); opacity: 1.00; /* -webkit-transition: all 0.2s ease-out;	-moz-transition: all 0.2s ease;	-o-transition: all 0.2s ease; */ }
a.fade:hover, .fade:hover, .fade:hover img {filter: alpha(opacity=80); opacity: 0.80; }
a img {border:none;}
a {color:#c0e85e; text-decoration:none;}
a:hover {color:#a7dc00; text-decoration:none;}

.hidden {opacity:0;}
.content_holder {padding:30px; position:relative; z-index:10;}

header {position:absolute; z-index:20; display:block; width:100%;}
.header_inner {display:flex; width:100%; max-width:1080px; flex-wrap:nowrap; justify-content: space-between; align-items:center; margin:0px auto; padding:0px 15px; box-sizing: border-box;}
h1.fireproof_games_logo {}
h1.fireproof_games_logo img {}
ul.social_links_header {list-style-type:none; padding:0px; margin:0px;}
ul.social_links_header li {display:inline-block; margin:0px 5px; padding:0px;}
ul.social_links_header li a {display:block;}
ul.social_links_header li a img {display:block; zoom: 1; filter: alpha(opacity=100); opacity: 1.00; }
ul.social_links_header li a:hover img {filter: alpha(opacity=80); opacity: 0.80;}

footer {position:relative; z-index:20; display:block; width:100%; display:none; padding:0px 0px 40px;}
.footer_inner {display:block;}
.footer_inner h1.fireproof_games_logo a img {padding:0px 5px 10px;}
span.hashtag {display:block; text-align:center; margin:10px auto; padding:0px;}
ul.social_links_footer {list-style-type:none; margin:0px auto; text-align:center; padding:0px;}
ul.social_links_footer li {display:inline-block; margin:0px 5px; padding:0px;}
ul.social_links_footer li a {display:block;}
ul.social_links_footer li a img { zoom: 1; filter: alpha(opacity=100); opacity: 1.00; }
ul.social_links_footer li a:hover img {filter: alpha(opacity=80); opacity: 0.80;}
.footer_bottom {display:block; width:100%; max-width:1080px; text-align:center; margin:0px auto;}
.footer_bottom h1 {text-align:center; margin:30px auto -20px; padding:0px;}
.footer_bottom h1 a {}
.footer_bottom h1 a img {}
ul.footer_menu {list-style-type:none; font-size: 10px;  font-weight: normal; font-style: normal; text-align: center; color: #ffffff; padding:0px;}
ul.footer_menu li {display:inline; margin:0px 5px 0px 0px;}
ul.footer_menu li:after {content:'|'; margin:0px 0px 0px 5px;}
ul.footer_menu li:last-of-type:after {content:'';}
ul.footer_menu li a {color:#FFF; text-decoration:none;}
ul.footer_menu li a:hover {color:#e2dbb7; text-decoration:underline;}
.trademark {display:block; padding:30px 0px 50px; margin:0px auto; width:100%; max-width:744px; font-size: 10px; line-height:14px; font-weight: normal; font-style: normal; text-align: center; color: #ffffff;}

.landing_block {height:auto; min-height:100vh; box-sizing: border-box; padding:30px 0px;}
.landing_content {}
.main_game_logo {position:absolute; top:40%; left:50%; margin-top:-142px; margin-left:-340px; width:680px; height:auto;}
.main_landing_02 {position:absolute; bottom:15px; width:100%;}
.main_landing_03 {display:flex; width:100%; max-width:1080px; flex-wrap:nowrap; justify-content: space-between; align-items:center; margin:0px auto; padding:0px 5px; box-sizing:border-box;}
ul.landing_logos {list-style-type: none; padding:0px; margin:0px;}
ul.landing_logos li {display:inline; margin:0px 5px;}
ul.landing_logos li img {width:auto; height:75px;}
span.discover {font-family: "CaslonAnt"; font-size: 25px; font-weight: normal; font-style: normal; text-align: center; color: #ffffff; position:relative; padding-right:20px;}
span.discover:after {content:''; width:9px; height:12px; background-image:url(images/arrow2x.png); background-position:center center; background-repeat:no-repeat; position:absolute; right:0px; top:50%; margin-top:-8px; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto;}
span.discover a {color:#FFF;}
span.discover a:hover {text-decoration:underline;}

.page_content {display:block; width:100%; height:auto; min-height:100vh; position:relative; padding:0px; margin:0px auto; text-align:center; background-attachment: scroll; background-position:center top; background-repeat:no-repeat; -webkit-background-size: cover;   -moz-background-size: cover;  -o-background-size: cover;  background-size: cover; background-color:#000;}
.page_content:last-of-type {margin-bottom:0px; min-height:auto; padding-bottom:0px;}
.background_overlay {position:relative; }
.background_overlay:before {content:''; position:absolute; top:0px; left:0px; width:100%; height:100%; background: rgba(3, 8, 6, 0.75);}
.page_content:after {content:''; position:absolute; width:100%; height:438px; bottom:-265px; left:0px;  background-image:url(images/gradient2.png); background-position:center center; background-repeat: repeat-x; z-index:10;}

.page_content:last-of-type footer {display:block;}
.page_content:last-of-type:after {display:none;}

.image_block_01 {height:160vh;}
.black_overlay_fade {background-color:#000; position:absolute; top:0px; left:0px; width:100%; height:100%; z-index:1; opacity:0;}
.image_block_02 {padding:100px 0px 200px;}
.text_block {height:150vh;}

.items_block {}
.trailer_block {background-attachment: fixed; }
.trailer_block .content_holder {min-height:95vh; position:relative; z-index:10;}
.trailer_link  {background-image:url('images/Trailer_heading_mouseoff.png'); background-position: top center; position:absolute; top:50%; left:50%; margin-top:-63px; margin-left:-186px; width:372px; height:126px; background-repeat:no-repeat; background-position:center center; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%}
.trailer_link:hover {background-image:url('images/Trailer_heading_mouseon.png');}

.hide_background_image  {background-color: transparent; background-image:none !important;}
.trailer_bg_video_holder {position:absolute !important; top:0px; left:0px; width:100vw; height:100%; z-index:-1; }
.trailer_bg_video {position:fixed; top:0px; left:0px; width:100%; height:100%; z-index:-1;}
.trailer_bg_video video {width: 100vw; height: 100vh;}

.text_block {background-attachment: fixed;}
.text_block_content {background-color: #000; box-shadow: 0 0 150px 150px #000; display:block; width:95%; height:auto; margin:-380px auto 0px; padding:0px; z-index:30;}
.text_block_content_inner {padding:130px 30px;max-width:1080px; margin:0px auto; text-align:center;}
h2.fancy_title {font-family: "TrajanPro";font-size: 25px;font-weight: normal;font-style: normal;text-align: center;color: #e2dbb7; display:block; position:relative; margin-bottom:30px; padding-bottom:40px; line-height:27px;}
h2.fancy_title:after {content:''; width:313px; height:35px; display:block; position:absolute; bottom:0px; left:50%; margin-left:-157px; background-image:url(images/Heading_decoration_01.png); background-repeat:no-repeat; background-position:center center; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%;}
a.buy_it_now {font-family: "CaslonAnt"; font-size: 25px; font-weight: normal; font-style: normal; text-align: center; text-transform:uppercase; color: #ffffff; position:relative; padding-right:20px;}
a.buy_it_now:after {content:''; width:9px; height:12px; background-image:url(images/arrow2x.png); background-position:center center; background-repeat:no-repeat; position:absolute; right:0px; top:50%; margin-top:-8px; -webkit-background-size: 100% auto; -moz-background-size: 100% auto; -o-background-size: 100% auto; background-size: 100% auto; }
a.buy_it_now:hover {text-decoration:underline;}

.page_content_holder {max-width:750px; margin:0px auto; padding:150px 15px; text-align:left;}
.page_content_holder h2 {font-family: "TrajanPro";font-size: 33px;font-weight: normal;font-style: normal;text-align: center;color: #e2dbb7; display:block; position:relative; margin-bottom:55px; padding-bottom:40px; line-height:27px;}
.page_content_holder h2:after {content:''; width:313px; height:35px; display:block; position:absolute; bottom:0px; left:50%; margin-left:-157px; background-image:url(images/Heading_decoration_01.png); background-repeat:no-repeat; background-position:center center; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%;}
.page_content_holder .page_content {}
.page_content_holder .page_content p { display:block; padding:0px; margin:0px 0px 25px; font-size:15px; line-height:1.3em; text-align:left;}
.page_content_holder .page_content h2 {font-family: "TrajanPro";font-size: 22px;font-weight: normal;font-style: normal;text-align: center;color: #e2dbb7; display:block; position:relative; margin-bottom:30px; padding-bottom:0px; line-height:25px; text-align:left;}
.page_content_holder .page_content h2:after {content:''; display:none !important;}

.text_block_content_inner p {font-family: "CaslonAnt";font-size: 22px; line-height:1.2em; font-weight: normal;font-style: normal;text-align: center;color: #ffffff; margin:0px auto 30px; max-width:850px;}
.block_main_content p {font-family: "CaslonAnt"; font-size: 22px; line-height:1.2em; font-weight: normal; font-style: normal; text-align: center; color: #ffffff; max-width:580px; margin:0px auto 30px;}
ul.items li p {font-family: "CaslonAnt";font-size: 22px; line-height:1.2em; font-weight: normal;font-style: normal;text-align: center;color: #ffffff;}

span.on_sale {display:block; margin-bottom:15px; font-family: "TrajanPro"; font-size: 20px; font-weight: normal; font-style: normal; text-align: center;  text-transform:uppercase; color: #e2dbb7; }
ul.awards {list-style-type: none; padding:30px 0px; margin:0px auto; text-align:center; display:flex; flex-wrap:nowrap; justify-content:center; width:100%; max-width:1080px;}
ul.awards li {display:inline-block; margin:0px 20px; padding:0px;}
ul.awards li a {}
ul.awards li img {height:88px; width:auto;}
ul.items {list-style-type: none; padding:150px 0px 150px; margin:0px auto; text-align:center; display:flex; flex-wrap:nowrap; justify-content:center; align-items:flex-end; width:100%; max-width:1080px;}
ul.items li {display:inline-block; margin:0px 20px; padding:0px; text-align:center;}
ul.items li.nudge_down {position:relative; bottom:-125px;}
ul.items li .item_image {display:block; margin:0px auto 20px; width:auto; height:auto;}
ul.items li .item_image img {width:auto; height:270px;}

li.text_on_side {display:flex !important; align-items:center;}
li.text_on_side img {}
li.text_on_side p { padding:20px; }

.buy_links_holder {display:flex; justify-content:center; margin-bottom:30px;}
.buy_links_holder .buy_link {margin:0px 10px;}
.buy_links_holder span.on_sale { font-size:13px; margin-bottom:10px;}

.star_position {position:absolute; top:221px; left:50%; margin-left:-800px; width:464px; height:auto;}
.medallion_position {position:absolute; top:20px; right:50%; margin-right:-780px; width:377px; height:auto;}

.card_01_position {position:absolute; top:175px; left:50%; margin-left:-700px; width:308px; height:auto;}
.card_02_position {position:absolute; top:-180px; right:50%; margin-right:-720px; width:352px; height:auto;}
.card_03_position {position:absolute; top:190px; right:50%; margin-right:-675px; width:282px; height:auto;}

.key_position {position:absolute; top:221px; left:50%; margin-left:-700px; width:367px; height:auto;}

@media only screen and (max-width: 1300px) {
}

@media only screen and (max-width: 1140px) {
}

@media only screen and (max-width: 989px) {
}

@media only screen and (max-width: 900px) {
    html, body, .block_main_content  {overflow-x: hidden;}
    .header_inner {padding:0px 10px; box-sizing:border-box;}
    ul.social_links_header li {width:12%; margin:0px 1%;}
    ul.social_links_header li a img {width:100%; height:auto;}
    h1 img {width:100%; max-width:125px; height:auto;}
    .main_game_logo {width:90%; height:auto; left:0; margin-left:5%; top:45%;}
    .landing_block {padding:30px !important;}
    .main_landing_02 {width:100%; left:0px; bottom:20px;}
    .main_landing_03 {flex-wrap:wrap; justify-content:space-between; width:100%; margin:0px auto; }
    span.discover {order:10; width:100%; margin-top:20px; padding-right:0px;}
    span.discover:after {content:''; display:none;}
    ul.landing_logos li img {width:auto; height:50px;}
    .text_block {height:auto; padding-bottom:82vh}
    .text_block_content {margin-top:-180px;}
    .text_block_content_inner {padding:20px 0px 110px;}
    ul.awards {display:inline-block;}
    ul.awards li {display:block; width:100%; margin:0px 0px 20px;}
    ul.awards li img {max-width:100%; height:auto;   max-height: 80px; }
    ul.items {display:inline-block;}
    ul.items li {display: flex; width:100%; box-sizing: border-box; flex-align:center; align-items: center; margin:0px 0px 30px;}
    ul.items li.nudge_down {bottom:0;}
    ul.items li .item_image  {display:inline-block;width:30%; height:auto;}
    ul.items li .item_image img {display:block;width:100%; height:auto;}
    ul.items li p {width:66%; padding:0px 20px;}
    ul.items li:nth-child(even) { flex-direction:row-reverse; }
    .trailer_bg_video_holder {display:none !important;}
    .hide_background_image {background-image:var(--bg-image) !important; background-color:#000 !important;}
    .buy_links_holder {display:block;}
    .buy_links_holder .buy_link {margin-bottom:30px;}
    .image_block_02 {padding-bottom:100px;}
    .trailer_link {margin-left:-125px; width:250px; height:85px;}
    .trademark {padding:30px; width:auto;}
    .content_holder { padding:250px 30px 30px;}
    .medallion_position {width:150px; height:auto; top:75px; right:-21px; margin-right:0px;}
    .star_position {width:150px; top:55px; left:-24px; margin-left:0px;}
    .page_content {background-attachment:scroll; -webkit-background-size: auto 100%; -moz-background-size: auto 100%; -o-background-size: auto 100%; background-size: auto 100%;}
    .text_block {-webkit-background-size: 317% auto; -moz-background-size: 317% auto; -o-background-size: 317% auto; background-size: 317% auto; background-position:bottom center;}
    .card_01_position {width:150px; height:auto; top:21px; left:0px; margin-left:-24px;}
    .card_02_position {width:180px; height:auto; top:0px; right:0px; margin-right:-66px;}
    .card_03_position {width:143px; height:auto; top:26px; right:0px; margin-right:66px;}
    footer {padding-top:230px;}
    .key_position {width:200px; bottom:-175px; left:50%; margin-left:-100px; top:auto;}
}

@media only screen and (max-width: 640px) {
}

@media only screen and (max-width: 480px) {
}