/* add all special styles used for displaying the rules */ 

/* .rules: used for all elements loading rules (rules at main site, rules ingame, popup with rules extract 
   #rules: div with complete rules used at main site and ingame display 
   #rulesContainer #rules: ingame rules display only 
   #sidebarPanel #rules: ingame rules display on right side only 
   #sidebarBottom #rules: ingame rules display at bottom only 
   .ui-popup .rules: popup with rules extract only */

.rules h1 {
    font-family: 'Notram Regular';
    text-indent: 0.5em; /*Einrücken des Textes*/
    text-align: left;
    background-image: url(/game-plugins/pasha/1.0.1/images/rules/header_background.png); /*Hintergrundbild*/
    background-repeat: no-repeat; /*Kein Wallpaper*/
     background-size: cover;
    /*background-position: center; /*Position des Hintergrundbildes*/
    border: none;
    color: white; /* Farbe*/
    font-size: 2em;
    line-height: 2em; /*Höhe des Hintergrundbildes*/
    padding: 0px 0px 0px 0px; /*oben rechts unten links*/
    text-shadow: none;
    margin-top: 0em;
    margin-bottom: 0.5em;
}

.rules h2 {
    font-family: 'Notram Regular';
    /*text-indent: 0.5em; Einrücken des Textes*/
    background-image: url(/game-plugins/pasha/1.0.1/images/rules/header2_background.png); /*Hintergrundbild*/
    background-repeat: no-repeat; /*Kein Wallpaper*/
     background-position: center;
     background-size: cover;
    text-align: left;
    color: white; /* Farbe*/
    line-height: 2em; /*Höhe des Hintergrundbildes*/
    padding-top: 0.5em;
    padding-bottom: 0em;
    font-size: 1.5em;
    margin: 0px;
    margin-bottom: 0.5em;
}

.rules h3 {
    font-family: 'Notram Regular';
    /*text-indent: 0.5em; Einrücken des Textes*/
    text-align: left;
    color: #790b0c; /* Farbe*/
    padding-top: 0.2em;
    padding-bottom: 0em;
    font-size: 1.5em;
    margin: 0px;
    margin-bottom: 0.5em;
    border-bottom: solid 0.1em;
    border-color: #790b0c;
}


.rules .background_color {
    padding: 0.6em;
    background-color: #fde6d0;
}

/*Images*/
.rules .img_3 {
    width: 3%;
}

.rules .img_20 {
    width: 15%;
}

.rules .img_29 {
    width: 29%;
}

.rules .img_50 {
    width: 50%;
}

.rules .img_65 {
    width: 65%;
}

.rules .img_70 {
    width: 70%;
}
#rules .float_right {
    float: right;
    text-align: right;
    margin-right: 1em
}

#rules .float_left {
    float: left;
    text-align: left;
    margin-right: 1em
}

/*cell formatting*/
.rules .cell_picture_2 {
    width: 2%;
    vertical-align: top;
}
.rules .cell_picture_5 {
    width: 5%;
    vertical-align: top;
}
.rules .cell_picture_10 {
    width: 15%;
    vertical-align: top;
}

.rules .cell_picture_25 {
    width: 25%;
    vertical-align: top;
}

.rules .cell_picture_40 {
    width: 40%;
    vertical-align: top;
}

#rules .right {
    text-align: right;
    margin-right: 1em
}

#rules .center {
    display: flex;
    align-items: center;
}

.rules .top {
    vertical-align: top;
}

.rules hr {
    border-color: #790b0c; /* Farbe*/
}

.rules .example {
        position: relative;
        padding: 20px;
        max-width: 800px;
        margin: 2rem auto;
        z-index: 1;
}

    .rules .example::before {
        content: "";
        position: absolute;
        inset: -8px;
        background-image: url('/game-plugins/pasha/1.0.1/images/rules/example_background.png');
        background-repeat: no-repeat;
        background-size: 100% 100%;
        z-index: -1;
    }

.rules .appendix_table {
    padding: 5px;
    background-color: #fef3e6;
    padding-bottom: 5%;
}