@charset "utf-8";

fieldset {
    border: none 0px;
}

.margin-auto {
    margin: 5px auto;
}

h3 {
    text-align: center;
}

h6 {
    text-align: center;
}
.form-control {
    display: inline-block;
    background-color: #a1c2ea;
    color: #000;
    padding: 2px 4px;
    margin: 2px;
    height: 28px;
    vertical-align: top;
    border: none;
    font-size: 18px;
    text-align: right;
}

.tag{
	position:absolute;
	top:5px;
	right:-10px;
	width:auto;
	background-color:#8dc63f;
	height:30px;
	overflow:visible;
		border-bottom-right-radius:15px;
		border-top-right-radius:15px;
		border-bottom-left-radius:5px;
		border-top-left-radius:5px;
		padding-left:20px;
}
.tag span {
    position: relative;top: 5px;
}

.left1{
	float:left;
	width:100%;
	position:relative;
		background-color:#fff;
		border-radius:5px;
		border:1px solid #639fe7;
		overflow:visible;
		height:auto;
		text-align:right;
		padding:50px 20px;
}

.left1 p{
	display:inline-block;
	padding:2px 4px;
	margin:2px;
	/*height:28px;*/
	vertical-align: top;
}

.blueboxes{
	display:inline-block;
	background-color:#a1c2ea;
	color:#000;
	padding:2px 4px;
	margin:2px;
	height:28px;
	vertical-align: top;
	border:none;
}
.blueboxesitalics{
	display:inline-block;
	color:#000;
	padding:2px 25px;
	margin:2px;
	height:28px;
	vertical-align: top;
	border:none;
    font-size: large;
    background-color: #c7daf2;
    text-align: center
}

.blueboxeswidth{
	display:inline-block;
	background-color:#a1c2ea;
	color:#000;
	padding:2px 4px;
	width:340px;
	margin:2px;
	min-height:28px;
	vertical-align: top;
	border:none;
}


.blueboxeswidthitalics{
    text-align: right;
	display:inline-block;
	background-color:#a1c2ea;
	border:none;
	color:black;
	padding:2px 4px;
	width:340px;
	margin:2px;
	height:28px;
	vertical-align: top;
}
.blueboxeswidthitalics.input{
	margin:0;
    width: 100%;
    background-color: #c7daf2;
}

.blueboxeswidthhalf{
	display:inline-block;
	background-color:#a1c2ea;
	color:#000;
	padding:2px 4px;
	width:168px;
	margin:2px;
	/*height:28px;*/
	vertical-align: top;
	border:none;
}

.blueboxesfullwidth{
     text-align: right;
	vertical-align: top;
	display:inline-block;
	background-color:#a1c2ea;
	color:#000;
	padding:2px 4px;
	width:100%;
	border:none;
	margin:2px;
	height:28px;
}
#addnew, #addnewpayment {
    width: 18px;
}
#deleteRow {
    margin-top: 6px;
}

.oneform{
	width:100%;
}
::-webkit-input-placeholder {
	color:#666;
	font-style:italic;
	text-align:right;
}

:-moz-placeholder { /* Firefox 18- */
	color:#666;
	font-style:italic;
	text-align:right;
}

::-moz-placeholder {  /* Firefox 19+ */
	color:#666;
	font-style:italic;
	text-align:right;
}

:-ms-input-placeholder {  
	color:#666;
	font-style:italic;
	text-align:right;
}

.fivecolumns{
	display:inline-block;
	width:15%;
	vertical-align: top;
}

.ui-datepicker-trigger {
	width:20px;
	vertical-align:middle;
	cursor:pointer;
}
		
.date{
	display:inline-block;
	margin:0px 10px;
}

.buttons{
    border: none;
	display:inline-block;
	margin:0px 10%;
	text-align:center;
	cursor:pointer;
	background-color:#639fe7;
	padding:5px 10px;
	margin-top:50px;
}

.buttons img{
    margin: 10px;
}
		
.imgclass{
	color:#666;
	text-align:center;
	float:left;
	padding:40px 20px;
	background-color:#b2b2b2;
	display:inline-block;
	font-style:italic;
}
		
	.ll-skin-nigran {
	font-size: 90%;
}

.ll-skin-nigran .ui-widget {
	font-family: "Helvetica Neue","Trebuchet MS",Tahoma,Verdana,Arial,sans-serif;
	background: #fff;
	border: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	box-shadow: 0 0px 0px #252525;
}

.ll-skin-nigran .ui-datepicker {
	padding: 0;
	width:100%;
	margin:0;
}

.ll-skin-nigran .ui-datepicker-header {
	border: none;
	border-bottom: 1px solid #2d97cb;
	background: transparent;
	font-weight: normal;
	font-size: 11px;
	text-transform: uppercase;
}

.ll-skin-nigran .ui-datepicker-header .ui-state-hover {
	background: transparent;
	border-color: transparent;
	cursor: pointer;
	border-radius: 0;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-title {
	margin-top: 0em;
	margin-bottom: 0em;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-prev-hover,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next-hover,
.ll-skin-nigran .ui-datepicker .ui-datepicker-next,
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev {
	top: 1.7em;
	border:none;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-prev-hover {
	left: 2px;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-next-hover {
	right: 2px;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-next span,
.ll-skin-nigran .ui-datepicker .ui-datepicker-prev span {
	background-image: url(https://raw.githubusercontent.com/rtsinani/jquery-datepicker-skins/master/css/images/ui-icons_454545_256x240.png);
	background-position: -32px -32px;
	margin-top: 0;
	top: -20px;
	font-weight: normal;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-prev span {
	background-position: -96px -32px;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-prev-hover span {
	background-position: -96px -48px;
}

.ll-skin-nigran .ui-datepicker .ui-datepicker-next-hover span {
	background-position: -32px -48px;
}

.ll-skin-nigran .ui-datepicker table {
	margin: 0;
}

.ll-skin-nigran .ui-datepicker th {
	padding: 1em 0;
	color: #000;
	font-size: 8px;
	font-weight: normal;
	text-shadow: 0 0 0px #45c4f8;
	text-transform: uppercase;
	border: none;
	border-top: 0px solid #3fabdc;
}

.ll-skin-nigran .ui-datepicker td {
	border: none;
	padding: 0;
}

.ll-skin-nigran td .ui-state-default {
	background: transparent;
	border: none;
	text-align: center;
	padding: 2px;
	margin: 0;
	font-weight: normal;
	color: #000;
	font-size: 12px;
}

.ll-skin-nigran td .ui-state-active,
.ll-skin-nigran td .ui-state-hover {
	background: #1b7fb0;
	color: #fff;
}

.ui-autocomplete {
    max-height: 200px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
  }
 .ui-menu-divider {
        border: none !important;
        float: right;
        line-height: 8px;
     
    }
  /* IE 6 doesn't support max-height
   * we use height instead, but this forces the menu to always be this tall
   */
  * html .ui-autocomplete {
    height: 200px;
  }
		
@media only screen and (max-width:1100px){

/* MAIN */
	.left1{
		float:left;
		width:100%;
		position:relative;
			background-color:#fff;
			border-radius:5px;
			border:1px solid #639fe7;
			overflow:visible;
			min-height: 360px;
	}
	
	#myChart{
		width:100%;
		height:100%;
		padding:20px;
		padding-top:50px;
	}
		
	.right{
		float:right;
		width:100%;
		position:relative;
			overflow:visible;
			display:inline-block;
			vertical-align:bottom;
			height:360px;
			margin-top:20px;
	}

	.left2{
		float:left;
		width:100%;
		position:relative;
			border-radius:5px;
			overflow:visible;
			height:auto;
	}
		.containerleft{
			float:left;
			width:90%;
			position:relative;
				border-radius:5px;
			margin-left:15px;
		}
		.containermid{
			float:left;
			width:45%;
			margin-left:10px;
			margin-top:10px;
			position:relative;
				border-radius:5px;
		}
		.containerlast{
			float:left;
			width:45%;
			margin-left:10px;
			margin-top:10px;
			position:relative;
				border-radius:5px;
		}
		.contentarea{
	width:100%;
	margin:0 auto 40px;
	overflow:auto;
	background-color:#cad9ec;
	clear:both;
	position:relative;
	margin-top:10px;
	padding:20px;
	/*z-index:999;*/
	text-align:center;
-webkit-box-shadow: 0px 4px 40px -2px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 4px 40px -2px rgba(0,0,0,0.75);
box-shadow: 0px 4px 40px -2px rgba(0,0,0,0.75);
font-size:18px;
}
	.parentfour{
		width:100%;
		background-color:#fff;
		position:relative;
		border-radius:5px;
		overflow:auto;
		height:354px;
		margin-top:60px;
					padding:0px 10px 20px 10px;
	}


		.left3 .fourwaysplit p{
			width:100%;
			margin:0 auto;
			display:block;
			border-right:1px solid #000;
			background-color:#fff;
			padding:10px;
			height:45px;
		}
		.left3 .fourwaysplit p:first-child {
			height:64px;
			background-color:#c1d9f5;
			font-size:18px;
		}

}

.main-pages-container {
    padding: 50px 20px; background-color:#fff; border-radius:5px;
		border:1px solid #639fe7;
		overflow:visible; position: relative;
}

/*extension form export documents*/
.export-document-container {
    display: inline-block;
    float: left;
    margin: 5px;
    

}

.export-element-container {
    margin: 3px 0 0 5px;
    text-align: left; 
}

.error-message {
    float: right;
    font-size: 10pt;
    color: red;
}

.export-body input,
.export-body textarea,
.export-body select,
.export-body table,
.export-body .field-left-container {
    text-align: left;
    direction: ltr !important;
    text-align-last: left !important;
}

.export-body .client-info-container {
    width: 340px;
    float: left;
}

.export-body .document-number-container, 
.export-body #divDealOffersPartial,
.export-body #divDealOffersPartial2  {
    direction: ltr;
}

.export-body #tax-invoice-number-container {
    direction: rtl !important;
}



.export-body .total-payment-field {
    display: inline-block !important;
    direction: ltr;
    float: left;
}

 .export-body input::-webkit-input-placeholder,
 .export-body textarea::-webkit-input-placeholder{
                  text-align:left;
                }
 .export-body input:-moz-placeholder,
 .export-body textarea:-moz-placeholder {
                  text-align:left;
                }
 .export-body input::-moz-placeholder,
 .export-body textarea::-moz-placeholder  {
                  text-align:left;
                }
 .export-body input:-ms-input-placeholder,
 .export-body textarea:-ms-input-placeholder  {
                  text-align:left;
                }

 .export-body .offer-validity-text {
      direction: ltr !important;
 }


 .export-body .offer-extras-textarea {
     width: 920px;
 }

.payment-term-container {
    direction: ltr;
    display: inline-block;
    width: 343px;
    font-size: 14px
}

#relative-date-container {
    text-align: left;
}

#relative-date-container > * {
    display: inline-block;
}

.payment-due-date-container {
    width: 25%;
    direction: ltr;
}

.payment-due-date-container > input {
    direction: rtl;
    width: 100%;
}

.export-body .offer-validity-container {
    float: left;
}

 .document-sign-image-container {
     display: inline-block;
     width: 10%;
     float: right;
 }

.export-body .document-sign-image-container {
     float: left;
     margin-right: 10%;
    
 }

 .document-sign-title {
     text-align: left;  
     float: right; 
     width: 20%;
     margin-top: 25px;
    
 }

 .export-body .document-sign-title {
     float: left;
    
 }

 .document-sign-container {
     width: 100%;
     display: inline-block;
     float: right;
 }

 .export-body .document-sign-container {
     width: 100%;
     float: left;
 }

 .popup-title-email-container {
     margin-top: 80px;
     margin-right: 25%;
 }

.option-grayed { background-color: #fcf8e3; }

.new-doc-send .send-comments {
    resize: vertical;
    height: unset;
}

.new-doc-send .dropzone {
    border: 2px dashed red;
    min-height: 3em !important;
}

.new-doc-send .dropzone > .dz-message {
    margin: 0;
}

.doc-dropzone-title {
    position: relative;
    text-align: left;
    margin-bottom: 5px;
}

.doc-dropzone-icon {
    width: 2.5em;
    position: absolute;
    right: 0;
    z-index: 1;
}