

/* Sonance Blue: #00A3E1  Sonance Dark Gray: #333F48  My Different shade of gray: #5F666B Sonance Light Gray: #D9D9D6 */
	* {box-sizing: border-box;font-family:'Open Sans',sans-serif,Arial;}
	body {background-color:rgba(217,217,214,0.2);margin:0px;padding:0px;}
	a:link, a:visited, a:active {color:#556775;}
	a:hover {color:#333F48;}
	.ft10 {font-size:10pt !important;}
	
	label {cursor:pointer !important;}
	
    h1,h2,h3,h4,h5,h6,h1 *,h2 *,h3 *,h4 *,h5 *,h6 *, .widget-header div {font-family:Montserrat,-apple-system, BlinkMacSystemFont,'Segoe UI', 'Roboto', 'Oxygen','Ubuntu', 'Cantarell', 'Fira Sans','Droid Sans', 'Helvetica Neue', sans-serif;}
/* BASIC */
h2 {font-size:16pt;}
.tableborder th {text-align:center;background-color:#f2f2f2;}
.tableborder td {background-color:white;vertical-align:top;}
/* ADMIN PAGE STYLING */
.adjustbox {
    box-shadow: 0 0 10px #000000 inset;
    
}
.adjustboxpointer {
    box-shadow: 0 0 10px #000000 inset;
    cursor: url('/images/reposition.png') 43 4, pointer;
    
}
.adjustboxmove {
    box-shadow: 0 0 10px #000000 inset;
    cursor: url('/images/saveposition.png') 55 5, move;
}

	.devadmin_logo {
		margin:8px 5px 2px 10px;
		display:inline-block;
		background:url('/images/devlogo.png');
		width:150px;
		height:36px;
		background-size:cover;
	}
	.admin_logo {
		margin:8px 5px 2px 10px;
		display:inline-block;
		background:url('/images/logo.png');
		width:150px;
		height:36px;
		background-size:cover;
	}
	.topbar {
		width:100%;
		min-width:373px;
		position:fixed;
		z-index:9999;
		background-color:#333F48;
		color:white;
		box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
	}
	.topbar .button {
		cursor:pointer;
		line-height:49px;
		display:inline-block;
		border-left:1px solid #5F666B;
		padding-left:20px;
		padding-right:20px;
	}
	.topbar .button:hover {
		background-color:#5F666B;
	}
	.topbar .button span {
		font-size:9pt;
		position:relative;
		top:-2px;
		display:inline-block;
		padding-left:5px;
	}
	.topbar .button input[type="text"] {
		border:0px solid #333F48;
		background-color:transparent;
		font-size:10pt;
		line-height:49px;
		width:70px;
		color:white;
		
	}
	.leftbar {
		float:left;
		position:fixed;
		display:block;
		line-height:50px;
		padding-top:70px;
		text-align:center;
		background-color:rgba(217,217,214,0.5);
		width:50px;
		height:calc(100vh);
		box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
		color:rgba(51,63,72,0.3);
	}
	.leftbar .on {
		color:rgba(51,63,72,0.7) !important; /* Color of left nav button when on */
	}
	.leftbar .fa, .leftbar .fas, .leftbar .far, .leftbar .fab {
		text-decoration:none;
		cursor:pointer;
		color:rgba(51,63,72,0.4);
		transition: color 0.3s, transform 0.3s;
	}
	.leftbar .fa:hover, .leftbar .fas:hover, .leftbar .far:hover, .leftbar .fab:hover {
		color:rgba(51,63,72,0.7);
	}
	.tooltip {
		display:none;
		position:absolute;
		background-color:black;
		border-radius:5px;
		padding:5px;
		color:#fff;
		font-size:9pt;
		top:-30px;
	}
	
	
	.widget {
	    border-radius: 3px;
	    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
	    height: auto;
	}
	.widget-header {
	    background-color:#333F48;
	    border: 1px solid #333F48;
	    border-radius: 5px 5px 0 0;
	    color: #fff;
	    padding: 10px;
	    text-transform: uppercase;
	}
	.widget-header i {
	    color:rgba(51,63,72,0.4);
	}
	.widget-content {
		background-color:#FFFFFF;
	    padding: 10px;
	}
	
/* ADMIN PAGE STYLING */
	

/* FORM STYLING */
	
	.widget input[type="text"],
	.widget input[type="password"],
	.widget select,
	.widget textarea
	{
		/*-webkit-appearance: none;*/
	    border-radius: 3px;
	    box-sizing: border-box;
	    background-color: #FFFFFF;
		border: 1px solid #ccc;
	    color: #333;
	    font-family: "Gibson Light","Helvetica","Arial",sans-serif;
	    font-size: 20px;
	    margin-bottom: 10px;
		padding:5px;
	    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
	    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
	}
	
	
	.widget input[type="text"]:focus,
	.widget input[type="password"]:focus,
	.widget select:focus,
	.widget textarea:focus
	{
	    border-color: #717171;
	    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(0, 0, 0, 0.3);
	    outline: 0 none;
	}


	.widget input[type="submit"],
	.widget input[type="button"]
	{
		background-color:#000000;
		border: 1px solid #000000;
		padding:10px;
		box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	    -webkit-appearance: none;
	    border-radius: 2px;
	    text-align: center;
	    letter-spacing: 0.05em;
	    line-height: 1.3;
	    color: white;
	    display: inline-block;
	    font-family: 'Gibson Regular', Helvetica, Arial, sans-serif;
	    font-size: 12pt;
		cursor:pointer;
		transition: all 0.3s ease;
	}
	.widget input[type="submit"]:hover,
	.widget input[type="button"]:hover
	{
		background-color:#333F48;
	}
	


	
	h1 {margin:0;padding:0;}
	
	
	
	.submitbutton {
		background: #00A3E1 none repeat scroll 0 0;
	    border: 1px solid #333F48;
	    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
	    color: #ffffff !important;
	    text-align: center;
		border-radius: 2px;
		display: inline-block;
	    font-size: 14px;
	    font-weight: 400;
	    line-height: 1.42857;
	    margin-bottom: 0;
	    padding: 6px 12px;
	    text-align: center;
	    vertical-align: middle;
	    white-space: nowrap;
		text-decoration:none;
		transition: all 0.3s ease;
	}
	.submitbutton:hover {
		background:#1483AC none repeat scroll 0 0;
	}
	
	.iconbutton {
		cursor:pointer;
		color:#5F666B;
		position:relative;
		top:5px;
		left:0;
	}
	.iconbutton:hover {
		cursor:pointer;
		color:#00A3E1;
		position:relative;
		top:5px;
		left:0;
	}
	.iconbutton:active {
		cursor:pointer;
		color:black;
		position:relative;
		top:6px;
		left:1px;
	}
	
	
	

	/* GRAPHIC CHECKBOXES & RADIOS */
	form.checkimgs input[type="checkbox"],
	form.checkimgs input[type="radio"]
	{
	    display:none;
	}
	form.checkimgs input[type="checkbox"] + label span {
	    display:inline-block;
	    width:19px;
	    height:19px;
	    margin:-1px 4px 0 0;
	    vertical-align:middle;
	    background:url('/images/check_radio_sheet.png') left top no-repeat;
	    cursor:pointer;
	}
	form.checkimgs input[type="checkbox"]:checked + label span {
	    background:url('/images/check_radio_sheet.png') -19px top no-repeat;
	}
	
	
	form.checkimgs input[type="radio"] + label span {
		display:inline-block;
		width:19px;
		height:19px;
		margin:-1px 4px 0 0;
		vertical-align:middle;
		background:url('/images/check_radio_sheet.png') -38px top no-repeat;
		cursor:pointer;
	}
	
	form.checkimgs input[type="radio"]:checked + label span {
		background:url('/images/check_radio_sheet.png') -57px top no-repeat;
	}
	/* GRAPHIC CHECKBOXES & RADIOS */

/* FORM STYLING */
.whitebox1 {text-align:center;display:inline-block;border:1px solid silver;background-color:white;border-radius:5px;padding:5px;margin-right:2px;}
.whitebox2 {text-align:center;display:inline-block;border:1px solid silver;background-color:rgba(255,255,255,0.5);border-radius:5px;padding:5px;margin-right:2px;}

.sortable {
border-collapse: separate;
border-spacing: 0 5px;
border:2px solid white;
}
.sortable > thead > tr > th {cursor:pointer;text-decoration:underline;font-weight:normal !important;font-size:8pt !important;}


.sortable > thead > tr > th, .sortable > tbody > tr > th {background-color:rgba(208,208,208,0.9);}
.sortable > thead > tr:hover > th, .sortable > tbody > tr:hover > th {background-color:rgba(208,208,208,1.0);}

.sortable > thead > tr > th:first-child, .sortable > tfoot > tr > td:first-child {
border-right:1px solid #E5E5E5;
-webkit-border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.sortable > thead > tr > th:last-child, .sortable > tfoot > tr > td:last-child {-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;}


.sortable > tbody > tr > td {
padding: 10px 7px;
border-right:1px solid white;
font-size: 10pt;
}
.sortable > tbody > tr:nth-child(even) > td {
background-color:rgba(222,222,222,0.3);
}
.sortable > tbody > tr:nth-child(odd) > td {
background-color:rgba(222,222,222,0.5);
}

.sortable > tbody > tr.white > td {
   background-color:rgba(222,222,222,0.2);
   padding:1px 5px;
}
.sortable > tbody > tr.white:hover > td {
   background-color:rgba(222,222,222,0.8);
}
.sortable > tbody > tr:hover > td {
   background-color:rgba(222,222,222,0.8);
}
.sortable > tbody > tr > td:first-child {
background-color:rgba(238,238,238,0.5);
border-right:1px solid #E5E5E5;
}
.sortable > tbody > tr > td:first-child, .sortable > tbody > tr > th:first-child {
-webkit-border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
/*.tablecolor2 tbody tr td:nth-child(odd) or (even) {}*/
.sortable > tbody > tr > td:last-child, .sortable > tbody > tr > th:last-child {-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomright: 5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;}


/* SORTABLE TABLES */


.sortable > thead > tr > td, .sortable > tbody > tr > td, .sortable > tfoot > tr > td {  
	text-align: left;
	padding:10px;
}
.sortable > th {
	text-align:left;
	padding:5px 10px;
}
.sortable .c {
	text-align:center;
}

.sortable .fa, .sortable .fab, .sortable .far, .sortable .fas {
	text-decoration:none;
}


/*table.ft10 input, table.ft10 select {font-size:12pt !important;margin-bottom:0 !important;}*/




.sortable > thead > tr > th, .sortable > tbody > tr > th, .sortable > tfoot > tr > th {font-weight:normal !important;font-size:8pt !important;}
.sortable > thead > tr > td, .sortable > tbody > tr > td, .sortable > tfoot > tr > td {font-weight:normal !important;font-size:8pt !important;}
.hiddencheckbox {display:none;}

/*.sortable .searchfields {display:none;}*/
.sortable .searchfields td {padding:0 2px;}
.sortable .searchfields select {font-size:10pt;width:100%;margin:0;padding:1px 2px;height:auto;}
.sortable .searchfields input[type=submit] {padding:2px 8px;font-size:8pt;text-transform:uppercase;font-weight:normal;}
.sortable .searchfields input[type=text] {width:100%;margin:0;padding:2px 5px;height:auto;font-size:10pt;}



/* SORTABLE TABLES */


	
/* NEXT PREV BUTTONS FOR MULTI PAGE RESULTS */
.next_previous_buttons {transition: all 0.3s ease;box-shadow: 0px 0px 10px silver;cursor:pointer;display:inline-block;padding:10px 20px;font-size:15pt;background-color:rgba(51,63,72,0.7);margin:5px;margin-left:0;}
.next_previous_buttons:hover {background-color:rgba(51,63,72,1);color:white;}
.next_previous_buttons_on {box-shadow: 0px 0px 10px silver;background-color:#00A3E1;color:white;}
/* NEXT PREV BUTTONS FOR MULTI PAGE RESULTS */


.admintable tr th {background-color:#EEEEEE;font-size:0.8em;padding-top:4px;padding-right:4px;color:rgba(0,0,0,0.8);text-align:right;font-weight:normal;}
.admintable tr td {color:#333F48;padding-left:5px;}
.admintable tr th, .admintable tr td {padding-left:7px;border-top:1px solid white;border-bottom:1px solid #E0E0E0;min-height:28px;}
.admintable .sm {font-size:0.8em;}




.responsivetable {border-top:1px solid white;border-bottom:1px solid #E0E0E0;}
.responsivetable div.th {background-color:#EEEEEE;font-size:0.8em;padding:4px 4px 0 10px;color:rgba(0,0,0,0.8);font-weight:normal;text-align:right;}
.responsivetable div.td {color:#333F48;padding:2px 5px 2px 5px;}
.responsivetable div.th, .responsivetable div.td {min-height:28px;}
.responsivetable .w30 {width:40px;}
.responsivetable div:nth-child(2) {padding-left:40px;}
.responsivetable div:nth-child(2) i {margin-left:-30px;}

.sortable .inactive *,.responsivetable .inactive *, .admintable .inactive * {color:silver;}
.sortable .deleted *,.responsivetable .deleted *, .admintable .deleted * {font-style:italic;color:#DDDDDD !important;}


@media (min-width:1px) AND (max-width:699px) {
	.responsivetable {margin-bottom:10px;border-bottom:0px solid white;}
}

/* RESPONSIVE */

tr.projectrow td {background-color:rgba(0,0,0,0.1) !important;padding:5px 10px !important;}
tr.projectrow:hover td {background-color:rgba(0,0,0,0.2) !important;padding:5px 10px !important;}


.desktop_i {display:inline-block;}

@media screen and (max-width: 600px) {
	.desktop_i {display:none !important;}
}/* @media screen and (max-width: 600px){ */

/* RESPONSIVE */






.labelmobile .field {padding:2px;}
.labelmobile label {background-color:#EEEEEE;display:block;padding:2px;}
.labelmobile label span {display:inline-block;text-align:right;width:150px;}
.labelmobile label input[type=text] {width:calc(99% - 150px);margin-bottom:0;}


@media screen and (max-width: 600px) {
	.labelmobile label {background-color:#EEEEEE;display:block;margin-bottom:10px;padding:5px;}
	.labelmobile label span {display:block;text-align:left;}
	.labelmobile label input[type=text] {width:100%;}

}/* @media screen and (max-width: 600px){ */




.smbutton {
position:relative !important;
top:-2px !important;
padding-top:9px !important;
padding-bottom:8px !important;
font-size:9pt !important;
}
	


.admineditor {
	font-family:Arial;
	font-weight:normal;
	font-size:16px;
	text-transform:none;
	letter-spacing: normal;
	line-height:19px;
	z-index:11;
	position:absolute;
	box-sizing: border-box;
	width:calc(100% - 20px);
	left:0;
	border:2px solid silver;
	text-align:left;
	padding:10px;
	margin:-10px 10px 0 10px;
	border-radius:5px;
	background-color:#EEEEEE;
	box-shadow:0 0 10px rgba(0,0,0,0.2);
}

.admineditor b {font-size:16px;}
.admineditor textarea {
	width:100%;
	height:200px;
	border-radius:5px;
}

.admineditor textarea, .admineditor input[type="text"], .admineditor input[type="password"], .admineditor select {
    background-color: #ffffff;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset;
    box-sizing: border-box;
    color: #333;
    font-family: Arial,Courier, monospace;
    font-size: 8pt;
    margin-bottom: 10px;
    padding: 5px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
}
.admineditor input[type="text"]:focus, .admineditor input[type="password"]:focus, .admineditor select:focus, .admineditor textarea:focus {
    border-color: #717171;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px rgba(0, 0, 0, 0.3);
    outline: 0 none;
}
.admineditor input[type="submit"], .admineditor input[type="button"] {
    background-color: #000000;
    border: 1px solid #000000;
    border-radius: 2px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    color: white;
    cursor: pointer;
    display: inline-block;
    font-family: "Gibson Regular",Helvetica,Arial,sans-serif;
    font-size: 12pt;
    letter-spacing: 0.05em;
    line-height: 1.3;
    padding: 10px;
    text-align: center;
    transition: all 0.3s ease 0s;
}
.admineditor input[type="submit"]:hover, .admineditor input[type="button"]:hover {
    background-color: #2b2b2b;
}