div.main {
    text-align: center;
    width: auto;
}


p {
    padding: 0px;
    margin: 0px;
}


div.generace {
    border: 0px solid red;
    min-width: 10px;
    margin: 0 auto 0 auto;
    padding: 10px;
    background-color: rgba(255,255,255,0.1);
    text-align: center;

}

div.family {
    color: black;
    width: auto;
    border-radius: 15px;
}

table.alltable {
    border-spacing: 0px;
    border: 0px;
}

table.alltable td {
    vertical-align: top;
    border-spacing: 0px;
    border: 0px;
}

table.alltable td.linka {
    vertical-align: top;
    min-width: 40px;
    border-spacing: 0px;
    border: 0px;

}

    div.linka {
        width: 7px;
        opacity: 0.4;
        position: relative;
        margin: 5px;
        border-radius: 5px;
    }

table.person {
    margin: 3px;
    border-spacing: 0px;
}

table.person td {
    border: 0px solid green;
    background-color: transparent;
    margin: 0px;
    text-align: left;
    border-spacing: 0px;
}

div.pborder {

    width: 290px;
    height: 80px;
    margin: 4px;

}

div.person {
    border: 0px solid green;
    border-radius: 0px;
    width: 200px;
    height: 70px;
    text-align: left;
    background-color: white;
    display: inline-block;
    margin: 0px;
}

div.left {
    border-radius: 12px 0 0 12px;
    width: 15px;
    height: 70px;
    display: inline-block;
    margin: 0px;
    line-height: 95px;
}

p.left-name {
    transform: rotate(-90deg);
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
}

div.right {
    border-radius: 0 12px 12px 0;
    width: 15px;
    height: 70px;
    display: inline-block;
    margin: 0px;
    line-height: 75px;
    font-size: 24px;
    text-align: center;
}


        div.name {
            font-size: 16px;
            font-weight: 700;
            color: rgba(0,0,0,1.0);
            font-variant: normal;
            font-style: normal;
            padding-left: 10px;
            padding-top: 5px;
        }

        span.job {
            font-size: 14px;
            font-weight: 500;
            color: rgba(0,0,0,1.0);
            font-variant: normal;
            font-style: italic;
            padding-left: 5px;
        }

        div.birth {
            font-size: 12px;
            font-weight: 700;
            color: rgba(0,0,0,0.6);
            font-variant: normal;
            font-style: normal;
            padding-left: 10px;
        }

        div.death {
            font-size: 12px;
            font-weight: 700;
            color: rgba(0,0,0,0.6);
            font-variant: normal;
            font-style: normal;
            padding-left: 10px;
        }

                   div.birth A, div.death A, div.partner A {
                       color: red;
                   }

        div.partner {
            font-size: 11px;
            font-weight: 700;
            color: rgba(0,0,0,0.8);
            font-variant: normal;
            font-style: normal;
            padding-left: 10px;
        }

        div.flag {
            float:right;
        }

        img.flag {
            float:right;
            width: 30px;
            border: 1px solid black;
            margin: 2px;
        }


        div.cousins {
            width: 250px;
            color:  #858585;
            background-color: #505050;
            height: 30px;
            border-radius: 20px;
            line-height: 30px;
            margin-left: 20px;
            opacity: 0.5;

        }


   .red {
        background-color: #fc0400;
    }

   .yellow {
        background-color: #F8E80D;
    }

   .green {
        background-color: #6bed74;
    }
    
   .darkgreen {
        background-color: #059e10;
    }

   .turquoise {
        background-color: #40E0D0;
    }
   
   .blue {
        background-color: #71c5f5;
    }

   .darkblue {
        background-color: #1771A6;
    }

   .orange {
        background-color: #FFA514;
    }

   .violet {
        background-color: #b46ff7;
    }

   .pink {
        background-color: #FFC0CB;
    }

   .black {
        background-color: #0A0300;
    }

   .silver {
        background-color: #D2D2D2;
    }

   .white {
        background-color: #ffffff;
        color: grey;
    }
   
   .brown {
        background-color: #993300;
    }

   .purple {
        background-color: #6A0DAD;
    }
    
   .magenta {
        background-color: #FF00FF;
    }

   .khaki {
        background-color: #C3B091;
    }





    table,tr,td {
       text-align: center;
       border: 0px;
       margin: 0px;
       padding: 0px;
    }

    table.net {
       border: 0px solid red;
       margin: 0px;
       padding: 0px;
       text-align: center;
       border-spacing: 0px;
       display: inline-block;
    }

    table.net td {
       border: 0px solid red;
       margin: 0px;
       padding: 0px;
       text-align: center;
       border-spacing: 0px;
    }

    table.net td.border {
        width: 87px;
        text-align: center;
       border: 0px solid red;
    }

    div.conn {
        width: 1px;
        background-color: white;
        height: 30px;
    }

    div.connx {
        height: 1px;
        background-color: white;
        width: 100%;
    }