PinGame3

Developer
Ken Lane
Size
18,875 Kb
Views
12,144
  1. PinGame3 Previews
  2. PinGame3 HTML Codes
  3. PinGame3 CSS Codes
  4. PinGame3 JS Codes

How do I make an pingame3?

What is a pingame3? How do you make a pingame3? This script and codes were developed by Ken Lane on 25 October 2022, Tuesday.

PinGame3 Previews
IQ Test

PinGame3 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>PinGame3</title> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class='pin-game-show'> <div class='text'> <div class='text1'>This board has 65 bot-recommended cards.</div> <div class='text2'>5 of them are above 75% relevant.</div> </div> <div class='pin-game-button'> <a> Show Pin Game <div class='marks'> <div class='mark yes'></div> <div class='mark no'></div> <div class='mark skip'></div> </div> </a> </div>
</div>
<div class='pin-game'> <div class='top-bar'> <div class='counts inl'> <div class='count1 inl fon30'>4</div> <div class='of inl fon20'>of</div> <div class='count2 inl fon30'>6</div> <div class='inl'>cards pinned.</div> </div> <div class='pin-game-hide inl'> <div class='pin-game-button'> <a> Hide Pin Game &nbsp; <b>X</b> </a> </div> </div> <div> <div class='inl icon'></div> <div class='inl text1'>&nbsp;</div> <div class='text2'>Do these cards belong on this board?</div> </div> </div> <div class='left-bar'></div> <div class='cards-scroll'> <div class='cards'> <article class='card msg-card yay-card'> <div class='wrap'> <div class='card-header'></div> </div> <div class='text1'>Pinned.</div> <i class='emblem fa fa-check'></i> <div class='text2'>Roger that.</div> </article> <article class='card msg-card boo-card'> <div class='wrap'> <div class='card-header'> <a class='belonger skip right' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>SKIP</div> <div class='fg-black line l2'>Ignore</div> </div> <i class='fg-black inl fa fa-times fa-2x'></i> </a> </div> </div> <div class='text1'>Three rejected cards in a row?</div> <i class='emblem fa fa-search'></i> <div class='text2'>Maybe try the search bar below?</div> </article> <article class='card'> <div class='wrap'> <div class='card-header'> <div class='icon'> <img alt='Icon saved by username black' src='https://upload.wikimedia.org/wikipedia/commons/4/41/Regular_hexagon.svg'> <div class='score'>44%</div> <div class='score-label'>Related</div> </div> <a class='belonger mr-4 yes' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>YES</div> <div class='fg-black line l2'>Pin</div> </div> <i class='icon fg-black inl fa fa-thumb-tack fa-2x'></i> </a> <a class='belonger mr-4 no' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>NO</div> <div class='fg-black line l2'>Reject</div> </div> <div class='icon inl left fg-black icon fa-stack'> <i class='left fa fa-thumb-tack fa-stack-1x'></i> <i class='left fa fa-ban fa-stack-2x'></i> </div> </a> <a class='belonger skip' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>SKIP</div> <div class='fg-black line l2'>Ignore</div> </div> <i class='fg-black inl icon fa fa-times fa-2x'></i> </a> <ul class='headline'> <li class='line1'> Belongs on this board? </li> <li class='line2'> Train bots! </li> </ul> </div> <div id='DIV_13'> <div id='DIV_14'></div> <h3 id='H3_15'> <div id='DIV_16'> Welcome to your smart home! </div> <div id='DIV_17'> Welcome to your smart home! </div> </h3> <div id='DIV_18'> <a href='/search/Home+Automation' id='A_19'>Home Automation</a> </div> </div> <div id='DIV_20'> <div id='DIV_21'> <div id='DIV_22'> <div id='DIV_23'> Truth </div> <div id='DIV_24'> <a href='/rate/235857/truth/1' id='A_25' rel='nofollow'></a> <a href='/rate/235857/truth/2' id='A_26' rel='nofollow'></a> <a href='/rate/235857/truth/3' id='A_27' rel='nofollow'></a> <a href='/rate/235857/truth/4' id='A_28' rel='nofollow'></a> <a href='/rate/235857/truth/5' id='A_29' rel='nofollow'></a> </div> </div> <div id='DIV_30'> <div id='DIV_31'> Quality </div> <div id='DIV_32'> <a href='/rate/235857/quality/1' id='A_33' rel='nofollow'></a> <a href='/rate/235857/quality/2' id='A_34' rel='nofollow'></a> <a href='/rate/235857/quality/3' id='A_35' rel='nofollow'></a> <a href='/rate/235857/quality/4' id='A_36' rel='nofollow'></a> <a href='/rate/235857/quality/5' id='A_37' rel='nofollow'></a> </div> </div> </div> <div id='DIV_38'> <div id='DIV_39'> <div id='DIV_40'> <span id='SPAN_41'>11/03/15</span> </div> <div id='DIV_42'> <span id='SPAN_43'>11/03/15</span> </div> </div> <div id='DIV_44'> These days we have been making huge leaps towards making homes smarter, and giving you the power to monitor, control, secure and customize your living... <img alt='Chevron 40x40 06acb2f0ee1987cbe5a1ed3f3394d5f30f3c8190110b091939c444163ecc6a22' id='IMG_45' src='/assets/icons/chevron_40x40-06acb2f0ee1987cbe5a1ed3f3394d5f30f3c8190110b091939c444163ecc6a22.svg'> </div> <div id='DIV_46'> These days we have been making huge leaps towards making homes smarter, and giving you the power to monitor, control, secure and customize your living space with just the touch of your smartphone. Soon, it will be hard to imagine life any other way. Of course, to make smart homes possible, it’ll take some advanced technology. You need intelligent tools to... <img alt='Chevron 40x40 06acb2f0ee1987cbe5a1ed3f3394d5f30f3c8190110b091939c444163ecc6a22' id='IMG_47' src='/assets/icons/chevron_40x40-06acb2f0ee1987cbe5a1ed3f3394d5f30f3c8190110b091939c444163ecc6a22.svg'> </div> </div> </div> <div id='DIV_48'> <ul id='UL_49'> <div id='DIV_50'></div> <li id='LI_51'> <a href='/search/Home+Security' id='A_52'>Home Security</a> </li> <li id='LI_53'> <a href='/search/Home+Safety' id='A_54'>Home Safety</a> </li> </ul> </div> <div id='DIV_55'> <a href='/search/Home+Security' id='A_57'>Home Security</a> <a href='/search/Home+Safety' id='A_59'>Home Safety</a> <a href='/search/Home+Repairs+%2526+Improvements' id='A_61'>Home Repairs &amp; Improvements</a> <a href='/search/Gadget' id='A_63'>Gadget</a> </div> </div> <ul id='UL_64'> <li id='LI_65'> <a href='/share/Content/235857' id='A_66'> <span id='SPAN_67'>Share</span> <span class='fa-stack' style='width:20px'> <i class='fg-black fa fa-long-arrow-up fa-stack-1x'></i> <i class='fg-black fa fa-square-o fa-stack-1x dn7'></i> </span> </a> </li> <li id='LI_69'> <a href='/rate/235857' id='A_70' rel='nofollow'> <span id='SPAN_71'>Like</span> <i class='fg-black inl fa fa-heart-o fon20 dn5'></i> </a> </li> <li id='LI_73'> <a href='/save/new/235857?board_id=1683165' id='A_74'> <span id='SPAN_75'>Pin</span> <i class='fg-black inl fa fa-thumb-tack fa-2x fon20 dn5 turn45'></i> </a> </li> </ul> </article> <article class='card copy-me' times='15'> <div class='wrap'> <div class='card-header'> <div class='icon'> <img alt='Icon saved by username black' src='https://upload.wikimedia.org/wikipedia/commons/4/41/Regular_hexagon.svg'> <div class='score'>35%</div> <div class='score-label'>Related</div> </div> <a class='belonger mr-4 yes' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>YES</div> <div class='fg-black line l2'>Pin</div> </div> <i aria-hidden='true' class='icon fg-black inl fa fa-thumb-tack fa-2x'></i> </a> <a class='belonger mr-4 no' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>NO</div> <div class='fg-black line l2'>Reject</div> </div> <div class='icon inl left fg-black icon fa-stack'> <i class='left fa fa-thumb-tack fa-stack-1x'></i> <i class='left fa fa-ban fa-stack-2x'></i> </div> </a> <a class='belonger skip' href='#' rel='nofollow'> <div class='inl left text'> <div class='fg-black line l1'>SKIP</div> <div class='fg-black line l2'>Ignore</div> </div> <i aria-hidden='true' class='fg-black inl icon fa fa-times fa-2x'></i> </a> <ul class='headline'> <li class='line1'> Belongs on this board? </li> <li class='line2'> &nbsp; </li> </ul> </div> <div class='count'>7</div> </div> </article> </div> </div> <div class='bottom-bar'> <input placeholder='Search here for other cards to try.'> <button>Search</button> </div>
</div>
<div class='cards pin-cards'> <article class='card' id='pin-blank' style='border:0;background:#00000000;box-shadow: none;width:0;margin:0;'></article> <article class='card copy-me' times='4'> <div class='wrap'> <div class='card-header'> <div class='icon'> <img alt='Icon saved by username black' src='https://upload.wikimedia.org/wikipedia/commons/4/41/Regular_hexagon.svg'> </div> <div class='inl'>Pinned by Sam</div> </div> <div class='count'>7</div> </div> </article>
</div> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

PinGame3 - Script Codes CSS Codes

@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400,700|Arvo:400,700);
.pin-game-button { font-family: "Source Sans Pro", sans-serif; background: #56688b; color: white; width: 130px; padding: 15px; text-align: center; margin: auto;
}
.pin-game-button .marks .mark { display: inline-block; width: 15px; height: 10px;
}
.pin-game-button a { padding: 5px; display: block; font-weight: 100; background: #56688b; color: white; border: 1px solid white;
}
.pin-game-button a:hover { text-decoration: underline; cursor: pointer; box-shadow: white 0 0 4px;
}
.pin-game-hide { height: 40px;
}
.pin-game-show { margin-left: 34px; background: #56688b; color: white; font-family: "Source Sans Pro", sans-serif; width: 303px; /* display: none; */
}
.pin-game-show .text { padding: 10px; font-weight: 100;
}
.pin-game { z-index: 5;
}
.pin-game .top-bar { width: 100%; background: #56688b; color: white; font-family: "Source Sans Pro", sans-serif; font-size: 16px; padding: 0 10px 10px 30px; z-index: 7;
}
.pin-game .top-bar .counts { height: 20px;
}
.pin-game .top-bar .text2 { position: relative; font-weight: 400; font-size: 18px; padding: 0 0 0 8px;
}
.pin-game .top-bar .count1 { padding: 0 8px 0 8px; transition: background-color 1000ms linear;
}
.pin-game .top-bar .count2 { padding: 0 8px 0 8px; text-align: left;
}
.pin-game .top-bar .count-text { display: inline; padding-left: 10px;
}
.pin-game .left-bar { clear: both; float: left; background: #56688b; color: white; width: 30px; height: 500px;
}
.pin-game .bottom-bar { clear: both; background: #56688b; color: white; font-family: "Source Sans Pro", sans-serif; font-size: 16px; padding: 10px 0 10px 40px; margin: 0;
}
.pin-game .bottom-bar input { width: 50%; font-size: 16px; text-decoration: italics; line-height: 20px;
}
.pin-game .bottom-bar button { height: 26px; position: relative; top: -2px;
}
.pin-game .cards-scroll { overflow-x: scroll; overflow-y: hidden; height: 490px;
}
.pin-game .msg-card { text-align: center; line-height: 40px;
}
.pin-game .msg-card .text1 { display: block; padding: 60px 20px 0 20px; font-family: "Source Sans Pro", sans-serif; font-size: 30px;
}
.pin-game .msg-card .emblem.fa { display: block; text-align: center; padding: 25px; font-size: 80px; color: #6b6; text-shadow: 1px 2px 8px black;
}
.pin-game .msg-card .emblem.fa-ban { color: #900;
}
.pin-game .msg-card .emblem.fa-search { color: grey;
}
.pin-game .msg-card .text2 { display: block; font-family: "Source Sans Pro", sans-serif; font-size: 30px;
}
.cards { display: inline-flex;
}
.card { background: white; display: inline-block; transform: scale(1); transition: transform 450ms ease-in-out; border: solid 1px #bbbbbb; box-shadow: #cccccc 0px 0px 40px 0px; box-sizing: border-box; height: 470px; margin: 5px 20px 0 5px; position: relative; top: 0px; width: 303px; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif;
}
.card .count { font-size: 270px; text-align: center; padding: 170px 0 0 0; color: #bbb;
}
.card .icon { float: left;
}
.card img { display: inline-block; height: 27.0312px; line-height: 24px; vertical-align: middle; width: 35px;
}
.card .headline { float: left; margin: 0 0 0 2px; padding: 0;
}
.card .headline .line1 { font-family: "Source Sans Pro", sans-serif; font-size: 10px; line-height: 16px; height: 8px; list-style-type: none; text-transform: uppercase;
}
.card .headline .line2 { color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 8px; line-height: 25.6px; list-style-type: none;
}
/* .card */
/*#DIV_2*/
.card-header { box-sizing: border-box; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 40px; line-height: 24px; padding: 5px; transition: background 500ms;
}
.card-header .icon { width: 40px;
}
.card-header .icon img { transform: scale(1.4) rotate(90deg);
}
.card-header .icon .score { font-size: 17px; font-weight: 100; position: relative; top: -26px; left: 3px;
}
.card-header .icon .score-label { font-size: 13px; font-weight: 100; position: relative; top: -36px; left: -3px; background: rgba(255, 255, 255, 0.4);
}
.belonger { transform: scale(0.85); float: left; width: 70px; height: 35px; padding: 3px 5px 0 5px; position: relative; top: -3px; left: 5px; box-shadow: black 0 0 2px;
}
.belonger:hover { transform: scale(1);
}
.belonger:hover { box-shadow: blue 0 0 4px;
}
.belonger:hover .line { text-decoration: underline;
}
.belonger .l1 { width: 40px; line-height: 15px; font-weight: bold; font-size: 18px;
}
.belonger .l2 { line-height: 15px;
}
.belonger a { text-decoration: none; color: black !important;
}
.belonger .icon { width: 25px;
}
.belonger .fa-thumb-tack { transform: rotate(45deg);
}
.belonger .fa-ban { transform: rotate(90deg); color: rgba(0, 0, 0, 0.5); font-size: 38px; position: relative; top: -8px; left: 2px;
}
.yes { background: #9ccf31;
}
.no { background: #ee8080;
}
.no .fa-thumb-tack { font-size: 25px;
}
.skip { background: #f7d708;
}
.pin-cards { margin: 14px 0 0 30px; display: inline-flex;
}
#pin-blank { z-index: -1;
}
.right { float: right;
}
.left { float: left;
}
.pl10 { padding-left: 10px;
}
.pl50 { padding-left: 50px;
}
.mg50 { margin-left: 50px;
}
.inl { display: inline-block;
}
.fon10 { font-size: 10px;
}
.fon20 { font-size: 20px;
}
.fon30 { font-size: 30px;
}
.dn5 { position: relative; top: 5px;
}
.dn7 { position: relative; top: 7px;
}
.turn45 { transform: rotate(45deg);
}
.halloween { background: black; color: orange; font-wieght: 400;
}
.fg-black { color: black;
}
.clear { clear: both;
}
.mr-4 { margin-right: 4px;
}
/* o---------------------------------o */
#DIV_12 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; clear: both; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; line-height: 24px; outline-color: #333333; width: 291.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 145.656px 0px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 145.656px 0px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 145.656px 0px;
}
/*#DIV_12*/
#DIV_13 { background-color: #e1e7ee; border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; bottom: 0px; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 220px; left: 0px; line-height: 24px; outline-color: #333333; position: relative; right: 0px; top: 0px; width: 301.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 150.656px 110px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 150.656px 110px; background: #e1e7ee none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 150.656px 110px;
}
/*#DIV_13*/
#DIV_14 { background-image: url("https://tanjo.s3.amazonaws.com/uploads/content/image/235857/smartthings.jpg"); background-position: 50% 0%; background-repeat: no-repeat; background-size: cover; border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; bottom: 0px; box-sizing: border-box; color: #333333; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 220px; left: 0px; line-height: 24px; outline-color: #333333; position: relative; right: 0px; top: 0px; width: 301.328px; z-index: 0; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 150.656px 110px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 150.656px 110px; background: transparent url("https://tanjo.s3.amazonaws.com/uploads/content/image/235857/smartthings.jpg") no-repeat scroll 50% 0%/cover padding-box border-box; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 150.656px 110px;
}
/*#DIV_14*/
#H3_15 { background-color: rgba(19, 32, 52, 0.70196); border-bottom-color: white; border-left-color: white; border-right-color: white; border-top-color: white; bottom: 0px; box-sizing: border-box; color: white; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: normal; height: 60px; left: 0px; line-height: 20px; margin-bottom: 0px; margin-top: 0px; outline-color: white; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; padding-top: 10px; position: absolute; right: 0px; text-rendering: optimizeLegibility; top: 160px; width: 301.328px; z-index: 10; column-rule-color: white; -webkit-locale: "en"; perspective-origin: 150.656px 30px; -webkit-text-emphasis-color: white; -webkit-text-fill-color: white; -webkit-text-stroke-color: white; transform-origin: 150.656px 30px; background: rgba(19, 32, 52, 0.70196) none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none white; border-top: 0px none white; border-right: 0px none white; border-bottom: 0px none white; border-left: 0px none white; border-color: white; font: normal normal normal normal 16px / 20px "Source Sans Pro", sans-serif; margin: 0px; outline: white none 0px; padding: 10px; -webkit-border-after: 0px none white; -webkit-border-before: 0px none white; -webkit-border-end: 0px none white; -webkit-border-start: 0px none white; -webkit-transform-origin: 150.656px 30px;
}
/*#H3_15*/
#DIV_16 { border-bottom-color: white; border-left-color: white; border-right-color: white; border-top-color: white; box-sizing: border-box; color: white; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 20px; line-height: 20px; outline-color: white; text-rendering: optimizeLegibility; width: 281.328px; column-rule-color: white; -webkit-locale: "en"; perspective-origin: 140.656px 10px; -webkit-text-emphasis-color: white; -webkit-text-fill-color: white; -webkit-text-stroke-color: white; transform-origin: 140.656px 10px; border: 0px none white; border-top: 0px none white; border-right: 0px none white; border-bottom: 0px none white; border-left: 0px none white; border-color: white; font: normal normal normal normal 16px / 20px "Source Sans Pro", sans-serif; outline: white none 0px; -webkit-border-after: 0px none white; -webkit-border-before: 0px none white; -webkit-border-end: 0px none white; -webkit-border-start: 0px none white; -webkit-transform-origin: 140.656px 10px;
}
/*#DIV_16*/
#DIV_17 { border-bottom-color: white; border-left-color: white; border-right-color: white; border-top-color: white; box-sizing: border-box; color: white; cursor: pointer; display: none; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: auto; line-height: 20px; outline-color: white; text-rendering: optimizeLegibility; width: auto; column-rule-color: white; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: white; -webkit-text-fill-color: white; -webkit-text-stroke-color: white; transform-origin: 50% 50%; border: 0px none white; border-top: 0px none white; border-right: 0px none white; border-bottom: 0px none white; border-left: 0px none white; border-color: white; font: normal normal normal normal 16px / 20px "Source Sans Pro", sans-serif; outline: white none 0px; -webkit-border-after: 0px none white; -webkit-border-before: 0px none white; -webkit-border-end: 0px none white; -webkit-border-start: 0px none white; -webkit-transform-origin: 50% 50%;
}
/*#DIV_17*/
#DIV_18 { background-color: rgba(103, 128, 164, 0.8); border-bottom-color: white; border-left-color: white; border-right-color: white; border-top-color: white; bottom: 60px; box-sizing: border-box; color: white; font-family: "Source Sans Pro", sans-serif; font-size: 14px; font-weight: 300; height: 23px; left: 0px; line-height: 21px; max-width: 100%; outline-color: white; overflow-x: hidden; overflow-y: hidden; padding-bottom: 1px; padding-left: 5px; padding-right: 5px; padding-top: 1px; position: absolute; right: 186.734px; text-align: center; top: 137px; white-space: nowrap; width: 114.594px; z-index: 20; column-rule-color: white; -webkit-locale: "en"; perspective-origin: 57.2969px 11.5px; -webkit-text-emphasis-color: white; -webkit-text-fill-color: white; -webkit-text-stroke-color: white; transform-origin: 57.2969px 11.5px; background: rgba(103, 128, 164, 0.8) none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none white; border-top: 0px none white; border-right: 0px none white; border-bottom: 0px none white; border-left: 0px none white; border-color: white; font: normal normal 300 normal 14px / 21px "Source Sans Pro", sans-serif; outline: white none 0px; overflow: hidden; padding: 1px 5px; -webkit-border-after: 0px none white; -webkit-border-before: 0px none white; -webkit-border-end: 0px none white; -webkit-border-start: 0px none white; -webkit-transform-origin: 57.2969px 11.5px;
}
/*#DIV_18*/
#A_19 { border-bottom-color: white; border-left-color: white; border-right-color: white; border-top-color: white; box-sizing: border-box; color: white; font-family: "Source Sans Pro", sans-serif; font-size: 14px; font-weight: 300; line-height: 21px; outline-color: white; text-align: center; text-decoration: none; white-space: nowrap; column-rule-color: white; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: white; -webkit-text-fill-color: white; -webkit-text-stroke-color: white; border: 0px none white; border-top: 0px none white; border-right: 0px none white; border-bottom: 0px none white; border-left: 0px none white; border-color: white; font: normal normal 300 normal 14px / 21px "Source Sans Pro", sans-serif; outline: white none 0px; -webkit-border-after: 0px none white; -webkit-border-before: 0px none white; -webkit-border-end: 0px none white; -webkit-border-start: 0px none white;
}
/*#A_19*/
#DIV_20 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 125px; line-height: 24px; margin-top: 10px; outline-color: #333333; padding-left: 10px; padding-right: 10px; width: 301.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 150.656px 62.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 150.656px 62.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; margin: 10px 0px 0px; outline: #333333 none 0px; padding: 0px 10px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 150.656px 62.5px;
}
/*#DIV_20*/
#DIV_21 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; float: right; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 84px; line-height: 24px; margin-left: 8px; margin-top: -2px; outline-color: #333333; width: 60px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 30px 42px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 30px 42px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; margin: -2px 0px 0px 8px; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 30px 42px;
}
/*#DIV_21*/
#DIV_22, #DIV_30 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; clear: both; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 30px; line-height: 24px; outline-color: #333333; padding-top: 6px; width: 66px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 33px 15px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 33px 15px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; padding: 6px 0px 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 33px 15px;
}
/*#DIV_22, #DIV_30*/
#DIV_23, #DIV_31 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 24px; line-height: 24px; outline-color: #333333; text-align: center; width: 66px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 33px 12px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 33px 12px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 33px 12px;
}
/*#DIV_23, #DIV_31*/
#DIV_24, #DIV_32 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; bottom: 0px; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; left: 0px; line-height: 24px; outline-color: #333333; position: relative; right: 0px; top: 0px; width: 66px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 33px 0px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 33px 0px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 33px 0px;
}
/*#DIV_24, #DIV_32*/
#A_25, #A_26, #A_33, #A_35 { background-color: #56688b; border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; cursor: pointer; display: block; float: left; font-family: "Source Sans Pro", sans-serif; font-size: 8px; height: 12px; line-height: 12px; margin-right: 1px; outline-color: #dddddd; overflow-x: hidden; overflow-y: hidden; text-align: center; text-decoration: none; width: 12px; column-rule-color: #dddddd; -webkit-locale: "en"; perspective-origin: 6px 6px; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; transform-origin: 6px 6px; background: #56688b none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; margin: 0px 1px 0px 0px; outline: #dddddd none 0px; overflow: hidden; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd; -webkit-transform-origin: 6px 6px;
}
/*#A_25, #A_26, #A_33, #A_35*/
#A_25:before, #A_26:before, #A_33:before, #A_35:before { border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; content: '"★"'; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 8px; line-height: 12px; outline-color: #dddddd; text-align: center; column-rule-color: #dddddd; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; outline: #dddddd none 0px; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd;
}
/*#A_25:before, #A_26:before, #A_33:before, #A_35:before*/
#A_27, #A_34 { background-color: #56688b; border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; cursor: pointer; display: block; float: left; font-family: "Source Sans Pro", sans-serif; font-size: 8px; height: 12px; line-height: 12px; margin-right: 1px; outline-color: #dddddd; overflow-x: hidden; overflow-y: hidden; text-align: center; text-decoration: none; width: 12px; column-rule-color: #dddddd; -webkit-locale: "en"; perspective-origin: 6px 6px; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; transform-origin: 6px 6px; background: #56688b none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; margin: 0px 1px 0px 0px; outline: #dddddd none 0px; overflow: hidden; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd; -webkit-transform-origin: 6px 6px;
}
/*#A_27, #A_34*/
#A_27:before, #A_34:before { border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; content: '"★"'; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 8px; line-height: 12px; outline-color: #dddddd; text-align: center; column-rule-color: #dddddd; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; outline: #dddddd none 0px; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd;
}
/*#A_27:before, #A_34:before*/
#A_28, #A_29, #A_37 { background-color: #dddddd; border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; cursor: pointer; display: block; float: left; font-family: "Source Sans Pro", sans-serif; font-size: 8px; height: 12px; line-height: 12px; margin-right: 1px; outline-color: #dddddd; overflow-x: hidden; overflow-y: hidden; text-align: center; text-decoration: none; width: 12px; column-rule-color: #dddddd; -webkit-locale: "en"; perspective-origin: 6px 6px; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; transform-origin: 6px 6px; background: #dddddd none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; margin: 0px 1px 0px 0px; outline: #dddddd none 0px; overflow: hidden; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd; -webkit-transform-origin: 6px 6px;
}
/*#A_28, #A_29, #A_37*/
#A_28:before, #A_29:before, #A_37:before { border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; content: '"★"'; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 8px; line-height: 12px; outline-color: #dddddd; text-align: center; column-rule-color: #dddddd; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; outline: #dddddd none 0px; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd;
}
/*#A_28:before, #A_29:before, #A_37:before*/
#A_36 { background-color: #dddddd; border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; cursor: pointer; display: block; float: left; font-family: "Source Sans Pro", sans-serif; font-size: 8px; height: 12px; line-height: 12px; margin-right: 1px; outline-color: #dddddd; overflow-x: hidden; overflow-y: hidden; text-align: center; text-decoration: none; width: 12px; column-rule-color: #dddddd; -webkit-locale: "en"; perspective-origin: 6px 6px; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; transform-origin: 6px 6px; background: #dddddd none repeat scroll 0% 0%/auto padding-box border-box; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; margin: 0px 1px 0px 0px; outline: #dddddd none 0px; overflow: hidden; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd; -webkit-transform-origin: 6px 6px;
}
/*#A_36*/
#A_36:before { border-bottom-color: #dddddd; border-left-color: #dddddd; border-right-color: #dddddd; border-top-color: #dddddd; box-sizing: border-box; color: #dddddd; content: '"★"'; cursor: pointer; font-family: "Source Sans Pro", sans-serif; font-size: 8px; line-height: 12px; outline-color: #dddddd; text-align: center; column-rule-color: #dddddd; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: #dddddd; -webkit-text-fill-color: #dddddd; -webkit-text-stroke-color: #dddddd; border: 0px none #dddddd; border-top: 0px none #dddddd; border-right: 0px none #dddddd; border-bottom: 0px none #dddddd; border-left: 0px none #dddddd; border-color: #dddddd; font: normal normal normal normal 8px / 12px "Source Sans Pro", sans-serif; outline: #dddddd none 0px; -webkit-border-after: 0px none #dddddd; -webkit-border-before: 0px none #dddddd; -webkit-border-end: 0px none #dddddd; -webkit-border-start: 0px none #dddddd;
}
/*#A_36:before*/
#DIV_38 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: 300; height: 125px; line-height: 24px; outline-color: #333333; overflow-x: hidden; overflow-y: hidden; width: 213.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 106.656px 62.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 106.656px 62.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal 300 normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; overflow: hidden; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 106.656px 62.5px;
}
/*#DIV_38*/
#DIV_39 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 14px; height: 21px; line-height: 21px; margin-top: 4px; outline-color: #333333; width: 213.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 106.656px 10.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 106.656px 10.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 14px / 21px "Source Sans Pro", sans-serif; margin: 4px 0px 0px; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 106.656px 10.5px;
}
/*#DIV_39*/
#DIV_40 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 14px; height: 21px; line-height: 21px; outline-color: #333333; width: 213.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 106.656px 10.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 106.656px 10.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 14px / 21px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 106.656px 10.5px;
}
/*#DIV_40*/
#SPAN_41 { border-bottom-color: #aaaaaa; border-left-color: #aaaaaa; border-right-color: #aaaaaa; border-top-color: #aaaaaa; box-sizing: border-box; color: #aaaaaa; font-family: "Source Sans Pro", sans-serif; font-size: 14px; font-weight: 300; line-height: 21px; outline-color: #aaaaaa; padding-left: 5px; column-rule-color: #aaaaaa; -webkit-locale: "en"; -webkit-text-emphasis-color: #aaaaaa; -webkit-text-fill-color: #aaaaaa; -webkit-text-stroke-color: #aaaaaa; border: 0px none #aaaaaa; border-top: 0px none #aaaaaa; border-right: 0px none #aaaaaa; border-bottom: 0px none #aaaaaa; border-left: 0px none #aaaaaa; border-color: #aaaaaa; font: normal normal 300 normal 14px / 21px "Source Sans Pro", sans-serif; outline: #aaaaaa none 0px; padding: 0px 0px 0px 5px; -webkit-border-after: 0px none #aaaaaa; -webkit-border-before: 0px none #aaaaaa; -webkit-border-end: 0px none #aaaaaa; -webkit-border-start: 0px none #aaaaaa;
}
/*#SPAN_41*/
#DIV_42 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; display: none; font-family: "Source Sans Pro", sans-serif; font-size: 14px; height: auto; line-height: 21px; outline-color: #333333; width: auto; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 50% 50%; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 14px / 21px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 50% 50%;
}
/*#DIV_42*/
#SPAN_43 { border-bottom-color: #aaaaaa; border-left-color: #aaaaaa; border-right-color: #aaaaaa; border-top-color: #aaaaaa; box-sizing: border-box; color: #aaaaaa; font-family: "Source Sans Pro", sans-serif; font-size: 14px; font-weight: 300; line-height: 21px; outline-color: #aaaaaa; padding-left: 5px; column-rule-color: #aaaaaa; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: #aaaaaa; -webkit-text-fill-color: #aaaaaa; -webkit-text-stroke-color: #aaaaaa; transform-origin: 50% 50%; border: 0px none #aaaaaa; border-top: 0px none #aaaaaa; border-right: 0px none #aaaaaa; border-bottom: 0px none #aaaaaa; border-left: 0px none #aaaaaa; border-color: #aaaaaa; font: normal normal 300 normal 14px / 21px "Source Sans Pro", sans-serif; outline: #aaaaaa none 0px; padding: 0px 0px 0px 5px; -webkit-border-after: 0px none #aaaaaa; -webkit-border-before: 0px none #aaaaaa; -webkit-border-end: 0px none #aaaaaa; -webkit-border-start: 0px none #aaaaaa; -webkit-transform-origin: 50% 50%;
}
/*#SPAN_43*/
#DIV_44 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: 300; height: 144px; line-height: 24px; outline-color: #333333; width: 213.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 106.656px 72px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 106.656px 72px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal 300 normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 106.656px 72px;
}
/*#DIV_44*/
#IMG_45 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; cursor: pointer; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: 300; height: 15px; line-height: 24px; max-width: 100%; outline-color: #333333; vertical-align: middle; width: 15px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 7.5px 7.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 7.5px 7.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal 300 normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 7.5px 7.5px;
}
/*#IMG_45*/
#DIV_46 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; display: none; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: 300; height: auto; line-height: 24px; outline-color: #333333; width: auto; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 50% 50%; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal 300 normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 50% 50%;
}
/*#DIV_46*/
#IMG_47 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; cursor: pointer; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-weight: 300; line-height: 24px; max-width: 100%; outline-color: #333333; vertical-align: middle; width: 15px; column-rule-color: #333333; -webkit-locale: "en"; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal 300 normal 16px / 24px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333;
}
/*#IMG_47*/
#DIV_48 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; bottom: 35px; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 29px; left: 0px; line-height: 24px; margin-bottom: 10px; margin-top: 10px; outline-color: #333333; overflow-x: hidden; overflow-y: hidden; padding-left: 10px; padding-right: 10px; position: absolute; right: 0px; top: 384px; white-space: nowrap; width: 301.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 150.656px 14.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 150.656px 14.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 24px "Source Sans Pro", sans-serif; margin: 10px 0px; outline: #333333 none 0px; overflow: hidden; padding: 0px 10px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 150.656px 14.5px;
}
/*#DIV_48*/
#UL_49 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 29px; line-height: 25.6px; margin-bottom: 0px; margin-top: 0px; outline-color: #333333; padding-left: 0px; white-space: nowrap; width: 281.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 140.656px 14.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 140.656px 14.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; margin: 0px; outline: #333333 none 0px; padding: 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 140.656px 14.5px;
}
/*#UL_49*/
#DIV_50 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 29px; line-height: 25.6px; outline-color: #333333; white-space: nowrap; width: 281.328px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 140.656px 14.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 140.656px 14.5px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 140.656px 14.5px;
}
/*#DIV_50*/
#LI_51 { border-bottom-color: #d6d6d6; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: #d6d6d6; border-left-style: solid; border-left-width: 1px; border-right-color: #d6d6d6; border-right-style: solid; border-right-width: 1px; border-top-color: #d6d6d6; border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: #333333; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-weight: 300; height: 21px; line-height: 19.2px; list-style-type: none; margin-bottom: 5px; margin-right: 5px; outline-color: #333333; padding-left: 5px; padding-right: 5px; white-space: nowrap; width: 83.3281px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 41.6562px 10.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 41.6562px 10.5px; border: 1px solid #d6d6d6; border-top: 1px solid #d6d6d6; border-right: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; border-left: 1px solid #d6d6d6; border-width: 1px; border-color: #d6d6d6; border-style: solid; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; margin: 0px 5px 5px 0px; outline: #333333 none 0px; padding: 0px 5px; -webkit-border-after: 1px solid #d6d6d6; -webkit-border-before: 1px solid #d6d6d6; -webkit-border-end: 1px solid #d6d6d6; -webkit-border-start: 1px solid #d6d6d6; -webkit-transform-origin: 41.6562px 10.5px;
}
/*#LI_51*/
#A_52, #A_54 { border-bottom-color: black; border-left-color: black; border-right-color: black; border-top-color: black; box-sizing: border-box; color: black; font-family: "Source Sans Pro", sans-serif; font-weight: 300; line-height: 19.2px; list-style-type: none; outline-color: black; text-align: left; text-decoration: none; white-space: nowrap; column-rule-color: black; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: black; -webkit-text-fill-color: black; -webkit-text-stroke-color: black; border: 0px none black; border-top: 0px none black; border-right: 0px none black; border-bottom: 0px none black; border-left: 0px none black; border-color: black; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; outline: black none 0px; -webkit-border-after: 0px none black; -webkit-border-before: 0px none black; -webkit-border-end: 0px none black; -webkit-border-start: 0px none black;
}
/*#A_52, #A_54*/
#LI_53 { border-bottom-color: #d6d6d6; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: #d6d6d6; border-left-style: solid; border-left-width: 1px; border-right-color: #d6d6d6; border-right-style: solid; border-right-width: 1px; border-top-color: #d6d6d6; border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: #333333; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-weight: 300; height: 21px; line-height: 19.2px; list-style-type: none; margin-bottom: 5px; margin-right: 5px; outline-color: #333333; padding-left: 5px; padding-right: 5px; white-space: nowrap; width: 73.9375px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 36.9688px 10.5px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 36.9688px 10.5px; border: 1px solid #d6d6d6; border-top: 1px solid #d6d6d6; border-right: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; border-left: 1px solid #d6d6d6; border-width: 1px; border-color: #d6d6d6; border-style: solid; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; margin: 0px 5px 5px 0px; outline: #333333 none 0px; padding: 0px 5px; -webkit-border-after: 1px solid #d6d6d6; -webkit-border-before: 1px solid #d6d6d6; -webkit-border-end: 1px solid #d6d6d6; -webkit-border-start: 1px solid #d6d6d6; -webkit-transform-origin: 36.9688px 10.5px;
}
/*#LI_53*/
#DIV_55 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; box-sizing: border-box; color: #333333; display: none; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: auto; line-height: 25.6px; outline-color: #333333; white-space: nowrap; width: auto; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 50% 50%; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; outline: #333333 none 0px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 50% 50%;
}
/*#DIV_55*/
#LI_56, #LI_58, #LI_60, #LI_62 { border-bottom-color: #d6d6d6; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: #d6d6d6; border-left-style: solid; border-left-width: 1px; border-right-color: #d6d6d6; border-right-style: solid; border-right-width: 1px; border-top-color: #d6d6d6; border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: #333333; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-weight: 300; height: auto; line-height: 19.2px; list-style-type: none; margin-bottom: 5px; margin-right: 5px; outline-color: #333333; padding-left: 5px; padding-right: 5px; white-space: nowrap; width: auto; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 50% 50%; border: 1px solid #d6d6d6; border-top: 1px solid #d6d6d6; border-right: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; border-left: 1px solid #d6d6d6; border-width: 1px; border-color: #d6d6d6; border-style: solid; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; margin: 0px 5px 5px 0px; outline: #333333 none 0px; padding: 0px 5px; -webkit-border-after: 1px solid #d6d6d6; -webkit-border-before: 1px solid #d6d6d6; -webkit-border-end: 1px solid #d6d6d6; -webkit-border-start: 1px solid #d6d6d6; -webkit-transform-origin: 50% 50%;
}
/*#LI_56, #LI_58, #LI_60, #LI_62*/
#A_57, #A_59, #A_63 { border-bottom-color: black; border-left-color: black; border-right-color: black; border-top-color: black; box-sizing: border-box; color: black; font-family: "Source Sans Pro", sans-serif; font-weight: 300; line-height: 19.2px; list-style-type: none; outline-color: black; text-align: left; text-decoration: none; white-space: nowrap; column-rule-color: black; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: black; -webkit-text-fill-color: black; -webkit-text-stroke-color: black; transform-origin: 50% 50%; border: 0px none black; border-top: 0px none black; border-right: 0px none black; border-bottom: 0px none black; border-left: 0px none black; border-color: black; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; outline: black none 0px; -webkit-border-after: 0px none black; -webkit-border-before: 0px none black; -webkit-border-end: 0px none black; -webkit-border-start: 0px none black; -webkit-transform-origin: 50% 50%;
}
/*#A_57, #A_59, #A_63*/
#A_61 { border-bottom-color: black; border-left-color: black; border-right-color: black; border-top-color: black; box-sizing: border-box; color: black; font-family: "Source Sans Pro", sans-serif; font-weight: 300; line-height: 19.2px; list-style-type: none; outline-color: black; text-align: left; text-decoration: none; white-space: nowrap; column-rule-color: black; -webkit-locale: "en"; perspective-origin: 50% 50%; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: black; -webkit-text-fill-color: black; -webkit-text-stroke-color: black; transform-origin: 50% 50%; border: 0px none black; border-top: 0px none black; border-right: 0px none black; border-bottom: 0px none black; border-left: 0px none black; border-color: black; font: normal normal 300 normal 12px / 19.2px "Source Sans Pro", sans-serif; list-style: none outside none; outline: black none 0px; -webkit-border-after: 0px none black; -webkit-border-before: 0px none black; -webkit-border-end: 0px none black; -webkit-border-start: 0px none black; -webkit-transform-origin: 50% 50%;
}
/*#A_61*/
#UL_64 { border-bottom-color: #333333; border-left-color: #333333; border-right-color: #333333; border-top-color: #333333; bottom: -8px; box-sizing: border-box; color: #333333; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 54px; left: 20.8594px; line-height: 25.6px; margin-bottom: 0px; margin-left: 5px; margin-right: 5px; margin-top: 5px; outline-color: #333333; padding-bottom: 10px; padding-left: 0px; position: absolute; right: 0px; top: 417px; width: 270.469px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 135.234px 27px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 135.234px 27px; border: 0px none #333333; border-top: 0px none #333333; border-right: 0px none #333333; border-bottom: 0px none #333333; border-left: 0px none #333333; border-color: #333333; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; margin: 5px 5px 0px; outline: #333333 none 0px; padding: 0px 0px 10px; -webkit-border-after: 0px none #333333; -webkit-border-before: 0px none #333333; -webkit-border-end: 0px none #333333; -webkit-border-start: 0px none #333333; -webkit-transform-origin: 135.234px 27px;
}
/*#UL_64*/
#LI_65, #LI_69, #LI_73 { border-bottom-color: transparent; border-bottom-style: solid; border-bottom-width: 1px; border-left-color: transparent; border-left-style: solid; border-left-width: 1px; border-right-color: transparent; border-right-style: solid; border-right-width: 1px; border-top-color: transparent; border-top-style: solid; border-top-width: 1px; box-sizing: border-box; color: #333333; cursor: pointer; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 44px; line-height: 25.6px; list-style-type: none; margin-left: 1px; margin-right: 1px; outline-color: #333333; text-align: center; vertical-align: bottom; width: 86px; column-rule-color: #333333; -webkit-locale: "en"; perspective-origin: 43px 22px; -webkit-text-emphasis-color: #333333; -webkit-text-fill-color: #333333; -webkit-text-stroke-color: #333333; transform-origin: 43px 22px; border: 1px solid transparent; border-top: 1px solid transparent; border-right: 1px solid transparent; border-bottom: 1px solid transparent; border-left: 1px solid transparent; border-width: 1px; border-color: transparent; border-style: solid; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; list-style: none outside none; margin: 0px 1px; outline: #333333 none 0px; -webkit-border-after: 1px solid transparent; -webkit-border-before: 1px solid transparent; -webkit-border-end: 1px solid transparent; -webkit-border-start: 1px solid transparent; -webkit-transform-origin: 43px 22px;
}
/*#LI_65, #LI_69, #LI_73*/
#A_66, #A_70, #A_74 { border-bottom-color: black; border-left-color: black; border-right-color: black; border-top-color: black; box-sizing: border-box; color: black; font-family: "Source Sans Pro", sans-serif; font-size: 16px; line-height: 25.6px; list-style-type: none; outline-color: black; text-align: center; text-decoration: none; column-rule-color: black; -webkit-locale: "en"; -webkit-text-decorations-in-effect: none; -webkit-text-emphasis-color: black; -webkit-text-fill-color: black; -webkit-text-stroke-color: black; border: 0px none black; border-top: 0px none black; border-right: 0px none black; border-bottom: 0px none black; border-left: 0px none black; border-color: black; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; list-style: none outside none; outline: black none 0px; -webkit-border-after: 0px none black; -webkit-border-before: 0px none black; -webkit-border-end: 0px none black; -webkit-border-start: 0px none black;
}
/*#A_66, #A_70, #A_74*/
#SPAN_67, #SPAN_71, #SPAN_75 { bottom: -4px; box-sizing: border-box; font-family: "Source Sans Pro", sans-serif; font-size: 15px; font-weight: 100; left: 0px; letter-spacing: 0.75px; line-height: 24px; list-style-type: none; padding-right: 6px; position: relative; right: 0px; text-align: center; text-transform: uppercase; top: 4px; -webkit-locale: "en"; font: normal normal 100 normal 15px / 24px "Source Sans Pro", sans-serif; list-style: none outside none; padding: 0px 6px 0px 0px;
}
/*#SPAN_67, #SPAN_71, #SPAN_75*/
#IMG_68, #IMG_72 { bottom: -1px; box-sizing: border-box; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 17px; left: -3px; line-height: 25.6px; list-style-type: none; max-width: 100%; position: relative; right: 3px; text-align: center; top: 1px; vertical-align: middle; width: 22px; -webkit-locale: "en"; perspective-origin: 11px 8.5px; transform-origin: 11px 8.5px; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; list-style: none outside none; -webkit-transform-origin: 11px 8.5px;
}
/*#IMG_68, #IMG_72*/
#IMG_76 { bottom: 1px; box-sizing: border-box; display: inline-block; font-family: "Source Sans Pro", sans-serif; font-size: 16px; height: 17px; left: -3px; line-height: 25.6px; list-style-type: none; max-width: 100%; position: relative; right: 3px; text-align: center; top: -1px; vertical-align: middle; width: 22px; -webkit-locale: "en"; perspective-origin: 11px 8.5px; transform-origin: 11px 8.5px; font: normal normal normal normal 16px / 25.6px "Source Sans Pro", sans-serif; list-style: none outside none; -webkit-transform-origin: 11px 8.5px;
}
/*#IMG_76*/

PinGame3 - Script Codes JS Codes

$(document).ready(function()
{ initCopyMes(); setCount(); PinGame.init(); clickShowHide('.pin-game-show a', '.pin-game', '.pin-game-show'); clickShowHide('.pin-game-hide a', '.pin-game-show', '.pin-game');
}); // document.ready()
var PinGame =
{ init: function() //--- PinGame.init() --------------------------------o { $(".msg-card").hide(); PinGame.initSkip('.skip'); PinGame.initNo('.no'); PinGame.initYes('.yes'); PinGame.countOfPins = parseInt( $($(".count1")[0]).text() ); PinGame.countOfPinsNeeded = parseInt( $($(".count2")[0]).text() ); PinGame.checkPinCountDisplay(); }, clearCards: function() //--- PinGame.clearCards() ---------------------------------o { $(".pin-game .card").each( function() { if ( ! $(this).hasClass("msg-card")) // keep the msg cards { $(this).detach().remove(); } }); }, injectCards : function( url ) { $.get(url, function (data) { var response = $(data).find('.infiniteScroll'); stream.append(response.find('.row.stream-contents').html()); }); }, initSkip: function( skipClass ) //-- CLICK skip ------------------------------o { $(skipClass).click( function() { var card = this.closest('.card'); $(card).find(".card-header > *").hide(); $(card).css('transform', 'scale(0.1)'); $(card).animate({ width:0, marginLeft:0, marginRight:0 },500); PinGame.sequence( { 500: function() { $(card).remove(); }, }); }); }, initNo: function( jq ) //-- PinGame. CLICK no ------------------------------o { $( jq ).click( function() { var card = this.closest('.card'); $(card).css({ background: '#900' }); $(card).find(".card-header > *").hide(); PinGame.oneMoreReject(card); PinGame.absolutize(card); PinGame.prepYayCard('.yay-card', false); PinGame.sequence({ 250: function() //<<------ no { $(card).animate({ top: '-=600px' },500); $(card).animate({ width: '0', marginLeft: '0', marginRight: '0' },500); }, 1500: function() //<<------ no { $(card).remove(); PinGame.shrinkYayCard(); }, 2000: function() //<<------ no { $(".yay-card").hide(); } }); // no .sequence() }); // .no.click() }, yessing: false, initYes: function( yesClass )//-- PinGame. CLICK yes ------------------------------o { $(yesClass).click( function() { if (PinGame.yessing) return; PinGame.yessing = true; var card = this.closest('.card'); PinGame.oneMorePinCount(); PinGame.rejectCount = 0; PinGame.absolutize( card ); PinGame.prepYayCard('.yay-card', true); $("#pin-blank").css({ border:"0", background:"#00000000", boxShadow: "none", width:"0", margin:"0" }); PinGame.sequence( { 1: function() // <<--------- yes { $(card).animate( { top: "+=557" }, 1000); $(card).animate( { 'boxShadowColor': '#f00' }, 500); $("#pin-blank").animate( { width: "303px", "margin-left": "25px" }); $(card).css({ 'transform': 'scale(1.2)', 'z-index': '6' }); $(card).find(".card-header") .html('<div class="icon"><img alt="Icon saved by username black" src="https://upload.wikimedia.org/wikipedia/commons/4/41/Regular_hexagon.svg"></div><div class="inl">Pinned by Jay</div>') .css({ background: '#9ccf31' }); }, 700: function() // <<------- yes { $(card).css('transform', 'scale(1.0)'); $(card).find(".card-header").css( { background: 'none' }); }, 2000: function() // <<------- yes { PinGame.shrinkYayCard(); $(card).detach().insertAfter("#pin-blank"); $(card).css({ position: 'relative', top: '0', left: '0', transform: 'scale(1)', }); $("#pin-blank").css( { width: "0", "margin-left": "0" }); var it = $(".top-bar .text2"); $(it).animate({ top: '+=50px' }, 2); }, 2500: function() // <<--------- .yes { $(".yay-card").hide(); }, 2570: function() // <<--------- .yes { var it = $(".top-bar .text2"); $(it).animate({ top: '-=50px' }, 250); $(card).css({ 'z-index': '1' }); PinGame.yessing = false; } }); });// .yes.click() },// initYes() sequence : function( seq ) //--- PinGame. -----------------o { $.each( seq, function( k, v ) { setTimeout( v, k ); }); },// sequence() prepYayCard: function( crdClass, isYes ) //--- PinGame. ------------------o { if (isYes) { PinGame.msgYesIdx++; if (PinGame.msgYesIdx >= PinGame.msgYes.length) PinGame.msgYesIdx = 0; msgs = PinGame.msgYes[PinGame.msgYesIdx].split('|'); $(crdClass+" .fa") .removeClass('fa-ban') .addClass('fa-check'); } else { PinGame.msgNoIdx++; if (PinGame.msgNoIdx >= PinGame.msgNo.length) PinGame.msgNoIdx = 0; msgs = PinGame.msgNo[PinGame.msgNoIdx].split('|'); $(crdClass+" .fa") .removeClass('fa-check') .addClass('fa-ban'); } $(crdClass+" .text1").text(msgs[0]); $(crdClass+" .text2").text(msgs[1]); $(crdClass) .show() .css({ "transition-duration": '0s', "width": "303px", "margin-right": "20px", "margin-left": "5px", "transform": "scale(1.0)" }).css({ "transition-duration": '1000ms', }); }, // prepYayCard() shrinkYayCard: function() //--- PinGame. ------------------------o { $(".yay-card").css('transform', 'scale(0.1)'); $(".yay-card").animate( { width: "0px", "margin-right": "0px", "margin-left": "0px", }, 500); }, //shrinkYayCard absolutize: function(selector_expression) //--- PinGame. ----------------o { element = jQuery(selector_expression).eq(0); if (element.css('position') == 'absolute') { return element; } element.css({ position: 'absolute', top: element.offset().top + 'px', left: element.offset().left + 'px', width: element.width() + 'px', height: element.height() + 'px' }); return element; }, msgYesIdx: 0, //--- PinGame. ----------------o msgYes: [ "Pinned|Your bots hear and obey.", "Roger that.|Card moved to pins.", "As you wish.|Pinned.", "Riiiight.|Pinned and obeyed.", "Thank you.|Tell me more.", ], msgNoIdx: 0, //--- PinGame. ----------------o msgNo: [ "Got it.|No more like that.", "Oops.|Understood.", "Ahhhhh.|We get it now.", "Drat.|No more like that.", "Ack!|Sorry for the bad card.", ], countOfPins: null, //--- PinGame. ----------------o countOfPinsNeeded: 6, setPinCount: function( cnt ) { var $count = $(".top-bar .count1"); PinGame.countOfPins = cnt; $count.css({ background: 'black'}); setTimeout( function() { $count.text(cnt); PinGame.checkPinCountDisplay(); },1000); setTimeout( function() { $count.css({backgroundColor: 'rgba(0,0,0,0)'}); },2000); }, checkPinCountDisplay: function() { if (PinGame.countOfPins >= PinGame.countOfPinsNeeded) { $('.top-bar .of').hide(); $('.top-bar .count2').hide(); } }, oneMorePinCount: function() { PinGame.setPinCount( ++PinGame.countOfPins ); }, rejectCount: 0, oneMoreReject: function(card) { PinGame.rejectCount++; if (PinGame.rejectCount >= 3) { $(".boo-card").clone().insertAfter(card).show(); PinGame.rejectCount = 0; setTimeout( function() { console.log( $('.boo-card + .boo-card .skip').length ); PinGame.initSkip('.boo-card + .boo-card .skip'); }, 2000 ); } }
}; // class PinGame
//-------------------------------------------------o
//-------------------------------------------------o
//-------------------------------------------------o
//-------------------------------------------------o
function clickShowHide( clicker, showers, hiders, func )
{ $(clicker).click( function() { $(showers).show(); $(hiders).hide(); }); if (func != undefined) func();
}
function initCopyMes()
{ $(".copy-me").each( function() { var count = $(this).attr('times'); copyMe(this, count) });
}
function copyMe( el, times )
{ var it = $(el); for(var i=0;i<times;i++) { it.clone().insertAfter(it); }
}
function setCount()
{ var i = 1; $(".count").each( function() { $(this).text('' + i++); }); $(".score").each( function() { $(this).text((100-(i+=4)) + '%'); });
}
PinGame3 - Script Codes
PinGame3 - Script Codes
Home Page Home
Developer Ken Lane
Username kenlane22
Uploaded October 25, 2022
Rating 3
Size 18,875 Kb
Views 12,144
Do you need developer help for PinGame3?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Ken Lane (kenlane22) Script Codes
Name
A Pen by Ken Lane
Money Buttons
Tabs and Filters
Word Array Into Sentences
CSS Tab UI with SVG diagonal lines
Twinkling Word Cloud
Magnify Linked Page Area
Pin Game1
Pin Game2
ZoomCards
Create amazing captions with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!