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


/** {
	font-size: 12px;
}*/


body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

a {
    color: black;
    transition: all 0.3s;
}

li.active > a {
    color: white;
}
/*li.active > a:hover {
    color: lightgreen !important;
}*/

a:hover{
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}
a:focus {
    /*color: inherit;*/
    text-decoration: none;
    transition: all 0.3s;
}
.navbar a:hover {
    color: green !important;
}

.navbar {
    padding: 15px 10px;
    background: #fff;
    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;
}

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

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

#sidebarCollapse {
    transition: .2s;
}
#sidebarCollapse:hover {
    background-color: #228B22;
    color: white;
}

/*#sidebarCollapse {
	 background-color :#aecc53;
}*/

#SlideBarAccordion, #SlideBarAccordion2 {
	padding-top: 50px;
	width: 450px; /* inner box - should always be smaller then the #sidebars width*/
}



#sidebar {
    width: 500px;
    position: fixed;
    top: 0;
    left: -500px; /* this is to hide the sidebar, should always correspond to the width */
    height: 100vh;
    z-index: 999;
    background: #228B22;
    color: #fff;
    transition: all 0.3s;
    overflow-y: scroll;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

    #sidebar.active {
        left: 0;
    }

#dismiss {
    width: 75px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background: #228B22;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 3px;
}

    #dismiss:hover {
        background: #fff;
        color: #228B22;
    }

.overlay {
    position: fixed;
    width: 100vw;
    height: 100vh;
    z-index: 998;
    display: none;
}

#sidebar .sidebar-header {
    padding: 20px;
    background: #006400;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #006400;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

    #sidebar ul li a:hover {
        background-color: #228B22;
        border: 0px solid #228B22;
        color: white !important;
    }

#sidebar ul li.active > a, a[aria-expanded="true"] {
    color: #fff;
    background: #006400;
}


a[data-toggle="collapse"] {
    position: relative;
}

a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
    content: '\e259';
    display: block;
    position: absolute;
    right: 20px;
    font-family: 'Glyphicons Halflings';
    font-size: 0.6em;
}

a[aria-expanded="true"]::before {
    content: '\e260';
}


ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: #006400;
}

ul.CTAs {
    padding: 20px;
}

    ul.CTAs a {
        text-align: center;
        font-size: 0.9em !important;
        display: block;
        border-radius: 5px;
        margin-bottom: 5px;
    }

a.download {
    background: #fff;
    color: #228B22;
}

a.article, a.article:hover {
    background: #006400 !important;
    color: #fff !important;
}

#SlideBarAccordion .panel-heading:hover, #SlideBarAccordion2 .panel-heading:hover {
	background-color: #228B22;
	border: 0px solid #228B22;
	color: white;
}

    /* test */

nav .panel {
    border-color: #228B22 !important;
}
    /* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */
 #content {
    width: 100%;
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
    position: absolute;
    top: 0;
    right: 0;
}


/* Visible tables */
.tVisible * {
    border: solid 1px black !important;
    text-align: center !important;
}


/*** Bootstrap generated Search bar adaptations */
input[id*='Grid_DXSE_I'] {
    width: 500px !important;
    text-align: right !important;
    float: right !important;
    /*margin-left: 40% !important;
    margin-bottom: 10px !important;*/
}

.hovGreen {
	padding: 8px;
}

button, .hovGreen {
	transition-duration: 0.3s;
}

button:hover ,.hovGreen:hover{
    background-color: green !important;
    color: white !important;
}

.valbaseGrid > div.card > div.card-body div.input-group {
    display: inline;
}

.decIcon {
	padding: 4px;
	padding-left: 6px;
	padding-right: 6px;
	transition-duration: 0.3s;
	font-size: 16px;
	/*border-radius:2px;*/
}
	.decIcon:hover {
		background-color: #228B22;
		color: white;
		/*transition: padding 2s .5s;*/
		/* padding: 2px solid blue;*/
	}


/*--------------------------------------------------------------
    General utility
--------------------------------------------------------------*/

.mid {
    text-align: center;
}

.fat {
    font-size: larger;
    font-weight: bold; 
}

.white {
	color: white;
}

.round {
	border-radius: 5px;
}


.iconStyle {
	padding: 5px;
}
.iconStyle:hover {
	background: green;
	color: white;
}

.breakTxt {
	word-wrap: break-word; /* IE 5.5-7 */
	white-space: -moz-pre-wrap; /* Firefox 1.0-2.0 */
	white-space: pre-wrap; /* current browsers */
}

/*--------------------------------------------------------------
     Bootstrap override // SweetAlert override
--------------------------------------------------------------*/
.btn-success,.swal-button--confirm {
    background-color: #228B22;
}
	.btn-success:hover, #defaultUpload_UploadButton:hover, #AddProductToDeclaration:hover {
		background-color: #006400;
		-webkit-transition: background-color 200ms linear;
		-ms-transition: background-color 200ms linear;
		transition: background-color 200ms linear;
	}

#defaultUpload_UploadButton, #CreateNewProduct, #AddProductToDeclaration, #productGrid_DXEFL button{
	margin-top: 10px;
	background-color: #228B22;
	padding: 10px 16px;
	font-size: 18px;
	line-height: 1.3333333;
	border-radius: 6px;
	color: #fff;
	text-decoration: none;
}
#productGrid_DXEFL button {
	margin-left:30px;
}
.noTxtDeco {
	text-decoration: none !important;
}
.dxbs-editform {
	padding: 15px;
	border: 1px green solid !important;
	box-shadow: 2px 2px #006400;
}

.eyeIcon {
	text-decoration: none !important;
	text-align: center;
	padding: 8px;
	margin-left: 3px;
}
.circleIcon {
	padding-left: 45%;
	color: #228B22;
}
.fa-file {
	padding-left: 45%;
	color: #228B22;
}



.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
	z-index: 3;
	color: #fff;
	cursor: default;
	background-color: #228B22;
	border-color: #228B22;
}
.pagination > li > a, .pagination > li > span, .pagination > li > a, .pagination > li > span {
    color: #006400;
}

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

.btn-link {
    color: #228B22;
}

*:focus {
    outline: none !important;
}

.panel-default > .panel-heading {
    color: #333;
    background-color: #E2E4E2;
    border-color: #E2E4E2;
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    color: #fff;
    text-decoration: none;
    background-color: #228B22;
    outline: 0;
}

.form-control:focus {
	border-color: #228B22;
	outline: 0 !important;
	box-shadow: inset 0 1px 1px #006400;
}

.noPad {
	padding:0px !important; /* needs to override 'less'*/
}

.dxbs-dropdown-area > li > a:hover {
	background-color: #aecc53; /* Dropdown elements hover = green*/
}

#defaultUpload > div.dxbs-inputs > div:nth-child(1):hover > div > div.input-group-btn > button {
	background-color: #228B22 !important; /* Used in Import product PU browse button hover */
	color: white !important;
}


#defaultUpload > div.dxbs-inputs > div:nth-child(1) > div > div.input-group-btn {
	z-index: 0; /* Used in Import product PU browse button hover */
}



	/*not working
	#defaultUpload > div.dxbs-inputs > div:nth-child(1) > div > div.input-group-btn > button {
		z-index: 100;
	}
	#defaultUpload > div.dxbs-inputs > div:nth-child(1) > div > div.input-group-btn > button:hover {
		background-color: green;
		color:white;
	}*/


#popupAddComponentToProduct div > div.input-group-btn.input-group-addon > span {
	z-index: 100; /* buttons for dropdown in 'Add component to product' not working because of z-index being overriden*/
}


/** Declaration table **/
.tbl {
	border-collapse: inherit;
	table-layout: fixed;
	border-radius: 4px;
	border-spacing: 0px;
	background: white;
}

.decTblHeader {
	height: 30px;
}

.tbl tr {
    height: 40px;
}

.tbl td, .tbl th {
	border: 1px solid #ddd;
	border-left: none;
	text-align: center;
	border-width: 1px 1px 0px 0px; /* makes single lines for each cell*/
}

.tbl td:first-child {
	border-left: 1px solid lightgrey;
}

.tbl tbody tr:first-child td:first-child {
	border-radius: 4px 0 0 0;
}

.tbl tbody tr:first-child td:last-child {
	border-radius: 0 4px 0 0;
}

.tbl tbody tr:last-child td:first-child {
	border-radius: 0 0 0 4px;
}

.tbl tbody tr:last-child td:last-child {
	border-radius: 0 0 4px 0 ;
}
.tbl tbody tr:last-child td {
	border-width: 1px 1px 1px 1px; /* restore bottom border on last line*/
}



/**
    Experimental loader
    **/
.signal {
	border: 5px solid #333;
	border-radius: 30px;
	height: 30px;
	left: 50%;
	margin: -15px 0 0 -15px;
	opacity: 0;
	position: absolute;
	top: 50%;
	width: 30px;
	animation: pulsate 1s ease-out;
	animation-iteration-count: infinite;
}

@keyframes pulsate {
    0% {
        transform: scale(.1);
        opacity: 0.0;
    }

    50% {
        opacity: 1;
    }

    100% {
        transform: scale(1.2);
        opacity: 0;
    }
}



/*--------------------------------------------------------------
     Custom grid view compatibility
--------------------------------------------------------------*/
.disableMouseEvents {
	pointer-events: none;
}
/*.CssClasses(css => { css.DataCell("disableMouseEvents");})*/
.enableMouseEvents {
	pointer-events: auto;
}

.disabled {
	pointer-events: none;
}


.bold {
	font-weight: bold;
}
.high {
	line-height:200%;
}
h2 {
	color: #228B22;
	font-weight: bold;
}
h3, h4, .dxbs-fixed-header-content > a, .dxbs-fixed-header-content > span,
.valbaseGrid th a, .valbaseGrid th span {
	color: #228B22;
}

.modal-title {
	color: #228B22;
	font-size:larger;
}

.dxbs-fixed-header-content:hover > a {
	color: #197019;
}

div.h-icons > button.active > span {
	color: red;
}
/* Make editable cell stand out more */
.editable {
	color: #197019;
	font-weight: bold;
	/*background-color: lightgray;*/
	border: 2px solid #228B22 !important;
	text-align: center;
}

.editable dxgBCTC {
	line-height: 500px;
}
.editable:hover {
	cursor: pointer;
}
/* center all text in grid /Declaration */
#declarationGrid_DXMainTable {
	text-align: center;
}

/*assure line height even if no icon is set in Declaration view*/
.lineHeightGuidance {
	height:40px;
}

td[id^="declarationGridRO_"] {
	/*border: green 3px solid !important;*/
	background-image: linear-gradient(white, #006400);
	border-left: none !important;
}

.dxbs-indent-cell {
	background-image: linear-gradient(white, #006400) !important;
	border-right: none !important;
}

#InvoicesGrid_DXMainTable .dxbs-indent-cell {
	background-image: none !important;
	border-right: solid 1px green !important;
}


.alignR input{
	text-align:right;
}

/***
    needed devExpress compatibility on token and ids
*/
.pkboo {
	display: none !important;
}
/*Workaround stop hide edit form's ComponentID + Token input */
#productGrid_DXEFL_DXEditor7_I, #productGrid_DXEFL_DXEditor8_I {
	display: none;
}
#productGrid_col5 > div > a,
#productGrid_col4 > div > a {
	display: none; /* caption is needed for it to be shown in the details edit view, but should not be visible in the grid itself */
}

/*----------------------- Grid override - not working as devexpress keeps overriding at click out ------------*/
/*.showSubDiv > div:nth-child(2) {
	display: inline !important;
}
.showSubDiv > div:nth-child(1) {
	display: none !important;
}*/
/** Images */
#valorluxLogo {
	display: inline-block;
	height: 25px;
	padding-bottom: 8px;
	border-bottom: 15px;
	margin-bottom: 15px;
	transition: 0.2s;
}

#valorluxLogoInversed {
	display: inline-block;
	height: 30px;
	padding-bottom: 8px;
	border-bottom: 8px;
	margin-bottom: 8px;
}

/** TEMP - used for temporary DeclarationInformation block */
.tempGrid {
	margin: 5px;
	padding-left:15px;
		
}
.tempCell {
	border-left: solid 1px lightgrey;
	border-top: solid 1px lightgrey;
	border-bottom: solid 1px lightgrey;
	border-radius: 5px 0px 0px 5px;
	color: #228B22;
}
.tempCell2 {
	border-right: solid 1px lightgrey;
	border-top: solid 1px lightgrey;
	border-bottom: solid 1px lightgrey;
	border-radius: 0px 5px 5px 0px;
}

.tempRow{
	border-bottom: 20px;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

.valbaseGrid {
	font-size: 12px;
}

.error-icon {
    color: red;
    padding-left: 45%;
}

.iconAdjustDecT {
	padding-right: 10px !important;
	padding-left: 10px !important;
}

.iconAdjustProT {
	padding-right: 8px !important;
	padding-left: 8px !important;
}
/* Modal and spinner */
.modalTarget {
	transition: all 0.5s !important;
}


#modal {
	transition: all 0.5s !important;
	position: fixed !important;
	top: 0 !important;
	left: 0 !important;
	background: rgba(0, 0, 0, 0.4) !important;
	z-index: 99999 !important;
	height: 100% !important;
	width: 100% !important;
}

.modalContent {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: rgba(255, 255, 255, 0.8);
	width: 500px;
	border: 2px green solid;
	padding: 50px;
	border-radius: 5px;
}

#loadingImg {
	position:fixed;
	-webkit-animation: rotation 5s infinite linear;
	height: 80px;
	width: 80px;
}
@-webkit-keyframes rotation {
	from {
		-webkit-transform: rotate(0deg);
	}

	to {
		-webkit-transform: rotate(359deg);
	}
}

#loadingTxt {
	margin-left: 150px;
	color: darkgreen;
}






@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#loadingImg {
		left:40%;
		top:45%;
	}
}


/** Specific elements **/
#protectedProductInfoBox {
	color: red ;
	width: 100%;
	padding: 15px;
	text-align: center;
	border: 1px solid green;
	border-radius: 5px;
	background-color: white;
}

/** popup element placement and adjustments */
.floatLeft {
	float: left;
}
.floatRight {
	float: right;
}
.floatLeft, floatRight {
	border-top:50px;
}

/* Dev elements */
.devTag {
	color: darkred !important;
	border-radius: 8px;
}
	.devTag:hover {
		border-radius: 10px !important;
		background-image: radial-gradient(closest-side, white, white, darkred);
	}


/* Disclaimer bootstrap override */
.navbar-right > .btn-info:hover {
	color: white !important;
}
.navbar-right > .btn-success:hover {
	background-color: green !important;
}


/* Z index adaptation */
.zindexBoost{
	z-index:99 !important;
}

/* index notice conditioning */
.red {
	color: red;
}
.green {
	color: green;
}

/* Used to force devexpress to show its dropdown of a grid that is inside another grid*/
#importGrid .dxbs-details-row>td {
	overflow: visible;
}