dt {
    font-weight: bold;
    margin-top: 1em;
}

td.qr-code { width: 80px }
td { vertical-align: middle }

.nowrap {
    white-space: nowrap;
}

.small-skip {
    margin-top: 0.5em;
}
.med-skip {
    margin-top: 1em;
}
.big-skip {
    margin-top: 2em;
}
.huge-skip {
    margin-top: 4em;
}

.download .platform {
    display: block;
    font-size: 80%;
}

.license {
    text-align: center;
    width: 75%;
    display: inline-block;
    vertical-align: bottom;
}

.main {
    position: relative;
}

h1.ww-outline-headline {
    color: rgb(88, 110, 151);
    text-shadow: 0 2px 2px rgba(0,0,0,0.25);
}

.sample-pic {
    width: 33%;
    float: left;
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);
}

.sample-column {
    float: left;
    width: 50%;
    max-width: 500px;
}

.ww-head { display: none }

.download-bar {
    max-width: 45%;
}

.sample-desc {
    float: left;
    padding-left: 3%;
    padding-right: 3%;
    width: 60%;
}

.next-sample {
    clear: both;
    padding-top: 2em;
    margin: 0;
}

a.sample {
    display: block;
}

ul.menu {
    margin: 0;
    padding: 0;
}

.menu li { 
    display: inline-block;
    padding-right: 1.6em;
    font-size: 1.2em;
    text-align: center;
    vertical-align: middle;
}

.menu li:first-child {
    margin-left: -2em;
}

.menu a:link, .menu a:visited, .menu a:active {
    text-decoration: none;
    color: rgb(88, 110, 151)
}

.menu a:hover {
    text-decoration: none;
    text-shadow: 0 0 3px rgb(134, 162, 213);
    color: rgb(88, 110, 151);
}

.menu a:link.terms-of-use, .menu a:visited.terms-of-use {
    text-decoration: none;
    color: rgba(88, 110, 151,0.5)
}

a:link.download, a:visited.download, 
.download a:link, .download a:visited {
    font-size: 1.5em;
    border-radius: 0.2em;
    background-color: rgb(88, 110, 151);
    color: white;

    padding: 0.5em;
    text-align: center;
    display: block;

    -moz-border-radius: 0.5em;
    -webkit-border-radius: 0.5em;
    border-radius: 0.5em;

    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
    box-shadow: 0 1px 3px rgba(0,0,0,0.5);

    text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
    border-bottom: 1px solid rgba(0,0,0,0.25);

}

a:hover.download, .download a:hover {
    background-color: rgb(134, 162, 213);
    text-decoration: none;
}

.download a:link, .download a:visited {
    display: inline-block;
}

.ww-page {
    text-align: center;
}

.ww-content {
    max-width: 1024px;
    min-width:  640px;
    display: inline-block;
    text-align: left;
    width: 75%;
}

.screenshot {
    padding: 0.5em;
    width: 50%;
    float: left;
}

.download-bar {
    padding: 0.5em;
    float: left;
}

.info-bar {
  display: flex;
  justify-content: center; /* Horizontal center */
  align-items: center;     /* Vertical center */
  gap: 1em;                /* Space between items */
  padding-top: 1em;
  border-top: 1px solid rgb(88, 110, 151);
  font-size: 80%;
  color: rgb(88, 110, 151);
  text-align: center;
  margin-top: 3em;
}

.info-bar .inline-block {
  display: flex;
  align-items: center;
}

.info-bar div {
    text-align: center;
}

.info-bar li {
    color: rgb(88, 110, 151);
}

.info-bar li > div.ww-para {
    color: rgb(88, 110, 151);
}

.info-bar a:link, .info-bar a:hover, .info-bar a:visited, .info-bar a:active {
    color: rgb(134, 162, 213);
}

.width-10 {
    width: 10%;
}

.width-15 {
    width: 15%;
}

.width-20 {
    width: 20%;
}

.width-45 {
    width: 45%;
}

.width-48 {
    width: 48%;
}

.ww-menu-page { display: none }