html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display: block;}
body { line-height: 1;font-family: Arial;overflow: hidden;max-width: 100%;}
ol,ul { list-style: none;}
blockquote,q { quotes: none;}
blockquote:before,blockquote:after,q:before,q:after { content: ''; content: none;}
table { border-collapse: collapse; border-spacing: 0;}
input{outline: none;}
* { -webkit-tap-highlight-color:rgba(0,0,0,0); }
strong{font-weight: bold;}
body {
background: none repeat 0 0 #ECECEC;
-ms-user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
overflow: hidden;
}
#footer {
height: 100px;text-align: center;
}
#wrapGame {
position: relative;
}
.clearboth {clear: both;}
.svg, .emoji {
display: inline-block;
width: 20px;
height: 20px;
color: #FFF;
vertical-align: middle;
text-align: center;
overflow: hidden;
content: "";
background-size: contain;
background-position: center center;
background-repeat: no-repeat;
text-indent: -9999px;
}
.emoji {
width: 26px !important;
height: 16px !important;
vertical-align: bottom;
}
.smallImg {
width: 50px;
float: left;
margin: 0 20px 3px 0;
clear: both;
}
#footerB {
display: inline-block;
vertical-align: top;
height: 100px;
width: 48%;
}
.adBanner {
display: inline-block;
height: 100px;
line-height: 100px;
min-width: 10px;
width: 100%;
}
.adBanner ins {
margin: 0 auto;
vertical-align: middle;
display: inline-block;
}
#wrapNavigation {
display: inline-block;
vertical-align: middle;
height: 56px;
overflow-x: auto;
padding: 10px 2px;
overflow-y: hidden;
width: 48%;
margin-top: 13px;
}
ul#navigation {
display: inline-block;
vertical-align: middle;
height: 56px;
overflow: hidden;
width: 695px;
}
ul#navigation li {
display: inline-block;
margin-bottom: 20px;
font-size: 20px;
font-family: Impact, Charcoal, sans-serif;
}
#galleryTitle {
color: #004f75;
}
ul#navigation li a {
display: block;
text-decoration: none;
color: #004f75;
background: url(img/pranks.png) no-repeat top left #FFF;
height: 40px;
padding: 3px 8px 3px 45px;
line-height: 40px;
box-shadow: 2px 2px 4px #aaa;
margin: 0 3px;
border-radius: 10px;
-webkit-transition: all .5s;
transition: all .5s;
}
ul#navigation li a:hover {
box-shadow: 4px 4px 4px #3a3a3a;
}
ul#navigation li a#nav1 { background-position: 0 0; }
ul#navigation li a#nav2 { background-position: 0 -77px; }
ul#navigation li a#nav3 { background-position: 0 -157px; }
ul#navigation li a#nav4 { background-position: 0 -237px; }
ul#navigation li a#nav5 { background-position: 0 -317px; }
ul#navigation li a#nav6 { background-position: 0 -397px; }
#imagePreloader {
position: fixed;
top: 0;
right: 0;
opacity: 0.1;
}
#imagePreloader span {
display: inline-block;
}
#imagePreloader span img {
width: 1px;
}
h1 {
font-size: 25px;
font-family: Impact, Charcoal, sans-serif;
margin: 0 0 5px;
}
h2 {
font-size: 20px;
font-family: Impact, Charcoal, sans-serif;
margin: 15px 0 5px;
font-weight: bold;
}
h3 {
font-size: 40px;
text-shadow: none;
font-family: Impact, Charcoal, sans-serif;
color: #004f75;
letter-spacing: normal;
}
#soundOn, .soundOnIcon {
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='UTF-8' standalone='no'?%3E%3Csvg xmlns:dc='http://purl.org/dc/elements/1.1/' xmlns:cc='http://web.resource.org/cc/' xmlns:rdf='http://www.w3.org/1999/02/22-rdf-syntax-ns%23' xmlns:svg='http://www.w3.org/2000/svg' xmlns='http://www.w3.org/2000/svg' xml:space='preserve' version='1.0' id='layer1' width='400pt' height='400pt' viewBox='0 0 75 75'%3E%3Cmetadata id='metadata1'%3E%3Crdf:RDF%3E%3Ccc:Work rdf:about=''%3E%3Cdc:format%3Eimage/svg+xml%3C/dc:format%3E%3Cdc:type rdf:resource='http://purl.org/dc/dcmitype/StillImage' /%3E%3C/cc:Work%3E%3C/rdf:RDF%3E%3C/metadata%3E%3Cg id='g1'%3E%3Cpolygon id='polygon1' points='39.389,13.769 22.235,28.606 6,28.606 6,47.699 21.989,47.699 39.389,62.75 39.389,13.769' style='stroke:%23000000;stroke-width:7;stroke-linejoin:round;fill:%23555555;' /%3E%3Cpath id='path1' d='M 48.128,49.03 C 50.057,45.934 51.19,42.291 51.19,38.377 C 51.19,34.399 50.026,30.703 48.043,27.577' style='fill:none;stroke:%23004F75;stroke-width:7;stroke-linecap:round'/%3E%3Cpath id='path2' d='M 55.082,20.537 C 58.777,25.523 60.966,31.694 60.966,38.377 C 60.966,44.998 58.815,51.115 55.178,56.076' style='fill:none;stroke:%23004F75;stroke-width:7;stroke-linecap:round'/%3E%3Cpath id='path1' d='M 61.71,62.611 C 66.977,55.945 70.128,47.531 70.128,38.378 C 70.128,29.161 66.936,20.696 61.609,14.01' style='fill:none;stroke:%23004F75;stroke-width:7;stroke-linecap:round'/%3E%3C/g%3E%3C/svg%3E");
width: 30px;
margin: -10px 0 0 -5px;
height: 30px;
}
#soundOff, .soundOffIcon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' style='enable-background:new 0 0 58 58;' xml:space='preserve' width='58' height='58'%3E%3Crect id='backgroundrect' width='100%25' height='100%25' x='0' y='0' fill='none' stroke='none'/%3E%3Cg class='currentLayer' style=''%3E%3Ctitle%3ELayer 1%3C/title%3E%3Ccircle style='fill:%23D62F40;' cx='29' cy='29' r='29' id='svg_1'/%3E%3Cpath style='fill:%23FFFFFF;' d='M22.427,20h-8.323C12.942,20,12,20.942,12,22.104v12.793C12,36.058,12.942,37,14.104,37h8.323 c0.375,0,0.743,0.1,1.067,0.29L36.83,49.706C38.232,50.531,40,49.52,40,47.893V9.107c0-1.627-1.768-2.638-3.17-1.813L23.494,19.71 C23.17,19.9,22.802,20,22.427,20z' id='svg_2'/%3E%3Cpath style='' d='M50.947632651388645,9.962 c-0.43600000000000005,-0.5 -0.8840000000000001,-0.992 -1.36,-1.468 s-0.9680000000000001,-0.924 -1.468,-1.36 L7.2156326513886455,48.038 c0.43600000000000005,0.5 0.8840000000000001,0.992 1.36,1.468 s0.9680000000000001,0.924 1.468,1.36 L50.947632651388645,9.962 z' id='svg_3' class='selected' stroke-width='4' stroke='%23242424' stroke-opacity='1' fill='%23000000' fill-opacity='1'/%3E%3C/g%3E%3C/svg%3E");
width: 30px;
height: 30px;
margin: -9px 0 0 0;
}
p {
margin-bottom: 10px;
font-size: 15px;
font-family: Arial, Helvetica, sans-serif;
line-height: 16px;
clear: both;
}
.hidden {display: none !important;}
.landscape #topBottomDir, .portrait #leftRightDir {display: none;}
#article {
display: none;
text-align: left;
padding: 15px 10px;
max-width: 740px;
margin: auto;
height: 305px;
overflow-y: auto;
}
#article img {
vertical-align: middle;
}
.inlineBlock {
display: inline-block;
}
#closeArticle {
display: none;
position: fixed;
top: 10px;
right: 25px;
font-weight: bold;
background: #025077;
color: #FFF;
width: 25px;
height: 25px;
line-height: 25px;
text-align: center;
border-radius: 20px;
font-size: 20px;
}
#wrapper {
position: relative;
width: 100%;
background: #eee;
}
#wrapdebug {
position: absolute; display: none;
top: 0;
right: 0;
padding: 10px;
width: 200px;
min-height: 30px;
background: #ccc;
font-size: 12px;
font-weight: bold;
}
#shadowToPreventCanvasClick {
position: fixed;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: transparent;
display: none;
}
.bug {
position: absolute;
}
.bug img {
width: 100%;
}
#angle {
width: 50px;
}
.inputLabel {
font-size: 20px;
letter-spacing: -0.1px;
vertical-align: middle;
font-family: Impact, Charcoal, sans-serif;
}
.mobileInputLabel {
display: none;
}
#score {
font-family: "Courier New", Courier, monospace;
position: absolute;
right: 10px;
font-size: 35px;
bottom: 2px;
color: #FFF;
font-weight: bold;
text-shadow: 3px 3px 0 #004F75, 3px -3px 0 #004F75, -3px 3px 0 #004F75, -3px -3px 0 #004F75, 3px 0px 0 #004F75, 0px 3px 0 #004F75, -3px 0px 0 #004F75, 0px -3px 0 #004F75;
padding: 10px 0 0 0;
}
#wrapScore {
height: 0;
width: 100%;
}
.wrapInput {
padding: 10px 0;
text-align: right;
}
.settingRow {
vertical-align: middle;
-webkit-transition: all .5s;
transition: all .5s;
margin: 20px 0;
color: #004F75;
font-size: 23px;
font-family: "Arial Black", Gadget, sans-serif;
/*text-shadow: 3px 3px 0 #004F75, 3px -3px 0 #004F75, -3px 3px 0 #004F75, -3px -3px 0 #004F75, 3px 0px 0 #004F75, 0px 3px 0 #004F75, -3px 0px 0 #004F75, 0px -3px 0 #004F75;*/
line-height: 25px;
letter-spacing: 1px;
display: inline-block;
padding: 10px 25px;
}
.settingTiles {
width: 200px;
}
.narrowSettingTiles {
width: 100px;
}
.logo {
width: 200px;
vertical-align: top;
margin: 0 0 20px;
cursor: pointer;
font-weight: bold;
text-align: left;
}
#pickBugs div, #pickBackground div, #pickDirection div {
display: inline-block;
background: #b0d8e4;
position: relative;
overflow: hidden;
width: 70px;
margin: 1px;
height: 70px;
border-radius: 20px;
border: 1px solid #888;
}
#settingScroll {
display: block;
}
#pickBackground #corkwoodBG, #wrapGame.bg1 { background-image: url(img/bg1.jpg); }
#pickBackground #grassBG, #wrapGame.bg2 { background-image: url(img/bg2.jpg); }
#pickBackground #canvasBG, #wrapGame.bg3 { background-image: url(img/bg3.jpg); }
#pickBackground #greyBG, #wrapGame.bg4 { background-image: url(img/bg4.jpg); }
#pickBackground #noBG { }
#pickBugs div.active, #pickBackground div.active, #pickDirection div.active {
box-shadow: 0px 0px 0px 3px #004F75;
border: 1px solid #004F75;
background: #EEE;
}
#pickBugs div:hover, #pickBackground div:hover, #pickDirection div:hover {
border: 1px solid #004F75;
}
#pickDirection span {
font-weight: bold;
font-size: 60px;
text-shadow: none;
color: #004F75;
display: inline-block;
position: absolute;
top: 18px;
left: 10px;
}
#randomDir span:nth-child(1) {
top: 25px;
left: -11px;
transform: rotate(65deg);
}
#randomDir span:nth-child(2) {
top: 20px;
left: 14px;
transform: rotate(-114deg);
}
#pickBugs div img {
position: absolute;
top: 0;
left: 0;
}
#allBugsSelect img:nth-child(1) {
transform: rotate(-10deg);
top: -8px;
width: 75px;
left: -26px;
}
#allBugsSelect img:nth-child(2) {
transform: rotate(-63deg);
top: -7px;
left: 20px;
width: 51px;
}
#allBugsSelect img:nth-child(3) {
transform: rotate(120deg);
top: 15px;
left: 16px;
width: 75px;
}
#allBugsSelect img {
width: 60px;
}
#pickBugs div img#selectCockroach {
width: 100px;
top: -20px;
left: -15px;
}
#pickBugs div img#selectFly {
width: 60px;
top: 8px;
left: 5px;
}
#pickBugs div img#selectSpider {
width: 100px;
top: -20px;
left: -13px;
}
/* Popup box BEGIN */
#stickTop{
cursor:pointer;
display:none;
position:fixed;
text-align:center;
top:0;
width:100%;
z-index:10000;
}
#deathOff, .deathOffIcon {
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 50 50' style='enable-background:new 0 0 50 50;' xml:space='preserve'%3E%3Cpath style='fill:%23E81224;' d='M24.85,10.126c2.018-4.783,6.628-8.125,11.99-8.125c7.223,0,12.425,6.179,13.079,13.543 c0,0,0.353,1.828-0.424,5.119c-1.058,4.482-3.545,8.464-6.898,11.503L24.85,48L7.402,32.165c-3.353-3.038-5.84-7.021-6.898-11.503 c-0.777-3.291-0.424-5.119-0.424-5.119C0.734,8.179,5.936,2,13.159,2C18.522,2,22.832,5.343,24.85,10.126z'/%3E%3C/svg%3E");
height: 28px;
width: 28px;
margin: -5px 0 0 0;
}
#deathOn, .deathOnIcon {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg height='512pt' viewBox='0 0 512 512' width='512pt' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m512 256c0 141.386719-114.613281 256-256 256s-256-114.613281-256-256 114.613281-256 256-256 256 114.613281 256 256zm0 0' fill='%23f74b4b'/%3E%3Cpath d='m202.703125 238.980469h106.59375v172.519531h-106.59375zm0 0' fill='%23e2e6e7'/%3E%3Cpath d='m441 223.339844c-7-116.664063-95-223.226563-185-223.226563s-178 106.5625-185 223.226563c-7 116.660156 141 216.660156 185 216.660156s192-100 185-216.660156zm0 0' fill='%233e4852'/%3E%3Cpath d='m386.144531 190.851562c0 71.878907-58.265625 130.144532-130.144531 130.144532s-130.144531-58.265625-130.144531-130.144532c0-71.878906 58.265625-130.144531 130.144531-130.144531s130.144531 58.265625 130.144531 130.144531zm0 0' fill='%232e3b43'/%3E%3Cpath d='m373.789062 361.972656h-235.578124c-36.535157 0-68.273438 22.261719-81.675782 54.476563 46.925782 58.261719 118.832032 95.550781 199.464844 95.550781s152.539062-37.289062 199.464844-95.546875c-13.40625-32.21875-45.140625-54.480469-81.675782-54.480469zm0 0' fill='%233e4852'/%3E%3Cpath d='m71 223.339844c-3.125 52.101562 24.671875 100.871094 60.304688 138.902344-33.589844 2.601562-62.21875 24.039062-74.769532 54.210937 39.1875 48.652344 95.804688 82.660156 160.367188 92.558594 5.828125-32.609375 28.59375-53.558594 44.105468-64.367188 5.75-4.003906 5.058594-12.660156-1.253906-15.710937-60.164062-29.085938-154.371094-111.96875-148.753906-205.59375 6.480469-107.992188 82.367188-207.320313 165-221.488282h-.003906c-1.558594-.265624-3.125-.5-4.691406-.707031-.214844-.03125-.433594-.054687-.648438-.082031-1.25-.15625-2.496094-.304688-3.746094-.414062-.445312-.039063-.886718-.085938-1.332031-.121094-1.230469-.105469-2.464844-.179688-3.699219-.246094-.386718-.019531-.773437-.046875-1.160156-.0625-1.574219-.066406-3.144531-.105469-4.71875-.105469-90 0-178 106.5625-185 223.226563zm0 0' fill='%232e3b43'/%3E%3Cpath d='m396.0625 187.789062c0-77.351562-62.707031-140.058593-140.054688-140.0625-77.625 0-141.183593 64.527344-140.054687 142.144532.414063 28.308594 9.230469 54.582031 24.0625 76.441406 2.320313 3.421875 6.15625 5.511719 10.289063 5.511719h34.855468c6.804688 0 12.320313 5.515625 12.320313 12.320312v37.511719c0 6.804688 5.515625 12.320312 12.324219 12.320312h92.394531c6.808593 0 12.324219-5.515624 12.324219-12.320312v-37.511719c0-6.804687 5.515624-12.320312 12.320312-12.320312h34.855469c4.128906 0 7.960937-2.082031 10.28125-5.5 15.195312-22.398438 24.082031-49.429688 24.082031-78.535157zm0 0' fill='%23fbfcf7'/%3E%3Cpath d='m170.011719 266.3125c-14.828125-21.863281-23.644531-48.132812-24.058594-76.441406-1.054687-72.570313 54.445313-133.699219 125.113281-141.335938-4.949218-.527344-9.972656-.804687-15.058594-.808594-77.625 0-141.183593 64.527344-140.054687 142.144532.414063 28.308594 9.230469 54.582031 24.058594 76.441406 2.324219 3.421875 6.15625 5.511719 10.292969 5.511719h30c-4.136719 0-7.96875-2.089844-10.292969-5.511719zm0 0' fill='%23e2e6e7'/%3E%3Cpath d='m236.257812 195.042969c0 21.410156-17.359374 38.765625-38.769531 38.765625-21.410156 0-38.765625-17.355469-38.765625-38.765625 0-21.410157 17.355469-38.765625 38.765625-38.765625 21.410157 0 38.769531 17.355468 38.769531 38.765625zm0 0' fill='%233e4852'/%3E%3Cpath d='m353.308594 195.042969c0 21.410156-17.355469 38.765625-38.765625 38.765625-21.410157 0-38.765625-17.355469-38.765625-38.765625 0-21.410157 17.355468-38.765625 38.765625-38.765625 21.410156 0 38.765625 17.355468 38.765625 38.765625zm0 0' fill='%233e4852'/%3E%3Cg fill='%23c1ccd0'%3E%3Cpath d='m223 271.824219c-4.140625 0-7.5 3.359375-7.5 7.5v54.652343h15v-54.652343c0-4.140625-3.359375-7.5-7.5-7.5zm0 0'/%3E%3Cpath d='m256 271.824219c-4.140625 0-7.5 3.359375-7.5 7.5v54.652343h15v-54.652343c0-4.140625-3.359375-7.5-7.5-7.5zm0 0'/%3E%3Cpath d='m289 271.824219c-4.140625 0-7.5 3.359375-7.5 7.5v54.652343h15v-54.652343c0-4.140625-3.359375-7.5-7.5-7.5zm0 0'/%3E%3C/g%3E%3C/svg%3E");
height: 34px;
width: 34px;
margin: -6px 0 0 0;
}
#soundToggle, #deathToggle, #helpToggle, #adsToggle {
cursor: pointer;
font-size: 30px;
text-shadow: none;
opacity: 0.75;
color: #222;
display: inline-block;
background: #FFF;
font-weight: bold;
border-radius: 20px;
height: 40px;
width: 40px;
vertical-align: middle;
line-height: 40px;
text-align: center;
margin-left: 10px;
}
.soundOntrue #soundOff, .soundOnfalse #soundOn, .deathOntrue #deathOff, .deathOnfalse #deathOn, .hideHelp #helpOn, .showHelp #helpOff {
display: none;
}
#soundToggle:hover, #deathToggle:hover, #helpToggle:hover, #adsToggle:hover {
opacity: 1;
}
#adsToggle {
font-size: 14px;
letter-spacing: -0.3px;
}
#adsToggle.hideads{ background-color: #ffa1a1; }
#adsToggle.showads{ }
#settings {
background-color: rgba(255,255,255,0.8);
overflow: hidden;
box-shadow: 0 0px 50px #000;
position: relative;
vertical-align: middle;
border-radius: 0 0 28px 28px;
padding: 15px 1%;
text-align: center;
}
#settingsClose {
background-color: #ffffff;
border-radius: 50px;
cursor: pointer;
display: inline-block;
font-weight: bold;
position: relative;
top: -10px;
color: #004F75;
font-size: 25px;
line-height: 37px;
width: 40px;
height: 40px;
text-align: center;
}
#settingsCloseOpen {
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' id='Capa_1' x='0px' y='0px' viewBox='0 0 268.765 268.765' style='enable-background:new 0 0 268.765 268.765;' xml:space='preserve' width='512px' height='512px'%3E%3Cg id='Settings'%3E%3Cg%3E%3Cpath style='fill-rule:evenodd;clip-rule:evenodd;' d='M267.92,119.461c-0.425-3.778-4.83-6.617-8.639-6.617 c-12.315,0-23.243-7.231-27.826-18.414c-4.682-11.454-1.663-24.812,7.515-33.231c2.889-2.641,3.24-7.062,0.817-10.133 c-6.303-8.004-13.467-15.234-21.289-21.5c-3.063-2.458-7.557-2.116-10.213,0.825c-8.01,8.871-22.398,12.168-33.516,7.529 c-11.57-4.867-18.866-16.591-18.152-29.176c0.235-3.953-2.654-7.39-6.595-7.849c-10.038-1.161-20.164-1.197-30.232-0.08 c-3.896,0.43-6.785,3.786-6.654,7.689c0.438,12.461-6.946,23.98-18.401,28.672c-10.985,4.487-25.272,1.218-33.266-7.574 c-2.642-2.896-7.063-3.252-10.141-0.853c-8.054,6.319-15.379,13.555-21.74,21.493c-2.481,3.086-2.116,7.559,0.802,10.214 c9.353,8.47,12.373,21.944,7.514,33.53c-4.639,11.046-16.109,18.165-29.24,18.165c-4.261-0.137-7.296,2.723-7.762,6.597 c-1.182,10.096-1.196,20.383-0.058,30.561c0.422,3.794,4.961,6.608,8.812,6.608c11.702-0.299,22.937,6.946,27.65,18.415 c4.698,11.454,1.678,24.804-7.514,33.23c-2.875,2.641-3.24,7.055-0.817,10.126c6.244,7.953,13.409,15.19,21.259,21.508 c3.079,2.481,7.559,2.131,10.228-0.81c8.04-8.893,22.427-12.184,33.501-7.536c11.599,4.852,18.895,16.575,18.181,29.167 c-0.233,3.955,2.67,7.398,6.595,7.85c5.135,0.599,10.301,0.898,15.481,0.898c4.917,0,9.835-0.27,14.752-0.817 c3.897-0.43,6.784-3.786,6.653-7.696c-0.451-12.454,6.946-23.973,18.386-28.657c11.059-4.517,25.286-1.211,33.281,7.572 c2.657,2.89,7.047,3.239,10.142,0.848c8.039-6.304,15.349-13.534,21.74-21.494c2.48-3.079,2.13-7.559-0.803-10.213 c-9.353-8.47-12.388-21.946-7.529-33.524c4.568-10.899,15.612-18.217,27.491-18.217l1.662,0.043 c3.853,0.313,7.398-2.655,7.865-6.588C269.044,139.917,269.058,129.639,267.92,119.461z M134.595,179.491 c-24.718,0-44.824-20.106-44.824-44.824c0-24.717,20.106-44.824,44.824-44.824c24.717,0,44.823,20.107,44.823,44.824 C179.418,159.385,159.312,179.491,134.595,179.491z' fill='%23004F75'/%3E%3C/g%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E");
height: 30px;
width: 30px;
margin-top: -2px;
}
#bugColony {
background-image: url("data:image/svg+xml;charset=utf8,%3C?xml version='1.0' encoding='iso-8859-1'?%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Capa_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve'%3E%3Cg%3E%3Cpolygon style='fill:%23333333;' points='59.826,499.161 31.195,490.07 57.991,405.681 135.482,375.251 146.463,403.213 82.291,428.411 '/%3E%3Cpolygon style='fill:%23333333;' points='119.726,242.272 57.991,218.03 31.195,133.641 59.826,124.549 82.291,195.299 130.706,214.311 '/%3E%3Cpolygon style='fill:%23333333;' points='21.485,365.75 0,344.755 59.099,284.281 125.216,284.281 125.216,314.32 71.745,314.32 '/%3E%3C/g%3E%3Cg%3E%3Cpolygon style='fill:%231A1A1A;' points='452.174,499.161 429.709,428.411 365.538,403.213 376.518,375.251 454.01,405.681 480.805,490.07 '/%3E%3Cpolygon style='fill:%231A1A1A;' points='392.274,242.272 381.294,214.311 429.71,195.299 452.174,124.549 480.806,133.641 454.01,218.03 '/%3E%3Cpolygon style='fill:%231A1A1A;' points='490.515,365.75 440.255,314.32 386.785,314.32 386.785,284.281 452.901,284.281 512,344.755 '/%3E%3C/g%3E%3Cpath style='fill:%23333333;' d='M232.424,82.304h-30.04V60.363c0-9.641-7.843-17.484-17.484-17.484v-30.04 c26.205,0,47.524,21.319,47.524,47.524V82.304z'/%3E%3Cpath style='fill:%231A1A1A;' d='M309.617,82.304h-30.04V60.363c0-26.205,21.319-47.524,47.524-47.524v30.04 c-9.641,0-17.484,7.843-17.484,17.484V82.304z'/%3E%3Cpath style='fill:%23FFA900;' d='M256,470.049L256,470.049c-76.853,0-139.156-62.302-139.156-139.155V191.739h278.311v139.156 C395.156,407.748,332.853,470.049,256,470.049z'/%3E%3Cpath style='fill:%23FF8800;' d='M256,470.049L256,470.049c0-60.156,0-278.311,0-278.311h139.155v139.156 C395.156,407.748,332.853,470.049,256,470.049z'/%3E%3Cpath style='fill:%234D4D4D;' d='M256,60.495L256,60.495c-54.267,0-98.26,43.992-98.26,98.26v54.615h196.521v-54.615 C354.261,104.488,310.268,60.495,256,60.495z'/%3E%3Cpath style='fill:%23333333;' d='M256,60.495L256,60.495c0,36.901,0,152.875,0,152.875h98.261v-54.615 C354.261,104.488,310.268,60.495,256,60.495z'/%3E%3Cpolygon style='fill:%23FF8800;' points='395.156,191.739 116.845,191.739 256,304.585 '/%3E%3Cpolygon style='fill:%23E47700;' points='395.156,191.739 256,191.739 256,304.585 '/%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3Cg%3E%3C/g%3E%3C/svg%3E");
width: 23px;
height: 23px;
}
#bugSpeed {
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg height='512pt' viewBox='0 0 512 512' width='512pt' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m256 0c-140.699219 0-256 114.300781-256 255s115.300781 257 256 257 256-116.300781 256-257-115.300781-255-256-255zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m512 255c0 140.699219-115.300781 257-256 257v-512c140.699219 0 256 114.300781 256 255zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m298.898438 262.5 125.703124 90c-12.003906 20.699219-27.902343 39-46.5 54l-122.101562.300781h-122.101562c-14.699219-12-27.597657-26.101562-38.398438-41.699219l8.101562-22.203124-23.402343-3.898438c-10.199219-21-16.5-44.398438-18.300781-69l29.101562-15-29.097656-15c1.796875-24.601562 8.398437-48 18.597656-69l23.101562-3.898438-8.402343-22.203124c13.800781-19.800782 30.902343-36.898438 50.703125-50.699219l22.199218 8.398437 3.898438-23.097656c21-10.199219 44.398438-16.800781 69-18.601562l15 29.101562 15-29.097656c24.601562 2.097656 47.699219 8.398437 69 18.597656l3.898438 23.101562 21.902343-8.101562c24 16.5 44.398438 37.800781 58.800781 63l-125.703124 90zm0 0' fill='%235a5a5a'/%3E%3Cpath d='m298.898438 262.5 125.703124 90c-12.003906 20.699219-27.902343 39-46.5 54l-122.101562.300781v-316.800781l15-29.097656c24.601562 2.097656 47.699219 8.398437 69 18.597656l3.898438 23.101562 21.902343-8.101562c24 16.5 44.398438 37.800781 58.800781 63l-125.703124 90zm0 0' fill='%23444'/%3E%3Cg fill='%23FFFFFF'%3E%3Cpath d='m271 60.902344v44.097656c0 8.402344-6.597656 15-15 15s-15-6.597656-15-15v-44.097656c5.097656-.601563 9.902344-.902344 15-.902344s9.902344.601562 15 .902344zm0 0'/%3E%3Cpath d='m188.5 138.089844c7.179688-4.144532 9.640625-13.3125 5.492188-20.492188l-22.066407-38.226562c-9.0625 4.363281-17.8125 9.257812-26.035156 14.914062l22.117187 38.3125c4.15625 7.195313 13.351563 9.617188 20.492188 5.492188zm0 0'/%3E%3Cpath d='m139.089844 187.5c4.148437-7.179688 1.6875-16.347656-5.492188-20.492188l-38.3125-22.117187c-5.65625 8.222656-10.550781 16.976563-14.914062 26.039063l38.226562 22.0625c7.097656 4.101562 16.300782 1.746093 20.492188-5.492188zm0 0'/%3E%3Cpath d='m121 255c0-8.289062-6.710938-15-15-15h-44.238281c-.382813 4.96875-.761719 9.9375-.761719 15 0 5.070312.484375 10.023438.871094 15h44.128906c8.289062 0 15-6.710938 15-15zm0 0'/%3E%3C/g%3E%3Cpath d='m139.089844 322.5c-4.160156-7.191406-13.34375-9.652344-20.492188-5.492188l-38.351562 22.136719c4.367187 9.074219 9.554687 17.632813 15.21875 25.863281l38.132812-22.015624c7.175782-4.144532 9.636719-13.3125 5.492188-20.492188zm0 0' fill='%235a5a5a'/%3E%3Cpath d='m318.007812 117.597656c-4.148437 7.179688-1.6875 16.347656 5.492188 20.492188 7.097656 4.101562 16.300781 1.746094 20.492188-5.492188l21.949218-38.015625c-8.222656-5.667969-16.859375-10.71875-25.933594-15.089843zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m378.101562 406.5c-8.101562 6.601562-16.800781 12.597656-25.800781 17.699219-28.5 16.199219-61.203125 25.800781-96.300781 25.800781s-67.800781-9.300781-96.300781-25.800781c-9-5.101563-17.699219-10.800781-25.800781-17.398438l52.5-43.5c2.703124-2.101562 6-3.300781 9.601562-3.300781h120c3.597656 0 6.898438 1.199219 9.597656 3.300781zm0 0' fill='%23ff9f00'/%3E%3Cpath d='m271 165v60c0 8.402344-6.597656 15-15 15s-15-6.597656-15-15v-60c0-8.402344 6.597656-15 15-15s15 6.597656 15 15zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m378.101562 406.5c-8.101562 6.601562-16.800781 12.597656-25.800781 17.699219-28.5 16.199219-61.203125 25.800781-96.300781 25.800781v-90h60c3.601562 0 6.898438 1.199219 9.601562 3.300781zm0 0' fill='%23ff7816'/%3E%3Cpath d='m271 165v60c0 8.402344-6.597656 15-15 15v-90c8.402344 0 15 6.597656 15 15zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m449.984375 240c-2.328125-29.800781-11.050781-57.804688-25.300781-82.386719l-155.691406 89.886719v15l155.691406 89.886719c14.246094-24.582031 22.96875-52.589844 25.300781-82.386719l-28.984375-15zm0 0' fill='%23e63950'/%3E%3Cpath d='m449.984375 240h-43.984375c-8.289062 0-15 6.710938-15 15s6.710938 15 15 15h43.984375c.390625-4.988281 1.015625-9.910156 1.015625-15s-.625-10.011719-1.015625-15zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m271 60.902344v44.097656c0 8.402344-6.597656 15-15 15v-60c5.097656 0 9.902344.601562 15 .902344zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m256 210c-24.902344 0-45 20.097656-45 45s20.097656 45 45 45 45-20.097656 45-45-20.097656-45-45-45zm0 0' fill='%23FFFFFF'/%3E%3Cpath d='m256 300v-90c24.902344 0 45 20.097656 45 45s-20.097656 45-45 45zm0 0' fill='%23FFFFFF'/%3E%3C/svg%3E");
width: 23px;
height: 23px;
}
#settingsCloseClose {
display: none;
}
.open #settingsCloseOpen {
display: none;
}
.open #settingsCloseClose {
display: inline-block;
}
.openSettings {
cursor: pointer;
font-size: 20px;
margin: 20px;
display: inline-block;
font-weight: bold;
}
/* Popup box END */
.slider {
-webkit-appearance: none;
appearance: none;
width: 300px;
height: 20px;
border: 1px solid #004F75;
background: #b0d8e4;
vertical-align: middle;
border-radius: 20px;
opacity: 0.8;
-webkit-transition: all .2s;
transition: all .2s;
}
.slider:hover {
opacity: 1;
}
.slider::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
width: 40px;
height: 40px;
background: #004F75;
cursor: pointer;
border-radius: 5px;
}
.slider::-moz-range-thumb {
width: 25px;
height: 25px;
background: #004F75;
cursor: pointer;
}
#wrapLoading {
position: fixed;
top: 0;
left: 0;
right: 0;
text-align: center;
bottom: 0;
background: #004f75;
z-index: 999999;
}
.lds-ring {
display: inline-block;
position: relative;
width: 64px;
top: 300px;
height: 64px;
}
.lds-ring div {
box-sizing: border-box;
display: block;
position: absolute;
width: 51px;
height: 51px;
margin: 6px;
border: 6px solid #fff;
border-radius: 50%;
animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
animation-delay: -0.15s;
}
@keyframes lds-ring {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@media screen and (max-width: 1550px) {
}
@media screen and (max-width: 1450px) {
.settingRow {
padding: 10px 0px;
}
.slider {
width: 200px;
}
.narrowSettingTiles {
padding-left: 25px;
}
}
@media screen and (max-width: 1350px) {
ul#navigation li#galleryTitle {
display: none;
}
}
@media screen and (max-width: 1250px) {
}
@media screen and (max-width: 1100px) {
}
@media screen and (max-width: 1005px) , screen and (max-height: 700px) {
.logo img {
width: 100px;
}
h3 {
font-size: 25px;
}
.settingRow {
padding: 0px;
font-size: 18px;
margin: 0;
letter-spacing: 0px;
}
#pickBugs div, #pickBackground div, #pickDirection div {
width: 55px;
height: 55px;
border-radius: 20px;
}
.settingTiles {
width: 140px;
}
#allBugsSelect img:nth-child(1) {
transform: rotate(-10deg);
top: -11px;
width: 62px;
left: -19px;
}
#allBugsSelect img:nth-child(2) {
transform: rotate(-63deg);
top: -4px;
left: 20px;
width: 40px;
}
#allBugsSelect img:nth-child(3) {
transform: rotate(120deg);
top: 19px;
left: 18px;
width: 50px;
}
#pickBugs div img#selectCockroach {
width: 80px;
top: -18px;
left: -12px;
}
#pickBugs div img#selectSpider {
width: 100px;
top: -27px;
left: -21px;
}
#pickBugs div img#selectFly {
width: 50px;
top: 4px;
left: 3px;
}
.slider {
height: 15px;
}
.slider::-webkit-slider-thumb {
width: 30px;
height: 30px;
}
.slider::-moz-range-thumb {
width: 20px;
height: 20px;
}
.wrapInput {
padding: 5px 0;
}
.logo {
width: 140px;
}
#pickDirection span {
font-size: 50px;
}
#randomDir span:nth-child(1) {
top: 13px;
left: -8px;
transform: rotate(65deg);
}
#randomDir span:nth-child(2) {
top: 17px;
left: 11px;
transform: rotate(-114deg);
}
#pickDirection span {
top: 15px;
left: 7px;
}
}
@media screen and (max-width: 830px) {
.slider {
width: 125px;
}
#soundToggle, #deathToggle, #helpToggle, #adsToggle {
height: 34px;
width: 34px;
line-height: 34px;
}
}
@media screen and (max-width: 750px) {
#settingScroll {
width: 740px;
height: 130px;
}
#adsToggle {
display: none;
}
#settingScrollWrap {
overflow-x: auto;
height: 150px;
width: 100%;
overflow-y: hidden;
}
#settings {
padding: 5px 1% 2px;
border-radius: 0 0 14px 14px;
}
.logo {
text-align: left;
}
.logo img {
width: 125px;
}
.inputLabel {
display: none;
}
.inputSettings {
transform: rotate(-90deg);
}
.wrapInput {
padding: 10px 0;
text-align: center;
}
.wrapInput > div {
transform: rotate(90deg);
}
.slider {
width: 95px;
}
#soundToggle, #deathToggle, #helpToggle {
margin-left: 2px;
font-size: 25px;
height: 35px;
width: 35px;
line-height: 35px;
}
.mobileInputLabel {
display: inline-block;
transform: rotate(90deg);
}
}
@media screen and (max-width: 450px) {
#wrapNavigation {
display: none;
}
#footerB {
width: 100%;
}
}
/* HEIGHT */
@media screen and (max-height: 800px) {
.lds-ring {
top: 200px;
}
#article {
height: 200px;
}
}
@media screen and (max-height: 800px) {
#article {
height: 170px;
}
}
@media screen and (max-height: 500px) {
#footer, .adBanner, #footerB {
height: 50px;
}
.adBanner {
line-height: 50px;
}
ul#navigation li a {
height: 25px;
padding: 3px 8px 3px 45px;
line-height: 25px;
}
#wrapNavigation {
margin-top: 0;
}
ul#navigation li a#nav1 { background-position: 0 -6px; }
ul#navigation li a#nav2 { background-position: 0 -86px; }
ul#navigation li a#nav3 { background-position: 0 -169px; }
ul#navigation li a#nav4 { background-position: 0 -245px; }
ul#navigation li a#nav5 { background-position: 0 -327px; }
ul#navigation li a#nav6 { background-position: 0 -404px; }
}
@media screen and (max-height: 450px) {
#article {
background: #FFF;
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
height: auto;
width: auto;
z-index: 99;
max-width: unset;
}
#closeArticle {
display: block;
}
}
@media screen and (max-height: 350px) {
#footer {
display: none;
}
}