@import url(https://fonts.googleapis.com/css?family=Open+Sans:100,300,400,600,700);
/* reset.css */
html {margin:0;padding:0;border:0;}
body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
article, aside, details, figcaption, figure, dialog, footer, header, hgroup, menu, nav, section {display:block;}
body {line-height:1.5;}
table {border-collapse:collapse;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;float:none !important;}
table, th, td {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:'';}
blockquote, q {quotes:"" "";}
a img {border:none;}
*, *:after, *:before {-ms-box-sizing: border-box;box-sizing: border-box;}
.clear {display: block;clear:both;*zoom: 1;}
.clearfix:after {display: block; content: ' '; clear: both;}
.hidden{display:none;visibility:hidden;}
.center{margin: 0 auto;}
.f-left{float: left;}
.f-right{float: right;}
.t-left{text-align: left;}
.t-right{text-align: right;}
.t-center{text-align: center;}
/*  GROUPING  */
.row:before,
.row:after { display: block; content: ' '; clear:both;}
.row { zoom:1; /* For IE 6/7 */ }

[class^="col-"] {
	margin: 1% 0 1% 0%;
}

[class^="col-"] {
	width: 100%;
}

@media all and (min-width: 980px) {
	.col-s-12 { width: 100%;}
	.col-s-11 { width: 91.51%;}
	.col-s-10 { width: 83.03%;}
	.col-s-9 { width: 74.55%;}
	.col-s-8 { width: 66.06%;}
	.col-s-7 { width: 57.58%;}
	.col-s-6 { width: 49.1%;}
	.col-s-5 { width: 40.61%;}
	.col-s-4 { width: 32.13%;}
	.col-s-3 { width: 23.65%;}
	.col-s-2 { width: 15.16%;}
	.col-s-1 { width: 6.683%;}

	/*  COLUMN SETUP  */
	[class^="col-"] {
		display: block;
		float:left;
		margin-left: 1.8%;
		margin-top: 0;
		margin-bottom: 0;
	}

	.row div:first-child,
	[class^="col-"]:first-of-type {
		margin-left: 0;
	}
}

@media all and (min-width: 1080px) {
	.col-s-12 { width: 100%;}
	.col-s-11 { width: 91.51%;}
	.col-s-10 { width: 83.03%;}
	.col-s-9 { width: 74.55%;}
	.col-s-8 { width: 66.06%;}
	.col-s-7 { width: 57.58%;}
	.col-s-6 { width: 49.1%;}
	.col-s-5 { width: 40.61%;}
	.col-s-4 { width: 32.13%;}
	.col-s-3 { width: 23.65%;}
	.col-s-2 { width: 15.16%;}
	.col-s-1 { width: 6.683%;}
}


@media all and (min-width: 1280px) {
	.col-m-12 { width: 100%;}
	.col-m-11 { width: 91.51%;}
	.col-m-10 { width: 83.03%;}
	.col-m-9 { width: 74.55%;}
	.col-m-8 { width: 66.06%;}
	.col-m-7 { width: 57.58%;}
	.col-m-6 { width: 49.1%;}
	.col-m-5 { width: 40.61%;}
	.col-m-4 { width: 32.13%;}
	.col-m-3 { width: 23.65%;}
	.col-m-2 { width: 15.16%;}
	.col-m-1 { width: 6.683%;}
}

@media all and (min-width: 1600px) {
	.col-l-12 { width: 100%;}
	.col-l-11 { width: 91.51%;}
	.col-l-10 { width: 83.03%;}
	.col-l-9 { width: 74.55%;}
	.col-l-8 { width: 66.06%;}
	.col-l-7 { width: 57.58%;}
	.col-l-6 { width: 49.1%;}
	.col-l-5 { width: 40.61%;}
	.col-l-4 { width: 32.13%;}
	.col-l-3 { width: 23.65%;}
	.col-l-2 { width: 15.16%;}
	.col-l-1 { width: 6.683%;}
}


/* Icon-Font
//==========================================================*/

@font-face {
  font-family: 'fontello';
  src: url('../fonts/fontello.eot?20454964');
  src: url('../fonts/fontello.eot?20454964#iefix') format('embedded-opentype'),
       url('../fonts/fontello.woff?20454964') format('woff'),
       url('../fonts/fontello.ttf?20454964') format('truetype'),
       url('../fonts/fontello.svg?20454964#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
}
/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?20454964#fontello') format('svg');
  }
}
*/

 [class*="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  /* opacity: .8; */

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: -1.5em;
  margin-right: 1.5em;
  padding-left: 2em;

  /* you can be more comfortable with increased icons size */
   font-size: 1.29em;  /* 18px*/
   vertical-align: middle;

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-language:before { content: '\e800'; } /* '' */
.icon-user:before { content: '\e801'; } /* '' */
.icon-news:before { content: '\e802'; } /* '' */
.icon-pages:before { content: '\e803'; } /* '' */
.icon-settings-1:before { content: '\e804'; } /* '' */
.icon-settings-2:before { content: '\e805'; } /* '' */
.icon-logout-2:before { content: '\e806'; } /* '' */
.icon-home:before { content: '\e807'; } /* '' */
.icon-media:before { content: '\e808'; } /* '' */
.icon-download:before { content: '\e809'; } /* '' */
.icon-calendar:before { content: '\e80a'; } /* '' */
.icon-job:before { content: '\e80b'; } /* '' */
.icon-logout-1:before { content: '\e80c'; } /* '' */
.icon-dashboard:before { content: '\e80d'; } /* '' */
.icon-check:before { content: '\e80e'; } /* '' */
.icon-cross:before { content: '\e80f'; } /* '' */
.icon-pencil:before { content: '\e810'; } /* '' */
.icon-study:before { content: '\e811'; } /* '' */
.icon-survey:before { content: '\e812'; } /* '' */
.icon-trash:before { content: '\e813'; } /* '' */
.icon-plus:before { content: '\e814'; } /* '' */

/* Allgemein
//==========================================================*/

html, body {
	height: 100%;
}

body {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	letter-spacing: .01em;
	line-height: 1.5em;
	color: rgb(102, 102, 102);
	background: rgb(238, 238, 238);
}


.dropdown-header {
	font-size: 14px;
}

.lang_item {
	display: none;
}


/* Layout
//==========================================================*/

#logo {
	width: 60%;
	margin: 10px auto;
	background-color: #fff;
	display: block;
	padding: 10px;
}

nav {
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 200px;
	background-color: #333;
	overflow-y: auto;
}

nav ul {
	width: 100%;
	margin: 0 auto;
	list-style-type: none;
}

#secondaryNav {
	/* position: absolute; */
	bottom: 0;
	margin-top: 50px;
	border-top: 1px solid rgba(220, 93, 0, .6);
}

nav a {
	display: block;
	padding: 10px 5px 10px 2.5em;
	color: #eee;
	text-decoration: none;
	border-bottom: 1px solid rgba(220, 93, 0, .6);
	transition: all .6s;
}

nav .active > a {
	color: rgb(220, 93, 0);
	border-bottom-width: 4px;
	font-weight: 700;
	background-color: rgb(45, 45, 45);
}

nav a:hover, nav a.active {
	background-color: rgb(220, 93, 0);
	text-decoration: none;
	color: #fff;
}

nav [class*=icon-]:before {
	margin-left: -1.5em;
	margin-right: .5em;
	padding: 0;
}

nav .subMenu {
	display: none;
	background-color: #444;
}

nav .active > .subMenu {
	display: block;
}

nav .subMenu a {
  padding: 7px 1em;
  border-bottom: none;
}

nav .subMenu a:hover {
	color: rgba(220, 93, 0, 1);
	background-color: transparent;
}


nav .subMenu .active > a {
	color: rgb(220, 93, 0);
	font-weight: 700;
	background-color: #444;
}


#langs:hover .subMenu {
	display: block;
	position: absolute;
	left: 200px;
	bottom: 0;
}

article {
	margin-left: 200px;
	padding: 30px 20px;
}

.widget {
  background-color: rgb(255, 255, 255);
  box-shadow: 2px 2px 8px -2px rgba(0, 0, 0, 0.3);
  border: 1px solid rgb(221, 221, 221);
  margin-bottom: 1.5em;
}

.widget-head {
	padding: 8px 15px;
	font-weight: 600;
	color: rgb(34, 34, 34);
	border-bottom: 1px solid rgb(221, 221, 221);
	background-color: rgb(241, 241, 241);
}

.widget-content {
  padding: 25px 15px;
}

/* Basic Style
//==========================================================*/

h1 {
	font-size: 30px;
	font-weight: 300;
	color: #222;
	margin-bottom: .5em;
	line-height: 1.5em;
}

h2 {
	font-size: 21px;
	margin-bottom: 1em;
	font-weight: 600;
	line-height: 1em;
	letter-spacing: .05em;
	padding-bottom: 5px;
	border-bottom: 1px solid rgba(0, 0, 0, .3);
}

h2:not(:first-child) {
	margin-top: 2.5em;
}

h3 {
	font-size: 1.29em;
	margin-top: 1em;
	margin-bottom: 0.8em;
	font-weight: 300;
}

p {
	line-height: 1.5em;
	margin-bottom: 1.5em;
}

a {
	color: rgba(220, 93, 0, 1);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
	transition: all .6s;
}

img {
	max-width: 100%;
}

.sortable:not(table) *:hover,
table.sortable tbody tr {
	cursor: move;
}

article ul {
	margin-left: 1.5em;
}

#ui-datepicker-div {
	z-index: 1044 !important;
}
/* Tables
//==========================================================*/

table {
	width: 100%;
	border: 1px solid #aaa;
	margin-bottom: 1.5em;
}

thead {
	border-bottom: 1px solid #aaa;
}

th {
	font-weight: 700;
}

th, td {
	padding: 8px 15px;
}

tr:nth-child(even) {
	background-color: rgb(245, 245, 245);
}

/* Forms
//==========================================================*/

fieldset {
	margin-bottom: 1.5em;
}

label {
	display: block;
	font-weight: 600;
}

input[type='checkbox'],
input[type='radio'] {
	display: none;
}

input[type='checkbox'] + label:before {
    display: inline-block;
    content: ' ';
    width: 30px;
    height: 30px;
    border: 1px solid #999;
    margin-left: 0 !important;
    margin-bottom: 5px;
    padding-left: 0;
    padding-top: 5px;
}

input[type='radio'] + label:before {
    display: inline-block;
    content: ' ';
    width: 30px;
    height: 30px;
    border: 1px solid #999;
    border-radius: 50%;
    margin-bottom: 5px;
    margin-left: 0 !important;
    padding-left: 1px;
    padding-top: 5px;
}

label:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;

  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  text-align: center;
  /* opacity: .8; */

  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;

  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;

  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-right: .5em;

  /* you can be more comfortable with increased icons size */
   font-size: 1.29em;  /* 18px*/
   vertical-align: middle;

  /* Font smoothing. That was taken from TWBS */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

input[type='checkbox']:checked + label:before { content: '\e80e'; } /* '' */
input[type='radio']:checked + label:before { content: '\e80e'; } /* '' */

input,
select,
textarea {
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	letter-spacing: .01em;
	color: rgb(102, 102, 102);

	padding: 4px 12px;
	margin-bottom: .5em;
}

input[type='text'],
input[type='password'],
select,
textarea {
	display: block;
	width: 100%;
	max-width: 450px;
}

input[type='checkbox'],
input[type='radio'] {
	height: 15px;
	width: 15px;
	vertical-align: middle;
}

input[type='checkbox'] + label,
input[type='radio'] + label {
	display: inline-block;
	margin-right: 1em;
}

table input,
table select,
table textarea {
	margin-bottom: 0;
}

.mce-tinymce {
	margin-bottom: 1.5em !important;
}

.note {
	font-size: 12px;
}

/* Messages
//==========================================================*/

#messages {
	position: relative;
	display: block;
	position: fixed;
	right: 5px;
	bottom: 5px;
	z-index: 9999;
}

.message {
	display: block;
	padding: 10px 15px;
	background-color: rgb(255, 255, 255);
	box-shadow: 2px 2px 8px -2px rgba(0, 0, 0, 0.3);
	margin-bottom: 1.5em;
}

.message-error {
	border-left: 5px solid rgb(229, 30, 30);
}

.message-warning {
	border-left: 5px solid rgb(232, 83, 10);
}

.message-success {
	border-left: 5px solid rgb(10, 171, 14);
}

.message-info {
	border-left: 5px solid rgb(10, 143, 171);
}


/* Paging
//==========================================================*/

.paging {
	margin-bottom: 1em;
	padding-bottom: .5em;
	text-align: right;
}

.paging:first-of-type {
	border-bottom: 1px solid rgb(170, 170, 170);
}

.paging:after {
	display: block;
	content: ' ';
	clear: both;
}

.pagingCounter {
	float: left;
}

.pagingLinks {
	float: right;
}

/* Buttons
//==========================================================*/

.btn {
	display: inline-block;
	padding: 4px 15px;
	border-radius: 4px;
	border: 1px solid rgb(221, 221, 221);
	background: rgb(255, 255, 255);
	margin: 3px;
	color: rgb(136, 136, 136);
	text-decoration: none;
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.08);
}

.btn-icon {
	padding: 4px;
}

.btn:hover {
	cursor: pointer !important;
	border: 1px solid rgb(170, 170, 170);
	text-decoration: none;
	color: rgb(51, 51, 51);
	transition: all .6s;
}


.btn-main {
	height: 32px;
	padding: 4px 25px;
	background-color: rgb(220, 93, 0);
	color: rgb(255, 255, 255);
}

.btn-main:hover {
	background-color: #BC5000;
	color: rgb(255, 255, 255);
}