/**************************************************
 * BASE
 **************************************************/
 html {
   overflow-x: hidden;
   padding: 0px;
   margin: 0px
 }
 body{
   font-family: 'Open Sans', sans-serif;
   font-size: 13px;
   line-height: 1.6em;
   font-weight: 400;
   word-wrap: break-word;
   color: #57606f;
   background: #f1f2f6;
 }
 h1, h2, h3, h4, h5, h6 {
   font-weight: 700;
   color: #2f3542;
   font-family: 'Montserrat', sans-serif;
 }
 h1 {font-size: 38px;}
 h2 {font-size: 32px;}
 h3 {font-size: 26px;}
 h4 {font-size: 20px;}
 h5 {font-size: 16px;}
 h6 {font-size: 14px;}
 a, a:hover, a:active, a:link {text-decoration: none}

 .site {background: #FFF;}
 .container-fluid {max-width: 1400px;}

/**************************************************
 * BUTTONS
 **************************************************/
 .btn-default {
  color: #FFF;
  background: #0532ad;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  transition: background .2s, color .2s, border-color .2s;
  padding: 10px 30px;
  display: inline-block;
  border: 0;
  font-family: 'Montserrat', sans-serif;
}
.btn-default:hover, .btn-default:active, .btn-default:focus {
  color: #FFF;
  background: #000;
  text-decoration: none;
}


/**************************************************
 * LOGIN
 **************************************************/
.login-area {background: #0c2360; display: flex; width: 100%; height: 100vh; align-items: center; }
.login-area .login-form {padding: 30px 30px 15px; border: 0;}
.login-area .logo {margin-bottom: 30px;}


/**************************************************
 * HEADER
 **************************************************/
.header {padding: 30px 0;}
.header .logo {width: 200px; height: auto;}
.menu {margin-bottom: 30px;}

.menu-item {text-align: center; padding: 40px 0 30px; color: #03a9f4; transition: background .2s, color .2s; text-transform: uppercase; font-family: 'Montserrat', sans-serif;}
.menu-item:hover {background: #192a56; color: #fff;}
.menu-item:hover div {color: #fff;}
.menu-item i {font-size: 50px;}
.menu-item div {color: #000; font-size: 14px; margin-top: 10px; font-weight: 700;}

.card-inner {padding: 15px;}
.machine-item {
    border: 1px solid rgba(0,0,0,.125);
    padding: 15px;
    text-align: center;
    border-radius: 3px;
    margin-bottom: 15px;
}
.card-title {font-size: 16px; color: #000;}
.machine-info .row {border-bottom: 1px solid rgba(0,0,0,.1); padding-top: 3px; padding-bottom: 3px;} 
.machine-info .row:last-child {border-bottom: 0;} 



.form-table {float: left; width: 100%;}
.form-table {border-left: 1px solid #ddd; border-top: 1px solid #ddd;}
.form-table .cell {padding-top: 10px; padding-bottom: 10px;}
.form-table .cell.th {color: #000; font-weight: 700; font-size: 12px; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; min-height: 40px;}
.form-table .cell.td {border-right: 1px solid #ddd; border-bottom: 1px solid #ddd;min-height: 42px;}


.error-message {text-align: center; margin-bottom: 0;}
.error-message i {font-size: 60px;}
.alert-danger {
    color: #d90000;
    background-color: #FCE4EC;
    border-color: #F48FB1;
}

/**************************************************
 * RESPONSIVE
 **************************************************/
@media only screen and (min-width: 1200px){
}

@media only screen and (max-width: 992px){
}

@media only screen and (max-width: 768px){
.menu-item {text-align: center; padding: 20px 0 10px;}
.menu-item i {font-size: 30px;}
.menu-item div {font-size: 12px;}
main .card {margin-bottom: 15px;}

}

@media only screen and (max-width: 576px){
.menu-item {text-align: center; padding: 10px 0 5px; display: flex; align-items: center; margin-bottom: 15px;}
.menu-item i {font-size: 20px; margin-bottom: 0;}
.menu-item div {font-size: 12px;}
.menu .col-sm-6 {width: 50%;}

}



@font-face {
  font-family: 'fontello';
  src: url('font/fontello.eot?94008739');
  src: url('font/fontello.eot?94008739#iefix') format('embedded-opentype'),
       url('font/fontello.woff2?94008739') format('woff2'),
       url('font/fontello.woff?94008739') format('woff'),
       url('font/fontello.ttf?94008739') format('truetype'),
       url('font/fontello.svg?94008739#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('font/fontello.svg?94008739#fontello') format('svg');
  }
}
*/
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
 
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
 
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
 
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
 
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
 
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
 
  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
 
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}
 
.icon-manager:before { content: '\e800'; } /* '' */
.icon-machinery:before { content: '\e801'; } /* '' */
.icon-tools:before { content: '\e802'; } /* '' */
.icon-send:before { content: '\e803'; } /* '' */