@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";

.box {
   display: flex;
   align-items:center;
}

.dashboard-page {
    float: left;
}

.qomplypi-page-header {
    padding-right:30px;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}
body {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    background: #cfcfcf0d;
/*    background-image:url("../img/qomply_wordmark_primary.svg");*/
    /* background-image:url("../img/bg-img.svg");*/
/*    background-size: 150px 150px;
    background-position: right 10px top 120px;
    background-repeat: no-repeat;
    background-attachment: fixed;*/
}

.lead {
    font-size: 1rem;
    font-weight: 300;
    }

.body-text {
    font-size: .75rem;
    font-weight: 300;
    color: black;
    }

h1 {
    font-size: 2rem;
    font-weight: 350;
}


h2 {
    font-size: 1.75rem;
    font-weight: 350;
}


h3 {
    font-size: 1.5rem;
    font-weight: 390;
}


h4 {
    font-size: 1rem;
    font-weight: 390;
}


h5 {
    font-size: .85rem;
    font-weight: 390;
}



p {
    font-family: 'Poppins', sans-serif;
    font-size: .65rem;
    font-weight: 400;
    line-height: 1.3em;
    /*color: #999;*/
}

.p_head {
    font-family: 'Poppins', sans-serif;
    font-size: .8rem;
    font-weight: 420;
    line-height: 1.3em;
    /*color: #999;*/
}

.card-section-title {
    font-size: 25px;
    font-weight: 500;
    color: #043f78;
    font-family: 'Ariel', sans-serif;
    display: inline-block;
    margin-bottom:10px;
}

.error  {
    color: #f05f40;
    font-size: 10px;
}

.restrictedaccess  {
    color: red;
}


.dashboard_container{
    width: 100%;
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}



.navbar {
    padding: 15px 10px;
    /*background: #fff;*/
    background: #051b3f;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.navbar_qomply {
    background: #1A0044;
    padding: 15px 10px;
    padding-bottom:0px;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
    font-family:"Open Sans";
    font-size:16px;
}


.nav-item-requestinfo {
	color:white !important;
    background-color: #1cf4f4;
    padding-top: 4px !important;
    padding-bottom: 4px;
    padding-right: 50px !important;
    padding-left: 50px !important;
    border: solid;
    border-width: thin;
	border-radius: 15px;
    border-color: #1cf4f4;
	margin-top:9px!important;
}
.nav-item-requestinfo a {
    color:black;
}




.qomply-toggler-icon {
    display: flex;
   }


.navbar_qomply-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.dropdown-item {
    font-size: .8rem!important;
    font-weight: 100!important;
    line-height:.5!important;
    padding-bottom:0px;
    padding-top:0px;

}
#mainNav .navbar-nav .nav-item .nav-link {
	font-family: 'Open Sans', sans-serif;
	font-size:1rem;
	color:black;
	font-weight:300;
	padding-top:15px;
}


.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

.bg-qomplypi p {
	color: #FFF;
	font-size: .75rem;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}

.bg-qomplypi .lead {
	color: #FFF;
    font-size: .75rem;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}

.content-section-a .lead{
	color: #000;
    font-size: .75rem;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}

.content-section-b .lead{
	color: #000;
    font-size: .75rem;
    font-weight: 300;
    font-family: 'Open Sans', sans-serif;
}

 a {
    color: #f05f40;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

  a:hover,
. a:focus {
    color: #eb3812;
}

.qomply-card-link a {
    color: #f3f5f5;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.qomply-card-link a:hover,
. a:focus {
    color: #fff;
}



.panel-green .panel-heading .popover-title {
      color:#000;
}
.panel-green .panel-heading .popover-content {
      color:#000;
}


.panel-green {
    border-color:#003700;
	margin-bottom: 7px;

    background-color: #fff;
    border: 1px solid #000000;
    border-radius: 4px;
	font-weight:200;
	line-height: .75;
    margin-right: 20px;
}

.panel-green .card-header {
    border-color:#003700;
	color: #fff;
	background-color: #051b3f;

}

.panel-green .card-header .qomply-card-header-soft {
	background-color:firebrick;
}

.panel-green-label {
    color: #000;
}

.panel-green .panel-heading a {
	background-color: #CFE4C5;
}

.panel-green a:hover {
    color: #3d8b3d;
}


.panel-green .panel-heading .popover-title {
      color:#000;
}
.panel-green .panel-heading .popover-content {
      color:#000;
}


.panel-grey {
    border-color:#003700;
	margin-bottom: 7px;

    background-color: #fff;
    border: 1px solid #000000;
    border-radius: 4px;
	font-weight:200;
	line-height: .75;
    margin-right: 20px;
}

.panel-grey .card-header {
    border-color:#003700;
	color: #fff;
	background-color: #536c95;
}

.panel-grey .card-header .qomply-card-header-soft {
	background-color:firebrick;
}

.panel-grey-label {
    color: #000;
}

.panel-grey .panel-heading a {
	background-color: #CFE4C5;
}

.panel-grey a:hover {
    color: #3d8b3d;
}

.panel-dashboard .panel-heading .popover-title {
      color:#000;
}
.panel-dashboard .panel-heading .popover-content {
      color:#000;
}

.panel-dashboard {
    border-color:#003700;
	margin-bottom: 7px;
    background-color: #f1f1f1;
    /*border: 1px solid #000000;*/
    border-radius: 4px;
	font-weight:200;
	line-height: 1;
    margin-right: 5px;
}

.panel-dashboard .card-header {
    border-color:#003700;
	color: #fff;
    background-color: #051b3f;

}


.panel-dashboard-purple {
    border-color:#003700;
	margin-bottom: 7px;
    background-color: #efeff0;
    /*border: 1px solid #000000;*/
    border-radius: 4px;
	font-weight:200;
	line-height: 1;
    margin-right: 5px;
    border: 1px solid;
}

.panel-dashboard-purple .card-header {
    border-color:#003700;
	color: #fff;
    background-color: #1e0037;

}


.highlight-area {
    background:ghostwhite;
    padding-top:20px;
    padding-bottom:20px;
    margin-bottom:20px;

}

.diagnostic {
    border-color:#003700;
	color: #fff;
    background-color: #0618f1 !important;

}

.sftr {
    border-color:#003700;
	color: #fff;
    background-color: #9e9e9e !important;
}

.emir {
    border-color:#003700;
	color: #fff;
    background-color: #214160 !important;
}
.emirrefit {
    border-color: #030641;
	color: #fff;
    background-color: #214160 !important;
}

.mas {
    border-color: #1e0037;
	color: #fff;
    background-color: #214160 !important;
}



.panel-dashboard .card-header .qomply-card-header-soft {
	background-color:firebrick;
}

.panel-dashboard-label {
    color: #000;
}

.panel-dashboard .panel-heading a {
    color: #000;
	background-color: #CFE4C5;
}

.panel-dashboard a {

}

.panel-dashboard a:hover {
    color: #3d8b3d;
}


.panel-lightblue {
	border-color: #000066;
}

.panel-lightblue .panel-heading {
	border-color: #000033;
	color:#FFF;
	background-color:#4B6B7D;
}

.panel-lightblue .panel-heading a{
	color:#FFF;
	background-color:#4B6B7D;
}

.panel-lightblue .panel-heading a:hover{
	color:#000033;
}

.panel-lightblue a {
	color:#000000;
}

.panel-lightblue a:hover {
	color: #000033;
}


#focusview-tabs  {
	border: 10px solid #4B6B7D;
	border-radius: 11px;
	box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
}

#dashboardpageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}


#dataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}

#exportformatspageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 20px 30px 10px 0px;
	color:#000;
	
}

#venuedataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}


#retrievedatapageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}

#missingshortcodepageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}
#summarymissingdata .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
	
}

#controldatarefresh .header-content {
	position: relative;
	width: 100%;
	text-align: left;
	padding: 0px 10px 10px 0px;
	color:#000;
}

.dataentry-page {
	padding-left:20px;
	margin-left:60px;
	margin-right:20px;
	width: 97%;
	
}

.exportformats-page {
	padding-left:20px;
	margin-left:60px;
	margin-right:20px;
	
}

.venuedataentry-page {
	padding-left:20px;
	margin-left:60px;
	margin-right:20px;
	width:80%;
}

.controldatarefresh-page{
	padding-left:20px;
	margin-left:60px;
	margin-right:20px;
	width:80%;
}

.retrievedata-page {
	padding-left:20px;
	width:97%;
}


#qomplypiNavBar .navbar-collapse ul li a {
    padding: 5px;
    font-size: .65rem;
    font-weight: 300;
    color: white;
}

a.dropdown-item.disabled, .dropdown-item.disabled:focus, .dropdown-item.disabled:hover
{
    background-color: #eeeff5  !important;
 }

#qomplypiNavBar .navbar-collapse ul li a.dropdown-item {
    padding: 10px;
    font-size: .65rem;
    font-weight: 300;
    color: #000;
    line-height: 1;
}

.qomply-standard-table thead tr {
    font-size: .7rem;
    font-weight: 380;
    color: #000;

}

.qomply-standard-table thead tr th {
    color: #000;
}

.qomply-standard-table tr th {
    font-size: .7rem;
    font-weight: 380;
}


.qomply-standard-table thead tr a{
    font-size: .65rem;
    font-weight: 420;
}
.qomply-standard-table tbody tr th {
    font-size: .65rem;
    font-weight: 420;
    color: #000;
}

.qomply-tight-table tbody tr td {
    padding:0px
}

.qomply-standard-table tbody tr {
    line-height: 20px;
    padding-bottom:20px
}

.qomply-standard-table tbody tr td {
    font-size: .65rem;
    font-weight: 425;
    color: #000;
	vertical-align:middle;
	padding-top: 5px;
	padding-bottom:5px;
	padding-right: 5px;
	height: 50px;
	line-height:1.3;
}

.qomply-table-ticket {
    font-size: .45rem !important;
    font-weight: 425;
    color: #000;
	vertical-align:middle;
	padding-top: 5px;
	padding-bottom:5px;
	padding-right: 5px;
	height: 30px;
	line-height:1.3;
}
.qomply-table-ticket .th-lg  {
    font-size: .65rem !important;
    font-weight: 475;
    color: #fff !important;
    background: #051b3f;
	vertical-align:middle;
	padding-top: 5px;
	padding-bottom:5px;
	padding-right: 5px;
	height: 30px;
	line-height:1.3;
}

.qomply-table-ticket tbody tr td {
    font-size: .55rem;
    font-weight: 425;
    color: #000;
	vertical-align:middle;
	padding-top: 5px;
	padding-bottom:5px;
	padding-right: 5px;
	height: 30px;
	line-height:1.3;
}




.qomply-filterbar-table thead tr {
    display:table;
    font-size: .7rem;
    font-weight: 300;
    color: #000;
    background-color: rgba(16, 55, 103, 0.36);
}



.qomply-filterbar-table thead tr th {
    color: #000;
}

.qomply-filterbar-table tr th {
    font-size: .7rem;
    font-weight: 380;
}


.qomply-filterbar-table thead tr a{
    font-size: .7rem;
    font-weight: 380;
}
.qomply-filterbar-table tbody tr th {
    font-size: .7rem;
    font-weight: 380;
    color: #000;
}

.qomply-filterbar-table tbody tr {
    line-height: 20px;
    padding-bottom:20px
}

.qomply-filterbar-table tbody tr td {
    font-size: .7rem;
    font-weight: 380;
    color: #000;
	vertical-align:middle;
	padding-top:1px;
	padding-bottom:1px;
	padding-right: 5px;
}

.qomply-filterbar-table thead tr {
    font-size: .7rem;
    font-weight: 380;
}


.arm-table{table-layout: fixed;
            margin:0px auto 0px auto;
            }

.arm-table td th{
                border-collapse:collapse;
                border:1px solid #777;
                overflow: hidden;
                text-overflow: ellipsis;
                }

.arm-table th{
                padding-top: .4rem;
                padding-bottom: 0rem;
                font-size:.9rem;
                color:#444;
                background-color: rgba(16, 55, 103, 0.36);
                overflow: hidden;
                text-overflow: ellipsis;
                }

.arm-table td {
                padding-top: .4rem;
                padding-bottom: 0rem;
                height:35px;
                word-wrap: break-word;
                text-overflow: ellipsis;
}

.arm-table-outer {
    overflow-x: scroll;
    height:700px;
}

.arm-table-outer th {
        padding-top: .4rem;
        padding-bottom: 0rem;
        font-size:.8rem;
        color:#444;
        background-color: rgba(16, 55, 103, 0.36);
        min-width: 100px;
        text-overflow: ellipsis;
        position: sticky;
        top: 0;
    }
.arm-table-outer td {
        min-width: 100px;
        padding-top: .4rem;
        padding-bottom: .4rem;
        height:35px;
        font-size: .65rem;
    }



.arm-table tbody {

    width:auto;
    table-layout:fixed;
    overflow:auto;
    max-height:100px;
    color: #c9c9c9;

}
.arm-table tr {

    display: revert;
    width:auto;
    table-layout:fixed;

}

.arm-table .th-lg {
    font-size: .7rem !important;
    font-weight: 380 !important;
    color: #000 !important;

}

#dtArmTable tbody {
    white-space: nowrap;
    width:auto;
    table-layout:fixed;
    overflow:auto;
    max-height:400px;
    overflow-x: scroll;
    overflow-y: scroll;
    color:whitesmoke;

}
#dtArmTable th {
  position: sticky;
  top: 0;
  z-index: 2;
  color: #fff;
}

#dtArmTable a {
    margin: 0;
    color: #fff;
}


th {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
}


#dtArmTable .table .th-lg {
    font-size: .6rem;
    font-weight: 300;
    color: #fff;
}






.table-fixed-dashboard tbody {
    display:block;
    height:300px !important ;
    overflow:auto;
}


.table-fixed tbody {
    height:500px;
    overflow:auto;
}

.table-fixed-umi tbody {
    display:block;
    height:750px;
    overflow:auto;
}


.table-fixed thead, tbody, tr{
    width:100%;
    table-layout:fixed;
}

.table-fixed tbody {
    display:table;
    width:100%;
    table-layout:fixed;
}

.table-fixed tr {
    display:table;
    width:100%;
    table-layout:fixed;
}

.table-fixed thead {

    width: calc( 100% - 1em );
	border-color:#003700;
	color: #fff;
    background-color:rgb(198,209,224);
}

.table .th-lg {
    font-size: .65rem;
    font-weight: 420;
    color: #000;
}


.table .orderable:before {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      content: "\f0de";
      color: #000;
      font-size: 14px;
      margin-top: -10px;
      font-weight: 900;
}
.table .orderable:after {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      content: "\f0dd";
      color: #000;
      font-size: 14px;
      margin-top: -15px;
      right:0;
      font-weight: 900;
}

.table .asc.orderable:after {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      content: "\f0dd";
      color: #000;
      font-size: 14px;
      font-weight: 900;
}
.table .asc.orderable:before {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      content: "\f0dd";
      color: #000;
      font-size: 18px;
      font-weight: 900;
}

.table .desc.orderable:after {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      font-size: 14px;
      content: "\f0de";
      color: #000;
      font-weight: 900;
}
.table .desc.orderable:before {
      position: relative;
      font-family: 'Font Awesome\ 5 Free';
      top: 0;
      content: "\f0de";
      color: #000;
      font-size: 14px;
      font-weight: 900;
}



.form-in-table .input-group .form-control {

	font-size: .7rem;
    font-weight: 380;
    margin: 0;
    padding-top: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    padding-right: 0px;
    vertical-align: bottom;
}

.form-in-table {
  width: 100%;
}


.form-in-table a {
    color: #fff;
    -webkit-transition: all .35s;
    -moz-transition: all .35s;
    transition: all .35s;
}

.form-in-table  a:hover,
.form-in-table a:focus {
    color: #eb3812;
}


.form-in-table .checkbox {
  font-weight: 380;
}
.form-in-table .form-control {
  position: relative;
  box-sizing: border-box;
  height: 30px!important;
  font-size: 9px;
}


.form-in-table .form-check{

  font-size: .7rem;
}

.form-in-table input[type="date"] {
  margin-bottom: 0px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  font-size: .7rem;
}

.form-in-table .form-control:focus {
  z-index: 2;
}
.form-in-table input[type="email"] {
  margin-bottom: -1px;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.form-in-table input[type="password"] {
  margin-bottom: 0px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.form-in-table button[type="button"] {
  width:AUTO;
}

.form-in-table .input-group-addon, .input-group-btn {
	width:20%;
}

.form-in-table .color-darkblue {
	color:#3f34ae;
}

.form-in-table  {
	font-weight: 300;
	font-size:.7rem;
}

.form-in-table-label {
	font-size:.7rem;
}


.dashboard-table-fixed tbody {
    display:block;
    height:400px;
    overflow:auto;
}
.dashboard-table-fixed thead tbody tr{
    display:table;
    width:100%;
    table-layout:fixed;
}

.dashboard-table-fixed thead {
    width: calc( 100% - 1em );
	border-color:#003700;
	color: #fff;
    background-color: rgb(198,209,224);
}


.page-table-fixed tbody {
    display:block;
    height:800px;
    overflow:auto;
}
.page-table-fixed thead tbody tr{
    display:table;
    width:100%;
    table-layout:fixed;
}

.page-table-fixed tbody {
    display:table;
    width:100%;
    table-layout:fixed;
}

.page-table-fixed tr{
    display:table;
    width:100%;
    table-layout:fixed;
}

.page-table-fixed thead {
    width: calc( 100% - 1em );
	border-color:#003700;
	color: #fff;
    background-color: rgb(198,209,224);
}



.qomply-view  {

}
.headlinecolorscheme {
	background: #7199b2

}





@media (min-width: 1200px) {
	
#dashboardpageheader .header-content {
	
	position: relative;
	width: 100%;

	text-align: left;


	}
}

#dataentrypageheader .header-content {
	
	position: relative;
	width: 100%;

	text-align: left;
	margin-left:50px;
}

#venuedataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	margin-left:50px;
}


#retrievedatapageheader .header-content {
	position: relative;
	width: 100%;
	padding: 0px 10px 20px 50px;
	text-align: left;

	}


@media only screen and (min-width: 992px) and (max-width: 1199px) {
	#dashboardpageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	max-width: max-content;

	}
	
	#dataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	max-width: max-content;

	}

}
@media only screen and (min-width: 768px) and (max-width: 991px) {
	#dashboardpageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	max-width: max-content;

	}
	
	#dataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	max-width: max-content;
	} 
	
	#venuedataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	padding: 0px 0px 20px 20px;
	text-align: left;
	max-width: max-content;

	}
	

}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {

#dashboardpageheader .header-content {
	
	position: relative;
	width: 100%;
	text-align: left;
	max-width: max-content;
	}
	
#dataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	padding: 0px 0px 20px 0px;
	text-align: left;
	max-width: max-content;
	}
	
#venuedataentrypageheader .header-content {
	
	position: relative;
	width: 100%;
	padding: 0px 0px 20px 0px;
	text-align: left;
	max-width: max-content;
	}
	
}



@media only screen and (min-width: 767px) and (max-width: 992px){
    .navbar-brand img{
		height:100%
}
    .navbar-header{
		position: absolute;
}


}


@media (min-width: 1200px) {

}
@media only screen and (min-width: 992px) and (max-width: 1199px) {

}
@media only screen and (min-width: 768px) and (max-width: 991px) {

}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {

}


@media (min-width: 1200px) {
#dashboardpage  .container {
    
	padding-right: 15px;
    padding-left: 15px;
	max-width: max-content;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
	#dashboardpage  .container {
   width: 95%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  #dashboardpage  .container {
    padding-right: 0px;
    padding-left: 0px;
    width: 95%;
	margin-right: 5px;
    margin-left: 15px;
  }
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
	 #dashboardpage .container {
	  padding-right: 0px;
	  padding-left: 0px;
	  margin-right: 0px;
	  margin-left: 0px;
	  width: 100%;
	}
	
	#dashboardpage small, .small {
    	font-size: 75%;
	}
	
	#dashboardpage .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
		position: relative;
		min-height: 1px;
		padding-right: 5px;
		padding-left: 5px;
	}
}



.bg-white {
		color: #000;
		background-color: #FFF;
		opacity: 0.8;
		border-style:solid;
		border-color: #003F51;
		border-width: 7px;
		z-index: 2;
		width:80%
}



@media(max-width: 360px){

	.bg-white {
		width: 100%;
	}
    .search-box {
		padding-top: 25px;
		padding-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
		font-size: 85%;
	}
}

@media(max-width: 770px){

	.bg-white {
		width: 90%;
	}
    .search-box {
		padding-top: 25px;
		padding-bottom: 20px;
		padding-left: 10px;
		padding-right: 10px;
		font-size: 85%;
	}
	
}

@media screen and (min-width: 771px) and (max-width: 899px){
	
	.bg-white {
		width: 85%;
	}
	.search-box {
		padding: 25px 0px 20px 0px;
		margin-top:50px;
		
	}
}
@media (min-width: 900px) {
	.bg-white {
		width: 85%;
	}
   .search-box {
		padding: 25px 0px 20px 0px;
		margin-top:50px;
	}
}
@media (min-width: 1100px) {
	.bg-white {
		width: 60%;
	}
   .search-box {
		padding: 25px 0px 20px 0px;
	}
}







.tabletext {
	font-size: .7rem;
	line-height: 150%;
}

.checkbox label tabletext{
	font-size: .7rem;
	line-height: 150%;
}

.searchyield-checkbox {
	font-size: .7rem;
	padding: 0px;
	
}
.searchyield-checkbox-label {
	min-height: 0px;
	padding-left: 0px;
}

.panel-small-text p{
	font-size: 85%;
	margin-bottom: 8px;
	line-height: 1.25;
}
.panel-small-text .tabletext{
	font-size: 85%;
}

.bs-property {
	border-color:#333;
}

.highlighted{
	border: 2px solid;
	border-radius: 5px;
	box-shadow: 0px 8px 8px;
	margin-bottom: 10px
}
.bs-property hover{
	color:#000000;
	background-color: #F9F9F9;
}

.bs-property a{
	color:#006;
}

.bs-property a:hover{
	color:#009;;
}

.bs-property-focus {
	color: #000000;
	border-color:#333;
	background-color: #FFF;
}

.bs-property-focus:hover{
	color:#000000;
	background-color: #F8F8F8;
}
.bs-property-focus a{
	color: #FF3F00;
}

.bs-property-focus a:hover{
	color:#009;
	
}
.infobtn {
	padding: 0px 0px 0px 0px;
}


.mainpage{
    min-height: 65%;
}

#dataentrypage{
    min-height: 65%;
}

#venuedataentrypage{
    min-height: 65%;
}

.panelStaticLeft {
}


.bg-qomplypi {
	background-color:#4B6B7D;
	color:#FFF;
}
.bg-qomplypi-light {
	background-color:RGBA(75, 107, 125, 0.5);
	color:#FFF;
}

.bg-qomplypi-green {
	background-color: #5b873c;
}


.bg-dark {
    color: #fff;
    background-color: #222;
}

.bg-light {
	color: #fff;
	background-color: #FFF;
}

.bg-grey {
	color: #000;
	background-color:#A9B0B4;
}


.text-white {
    color: #FFF;
}
.text-black {
    color: #000;
}

.text-small {
    font-size:12px;
}

.text-verysmall {
    font-size:10px;
}



.container.socialshare-pad{
    padding-right: 10px;

}

.container.socialfollow-pad{
    padding-right: 10px;
	padding-top: 5px;

}

.c-validation .alert{

}


.alert {
    line-height:1;

 }

.c-validation{
    font-family: 'Open Sans', sans-serif;
    font-size:10px;
    line-height:1;
    background-color: #f8d7da;
}


/*Footers*/

.footer {
    border-top: 1px solid #ddd;
    /* color: #555; */
    font-size: 12px;
    padding-top: 15px;
}
.container.footer-pad{
    /*    padding-left: 10px;*/
    padding-right: 10px;

}
.footerMenuDiv{
    /*    padding-left: 22px;	*/
}

@media screen and (min-width: 771px) and (max-width: 899px){
    .socialbuttons{
        float: none !important;
        text-align: center !important;
    }
    .footerMenuDiv{
        text-align: center;
    }
}
@media(max-width: 770px){

    .linkedinBtn a{
        font-size: 12px !important;
    }
    .socialbuttons{
        float: none !important;
        text-align: center !important;
    }
    .footerMenuDiv{
        text-align: center;
    }
	
}
@media (max-width: 900px){
    .footerMenu a{
        font-size: 12px !important;
    }
}
@media (max-width: 980px) {
    .footerMenu a{
        font-size: 13px !important;
    }
}


/*Side bar menu - market trends*/

#sidebar {
  height: 100%;
  padding-right: 0;
  padding-top: 20px;
  margin-right: 20px;
}
#sidebar .nav {
  width: 95%;
}
#sidebar li {
  border:0 #f2f2f2 solid;
  border-bottom-width:1px;
}

.navbar-header-sidebar {
	/* this is probably redundant */
	/*position: fixed;*/
	z-index: 3;
	background-color: #f8f8f8;
	float:left;
}

/* collapsed sidebar styles */
@media (min-width:768px) {
	/* Hamburger */
  .navbar-header-sidebar .navbar-toggle {
    border: 0;
    float: left;
    padding: 18px;
    margin: 0;
    border-radius: 0;
    background-color:  rgba(51, 122, 183, 0.07);
  }
}
@media screen and (min-width: 768px) {
	
}

/* collapsed sidebar styles */
@media screen and (max-width: 900px) {
	
	/* Hamburger */
  .navbar-header-sidebar .navbar-toggle {
    border: 0;
    float: left;
    padding: 18px;
    margin: 0;
    border-radius: 0;
    background-color:  rgba(51, 122, 183, 0.07);
	display:inline;
  }
  
  .row-offcanvas {
    position: relative;
    -webkit-transition: all 0.25s ease-out;
    -moz-transition: all 0.25s ease-out;
    transition: all 0.25s ease-out;
  }
  .row-offcanvas-right
  .sidebar-offcanvas {
    right: -41.6%;
  }

  .row-offcanvas-left
  .sidebar-offcanvas {
    left: -41.6%;
  }
  .row-offcanvas-right.active {
    right: 41.6%;
  }
  .row-offcanvas-left.active {
    left: 41.6%;
  }
  .sidebar-offcanvas {
    position: absolute;
    top: 0;
    width: 41.6%;
  }
  #sidebar {
    padding-top:0;
  }
}




/* side menu CSS  */

:focus {
  outline: none;
}
.row {
  margin-right: 0;
  margin-left: 0;
}
/* 
    Sometimes the sub menus get too large for the page and prevent the menu from scrolling, limiting functionality
    A quick fix is to change .side-menu to 

    -> position:absolute
    
    and uncomment the code below.
    You also need to uncomment 
    
    -> <div class="absolute-wrapper"> </div> in the html file

    you also need to tweek the animation. Just uncomment the code in that section
    --------------------------------------------------------------------------------------------------------------------
    If you want to make it really neat i suggest you look into an alternative like http://areaaperta.com/nicescroll/
    This will allow the menu to say fixed on body scoll and scoll on the side bar if it get to large
*/
.absolute-wrapper{
    position: fixed;
    width: 300px;
    height: 100%;
    background-color: #f8f8f8;
    border-right: 1px solid rgba(95, 101, 137, 0.7);
}

.side-menu, .side-menu-fixed {
 /* position: fixed;*/
  position: absolute;
  width: 300px;
  background-color: rgba(51, 122, 183, 0.07);
  border-right: 1px solid rgba(95, 101, 137, 0.11);
    /*height: 100%;*/
}

.side-menu-fixed {
	position: fixed;
}

.side-menu .navbar {
  border: none;
}

.side-menu .navbar-header {
  width: 100%;
  border-bottom: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu .navbar-nav .active a {
  background-color: transparent;
  margin-right: -1px;
  border-right: 5px solid rgba(95, 101, 137, 0.7);
}
.side-menu .navbar-nav li {
  display: block;
  width: 100%;
  border-bottom: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu .navbar-nav li a {
  padding: 15px;
  color: #153242;
}

.side-menu .navbar-nav li a .glyphicon {
  padding-right: 10px;
}
.side-menu #dropdown {
  border: 0;
  margin-bottom: 0;
  border-radius: 0;
  background-color: transparent;
  box-shadow: none;
}
.side-menu #dropdown .caret {
  float: right;
  margin: 9px 5px 0;
}
.side-menu #dropdown .indicator {
  float: right;
}
.side-menu #dropdown > a {
  border-bottom: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu #dropdown .panel-body {
  padding: 0;
  background-color: #f3f3f3;
}
.side-menu #dropdown .panel-body .navbar-nav {
  width: 100%;
}
.side-menu #dropdown .panel-body .navbar-nav li {
  padding-left: 15px;
  border-bottom: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu #dropdown .panel-body .navbar-nav li:last-child {
  border-bottom: none;
}
.side-menu #dropdown .panel-body .panel > a {
  margin-left: -20px;
  padding-left: 35px;
}
.side-menu #dropdown .panel-body .panel-body {
  margin-left: -15px;
}
.side-menu #dropdown .panel-body .panel-body li {
  padding-left: 30px;
}
.side-menu #dropdown .panel-body .panel-body li:last-child {
  border-bottom: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu #search-trigger {
  background-color: #f3f3f3;
  border: 0;
  border-radius: 0;
  position: absolute;
  top: 0;
  right: 0;
  padding: 15px 18px;
}
.side-menu .brand-name-wrapper {
  min-height: 50px;
}
.side-menu .brand-name-wrapper .navbar-brand {
  display: block;
}

.side-menu .brand-name-wrapper a {
  color: #153242;
}
.side-menu #search {
  position: relative;
  z-index: 1000;
}
.side-menu #search .panel-body {
  padding: 0;
}
.side-menu #search .panel-body .navbar-form {
  padding: 0;
  padding-right: 50px;
  width: 100%;
  margin: 0;
  position: relative;
  border-top: 1px solid rgba(95, 101, 137, 0.7);
}
.side-menu #search .panel-body .navbar-form .form-group {
  width: 100%;
  position: relative;
}
.side-menu #search .panel-body .navbar-form input {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  width: 100%;
  height: 50px;
}
.side-menu #search .panel-body .navbar-form .btn {
  position: absolute;
  right: 0;
  top: 0;
  border: 0;
  border-radius: 0;
  background-color: #f3f3f3;
  padding: 15px 18px;
}
/* Main body section */
.side-body {
  margin-left: 310px;
}
/* small screen */
@media (max-width: 768px) {
  .side-menu {
    /*position: relative;*/
	position: absolute;
    /*width: 100%;*/
    height: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(95, 101, 137, 0.7);
  }
  .side-menu .brand-name-wrapper .navbar-brand {
    display: inline-block;
  }
  

  /* Slide in animation */
  @-moz-keyframes slidein {
    0% {

      left: -300px;
    }
    100% {
      left: 10px;
    }
  }
  @-webkit-keyframes slidein {
    0% {
      left: -300px;
    }
    100% {
      left: 10px;
    }
  }
  @keyframes slidein {
    0% {
      left: -300px;
    }
    100% {
      left: 10px;
    }
  }
  @-moz-keyframes slideout {
    0% {
      left: 0;
    }
    100% {
      left: -300px;
    }
  }
  @-webkit-keyframes slideout {
    0% {
      left: 0;
    }
    100% {
      left: -300px;
    }
  }
  @keyframes slideout {
    0% {
      left: 0;
    }
    100% {
      left: -300px;
    }
  }
  /* Slide side menu*/
  /* Add .absolute-wrapper.slide-in for scrollable menu -> see top comment */
  .side-menu-container > .navbar-nav.slide-in {
    -moz-animation: slidein 300ms forwards;
    -o-animation: slidein 300ms forwards;
    -webkit-animation: slidein 300ms forwards;
    animation: slidein 300ms forwards;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
  .side-menu-container > .navbar-nav {
    /* Add position:absolute for scrollable menu -> see top comment */
    position: absolute;
    left: -300px;
    width: 300px;
    top: 43px;
    height: 100%;
    /*border-right: 1px solid rgba(95, 101, 137, 0.7);*/
    background-color: rgba(51, 122, 183, 0.07);
    -moz-animation: slideout 300ms forwards;
    -o-animation: slideout 300ms forwards;
    -webkit-animation: slideout 300ms forwards;
    animation: slideout 300ms forwards;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
  /* Uncomment for scrollable menu -> see top comment */
  .absolute-wrapper{
        width:285px;
        -moz-animation: slideout 300ms forwards;
        -o-animation: slideout 300ms forwards;
        -webkit-animation: slideout 300ms forwards;
        animation: slideout 300ms forwards;
        -webkit-transform-style: preserve-3d;
        transform-style: preserve-3d;
    }
  @-moz-keyframes bodyslidein {
    0% {
      left: 0;
    }
    100% {
      left: 300px;
    }
  }
  @-webkit-keyframes bodyslidein {
    0% {
      left: 0;
    }
    100% {
      left: 300px;
    }
  }
  @keyframes bodyslidein {
    0% {
      left: 0;
    }
    100% {
      left: 300px;
    }
  }
  @-moz-keyframes bodyslideout {
    0% {
      left: 300px;
    }
    100% {
      left: 0;
    }
  }
  @-webkit-keyframes bodyslideout {
    0% {
      left: 300px;
    }
    100% {
      left: 0;
    }
  }
  @keyframes bodyslideout {
    0% {
      left: 300px;
    }
    100% {
      left: 0;
    }
  }
  /* Slide side body*/
  .side-body {
    margin-left: 5px;
    margin-top: 70px;
    position: relative;
    -moz-animation: bodyslideout 300ms forwards;
    -o-animation: bodyslideout 300ms forwards;
    -webkit-animation: bodyslideout 300ms forwards;
    animation: bodyslideout 300ms forwards;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
  .body-slide-in {
    -moz-animation: bodyslidein 300ms forwards;
    -o-animation: bodyslidein 300ms forwards;
    -webkit-animation: bodyslidein 300ms forwards;
    animation: bodyslidein 300ms forwards;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
  }
  /* Hamburger */
  .navbar-toggle {
    border: 0;
    float: left;
    padding: 18px;
    margin: 0;
    border-radius: 0;
    background-color:  rgba(51, 122, 183, 0.07);
  }
  /* Search */
  #search .panel-body .navbar-form {
    border-bottom: 0;
  }
  #search .panel-body .navbar-form .form-group {
    margin: 0;
  }
  .navbar-header {
    /* this is probably redundant */
    /*position: fixed;*/
    z-index: 3;
    background-color: #f8f8f8;
	float:left;
  }
  /* Dropdown tweek */
  #dropdown .panel-body .navbar-nav {
    margin: 0;
  }
}

@media (max-width: 900px) {
	.panelStaticLeft {display:none;}

}
.list-inline.footerMenu > li:last-child{
    border: none;
}
.list-inline.footerMenu{
    margin-left: 0px;
}
.footerMenu li{
    list-style: none;
    display: inline-block;
    /*border-right: 1px solid #528AD0;*/
    padding: 0px 8px 0px 0px;
}

.footer {
    border-top: 1px solid #ddd;
    /*color: #555;*/
    font-size: 12px;
    padding-top: 15px;
}
/*.footer{
    background: #E9E9E9 ;
}*/

.footerMenu a{
    /*color:#528AD0 !important;*/
    font-size: 12px;
}
.footer .copyright{
    color: #528AD0 !important;
    margin-top: 0px;
    text-align: center;
    font-size: 11px;
}

.footer .footerMenu{
    margin-top: 5px;
    padding: 0px;
}
.fixedBottom{
    position: fixed;
    bottom: 0;
    width: 100%;
}

.link-container {
	border: 1px solid;
	width: 100%;
	height: 50px;
	border-color:#CCC;
	padding-bottom:1px;
}

.link-container a {
	display: block;
	color:	#153242;
	height: 100%;
	text-align: center;
	text-decoration: none !important;
}

.link-container a:hover {
	color:#fff;
	background-color:#153242
}

.input-group-addon.beautiful input[type="checkbox"],
.input-group-addon.beautiful input[type="radio"] {
    display: none;
}


/*.page-detail.branches .profile-branches-list .details {
	min-height: 200px
}
.page-detail.branches .profile-branches-list+.b-title {
	margin-top: 30px
}*/

.sqft-barometer {
	
        width:100px; 
		height:80px;
        display: inline-block;
        margin: 1em;
}


.exclusive-offer-tlg {
	position:absolute; left:0; top:200px;
}

.text-bold {
	font-weight:bold;
}

.price-compare {
	
	margin-top:15px;
	margin-bottom:15px;
	padding-top:15px;
	border:2px solid;
	border-radius: 20px;
	box-shadow: 0px 8px 8px;
	background-color:white
	
}

.price-reduced {
    margin-top: 15px;
    margin-bottom: 15px;
    padding-top: 15px;
    border: 2px solid;
    border-radius: 5px;
    box-shadow: 0px 8px 8px;
    background-color: white;
}




div#sticky-side-right {
    padding-top:100px;
    /*margin:20px 0;*/
	margin-top:325px;
    width:400px;
	height:250px;
	/*background-image: url("/img/addingvalue.gif");*/
	background-repeat: no-repeat;
	opacity:1;
	float:right;
}
.stick {
    position:fixed;
    bottom:0px;
	right:0px;
	z-index:100;
}
div#sideBar {
    width:230px;
    padding:20px;
	margin-top:200px;
    margin-left:30px;
    float:right;
}





.frontpage h2 {
	/*font-size: 4.8rem;*/
	font-size:25px;
	line-height: 48px;
	margin-top:auto;
	/*margin: 0px 0 30px 0;*/
	/*padding-top: 100px;*/
	/*color: #ffffff;*/
	color: #000;
	width: 100%;
	text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.75);
	text-align: center;
/*	position: absolute;
    right: 20px;
    width: 300px;
    height: 220px;
	top:50px;*/
}


@media (min-width: 1200px) {
.frontpage h2 {
    margin-top:0px;
  }
}
@media only screen and (min-width: 992px) and (max-width: 1199px) {
.frontpage h2 {
   margin-top:0px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
.frontpage h2 {
   margin-top:0px;
  }
}
@media only screen and (max-width: 767px), only screen and (max-device-width: 767px) {
.frontpage h2 {
    /*margin-top:0px;*/
  }
}




#back-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    background: #222;
    color: #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    zoom: 1;
    filter: alpha(opacity=50);
    opacity: 0.5;
    z-index: 100;
    display: none;
}

#next-section {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    background: #222;
    color: #fff;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    zoom: 1;
    filter: alpha(opacity=50);
    opacity: 0.5;
    z-index: 100;
    display: none;
}

.breadcrumbheader {
	margin-bottom: 20px;
	list-style: none;
	background-color: #4B6B7D;
	border-radius: 4px;
	margin-left: 20px;
	width: 50%;
	margin-top: 15px;
	color: #fff;
	padding-left: 20px;
}
.breadcrumbheader a {
	color:#CCC;
}
.breadcrumbheader p {
	font-size:12px;
}

.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	border-top: 20px solid #f00;
	float:left;
}

.seealso {
	
	padding-left:20px;
	padding-bottom:12px;
	padding-top:12px;
	background: rgba(230, 241, 247, 0.31);
	color: black;
}

.seealso p {
	font-size:13px;
	line-height:1.2;
}
.seealso a {
	/* color: rgb(3, 10, 58); */
}


  .qomply input[type=checkbox]:not(old),
  .qomply input[type=radio   ]:not(old){
    width     : 2em;
    margin    : 0;
    padding   : 0;
    font-size : 1em;
    opacity   : 0;
  }

  .qomply input[type=checkbox]:not(old) + label,
  .qomply input[type=radio   ]:not(old) + label{
    display      : inline-block;
    margin-left  : -2em;
    line-height  : 1.5em;
  }

  .qomply input[type=checkbox]:not(old) + label > span,
  .qomply input[type=radio   ]:not(old) + label > span{
    display          : inline-block;
/*    width            : 0.875em;
    height           : 0.875em;*/
    width            : 1.5em;
    height           :1.5em;
    margin           : 0.25em 0.5em 0.25em 0.25em;
    border           : 0.0625em solid rgb(192,192,192);
    border-radius    : 0.25em;
    background       : rgb(224,224,224);
    background-image :    -moz-linear-gradient(rgb(240,240,240),rgb(224,224,224));
    background-image :     -ms-linear-gradient(rgb(240,240,240),rgb(224,224,224));
    background-image :      -o-linear-gradient(rgb(240,240,240),rgb(224,224,224));
    background-image : -webkit-linear-gradient(rgb(240,240,240),rgb(224,224,224));
    background-image :         linear-gradient(rgb(240,240,240),rgb(224,224,224));
    vertical-align   : bottom;
  }

  .qomply input[type=checkbox]:not(old):checked + label > span,
  .qomply input[type=radio   ]:not(old):checked + label > span{
    background-image :    -moz-linear-gradient(rgb(224,224,224),rgb(240,240,240));
    background-image :     -ms-linear-gradient(rgb(224,224,224),rgb(240,240,240));
    background-image :      -o-linear-gradient(rgb(224,224,224),rgb(240,240,240));
    background-image : -webkit-linear-gradient(rgb(224,224,224),rgb(240,240,240));
    background-image :         linear-gradient(rgb(224,224,224),rgb(240,240,240));
  }


.c-error .c-validation{
  background: #c51244 !important;
  padding: 10px !important;
  border-radius: 0 !important;
  position: relative;
  display: inline-block !important;
  box-shadow: 1px 1px 1px #aaaaaa;
  margin-top: 10px;
  line-height: 1;
  font-size: 11px;
  color: white;
}
.c-error  .c-validation:before{
  content: '';
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #c51244;
  position: absolute;
  top: -10px;
}
.c-label:after{
  color: #c51244 !important;
}
.c-error input, .c-error select, .c-error .c-choice-option{
  background: #fff0f4;
  color: #c51244;
}
.c-error input, .c-error select{
  border: 1px solid #c51244 !important;
}

@font-face {
  font-family: 'password';
  font-style: normal;
  font-weight: 400;
  src: url(https://jsbin-user-assets.s3.amazonaws.com/rafaelcastrocouto/password.ttf);
}

input.key {
  font-family: 'password';
  /*width: 100px; height: 16px;*/
}

.qomply_filter_bar {
line-height: 100%;
}


.qomply_filter input select{
  border: 1px solid #c51244 !important;
}

.qomply_filter input{
     width: 100%;
     box-sizing: border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing: border-box;
}


.qomply_filter  input, button, select, optgroup, text {
   /* height: 35px !important;*/
    height: 37px;
    width: 100%;
     box-sizing: border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing: border-box;
}

.qomply_filter input[type="text"] {
    height: 357px !important;
    width: 100%;
     box-sizing: border-box;
     -webkit-box-sizing:border-box;
     -moz-box-sizing: border-box;
}

.qomply_filter label {
    font-weight: 100;
}


/*table.table thead th.asc { background: url('../img/sort_asc.png') no-repeat center right; }
table.table thead th.desc { background: url('../img/sort_desc.png') no-repeat center right; }
*/


/*label {
    display: block;
    margin-left: 20px;
}*/

input[type="radio"] {
    float: left;
    margin-left: -20px;
    margin-right: 7px;
}


.qomply input[type=checkbox]:not(old):checked + label > span:before{
    content     : '✓';
    display     : block;
    width       : 1em;
    color       : rgb(153,204,102);
    font-size   : 0.875em;
    line-height : 1em;
    text-align  : center;
    text-shadow : 0 0 0.0714em rgb(115,153,77);
    font-weight : bold;
}

.qomply input[type=radio]:not(old):checked +  label > span > span{
    display          : block;
    /*    width            : 0.5em;
    height           : 0.5em;*/
    width            : 1em;
    height           : 1em;
    margin           : 0.125em;
    border           : 0.0625em solid rgb(115,153,77);
    border-radius    : 0.125em;
    background       : rgb(153,204,102);
    background-image :    -moz-linear-gradient(rgb(179,217,140),rgb(153,204,102));
    background-image :     -ms-linear-gradient(rgb(179,217,140),rgb(153,204,102));
    background-image :      -o-linear-gradient(rgb(179,217,140),rgb(153,204,102));
    background-image : -webkit-linear-gradient(rgb(179,217,140),rgb(153,204,102));
    background-image :         linear-gradient(rgb(179,217,140),rgb(153,204,102));
}


.messagesText {
    font-size: 12px;
    color : #0069e6;
    }

thead.permissionCategory {
    background-color: #fafbcc36;
}
tr.permissionCategory {
    background-color: #fafbcc36;
}
tr.permissionCategory td {
    font-size: 18px !important;
}


.fileUpload {
	position: relative;
	overflow: hidden;
	margin: 10px;
}
.fileUpload input.upload {
	position: absolute;
	top: 0;
	right: 0;
	margin: 0;
	padding: 0;
	font-size: 14px;
	cursor: pointer;
	opacity: 0;
	filter: alpha(opacity=0);
}

.loader {
  border: 16px solid #f3f3f3; /* Light grey */
  border-top: 16px solid #3498db; /* Blue */
  border-radius: 50%;
  width: 120px;
  height: 120px;
  animation: spin 2s linear infinite;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}



.pagination > li > a
{
    /*background-color: white;*/
    color: #f05f40;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover
{
    color: #f05f40;
    background-color: #eee;
    border-color: #ddd;
}

.pagination > .active > a
{
    color: white;
    background-color: #b42304 !Important;
    border: solid 1px #5A4181 !Important;
}

.pagination > .active > a:hover
{
    background-color: #f05f40 !Important;
    border: solid 1px #f05f40;
}

.plus{
   /* background-image: url("/static/common/img/plus_symbol.png");*/
    width:30px;
    height:30px;
    background-repeat:no-repeat;
}

.plus.minus{
    /*background-image: url("/static/common/img/minus_sign.png");*/
    width:30px;
    height:30px;
    background-repeat:no-repeat;
}


.text_emphasis_rounded_box {
  border-radius: 25px;
  border: 2px solid #73AD21;
  padding: 20px;
  width: 200px;
  height: 150px;
}

.status_background_pending {
    background-color: #ffe697c9; /* Changing background color */
    /*font-weight: bold; *//* Making font bold */
    border-radius: 20px; /* Making border radius */
    width: auto; /* Making auto-sizable width */
    height: auto; /* Making auto-sizable height */
    padding: 5px 25px 5px 25px; /* Making space around letters */
    /*font-size: 18px;  Changing font size */
}

.status_background_sent_all_accepted {
    background-color: #a6f957; /* Changing background color */
    /*font-weight: bold; *//* Making font bold */
    border-radius: 20px; /* Making border radius */
    width: auto; /* Making auto-sizable width */
    height: auto; /* Making auto-sizable height */
    padding: 5px 25px 5px 25px; /* Making space around letters */
    /*font-size: 18px;  Changing font size */
}

.status_background_sent_all_rejected {
    background-color: #f98e8ec9; /* Changing background color */
    /*font-weight: bold; *//* Making font bold */
    border-radius: 20px; /* Making border radius */
    width: auto; /* Making auto-sizable width */
    height: auto; /* Making auto-sizable height */
    padding: 5px 25px 5px 25px; /* Making space around letters */
    /*font-size: 18px;  Changing font size */
}

.status_background_sent_some_rejected {
    background-color: #fdd038; /* Changing background color */
    /*font-weight: bold; *//* Making font bold */
    border-radius: 20px; /* Making border radius */
    width: auto; /* Making auto-sizable width */
    height: auto; /* Making auto-sizable height */
    padding: 5px 25px 5px 25px; /* Making space around letters */
    /*font-size: 18px;  Changing font size */
}



.div-line-style-original {
        background: linear-gradient(90deg, rgb(67, 176, 73) 0%,
        rgb(196, 214, 0) 100%);
        border-radius: 210px; height: 30px; width: 3209.74px;
        transform: translateX(-2747.85px);
}

/*.div-line-style1 {
    background: linear-gradient(90deg, rgb(67, 176, 73) 0%, rgb(196, 214, 0) 100%);
    border-radius: 210px;
    height: 10px;
    width: 100%;
    transform: translateX(-2.85px)
    }*/

.div-line-style1 {
    background: rgb(0 32 96);
    border-radius: 210px;
    height: 10px;
    width: 100%;
    transform: translateX(-2.85px)
    }






.dashboard-card-deck-wrapper{
    padding-top:10px;
}

.href_without_hyperlink{
    color: inherit;
}

.box div {
        width: 100px;
        display: inline-block;
        padding: 15px;
        text-align: center;
        color: #000000;
        font-family: 'Arial', sans-serif;
      }




.checkbox_dressed_as_button{
  margin: 4px;
  background-color: #104068;
  border-radius: 4px;
  border: 0px solid #fff;
  overflow: hidden;
  float: left;
 width:50%;
}

.checkbox_dressed_as_button label {
  float: left; line-height: 3.0em;
  width: 100%;
    height: 3.0em;
}

.checkbox_dressed_as_button label span {
  text-align: center;
  padding: 3px 0;
  display: block;
}

.checkbox_dressed_as_button label input {
  position: absolute;
  display: none;
  color: #fff !important;
}
/* selects all of the text within the input element and changes the color of the text */
.checkbox_dressed_as_button label input + span{color: #fff;}

.reg_rejections_only input:checked + span{background-color: #F75A1B;}

/*.reg_rejections_only {*/
/*  background-color: #fff !important;*/
/*}*/



/* This will declare how a selected input will look giving generic properties */
.checkbox_dressed_as_button input:checked + span {
    color: #ffffff;
    text-shadow: 0 0  6px rgba(0, 0, 0, 0.8);
}


/*
This following statements selects each category individually that contains an input element that is a checkbox and is checked (or selected) and chabges the background color of the span element.
*/

.pressed_button input:checked + span{background-color: #F75A1B;}




.switch {
  position: relative;
  display: inline-block;
}
.switch-input {
  display: none;
}
.switch-label {
  display: block;
  width: 48px;
  height: 24px;
  text-indent: -150%;
  clip: rect(0 0 0 0);
  color: transparent;
  user-select: none;
}
.switch-label::before,
.switch-label::after {
  content: "";
  display: block;
  position: absolute;
  cursor: pointer;
}



.switch-label::before {
  width: 100%;
  height: 100%;
  background-color: #dedede;
  border-radius: 9999em;
  -webkit-transition: background-color 0.25s ease;
  transition: background-color 0.25s ease;
}
.switch-label::after {
  top: 0;
  left: 0;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.45);
  -webkit-transition: left 0.25s ease;
  transition: left 0.25s ease;
}


.switch-input:checked + .switch-label::before {
  background-color: #89c12d !important;
}
.rejectedtrade, .switch-label::before {
   background-color: rgba(255, 166, 2, 0.99)  !important;

}


.rejectedtrades:checked + .switch-label::before {
    background-color: red !important;
}

.knowledgebaseswitch, .switch-label::before {
   background-color: rgba(189, 186, 186, 0.99) !important;

}


.knowledgebaseswitch:checked + .switch-label::before {
    background-color: #80b03c !important;
}



/*.rejections + .switch-label::before {*/
/*  background-color: rgba(255, 30, 0, 0.8) !important;*/
/*}*/
.rejectedtrades + .switch-input + .switch-label::before {
   background-color: #292756 !important;
}


/*.rejections + .switch-input:checked + .switch-label::before {*/
/*    background-color: rgba(183, 0, 255, 0.8) !important;*/
/*}*/

/*

.rejectedtrades + .switch-input:checked + .switch-label::before {
    background-color: rgba(255, 2, 2, 0.99);
}
*/



.switch-input:checked + .switch-label::after {
  left: 24px;
}

.center {
  /*border: 5px solid;*/
  text-align: center;
}




#togglebutton {
    margin:4px;

    float:left;
}

#togglebutton label {
    float:left;
    width:170px;
    margin:4px;
    background-color:#EFEFEF;
    border-radius:4px;
    border:1px solid #D0D0D0;
    overflow:auto;

}

#togglebutton label span {
    text-align:center;
    font-size: 32px;
    padding:13px 0px;
    display:block;
}

#togglebutton label input {
    position:absolute;
    top:-20px;
}

#togglebutton input:checked + span {
    background-color:#404040;
    color:#F7F7F7;
}

#togglebutton .yellow {
    background-color:#FFCC00;
    color:#333;
}

#togglebutton .blue {
    background-color:#00BFFF;
    color:#333;
}

#togglebutton .pink {
    background-color:#FF99FF;
    color:#333;
}

#togglebutton .green {
    background-color:#A3D900;
    color:#333;
}
#togglebutton .purple {
    background-color:#B399FF;
    color:#333;
}






.boxed-emphasis-content {
  background-color: #1c90f7;
  padding: 8px;
  min-height:130px;
  width:100%;

}


.boxed-emphasis-content h3{
	color:white;
	font-size: 1.1rem;
	padding-bottom:0px;
}

.boxed-emphasis-content p{
	color:white;
}


.datepicker_inline_form {
    font-size: .7rem;
    min-width: 87px;
    max-width: 150px;
}

.filter_bar_input_text {
    font-size: .7rem;
}

.filter_bar_table_row th {
    border: none;
    padding-bottom: 0;
    padding-top: 0;
}

.qomply-drop-down-selector {
    padding-top:0;
    padding-bottom:0;
    height:1.9rem !important;
}

.qomply_date_duration_font_size {
    font-size: .7rem;
}


#reportheader h1{
    color:white;
    margin-left: 30px;
}
#reportheader .box{
    padding-left:50px;
}

#reportheader .header-content{
    padding-top:50px;
    padding-bottom: 50px;
}

#monthlyreportsummary .navbar{
    margin-bottom:2px;

}

#qomplyreport .navbar{
    margin-bottom:2px;

}

.runway-strip{
    background-color: #00aeed;
    padding-top:10px;

}

/*this is used in formsets*/
.delete-row {


}

.flex-wrapper {
    display: flex;
    justify-content: space-evenly; /* Distribute items evenly */
    align-items: center; /* Align items vertically */
    gap: 20px; /* Add spacing between elements */
    overflow: auto; /* Prevents content from spilling */
}

/*.flex-wrapper > * {*/
/*    flex-shrink: 1; !* Allows items to shrink to fit *!*/
/*    min-width: 0; !* Ensures flex items can shrink properly *!*/
/*}*/

.single-chart {
  width: 33%;
  justify-content: space-around ;
}

.circular-chart {
  display: block;
  margin: 10px auto;
  max-width: 80%;
  max-height: 250px;
}

.circle-bg {
  fill: none;
  stroke: #eee;
  stroke-width: 3.8;
}

.circle {
  fill: none;
  stroke-width: 2.8;
  stroke-linecap: round;
  animation: progress 1s ease-out forwards;
}

@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}

.circular-chart.orange .circle {
  stroke: #ff9f00;
}

.circular-chart.green .circle {
  stroke: #4CC790;
}

.circular-chart.blue .circle {
  stroke: #3c9ee5;
}

.percentage {
  fill: #666;
  font-family: sans-serif;
  font-size: 0.5em;
  text-anchor: middle;
}



/*.arrow {*/
/*    width: 17px;*/
/*    height: 17px;*/
/*}*/
/*.up-bad {*/
/*    fill: red;*/
/*}*/
/*.down-good {*/
/*    fill: green;*/
/*}*/


.arrow-down-green {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;  /* Adjust left side width */
    border-right: 6px solid transparent; /* Adjust right side width */
    border-top: 8px solid #00c851;        /* Adjust height and color */
    display: inline-block;              /* For proper inline alignment */

}

.arrow-up-red {
    width: 0;
    height: 0;
    border-left: 6px solid transparent;  /* Adjust left side width */
    border-right: 6px solid transparent; /* Adjust right side width */
    border-bottom: 8px solid #f00;        /* Adjust height and color */
    display: inline-block;              /* For proper inline alignment */

}