:root {
  --text_color:   #1f1f1f;
  --text_color_1: #333333;
  --text_color_2: #555555;
  --text_color_3: #888888;
  --text_color_4: #aaaaaa;

  --primary-color: #2e70b8; /* 34495e */
  --primary2-color:#607d8b; /* 9b59b6 */
  --success-color: #70B82E; /* 289C00 */
  --info-color:    #2e70b8; /* 3498db */
  --warning-color: #B82E70; /* ffb606 */
  --warning2-color:#e67e22; /* e67e22 */ 
  --danger-color:  #B82E70; /* e74c3c */ 
  --danger2-color: #c0392b; /* c0392b */    
}

body {
  font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
  background-color: #fff;
  font-size: 13px;
  color: #1f1f21;
  margin: 0;
  padding: 0;
  height: 100%;
}
#header {
  height: 56px;
}
.fixed-navbar #wrapper {
    top: 56px;
}
.mobile-navbar {
    top: 56px;
}
#menu {
  top: 56px;
}
.bg-gray {
  background: #2e70b8 !important;
  color: #fff !important;
}
@media only screen {
  .split-xxs-2 {
    width: 49%;
    display: inline-block;
  }
}
@media only screen and (max-width : 480px) {
  .split-xxs-2 {
    width: 100%;
    display: block;
  }
}

@media print {    
    .no-print, .no-print * {
        display: none !important;
    }
}
.bootstrap-tagsinput {
  display: block !important;
  margin-bottom: 0 !important;
}
.bootstrap-tagsinput .tag {
  font-size: 13px !important;
  color: #fff !important;
  font-weight: normal;
  padding: 3px 5px;
  line-height: 2.2em;
}
.bootstrap-tagsinput input {
    min-width: 70px !important;
}
.bootstrap-tagsinput.disabled input {
    min-width: 0px !important;  
    width: 1px !important;
}


.dropdown-menu > li > a {
    padding: 4px 20px 3px 12px;
}
.dropdown-menu > li > a i.fa-fw,
.navbar-nav > li > a i.fa-fw{
    width: 1.8em;
}
.dropdown-menu > li > a i.fa-fw2,
.navbar-nav > li > a i.fa-fw2{
    width: 3em;
}
.hpanel {
   background-color: white;
}
#main-modal {
  z-index: 2500;
}
.sweet-overlay {
  z-index: 2501;
}
.sweet-alert {
  z-index: 2502;
}

.clearable{
  background: #fff url(data:image/gif;base64,R0lGODlhBwAHAIAAAP///5KSkiH5BAAAAAAALAAAAAAHAAcAAAIMTICmsGrIXnLxuDMLADs=) no-repeat right -10px center;
  border: 1px solid #999;
  padding: 3px 18px 3px 4px; /* Use the same right padding (18) in jQ! */
  border-radius: 3px;
  transition: background 0.4s;
}
.clearable.x  { background-position: right 5px center; }
.clearable.onX{ cursor: pointer; }
.clearable::-ms-clear {display: none; width:0; height:0;}
.p-l-20 {
  padding-left: 20px !important;
}
.p-n {
  padding: 0 !important;
}
.p-b-n {
  padding-bottom: 0 !important;
}
.p-b-sm {
  padding-bottom: 10px !important;
}
.p-b-xs {
  padding-bottom: 5px !important;
}
.p-b-xxs {
  padding-bottom: 1px !important;
}
.p-t-xs {
  padding-top: 5px;
}
.p-r-xs {
  padding-right: 5px;
}
.p-l-xs {
  padding-left: 5px;
}
.p-r-xxs {
  padding-right: 1px;
}
.p-l-xxs {
  padding-left: 1px;
}
.modal-dialog {
    margin-top: 40px;
}
.form-group {
    margin-bottom: 10px;
}
.dataTables_filter,
#index-table_paginate {
  float:right;
}
table.dataTable thead .sorting_desc {
    background-image: url("img/sort_desc.png");
}
table.dataTable thead .sorting_asc {
    background-image: url("img/sort_asc.png");
}
table.dataTable thead .sorting {
    background-image: url("img/sort_both.png");
}
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting {
    background-repeat: no-repeat;
    background-position: center right;
}


/**/
strong.tt-highlight {
  color: #222;
}
.typeahead,
.tt-query,
.tt-hint {
  border: none;
  outline: none;
}

.typeahead {
  background-color: #fff;
}

.typeahead:focus {
  border: 2px solid #0097cf;
}

.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

.tt-hint {
    color: transparent !important;
}

.tt-menu {
  padding: 8px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 3px;
}

.tt-suggestion {
  padding: 3px 10px;
  font-size: 14px;
  line-height: 20px;
  color: #444;
}

.tt-suggestion:hover {
  cursor: pointer;
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}

.tt-suggestion p {
  margin: 0;
}

.gist {
  font-size: 14px;
}

/* example specific styles */
/* ----------------------- */

#custom-templates .empty-message {
  padding: 5px 10px;
 text-align: center;
}

/**/
.sweet-alert {
  border-radius: 0;
}
.sweet-alert button {
  border-radius: 3px;
}

.pagination {
    margin: 5px 0 10px 0 ;
}
.hpanel {
    margin-bottom: 10px;
}
.panel-collapse.condensed-panel {
  width:160px !important;
}
.mobile-navbar,
#navbar.navbar-collapse.in {
  border-bottom: 1px solid #c3c4c5;
}
.content {
    padding: 15px 15px 40px 15px;
    min-width:350px;
} 
.btn {
  /*margin-right: 2px; XXX*/
}
.btn-group .btn {
  margin-right: 0px;
}
.panel-tools .fa {
  margin-left: 3px;
  margin-right: 3px;
}
.navbar-nav .caret,
#logo .caret {
    margin-left: 10px;
}
.help-block {
    margin-bottom: 0px;
}

table {
  color: #333;
  color: #6a6c6f;
}

.form-control {
  color:#222;
  border-color: #c4c5c7 !important;
}
.input-group-addon {
  border-color: #c4c5c7 !important;
}
.input-group-btn > .btn, 
.input-group-btn > .btn-group {
    border-color: #c4c5c7 !important;
}

.has-error .input-group-addon,
.has-error .input-group-btn {
  border-color: #a94442 !important;
}
.has-error .input-group-btn:last-child > .btn, .has-error .input-group-btn:last-child > .btn-group {
    margin-left: 0;
}

.btn-block.btn-labeled {
    height: 34px;
}
.btn-lg.btn-block.btn-labeled {
    height: 45px;
}
.btn-labeled {
    padding-top: 0;
    padding-bottom: 0;
}
.btn-block.btn-labeled {
    padding-top: 6px;
    padding-bottom: 6px;
}
.btn-lg.btn-block.btn-labeled {
    padding-top: 10px;
    padding-bottom: 10px;
}
.btn-block.btn-labeled .btn-label {
  top:-6px;
  float: left;
}
.btn-lg.btn-block.btn-labeled .btn-label {
  top:-10px;
  float: left;
}

.btn-label {
    position: relative;
    left: -12px;
    display: inline-block;
    padding: 6px 12px;
    background: rgba(0,0,0,.05);
    border-radius: 3px 0 0 3px;
}

.btn-lg .btn-label {
    left: -16px;
    padding: 10px 16px;
}
.btn-sm .btn-label {
    padding: 5px 10px;
}
.flag {
    width: 16px;
    height: 11px;
    background: url(../images/flags/flags.png) no-repeat;
    margin-top: -.18em;
    position: relative;;
    top:-1px;
    display: inline-block
}
.flag.flag-fr {
    background-position: -144px -44px
}
.flag.flag-en {
    background-position: -176px -44px
}
.flag.flag-nl {
    background-position: -80px -110px
}
.flag.flag-de {
  background-position: -80px -33px;
}

.flag+span {
    text-transform: capitalize;
    display: inline-block;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    margin-top: -3px
}
/* CHECK - START */
.fixed-sidebar #menu {
    overflow-y: visible;
}
@media (min-width: 768px) {
  .fa.arrow {
      padding-right: 18px;
  }
}
/*CHECH - END*/
#side-menu > li:first-child {
  border-top: none;
}
#side-menu span.arrow {
  position: relative;
  top: 4px;
}
#side-menu {
    background: #ffffff;
}
#side-menu li a {
    text-transform: none;
    padding: 13px 18px 13px 12px;
    font-weight: 500;
    color: var(--text_color);
}
#side-menu li .nav-second-level li a {
  color: var(--text_color);
  font-weight: 500;
}
#side-menu li.active a {
    font-weight: 600;
}
#side-menu li a.side-menu-btn,
#side-menu li a.side-menu-btn:hover {
    color: #ffffff;
    background-color: var(--info-color);;
}

.fa.arrow {
    line-height: 1.42857;
}
.navbar-toggle {
    margin-top: 10px;
}

.p-0 {
  padding: 0px !important;
}
.m-0 {
  margin: 0px !important;
}
body.scheme-info tr.selected {
  background-color: #4ea5e0 !important;
  color: #ffffff !important;
}
body.scheme-info .mobile-menu .navbar-nav > li.inactive,
body.scheme-info .mobile-menu .navbar-nav > li.inactive:hover,
body.scheme-info .mobile-menu .navbar-nav > li.inactive a,
body.scheme-info .mobile-menu .navbar-nav > li.inactive a:hover,
body.scheme-info .mobile-menu .navbar-nav > li.inactive a:active {
  background-color: var(--info-color);
}
body.scheme-primary .mobile-menu .navbar-nav > li.inactive,
body.scheme-primary .mobile-menu .navbar-nav > li.inactive:hover,
body.scheme-primary .mobile-menu .navbar-nav > li.inactive a,
body.scheme-primary .mobile-menu .navbar-nav > li.inactive a:hover,
body.scheme-primary .mobile-menu .navbar-nav > li.inactive a:active {
  background-color: var(--primary-color);
}
.mobile-menu .navbar-nav > li.inactive a,
.mobile-menu .navbar-nav > li.inactive a:hover,
.mobile-menu .navbar-nav > li.inactive a:active,
.mobile-menu .navbar-nav > li.inactive a:visited {
  color: #eee;
  cursor:default;
}


.text-danger2 {
    color: var(--danger2-color);
}
.text-primary2 {
    color: var(--primary2-color);
}
.text-warning2 {
    color: var(--warning2-color);
}

.navbar.navbar-static-top a, 
.nav.navbar-nav li a {
    color: var(--text_color); /* 34495e 5c6572 6e7783 */
}
.navbar.navbar-static-top a:focus, 
.nav.navbar-nav li a:focus,
.navbar.navbar-static-top a:hover, 
.nav.navbar-nav li a:hover {
    color: var(--primary-color); /* 34495e 5c6572 6e7783 */
}

.bigmenu a {
  width: 100px;
  margin: 8px;
}
#logo a {
  width: 100px;
}
.bigmenu a h5{
  color: #9d9fa2;
  font-size: 14px;
  height: 28px;
  padding: 0;
  white-space: normal;
  line-height: 15px;
  vertical-align: middle;
  display: table-cell;
  width: 108px;
  padding: 1px;
  text-align: center;  
}
.bigmenu a i {
    font-size: 60px;
}
.hdropdown.bigmenu {
  padding: 5px;
}

.btn-tile {
  width: 110px;
  height: 110px;
  font-size: 16px;
  margin: 4px;
	padding: 2px;
}
a.btn-tile {
  padding: 10px 1px 2px 1px;
}
.btn-tile span{
  font-size: 85%;
  height: 28px;
  padding: 0;
  white-space: normal;
  line-height: 15px;
  vertical-align: middle;
  display: table-cell;
  width: 108px;
  padding: 1px;
  text-align: center;
}

.media-left, .media > .pull-left {
    padding-right: 5px;
}

.public-course-preview-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.public-course-preview {
  width: max(275px, 23.5%);
  min-height: 100px;
  margin:8px;
  border: none;
}    
.single-public-course-preview {
  width: 98%;
  min-height: 100px;
  margin:8px;
  border: none;
}    
.public-course-preview-box {
  margin-bottom: 0;
  border: 1px solid #ddd;
  position: relative;
}
.public-course-preview-box .panel-heading {
  padding:8px 8px;
}
.public-course-preview-box .panel-info {
  padding: 2px 10px 4px 10px;
}
.public-course-preview-box .panel-heading .media-body {
    line-height: 16px;
}
.public-course-preview-box .panel-image {
    border: none;
    position: relative;
}
.public-course-preview-box .title {
  position: absolute;
  bottom: 0;
  padding: 7px;
  color: #fff;
  width: 100%;
  text-align: center;
  opacity: 0.3;
  background-color: #000;
  display: none;
}
.public-course-preview-heart {
  position: absolute;
  right: 5px;
  top: 5px;
  /*
  background-color: white;
  opacity: 0.8;
  */
  padding: 1px 3px;
  border-radius: 15px;
  color: #ddd;
  cursor: pointer;
}
.public-course-preview-heart.public-course-preview-favorite{
  position: absolute;
  right: 5px;
  top: 6px;
  padding: 0px 2px;
  border-radius: 15px;
  color: #fe3824;
}
.publisher-heart {
  padding: 1px 3px;
  color: #ddd;
  cursor: pointer;
}
.publisher-heart.publisher-favorite{
  color: #fe3824;
}
.public-course-preview-subbox:focus .title,
.public-course-preview-subbox:hover .title {
  display: block;
}
.public-course-preview .public-course-preview-box .panel-image svg {
  width: 100%;
  height: auto;
  max-height: min(275px, 20vw);
}
.single-public-course-preview .public-course-preview-box .panel-image svg {
  width: 100%;
  height: auto;
  max-height: 66vh;
}
.public-course-preview-image{
  cursor: pointer;
  margin: 0 auto; 
  max-height: min(275px, 20vw);
}
.public-course-preview-box .title .btn{
  margin: 0 5px;
}
.public-course-type-title,
.public-event-type-title {
  font-size: 13px;
  padding-left: 8px;
  display: inline-block;
  bottom: 1px solid #ccc;
  background-color: #ddd;
  background-image: linear-gradient(180deg, #ddd , #eee);
  border-radius: 15px;
  padding: 2px 8px;
  font-weight: 600;
  margin: 1px;
}
.public-course-type-title.course-type-agility {
    border-color: #0076ff;
    color: #ffffff;
    background-color: #0076ff;
    /* background-image: linear-gradient(180deg, var(--info-color) , #5cace2); */
    background-image: linear-gradient(135deg, #0076ff, #66adff)
}
.public-course-type-title.course-type-jumping {
    border-color: #74d348;
    color: #ffffff;
    background-color: #74d348;
    background-image: linear-gradient(180deg, #74d348 , #90dc6c);
}
.public-course-type-title.course-type-hoopers {
    border-color: #ffbf25;
    color: #ffffff;
    background-color: #ffbf25;
    background-image: linear-gradient(180deg, #ffbf25 , #ffcc50);
}
.course-filter-title{
  margin: 12px 0 4px 0;
}
.touch-me {
  text-shadow: -1px -1px 0 #555, 1px -1px 0 #555, -1px 1px 0 #555, 1px 1px 0 #555;
}
.touch-me-red {
  text-shadow: -1px -1px 0 #fe3824, 1px -1px 0 #fe3824, -1px 1px 0 #fe3824, 1px 1px 0 #fe3824;
}
.touch-me-shadow {
  text-shadow: 2px 2px 2px #767584; /* 272634 */
}
.touch-div-shadow {
  box-shadow: 2px 2px 2px #767584;
}
.public-course-level {
  width: 20px;
  height: 20px;
  border-radius: 20px;
  border: 1px solid transparent;
  background-color: transparent;
}
.public-course-level.L1 {
  border: 1px solid green;
  background-color: green;
  background-image: linear-gradient(135deg, #289C00 , #7ec466);
}
.public-course-level.L2 {
  border: 1px solid #0076ff;
  background-color: #0076ff;
  background-image: linear-gradient(135deg, #0076ff, #66adff);
}
.public-course-level.L3 {
  border: 1px solid red;
  background-color: red;
  background-image: linear-gradient(135deg, var(--danger-color), #f1948a);
  background-image: linear-gradient(135deg, #fe3824, #fe887c); 
}
.public-course-level.L9 {
  border: 1px solid #222;
  background-color: #333;
  background-image: linear-gradient(135deg, #222, #7a7a7a);
}

.public-course-level.L9L3 {
  border: 1px solid #222;
  border: none;
  background-color: #333;
  background-image: linear-gradient(135deg, #222, #fe887c);
}
.public-course-level.L9L2 {
  border: 1px solid #222;
  border: none;
  background-color: #333;
  background-image: linear-gradient(135deg, #222, #66adff);
}
.public-course-level.L9L1 {
  border: 1px solid #222;
  border: none;
  background-color: #333;
  background-image: linear-gradient(135deg, #222, #7ec466);
}
.public-course-level.L3L2 {
  border: 1px solid red;
  border: none;
  background-color: red;
  background-image: linear-gradient(135deg, #fe3824, #66adff);
}
.public-course-level.L3L1 {
  border: 1px solid red;
  border: none;
  background-color: red;
  background-image: linear-gradient(135deg, #fe3824, #7ec466);
}
.public-course-level.L2L1 {
  border: 1px solid #0076ff;
  border: none;
  background-color: #0076ff;
  background-image: linear-gradient(135deg, #0076ff, #7ec466);
}


.public-course-preview-designer{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (max-width: 1200px) {
	.btn-tile {
	  width: 90px;
	  height: 90px;
	  font-size: 14px;
    margin: 3px;
	}
  a.btn-tile {
    padding: 7px 1px 2px 1px;
  }
  .btn-tile span{
    height: 18px;
    line-height: 9px;
  }  
  .public-course-preview {
    width: max(220px, 30%);
    margin: 6px;
  }   
  .public-course-preview-image{
    max-height: min(275px, 20vw);
  }  
}
@media (max-width: 768px) {
  	#logo {
    	display: block;
  	}
	.btn-tile {
	  width: 75px;
	  height: 75px;
	  font-size: 12px;
    margin: 2px;
	}
  a.btn-tile {
    padding: 4px 1px 2px 1px;
  }
  .btn-tile span{
    height: 18px;
    line-height: 9px;
  }    
  .public-course-preview-box .panel-heading {
      padding: 4px;
  }  
  .public-course-preview {
    width: max(290px, 47%);
    margin: 5px;
  }   
}
@media (max-width: 630px) {
  .public-course-preview-box .panel-heading {
      padding: 6px 2px 4px 2px;
  }  
  .public-course-preview {
    width: 46%;
    margin: 4px;
  } 
  .public-course-type-title,
  .public-event-type-title {
    font-size: 10px;
    padding: 2px 2px;
    font-weight: 500;
    box-shadow: 0px 0px 1px #272634;
  }
  .public-course-preview-box .title{
    padding-left: 0;
    padding-right: 0;
  }      
  .public-course-preview-box .title .btn{
    margin: 0;
  }     
  .course-filter-title{
    margin: 8px 0 3px 0;
  }    
  .panel-body.public-course-filter-panel {
    padding: 10px;
  }  
}
@media (max-width: 370px) {
  .public-course-preview-box .panel-heading {
      padding: 6px 0 3px 0;
  }  
  .public-course-preview {
    width: 92%;
    margin: 0px;
  } 
  .public-course-type-title,
  .public-event-type-title {
    font-size: 10px;
    padding: 2px 2px;
    font-weight: 500;
  }    
  .public-course-preview-box .title{
    padding-left: 0;
    padding-right: 0;
  }    
  .public-course-preview-box .title .btn{
    margin: 0;
  }  
  .course-filter-title{
    margin: 6px 0 2px 0;
  }  
  .panel-body.public-course-filter-panel {
    padding: px;
  }
}
 /*
 * common colors
 *
 * danger2, deep red: 	var(--danger2-color)
 * danger, red:			var(--danger-color)
 * warning2, orange:	var(--warning2-color)
 * warning, yellow: 	var(--success-color)
 * primary2, violet:	var(--primary2-color)
 * primary, navy blue:  var(--primary-color)
 * info, blue: 			var(--info-color)
 * success, green:		var(--success-color)
*/

/* customized panel header when closed */
/*
.hpanel.hviolet.bordered {
    border: 1px solid var(--primary2-color);  
}
.hpanel.hred.bordered {
    border: 1px solid var(--danger-color);	
}
.hpanel.hred.bordered.panel-collapse .panel-heading {
    border-bottom: 1px solid var(--danger-color);
}
.hpanel.horange.bordered {
    border: 1px solid var(--warning2-color);	
}
.hpanel.horange.bordered.panel-collapse .panel-heading {
    border-bottom: 1px solid var(--warning2-color);
}
.hpanel.hyellow.bordered {
    border: 1px solid var(--success-color);	
}
.hpanel.hyellow.bordered.panel-collapse .panel-heading {
    border-bottom: 1px solid var(--success-color);
}
.hpanel.hblue.bordered {
    border: 1px solid var(--info-color);	
}
.hpanel.hblue.bordered.panel-collapse .panel-heading {
    border-bottom: 1px solid var(--info-color);
}
.hpanel.hgreen.bordered {
    border: 1px solid var(--success-color);	
}
.hpanel.hgreen.bordered.panel-collapse .panel-heading {
    border-bottom: 1px solid var(--success-color);
}
.hpanel.bordered.panel-collapse {
    border: none;
}
.hpanel.bordered .panel-heading {
    border: none;	
}
.hpanel.bordered .panel-body {
   	border-top: none;
}
*/

.hpanel.bordered.panel-collapse .panel-heading.hbuilt{
    border-bottom: none;
}

/* customize hbuilt panel (darker border) */
.hpanel.bordered {
    border: 1px solid #D3D3D3;
}
.hpanel.bordered .panel-heading.hbuilt {
    border: none;
    border-bottom: 1px solid #D3D3D3;
}
.hpanel.bordered .panel-body {
  border: none;
}
.hpanel.bordered .panel-footer {
    border: none;
    border-top: 1px solid #E4E4E4;
}

.hpanel.bordered.hblue .panel-heading.hbuilt,
.hpanel.bordered.primary .panel-heading.hbuilt {
  border-bottom: inherit;  
}

.hpanel.bordered.panel-collapse.hblue .panel-heading.hbuilt {
  border-bottom: 2px solid var(--info-color);  
}
.hpanel.bordered.panel-collapse.primary .panel-heading.hbuilt {
  border-bottom: 2px solid var(--primary-color);  
}
.hpanel.bordered.panel-collapse.warning2 .panel-heading.hbuilt {
  border-bottom: 2px solid var(--warning2-color);  
}




/* ensure navbar itmems remain visible on small devices */
@media (max-width: 768px) {
  	.navbar-right.show {
    	display: block;
  	}	
	.navbar-nav > li.keep-left {
	    float: left;
	}
	.navbar-nav > li.keep-left > a {
	    padding: 15px;
	}
}

/* remove light bg-color */
/* ensure logo & small logo has same properties*/
#logo.light-version {
    background-color: #fff;
    font-size: 16px;
    text-align: left;
    padding: 14px 10px 18px 15px;
}
/*
#logo.light-version:hover {
    background-color: #f7f9fa;
}
*/

.header-link {
    background-color: #fff;
    font-size: 16px;
    text-align: left;
    padding: 16px 20px;
}
#logo.light-version span {
    font-size: 16px;
    text-align: left;
}
.header-link:hover {
    background: #f7f8fa;
}
.small-logo {
    padding-left: 15px;
    font-weight: 600;
    font-size: 16px;
}

/* adjust size of text - compared to stand-alone icons */
.navbar-nav > li > a.text {
    font-size: 16px;
    padding-top: 16px
}

/* ensure custom topbar can be appropriately positioned */
.landing-page .navbar .container {
	position: relative;
}

/* customized css for designer */
.designer-body {
  /*height: auto;*/
  overflow: hidden;
}
.designer-body .content {
  padding: 5px 10px 0 0;
  position: relative;
}
.designer-body #wrapper {
  position: relative;
}
.navbar-designer .navbar-nav > li > a,
.designer-header.header-link .navbar-nav > li > a {
    font-size: 16px;
    padding: 15px 8px;
}
@media (min-width: 768px) {
  .navbar-right.navbar-designer {
      margin-right: 0px;
  }
}

.right-sidebar {
  background-color: #fff;
  border-left: 1px solid #e4e5e7;
  overflow: hidden;
  position: fixed;
  top: 0px;
  width: 320px !important;
  z-index: 1009;
  bottom: 0;
  right: 0;
  display: none;
  overflow: auto;
}
.right-sidebar-narrow {
  width: 50px !important;
  overflow: visible;
  /*background-color: rgba(255, 255, 255, 0.75) !important;*/
  z-index: 1008;
}
.right-sidebar-narrow-expanded {
  width: 95px !important;
  overflow: visible;
  /*background-color: rgba(255, 255, 255, 0.75) !important;*/
  z-index: 1008;
}
.right-sidebar.sidebar-open {
  display: block;
}
.right-sidebar .dropdown-menu {
  z-index: 1009;
  position:fixed;
}
.right-sidebar-narrow .p-xxs {
  padding: 3px 5px!important;
}

.header-link .navbar-nav > li > a {
    padding: 15px 13px;
    font-size: 16px;
}
.header-link .navbar-nav > li > a.obstacle,
.header-link .navbar-nav > li > a.extra {
    padding: 15px 7px;
}
.header-link .navbar-nav > li > a:hover,
.header-link .navbar-nav > li > a:focus {
  background-color: #f2f2f2;
}


@media (max-width: 767px) {
  .designer-header .navbar-nav .open .dropdown-menu {
      position: absolute;
      background-color: #fff;
      border: 1px solid rgba(0, 0, 0, .15);
  }
}
@media (min-width: 100px) {
  .designer-header.header-link {
      padding: 0 ;
      height: 55px;
      margin-right: 2px;
  }
  .designer-header.header-link .navbar-nav {
      margin: 0;
  }
/*
  .designer-header.header-link .navbar-nav:hoover {
      background-color: transparent !important;
  } 
*/
  .designer-header.header-link .navbar-nav > li {
      float: left !important;
  }
}

/* customized navbar (only for landing page)  - including topbar which is always visible */
.landing-page .navbar-nav > li, .landing-page .navbar-nav > li > a {
    height: 32px;
}
.landing-page .navbar-nav > li > a {
    font-size: 15px;
    font-weight: 400;
    padding: 5px 12px;
    margin: 0 5px;
    height: 29px;
    border: none !important;
    text-align: center !important;
    color: var(--text_color_1);
}
.landing-page .navbar-default .navbar-nav > .active > a, 
.landing-page .navbar-default .navbar-nav > .active > a:hover, 
.landing-page .navbar-default .navbar-nav > .active > a:focus, 
.landing-page .navbar-default .navbar-nav > .open > a, 
.landing-page .navbar-default .navbar-nav > .open > a:hover, 
.landing-page .navbar-default .navbar-nav > .open > a:focus {
    background-color: var(--primary-color);
    color: #fff;
    border:none;
}
.nav.navbar-nav > li > a.btn-primary,
.nav.navbar-nav.navbar-right > li > a.btn-primary {
    border: 1px solid var(--primary-color) !important;
    color: var(--primary-color) !important;
}
.nav.navbar-nav li a.btn-primary:focus,
.nav.navbar-nav li a.btn-primary:hover,
.nav.navbar-nav li.active a.btn-primary,
.nav.navbar-nav.navbar-right > li > a.btn-primary:focus,
.nav.navbar-nav.navbar-right > li > a.btn-primary:hover,
.nav.navbar-nav.navbar-right > li.active > a.btn-primary {
    background-color: var(--primary-color) !important;
    color: #fff !important;
}
.landing-page p {
    color: #777777;
}

/* customize landing page*/
.landing-page .navbar .navbar-brand {
    font-weight: 600;
    color: var(--primary-color);
    font-size: 22px;
    background-color: transparent;
    margin-top: 0px;
    padding-bottom: 0;
    padding-top: 0;
}
/* customize landing page for new bg-image */
.landing-page header {
    background: url('../images/landing/header.jpg') 18% 0 no-repeat;
    height: 480px;
    margin-bottom: 0;
}
#page-top-2 {
	padding-top: 30px;
}

.designer-pricing-small,
.designer-pricing-medium,
.designer-pricing-large {
  height: 120px; 
}
.pricing-small,
.pricing-medium,
.pricing-large {
  height: 220px; 
}
.pricing-month-info {
  margin-bottom: 25px;
}

@media (max-width: 1200px) {
	.landing-page header {
		background-size: 1700px;
		height: 430px;
	}
	#page-top-2 {
		padding-top: 10px;
	}
}
@media (max-width: 992px) {
	.landing-page .navbar .container {
	    width: 100%;
	}
	.landing-page header {
		background-size: 1500px;
		height: 380px;
	}
	#page-top-2 {
		padding-top: 30px;
	}

  .pricing-small {
    height: 50px; 
  }
  .pricing-medium {
    height: 80px;
  }
  .pricing-large {
    height: 190px; 
  }
  .designer-pricing-small  {
    height:50px; 
  }
  .designer-pricing-medium  {
    height: 80px; 
  }
  .designer-pricing-large {
    height: 120px; 
  }

  .pricing-month-info {
    margin-bottom: 10px;
  }

}
@media (max-width: 768px) {
	.landing-page header {
		background-size: 1300px;
		height: 330px;
	}
	#page-top-2 {
		padding-top: 30px;
	}
}
.landing-page .navbar-default .navbar-toggle:hover, 
.landing-page .navbar-default .navbar-toggle:focus, 
.navbar-default .navbar-toggle:hover, 
.navbar-default .navbar-toggle:focus {
    background: transparent;
    color: #777;
}
.landing-page .navbar-default .navbar-toggle:hover .icon-bar, 
.landing-page .navbar-default .navbar-toggle:focus .icon-bar,
.navbar-default .navbar-toggle:hover .icon-bar, 
.navbar-default .navbar-toggle:focus .icon-bar {
    background-color: #777 !important;
}
.navbar-toggle{
    border-color: #ddd;
}
.navbar-toggle .icon-bar,
.navbar-toggle:hover .icon-bar,
.navbar-toggle:focus .icon-bar {
    background-color: #777;
}


.landing-page .brand-desc {
    width: 220px;
    padding: 
}
@media (min-width: 768px) {
	.landing-page .container > .navbar-header, 
	.landing-page .container-fluid > .navbar-header, 
	.landing-page .container > .navbar-collapse, 
	.landing-page .container-fluid > .navbar-collapse {
	    margin-top: 5px;
	}
}

@media (min-width: 767px) {

  .landing-page .navbar-right {
    margin-top: 40px !important;
    margin-bottom: 5px;
  }
}
@media (max-width: 766px) {
  .navbar-right {
    margin-top:0px !important;
  }
  .landing-page .navbar-nav > li > a,
  .navbar-nav > li > a {
      text-align: left !important;
  }
}

/* alert parent div */
.flash-message {
    margin-bottom: 10px;
    margin-top: 10px;
    background: #fff;
    padding: 0px;
    color: #6a6c6f;
    -box-shadow: 0 0 1px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.2);
    opacity: 1;
    -border-top: solid 1px #efefef;
}
.flash-message > div:hover {
    box-shadow: 0 0 1px rgba(0, 0, 0, 0.1), 0 1px 4px rgba(0, 0, 0, 0.2);
}

/* extra topbar*/
.topbar {
	z-index: 12;
	position: absolute;
	right: 15px;
	top:10px;
}

.designerfooterbar {
  position: absolute;
  left: 5px;
  top:5px;  
}
.designerfooterbar ul {
  padding-left: 5px;
}
.designerfooterbar ul > li {
  display: inline;
  list-style: none;
  position: relative;
}
.designerfooterbar ul > li > a, 
.designerfooterbar ul > li > a:hover {
  color: inherit;
  font-size: 14px;
}

.footerbar {
  z-index: 1010;
  position: absolute;
  left: 5px;
  bottom:7px;
}
.footerbar .btn {
  margin: 0;
  padding: 0; 
}
@media (max-width: 768px) {
	.topbar {
		right: 70px;
		top:16px;
	}
}
.topbar ul.loginbar,
.footerbar ul {
	margin: 0;
  padding-left: 10px
}
.topbar ul.loginbar > li,
.footerbar ul > li {
	display: inline;
	list-style: none;
	position: relative;
  padding-bottom: 15px;
}
.topbar ul.loginbar > li > a, 
.topbar ul.loginbar > li > a:hover {
  /*
	color: #455463;
	font-size: 12px;
	-text-transform: uppercase;
  */
}
.footerbar ul > li > a, 
.footerbar ul > li > a:hover {
  color: #455463;
  font-size: 13px;
  font-weight: 700;
}
.topbar ul.loginbar li i.fa { 
	color: #bbb;
}

.topbar ul.loginbar li.topbar-devider,
.footerbar ul li.topbar-devider {  
	top: -1px;
	padding: 0;
	font-size: 8px;
	position: relative;
	margin: 0 9px 0 5px;
	font-family: Tahoma;
	border-right: solid 1px #bbb;
}
/*languages*/
.topbar ul.languages {
	top: 25px;
	left: -5px;
	display: none;
	padding: 4px 0;
	padding-left: 0; 
	list-style: none;
	min-width: 100px;
	position: absolute;
	background: #f0f0f0;
}
.topbar li:hover ul.languages {
	display: block;
}
.topbar ul.languages: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*/
}
.topbar ul.languages li a {
	color: #455463;
	display: block;
	font-size: 11px;
	padding: 2px 12px;
	margin-bottom: 1px;0
}
.topbar ul.languages li.active a i {
	color: #999;
	float: right;
	margin-top: 2px;
}
.topbar ul.languages li a:hover, 
.topbar ul.languages li.active a {
	background: #fafafa;
}
.topbar ul.languages li a:hover {
	text-decoration: none; 
}

/* NOT IN USE */
/* iCheck plugin Square skin, blue
----------------------------------- */
.icheckbox_square-blue,
.iradio_square-blue {
  display: inline-block;
  *display: inline;
  vertical-align: middle;
  margin: 0;
  padding: 0;
  width: 22px;
  height: 22px;
  background: url(img/blue.png) no-repeat;
  border: none;
  cursor: pointer;
}
.icheckbox_square-blue {
  background-position: 0 0;
}
.icheckbox_square-blue.hover {
  background-position: -24px 0;
}
.icheckbox_square-blue.checked {
  background-position: -48px 0;
}
.icheckbox_square-blue.disabled {
  background-position: -72px 0;
  cursor: default;
}
.icheckbox_square-blue.checked.disabled {
  background-position: -96px 0;
}
.iradio_square-blue {
  background-position: -120px 0;
}
.iradio_square-blue.hover {
  background-position: -144px 0;
}
.iradio_square-blue.checked {
  background-position: -168px 0;
}
.iradio_square-blue.disabled {
  background-position: -192px 0;
  cursor: default;
}
.iradio_square-blue.checked.disabled {
  background-position: -216px 0;
}

@media (max-width: 768px) {
  #hbreadcrumb {
      margin-bottom: 0;
  }
}

.content.primary .pagination > .active > a, 
.content.primary .pagination > .active > span, 
.content.primary .pagination > .active > a:hover, 
.content.primary .pagination > .active > span:hover, 
.content.primary .pagination > .active > a:focus, 
.content.primary .pagination > .active > span:focus {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}
.content.primary2 .pagination > .active > a, 
.content.primary2 .pagination > .active > span, 
.content.primary2 .pagination > .active > a:hover, 
.content.primary2 .pagination > .active > span:hover, 
.content.primary2 .pagination > .active > a:focus, 
.content.primary2 .pagination > .active > span:focus {
    background-color: var(--primary2-color);
    border-color: var(--primary2-color);
}
.content.warning2 .pagination > .active > a, 
.content.warning2 .pagination > .active > span, 
.content.warning2 .pagination > .active > a:hover, 
.content.warning2 .pagination > .active > span:hover, 
.content.warning2 .pagination > .active > a:focus, 
.content.warning2 .pagination > .active > span:focus {
    background-color: var(--warning2-color);
    border-color: var(--warning2-color);
}
.content.warning .pagination > .active > a, 
.content.warning .pagination > .active > span, 
.content.warning .pagination > .active > a:hover, 
.content.warning .pagination > .active > span:hover, 
.content.warning .pagination > .active > a:focus, 
.content.warning .pagination > .active > span:focus {
    background-color: var(--success-color);
    border-color: var(--success-color);
}
.content.danger .pagination > .active > a, 
.content.danger .pagination > .active > span, 
.content.danger .pagination > .active > a:hover, 
.content.danger .pagination > .active > span:hover, 
.content.danger .pagination > .active > a:focus, 
.content.danger .pagination > .active > span:focus {
    background-color: var(--danger-color);
    border-color: var(--danger-color);
}
.content.danger2 .pagination > .active > a, 
.content.danger2 .pagination > .active > span, 
.content.danger2 .pagination > .active > a:hover, 
.content.danger2 .pagination > .active > span:hover, 
.content.danger2 .pagination > .active > a:focus, 
.content.danger2 .pagination > .active > span:focus {
    background-color: var(--danger2-color);
    border-color: var(--danger2-color);
}
.content.success .pagination > .active > a, 
.content.success .pagination > .active > span, 
.content.success .pagination > .active > a:hover, 
.content.success .pagination > .active > span:hover, 
.content.success .pagination > .active > a:focus, 
.content.success .pagination > .active > span:focus {
    background-color: var(--success-color);
    border-color: var(--success-color);
}

.pagination > li > a, 
.pagination > li > span {
    color: #555;
}

.badge.badge-primary2 {
    background-color: var(--primary2-color);
}
.badge.badge-warning2 {
    background-color: var(--warning2-color);
}
.badge.badge-danger2 {
    background-color: var(--danger2-color);
}


input[type="search"] {
  -webkit-appearance: searchfield;
}
input[type="search"]::-webkit-search-cancel-button {
  -webkit-appearance: searchfield-cancel-button;
}


.label-warning {
    background-color: var(--warning-color);
    padding: .25em .6em .25em;
}

.compress-sidebar {
  position: relative;
  z-index: 999;
  float: right;
  right: 17px;
  padding: 2px 5px 12px 12px;
}


.panel-tools .popover {
  width: 200px;
}

.popover {
  border-radius: 2px;
}

.rec-label {
    text-align: left;

}
@media (min-width: 768px) {
    .rec-label {
        text-align: right;
    }
}
.rec-info {
    text-align: left;

}
@media (min-width: 768px) {
    .rec-info {
        text-align: left;
    }
}

td.details {
    background-color: #EBEBEB;
}

.dl-horizontal.icon {
    margin-bottom: 0px;
}
.dl-horizontal.icon dt {
    width: 22px;
    float: left;
    text-align: left;
}
.dl-horizontal.icon dd {
    margin-left: 26px;
}
.fa-fwr {
    width: 1.28571429em;
    text-align: right;
}

/* 'fix' for auto-scroll to top on modal.open programmatically*/
body.modal-open {
    overflow: visible;
}
.table > thead > tr > th {
    vertical-align: middle;
}

/**
 * OBSTACLES
 */
@media (min-width: 200px){
  li > a.octunnel{
      background: url(../images/designer/obs_ctunnel.png) no-repeat;
  }
  li > a.otunnel6 {
      background: url(../images/designer/obs_tunnel6.png) no-repeat;
  }
  li > a.otunnel5 {
      background: url(../images/designer/obs_tunnel5.png) no-repeat;
  }
  li > a.otunnel4 {
      background: url(../images/designer/obs_tunnel4.png) no-repeat;
  }
  li > a.otunnel2 {
      background: url(../images/designer/obs_tunnel2.png) no-repeat;
  }
  li > a.odwalk {
      background: url(../images/designer/obs_dwalk.png) no-repeat;
  }
  li > a.oaframe {
      background: url(../images/designer/obs_aframe.png) no-repeat;
  }
  li > a.ossaw {
      background: url(../images/designer/obs_ssaw.png) no-repeat;
  }
  li > a.oweave12 {
      background: url(../images/designer/obs_weave12.png) no-repeat;
  }
  li > a.oweave10 {
      background: url(../images/designer/obs_weave10.png) no-repeat;
  }
  li > a.oweave8 {
      background: url(../images/designer/obs_weave8.png) no-repeat;
  }
  li > a.oweave6 {
      background: url(../images/designer/obs_weave6.png) no-repeat;
  }
  li > a.oweave4 {
      background: url(../images/designer/obs_weave4.png) no-repeat;
  }
  li > a.odjump {
      background: url(../images/designer/obs_djump.png) no-repeat;
  }
  li > a.owall {
      background: url(../images/designer/obs_wall.png) no-repeat;
  }
  li > a.otire {
      background: url(../images/designer/obs_tire.png) no-repeat;
  }
  li > a.oljump5 {
      background: url(../images/designer/obs_ljump5.png) no-repeat;
  }
  li > a.oljump4 {
      background: url(../images/designer/obs_ljump4.png) no-repeat;
  }
  li > a.oljump3 {
      background: url(../images/designer/obs_ljump3.png) no-repeat;
  }
  li > a.oljump2 {
      background: url(../images/designer/obs_ljump2.png) no-repeat;
  }
  li > a.otable {
      background: url(../images/designer/obs_table.png) no-repeat;
  }
  li > a.obarrel {
      background: url(../images/designer/obs_barrel.png) no-repeat;
  }
  li > a.ohooper {
      background: url(../images/designer/obs_hooper.png) no-repeat;
  }
  li > a.enumbers1 {
      background: url(../images/designer/extra_n1.png) no-repeat;
  }
  li > a.enumbers2 {
      background: url(../images/designer/extra_n2.png) no-repeat;
  }
  li > a.enumbers3 {
      background: url(../images/designer/extra_n3.png) no-repeat;
  }
  li > a.enumbers4 {
      background: url(../images/designer/extra_n4.png) no-repeat;
  }
  li > a.etext {
      background: url(../images/designer/extra_text.png) no-repeat;
  }
  li > a.earea {
      background: url(../images/designer/extra_area.png) no-repeat;
  }
  li > a.eline {
      background: url(../images/designer/extra_sl.png) no-repeat;
  }
  li > a.octunnel, li > a.otunnel6, li > a.otunnel5, li > a.otunnel4, li > a.otunnel2, li > a.oaframe, 
  li > a.odwalk, li > a.ossaw, li > a.oweave12, li > a.oweave10, li > a.oweave8, li > a.oweave6, li > a.oweave4 {
    padding: 10px 0 10px 185px !important;
    font-size: 13px;
    background-position: 10px center; 
    /* line-height: 0px; */
    height: 30px;
    margin-right: 15px
  }
  li > a.odjump, li > a.owall, li > a.otire, li > a.oljump5, li > a.oljump4, 
  li > a.oljump3, li > a.oljump2, li > a.otable, li > a.obarrel, li > a.ohooper {
    padding: 10px 0 10px 95px !important;
    font-size: 13px;
    background-position: 10px center; 
    /* line-height: 0px; */
    height: 30px;
    margin-right: 15px
  }
  li > a.enumbers1, li > a.enumbers2, li > a.enumbers3, li > a.enumbers4, li > a.earea, li > a.eline, li > a.etext {
    padding: 10px 0 10px 75px;
    font-size: 13px;
    background-position: 10px center; 
    /* line-height: 0px; */
    height: 30px;
    margin-right: 15px
  }
}

a.obstacle.selected-obstacle,
a.obstacle.selected-obstacle:focus,
a.obstacle.selected-obstacle:hover {
  border-bottom: 2px solid var(--info-color) !important;
}


.modal-header {
  padding: 10px;
}
.modal-title {
  font-size: 25px;
}

.btn-default .btn-label {
    background: rgba(0,0,0,.085);
}
.btn-default.active {
    background-color: #e0e0e0;
    color: #222;
    -webkit-box-shadow: inset 0 1px 18px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 18px rgba(0, 0, 0, .1);
}
.btn-sad {
  background-color: #fff;
  border-color: #d9dbdd;
  color: #606265;
}
.btn-sm.btn-sad{
  padding: 5px;
}
.btn-xs.btn-sad{
  padding-left: 4px;
  padding-right: 4px;
}
.btn-sad.active {
    background-color: var(--info-color);
     color: #fff;
    -webkit-box-shadow: inset 0 1px 18px rgba(0, 0, 0, .1);
    box-shadow: inset 0 1px 18px rgba(0, 0, 0, .1);
}
.btn-sad:hover,
.btn-sad:focus {
    color: #222;
}
.btn-sad.active:hover,
.btn-sad.active:focus {
    color: #fff;
}

.slider-selection {
  background: #BABABA !important;
}
.slider-track-high {
  background: #e4e5e7 !important;
}

.tour-step-background, 
.tour-backdrop {
    position: fixed !important;
}
.tour-step-background {
    background: #000;
}

.toast-message ol {
  padding-left: 15px;
}
.toast-info .toast-progress {
  background-color: var(--primary-color);
}

.right-sidebar-toggle {
  float: right;
}
@media (max-width: 768px)  and (min-width: 680px){
  .navbar-right {
      display: block;
      float: right;
  } 
  .navbar-nav {
    margin-top: inherit;
    float: left;
    margin: 0;
  }
  .mobile-menu {
    display: none;
  }
  .navbar-nav > li {
      float: left;
  }
  .nav > li {
      position: relative;
      display: block;
  }
}
@media (max-width: 768px){
  li > a:hover,
  li > a:focus{
    background-image: inherit;
  }
}

.table.no-border {
    border-bottom:0px !important;
}
.table.no-border th, .table.no-border td {
    border: 1px !important;
}
.label-info {
    background-color: var(--info-color);
}
.input-group-btn {
    vertical-align: top;
}

.table-condensed > tbody > tr > td.novpad {
    padding: 5px 1px;
}

.blueimp-gallery {
    background: #fff !important;
}
.blueimp-gallery-carousel {
    box-shadow: 0 0 10px #a0a0a0 !important;
}
.blueimp-gallery-carousel-phone {
    box-shadow: none !important;
    height:600px;
}

.truncate, .contact-stat strong  {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}
.contact-stat strong  {
  display: block;
}
.label-primary2 {
    background-color: var(--primary2-color);
}
.label-warning2 {
    background-color: var(--warning2-color);
}
.label-primary {
    background-color: var(--primary-color);
}
.hpanel.hsuccess .panel-body {
    border-top: 2px solid var(--success-color);
}
.hpanel.hinfo .panel-body {
    border-top: 2px solid var(--info-color);
}
.hpanel.hdanger .panel-body {
    border-top: 2px solid #ea6557;
}
.hpanel.hwarning2 .panel-body {
    border-top: 2px solid var(--warning2-color);
}
.hpanel.hwarning .panel-body {
    border-top: 2px solid var(--success-color);
}
.hpanel.hprimary .panel-body {
    border-top: 2px solid #3f5872;
}
.hpanel.hprimary2 .panel-body {
    border-top: 2px solid var(--primary2-color);
}
.hpanel.hdefault .panel-body {
    border-top: 2px solid #888;
}
.hpanel.hmuted .panel-body {
    border-top: 1px solid #aaa;
}

.Z-trial {
  min-width: 250px;
  width: 23%;
  margin: 1%; 
}

.text-muted2 {
    color: #999;
}
.text-disabled {
    color: #999 !important;
    cursor: not-allowed;
}

.m-l-xxs {
  margin-left: 1px;
}
h3, .h3 {
    font-size: 22px;
}

.trial .hpanel > .panel-footer {
    background: #fdfdfd;
    padding: 5px;
}

.info-panel li {
  margin: 5px 0;
}

.list-group-item.active2, .list-group-item.active2:hover, .list-group-item.active2:focus {
    background-color: var(--primary2-color);
    border-color: var(--primary2-color);
    color: #FFFFFF !important;
}
.list-group-item.active2 .list-group-item-heading {
    color: #fff;
}
.label-light {
    background-color: #aaa;
}
.m-t-nxs {
  margin-top: -5px;
}
.fixed-small-header .small-header,
.fixed-small-header.hide-sidebar .small-header {
    z-index: 999 !important;
}

@media (min-width: 768px) {
  .fixed-small-header .content {
    padding-top: 135px;
  }
}
@media (max-width: 768px) {
  .fixed-small-header .content {
    padding-top: 120px;
  }
  .fixed-small-header.page-small .content {
    padding-top: 110px;
  }
}

.btn-gray {
    background-color: #ddd;
    border-color: #dbdbdb;
    color: #111;
}

.div-primary2 {
  color: white;
  background-color: #8c49a7;
}

.badge-md {
  /*font-size: 110%;*/
  font-weight: 600;
  padding-top:8px;
  padding-bottom:8px;
  border-radius: 16px !important;  
}

.text-highlight {
  font-weight: bold;
  background-color: #ffdb00;
}


.btn-gray {
  background-color: #888;
  border-color: #888;
  color: #fff ;
}
.btn-gray:hover,
.btn-gray:focus,
.btn-gray:active,
.btn-gray.active,
.open .dropdown-toggle.btn-gray {
  background-color: #999;
  border-color: #999;
  color: #fff ;
}

/*correcting error*/
.btn-circle.btn-xs {
  width: 21px;
  height: 21px;
  padding: 4px 7px;
  border-radius: 10px;
  font-size: 10px;
  line-height: 1;
}

.btn-label-no-highlight,
.btn-labeled.btn-outline .btn-label{
    background: none;
}
/*
.btn-labeled.btn-outline:hover .btn-label,
.btn-labeled.btn-outline:focus .btn-label{
    background: rgba(0,0,0,.15);
}
*/
.btn-label-right {
    left: 12px;
}

@media (min-width: 768px) {
  .dl-horizontal.dl-lg dt {
      width: 220px;
      white-space: normal;
  }
  .dl-horizontal.dl-lg dd {
      margin-left: 240px;
  }  
}

.trial-flag{
  width: 28px;
  float: left;
}
@media (min-width: 992px) {
  .trial-date {
    width: auto;
    padding-left: 30px;
    padding-right: 140px;
  }
  .trial-type{
    width: 130px;
    float: right;
    text-align: right;
  }
  .hidden-450 {
    display:none;
  }
  .visible-450 {
    display:inherit;
  }
}
@media (max-width: 991px) {
  .trial-date{
    width: auto;
    padding-left: 30px;
    padding-right: 0;
  }
  .trial-type{
    width:auto;
    float: left;
    clear: both;
    text-align: left;
    margin-left: 30px;
  }
  .hidden-450 {
    display:inherit;
  }
  .visible-450 {
    display:none;
  }
}


/*
@media (min-width: 991px) {
}
@media (max-width: 992px) {
  .trial-date{
    width: 75%;
    max-width: 550px;
  }
  .trial-info{
    float: left;
    clear: both;
    margin-left: 28px;
    width: 90%;
  }
  .hide-sidebar .trial-info{
    float: none;
    clear: none;
  }
}
@media (max-width: 767px) {
  .trial-date{
    width: 90%;
    max-width: 640px;
  }
  .trial-info{
    float: left;
    clear: both;
    margin-left: 28px;
    width: 90%;
  }
  .trial-type{
    width:auto;
    float: left;
    clear: both;
    text-align: left;
    margin-left: 28px;
  }
}
@media (max-width: 420px) {
  .trial-date{
    max-width: 350px;
    width: 85%;
  }
  .trial-info{
    float: left;
    clear: both;
    margin-left: 28px;
  }
}
*/

.font-size-sm {
  font-size: 92.5%;
}
.font-size-xs {
  font-size: 81.125%;
}
.font-size-xxs {
  font-size: 75%;
}

/* open menu on hover*/
.dropdown-auto-toggle:hover + ul.dropdown-menu {
  display: block !important;    
}
ul.dropdown-menu:hover {
  /*display: block !important;    */
}
.entries-dd-menu {
  top:28px;
}
.entries-dd-menu:hover {
  display: block !important;
}

.dt-buttons.btn-group {
  padding-bottom: 8px;
}

div.disabled {
  cursor: not-allowed;
  background-color: #eee;
  opacity: 1;
}

@media print{    
  #header, .footer, #menu {
    display: none !important;
  }
  #wrapper {
    margin-left: 0px !important;
    border: none !important;
    top: 0 !important;
  }    
}

@media (min-width: 768px) {
  .navbar-fixed-top {
  }
}
.navbar-nav > li > a {
    padding: 15px 24px;
}
.navbar-nav > li > a  > p.icon-title{
    font-size: 10px;
    position: absolute;
    top: 36px;
    width: 100%;
    left: 0;
    text-align: center;
}

.navbar-nav > li:last-child > a {
    /* padding-right: 25px; */
    /* margin-right: 12px; */
}
.navbar-right .navbar-nav > li:last-child > a {
    margin-right: 15px;
    padding: 15px 24px;
}


/*
.trial-btn{
  max-width: 85%;
}
*/

/* NEW */
.btn-group > .btn + .dropdown-toggle {
  border-left: 1px solid rgba(0, 0, 0, 0.15);
}
.btn .caret {
  margin-left: 5px;
  margin-right: 5px;
}
.navbar-nav > li > a > [class*="pe-7s-"] {
  top: -5px;
  position: relative;
  font-size: 120%;
}

/* jquery sortable*/
body.dragging, body.dragging * {
  cursor: move !important;
}
.dragged {
  position: absolute;
  opacity: .5;
  z-index: 2000;
  border: 1px solid #aaa;
  background: #eee;
}
ol.catalog-items {
  cursor: move;
  margin: 0 0 9px 0;
  min-height: 10px;
}
ol.catalog-items li{
  list-style-type: none;
  min-height: 25px;
}
ol.catalog-items li.placeholder {
  position: relative;
  margin: 5px;
  padding: 5px;
  border: 1px solid #CCC;
  color: red;
  background: #eee;
}
ol.catalog-items li.placeholder:before {
  position: absolute;
  content: ' ';
  width: 0;
  height: 0;
  margin-top: -5px;
  left: -5px;
  top: -4px;
  border: 5px solid transparent;
  border-left-color: #e98e3d;
  border-right: none;
  color: transparent;
}
.catalog-id {
  display: inline-block;
  float: left;
  width: 40px;
  text-align: center;
  margin: 2px 0;
}
.catalog-info {
  display: block;
}

.designer-button {
  width: 38px !important;
  padding: 7px 9px;
}

a.select-number .badge, 
a.obstacle .badge,
.numbers-checkbox .badge {
  border-radius: 10px;
  font-size: 10px;
  border: 1px solid #222222;
  padding: 3px 6px;
}

.sp-replacer.sp-light,
.sp-container.sp-light {
  border-color: #e4e5e7 !important;
}
.sp-replacer.sp-light:hover,
.sp-replacer.sp-light:focus,
.sp-replacer.sp-light:active,
.sp-container.sp-light:hover,
.sp-container.sp-light:focus,
.sp-container.sp-light:active {
  border-color: #d9dbdd !important;
}

@media not all, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) {
  .icheckbox_square-green, .iradio_square-green {
    background: url(img/blue.png) no-repeat;
  }  
}


#line-color-menu .sp-replacer {
  margin-top: 10px;
  border: none;
  background-color: transparent;;
}
#line-color-menu .sp-preview {
  border-color: #888888;
}
.line-color-dropdown .sp-cancel {
  visibility: hidden;
}
#line-color-menu:hover {
  background-color: #efefef;
}

/* SVG related to camera / background picture for designer */
svg.camera {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 1;
}
svg.camera.zoomed {
  opacity: .4;
}
#svg_flat_container .info {
    text-align: center;
    font-size: 12px;
    padding: 35px 5px 5px;
    color: #999999;
}
.cameraHandle {
  fill: #eee;
  opacity: .5;
  pointer-events: all;
  stroke: #444;
  stroke-width: 1px;
  cursor: move;
}
.cameraHandleLocator {
  fill: #ccc;
  opacity: .5;
  pointer-events: all;
  stroke: #000;
  stroke-width: 1px;
  cursor: crosshair;
}

.select-object {
  display: inline-block !important;
  /*border: rebeccapurple 1px solid;*/
  width: 50px;
}
.select-number {
  display: inline-block !important;
  padding-top: 8px !important;
  padding-left: 9px !important;
  width: 40px;
}
/* Accomodate small screen size*/
@media screen and (max-width: 960px) {
    .min940,
    .min940block {
        display: none !important;
    }
    .max940 {
        display: inline !important;
    }
    .max940block {
        display: block !important;
    }
    .max940iflex {
        display: inline-flex !important;
    }
}
@media screen and (min-width: 961px){
    .min940 {
        display: inline !important;
    }
    .min940block {
        display: block !important;
    }
    .max940,
    .max940block,
    .max940iflex {
        display: none !important;
    }
}
.contact_subject {
  display: none;
}

/* v24 */

.nav-pills > li > a, 
.nav-pills > li > a:focus, 
.nav-pills > li > a:hover {
    background-color: #f4f4f4 !important;
    margin: 0 1px;
}

.hpanel.hsuccess .panel-body {
  border-top: 2px solid var(--success-color);
}
.hpanel.hinfo .panel-body {
  border-top: 2px solid var(--info-color);
}
.hpanel.hprimary .panel-body {
  border-top: 2px solid var(--primary-color);
}
.hpanel.hprimary2 .panel-body {
  border-top: 2px solid var(--primary2-color);
}
.hpanel.hwarning .panel-body {
  border-top: 2px solid var(--success-color);
}
.hpanel.hwarning2 .panel-body {
  border-top: 2px solid var(--warning2-color);
}
.hpanel.hdanger .panel-body {
  border-top: 2px solid var(--danger-color);
}
.hpanel.hdanger2 .panel-body {
  border-top: 2px solid var(--danger2-color);
}

.hpanel.hbgsuccess .panel-body,
.hpanel.hbginfo .panel-body,
.hpanel.hbgprimary .panel-body,
.hpanel.hbgprimary2 .panel-body,
.hpanel.hbgwarning .panel-body,
.hpanel.hbgwarning2 .panel-body,
.hpanel.hbgdanger .panel-body,
.hpanel.hbgdanger2 .panel-body {
  border: none;
}

.scheme-success .btn-sad.active,
.hpanel.hbgsuccess .panel-body,
.btn-default.btn-active-success.active,
.alert-success,
.bg-success,
.nav-pills.success > li.active > a, 
.nav-pills.success > li.active > a:focus, 
.nav-pills.success > li.active > a:hover {
  background: var(--success-color) !important;
  color: #fff !important;
}

.scheme-info .btn-sad.active,
.hpanel.hbginfo .panel-body,
.btn-default.btn-active-info.active,
.alert-info,
.bg-info,
.nav-pills.info > li.active > a, 
.nav-pills.info > li.active > a:focus, 
.nav-pills.info > li.active > a:hover {
  background: var(--info-color) !important;
  color: #fff !important;
}

.scheme-primary .btn-sad.active,
.hpanel.hbgprimary .panel-body,
.btn-default.btn-active-primary.active,
.alert-primary,
.bg-primary,
.nav-pills.primary > li.active > a, 
.nav-pills.primary > li.active > a:focus, 
.nav-pills.primary > li.active > a:hover {
  background: var(--primary-color) !important;
  color: #fff !important;
}

.scheme-primary2 .btn-sad.active,
.hpanel.hbgprimary2 .panel-body,
.btn-default.btn-active-primary2.active,
.alert-primary2,
.bg-primary2,
.nav-pills.primary2 > li.active > a, 
.nav-pills.primary2 > li.active > a:focus, 
.nav-pills.primary2 > li.active > a:hover {
  background: var(--primary2-color) !important;
  color: #fff !important;
}

.scheme-warning .btn-sad.active,
.hpanel.hbgwarning .panel-body,
.btn-default.btn-active-warning.active,
.alert-warning,
.bg-warning,
.nav-pills.warning > li.active > a, 
.nav-pills.warning > li.active > a:focus, 
.nav-pills.warning > li.active > a:hover {
  background: var(--success-color) !important;
  color: #fff !important;
}

.scheme-warning2 .btn-sad.active,
.hpanel.hbgwarning2 .panel-body,
.btn-default.btn-active-warning2.active,
.alert-warning2,
.bg-warning2,
.nav-pills.warning2 > li.active > a, 
.nav-pills.warning2 > li.active > a:focus, 
.nav-pills.warning2 > li.active > a:hover {
  background: var(--warning2-color) !important;
  color: #fff !important;
}

.scheme-danger .btn-sad.active,
.hpanel.hbgdanger .panel-body,
.btn-default.btn-active-danger.active,
.alert-danger,
.bg-danger,
.nav-pills.danger > li.active > a, 
.nav-pills.danger > li.active > a:focus, 
.nav-pills.danger > li.active > a:hover {
  background: var(--danger-color) !important;
  color: #fff !important;
}

.scheme-danger2 .btn-sad.active,
.hpanel.hbgdanger2 .panel-body,
.btn-default.btn-active-danger2.active,
.alert-danger2,
.bg-danger2,
.nav-pills.danger2 > li.active > a, 
.nav-pills.danger2 > li.active > a:focus, 
.nav-pills.danger2 > li.active > a:hover {
  background: var(--danger2-color) !important;
  color: #fff !important;
}

.alert {
    color: white;
    border-width: 0;
    border-radius: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
}