html, body {
    font-family: 'Inter', roboto, system-ui !important;
}

#content > h1+ div  {    min-width: 1200px;    text-align: center;}


.oflogintxt {
     margin-bottom: 10px;
}

.page {
    padding: 0px !important;
}

.sidebar + main {    max-width: 1600px;
    display: flex;
    flex-direction: column;
	    background-color: #f2f1f8;
	}
	
.nav-scrollable {
    height: calc(100% - 56px);
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
	   background-color: #31278C;
}


#dshtitlerow + div.row.mt-5 {
    padding: 20px;
}	
	
.card {
    border-radius: 8px !important;
}
	
	
thead th {text-transform: uppercase;}	
thead td {padding :0px !important}
thead	.form-select-sm {    padding: 12px; background-color :#f2f1f8; border-color:#D6D4E8; width: 96% !important; }
thead	.form-select-sm option {    background-color: white;}
th.bg-primary.text-white {    background-color: transparent !important; color:#31278C  !important }

.text-primary {color:#31278C !important }	
form .btn-primary {float: none;}


.top-row.ps-3.navbar.navbar-dark {
    background-image: url(https://app.securitymonitor.io/logo.png);
    background-size: 220px;
    background-repeat: no-repeat;
    background-color: #31278C;
    background-position: center;
	background-position-y: 16px;
}

.navbar-dark .navbar-brand {    color: #ffffff00;	}
.navbar-dark .navbar-brand:hover {    color: #ffffff00;	}


h3 + div > div {    overflow-x: auto !important;}



div#dshtitlecolright{width: 768px;}
div#dshtitlerow{
    display: flex;
    justify-content: space-between;
}

#dshchartcard1.card{    border-radius: 8px;border: 1px solid #31278C20 !important}
#dshchartcard2 .card{    border-radius: 8px;border: 1px solid #31278C20 !important}

span.text-success{
    border: 1px solid #26AF8950;
	color: #26AF89;    
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	line-height: 16px;
    font-size: 13px;
    padding-left: 30px;
    padding-right: 30px;

}
span.text-danger {
    border: 1px solid #CE191950;
	color:#CE1919;
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	    line-height: 16px;
    font-size: 13px;
	    padding-left: 30px;
    padding-right: 30px;
}



.aeclosed, .aeincontrole, .aeincontrol {
    border: 1px solid #26AF8950;
	color: #26AF89;    
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	    line-height: 16px;
    font-size: 13px;
	background-image: url(/extcss/images/green.png);
	background-repeat: no-repeat;
    background-position-y: 7px;
    background-position-x: 6px;
}

 .aeinfo {
    border: 1px solid #31278C50;
	color: #31278C;    
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	    line-height: 16px;
    font-size: 13px;
	background-image: url(/extcss/images/blue.png);
	background-repeat: no-repeat;
    background-position-y: 6px;
    background-position-x: 6px;
}
.aewarning, .aenotincontrole, .aenotincontrol  , .aeopen {
    border: 1px solid #CE191950;
	color:#CE1919;
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	    line-height: 16px;
    font-size: 13px;
	background-image: url(/extcss/images/red.png);
	background-repeat: no-repeat;
    background-position-y: 6px;
    background-position-x: 6px;
}

 .aeproblem, .aeworking {
    border: 1px solid #F9850950;
	color: #F98509;
    border-radius: 8px;
	height: 31px;	
	text-transform: uppercase;
	padding: 5px;
	font-weight: 600;
	line-height: 16px;
    font-size: 13px;
	background-image: url(/extcss/images/orange.png);
	background-repeat: no-repeat;
    background-position-y: 8px;
    background-position-x: 6px;
}
xxx.row>* {
	overflow-x: hidden  !important;
}
  .top-row.px-4 {
    display: none;
} 

article.content.px-4 {
    padding-top: 50px;
}


.aewarning, .aeproblem,.aeinfo {width: 120px;    display: flex;    justify-content: center;    text-align: center; align-items: center; }
.aenotincontrole, .aeincontrole, .aeincontrol, .aenotincontrol {width: 180px;    display: flex;    justify-content: center;    text-align: center; align-items: center;}
.aeclosed, .aeopen ,.aeworking {width: 120px;    display: flex;    justify-content: center;    text-align: center; align-items: center;}

#dshtablegridcard table tbody tr:last-child {    xxdisplay: none;}
#dshtablegridcard th {color:#31278C50;font-weight: 600;font-size: 13px;line-height: 16px;}


#dshtilecard1, #dshtilecard2, #dshtilecard3 {
	border-radius: 8px; border-color :#31278C20; width:240px
}
#dshtilecard1 H1, #dshtilecard2 h1, #dshtilecard3 h1{
	color :#31278C;font-weight:bold; font-size: 38px ;    width: 200px;
}
#dshtilecard1 span, #dshtilecard2 span, #dshtilecard3 span{
	color :#31278C50;xxxline-height: 36px;font-weight: 600;text-transform: uppercase;font-size:13px;
}
#dshtilecard1 a, #dshtilecard2 a, #dshtilecard3 a{
font-size: 15px;text-transform: none; color :#31278C
}

#dshtilecard1 strong, #dshtilecard2 strong, #dshtilecard3 strong{
	color :#31278C; font-size:15px; color :red
}

#dshtilecard1 .col-7, #dshtilecard2 .col-7, #dshtilecard3 .col-7{
	text-align: right; 
}


/*
 #dshtilecard2 .col-7, #dshtilecard3 .col-7{
	   width: 48% !important;    
}
 #dshtilecard2 .col-5, #dshtilecard3 .col-5{
	width: 50% !important;
}
*/
#dshtilecard1 .row, #dshtilecard2 .row, #dshtilecard3 .row{
margin-bottom: 12px;
}

#dshtilecard1 .row.align-items-end, #dshtilecard2 .row.align-items-end, #dshtilecard3 .row.align-items-end{

    margin-bottom: 0px !important;
}

#dshtilecard3 .row{margin-right:1px !imported; --bs-gutter-x: 0.5rem;}

h1 {    margin-top: 0;    margin-bottom: 0;}


td#colwebsite {
    width: 100%;
}
td#colcontrole ,td#colactions, #colbtn{
    min-width: 200px;
}

.card-body {
    padding: 16px;	
}
.card-body strong {
text-transform: none !important;
}

div#dshtitlecard {
    background-color: transparent;
}
div#dshtitlecard h1 {color:#31278C; font-size:32px ; font-family: 'Inter'; font-weight:bold}



#dshtablegridcard tbody tr  { border-radius: 8px !important ;outline: 1px solid #31278C20;  height: 66px; background:#fff !important;}
#dshtablegridcard tbody td  {background:#fff ;    font-size: 16px;
    color: #31278C;
    font-weight: bold;
    padding-left: 20px;
	}
#dshtablegridcard tbody td:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

#dshtablegridcard tbody td:first-child {
  border-top-left-radius: 8px;
  border-bottom-left-radius:8px;
}
 table {    
    border-spacing: 0 12px;
	 border-collapse: separate;
}
#dshtablegridcard table {    
    border-spacing: 0 20px;
	 border-collapse: separate;
}

table > thead > tr:nth-child(2)
{
    position: relative;
    top: -12px;
}
#dshtablegridcard {
    background-color: transparent;
}


#dshtablegridcard  button.btn.btn-outline-success.col-12 {
    max-width: 140px;
    float: right;
	border-radius:8px;
}

.heroes > tr  td  {  background:#fff ;font-size: 15px;color: #31278C; padding-left: 0px;    padding-top: 12px;}



.heroes td:last-child {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}

.heroes td:first-child {
	font-weight:600;
  border-top-left-radius: 8px;
  border-bottom-left-radius:8px;
  padding-left: 20px; 
}

.heroes > tr {    outline-color: #41389354;
    outline-width: 1px;
    outline-style: solid;
    border-radius: 8px !important;
	height: 66px !important;
	}

.heroes tr:hover {left :0px !important}
.heroes td{    border-bottom-width: 0px;}
a.btn.btn-primary.btn-sm.btn-video {
    float: left;
}
.page.Account\/Manage\/ExternalLogins .col-md-4 {
    margin-bottom: 20px;
}
.geenaccount:hover {color: #fff;}
.geenaccount {
    background: var(--btn-green);
    border-color: var(--btn-green);
    color: #fff;
    font-weight: 700;
    border-radius: 6px;
    font-size: .86rem;
    padding: .65rem 1rem;
	text-decoration: none;
}

.card-footer {
    padding: .5rem 1rem;
    background-color: rgba(0, 0, 0, .00);
    border-top: 0px solid rgba(0, 0, 0, .00);
}


xxx#expandedrow tr:hover span.text-primary {color:#000 !important;}

#expandedrow tr {outline-width: 0px;}
#expandedrow .row .col {        display: flex;    flex-direction: row;    justify-content: space-around;}
#expandedrow .container {max-width:100% !important ;    padding: 0px;background-color: #f2f1f8;}
#expandedrow > td > div > div:nth-child(2){    background-color: #31278C;    height: 64px;    border-bottom-left-radius: 12px;    border-bottom-right-radius: 12px;margin-right: 0px;}

#expandedrow  .btn-primary ,  #expandedrow  .disabled {background-color: #31278C;color:#FFF; border: 0px solid #31278C;}
#expandedrow  a.btn.btn-primary.btn-sm.btn-video {background-color: #26AF89;color:#FFF; border: 0px solid #26AF89;    font-weight: 700;
    border-radius: 6px;
    font-size: .86rem;
    padding: .65rem 1rem;
	text-decoration: none;}

#expandedrow > td {     padding-left: 0px;     padding-top: 0px; padding-bottom: 0px !important; padding: 0px;}
#expandedrow td.no-wrap {    background: #f2f1f8 !important;padding-left: 8px !important;}

#expandedrow .row {margin-right: 0px;    margin-left: 0px}

#expandedrow {    position: relative;    top: -20px;}
#expandedrow {    border-top-left-radius: 0px !important;    border-top-right-radius: 0px !important;}

#expandedrow table.table.small.border {    margin-top: 0px;}

#expandedrow > td > div > div:nth-child(1) > div:nth-child(1) > div > div > table > thead > tr > th > span.text-muted
 {    display: none;}
 
#expandedrow  table > thead > tr {height:20px !important}

#expandedrow thead th , #expandedrow thead th strong {color: #31278C}


#expandedrow > td > div > div:nth-child(1) > div:nth-child(1)  td { background-color: transparent; padding-left: 12px !important;}


#expandedrow td {    border-bottom-width: 0px;    height: 66px !important;}


.heroes  > tr.selected td:first-child {    
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.heroes  > tr.selected td:last-child {    
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
}

.bg-light, th.bg-warning {    background-color: #F2F1F8 !important }



 
xxx.heroes > tr.selected td,   xxx.heroes > tr:hover > td { background-color: #312888 !important ; color :#FFF}
.actionevents .heroes > tr:hover > td { font-weight: 600;}

xxx.heroes > tr.selected td span {border-color:#FFF; color:#FFF}
xxx.heroes > tr:hover > td span {border-color:#FFF; color:#FFF}

.sidebar[b-2rdhq2fofu] {background-image:none !important; background-color:#31278C}

.nav-item[b-knxdrsdcur] .nav-link {    color: #fff; border-radius:0px}
.nav-item[b-knxdrsdcur] .nav-link.active {    color: #31278C !important; background-color: #F2F1F8 }
.nav-item[b-knxdrsdcur] .nav-link:hover {    color: #fff}
				b-knxdrsdcur
article.content.px-4 {      margin-top: 40px; padding-bottom: 20px;}
.page {    background-color: #F2F1F8 !important;}

.top-row[b-2rdhq2fofu], article[b-2rdhq2fofu] {
		margin-left: 4rem !important;
        margin-right: 4rem !important;
    }
	
	
xx.form {
    margin-top: 40px;
}
	

article h3 {
	color: #31278C;
    font-weight: bold;
    font-size: 34px;

	
}
td {
    text-align: left;
}
article td {
    height: 56px !important;
    font-size: 16px;
    vertical-align: middle;
	   xxx.background-color: #fff !important;
}

table.table.small.border {
    border: none !important;
}

th.bg-dark.text-light {
    background-color: transparent !important;
    color: #31278C50 !important;
}

article th {
    border-bottom-width: 0px !important;
}
table.table.small.border {
    margin-top: 40px;
}
 
.table>:not(:last-child)>:last-child>* {
    border-bottom-color: transparent !important;
}
.form-select-sm {
    padding-top: .25rem;
    padding-bottom: .25rem;
    padding-left: .5rem;
    font-size: 16px;
    border-radius: 8px;
    color: #312888;
    
}


.bg-secondary {
    background-color: #fbfbfb !important;
    padding-left: 20px;
    padding-top: 46px;
    color: #31278C;
    height: 100px;
    
    border-radius: 8px !important;
    text-align: center;
    border: 1px solid #31278C20;
	width:224px;
	    margin-left: calc(100% - 460px);
		    font-size: 38px;
    font-weight: bold;
    text-align: left;
}


.top-row[b-2rdhq2fofu] {
background-color: #F2F1F8;    border-bottom: 0px solid #fff;}

.top-row[b-2rdhq2fofu] a {}
.top-row form {margin-top:0px !important}

.top-row form button{border:0px solid #fff !important}
.px-3 {
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.nav-item[b-knxdrsdcur] {
    font-size: 1rem;
    padding-bottom: 0.5rem;
}

.bi::before, [class*=" bi-"]::before, [class^=bi-]::before {

    color: #fff;
    font-size: 24px;
	float:left;
}
i.bi.bi-shield-slash::before {
    color: red !important;
}
article .btn-primary {
    color: #fff;
    background-color: #5cad8b;
    border-color: #5cad8b;
    margin-bottom: 40px;
    xxxfloat: right;
    margin-right: 40px;
}

.d-grid.gap-2.d-md-block {
    margin-top: -48px;
}
.btn-warning {
    color: #ffffff;
    background-color: #000000;
    border-color: #070707;
    float: right;
    margin-right: 10px;
}

.row.align-items-start.my-4 {
    flex-direction: column-reverse;
}

.top-row[b-knxdrsdcur] {
    height: initial;
    background-color: rgb(120 104 242);
}
.ps-3 {
    padding-left: 0rem !important;
}

zzz.bg-light {
    --bs-bg-opacity: 1;
    background-color: #31278C !important;
}

.card.bg-light {
    --bs-bg-opacity: 1;
    background-color: #31278C !important;
    color: #fff;
    font-size: 32px;
    border-radius: 8px;
    box-shadow: 20px 20px 20px #c5c5c5;
	    margin-bottom: 40px;
    margin-top: 40px;
}
.card .bg-success {    background-color: inherit !important;}
.card h4  {        font-size: 32px;        font-weight: bold;    }

.row.my-4 h5 {
    margin-top: 40px;
}



table.table.small {
    margin-top: 80px;
}


.bevestigtxt[role="alert"] {
    background-color: #ffdbdb !important;
    color: red;
}





article table tbody tr.selected,

article table tbody tr.selected,

	
.bi-shield-check::before {
    color: green;
}

i.bi::before {
    color: #31278C !important;
	margin-right: 8px;
}


ul.loginbtns {  
    justify-content: flex-end !important;
    flex-direction: row-reverse !important;
}
div#dshtitlecolleft {
    width: 240px;
}


.nav-scrollable {
    width: 250px;
}

 
 .alert.alert-custom.fade.in.show {
        margin-top: -34px !important;
}

.login .geenaccount{color:#000 !important}


@media screen and (max-width: 1340px) {
	div#dshtitlerow {
		display: flex;
		justify-content: space-around;
	}
}
@media screen and (max-width: 1600px) {
		 .actionevents table > thead > tr:nth-child(2) > td > select {width:100%}
		 .top-row[b-2rdhq2fofu], article[b-2rdhq2fofu] {
			margin-left: 0.1rem !important;
			margin-right: 0.1rem !important;
		}
		xxx.aewarning, xxx.aeproblem,xxx.aeinfo {width: 100px;   }
		xxx.aenotincontrole, xxx.aeincontrole {width: 140px;  }
		xxx.aeclosed, xxx.aeopen ,xxx.aeworking {width: 100px;   }


}
 @media (max-width: 1200px) {
 
				.sidebar + main {
				
				overflow: hidden;
			}
 }
 @media (max-width: 1023px) {
				.sidebar[b-2rdhq2fofu] {                height: 100% !important;   }
				.sidebar + main {
				
				overflow: hidden;
			}

			thead .form-select-sm {
				width: 100% !important;
			}

			thead .form-select-sm {
				padding: 1px;
				
			}
 }