body {
   background-color: #eee !important;
   font-family: roboto !important;
}

.metro div, .metro span, .metro p {
font-weight: normal;
font-style: normal;
}

.metro .window {
border: 8px #6badf6 solid;
position: relative;
background-color: #fff;
min-height: 200px;
min-width: 200px;
border-top: 0;
}

.metro .shadow {
box-shadow: 0 2px 6px rgba(0,0,0,0.3),0 3px 8px rgba(0,0,0,0.2);
}

.metro .window .content {
position: relative;
padding: 32px 0;
width: auto;
height: auto;
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
-ms-box-sizing: content-box;
-o-box-sizing: content-box;
box-sizing: content-box;
}

.metro .window .caption .btn-close, 
.metro .window .caption .btn-min, 
.metro .window .caption .btn-max {
background-color: #c75050;
color: #fff;
position: absolute;
top: -8px;
right: 0;
width: 48px;
height: 24px;
min-height: 24px;
text-align: center;
vertical-align: middle;
font-family: 'Cambria_','PT Serif Caption',Verdana,Arial,Helvetica,sans-serif;
font-size: 16pt;
font-weight: normal;
padding: 0 0 10px 0;
z-index: 3;
outline: 0;
}

.metro .window .caption {
position: absolute;
top: 0;
height: 32px;
width: 100%;
background-color: #6badf6;
cursor: default;
z-index: 2;
border-top: 8px #6badf6 solid;
}

.metro .window .caption .btn-close:after, 
.metro .window .caption .btn-min:after, 
.metro .window .caption .btn-max:after {
content: '\D7';
position: absolute;
left: 50%;
top: 0;
margin-left: -0.3em;
}

.metro .window .caption .title {
font-size: 14px;
margin-top: -2px;
margin-left: 4px;
position: relative;
float: left;
}

.metro p {
margin: 0 0 7pt;
font-family: 'Segoe UI_','Open Sans',Verdana,Arial,Helvetica,sans-serif;
font-weight: normal;
font-style: normal;
color: #000;
font-size: 11pt;
line-height: 15pt;
letter-spacing: .02em;
}

.metro .window .caption {
position: absolute;
top: 0;
height: 32px;
width: 100%;
background-color: #6badf6;
cursor: default;
z-index: 2;
border-top: 8px #6badf6 solid;
}

.metro .window .caption .btn-close:hover,
.metro .window .caption .btn-min:hover,
.metro .window .caption .btn-max:hover {
    background-color:#e04343

}

.metro .window .caption .btn-close:active,
.metro .window .caption .btn-min:active,
.metro .window .caption .btn-max:active {
    background-color:#b01919!important;
    top:-8px;
    right:0;
    left:auto

}

.metro .window .caption .btn-min,
.metro .window .caption .btn-max{
    background-color:transparent;
    color:#000;
    right:75px;
    width:24px;
    padding-bottom:10px;
    font-weight:bold

}
.metro .window .caption .btn-min:hover,
.metro .window .caption .btn-max:hover{
    background-color:#1b6eae;
    color:#fff

}

.metro .window .caption .btn-min:hover:after,
.metro .window .caption .btn-max:hover:after{
    border-color:#fff

}

.metro button {
padding: 4px 12px;
text-align: center;
vertical-align: middle!important;
background-color: #d9d9d9;
border: 1px transparent solid;
color: #222;
border-radius: 0;
cursor: pointer;
display: inline-block;
outline: 0;
font-family: 'Segoe UI Light_','Open Sans Light',Verdana,Arial,Helvetica,sans-serif;
font-size: 14px;
line-height: 16px;
}

#metro-sections {
    width: 95%; 
    left: 0px;
}

.alert {
  overflow-wrap: break-word;
}