@charset "UTF-8";
html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

*, *:before, *:after {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
}

a:focus, :focus {
  outline: none;
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-size: 62.5%;
}

.cc-cookies {
  width: 100%;
  font-family: Verdana, Arial, Helvetica, sans-serif;
}

#yhteystiedot p a:link,
#yhteystiedot p a:visited {
  color: white;
  text-decoration: underline;
}

#yhteystiedot p a:hover,
#yhteystiedot p a:active {
  color: #ddd;
  text-decoration: none;
}

#page {
  width: 90em;
  margin: 0 auto;
  overflow: hidden;
  background: #fff;
  padding: 0em;
  border-left: 1px solid #eee;
  border-right: 1px solid #eee;
}

/*
span.user-role-bar
{
	overflow: hidden;
}

span.user-role-bar img
{
	float: left;
	width: 200px;
	color: #ccc;
	font-weight:bold;
	font-style:italic;
	font-size: 2em;
	padding: .5em;
}
*/
#content {
  clear: both;
  width: 100%;
  padding: 1em 2em 3em 2em;
}

#content article {
  border: 1px solid #ccc;
  background: #eee;
  padding: 1em 2em 1em 2em;
  overflow: hidden;
}

#content article #ticson-form-container {
  border: none;
  background: #eee;
  padding: 1em 2em 1em 2em;
}

#content h1 {
  font-size: 2.8em;
  margin: .5em 0 .8em 0em;
}

#content h2 {
  font-size: 2.2em;
  margin: .5em 0em .8em 0em;
}

#content p,
#content ul {
  font-size: 1.8em;
}

#content ul ul,
#content ul ul ul {
  font-size: 1.5em;
}

/************************************************************************************
NAV
*************************************************************************************/
nav {
  float: left;
  clear: both;
  background: #808080;
  /* Asiakasväri 2? */
  background: white;
  padding: .5em 1em .5em 1em;
  margin: 0;
  width: 100%;
  text-align: center;
}

nav ul {
  list-style-type: none;
  list-style-position: inside;
  margin: 0 0 0 0;
  padding: 0;
  font-size: 1.5em;
  width: 100%;
}

nav ul li {
  float: left;
  display: block;
  width: 31%;
  padding: 0;
  margin: .4em .7em .6em .6em;
  border-radius: 5px;
}

nav ul li a {
  display: block;
  width: 100%;
  padding: 1em 0em 1em .5em;
  margin-right: .5em;
  border-radius: .6em;
}

nav ul li a:link,
nav ul li a:visited {
  color: black;
  background: #ddd;
  text-decoration: none;
  font-weight: bold;
}

nav ul li a:hover,
nav ul li a:active {
  color: black;
  background: #eee;
  text-decoration: underline;
  font-weight: bold;
}

/************************************************************************************
OTHER STUFF
*************************************************************************************/
ul.content-menu li {
  margin-bottom: .5em;
}

ul.content-menu li a:link,
ul.content-menu li a:visited {
  color: #0000a0;
  text-decoration: underline;
}

ul.content-menu li a:hover,
ul.content-menu li a:active {
  color: black;
  text-decoration: underline;
}

ul.new-form-menu {
  list-style-type: none;
  padding-left: 0;
}

ul.new-form-menu li {
  margin-bottom: 1.5em;
  font-size: 1.0em;
}

ul.new-form-menu li i {
  /*
	float: left;
	margin-left: .5em;
	*/
  margin-right: 1em;
  font-weight: normal;
  display: none;
}

ul.new-form-menu li a:link,
ul.new-form-menu li a:visited {
  /* color: #0000a0; */
  color: black;
  background: #ccc;
  border: 1px solid #aaa;
  border-radius: 1em;
  text-decoration: none;
  font-weight: bold;
  display: block;
  padding: .5em;
  text-align: center;
  width: 99%;
  -webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
}

ul.new-form-menu li a:hover,
ul.new-form-menu li a:active {
  color: white;
  background: #666;
  border: 1px solid #666;
  text-decoration: none;
  margin-left: 0px;
  -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
}

table {
  border-radius: 5px;
  border-collapse: collapse;
  border: 1px solid black;
  width: 99%;
  margin-bottom: 1em;
}

table td,
table th {
  border: 1px solid black;
}

table th {
  background: #ccc;
  border: 1px solid black;
  border-collapse: collapse;
}

table.lomakelistaus {
  margin-bottom: 4em;
  width: 99%;
}

table.lomakelistaus th {
  padding: 1em;
  background: #ccc;
}

table.lomakelistaus td {
  border: 1px solid black;
  padding: 1em;
  font-size: 1.6em;
  text-align: center;
}

/************************************************************************************
FORM STUFF
*************************************************************************************/
form {
  width: 100%;
  margin: 0 auto;
  background-color: rgba(238, 238, 238, 0.7);
  /* background: #eee; */
  border-radius: .8em;
  padding: 1em 2em 6em 2em;
  /* text-align: center; */
}

fieldset {
  border: 1px solid transparent;
  background: transparent;
  margin-bottom: 0em;
  padding: 1.2em 1em 1em 1em;
  border-radius: .4em;
}

fieldset#tehtava-container,
fieldset#kuva-container,
fieldset#sivu-container {
  border: 1px solid #bbb;
  padding-bottom: 2em;
  width: 95%;
  margin-left: 1.5em;
  background: #ccc;
  margin-bottom: 2em;
}

fieldset.tehtava,
fieldset.kuva,
fieldset.sivu {
  background: #FAFF96;
  padding: 3em;
  border: 1px solid #aaa;
  margin-bottom: 2em;
}

fieldset legend {
  font-weight: bold;
  font-size: 1.8em;
  padding: 0 .4em .2em 0em;
  color: #000;
  letter-spacing: .05em;
  word-break: break-all;
  display: inline;
  /* text-transform: uppercase; */
}

label {
  clear: both;
  float: left;
  font-size: 1.8em;
  font-weight: bold;
  padding-bottom: .5em;
}

input[type=text],
input[type=url],
input[type=email],
input[type=password],
input[type=tel],
input[type=date],
textarea {
  /*
	-webkit-appearance: none;
	-moz-appearance: none;
	*/
  width: 99%;
}

input[type=text],
input[type=date],
input[type=password] {
  float: left;
  clear: both;
  font-size: 1.6em;
  padding: .6em;
  margin-bottom: .5em;
}

textarea {
  font-size: 1.6em;
}

textarea {
  float: left;
  clear: both;
  line-height: 1.5em;
  padding: .5em;
  margin-bottom: .5em;
  overflow: hidden;
  height: auto;
  /* font-family: Verdana, Arial, sans-serif; */
  font-weight: normal;
  word-wrap: break-word;
}

/* iLaitteita ja LS-sivunlatausta varten */
textarea, input[type=text] {
  min-height: 2.5em;
}

#tehtava-container input[type=text],
#tehtava-container input[type=date] {
  float: left;
  clear: both;
  line-height: 1.5em;
  font-size: 1.6em;
  padding: .5em;
  margin-bottom: .5em;
  overflow: hidden;
  height: auto;
  /* font-family: Verdana, Arial, sans-serif; */
  font-weight: normal;
  word-wrap: break-word;
}

fieldset.radiobuttons,
fieldset.checkboxes {
  border: 1px solid #999;
  margin-bottom: 2.5em;
  background: none;
}

fieldset.radiobuttons + div.sub-heading-block {
  margin-top: 4em;
  margin-bottom: 1em;
}

div.sub-heading-block + fieldset.radiobuttons {
  margin-top: 0;
}

form .sub-heading-block {
  margin-left: -1em;
  margin-bottom: 2em;
  border-left: 1em solid #f80;
  border-left: 1em solid #96dac0;
  padding-left: 1.4em;
}

form .sub-heading-block h2 {
  font-size: 2em;
  margin-bottom: .2em;
}

form .sub-heading-block h3 {
  font-size: 1.8em;
  margin-bottom: 1em;
}

form .sub-heading-block h2 + h3 {
  margin-top: 0;
  margin-bottom: 2em;
}

fieldset.radiobuttons legend,
fieldset.checkboxes legend {
  padding: 0 .5em 0 .5em;
}

fieldset.radiobuttons label,
fieldset.checkboxes label {
  display: block;
  float: left;
  clear: both;
  font-size: 1.8em;
  font-weight: bold;
  margin-bottom: .5em;
  padding: 1em;
  border: 1px solid #ccc;
  background: #fdfdfd;
  border-radius: 1em;
  width: 99%;
}

fieldset.radiobuttons label.unsaved-changes,
fieldset.checkboxes label.unsaved-changes {
  border: 1px solid orange;
}

fieldset.unsaved-changes,
div.unsaved-changes {
  border: 1px solid orange;
  background: #EE0;
}

fieldset.radiobuttons label.normal {
  clear: both;
  float: left;
  font-size: 1.8em;
  font-weight: bold;
  margin-top: 1em;
  padding: 0 0 0 0;
  border: none;
  background: none;
  border-radius: none;
  width: 100%;
}

fieldset.radiobuttons input[type=radio] {
  float: left;
  margin-top: .2em;
  margin-right: .6em;
}

fieldset.checkboxes input[type=checkbox] {
  float: left;
  margin-top: .2em;
  margin-right: .6em;
}

/* autosize animation */
textarea {
  -webkit-transition: height 0.2s ease 0s;
  transition: height 0.2s ease 0s;
  vertical-align: top;
}

/*body:not(.page-forms) select,*/
body:not(.original-select) select {
  font-size: 1.6em;
  min-width: 100%;
  max-width: 100%;
  padding: 1em;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 1em;
  margin-bottom: .5em;
}

td select {
  font-size: 1em;
  padding: 0.5em;
}

table {
  margin-top: 0;
}

table input[type="button"] {
  margin-top: 0;
  font-size: 1em;
  min-height: 3em;
  float: right;
}

/*
.delete-user, .delete-new-user
{
  color:white;
  background: #D00;
  border-radius:1em;
}
.delete-user:hover, .delete-new-user:hover
{
  color:white;
  background: #F00;
  border-radius:1em;
}
*/
input#add-user {
  background: #0D0;
  border-radius: 1em;
}

input#add-user:hover {
  background: #0E0;
}

table#hallinnoi_kayttajatasoja {
  width: 90%;
}

input#add-user {
  margin-bottom: 2em;
}

option {
  padding: .25em .5em .25em .5em;
}

.form-controls {
  text-align: center;
}

#sub {
  background: #0C0;
  border-radius: .8em;
}

#sub:hover {
  background: #0E0;
}

input[type=button],
input[type=submit]:not(.unstyled),
input[type=file],
button[type=submit] {
  font-size: 1.8em;
  margin-top: 2em;
  padding: .8em 1em .8em 1em;
  /* min-height: 4em; */
}

input[type=button]#add-task,
input[type=button]#add-image,
input[type=button]#add-page {
  font-size: 1.8em;
  margin: 0em 0em 1em 0em;
  padding: .6em;
  min-height: 4em;
}

input[type=button].delete-task,
input[type=button].delete-image,
input[type=button].delete-page {
  float: right;
  clear: both;
  font-size: 1.8em;
  padding: .6em;
  min-height: 4em;
  margin: 1em 0em 0em 0em;
}

.unsaved-changes {
  border: 1px solid orange;
}

#submit.unsaved-changes,
.submit.unsaved-changes {
  border: 1px solid #C00;
  background: #EE0;
  border-radius: .2em;
}

#submit.unsaved-changes:hover,
.submit.unsaved-changes:hover {
  background: yellow;
}

.kuva-thumb {
  float: left;
  border: 1em solid white;
  background: #bbb;
  min-height: 200px;
  width: 302px;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.kuva-thumb.unsaved-changes {
  border: 1em solid orange;
}

.kuva-thumb img {
  float: left;
  width: 282px;
}

fieldset.kuva .vaihda-kuva {
  float: left;
  clear: both;
  width: 100%;
}

fieldset.kuva .vaihda-kuva input[type=button] {
  margin: 0;
  margin: 1em 0 0 29%;
}

.kuva-thumb-container {
  float: left;
  width: 45%;
}

.kuva-tiedot-container {
  float: right;
  width: 48%;
  margin-right: 1em;
}

div.kuva-tiedot {
  margin-left: 0;
  width: 100%;
}

div.kuva-tiedot textarea {
  width: 100%;
}

input.delete-image[type="button"] {
  float: right;
  clear: both;
  font-size: 1.8em;
  margin: 1em 0.4em 0 0;
  min-height: 4em;
  padding: 0.6em;
}

fieldset.kuva input[type=button] {
  margin-top: 1em;
  margin-left: 2em;
}

/************************************************************************************
ASIAKASHALLINTA
*************************************************************************************/
.yrityslogo {
  width: 260px;
  min-height: 320px;
  float: left;
  margin: 5px;
  text-align: center;
  padding: 5px;
  border: transparent 1px solid;
}

.yrityslogo:hover {
  background-color: #CCC;
}

.yrityslogo a {
  color: #666;
  text-decoration: none;
}

.yrityslogo a:hover {
  color: #666;
  text-decoration: underline;
}

h2 + table {
  margin-top: -1em;
}

th {
  font-size: 1.5em;
  padding: .2em;
}

td {
  font-size: 1.8em;
  padding: 1em;
}

td a {
  color: #0000a0;
  text-decoration: underline;
}

td a:hover {
  color: black;
  -webkit-text-decoration: undexline;
          text-decoration: undexline;
}

/************************************************************************************
Index.php-sivun tyylit
*************************************************************************************/
#sisalto {
  width: 80em;
  margin-left: auto;
  margin-right: auto;
}

#sisalto h2 {
  font-size: 1.6em;
}

#ticsonlogo {
  width: 79em;
  clear: both;
  background-color: rgba(238, 238, 238, 0.7);
  /* background: #eee; */
  /* border: transparent 1px; */
  border-radius: 0.8em;
  padding: 0em 2em 0em 2em;
  margin: 10px;
  float: left;
}

#ticsonlogo img {
  float: left;
}

#ticsonlogo h1 {
  clear: left;
  float: left;
  width: 100%;
  font-size: 2.1em;
  text-align: left;
  margin-left: 0.5em;
  margin-top: 0.5em;
  letter-spacing: 0.2em;
}

#asiakaspalvelu {
  float: right;
  font-size: 1.5em;
  margin-top: 17px;
  text-align: right;
}

#asiakaspalvelu a {
  color: black;
  text-decoration: none;
}

#asiakaspalvelu a:hover {
  color: black;
  text-decoration: underline;
}

#esittely {
  width: 35em;
  background-color: rgba(238, 238, 238, 0.7);
  /* background:#EEE; */
  border: transparent 1px;
  border-radius: 0.8em;
  padding: 0em 2em 0em 2em;
  font-size: 1.5em;
  margin: 10px;
  float: left;
}

#esittely ul li {
  list-style-position: inside;
  list-style-type: disc;
}

#etusivunlomake {
  width: 25em;
  margin-top: 10px;
  float: right;
}

#yhteystiedot {
  clear: both;
  text-align: center;
  font-size: 1.3em;
  color: #999;
  padding-top: 1em;
  padding-bottom: 1em;
}

#kirjautumislomake fieldset {
  padding: 1em 0 0 0;
  margin: 0;
}

#kirjautumislomake input[type=text],
#kirjautumislomake input[type=password] {
  margin-left: 0;
}

/*
#sisalto
{
  width: 80em;
  margin-left:auto;
  margin-right:auto;
}

#sisalto h2
{
  font-size:1.4em;

}

#ticsonlogo
{
  clear:both;
  width:200px;
  margin-left:auto;
  margin-right:auto;
}

#esittely
{
  width: 35em;
  background:#EEE;
  border: transparent 1px;
  border-radius:0.8em;
  padding:0em 2em 0em 2em;
  font-size:1.5em;
  margin:10px;
  float:left;
}

#etusivunlomake
{
  width:25em;
  margin-top:10px;
  float:right;
}

#yhteystiedot
{
  clear:both;
  text-align:center;
  font-size:1.3em;
}
*/
/************************************************************************************
LOMAKE: ASENNUSTÖIDEN TARKASTUSASIAKIRJA
*************************************************************************************/
#accordions-container {
  margin-top: 2em;
  margin-left: 1.5em;
}

.accordion {
  margin-bottom: 2em;
  border-radius: 4px;
  width: 97%;
}

.acco-color1 {
  border: 2px solid #bdcde8;
  background: #bdcde8;
}

.acco-color1 .accordion-header {
  background: #bdcde8;
}

.acco-color2 {
  border: 2px solid #addcae;
  border: 2px solid #96dac0;
  background: #96dac0;
}

.acco-color2 .accordion-header {
  background: #addcae;
  background: #96dac0;
}

.acco-color3 {
  border: 2px solid #dad68b;
  border: 2px solid #bdcde8;
  background: #bdcde8;
}

.acco-color3 .accordion-header {
  background: #dad68b;
  background: #bdcde8;
}

.acco-color4 {
  border: 2px solid #d1d562;
  border: 2px solid #96dac0;
  background: #96dac0;
}

.acco-color4 .accordion-header {
  background: #d1d562;
  background: #96dac0;
}

.accordion-form-fields {
  margin-top: 2em;
  padding-bottom: 2em;
}

div.accordion-header {
  display: block;
  padding: 1em;
  overflow: hidden;
}

#content div.accordion-header h2 {
  font-size: 1.8em;
  display: inline;
}

input.expand-accordion {
  float: right;
  margin-top: 0;
}

/************************************************************************************
KALENTERI (.datepicker, .weekpicker)
*************************************************************************************/
.ui-datepicker-calendar {
  overflow: hidden;
  background: white;
}

.ui-datepicker table {
  font-size: .5em;
}

/************************************************************************************
LOMAKE: 3-IN-1
*************************************************************************************/
.checkboxes-set-system1 input[type=checkbox] {
  float: left;
  clear: none;
  margin-top: .3em;
  margin-right: 1em;
}

.checkboxes-set-system1 label {
  float: left;
  clear: none;
}

.checkboxes-set-system1 .cb-set label.short {
  width: 10em;
}

.checkboxes-set-system1 .cb-set label.same-row {
  width: 20em;
}

.cb-set {
  clear: both;
  /* border: 1px solid red; */
  overflow: hidden;
  padding: 2em 1em 1em 2em;
  border-bottom: 3px solid #ccc;
  background: #ddd;
}

.checkboxes-set-system1 .cb-set label.before-input {
  margin-top: .5em;
  clear: both;
}

.accordion-3in1 {
  margin-top: 2em;
  margin-left: 1.5em;
}

.accordion-3in1 .accordion-form-fields {
  margin-top: 0em;
  padding-bottom: 0em;
}

.accordion-3in1 .accordion-form-fields .cb-set input[type=text],
.accordion-3in1 .accordion-form-fields .cb-set textarea {
  width: 99%;
}

.weather-data-container {
  clear: both;
}

.weather-data-container label.weather-data-header {
  /* margin-top: 1em; */
  /* margin-bottom: 1em; */
  clear: both;
  display: block;
  width: 100%;
  margin-bottom: 1em;
}

.weather-data-container .weather-data-group {
  width: 21%;
  float: left;
  margin-right: 2em;
}

.weather-data-container .weather-data-group input[type=text] {
  padding: 1.3em;
}

/************************************************************************************
TEHTÄVIEN SÄHKÖPOSTITUSRASTI
*************************************************************************************/
fieldset.task-email-checkbox {
  border: none;
  margin-bottom: 1em;
  background: none;
  padding: 0;
  padding-left: .1em;
}

fieldset.task-email-checkbox legend {
  padding: 0 .5em 0 .5em;
}

fieldset.task-email-checkbox label {
  display: block;
  float: left;
  clear: both;
  font-size: 1.6em;
  font-weight: bold;
  /* margin-bottom: .5em; */
  padding-top: 1em;
  width: 100%;
}

fieldset.task-email-checkbox label span {
  float: left;
}

fieldset.task-email-checkbox input[type=checkbox] {
  float: left;
  margin-top: .2em;
  margin-right: .6em;
}

/************************************************************************************
YHTEYSILMOITUKSET YMS.
./form-handlers/inc.connection-notifications.php
*************************************************************************************/
div#page.connected-yes {
  background: white;
}

div#page.connected-no {
  background: pink;
}

.connection-notification {
  display: none;
  width: 95%;
  background: pink;
  border: 2px dashed red;
  color: black;
  font-size: 1.5em;
  padding: 1em 2em 1em 2em;
  margin: 2em 0 2em 1em;
}

.connection-notification ul {
  margin-bottom: 0;
}

.connection-notification .form-controls {
  margin-top: 2em;
  padding: 0 0 1em 0;
}

.connection-notification .form-controls input {
  margin-top: 0;
  font-size: 1.4em;
}

/************************************************************************************
EXTRA UI STUFF
*************************************************************************************/
.form-controls .message-saving {
  font-size: 1.6em;
  margin-top: 2em;
  clear: both;
}

input[type=submit]:disabled#submit.unsaved-changes {
  background: #ccc;
  color: black;
  border: 1px solid #666;
  border-radius: .2em;
}

/************************************************************************************
SIVUN ALKUUN- JA LOPPUUN-LINKIT
*************************************************************************************/
#back-to-top div:focus,
#back-to-top a:focus,
#back-to-bottom div:focus,
#back-to-bottom a:focus {
  outline: none;
}

#back-to-top {
  position: fixed;
  margin: 0;
  bottom: 20em;
  right: 0em;
  text-align: center;
  display: none;
  z-index: 150;
  width: 11em;
}

#back-to-bottom {
  position: fixed;
  margin: 0;
  bottom: 8em;
  right: 0em;
  text-align: center;
  display: none;
  z-index: 150;
  width: 11em;
}

#back-to-top a,
#back-to-bottom a {
  border-radius: .4em 0 0 .4em;
  font-size: 1.0em;
  width: 100%;
}

#back-to-top a:link,
#back-to-top a:visited,
#back-to-bottom a:link,
#back-to-bottom a:visited {
  text-transform: uppercase;
  color: white;
  background: #0055FF;
  display: block;
  padding: 1em;
  text-decoration: none;
  -webkit-box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.75);
}

#back-to-top a:hover,
#back-to-top a:active,
#back-to-bottom a:hover,
#back-to-bottom a:active {
  color: white;
  background: black;
  display: block;
  padding: 1em;
  text-decoration: none;
  margin-right: -.1em;
  margin-bottom: -.1em;
  -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
}

#back-to-top a.ltt-active,
#back-to-bottom a.ltt-active {
  background: #0055FF;
}

/************************************************************************************
PROJEKTISIVUT
*************************************************************************************/
.project-box-container {
  float: left;
  clear: both;
  width: 100%;
  margin-bottom: 4em;
}

div.project-box-container h2 span {
  float: right;
}

div.project-box-container h2 a:link,
div.project-box-container h2 a:visited {
  color: #0000A0;
  text-decoration: underline;
  font-weight: bold;
}

div.project-box-container h2 a:hover,
div.project-box-container h2 a:active {
  color: black;
}

.project-box {
  float: left;
  width: 47%;
}

h2 + div.content-scroller {
  margin-top: -1em;
}

.content-scroller {
  height: 40em;
  /*33*/
  overflow-y: scroll;
  overflow-x: hidden;
  border: 1px solid black;
  background: transparent;
}

.content-scroller-files {
  height: 35em;
  overflow-y: scroll;
  border: none;
  background: #eee;
  margin-bottom: 1em;
}

.project-box + .project-box {
  float: right;
}

/* LOMAKELISTAUS */
table.projekti-lomakelistaus {
  width: 100%;
  height: 40em;
  /*33*/
}

table.projekti-lomakelistaus th {
  padding: .6em;
  font-size: 1.4em;
  background: #ccc;
}

table.projekti-lomakelistaus th.lomake-aika {
  width: 24%;
}

table.projekti-lomakelistaus td {
  border: 1px solid black;
  padding: .6em .6em .8em .6em;
  font-size: 1.4em;
  text-align: center;
}

table.projekti-lomakelistaus td.align-left {
  text-align: left;
}

/* TEHTÄVÄLISTAUS */
table.projekti-tehtavalistaus {
  width: 100%;
  background: #eee;
  word-wrap: break-word;
  border: none;
  margin-bottom: 0em;
}

table.projekti-tehtavalistaus th {
  padding: .6em;
  font-size: 1.4em;
  background: #ccc;
  border-top: none;
  border-left: none;
  border-right: 1px solid black;
}

table.projekti-tehtavalistaus th.lomake-aika {
  width: 11%;
}

table.projekti-tehtavalistaus td {
  border-top: 1px solid black;
  border-bottom: 1px solid black;
  border-left: none;
  font-size: 1.4em;
  padding: .6em .6em .8em .6em;
  text-align: center;
}

/* CHAT */
div#chat-messages.has-messages {
  width: 100%;
  font-size: 1em;
  background: #eee;
  padding: 1em;
  clear: both;
  margin-bottom: 1.5em;
  height: 300px;
  /*height: 39.5em;*/
  height: 32.5em;
  overflow: auto;
}

div#chat-messages.no-messages {
  width: 100%;
  font-size: 1em;
  background: #eee;
  padding: 1em;
  clear: both;
  height: 100px;
  /*height: 40.9em;*/
  height: 34em;
  text-align: center;
}

div#chat-messages.no-messages h2 {
  margin-top: 2em;
}

#chat-messages ul {
  width: 100%;
  padding: 0;
  margin: 0;
  list-style-type: none;
}

#chat-messages ul li {
  border-bottom: 1px solid #333;
  padding: 20px 10px 20px 10px;
  overflow: hidden;
}

#chat-messages ul li:first-child {
  padding-top: 10px;
}

#chat-messages ul li span.chat-message-author {
  font-size: 12px;
  font-weight: bold;
  display: block;
  padding-bottom: .5em;
}

#chat-messages ul li span.chat-message-text {
  font-size: 16px;
}

#chat-messages ul li span.chat-message-delete a:link,
#chat-messages ul li span.chat-message-delete a:visited {
  font-weight: bold;
  color: red;
  font-size: 12px;
  float: right;
  text-decoration: none;
}

#chat-messages ul li span.chat-message-delete a:hover,
#chat-messages ul li span.chat-message-delete a:active {
  text-decoration: underline;
}

form#chat-form {
  background: #ccc;
  padding-left: 0;
  padding-right: 0;
}

input#chat-message {
  width: 75%;
  float: left;
}

input#send-chat-message {
  float: right;
  margin-top: -2px;
  min-height: 0;
  height: 45px;
  font-size: 1.8em;
}

form#send-pdf-link-dialog-form label.error {
  color: red;
  font-weight: bold;
  font-size: 1.2em;
}

/* YLEINEN */
#filemanager .elfinder-cwd table td:nth-child(2) {
  display: none;
}

.round-corners {
  background: none repeat scroll 0 0 #ccc;
  padding: 1.5em 1.5em .3em 1.5em;
  border-radius: 0.8em;
}

table.projekti-lomakelistaus tr,
table.projekti-tehtavalistaus tr {
  border-bottom: 1px solid black;
}

table.projekti-lomakelistaus tr:first-child,
table.projekti-tehtavalistaus tr:first-child {
  border-bottom: none;
}

table.projekti-lomakelistaus tr:last-child,
table.projekti-tehtavalistaus tr:last-child {
  border-bottom: none;
}

table.projekti-lomakelistaus td,
table.projekti-lomakelistaus th,
table.projekti-tehtavalistaus td,
table.projekti-tehtavalistaus th,
.project-box table,
.project-box-container table,
.content-scroller {
  border: 0;
}

table.projekti-lomakelistaus td {
  background: #eee;
}

.content-scroller {
  margin-bottom: 1em;
}

table.projekti-lomakelistaus th,
table.projekti-tehtavalistaus th {
  height: 3em;
}

span.lomake-description {
  text-transform: uppercase;
  font-size: .8em;
  font-weight: bold;
}

span.tiedosto-description {
  font-family: "Consolas", "Courier New", monospace;
  font-size: .9em;
  font-weight: normal;
}

/* TIEDOSTONHALLINTA */
table.projekti-lomakelistaus th.tiedosto-aika {
  width: 18%;
}

.file-display-navi {
  display: block;
  overflow: hidden;
  width: 100%;
}

#content .file-display-navi ul {
  float: none;
  list-style-type: none;
  padding: 0;
  margin: 0;
}

.file-display-navi ul li {
  float: left;
  margin-right: .5em;
}

.file-display-navi ul li.float-right {
  float: right;
}

.file-display-navi ul li a:link,
.file-display-navi ul li a:visited {
  display: block;
  background: #aaa;
  color: #222;
  text-decoration: none;
  font-weight: bold;
  padding: .6em .8em;
  border-radius: .8em .8em 0 0;
}

.file-display-navi ul li a:hover,
.file-display-navi ul li a:active {
  color: black;
  background: #ccc;
  text-decoration: none;
}

.file-display-navi ul li a.current-file-display {
  color: black;
  background: #ddd;
  text-decoration: none;
}

#file-display-container {
  overflow: hidden;
  background: #ddd;
  padding: 3em 2em 2em 2em;
}

#file-display-filemanager {
  display: none;
}

#file-display-container table {
  background: #eee;
}

#filemanager-container {
  overflow: hidden;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  font-size: 1.2em;
  width: 65em;
  padding-bottom: .8em;
}

.elfinder-contextmenu {
  font-size: 14px;
}

/************************************************************************************
EKSTRAT
*************************************************************************************/
a.button-link:link,
a.button-link:visited {
  color: black;
  background: #ccc;
  border: 1px solid #aaa;
  border-radius: 1em;
  text-decoration: none;
  font-weight: bold;
  display: block;
  padding: .5em;
  text-align: center;
  width: 99%;
  -webkit-box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
  box-shadow: 2px 2px 2px 0px rgba(0, 0, 0, 0.5);
}

a.button-link:hover,
a.button-link:active {
  color: white;
  background: #666;
  border: 1px solid #666;
  text-decoration: none;
  margin-left: 0px;
  -webkit-box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.75);
}

/************************************************************************************
UUDET VALITSE ASIAKKUUS -TYYLIT
*************************************************************************************/
.customer-container {
  float: left;
  clear: both;
  width: 100%;
  border-radius: 1em;
  background: #eee;
}

#content .customer-container h2 {
  color: #333;
  padding-bottom: 1em;
  margin-bottom: 0;
  font-size: 1.8em;
}

.sub-customer-box {
  float: right;
  clear: both;
  width: 89.5%;
}

.customer-box .customer-logo,
.sub-customer-box .customer-logo {
  float: left;
  margin-right: 3em;
}

.customer-box .customer-logo img,
.sub-customer-box .customer-logo img {
  padding: 1em;
  background: white;
}

.customer-box .customer-name,
.sub-customer-box .customer-name {
  float: left;
  font-size: 1.0em;
}

.sub-customer-box .customer-name span {
  font-size: 1.2em;
  font-weight: bold;
  color: #444;
}

.sub-customer-box .customer-name h2 {
  margin-top: .2em;
}

.sub-customer-box .customer-logo img {
  width: 18em;
}

.customer-box a:link.customer-link,
.sub-customer-box a:link.customer-link {
  color: #666;
  background: #ddd;
  display: block;
  padding: 2em 2em 2em 2em;
  border-radius: 1em;
  overflow: hidden;
  min-height: 12em;
  margin-bottom: 2em;
}

.customer-box a:hover.customer-link,
.customer-box a:hover.customer-link h2,
.sub-customer-box a:hover.customer-link,
.sub-customer-box a:hover.customer-link h2 {
  background: #bbb;
  color: black;
  text-decoration: underline;
}

input#hakukentta {
  width: 40%;
  margin-top: 0em;
  margin-bottom: 1.5em;
}

input#tyhjenna {
  float: left;
  font-size: 1.4em;
  margin-top: -.05em;
  margin-left: 1em;
  min-height: 0;
  padding: .7em .7em .75em .7em;
}

.hidden {
  display: none;
}

.no-margin {
  margin: 0;
}

#tyhja-haku {
  display: none;
  float: left;
  clear: both;
  width: 100%;
  background: #ccc;
  padding: 2em;
  border-radius: 1em;
  margin-bottom: 2em;
}

#tyhja-haku h2 {
  text-align: center;
}

/************************************************************************************
PROJEKTISIVUN KALENTERITYYLIT
*************************************************************************************/
div.project-links {
  display: block;
  overflow: hidden;
  margin-top: 1.5em;
  margin-bottom: 1em;
}

div.project-links a:link,
div.project-links a:visited {
  font-size: 1.4em;
  color: #0000A0;
  text-decoration: underline;
  font-weight: bold;
  float: right;
  margin-left: 4em;
  margin-right: 1em;
}

div.project-links a:hover,
div.project-links a:active {
  color: black;
}

div.no-timeline-info a:link,
div.no-timeline-info a:visited,
div#content-downloading a:link,
div#content-downloading a:visited {
  color: #0000A0;
  text-decoration: underline;
  font-weight: bold;
}

div.no-timeline-info a:hover,
div.no-timeline-info a:active,
div#content-downloading a:hover,
div#content-downloading a:active {
  color: black;
}

#timeline-container {
  height: 25em;
  overflow-y: auto;
  table-layout: fixed;
}

table#block-timeline {
  border-collapse: collapse;
  font-size: .8em;
  background: white;
  margin-top: 1em;
  border: 2px solid black;
}

table#block-timeline th,
table#block-timeline td {
  padding: 8px;
}

table#block-timeline th {
  border-right: 2px solid black;
  border-left: 2px solid black;
  border-bottom: 2px solid black;
}

table#block-timeline th,
table#block-timeline th.header-day {
  background: #bbb;
}

table#block-timeline td.row-header {
  min-width: 100px;
  max-width: 100px;
  width: 100px;
}

table#block-timeline th {
  min-width: 30px;
  max-width: 30px;
  width: 30px;
}

table#block-timeline th,
table#block-timeline td.row-header {
  font-weight: bold;
}

table#block-timeline th.header-day.weekend {
  background: pink;
  color: black;
}

table#block-timeline td.row-header,
table#block-timeline th.first-column-titles {
  border-right: 2px solid black;
}

table#block-timeline thead {
  border-bottom: 2px solid black;
}

table#block-timeline td.day-box {
  vertical-align: center;
  text-align: center;
  font-weight: bold;
}

table#block-timeline tr:nth-child(odd) td.row-header,
table#block-timeline tr:nth-child(odd) td.day-box.cell-selected {
  background: yellowgreen;
}

table#block-timeline tr:nth-child(even) td.row-header,
table#block-timeline tr:nth-child(even) td.day-box.cell-selected {
  background: deepskyblue;
}

table#block-timeline span.icon {
  color: red;
}

div#timeline-info-container {
  margin-top: 3em;
  width: 100%;
}

div.no-timeline-info {
  width: 100%;
  text-align: center;
  font-size: 1em;
  background: #eee;
  width: 100%;
  padding: 1em;
  clear: both;
  margin-bottom: 1.5em;
}

table#timeline-info {
  border: 0;
  width: 100%;
}

table#timeline-info th {
  text-align: left;
}

table#timeline-info th,
table#timeline-info td {
  border: none;
  font-size: 1.4em;
}

table#timeline-info tr {
  border-bottom: 1px solid black;
}

table#timeline-info tr:first-child {
  border-bottom: none;
}

table#timeline-info tr:last-child {
  border-bottom: none;
}

.content-scroller-general {
  height: 25em;
  overflow-y: auto;
  border: none;
  background: #eee;
  margin-bottom: 1em;
}

/************************************************************************************
MUUT HUOMAUTUSLAATIKOT, ESIM. PUUTTUVAT TIEDOTTAMISEN YHTEYSTIEDOT YMS.
*************************************************************************************/
div.notification-box {
  width: 100%;
  background: pink;
  border: 1px solid red;
  padding: 2em;
  margin: 0 auto 2em auto;
}

div.notification-box a:link,
div.notification-box a:visited,
a.text-link:link,
a.text-link:visited {
  color: #0000A0;
  text-decoration: underline;
  font-weight: bold;
}

div.notification-box a:hover,
div.notification-box a:active,
a.text-link:hover,
a.text-link:active {
  color: black;
}

/************************************************************************************
UUSITTU PROJEKTISIVU
*************************************************************************************/
/*
.page-project {
	border-left: 10px dashed black;
	border-right: 10px dashed black;
}

.page-project .content-container {
	clear: both;
	width: 100%;
	padding: 0em 2em 3em 2em;
}

.page-project .content-container .content {
	border: 1px solid red;
	padding: 1em 2em 1em 2em;
	overflow:hidden;
}

.page-project .row {
	display: flex;
	flex-flow: row wrap;
}

.page-project .row .col {
	width: 100%;
	border: 1px solid #ccc;
}

.page-project .row .col + .col {
	margin-top: 1em;
}
*/
/*# sourceMappingURL=ticson-style-tablet-landscape.css.map */