main {
    background: #FA1;
    padding-top:17%;
    font-family: Arial, Helvetica, sans-serif;
    display: table;
    padding-left:10%;
    padding-right:10%;
    padding-bottom:10%;
}

div.bar {
    width: auto;
    width: 100%;
    float:left;
    display: table;
}

Iframe {
    width: auto;
    width: 100%;
    float:left;
    display: table;
    allowfullscreen: true;
}

div.bar50 {
    width: auto;
    width: 47%;
    float:left;
    display: table;
    margin-right:1%;
}

div.bar25 {
    width: auto;
    width: 23%;
    margin: 1%;
    float:left;
}
div.bar38 {
    width: auto;
    width: 35%;
    margin: 1%;
    float:left;
}

div.menu-item {
    width: auto;
    float:left;
    display: block;
    background: #EE1;
    color: #11E;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
    margin: 1%;
}

div.bullet {
    width: auto;
    width:25%;
    float:left;
    display: block;
    background: #EE1;
    color: #11E;
    text-decoration: none;
    text-align: center;
    font-weight: bold;
    margin: 1%;
}

bb {
    background: #a1b355;
    font-weight: bold;
    font-size:110%;
}

div.bar div.menu-item {
    width: 12.5%;
}

div.bar50 div.menu-item {
    width:auto;
    width: 25%;
}

div.bar50 div.map {
    width: 25%;
}

img.picture {
    width: auto;
    width: 100%;
}

div.index {
    float: left;
    width: auto;
    width: 57.5%
}

div.index h1 {
    margin:10px;
    font-family: "Times New Roman", Georgia, Garamond, serif;
    color: blue;
}

div.index h2 {
    margin:20px;
    font-family: "Times New Roman", Georgia, Garamond, serif;
}

Iframe {
    width: auto;
    width: 100%;
}

/*The rest is history*/

div.txt {
    float: left;
    width: auto;
    width: 57.5%
}

main p {
    margin:10px;
    font-family: Arial, Helvetica, sans-serif;
}

div.picture {
    float: left;
    width: auto;
    width: 36.5%;
    
    margin: 5px;
}

div.leftcol {
    width: auto;
    width:12.5%;
    display: block;
    float:left;
    background: #EE1;
    color: #11E;
}
    
div.leftcol a {
    text-decoration: none;
    text-align: center;
    font-weight: bold;
}

div.leftcol a img {
    width: auto;
    width:100%;
}

div.block {
    border: solid 2px;
    margin: 5%;
}
    

.bar button.left {
    float: left:
}
.bar button.right {
    float: right:
}

div.book {
    float: left;
    width: auto;
    width: 25%;
    margin: 5px;
}

div.bookindex {
    display: none;
}

.bookindex p {
    background: #dd0;
}

.book:hover {
    background: #eee;
}
.book:hover .bookindex {
    display:block;
}

.bookindex h2:hover {
    background: #ccc;
}



@media print {
   main {
        padding-top: 1px;
    }
}

