/* CSS Document */

* {
	word-wrap: break-word;
	-moz-hyphens: auto;
   -o-hyphens: auto;
   -webkit-hyphens: auto;
   -ms-hyphens: auto;
   hyphens: auto; 
}
.c_title {
	display: none;
}
.mobile_menu {
	width: 30px;
	float: right;
	margin-top: 59px;
	cursor: pointer;
	margin-right: 25px;
}
.mobile_menu .m1,
.mobile_menu .m2,
.mobile_menu .m3 {
	width: 100%;
	float: left;
	background: #fff;
	height: 3px;
	margin-bottom: 5px;
}
.mobile_menu .m1 {
	float: right!important;
	width: 66.6666%!important;
	transition: margin .25s ease-in-out,width .25s ease-in-out,transform .25s ease-in-out;
}
.mobile_menu.clicked .m1 {
	transform: rotate(315deg) translate(-4.5px,4px);
	width: 100%!important;
	margin-left: -9px;
}
.mobile_menu .m2 {
	transition: opacity .125s ease-in-out,transform .25s ease-in-out;
}
.mobile_menu.clicked .m2 {
	transform: translateX(-100%);
	opacity: 0;
}
.mobile_menu .m3 {
	transition: transform .25s ease-in-out;
}
.mobile_menu.clicked .m3 {
	transform: rotate(225deg) translate(4.5px,4px);
	margin-left: 0px;
	margin-top: -3px;
}
.invoice_mobile {
	display: none;
	
}
@media all and (max-width: 1750px) {
	table.modern.customer_invoices span.span_btn {
		display: none;
	}
	table.modern.customer_invoices .task {
		display: none;
	}
	table.modern.customer_invoices .col-2 {
		width: 25%!important;
	}
	.mobile_menu.mobile.tasks {
		display: block!important;
		z-index: 999;
	}
	.site_nav.tasks  {
		width: 200px;
		position: absolute;
		transform: translateX(-170px);
		top: 90px;
		background: #172B4D;
		z-index: 9999;
		display: none;
	}
	.site_nav.tasks  a {
		margin: 0!important;
		width: 100%!important;
		background: none!important;
		color: #fff!important;
		text-align: center!important;
		border-bottom: 1px solid #091E42!important;
		border-radius: 0!important;
	}
	.site_nav.tasks a:last-child {
		border-bottom: 0;
	}
	.site_nav.tasks.display_mobile {
		display: block!important;
	}
	.invoice_desktop {
		display: none;
	}
	.invoice_mobile {
		display: block;
		width: calc(100% - 400px);
		height: 100vh;
		float: left;
		margin-bottom: 50px;
	}
}

@media all and (max-width: 1580px) {
	table.modern span.span_btn {
		display: none;
	}
	table.modern span.percent {
		display: block!important;
	}
}
@media all and (max-width: 1450px) {
	#main_navigation {
		width: 200px!important;
	}
	#top_navigation,
	#content{
		margin-left: 200px!important;	
		width: calc(100% - 200px)!important;
	}
	#footer {
		width: calc(100% - 200px)!important;
		left: 200px!important;
	}
	
}
@media all and (max-width: 1400px) {
	.search_window .search_input {
		width: 60%!important;
	}
	#content .card .contacts .detail-image {
		width: 80px!important;
		height: 80px!important;
	}
	#content .card .contacts .detail-image .image {
		width: 70px!important;
		height: 70px!important;
		margin: 5px!important;
		font-size: 35px!important;
		line-height: 70px!important;
	}
	#content .card .contacts .detail-content {
		width: calc(100% - 80px)!important;
		padding-left: 20px!important;
	}
	#content .card .contacts .detail-image .image .badge {
		margin-top: 10px!important;
	}
	.mobile_menu.mobile {
		display: block!important;
		z-index: 999;
	}
	.site_nav {
		width: 200px;
		position: absolute;
		transform: translateX(-170px);
		top: 90px;
		background: #172B4D;
		z-index: 9999;
		display: none;
	}
	.site_nav a {
		margin: 0!important;
		width: 100%!important;
		background: none!important;
		color: #fff!important;
		text-align: center!important;
		border-bottom: 1px solid #091E42!important;
		border-radius: 0!important;
	}
	.site_nav a:last-child {
		border-bottom: 0;
	}
	.site_nav.display_mobile {
		display: block!important;
	}
	table.modern.tasks .an {
		width: 55px!important;
	}
	table.modern.tasks .action {
		width: 65px!important;
	}
	table.modern.tasks .t_date {
		width: 95px!important;
	}
	table.modern.tasks .c_name {
		width: calc(41.666% - 215px) !important;
	}
	
}
@media all and (max-width: 1300px) {
	table.modern.tasks {}
	table.modern.customer_invoices .col-2 {
		width: 33.333%!important;
	}
	table.modern.customer_invoices .price {
		display: none;
	}
	
}
@media all and (max-width: 1270px) {
	.task_tile .col-4 {
		width: 84px!important;
	}
	.task_tile .col-8 {
		width: calc(100% - 84px)!important;
	}
	.task_tile .col-8.tn {
		width: auto!important;
	}
	
}
@media all and (max-width: 1200px) {
	table.modern.tasks .status {
		display: none;
	}
	table.modern.tasks .c_name {
		width: calc(50.666% - 215px) !important;
	}
	table.modern.tasks .percent {
		width: 20.6666%!important;
	}
	table.modern.tasks .t_name {
		width: 28.666%!important;
	}
}
@media all and (max-width: 1150px) { 
	.task_tile .col-4,
	.task_tile .col-8,
	.detail-content .col-3,
	.detail-content .col-9{
		width: 100%!important;
	}
	.task_tile .col-8.tn {
		width: auto!important;
	}
	.col-2.warning {
		width: 145px!important;
	}
	.col-10 {
		width: calc(100% - 145px)!important;
	}
}
@media all and (max-width: 1100px) {
	.progress_circle.desktop {
		display: none!important;
	}
	.progress_bar.mobile {
		display: block!important;
	}
	.task_content {
		width: 100%!important;
		float: left!important;
		padding-left: 0!important;
		margin-top: 20px!important;
	}
	.task_tile .col-4 {
		width: 84px !important;
	}
	.task_tile .col-8 {
		width: calc(100% - 84px) !important;
	}
	
}
@media all and (max-width: 1000px) {
	#top_navigation {
		width: 100% !important;
		margin-left: 0 !important;
		position: relative!important;
	}	
	#main_navigation {
		width: 100%!important;
		z-index: 999!important;
		min-height: 1px!important;
		position: relative!important;
	}
	#main_navigation .logo,
	#main_navigation .avatar {
		display: none;
	}
	.navigation {
		margin-top: 0;
	}
	.navigation ul li {
		width: calc(100% / 6)!important;
		float: left!important;
	}
	.navigation ul li a {
		width: 100%!important;
		padding: 10px 20px!important;
		text-align: center;
	}
	.navigation ul li a i {
		margin-right: 0!important;
		width: 100%!important;
		font-size: 30px!important;
		margin-bottom: 5px!important;
	}
	.navigation ul li.active {
		border-bottom-right-radius: 0!important;
		border-top-right-radius: 0!important;
	}
	.navigation span {
		font-size: 13px;
	}
	#content {
		width: 100%!important;
		margin-left: 0!important;
		margin-top: 141px!important;
	}
	#footer {
		display: none!important;
	}
	.search_window .search_input {
		width: 80%!important;
	}
	
	#login .image {
		width: 50%!important;
	}
	#login .form {
    	margin-left: 50%!important;
		width: 50%!important;
	}
	
	
}
@media all and (max-width: 820px) {
	#content .card .contacts .detail-image {
		display: none!important;	
	}
	#content .card .contacts .detail-content {
		width: 100%!important;	
		padding-left: 0!important;
	}
	
}
@media all and (max-width: 820px) {
	.navigation span {
		display: none;
	}
	.navigation ul li a {
		padding: 20px !important;
	}
	#content .title h1 {
		font-size: 28px!important;
		margin: 37px 20px!important;
	}
	#content .title.big h3 {
		display: none;
	}
	#content .title .kn {
		margin-top: 56px!important;
		margin-left: -10px!important;
	}
	#content .title .tn {
		margin-top: 56px;
		margin-left: -5px;
		margin-right: 20px;
	}
	table.modern.invoice_table .col-1 {
		width: 65px;
	}
	table.modern.invoice_table .col-2 {
		width: 130px;
	}
	table.modern.invoice_table .col-6 {
		width: calc(100% - 390px)!important;
	}
	.invoice_mobile {
		width: 100%!important;
	}
	.invoice_widgets{
		float: left!important;
		width: 100%!important;
	}
	
}
@media all and (max-width: 770px) {
	table.modern.customer .kn,
	table.modern.customer .action{
		width: 65px!important;
	}
	table.modern.customer .name,
	table.modern.customer .address{
		width: calc(50% - 65px)!important;
	}
	table.modern {
		width: calc(100% - 10px)!important;
		margin: 20px 5px!important;
	}
	span.top_btn {
		display: none!important;
	}
	table.modern.tasks .status_bar {
		display: none;
	}
	table.modern.tasks .percent .percent {
		width:100%!important;
	}
	table.modern.tasks .percent {
		width: 75px!important;
	}
	table.modern.tasks .t_name {
		width: calc(37.999% - 50px) !important;
	}
	table.modern.tasks .c_name {
		width: calc(61.999% - 240px) !important;
	}
	
}
@media all and (max-width: 730px) {
	#login .image {
		width: 30%!important;
	}
	#login .form {
    	margin-left: 30%!important;
		width: 70%!important;
	}
}
@media all and (max-width: 720px) {
	.col-6 {
		width: 100%!important;
	}
	table.modern.customer_invoices .col-2 {
		width: 25%!important;
	}
	table.modern.customer_invoices .price {
		display: block!important;
	}
	
}
@media all and (max-width: 640px) {
	table.modern.tasks .t_name {
		width: 37.999% !important;
	}
	table.modern.tasks .c_name {
		width: calc(61.999% - 195px) !important;
	}
	table.modern.tasks .t_date {
		display: none;
	}
}
@media all and (max-width: 600px) {
	#top_navigation .float-left.desktop {
		display: none;
	}
	.backlink.mobile {
		display: block;
	}
	.backlink.mobile span.backlink_span {
		display: none;
	}
	#content .title h1 {
		width: calc(100% - 55px)!important;
		margin-top: 35px !important;
		line-height: 39px!important;
	}
	#content .title .kn {
		margin-top: -40px !important;
		margin-left: 20px !important;
	}
	.title .float-left {
		width: calc(100% - 85px)!important;
	}
	form .col-3,
	form .col-9,
	form .col-4,
	form .col-8 {
		width: 100%!important;
	}
	#content .title .tn {
		margin-top: -40px !important;
		margin-left: 20px !important;
	}
	#content .title .kn.intasks {
		margin-left: 100px !important;
	}
	table.modern.invoice_table td {
		font-size: 14px;
	}
	table.modern.invoice_table .col-2 {
		width: 100px;
	}
	body table.modern.invoice_table .col-6 {
		width: calc(100% - 330px)!important;
	}
	body table.modern.invoice_table .col-1 a:nth-child(2),
	body table.modern.invoice_table .col-1 a:nth-child(3) {
		display: none;
	}
}
@media all and (max-width: 550px) {
	.search_window .search_input {
		width: 95%!important;
	}
	table.modern.customer_invoices .col-2 {
		width: 33.333%!important;
	}
	table.modern.customer_invoices .price {
		display: none!important;
	}
	table.modern.tasks .t_name {
		width: calc(37.999% + 35px) !important;
	}
	table.modern.tasks .c_name {
		width: calc(61.999% - 155px) !important;
	}
	table.modern.tasks .percent {
		display: none;
	}
}
@media all and (max-width: 525px) {
	table.modern.customer .kn,
	table.modern.customer .action{
		width: 65px!important;
	}
	table.modern.customer .name,
	table.modern.customer .address{
		width: calc(100% - 130px)!important;
	}
	table.modern.customer .address {
		display: none;
	}
	.navigation ul li a i {
		font-size: 25px !important;
		padding-top: 5px!important;
	}
	.user span {
		display: none!important;
	}
	.avatar {
		margin-right: 15px;
	}
	.top_buttons {
		margin: auto;
		width: 375px;
	}
	#main_navigation .navigation ul li a {
		padding: 20px 5px !important;
	}
	#top_navigation .user {
		padding-left: 16px;
		border-left: 1px solid rgba(0,0,0,.12);
	}
	.col-2.warning {
		width: 100%!important;
		text-align: center;
	}
	.col-10 {
		width: 100%!important;
	}
	#login .image {
		width: 15%!important;
	}
	#login .form {
    	margin-left: 15%!important;
		width: 85%!important;
	}
}
@media all and (max-width: 500px) {
	table.modern.tasks .c_name {
		display: none;
	}
	table.modern.tasks .t_name {
		width: calc(100% - 120px) !important;
	}
	.c_title {
		display: block!important;
		font-size: 10px;
	}
	
}
.mobile_view_invoice_table {
	display: none;
}
@media all and (max-width: 470px) {
	body table.modern.invoice_table .col-2 {
		display: none;
	}
	html body table.modern.invoice_table .col-6 {
		width: calc(100% - 130px)!important;
	}
	.mobile_view_invoice_table {
		display: block!important;
	}
}
@media all and (max-width: 430px) {
	#login .image {
		width: 100%!important;
		height: 15vh;
		float: left!important;
	}
	#login .form {
    	margin-left: 0%!important;
		width: 100%!important;
		float: left!important;
		min-height: 400px!important;
	}
}
@media all and (max-width: 375px) {
	.top_buttons {
		margin: 0;
		width: 100%!important;
	}
	#top_navigation .search, #top_navigation .language, #top_navigation .logout, .backlink {
		width:20%!important;
		text-align: center!important;
	}
	#top_navigation .search i, #top_navigation .language i, #top_navigation .logout i {
		padding: 23px 0!important;
	}
	#top_navigation .btn {
		padding: 12px 10px!important;
		margin: 11px 5px!important;
	}
}