body {
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
    font-size: 14px;
}

#title {
    position: relative;
    top: 100px;
}

a:link {
    text-decoration: none;
    color: #eb21a4;
}

a:visited {
    text-decoration: none;
    color: #eb21a4;
}

#bg {
    z-index: -99;
    width: 1200px;
    height: 800px;
    background-color: lightgreen;
    background-image: url("pics/graphics/starbackgroundk.jpg");
    background-repeat: no-repeat;
}
#body-sim{
    z-index: 0;
    width: 900px;
    height: 437px;
    position: relative;
    top: 100px;
    background-color: white;
    background-image: url("pics/graphics/bearbg.jpg");
    background-repeat: no-repeat;
    border-radius: 18px 18px 18px 18px;
    -moz-border-radius: 18px 18px 18px 18px;
    -webkit-border-radius: 18px 18px 18px 18px;
}

.normal {
    border-color: limegreen;
    border-width: 4px 8px 4px 8px;
    border-style: solid;
}

.mode {
border-color: #FFDB47;
border-width: 4px 8px 4px 8px;
border-style: solid;

}

.badgem {
border-color: mediumpurple;
border-width: 4px 8px 4px 8px;
border-style: solid;

}

#top{
    width: 900px;
    height:75px;
    top:85px;
    position: relative;
}

.arrow1
{
position: absolute;
left: 0;
display: inline-block;
}

.arrow2
{
position: absolute;
right: 0;
display: inline-block;
}

#topbar{
    width: 803px;
    height: 73px;
    display: inline-block;
    background-color: #ffffdd;
     border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px 15px 15px 15px;
    -webkit-border-radius: 15px 15px 15px 15px;
    border: 4px solid limegreen;
}

.bannern{
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("pics/graphics/banner_n.jpg");
}

.bannerr{
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("pics/graphics/banner_r.jpg");
  
}

.bannerb{
    background-repeat: no-repeat;
    background-position: center;
    background-image: url("pics/graphics/banner_b.jpg");   
}

#Ticket{
    width: 145px;
    height: 50px;
    margin: 5px;
    border: 0px;
    background-image: url("pics/graphics/ticketbutton.png");
    background-color: transparent;
}
#Ticket5{
   width: 145px;
    height: 50px;
    margin: 5px;
    border: 0px;
    background-image: url("pics/graphics/royalbutton.png");
    background-color: transparent;
}

#badgebutton{
    width: 145px;
    height: 50px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-right: 70px;
    border: 0px;
    background-image: url("pics/graphics/badgebutton.png");
    background-color: transparent;
}

#royalbutton{
    position: relative;
    width: 70px;
    top: 0px;
    left:-330px;
    z-index: 999;
}

#royal{

    width: 50px;
    height: 50px;
    margin: 6px;
    border: 0px;
    background-repeat: no-repeat;
    z-index: 999;
}

#buttoncontainer{
position: relative;
display: inline-block;
background-color: transparent;
/* top:-12px; */
left:-15px;
width:352px;
height: 61px;
overflow: hidden;
z-index: 1;
}

#ss, tt, bb{
}

.target{
display: none;
}

.target.first{
    width: inherit;
    display: inline-block;
}


.premticket {
    background-image: url("pics/graphics/ticket_t.png");
    background-color: transparent;
    
}

.discx{
    background-image: url("pics/graphics/discx.png");
    background-color: transparent;
}

.badgex
{
    background-image: url("pics/graphics/badge_s.png");
    background-color: transparent;
}


#buttonbar{
    width: 900px;
    height: 62px;
    position: relative;
    top: 33px;
    background-color: #ffffdd;
    border-top-style: solid;
    border-top-color: palegreen;
    -webkit-border-bottom-right-radius: 12px;
    -webkit-border-bottom-left-radius: 12px;
    -moz-border-radius-bottomright: 12px;
    -moz-border-radius-bottomleft: 12px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    z-index: 99;
}

#menubar {
position: relative;
 width: 1200px;
 height: 110px;
 top: 55px;
 background-color: lightgreen;
 background-image: url("pics/graphics/menubark.jpg");
 background-repeat: no-repeat;
}

.tooltip {
    position: relative;
    display: inline-block;
    border-bottom: 1px dotted #fff;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: lightgreen;
    color: #fff;
    font-family: "Trebuchet MS", Helvetica, sans-serif;
    text-align: center;
    border-radius: 6px;
    border-bottom: 1px solid #fff;
    padding: 5px 0;
    
    /* Position the tooltip */
    position: absolute;
    z-index: 99;
    bottom: 100%;
    left: 50%;
    margin-left: -60px;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}

#soloyolo{
    width: 143px;
    height: 50px;
    margin: 5px;
    border: 0px;
    background-image: url("pics/graphics/solobuttonk.png");
    background-repeat: no-repeat;
    background-color: transparent;
}
#tenplusone{
    width: 144px;
    height: 50px;
    margin: 5px;
    border: 0px;
    background-image: url("pics/graphics/tenplusonek.png");
    background-repeat: no-repeat;
    background-color: transparent;
}
#options{
    width: 152px;
    height: 110px;
    position: absolute;
    right:0px;
    margin: 0px;
    border: 0px;
    background-color: transparent;
}
#optionbox{
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
}

#reset{
    width: 152px;
    height: 110px;
    position: absolute;
    left:0px;
    margin: 0px;
    border: 0px;
    background-color: transparent;
}

div.icontool {
    font-size:13px;
    width: 200px;
    height: 325px;
    border: 1px solid #eb21a4;
    background-color: #ffffdd;
    display: none;
    top: 45px;
    left: -210px;
    position: absolute;
}


#showhistory{
    width: 152px;
    height: 110px;
    position: absolute;
    left:600px;
    margin: 0px;
    border: 0px;
    background-color: transparent;
}
#bottombar{
    width: 1200px;
    top: 240px;
    position: relative;
    background-color: aliceblue;
}
#credits{
    width: 152px;
    height: 110px;
    position: absolute;
    right:152px;
    margin: 0px;
    border: 0px;
    background-color: transparent;
}
#cr{
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
}

#FPCount {
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
    width: 75px;
    height: 26px;
    margin: 5px;
    margin-left: 20px;
    padding: 13px;
    border: 0px;
    position: relative;
    float:left;
    background-color: transparent;
    background-image: url("pics/graphics/Friend_points25.png");
    background-repeat: no-repeat;
    background-position: center left;
}

#ticketscount {
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
    width: 35px;
    height: 26px;
    margin: 5px;
    padding: 13px;
    border: 0px;
    position: relative;
    float:left;
    background-color: transparent;
    background-image: url("pics/graphics/ticket_tiny.png");
    background-repeat: no-repeat;
    background-position: center left;
}

#badgescount {
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
    width: 40px;
    height: 26px;
    margin: 5px;
    padding: 13px;
    border: 0px;
    position: relative;
    float:left;
    background-color: transparent;
    background-image: url("pics/graphics/badge_t.png");
    background-repeat: no-repeat;
    background-position: center left;
}

#counttext {
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    font-size: 11px;
    text-align: justify;
    color: saddlebrown;
    padding: 3px;
    border: 0px;
    position: relative;
    float:left;
    background-color: transparent;
}
#ok{
    width: 149px;
    height: 50px;
    margin: 5px;
    border: 0px;
    margin-top: 10px;
    background-repeat: no-repeat;
    background-image: url("pics/graphics/ok.png");
    background-color: transparent;
}

#result {
    position: relative;
    margin:0 auto;
    padding: 40px 0px;
    text-align:center;
    color: black;
	width:700px;
}


#result img {

    -webkit-animation: fadein 1s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 1s; /* Firefox < 16 */
        -ms-animation: fadein 1s; /* Internet Explorer */
         -o-animation: fadein 1s; /* Opera < 12.1 */
            animation: fadein 1s;
}

@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}



.history-section {
    width: 1200px;
    height: 250px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.black_overlay{
	display: none;
	position: fixed;
	top: 0%;
	left: 0%;
	width: 100%;
	height: 100%;
	background-color: black;
	z-index:1001;
	-moz-opacity: 0.8;
	opacity:.80;
	filter: alpha(opacity=80);
}

.white_content {
	display: none;
	position: fixed;
	top: 15%;
	left: 30%;
	width: 40%;
	height: 70%;
	padding: 16px;
	border: 16px double #FFF08F;
    /*border: 10px solid transparent;
    border-image: url("pics/graphics/borderimage.png") 45 stretch;
    -webkit-border-image: url("pics/graphics/borderimage.png") 45 stretch; /* Safari 3.1-5 */
    -o-border-image: url("pics/graphics/borderimage.png") 45 stretch; /* Opera 11-12.1 */ */
    border-radius: 15px 15px 15px 15px;
    -moz-border-radius: 15px 15px 15px 15px;
    -webkit-border-radius: 15px 15px 15px 15px;
    background-color: white;
    max-width: 500px;
	z-index:1002;
	overflow: auto;
}

.header {
width:auto;
background-color: #ff9ec7;
padding:10px;
font-weight: bold;
font-size: 20px;
}

.selector input{
    margin:0;padding:0;
    -webkit-appearance:none;
       -moz-appearance:none;
            appearance:none;
    display: none;
}

.selector input:checked +.option-group{
    -webkit-filter: none;
       -moz-filter: none;
            filter: none;
}

.selector input:active +.option-group{opacity: .9;}

.defaultbox{background-image:url("pics/logos/default.png");}
.guaranteesr{background-image:url("fff.png");}
.newrate{background-image:url("fff.png");}
.FooF{background-image:url("pics/logos/foof.png");}
.TwinkleBell{background-image:url("pics/logos/twinkle.png");}
.ArS{background-image:url("pics/logos/ars.png");}
.IB{background-image:url("pics/logos/ib.png");}
.PopnStar{background-image:url("pics/logos/popnstar.png");}
.Lancelot{background-image:url("pics/logos/lancelot.png");}
.Reberserk{background-image:url("pics/logos/reberserk.png");}
.Tenjou{background-image:url("pics/logos/tenjou.png");}
/*.first{background-image:url("fff.png");}*/
.second{background-image:url("pics/logos/1and2.png");}
.third{background-image:url("pics/logos/3rdgen.png");}


.wild{background-image:url("pics/logos/wild.png");}
.pop{background-image:url("pics/logos/pop.png");}
.cool{background-image:url("pics/logos/cool.png");}
.reprint{background-image:url("pics/logos/reprint.png");}

.option-group{
    cursor:pointer;
    background-repeat:no-repeat;
    background-position: center; 
    display:inline-block;
    width:100px;height:70px;
    -webkit-transition: all 100ms ease-in;
       -moz-transition: all 100ms ease-in;
            transition: all 100ms ease-in;
    -webkit-filter: brightness(1.0) grayscale(1) opacity(.7);
       -moz-filter: brightness(1.0) grayscale(1) opacity(.7);
            filter: brightness(1.0) grayscale(1) opacity(.7);
}

.option-group:hover{
    -webkit-filter: brightness(1.0) grayscale(.5) opacity(.9);
       -moz-filter: brightness(1.0) grayscale(.5) opacity(.9);
            filter: brightness(1.0) grayscale(.5) opacity(.9);
}

.reprint-section{
    width: 100%;
}

.reprint-item{
    cursor:pointer;
    display:inline-block;
    margin: 5px;
    text-align: "center";
}

.reprint-item:hover{
    background-color: PaleTurquoise;
}

.selector input:checked +.reprint-item{
    background-color: limegreen;
}

div.icon {
    width: 120px;
    height: 119px;
    margin: 5px;
    display:inline-block;
}

div.card {
    width: 250px;
    height: 350px;
    margin-top: 0px;
    display:inline-block;
}

#twitter{
    width: 152px;
    height: 110px;
    position: absolute;
    left:151px;
    margin: 0px;
    border: 0px;
    background-color: transparent;
}

#twfeed{
    text-align:center;
    font-family:"Trebuchet MS", Helvetica, sans-serif;
    color: saddlebrown;
}