/*---RESET---*/
	html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,
	pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,
	small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,
	form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,
	details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,
	summary,time,mark,audio,video{margin:0;padding:0;border:0;font-family:"tuffyregular";;vertical-align:baseline;}
	article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
	ol,ul{margin:0px;padding:0px;}
	blockquote,q{quotes:none;}
	blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
	table{border-collapse:collapse;border-spacing:0;}

	html{
		height: 100%;
		padding: 0;
		margin:0;
	}

	@font-face {
	    font-family: 'tuffyregular';
	    src: url('http://order.cabitech.co.za/assets/fonts/Tuffy-Regular.ttf') format('truetype');
	    font-weight: normal;
	    font-style: normal;

	}

	body{
		height: 100%;
		width: 100%;
		padding: 0;
		-webkit-touch-callout: none; 
		    -webkit-user-select: none; 
		     -khtml-user-select: none; 
		       -moz-user-select: none; 
		        -ms-user-select: none; 
	}

	input {
	    outline: none;
	}

	button{
		outline: none;
	}

	#mainBackground{
		height: 100%;
		width: 100%;
		padding: 0;
		background-color: gainsboro;
	}
/*---Loading---*/
	#loading {
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    position: fixed;
    display: block;
    z-index: 9999;
    background-color: gainsboro;
	}

	#loading-image {
	    position: absolute;
	    top: 50%;
	    left: 50%;
	    z-index: 100;
	    margin-left: -16px;
    	margin-top: -16px;
	}

	#loadingm {
    width: 450px;
    height: 450px;
    margin-top: 25px;
    left: 0px;
    display: block;
    z-index: 9999;
    background-color: gainsboro;
	}

	#loadingm-image {
	    position: relative;
	    top: 50%;
	    left: 50%;
	    z-index: 1;
	    margin-left: -16px;
    	margin-top: -16px;
	}
/*---NAV---*/
	#logo{
		height: 30px;
		width: 150px;
		margin-left: 25px;
		margin-top:5px; 
		position: relative;
	}

	#headerbacking{
		background-color: white;
		height: 50px;
		width: 100%;
		box-shadow: 0px 5px 20px #888888;
		position: absolute;
	}

	#navmain{
		height: 40px;
		width: 100%;
		position: absolute;
	}

	#navmainmenu{
		width: 950px;
		margin-left: auto;
		margin-right: auto;
		margin-top: -23px;
	    padding-left: 190px;
	}

	#navmainmenu li{
		height: 70px;
		width: 188px;
		float: left;
	}

	#navmainmenu li a{
		text-decoration: none;
		color: black;
	}

	#navhr{
	    display: block;
	    margin-top: 42px;
	    border-style: solid;
	    border-width: 1.5px;
	    border-color:black;
	}
/*---Drop Menu---*/

	.drop_menu{
		width: 135px;
		background-color: white;
		box-shadow: 0px 20px 30px #888888;
		overflow: hidden;
		margin-top: 50px;
	}

	.droplinks{
		float: left;
		height: 25px;
		border: 1px solid lightgrey;
		width: 125px;
		text-decoration: none;
		color: black;
		padding-top: 10px;
		padding-left: 10px;
		cursor: pointer;
	}

	.droplinkstext{
		float:left;
		margin-left: 10px;
	}

	.droplinksimg{
		float:left;
		margin-top: -3px;
	}

	#navside{
		float: right;
		position: absolute;
		right: 10px;
		width: 53px;
		margin-top: -22px;
		cursor: pointer;
	}

	#navside a img{
		float: right;
		display: inline-block;
		padding: 0px 5px 0px 5px;
		height: 24px;
		width:24px;
	}

	#navsalesbuttons{
		cursor: pointer;
	}
/*---Confirm Logout---*/

	.confirmLogout{
    	width:300px;
        height:130px;
        background-color: white;
        border-radius: 10px;
        box-shadow: 0px 5px 20px #888888;
        overflow: hidden;
	}

	#confirmLogoutContainerBar{
        height: 30px;
        width: 300px;
        background-color: white;
        border-bottom: 1px solid lightgrey;
	}

    #confirmLogoutContainerBarTitle{
        color: grey;
        font-size: 1.2em;
        font-weight: lighter;
        margin-top: 2px;
        text-align:center;
	}

	#confirmLogoutContainerBarClose{
	    background: none;
	    border: none;
	    width: 25px;
	    float: right;
	    margin-top: -20px;
	    margin-right: 10px;
	    cursor: pointer;
	}

	#confirmLogoutContainerDiv{
	    margin-left: 20px;
	    margin-top: 20px;
		width: 260px;
	}

	#confirmLogoutImg{
	    width: 48px;
	    float: left;
	}

	#confirmLogoutMessage{
	    width: 187px;
	    float: right;
	}

	#confirmLogoutConfirm{
        background: none;
        border-radius: 10px;
        border: none;
        border: 1px solid lightgrey;
        font-family: inherit;
        float: right;
        margin-top: 17px;
        margin-right: 5px;
        cursor: pointer;
    }

    #confirmLogoutClose{
        background: none;
        border-radius: 10px;
        border: none;
        border: 1px solid lightgrey;
        font-family: inherit;
        float: right;
        margin-top: 17px;
        cursor: pointer;
        margin-right: 5px;
    }
/*---Notifications---*/

	#notificationsAlert{
		height: 15px;
		min-width: 11px;
		border-radius: 8px;
		background-color: red;
		color: white;
		position: absolute;
		margin: -7px;
		font-size: 12px;
		text-align: center;
		padding-left: 2px;
		padding-right: 2px;
		display: none;
	}

	.notifications{
    	width: 250px;
		height: 298px;
		background-color: white;
		border-radius: 10px;
		box-shadow: 0px 5px 20px #888888;
		margin-top: 60px;
		margin-right: 25px;
	}

	#notificationsArrow{
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-bottom: 10px solid white;
		float: right;
		margin-top: -20px;
		height: 10px;
		width: 1px;
		margin-right: 15px;
	}

	#notificationsContainerBar{
        height: 28px;
        width: 250px;
        background-color: white;
        border-bottom: 1px solid lightgrey;
        border-radius: 10px 10px 0px 0px;
	}

    #notificationsContainerBarTitle{
        color: grey;
        font-size: 1.2em;
        font-weight: lighter;
        margin-top: 2px;
        text-align:center;
	}

	#notificationList{
	    width: 228px;
	    height: 243px;
	    background-color: gainsboro;
	    border: 1px solid lightgrey;
	    margin-top: 10px;
	    margin-left: 10px;
	    color: #808080;
	    text-align: center;
	}

	.notificationMessage{
		background-color: white;
		text-align: left;
		border-bottom: 1px solid lightgrey;
		color: black;
		height: 56px;
		position: relative;
	}

	.notificationTime{
		text-align: right;
		font-size: 12px;
		margin-right: 5px;
		color: #808080;
		bottom: 0;
		right: 0;
		position: absolute;
	}
/*---List Extras---*/
	#waypointImg{
		width: 16px;
		margin-left: 122px;
		margin-top: 5px;
	}

	.selectedList{
		background-color: gainsboro;	 
	}
/*---Settings---*/
	/*---Upload Button---*/
		.button-wrapper {
			position: relative;
			width: 16px;
			text-align: center;
			float: right;
			margin-right: 11px;
			margin-top: 2px;
		}

		.button-wrapper span.label {
			position: relative;
			z-index: 0;
			display: inline-block;
			width: 100%;
			cursor: pointer;
			color: #fff;
		}

		#upload {
		    display: inline-block;
		    position: absolute;
		    z-index: 1;
		    width: 100%;
		    height: 50px;
		    top: 0;
		    left: 0;
		    opacity: 0;
		    cursor: pointer;
		}
	/*---Checkbox---*/
		.round {
		  position: relative;
		  float:right;
		  margin-top: -20px;
		}

		.round label {
		  background-color: #fff;
		  border: 1px solid #ccc;
		  border-radius: 50%;
		  cursor: pointer;
		  height: 16px;
		  left: 0;
		  position: absolute;
		  top: 0;
		  width: 16px;
		}

		.round label:after {
		  border: 2px solid #fff;
		  border-top: none;
		  border-right: none;
		  content: "";
		  height: 3px;
		  left: 3px;
		  opacity: 0;
		  position: absolute;
		  top: 5px;
		  transform: rotate(-45deg);
		  width: 9px;
		}

		.round input[type="radio"] {
		  visibility: hidden;
		}

		.round input[type="radio"]:checked + label {
		  background-color: #808080;
		  border-color: #cdcdcd;
		}

		.round input[type="radio"]:checked + label:after {
		  opacity: 1;
		}
	/*---Settings Container---*/

		#settingscontainersidebar{
			margin: 20px 0px 20px 20px;
			display: block;
			overflow: hidden;
			float: left;
			height: 544px;
			width: 260px;
			bottom: 0;
			left: auto;
			right: auto;
			border: 1px solid lightgrey;
			border-radius: 10px;
			background-color:gainsboro;
		}

		#settingscontainermain{
			margin: 20px 0px 0px 20px;
			overflow: hidden;
			float: left;
			height: 544px;
			width: 680px;
			bottom: 0;
			left: auto;
			right: auto;
			border: 1px solid lightgrey;
			border-radius: 10px;
			background-color: gainsboro;
		}

		#settingscontainersidebarframe{
			width: 277px;
			height: 100%;
		}


		#settingscontainermainframe{
			width: 697px;
			height: calc(100% + 17px);
		}

		.settingsContainer{
			width: 1004px;
			height: 620px;
			background-color: white;
			border-radius:10px;
			box-shadow: 0px 5px 20px #888888;
			overflow: hidden;
			margin-top: 20px;
		}

		#settingsBar{
			height:30px;
			width:1004px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
		}

		#settingsBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
			width: 1004px;
		}

		#settingsBarClose{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: -18px;
			margin-right: 10px;
			cursor:pointer;
		}

		#settingsButtonCancel{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 16px;
		}

		#settingsButtonCancel:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 16px;
		}

		#settingsButtonApply{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 3px;
		    display: none; 
		}
		#settingsButtonApply:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 3px;
		    display: none; 
		}
	/*---Setting Lists---*/
		#settingsPageTitleBar{
			width: 260px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
		}

		#settingsPageTitleText{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			margin-left: auto;
			margin-right: auto;
			width: 64px;
		}

		#settingsPageTitleSpacer{
			width: 260px;
			height: 30px;
		}

		.settingsListPageButtonTitle{
			background-color: white;
			width: 260px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			cursor: pointer;
		}

		.settingsListPageButtonTitle a{
			position: absolute;
			margin: 5px;
		}

		.settingsListPageButton{
			width: 260px;
			height: 30px;
			border: none;
			border-bottom:1px solid lightgrey;
			background-color: whitesmoke;
			cursor: pointer;
		}

		.settingsListPageViewButton{
		    border-left: 5px solid transparent;
		    border-right: 5px solid transparent;
		    float: right;
		    margin-right: 8px;
		    cursor: pointer;
		}

		.settingsListPagedropDown{
			width: 260px;
			height: 30px;
			border:none;
			border-bottom: 1px solid lightgrey;
			cursor: pointer;
			background-color: whitesmoke;
		}
	/*---Company Info---*/
		#companyInfomationPageTitleBar{
			width: 680px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
		}

		#companyInfomationPageTitleText{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#companyInfomationPageTitleSpacer{
			width: 680px;
			height: 30px;
		}

		#companyInfomationPageBusinessInfoBox{
			margin-top: 5px;
			margin-right: 5px; 
			width: 680px;
			height: 257px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			float: left;
		}

		#companyInfomationPageBusinessAddressBox{
			margin-top: 5px;
			margin-right: 5px; 
			width: 680px;
			height: 311px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			float: left;
		}

		#companyInfomationPageInvoicingDetailsBox{
			margin-top: 5px;
			width: 680px;
			height: 300px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			float: left;
		}

		#companyInfomationPageAccountDetailsBox{
			margin-top: 5px;
			width: 680px;
			height: 117px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			float: left;
		}

		#companyInfomationPageBusinessInfoTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		.companyInfomationPageBusinessInfoInputTitle{
			margin-left: 10px;
			width: 320px;
			float: left;
		}

		.companyInfomationPageBusinessInfoInput{
			width: 656px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			margin-left: 10px;
		}

		#companyInfomationPagePhoneLeft{
			float: left;
			width: 335px;
			margin-left: 10px;
		}

		#companyInfomationPagePhoneRight{
			float: left;
		    width: 325px;
		}

		.companyInfomationPageBusinessInfoInputHalf{
		    width: 321px;
		    height: 30px;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    float: left;
		}

		.companyInfomationPageBusinessInfoInputTitleHalf{
		    float: left;
		}

		#companyInfomationPageBusinessAddressTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		.companyInfomationPageBusinessAddressInputTitle{
			margin-left: 10px;
			width: 320px;
			float: left;
		}

		.companyInfomationPageBusinessAddressInput{
			width: 656px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			margin-left: 10px;
		}

		#companyInfomationPageInvoicingDetailsTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		.companyInfomationPageBankingDetailsInputTitle{
			margin-left: 10px;
			width: 300px;
			float: left;
		}

		#companyInfomationPageBankingDetailsBox{
			float:left;
			width: 347px;
		}

		.companyInfomationPageBankingDetailsAccountInput{
			width: 325px;
			height: 30px;
			border: 1px solid lightgray;
			border-radius: 5px;
			margin-left: 10px;
		}

		#companyInfomationPageTaxDetailsBox{
			float:left;
			width: 325px;
		}

		.companyInfomationPageTaxDetailsInputTitle{
			width: 320px;
			float: left;
		}

		#companyInfomationPageCurrencyDropdown{
			font-size: 10px;
		    position: relative;
		    display: inline-block;
		    float: right;
		    border: 1px solid lightgray;
		    width: 325px;
		    border-radius: 5px;
		    height: 28px;
		}

		#companyInfomationPageCurrencyDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 325px;
			height: 27px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;
			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#companyInfomationPageCurrencyDropdown .arr {
			background: #fff;
			position: absolute;
			right: 5px;
			width: 50px;
			pointer-events: none;
		}

		#companyInfomationPageCurrencyDropdown .arr:before {
			content: '';
			position: absolute;
			top: 50%;
			right: 0px;
			margin-top: 12px;
			pointer-events: none;
			border-top: 5px solid black;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
		}

		#companyInfomationPageCurrencyDropdown .arr:after {
			content: '';
			position: absolute;
			top: 50%;
			right: 28px;
			margin-top: -5px;
			pointer-events: none;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
		}

		#companyInfomationPageTaxDropdown{
			font-size: 10px;
		    position: relative;
		    display: inline-block;
		    float: right;
		    border: 1px solid lightgray;
		    width: 325px;
		    border-radius: 5px;
		    height: 28px;
		}

		#companyInfomationPageTaxDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 325px;
			height: 27px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;
			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#companyInfomationPageTaxDropdown .arr {
			background: #fff;
			position: absolute;
			right: 5px;
			width: 50px;
			pointer-events: none;
		}

		#companyInfomationPageTaxDropdown .arr:before {
			content: '';
			position: absolute;
			top: 50%;
			right: 0px;
			margin-top: 12px;
			pointer-events: none;
			border-top: 5px solid black;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
		}

		#companyInfomationPageTaxDropdown .arr:after {
			content: '';
			position: absolute;
			top: 50%;
			right: 28px;
			margin-top: -5px;
			pointer-events: none;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
		}

		.companyInfomationPageTaxDetailsInput{
			width: 325px;
			height: 30px;
			border: 1px solid lightgray;
			border-radius: 5px;
		}

		#companyInfomationPageDeliveryDropdown{
			font-size: 10px;
			position: relative;
			display: inline-block;
			float: left;
			border: 1px solid lightgray;
			width: 660px;
			border-radius: 5px;
			height: 28px;
			margin-left: 10px;
		}

		#companyInfomationPageDeliveryDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 325px;
			height: 27px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;
			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#companyInfomationPageDeliveryDropdown .arr {
			background: #fff;
			position: absolute;
			right: 5px;
			width: 50px;
			pointer-events: none;
		}

		#companyInfomationPageDeliveryDropdown .arr:before {
			content: '';
			position: absolute;
			top: 50%;
			right: 0px;
			margin-top: 12px;
			pointer-events: none;
			border-top: 5px solid black;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
		}

		#companyInfomationPageDeliveryDropdown .arr:after {
			content: '';
			position: absolute;
			top: 50%;
			right: 28px;
			margin-top: -5px;
			pointer-events: none;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
		}

		#companyInfomationPageAccountDetailsTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		#companyInfomationPageChangeEmail{
			float: left;
		    height: 30px;
		    width: 325px;
		    background: none;
		    border: none;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background-color: gainsboro;
		    margin-top: 20px;
		    margin-left: 10px;
		    cursor: pointer;
		}

		#companyInfomationPageChangeEmail:hover{
			float: left;
		    height: 30px;
		    width: 325px;
		    background: none;
		    border: none;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background-color: whitesmoke;
		    margin-top: 20px;
		    margin-left: 10px;
		    cursor: pointer;
		}

		#companyInfomationPageChangePassword{
			float: left;
		    height: 30px;
		    width: 325px;
		    background: none;
		    border: none;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background-color: gainsboro;
		    margin-top: 20px;
		    margin-left: 10px;
		    cursor: pointer;
		}

		#companyInfomationPageChangePassword:hover{
			float: left;
		    height: 30px;
		    width: 325px;
		    background: none;
		    border: none;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background-color: whitesmoke;
		    margin-top: 20px;
		    margin-left: 10px;
		    cursor: pointer;
		}

		.errorInfo{
			float: right;
			width: 21px;
			color: red;
			display: none;
		}
	/*---Change Email---*/
		.changeEmail{
	    	width:340px;
	        height:165px;
	        background-color: white;
	        border-radius: 10px;
	        box-shadow: 0px 5px 20px #888888;
	        overflow: hidden;
		}

		#changeEmailContainerBar{
	        height: 30px;
	        width: 340px;
	        background-color: white;
	        border-bottom: 1px solid lightgrey;
		}

	    #changeEmailContainerBarTitle{
	        color: grey;
	        font-size: 1.2em;
	        font-weight: lighter;
	        margin-top: 2px;
	        text-align:center;
		}

		#changeEmailContainerBarClose{
		    background: none;
		    border: none;
		    width: 25px;
		    float: right;
		    margin-top: -20px;
		    margin-right: 10px;
		    cursor: pointer;
		}

		#changeEmailContainerDiv{
		    margin-left: 20px;
			width: 300px;
		}


		.changeEmailInputTitle{
			width: 320px;
			float: left;
		}

		.changeEmailInput{
			width: 296px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
		}


		#changeEmailConfirm{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	    }

	    #changeEmailConfirm:hover{
	        background: gainsboro;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	    }

	    #changeEmailClose{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	        margin-right: 5px;
	    }

	    #changeEmailClose:hover{
	        background: gainsboro;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	        margin-right: 5px;
	    }
	/*---Change Password---*/
		.changePassword{
	    	width:340px;
	        height:219px;
	        background-color: white;
	        border-radius: 10px;
	        box-shadow: 0px 5px 20px #888888;
	        overflow: hidden;
		}

		#changePasswordContainerBar{
	        height: 30px;
	        width: 340px;
	        background-color: white;
	        border-bottom: 1px solid lightgrey;
		}

	    #changePasswordContainerBarTitle{
	        color: grey;
	        font-size: 1.2em;
	        font-weight: lighter;
	        margin-top: 2px;
	        text-align:center;
		}

		#changePasswordContainerBarClose{
		    background: none;
		    border: none;
		    width: 25px;
		    float: right;
		    margin-top: -20px;
		    margin-right: 10px;
		    cursor: pointer;
		}

		#changePasswordContainerDiv{
		    margin-left: 20px;
			width: 300px;
		}


		.changePasswordInputTitle{
			width: 320px;
			float: left;
		}

		.changePasswordInput{
			width: 296px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
		}


		#changePasswordConfirm{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	    }

	    #changePasswordConfirm:hover{
	        background: gainsboro;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	    }

	    #changePasswordClose{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	        margin-right: 5px;
	    }

	    #changePasswordClose:hover{
	        background: gainsboro;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 4px;
	        cursor: pointer;
	        margin-right: 5px;
	    }
	/*---Add Note---*/
			.addNote{
		    	width:500px;
		        height:300px;
		        background-color: white;
		        border-radius: 10px;
		        box-shadow: 0px 5px 20px #888888;
		        overflow: hidden;
			}

			#addNoteContainerBar{
		        height: 30px;
		        width: 500px;
		        background-color: white;
		        border-bottom: 1px solid lightgrey;
			}

		    #addNoteContainerBarTitle{
		        color: grey;
		        font-size: 1.2em;
		        font-weight: lighter;
		        margin-top: 2px;
		        text-align:center;
			}

			#addNoteContainerBarClose{
			    background: none;
			    border: none;
			    width: 25px;
			    float: right;
			    margin-top: -20px;
			    margin-right: 10px;
			    cursor: pointer;
			}

			#addNoteContainerDiv{
			    margin-left: 20px;
				width: 462px;
			}

			#addNoteInputText{
				height: 19px;
			}

			#addNoteInput{
				resize: none;
				width: 458px;
				height: 224px;
				border: 1px solid lightgray;
				outline: none;
			}


			#addNoteConfirm{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 1px;
		        cursor: pointer;
		    }

		    #addNoteConfirm:hover{
		        background: gainsboro;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 1px;
		        cursor: pointer;
		    }

		    #addNoteClose{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 1px;
		        cursor: pointer;
		        margin-right: 5px;
		    }

		    #addNoteClose:hover{
		        background: gainsboro;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 1px;
		        cursor: pointer;
		        margin-right: 5px;
		    }
	/*---Branding---*/
		#brandingPageTitleBar{
			height:30px;
			width:680px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			position: fixed;
			z-index: 1;
			
		}

		#brandingPageTitleText{
			color: #808080;
			font-size: 1.2em;
			font-weight: lighter; 
			padding-top: 2px;
			text-align: center;
		}

		#brandingPageTitleSpacer{
			height:31px;
		}

		#brandingClientsBox{
			height: 381px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 5px;
			border-bottom: 1px solid lightgrey;
		}

		#brandingClientsTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		#brandingClientsColoursLeft{
			width: 345px;
			float: left;
		}

		#brandingClientsColoursRight{
			width: 336px;
			float: left;
		}

		.brandingColourText{
			width: 180px;
			float: left;
			margin-left: 10px;
		}
		
		.brandingText{
			width: 180px;
			float: left;
		}


		#brandingChooseColour{
			border: none;
			background: none;
			float: right;
			margin-top: 2px;
			cursor: pointer;
			width: 25px;
			margin-right: 10px;
			cursor: pointer;
		}

		.brandingColoursInput1{
			width: 325px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			margin-left: 10px;
			background: none;
			color: black;
		}

		.brandingColoursInput2{
			width: 325px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			background: none;
			color: black;
		}

		.brandingColourPreview{
			height: 29px;
			width: 30px;
			float: right;
			margin-right: 11px;
			margin-top: -29px;
			border-radius: 0px 5px 5px 0px;
			border-left: 1px solid lightgrey;
		}

		#brandingLogoboxLeft{
			float: left;
			width: 345px;
			height: 161px;
		}

		#brandingLogoboxRight{
			float: left;
			width: 220px;
			height: 130px;
			margin-top: 23px;
		}

		#brandingLogobox{
			float: left;
			width: 345px
		}

		#brandingLogoText{
			float: left;
			margin-left: 10px;
			position: absolute;
		}

		#addLogoFileSelect{
			margin-left: 10px;
			margin-top: 5px;
		}

		#brandingpreviewImg{
			width: 323px;
			height: 136px;
			border: 1px solid lightgrey;
			background-color: gainsboro;
			margin-top: 21px;
			margin-left: 10px;
		}

		.thumbspan{
			min-width: 318px;
			height: 136px;
			text-align: center;
			vertical-align: middle;
		}

		#brandingpreviewImgText{
			text-align: center;
			padding: 59px 0px;
		}

		.brandingLogoInput{
			width: 325px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			background: none;
			color: black;
		}

		#brandingAdminBox{
			height: 266px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 5px;
			border-bottom: 1px solid lightgrey;
		}

		#brandingAdminTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		#brandingThemebox{
			float: left;
			width: 670px;
			margin-left: 10px;
		}

		.brandingThemeboxs{
			float: left;
			border: 1px solid lightgrey;
			width: 211px;
			height: 107px;
			margin-right: 10px;
		}

		.ic {
			display: inline-block;
			position: relative;
			font: 12px arial;
		}

		.suffix {
			position: absolute;
			left: 0;
			top: 8px;
			color: #000;
			padding-left: 5px;
			font: inherit;
		}
	/*---Colour Picker---*/
			.colourPicker{
				width:385px;
				height: 550px;
				background-color: white;
				border-radius:10px;
				box-shadow: 0px 5px 20px #888888;
				overflow: hidden;
				margin-top: 20px;
			}

			#colourPickerBar{
				height:30px;
				width:385px;
				background-color: white;
				border-bottom: 1px solid lightgrey; 
			}

			#colourPickerBarTitle{
				color: #808080;
				font-size: 1.2em;
				font-weight: lighter; 
				margin-top: 2px;
				text-align: center;
				width: 385px;
			}

			#colourPickerBarClose{
				background:none;
				border:none;
				width: 25px;
				float:right;
				margin-top: -18px;
				margin-right: 10px;
				cursor:pointer;
			}

			#colourPickerOptions{
				margin: 20px 20px 0px 20px;
			}

			#colourPickerOutput{
				height: 20px;
				width: 342px;
				border: 1px solid lightgrey;
				margin-left: 1px;
				margin-top: 19px;

			}

			.colourPickerOutputOptions{
				width: 309px;
				border: 1px solid lightgrey;
				height: 19px;
				margin-top: 20px;
			}

			.colourPickerTable{
				table-layout: fixed;
				width: 332px;
				margin-top: 20px;
				margin-left: 12px;
			}

			.colourPickerTableTitle{
				width: 20px;
				text-align: center;
			}

			.colourPickerOutputOptionsSmall{
				width: 87px;
				border: 1px solid lightgrey;
				height: 19px;
			}

			.panel{
				width: 346px;
			}

			#colourPickerButtonSave:Hover{
				background: gainsboro;
				border-radius: 10px;
				border: none;
				border: 1px solid lightgrey;
				font-family: inherit;
				float: right;
				margin-top: 2px;
				height: 16px;
				cursor: pointer;
				margin-right: 20px;
			}

			#colourPickerButtonSave{
			    background: none;
				border-radius: 10px;
				border: none;
				border: 1px solid lightgrey;
				font-family: inherit;
				float: right;
				margin-top: 2px;
				height: 16px;
				cursor: pointer;
				margin-right: 20px;
			}

			#colourPickerButtonCancel{
			    background: none;
				border-radius: 10px;
				border: none;
				border: 1px solid lightgrey;
				font-family: inherit;
				float: right;
				margin-top: 2px;
				height: 16px;
				cursor: pointer;
				margin-right: 5px;
			}

			#colourPickerButtonCancel:hover{
				background: gainsboro;
				border-radius: 10px;
				border: none;
				border: 1px solid lightgrey;
				font-family: inherit;
				float: right;
				margin-top: 2px;
				height: 16px;
				cursor: pointer;
				margin-right: 5px;
			}
	/*---Quotations---*/
		#quotationsPageTitleBar{
		    height:30px;
		    width:680px;
		    background-color: white;
		    border-bottom: 1px solid lightgrey;
		    position: fixed;
		    z-index: 1;
		}

		#quotationsPagePreview{
		    border: none;
		    background: none;
		    float: left;
		    margin-top: 7px;
		    cursor: pointer;
		    width: 25px;
		}

		#quotationsPageTitleText{
		    color: #808080;
		    font-size: 1.2em;
		    font-weight: lighter; 
		    padding-top: 2px;
		    text-align: center;
		}

		#quotationsPageTitleSpacer{
		    height:31px;
		}

		#quotationsInfoBox{
		    height: 604px;
		    background-color: white;
		    border-top: 1px solid lightgrey;
		    margin-top: 5px;
		    border-bottom: 1px solid lightgrey;
		}

		#quotationsInfoTitle{
		    width: 680px;
		    height: 27px;
		    border-bottom: 1px solid lightgrey;
		    color: #808080;
		    font-size: 1.2em;
		    margin-top: 3px;
		    padding-left: 2px;
		}

		#quotationsInfoLeft{
		    width: 345px;
		    float: left;
		}

		#quotationsInfoRight{
		    width: 336px;
		    float: left;
		}

		.quotationsInfoText1{
		    width: 180px;
		    float: left;
		    margin-left: 10px;
		}

		.quotationsInfoText2{
		    width: 180px;
		    float: left;
		}


		#quotationsChooseColour{
		    border: none;
		    background: none;
		    float: right;
		    margin-top: 2px;
		    cursor: pointer;
		    width: 25px;
		    margin-right: 10px;
		    cursor: pointer;
		}

		.quotationsColoursInput1{
		    width: 325px;
		    height: 30px;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    margin-left: 10px;
		    background: none;
		    color: black;
		}

		.quotationsColoursInput2{
		    width: 325px;
		    height: 30px;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background: none;
		    color: black;
		}

		.quotationsColourPreview{
		    height: 29px;
		    width: 30px;
		    float: right;
		    margin-right: 11px;
		    margin-top: -29px;
		    border-radius: 0px 5px 5px 0px;
		    border-left: 1px solid lightgrey;
		}

		#quotationsExpiryDropdown{
		    font-size: 10px;
		    position: relative;
		    display: inline-block;
		    float: left;
		    border: 1px solid lightgray;
		    width: 323px;
		    border-radius: 5px;
		    height: 28px;
		    margin-left: 10px;
		}

		#quotationsExpiryDropdown select {
		    outline: none;
		    -webkit-appearance: none;
		    -moz-appearance:none;
		    display: block;
		    margin: 0;
		    width: 323px;
		    height: 27px;
		    transition: border-color 0.2s;
		    border: none;
		    border-radius: 5px;
		    background: #fff;
		    color: black;
		    line-height: normal;
		    font-family: inherit;
		    font-size: 12px;
		    line-height: inherit;
		    cursor: pointer;
		}

		#quotationsExpiryDropdown .arr {
		    background: #fff;
		    position: absolute;
		    right: 5px;
		    width: 50px;
		    pointer-events: none;
		}

		#quotationsExpiryDropdown .arr:before {
		    content: '';
		    position: absolute;
		    top: 50%;
		    right: 0px;
		    margin-top: 12px;
		    pointer-events: none;
		    border-top: 5px solid black;
		    border-left: 5px solid transparent;
		    border-right: 5px solid transparent;
		}

		#quotationsExpiryDropdown .arr:after {
		    content: '';
		    position: absolute;
		    top: 50%;
		    right: 28px;
		    margin-top: -5px;
		    pointer-events: none;
		    border-left: 6px solid transparent;
		    border-right: 6px solid transparent;
		}

		#quotationsLogoboxLeft{
		    float: left;
		    width: 345px;
		    height: 161px;
		}

		#quotationsLogoboxRight{
		    float: left;
		    width: 220px;
		    height: 130px;
		    margin-top: 23px;
		}

		#quotationsLogobox{
		    float: left;
		    width: 345px
		}

		#quotationsLogoText{
		    float: left;
		    margin-left: 10px;
		    position: absolute;
		}

		#addLogoFileSelect{
		    margin-left: 10px;
		    margin-top: 5px;
		}

		#quotationspreviewImg{
		    width: 323px;
		    height: 136px;
		    border: 1px solid lightgrey;
		    background-color: gainsboro;
		    margin-top: 21px;
		    margin-left: 10px;
		}

		.thumbspan{
		    min-width: 318px;
		    height: 136px;
		    text-align: center;
		    vertical-align: middle;
		}

		#quotationspreviewImgText{
		    text-align: center;
		    padding: 59px 0px;
		}

		.quotationsLogoInput{
		    width: 325px;
		    height: 30px;
		    border: 1px solid lightgrey;
		    border-radius: 5px;
		    background: none;
		    color: black;
		}

		#quotationsThemebox{
			float: left;
			width: 670px;
			margin-left: 10px;
		}

		.quotationsThemeboxs{
			float: left;
			border: 1px solid lightgrey;
			width: 211px;
			height: 280px;
			margin-right: 10px;
		}

		#quotationsNoteBox{
		    height: 289px;
		    background-color: white;
		    border-top: 1px solid lightgrey;
		    margin-top: 5px;
		    border-bottom: 1px solid lightgrey;
		}

		#quotationsNotesAdd{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 7px;
		    cursor: pointer;
		    width: 25px;
		    margin-left: 5px;
		}

		#quotationsNoteContainer{
			width: 658px;
			height: 200px;
			background-color: gainsboro;
			border: 1px solid lightgrey;
			margin-left: 10px;
			margin-top: 30px;
			overflow: hidden;
		}

		#quotationsNoteContainerInner{
			width: 700px;
			height: 207px;
			margin-top: -1px;
			overflow-y: scroll;
		}

		.quotationsNoteBox{
			background: white;
			width: 658px;
		}

		.quotationsNoteRemove{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: 5px;
			margin-right: 5px;
			cursor:pointer;
		}

		.quotationsNoteRemoveBox{
			width: 658px;
		}

		.quotationsNoteText{
			padding: 20px;
			border-bottom: 1px solid lightgrey;
			border-top: 1px solid lightgrey;
			margin-bottom: 5px;
		}
	/*---Invoices---*/
		#invoicesPageTitleBar{
			height:30px;
			width:680px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			position: fixed;
			z-index: 1;
			
		}

		#invoicesPagePreview{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#invoicesPageTitleText{
			color: #808080;
			font-size: 1.2em;
			font-weight: lighter; 
			padding-top: 2px;
			text-align: center;
		}

		#invoicesPageTitleSpacer{
			height:31px;
		}

		#invoicesClientsBox{
			height: 390px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 5px;
			border-bottom: 1px solid lightgrey;
		}

		#invoicesClientsTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		#invoicesClientsColoursLeft{
			width: 340px;
			float: left;
		}

		#invoicesClientsColoursRight{
			width: 340px;
			float: left;
		}

		.invoicesColourText{
			width: 120px;
			float: left;
			margin-left: 10px;
		}

		#invoicesChooseColour{
			border: none;
			background: none;
			float: right;
			margin-top: 2px;
			cursor: pointer;
			width: 25px;
			margin-right: 10px;
			cursor: pointer;
		}

		.invoicesColoursInput{
			width: 320px;
			height: 30px;
			border: 1px solid lightgrey;
			border-radius: 5px;
			margin-left: 10px;
			background: none;
		}

		.invoicesColourPreview{
			height: 29px;
			width: 30px;
			float: right;
			margin-right: 11px;
			margin-top: -29px;
			border-radius: 0px 5px 5px 0px;
		}

		#invoicesLogoboxLeft{
			float: left;
			width: 340px;
			height: 170px;
		}

		#invoicesLogoboxRight{
			float: left;
			width: 220px;
			height: 130px;
			margin-top: 23px;
		}

		#invoicesLogoText{
			float: left;
			margin-left: 10px;
		}

		#addLogoFileSelect{
			margin-left: 10px;
			margin-top: 5px;
		}

		#invoicespreviewImg{
			width: 317px;
			height: 136px;
			border: 1px solid lightgrey;
			background-color: gainsboro;
			margin-top: 4px;
			margin-left: 10px;
		}

		#invoicespreviewImgText{
			text-align: center;
    		padding: 59px 0px;
		}

		#invoicesInfoBox{
			height: 290px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 5px;
			border-bottom: 1px solid lightgrey;
		}

		#invoicesInfoTitle{
			width: 680px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		#invoicesThemebox{
			float: left;
			width: 670px;
			margin-left: 10px;
		}

		.invoicesThemeboxs{
			float: left;
			border: 1px solid lightgrey;
			width: 211px;
			height: 107px;
			margin-right: 10px;
		}

		#invoicesNotesAdd{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 7px;
		    cursor: pointer;
		    width: 25px;
		    margin-left: 5px;
		}

		#invoicesNoteContainer{
			width: 658px;
			height: 200px;
			background-color: gainsboro;
			border: 1px solid lightgrey;
			margin-left: 10px;
			margin-top: 30px;
		}
	/*---Materials---*/
		#materialPageBackground{
			width: 680px;
			height: 507px;
			background-color: white;
			margin-top: 6px;
			border-top: 1px solid lightgrey; 
		}

		#materialListBar{
			height:30px;
			width:680px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
			position: absolute;
		}

		#materialBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#materialPageTitleSpacer{
			height: 30px;
		}


		#materialPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#materialPageSearchInput{
			width:120px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#materialPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
		}

		#materialPageDropdown{
			font-size: 10px;
			position: relative;
			display: inline-block;
			float: right;
			margin-right: 5px;

		}

		#materialPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#materialPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		}

		#materialPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#materialPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#materialPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		#materialAddItem{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 7px;
		    cursor: pointer;
		    width: 25px;
		    margin-left: -4px;
		}

		#materialPageContainer{
			float: left;
			width: 668px;
			background-color: gainsboro;
			margin-left: 5px;
			border: 1px solid lightgrey;
			height: 470px;
		}

		.thumbgallery{
			float: left;
			border: 1px solid white;
		}

		.thumbgalleryimage{
			width: 86px;
			height: 86px;
			float: left;
			display: block;
			cursor: pointer;
		}

		.selected{
			width: 86px;
			height: 86px;
			float: left;
			display: block;
			border: 1px solid maroon;
			cursor: pointer;
		}

		.brandbar{
			width: 663px;
			height: 20px;
			background-color:white;
			color:#808080;
			padding-left: 5px;

		}

		.brandcontainer{
			display: flow-root;
			width:264px;
		}
		/*---Add Material---*/
			.addMaterials{
		    	width:580px;
		        height:341px;
		        background-color: white;
		        border-radius: 10px;
		        box-shadow: 0px 5px 20px #888888;
		        overflow: hidden;
			}

			#addMaterialContainerBar{
		        height: 30px;
		        width: 580px;
		        background-color: white;
		        border-bottom: 1px solid lightgrey;
			}

		    #addMaterialContainerBarTitle{
		        color: grey;
		        font-size: 1.2em;
		        font-weight: lighter;
		        margin-top: 2px;
		        text-align:center;
			}

			#addMaterialContainerBarClose{
			    background: none;
			    border: none;
			    width: 25px;
			    float: right;
			    margin-top: -20px;
			    margin-right: 10px;
			    cursor: pointer;
			}

			#addMaterialContainerDiv{
			    margin-left: 20px;
				width: 600px;
			}

			#addMaterialContainerDivLeft{
				width: 260px;
				float: left;
			}

			#addMaterialContainerDivRight{
			    margin-left: 20px;
				width: 280px;
				float: left;
			}

			#previewImg{
				width: 260px;
				height: 260px;
				border: 1px solid lightgrey;
				background-color: gainsboro;
				margin-top: 22px;
			}

			#previewImgText{
				text-align: center;
    			padding: 120px 0px;
			}

			.thumb{
				width: 260px;
				height: 260px;
			}

			.pricelistItemAdd{
				width:252px;
			}

			#addMaterialConfirm{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		        margin-right: 18px;
		    }

		    #addMaterialClose{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		        margin-right: 5px;
		    }

		    #addMaterialPageDropdown{
				font-size: 10px;
				position: relative;
				display: inline-block;
				float: right;
				height: 22px;
				width: 258px;
				border: 1px solid lightgray;

			}

			#addMaterialPageDropdown select {
				outline: none;
				-webkit-appearance: none;
				-moz-appearance:none;
				display: block;
				margin: 0;
				width: 258px;
				height: 22px;
				transition: border-color 0.2s;
				border: none;
				border-radius: 5px;

				background: #fff;
				color: black;
				line-height: normal;
				font-family: inherit;
				font-size: 12px;
				line-height: inherit;
				cursor: pointer;
			}

			#addMaterialPageDropdown .arr {
			  background: #fff;
			  position: absolute;
			  right: 5px;
			  width: 50px;
			  pointer-events: none;
			  margin-top: -3px;
			}

			#addMaterialPageDropdown .arr:before {
			  content: '';
			  position: absolute;
			  top: 50%;
			  right: 0px;
			  margin-top: 12px;
			  pointer-events: none;
			  border-top: 5px solid black;
			  border-left: 5px solid transparent;
			  border-right: 5px solid transparent;
			}

			#addMaterialPageDropdown .arr:after {
			  content: '';
			  position: absolute;
			  top: 50%;
			  right: 28px;
			  margin-top: -5px;
			  pointer-events: none;
			  border-left: 6px solid transparent;
			  border-right: 6px solid transparent;
			}


			#addMaterialPageStatusSelect{
				width: 200px;
				height: 30px;
				float: left;
			}

			#addMaterialtext{
				width: 60px;
			    float: left;
			}

			#addMaterialFileSelect{
				float: right;
				width: 100px;
				margin-top: 3px;
				margin-right: 20px
			}
		/*---Add Brand---*/
			.addBrand{
		    	width:300px;
		        height:100px;
		        background-color: white;
		        border-radius: 10px;
		        box-shadow: 0px 5px 20px #888888;
		        overflow: hidden;
			}

			#addBrandContainerBar{
		        height: 30px;
		        width: 300px;
		        background-color: white;
		        border-bottom: 1px solid lightgrey;
			}

		    #addBrandContainerBarTitle{
		        color: grey;
		        font-size: 1.2em;
		        font-weight: lighter;
		        margin-top: 2px;
		        text-align:center;
			}

			#addBrandContainerBarClose{
			    background: none;
			    border: none;
			    width: 25px;
			    float: right;
			    margin-top: -20px;
			    margin-right: 10px;
			    cursor: pointer;
			}

			#addBrandContainerDiv{
			    margin-left: 20px;
				width: 260px;
			}

			#addMaterialsAddBrand{
				border: none;
			    background: none;
			    float: right;
			    margin-top: 7px;
			    cursor: pointer;
			    width: 25px;
			}

			.addMaterialsText{
				float: left;
			}

			#addBrandLogoutImg{
			    width: 48px;
			    float: left;
			}

			#addBrandInput{
				width: 252px;
			}

			#confirmLogoutMessage{
			    width: 187px;
			    float: right;
			}

			#addBrandConfirm{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		    }

		    #addBrandClose{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		        margin-right: 5px;
		    }
	/*---Price List---*/

				#pricelistPageBackground{
					width: 680px;
					height: 507px;
					background-color: white;
					margin-top: 6px;
					border-top: 1px solid lightgrey; 
				}

				#pricelistBar{
					height:30px;
					width:680px;
					background-color: white;
					border-bottom: 1px solid lightgrey; 
					position: absolute;
				}

				#pricelistBarTitle{
					color: grey;
					font-size: 1.2em;
					font-weight: lighter; 
					margin-top: 2px;
					text-align: center;
				}

				#priceListPageTitleSpacer{
					height: 30px;
				}


				#pricelistPageSearchInputBox{
					width: 250px;
					height: 20px;
					border: 1px solid lightgrey;
					border-radius: 10px;
					margin: 4px 0px 0px 5px;
					float: left;
				}

				#pricelistPageSearchInput{
					width:220px;
					border: none;
					height: 19px;
					margin-left: 10px;
				}

				#pricelistPageSearchInputImg{
					float: right;
					margin: 2px 4px 0px 0px;
					width: 15px;
					height: 15px;
				}

				#pricelistPageDropdown{
					font-size: 10px;
					position: relative;
					display: inline-block;
					float: right;
					margin-right: 5px;

				}

				#pricelistPageDropdown select {
					outline: none;
					-webkit-appearance: none;
					-moz-appearance:none;
					display: block;
					margin: 0;
					width: 120px;
					height: 30px;
					transition: border-color 0.2s;
					border: none;
					border-radius: 5px;

					background: #fff;
					color: black;
					line-height: normal;
					font-family: inherit;
					font-size: 12px;
					line-height: inherit;
					cursor: pointer;
				}

				#pricelistPageDropdown .arr {
				  background: #fff;
				  position: absolute;
				  right: 5px;
				  width: 50px;
				  pointer-events: none;
				}

				#pricelistPageDropdown .arr:before {
				  content: '';
				  position: absolute;
				  top: 50%;
				  right: 0px;
				  margin-top: 12px;
				  pointer-events: none;
				  border-top: 5px solid black;
				  border-left: 5px solid transparent;
				  border-right: 5px solid transparent;
				}

				#pricelistPageDropdown .arr:after {
				  content: '';
				  position: absolute;
				  top: 50%;
				  right: 28px;
				  margin-top: -5px;
				  pointer-events: none;
				  border-left: 6px solid transparent;
				  border-right: 6px solid transparent;
				}


				#pricelistPageStatusSelect{
					width: 200px;
					height: 30px;
					float: left;
				}

				#pricelistBarClose{
					background:none;
					border:none;
					width: 25px;
					float:right;
					margin-top: -18px;
					margin-right: 10px;
					cursor:pointer;
				}

				#pricelistAddItem{
					border: none;
				    background: none;
				    float: left;
				    margin-top: 7px;
				    cursor: pointer;
				    width: 25px;
				    margin-left: -4px;
				}


				.pricelistPageTableHeadings{
					table-layout: fixed;
					border: 2px solid lightgrey;
					cursor: pointer;
				}

				.pricelistPageSort{
					height: 5px;
				    border-left: 5px solid transparent;
				    border-right: 5px solid transparent;
				    float: right;
				    margin-right: 5px;
				}

				#pricelistPageTable{
					width: 670px;
					height: 20px;
					background-color: white;
					border-bottom: 1px solid lightgrey;
					table-layout: fixed;
					margin-left:5px;
					margin-top:20px;
				}

				#pricelistPageContainer{
					width: 668px;
					background-color: gainsboro;
					table-layout: fixed;
					margin-left: 5px;
					height: 447px;
					border-left:1px solid lightgrey;
					border-right:1px solid lightgrey;
					border-bottom:1px solid lightgrey;
					overflow: hidden;
				}
				#pricelistPageList{
					table-layout: fixed;
					width: 680px;
					background-color: white;
				}

				#priceListPageitemCode{
					width: 100px;
				}

				#priceListPageDescription{
					width: 412px;
				}

				#pricelistPagePrice{
					width: 150px;
				}

				.pricelistTitleBox{
					width: 670px;
					height: 30px;
					border-bottom: 1px solid lightgrey;
					background-color: whitesmoke;
					cursor: pointer;
				}

				.pricelistTitleBoxText{
					padding-left: 10px;
					padding-top: 5px; 
					width: 100px;
					float: left;
				}

				.pricelistPageTitleBoxArrow{
					height: 5px;
					border-left: 5px solid transparent;
					border-right: 5px solid transparent;
					float: right;
					margin-right: 7px;
				}

				.priceListPagecode{
					width: 102px;
					border-right:1px solid lightgrey;
					border-bottom: 1px solid lightgrey;
					text-align: center;

				}
				
				.priceListPagedescription{
					width: 413px;
					border-right:1px solid lightgrey;
					border-bottom: 1px solid lightgrey;
					text-align: center;
				}

				.priceListPageprice{
					width: 152px;
					border-right:1px solid lightgrey;
					border-bottom: 1px solid lightgrey;
					text-align: center;
				}				
		/*---Pricelist Items---*/

			.pricelistItem{
		    	width:300px;
		        height:315px;
		        background-color: white;
		        border-radius: 10px;
		        box-shadow: 0px 5px 20px #888888;
		        overflow: hidden;
			}

			#pricelistItemContainerBar{
		        height: 30px;
		        width: 300px;
		        background-color: white;
		        border-bottom: 1px solid lightgrey;
			}

		    #priceListItemContainerBarTitle{
		        color: grey;
		        font-size: 1.2em;
		        font-weight: lighter;
		        margin-top: 2px;
		        text-align:center;
			}

			#pricelistItemContainerBarClose{
			    background: none;
			    border: none;
			    width: 25px;
			    float: right;
			    margin-top: -20px;
			    margin-right: 10px;
			    cursor: pointer;
			}

			#pricelistItemContainerDiv{
			    margin-left: 20px;
				width: 260px;
			}

			.pricelistItemAdd{
				width:252px;
			}

			#pricelistItemConfirm{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		    }

		    #pricelistItemClose{
		        background: none;
		        border-radius: 10px;
		        border: none;
		        border: 1px solid lightgrey;
		        font-family: inherit;
		        float: right;
		        margin-top: 4px;
		        cursor: pointer;
		        margin-right: 5px;
		    }
	/*---Board Layout---*/
		#boardLayouteInfoBox{
			margin-top: 5px; 
			width: 930px;
			height: 300px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			float: left;
		}

		#boardLayoutInfoTitle{
			width: 930px;
			height: 27px;
			border-bottom: 1px solid lightgrey;
			color: #808080;
			font-size: 1.2em;
			margin-top: 3px;
			padding-left: 2px;
		}

		.boardLayoutInfoInputTitle{
			margin-left: 10px
		}

		.boardLayoutOptions{
			width: 302px;
			height: 280px;
			float: left;
		}

		.boardLayoutOptionsCentre{
			width: 308px;
			height: 280px;
			float: left;
			border-right: 1px solid lightgrey;
			border-left: 1px solid lightgrey;
		}

		.boardLayoutInfoDefaultTitle{
			color: #808080;
			margin-top: 2px;
		}

		#boardLayoutBladeWidth{
			width: 60px;
			position: absolute;
			border: 1px solid lightgrey;
			margin-left: 125px;
			margin-top: 53px;
		}

		#boardLayoutBladeWidthImg{
			width: 200px;
			margin: 60px 55px;
			height: 100px;
		}

		#boardLayoutInfoLeft{
			width: 154px;
			float: left;
		}

		#boardLayoutInfoRight{
			width: 154px;
			float: left;
		}

		#boardLayoutTrimWidth{
			width: 60px;
			position: absolute;
			border: 1px solid lightgrey;
			margin-left: 135px;
			margin-top: 13px;
		}

		#boardLayoutTrimHeight{
			width: 60px;
			position: absolute;
			border: 1px solid lightgrey;
			margin-left: 45px;
			margin-top: 110px;
		}

		#boardLayoutTrimImg{
			margin: 20px 80px 0px 90px;
		}
	/*---Cabitech Invoices---*/
		#cabitechInvoicesPageTitleBar{
			width: 680px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
		}

		#cabitechInvoicesPageTitleText{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#cabitechInvoicesPageTitleSpacer{
			width: 680px;
			height: 30px;
		}

		#cabitechInvoicesPrint{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#cabitechInvoicesPreview{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#cabitechInvoicesPageBackground{
			width: 680px;
			height: 507px;
			background-color: white;
			margin-top: 6px;
			border-top: 1px solid lightgrey; 
		}

		#cabitechInvoicesPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#cabitechInvoicesPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#cabitechInvoicesPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
			height: 15px;
		}

		#cabitechInvoicesPageDropdown{
			font-size: 10px;
			position: relative;
			display: inline-block;
			float: right;
			margin-right: 5px;

		}

		#cabitechInvoicesPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#cabitechInvoicesPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		}

		#cabitechInvoicesPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#cabitechInvoicesPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}

		#cabitechInvoicesPageTable{
			width: 670px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
			margin-left:5px;
			margin-top:20px;
		}

		#cabitechInvoicesPageContainer{
			width: 668px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: 447px;
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		#cabitechInvoicesPageContainerInner{
			width: 700px;
			height: 448px;
			overflow-y: scroll;
		}

		#cabitechInvoicesPageList{
			width: 667px;
			table-layout: fixed;
		}

		.cabitechInvoicesPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.cabitechInvoicesPageSort{
			height: 5px;
		    border-left: 5px solid transparent;
		    border-right: 5px solid transparent;
		    float: right;
		    margin-right: 5px;
		}

		.cabitechInvoicesTable{
			background-color: white; 
		}

		#cabitechInvoicesPageNo{
			width: 110px;
		}

		#cabitechInvoicesPagedate{
			width: 149px;
		}

		#cabitechInvoicesPagedue{
			width: 149px;
		}

		#cabitechInvoicesPageamount{
			width: 140px;
		}

		#cabitechInvoicesPagestatus{
			width: 110px;
		}

		.cabitechInvoicesPageno{
			width: 111px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.cabitechInvoicesPagedate{
			width: 150px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.cabitechInvoicesPagedue{
			width: 150px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.cabitechInvoicesPageamount{
			width: 141px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.cabitechInvoicesPagestatus{
			width: 112px;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}
	/*---Term of Service---*/
		#termsPageTitleBar{
			width: 680px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
		}

		#termsPageTitleText{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#termsPageTitleSpacer{
			width: 680px;
			height: 30px;
		}

    	.termsBackgound{
    		background: white;
			margin-top: 5px;
			border-top: 1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			padding: 10px;
			text-align: justify;
    	}

    	.i1{
    		padding-left: 20px; 
    		display:block;
    	}

    	.i2{
    		padding-left: 40px; 
    		display:block;
    	}

    	.i3{
    		padding-left: 60px; 
    		display:block;
    	}

    	.i4{
    		padding-left: 80px; 
    		display:block;
    	}

    	.n1{
    		width: 34px;
			display: inline-block;
    	}

    	.n2{
    		width: 46px;
			display: inline-block;
    	}

    	.n3{
    		width: 58px;
			display: inline-block;
    	}

    	.n4{
    		width: 70px;
			display: inline-block;
    	}
    /*---About---*/
    	#aboutPageTitleBar{
			width: 680px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
		}

		#aboutPageTitleText{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#aboutPageTitleSpacer{
			width: 680px;
			height: 30px;
		}

    	#aboutPageInfo{
    		background-color: white;
			height: 309px;
			border-bottom: 1px solid lightgrey;
			margin-top: 6px;
			border-top: 1px solid lightgrey;
			width: 680px;
    	}

    	#aboutPageBrowser{
    		background-color: white;
			height: 198px;
			margin-top: 5px;
			border-top: 1px solid lightgrey;
			width: 680px;
    	}

    	#aboutPageBrowserText{
    		text-align: center;
    	}

    	.aboutPageBrowserbox{
    		width: 20%;
    		float: left;
    		display: block;
			text-align: center;
			margin-top: 16px;
    	}

    	#aboutPageInfoLogo{
    		height: 190px;
			width: 120px;
			margin-right: auto;
			margin-left: auto;
    	}

    	#aboutPageInfoLogoImg{
    		width: 200px;
    	}

    	#aboutPageInfoText{
    		text-align: center;
    	}
    /*---Apply Settings---*/

		.applySettings{
	    	width:300px;
	        height:130px;
	        background-color: white;
	        border-radius: 10px;
	        box-shadow: 0px 5px 20px #888888;
	        overflow: hidden;
		}

		#applySettingsContainerBar{
	        height: 30px;
	        width: 300px;
	        background-color: white;
	        border-bottom: 1px solid lightgrey;
		}

	    #applySettingsContainerBarTitle{
	        color: grey;
	        font-size: 1.2em;
	        font-weight: lighter;
	        margin-top: 2px;
	        text-align:center;
		}

		#applySettingsContainerBarClose{
		    background: none;
		    border: none;
		    width: 25px;
		    float: right;
		    margin-top: -20px;
		    margin-right: 10px;
		    cursor: pointer;
		}

		#applySettingsContainerDiv{
		    margin-left: 20px;
		    margin-top: 20px;
			width: 260px;
		}

		#applySettingsImg{
		    width: 48px;
		    float: left;
		}

		#applySettingsMessage{
		    width: 187px;
		    float: right;
		}

		#applySettingsConfirm{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 17px;
	        margin-right: 5px;
	        cursor: pointer;
	    }

	    #applySettingsClose{
	        background: none;
	        border-radius: 10px;
	        border: none;
	        border: 1px solid lightgrey;
	        font-family: inherit;
	        float: right;
	        margin-top: 17px;
	        cursor: pointer;
	        margin-right: 5px;
	    }
/*---Admin---*/
	/*---Admin Container---*/
		#admincontainer{
			width:1250px;
			background-color: white;
			margin-left: auto;
			margin-right: auto;
			box-shadow: 0px 5px 20px #888888;
			height: 100%;
		}

		#adminontainerspacer{
			width: 1250px;
			height: 50px;
		}

		#admincontainersidebar{
			margin:20px 950px 20px 20px;
			display: block;
			position:absolute;
			overflow: hidden;
			float: left;
			height:auto;
			width: 260px;
			bottom:0;
			top:50px;
			left:auto;
			right:auto;
			border: 1px solid lightgrey;
			border-radius: 10px;
			background-color: gainsboro;
		}

		#admincontainermain{
			margin:20px 20px 20px 300px;
			display: block;
			position:absolute;
			overflow: hidden;
			float: left;
			height:auto;
			width: 930px;
			bottom:0;
			top:50px;
			left:auto;
			right:auto;
			border: 1px solid lightgrey;
			border-radius: 10px;
			background-color: gainsboro;
		}

		#admincontainersidebarframe{
			width: 277px;
			height: 100%;
		}


		#admincontainermainframe{
			width: 947px;
			height: calc(100% + 17px);
		}
	/*---Overview List---*/

		#overviewPageTitleBar{
			width: 260px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			position: fixed;
			z-index: 1;
		}

		.overviewListPageButton{
			width: 260px;
			height: 40px;
			border:none;
			border-bottom: 1px solid lightgrey;
			background-color: white;
			cursor: pointer;
		}	

		#overviewPageTitleText{
			color: #808080;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			margin-left: auto;
			margin-right: auto;
			width: 74px;
		}

		.overviewListPagedropDown{
				width: 260px;
			height: 30px;
			border:none;
			border-bottom: 1px solid lightgrey;
			cursor: pointer;
			background-color: whitesmoke;
		}

		#overviewPageTitleSpacer{
			width: 260px;
			height: 30px;
		}

		.overviewListPageButtonTitle{
			background-color: white;
			width: 260px;
			height: 30px;
			border-bottom: 1px solid lightgrey;
			cursor: pointer;
		}

		.overviewListPageButtonTitle a{
			position: absolute;
			margin: 5px;
		}

		.overviewListPageButton{
			width: 260px;
			height: 30px;
			border: none;
			border-bottom:1px solid lightgrey;
			background-color: whitesmoke;
			cursor: pointer;
		}

		.overviewsListPageViewButton{
			height: 1px;
		    border-left: 5px solid transparent;
		    border-right: 5px solid transparent;
		    float: right;
		    margin-right: 8px;
		    cursor: pointer;
		}
/*---Order Info---*/

		#ordernav{
			height:30px;
			width:930px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			position: fixed;
			z-index: 1;
			
		}

		#orderTitle{
			color: #808080;
			font-size: 1.2em;
			font-weight: lighter; 
			padding-top: 2px;
			text-align: center;
		}

		#orderTitleSpacer{
			height:31px;
		}

		#newOrder{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#editOrder{
			border: none;
			background: none;
			float: left;
			margin-top: 8px;
			cursor: pointer;
			width: 25px;
		}

		#printOrder{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#previewOrder{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}
    /*---Quotation Info---*/

		#quotationnav{
			height:30px;
			width:930px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			position: fixed;
			z-index: 1;
			
		}

		#quotationTitle{
			color: #808080;
			font-size: 1.2em;
			font-weight: lighter; 
			padding-top: 2px;
			text-align: center;
		}

		#quotationTitleSpacer{
			height:31px;
		}

		#newQuotation{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#editQuotation{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#printQuotation{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}

		#previewQuotation{
			border: none;
			background: none;
			float: left;
			margin-top: 7px;
			cursor: pointer;
			width: 25px;
		}
/*---Orders---*/
	/*---Doors Orders---*/
		#doorOrdersPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#doorOrdersPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#doorOrdersPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#doorOrdersPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#doorOrdersPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#doorOrdersPageDropdown{
		font-size: 10px;
		position: relative;
		display: inline-block;
		float: right;

		}

		#doorOrdersPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#doorOrdersPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#doorOrdersPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#doorOrdersPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#doorOrdersPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.doorOrdersPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.doorOrdersPageTableHeadings a {
			margin-left:13px;
		}
		

		#doorOrdersPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.doorOrdersPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#doorOrdersPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.doorOrdersPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.doorOrdersPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.doorOrdersPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.doorOrdersPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#doorOrdersPageorderNo{
			width: 148px;
		}

		#doorOrdersPageDate{
			width: 148px;
		}

		#doorOrdersPagedateItems{
			width: 148px;
		}

		#doorOrdersPageClient{
			width: 316px;
		}

		#doorOrdersPageStatus{
			width: 148px;
		}

		#doorOrdersPageList{
			width: 918px;
			background-color: white; 
		}

		.doorOrderNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.doorOrderDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorOrderItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorOrderClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorOrderStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
	/*---Doors Quotations---*/
		#doorQuotationsPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#doorQuotationsPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#doorQuotationsPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#doorQuotationsPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#doorQuotationsPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#doorQuotationsPageDropdown{
			font-size: 10px;
			position: relative;
			display: inline-block;
			float: right;
		}

		#doorQuotationsPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#doorQuotationsPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#doorQuotationsPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#doorQuotationsPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#doorQuotationsPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.doorQuotationsPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.doorQuotationsPageTableHeadings a {
			margin-left:13px;
		}
		

		#doorQuotationsPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.doorQuotationsPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#doorQuotationsPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.doorQuotationsPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.doorQuotationsPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.doorQuotationsPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.doorQuotationsPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#doorQuotationsPageorderNo{
			width: 148px;
		}

		#doorQuotationsPageDate{
			width: 148px;
		}

		#doorQuotationsPagedateItems{
			width: 148px;
		}

		#doorQuotationsPageClient{
			width: 316px;
		}

		#doorQuotationsPageStatus{
			width: 148px;
		}

		#doorQuotationsPageList{
			width: 918px;
			background-color: white; 
		}

		.doorQuotationNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.doorQuotationDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorQuotationItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorQuotationClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.doorQuotationStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
	/*---Boards Orders---*/
		#boardOrdersPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#boardOrdersPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#boardOrdersPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#boardOrdersPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#boardOrdersPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#boardOrdersPageDropdown{
		font-size: 10px;
		position: relative;
		display: inline-block;
		float: right;

		}

		#boardOrdersPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#boardOrdersPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#boardOrdersPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#boardOrdersPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#boardOrdersPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.boardOrdersPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.boardOrdersPageTableHeadings a {
			margin-left:13px;
		}
		

		#boardOrdersPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.boardOrdersPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#boardOrdersPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.boardOrdersPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.boardOrdersPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.boardOrdersPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.boardOrdersPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#boardOrdersPageorderNo{
			width: 148px;
		}

		#boardOrdersPageDate{
			width: 148px;
		}

		#boardOrdersPagedateItems{
			width: 148px;
		}

		#boardOrdersPageClient{
			width: 316px;
		}

		#boardOrdersPageStatus{
			width: 148px;
		}

		#boardOrdersPageList{
			width: 918px;
			background-color: white; 
		}

		.boardOrderNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.boardOrderDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardOrderItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardOrderClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardOrderStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
	/*---Boards Quotations---*/
		#boardQuotationsPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#boardQuotationsPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#boardQuotationsPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#boardQuotationsPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#boardQuotationsPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#boardQuotationsPageDropdown{
		font-size: 10px;
		position: relative;
		display: inline-block;
		float: right;

		}

		#boardQuotationsPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#boardQuotationsPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#boardQuotationsPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#boardQuotationsPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#boardQuotationsPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.boardQuotationsPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.boardQuotationsPageTableHeadings a {
			margin-left:13px;
		}
		

		#boardQuotationsPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.boardQuotationsPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#boardQuotationsPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.boardQuotationsPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.boardQuotationsPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.boardQuotationsPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.boardQuotationsPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#boardQuotationsPageorderNo{
			width: 148px;
		}

		#boardQuotationsPageDate{
			width: 148px;
		}

		#boardQuotationsPagedateItems{
			width: 148px;
		}

		#boardQuotationsPageClient{
			width: 316px;
		}

		#boardQuotationsPageStatus{
			width: 148px;
		}

		#boardQuotationsPageList{
			width: 918px;
			background-color: white; 
		}

		.boardQuotationNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.boardQuotationDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardQuotationItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardQuotationClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.boardQuotationStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
	/*---Curves Orders---*/
		#curveOrdersPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#curveOrdersPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#curveOrdersPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#curveOrdersPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#curveOrdersPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#curveOrdersPageDropdown{
		font-size: 10px;
		position: relative;
		display: inline-block;
		float: right;

		}

		#curveOrdersPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#curveOrdersPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#curveOrdersPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#curveOrdersPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#curveOrdersPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.curveOrdersPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.curveOrdersPageTableHeadings a {
			margin-left:13px;
		}
		

		#curveOrdersPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.curveOrdersPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#curveOrdersPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.curveOrdersPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.curveOrdersPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.curveOrdersPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.curveOrdersPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#curveOrdersPageorderNo{
			width: 148px;
		}

		#curveOrdersPageDate{
			width: 148px;
		}

		#curveOrdersPagedateItems{
			width: 148px;
		}

		#curveOrdersPageClient{
			width: 316px;
		}

		#curveOrdersPageStatus{
			width: 148px;
		}

		#curveOrdersPageList{
			width: 918px;
			background-color: white; 
		}

		.curveOrderNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.curveOrderDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveOrderItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveOrderClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveOrderStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
	/*---Curves Quotations---*/
		#curveQuotationsPageTitleSpacer{
			width: 930px;
			height: 30px;
		}

		#curveQuotationsPageSearchInputBox{
			width: 250px;
			height: 20px;
			border: 1px solid lightgrey;
			border-radius: 10px;
			margin: 4px 0px 0px 5px;
			float: left;
		}

		#curveQuotationsPage{
			height: calc(100% - 36px);
			width: 930px;
			background-color: white;
			border-top: 1px solid lightgrey;
			margin-top: 6px;
		}

		#curveQuotationsPageSearchInput{
			width:220px;
			border: none;
			height: 19px;
			margin-left: 10px;
		}

		#curveQuotationsPageSearchInputImg{
			float: right;
			margin: 2px 4px 0px 0px;
			width: 15px;
		}

		#curveQuotationsPageDropdown{
		font-size: 10px;
		position: relative;
		display: inline-block;
		float: right;

		}

		#curveQuotationsPageDropdown select {
			outline: none;
			-webkit-appearance: none;
			-moz-appearance:none;
			display: block;
			margin: 0;
			width: 120px;
			height: 30px;
			transition: border-color 0.2s;
			border: none;
			border-radius: 5px;

			background: #fff;
			color: black;
			line-height: normal;
			font-family: inherit;
			font-size: 12px;
			line-height: inherit;
			cursor: pointer;
		}

		#curveQuotationsPageDropdown .arr {
		  background: #fff;
		  position: absolute;
		  right: 5px;
		  width: 50px;
		  pointer-events: none;
		  margin-right: 7px;
		}

		#curveQuotationsPageDropdown .arr:before {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 0px;
		  margin-top: 12px;
		  pointer-events: none;
		  border-top: 5px solid black;
		  border-left: 5px solid transparent;
		  border-right: 5px solid transparent;
		}

		#curveQuotationsPageDropdown .arr:after {
		  content: '';
		  position: absolute;
		  top: 50%;
		  right: 28px;
		  margin-top: -5px;
		  pointer-events: none;
		  border-left: 6px solid transparent;
		  border-right: 6px solid transparent;
		}


		#curveQuotationsPageStatusSelect{
			width: 200px;
			height: 30px;
			float: left;
		}

		.curveQuotationsPageTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
		}

		.curveQuotationsPageTableHeadings a {
			margin-left:13px;
		}
		

		#curveQuotationsPageTable{
			width: 920px;
			border-top: 2px solid lightgrey;
			table-layout: fixed;
			margin-left: 5px;
		}

		.curveQuotationsPageSort{
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 5px;
		
		}

		#curveQuotationsPageContainer{
			width: 918px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 5px;
			height: calc(100% - 78px);
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		.curveQuotationsPageClientTitle{
			width: 920px;
			height: 25px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
		}

		.curveQuotationsPageClientTitle a{
			font-size: 18px;
			margin-left: 5px;
		}

		.curveQuotationsPageViewButton{
			
			height: 5px;
			border-left: 5px solid transparent;
			border-right: 5px solid transparent;
			float: right;
			margin-right: 8px;
			cursor: pointer;
		}

		.curveQuotationsPageClientTable{
			width: 920px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
		}

		#curveQuotationsPageorderNo{
			width: 148px;
		}

		#curveQuotationsPageDate{
			width: 148px;
		}

		#curveQuotationsPagedateItems{
			width: 148px;
		}

		#curveQuotationsPageClient{
			width: 316px;
		}

		#curveQuotationsPageStatus{
			width: 148px;
		}

		#curveQuotationsPageList{
			width: 918px;
			background-color: white; 
		}

		.curveQuotationNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.curveQuotationDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveQuotationItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveQuotationClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.curveQuotationStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}
/*---Order Overlays---*/
	/*---View Order---*/
		.viewOrderContainer{
			width: 880px;
			height: 603px;
			background-color: white;
			border-radius:10px;
			box-shadow: 0px 5px 20px #888888;
			overflow: hidden;
			margin-top: 20px;
		}

		#viewOrderBar{
			height:30px;
			width:880px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
		}

		#viewOrderBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#viewOrderBarClose{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: -18px;
			margin-right: 10px;
			cursor:pointer;
		}

		#viewOrderButtonBox{
			margin-left: 14px;
		}

		#viewOrderAddItem{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 2px;
		    cursor: pointer;
		    width: 25px;
		}


		.viewOrdersTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
			text-align: center;
		}


		#viewOrdersTable{
			width: 840px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
			margin-left:20px;
			margin-top:20px;
		}

		#viewOrdersContainer{
			width: 838px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 20px;
			height: 442px;
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		#viewOrdersitemCode{
			width: 100px;
		}

		#viewOrdersdescription{
			width: 448px;
		}

		#viewOrderssqty{
			width: 80px;
		}

		#viewOrdersprice{
			width: 100px;
		}

		#viewOrderstotalPrice{
			width: 100px;
		}

		#viewOrders{
			width: 918px;
			background-color: white; 
		}

		.viewOrderNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.viewOrderDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewOrderItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewOrderClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewOrderStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}

		#viewOrdersTableTotals{
		    width: 206px;
		    height: 20px;
		    background-color: white;
		    table-layout: fixed;
		    margin-right: 20px;
		    float: right;
		}
		
		.viewOrdersTableTotalsHeadings{
			text-align: right;
		}

		.viewOrdersTableTotalsText{
			text-align: center;
			border-bottom:1px solid lightgrey ; 
		}

		#viewOrdersButtons{
			float: right;
			width: inherit;
		}

		#viewOrdersButtonCancel{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewOrdersButtonCancel:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewOrdersButtonSave{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
		#viewOrdersButtonSave:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
	/*---View Quotation---*/
		.viewQuotationContainer{
			width: 880px;
			height: 603px;
			background-color: white;
			border-radius:10px;
			box-shadow: 0px 5px 20px #888888;
			overflow: hidden;
			margin-top: 20px;
		}

		#viewQuotationBar{
			height:30px;
			width:880px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
		}

		#viewQuotationBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#viewQuotationBarClose{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: -18px;
			margin-right: 10px;
			cursor:pointer;
		}

		#viewQuotationButtonBox{
			margin-left: 14px;
		}

		#viewQuotationAddItem{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 2px;
		    cursor: pointer;
		    width: 25px;
		}


		.viewQuotationsTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
			text-align: center;
		}


		#viewQuotationsTable{
			width: 840px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
			margin-left:20px;
			margin-top:20px;
		}

		#viewQuotationsContainer{
			width: 838px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 20px;
			height: 442px;
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		#viewQuotationsitemCode{
			width: 100px;
		}

		#viewQuotationsdescription{
			width: 448px;
		}

		#viewQuotationssqty{
			width: 80px;
		}

		#viewQuotationsprice{
			width: 100px;
		}

		#viewQuotationstotalPrice{
			width: 100px;
		}

		#viewQuotations{
			width: 918px;
			background-color: white; 
		}

		.viewQuotationNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.viewQuotationDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewQuotationItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewQuotationClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewQuotationStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}

		#viewQuotationsTableTotals{
		    width: 206px;
		    height: 20px;
		    background-color: white;
		    table-layout: fixed;
		    margin-right: 20px;
		    float: right;
		}
		
		.viewQuotationsTableTotalsHeadings{
			text-align: right;
		}

		.viewQuotationsTableTotalsText{
			text-align: center;
			border-bottom:1px solid lightgrey ; 
		}

		#viewQuotationsButtons{
			float: right;
			width: inherit;
		}

		#viewQuotationsButtonCancel{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewQuotationsButtonCancel:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewQuotationsButtonSave{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
		#viewQuotationsButtonSave:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
	/*---View Board Order---*/
		.viewBoardOrderContainer{
			width: 880px;
			height: 603px;
			background-color: white;
			border-radius:10px;
			box-shadow: 0px 5px 20px #888888;
			overflow: hidden;
			margin-top: 20px;
		}

		#viewBoardOrderBar{
			height:30px;
			width:880px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
		}

		#viewBoardOrderBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#viewBoardOrderBarClose{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: -18px;
			margin-right: 10px;
			cursor:pointer;
		}

		#viewBoardOrderButtonBox{
			margin-left: 14px;
		}

		#viewBoardOrderAddItem{
			border: none;
		    background: none;
		    float: left;
		    margin-top: 2px;
		    cursor: pointer;
		    width: 25px;
		}


		.viewBoardOrdersTableHeadings{
			table-layout: fixed;
			border: 2px solid lightgrey;
			cursor: pointer;
			text-align: center;
		}


		#viewBoardOrdersTable{
			width: 840px;
			height: 20px;
			background-color: white;
			border-bottom: 1px solid lightgrey;
			table-layout: fixed;
			margin-left:20px;
			margin-top:20px;
		}

		#viewBoardOrdersContainer{
			width: 838px;
			background-color: gainsboro;
			table-layout: fixed;
			margin-left: 20px;
			height: 442px;
			border-left:1px solid lightgrey;
			border-right:1px solid lightgrey;
			border-bottom:1px solid lightgrey;
			overflow: hidden;
		}

		#viewBoardOrdersitemCode{
			width: 100px;
		}

		#viewBoardOrdersdescription{
			width: 448px;
		}

		#viewBoardOrderssqty{
			width: 80px;
		}

		#viewBoardOrdersprice{
			width: 100px;
		}

		#viewBoardOrderstotalPrice{
			width: 100px;
		}

		#viewBoardOrders{
			width: 918px;
			background-color: white; 
		}

		.viewBoardOrderNo{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;

		}

		.viewBoardOrderDate{
			width: 149px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewBoardOrderItems{
			width: 148px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewBoardOrderClient{
			width: 317px;
			border-right:1px solid lightgrey;
			border-bottom: 1px solid lightgrey;
			text-align: center;
		}

		.viewBoardOrderStatus{
			width: 150px;
			text-align: center;
			border-bottom: 1px solid lightgrey;
		}

		.hover:hover{
			background-color: whitesmoke;
			cursor:pointer; 
		}

		#viewBoardOrdersTableTotals{
		    width: 206px;
		    height: 20px;
		    background-color: white;
		    table-layout: fixed;
		    margin-right: 20px;
		    float: right;
		}
		
		.viewBoardOrdersTableTotalsHeadings{
			text-align: right;
		}

		.viewBoardOrdersTableTotalsText{
			text-align: center;
			border-bottom:1px solid lightgrey ; 
		}

		#viewBoardOrdersButtons{
			float: right;
			width: inherit;
		}

		#viewBoardOrdersButtonCancel{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewBoardOrdersButtonCancel:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 5px;
		}

		#viewBoardOrdersButtonSave{
		    background: none;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
		#viewBoardOrdersButtonSave:hover{
		    background: gainsboro;
		    border-radius: 10px;
		    border: none;
		    border: 1px solid lightgrey;
		    font-family: inherit;
		    float: right;
		    margin-top: 3px;
		    height: 16px;
		    cursor: pointer;
		    margin-right: 20px; 
		}
	/*---View Board Item---*/
		.viewBoardItemContainer{
			width: 980px;
			height: 523px;
			background-color: white;
			border-radius:10px;
			box-shadow: 0px 5px 20px #888888;
			overflow: hidden;
			margin-top: 20px;
		}

		#viewBoardItemBar{
			height:30px;
			width:980px;
			background-color: white;
			border-bottom: 1px solid lightgrey; 
		}

		#viewBoardItemBarTitle{
			color: grey;
			font-size: 1.2em;
			font-weight: lighter; 
			margin-top: 2px;
			text-align: center;
		}

		#viewBoardItemBarClose{
			background:none;
			border:none;
			width: 25px;
			float:right;
			margin-top: -18px;
			margin-right: 10px;
			cursor:pointer;
		}

		#viewBoardItemIframe{
			width: 450px;
			height: 450px;
			margin-left: 20px;
			margin-top: 20px;
			border: 1px solid lightgrey;
		}
/*---General Overlays---*/		
	/*---Board Layouts---*/
		/*---Board Layout---*/
		.boardLayout{
	        width: 900px;
	        height: 583px;
	        background-color: white;
	        border-radius: 10px;
	        box-shadow: 0px 5px 20px #888888;
	        overflow: hidden;
	        margin-top: 20px;
	    }

	    #boardLayoutContainerBar{
	        height: 30px;
	        width: 900px;
	        background-color: white;
	        border-bottom: 1px solid lightgrey;
	        }

        #boardLayoutContainerBarTitle{
            color: grey;
            font-size: 1.2em;
            font-weight: lighter;
            margin-top: 2px;
            text-align:center;
		}

		#boardLayoutContainerBarClose{
		    background: none;
		    border: none;
		    width: 25px;
		    float: right;
		    margin-top: -20px;
		    margin-right: 10px;
		    cursor: pointer;
		}

		#boardLayoutCanvas{
			overflow: hidden;
			height: 498px;
			width: 860px;
			margin-left: 20px;
			border: 1px solid lightgrey;
			background-color: gainsboro;
		}

		#boardLayoutCanvasDiv{
			margin: 4px auto;
		}

		#boardlayoutInfo{
			width: 193px;
			height: 100px;
			border: 1px solid lightgrey;
			margin: 4px 0px 0px 4px;
			background-color: white;
			float: left;
		}

		#boardlayoutBar{
			width: 860px;
			height:28px;
			margin-left: 20px;
		}

		.boardlayoutButton{
			position: relative;
		}

		#boardlayoutButtonLeft:after {
			content: "\02039";
			font-weight: bold;
			font-size: 200%;
			top: -7%;
		}

		#boardlayoutButtonLeft{
			line-height: 13px;
			margin-top: 1px;
		}

		#boardlayoutButtonRight{
			line-height: 13px;
			margin-top: 1px;
		}

		#boardlayoutButtonright:after {
			content: "\0203A";
			font-weight: bold;
			font-size: 200%;
			top: -7%;
		}

		#boardlayoutRightButton{
			height: 24px;
			border: 1px solid lightgrey;
			background: none;
			border-radius: 0px 12px 12px 0px;
			font-size: 1em;
			padding: 0px 10px;
			white-space: nowrap;
			cursor: pointer;
			float: right;
			margin-top: 2px;
			margin-left: -1px;
			padding-bottom: 2px;
		}

		#boardlayoutLeftButton{
			height: 24px;
			border: 1px solid lightgrey;
			background: none;
			border-radius: 12px 0px 0px 12px;
			font-size: 1em;
			padding: 0px 10px;
			white-space: nowrap;
			cursor: pointer;
			float: right;
			margin-top: 2px;
			padding-bottom: 2px;
		}

		#boardLayoutOkay{
	    	background: none;
			border-radius: 10px;
			border: none;
			border: 1px solid lightgrey;
			font-family: inherit;
			float: right;
			margin-top: 3px;
			margin-right: 16px;
			cursor: pointer;
	    }

	    #boardLayoutOkay:hover{
	    	background: gainsboro;
			border-radius: 10px;
			border: none;
			border: 1px solid lightgrey;
			font-family: inherit;
			float: right;
			margin-top: 3px;
			margin-right: 16px;
			cursor: pointer;
	    }
	/*---Print--*/
	/*---Print Option---*/
				.printContainer{
					width: 250px;
					height: 143px;
					background-color: white;
					border-radius:10px;
					box-shadow: 0px 5px 20px #888888;
					overflow: hidden;
					margin-top: 20px;
				}

				#printBar{
					height:30px;
					width:250px;
					background-color: white;
					border-bottom: 1px solid lightgrey; 
				}

				#printBarTitle{
					color: grey;
					font-size: 1.2em;
					font-weight: lighter; 
					margin-top: 2px;
					text-align: center;
					width: 250px;
				}

				#printBarClose{
					background:none;
					border:none;
					width: 25px;
					float:right;
					margin-top: -18px;
					margin-right: 10px;
					cursor:pointer;
				}

				#printOptions{
					width: 210px;
					height:88px;
					margin: 0px 20px 0px 20px;
				}

				#printOption{
					border: 1px solid lightgrey;
					outline: none;
					width: 210px;
					height: 24px;
					-webkit-appearance: none;
					-moz-appearance: none;
					cursor: pointer;
				}

				#printType{
					border: 1px solid lightgrey;
					outline: none;
					width: 210px;
					height: 24px;
					-webkit-appearance: none;
					-moz-appearance: none;
					cursor: pointer;
				}

				#printButtonCancel{
				    background: none;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 5px;
				}

				#printButtonCancel:hover{
				    background: gainsboro;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 5px;
				}

				#printButtonPrint{
				    background: none;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 20px; 
				}
				#printButtonPrint:hover{
				    background: gainsboro;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 20px; 
				}
				/*---Print Confirm---*/
				.printConfirm{
					width: 300px;
					height: 120px;
					background-color: white;
					border-radius:10px;
					box-shadow: 0px 5px 20px #888888;
					overflow: hidden;
					margin-top: 20px;
				}

				#printConfirmBar{
					height:30px;
					width:300px;
					background-color: white;
					border-bottom: 1px solid lightgrey; 
				}

				#printConfirmTitle{
					color: grey;
					font-size: 1.2em;
					font-weight: lighter; 
					margin-top: 2px;
					text-align: center;
					width: 300px;
				}

				#printConfirmClose{
					background:none;
					border:none;
					width: 25px;
					float:right;
					margin-top: -18px;
					margin-right: 10px;
					cursor:pointer;
				}

				#printConfirmContainer{
				    margin-left: 20px;
				    margin-top: 20px;
					width: 260px;
				}

				#printConfirmImg{
				    width: 48px;
				    float: left;
				}

				#printConfirmMessage{
				    width: 187px;
				    float: right;
				}

				#printConfirmYes{
					background: none;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 7px;
				    height: 16px;
				    cursor: pointer;
				}

				#printConfirmYes:hover{
					background: gainsboro;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 7px;
				    height: 16px;
				    cursor: pointer;
				}

				#printConfirmCancel{
					background: none;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 7px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 5px;
				}

				#printConfirmCancel:hover{
					background: gainsboro;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 7px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 5px;
				}
				/*---Preview Prints---*/
				.previewPrint{
					width: 800px;
					height: 620px;
					background-color: white;
					border-radius:10px;
					box-shadow: 0px 5px 20px #888888;
					overflow: hidden;
					margin-top: 20px;
				}

				#previewPrintBar{
					height:30px;
					width:800px;
					background-color: white;
					border-bottom: 1px solid lightgrey; 
				}

				#previewPrintBarTitle{
					color: grey;
					font-size: 1.2em;
					font-weight: lighter; 
					margin-top: 2px;
					text-align: center;
					width: 800px;
				}

				#previewPrintBarClose{
					background:none;
					border:none;
					width: 25px;
					float:right;
					margin-top: -18px;
					margin-right: 10px;
					cursor:pointer;
				}

				#previewPrintInfoBar{
					width: 760px;
					height: 30px;
					margin-left: 20px;
				}

				#previewPrintQuotation{
					border: none;
					background: none;
					float: left;
					margin-top: 7px;
					cursor: pointer;
					width: 25px;
				}

				#previewPrintDropdown{
					font-size: 10px;
					position: relative;
					display: inline-block;
					float: right;

				}

				#previewPrintDropdown select {
					outline: none;
					-webkit-appearance: none;
					-moz-appearance:none;
					display: block;
					margin: 0;
					width: 165px;
					height: 30px;
					transition: border-color 0.2s;
					border: none;
					border-radius: 5px;

					background: #fff;
					color: black;
					line-height: normal;
					font-family: inherit;
					font-size: 12px;
					line-height: inherit;
					cursor: pointer;
				}

				#previewPrintDropdown .arr {
					background: #fff;
					position: absolute;
					right: 5px;
					width: 50px;
					pointer-events: none;
				}

				#previewPrintDropdown .arr:before {
					content: '';
					position: absolute;
					top: 50%;
					right: 0px;
					margin-top: 12px;
					pointer-events: none;
					border-top: 5px solid black;
					border-left: 5px solid transparent;
					border-right: 5px solid transparent;
				}

				#previewPrintDropdown .arr:after {
					content: '';
					position: absolute;
					top: 50%;
					right: 28px;
					margin-top: -5px;
					pointer-events: none;
					border-left: 6px solid transparent;
					border-right: 6px solid transparent;
				}


				#myInvoicesPageStatusSelect{
					width: 200px;
					height: 30px;
					float: left;
				}

				#previewPrintBox{
					width: 760px;
					background: gainsboro;
					height: 531px;
					margin-left: 20px;
					border: 1px solid lightgrey;
					overflow: hidden;
				}

				#previewPrintViewer{
					width: 775px;
					height: 531px;
				}

				#previewPrintButtonCancel{
				    background: none;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 20px;
				}

				#previewPrintButtonCancel:hover{
				    background: gainsboro;
				    border-radius: 10px;
				    border: none;
				    border: 1px solid lightgrey;
				    font-family: inherit;
				    float: right;
				    margin-top: 3px;
				    height: 16px;
				    cursor: pointer;
				    margin-right: 20px;
				}
/*---Login---*/
	#loginContainer{
		background-color: gainsboro;
		height: 100%;
		width: 100%; 
		display: table;
		position: absolute;
		top: 0;
		left: 0;
	}

	#loginContainerVertical{
		display: table-cell;
  		vertical-align: middle;
	}

	#loginContainerBackground{
    	width:350px;
        height:410px;
        background-color: white;
        box-shadow: 0px 5px 20px #888888;
        overflow: hidden;
        margin: auto;   
	}

	#loginContainerBar{
        height: 30px;
        width: 350px;
        background-color: white;
        border-bottom: 1px solid lightgrey;
	}



    #loginContainerBarTitle{
        color: grey;
        font-size: 1.2em;
        font-weight: lighter;
        margin-top: 2px;
        text-align:center;
	}

	#loginText{
		margin-left: 20px;
		margin-top:20px;
	}

	#loginPageError{
		margin-left: 20px;
		color: red;
		background-color: #ffb3b3;
		width: 360px;
		border: 1px solid red;
		border-radius: 5px;
	}

	#loginPage{
		list-style-type: none;
		margin-left: 20px;
	}

	.loginLine{
		border: 0;
	    height: 1px;
	    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
	    margin: 20px;
	}

	#loginPageUsername{
		width: 306px;
		height: 30px;
		border: 1px solid lightgrey;
		border-radius: 5px;
		background: none;
		color: black;
	}

	#loginPagePassword{
		width: 306px;
		height: 30px;
		border: 1px solid lightgrey;
		border-radius: 5px;
		background: none;
		color: black;
	}

	#loginPageResetText{
		color: black;
	}

	#loginPageSubmit{
		height: 30px;
		width: 310px;
		background: none;
		    background-color: rgba(0, 0, 0, 0);
		border: none;
		border: 1px solid lightgrey;
		border-radius: 5px;
		background-color: gainsboro;
		margin-top: 20px;
		cursor: pointer;
	}

	#loginPageSubmit:hover{
		height: 30px;
		width: 310px;
		background: none;
		    background-color: rgba(0, 0, 0, 0);
		border: none;
		border: 1px solid lightgrey;
		border-radius: 5px;
		background-color: whitesmoke;
		margin-top: 20px;
		cursor: pointer;
	}

	#loginLink{
		margin-left: 100px;
		outline: none;
	}

	#loginPowered{
	    height: 40px;
	    width: 140px;
	    margin-top: -3px;
	}