@import url(https://fonts.googleapis.com/earlyaccess/opensanshebrew.css);

html, body {
    background-color: #eee;
    background-repeat: no-repeat;
    background-attachment: fixed;
/ / background-image: url('https://i.imgur.com/ddvxquD.png');
    background-image: url('https://media.discordapp.net/attachments/912415444189708328/1085248671194562661/530x346.png');
    background-position: left bottom;
    background-size: 448px 349px;
    font-family: 'Open Sans Hebrew';
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/*
.container-fluid {
background-image:url('https://i.imgur.com/mXKJM27.png');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:left top;
}
*/
a {
    text-decoration: none;
}

#shop section div form {
    background-color: white;
    padding: 10px;
    margin: 10px;
    border-radius: 10px;
    border-bottom: 1px solid #adb4e8;
}

.flexSection {
    display: flex;
}

.flexGrow {
    flex-grow: 2;
}

.twitComment {

}

.nav-item span {
    font-size: 20px;
    height: 16px;
}

.legendaryFound {
    width: 400px;
    height: 150px;
    background: linear-gradient(to bottom right, #B0DB7D 40%, #99DBB4 100%);
    border-radius: 20px;
    perspective: 40px;
    text-align: center;
}

.wow {
    font-weight: 700;
    letter-spacing: 5px;
}

.seeBox {
    width: 963px;
    border: 1px solid #b8d9ed;
    border-radius: 3px;
    margin-bottom: 24px;
    margin-right: 10px
}

.seeBox .inner {
    border: 1px solid #fafdff;
    background: #ebf7ff;
    border-radius: 3px;
    overflow: hidden;
    padding: 0 12px 28px 12px
}

.seeBox .photo {
    float: right;
    margin-right: 38px;
    background: url(../images/photo_bg.png) no-repeat;
    width: 197px;
    height: 162px;
    padding: 1px 0 0 1px
}

.seeBox .text {
    float: right;
    width: 560px;
    margin-top: -8px
}

.seeBox .text.mid {
    width: 794px
}

.seeBox p {
    color: #333;
    font-size: 14px;
    line-height: 24px;
    text-align: justify;
    letter-spacing: -1px
}

.seeBox p a {
    color: #1864a5;
    font-weight: 700;
    text-decoration: none
}

.seeBox input.button {
    border: 0;
    background: url(../images/button3.png) no-repeat;
    width: 217px;
    height: 38px;
    cursor: pointer;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    padding-left: 12px
}

.battleareaGym {
    background-image: url(../images/attackbgGym.png);
    background-repeat: no-repeat;
    width: 655px;
    height: 405px;
    margin-top: -30px;
    margin-right: 17px
}

.battleareaPvp {
    background-image: url(../images/attackbgPvp.jpg);
    background-repeat: no-repeat;
    width: 655px;
    height: 405px;
    margin-top: -30px;
    margin-right: 17px
}

.trainersBox {
    margin-bottom: 34px
}

.trainersBox .col {
    float: right;
    margin-left: 32px;
    width: 410px;
    border: 1px solid #b8d9ed;
    border-radius: 3px
}

.trainersBox .inner {
    border: 1px solid #fafdff;
    background: #ebf7ff;
    border-radius: 3px;
    min-height: 175px;
    position: relative;
    padding: 30px 0 28px 26px
}

.trainersBox p {
    color: #333;
    font-size: 14px;
    line-height: 24px;
    text-align: justify;
    width: 216px;
    padding-bottom: 12px;
    letter-spacing: -1px
}

.trainersBox img {
    position: absolute;
    top: -46px;
    left: 12px
}

.winBox {
    width: 821px;
    border: 1px solid #000;
    margin-bottom: 35px;
    border-radius: 4px;
    background: #155799 url(../images/win_bg.png) repeat-x;
    overflow: hidden;
    padding: 34px 0 28px 34px
}

.winBox img.left {
    float: right;
    margin-right: 38px;
    border: 1px solid #dcf5f4
}

.winBox .text {
    float: right;
    width: 560px
}

.winBox p {
    color: #fff;
    font-size: 13px;
    line-height: 24px;
    letter-spacing: -1px
}

.winBox ul {
    list-style: none;
    float: right;
    overflow: hidden;
    margin: -54px 0 0 27px
}

.winBox li {
    float: right;
    margin-right: 6px
}

.friendsBox {
    margin-bottom: 34px;
    overflow: hidden
}

.friendsBox .col {
    float: right;
    margin-right: 32px;
    width: 410px;
    border: 1px solid #b8d9ed;
    border-radius: 3px
}

.friendsBox .inner {
    border: 1px solid #fafdff;
    background: #ebf7ff;
    border-radius: 3px;
    min-height: 175px;
    position: relative;
    padding: 30px 0 26px 26px
}

.friendsBox p {
    color: #333;
    font-size: 14px;
    line-height: 24px;
    padding-bottom: 12px;
    text-align: justify;
    width: 366px;
    letter-spacing: -1px;
    padding-top: 4px
}

.friendsBox a.button {
    display: block;
    text-decoration: none;
    background: url(../images/button2.png) no-repeat;
    width: 352px;
    height: 38px;
    line-height: 38px;
    padding-left: 15px;
    color: #fff;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 700
}

.friendsBox .col1 {
    margin-bottom: 7px;
    background: url(../images/col1_bg.png) no-repeat;
    width: 355px;
    height: 38px;
    overflow: hidden
}

.friendsBox .col1.mid {
    background: url(../images/col2_bg.png) no-repeat
}

.friendsBox .col1.bot {
    background: url(../images/col3_bg.png) no-repeat;
    margin-bottom: 0
}

.friendsBox h4 {
    color: #fff;
    font-size: 14px;
    float: right;
    padding-right: 12px;
    font-family: 'Open Sans', sans-serif;
    line-height: 38px;
    letter-spacing: -1px
}

.friendsBox ul {
    list-style: none;
    overflow: hidden;
    float: right;
    margin: 8px 8px 0 0
}

.friendsBox li {
    float: right;
    margin-right: 8px
}

.signBox {
    width: 587px;
    background: url(../images/sign_bg.png) no-repeat;
    height: 203px;
    margin-bottom: 37px;
    padding: 32px 0 0 270px
}

.signBox fieldset {
    border: 0;
    width: 563px;
    overflow: hidden
}

.signBox input.field {
    border: 0;
    background: url(../images/field1.png) no-repeat;
    width: 513px;
    height: 38px;
    line-height: 38px;
    margin-bottom: 7px;
    color: #333;
    font-size: 14px;
    padding: 0 36px 0 14px
}

.signBox input.button {
    border: 0;
    background: url(../images/button3.png) no-repeat;
    width: 217px;
    height: 38px;
    cursor: pointer;
    float: right;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    text-align: left;
    padding-left: 12px
}

#rightCntr {
    float: left;
    width: 120px
}

.newBox {
    margin-bottom: 80px;
    padding: 10px 0 0
}

.newBox2 {
    margin-bottom: 380px;
    padding: 10px 0 0
}

.fillBox {
    width: 104px;
    background: url(../images/fill_bg.png) no-repeat;
    height: 588px;
    padding: 12px 0 0 16px
}

.fillBox span {
    font-size: 40px;
    font-weight: 700;
    display: block;
    margin-top: -32px
}

.fillBox small {
    font-size: 20px;
    font-weight: 700;
    display: block
}

.fillBox strong {
    font-size: 46px;
    font-weight: 600;
    display: block;
    margin-top: -20px
}

#footerCntr {
    overflow: hidden;
    width: 100%;
    background: #1864a5;
    position: absolute;
    height: 20px
}

#footerCntr .inner {
    height: 46px;
    width: 1003px;
    overflow: hidden;
    margin: 0 auto
}

#footerCntr ul {
    list-style: none;
    float: right
}

#footerCntr li {
    float: right;
    background: url(../images/footer_sep.png) no-repeat right 0;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif;
    line-height: 46px;
    padding: 0 10px 0 9px
}

#footerCntr li a {
    color: #fff;
    text-decoration: none
}

#footerCntr li.first {
    padding-right: 0
}

#footerCntr li.last {
    padding-left: 0;
    background: none
}

#footerCntr p {
    float: left;
    line-height: 46px;
    color: #fff;
    font-size: 14px;
    font-family: 'Open Sans', sans-serif
}

#footerCntr p span {
    font-weight: 600
}

.bar_red {
    width: 241px;
    height: 6px;
    background: url(../images/bar_red.gif);
    font-size: 0;
    clear: both;
    padding: 2px 3px 2px 6px
}

.bar_blue {
    width: 241px;
    height: 6px;
    background: url(../images/bar_blue.gif);
    font-size: 0;
    clear: both;
    padding: 2px 3px 2px 6px
}

.available {
    border: 1px solid #000;
    background: #bbdd65;
    float: right;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin: 4px
}

.finished {
    border: 1px solid #000;
    background: #daebaa;
    float: right;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin: 4px
}

.notyet {
    border: 1px solid #000;
    background: #dadada;
    float: right;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin: 4px
}

#badgebox {
    border: 5px solid #552a00;
    display: block;
    overflow: hidden;
    width: 600px;
    text-align: center;
    background-color: #C96;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    margin: 15px 0
}

#badgebox img {
    margin: 8px 10px 5px
}

#information ul, ol {
    padding: 10px 0 10px 25px
}

div#listContainer {
    width: 400px;
    border: 1px solid #000;
    background: #2467b6;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px
}

.modify-order-item {
    border: 1px solid #000;
    background: #FFF;
    font-weight: 700;
    cursor: move;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
    margin: 5px;
    padding: 3px 5px
}

.modify-order-item-old {
    border: 1px solid #000;
    background: #FFF;
    font-weight: 700;
    margin: 5px;
    padding: 3px 5px
}

#transferlist {
    width: 660px
}

.top_number {
    width: 41px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    padding-left: 10px;
    font-weight: 700
}

.number {
    width: 41px;
    float: right;
    line-height: 32px;
    padding-right: 10px
}

.top_pokemonimg {
    width: 99px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.pokemonimg {
    width: 99px;
    float: right;
    line-height: 32px
}

.top_roepnaam {
    width: 140px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.roepnaam {
    width: 140px;
    float: right;
    line-height: 32px
}

.top_level {
    width: 81px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.level {
    width: 81px;
    float: right;
    line-height: 32px
}

.top_price {
    width: 114px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.price {
    width: 114px;
    float: right;
    line-height: 32px
}

.top_player {
    width: 120px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.player {
    width: 120px;
    float: right;
    line-height: 32px
}

.top_buy {
    width: 55px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.buy {
    width: 55px;
    float: right;
    line-height: 32px
}

.top_buyin {
    width: 55px;
    float: right;
    line-height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700;
    padding-top: 8px
}

.buyin {
    width: 55px;
    float: right;
    line-height: 32px;
    padding-top: 8px
}

.buyin2 {
    padding-top: 5px
}

#daddy-shoutbox {
    margin-bottom: 10px;
    font: Arial, Helvetica, sans-serif;
    font-size: 11px
}

.inputform-shoutbox {
    padding-bottom: 5px
}

.shoutbox-list {
    border-top: 1px solid #4cb9d7;
    display: none;
    padding: 5px
}

#daddy-shoutbox-list {
    text-align: right;
    margin: 0 auto
}

#daddy-shoutbox-form {
    text-align: right
}

.shoutbox-list-time {
    color: #000
}

.shoutbox-list-nick {
    margin-right: 5px;
    font-weight: 700
}

.shoutbox-list-message {
    margin-right: 5px
}

div.stats-container {
    border: 1px solid #2a2a2a;
    width: 160px;
    background: #207cd2;
    margin: 2px 0 2px 26px;
    padding: 2px
}

div.stats-container div {
    background-color: #ffcc03;
    height: 16px;
    line-height: 16px
}

div.stats-container span {
    margin-left: 4px;
    font-weight: 700;
    font-size: 11px;
    color: #111
}

DIV.sabrosus {
    text-align: center;
    margin: 3px;
    padding: 3px
}

DIV.sabrosus A {
    border: #317490 1px solid;
    margin-right: 2px;
    color: #317490;
    text-decoration: none;
    padding: 2px 5px
}

DIV.sabrosus A:hover {
    border: #317490 1px solid;
    color: #000;
    background-color: #4cb9d7
}

DIV.pagination A:active {
    border: #317490 1px solid;
    color: #317490;
    background-color: #4cb9d7
}

DIV.sabrosus SPAN.current {
    border: #317490 1px solid;
    font-weight: 700;
    color: #000;
    margin-right: 2px;
    background-color: #c7edff;
    padding: 2px 5px
}

DIV.sabrosus SPAN.disabled {
    border: #317490 1px solid;
    color: #000;
    margin-right: 2px;
    padding: 2px 5px
}

.top_td {
    height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    font-weight: 700
}

.top_first_td {
    height: 25px;
    background-color: #4cb9d7;
    border-bottom: 1px dashed #317490;
    padding-left: 10px;
    font-weight: 700
}

.normal_first_td {
    padding: 3px 0 0 10px
}

.normal_td {
    padding-top: 3px
}

#hintbox {
    position: absolute;
    top: 0;
    background-color: #4cb9d7;
    width: 284px;
    border: 5px solid #317490;
    font: 12px Arial, Helvetica, sans-serif;
    color: #000;
    z-index: 100;
    visibility: hidden;
    border-radius: 8px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    padding: 5px
}

.tooltip {
    text-decoration: none;
    font-family: Verdana;
    font-size: 13px;
    color: #000
}

.tableattack img {
    margin-top: 15px
}

.tableattack td {
    padding: 5px
}

.admintext {
    color: #FF1a3b
}

.buddytext {
    color: #00a139
}

.blocktext {
    color: #DC0000
}

.type {
    display: block;
    width: 55px;
    color: #fff;
    background-color: #e4e4e0;
    font-size: 7pt;
    font-weight: 400;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 1px 1px 1px #2e3436;
    margin: 1px auto;
    padding: 1px
}

.type.normal {
    background-color: #A1A177;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.fire {
    background-color: #f08030;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.water {
    background-color: #6890f0;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.electric {
    background-color: #F3CC31;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.grass {
    background-color: #78c850;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.ice {
    background-color: #98d8d8;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.fighting {
    background-color: #c03028;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.poison {
    background-color: #a040a0;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.ground {
    background-color: #e0c068;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.flying {
    background-color: #a890f0;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.psychic {
    background-color: #f85888;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.bug {
    background-color: #a8b820;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.rock {
    background-color: #b8a038;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.ghost {
    background-color: #705898;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.dragon {
    background-color: #7038f8;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.steel {
    background-color: #b8b8d0;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.dark {
    background-color: #705848;
    font-family: verdana, sans-serif;
    font-size: 10px
}

.type.xcurse {
    background-color: #68a090
}

.type.fairy {
    background-color: #FAAFBE;
    font-family: verdana, sans-serif;
    font-size: 10px;
}

.typelist {
    text-align: center
}

div.typelist .type {
    display: inline-block
}

div.quote {
    border: 1px dotted #000;
    background: #FBF9F6;
    color: #000;
    margin: 10px 0;
    padding: 10px
}

#pokemon_star {
    float: right;
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/lidbetaald.png)
}

#computer_star {
    float: left;
    width: 16px;
    height: 16px;
    background-image: url(../images/icons/lidbetaald.png)
}

#topteam {
    width: 85px;
    display: block;
    float: right;
    margin: 10px
}

#topteam img {
    padding-bottom: 10px
}

.greyborder {
    border: 1px solid #999;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px
}

.greyborder:hover {
    border: 1px solid #000;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px
}

.onlineman {
    background-color: #dbe5ff;
    float: right;
    text-align: center;
    border: 1px solid #D5D5D5;
    width: 93px;
    margin: 1px;
    padding: 0
}

.rankers {
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-border-radius: 5px;
    border-radius: 5px 5px 5px 5px;
    behavior: url(PIE.htc);
    background-color: #FFF;
    width: 500px;
    margin-right: 15px;
    margin-top: 20px;
    padding: 5px
}

#headerCntr a.login:hover, .seeBox p a:hover, .seeBox a.button:hover, .trainersBox a.button:hover, .friendsBox a.button:hover, #footerCntr li a:hover, #footpanel ul li div a:hover {
    text-decoration: underline
}

.seeBox h2, .seeBox h3 {
    color: #1864a5;
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 24px
}

.seeBox a.button, .trainersBox a.button {
    display: block;
    text-decoration: none;
    background: url(../images/button1.png) no-repeat;
    width: 217px;
    height: 38px;
    line-height: 38px;
    padding-left: 13px;
    color: #fff;
    font-weight: 700;
    font-family: 'Open Sans', sans-serif;
    font-size: 14px
}

.button:first-child, .trainersBox .col.last {
    margin-left: 0
}

.trainersBox h2, .trainersBox h3, .friendsBox h2, .friendsBox h3 {
    color: #ec423d;
    font-size: 18px;
    padding-bottom: 20px;
    font-family: 'Open Sans', sans-serif
}

.winBox h2, .winBox h3 {
    color: #fff;
    font-size: 18px;
    padding-bottom: 22px;
    font-family: 'Open Sans', sans-serif
}

.winBox li.last, .friendsBox .col.last {
    margin-right: 0
}

.signBox h2, .signBox h3 {
    color: #1864a5;
    font-size: 18px;
    font-family: 'Open Sans', sans-serif;
    padding-bottom: 22px
}

.fillBox h2, .fillBox h3 {
    color: #fff;
    font-size: 81px;
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
    letter-spacing: -1px
}

.table caption + thead tr:first-child th, .table caption + thead tr:first-child td, .table colgroup + thead tr:first-child th, .table colgroup + thead tr:first-child td, .table thead:first-child tr:first-child th, .table thead:first-child tr:first-child td, .table-bordered caption + thead tr:first-child th, .table-bordered caption + tbody tr:first-child th, .table-bordered caption + tbody tr:first-child td, .table-bordered colgroup + thead tr:first-child th, .table-bordered colgroup + tbody tr:first-child th, .table-bordered colgroup + tbody tr:first-child td, .table-bordered thead:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child th, .table-bordered tbody:first-child tr:first-child td {
    border-top: 0
}

.table-bordered thead:first-child tr:first-child > th:first-child, .table-bordered tbody:first-child tr:first-child > td:first-child, .table-bordered tbody:first-child tr:first-child > th:first-child, .table-bordered caption + thead tr:first-child th:first-child, .table-bordered caption + tbody tr:first-child td:first-child, .table-bordered colgroup + thead tr:first-child th:first-child, .table-bordered colgroup + tbody tr:first-child td:first-child {
    -webkit-border-top-left-radius: 4px;
    border-top-left-radius: 4px;
    -moz-border-radius-topleft: 4px
}

.table-bordered thead:first-child tr:first-child > th:last-child, .table-bordered tbody:first-child tr:first-child > td:last-child, .table-bordered tbody:first-child tr:first-child > th:last-child, .table-bordered caption + thead tr:first-child th:last-child, .table-bordered caption + tbody tr:first-child td:last-child, .table-bordered colgroup + thead tr:first-child th:last-child, .table-bordered colgroup + tbody tr:first-child td:last-child {
    -webkit-border-top-right-radius: 4px;
    border-top-right-radius: 4px;
    -moz-border-radius-topright: 4px
}

.buttonOnline {
    width: 130px;
    margin: 1px;
    display: inline-block;
    *display: inline;
    padding: 4px 12px;
    margin-bottom: 0;
    *margin-left: .3em;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    *background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    *border: 0;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    *zoom: 1;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    background-size: 30px 30px;
    background-repeat: no-repeat;
    background-position: center left;
    text-align: right
}

.button {
    width: 125px;
    display: inline-block;
    *display: inline;
    padding: 4px 12px;
    margin-bottom: 0;
    *margin-left: .3em;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    vertical-align: middle;
    cursor: pointer;
    background-color: #f5f5f5;
    *background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: -o-linear-gradient(top, #ffffff, #e6e6e6);
    background-image: linear-gradient(to bottom, #ffffff, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    *border: 0;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe6e6e6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    *zoom: 1;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.buttonx {
    padding: 4px 12px;
    min-height: 60px;
    margin-bottom: 0;
    *margin-left: .3em;
    font-size: 14px;
    line-height: 20px;
    color: #333333;
    text-align: center;
    text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
    background-color: #f5f5f5;
    *background-color: #e6e6e6;
    background-image: -moz-linear-gradient(top, #F7F7F7, #e6e6e6);
    background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#F7F7F7), to(#e6e6e6));
    background-image: -webkit-linear-gradient(top, #F7F7F7, #e6e6e6);
    background-image: -o-linear-gradient(top, #F7F7F7, #e6e6e6);
    background-image: linear-gradient(to bottom, #F7F7F7, #e6e6e6);
    background-repeat: repeat-x;
    border: 1px solid #cccccc;
    *border: 0;
    border-color: #e6e6e6 #e6e6e6 #bfbfbf;
    border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
    border-bottom-color: #b3b3b3;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D6DEFF', endColorstr='#ffe6e6e6', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    *zoom: 1;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

}
.bar_red {
    width: 241px;
    height: 15px;
    background: url(images/bar_red.gif);
    font-size: 0;
    clear: both;
    background-repeat: no-repeat;
}

.bar_blue {
    width: 241px;
    height: 15px;
    background: url(images/bar_blue.gif);
    font-size: 0;
    clear: both;
    padding: 2px 3px 2px 6px;
    background-repeat: no-repeat;
}

.details {
    background-image: url(../images/detailbg.png);
    background-repeat: no-repeat;
    width: 350px;
    height: 79px;
    opacity: 0.85
}

.clanBg {
    background-image: url(../images/Clanbg.png);
    background-repeat: no-repeat;
    width: 670px;
    height: 363px
}

textarea {
    width: 800px;
    font-size: 14px;
    font-family: 'Open Sans Hebrew', 'Alef';
    padding-right: 10px;
    padding-top: 10px
}

#tooltip {
    position: absolute;
    border: 1px solid #333;
    background: #f7f5d1;
    padding: 2px 5px;
    color: #333;
    display: none;
}

.glyphicon {
    margin-right: 4px !important; /*override*/
}

.pagination .glyphicon {
    margin-right: 0px !important; /*override*/
}

.pagination a {
    color: #555;
}

.panel ul {
    padding: 0px;
    margin: 0px;
    list-style: none;
}

.news-item {
    padding: 4px 4px;
    margin: 0px;
    border-bottom: 1px dotted #555;
}

.equal, .equal > div[class*='col-'] {
    display: -webkit-flex;
    display: flex;
    flex: 1 1 auto;
}

.container-fluid {
    margin-bottom: 50px;
}

.navbar-custom {
    background-color: #4E6361;
}

.navbar-custom a {
    font-size: 14px;
    margin: 2px;
}

.navbar-custom .navbar-nav > li > a {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.navbar-custom {
    min-height: 32px !important
}

.ok {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 18px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

a.ok:hover,
a.ok:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.ok:empty {
    display: none;
}

.ok {
    background-color: #428bca;
}

.ok[href]:hover,
.ok[href]:focus {
    background-color: #3071a9;
}

.label-info[href]:hover,
.label-info[href]:focus,
.label-info a, .label-info a:visited {
    background-color: #3498db;
    color: white;
}

.label-title {
    background-color: #E0ECFF;
}

.label-title[href]:hover,
.label-title[href]:focus {
    background-color: #E0ECFF;
}

.imageAndText {
    position: relative;
}

.imageAndText .colBot {
    position: absolute;
    z-index: 1;
    bottom: 0;
    left: 0;
}

.imageAndText .colUp {
    position: absolute;
    z-index: 1;
    margin-left: auto;
    margin-right: auto;
    right: 0;
    top: 0px
}


.jm-logo a {
    position: relative;
    display: inline-block;
}

.jm-logo a:before {
    pointer-events: none;
    position: absolute;
    content: '';
    bottom: -30px;
    left: 5%;
    height: 10px;
    width: 90%;
    filter: alpha(opacity=0);
    opacity: 0;
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    background: -webkit-radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    background: -moz-radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    background: -o-radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
    -o-transition-duration: 0.3s;
    -ms-transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -o-transition-property: transform, opacity;
    -ms-transition-property: transform, opacity;
    -webkit-transition-property: transform, opacity;
    transition-property: transform, opacity;
}

.jm-logo a:hover:before,
.jm-logo a:focus:before,
.jm-logo a:active:before {
    filter: alpha(opacity=100);
    opacity: 1;
}

.jm-logo span {
    -webkit-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: transform;
    transition-property: transform;
}

.jm-logo a:hover span,
.jm-logo a:focus span,
.jm-logo a:active span {
    -o-transform: translateY(-10px);
    -ms-transform: translateY(-10px);
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}

.jm-logo img:hover,
.jm-logo img:focus,
.jm-logo img:active {
    -webkit-animation-name: buzz;
    animation-name: buzz;
    -webkit-animation-duration: 0.15s;
    animation-duration: 0.15s;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

@-webkit-keyframes buzz {
    50% {
        -ms-transform: translateX(3px) rotate(2deg);
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    100% {
        -ms-transform: translateX(-3px) rotate(-2deg);
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
}

@keyframes buzz {
    50% {
        -ms-transform: translateX(3px) rotate(2deg);
        -webkit-transform: translateX(3px) rotate(2deg);
        transform: translateX(3px) rotate(2deg);
    }
    100% {
        -ms-transform: translateX(-3px) rotate(-2deg);
        -webkit-transform: translateX(-3px) rotate(-2deg);
        transform: translateX(-3px) rotate(-2deg);
    }
}

.dialog {
    background-color: #428bca;
    padding: 5px;
    color: #fff;
    text-align: center;
    vertical-align: baseline;
    border-radius: .25em;
}

a.dialog:hover,
a.dialog:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.dialog a, .dialog a:visited, .dialog a:hover, .dialog a:focus {
    color: #fff;
}

.dialog:empty {
    display: none;
}

.dialog[href]:hover,
.dialog[href]:focus {
    background-color: #3071a9;
}

.area-gradient {
    background-image: -webkit-linear-gradient(top, #ffffff 0%, #dfdfdf 100%);
    background-image: linear-gradient(to bottom, #ffffff 0%, #dfdfdf 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffdfdfdf', GradientType=0);
}

p, div, h1, h2, h3 {
    font-family: 'Open Sans Hebrew', 'Alef', 'Open Sans Hebrew';
}

blockquote {
    background: #f9f9f9;
    border-left: 10px solid #ccc;
    margin: 1.5em 10px;
    padding: 0.5em 10px;
    quotes: "\201C" "\201D" "\2018" "\2019";
}

blockquote:before {
    color: #ccc;
    content: open-quote;
    font-size: 4em;
    line-height: 0.1em;
    margin-right: 0.25em;
    vertical-align: -0.4em;
}

blockquote p {
    display: inline;
}

blockquote a {
    color: black !important;
}

p {
    font-size: 12px;
}

.btn-custom {
    background-color: hsl(155, 0%, 7%) !important;
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#353535", endColorstr="#111111");
    background-image: -khtml-gradient(linear, left top, left bottom, from(#353535), to(#111111));
    background-image: -moz-linear-gradient(top, #353535, #111111);
    background-image: -ms-linear-gradient(top, #353535, #111111);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #353535), color-stop(100%, #111111));
    background-image: -webkit-linear-gradient(top, #353535, #111111);
    background-image: -o-linear-gradient(top, #353535, #111111);
    background-image: linear-gradient(#353535, #111111);
    border-color: #111111 #111111 hsl(155, 0%, 3.5%);
    color: #fff !important;
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.23);
    -webkit-font-smoothing: antialiased;
}

li {
    font-size: 12px;
}

.carousel-indicators li {
    background-color: #999 !important;
    background-color: rgba(70, 70, 70, .25) !important;
}

.carousel-indicators .active {
    background-color: #444 !important;
}

.grid {
    padding: 20px 20px 100px 20px;
    max-width: 1300px;
    margin: 0 auto;
    list-style: none;
    text-align: center;
}

.grid li {
    margin: 0;
    padding: 20px;
    text-align: right;
    position: relative;
}

.grid figure {
    margin: 0;
    position: relative;
}

.grid figcaption {
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px;
    background: #112D5A;
    color: white;
}

.grid figcaption h3 {
    margin: 0;
    padding: 0;
    color: #fff;
}

.grid figcaption span:before {
    content: 'by ';
}

.grid figcaption h5 {
    text-align: center;
    padding: 5px 10px;
    border-radius: 2px;
    display: inline-block;
    background: #AF7C39;
    color: #fff;
}

/* Caption Style 3 */
.cs-style-3 figure {
    overflow: hidden;
}

.cs-style-3 figure img {
    -webkit-transition: -webkit-transform 0.4s;
    -moz-transition: -moz-transform 0.4s;
    transition: transform 0.4s;
}

.no-touch .cs-style-3 figure:hover img,
.cs-style-3 figure.cs-hover img {
    -webkit-transform: translateY(-50px);
    -moz-transform: translateY(-50px);
    -ms-transform: translateY(-50px);
    transform: translateY(-50px);
}

.cs-style-3 figcaption {
    height: 80px;
    width: 100%;
    top: auto;
    bottom: 0;
    opacity: 0;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s 0.3s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s 0.3s;
    transition: transform 0.4s, opacity 0.1s 0.3s;
}

.no-touch .cs-style-3 figure:hover figcaption,
.cs-style-3 figure.cs-hover figcaption {
    opacity: 1;
    -webkit-transform: translateY(0px);
    -moz-transform: translateY(0px);
    -ms-transform: translateY(0px);
    transform: translateY(0px);
    -webkit-transition: -webkit-transform 0.4s, opacity 0.1s;
    -moz-transition: -moz-transform 0.4s, opacity 0.1s;
    transition: transform 0.4s, opacity 0.1s;
}

@media screen and (max-width: 31.5em) {
    .grid {
        padding: 10px 10px 100px 10px;
    }

    .grid li {
        min-width: 300px;
    }
}

.bigLabel-good, .bigLabel-success, .bigLabel-success a, .bigLabel-success a:hover {
    border-radius: 5px;
    background: #2E8D2D;
    color: white;
    margin: 2px;
}

.bigLabel-bad, .bigLabel-danger {
    border-radius: 5px;
    background: #B24040;
    padding: 5px;
    color: white;
    margin: 2px;
}

.bigLabel-info, .bigLabel-info a, .bigLabel-info a:hover {
    border-radius: 5px;
    background: #305F98;
    color: white;
    margin: 2px;
}

.bigLabel-default, .bigLabel-default a, .bigLabel-default a:hover {
    border-radius: 5px;
    background: #848484;
    color: white;
    margin: 2px;
}

.theContent {
    top: 50px;
    right: 40px;
    position: absolute;
}

.theContent2 {
    bottom: -20px;
    left: 15px;
    position: absolute;
}

.theImage {
    position: relative;

}

.image-cropper {
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
    border: 1px solid #eee;
}

.centered {
    position: absolute;
    top: -30%;
}

.carousel-leftCaption {
    position: absolute;
    top: 5px;
    left: 10px;
    color: #ffffff;
    text-align: left;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    width: 250px;
}

.carousel-rightCaption {
    position: absolute;
    top: 5px;
    right: 10px;
    color: #ffffff;
    text-align: left;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

.carousel-inner {
    overflow: visible;
}

.block {
    position: relative;
    z-index: -1;
}

.video-block {
    height: 300px;
    overflow: hidden;
    position: absolute;
    top: 0;
}

video {
    height: auto;
    margin-top: -50px;
    width: 100%;
    z-index: -1;
}

.text {
    color: red;
    border: 1px solid red;
}

.header-info {
    top: 0;
    min-height: 300px;
}

.text-2 {
    background: green;
}

.hero-unit {
    background-image: url('https://i.imgur.com/v4850kK.jpg?1');
    background-size: cover;
    background-color: #EEEEEE;
    width: 100%;

}

.hero-unit h1 {
    color: #FFFFFF;
    font-size: 60px;
    letter-spacing: -1px;
    line-height: 1;
    margin-bottom: 0;
}

.hero-unit h2 {
    font-size: 25px;
    color: #FFFFFF;

}

.fill {
    width: 100%;
    height: 350px;
    background-position: center;
    background-size: cover;
}

.niceWell {
    background-color: rgba(0, 0, 0, .3);
    padding: 6px;
    border-radius: 10px;
}

.label, a .label {
    font-size: 14px;
    display: inline-block;
}

.navi .nav-tabs {
    background-color: #161616;
}

.navi .tab-content {
    background-color: #303136;
    color: #fff;
    padding: 5px
}

.navi .nav-tabs > li > a {
    border: medium none;
}

.navi .nav-tabs > li > a:hover {
    background-color: #303136 !important;
    border: medium none;
    border-radius: 0;
    color: #fff;
}

.navi .nav-tabs > li.active > a,
.navi .nav-tabs > li.active > a:focus,
.navi .nav-tabs > li.active > a:hover {
    background-color: #303136 !important;
}

.tab-content {
    padding-right: 10px;
    padding-left: 10px;
}

p, .panel-body, ul li {
    font-size: 14px;
}

footer {
    direction: rtl;
}

.fixed {
    position: fixed;
    left: 10px;
}

a:hover, a:focus {
    color: black;
}

div.dropdown-multicol {
    width: 30em;
}

div.dropdown-row > a.dropdown-item {
    display: inline-block;
    width: 32%;
}

.dropdown-toggle {
    color: white;
    font-weight: bold;
}

.dropdown-menu {
    width: 520px;
}

.card-text a, .card-header a {
    color: white;
}

footer .badge {
    margin-left: 5px;
    font-size: 12px !important;
}

.iconBadge {
    padding: 5px;
    line-height: 20px;
}

.navTrigger {
    color: white;
    font-weight: bold;
    font-size: 18px;
    text-align: center;
    padding: 6px;
}

.navTrigger a {
    color: white;
}

/* The side navigation menu */
.sidenav {
    height: 100%;
    width: 250px;
    background-color: #111; /* Black*/
    overflow-x: hidden; /* Disable horizontal scroll */
    overflow-y: hidden;
    padding-top: 30px; /* Place content 60px from the top */
    transition: 0.5s; /* 0.5 second transition effect to slide in the sidenav */
}

.sidenav-content {
    padding-right: 10px;
    padding-left: 10px;
    overflow-y: auto;
    height: 80%;
}

/* Position and style the close button (top right corner) */
.sidenav .closebtn {
    position: absolute;
    top: 0;
    right: 25px;
    font-size: 36px;
    margin-left: 50px;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
#main {
    transition: margin-left .5s;
    padding: 20px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }

    .sidenav a {
        font-size: 18px;
    }
}

.bg-warning {
    background-color: #ff7518;
}

.bg-normal {
    background-color: #A1A178;
}

.bg-fire {
    background-color: #E6833C;
}

.bg-water {
    background-color: #6890F0;
}

.bg-brown {
    background-color: #521600;
}

.bg-purple {
    background-color: #892A8E;
}

.bg-red {
    background-color: #8E2A2A;
}

.bg-electric {
    background-color: #F3CC31;
}

.bg-ground {
    background-color: #E0C068;
}

.bg-fighting {
    background-color: #AF4843;
}

.bg-flying {
    background-color: #A890F0;
}

.bg-bug {
    background-color: #A8B820;
}

.bg-dragon {
    background-color: #7038F8;
}

.bg-ghost {
    background-color: #705898;
}

.bg-psychic {
    background-color: #F85888;
}

.bg-dark {
    background-color: #705848;
}

.bg-steel {
    background-color: #B8B8D0;
}

.bg-fairy {
    background-color: #EE99AC;
}

.card-title a, .card-text a {
    color: white;
    font-weight: bold;
}

.bg-light a {
    color: black !important;
    font-weight: bold;
}

.bg-golden {
    background-color: orange;
    -webkit-box-shadow: 3px 9px 35px -2px rgba(255, 178, 23, 1);
    -moz-box-shadow: 3px 9px 35px -2px rgba(255, 178, 23, 1);
    box-shadow: 3px 9px 35px -2px rgba(255, 178, 23, 1);
}

.box {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.box::after {
    content: "";
    border-radius: 5px;
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    opacity: 0;
    -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
    transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.box:hover {
    -webkit-transform: scale(1.05, 1.05);
    transform: scale(1.05, 1.05);
}

.box:hover::after {
    opacity: 1;
}

/**
.shiny {
    background: linear-gradient(to bottom, #cfc09f 22%,#634f2c 24%, #cfc09f 26%, #cfc09f 27%,#ffecb3 40%,#3a2c0f 78%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #fff;
    position: relative;
	text-transform: uppercase;
	margin: 0;
	font-weight: 400;
}

.shiny:after {
    background: none;
    content: attr(data-heading);
    text-shadow:
		-1px 0 1px #c6bb9f,
		0 1px 1px #c6bb9f,
		5px 5px 10px rgba(0, 0, 0, 0.4),
		-5px -5px 10px rgba(0, 0, 0, 0.4);
}
*/

.shiny {
    color: #DFAA30;
    font-weight: bold;
    text-shadow: 1px 1px 1px #2e3436
}

.bold {
    font-weight: bold;
}

.extApp {
    border: none;
    overflow: hidden;
}

.red, .dialog {
    margin: 3px;
    padding: 3px;
    background-color: #920205;
    color: white;
}

.item {
    background-color: #FDFFCA;
    padding: 5px;
    margin: 5px;
    border: 1px solid #eee;
}

.button {
    font-size: 11px;
}

.bg-dark .card-text {
    color: white;
}

.itemAvatar {
    background: #9ed5f6;
    color: white;
    width: 100px;
    height: 100px;
    border: 1px solid #eee;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: center;
}

.bodyContent {
    flex: 1;
}

/* Modern card styling */
.pokemon-card {
    border-radius: 12px;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s, box-shadow 0.3s;
    margin-bottom: 25px;
    overflow: hidden;
    background: linear-gradient(to bottom, #2a2a2a, #1a1a1a);
}

.pokemon-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 20px rgba(0, 0, 0, 0.3);
}

.pokemon-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.pokemon-img-container {
    display: flex;
    justify-content: center;
    margin: 15px 0;
    position: relative;
}

.pokemon-img {
    transition: transform 0.3s;
}

.pokemon-img:hover {
    transform: scale(1.15);
}

.type-badges {
    display: flex;
    gap: 5px;
    margin: 10px 0;
}

.stat-label, .stat-value {
    font-size: 0.8rem;
    color: rgba(255, 255, 255, 0.7);
}

.stat-container {
    margin-bottom: 8px;
}

.badge {
    padding: 5px 8px;
    border-radius: 6px;
    margin-right: 5px;
    margin-bottom: 5px;
    font-weight: 600;
    display: inline-block;
}

.shiny {
    background: linear-gradient(45deg, gold, #ffd700);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    text-shadow: 0 0 5px rgba(255, 215, 0, 0.5);
}

.tags-container {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 12px;
}

/* Progress bar improvements */
.progress {
    height: 14px;
    background-color: rgba(255, 255, 255, 0.1);
    margin-bottom: 12px;
}

.statProgress {
    height: 2px;
    background-color: rgba(255, 255, 255, 0.1);
    margin-bottom: 12px;
}

.progress-bar {
    border-radius: 6px;
}

.progress-label {
    font-size: 0.75rem;
    font-weight: 600;
}

/* Modal improvements */
.modal-content {
    border-radius: 15px;
    background: #272727;
    color: white;
}

.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 15px 20px;
}

.modal-title {
    font-weight: 700;
}

.modal-body {
    padding: 20px;
}

.modal-section {
    margin-bottom: 20px;
}

.modal-section-title {
    font-size: 1.2rem;
    margin-bottom: 15px;
    padding-bottom: 5px;
    border-bottom: 2px solid rgba(255, 255, 255, 0.1);
}

.level-badge {
    font-size: 1.2rem;
    padding: 5px 12px;
    border-radius: 8px;
}

.pokemon-name {
    font-size: 1.5rem;
    font-weight: 700;
    color: white;
}

.pokemon-gender {
    font-size: 0.9rem;
    color: rgba(255, 255, 255, 0.8);
}

.attack-badge {
    background-color: #3a3a3a;
    color: white;
    padding: 6px 10px;
    border-radius: 6px;
    margin: 5px;
    display: inline-block;
}

.manage-btn {
    position: absolute;
    bottom: 15px;
    right: 15px;
}

/* Custom colors for progress bars */
.progress-bar-hp {
    background-color: #FF5959;
}

.progress-bar-attack {
    background-color: #F5AC78;
}

.progress-bar-defense {
    background-color: #FAE078;
}

.progress-bar-spc-attack {
    background-color: #9DB7F5;
}

.progress-bar-spc-defense {
    background-color: #A7DB8D;
}

.progress-bar-speed {
    background-color: #FA92B2;
}

.progress-bar-total {
    background: linear-gradient(90deg, #7b4397, #dc2430);
}

.progress-bar-exp {
    background: linear-gradient(90deg, #00c6ff, #0072ff);
}

/* Responsive fixes */
@media (max-width: 768px) {
    .pokemon-header {
        flex-direction: column;
        align-items: flex-start;
    }

    .level-badge-container {
        margin-top: 10px;
    }
}

/* Animation for shiny */
@keyframes shine {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.shiny-animated {
    background: linear-gradient(270deg, #ffd700, #FFC107, #ffeb3b);
    background-size: 200% 200%;
    animation: shine 3s ease infinite;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-weight: bold;
}