@font-face {
    font-family: 'SourceSans';
    src: url('../fonts/SourceSansPro-Regular.ttf');
}
@font-face {
    font-family: 'SourceSansLight';
    src: url('../fonts/SourceSansPro-Light.ttf');
}
@font-face {
    font-family: 'RalewayExtraBold';
    src: url('../fonts/Raleway-ExtraBold.ttf');
}
@font-face {
    font-family: 'RalewayExtraBoldItalic';
    src: url('../fonts/Raleway-ExtraBoldItalic.ttf');
}

/*********************************************************
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, font, img, ins, kbd, q, s, samp,
	small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td {
		border: 0;
		font-family: inherit;
		font-size: inherit;
		font-style: inherit;
		font-weight: inherit;
		margin: 0;
		outline: 0;
		padding: 0; 
		font-family: SourceSans;
	}
	b {
		font-weight: bold;
	}
	:focus {
		outline: 0; 
	}
	html, body {
		width: 100%;
		min-width: 960px;
		height:	100%; 
	}
	body { 
		background: #dfc5d2;
		color: #0d039b;
		font-family: SourceSans, sans-serif;
		font-size: 15px;
		line-height: 1.5;
		min-width: 960px; 
	}
	body.iframe {
		height: auto!important;
	}
	p, li, td {
		line-height: 1.3; 
	}
	table {
		/*border-collapse: separate;*/
		border-spacing: 0; 
		border-radius: 5px;
	}
	table tr:first-child th:first-child {
		border-top-left-radius: 5px;
	}

	table tr:first-child th:last-child {
		border-top-right-radius: 5px;
	}
	table tr:last-child td:first-child {
		border-bottom-left-radius: 5px;
	}

	table tr:last-child td:last-child {
		border-bottom-right-radius: 5px;
	}
	caption, th, td {
		font-weight: normal;
		text-align: left; 
		vertical-align:	top; 
	}
	td, th {
		border-bottom: 1px dotted #f3d9e6;
		padding: 5px 5px;
	}
	th {
		font-weight: bold;
	}
	blockquote:before, blockquote:after, q:before, q:after {
		content: ""; 
	}
	blockquote, q {
		quotes: "" ""; 
	}
	ul, ol {
		list-style:	none;
	}
	a {
		color: #0d039b;
		text-decoration: none; 
	}
	label {
		color: #0d039b;
		display: inline-block;
		font-size: 13px!important;
		zoom: 1;
		*display: inline; 
	}
	div {
		text-align:	left; 
	}
	form {
		background: transparent;
		border: 1px solid #f3d9e6;
		border-radius: 5px;
		display: inline-block;
		margin-bottom: 30px;
		min-width: 400px;
		width: auto !important;
		padding: 10px;
		vertical-align: top;
	}
	form.no_form {
		border: 0!important;
		padding: 0!important;
	}
	form label {
		display: inline-block;
		width: 100px;
	}

	form li {
		padding: 10px; 
		border-top: 1px solid #f3d9e6;
	}
	form li.no_top_border {
		border-top: 0!important;
	}
	img {
		border:	0;
	}
	form li{
		padding: 5px 0;
	}
	h2 {
		color: #0d039b;
		/*font-weight: bold;*/
		font-size: 25px;
		letter-spacing: -0.5px;
		background: transparent;
		padding: 10px 10px 10px 20px;
		margin-bottom: 5px;
		margin-top: 30px;
	}
	h2#main_h2 {
		display: inline-block;
		position: relative;
		top: -20px;
		margin-top: 30px;
		margin-bottom: 0px;
		padding-bottom: 0px;
	}
	h3 {
		color: #0d039b;
		/*font-weight: bold;*/
		font-size: 20px;
		letter-spacing: -0.5px;
		background: transparent;
		padding: 0px 10px 10px 20px;
		margin-bottom: 5px;
		margin-top: 0px;
	}
	h4 {
		font-weight: bold;
		font-size: 15px;
		padding: 10px 10px;
		border-bottom: 1px dotted #0d039b;
	}
	input, select, textarea {
		background:	#e9cfdc;
		border:	1px solid #f3d9e6 /*#dfc5d2*/;
		color: #0d039b;
		font-family: 'Arial', sans-serif;
		font-size: 13px;
		padding: 3px;
		border-radius: 2px;
		box-sizing: border-box;
	}
	input[type=text], input[type=password], select {
		width: 150px;
	}
	input[type=image] {
		background: transparent!important;
	}
	select {
	  /* for Firefox */
	  -moz-appearance: none;
	  /* for Chrome */
	  -webkit-appearance: none;
	}
	/* For IE10 */
	select::-ms-expand {
	  display: none;
	}
	select {
		background-image: url('../img/dd_down.png');
		background-repeat: no-repeat;
		background-position: right 5px center;
		overflow-y: auto;
		padding-right: 18px;
	}
	textarea {
		height: 100px;
		resize:vertical;
		width: 300px;
	}
	input[type=submit], input[type=button] {
	 	border:	1px solid #0d039b;
		background:	#0d039b;
		color: #fff;
		cursor: pointer;
		font-family: 'Arial', sans-serif;
		font-size: 13px;
		font-weight: bold;
		padding: 3px 10px;
	}
	input[type=image] {
		border:	0;
		margin-right: 20px;
	}
	p {
		padding: 5px 0;
	}
	label {
		display: inline-block;
		width: 70px;
	}
	h2 select {
		width: auto!important;
		background-image: url('../img/dd_down_light.png');
		background-color: #0d039b;
		border: 1px solid #0d039b;
		color: #fff;
		font-weight: bold;
		font-size: 15px;
		letter-spacing: -0.5px;
	}
	form.no_bgr {
		background: transparent!important;
		border: 0!important;
		padding: 0!important;
		margin-left: 0!important;
	}

/*********************************************************
GENERAL
*********************************************************/
	.left {
		float: left; }
	.right {
		float: right; }
	.clear {
		clear: both; }
	.aright {
		text-align: right;}
	.acenter {
		text-align: center;}
	.right_border  {
		border-right: 1px dotted #f3d9e6;
	}
	.top_border {
		border-top: 1px dotted #f3d9e6;
	}
	.left_border {
		border-left: 1px dotted #f3d9e6;
	}
	.vtop {
		vertical-align: top; }
	.vbottom {
		vertical-align: bottom; }
	.justify, .justify p, {
		text-align: justify !important;}
	.error {
		color: #ff0000;}
	.warning {
		color: #ff6600;}
	.confirm {
		color: #00aa00;}
	.hidden {
		display: none!important;
	}
	.link {
		cursor: pointer;
	}
	.no_borders, .no_borders tr, .no_borders td {
		border: 0 !important;
	}
	.no_borders img {
		position: relative;
		top: -3px;
	}
	.inline_label {
		display: inline;
	}
	.invisible {
		visibility: hidden!important;
	}
	.iblock {
		display: inline-block;
	}
	.relative {
		position: relative;
	}
	.no_show {
		visibility: hidden;
	}
	.module_link {
		background: #1e3464;
		color: #fff;
		display: inline-block;
		font-size: 30px;
		padding: 20px;
	}
	#logo {
		background: none;
		color: #003d6d;
		text-align: center;
		font-size: 20px;
		position: absolute;
		left: 0px;
		top: 50px;
		width:80%;
	}
	a.button_link, span.button_link {
	 	border:	1px solid #0d039b;
	 	border-radius: 2px;
		background:	#0d039b;
		color: #fff;
		cursor: pointer;
		display: inline-block;
		font-family: 'Arial', sans-serif;
		font-size: 13px;
		font-weight: bold;
		padding: 2px 10px;
	}
	.new_link {
		font-size: 13px;
		font-weight: bold;
	}
	.blue {
		color: #0d039b;
	}
	.grey_button {
		background: #f3d9e6!important;
		border: 1px solid #f3d9e6!important;
		color: #0d039b!important;
	}
	.error_input {
		border: 1px solid #ff0000;
	}
	.black_button {
		background: #0d039b!important;
		border: 1px solid #0d039b!important;
	}



/*********************************************************
LOGIN
*********************************************************/
	#login_form {
		margin: auto;
		margin-top: 50px;
		width: 400px;}
	#login_form form {
		left: -50px;
		width: 400px !important;
		min-width: 400px;
		position: relative;
		background: #transparent;
		border: 1px solid #f3d9e6;
		color: #fff;
	}
	#login_form label {
		width: 160px;
		color: #0d039b;
	}
	#login_form ul {
		margin-left: 20px;
	}

/*********************************************************
HEADER
*********************************************************/
	#header_bar {
		background: #dfc5d2;
		box-sizing: border-box;
		color: #0d039b;
		padding: 10px;
		width: 100%;
	}
	#logo_header {
		color: #0d039b;
		font-size: 20px;
		margin-top: 20px;
		margin-left: 35px;
	}
	#header_bar a, #header_bar .menu_item {
		color: #0d039b;
		display: inline-block;
		margin-left: 20px;
	}
	#logo_header a {
		margin-left: 0!important;
	}


	#content {
		box-sizing: border-box;
		padding: 20px 20px;
	}
	.list_table {
		margin-top: 5px;
	}
	.list_table th {
		background: #0d039b;
		color: #fff;
		font-weight: bold;
	}
	.list_table th.right_border {
		border-right: 1px dotted #fff!important;
	}
	.list_table .even td {
		background: #f3d9e6;
	}
	.list_table .odd td {
		background: #e9cfdc;
	}
	.list_table .strike td {
		text-decoration: line-through;
		color: #a6a6c6;
	}
	.back_link {
		color: #fff;
		font-weight: lighter;
		font-size: 13px;
		letter-spacing: 1px!important;
	}
	.close {
		display: inline-block;
		float: right;
		font-weight: bold;
		cursor: pointer;
	}
	.explain {
		display: inline-block;
		background: #0d039b;
		color: #fff;
		padding: 1px 5px;
		cursor: pointer;
		border-radius: 10px;
		margin-right: 10px;
	}

	.dashboard_project {
		display: inline-block;
		width: 300px;
		padding: 10px;
		vertical-align: top;
		background: transparent;
		border: 1px solid #f3d9e6;
		border-radius: 5px;
		margin-bottom: 30px;
		margin-right: 30px;
	}
	.dashboard_project .project_name {
		font-size: 16px;
	}
	.dashboard_unvalidated {
		background: #d5bcc8!important;
	}
	.bl {
		border-left: 1px solid #0d039b;
	}
	.br {
		border-right: 1px solid #0d039b;
	}
	.bt {
		border-top: 1px solid #0d039b;
	}
	.bb {
		border-bottom: 1px solid #0d039b;
	}
	.closed_task td {
		background: #af95a2;
		opacity: 0.7;
	}
	.active_timer {
		font-weight: bold;
	}
	.project_tasks_bubble {
		margin-top: 20px;
		display: inline-block;
		padding: 20px;
		background: #cfb5c2;
		border-radius: 5px;
	}
	.white {
		background: #fff!important;
	}
	.bubble {
		background: #a38f99;
		display: inline-block;
		border-radius: 20px;
		padding: 20px 30px;
		margin-top: 20px;
		margin-left: 20px;
	}
	.bubble_breadcrumbs {
		text-transform: uppercase;
		font-size: 14px;
		font-family: SourceSansLight;
	}
	.bubble_name {
		color: #fff;
		font-size: 28px;
		font-weight: bold;
		padding-top: 10px;
		font-family: RalewayExtraBold;
	}
	.in_breadcrumbs {
		margin-left: 20px;
	}
	.in_bubble .bubble_name {
		padding-top: 0!important;
	}
	.bubble_month {
		color: #fff;
		font-size: 14px;
		font-style: italic;
		font-weight: bold;
		margin-top: 10px;
		text-transform: uppercase;
		font-family: RalewayExtraBoldItalic;
	}
	.back_link {
		color: #0D039B;
		font-weight: bold;
		margin-top: 20px;
	}
	.back_link span {
		border-bottom: 1px solid #0D039B;
		display: inline-block;
	}
	.back_link.tasks_back {
		margin-left: 20px;
	}
	#task_window, .task_window {
		margin-top: 20px;
		width: 900px;
		margin-left: 20px;
	}
	#task_window .task_name, .task_window .task_name {
		border: 0;
		background: transparent;
		font-size: 40px;
		font-weight: bold;
		color: #fff;
		width: 600px;
		margin-top: 40px;
		font-family: RalewayExtraBold;
	}
	#task_window .task_name::-webkit-input-placeholder, .task_window .task_name::-webkit-input-placeholder { /* WebKit, Blink, Edge */
	    color: #f0e3e9;
	}
	#task_window .task_name:-moz-placeholder, .task_window .task_name:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	   color: #f0e3e9;
	   opacity: 1;
	}
	#task_window .task_name::-moz-placeholder, .task_window .task_name::-moz-placeholder { /* Mozilla Firefox 19+ */
	   color: #f0e3e9;
	   opacity: 1;
	}
	#task_window .task_name:-ms-input-placeholder, .task_window .task_name:-ms-input-placeholder { /* Internet Explorer 10-11 */
	   color: #f0e3e9;
	}
	.timer_container {
		margin-top: 60px;
		height: 10px!important;
		padding: 0!important;
		border: 1px solid #fff;
		width: 650px;
	}
	.timer_filler {
		background: #fff;
		width: 0px;
		height: 100%;
	}
	.slider {
		margin-top: 60px;
		height: 2px !important;
		width: 650px;
	}
	.slider_separators {
		position: relative;
		top: -18px;
	}
	.slider_separator {
		display: inline-block;
		height: 30px;
		width: 50px;
		border-right: 1px dotted #fff;
		text-align: right;
	}
	.slider_separator span {
		color: #fff;
		font-size: 13px;
		font-style: italic;
		position: relative;
		top: 30px;
		left: 5px;
	}
	.ui-slider .ui-slider-handle {
		background: #fff!important;
		border-radius: 20px!important;
		border: 1px solid #fff!important;
		width: 20px!important;
		height: 20px!important;
		top: -10px!important;
		margin-left: -14px!important;
	}
	#task_window .tags, .task_window .tags {
		margin-top: 40px;
	}
	#task_window .tag, .task_window .tag {
		border: 1px solid #0d039b;
		border-radius: 10px;
		padding: 12px 20px;
		display: inline-block;
		margin-top: 15px;
		margin-right: 15px;
		font-size: 14px;
		cursor: pointer;
	}
	#task_window .tag.selected, .task_window .tag.selected {
		background: #0d039b;
		color: #fff;
	}
	#task_window .start_task_btn, .task_window .start_task_btn, #task_window .pause_task_btn, .task_window .pause_task_btn, #task_window .close_task_btn, .task_window .close_task_btn {
		display: inline-block;
		border-radius: 10px;
		background: #2fc6d6;
		border: 1px solid #2fc6d6;
		color: #fff;
		font-size: 20px;
		font-weight: bold;
		margin-top: 40px;
		padding: 10px 25px;
		line-height: 1;
		cursor: pointer;
		height: 30px;
		vertical-align: middle;
		letter-spacing: 1px;
	}
	.start_task_btn img, .pause_task_btn img {
		height: 24px;
	}
	#task_window .close_task_btn, .task_window .close_task_btn {
		margin-left: 20px;
	}
	#task_window .close_task_btn, .task_window .close_task_btn {
		background: transparent!important;
		color: #2fc6d6!important;
	}
	#task_window .start_task_btn span, .task_window .start_task_btn span,
	#task_window .pause_task_btn span, .task_window .pause_task_btn span {
		position: relative;
		top: -3px;
	}
	#task_window .close_task_btn span, .task_window .close_task_btn span {
		position: relative;
		top: -5px;
	}
	.open_tasks {
		margin-bottom: 20px;
		margin-top: 0px;
		margin-left: 20px;
	}
	.open_tasks.footer {
		border-top: 1px solid #f3d9e6;
	}
	.opened_task {
		display: inline-block;
		border-radius: 0px!important;
		background: #a4a3b8; /*#2fc6d6;*/
		border: 1px solid #a4a3b8; /*#2fc6d6;*/
		color: #fff;
		font-size: 16px;
		font-weight: bold;
		margin-top: 20px;
		padding: 15px 15px;
		line-height: 1;
		cursor: pointer;
		margin-right: 10px;
	}
	.opened_task img {
		position: relative; 
		top: 3px;
		margin-left: 10px;
	}
	.opened_task.running {
		background: #2fc6d6!important;
		border: 1px solid #2fc6d6!important;
	}
	.year_tab {
		background: transparent;
		border: 1px solid #0d039b;
		border-radius: 5px;
		color: #0d039b;
		cursor: pointer;
		display: inline-block;
		padding: 3px 5px;
		margin-left: 10px;
	}
	.year_tab:first-of-type {
		margin-left: 50px;
	}
	.year_tab.selected {
		background: #0d039b;
		color: #dfc5d2;
	}