body
{
    background: #5A7999;
    margin: 0px;
    padding-left: 0px;
    padding-right: 0px;    
    padding-top: 0px;
    padding-bottom: 0px;
font-family: 'Montserrat', sans-serif;
  color: #FFF;

}

a.menu
{
   text-decoration: none;
}


td
{
font-family: 'Montserrat', sans-serif;
 	color: #FFF;
text-shadow: 
   2px 2px 0 #344960;

}
#my_dps
{
    font-weight: bold;
}

input[type="text"] {

  font-size: 125%;

}

input[type="text"].dps{

  width: 72px;
}

input[type="text"].total_dps{

  width: 82px;
}

input[type="text"].total_dpt{

  width: 102px;
}

input[type="text"].total_shot{

  width: 102px;
}


input[type="text"].statues {

  background-color : #e83315; 
  color: #FFF;
  cursor: pointer;
  font-size: 125%;
  width: 60px;
}

input[type="number"].statue {

  background-color : #e83315; 
  color: #FFF;
  width: 36px;
}

#my_statues
{
    min-width:420px;
    display: none;
    font-size: 80%;
    padding-bottom: 0px;
    padding-left: 4px;
    padding-right: 4px;
    padding-top: 0px;
}

input[type="number"].time{

  background-color : #fff; 
  color: #000;
  font-size: 125%;
  width: 64px;
}

header{
  position:fixed;
  top:0;
  z-index:999;
  left:0;
  width:100%;
  background:#5A7999;
 
  padding-top: 4px;
  z-index: 3;
}
footer 
{
  bottom: 0;
  left: 0;
  position: fixed;
  min-width: 420px;
  min-height: 20px;
  text-align: center;
  width: 100%;
  background: #336340;
  padding-top: 4px;
  padding-bottom: 0px;
  box-shadow: 0 0 15px #000
}
#content
{
    margin-top: 186px;
    margin-bottom: 24px;
    width: 100%;
    min-width: 420px;
    text-align: center;
}

.drop_1px
{
   display:   inline-block;
   position:  relative;
   top:       1px;
}
.left_1px
{
   display:   inline-block;
   position:  relative;
   left:       1px;
}
.drop_8px
{
   display:   inline-block;
   position:  relative;
   top:       8px;
}
.padding_4px_rt
{
   display:         inline-block;
   position:        relative;
   left:            1px;
   padding-right:   4px;
}
.padding_10px_lft
{
   display:         inline-block;
   position:        relative;
   left:            36px;
   padding-right:   0px;
   width: 160px;
}
.totals_left
{
   display:    inline-block;
   width:      404px;
   text-align: right;
   padding-right: 16px;
   padding-top: 6px;
   font-size: 110%;
}
.totals_left2
{
   width:      404px;
   text-align: right;
   padding-right: 16px;
   padding-top: 0px;
   padding-bottom: 0px;  !important
   font-size: 110%;
}
.totals_left3
{
   width:      404px;
   text-align: right;
   padding-right: 16px;
   padding-top: 0px;   !important
   font-size: 110%;
}
#dmg_totals
{
   width:   100%;
   background:    #336340;
   padding-top:    2px;
   padding-bottom: 8px;
   text-shadow: 1px 1px 0 #1D3824;
  box-shadow: 0 0 15px #000
}
#total_cost_div
{
   padding-top: 7px;
   padding-bottom: 0px;
}
.statue
{
   display:  inline-block;
   padding: 1px;
}
.pp_icon
{
   position: relative;
}


input[type=checkbox] {
display:none;
}
 
input[type=checkbox] + label
{
background-image: url('pp_d.png');
background-size: 18px auto;
background-repeat: no-repeat;
background-position: center;
height: 24px;
width: 24px;
display:inline-block;
padding: 0 0 0 0px;
cursor: pointer;
}
input[type=checkbox]:checked + label
{
background-image: url('pp.png');
background-size: 18px auto;
background-repeat: no-repeat;
background-position: center;
height: 24px;
width: 24px;
display:inline-block;
padding: 0 0 0 0px;
cursor: pointer;
}

.lc
{
   height: 120px;
   width:  120px;
   background-color: #61455E;
   margin-left: 2px;
   margin-right: 2px;
   padding: 0px;
   display: inline-block;
   border-style: solid;
   border-color: #124847;
   background: url( "water.png" );
   background-size: contain;
   background-repeat: no-repeat;
   overflow: hidden;
}

.lc_image
{
   border:     0px;
   height:   100px;
   width:    100px;
   margin-top: -2px;
   margin-left: -16px;
}

.lc_image_div
{
   position: relative;
}

.troop_image_div
{
   position: relative;
   top: -51px;
   left: -25px;
   height: 0px;
}

.troop_image
{
   border:     0px;
   height:   70px;
   width:    70px;
}


.lc_lvl_div
{
   position: relative;
   top: -99px;
   left: 55px;
   text-align: left;
   padding-left: 6px;
   height: 0px;
   cursor: pointer;

}
.hero_txt
{
text-shadow: 
   2px 2px 0 #344960;
position: relative;
top: +2px;
left: +6px;
   cursor: default;

}

.lc_lvl
{
    font-size: 100%;
    width: 56px;
    height: 24px;
}



select {
    color:#fff;
    text-shadow: 2px 2px 0 #124847; 
    font-family: 'Montserrat', sans-serif; 
}

select option {
    color:#fff;
    font-family: 'Montserrat', sans-serif; 
    text-shadow: 2px 2px 0 #124847; 
}



.water {

    background: #30c2b6;
}
.bo_count {

    background: #336340;
    font-size: 100%;
    width: 50px;
    height: 32px;
}

.bo_toggle
{
     display: inline-block; 
     width: 30px; 
     height: 24px;
     position: relative;
     left: 2px;
}


select.water option {
    background: #30c2b6;
    color:#fff;
    font-family: 'Montserrat', sans-serif; 
}


.troops_div
{
   position: relative;
   top: -11px;
   left: 33px;
   text-align: left;
   padding-left: 6px;
   height: 0px;
   cursor: pointer;
}
.troops
{
    font-size: 100%;
    width: 78px;
    height: 24px;
}


#header-banner
{
  min-width: 420px;
  width: 420px;
  padding: 0px;
  margin: 0px;
}

.bb_logo
{
  vertical-align: middle; 
  width: 140px; 
  display: inline-block;
}

.title_div
{
  vertical-align: middle; 
  width: 260px; 
  display: inline-block;
}
.big_title
{
  width: 260px; 
  height: 60px; 
  font-family: 'Bangers', cursive; 
  font-weight: normal;
  text-shadow: 4px 4px 0 #344960; 
  font-size: 56px; 
  margin-bottom: 8px;
}
.sub_title
{
  display: block; 
  width: 260px; 
  height: 10px; 
  font-family: 'Bangers', cursive; 
  font-weight: normal;
  text-shadow: 2px 2px 0 #344960; 
  font-size: 16px;
  position: relative;
  top: -12px;
}
.sub_title2
{
  display: block; 
  width: 260px; 
  height: 20px; 
  font-family: 'Bangers', cursive; 
  text-shadow: 2px 2px 0 #344960; 
  font-size: 20px;
  padding-left: 8px;
  position: relative;
  top: -4px;
  left: 0px;
  text-align: left;
}
.lc_click_top
{
   width: 124px;
   height: 70px;
   opacity: 0.6;
   position: relative;
   top: -124px;
   left: 0px;
}
.lc_click_bottom
{
   width: 124px;
   height: 54px;
   opacity: 0.5;
   position: relative;
   top: -124px;
   left: 0px;
}
.lc_click_remove
{
   position: relative;
   top: -154px;
   text-align: left;
   padding-left: 4px;
   height: 0px;
}
#legal info
{
    width: 100%;
    text-align: center;
    margin: 0px;
    padding: 0px;
}
#legal_toggle
{
    cursor: pointer;
    font-size: 70%;
    font-weight: normal;
    text-align: center;
    margin: 0px;
    padding: 0px;
}
#legal_contents
{
    display: none;
    font-weight: normal;
    margin: 0px;
    padding: 4px;
    font-size: 70%;
    text-align: left;
}
a
{
  color: #FFF;
}

.dropdown {
    position: relative;
    display: inline-block;
}
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

.dropdown:hover .dropdown-content {
    display: block;
}

#my_armory {

   display: none;

}

.troop_count
{
  display: inline-block; 
  position: relative;
  top: -32px;
  left: 38px;
  height: 0px; 
  width: 30px;
  text-align: right;
  font-family: 'Montserrat', sans-serif; 
  text-shadow: 2px 2px 0 #124847; 
  font-size: 16px;
}

.troop_level
{
  height: 60px; 
  width: 90px; 
  border-style: solid;
  border-color: #1f2c32;
  border-width: 2px;
  display: inline-block;
  overflow: hidden;
  margin-top: 8px;
  margin-left: 4px;
  margin-right: 4px;
   background: url( "troop_lvl_bg.png" );
   background-size: contain;
   background-repeat: no-repeat;
}
.troop_level_image
{
   position: relative;
   top: 4px;
   left: -2px;
}

.troop_level_text
{
  display: inline-block; 
  position: relative;
  top: -42px;
  left: -34px;
  height: 0px; 
  width: 34px;
  text-align: right;
  font-family: 'Montserrat', sans-serif; 
  text-shadow: 2px 2px 0 #124847; 
  font-size: 14px;
}
.troop_level_add
{
  display: block; 
  position: relative;
  top: -60px;
  left: -26px;
  height: 30px; 
  width: 200px;
  text-align: center;
  font-family: 'Montserrat', sans-serif; 
  text-shadow: 2px 2px 0 #124847; 
  font-size: 28px;
  vertical-align: top; 
  cursor: pointer;
}
.troop_level_sub
{
  display: block; 
  position: relative;
  top: -60px;
  left: -26px;
  height: 30px; 
  width: 200px;
  text-align: center;
  font-family: 'Montserrat', sans-serif; 
  text-shadow: 2px 2px 0 #124847; 
  font-size: 28px;
  vertical-align: top; 
  cursor: pointer;
}
.troop_level_sign
{
  display: inline-block; 
  position: relative;
  top: -3px;
}
    /* 底层表格文字水印样式 */
body::before {
     content: "群1480007";
     position: fixed;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
     opacity: 0.2;
     font-size: 6em;
     color: #ccc;
     z-index: 10;
     pointer-events: none;
   }

   @media (max-width: 767px) {
     body::before {
       font-size: 1em;
     }
   }

   @media (min-width: 768px) and (max-width: 1023px) {
     body::before {
       font-size: 4em;
     }
   }

   @media (min-width: 1024px) {
     body::before {
       font-size: 6em;
     }
   }