<?php include("lp_source.php"); ?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>What would you do if...</title>
<link rel="canonical" href="https://whatwouldyoudoif.se/" />
<link rel="stylesheet" href="whatwould.css">
<link rel="apple-touch-icon" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<link rel="apple-touch-icon" sizes="72x72" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<link rel="apple-touch-icon" sizes="114x114" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<link rel="stylesheet" type="text/css" href="style.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<link rel="stylesheet" type="text/css" href="stylesheet.css"/>
<link rel="apple-touch-icon" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<link rel="apple-touch-icon" sizes="72x72" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<link rel="apple-touch-icon" sizes="114x114" href="http://whatwouldyoudoif.se/faviconapple.ico"/>
<meta name="description" content="Asking some of the most brainbreaking questions of humanity. Play the game!" />
<title>What would you do if...?</title>
<meta property="og:site_name" content="What would you do if.se"/>
<meta property="og:title" content="What would you do if...?"/>
<meta property="og:description" content="Asking some of the most brainbreaking questions of humanity. Play the game!"/>
<meta property="og:image" >
<meta property="og:url" content="http://www.whatwouldyoudoif.se/">
<meta property="og:type" content="game"/>
</head>
<body>
<div class="pageContentWrapper">
<div class="circle">
<h2> <a href="loading.html">Play</a></h2>
</div>
<div id="bg">
</div>
<a href="https://www.facebook.com/whatwouldyoudoif.se/">
<div id="facebook">
<img src="http://whatwouldyoudoif.se/facebook-logo.png" height="42" width="42">
</div>
</a>
<a href="https://twitter.com/morbidyourather">
<div id="twitter">
<img src="http://whatwouldyoudoif.se/twitter-logo-silhouette.png" height="42" width="42">
</div>
</a>
<div class="footer">
<h5 id="footerlinks">
<a href="/">Play</a>
<a href="about-sub/index.html">About</a>
<a href="contact-sub/index.html">Contact</a>
</h5>
<h5 class="le">Linderoth & Eklund<br>2025<br>
</h5>
</div>
</div>
<script type='text/javascript'>
$(document).ready(function() {
$('input[name=radios]').change(function(){
$('form').submit();
$("p").text("Loading...");
});
});
</script>
<script type="text/javascript">
var _gauges = _gauges || [];
(function() {
var t = document.createElement('script');
t.type = 'text/javascript';
t.async = true;
t.id = 'gauges-tracker';
t.setAttribute('data-site-id', '5761c0c1bb922a614a001251');
t.setAttribute('data-track-path', 'https://track.gaug.es/track.gif');
t.src = 'https://d36ee2fcip1434.cloudfront.net/track.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(t, s);
})();
</script>
</body>
<style type="text/css">
#twitter{
position:absolute;
z-index:2;
right:0;
margin-right:10px;
bottom:0px;
transition: 0.3s;
}
#facebook{
position:absolute;
bottom:0px;
transition: 0.3s;
z-index:1;
}
#facebook:hover{
opacity:0.2;
transition: 0.3s;
z-index:1;
}
#twitter:hover{
opacity:0.2;
transition: 0.3s;
z-index:2;
}
.le {
font-size:8px;
text-align:center;
font-family: sans-serif;
font-style: normal;
overflow:hidden;
position:relative;
z-index: 3;
padding-top: 0px;
padding-bottom:0px;
color:#a8b3bd;
}
.footer {
position:absolute;
top:100%;
bottom:1;
margin-top:-2px;
left:0;
right:0;
padding-top:8px;
padding:1px;
background-color:#1a0000;
text-align:center;
z-index:0;
border-top:2px solid orange;
}
#footerlinks{
text-decoration:none;
color:white;
font-size:13px;
text-align:center;
font-family: sans-serif;
font-style: normal;
word-spacing: 15px;
}
h2 a:hover {
color:#f39c12;
font-size:13vw;
border-radius:10%;
text-align:middle;
font-family: Arial, Helvetica, sans-serif;
margin:0 auto;
z-index:1;
position:relative;
padding-top: 42%;
transition: 0.3s;
}
input[type="radio"] {
width:2.5vw;
height:2.5vw;
text-align:middle;
vertical-align: middle;
margin:-14px 4px 0 0;
background-color:white;
cursor:pointer;
}
body {
height: 100%;
}
body {
background-color: #EEE;
}
#saveForm {
position: relative;
top: -43px;
left: 410px;
}
.circle{
width:50%;
height:1vh;
border-radius:50%;
text-align:center;
background:#1a0000;
padding-bottom:48%;
margin:0 auto;
overflow:hidden;
position:relative;
z-index:0;
}
#val {
margin: auto;
height:0.01%;
text-align:center;
padding-top:1vw;
padding-bottom: 1px;
position:inherit;
font-size:2vw;
z-index:3;
color:white;
font-family:Arial, Helvetica, sans-serif;
line-height: 2.8;
}
#val1 {
width:100%;
border-radius:0%;
text-align:middle;
background:#f39c12;
padding-bottom:5%;
padding-top:7.5%;
text-overflow:ellipsis;
margin-top: 0.5vw;
position:absolute;
font-size:2vw;
z-index:2;
color:white;
}
.val2 {
width:100%;
border-radius:0%;
text-align:middle;
font-size:2vw;
background:#e67e22;
padding-bottom:6%;
padding-top:6.2%;
margin-top: 6.6vw;
position:absolute;
z-index:1;
color:white;
}
.val3 {
width:100%;
font-size:2vw;
border-radius:0%;
text-align:middle;
background:#d35400;
padding-bottom:6%;
padding-top:6%;
margin-top: 12.3vw;
overflow:hidden;
position:absolute;
z-index:0;
color:white;
}
.orange {
width:100%;
border-radius:10%;
text-align:center;
padding-bottom:2vw;
padding-top:15vw;
margin:0 auto;
overflow:hidden;
position:absolute;
z-index:0;
color:white;
font-family:Arial, Helvetica, sans-serif;
display:none;
}
h1 {
border-radius:55%;
color:white;
font-size:3vw;
position: relative;
padding-top:10%;
font-style: italic;
text-align: center;
margin:0 auto;
z-index:0;
}
p {
border-radius:50%;
color:white;
font-size:2vw;
position: relative;
padding-top:4%;
padding-bottom:1%;
font-style: italic;
text-align: center;
margin:0 auto;
z-index:10;
}
h2 {
font-size:10vw;
vertical-align: middle;
text-align:middle;
font-family: Arial, Helvetica, sans-serif;
color:white;
margin:0 auto;
z-index:1;
position:relative;
padding-top: 30%;
transition: -0.3s;
}
h3 {
font-size:1.5vw;
text-align:middle;
font-family: sans-serif;
color:white;
margin:middle;
overflow:hidden;
position:static;
z-index: 2;
padding-top: 2%;
}
a {
color: white;
text-decoration: none;
}
.twitter-follow-button {
float:right;
}
</style>
</html>