﻿ body {
    /* baseball_vidgame_stylesheet_1 */
    background-color: grey;
    position:relative;
}



#field_container {
    background-color: green;
    position: absolute;
    width: 350px;
    height: 650px;
    top: 10px;
  /*  left: 200px;  */
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    border: 4px solid black;
    display: none;
}

#field_left_corner{
    position: absolute;
    left: 0;
    bottom: 0;
    z-index: 0;
    width:135px;
    display:none;
}

#field_right_corner {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 0;
    width: 170px;
    display: none;
}


#homeplate_circle{
    position:absolute;
    bottom: 0px;
    left: 0px;
    width:350px;
    z-index: 1;
    display:block;
}


#pitcher {
    position: absolute;
    top: 5px;
    left: 130px;
    width: 100px;
   /* border: 2px initial white; */
    z-index: 10;
    display:none;
}

#pitcher_windup {
    position: absolute;
    top: 8px;
    left: 130px;                             /*originallylocated at 200px*/
   /* width: 50px;  */
    height:98px;
    /*border: 2px initial white;  */
    z-index: 11;
    display:none;
}

#pitcher_windup_20 {
    position: absolute;
    top: 15px;
    left: 120px;                           /*originally located 230px*/
    /* width: 50px;  */
    height: 85px;
    /*border: 2px initial white;  */
    z-index: 11;
    display:none;
}

#pitcher_windup_30 {
    position: absolute;
    top: 15px;
    left: 130px;                               /*280px*/
    /* width: 50px;  */
    height: 90px;
    /*border: 2px initial white;  */
    z-index: 11;
    display:none;
}

#pitcher_windup_40 {
    position: absolute;
    top: 15px;
    left: 120px;                                 /*310px*/
    /* width: 50px;  */
    height: 85px;
    /*border: 2px initial white;  */
    z-index: 11;
    display: none;
}

#pitcher_windup_50 {
    position: absolute;
    top: 25px;
    left: 130px;                               /*360px*/
    /* width: 50px;  */
    height: 80px;
    /*border: 2px initial white;  */
    z-index: 11;
    display: none;
}

#pitcher_windup_60 {
    position: absolute;
    top: 20px;
    left: 110px;                                 /*390px*/
    /* width: 50px;  */
    height: 85px;
    /*border: 2px initial white;  */
    z-index: 11;
    display: none;
}

#pitcher_windup_100 {
    position: absolute;
    top: 5px;
    left: 130px;                           /*170px*/
    /* width: 50px;  */
    height: 100px;
    /*border: 2px initial white;  */
    z-index: 11;
    display: none;
}

#pitcher_windup_110 {
    position: absolute;
    top: 5px;
    left: 130px;
    /* width: 50px;  */
    height: 100px;
    /*border: 2px initial white;  */
    z-index: 10;
    display: block;
}

#batter {
    position: absolute;
    top: 490px;
    left: -10px;
    width: 150px;
}

#batter2 {
    position: absolute;
    top: 525px;
    left: 55px;
    width: 45px;
    z-index:5;
    display:block;
}

#batter3 {
    position: absolute;
    top: 540px;
    left: 0px;                      /*original 85px*/
    width: 75px;
    z-index: 6;
    display:none;
}

#batterless {
    position: absolute;
    top: 540px;
    left: 80px;
    width: 46px;
    z-index: 8;
    display: none;
}

#bbat {
    position: absolute;
    top: 565px;
    left: 115px;
    width: 50px; 
    z-index: 7;
    display: none;
    transform-origin: top left;
}

#catcher {
    position: absolute;
   /* top: 610px; */
   bottom:0px;
    left: 135px;
    width: 45px;
    z-index: 5;
    display:block;
}

#field_container {
    border-bottom: 4px black solid;
}


    #baseball {
    position: absolute;
    top: 50px;
    left: 150px;
    width: 8px;
    z-index: 100;
    display: none;
}


/*
#pseudo_bball_1 {
    position: absolute;
    top: 608px;
    left: 165px;
    width: 8px;
    z-index: 100;
    display: block;
}
#pseudo_bball_2 {
    position: absolute;
    top: 575px;
    left: 185px;
    width: 8px;
    z-index: 100;
    display: block;
}
#pseudo_bball_3 {
    position: absolute;
    top: 580px;
    left: 120px;
    width: 8px;
    z-index: 100;
    display: block;
}
#pseudo_bball_4 {
    position: absolute;
    top: 545px;
    left: 140px;
    width: 8px;
    z-index: 100;
    display: block;
}                        */           



#home_plate {
    position: absolute;
   /* top: 600px;  */
    bottom: 0px;
    left: 136px;
    width: 42px;
    height: 10px;
    z-index: 1;
    display: none;
}


#homeplate_strikezone{
    position:absolute;
    top:560px;
    left:135px;
    width:40px;
    height:40px;
    border:2px solid black;
    background-color:white;
    z-index:2;
    display:block;
}


#ready {
    position: absolute;
    bottom: 5px;
    right: 5px;
    background-color: lightblue;
    width: 60px;
    height: 50px;
    z-index: 3;
}

#swing {
    position: absolute;
    bottom: 5px;
    right: 5px;
    background-color: yellow;
    width: 60px;
    height: 50px;
    z-index:2;
}

#placeholder {
    position: absolute;
    bottom: 5px;
    right: 5px;
    background-color: green;
    border:1px solid black;
    width: 60px;
    height: 50px;
    z-index:1;
}

#help_button{
    position: absolute;
    top: 5px;
    right: 5px;
    color:white;
    background-color: red;
    width: 60px;
    height: 25px;
    z-index: 2;
}

#indicator {
    color: white;
    font-weight: 900;
    position: absolute;
    top: 440px;
    left: 150px;
    display: block;
}

#indicator2 {
    color: white;
    font-weight: 900;
    position: absolute;
    top: 550px;
    left: 150px;
}

#strike_ball {
    position: absolute;
    top: 300px;
    left: 20px;
    font-size: 24px;
}

#score_table {
    /*display:block;*/
    background-color: black;
    color: white;
    border: 4px solid black;
    border-collapse: collapse;
    /*width: 120px;*/
    margin-top: 0px;
    margin-left: 5px;
    z-index: 9;
}

.hilite {color:yellow;}

td, th {
    /*display:table-cell; */
    /*border: 1px solid green;*/
    width: 15px;
    height: 10px;
    font-family: Arial;
    text-align: right;
    font-size: 10px;
}

.th_left {
    text-align: left;
}

.right_allign{
    text-align:right;
}

#ryecatcher_100px {
    border: 2px solid black;
    margin: 5px;
}


#ryecatcher_button, #ryecatcher_button2{
    font-family:'Times New Roman', Times, serif;
    font-size:10px;
    font-weight:600;
    text-align:center;
    padding-top:1px;
    color:gold;
    background-color:firebrick;
    width:105px;
    height:19px;
    border:2px solid black;
    margin:5px;
 /*   margin-top:5px;
    margin-left:5px;  */
}


#exit_game_notice, #exit_game_notice2{
    display:none;
    position:absolute;
    width:200px;
    top:350px;
    left:70px;
    border:4px solid yellow;
    padding: 5px;
    background-color:white;
    color:red;
    z-index:100;
}

#exit_proceed, #exit_proceed2{
    background-color:yellow;
    border:2px solid black;
    margin:5px;
}

#exit_cancel, #exit_cancel2 {
    background-color: yellow;
    border: 2px solid black;
    margin: 5px;
}

#strike_zone {
    position: absolute;
    width: 40px;
    height: 40px;
    /*border: 2px dashed white;*/
    top: 560px;
    left: 135px;
    /*background-color: white;
            opacity: .25;  */
    border: 2px dashed white;
    display: block;
    opacity: 0;
}

#strike_zone1 {
    position: absolute;
    width: 40px;
    height: 40px;
    /*border: 2px dashed white;*/
    top: 560px;
    left: 135px;
    /*background-color: white;
            opacity: .25;  */
    /*    border: 2px dashed white;   */
    border-top: 2px dashed rgba(255, 255, 255, 0.99);
    border-left: 2px dashed rgba(255, 255, 255, 0.99);
    border-bottom: 2px dashed rgba(255, 255, 255, 0.25);
    border-right: 2px dashed rgba(255, 255, 255, 0.25);
    display: block;
    /* opacity: .2;  */
}

#strike_zone2 {
    position: absolute;
    width: 40px;
    height: 40px;
    /*border: 2px dashed white;*/
    top: 563px;
    left: 138px;
    /*background-color: white;
            opacity: .25;  */
   /*    border: 2px dashed white;   */
    border-top: 2px dashed rgba(255, 255, 255, 0.65);
    border-left: 2px dashed rgba(255, 255, 255, 0.65);
    border-bottom: 2px dashed rgba(255, 255, 255, 0.25);
    border-right: 2px dashed rgba(255, 255, 255, 0.25);
    display: block;
   /* opacity: .2;  */
}

#strike_zone3 {
    position: absolute;
    width: 40px;
    height: 40px;
    /*border: 2px dashed white;*/
    top: 566px;
    left: 141px;
    /*background-color: white;
            opacity: .25;  */
 /*   border: 2px dashed white;  */
    border-top: 2px dashed rgba(255, 255, 255, 0.65);
    border-left: 2px dashed rgba(255, 255, 255, 0.65);
    border-bottom: 2px dashed rgba(255, 255, 255, 0.25);
    border-right: 2px dashed rgba(255, 255, 255, 0.25);
    display: block;
    /*  opacity: .2;  */
}

#strike_zone4 {
    position: absolute;
    width: 40px;
    height: 40px;
    /*border: 2px dashed white;*/
    top: 569px;
    left: 144px;
    /*background-color: white;
            opacity: .25;  */
    /* border: 2px dashed rgba(255, 255, 255);  */
    border-top: 2px dashed rgba(255, 255, 255, 0.65);
    border-left: 2px dashed rgba(255, 255, 255, 0.65);
    border-bottom: 2px dashed rgba(255, 255, 255, 0.25);
    border-right: 2px dashed rgba(255, 255, 255, 0.25);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    display: block;
    /*opacity: .2;*/
}

#strike_zone5 {
    position: absolute;
    width: 30px;
    height: 30px;
    /*border: 2px dashed white;*/
    top: 572px;
    left: 147px;
    /*background-color: white;
            opacity: .25;  */
    /* border: 2px dashed rgba(255, 255, 255);  */
  /*  border-top: 2px dashed rgba(255, 255, 255, 0.0);
    border-left: 2px dashed rgba(255, 255, 255, 0.0);  */
    border-bottom: 2px dashed rgba(255, 255, 255, 0.99);
    border-right: 2px dashed rgba(255, 255, 255, 0.99);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    display: block;
    /*opacity: .2;*/
}  

#mound {
    position: absolute;
    top: 85px;
    left: 65px;
    z-index: 8;
}

#inning_container {
    position: absolute;
    top: 94px;
    left: 5px;
    font-family: Arial;
    text-align: left;
    font-size: 14px;              /*10px*/
    font-weight: 500;             /*700*/
    margin-left: 5px;
    z-index: 20;
    color:white;
}

#bases_container {
    position: absolute;
    top: 118px;                           /*106px*/
    left: 5px;
    font-family: Arial;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    margin-left: 5px;
    z-index: 20;
    color:white;
    width:110px;
}

#latest_event_container {
    position: absolute;
    top: 158px;                      /*121px*/
    left: 5px;
    font-family: Arial;
    text-align: left;
    font-size: 14px;
    font-weight: 500;
    margin-left: 5px;
    z-index: 20;
    color:white;
    width:110px;
}

#pitcher_indicator_container {
    position: absolute;
    width:40px;
    height:40px;
    top: 5px;
    left: 185px;            /*initially 215px*/
    font-family: Arial;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    margin-left: 5px;
    z-index: 20;
}

#batter_indicator_container {
    position: absolute;
    width:40px;
    height:40px;
    top: 520px;
    left: 5px;
    font-family: Arial;
    text-align: left;
    font-size: 10px;
    font-weight: 700;
    margin-left: 5px;
    z-index: 20;
}

#outs_container {
    /*position:absolute;
              top:180px;
            left:5px;  */
    color: white;
    font-family: Arial;
    font-size: 14px;
}

#strikes_container {
    /* position: absolute;
             top: 200px;
            left: 5px;  */
    color: white;
    font-family: Arial;
    font-size: 14px;
}

#balls_container {
    /* position: absolute;
           top: 220px;
            left: 5px;   */
    color: white;
    font-family: Arial;
    font-size: 14px;
}

#field_button {
    position: absolute;
    top: 35px;
    right: 5px;
    background-color: coral;
    background-image: url(bball_images/field_button_60x50px.jpg);
    width: 60px;
    height: 50px;
    z-index: 1;
}

#out_str_bll_container {
    position: absolute;
    width: 60px;
    top: 90px;
    right: 5px;
}


#pitch_result_indicator_container {
    position: absolute;
    width: 60px;
    top: 450px;
    left: 130px;
    color: white;
    font-family: Arial;
    font-size: 14px;
    text-align:center;
    z-index:5;
}

#beginning_inning_indicator {
    position: absolute;
    width: 90px;
    top: 300px;
    left: 110px;
    color: white;
    font-family: Arial;
    font-size: 14px;
    text-align: center
}


#instructions_ready {
    position: absolute;
    width: 90px;
    top: 250px;
    left: 110px;
    color: yellow;
    font-family: Arial;
    font-size: 10px;
    text-align: center;
    z-index: 5;
}

#instructions_swing {
    position: absolute;
    width: 90px;
    top: 350px;
    left: 110px;
    color: yellow;
    font-family: Arial;
    font-size: 10px;
    text-align: center;
    z-index: 5;
}


.wwhite {
    font-family: Arial;
    color: white;
}

.yyellow {
    font-family: Arial;
    color: yellow;
}


#beginning_inning_indicator_container {
    position: absolute;
    top: 300px;
    width: 100px;
    height: 50px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    /*border: 1px solid black;  */
    font-size: 14px;
    text-align: center;
    display: none;
}

#you_hit {
    display: none;
}

#you_pitch {
    display: none;
}




#pitch_buttons_placeholder {
    position: absolute;
    width: 60px;
    right: 5px;
    bottom: 5px;
    /* top: 180px;  */
    display: none;
    z-index:1;
}

.pitch_buttons2 {
    /* position: absolute;
    bottom: 5px;
    right: 5px;  */
    background-color: green;
    width: 60px;
    height: 50px;
    /*margin-bottom: 5px; */
    margin-top: 5px;
    text-align: center;
    border: 1px solid black;
}


#pitch_buttons_container{
    position: absolute;
    width:60px;
    right: 5px;
    bottom: 5px;
    /* top: 180px;  */
    display:none;
    z-index:2;
}


.pitch_buttons {
    /* position: absolute;
    bottom: 5px;
    right: 5px;  */
    background-color: green;          /*yellow*/
    /* background-image:url("bball_images/bball_yellow2.jpg");  */
    background-image:url("bball_images/bball_trans_50x50px.png");
    background-repeat:no-repeat;
    background-position:center;
    width: 60px;
    height: 50px;
    /*margin-bottom: 5px; */
    margin-top: 5px;
    text-align: center;
}


#skip {
    position: absolute;
    /*bottom: 5px; */
    top: 180px;
    right: 5px;
    background-color: orange;
    width: 60px;
    height: 50px;
    display: none;
}


#arrow100 {
    position: absolute;
    top: 50px;
    left: 150px;
    width: 8px;
    height: 80px;
    z-index: 100;
    display: block;
    transform-origin: top center;
    /* opacity:0.25;  */
}

#control_button_left {
    position: absolute;
    bottom: 220px;
    left: 5px;
    background-color: green;           /*yellow*/
    background-image: url("bball_images/aim_left_trans_50x50px.png");
    background-repeat: no-repeat;
    background-position: center;
    font-size:11px;
    width: 60px;
    height: 50px;
    z-index: 3;                                                   /*originally 2*/
}

#control_button_right {
    position: absolute;
    bottom: 160px;
    left: 5px;
    background-color: green;           /*yellow*/
    background-image: url("bball_images/aim_right_trans_50x50px.png");
    background-repeat: no-repeat;
    background-position: center;
    font-size:11px;
    width: 60px;
    height: 50px;
    z-index: 3;                                                        /*originally 2*/
}



#control_button_left_placeholder {
    position: absolute;
    bottom: 220px;
    left: 5px;
    background-color: green; /*yellow*/
    /*background-image: url("bball_images/aim_left_trans_50x50px.png");
    background-repeat: no-repeat;
    background-position: center;   */
    font-size: 11px;
    width: 60px;
    height: 50px;
    z-index: 2;
    display: none;
}

#control_button_right_placeholder {
    position: absolute;
    bottom: 160px;
    left: 5px;
    background-color: green; /*yellow*/
    /*background-image: url("bball_images/aim_right_trans_50x50px.png");
    background-repeat: no-repeat;
    background-position: center;   */
    font-size: 11px;
    width: 60px;
    height: 50px;
    z-index: 2;
    display: none;
}


