body, html {
    font-family: arial, sans-serif;
    font-size: 11pt;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.brtc-tools-header {
    width: 100%;
    height: 50px;
    background: #4d4d4d url('images/brightics-logo.png') no-repeat;
    -ms-background-position-x: 20px;
    background-position-x: 20px;
    -ms-background-position-y: center;
    background-position-y: center;
    color: #fff;
}

.brtc-tools-body {
    width: 100%;
    height: 100%;
    margin: -50px 0 0 0;
    padding: 50px 0 0 0;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow: hidden;
}

.brtc-tools-contents {
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}

.brtc-tools-index-container {
    display: flex;
}

.brtc-tools-index {
    font-size: 28px;
    margin: 20px;
    width: 600px;
    height: 400px;
    box-shadow: 2px 2px 6px #e3e7ed, -2px -2px 6px #e3e7ed;
    text-align: center;
    line-height: 70px;
    cursor: pointer;
}

.brtc-tools-index#ui-gen {
    background-image: url('images/index-ui-gen.png');
    background-size: 560px;
    background-repeat: no-repeat;
    background-position-y: 80px;
    background-position-x: center;
}