html, body {
  height: 100%;
  font-family: 'Work Sans', sans-serif;
}

#id_globe_and_burger_menu {
	position:fixed;
	top:16px;
	right:4px;
	width: 76px;
	height: 32px;
	overflow: hidden;
	z-index:1;
}

body {
  background-color: #ffffff;
  color: #222222;
}

.no-pad {padding:0;}

.hide {
  position: absolute;
  top: -9999px;
  left: -9999px;
}

#nav {
  background-color: #393939;
  color: #ffffff;
  height: 65px;
}
@media only screen and (orientation:portrait) and (max-width : 574px) {
  #nav {
    height: 50px;
  }
  
  #id_globe_and_burger_menu {
	top:9px;
}
  
}

#crumbs {
  background-color: #eeeeee;
  height: 65px;
}
@media only screen and (orientation:portrait) and (max-width : 574px) {
  #crumbs {
    height: 50px;
  }
}

#main {
  padding-bottom: 200px;
}
@media only screen and (orientation:portrait) and (max-width : 574px) {
  #main {
    padding-bottom: 150px;
  }
}

#content_main_left_sidebar_new {
  height: 100%;
  overflow-x:hidden;
}
@media only screen and (orientation:portrait) and (max-width : 574px) {
  #content_main_left_sidebar_new {
    background-color: #ffffff;
    opacity: 0.7;
    z-index: 1030;
    height: 50%;
    top: 50%;
  }

  #content_main_left_sidebar_new.fullscreen {
    height: 100%;
    top: 5%;
  }
}

@media only screen and (orientation:portrait) and (max-width : 574px) {
  #main-lightbox {
    position: absolute;
  }
  
  #idZoomButtons
  {
	visibility: hidden;	
  }	
  
}

#idZoomButtonsSmall.fullscreen
{
	width:72px;
	height:32px;
	visibility: hidden;
}


@media only screen and (orientation:portrait) and (max-width : 574px) {

  #idZoomButtons
  {
	visibility: hidden;	
  }	

	#idZoomButtonsSmall.halfscreen
	{
		width:72px;
		height:32px;
		visibility: visible;
	}
  
}


@media only screen and (max-width : 768px) {
  #content_main_left_sidebar_new {
    background-color: #ffffff;
    opacity: 0.7;
    z-index: 1030;
    height: calc(50% - 50px);
  }

  #main-lightbox.fullscreen {
    position: fixed;
    top: 130px;
    height: calc(100% - 195px);
    width: 100%;
    left: 0px;
  }

  #main-lightbox.halfscreen {
    position: fixed;
    top: 130px;
    height: calc(50% - 130px);
    width: 100%;
    left: 0px;
    z-index: 1;
  }

  #content_main_left_sidebar_new.fullscreen {
    height: 100%;
    top: 5%;
  }
  
  #content_main_left_sidebar_new.halfscreen {
    bottom: 65px;
    position: fixed;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 20px;
    margin-right: 0px;
    width: 340px;
  }  
  
}

@media only screen and (min-width: 600px) {
.d-pbtl-block {
    display: block!important;
}
}

@media only screen and (max-width : 414px) {
	
.row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: 0px;
    margin-left: 0px;
}

.container-fluid, .container-lg, .container-md, .container-sm, .container-xl {
    width: 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}

#content_main_left_sidebar_new.fullscreen {
    height: 100%;
    top: 5%;
    padding-left: 45px;
    padding-right: 0px;
    margin-left: 0px;
    margin-right: 0px;
    width: 410px;
}

  #content_main_left_sidebar_new.halfscreen {
    bottom: 65px;
    position: fixed;
    padding-left: 45px;
    padding-right: 0px;
    margin-left: 0px;
    margin-right: 0px;
    width: 410px;
  }  

}

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

#content_main_left_sidebar_new.fullscreen
{
    height: 100%;
    top: 5%;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 27px;
    margin-right: 0px;
    width: 347px;
}

  #content_main_left_sidebar_new.halfscreen {
    bottom: 65px;
    position: fixed;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 27px;
    margin-right: 0px;
    width: 347px;
  }  

}

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

#content_main_left_sidebar_new.fullscreen
{
    height: 100%;
    top: 5%;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 20px;
    margin-right: 0px;
    width: 340px;
}

  #content_main_left_sidebar_new.halfscreen
  {
    bottom: 65px;
    position: fixed;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 20px;
    margin-right: 0px;
    width: 340px;
  }  

}

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

#content_main_left_sidebar_new.fullscreen {
    height: 100%;
    top: 5%;
    margin-left: 2px;
    margin-right: 0px;
    width: 325px;
}

  #content_main_left_sidebar_new.halfscreen {
    bottom: 65px;
    position: fixed;
    padding-left: 0px;
    padding-right: 0px;
    margin-left: 2px;
    margin-right: 0px;
    width: 325px;
  }  

}


#id_bench_selector_panel {
  height: 100%;
  padding-left:25px !important;
  padding-right:25px !important;
  background:white;
}

#footer {
  background-color: #eeeeee;
  height: 65px;
}

#brand-logo {
  height: 65px;
  width: auto;
  z-index: 2;
}

@media only screen and (orientation:portrait) and (max-width : 574px) {
  #footer {
    height: 50px;
  }
  
  #brand-logo {
  height: 50px;
  width: auto;
}
  
}

.btn-proceed {
  background-color: #f70000;
  color: #ffffff;
}
.btn-save {
  background-color: #FF6700;
  color: #ffffff;
}
.btn-configure {
  background-color: #E2001A;
  color: #ffffff;
  border: none;
}

.crumb-step {
  display: flex !important;
}

.circle {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  background: #E2001A;
  margin-right: 8px;
  margin-left: 8px;
}

.circle_textarea {
	width:70%;
}

@media only screen and (orientation:portrait) and (max-width : 574px) {
  .circle {
    width: 30px;
    height: 30px;
  }
}
.circle-label {
  display: block;
  font-size: 24px;
  padding: 4%;
  text-align: center;
  color: #ffffff;
}

.bench-selector-title {
    font-size: 17px;
    height: 60px;
    overflow: visible;
    line-height: 1.0;
}

.workbench_select2_title
{
	padding-left:20px;
	padding-right:20px;
    font-size: 17px;
    line-height: 1.5;
    font-weight: bold;
}

.bench-selector-description {
    height: 165px;
    overflow: hidden;
    font-size: 10px;
}

@media only screen and (orientation:portrait) and (max-width : 574px) {
  .circle-label {
    font-size: 20px;
    padding: 0;
  }

	.bench-selector-description
	{
		height: 80px;
		overflow: hidden;
		font-size: 9px;
	}
	
	.bench-selector-title {
	    font-size: 12px;
	    height: 30px;
	    overflow: visible;
	    line-height: 1.2;
	}
	
	.workbench_select2_title
	{
		padding-left:20px;
		padding-right:20px;
	    font-size: 12px;
	    line-height: 1.5;
	    font-weight: bold;
	}
	

}

.step-active {
  border-bottom: 2px solid #E2001A;
}
.step-inactive {
  border-bottom: 2px solid #ffbfc6;
  cursor: pointer;
  cursor: hand;
}
.step-inactive .circle {
  background: #ffbfc6;
}

.step-inactive .step-desc {
  color: #bbbbbb;
}
.step-disabled {
  border-bottom: 2px solid #cccccc;
}
.step-disabled .circle {
  background: #cccccc;
}

.step-disabled .circle-label {
  color: #eeeeee;
}
.step-disabled .step-desc {
  color: #cccccc;
}

.hand
{
	cursor: pointer;
	cursor: hand;
}

#id_bench_selector_screen
{
	z-index: 1;
}

.modal-backdrop {
  background-color: #ffffff;
}
.modal-backdrop.show {
    opacity: 0.7;
}
.modal-header {
  background-color: #E3001B;
  color: #ffffff;
}

.btn-negative {
  background-color: #bbbbbb;
}
.btn-positive {
  background-color: #E2001A;
}
.btn-share{
  background-color: #bbbbbb;
}

.modal-title
{
	color: #fff;
	font-weight: bold;
}

.btn
{
	color: #fff;
}

.blinking {
  animation: blinker 5s linear infinite;
}

@keyframes blinker
{
  50%
  {
    opacity: 0;
  }
}