/**
 * Responsive frontend
 */

#header-mobile {
	display: none;
}

.table {
	border-collapse: collapse;
	border-spacing: 0;
	width: 100%!important;
	min-width: 700px;
}

.table.width-medium {
	min-width: 400px;
}

.table.width-auto {
	min-width: initial;
}


/* Tablet Up */

@media (min-width: 768px) {


	ul.menu {
		height: auto;
	}
	#login-form .form-collapse {
		vertical-align: middle;
		display: inline-block;
		height: auto !important;
	}
}


/* Tablet */

@media (max-width: 979px) {
	
	.datepicker {
		padding: 0!important;
	}
	
	.account-links-container p {
		margin-bottom: 0;
	}

	/* Form responsive */
	input.input-xxlarge,
	input.input-xlarge,
	select,
	input.input-small {
		max-width: 100%;
		text-indent: 5px;
		padding: 4px 0 4px 0;
	}

	input.input-xxlarge,
	input.input-xlarge,
	select,
	.form-buttons {
		width: 100%;
	}

	.input-append {
		width: 100%;
	}
	input.input-small {
		width: 50%;
	}

	.form-horizontal .inner-content > .control-group, .form-horizontal .inner-content > .row-fluid > .control-group {
    	display: flex;
	    align-items: baseline;
    	justify-content: center;
		width: 100%;
	}

	.form-horizontal .inner-content > .row-column > .control-group {
		display: flex;
		flex-direction: column;
	    align-items: baseline;
    	justify-content: center;
	}

	.form-horizontal {
		width: 100%;
	}

	.form-horizontal .control-group, .form-horizontal .row-fluid {
		width: 100%;
	}

	.form-horizontal .control-group .controls input,
	.form-horizontal .control-group .controls select,
	.form-horizontal .control-group .controls textarea {
		width: 100%;
	}


	.form-horizontal .control-group .control-label {
		width: 27%;
		float: none;
		text-align: center;
	}
	.form-horizontal .controls {
		margin-left: 20px;
    	width: 65%;
	}

	.form-horizontal .row-fluid .span5, .form-horizontal .row-fluid .span4 {
		float: none;
	}

	.form-horizontal .row-fluid .span4 {
		margin-left: 0;
	}

	.form-horizontal .row-fluid .span4 .control-label {
		text-align: center;
    	width: 50%;
	}

	.form-horizontal .row-fluid .span4 .controls .input-mini {
		width: 100%;
	}

	.form-horizontal .form-buttons {
		width: 100%;
		display: flex;
		justify-content: space-evenly;
		align-items: center;
		flex-wrap: wrap;
		margin: 0;
	}

	.form-horizontal .form-buttons .btn {
		margin: 5px 5px;
	}

	/* Project details */ 
	.project-details label, .project-details p.details {
		width: initial;
	}

	#login-form {
		text-align: left;
	}

	#login-form h4 {
		padding-left: 15px;
		top: 50%;
    	position: relative;
    	transform: translateY(-50%);
	}
	#login-form .form-controls,
	#login-form .form-buttons+.form-links {
		margin-left: 8px;
	}
	#login-form .form-buttons {
		width: auto;
		margin-top: 0;
	}

	.member-login {
		padding: 1.2%;
	}

	.member-login #login-form h4 {
		display: block;
		text-align: center;
	}

	.member-login #login-form #login-form-collapse {
		margin: 0 auto;
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: center;
		position: relative;
		flex-wrap: wrap;
	}

	.member-login #login-form #login-form-collapse .form-buttons .btn {
			margin: 0;
		position: relative;
		display: block;
	}

	#frmRegister .inner-content .row-fluid .span4 .control-label {
		width: 27%;
	}

	#frmRegister .inner-content .row-fluid .span4 input.input-small {
		width: 25%;
	}

	#frmEdit {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}

	#frmEdit .control-group .control-label {
		width: 100%;
	}

	#frmEdit .control-group .controls {
		margin-left: 0;
		width: 100%;
	}

	#frmEdit .control-group .controls input {
		box-sizing: border-box;
		height: 30px;
	}

	#concession_wage, #concession_wage_label {
		margin-bottom: 5px;
	}
	#frmForgotPassword {
		width: 100%;
	}
}


/* Smartphone */

@media (max-width: 767px) {
	body {
		font-size: 16px;
		line-height: 1.5;
	}

	.case-description {
		margin-left: 0!important;
		width: 100%!important;
		text-align: left;
	}

	.member-login #login-form h4 {
		display: inline;
		text-align: left;
	}

	/* Project details */
	.project-details label{
		float: none;
    	text-align: center;
	}

	.project-details p.details {
		float: none;
    	text-align: center;
    	margin-bottom: 25px;
	}

	[class*="span"] {
		clear: both;
		max-width: 100%;
		margin-left: 0;
	}

	

	.container.content,
	.container.header {
		background-color: #fff;
		-webkit-box-shadow: none;
		-moz-box-shadow: none;
		box-shadow: none;
	}
	#header {
		display: none;
	}
	#header-mobile {
		display: block;
		margin: 0 auto 0 auto;
		max-width: 284px;
		width: 100%;
		height: 294px;
		position: relative;
		background-image: url(../img/header-logo-mobile.png) !important;
		background-repeat: no-repeat;
		background-position: top center;
		-webkit-background-size: 90% auto;
		background-size: 90% auto;
		text-indent: -9999px;
	}
	#header-mobile a {
		display: block;
		width: 130px;
		max-width: 100%;
		margin: 0 auto;
		height: 105px;
	}

	.header_fixed_position {
		margin: 126px auto 0 auto!important;
	}

	.header_fixed_position_2 {
		margin: 156px auto 0 auto!important;
	}

	.header_fixed_position_3 {
		margin: 0 auto 0 auto;
	}

	.login-form-toggle {
		display: block;
		float: right;
	}
	#content {
		display: flex;
		flex-direction: column;
	}
	.content-area,
	.content-area.wide,
	.content-area:first-child:last-child,
	.home-welcome,
	.sidebar {
		float: none;
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	.content-area,
	.content-area.wide,
	.home-welcome,
	.sidebar {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: flex-start;
	}

	.home-welcome {
		text-align: left;
		margin-bottom: 15px;
		align-items: flex-start;
		padding-top: 20px;
	}

	.home-welcome h1 {
		line-height: 60px;
	}

	.home-welcome p {
		font-size: 20px;
	}
	.content-area.wide > .row-fluid {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		justify-content: center;
	}

	.content-area h1 {
		margin-top: 20px;
	}
	.content-area .news-widget>h4 {
		margin-bottom: 40px;
	}
	.content-area .news-item .meta {
		margin-bottom: 20px;
		font-size: 15px;
	}
	.content-area .news-item .featured-img {
		clear: both;
		float: none;
		margin: 0 auto;
	}
	.content-area .news-item .details {
		margin: 15px 0 0 0;
	}
	.sidebar-inner {
		float: none;
		padding-left: 0;
		padding-right: 0;
		background-image: none;
	}
	.sidebar-inner .important {
		margin-left: -15px;
		margin-right: -15px;
		background: none;
	}
	.sidebar-inner .important .head h3 {
		margin-top: 0;
	}
	.sidebar {
		order: 3;
		padding-top: 0;
	}
	#login-form {
		padding-top: 32px;
		padding-bottom: 14px;
	}
	#login-form * {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#login-form span.add-on {
		padding-left: 18px;
		padding-right: 18px;
		height: 56px;
		line-height: 2.8571428571;
	}
	.newsletter-widget #mc_embed_signup .button,
	#login-form input.btn[type="submit"],
	#login-form input[type="submit"],
	button.btn,
	input.btn[type="submit"],
	.newsletter-widget #mc_embed_signup input.email,
	#login-form input[type="text"],
	#login-form input[type="password"] 
	{
		height: 56px;
		padding: 15px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}
	#login-form span.add-on+input[type="text"],
	#login-form span.add-on+input[type="password"] {
		width: calc(100% - 50px);
		border: none;
	}

	#login-form .login-form-inner-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	#login-form .login-form-inner-container .control-group, #login-form .login-form-inner-container input.btn[type="submit"], #login-form .login-form-inner-container .controls {
		margin-bottom: 5px;
	}
	.newsletter-widget #mc_embed_signup .button,
	#login-form input.btn[type="submit"],
	#login-form input[type="submit"],
	button.btn,
	input.btn[type="submit"] {
		min-width: auto;
		padding: 0 20px;
		font-size: 20px;
	}
	#login-form .form-controls {
		width: 100%;
		margin-left: 0;
		padding-top: 21px;
	}
	#login-form .form-controls .control-group {
		width: 100%;
	}
	#login-form .form-controls .control-group+.control-group {
		margin-left: 0;
		margin-top: 23px;
	}
	#login-form .form-controls +.form-buttons {
		width: 100%;
		margin-top: 21px;
		margin-left: 0;
	}
	#login-form .form-buttons+.form-links {
		margin-top: 16px;
		margin-left: 0;
	}
	#login-form .form-links {
		padding-top: 0;
		padding-bottom: 28px;
	}
	#login-form .form-links a,
	#login-form .form-links {
		font-size: 12px;
	}
	#login-form .form-links .separator {
		display: inline-block;
		visibility: visible;
		height: auto;
	}

	.member-login #login-form #login-form-collapse.login-form-active {
		height: auto;
	}

	.member-login #login-form #login-form-collapse .control-group .controls .indent {
		border: none;
	}

	.form-horizontal .control-group .control-label {
		/*width: 27%;*/
		width: 100%;
		float: none;
		text-align: left;
	}

	.form-horizontal .row-fluid .span4 {
		width: 100%;
	}

	.form-collapse {
		width: 100%;
		padding-left: 15px;
		padding-right: 15px;
		position: absolute;
		z-index: 3;
		background-color: #aca088;
	}

	/* Responsive form xs */
	.form-horizontal .form-buttons {
		flex-direction: column;
		justify-content: center;
	}
	.row-fluid label.span1, .row-fluid span.span1, .row-fluid div.span1 {
		width: 100%;
		text-align: center;
		margin: 0 0 0 0;
	}

	.row-fluid .span1 + select {
		width: 100%;
	}

	#concession_wage {
		float: none;
		display: block;
		margin-bottom: 5px;
	}

	.top-menu-mobile {
		display: flex!important;
		justify-content: center;
		margin-top: 42px;
	}

	.top-menu-mobile ul li:first-child {
		margin-top: 0;
	}

	.top-menu-mobile .top-menu {
		position: relative;
		left: 0;
		right: 0;
		margin: 0;
		width: auto;
	}

	.menu-admin-frontend-desktop {
		display: none;
	}

	ul#primary-menu, nav.menu-admin-frontend ul.menu {
		width: 100%;
		display: none;
		position: absolute;
		left: 0;
		top: 100%;
		background-color: #a45c54;
		flex-direction: column;
		justify-content: baseline;
		align-items: center;
	}

	.mobile-fixed-container {
		display: block!important;
		position: absolute;
		top: 0;
		z-index: 99;
		margin-left: 0!important;
	}

	ul#primary-menu.menu-top-active, nav.menu-admin-frontend ul.menu.menu-top-active {
		min-height: calc(100vh - (94px + 42px));
		height: auto;
		display: flex;
	}

	#menu-top-mobile {
		text-align: right;
		position: relative;
		z-index: 2;
		display: block;
	}

	#menu-top-mobile .container {
		background-color: #a45c54;
		padding: 0 1.2% 0 1.2%;
		box-sizing: border-box;
	}

	#primary-menu li, nav.menu-admin-frontend ul.menu li {
		padding: 0;
	}

	#menu-top.hidden {
		display: none;
	}
	.menu-top-toggle {
		display: inline-block;
		border: none;
		background-color: transparent;
	}
	ul.menu {
		float: none;
		left: 0;
		flex-direction: column;
	}
	.menu li {
		float: none;
		display: block;
		padding: 0 15px;
		margin-right: 0;
		right: 0;
		text-align: left;
		width: 100%;
	}
	.menu li:first-child {
		margin-top: 35px;
	}

	.menu li+li a {
		padding: 12px 20px;
		border-top: 1px solid #ad6d65;
	}
	.menu li a, .menu.users li a {
		font-size: 22px;
		font-weight: bold;
		text-align: center;
		line-height: 1.1363636364;
		color: #fff;
	}
	.news-widget .news-item:last-child {
		border-bottom: none;
	}
	form#frmContact input,
	textarea {
		box-sizing: border-box;
	}
	form#frmContact input {
		min-height: 30px;
	}
	.location-map {
		max-width: 100%;
	}
	.footer-wrap {
		padding-left: 15px;
		padding-right: 15px;
		margin-bottom: 0;
		background: none;
		color: #fff;
	}
	.footer-wrap ul {
		float: none;
		text-align: left;
	}
	.footer-wrap ul.first {
		margin: 0;
	}
	.footer-wrap li a {
		font-size: 16px;
		line-height: 1.5625;
		color: #fff;
	}
	.footer-wrap p.large {
		float: none;
		padding: 0;
		margin: 0 0 26px;
		text-align: left;
		font-size: 22px;
		color: #fff;
	}
	.footer-wrap p.copyright {
		margin-top: 34px;
		padding-right: 0;
		text-align: left;
		font-size: 14px;
		color: #fff;
	}

	.content-area .rate-tables, .content-area .collective-agreements {
		align-self: flex-start;
	}

	#frmRegister .inner-content .row-fluid .span4 .control-label {
		width: 100%;
	}

	#frmRegister .inner-content .row-fluid .span4 input.input-small, #frmRegister .inner-content input.input-small, #frmRegister .inner-content .control-group .smalltext #email, #frmRegister .input-xxlarge, #frmRegister .input-xlarge, .form-horizontal .input-xlarge, #frmRegister #company_phone, #frmRegister #password, #frmRegister #confirm {
		width: 99%;
	}

	#frmRegister .inner-content input.input-small, #frmRegister input.input-medium, #frmRegister .inner-content .control-group .smalltext #email, #frmRegister #company_phone, #frmRegister #password, #frmRegister #confirm {
		float: right;
	}

	#frmRegister .inner-content .control-group .smalltext {
		margin-right: 0;
	}

	#frmRegister input {
		height: 30px;
		box-sizing: border-box;
		max-width: 100%;
	}

	#frmRegister #submit {
		font-size: 15px;
	}

	.modal {
		box-sizing: border-box;
		left: initial;
		margin: 0 auto;
		max-width: 100%;
		width: 100%;
		border: none;
	}

	.content-area .news-item img {
		display: block;
		margin: 15px auto 15px;
	}

	.member-login {
		padding: 4px;
		text-align: center;
	}

	.content-area .span2 {
		width: auto;
		margin-top: 15px;
		margin-bottom: 15px;
	}

	.sidebar h4 {
		color: grey;
		font-weight: 400;
		font-size: 30px;
		line-height: 40px;
	}

	.sidebar-inner .important .body ul li {
		font-size: 16px;
	}

	.sidebar-inner .important .wrapper .body h4, .sidebar-inner .important .body ul li {
		color: black;
	}

	.sidebar-inner .important .head {
		padding: 5px 15px;
	}

	.sidebar-inner .important .head h3 {
		font-size: 30px;
	}

	.sidebar-inner .important .body {
		margin-top: 25px;
	}

	.news-item a.read-more {
		color: #a45c54;
	}

	.news-widget .news-item {
		margin-top: 30px;
		padding-bottom: 0;
	}

	.news-item {
		border-bottom: solid 1px black;
	}
	
	.collective-question .a {
		padding: 0 20px 15px 20px;
	}

	.links, .contact form, .location-map {
		width: 100%;
	}


	#menu-top.menu-admin-frontend .container{
		background-color: #a45c54
	}

	#menu-top.menu-admin-frontend .container .users li a {
		padding: 15px;
		font-size: 16px;
	}

	.form-horizontal .controls, .form-horizontal .controls .input-append {
		margin-left: 0;
		width: 100%;
		display: flex;
		justify-content: center;
		flex-wrap: wrap;
	}

	.form-horizontal .input-append.datepicker {
		flex-wrap: nowrap;
	}

	.form-horizontal .inner-content .controls input, .form-horizontal .inner-content .controls select {
		width: 100%;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls div p {
		margin: 10px 0;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls div p label.input {
		text-align: center;
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls div p label.input input,
	.form-horizontal .inner-content .row-fluid .control-group .controls div p select,
	.form-horizontal .controls,
	 {
		width: 100%;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls input[type="checkbox"],
	.form-horizontal .inner-content .row-fluid .control-group .controls div p label.input input[type="checkbox"] {
		width: auto;
	}

	.form-horizontal .inner-content .row-fluid .control-group .project-completion {
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		align-items: center;
		margin-top: 0;
		padding-top: 0;
	}

	.form-horizontal .inner-content .row-fluid .control-group .project-completion #project_completion {
		margin-bottom: 0px;
		margin-right: 10px;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls div p {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.form-horizontal .inner-content .row-fluid .control-group .controls div p select {
		margin-bottom: 35px;
	}

	.form-horizontal .inner-content .controls .add-on {
		box-sizing: border-box;
		height: 30px;
		max-width: 10%;
	}

	.form-horizontal .inner-content .control-group {
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.form-horizontal .form-buttons .btn {
		width: 100%;
		box-sizing: border-box;
	}

	.member-login {
		line-height: 1rem;
	}

	a.btn {
		padding: 8px;
	}
 
	.modal .modal-footer a.btn {
		padding: 15px;
		width: 30%; 
	}

	.remmittance-container p {
		width: 100%;
		box-sizing: border-box;
		margin: 0;
		margin-left: 0;
		padding: 0;
	}
	.remmittance-container {
		line-height: 0.3;
	}
	.remmittance-container p a {
		width: 100%;
		box-sizing: border-box;
		margin: 0;
	}

	.top-bar-container {
		padding: 0;
	}

	label[for="project_completion"] {
		text-align: right!important;
	 }

	 div.inputs-div {
		 width: 100%;
	 }

	 div.inputs-div p label.input {
		 width: 100%;
		 align-items: flex-end!important;
	 }
}