/* Minification failed. Returning unminified contents.
(119,47): run-time error CSS1030: Expected identifier, found '#canvas_element'
(119,62): run-time error CSS1031: Expected selector, found ')'
(119,62): run-time error CSS1025: Expected comma or open brace, found ')'
(1175,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1176,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1177,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1178,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1179,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1180,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1181,5): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(1192,28): run-time error CSS1039: Token not allowed after unary operator: '-clevr-blue-btn'
(1193,29): run-time error CSS1039: Token not allowed after unary operator: '-clevr-blue-btn'
(1194,17): run-time error CSS1039: Token not allowed after unary operator: '-btn-text-color'
(1198,33): run-time error CSS1030: Expected identifier, found '.'
(1198,34): run-time error CSS1030: Expected identifier, found 'inner-txt'
(1198,43): run-time error CSS1031: Expected selector, found ')'
(1198,43): run-time error CSS1025: Expected comma or open brace, found ')'
(1211,29): run-time error CSS1039: Token not allowed after unary operator: '-notification-sent-btn'
(1212,28): run-time error CSS1039: Token not allowed after unary operator: '-notification-sent-btn'
 */
ul.menu-bar {
    background-color: rgb(0, 118, 187);
    display: flex;
    list-style: none;
    font-family: sans-serif;
    padding: 0px;
    margin: 0px;
}

a.menu-bar {
    text-decoration: none;
    color: white;
    font-size: 14px;
    display: block;
    padding: 0px 12px 0px 12px;
    height: 100%;
}

    a.menu-bar:focus {
        outline: 1px solid white;
        background-color: rgb(0, 86, 136);
    }

li.menu-bar {
    position: relative;
}

    li.menu-bar:hover {
        background-color: rgb(0, 86, 136);
    }

    li.menu-bar:focus {
        background-color: rgb(0, 86, 136);
    }

a.menu-item {
    white-space: nowrap;
    padding-top: 8px;
    padding-bottom: 8px;
    text-decoration: none;
    color: #16181b;
    font-size: 14px;
}

    a.menu-item:hover {
        background-color: rgba(0, 0, 0, 0.05);
    }

    a.menu-item:focus {
        background-color: rgba(0, 0, 0, 0.05);
        outline: 1px solid rgb(0, 118, 187);
    }

div.menu-items {
    display: none;
    flex-direction: column;
    position: absolute;
    border-width: 1px;
    border-style: solid;
    border-color: rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    padding-top: 4px;
    padding-bottom: 4px;
    margin-top: 2px;
    overflow-x: auto;
    max-height: 60vh;
    z-index: 100000;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    background-color: white;
}

    div.menu-items:focus {
        outline: 1px solid rgb(0, 118, 187);
    }

div.menu-show {
    display: flex !important;
}

div.menu-shift {
    right: 0px;
}

span.menu-title {
    margin-left: 4px; 
    margin-right: 18px;
}

.dropdown-divider {
    height: 0;
    margin: 0.5rem 0;
    overflow: hidden;
    border-top: 1px solid rgba(0, 0, 0, 0.2);
}

*
{
  margin: 0;
  padding: 0;
}

html, body
{
  margin: 0;
  padding: 0;
  font-size :12px;
  font-family:sans-serif;
  height:100%;
}

select {
    background-color:#FFF;
}
.htmlAdjust
{
	height:auto !important;	
}

#canvas_element:not(#form-editor-page-wrapper #canvas_element) {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(255, 255, 255);
	z-index: -1;
}

div.root
{
  position:relative;
  top:0px !important;
  left:0px !important;
  width: 100%;
  height: 100%;
  /* padding-bottom:200px; */
}

.header-icon {
    cursor: pointer;
    position: static;
    float: left;
    padding: 4px 4px 0px 0px;
}

div.window
{
  border: 4px solid rgb( 40, 80,160) !important;
  background-color: rgb(240,240,240) !important;
}

div.button
{
  border: 2px solid rgb(  0, 150, 50) !important;
  background-color: rgb(240,240,240) !important;
  margin: -2px;
}

input[type="date"] {
	border-width: 1px;
}

span.subtext
{
  padding-left:0.25em;
  padding-top:0.15em;
  background-color: rgb(240,240,240) ! important;
}

.center-message-tab {
	padding-top:40px;
	display: flex;
	justify-content: center;
	height: 100%; 
}

div.pane
{
  border: 1px solid black;
  background-color: transparent !important;
}

div.label
{
  position: relative;
  padding: 0.2em;
  border: dotted 0px rgb(180,180,180);
  width: auto;
  display: inline-block;
}

div.container
{
  width:5em;
  height:4em;
}

span.container
{
  width:5em;
  height:4em;
  float:left;
}

div.repeater
{
  min-width: 10em;
}

.responsive-height {
    height:auto !important;
    min-height: 80px !important; 
}

div.container_lw
{
  border: solid 1px rgb(150,150,150);
  background-color: rgb(210,255,220);
  width: 800px;
  height: 60px;
}

div.captioned_textarea
{
  border: solid 1px rgb(150,250,150);
  background-color: rgb(220,250,220);
  padding: 0.5em;
  width: 28.5em;
}

div.captioned_textarea_label
{
  border: solid 1px rgb(150,150,150);
  background-color: rgb(220,220,250);
}

div.textboxlabel
{
  border: solid 1px rgb(150,150,150);
  background-color: rgb(220,220,220);
  margin: 1px;
  padding: 2px;
  width: 15em;
}

div.datepickerlabel
{
  border: solid 1px rgb(150,150,150);
  background-color: rgb(210,230,220);
  margin: 1px;
  padding: 2px;
  width: 15em;
}

div.right
{
  margin-top: -0.25em;
  float: right;
}

span.left
{
  float: left;
  position: relative;
}

img.asterisk
{
  margin-bottom: -0.35em;
  margin-left: 0.1em;
}

div.container_class
{
  padding-top: 0.5em;
}

span.container_class
{
  padding-top: 0.5em;
}

#menu_label
{
  position: relative;
  text-align: center;
  max-width: 16em;
  padding: 3px;
  margin: 3px;
  font-weight: bold;
}

div.datatext
{
  width: 5em;
  padding-left: 0.25em;
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  border: dashed 1px rgb(150,150,250);
}

div.plaintext
{
  width: 8em;
  padding-left: 0.25em;
  padding-top: 0.1em;
  padding-bottom: 0.1em;
  border: dashed 1px rgb(150,150,250);
}

span.link:hover
{
  cursor: pointer;
  text-decoration:underline;
}

.hm_link {
cursor: pointer;
color: #0080FF;
border-bottom: 1px dashed #000000;
}

.hm_link:visited{
cursor: pointer;
color: #0080FF;
border-bottom: 1px dashed #000000;
}

.hm_link:active{
cursor: pointer;
color: #0080FF;
border-bottom: 1px dashed #0080FF;
}

.hm_link:hover{
cursor: pointer;
color: #000000;
border-bottom: 1px dashed #0080FF;
}

div.thinline
{
  border: dashed 1px rgb(150,150,150);
  width: 800px;
  height: 60px;
}

.borderless
{
    border:none;
    cursor:pointer;
}
.border
{
    border:solid 1px rgb(150,150,150);
}
.backg
{
    background-color:rgb(125,125,130);
    border:none;
}


.titletext
{
    font-weight:bold;
    color:#fff;
    font-size:10px;
    padding-top:3px;
}
a{color:#222; text-decoration:none;}

.theTitle
{
    text-transform:capitalize;
    font-size:20px;
    font-weight:bold;    
}
.superImpose
{
    position:absolute; 
    border:solid 1px #fc0;
    background-image:url('../images/transparent.gif');
    top:0px; 
    left:0px; 
    width:320px; 
    height:28px; 
    border:none; 
    z-index:0; 
    overflow:hidden;
    text-indent:-999em; 
}

.qsdroplook
{
    border:solid 1px #ccc;
}
table 
{
    border-spacing:0px;
}
.searchbar
{
  margin: 0px 1px;
  background-color: #fff;
  padding:2px 4px 5px 4px;
  font-size:8pt;
  display:inline-block;
  width:150px;
  height:12px;
  border: 1px solid #d0d0d0;
  opacity: 0.9;
  *zoom:1;
  filter: alpha(opacity=90);
 
}


.fail
{
	border: 1px solid #990000 !important;	
}

.success
{
	border: 1px solid #009900 !important;		
}




/* Clear Floats */
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clearfix:before,
.clearfix:after {
	content: "\0020";
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
.clearfix:after {
	clear: both;
}

.clearfix {
	zoom: 1; /*The following zoom:1 rule is specifically for IE6 + IE7.*/
}

* html .clearfix {
	height: 1%;}

.clearfix {
	display: block;}
	
.fix{
	clear: both;
	height: 1px;
	margin: -1px 0 0;
	overflow: hidden;}
	
.transition{
	background-color:#E1E1E1 !important;
	border:solid 1px #5a6f84 !important;
}

.repeatDelete
{
	display: block; /*width:12px; 	height:12px; changed by hm*/
	width: 25px;
	height: 25px;
	position: absolute;
	top: 0;
	right: 2px;
	cursor: pointer; 
	background: url('../images/deleteOn.png') center center;
	background-repeat: no-repeat;
	background: border 1px #000;
	text-indent: -99999px;
	border:none;
}


.logoButton 
{
	height: 20px !important; left: 5px !important; position: absolute !important; width: 100px !important; padding: 0px 5px 3px !important; border: 1px solid rgb(204, 204, 204) !important; background-color: rgb(255, 255, 255)!important; cursor: pointer !important; 	
}

#datatable2 tbody tr td {
	height:38px !important;
	overflow:hidden;
}


.tab {
    width: calc(100% - 5px) !important;
    height: calc(100% - 55px) !important;
    padding: 0px !important;
    margin: 0px !important;
    top: 37px !important;
}

.galleryRow:nth-child(odd)
{
	background:#f0f0f6;
}
.galleryRow:nth-child(even)
{
	background:#fff;
} 

.myGalleryRow:nth-child(odd)
{
	background:#f0f0f6;
}
.myGalleryRow:nth-child(even)
{
	background:#fff;
}

.repeater:nth-child(odd) {
    background: #f0f0f6;
}
.repeater:nth-child(even) {
    background: #fff;
}


.galleryRowTwo:nth-child(odd)
{
	background:#f0f0f6;
}
.galleryRowTwo:nth-child(even)
{
	background:#fff;
}


.galleryRowThree:nth-child(odd)
{
	background:#f0f0f6;
}
.galleryRowThree:nth-child(even)
{
	background:#fff;
}


.errorRow 
{
	font-size:10px;	
}

.errorRow:nth-child(odd)
{
	background:#f0f0f6;
}
.errorRow:nth-child(even)
{
	background:#fff;
}  

#ui-datepicker-div
{
    display: none;
}

#tenantTab .ui-tabs-nav.ui-helper-reset.ui-helper-clearfix.ui-widget-header.ui-corner-all 
{
	background:none !important;
	border:none;	
	border-bottom:solid 1px #000;
}

#tenantTab .ui-state-default, #tenantTab .ui-widget-content.ui-state-default 
{
	border: 1px solid #000;
	background :#FFF;
	font-weight: normal;
	color: #000 !important;
	outline: none;
}

#tenantTab .ui-state-active, #tenantTab .ui-widget-content.ui-state-active
{
	border: 1px solid #000;
	font-weight: normal;
	font-style: italic;
	background :#FFF;
	color: #000 !important;
	outline: none;
}

#tenantTab .ui-state-default a, #tenantTab .ui-state-default a:link, #tenantTab .ui-state-default a:visited 
{
	color: #000 !important;	
}

#tenantTab .ui-corner-all 
{
	-moz-border-radius:0px;
	-webkit-border-radius:0px;	
}

.buttons 
{
 width: 100px; height: 26px; padding: 0px 5px; border: 1px solid rgb(150, 150, 150); cursor: pointer; background-color: rgb(255, 255, 255);	
}

.innerSearchOptions
{
		position:relative;
		padding:5px;
		width:auto;
		height:auto;
		color:#555;
		font-family:sans-serif,arial;
	
}

.innerSearchOptions span
{
	position:relative;
	padding:5px;
	width:auto;
	height:auto;
	color:#555;
	font-size:14px;
	font-weight:bold;
	font-family:sans-serif,arial;
	
}

.buttonFancy {
    background-color: #0076BB; /* clevr Blue */
    border: none;
    color: white;
    padding: 7px 16px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 12px;
    margin: 4px 2px;
    cursor: pointer;
}


#searchSlideToggle
{
	position:absolute; 
	z-index:1; 
	left:20px; 
	top:150px; 
	width:25px;
	height:23px;
	background-image:url('../images/dboptions.png');
	background-repeat:no-repeat;
	filter : alpha(opacity=90);
	-khtml-opacity : 0.9;
	-moz-opacity : 0.9;
	opacity	: 0.9;
	cursor:pointer;
}

#sTitle 
{
	position:absolute;
	top:8px;
	left:8px;
	height:12px;
	font-family:sans-serif, arial;
	font-size:14px;
	font-weight:bold;
	color:#555;	
	
}

#searchOptions_Wrapper 
{
	
	position:relative;
	top:35px;
	overflow-y:auto;
	overflow-x:none;
	border:none;
	left:10px;
	padding-top:5px;
	font-family:sans-serif, arial;
	color:#222;
	font-size:12px;
	width:520px;
}

#form_Wrapper 
{
	
	position:relative;
	top:0px;
	border:none;
	left:5px;
	font-family:sans-serif, arial;
	color:#222;
	font-size:12px;
	width:490px;	

}

#form_WrapperDashboard 
{
	
	position:relative;
	top:0px;
	border:none;
	left:5px;
	font-family:sans-serif, arial;
	color:#222;
	font-size:12px;
	width:490px;	

}

.searchRow 
{
	position:relative;
	top:5px;
	left:15px;
	width:460px;
	padding-top:2px;
} 

.searchInner 
{
display:inline-block;
cursor:pointer;	
	
}

.divFiller
{
display:inline-block;		
}

.mce-statusbar.mce-container.mce-panel.mce-stack-layout-item.mce-last .mce-container-body.mce-flow-layout
{
	height: 15px !important;	
}

.noclose .ui-dialog-titlebar-close
{
    display:none;
}

.ui-dialog {
    z-index: 100000 !important;
}

.sliderControl:not([showDisabled="true"]):disabled {
    color: #000 !important;
}

.sliderControl:not([showDisabled="true"])[type="checkbox"][readonly] {
    pointer-events: none !important;
}

/*Loads images in memory so they instantly show up on messages*/

.imageNotification {
    width:30px !important;
    width:30px !important;
}

#dialog-generic-notice {
    display: none;
}

#dialog-generic-notice-inner {
    display: flex;
}
.margin-right-5 {
    margin-right:5px !important;
}

.margin-left-5 {
	margin-right: 5px !important;
}

:focus {
    outline-color: transparent;
    outline-style: none;
}


#loadPic_01 {
    background: url('../images/notice.png') no-repeat;
    display: none;
}

#loadPic_02 {
    background: url('../images/error.png') no-repeat;
    display: none;
}

#loadPic_03 {
    background: url('../images/success.png') no-repeat;
    display: none;
}

#loadPic_04 {
    background: url('../images/warning.png') no-repeat;
    display: none;
}

.validation-fail {
    border: solid 1px red !important;
}

/* Scoped to TinyMCE instance with class custom-tinymce-editor */
.custom-tinymce-editor .tox .tox-statusbar__resize-handle {
	position: absolute !important; /* Ensure we can position it independently */
	right: 8px !important; /* Ensure it applies correctly */
	bottom: 0 !important;
}

/* Scoped to TinyMCE statusbar */
.custom-tinymce-editor .tox .tox-statusbar {
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	padding-right: 25px !important; /* Ensure enough space for the resize handle */
	position: relative !important;
}


.hm_infoBox {
	background-position: 0 100%;
	background-repeat: repeat-x;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,.2);
	box-shadow: 0 1px 3px rgba(0,0,0,.2);
	/*display: block;
margin: 15px 0; */
	padding: 15px 17px;
}

.hm_infoBox-has-icon {
	padding-left: 36px;
}

.hm_infoBox-red {
	background-color: #fffbfb;
	border: 1px solid #f8c9bb;
	color: #d0583f;
}

.hm_infoBox-green {
	background-color: #fafdf9;
	border: 1px solid #c1cec1;
	color: #6cb656;
}

/*Updated colours because it was actually displaying green and not blue  - JC 26/03/2021 */
.hm_infoBox-blue {
	background-color: #ffffff;
	border: 1px solid #71adf2;
	color: #348aed;
}

.hm_infoBox-grey {
	background-color: #fff;
	border: 1px solid #e5e5e5;
	color: #666;
}

.hm_infoBox-orange {
	background-color: #fffaf6;
	border: 1px solid #e6dad2;
	color: #b76f38;
}

.hm_infoBox-purple {
	background-color: #fbf9fd;
	border: 1px solid #dbe1e6;
	color: #8d79a9;
}

.hm_infoBox-teal {
	background-color: #f6fbfb;
	border: 1px solid #c9d5d8;
	color: #55a0b4;
}

.hm_infoBox-yellow {
	background-color: #fffdf6;
	border: 1px solid #e4e4d5;
	color: #e1b42f;
}
.ac_results {
	padding: 0px;
	border: 1px solid #999;
	background-color: white;
	overflow: hidden;
	z-index: 99999;
}

.ac_results ul {
	width: 100%;
	list-style-position: outside;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ac_results li {
	margin: 0px;
	padding: 2px 5px;
	cursor: default;
	display: block;
	/* 
	if width will be 100% horizontal scrollbar will apear 
	when scroll mode will be used
	*/
	/*width: 100%;*/
	font: menu;
	font-size: 12px;
	/* 
	it is very important, if line-height not setted or setted 
	in relative units scroll will be broken in firefox
	*/
	line-height: 16px;
	overflow: hidden;
	font-family:Arial !imporant;
}

.ac_loading {
	background: white url('../images/indicator.gif') right center no-repeat !important;
}



.ac_odd {
	background-color: #eee;
}

.ac_over {
	background-color: #0A246A;
	color: white;
}
/*JG Apr 17, 2015 jQuery Styling*/
.ui-autocomplete {
	position: absolute;
	top: 0;
	left: 0;
	cursor: default;
	max-height: 110px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
}

  * html .ui-autocomplete {
    height: 110px;
  }


.ui-autocomplete > .ui-menu-item
{
	list-style: none;
	position: relative;
	margin: 0;
	padding: 2px 5px;
	cursor: pointer;
	min-height: 0; /* support: IE7 */
	/* support: IE10, see #8844 */
	list-style-image: none;
	line-height: 16px !important;
	font-size:12px !important;
	font-family:Arial !important;

}

.ui-autocomplete > .ui-menu-item:nth-child(odd)
{
	background:#eee;
	border:none ;
}
.ui-autocomplete > .ui-menu-item:nth-child(even)
{
	background:#fff;
	border:none;
}  


.ui-autocomplete > .ui-menu-item.ui-state-focus
{
	border: 1px solid #999999;
	border-top:none;
	border-bottom:none;
	background-image: none;
	background-color:#0a246a;
	font-weight: normal;
	color: #FFF;
}
.ui-autocomplete-loading {
    background: #FFF url('../images/indicator.gif') no-repeat right center;
    border: 1px solid #3b3b3b;
    padding: 1px 1px;
    padding-right: 20px !important; 
}

#emailSubject, #acEmailField, #commentsSection {
    border: 1px solid #3b3b3b;
    padding: 1px 1px;
    padding-right: 20px !important;
}


.toast-container {
	width: 280px;
	z-index: 9999;
    position: fixed !important;
}


* html .toast-container {
	position: absolute;		
}
 
.toast-item {
	height: auto;
	min-height:50px;
	background: #333;
	color: #eee;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 6px;
	padding-right: 6px;
	font-family: Arial;
	font-size: 12px;
	border: 2px solid #999;
	display: block;
	position: relative;
	margin: 0 0 12px 0;
}

.toast-item p {
    text-align: left;
    margin-left: 50px;
    margin-top:12px;
}

.toast-item a { color:#FFF; text-decoration:underline;}


.toast-item-close {
    background:url(../images/close.png);
    width:30px;
    height:30px;
    position: absolute;
    top:3px;
    right:3px;
}

.toast-item-image {
    width:32px;
    height: 32px;
    margin-left: 10px;
    margin-top: 10px;
    margin-right: 10px;
    float:left;
}

.toast-item-image-notice {
    background:url(../images/notice.png);
}

.toast-item-image-success {
    background:url(../images/success.png);
}

.toast-item-image-warning {
    background:url(../images/warning.png);
}

.toast-item-image-error {
    background:url(../images/error.png);
}


/** 
 * toast types 
 * 
 * pattern: toast-type-[value]
 * where 'value' is the real value of the plugin option 'type'
 * 
 */
.toast-type-notice {
    color: white;    
}

.toast-type-success {
    color: white;    
}

.toast-type-warning {
    color: white;
    border-color: #FCBD57;
}

.toast-type-error {
    color: white;
    border-color: #B32B2B;
}

/** 
 * positions 
 * 
 * pattern: toast-position-[value]
 * where 'value' is the real value of the plugin option 'position'
 * 
 */
.toast-position-top-left {
    position: fixed;
    left: 20px;
    top: 20px;
}

.toast-position-top-center {
    position: fixed;
    top: 20px;
    left: 50%;
    margin-left: -140px;
}

.toast-position-top-right {
    position: fixed;
    top: 20px;
    right: 20px;
}

.toast-position-middle-left {
    position: fixed;
    left: 20px;
    top: 50%;
    margin-top: -40px;
}

.toast-position-middle-center {
    position: fixed;
    left: 50%;
    margin-left: -140px;
    margin-top: -40px;
    top: 50%;
}

.toast-position-middle-right {
    position: fixed;
    right: 20px;
    margin-left: -140px;
    margin-top: -40px;
    top: 50%;
}

:root {
    --clevr-blue-btn: #0076BB;
    --clevr-blue-btn-faded: #5DA8D4;
    --clevr-blue-btn-hover: #165173;
    --notification-sent-btn: #71b05a;
    --notification-sent-btn-faded: #A9C0A1;
    --notification-sent-btn-hover: #5b8a4a;
    --btn-text-color: #fff;
}

/* Custom Type Containers */
.clevr-custom-type-container {
    border: thin solid silver;
}

/* Custom Type Buttons */
.clevr-custom-type-btn {
    cursor: pointer;
    background-color: var(--clevr-blue-btn);
    border: thin solid var(--clevr-blue-btn);
    color: var(--btn-text-color);
    font-weight: bold;
}

.clevr-custom-type-btn:not(:has(.inner-txt)) {
    display: flex;
    justify-content: center;
    align-items: center;
}

.clevr-custom-type-btn > .inner-txt {
    text-align: center;
}

/* Button - Notification */
/* Sent */
.clevr-custom-type-btn.notification-btn-sent {
    border: thin solid var(--notification-sent-btn);
    background-color: var(--notification-sent-btn);
}

/* Button - Tab Navigation */
.clevr-custom-type-btn:not(.nav-tab-btn) {
    border-radius: 2px;
}

.prev-tab-btn,
.next-tab-btn {
    min-width: 150px;
    min-height: 25px;
}

@supports (clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 10% 100%, 0% 50%)) {
    .prev-tab-btn {
        clip-path: polygon(10% 0%, 100% 0%, 100% 100%, 10% 100%, 0% 50%);
    }

    .next-tab-btn {
        clip-path: polygon(0% 0%, 90% 0%, 100% 50%, 90% 100%, 0% 100%);
    }
}

