@font-face {
  font-family: 'Segoe UI';
  src: local('Segoe UI'), url('fonts/SegoeUI.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

body {
    margin: 0;
    padding: 0;
}

#gameContainer {
    position: fixed;
    height: 100%;
    width: 100%;
    overflow: hidden;
}

#newsPopupContainer {
    position: fixed;
    height: 100%;
    width: 100%;
    display: none;
    background: rgba(0, 0, 0, 0.2);
}

#licensePopupContainer {
    position: fixed;
    height: 100%;
    width: 100%;
    display: none;
    background: rgba(0, 0, 0, 0.2);
}

#licensePopupContainer .news-popup .news-text {
    height: 31vw;
}

#licensePopupContainer iframe {
    background-color: #FFF2C1;
}

.news-popup {
    margin: 10vw auto;
    width: 50vw;
    height: 37vw;
    border-radius: 0.5vw 0.5vw 0.5vw 0.5vw;
    background: #3b7c8c;
}
.news-popup .header {
    width: 100%;
    height: 3.2vw;
    border-radius: 0.5vw 0.5vw 0 0;
    background: #164b61;
    /* Old browsers */
    background: -moz-linear-gradient(top, #164b61 0%, #003247 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #164b61 0%, #003247 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #164b61 0%, #003247 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#164b61", endColorstr="#003247", GradientType=0);
    /* IE6-9 */
}
.news-popup .header img.icon {
    width: 2vw;
    margin-top: -0.4vw;
    margin-left: 0.6vw;
}
.news-popup .header span.title {
    line-height: 3.2vw;
    color: white;
    font-size: 1.5vw;
    margin-left: 1vw;
}
.news-popup .content {

}
.news-popup .news-image {
    width: 10%;
    margin-bottom: 2vw;
}
.news-popup .news-text {
    min-height: 4vw;
    color: #ffffff;
    font-size: 1.2vw;
    padding: 1.5vw;
}
#newsText {
    width: 100%;
    height: 100%;
}
#licenseText {
    width: 100%;
    height: 100%;
}
.news-popup .close-btn {
    height: 3vw;
    float: right;
    margin: 0.2vw;
    cursor: pointer;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}
.news-popup .buttons {
    margin-bottom: 1vw;
}
.news-popup .buttons button {
    text-align: center;
    display: block;
    margin: 2.6vw auto 0;
}
.news-popup .ui-button {
    border-radius: 50vw;
    border: none;
    height: 2.7vw;
    width: 9vw;
    outline: inherit;
    font-size: 1.4vw;
    font-weight: 200;
}
.news-popup .ui-button::before {
    left: -0.4vw;
    top: -0.3vw;
    height: 3.3vw;
    width: 9.7vw;
    border-radius: 40vw;
}