html, body { height: 100% }
body{
	padding:0px;
	margin:0px;
	font-family: Arial, Verdana,  Helvetica, sans-serif;
	color: #fff;
	font-size: 12px;
  -webkit-user-select: none;  
  -moz-user-select: none;    
  -ms-user-select: none;      
  user-select: none;
}
table{
	font-size: 12px;
}
#pm_qp_logo_bak{
    display: block;
	background: url("../images/quote_pro_small.png") no-repeat;
    width: 231px;
    height: 81px;
    /*margin-left: 75px;*/
    float: left;
	padding-right: 20px;
	margin-top: 10px;
}
#pm_qp_logo{
    padding: 1vw 0vw;
	padding-right: 3vw;
}
#pm_qp_logo img{
	width: 100%;
}
#pm_header_left{
    max-width: 50%;
    display: flex;
    box-sizing: border-box;
    padding-left: 4vw;
    align-items: center;
    flex-wrap: wrap;
}
#pm_property_info_holder{
    height: 100%;
    display: block;
    float: left;
    /*margin-left: 100px;*/
}
#pm_property_info_holder div{
}
#pm_existion_select{
    padding: 10px;
	margin-bottom: 20px;
}
#pm_floorplan_select,
#pm_view_select{
	padding: 5px;
	width: 120px;
    height: fit-content;
    display: flex;
}
.pm_product_tally_holder{
	position: absolute;
    right: 10px;
}
.pm_list_thumb{
    display: block;
    width: 35px;
    height: 35px;
    float: left;
    margin-right: 5px;
}
.pm_list_thumb img{
	max-width: 35px;
	max-height: 35px;
}
.pm_list_name{
    font-size: 12px;
    text-overflow: ellipsis;
    width: 300px;
    white-space: nowrap;
    overflow: hidden;
}
.pm_list_number{

}
.pm_header_right{
    height: 100%;
    display: flex;
    width: 50%;
    /* float: right; */
    align-items: center;
    flex-wrap: wrap;
	justify-content: flex-end;
}
.pm_floorplan_changer_text,
.pm_view_changer_text{
	float: left;
	margin-right: 10px;
	font-size: 18px;
    line-height: 30px;
}
.pm_floorplan_changer_holder,
.pm_view_changer_holder{
    display: flex;
    vertical-align: middle;
    padding-right: 15px;
    flex-wrap: wrap;
    justify-content: space-evenly;
    align-items: center;
	margin:3px;
}
.pm_pm_create_new_input_text{
	float: left;	
}
.pm_pm_create_new_input_text input{
	width: 418px;
    font-size: 16px;
    padding: 5px;
    text-align: center;
}
.pm_pm_create_new_input_holder{
	margin-top: 30px;
	text-align: center;
}
.pm_footer_button_holder{
	/*float: right;*/
	margin-right: 10px;
	width: 100%;
}
.pm_pm_instructions{
    text-align: center;
    font-weight: bold;
    font-size: 14px;
}
.pm_toggle_size_button{
	display: block;
	height: 25px;
	width: 25px;
	background-color: #000;
	float: left;
}
.pm_image_label img{
	border:1px solid #000;
}
.pm_pm_create_existing {
	-moz-box-shadow:inset 0px 1px 0px 0px #fff6af;
	-webkit-box-shadow:inset 0px 1px 0px 0px #fff6af;
	box-shadow:inset 0px 1px 0px 0px #fff6af;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffab23));
	background:-moz-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-webkit-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-o-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:-ms-linear-gradient(top, #ffec64 5%, #ffab23 100%);
	background:linear-gradient(to bottom, #ffec64 5%, #ffab23 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffab23',GradientType=0);
	background-color:#ffec64;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #ffaa22;
	cursor:pointer;
	color:#333333;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffee66;
	margin: auto;
    display: block;
	text-align:center;
}
.pm_pm_create_existing:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffab23), color-stop(1, #ffec64));
	background:-moz-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-webkit-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-o-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:-ms-linear-gradient(top, #ffab23 5%, #ffec64 100%);
	background:linear-gradient(to bottom, #ffab23 5%, #ffec64 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffab23', endColorstr='#ffec64',GradientType=0);
	background-color:#ffab23;
}
.pm_pm_create_existing:active {
	position:relative;
	top:1px;
}

.pm_pm_create_new{
	-moz-box-shadow: 0px 1px 0px 0px #f0f7fa;
	-webkit-box-shadow: 0px 1px 0px 0px #f0f7fa;
	box-shadow: 0px 1px 0px 0px #f0f7fa;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #33bdef), color-stop(1, #019ad2));
	background:-moz-linear-gradient(top, #33bdef 5%, #019ad2 100%);
	background:-webkit-linear-gradient(top, #33bdef 5%, #019ad2 100%);
	background:-o-linear-gradient(top, #33bdef 5%, #019ad2 100%);
	background:-ms-linear-gradient(top, #33bdef 5%, #019ad2 100%);
	background:linear-gradient(to bottom, #33bdef 5%, #019ad2 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#33bdef', endColorstr='#019ad2',GradientType=0);
	background-color:#33bdef;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #057fd0;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px -1px 0px #5b6178;
	margin: auto;
    display: block;
	text-align:center;
}
.pm_pm_create_new:hover{
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #019ad2), color-stop(1, #33bdef));
	background:-moz-linear-gradient(top, #019ad2 5%, #33bdef 100%);
	background:-webkit-linear-gradient(top, #019ad2 5%, #33bdef 100%);
	background:-o-linear-gradient(top, #019ad2 5%, #33bdef 100%);
	background:-ms-linear-gradient(top, #019ad2 5%, #33bdef 100%);
	background:linear-gradient(to bottom, #019ad2 5%, #33bdef 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#019ad2', endColorstr='#33bdef',GradientType=0);
	background-color:#019ad2;
}
.pm_pm_create_new:active{
	position:relative;
	top:1px;
}

.pm_pm_loader{
    width: 600px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #d4d4d4));
	background:-moz-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-o-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:linear-gradient(to bottom, #ededed 5%, #d4d4d4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#d4d4d4',GradientType=0);
	color: #000;
	text-align: left;
	padding: 30px;
}

.pm_pop_up{
    width: 600px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #d4d4d4));
	background:-moz-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-o-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:linear-gradient(to bottom, #ededed 5%, #d4d4d4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#d4d4d4',GradientType=0);
	color: #000;
	text-align: left;
	padding: 30px;
}
.pm_property_info{
    float: left;
    display: table-cell;
    vertical-align: middle;
}
.pm_property_info div{
    display: inline-block;
    vertical-align: middle;
}
.pm_divider{    
	/* border-left: 1px solid #fff; */
    display: block;
    margin: 10px;
    width: 1px;
    height: 45px;
}
#pm_container{
	width: 100%;
	height: 100%;
	overflow: hidden;
}
#pm_header{
    background-color: #000;
    min-height: 67px;
    display: flex;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
}
#pm_left_panel{
	background-color:#676767;
	/*width:200px;*/
	height: 100%;
	/*min-width: 400px;*/
	vertical-align: top;
	position: relative;
	display: none;
}
#pm_right_panel{
	background-color:#676767;
	width: 1px;
	height: 100%;
	/*max-width: 300px;*/
	vertical-align: top;
	position: relative;
	/*display: none;*/
	overflow: visible !important;
}
#pm_canvas{
	background-color:#515151;
	max-width: 0px;
	position: relative;
}
#pm_footer{
    background-color: #000;
    height: 50px;
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
	font-size: 1vh;
}
#fp_holder{
	margin: auto;
	box-shadow: 0px 0px 20px #000;
	position: relative;
}
#pm_map_container{
	display:flex;
	min-width: 100px;
	min-height: 100px;
	height:100%;
	text-align: center;
	overflow: auto;
	touch-action: none;
}
#pm_label_override_btn div{
	background: url("../images/pm_pin_icon.png");
	background-repeat: no-repeat;
    background-position: center center;
	display: block;
	width: 100%;
	height: 100%;

}

.pm_color_filter_chip{
    width: 25px;
    float: left;
    text-align: center;
    height: 25px;
	display: flex;
    border-radius: 5px;
    margin-right: 4px;
    border: 1px solid #454545;
    margin-top: 2px;
}

.pm_color_filter_holder{
	float: right;
}


#pm_label_placement_override_btn div{
	background: url("../images/pm_label_icon.png");
	background-repeat: no-repeat;
    background-position: center center;
	display: block;
	width: 100%;
	height: 100%;

}
.pm_circle_btn{
	display: flex;
	background: url("../images/pm_circle_btn.png");
	background-repeat: no-repeat;
    background-position: 0 0;
    width: 65px;
    height: 65px;
    right: 20px;
    bottom: 20px;
	z-index: 2000;
	cursor: pointer;
}
#pm_label_override_btn:hover{
    background-position: 0px -65px ;
}
#pm_label_override_btn.pm_button_active{
    background-position: 0px -65px ;
}

#pm_label_placement_override_btn:hover{
    background-position: 0px -65px ;
}
#pm_label_placement_override_btn.pm_button_active{
    background-position: 0px -65px ;
}
#pm_zoom{
    /*display: block;
    position: absolute;*/
	display: flex;
	background: url("../images/zoom-bar.png");
	background-repeat: no-repeat;
    background-position: center center;
    width: 199px;
    height: 65px;
    right: 20px;
    bottom: 20px;
	z-index: 2000;
	flex-direction: row-reverse;
}
#text_size_adjust{
    /*display: block;
    position: absolute;*/
	display: flex;
	background: url("../images/zoom-bar.png");
	background-repeat: no-repeat;
    background-position: center center;
    width: 199px;
    height: 65px;
    right: 20px;
    bottom: 20px;
	z-index: 2000;
	flex-direction: row-reverse;
}
.scroll-container {
  overflow: auto;          /* still scrollable */
  -ms-overflow-style: none; /* IE 10+ */
  scrollbar-width: none;    /* Firefox */
}

.scroll-container::-webkit-scrollbar {
  display: none;            /* Chrome, Safari, Edge */
}
#top_button_holder{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
#pm_zoom_in{
    display: block;
    height: 41px;
    width: 49px;
	float: right;
	cursor: pointer;
	margin-top: 12px;
    margin-right: 12px;
}
#increase_text_size{
    display: block;
    height: 41px;
    width: 49px;
	float: right;
	cursor: pointer;
	margin-top: 12px;
    margin-right: 12px;
}
#pm_zoom_display{
    float: right;
    display: block;
    height: 65px;
    line-height: 65px;
    width: 77px;
	text-align:center;
	cursor: pointer;
	color: #000;
    font-weight: bold;
    font-size: 16px;
}
#text_size_display{
    float: right;
    display: block;
    height: 65px;
    line-height: 65px;
    width: 77px;
	text-align:center;
	cursor: pointer;
	color: #000;
    font-weight: bold;
    font-size: 14px;
}
#pm_map_container_shadow{
	box-shadow: inset 0px 0px 20px #000;
    width: 100%;
    height: 100%;
    position: absolute;
	pointer-events: none;
	z-index: 2000;
}
#pm_zoom_out{
    display: block;
    height: 41px;
    width: 49px;
	float: left;
	cursor: pointer;
	margin-top: 12px;
    margin-left: 12px;
}
#decrease_text_size{
    display: block;
    height: 41px;
    width: 49px;
	float: left;
	cursor: pointer;
	margin-top: 12px;
    margin-left: 12px;
}
#pm_marker_holder{
	/*background-color: rgba(0, 0, 255, 0.5);*/
	display: block;
    width: 100%;
    height: 100%;
    position: absolute;
}
.grab{ 
    cursor: move;
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}
.grabbing{ 
    cursor: grabbing ;
    cursor: -moz-grabbing ;
    cursor: -webkit-grabbing ;
}
#pm_brand_holder{
    height: 50px;
    text-align: center;
    line-height: 50px;
    position: absolute;
	width: 100%;
}
#pm_list_holder{
    position: absolute;
	top: 50px;
	bottom:150px;
	overflow: auto;
	width: 100%;
}
#pm_product_preview_holder{
	height: 150px;
	width: 100%;
	background-color: red;
    position: absolute;
	bottom: 0px;
}
#pm_product_preview_tip{
	background-color: #2e466e;
	height: 150px;
    width: 400px;
    position: absolute;
    bottom: 30px;
    z-index: 2001;
    right: 30px;
	box-shadow: #000 -5px 0px 15px;
	display: none;
}
.preview_location_top {
    bottom: auto;
    top: 30px;
}
.preview_location_left {
    right: auto;
    left: 30px;
}
#pm_brand_select{
    width: 100%;
    height: 100%;
    font-size: 18px;
    font-weight: bold;
}
.pm_model_number_label{
	float:left;
	pointer-events: none;
}
.pm_marker_tooltip_header{
    display: table-row;
	height: 20px;
    line-height: 20px;
    padding-left: 10px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #d4d4d4));
	background:-moz-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-o-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:linear-gradient(to bottom, #ededed 5%, #d4d4d4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#d4d4d4',GradientType=0);
}
.pm_marker_tooltip_footer{
    display: table-row;
	height: 10px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #d4d4d4));
	background:-moz-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-o-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:linear-gradient(to bottom, #ededed 5%, #d4d4d4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#d4d4d4',GradientType=0);
}
.pm_marker_tooltip_content{
    display: table-row;
	height: auto;
	box-sizing: border-box;
}
.pm_marker_tooltip_content textarea{
	box-sizing: border-box;
	/*padding: 5px;*/
	height: 100%;
	width: 100%;
	border: none;
	border-top: 1px solid #d6bcd6;
	border-bottom: 1px solid #d6bcd6;
	-webkit-user-select: text;  
	-moz-user-select: text;    
	-ms-user-select: text;      
	user-select: text;
	box-sizing: border-box;
}
.pm_marker_tooltip_holder{    
	display: table;
    border-collapse: collapse;
    width: 100%;
    height: 100%;
}
.pm_mini_close{
	background: url("../images/tiny-close.png");
    height: 16px;
    width: 16px;
    position: absolute;
	cursor: pointer;
}
.pm_mini_close:hover{
	background-position: 0px 16px;
}
.pm_marker_tooltip{
    position: absolute;
    background-color: red;
    display: block;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #d4d4d4));
	background:-moz-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-o-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #d4d4d4 100%);
	background:linear-gradient(to bottom, #ededed 5%, #d4d4d4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#d4d4d4',GradientType=0);
	background-color:#ededed;
	border:1px solid #d6bcd6;
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	box-shadow: 2px 2px 10px rgba(0,0,0,.5);
	color: #000;
	z-index: 1000;
	text-align: left;
	cursor: auto;
}
.pm_product_preview_marker_holder{
    display: block;
    position: absolute;
    bottom: 13px;
    left: 160px;
}

.pm_product_preview_button_holder{
    position: absolute;
    bottom: 10px;
    right: 10px;
}
.pm_button{
	margin-left: 10px;
}

.pm_busy_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #384032;
	-webkit-box-shadow:inset 0px 1px 0px 0px #384032;
	box-shadow:inset 0px 1px 0px 0px #384032;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #5d5d5d ), color-stop(1, #131313));
	background:-moz-linear-gradient(top, #5d5d5d  5%, #131313 100%);
	background:-webkit-linear-gradient(top, #5d5d5d  5%, #131313 100%);
	background:-o-linear-gradient(top, #5d5d5d  5%, #131313 100%);
	background:-ms-linear-gradient(top, #5d5d5d  5%, #131313 100%);
	background:linear-gradient(to bottom, #5d5d5d  5%, #131313 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5d5d5d ', endColorstr='#131313',GradientType=0);
	background-color:#5d5d5d ;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #2a2d24;
	display:inline-block;
	cursor:wait;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #384032;
}

.pm_cancel_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;
	float:left;
}

.pm_submit_copy_btn {
	-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;
	float:right;
}


.pm_copy_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;
	float:left;
}

.pm_print_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #a4e271;
	-webkit-box-shadow:inset 0px 1px 0px 0px #a4e271;
	box-shadow:inset 0px 1px 0px 0px #a4e271;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #89c403), color-stop(1, #77a809));
	background:-moz-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-webkit-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-o-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:-ms-linear-gradient(top, #89c403 5%, #77a809 100%);
	background:linear-gradient(to bottom, #89c403 5%, #77a809 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#89c403', endColorstr='#77a809',GradientType=0);
	background-color:#89c403;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #74b807;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #528009;
	float: right;
	margin-right: 10px;
}
.pm_print_button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #77a809), color-stop(1, #89c403));
	background:-moz-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-webkit-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-o-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:-ms-linear-gradient(top, #77a809 5%, #89c403 100%);
	background:linear-gradient(to bottom, #77a809 5%, #89c403 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77a809', endColorstr='#89c403',GradientType=0);
	background-color:#77a809;
}
.pm_print_button:active {
	position:relative;
	top:1px;
}
.pm_quote_open_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #c47703;
	-webkit-box-shadow:inset 0px 1px 0px 0px #c47703;
	box-shadow:inset 0px 1px 0px 0px #c47703;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e88b00), color-stop(1, #c47703));
	background:-moz-linear-gradient(top, #c47703 5%, #e88b00 100%);
	background:-webkit-linear-gradient(top, #00a5e8 5%, #e88b00 100%);
	background:-o-linear-gradient(top, #c47703 5%, #e88b00 100%);
	background:-ms-linear-gradient(top, #c47703 5%, #e88b00 100%);
	background:linear-gradient(to bottom, #c47703 5%, #e88b00 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c47703', endColorstr='#e88b00',GradientType=0);
	background-color:#c47703;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #c47703;
	/*display:inline-block;*/
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #c47703;
	float: right;
	margin-right: 10px;
}
.pm_quote_open_button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c47703), color-stop(1, #e88b00));
	background:-moz-linear-gradient(top, #e88b00 5%, #c47703 100%);
	background:-webkit-linear-gradient(top, #e88b00 5%, #c47703 100%);
	background:-o-linear-gradient(top, #e88b00 5%, #c47703 100%);
	background:-ms-linear-gradient(top, #e88b00 5%, #c47703 100%);
	background:linear-gradient(to bottom, #e88b00 5%, #c47703 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e88b00', endColorstr='#c47703',GradientType=0);
	background-color:#c47703;
}
.pm_quote_open_button:active {
	position:relative;
	top:1px;
}
.pm_quote_button {
	-moz-box-shadow:inset 0px 1px 0px 0px #00a5e8;
	-webkit-box-shadow:inset 0px 1px 0px 0px #00a5e8;
	box-shadow:inset 0px 1px 0px 0px #00a5e8;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0362c4), color-stop(1, #00a5e8));
	background:-moz-linear-gradient(top, #00a5e8 5%, #0362c4 100%);
	background:-webkit-linear-gradient(top, #00a5e8 5%, #0362c4 100%);
	background:-o-linear-gradient(top, #00a5e8 5%, #0362c4 100%);
	background:-ms-linear-gradient(top, #00a5e8 5%, #0362c4 100%);
	background:linear-gradient(to bottom, #00a5e8 5%, #0362c4 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#00a5e8', endColorstr='#0362c4',GradientType=0);
	background-color:#00a5e8;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #00a5e8;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #00a5e8;
	float: right;
}
.pm_quote_button:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #00a5e8), color-stop(1, #0362c4));
	background:-moz-linear-gradient(top, #0362c4 5%, #00a5e8 100%);
	background:-webkit-linear-gradient(top, #0362c4 5%, #00a5e8 100%);
	background:-o-linear-gradient(top, #0362c4 5%, #00a5e8 100%);
	background:-ms-linear-gradient(top, #0362c4 5%, #00a5e8 100%);
	background:linear-gradient(to bottom, #0362c4 5%, #00a5e8 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#0362c4', endColorstr='#00a5e8',GradientType=0);
	background-color:#00a5e8;
}
.pm_quote_button:active {
	position:relative;
	top:1px;
}

.pm_product_preview_activate {
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #dcdcdc;
	display:inline-block;
	cursor:pointer;
	color:#777777;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	padding:6px 24px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffffff;
}
.pm_product_preview_inactive:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed));
	background:-moz-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-webkit-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-o-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:-ms-linear-gradient(top, #dfdfdf 5%, #ededed 100%);
	background:linear-gradient(to bottom, #dfdfdf 5%, #ededed 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed',GradientType=0);
	background-color:#dfdfdf;
}
.pm_product_preview_inactive{
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf));
	background:-moz-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-webkit-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-o-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:-ms-linear-gradient(top, #ededed 5%, #dfdfdf 100%);
	background:linear-gradient(to bottom, #ededed 5%, #dfdfdf 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf',GradientType=0);
	background-color:#ededed;
}
.pm_product_preview_active:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, #f24537));
	background:-moz-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-webkit-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-o-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:-ms-linear-gradient(top, #c62d1f 5%, #f24537 100%);
	background:linear-gradient(to bottom, #c62d1f 5%, #f24537 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24537',GradientType=0);
	background-color:#c62d1f;
}
.pm_product_preview_active{
	-moz-box-shadow:inset 0px 1px 0px 0px #f5978e;
	-webkit-box-shadow:inset 0px 1px 0px 0px #f5978e;
	box-shadow:inset 0px 1px 0px 0px #f5978e;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24537), color-stop(1, #c62d1f));
	background:-moz-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-webkit-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-o-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:-ms-linear-gradient(top, #f24537 5%, #c62d1f 100%);
	background:linear-gradient(to bottom, #f24537 5%, #c62d1f 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#c62d1f',GradientType=0);
	background-color:#f24537;
	border:1px solid #d02718;
	color:#ffffff;
	text-shadow:0px 1px 0px #810e05;
}
.pm_product_preview_activate:active {
	position:relative;
	top:1px;
}

.pm_categories{
    /*margin: 20px 0px;*/
}
#pm_loading_products{    
    width: 100%;
    height: 100%;
    display: table;
    box-sizing: border-box;
    text-align: center;
    position: relative;
}
#pm_loading_products div{     
    vertical-align: middle;
    /* margin: auto; */
    display: table-cell;
    align-items: center;
    background-repeat: no-repeat;
    background-position-x: 50%;
    background-position-y: 50%;
}
.pm_loading_animation{
	background: url("https://spindleco.net/images/loadingAnimation.gif");
	width: 100px;
    height: 100px;
}
.pm_categories li{
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	box-shadow: 2px 2px 10px rgba(0,0,0,.5);
	position: relative;
}
.pm_marker { 
	z-index: 1000;
	display: block;
	position: absolute;
	color: #000;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	box-shadow: 2px 2px 10px rgba(0,0,0,.5);
	/*text-shadow:0px 1px 0px #fff;*/
	cursor: pointer;
	white-space: nowrap;
	font-size: 10px;
	font-weight: normal;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}
.pm_pin { 
	z-index: 1000;
	display: block;
	position: absolute;
	color: #000;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	box-shadow: 2px 2px 10px rgba(0,0,0,.5);
	text-shadow:0px 1px 0px #fff;
	/* cursor: pointer; */
	white-space: nowrap;
	font-size: 12px;
	user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
}
.pm_line{
	z-index: 999;
	display: block;
	position: absolute;
	white-space: nowrap;
	height: 4px;
	background-color: #000;
	transform-origin: 0% 0%;
}
.pm_marker_preview { 
	z-index: 1000;
	display: block;
	color: #000;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	-moz-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	-webkit-box-shadow:0px 0px 20px rgba(0,0,0,.5);
	box-shadow: 2px 2px 10px rgba(0,0,0,.5);
	text-shadow:0px 1px 0px #fff;
	font-size: 12px;
}
.pm_level_1_indent{
	padding-left: 20px;
}
.pm_level_2_indent{
	padding-left: 40px;
}
.pm_category,.pm_product {
	color:#666666;
	display:inline-block;
	cursor:pointer;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	text-decoration:none;
	width: 100%;
	box-sizing: border-box;
	padding-top:6px;
	padding-bottom:6px;
}
.pm_category{
	-moz-box-shadow:inset 0px 1px 0px 0px #ffffff;
	-webkit-box-shadow:inset 0px 1px 0px 0px #ffffff;
	box-shadow:inset 0px 1px 0px 0px #ffffff;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ffffff), color-stop(1, #cacaca));
	background:-moz-linear-gradient(top, #ffffff 5%, #cacaca 100%);
	background:-webkit-linear-gradient(top, #ffffff 5%, #cacaca 100%);
	background:-o-linear-gradient(top, #ffffff 5%, #cacaca 100%);
	background:-ms-linear-gradient(top, #ffffff 5%, #cacaca 100%);
	background:linear-gradient(to bottom, #ffffff 5%, #cacaca 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cacaca',GradientType=0);
	background-color:#ffffff;
	border:1px solid #dcdcdc;
	text-shadow:0px 1px 0px #ffffff;
}
.pm_category:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #cacaca), color-stop(1, #ffffff));
	background:-moz-linear-gradient(top, #cacaca 5%, #ffffff 100%);
	background:-webkit-linear-gradient(top, #cacaca 5%, #ffffff 100%);
	background:-o-linear-gradient(top, #cacaca 5%, #ffffff 100%);
	background:-ms-linear-gradient(top, #cacaca 5%, #ffffff 100%);
	background:linear-gradient(to bottom, #cacaca 5%, #ffffff 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#cacaca', endColorstr='#ffffff',GradientType=0);
	background-color:#cacaca;
}
.pm_category:active,.pm_product:active {
	position:relative;
	top:1px;
}
.pm_level_2{
	background: linear-gradient(to bottom, #8b8b8b 5%, #cacaca 100%);
    color: #2e2e2e;
}
.pm_product{
	-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	box-shadow:inset 0px 1px 0px 0px #bee2f9;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #63b8ee), color-stop(1, #468ccf));
	background:-moz-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-webkit-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-o-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-ms-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:linear-gradient(to bottom, #63b8ee 5%, #468ccf 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b8ee', endColorstr='#468ccf',GradientType=0);
	background-color:#63b8ee;
	border:1px solid #3866a3;
	color:#14396a;
	text-shadow:0px 1px 0px #7cabde;
	padding-left: 5px;
}
.pm_quote_item {
	color:#666666;
	display:inline-block;
	cursor:pointer;
	font-family:Arial;
	font-size:15px;
	font-weight:bold;
	text-decoration:none;
	width: 100%;
	box-sizing: border-box;
	padding-top:6px;
	padding-bottom:6px;
	overflow: hidden;
	float: left;
}
.pm_quote_item{
	-moz-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	-webkit-box-shadow:inset 0px 1px 0px 0px #bee2f9;
	box-shadow:inset 0px 1px 0px 0px #bee2f9;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #63b8ee), color-stop(1, #468ccf));
	background:-moz-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-webkit-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-o-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:-ms-linear-gradient(top, #63b8ee 5%, #468ccf 100%);
	background:linear-gradient(to bottom, #63b8ee 5%, #468ccf 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#63b8ee', endColorstr='#468ccf',GradientType=0);
	background-color:#63b8ee;
	border:1px solid #3866a3;
	color:#14396a;
	text-shadow:0px 1px 0px #7cabde;
	padding-left: 5px;
}
.pm_quote_item:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #468ccf), color-stop(1, #63b8ee));
	background:-moz-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-webkit-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-o-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-ms-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:linear-gradient(to bottom, #468ccf 5%, #63b8ee 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#468ccf', endColorstr='#63b8ee',GradientType=0);
	background-color:#468ccf;
}
.pm_product:hover {
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #468ccf), color-stop(1, #63b8ee));
	background:-moz-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-webkit-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-o-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:-ms-linear-gradient(top, #468ccf 5%, #63b8ee 100%);
	background:linear-gradient(to bottom, #468ccf 5%, #63b8ee 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#468ccf', endColorstr='#63b8ee',GradientType=0);
	background-color:#468ccf;
}
.pm_product_preview_image{
	margin: 8px;
	float: left;
	width: 135px;
	height: 135px;
	display: block;
    text-align: center;
}
.pm_product_preview_image img{
	max-width: 135px;
	max-height: 135px;
}
.pm_product_preview_line{
	margin-top: 8px;
	margin-left: 8px;
    float: left;
    width: 228px;
}
.pm_product_preview_name{
	font-size: 12px;
}
#pm_product_preview_holder{
	-moz-box-shadow:inset 0px 0px 15px 1px #151527;
	-webkit-box-shadow:inset 0px 0px 15px 1px #151527;
	box-shadow:inset 0px 0px 15px 1px #151527;
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #2e466e), color-stop(1, #415989));
	background:-moz-linear-gradient(top, #2e466e 5%, #415989 100%);
	background:-webkit-linear-gradient(top, #2e466e 5%, #415989 100%);
	background:-o-linear-gradient(top, #2e466e 5%, #415989 100%);
	background:-ms-linear-gradient(top, #2e466e 5%, #415989 100%);
	background:linear-gradient(to bottom, #2e466e 5%, #415989 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#2e466e', endColorstr='#415989',GradientType=0);
	background-color:#2e466e;
	border:1px solid #1f2f47;
	color:#ffffff;
	font-family:Arial;
	font-size:15px;
	text-decoration:none;
	text-shadow:0px 1px 0px #263666;
}

#pm_sign_text_select{
	margin-top: 5px;
    margin-left: 10px;
    padding: 3px;
}
.slide_out_panel{
	/*width: 1px;*/
    height: 100%;
	overflow: auto;
}

.print_loader{
	vertical-align: middle;
	margin-right: 10px;
}
#pm_test{
    width: 100%;
    height: 100%;
}
.pm_right_tab{
	background-color: #676767;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
    position: absolute;
    line-height: 30px;
    text-align: center;
    -moz-border-radius: 6px 6px 0px 0px;
    -webkit-border-radius: 6px 6px 0px 0px;
    border-radius: 6px 6px 0px 0px;
	z-index: 10000;
	cursor: pointer;
	display: none;
}
#pm_quote_items_tab{
    margin-left: -65px;
    height: 30px;
    width: 100px;
    top: 215px;

}
#pm_wayfinding_details_tab{
    margin-left: -95px;
    height: 30px;
    width: 160px;
    top: 80px;
	background-color: #292929;
}

#pm_wayfinding_details_holder{
	background-color: #292929;
}
#pm_quote_list_holder{
	/* background-color: red; */
}
.slide_panel_contents {
    padding: 10px;
}
#wayfinding_holder,
#wayfinding_brand_holder{
	position: absolute;
	width:280px;
}
#wayfinding_holder{
	top:180px;
}
.wayfinding_header{
	margin-bottom: 10px;
	font-weight: bold;
}
.wayfinding_details{
	border: 1px solid #fff;
    padding: 5px;
}
#wayfinding_brand_details{
    height: 100px;
}
.wayfinding_edit_button{
	float: right;
	font-size: smaller;
	cursor: pointer;
}
.wayfinding_editable{
	width: 100%;
    height: 100px;
    padding: 5px;
	font-size:12px;
	box-sizing: border-box;
}
.pm_list_notes{
    display: block;
    color: #fff;
    position: absolute;
    top: 0px;
	right: 5px;
}
.ui-selectable-helper{
}

.lock-toggle {
  position: absolute;
  right:10px;
  font-family: sans-serif;
  font-size: 12px;
  line-height: 1;
}

.lock-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.lock-ui {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 8px;
  border: 1px solid #888;
  border-radius: 4px;
  user-select: none;
  max-height: 30px;
  box-sizing: border-box;
  width: 90px;
}
 
.lock-icon {
  position: relative;
  width: 14px;
  height: 10px;
  box-sizing: border-box;
  border: 2px solid #333;
  border-radius: 2px;
  top: 2px;
  background: #333;
}

.lock-icon::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -8px;
  width: 10px;
  height: 8px;
  box-sizing: border-box;
  border: 2px solid #333;
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  transform-origin: bottom left;
  transform: translateX(-51%) rotate(0deg);
  transition: transform 120ms ease-out;
}

.lock-ui.unlocked .lock-icon::before {
      transform: translateX(-30%) rotate(-57deg);
}

.lock-ui.unlocked {
  background: #19951e;
}
.lock-ui.locked {
  background: #d72323;
}