#chessboard {
    display: block;
    margin: 50px auto;
    box-shadow: -2px -2px 2px #efefef, 5px 5px 5px #b9b9b9;
    background: url('img/table.jpg');
    /*float: left;*/
}

.rule{
    float:left;
    position: absolute;
    left:10em;
    top:0.5em;
    height:450px;
    /*width:fit-content;*/
    /*padding:10em;*/
}
.rule h3{
    margin:0.5em 0;
    color: blueviolet;
    text-align: center;
}

.rule img{
    height:450px;
    border: 1px solid blueviolet;
}
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */