/* this is the main font */
@font-face {
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 400;
    src: local('Cabin Regular'), local('Cabin-Regular'), url('./fonts/Cabin-Regular.ttf') format('truetype');
}
@font-face {
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 500;
    src: local('Cabin Medium'), local('Cabin-Medium'), url('./fonts/Cabin-Medium.ttf') format('truetype');
}
@font-face {
    font-family: 'Cabin';
    font-style: normal;
    font-weight: 700;
    src: local('Cabin Bold'), local('Cabin-Bold'), url('./fonts/Cabin-Bold.ttf') format('truetype');
}

body {
    padding-top: 50px;
    font-family: "Cabin", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.navbar-inverse {
    background-color: #262626;
}
.navbar-inverse .navbar-brand {
    color: #CCCCCC;
    font-weight: bold;
}

.date-template {
  padding: 10px 15px;
  text-align: left;
}

.vms-template {
  padding: 10px 15px;
  text-align: center;
}

.vms-plan .popover-title {
    color: black;
    font-size: 15px;
    font-weight: bold;
}
.vms-plan .popover-content {
    color: black;
    font-size: 10px;
    font-weight: normal;
}

.vms-plan table {
    font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    table-layout: fixed;
    font-size: 8px;
}

.vms-plan td {
    width: 25px;
    border: 2px solid white;
    text-align: center;
    vertical-align: middle;
}

.vms-plan tr
{
    height: 30px;
}
.legend-template .vms-plan tr {
    height: 15px;
}

.legend-template:after {
    color: #BBBBBB;
    content: "Legend";
    font-size: 10px;
    font-weight: 700;
    left: 15px;
    letter-spacing: 1px;
    position: absolute;
    text-transform: uppercase;
    top: 15px;
}
.legend-template {
    background-color: #FFFFFF;
    border-color: #DDDDDD;
    border-radius: 4px 4px 4px 4px;
    border-width: 1px;
    box-shadow: none;
    margin: 40px 0 20px;
    padding: 25px 15px 5px;
    border-style: solid;
    position: relative;
    width: 350px;
}


.vms-plan td.caption { color: black;  font-weight: bold; }
.vms-plan td.lv0 { color: white; background-color: #00CC66; }
.vms-plan td.lv1 { background-color: #00C0FF; }
.vms-plan td.lv1 a { color: white; font-weight: bold; }
.vms-plan td.lv2 { background-color: #F0F000; }
.vms-plan td.lv2 a { color: #888888; font-weight: bold; }
.vms-plan td.lv3 { background-color: #FFC000; }
.vms-plan td.lv3 a { color: #888888; font-weight: bold; }
.vms-plan td.lv4 { background-color: #FF8800; }
.vms-plan td.lv4 a { color: white; font-weight: bold; }
.vms-plan td.lv5 { background-color: #FF2200; }
.vms-plan td.lv5 a { color: white; font-weight: bold; }
.vms-plan td.lv6 { background-color: #BB0000; }
.vms-plan td.lv6 a { color: white; font-weight: bold; }

.dc-template {
    position: relative;
    margin-top: 15px;
    margin-bottom: 0px;
}
.dc-template .location {
    margin-left: 110px;
    vertical-align: middle;
}
.dc-template .flag {
    position: absolute;
}
.dc-template .location li {
    margin-top: 5px;
    margin-left: 10px;
}