/* Add multiline comment to make things work, i.e. remove double slash at the start of this line */
@import url(//fonts.googleapis.com/css?family=Monda:400,700);
@import url(//fonts.googleapis.com/css?family=Open+Sans);
body {
  background: #fff;
  color: #2a3a48;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none;
}
a {
  color: #4794c4;
  text-decoration: none;
}
a:hover {
  color: #2a5e88;
}
.alert-container {
  margin-top: 20px;
}
.centered-text {
  text-align: center;
}
.dataTables_length {
  padding-top: 10px;
}
.disabled {
  pointer-events: none;
  cursor: default;
  opacity: 0.6;
}
.table_title {
  font-size: 18px;
  font-weight: bold;
}
.table_header {
  margin-left: -15px;
}
.form-field-container {
  border: 1px solid #dddddd;
  border-bottom-left-radius: 4px;
  border-top-left-radius: 4px;
  padding-left: 6px;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-right: 0px;
  margin-top: 5px;
  margin-bottom: 5px;
}
div.form-field-container > span.fa {
  padding-right: 3px;
}
.form-field {
  border-left: 1px solid #dddddd;
  padding-left: 6px;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-right: 6px;
}
.ui-autocomplete {
  position: absolute;
  z-index: 1000;
  cursor: default;
  padding: 0;
  margin-top: 2px;
  list-style: none;
  background-color: #ffffff;
  border: 1px solid #ccc;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}
.ui-autocomplete > li {
  padding: 3px 20px;
}
.ui-autocomplete > li.ui-state-focus {
  background-color: #DDD;
}
.ui-helper-hidden-accessible {
  display: none;
}
/* Add multiline comment to make things work, i.e. remove double slash at the start of this line */
/* Add multiline comment to make things work, i.e. remove double slash at the start of this line */
a:focus,
a:hover,
a:active {
  color: #3498db;
}
.color-green {
  color: #3498db;
}
a.read-more:hover {
  color: #3498db;
}
.linked:hover {
  color: #3498db;
}
/*Buttons
------------------------------------*/
.btn-u {
  background: #3498db;
}
.btn-u:hover {
  background: #2980b9;
}
/*Service
------------------------------------*/
.service .service-icon {
  color: #3498db;
}
/*Service Blocks*/
.service-alternative .service:hover {
  background: #3498db;
}
/*Thumbnail (Recent Work)
------------------------------------*/
.thumbnail-style h3 a:hover {
  color: #3498db;
}
.thumbnail-style a.btn-more {
  background: #3498db;
}
.thumbnail-style a.btn-more:hover {
  box-shadow: 0 0 0 2px #2980b9;
}
.bx-wrapper .bx-prev {
  background-image: url(../../plugins/bxslider/images/controls-blue.png);
}
.bx-wrapper .bx-next {
  background-image: url(../../plugins/bxslider/images/controls-blue.png);
}
/*Typography
------------------------------------*/
/*Heading*/
.headline h2,
.headline h3,
.headline h4 {
  border-bottom: 2px solid #3498db;
}
/*Blockquote*/
blockquote:hover {
  border-left-color: #3498db;
}
.hero {
  border-left-color: #3498db;
}
/*Carousel
------------------------------------*/
.carousel-arrow a.carousel-control:hover {
  color: #3498db;
}
/*Footer
------------------------------------*/
.footer a,
.copyright a,
.footer a:hover,
.copyright a:hover {
  color: #3498db;
}
/*Tabs
------------------------------------*/
/*Tabs v1*/
.tab-v1 .nav-tabs {
  border-bottom: solid 2px #3498db;
}
.tab-v1 .nav-tabs > .active > a,
.tab-v1 .nav-tabs > .active > a:hover,
.tab-v1 .nav-tabs > .active > a:focus {
  background: #3498db;
}
.tab-v1 .nav-tabs > li > a:hover {
  background: #3498db;
}
/*Tabs v2*/
.tab-v2 .nav-tabs li.active a {
  border-top: solid 2px #3498db;
}
/*Tabs v3*/
.tab-v3 .nav-pills li a:hover,
.tab-v3 .nav-pills li.active a {
  background: #3498db;
  border: solid 1px #2980b9;
}
/*Accardion
------------------------------------*/
.acc-home a.active,
.acc-home a.accordion-toggle:hover {
  color: #3498db;
}
.acc-home .collapse.in {
  border-bottom: solid 1px #3498db;
}
/*Info Blocks
------------------------------------*/
.info-blocks:hover i.icon-info-blocks {
  color: #3498db;
}
/*Breadcrumb
------------------------------------*/
.breadcrumb li.active,
.breadcrumb li a:hover {
  color: #3498db;
}
/*About Page
------------------------------------*/
.team .thumbnail-style:hover h3 a {
  color: #3498db !important;
}
/*Social Icons*/
.team ul.team-socail li i:hover {
  background: #3498db;
}
/*Right Sidebar
------------------------------------*/
/*Right Sidebar*/
.who li i,
.who li:hover i,
.who li:hover a {
  color: #3498db;
}
/*Privacy Page
------------------------------------*/
.privacy a:hover {
  color: #3498db;
}
/*Page Features
------------------------------------*/
/*Tag Boxes v1*/
.tag-box-v1 {
  border-top: solid 2px #3498db;
}
/*Tag Boxes v2*/
.tag-box-v2l {
  border-right: solid 2px #3498db;
  background-color: #eee;
}
.tag-box-v2r {
  border-left: solid 2px #3498db;
  background-color: #eee;
}
/*Tag Boxes v7*/
.tag-box-v7 {
  border-bottom: solid 2px #3498db;
}
/*Font Awesome Icon Page Style*/
.fa-icons li:hover {
  color: #3498db;
}
.fa-icons li:hover i {
  background: #3498db;
}
/*Navigation
------------------------------------*/
/*Pagination*/
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
  background-color: #3498db;
  border-color: #3498db;
}
.pagination li a:hover {
  background: #2980b9;
  border-color: #2980b9;
}
/*Pager*/
.pager li > a:hover,
.pager li > a:focus {
  background: #2980b9;
  border-color: #2980b9;
}
/* Add multiline comment to make things work, i.e. remove double slash at the start of this line */
/*Import Google Fonts*/
.jumbotron {
  margin-top: 20px;
}
.jumbotron .container {
  padding-top: 0px;
  padding-bottom: 0px;
}
.jumbotron .container .h1 {
  font-size: 40px;
}
.jumbotron p {
  line-height: 1.2;
}
/*Block Headline*/
.headline {
  display: block;
  margin: 10px 0 25px 0;
  border-bottom: 1px dotted #e4e9f0;
}
.headline h2,
.headline h3,
.headline h4 {
  color: #585f69;
  margin: 0 0 -2px 0;
  padding-bottom: 5px;
  display: inline-block;
  border-bottom: 2px solid #3498db;
}
.headline h2 {
  font-size: 23px;
}
.headline-md h2 {
  font-size: 21px;
}
.headline-md {
  margin-bottom: 15px;
}
.thumbnail {
  text-align: center;
}
.thumbnail > a {
  text-align: center;
  display: inline-block;
  *display: inline;
  /* ie7 fix */
  float: none;
}
.transaction-date {
  float: left;
}
.bookmarklet a:hover {
  color: #000;
  text-decoration: none;
}
.bookmarklet-panel {
  margin-top: 20px;
  margin-left: 0px;
  margin-right: 0px;
  background-color: #fff;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  border: 1px solid #ccc;
  text-align: center;
}
.pagination-container {
  margin-top: 5px;
  margin-bottom: 5px;
}
.panel-border {
  border: 1px solid #ddd;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
}
.select {
  margin-top: -20px;
}
/*Panels (Portlets)
------------------------------------*/
/*Panel Table*/
.panel .table {
  margin-bottom: 0;
}
/*Panel Blue*/
.panel-blue {
  border-color: #3498db;
}
.panel-blue > .panel-heading {
  color: #fff;
  background: #3498db;
}
/*Panel Red*/
.panel-red {
  border-color: #e74c3c;
}
.panel-red > .panel-heading {
  color: #fff;
  background: #e74c3c;
}
/*Panel Green*/
.panel-green {
  border-color: #2ecc71;
}
.panel-green > .panel-heading {
  color: #fff;
  background: #2ecc71;
}
/*Panel Sea*/
.panel-sea {
  border-color: #1abc9c;
}
.panel-sea > .panel-heading {
  color: #fff;
  background: #1abc9c;
}
/*Panel Orange*/
.panel-orange {
  border-color: #e67e22;
}
.panel-orange > .panel-heading {
  color: #fff;
  background: #e67e22;
}
/*Panel Yellow*/
.panel-yellow {
  border-color: #f1c40f;
}
.panel-yellow > .panel-heading {
  color: #fff;
  background: #f1c40f;
}
/*Panel Grey*/
.panel-grey {
  border-color: #95a5a6;
}
.panel-grey > .panel-heading {
  color: #fff;
  background: #95a5a6;
}
/* Override colvis as it adds space below button */
div.ColVis {
  float: right;
  margin-bottom: 0px;
}
/* Move calendar icon up a little to align */
.ui-datepicker-trigger {
  padding-bottom: 4px;
  padding-left: 2px;
}
.about .feature h4 {
  font-weight: bold;
}
.about .feature p {
  font-size: 18px;
}
.about .dropin p {
  font-size: 14px;
}
.title {
  padding-right: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.input-group-addon {
  background-color: #fff;
}
.merged input:first-child {
  border-right: 0px;
}
.merged .input-group-addon + input {
  border-left: 0px;
}
.tooltip-inner {
  background-color: #999999;
  color: #fff;
}
.tooltip.top .tooltip-arrow {
  border-top-color: #999999;
}
.tooltip.right .tooltip-arrow {
  border-right-color: #999999;
}
.tooltip.bottom .tooltip-arrow {
  border-bottom-color: #999999;
}
.tooltip.left .tooltip-arrow {
  border-left-color: #999999;
}
/* Add multiline comment to make things work, i.e. remove double slash at the start of this line - see https://github.com/landlockedsurfer/sbt-less-test*/
.defaultTransactionText {
  font-size: 14px;
}
.form-body {
  margin-top: 5px;
  font-family: 'Open Sans', sans-serif;
  background-color: white;
}
.form-title-bar {
  clear: both;
  text-decoration: none;
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  line-height: 20px;
  border-top: 10px solid #5cb3ff;
  border-bottom: 5px solid #5cb3ff;
  border-left: 10px solid #5cb3ff;
  background: #5cb3ff;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-bottom: 3px;
}
.form-title-bar .options {
  float: right;
  padding-right: 10px;
  margin-top: -6px;
}
.form-contents {
  border: 1px solid #ccc;
  padding-bottom: 10px;
  padding-top: 5px;
  padding-left: 20px;
  padding-right: 20px;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  background: #fff !important;
}
.form-footer {
  padding-top: 10px;
  padding-bottom: 10px;
}
.transaction .table-summary {
  font-weight: bold;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #042452;
}
.transaction .table-summary .actions {
  margin-bottom: 5px;
  margin-top: -5px;
  padding-bottom: 5px;
}
.transaction .table-header {
  font-weight: bold;
  margin-bottom: 10px;
  color: #0F0303;
  padding-top: 5px;
  background-color: #ccc;
  padding-bottom: 5px;
  margin-left: -15px;
  margin-right: -15px;
  padding-left: 10px;
  padding-right: 10px;
}
.transaction .table-header .centre,
.transaction .table-header .price,
.transaction .table-header .margin,
.transaction .table-header .date,
.transaction .table-header .quantity {
  text-align: center;
}
.transaction .table-header .right {
  text-align: right;
}
.transaction .table-header .actions {
  margin-bottom: 5px;
  margin-top: -5px;
  padding-bottom: 5px;
}
.transaction .table-data,
.transaction .table-column-data {
  padding-left: 0px;
  margin-left: -15px;
  margin-right: -15px;
  padding-left: 10px;
  padding-right: 10px;
}
.transaction .table-data .description,
.transaction .table-column-data .description {
  padding-right: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.transaction .table-data .name,
.transaction .table-column-data .name,
.transaction .table-data .email,
.transaction .table-column-data .email {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.transaction .table-data .branch,
.transaction .table-column-data .branch {
  text-align: center;
}
.transaction .table-data .actions,
.transaction .table-column-data .actions {
  margin-bottom: 5px;
  margin-top: -5px;
  padding-bottom: 5px;
}
.transaction .table-data .margin,
.transaction .table-column-data .margin {
  text-align: center;
}
.transaction .table-data .price,
.transaction .table-column-data .price {
  text-align: right;
  padding-right: 18px;
  margin-right: 0px;
  margin-left: 0px;
}
.transaction .table-data .productCode,
.transaction .table-column-data .productCode,
.transaction .table-data .date,
.transaction .table-column-data .date {
  text-align: center;
}
.transaction .table-data .quantity,
.transaction .table-column-data .quantity {
  text-align: center;
}
.transaction .table-data .separator,
.transaction .table-column-data .separator {
  padding-left: 1px;
  border-left: 1px dashed #ddd;
  border-left: 1px dashed rgba(86, 61, 124, 0.2);
}
.transaction .table-subheader {
  padding-left: 0px;
  margin-left: -15px;
  margin-right: -15px;
  padding-left: 10px;
  padding-right: 10px;
  font-weight: bold;
  color: #000;
  background-color: #eee;
  margin-bottom: 5px;
  margin-top: -10px;
}
.transaction .table-subheader .description {
  padding-right: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.transaction .table-subheader .name,
.transaction .table-subheader .email {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.transaction .table-subheader .branch {
  text-align: center;
}
.transaction .table-subheader .actions {
  margin-bottom: 5px;
  margin-top: -5px;
  padding-bottom: 5px;
}
.transaction .table-subheader .margin {
  text-align: center;
}
.transaction .table-subheader .price {
  text-align: right;
  padding-right: 18px;
  margin-right: 0px;
  margin-left: 0px;
}
.transaction .table-subheader .productCode,
.transaction .table-subheader .date {
  text-align: center;
}
.transaction .table-subheader .quantity {
  text-align: center;
}
.transaction .table-subheader .separator {
  padding-left: 1px;
  border-left: 1px dashed #ddd;
  border-left: 1px dashed rgba(86, 61, 124, 0.2);
}
.transaction .table-footer {
  font-weight: bold;
  margin-top: 10px;
}
.transaction .panel {
  margin-left: 0px;
  margin-right: 0px;
  margin-bottom: 5px;
  margin-top: 5px;
  padding-top: 4px;
  padding-bottom: 4px;
  padding-left: 10px;
  padding-right: 10px;
  border: 1px solid #ddd;
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  border-top-right-radius: 4px;
  border-top-left-radius: 4px;
  overflow: clip;
}
.transaction .information {
  margin-left: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  color: #695252;
}
.transaction .form-header {
  margin-left: 0px;
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 16px;
  color: #695252;
}
.transaction .form-header .btn-default {
  font-size: 16px;
}
.transaction .form-header-title {
  font-weight: bold;
  font-size: 22px;
}
.transaction table.dataTable thead > tr {
  font-weight: bold;
}
.transaction table.dataTable thead > tr .centre {
  text-align: center;
}
.transaction table.dataTable thead > tr .right {
  text-align: right;
}
.transaction table.dataTable thead > tr .name {
  font-weight: bold;
  text-align: left;
}
.transaction .below-target {
  color: #FF0202;
}
.transaction .near-target {
  color: #FFBF00;
}
.transaction .on-target {
  color: #3AE85D;
}
td.quantity {
  text-align: center;
}
td.description {
  padding-right: 0px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
td.name,
td.email {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
td.centre,
td.branch {
  text-align: center;
}
td.right {
  text-align: right;
}
td.margin {
  text-align: center;
}
tbody td.price {
  text-align: right;
}
.ytdtable td {
  font-size: 9px;
}
.ytdtable th {
  font-size: 9px;
}
td.productCode,
td.date {
  text-align: center;
}
tfoot > tr > th.price {
  text-align: right;
  font-weight: bold;
}
/* Responsive */
/* Extra Small devices (phones, 768px and down) */
@media (min-width: 480px) {
  .form-title-bar {
    font-size: 12px;
  }
  .dropdown-toggle,
  .dropdown-menu {
    font-size: 8px;
  }
  .transaction .information,
  .transaction .table-header {
    font-size: 8px;
  }
  .transaction .table-data {
    font-size: 10px;
  }
  .transaction .table-column-data {
    font-size: 8px;
  }
  .transaction .table-subheader {
    font-size: 6px;
  }
  .transaction .form-header {
    font-size: 10px;
  }
  .transaction .form-header .btn-default {
    font-size: 8px;
  }
  .copyright,
  .transaction-date {
    font-size: 10px;
  }
}
/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .form-title-bar {
    font-size: 16px;
  }
  .dropdown-toggle,
  .dropdown-menu {
    font-size: 8px;
  }
  .transaction .information,
  .transaction .form-header,
  .transaction .table-header {
    font-size: 10px;
  }
  .transaction .table-data {
    font-size: 10px;
  }
  .transaction .table-column-data {
    font-size: 8px;
  }
  .transaction .table-subheader {
    font-size: 6px;
  }
  .transaction .form-header {
    font-size: 12px;
  }
  .transaction .form-header .btn-default {
    font-size: 10px;
  }
  .copyright,
  .transaction-date {
    font-size: 12px;
  }
}
/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {
  .form-title-bar {
    font-size: 18px;
  }
  .dropdown-toggle,
  .dropdown-menu {
    font-size: 12px;
  }
  .transaction .information,
  .transaction .form-header,
  .transaction .table-header {
    font-size: 12px;
  }
  .transaction .table-data {
    font-size: 12px;
  }
  .transaction .table-column-data {
    font-size: 10px;
  }
  .transaction .table-subheader {
    font-size: 10px;
  }
  .transaction .form-header {
    font-size: 14px;
  }
  .transaction .form-header .btn-default {
    font-size: 12px;
  }
  .copyright,
  .transaction-date {
    font-size: 12px;
  }
}
/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
  .form-title-bar {
    font-size: 20px;
  }
  .dropdown-toggle,
  .dropdown-menu {
    font-size: 14px;
  }
  .transaction .information,
  .transaction .form-header,
  .transaction .table-header {
    font-size: 14px;
  }
  .transaction .table-data {
    font-size: 14px;
  }
  .transaction .table-subheader {
    font-size: 12px;
  }
  .transaction .table-column-data {
    font-size: 12px;
  }
  .transaction .form-header {
    font-size: 16px;
  }
  .transaction .form-header .btn-default {
    font-size: 16px;
  }
  .copyright,
  .transaction-date {
    font-size: 14px;
  }
}
/*Top Bar (login, search etc.)
------------------------------------*/
.top {
  padding-top: 8px;
}
.top ul.loginbar {
  margin: 0;
  padding: 0;
  z-index: 9999;
  position: relative;
}
.top ul.loginbar > li {
  display: inline;
  list-style: none;
  padding-bottom: 15px;
}
.top ul.loginbar > li > a,
.top ul.loginbar > li > a:hover {
  color: #7c8082;
  font-size: 11px;
  text-transform: uppercase;
  font-family: 'Open Sans', sans-serif;
}
.top ul.loginbar li.devider {
  top: -1px;
  padding: 0;
  font-size: 8px;
  position: relative;
  margin: 0 9px 0 5px;
  font-family: Tahoma;
  border-right: solid 1px #bbb;
}
.top ul.loginbar li i.icon-globe {
  color: #bbb;
}
/*Lenguages*/
.top ul.lenguages {
  top: 25px;
  left: -5px;
  display: none;
  padding: 4px 0;
  padding-left: 0;
  list-style: none;
  min-width: 100px;
  position: absolute;
  background: #f0f0f0;
}
.top li:hover ul.lenguages {
  display: block;
}
.top ul.lenguages:after {
  top: -4px;
  width: 0;
  height: 0;
  left: 8px;
  content: " ";
  display: block;
  position: absolute;
  border-bottom: 6px solid #f0f0f0;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-left-style: inset;
  /*FF fixes*/
  border-right-style: inset;
  /*FF fixes*/
}
.top ul.lenguages li a {
  color: #555;
  display: block;
  font-size: 10px;
  padding: 2px 12px;
  margin-bottom: 1px;
  text-transform: uppercase;
  font-family: 'Open Sans', sans-serif;
}
.top ul.lenguages li.active a i {
  color: #999;
  float: right;
  margin-top: 2px;
}
.top ul.lenguages li a:hover,
.top ul.lenguages li.active a {
  background: #fafafa;
}
.top ul.lenguages li a:hover {
  text-decoration: none;
}
/*Header Default
------------------------------------*/
.header {
  z-index: 999;
  position: relative;
}
.header .navbar {
  margin: 0;
  min-height: inherit;
}
.header .navbar-default {
  border: none;
  background: none;
  border-bottom: 2px solid #CCC3C3;
}
.header .navbar-collapse {
  position: relative;
  /*max-height: inherit;*/
}
/*Brand*/
.navbar > .container .navbar-default .navbar-brand {
  z-index: 2;
  position: relative;
  padding: 0 10px 10px;
}
/*Navbar*/
.header .navbar-default .navbar-nav > li > a {
  color: #687074;
  font-size: 15px;
  font-weight: 400;
  padding: 9px 20px;
  text-transform: uppercase;
}
.header .navbar-default .navbar-nav > li.disabled > a {
  color: #DCE6EB;
}
.header .navbar-default .navbar-nav > .active > a {
  color: #72c02c;
}
/*Dropdown*/
.header .navbar-right .dropdown-menu {
  right: inherit;
}
.header .navbar .nav > li > a i.icon-angle-down {
  top: -1px;
  left: 1px;
  font-size: 12px;
  position: relative;
  margin: 0 !important;
}
.navbar-bookmarklet-button {
  padding-top: 10px;
}
/*Navber Toggle*/
.navbar-toggle,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background: #72c02c;
}
.navbar-toggle:hover {
  background: #5fb611 !important;
}
.navbar-default .navbar-toggle {
  border-color: #5fb611;
}
.navbar-default .navbar-toggle .icon-bar {
  background: #fff;
}
.navbar-nav .avatar {
  padding-top: 5px;
}
/*
 mult-level dropdown - see http://firdaus.grandexa.com/2013/09/twitter-bootstrap-3-multilevel-dropdown-menu/
 
*/
.dropdown-submenu {
  position: relative;
}
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -6px;
  margin-left: -1px;
  -webkit-border-radius: 0 6px 6px 6px;
  -moz-border-radius: 0 6px 6px 6px;
  border-radius: 0 6px 6px 6px;
}
.dropdown-submenu:hover > .dropdown-menu {
  display: block;
}
.dropdown-submenu > a:after {
  display: block;
  content: " ";
  float: right;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 0 5px 5px;
  border-left-color: #cccccc;
  margin-top: 5px;
  margin-right: -10px;
}
.dropdown-submenu:hover > a:after {
  border-left-color: #ffffff;
}
.dropdown-submenu .pull-left {
  float: none;
}
.dropdown-submenu.pull-left > .dropdown-menu {
  left: -100%;
  margin-left: 10px;
  -webkit-border-radius: 6px 0 6px 6px;
  -moz-border-radius: 6px 0 6px 6px;
  border-radius: 6px 0 6px 6px;
}
/*Serach Box*/
.header .navbar .search-open {
  right: 0;
  top: 50px;
  display: none;
  padding: 14px;
  position: absolute;
  background: #fcfcfc;
  border-top: solid 2px #eee;
  box-shadow: 0 1px 3px #ddd;
}
.header .navbar .nav > li > a.search {
  color: #aaa;
  cursor: pointer;
  padding: 8px 8px 10px;
  border-bottom-color: #aaa;
  background: #f7f7f7 !important;
}
.header .navbar .nav > li > a.search:hover {
  color: #72c02c;
  border-bottom-color: #72c02c;
}
.header .navbar .search-open form {
  margin: 0;
}
.header .navbar a.search [class^="icon-"],
.header .navbar a.search [class*=" icon-"] {
  width: 1.25em;
  text-align: center;
  display: inline-block;
}
.header .navbar a.search [class^="icon-"].icon-large,
.header .navbar a.search [class*=" icon-"].icon-large {
  /* increased font size for icon-large */
  width: 1.5625em;
}
.header .dropdown-menu li a.disabled {
  color: #DCE6EB;
  pointer-events: none;
  cursor: default;
}
.a .dropdown-toggle {
  margin-top: =5px;
}
/*Responsive @Media 
------------------------------------*/
@media (min-width: 767px) {
  /*Navbar Collapse*/
  .header .navbar-collapse {
    padding: 0;
  }
  /*Navbar*/
  .header .navbar-nav {
    top: 2px;
    margin-top: 5px;
    position: relative;
  }
  .header .navbar-default .navbar-nav > li > a,
  .header .navbar-default .navbar-nav > li > a:focus {
    border-bottom: solid 2px transparent;
  }
  .header .navbar-default .navbar-nav > li > a:hover,
  .header .navbar-default .navbar-nav > .active > a {
    border-bottom: solid 2px #72c02c;
  }
  .header .navbar-default .navbar-nav > li > a,
  .header .navbar-default .navbar-nav > li > a:hover,
  .header .navbar-default .navbar-nav > li > a:focus,
  .header .navbar-default .navbar-nav > .active > a,
  .header .navbar-default .navbar-nav > .active > a:hover,
  .header .navbar-default .navbar-nav > .active > a:focus {
    background: none;
  }
  .header .navbar-default .navbar-nav > .open > a,
  .header .navbar-default .navbar-nav > .open > a:hover,
  .header .navbar-default .navbar-nav > .open > a:focus {
    color: #72c02c;
  }
  /*Dropdown Menu*/
  .header .dropdown-menu {
    padding: 0;
    border: none;
    min-width: 200px;
    border-radius: 0;
    z-index: 9999 !important;
    margin-top: -2px !important;
    border-top: solid 2px #72c02c;
    border-bottom: solid 2px #687074;
  }
  .header .dropdown-menu li a {
    color: #687074;
    font-size: 13px;
    font-weight: 400;
    padding: 6px 15px;
  }
  .header .dropdown-menu .active > a,
  .header .dropdown-menu li > a:hover {
    color: #fff;
    filter: none !important;
    background: #687074 !important;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    transition: all 0.1s ease-in-out;
  }
  .header .dropdown-menu li > a:focus {
    background: none;
    filter: none !important;
  }
  /*Search Box*/
  .header .navbar .search-open {
    width: 330px;
  }
}
@media (max-width: 767px) {
  /*Search Box*/
  .header .navbar .search-open {
    left: 20px;
    top: inherit;
    bottom: -5px;
    padding: 15px;
    border-top: none;
    box-shadow: none;
    background: none;
  }
}
/*Menu
------------------------------------*/
/*Navbar*/
.header .navbar-default .navbar-nav > .active > a {
  color: #3498db;
}
/*Navber Toggle*/
.navbar-toggle,
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background: #3498db;
}
.navbar-toggle:hover {
  background: #2980b9 !important;
}
.navbar-default .navbar-toggle {
  border-color: #2980b9;
}
/*Serach Box*/
.header .navbar .nav > li > a.search:hover {
  color: #3498db;
  border-bottom-color: #3498db;
}
/*Responsive @Media 
------------------------------------*/
@media (min-width: 767px) {
  /*Navbar*/
  .header .navbar-default .navbar-nav > li > a:hover,
  .header .navbar-default .navbar-nav > .active > a {
    border-bottom: solid 2px #3498db;
  }
  .header .navbar-default .navbar-nav > .open > a,
  .header .navbar-default .navbar-nav > .open > a:hover,
  .header .navbar-default .navbar-nav > .open > a:focus {
    color: #3498db;
  }
  /*Dropdown Menu*/
  .header .dropdown-menu {
    border-top: solid 2px #3498db;
  }
}