/*body
{   
	font-family: Avenir,Helvetica,Arial,sans-serif;
	font-size: 10pt;
	xfont-family: Arial,sans-serif;
	xfont-size: 11pt;
	xfont-family: Verdana, sans-serif;
	xfont-size: 9pt;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	padding: 0px;
	margin: 0px;
	margin-left: 0px;
	margin-top: 5px;
}
*/

/* Är Segoe UI samma font som i NBS 7 ? */
/*body
{
	font-family: 'Segoe UI',Arial, Helvetica, sans-serif;
	font-size:10pt;
} */

.k-tooltip 
{
	color: Black; /*#fff;*/
	background-color: #cdd4fb; /*#8799FF;*/
	/*margin-top:10px;*/ /* För att tooltipet ska lägga sig en bit under en rad i en grid. Blir dock FULT för ett tooltip på en knapp */
}

/* Behövs när vi använder OverviewTooltip som visar tooltipet med en delay */
.nbsGridTooltip
{
	background-color: transparent;
	margin-top:16px; /* Behövs om vi använder Position=@TooltipPosition.Left */
}

/* Behövs när vi använder OverviewTooltip som visar tooltipet med en delay */
.nbsGridTooltip .k-tooltip 
{
	color: Black; 
	background-color: transparent;
	padding: 0px;	
}

/* Behövs när vi använder OverviewTooltip som visar tooltipet med en delay */
.k-callout
{
	display:none !important;
}

/* Behövs när vi använder OverviewTooltip som visar tooltipet med en delay */
.k-callout-n
{
	display:none !important;
}

/* OverviewTooltip */
.BigTooltip
{
	padding: 5px;
	font-size: 10pt;
	width: 380px;
	background-color: #cdd4fb;
	/*font-family: 'Segoe UI',Arial, Helvetica, sans-serif;*/
}

label
{
	font-weight:normal;
	margin-bottom:0px;
	color:#888888;
}

.tableLabel
{
	font-weight:normal;
	color:#888888;
	padding-right:15px;
}

.buttonSmall
{
	cursor: pointer;
	border-radius: 4px;
	padding: 4px 12px 3px 10px;
	border: none;
	background-color: #DCDCDC; 
	font-weight: bold;
	color:black;
	outline:none;
}


button {
	cursor: pointer;
	border-radius: 4px;
	padding: 8px 24px 8px 24px;
	border: none;
	background-color: #DCDCDC; /*#D0D0D0;*/ /* ljusare men passar ej i toolbar #DCDCDC;  */
	font-weight: bold;
	color: black;
	outline: none;
}

button:hover 
{
	background: #BAC4FF;
	/*background: #D6EFFF;									*/
	/*border-width:2px;*/
}

button:active
{
	background: #8799FF;
	/*background: #E8EBFF /*#F79896;*/
}

button:focus 
{
	/*color: red;
	border: solid 2px red !important;*/
	/*background: #8799FF;*/ /* 21981: Borttagen för generell fix för att inte knapparna ska "fastna" */
	/*background: #FF9999;*/
	/*background: #00FF00;
	border: solid 5px red !important;*/

	/*Förslag 1*/
	box-shadow: 0 0 0 2px #BAC4FF; 

	/*Förslag 2*/
	/*box-shadow: 0 0 0 2px rgba(192, 192, 192, 0.75);*/
} 

input[type=checkbox]:focus
{
	/*border-color:#BBBBAA;*/
	box-shadow: 0 0 0 2px #BAC4FF; 
	/*outline:none;
	box-shadow:none;*/
}




/*
//Dessa passar när button:focus har solid 2px rad runt om sig
.imagebutton:focus
{
	padding: 5px 8px 2px 8px;
}
.imagebutton_with_text:focus
{
	padding: 6px 22px 3px 22px;
}
.imagebutton_sm:focus
{
	padding:5px 5px 2px 5px;
} */


textarea
{
	resize:none; /* Gör att användaren inte kan ändra storlek på en textarea */
}



.imagebutton_sm
{
	/*padding:7px 7px 4px 7px;*/
	padding:4px 5px 4px 5px;
}

.imagebutton_with_text
{
	padding: 8px 21px 5px 21px;
}

.imagebutton
{
	padding: 7px 10px 4px 10px;
	/*font-size: 5pt;*/ /* fix för att kunna ha en knapp i en h1 utan att det blir en megaknäpp ram runt när man klickar */
	/*font-weight: normal;*/
}
.imagebutton_inHeader
{
	padding: 7px 10px 4px 10px;	
}
.imagebutton_sameHightAsText
{
	padding: 8px 10px 5px 10px;
}


.imagebutton_input
{
	/*padding: 7px 8px 6px 8px;*/ /* Ger lika hög input som imagebutton i IE11, i px för hög i Chrome */
	/*padding: 4px 8px 3px 8px;*/
	padding: 5px 8px 4px 8px;
	vertical-align: top;
}

.imagebutton_select
{
	padding: 6px 6px 5px 6px; /* Ger lika hög input som imagebutton i IE11, i px för hög i Chrome */
	vertical-align: top;
}


input
{
	outline:none !important;	
}

/*button {
	border-radius: 4px;
	color: #FFFFFF;
	background-color: #489ede;
	border: 2px solid #489ede;
	padding-top: 7px;
	padding-bottom: 7px;
}

	button:active {
		border: 2px solid blue;
	}
*/

/* Chromes checkboxar är ju pyttesmå, detta ökar storlken utan att röra dem i övriga webläsare. Obs ej testat i Edge */
XXinput[type=checkbox]
{
	-webkit-transform: scale(1.3); 	
}

input[type=checkbox]
{
	/*-webkit-transform: scale(1.3); */
	-webkit-appearance: none;
	-moz-appearance: none;
	background:white;
	border: 1px solid #888888;
	height: 14px;
	width: 14px;
	outline: none !important;
}


input[type=checkbox]:checked
{
	background-image: url(icons/check2.png);
}

/* Chromes radiobuttons är ju pyttesmå, detta ökar storlken utan att röra dem i övriga webläsare. Obs ej testat i Edge */
input[type=radio] 
{
	-webkit-transform: scale(1.3); /* Safari and Chrome */
}

/*textarea, input 
{
	font-family: Avenir,Helvetica,Arial,sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	border: solid 1px #BBBBAA;
	border-radius: .25rem;
	padding: 3px 6px;
} */

.form-control, textarea
{
	border: solid 1px #BBBBAA;
	border-radius: .25rem;
	padding: 3px;
	box-shadow: none !important;
	-webkit-box-shadow: none !important;
}


/* Tar bort Chromes feta svarta ram runt en textarea */
textarea:focus 
{	
	outline-offset: unset !important;
	outline: unset !important;
}



input[type=text],
input[type=number],
input[type=password],
input[type=email]
{
	border: solid 1px #BBBBAA;
	border-radius: .25rem;
	padding: 3px;
	height:30px;
}

/* Transparent bakgrund för input boxar i tabeller */
.k-grid input[type=text], .k-grid input[type=number] 
{
	border: solid 1px #DDDDDD;
	background: transparent;
	border-radius: .25rem;
	padding: 3px;
	height:27px; /*30px;*/
}

/* Aktiv input box i tabell */
.k-grid input[type=text]:focus, .k-grid input[type=number]:focus
{
	background: white;
}



/*input[type=text]:focus,
input[type=number]:focus,
input[type=password]:focus
{
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
} */

input:read-only
{
	background-color: #EEEEEE;
}

/* Stylen input:read-only påverkar ju en redigerbar checkbox??? detta hack fixar det*/
input[type=checkbox]:read-only
{
	background-color: White;
}

/* men hacket oven gör även en disablad checkbox vit... så här kommer ett hack för hacket ovan  så att en disabled checkbox blir gå (ocn en enablad vit) */
input[type=checkbox].disabled, input[type=checkbox][disabled], input[type=radio].disabled, input[type=radio][disabled] 
{
	cursor: default;
	background-color: #EEEEEE;
}

textarea 
{
	overflow: auto;
}

.k-grid a 
{
	color: blue !important;
}

.k-grid td
{
	white-space: nowrap; /* Förhindrar radbrytning på ALLA tabeller. Detta skulle vi vilja ha en en property på en kolumn! */
	overflow: hidden; /* Defaultvärde men sätter det ändå nu när vi lägger in white-space:nowrap*/
	text-overflow: ellipsis;
	font-size: 10pt;
	/*font-family: 'Segoe UI', Arial;*/
}

.smallTableFont .k-grid td
{
	text-overflow: clip; 
	/*font-size: 9pt;
	font-family: 'Segoe UI', Arial;*/
}

.nbsGridSmallText .k-grid td 
{
	text-overflow: clip; 
	font-size: 9pt;
	font-family: 'Segoe UI', Arial;
}


/* Okänd style */
	/*.k-grid-content-sticky
{
	background-color: #ffd8d5
} */
	/* Markerad rad i gridden */
	.k-grid td.k-state-selected, .k-grid tr.k-state-selected > td
{
	color: black; /*#656565;*/
	background-color: #BAC4FF; /*rgba(255,99,88,0.25);*/
}

.nbsTableSimple td {
	vertical-align: top;
	padding: 3px;
}



/*Gör att texten på drop down menyn blir blå, inte så bra (slutsats: dumt med länkar i en drop down meny...*/
/*a {
	color: blue !important;
} */

.nbsTable td {
	vertical-align: top;
	padding: 5px;
}

.nbsTable input[type=text] {
	width: 100%;
	border-radius: 3px;
	border: solid 1px #A8A8A8;
	padding-top: 5px;
	padding-bottom: 5px;
}

.nbsTable input[type=number] {
	width: 100%;
	border-radius: 3px;
	border: solid 1px #A8A8A8;
	padding-top: 5px;
	padding-bottom: 5px;
}

.nbsTable textarea {
	width: 100%;
	border-radius: 3px;
	border: solid 1px #A8A8A8;
	padding-top: 5px;
	padding-bottom: 5px;
}


/* Fix för bootstrap för IE */
.table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th {
	border-top: none !important
}

/* Skriver över bootrspas middle som ju blev fult (?)*/
img {
	vertical-align: top;
}

.nbsPageHeader
{
	display:block;
	font-size:26pt;
	line-height:24px;
	margin-bottom:8px;
}


.divStartBackground {
	position: absolute;
	left: 0px;
	top: 0px;
	background: #FFFFFF; /*#e1dcc8;*/
	width: 100%;
	height: 100%;
	/*visibility: hidden;*/
	z-index: 2000;
	padding: 5px;
	font-size: 12pt;
}

.divPageLoadBackground
{
	text-align: center;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	/*visibility: hidden;*/
	z-index: 1200; /* För att den ej ska dölja bootstrep menyerna som har z-index 1000 */
}

.divPageLoad
{
	position: absolute;
	top: 50%;
	left: 50%;
	background: #D8E4FF;
	/*background: #8799FF;
	color: white;*/
	/*background: #f0f0f0;*/ /* Grå - blir otydlig eftersom den smälter in i bakgrunden på vissa sidor */
	padding: 15px;
	padding-left: 20px;
	padding-right: 20px;
	width: 200px;
	height: 40px;
	margin-left: -100px;
	margin-top: -20px;
	border-radius: 4px;
	padding: 8px 24px 8px 24px;
	z-index:9999;
}

.divPageLoadForGif {
	position: absolute;
	top: 50%;
	left: 50%;
	padding: 15px;
	padding-left: 20px;
	padding-right: 20px;
	width: 200px;
	height: 70px;
	margin-left: -100px;
	margin-top: -20px;
	border-radius: 4px;
	padding: 8px 24px 8px 24px;
	z-index: 9999;
}


#nbsSlowApiProgress {
	width: 100%;
	background-color: #CCCCCC;
}

#nbsSlowApiProgressBar {
	width: 1%;
	height: 20px;
	background-color: #2942FF;
}

/* Kendo tab, not selected*/
.k-tabstrip-items .k-item
{
	border-color: rgba(0,0,0,0.08);
	color: Black;
	background-color: #f4f4f4;
}

/* 
.k-item.k-state-default 
{   
	background-color: #f4f4f4;
}
*/

/* Kendo tab, selected*/
.k-tabstrip-items .k-item.k-state-active, .k-tabstrip-items .k-item.k-state-selected
{
	border-color: rgba(0,0,0,0.08);
	color: Black;
	background-color: #BAC4FF;
	font-weight: bold;
}

.k-tabstrip > .k-content
{
	padding: 2px;	/* Minskar left-right till 2px eftersom vi alltid lägger in en container fluid i tabben och den lägger på en padding*/
}

.container-fluid
{
	padding-right: 5px;
	padding-left: 5px; 
}

/* Hotfixar telerik grid bugg  https://feedback.telerik.com/blazor/1427406-grid-editors-should-take-100-width-of-the-cell */
table.k-grid-table span.telerik-blazor,
table.k-grid-table .k-textbox
{
	width: 100%;
}

/* Varannan-raderna i telerik gridden */
.k-alt, .k-pivot-toolbar, .k-pivot-layout > tbody > tr:first-child > td:first-child
{
	background-color: #fafafa; /*#f6f6f6;*/
} 

/* Headern på telerik gridden */
.k-grid-header, .k-grid-toolbar, .k-grouping-header, .k-grid-add-row, .k-grid-footer
{
	color: black;
	/*color: #656565;
	font-weight: bold;*/
	background-color: #f0f0f0; /*	#ececec;*/ /*#f6f6f6;*/
	text-overflow: clip;
}

.k-grid th
{
	padding: 4px 10px;	 /* 8px 12 px*/
}

.k-grid td
{
	/*padding: 7px 12px;	*/  /* 8px 12 px */
	/*padding: 6px 5px 6px 10px;*/ /* mimskar till detta för att få plats med Status-flagg-bilden utan att raden ska bli högre än tidigare */
	padding: 6px 10px 6px 10px; /* ändrar till lika på vänster höger för att det ska sse snyggare ut med centrerade och högerställda saker */
}

/* Kan användas på NbsGrid när man har kolumner som är redigerbara för att få nästan samma radhöjd som i en icke redigerbar grid (den blir 2 pix högre) */
.nbsGridEditable .k-grid td
{
	padding: 3px 10px 3px 10px;
}



.k-dropdown-wrap
{
	border-color: #CCCCCC !important;
	background-color: white !important;
	background-image: unset !important;
	font-size: 10pt;	
}

.k-dropdown .k-dropdown-wrap .k-input
{
	height: 25px;
	padding-left:4px;
	color: black;
}

.form-group
{
	margin-bottom: 8px; /* 15px */
}

.Mx
{
	float:left;
	padding-top:5px;
	padding-right:5px;
	font-size:10pt;
}

.Mx input[type=text],
.Mx input[type=number],
.Mx input[type=password]
{
	height:25px;
}


.MxForGridToolbar
{
	padding-top:0px !important;	
}

.MxForGridToolbar input[type=text],
.MxForGridToolbar input[type=number],
.MxForGridToolbar input[type=password]
{
	height:28px !important;
}


.MxSmallfont
{
	font-size: 9pt;
}

.MxCheckboxLabel
{
	padding-left: 5px;
	vertical-align: text-bottom;
}
/* Fix för att Teleriks drop downer ska kunna fylla ut 100% av bredden i en div utan att själva innehållet i drop downen blir 100% av sidan */
/*.k-dropdown
{
	width:100% !important;
} */
/* Bootrap förstör stylen på fieldseten helt och hållet, detta gör de anvädbara igen */
fieldset
{
	border: solid 1px #BBBBBB;
	margin: 0px 2px 0px 2px;
	padding: 0px 4px 5px 6px;
}

/* Bootrap förstör stylen på fieldseten helt och hållet, detta gör de anvädbara igen */
legend
{
	width: unset;
	border: none;
	font-size: 10pt;
	color: #888888;
	line-height: unset;
	margin-bottom: unset;
	margin-left: 3px;
	padding-left: 4px;
	padding-right: 4px;
}

/* Skriver över teleriks style */
fieldset legend
{
	color: #888888;
}

.ticketSearchFilter input[type=checkbox]
{
	margin-left: 2px;
}

.NoTopPadding
{
	padding-top: 0px;
}

.panel-body
{
	padding: 15px 10px 15px 10px
}

.panel-primary
{
	border-width: 2px;
}

.navbar
{
	margin-bottom: 0px;  /* 10px; passade när vi hade en line-hight:24 i rubriken i listpage*/
}

.NewTicketPopup
{
	width:800px;
}

.ApplyTemplatePopup
{
	width:500px;
}


.BigPopup
{
	width:80%;
	height:80%;
	max-width:1400px;
}
.BiggerPopup
{
	width:90%;
	height:90%;
	max-width:1500px;
}
.FullPopup
{
	width:100%;
	height:100%;
}
.TicketQuickEditPopup
{
	width:80%;
	height:80%;
	max-width:600px;
	max-height:630px;
}
.TicketQuickEditPopup2
{
	width:80%;
	height:80%;		/* auto ger suddig dialog !? */
	max-width:600px;
	max-height:510px;
}
.UploadPopup
{
	width: 800px;
	height: 400px;
}
.UploadPopupForEditor
{
	width: 500px;
	height: 200px;
}
.NipBitflagPopup
{
	width: 600px;
	height: 550px;
}

.ErrorAlert	.k-window-titlebar
{
	background: red;
	color:white;
}

.WarningAlert .k-window-titlebar
{
	background: #FF8123;
	color:white;
}


.ErrorPopup
{
	z-index: 11000 !important;
	width: 800px;
	/*height: 400px;	*/
	min-height:120px !important;
}

.ErrorPopup	.k-window-titlebar
{
	background: red;
	color:white;
}

.ErrorPopup2
{
	z-index: 11000 !important;
	width: 800px;	
}

.ErrorPopup2	.k-window-titlebar
{
	background: #F00000;
	color:white;
}

/*.ErrorPopupSuperLarge
{
	z-index: 11000 !important;
	width: 100%;	
}

.ErrorPopupSuperLarge .k-window-titlebar
{
	background: #F00000;
	color:white;
}*/


.NoRightsPopup
{
	z-index: 11000 !important;
}

.NoRightsPopup	.k-window-titlebar
{
	background: #FF8123;
	color:white;
}


.ComfirmPopup
{
	width: 500px;
	height: 160px;	
}

.ComfirmPopup .k-window-titlebar
{
	background: red;
	color:white;
}

.TicketActivationDatePopup
{
	width:500px;
	height:200px;
}

.MediumPopup
{
	width: 550px;
	height: 300px;	
}

.EditTimePopup
{
	width: 500px;
	/*height: 350px;  Verkar funka lika bra uta höjd	*/
}

.AddTimePopup
{
	width: 500px;
	/*height: 470px;  Verkar funka lika bra uta höjd	*/
}




/* Vem vill se scrollbaras i en popup? Detta stänger av dem*/
.k-window-content, .k-prompt-container 
{   
	overflow: hidden;
}


/* Lägg denna på en div som innesluter buttons (inkl ImageButton) för att få lagom mellanrum mellan knapparna */
.ButtonToolbarNormal button
{
	margin-left: 8px;
	margin-right: 8px;
}

/* Trix för att gömma de tomma tab-bodisarna på telerikts tab komponent i NbsTabs komponenten 
   Får dock till följd att man inte kan använda en vanlig Telerik tab komponent innuti en NbsTabs komponent */   
.nbsTabsRemoveTelerikBody .k-content
{
	display: none !important;
}



/* Trix för att gömma de tomma tab-bodisarna på ticket edit sidan */
.ticketTabs .k-content
{
	display: none !important;
}

/* Liten fulfix för Syncfusions rich text editor. Att sätta den till Height=100% fungerar inte korrekt. Ska vi anävnda den borde
   borde vi nog klaga på dem och fråga om detta är en bugg eller om vi kan göra på något annat sätt för att få den 100% hög */
.ticketTabs .e-rte-content
{
	height: 100% !important;
	border: 1px solid #dee2e6 !important;
}
.ticketTabs .e-richtexteditor
{
	border: none !important;
}
.ticketTabs .e-toolbar-wrapper
{
	border-left: 1px solid #dee2e6 !important;
	border-right: 1px solid #dee2e6 !important;
}

/* Hur minskar man höjden på bootstarps navbar? Detta hjälper iaf inte den blir ändå 50px hög*/
/* Kanske enligt detta https://stackoverflow.com/questions/19576175/how-do-you-decrease-navbar-height-in-bootstrap-3*/
/*.navbar
{
	min-height:47px;
}
.navbar-brand
{
	height: 47px;
} */

.nipDropDown
{
	border: solid 1px #BBBBAA;
	border-radius: .25rem;
	background-color: #FFFFFF;
}

/* Fungerar inte 
.nipDropDown:focus
{
	border-color: #66afe9;
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}				 */

.nipDropDown input[type=text]
{
	border: none;
}

.nipDropDownInner
{
	position: absolute;
	width: 700px;
	max-height: 150px; 
	display: flex;
	flex-direction: column;
	/*border: solid 1px #BBBBAA;*/
	/*border: solid 2px #9b9b89;*/
	border: solid 2px #848484;
	/*border: solid 2px #E1E1E1;	*/
	border-radius: 3px;	
	background:#F9F9F9; /* Testar lite gåare bakgrund tidigare var den vit #FFFFFF */  ;
	/*background:#E2E7FF;*/ 
	z-index:400;
	font-size:10pt;
	font-weight:normal;
}

.nipDropDownInner tr
{
	cursor: default;
}

.nipDropDownInner tr:hover
{
	background-color:#BAC4FF
}

.nipDropDownInner .selectedRow
{
	/*background-color:#3ec55d;	*/
	/*background-color:#97a6ff; */
	/*background-color:#687df9;*/
	background-color:#8799FF;	
	color:white;
	/*background-color:#4C62FF;*/
	
}

.nipDropDownInner td
{
	padding-left: 4px;
	padding-right:10px;
}

.nipDropDownInput
{
	padding-top:3px;
	padding-bottom:3px;
	min-width:0px; /* Utan denna så verkar det finnas en min bredd som gör att flex-boxen som den ligger i inte kan krypma den tillräcklit. */
	font-weight:normal;	
	height: 28px !important; /* Ska vara 2px mindre än höjden på input[type=text] detta eftersom att nipDropDown inte har någon border på sin textbox, bordern ligger utanför o då måste höjden vara 2px mindre för att komponentera ska bli lika höga */
}

.nipDropDown:focus-within
{
	border-color: #66afe9;
}

/* Samma som nipDropDownInput men utan !important på höjden, test av JT 2022-11-07 */
.mxDropDownInput
{
	padding-top:3px;
	padding-bottom:3px;
	min-width:0px; 
	font-weight:normal;	
	height: 28px; 
	color:black;
}

/* När nya NipDropDown där tabeller är ersatta med divar*/
.nipDropDownResultRow
{
	cursor: default;
	padding-left:3px;
}

.nipDropDownResultRow:hover
{
	background-color:#BAC4FF
}


/* style för NavLink, borde bara läggas in på a .active*/
.active
{
	font-weight:bold !important; /* important krävs eftersom en style dropdowns.less annars skriver över detta */
}

.FlexGrow
{
	flex-grow:1;
}

.NbsPopupMenu
{
	position:absolute; 
	/*border:1px solid black; */
	padding:0px; 
	z-index:1000; 
	background-color:#f2f6ff; /*#f1f1f1;*/
	min-width:150px;
	border: solid 1px #BBBBAA;
	border-radius: .25rem;
}


.NbsPopupMenu .NbsPopupMenuItem
{
	cursor:pointer;
	padding-left:20px; 
	padding-right:10px; 
	padding-top:4px;
	padding-bottom:2px;
}

.NbsPopupMenu .NbsPopupMenuItem[:last-child]
{
	padding-bottom:4px;
}

.NbsPopupMenu .NbsPopupMenuItem:hover
{
	background-color:#BAC4FF;
}

.divAlphaBackground
{
	text-align: center;
	position: absolute;
	left: 0px;
	top: 0px;
	background: #705d4f; /*#e1dcc8;*/
	filter:alpha(opacity=35);
	-moz-opacity:.35;
	opacity:.35;
	width: 100%;
	height: 100%;
	/*visibility: hidden;*/
	z-index:5000;       
}

.divAlphaBackgroundLocal
{
	text-align: center;
	position: absolute;
	left: 0px;
	top: 0px;
	background: #705d4f; /*#e1dcc8;*/
	filter:alpha(opacity=35);
	-moz-opacity:.35;
	opacity:.35;
	width: 100%;
	height: 100%;
	/*visibility: hidden;*/
	z-index:5000;       
}


.nbsWindow
{
	position:absolute; 	
	border: 1px solid black; 
	background-color:white; 
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	z-index:6000; 
}

/* Ingen aning varför detta fungerar :) */
.nbsWindowEmail
{
	position:absolute; 	
	border: 1px solid #999;  /*border: 2px solid black; */
	background-color:white; 
	/*top: 50px;
	left: 50px;
	right: 50px;*/
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	height: 85%;  /* Minskade från 90% för att tabsystemet i NBS ska ha större chans att visas (beror dock på skärmstorlek om det blir så) */
    width: 90%;    
	z-index:6000; 
	/*box-shadow: 4px 4px 3px 0px rgba(0,0,0,0.2);*/ /*Telerik*/
	box-shadow: 0 5px 15px rgba(0,0,0,0.5); /* Bootstrap */
}

@media screen and (min-width: 1400px) {
	.nbsWindowMedium {
		width: 90%;
	}
}

@media screen and (min-width: 1500px) {
	.nbsWindowMedium {
		width: 80%;
	}
}

@media screen and (min-width: 1600px) {
	.nbsWindowMedium {
		width: 75%;
	}
}

@media screen and (min-width: 1900px) {
	.nbsWindowMedium {
		width: 65%;
	}
}

@media screen and (min-width: 2000px) {
	.nbsWindowMedium {
		width: 60%;
	}
}

.nbsWindowMedium {
	position: absolute;
	border: 1px solid #999; /*border: 2px solid black; */
	background-color: white;
	/*top: 50px;
	left: 50px;
	right: 50px;*/
	top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	height: 90%;
	min-width:50%;
	max-width: 90%;
	/*width: 60%;*/
	z-index: 6000;
	/*box-shadow: 4px 4px 3px 0px rgba(0,0,0,0.2);*/ /*Telerik*/
	box-shadow: 0 5px 15px rgba(0,0,0,0.5); /* Bootstrap */
}

.backDropWithScroll {
	overflow-y: auto;
	margin: 45 px auto !important;
	position: absolute;
	top: 0px;
	bottom: 50px;
	left: 0px;
	right: 50px;
	width: 100%;
	height: 100%;
	z-index: 1050;
}


.sf-license-warning 
{
	display:none;
}


/* Lägg in noSpin som klass på parent elementet till en input number för att gömma spinnern (Chrome) */
.noSpin input::-webkit-outer-spin-button,
.noSpin input::-webkit-inner-spin-button 
{
  -webkit-appearance: none;
  margin: 0;
}

/* Lägg in noSpin som klass på parent elementet till en input number för att gömma spinnern (Firefox) */
.noSpin input[type=number] 
{
  -moz-appearance: textfield;
}

 
.k-dateinput .k-dateinput-wrap .k-input, .k-dateinput .k-picker-wrap .k-input, .k-datepicker .k-dateinput-wrap .k-input, .k-datepicker .k-picker-wrap .k-input, .k-datetimepicker .k-dateinput-wrap .k-input, .k-datetimepicker .k-picker-wrap .k-input, .k-timepicker .k-dateinput-wrap .k-input, .k-timepicker .k-picker-wrap .k-input
{
	padding: 4px 0px 4px 4px;
}

.nbsList
{}

.nbsListItem
{
	cursor:default;
	padding: 1px 1px 1px 2px;
}

.nbsListItem:hover
{
	background-color:#E8EBFF
}

.nbsListItemSelected
{
	cursor:default;
	background-color:#BAC4FF;
	padding: 1px 1px 1px 2px;
}

/* Fixar ful pager på telerik gridden (efter uppdateringt till Telerik. 2.15 ?) */
.k-pager-wrap .k-pager-numbers 
{
	padding-left: 0px;    
	margin-bottom: 0px; 
}

/* Tabellhuvud */
.k-grid-header .k-header>.k-link 
{
	margin: -8px -12px;  /* kopierad från teleriks style */
	padding: 8px 0px 8px 10px;	
	line-height: inherit;
	display: block;
	overflow: hidden;
	text-overflow: clip;
	outline: 0;    
}

/* Sorteringspilen i tabellhuvud */
.k-grid-header .k-header>.k-link>.k-icon.k-i-sort-desc-sm, .k-grid-header .k-header>.k-link>.k-icon.k-i-sort-asc-sm 
{
	vertical-align: text-top;
	margin-left: 2px;
}

/* Gör en Mx-komponent så den visas inline istället för på en ny rad */
.MxInline
{
	display:inline;
	margin-left:10px;
	float:none;
	width:unset;
}

hr {
	margin-top: 5px;
	margin-bottom: 5px;
	border-top: 1px solid #dddddd;
}

.DivSelect
{
	cursor:pointer;
}

.DivSelect:hover 
{
	background: #BAC4FF;
}

/* Bakgrundfärg på NBS menyn när man för muspekaren över texten*/
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover 
{
	/*color: #262626;*/
	text-decoration: none;
	background-color: #BAC4FF;
}

/* Bakgrundfärg på menyerna när man för muspekaren över texten*/
.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover 
{
	/*background-color: #BAC4FF;*/
	color: #555;
	background-color: #e7e7e7;
}

.k-datepicker .k-picker-wrap, .k-timepicker .k-picker-wrap, .k-datetimepicker .k-picker-wrap 
{
	border-color: #BBBBAA;     
}

.SameHightAsDatepicker
{
	height:30px !important;
}

.SmallRightPadding
{
	padding-right:20px;
}

.dropdown-menu>li>a 
{
	padding: 3px 20px 3px 10px;    
}

.k-window 
{
	color: #656565;
	background-color: #fff;
	background-clip: padding-box;
	box-shadow: 4px 4px 3px 0px rgba(0,0,0,0.2); /* telerik */
	/*box-shadow: 0 5px 15px rgba(0,0,0,0.5);*/ /* bootstrap, hjälper dock inte eftersom telerk verkar sätta om den */
	/*border: black 1px solid;*/
	border: #999 1px solid; /* bootstrap */
}

.k-window-titlebar 
{
	padding: 8px 8px 6px 12px;
	
}

.k-window-title
{
	font-size:13pt;
}

h4
{
	margin-top: 12px;
	margin-bottom: 6px;
}

.kbi2
{
	width: calc(1.4285714286em + 10px);
	height: calc(1.4285714286em + 10px);
	padding: 4px;
	border-radius: 2px;    
	box-sizing: border-box;
	border-width: 1px;
	border-style: solid;
	font-size: 14px;
	line-height: 1.4285714286;
	font-family: inherit;
	text-align: center;
	text-decoration: none;
	white-space: nowrap;
	display: inline-flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: center;
	justify-content: center;
	vertical-align: middle;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor: pointer;
	outline: none;
	-webkit-appearance: none;
	position: relative;
}

/* Fixar dum egenskap hos telerik som gör att ett modalt fönster lägger sig UNDER ett icke modalt */
.k-window
{
	z-index: 10001; 

	/* fixar bugg som gör att radavstånden är för små i dialoger */
    font-family: unset !important; 
    font-size: unset !important;
    line-height: unset !important;
}

/* Gör texten på disablade tabbar grå så man ser att tabben är disablad */
.k-state-disabled, .k-widget[disabled] 
{
	color: #AAAAAA !important;
}

/* Sätt klassen till nbsHideGroupHeader på en div utanför en telerik gridd med grouping=true för att gömma grupperingsheadern (men behålla funktione för att gruppera via kod)  */
.nbsHideGroupHeader .k-grouping-header
{
	display:none !important;
}


/* Ta bort mellanrumen mellan raderna i rich text editorn när man tycker på enter */
.e-richtexteditor .e-rte-content .e-content p, .e-richtexteditor .e-source-content .e-content p 
{
	margin: 0 0 0px;
	margin-bottom: 0px;
}

.smallbutton
{
	margin-bottom:3px; 
	font-weight:normal; 
	padding: 2px 6px 2px 6px; 
	font-size:10pt;
}

.k-textbox.k-invalid, .k-textbox.k-state-invalid, .k-textbox.ng-invalid.ng-touched, .k-textbox.ng-invalid.ng-dirty, .k-textarea.k-invalid, .k-textarea.k-state-invalid, .k-textarea.ng-invalid.ng-touched, .k-textarea.ng-invalid.ng-dirty, .k-input.k-textbox.k-invalid, .k-input.k-textbox.k-state-invalid, .k-input.k-textbox.ng-invalid.ng-touched, .k-input.k-textbox.ng-invalid.ng-dirty {
	/*border-color: rgba(243,23,0,0.5);*/
	border: 2px solid red;
	color: #f31700;
}

.panel 
{
   margin-bottom: 14px;
}

/* Ta bort spinners på input-number (Chrome, Safari, Edge, Opera) */
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button 
{
  -webkit-appearance: none;
  margin: 0;
}

/* Ta bort spinners på input-number (Firefox) */
input[type=number] 
{
  -moz-appearance: textfield;
}

/* Bootstrap fönster - för att likna Telerik */
.modal-content 
{    
	border-radius: 0px;
}

/* Bootstrap fönster - för att likna Telerik */
.modal-header 
{
	padding: 7px 5px 5px 15px;
	border-bottom: 1px solid #e5e5e5;
	background-color: #8799FF;
	color: white;
}

/* Bootstrap fönster - för att likna Telerik */
.close 
{
	float: right;
	font-size: 21px;
	font-weight: 700;
	line-height: 1;
	color: white;
	text-shadow: none; 
	filter: alpha(opacity=100); 
	opacity: 1;
}

/* Bootstrap fönster - för att likna Telerik */
button.close 
{    
	padding: 3px 8px 3px 8px;
}

button.close:hover
{
	/*color: red;*/
	color: white;
	opacity: 1;
}

.nbsEditor
{
	border:none;  /* Fixen ovan gör iframen 100% av nbsEditor men förskjuten nedåt med toolbarens höjd. Därför sätter vi höjden på nbsEditorn till lite mindre i nbsSetSizeNbsEditor o gömmer bordern*/	
}

.nbsEditor .k-editor-content .k-iframe 
{
	height: 100%;
	width: 100%;
	border: 1px solid;	  /* eftersom vi gömmer borden för nbsEditor så måste vi lägga till en border på iframen */
	border-color: rgba(0,0,0,0.08);
}

.k-form, .k-form-inline 
{
	padding: 5px
}

.tightGrid td 
{
	padding: 2px 7px 2px 7px !important;
}

.paddingBottom25
{
	padding-bottom: 25px;
}

/* Style på kolumnrubrikerna i telerik tabellerna*/
.k-grid-header .k-header 
{
	font-size: 9pt;
	font-weight: bold;
}

/* Tool tip-diven */
div#tipDiv 
{
  position:absolute;
  visibility:hidden;
  left:0;
  top:0;
  z-index:10000;
  background-color:#afbecd;
  filter: alpha(opacity=80);
  border:1px solid #3a6e8f; 
  width:auto;
  padding:3px;
  color:#000000;
  font-size:11px;
  line-height:1.2;
  font-family:Verdana;
  font-weight:bold;
}

 
/*Styles för gruppering i Telerik Tabellen. Tar bort den blå bakgrunden och grupperingskolumnen som vi tyckte gav ett rörigt intryck */

.k-grid .k-grouping-row td
{
}

tbody .k-group-cell
{
	background-color:transparent;
} 

.k-group-footer td, .k-grouping-row td
{	
   background-color: #EAEAEA; 
}

.k-grid .k-grouping-row+tr td 
{
	border-top-width: 0px; 
}

.k-grid .k-group-col 
{
	padding: 0;
	width: 0px;
}

/*Styles för gruppering i Telerik Tabellen - Slut */

.k-grid th, .k-grid td 
{
	text-overflow: clip;
}

/* Styles för NbsTabs, kopierade från k-tabstrip för att lösa bugg 19286 (punkt 1) */
.nbsTabs
{
	border-color: rgba(0,0,0,0.08);
	border-width: 0;    
	color: inherit;
	background-color: transparent;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	border-bottom-width: 1px;
}

.nbsTabsItem 
{
	padding: 5px 8px !important;
	cursor: pointer !important;
}

.PriceplanPicker 
{
	width: 600px;
	height: 550px;
}

.button-center 
{
	text-align: center;
}

/* Tar bort centrering på vissa items. Test 220828 */
/*.container-fluid 
{
    margin-right: unset;
    margin-left: unset; 
}*/


/* Används för knappar på vårt egna fönster som ska likna teleriks */
/* kopierade från motsvaraende .k- klasser */
.nbs-bare 
{
    border-color: transparent !important;
    color: inherit;
    box-shadow: none !important;
    transition: color .2s ease-in-out;	
}

.nbs-icon {
    width: 1em;
    height: 1em;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 16px;
    font-family: "WebComponentsIcons";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    speak: none;
    text-transform: none;
    text-decoration: none;
    display: inline-block;
    vertical-align: middle;
	/*background-color:lightcoral;*/
}

.nbs-button-icon {
    width: calc(1.4285714286em + 10px);
    height: calc(1.4285714286em + 10px);
    padding: 4px;
	/*background-color:yellow;*/
}

.nbs-button-svg {
	/*background-color:yellow;*/
}

.nbs-button:hover
{
	/*color:white;	*/
	background-color: #9BAAFF;	
}

.nbs-button {
	/*background-color:aquamarine;*/
    border-radius: 2px;
    padding: 4px 8px;
    box-sizing: border-box;
    border-width: 1px;
    border-style: solid;
    font-size: 14px;
    line-height: 1.4285714286;
    font-family: inherit;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    outline: none;
    -webkit-appearance: none;
    position: relative;
}

/* Slut på styles för våra egna fönster knappar */

.nowrap {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

/**********************/
/* Till telerikWindow som används påProductEditPopup än så länge */
/* Det ger en fast footer som följer med rutan när den ändrar storlek och har skrollbart innehåll*/
/**********************/
.specialFooterWindow .k-window-content 
{
	overflow-y: hidden !important;
}
.contentWrapper {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 60px;
	top: 0;
	overflow: auto;
	padding: 15px;
}
.WindowFooter {
	position: fixed;
	bottom: 0;
	background: #F8F8F8;
	height: 60px;
	width: 100%;
	right: 1px;
	padding-top: 15px;
	width: 100%;
	text-align: center;
}
/**********************/

/* Används på checkboxar som ligger i NBS Gridden för att inte raderna ska bli för höga o för att centrera dem vertikalt */
.NbsGridCheckbox
{
	margin: 0px !important;
	vertical-align: text-bottom !important;
}

/**********************/
/* To load icons in TelerikContextMenu MenuItem*/
.standardIcon {
	width: 1em;
	height: 1em;
	font-size: 16px;
}
.empty16 {
	background-image: url("icons/empty16.png");
}
.neworder16 {
	background-image: url("icons/neworder16.png");
}
.update16 {
	background-image: url("icons/update16.png");
}
.Minus16 {
	background-image: url("icons/minus16.png");
}
.updatedUpdatepdf-file {
	background-image: url("icons/updatedUpdatepdf-file.png");
}
/*************************************************/

.k-map .k-marker 
{
    color: #0000ff;  /* Defaultfärg på markers på Telerik kart komponenten */
}

.SameTextInputHeightAsDropdown
{
	height: 27px !important;
}

/* Används för rubrik-cellerna i tabellerna på ProductViewPopup */
.M-rebrn
{
	font-size: 11px;
	font-weight: bold;
	padding-right: 16px;
}

.M-rebrn2
{
	font-size: 11px;
	font-weight: normal;
	padding-right: 10px;
}

.M-rebrn3
{
	font-size: 11px;
	font-weight: bold;
	padding-right: 20px;
}

/* Utökar den style som finns i modlas.less och gör att en utgråningen för en bootsrapdialog ser ut som i en Telerik dialog */
.modal-backdrop 
{
	opacity: 0.5;
	background-color: black;
}

/* Gör så att hjälpmenyn på subtabbarna blir större */
.subtabhelpmenu .k-menu-item > .k-in 
{
	padding: 10px 20px !important;
}

/*Ser till så att infotexten på söksidan blir minimerad med ellipsis vid smalt fönster så man får använda tooltip för att läsa*/
@media (max-width: 1200px) {
	#infotextGDPR label, #infotextlimited label{
	max-width: 40px !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
	white-space: nowrap !important;
	}
}