@CHARSET "UTF-8";

/**GENERAL**/
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 100;
  src: url("/Assets/fonts/Lato-Hairline.eot"); /*IE9 Compat Modes*/
  src: url("/Assets/fonts/Lato-Hairline.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	   url("/Assets/fonts/Lato-Hairline.woff") format('woff'), /* Modern Browsers */
	   url("/Assets/fonts/Lato-Hairline.ttf") format('truetype'); /* Safari, Android, iOS */
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url("/Assets/fonts/Lato-Light.eot"); /*IE9 Compat Modes*/
  src: url("/Assets/fonts/Lato-Light.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	   url("/Assets/fonts/Lato-Light.woff") format('woff'), /* Modern Browsers */
	   url("/Assets/fonts/Lato-Light.ttf") format('truetype'); /* Safari, Android, iOS */
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url("/Assets/fonts/Lato-Regular.eot"); /*IE9 Compat Modes*/
  src: url("/Assets/fonts/Lato-Regular.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	   url("/Assets/fonts/Lato-Regular.woff") format('woff'), /* Modern Browsers */
	   url("/Assets/fonts/Lato-Regular.ttf") format('truetype'); /* Safari, Android, iOS */
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: url("/Assets/fonts/Lato-Bold.eot"); /*IE9 Compat Modes*/
  src: url("/Assets/fonts/Lato-Bold.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	   url("/Assets/fonts/Lato-Bold.woff") format('woff'), /* Modern Browsers */
	   url("/Assets/fonts/Lato-Bold.ttf") format('truetype'); /* Safari, Android, iOS */
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url("/Assets/fonts/Lato-Black.eot"); /*IE9 Compat Modes*/
  src: url("/Assets/fonts/Lato-Black.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	   url("/Assets/fonts/Lato-Black.woff") format('woff'), /* Modern Browsers */
	   url("/Assets/fonts/Lato-Black.ttf") format('truetype'); /* Safari, Android, iOS */
}
@font-face {
	font-family: 'Novecento';
	font-style: normal;
	font-weight: normal;
	src: url("/Assets/fonts/Novecento-BookWide.eot"); /*IE9 Compat Modes*/
  	src: url("/Assets/fonts/Novecento-BookWide.eot#iefix") format("embedded-opentype"), /* IE6-IE8 */
	     url("/Assets/fonts/Novecento-BookWide.woff") format('woff'), /* Modern Browsers */
	     url("/Assets/fonts/Novecento-BookWide.ttf") format('truetype'); /* Safari, Android, iOS */
}

@font-face {
	font-family: 'Source Sans Pro';
	font-style: normal;
	font-weight: normal;
  	src: url("/Assets/fonts/SourceSansPro-Regular.woff2") format('woff'), /* Modern Browsers */
}
td {font-family:'Lato',verdana,sans-serif;text-decoration:none;font-size:13px}
th {font-family:'Lato',verdana,sans-serif;text-decoration:none;font-size:13px}
select {font-family:'Lato',verdana,sans-serif;text-decoration:none;font-size:13px}
H1 {FONT-FAMILY:'Lato',lucida,sans-serif; FONT-SIZE: 24px; TEXT-DECORATION: none}
table.form {position: relative; top: 40px;}

INPUT {
	border: 1px solid #D3D3De;
	font-family:'Lato',verdana,sans-serif;
}

body {
	scrollbar-track-color:#b0bd90;
	scrollbar-arrow-color:#000000;
	scrollbar-face-color:#d0ddb0;
	scrollbar-shadow-color:#909d70;
	scrollbar-highlight-color:#fffff0;
	scrollbar-3dlight-color:#000000;
	scrollbar-darkshadow-color:#000000;
	font-family:'Lato',verdana,sans-serif;
}

button,
.button {
	border: 0;
	padding: 5px 10px;
	margin: 0 5px 0 5px;
	color: white;
	font-family:'Lato',verdana,sans-serif;
}

button:hover,
.button:hover {
	-moz-box-shadow:0px 0px 8px rgba(42,42,42,0.2);
	-webkit-box-shadow:0px 0px 8px rgba(42,42,42,0.2);
	box-shadow:0px 0px 8px rgba(42,42,42,0.2);
	cursor: pointer;
}

button:active,
.button:active {
	-moz-box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
	-webkit-box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
	box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
}

.button.other {
	background-color: #9FA7B4;
}
.button.apply,
.button.save {
	background-color: #A7C62B;
}
.button.add,
.button.upload {
	background-color: #36B1B9;
}
.button.view {
	background-color: #14B9D5;
}
.button.delete,
.button.cancel {
	background-color: #F5696C;
}
.button.edit {
	background-color: #F5D805;
}
.success {
	color:#A7C62B !important;
}		
/** HEADER **/
#header {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
	background: #333;
	border: 0;
} 
#header .container .brand {
	font-family: Source Sans Pro;
	font-size: 27px;
	padding: 14px 0px 22px 4px;
	margin: 0;
	line-height: 30px;
	color: #FFFFFF;
}
#header .brand em {
	color: #FFFFFF;
	font-style: normal;
}
#header .container .nav {
	color: white;
	text-align: right;
	font-family: 'Lato';
	font-size: 15px;
	float: right;
	font-weight: 300;
	padding: 9px 10px 14px 10px;
	margin-right: 0;
}
#header .container .nav > li {
	display: block;
	height: 40%;
	text-align: right;
}
[id^="icon-"], [id*=" icon-"] {
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-top: 1px;
	line-height: 14px;
	vertical-align: text-top;
	background-repeat: no-repeat;
}

@keyframes animate-bg {
    from {
        background-position: 0 0;
    }
    to {
       background-position: -80px 0;
    }
}

/**FOOTER**/
#footer {
	background-color: #f5f5f5;
}
#footer .container {
	width: 90%;
	font-size: 16px;
}
#footer p {
	display: block;
	margin: 1em 0 1em 0;
}
#footer .container div {
	float: left;
}
#footer .logo_nonius {
	background-image: url("/commonImages/guiImages/logo_nonius.png");
	width: 121px;
	height: 32px;
}
#footer #footer_logo {
	text-align: left;
	width: 30%;
	margin: 11.5px 0;
}
#footer #footer_rights {
	text-align: right;
	line-height: 23px;
	width: 30%;
}
#footer #footer_support {
	text-align: center;
	line-height: 23px;
	width: 40%;
}
#footer #footer_support a {
	font-size: inherit;
	text-decoration: underline;
	color: #333;
}

.module-link {
	color: white;
	cursor: pointer;
}
.module-link:hover {
	text-decoration: none;
}
.groupheader {
	width: 100%;
	display: inline-block;
	border-bottom: 3px solid #EEEEEE;
}
.nogroupfiller {
	height: 50px;
}
.groupfooter {
	border-top: 3px solid #EEEEEE;
	display: inline-block;
	height: 50px;
	margin-top: -15px;
	width: 100%;
}

.span4{
	margin-left: 15px;
	margin-right: 0px;
}

.groupheader .span4{
	transform: translateX(-50%);
	position: relative;
	left: 50%;
	margin-left: 0px;
}

.module-title {
	color: #646464;
	font-size: 28px;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	width: inherit;
	height: inherit;
}
.module {
	height: 180px;
	margin-bottom: 20px;
	background-color: #E6E6E6;
	border: 1px solid #DEDED6;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	color: rgb(145,145,145);
}

.groupheader .module {
	margin-bottom: 5px;
}

.module img {
	opacity: 0.7;
	filter:alpha(opacity=70);
}
.module:hover {
	color: #A7C62B;
	background-color: white;
	border-bottom: 8px solid #A7C62B;
}
.module:hover img {
	font-weight: 400;
	opacity: 1;
	filter:alpha(opacity=100);
}
.module:active {
	color: rgb(138,169,58);
	background-color: white;
	border-bottom: 8px solid #C2DD5C;
	-moz-box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
	-webkit-box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
	box-shadow:inset 0px 0px 6px rgba(42,42,42,0.2);
}

/**RESPONSIVE RULES**/
@media (min-width: 570px) and (max-width: 766px) {
	.span4 {
		width: 170px;
	}
	[class*="span"] {
		float: left;
		min-height: 1px;
		margin-left: 3px;
		margin-bottom: 12px;
	}
	.module {
		height: 150px;
	}
	.module-title {
		font-size: 20px;
		line-height: 30px;
	}
	.module img {
		width: 120px;
		height: 120px;
	}
	.container {
		width: 558px
	}
	.row {
		margin-top: 0;
		margin-bottom: 20px;
	}
	#footer .container div {
		float: none;
	}
	#footer .logo_nonius {
		margin-right: auto;
		margin-left: auto; 
	}
	#footer #footer_logo,
	#footer #footer_rights,
	#footer #footer_support {
		width: auto;
		text-align: center;
	}
	#footer,
	#push {
		height: 148px;
	}
	#wrap {
        margin: 0 auto -148px;
	}
}

@media (max-width: 569px) {
	#footer .container div {
		float: none;
	}
	#footer .logo_nonius {
		margin-right: auto;
		margin-left: auto; 
	}
	#footer #footer_logo,
	#footer #footer_rights,
	#footer #footer_support {
		width: auto;
		text-align: center;
	}
	#footer,
	#push {
		height: 148px;
	}
	.row {
		margin-top: 0;
		margin-bottom: 20px;
	}
	.span4 {
		height: 100px;
		margin-left: 0px;
		margin-right: 0px;
	}
		
	[class*="span"] {
		float: left;
		margin-bottom: 5px;
	}
	.module {
		height: 100px;
	}
	.module-title {
		font-size: 23px;
		text-align: left;
		width: 80%;
	}
	.module img {
		margin: 9px;
		width: 80px;
		height: 80px;
		float: left;
	}
	.module:hover {
		border-right: 8px solid #C2DD5C;
		border-bottom: 1px solid #DEDED6;
	}
	.module:active {
		border-right: 8px solid #C2DD5C;
		border-bottom: 1px solid #DEDED6;
	}
	.groupfooter {
	    margin-top: 0px;
	}
	.nogroupfiller {
		height: 50px;
	}
	#wrap {
        margin: 0 auto -148px;
	}
}

@media (max-width: 477px) {
	#fom {
		line-height: 40px;
	}
}
@media (max-width: 350px) {
	.module {
		height: 100px;
	}
	.module-title {
		font-size: 18px;
	}
}

@media (max-width: 979px) and (min-width: 768px) {	
	.span4 h2 {
		font-size: 26px;
	}
	.module {
		height: 150px;
	}
	.module img {
		width: 120px;
		height: 120px;
	}
	.row {
		margin-top: 20px;
	}
	#footer #footer_support {
		display: none;
	}
	#footer #footer_rights {
		width: 70%;
	}
}

/* Lastly, apply responsive CSS fixes as necessary */
@media (max-height: 500px) {
	.row {
		margin-bottom: 20px;
		margin-top: 20px;
		width: auto;
	}
}

@media (max-height: 500px) and (min-width: 979px) {
	.row {
		margin-bottom: 20px;
		margin-top: 76px;
		width: auto;
	}
}

@media (min-width: 1200px) {
	.span4 {
		width: 270px !important;
		margin-left: 15px;
		margin-right: 15px;
	}
}


@media (min-width: 585px) and (max-width: 766px) {
	.span4 {
		width: 170px;
	}
	[class*="span"] {
		float: left;
		min-height: 1px;
		margin-left: 12px;
		margin-bottom: 12px;
	}	
	.module-title {
		font-size: 20px;
		line-height: 30px;
	}	
	.container {
		width: 558px;
	}	
	.navbar .nav {
		margin-right: 50px;
	}	
	#footer {
		margin-left: -20px;
		margin-right: -20px;
		padding-left: 20px;
		padding-right: 20px;
	}
}

@media (max-width: 584px) {
	.container {
		width: auto;
	}	
	.module {
		height: 100px;
		margin-bottom: 0;
		border-collapse: collapse;
	}
	.module-title {
		font-size: 25px;
		text-align: left;
	}
	.module:hover,
	.module:active {
		border-right: 8px solid #C2DD5C;
		border-bottom: 1px solid #DEDED6;
	}
	.navbar .nav {
		float: left;
	}
	.featurette-image {
		width: 106px;
		height: 30px;
	}
	#footer_rights {
		text-align: right;
		white-space: nowrap;
	}
	#footer_support {
		display: none;
	}
	#footer {
		margin-left: -20px;
		margin-right: -20px;
		padding-left: 20px;
		padding-right: 20px;
		overflow: hidden;
	}
}

@media (max-height: 300px) {
	.span4 {
		height: 180px;
	}
	.module-title {
		font-size: 25px;
		line-height: 25px;
	}
	.module img {
		width: 100px;
		height: 100px;
		float: none;
	}
}

@media (max-width: 480px) {
	.form-horizontal .control-label {
		width: auto;
	}
	.form-horizontal .controls {
		margin-left: 0;
	}
}

@media 
only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px)  {

	/* Force table to not be like tables anymore */
	table, thead, tbody, th, td, tr { 
		display: block; 
	}
	
	/* Hide table headers (but not display: none;, for accessibility) */
	thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	tr { border: 1px solid #ccc; }
	
	td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 
		position: relative;
		padding-left: 50%; 
	}
	
	td:before { 
		/* Now like a table header */
		position: absolute;
		/* Top/left values mimic padding */
		top: 6px;
		left: 6px;
		width: 45%; 
		padding-right: 10px; 
		white-space: nowrap;
	}
}

.row-fluid .span4 {
	width:31.623931623931625%;
	*width:31.570740134569924%
}


.form-login form {
	max-width: 400px;
	margin: 0 auto;
	font-family:'Lato',verdana,sans-serif;
	font-weight: 300;
	padding-top: 25px;
}

.form-login h2 {
	text-transform: uppercase;
	font-weight: 300;
	font-size: 30px;
	color: #666666;
	line-height: 40px;
	text-rendering: optimizelegibility;
	margin-top: 23px;
	margin: 0 0 0.83em 0;
}

.form-login h4 {
	color: rgb(216,0,0);
	font-weight: 400;
}

.form-login input {
	font-size: 18px;
	padding: 7px 9px;
}

.form-login input[type="button"],
.form-login input[type="submit"] {
	padding: 11px 19px;
	min-width: 120px;
	line-height: 20px;
}

.form-login input[type="text"],
.form-login input[type="password"] {
	border: 1px solid rgba(0,0,0,0.2);
	outline: none;
	display: block;
	width: 100%;
	min-height: 30px;
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 15px 0;
    font-weight: 300;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
	-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
	-webkit-transition: border linear .2s,box-shadow linear .2s;
	-moz-transition: border linear .2s,box-shadow linear .2s;
	-o-transition: border linear .2s,box-shadow linear .2s;
	transition: border linear .2s,box-shadow linear .2s;
	border-radius: 0;
	padding: 7px 9px;
    height: auto;
}

.form-login input[type="button"],
.form-login input[type="submit"] {
	float: right;
	margin: 0;
	font-size: 22px;
	font-weight: 300;
}

.span4 h2 {
	font-weight: 300;
}

.menu, .form_container {
	position: relative;
	height: 100%;
}

.menu {
	text-align: center;
	margin-top: 2%;
}

select, 
a,
textarea,
input {
	outline: none;
}

