@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,700&subset=latin,latin-ext,cyrillic);
@import url(https://fonts.googleapis.com/css?family=Cantata+One&subset=latin,latin-ext);

body {
  background-color: #f8f8f8;
  font-family: 'Roboto', sans-serif;
  color: #023a63;
}

#wrapper {
  width: 100%;
}

#page-wrapper {
  padding: 0 15px;
  min-height: 568px;
  background-color: #fff;
  opacity: 0.99;
}

@media (min-width: 768px) {
  #page-wrapper {
    position: relative;
    margin: 0 0 0 0;
    padding: 0 30px;
    border-left: 1px solid #e7e7e7;
  }
}

.navbar-top-links {
  margin-right: 0;
}

.navbar-top-links li {
  display: inline-block;
}

.navbar-top-links li:last-child {
  margin-right: 15px;
}

.navbar-top-links li a {
  padding: 15px;
  min-height: 50px;
}

.navbar-top-links .dropdown-menu li {
  display: block;
}

.navbar-top-links .dropdown-menu li:last-child {
  margin-right: 0;
}

.navbar-top-links .dropdown-menu li a {
  padding: 3px 20px;
  min-height: 0;
}

.navbar-top-links .dropdown-menu li a div {
  white-space: normal;
}

.navbar-top-links .dropdown-messages,
.navbar-top-links .dropdown-tasks,
.navbar-top-links .dropdown-alerts {
  width: 310px;
  min-width: 0;
}

.navbar-top-links .dropdown-messages {
  margin-left: 5px;
}

.navbar-top-links .dropdown-tasks {
  margin-left: -59px;
}

.navbar-top-links .dropdown-alerts {
  margin-left: -123px;
}

.navbar-top-links .dropdown-user {
  right: 0;
  left: auto;
}

.sidebar .sidebar-nav.navbar-collapse {
  padding-right: 0;
  padding-left: 0;
}

.sidebar .sidebar-search {
  padding: 15px;
}

.sidebar ul li {
  border-bottom: 1px solid #e7e7e7;
}

.sidebar ul li a.active {
  background-color: #eee;
}

.sidebar .arrow {
  float: right;
}

.sidebar .fa.arrow:before {
  content: "\f104";
}

.sidebar .active > a > .fa.arrow:before {
  content: "\f107";
}

.sidebar .nav-second-level li,
.sidebar .nav-third-level li {
  border-bottom: 0 !important;
}

.sidebar .nav-second-level li a {
  padding-left: 37px;
}

.sidebar .nav-third-level li a {
  padding-left: 52px;
}

@media (min-width: 768px) {
  .sidebar {
    z-index: 1;
    position: absolute;
    width: 200px;
    margin-top: 51px;
  }

  .navbar-top-links .dropdown-messages,
  .navbar-top-links .dropdown-tasks,
  .navbar-top-links .dropdown-alerts {
    margin-left: auto;
  }
}

.btn-outline {
  color: inherit;
  background-color: transparent;
  transition: all .5s;
}

.btn-primary.btn-outline {
  color: #002a4c;
}

.btn-success.btn-outline {
  color: #5cb85c;
}

.btn-info.btn-outline {
  color: #5bc0de;
}

.btn-warning.btn-outline {
  color: #d25400;
}

.btn-danger.btn-outline {
  color: #d9534f;
}
.btn-primary:hover {
  background-color: #2d5673;
  border-color: #2e6da4;
}

.btn-primary.btn-outline:hover,
.btn-success.btn-outline:hover,
.btn-info.btn-outline:hover,
.btn-warning.btn-outline:hover,
.btn-danger.btn-outline:hover {
  color: #fff;
}

.panel .slidedown .glyphicon,
.chat .glyphicon {
  margin-right: 5px;
}

.login-panel {
  margin-top: 25%;
}

.btn-circle {
  width: 30px;
  height: 30px;
  padding: 6px 0;
  border-radius: 15px;
  text-align: center;
  font-size: 12px;
  line-height: 1.428571429;
}

.btn-circle.btn-lg {
  width: 50px;
  height: 50px;
  padding: 10px 16px;
  border-radius: 25px;
  font-size: 18px;
  line-height: 1.33;
}

.btn-circle.btn-xl {
  width: 70px;
  height: 70px;
  padding: 10px 16px;
  border-radius: 35px;
  font-size: 24px;
  line-height: 1.33;
}

.huge {
  font-size: 40px;
}

.panel-green {
  border-color: #5cb85c;
}

.panel-green .panel-heading {
  border-color: #5cb85c;
  color: #fff;
  background-color: #5cb85c;
}

.panel-green a {
  color: #5cb85c;
}

.panel-green a:hover {
  color: #3d8b3d;
}

.panel-red {
  border-color: #d9534f;
}

.panel-red .panel-heading {
  border-color: #d9534f;
  color: #fff;
  background-color: #d9534f;
}

.panel-red a {
  color: #d9534f;
}

.panel-red a:hover {
  color: #b52b27;
}

.panel-yellow {
  border-color: #f0ad4e;
}

.panel-yellow .panel-heading {
  border-color: #f0ad4e;
  color: #fff;
  background-color: #f0ad4e;
}

.panel-yellow a {
  color: #f0ad4e;
}

.panel-yellow a:hover {
  color: #df8a13;
}

#caCanvas {
}

.caSectionInput {
  padding: 0px;
  color: #005290;
}

.caSectionSpan {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

a.caSectionSpanPrint, a.caSectionSpanPrint:hover{
  font-size: 1.6em;
  font-weight: 500;
  color: rgb(0, 42, 76);
  text-align: center;
}

.printBody{
  margin-top: 1em;
  text-align: center;
}

.fa.fa-pencil{
  margin-left: 0.5em;
  font-size: 12px;
  vertical-align: top;
}

.caValueHolder {
  float: right;
  color: orange;
  font-weight: bold;
}

.caValueHolderDescription {
  float: left;
  color: orange;
  font-weight: bold;
}

.caColorSq {
  width: 14px;
  height: 14px;
  margin-right: 6px;
  border: 1px solid gray;
  float: left;
}

.caColorSqPrint {
  width: 14px;
  height: 14px;
  margin-right: 6px;
  border: 1px solid gray;
  float: left;
}

.caColorSqPrintInner {
  width: 0px;
  height: 0px;
  border: 7px solid;
}
#caRightBox, .accordion{
  margin-left: 3%;
}
#caRightBox.col-md-11{
  width: 94%;
  margin-left: 3%;
  margin-right: 3%;
}

#caRightPanel {
  text-align: center;
  vertical-align: top;
}

#caLeftPanel {
  vertical-align: top;
}

#caInputTable {
  margin: auto;
}
#caLegend {
  margin-left: 10%;
}
textarea.caInputText, textarea.caInputTextDin{
  overflow: auto;
  width: 100%;
  height: 80px;
  resize: none;
}

#caInputText {
  overflow: auto;
  width: 100%;
  height: 100px;
  resize: none;
}

#caPrintHeader, .caPrintHeader {
  font-size: 18pt;
  margin-bottom: 10pt;
  text-align: center;
  display: none;
}

#caPrintHeaderSmall {
  font-size: 14pt;
  margin-bottom: 30pt;
  display: block;
  text-align: center;
}
.categoryName{
  width: 88px;
  font-weight: normal;
  float: left;
}
.categoryNameDescription{
  width: 150px;
  font-weight: normal;
  float: left;
}
.textDescription{
  text-align: left;
}
.caColorSq {
  float: left;
  width: 14px;
}
.caSmallBottomPadding {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 11pt;
}

.caSmallTopPadding {
  padding-top: 10px;
  padding-bottom: 5px;
  font-size: 10pt;
}

@media print {
  .caNoPrint {
    display: none;
  }
  body {-webkit-print-color-adjust: exact;}
    
  #caCanvas {
    width: 15cm;
    height: 15cm;
  }
}

.caShowOnPrint{
  display: none;
}

.form-group.mainSlider {
  margin: auto;
  width: 95%;
  padding-bottom: 0.5em;
}
.form-group.caTd1 {
  margin: auto;
  padding-bottom: 0.5em;
  width: 95%;
}
.mainSlider .caS {
  margin-left: 1em;
  margin-right: 1em;
  float: left;
  /*min-width: 200px;*/
  width: 70%;
}

.categorySlider .caS {
  margin-left: 1em;
  margin-right: 2em;
  float: left;
  /*min-width: 200px;*/
  width: 39%;
}

h1.page-header{
  color: #025490;
}

.navbar-header > a.navbar-brand{
  color: #023a63;
  font-size: 2em;
}

/* Box Shadows */
.box-shadow-block{
  padding:15px 20px;
  border:1px solid #eee;
  background:#fff;
}
.box-shadow-outer {
  position: relative;
  z-index: 1;
}
.box-shadow-outer .box-shadow-1 {
  box-shadow: 0 10px 6px -6px rgba(0, 0, 0, 0.2);
}
.box-shadow-outer .box-shadow-2 {
  position: relative;
}
.box-shadow-outer .box-shadow-2:before,
.box-shadow-outer .box-shadow-2:after {
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 50%;
  max-width: 300px;
  background: rgba(0, 0, 0, 0.3);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.box-shadow-outer .box-shadow-2:after {
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
  right: 10px;
  left: auto;
}
.box-shadow-outer .box-shadow-3 {
  position: relative;
}
.box-shadow-outer .box-shadow-3:before {
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  left: 10px;
  width: 50%;
  top: 50%;
  max-width: 300px;
  background: rgba(0, 0, 0, 0.25);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(-3deg);
  -moz-transform: rotate(-3deg);
  -o-transform: rotate(-3deg);
  -ms-transform: rotate(-3deg);
  transform: rotate(-3deg);
}
.box-shadow-outer .box-shadow-4 {
  position: relative;
}
.box-shadow-outer .box-shadow-4:after {
  z-index: -1;
  position: absolute;
  content: "";
  bottom: 15px;
  right: 10px;
  left: auto;
  width: 50%;
  top: 40%;
  max-width: 300px;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: 0 15px 10px rgba(0, 0, 0, 0.2);
  -webkit-transform: rotate(3deg);
  -moz-transform: rotate(3deg);
  -o-transform: rotate(3deg);
  -ms-transform: rotate(3deg);
  transform: rotate(3deg);
}
.box-shadow-outer .box-shadow-5 {
  position: relative;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.05) inset;
}
.box-shadow-outer .box-shadow-5:before,
.box-shadow-outer .box-shadow-5:after {
  content: "";
  position: absolute;
  z-index: -1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  top: 0;
  bottom: 0;
  left: 10px;
  right: 10px;
}
.box-shadow-outer .box-shadow-5:after {
  right: 10px;
  left: auto;
  -webkit-transform: skew(8deg) rotate(3deg);
  -moz-transform: skew(8deg) rotate(3deg);
  -ms-transform: skew(8deg) rotate(3deg);
  -o-transform: skew(8deg) rotate(3deg);
  transform: skew(8deg) rotate(3deg);
}
.box-shadow-outer .box-shadow-6 {
  position: relative;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}
.box-shadow-outer .box-shadow-6:before,
.box-shadow-outer .box-shadow-6:after {
  content: "";
  position: absolute;
  z-index: -1;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
  top: 10px;
  bottom: 10px;
  left: 0;
  right: 0;
}
.box-shadow-outer .box-shadow-6:after {
  right: 10px;
  left: auto;
  -webkit-transform: skew(8deg) rotate(3deg);
  -moz-transform: skew(8deg) rotate(3deg);
  -ms-transform: skew(8deg) rotate(3deg);
  -o-transform: skew(8deg) rotate(3deg);
  transform: skew(8deg) rotate(3deg);
}
/* Box shadow alt */
.box-shadow{
  box-shadow:10px 10px 0px 0px rgba(0,0,0,0.15);
}
/* Box shadow block */
.box-shadow-block {
  border-top: 3px solid #025490;
}
.row{
  position: relative;
}
.panel-info{
  border-color: #02578e;
}

.panel-info>.panel-heading {
  background-color: #005290;

}

.noUi-connect{
  background-color: #e6b132;
}

.fa-pencil:hover{
  color: #e6b132;
}

.btn-primary  {
  background: #005696;
  border-color: #005696;
  color: #ffffff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary.focus, .open > .dropdown-toggle.btn-primary, .open > .dropdown-toggle.btn-primary:hover{
  background: #006cc4;
  border-color: #006cc4;
}
a:hover, a:focus {
  color: #d9a420;
}

/* adjust body when menu is open */
body.slide-active {
  overflow-x: hidden
}
/*first child of #page-content so it doesn't shift around*/
.no-margin-top {
  margin-top: 0px!important
}
/*wrap the entire page content but not nav inside this div if not a fixed top, don't add any top padding */
#page-content {
  position: relative;
  padding-top: 90px;
  left: 0;
}
#page-content.slide-active {
  padding-top: 0
}

#caBox {
  margin: auto;
  width: 100%;
}

#slidemenu{
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}
/* put toggle bars on the left :: not using button */
#slide-nav .navbar-toggle {
  cursor: pointer;
  position: relative;
  line-height: 0;
  float: left;
  margin: 0;
  width: 30px;
  height: 40px;
  padding: 18px 0 0 0;
  border: 0;
  background: transparent;
}
/* icon bar prettyup - optional */
#slide-nav .navbar-toggle > .icon-bar {
  width: 100%;
  display: block;
  height: 3px;
  margin: 5px 0 0 0;
}
#slide-nav .navbar-toggle.slide-active .icon-bar {
  background: #fbfffb
}
.navbar-header {
  position: relative;
  margin-left: 50px;
  height: 70px;
}
/* un fix the navbar when active so that all the menu items are accessible */
.navbar.navbar-fixed-top.slide-active {
  position: relative
}
/* screw writing importants and shit, just stick it in max width since these classes are not shared between sizes */
@media (max-width:2560px) {
  #slide-nav .container {
    margin: 0!important;
    padding: 0!important;

  }
  #slide-nav .navbar-header {
    margin: 0 auto;
    padding: 0 15px;
  }
  #slide-nav .navbar.slide-active {
    position: absolute;
    width: 80%;
    top: -1px;
    z-index: 1000;
  }
  #slide-nav #slidemenu {
    background: #f7f7f7;
    left: -100%;
    width: 180px;
    min-width: 0;
    position: absolute;
    padding-left: 0;
    z-index: 2;
    top: -8px;
    margin: 0;
  }
  #slide-nav #slidemenu .navbar-nav {
    min-width: 0;
    width: 100%;
    margin: 0;
  }
  #slide-nav #slidemenu .navbar-nav .dropdown-menu li a {
    min-width: 0;
    width: 80%;
    white-space: normal;
  }
  #slide-nav {
    border-top: 0
  }
  .navbar-inverse{
    background: gradient(linear, left top, left bottom, from(#000), to(#0063b0));
    background: -moz-gradient(linear, left top, left bottom, from(#000), to(#0063b0));
    background: -webkit-gradient(linear, left top, left bottom, from(#000), to(#0063b0));
  }
  #slide-nav.navbar-inverse #slidemenu {
    background: #fbfffb;
  }
#slidemenu .sidebar-nav{
  padding-top: 77px;
}
  .navbar-inverse .navbar-nav>.active>a {
    color: #fff;
    background-color: #013a75;
  }
  .navbar-inverse .navbar-nav>.active>a:hover, .navbar-inverse .navbar-nav>.active>a:focus{
    color: #e6b132;
    background-color: #013a75;
  }

  /* this is behind the navigation but the navigation is not inside it so that the navigation is accessible and scrolls*/
  #navbar-height-col {
    position: fixed;
    top: 0;
    height: 100%;
    bottom:0;
    width: 180px;
    left: -180px;
    background: #f7f7f7;
  }
  #navbar-height-col.inverse {
    background: #fbfffb;
    z-index: 1;
    border: 0;
  }
  #slide-nav .navbar-form {
    width: 100%;
    margin: 8px 0;
    text-align: center;
    overflow: hidden;
    /*fast clearfixer*/
  }
  #slide-nav .navbar-form .form-control {
    text-align: center
  }
  #slide-nav .navbar-form .btn {
    width: 100%
  }
}
@media (min-width:2560px) {
  #page-content {
    left: 0!important
  }
  .navbar.navbar-fixed-top.slide-active {
    position: fixed
  }
  .navbar-header {
    left: 0!important
  }
}
.icon-bar{
  background-color: #002a4c;
}

.navbar-inverse .navbar-nav>li>a {
  color: #013a75;
  font-size: 1.1em;
  height: 5em;
  padding-top: 2em;
}
.navbar-inverse .navbar-nav>li>a:hover {
  color: #d9a420;
  background-color: #013a75;
}

.footer {
  padding: 10px 30px;
  background-color: rgba(4, 10, 26, 0.26);
  border-top: 1px solid #e0e0e0;
  height: 44px;
}
.footer:before,
.footer:after {
  content: " ";
  display: table;
}
.footer:after {
  clear: both;
}
.footer-legal {
  float: left;
  height: 44px;
  padding-top: 14px;
}
.footer-actions {
  float: right;
}
.footer-right {
  float: right;
  height: 44px;
  padding-top: 14px;
}
.footer .scroll-to-top {
  color: #757575;
}
.footer .scroll-to-top,
.footer .scroll-to-top:hover,
.footer .scroll-to-top:active {
  text-decoration: none;
}
@media (max-width: 480px) {
  .footer {
    height: auto;
  }
}
@media (max-width: 480px) {
  .footer-legal,
  .footer-right,
  .footer-actions {
    display: block;
    float: none;
    text-align: center;
  }
}