/*
	Delvin Styles
*/
@font-face{
	font-family: GillSans-SemiBold;
	src: url(GillSans-SemiBold.woff);
}

@font-face {
	font-family: GillSans-Light;
	src: url(GillSans-Light.woff);
}

/*
	Template Styles
*/

* {
	
    box-sizing: border-box;  /* ensures border and padding are included in total width */
}

html, body{
	margin: 0px;
	padding: 0px;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	color:#444;
	height: 100%;
}

.wrapper {
	width: 100%;
	padding: 0;
	margin: 0 auto -26px;
	min-height: 100%;
	height: auto !important;
	background: #fff;
}

.decor {
	background-image: url("http://s3.amazonaws.com/delv-in-web-assets/0/bg.png");
	background-repeat: repeat-x;
	background-size:contain;
}


.header {
	display: flex;
	align-items: center;
	width: 100%;
	background-image:url('http://s3.amazonaws.com/delv-in-web-assets/topTile.jpg');
	background: -moz-repeating-linear-gradient(-80deg,rgb(256, 256, 256), rgb(235, 235, 235)10%, rgb(256, 256, 256)30%); /* For Firefox 3.6 to 15 */
	background: repeating-linear-gradient(-80deg,rgb(256, 256, 256), rgb(235, 235, 235)10%, rgb(256, 256, 256)30%); /* Standard syntax (must be last) */
	border-bottom: 5px solid #3D368B;
	box-shadow: 0px 4px 8px #555;
	color: #3D368B;
	font-size: 20px;
	font-weight: bold;
	height: 126px;
	padding-bottom: 4px;
	z-index: 10;
	-webkit-transition: height 2s;
	transition: height 2s;
}

.sticky {
    position: fixed;
    top: 0px;
    height: 90px;
}

	
/* 
	.header_logo class is in public_header.php
 */
	
	
		.mainNav select{
			text-align: center;
			font-size: 16px;
			padding-bottom: 6px;
			border: solid 1px #3D368B;
			/*background-color: #c7c4e8; */
			background-color: #c7c4e8;
		}

		.mainNav select:hover {
			background-color: #c7c4e8;
			color: #fff;
		}

.text_input{
	background-color: #c7c4e8;
}

.description {
	font-family: Verdana;
	font-size: 12px;
}
	.description li{
		font-family: Verdana;
		font-size: 12px;
		line-height: 14px;
		margin: 6px 0 0 -12px;
		padding: 0;
	}

	.nav { }
	.punchClock { color:#036; font-size: 16px;}
	.schedule { color:#069; font-size: 16px;}
	.extraTime { color:#066; font-size: 16px;}
	.openTime { color:#360; font-size: 16px;}
	.production { color:#690; font-size: 16px;}
	.dashboard { color:#9C0; font-size: 16px;}
	.payroll_hours { color: #993; font-size: 16px;}
	.staff_away { color: #C90; font-size: 16px;}
	.month_end { color: #C63; font-size: 16px; }
	.personnel { color: #C33; font-size: 16px;}
	.office_close { color: #903; font-size: 16px;}
	.practices { color: #909; font-size: 16px;}
	.email_log { color: #639; font-size: 16px; }
	.emplStandards { color: #03C; font-size: 16px; }
	.collections { color:#036; font-size: 16px;}
	.directory { color: #069; font-size: 16px;}
	

@media screen and (max-width: 649px){
	.delvin_logo { 
		height: 35px;
		width: 100px;
		background-image: url('images/Delvin_logo_hi.png');
		background-repeat: no-repeat;
		background-position: right;
		background-size: 81px 35px;
		float: right;
		margin: 10px 30px 0 0;
		position: relative;
	}
	.delvin_logo_sm{ 
		height: 18px;
		width: 50px;
	}
}
	
@media screen and (min-width: 650px){
	.delvin_logo {
		height: 70px;
		width: 200px;
		background-image: url('images/Delvin_logo_hi.png');
		background-repeat: no-repeat;
		background-position: right;
		background-size: 162px 70px;
		float: right;
		margin: 10px 30px 0 0;
		position: relative;
		-webkit-transition: all 1s;
		transition: all 1s;
	}
	.delvin_logo_sm{ 
		height: 35px;
		width: 100px;
		background-size: 81px 35px;
		margin: 10px 30px 0 0;
	}
}


.delvin_logo_creds{
	float: right;
	position: absolute;
	right: 0;
	width: 350px;
	height: 126px;   
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -moz-flex;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-flex-direction: row;
	flex-direction: row;
	align-items: flex-end;
	justify-content: flex-end;
	-webkit-transition: height 2s;
	transition: height 2s;
}
.delvin_logo_creds_sm{
	height: 75px;
}
	
	.creds {
		float: left;
		position: relative;
		font-size: 11px;
		font-weight:100;
		width: 100%;
		text-align: right;
		padding: 0 30px 0 0;
	}

.content {
	padding: 30px;
	display: block;
}
.sticky_content{
	padding-top: 100px;
}

.footer {
	width: 100%;
	background-color:#3D368B;
	float: left;
	font-size: 11px;
	color: #fff;
	height: 26px;
	padding: 6px 20px;
	}
	.footer a:link, a:visited{
		color:#fff;
	}
	.footer a:hover {
		color: #7AC37B;
	}




h1 {
	font-family: GillSans-SemiBold;
	font-size:24px;
	color: #3D368B;
	margin: 0 0 8px 0;
	font-weight: 100;
}

h2 {
	font-family: GillSans-SemiBold;
	font-size:18px;
	color: #000;
	margin: 0 0 6px 0;
	font-weight: 100;
}
h3 {
	font-family: GillSans-SemiBold;
	font-size:14px;
	margin: 1px 0 4px 0;
	font-weight: 100;
}
h4 {
	font-family: GillSans-SemiBold;
	font-size:12px;
	margin: 0 0 2px 0;
	font-weight: 100;
}


p.large { font-size: 16px; }
p.med { font-size: 14px; }
p { font-size: 12px; }
p.small { font-size: 11px; }

.bold { font-weight: bold; }

.neg_val{ color: #c00; }

.important { color: #900; font-weight: bold;}

.push {
	height: 30px;
}

.form_pair {
	float: left;
 	display: flex;
}
	form_pair .comment{
		font-size: 9px;
		line-height: 10px;
	}

.form_label {
	font-size: 13px;
	line-height: 13px;
	background-color: #e7e5f5;
	color: #3D368B;
	font-weight: bold;
	text-align:left;
	padding: 6px 8px 2px 8px;
	min-height: 30px;
}
.form_input {
	padding: 6px 8px 2px 8px;
	font-size: 13px;
	line-height: 13px;
	text-align: left;
	min-height: 30px;
}
.form_input input[type=text], input[type=checkbox], textarea, select, input[type=password] {
    background-color: #e7efe6;
    border: solid 1px #b2c5aa;
    color: #3D368B;
    font-size: 13px;
}


.col-1 {width: 8.33%; float: left; position: relative; box-sizing: border-box;}
.col-2 {width: 16.66%; float: left; position: relative; box-sizing: border-box;}
.col-3 {width: 25%; float: left; position: relative; box-sizing: border-box;}
.col-4 {width: 33.33%; float: left; position: relative; box-sizing: border-box;}
.col-5 {width: 41.66%; float: left; position: relative; box-sizing: border-box;}
.col-6 {width: 50%; float: left;  position: relative; box-sizing: border-box;}
.col-7 {width: 58.33%; float: left; position: relative; box-sizing: border-box;}
.col-8 {width: 66.66%; float: left; position: relative; box-sizing: border-box;}
.col-9 {width: 75%; float: left; position: relative; box-sizing: border-box;}
.col-10 {width: 83.33%; float: left; position: relative; box-sizing: border-box;}
.col-11 {width: 91.66%; float: left; position: relative; box-sizing: border-box;}
.col-12 {width: 100%; float: left; position: relative; box-sizing: border-box;}
.col-auto {width: auto; float: left; position: relative; box-sizing: border-box;;}

.col { float: left; position: relative; padding: 0 12px 2px 0; width: auto;  overflow: hidden; }
.col_last { float: right; position: relative; padding: 16px 2px 1px 4px; }

.top_line{ border-top: solid 1px #3D368B; margin-top: 10px; }
.bot_line{ border-bottom: solid 1px #3D368B; }
.right_line { border-right: solid 1px #3D368B; margin-right: 20px; padding-right: 20px; }
.right { text-align: right; }
.right_data { padding-right: 25%; }
.centre { text-align: center; }
.left { text-align: left; }
.bold { font-weight: bold; }
.b_space { margin-bottom: 2px; }
.box_border { border: solid 2px #3D368B; padding: 5px;}
.border_top_2 {border-top: solid 2px #3D368B;};
.italic {font-style: italic; }
.pad_top { padding-top: 4px; }
.pad_top_20 { padding-top: 20px; }
.pad_left { padding-left: 6px; }
.pad_left_12 { padding-left: 12px; }
.pad_right { padding-right: 6px; }
.pad_right_12 {padding-right: 12px;}
.pad_bot_10 { padding-bottim: 10px; }

.fl_rt {float: right;}
.width_auto { width: auto; }

.txt12 { font-size: 12px; }
.txt11 { font-size: 11px; }

.width_50 { width: 50px; }
.width_100 { width: 100px; }

.Sticky_Table_Header {
    background: #3D368B;
    color: #fff;
    position: sticky;
    top: 110px;
}


/*#button_div_r {
    float: right;
    position: relative;
    width: 20%;
    text-align: right;
    padding-top: 2px;'
}
*/
.subTitle {
	font-size:13px;
}

#calText {
	font-size: 16px;
}


	#pop_up table{
	    width: 100%;
	    padding: 0px;
	    border-collapse: collapse;
	}
	#pop_up tr { vertical-align: top; }

	#pop_up th {
	    border-bottom: solid 1px #3D368B;
	    font-weight: bold;
	    text-align: left;
	}

	#pop_up td{
	    border-bottom: solid 1px #3D368B;
	}

.comment {
	font-size: 9px;
	text-align: left;
	line-height: 11px;
	font-weight: 100;
}

.boxed {
	border: solid 1px #7ec57c;
	padding: 0 1px;
	color: #7ec57c;
}
.decimalTime {
	text-align: right;
	font-style: italic;
	color: #666;
	padding-right: 2px;
}

.select_practice {
	font-size: 12px;
	margin: 0 0 10px 10px;
}


#data_table {
	margin-top: 6px;
	font-size: 14px;
	padding: 0;
	border-spacing: 0px;
}

#data_table input[type=text], input[type=checkbox], textarea, select, input[type=password] {
    background-color: ; 
    background-color: #e7efe6;
    border: solid 1px #b2c5aa;
    margin: 1px 0;
    color: #3D368B;
    font-size: 14px;
}


#data_table th {
		background-color: #3D368B;
		color: #fff;
		font-weight: bold;
		text-align:left;
		padding: 1px 8px 2px 8px;
		border-bottom: solid 1px #fff;
	}

	#data_table td {
		border-bottom: solid 1px #3D368B;
		padding: 3px;
		font-size: 12px;
	}

.data_table {
	margin-top: 6px;
	border-spacing: 0;
	width: 100%;
}
.data_table th {
		background-color: #3D368B;
		color: #fff;
		font-weight: bold;
		text-align:left;
		padding: 1px 8px 2px 8px;
		border-bottom: solid 1px #fff;
		border-spacing: 0;
	}

	.data_table td {
		border-bottom: solid 1px #3D368B;
		padding: 3px;
		font-size: 12px;
		border-spacing: 0;
	}

a:link {
	color:#3D368B;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
	color: #666;
}
a:hover {
	text-decoration: none;
	color: #aaa;
}
a:active {
	text-decoration: none;
	color: #3D368B;
}

#projLinks a:link {
	color: #3D368B;
	text-decoration: none;
}
#projLinks a:visited {
	color: #3D368B;
	text-decoration: none;
}
#mainContent a:link { color: #fff; }
#mainContent a:hover { color: #fff; }
#mainContent a:visited { color: #fff; }


.filter_box{
	box-sizing: border-box;
    background: #e0e7df; /* for browsers that don't support gradients */
    background: -webkit-linear-gradient(rgb(224, 231, 223), rgb(255,255,255)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgb(224, 231, 223), rgb(255,255,255)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgb(224, 231, 223), rgb(255,255,255)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgb(224, 231, 223), rgb(255,255,255));
	border: solid 2px #3D368B;
	padding: 4px;
	margin: 4px 0;
	font-size: 14px;
    font-family:GillSans-SemiBold;
	color: #3D368B;
}
	.filter_box h3{
		font-size: 18px;
	}

.ot_box {
	background: linear-gradient(rgb(255,255,255), rgb(224, 231, 223));
	box-shadow: 2px 2px 2px #666;
	border: solid 2px #3D368B;
	margin: 0 ;
	padding: 0 10px 4px 10px;
	width: 420px;
	position: absolute;
	text-align: left;
}

.add_form_div{
    float: left;
    position: relative;
    width: 500px;
}

.search_table {
	width: 100%;
}
.search_table td {
	padding: 4px 12px 4px 0px;
}
.action_needed {
	font-weight: bold;
	color: #b00;
	text-align: center;
}



/*
	BUTTON STYLES
*/

.cancel_but{ /* Dark Rose */
	background: #636; /* for browsers that don't support gradients */
	background: -webkit-linear-gradient(rgb(203, 154, 198), rgb(102, 51, 102)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgb(203, 154, 198), rgb(102, 51, 102)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgb(203, 154, 198), rgb(102, 51, 102)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgb(203, 154, 198), rgb(102, 51, 102)); /* Standard syntax (must be last) */
	font-size:16px;
	margin-bottom: 2px;
	color: #fff;
	border: none;
	font-family: GillSans-SemiBold;
	text-shadow: 1px 1px 1px #030;
	cursor: pointer;
	padding: 0px 3px 2px 3px;
}
    .cancel_but:hover {
	    box-shadow: 1px 1px 1px #333;
        margin: -1px 1px 1px -1px;
    }

.edit_save_but{ /* Green */
	background: #5a935c; /* for browsers that don't support gradients */
	background: -webkit-linear-gradient(rgb(202, 232,197), rgb(91, 148, 93)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgb(202, 232,197), rgb(91, 148, 93)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgb(202, 232,197), rgb(91, 148, 93)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(rgb(202, 232,197), rgb(91, 148, 93)); /* Standard syntax (must be last) */
	font-size:16px;
	margin-bottom: 2px;
	color: #fff;
	border: none;
	font-family: GillSans-SemiBold;
	text-shadow: 1px 1px 1px #030;
	cursor: pointer;
	padding: 0px 3px 2px 3px;
}
    .edit_save_but:hover {
	    box-shadow: 1px 1px 1px #333;
        margin: -1px 1px 1px -1px;
    }

.del_but{ /* Red */
	background: #983333; /* for browsers that don't support gradients */
	background: -webkit-linear-gradient(rgb(196, 156, 156), rgb(152, 52, 52)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgb(196, 156, 156), rgb(152, 52, 52)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgb(196, 156, 156), rgb(152, 52, 52)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgb(196, 156, 156), rgb(152, 52, 52));/* red */
	font-size:16px;
	margin-bottom: 2px;
	color: #fff;
	border: none;
	font-family: GillSans-SemiBold;
	text-shadow: 1px 1px 1px #030;
	cursor: pointer;
	padding: 0px 3px 2px 3px;
}
    .del_but:hover {
	    box-shadow: 1px 1px 1px #333;
        margin: -1px 1px 1px -1px;
    }

.add_cont_but{ /* Purple */
	background: #412f8a; /* for browsers that don't support gradients */
	background: -webkit-linear-gradient(rgb(167, 154, 213), rgb(65, 47, 138)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(rgb(167, 154, 213), rgb(65, 47, 138)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(rgb(167, 154, 213), rgb(65, 47, 138)); /* For Firefox 3.6 to 15 */
	background: linear-gradient(rgb(167, 154, 213), rgb(65, 47, 138)); /* purple */
	font-size:16px;
	margin-bottom: 2px;
	color: #fff;
	border: none;
	font-family: GillSans-SemiBold;
	text-shadow: 1px 1px 1px #030;
	cursor: pointer;
	padding: 0px 3px 2px 3px;
}
    .add_cont_but:hover {
	    box-shadow: 1px 1px 1px #333;
        margin: -1px 1px 1px -1px;
    }


.small_but {
    font-size: 11px;
}

.return_login_but {
        font-family: GillSans-SemiBold;
        font-size: 24px;
        text-shadow: 1px 1px 1px #000;
        color: #fff;
        background-color: #7EC67C;
        height: 36px;
        border: none;
        width: 300px;
        margin: 0px;
        -webkit-transition-duration: 0.4s; /* Safari */
        transition-duration: 0.4s;
        cursor: pointer;
    }

    .return_login_but:hover {
        background-color: #638f61;
        box-shadow: 2px 2px 2px #444;
        margin: -1px 1px 1px -1px;
    }
/*
	ERROR STYLES
*/
	.form_error {
		color: #cc0000;
	}
	
    #alert_div {
        position: absolute;
        left: 0;
        right: 0;
        top: 72px;
        z-index: 20;
        margin: 5px auto;
        width: 60%;
        font-size: 14px;
        box-shadow: 2px 2px 2px #666;
        text-align:center;
        -moz-animation: fadeAlert 0s ease-in 4s forwards; /* Firefox */
        -webkit-animation: fadeAlert 0s ease-in 4s forwards;/* Safari and Chrome */
        -o-animation: fadeAlert 0s ease-in 4s forwards;/* Opera */
        animation: fadeAlert 0s ease-in 4s forwards;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
    }
    @keyframes fadeAlert {
        to {
            width:0;
            height:0;
            margin: 0;
            padding: 0;
            box-shadow: none;
            font-size: 1px;
            overflow:hidden;
        }
    }
    @-webkit-keyframes fadeAlert {
        to {
            width:0;
            height:0;
            margin: 0;
            padding: 0;
            font-size: 1px;
            box-shadow: none;
            visibility:hidden;
        }
    }
	.error { padding: 0px; margin: 0 0 20px 0; font-size: 12px; text-align:center; color:#c00; font-weight: bold;}

	.alert_success { background: #c8eebf; color: green; padding: 8px;}
	.alert_warning { background: #f6f6cf; color:orange; padding: 8px; }
	.alert_error { background: #fce9e9; color: #c20000; padding: 8px;}