/*header styling here*/
.header-status-page {
margin: 0px;
background:#333;
width: 100%;
height: 80px;
margin-bottom: 24px;
}

.header-status-row{
padding: 16px 32px;
}

.header-status-logo {
float:left;
    height: 30px;
    width: 160px;
}

.header-navlist {
float: right;
    display: block;
    width: auto;
    margin:auto;
    margin-top:4px;
}



/*header dropdown*/
/* Style The Dropdown Button */
.header-dropbtn {
font-family: 'Roboto Slab';
font-size: 16px;
font-weight:600;
color: #fff;
background:#444;
border-radius:28px;
  border: 1px solid #ffc20e;
  padding: 10px 18px;
  border: none;
  cursor: pointer;
  transition: all .9s ease;
  margin-left:24px;
}


.header-dropbtn:active {
background-image: linear-gradient( #ffc20e,#ffc20e);
transition: all .3s ease;
}

.header-caret {
  position: relative;
  float: right;
  margin:11px 6px 0px ;
}

.header-caret:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  border-top: 4px solid #eee;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}

.header-caret:after {
  content: '';
  position: absolute;
  left: 4px;
  top: 0;
  border-top: 2px solid #eee;
  border-left: 2px solid transparent;
  border-right: 2px solid transparent;
}




/* The container <div> - needed to position the dropdown content */
.header-dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.header-dropdown-content {
  padding-top:20px;
  display: hidden;
  position: absolute;
  left: -10px;
  background-color: #333;
  min-width: 180px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  transition: all .8s ease;
  opacity: 0;
}

/* Links inside the dropdown */
.header-dropdown-content a {
  color: #fff;
  font-size:14px;
  font-family: Roboto Slab;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  transition: all .3s ease;
}

/* Change color of dropdown links on hover */
.header-dropdown-content a:hover 
{background-color: #444;
transition: all .5s ease;
    
}

/* Show the dropdown menu on hover */
.header-dropdown:hover .header-dropdown-content {
  display: block;
  opacity: 100;
  transition: all .8s ease;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.header-dropbtn:hover {
 background:#777;
 transition: all .3s ease;
}
/*Styling for Wrapper button (support - reports)*/

.wrapper-AtBcr {
    font-family: 'Roboto Slab';
    color: #111;
    font-size: 1rem;
}
.u-userLauncherColor {
    background-color: #ffc20e !important;
     background-image: linear-gradient( #ffc20e,#ffc20e);
    border: 0px solid #ffc20e;
    box-shadow: 2px 10px 16px 0px rgba (0,0,0,0.2);

}





/*font overrides*/

@font-face {
  font-family: 'Roboto Slab';
  src: url('https://fonts.googleapis.com/css?family=Roboto+Slab');
}

@font-face {
  font-family: 'Open Sans';
  src: url('https://fonts.googleapis.com/css?family=Open+Sans');
}

.font-large, .font-largest{
  font-family:'Roboto Slab','Open Sans', sans-serif !important;
}


.status-day{
font-family: 'Roboto Slab';
font-size: 13px!important;
}
.page-status{
color: #fff;
  height:40px;
  padding: 2px 16px !important;
  margin-bottom:20px !important;
}

/*table styling*/


 table {
padding:12px 16px 30px;
border: 2px solid #e0e0e0 !important;
border-radius: 4px;
font-family: 'Open Sans', sans-serif;
 height: auto;
     width: 100%;
     color:#555;
     border-spacing: 0px;
}

tbody {
    height:auto;
    width: 100%;
    padding: 16px;
    border: none;
}

tr, th, td {
border: none;
height:24px;
text-align: left;
border-bottom: 1px solid #eee;
transition: all .6s ease;

}

td {
    padding-left:8px;
    font-size: .9rem;
    height: 22px;
    color: #555;

}

td strong {
    font-size: 1.1rem;
}

th{
    font-size: 1.2rem;
    font-family: 'Roboto Slab';
    color:#777;
    padding-left:8px;
    padding-bottom: 12px;
}

tr {
    padding: 4px 8px;
    height: 45px;
}

#trlarge {
    height: 60px;
}

tr:hover {
    background: #fafafa;
    border: 1px solid #fafafa;
    border-color: #fafafa;
    transition: all .6s ease;
}




/*main styling*/
body {
    display: block;
    margin: 0px;
    color:#333;
    line-height: normal;
    font-size:14px;
}
.container {
    display: block;
    margin:auto;
    padding: 16px 32px;
    width: 100%;
    max-width:960px;
}
.row {
    display: block;
    width:auto;
    max-width:960px;
}

h1, h2, h3, h4 {
    font-family: 'Roboto Slab';
    font-weight: 500;
    line-height: auto;
    margin: 6px 0px;
    color:#888888;
}

h5, h6 {
    font-family: 'Open Sans', sans-serif;
    font-weight: 500;
    line-height: auto;
    color:#666;
    margin: 4px 0px;
}

p, a, li, ul {
    font-family: 'Open Sans', sans-serif;
    font-size:14px;
    margin-top: 4px;
    line-height: auto;
}

p {
    line-height: 20px;
}

.label-p {
    font-size:12px;
    font-family: 'Open Sans', sans-serif;
}

h1 {
    font-size: 2rem;
        color:#666;

}

h2 {
    font-size: 1.7rem;
        color:#666;

}

h3 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.2rem;
}

h5 {
    font-size: 1rem;
    line-height:1.4rem;
}

h6 {
    font-size: .8rem;
}


.page-break{
    background: rbgba (0,0,0,.0);
    width:100%;
    height: 30px;
}

/*svg image styling*/
.svg-image {
    float:left;
}