@charset "utf-8";
/* CSS Document */
body {
	background-color: #e9eef1;
}

#top {
	background: none;
}

#top_container {
	margin: 0 auto;
	width: 100%;
	max-width: 1016px;
	position: relative;
}

#top_image {
	width: 100%;
}

#top_languages {
	position: absolute;
	bottom: 12px;
	right: 58px;
}

#menu_languages {
	overflow: auto;
}

#menu_languages h1 {
	color: rgb(39, 63, 119);
	font-size: 14px;
	margin: 4px;
	border-bottom: none;
	display: block;
	float: left;
}

#menu_weather, #menu_weather_mobile {
	overflow: auto;
}

#menu_weather h1, #menu_weather_mobile h1 {
	color: rgb(39, 63, 119);
	font-size: 14px;
	margin: 4px;
	border-bottom: none;
	display: block;
	float: left;
}

#menu_weather h1:after, #menu_weather_mobile h1:after {
	content: ":";
}

#menu_weather div, #menu_weather_mobile div {
	font-size: 13px;
	font-weight: bold;
	color: #7b828a;
	display: block;
	font-family: Helvetica, sans-serif;
	text-decoration: none;
}

#menu_weather div a, #menu_weather_mobile div a {
	padding: 4px 10px;
	color: inherit;
	text-decoration: inherit;
	line-height: 30px;
}

#menu_weather div a:hover, #menu_weather_mobile div a:hover {
	color: #000;
}

.weather_data {
    width: 90%;
    margin: 0 5%;
    clear: both;
}

.weather_label {
    float: left;
}

.weather_value {
    float: right;
}

#booking-submit {
	color: #273f77;
	font-weight: bold;
}

#menu_languages h1:after {
	content: ":";
}

#menu_languages div {
	font-size: 13px;
	font-weight: bold;
	color: #7b828a;
	display: block;
	font-family: Helvetica, sans-serif;
	text-decoration: none;
	float: left;
}

#menu_languages div a {
	padding: 4px 10px;
	color: inherit;
	text-decoration: inherit;
	line-height: 30px;
}

#menu_languages div a:hover {
	color: #000;
}

#content {
	margin-top: -3px;
	background: url(/img/background_lines.jpg) repeat-x center top;
}

#content_container {
	margin: 0 auto;
	width: 100%;
	position: relative;
	overflow: auto;
}

#content_menu {
	background: #fff;
	width: 100%;
	float: none;
}

#content_text_padder {
	padding: 5px 10px;
	overflow: auto;
}

#content_text {
	margin-top: 10px;
	background: #fff;
	width: 100%;
	float: none;
	border: none;
}

h1.pageheader {
	color: #273f77;
	font-size: 24px;
	margin-top: 2px;
	border-bottom: 1px solid #eff3f6;
}

.kielivalittu, .kielivalinta {
	text-decoration: none;
	margin: auto 5px;
}

.kielivalittu {
	color: #62a935;
}

.kielivalinta {
	color: #7697b7;
}

.bild_fullbredd {
	width: 100%;
	height: auto;
}

/* ### Menu Styling ### */
	#cssmenu {
	  position: relative;
	  height: 44px;
	  background: #fff;
	  width: auto;
	}
	#cssmenu h1 {
		color: rgb(39, 63, 119);
		font-size: 18px;
		margin: 5px;
		border-bottom: 1px solid rgb(39, 63, 119);
		display: block;
	}
	#cssmenu ul {
	  list-style: none;
	  padding: 0;
	  margin: 0;
	  line-height: 1;
	}
	#cssmenu > ul {
	  position: relative;
	  display: block;
	  background: #fff;
	  height: 32px;
	  width: 100%;
	  z-index: 500;
	}
	#cssmenu > ul > li {
	  display: block;
	  position: relative;
	  float: left;
	  margin: 0;
	  padding: 0;
	  width: 100%;
	}
	#cssmenu > ul > #menu-button {
	  display: none;
	}
	#cssmenu ul li a {
	  display: block;
	  font-family: Helvetica, sans-serif;
	  text-decoration: none;
	}
	#cssmenu > ul > li > a {
	  font-size: 13px;
	  font-weight: bold;
	  padding: 5px 10px;
	  color: #7b828a;
	}
	#cssmenu > ul > li.has-sub > a {
	  padding-right: 32px;
	}
	#cssmenu > ul > li:hover > a {
	  color: inherit;
	}
	#cssmenu li.has-sub::after {
	  display: block;
	  content: '';
	  position: absolute;
	  width: 0;
	  height: 0;
	}
	#cssmenu > ul > li.has-sub::after {
	  right: 10px;
	  top: 10px;
	  border: 5px solid transparent;
	  border-top-color: #7a8189;
	}
	#cssmenu > ul > li:hover::after {
	  border-top-color: #ffffff;
	}
	#indicatorContainer {
	  position: absolute;
	  height: 12px;
	  width: 100%;
	  bottom: 0px;
	  overflow: hidden;
	  z-index: -1;
	}
	#pIndicator {
	  position: absolute;
	  height: 0;
	  width: 100%;
	  border: 12px solid transparent;
	  border-top-color: #2b2f3a;
	  z-index: -2;
	  -webkit-transition: left .25s ease;
	  -moz-transition: left .25s ease;
	  -ms-transition: left .25s ease;
	  -o-transition: left .25s ease;
	  transition: left .25s ease;
	}
	#cIndicator {
	  position: absolute;
	  height: 0;
	  width: 100%;
	  border: 12px solid transparent;
	  border-top-color: #2b2f3a;
	  top: -12px;
	  right: 100%;
	  z-index: -2;
	}
	#cssmenu ul ul {
	  position: absolute;
	  left: -9999px;
	  top: 70px;
	  opacity: 0;
	  -webkit-transition: opacity .3s ease, top .25s ease;
	  -moz-transition: opacity .3s ease, top .25s ease;
	  -ms-transition: opacity .3s ease, top .25s ease;
	  -o-transition: opacity .3s ease, top .25s ease;
	  transition: opacity .3s ease, top .25s ease;
	  z-index: 1000;
	}
	#cssmenu ul ul ul {
	  top: 37px;
	  padding-left: 5px;
	}
	#cssmenu ul ul li {
	  position: relative;
	}
	#cssmenu > ul > li:hover > ul {
	  left: auto;
	  top: 20px;
	  opacity: 1;
	  left: 25px;
	  border: 1px solid rgba(0,0,0,0.4);
	}
	#cssmenu ul ul li:hover > ul {
	  left: 170px;
	  top: 0;
	  opacity: 1;
	}
	#cssmenu ul ul li a {
	  width: 130px;
	  border-bottom: 1px solid #eee;
	  padding: 10px 20px;
	  font-size: 12px;
	  color: #9ea2a5;
	  background: #fff;
	  -webkit-transition: all .35s ease;
	  -moz-transition: all .35s ease;
	  -ms-transition: all .35s ease;
	  -o-transition: all .35s ease;
	  transition: all .35s ease;
	}
	#cssmenu ul ul li:hover > a {
	  background: #f6f6f6;
	  color: #8c9195;
	}
	#cssmenu ul ul li:last-child > a,
	#cssmenu ul ul li.last > a {
	  border-bottom: 0;
	}
	.submenuArrow {
	  border: 6px solid transparent;
	  width: 0;
	  height: 0;
	  border-bottom-color: rgba(0,0,0,0.4);
	  position: absolute;
	  top: -12px;
	}
	#cssmenu ul ul li.has-sub::after {
	  border: 4px solid transparent;
	  border-left-color: #9ea2a5;
	  right: 10px;
	  top: 12px;
	  -moz-transition: all .2s ease;
	  -ms-transition: all .2s ease;
	  -o-transition: all .2s ease;
	  transition: all .2s ease;
	  -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
	}
	#cssmenu ul ul li.has-sub:hover::after {
	  border-left-color: #fff;
	  right: -5px;
	  -webkit-transform: rotateY(180deg);
	  -ms-transform: rotateY(180deg);
	  -moz-transform: rotateY(180deg);
	  -o-transform: rotateY(180deg);
	  transform: rotateY(180deg);
	}
	@media all and (max-width: 900px) {
		#cssmenu {
			width: auto;
		}
		#cssmenu ul {
			width: auto;
			background: #eee;
		}
		#cssmenu .submenuArrow,
		#cssmenu #indicatorContainer {
		display: none;
		}
		#cssmenu > ul {
		height: auto;
		display: block;
		}
		#cssmenu > ul > li {
		float: none;
		}
		#cssmenu li,
		#cssmenu > ul > li {
		display: none;
		}
		#cssmenu ul ul,
		#cssmenu ul ul ul,
		#cssmenu ul > li:hover > ul,
		#cssmenu ul ul > li:hover > ul {
		position: relative;
		left: auto;
		top: auto;
		opacity: 1;
		padding-left: 0;
		border: none;
		}
		#cssmenu ul .has-sub::after {
		display: none;
		}
		#cssmenu ul li a {
		padding: 12px 20px;
		}
		#cssmenu ul ul li a {
		border: 0;
		background: none;
		width: auto;
		padding: 8px 35px;
		}
		#cssmenu ul ul li:hover > a {
		background: none;
		color: #8c9195;
		}
		#cssmenu ul ul ul a {
		padding: 8px 50px;
		}
		#cssmenu ul ul ul ul a {
		padding: 8px 65px;
		}
		#cssmenu ul ul ul ul ul a {
		padding: 8px 80px;
		}
		#cssmenu ul ul ul ul ul ul a {
		padding: 8px 95px;
		}
		#cssmenu > ul > #menu-button {
		display: block;
		cursor: pointer;
		}
		#cssmenu #menu-button > a {
		padding: 14px 20px;
		}
		#cssmenu ul.open li,
		#cssmenu > ul.open > li {
		display: block;
		}
		#cssmenu > ul.open > li#menu-button > a {
		color: #7b828a;
		border-bottom: 1px solid rgba(150, 150, 150, 0.1);
		}
		#cssmenu #menu-button::after {
		display: block;
		content: '';
		position: absolute;
		height: 3px;
		width: 22px;
		border-top: 2px solid #7a8189;
		border-bottom: 2px solid #7a8189;
		right: 20px;
		top: 15px;
		}
		#cssmenu #menu-button::before {
		display: block;
		content: '';
		position: absolute;
		height: 3px;
		width: 22px;
		border-top: 2px solid #7a8189;
		right: 20px;
		top: 25px;
		}
		#cssmenu ul.open #menu-button::after,
		#cssmenu ul.open #menu-button::before {
		border-color: #fff;
		}
	}
/* ### END --- Menu Styling ### */


/* ### Booking Styles ### */
	legend {
		font-weight: bold;
		font-size: 1.3em;
	}
    label, input {
	    display:block;
	}
	label {
		font-weight: bold;
		clear: both;
	}
    input.text, textarea.text {
	    margin-bottom:12px;
	    width:95%;
	    padding: .4em;
	    float: left;
	}
    fieldset {
	}
    .ui-dialog .ui-state-error {
	    padding: .3em;
	}
    .validateTips {
	    text-align: center;
	    border: 1px solid transparent;
	    padding: 0.3em;
	}
/* ### END --- Booking Styles ### */

/* ### News Styles ### */

#news_current {
	
}
.news_item {
	border-bottom: 1px solid rgb(39, 63, 119);
	margin-bottom: 2em;
	-webkit-box-shadow: 0 0 2px 0 #273f77;
	box-shadow: 0 0 2px 0 #273f77;
	padding: 0.5em 1em;
}
.news_item img {
	max-width: 100%;
	height: auto;
}
	.news_item_heading {
		font-size: 1.2em;
		font-weight: 900;
		color: #273f77;
	}
	.news_item_heading a {
		color: inherit;
		text-decoration: inherit;
	}
	.news_item_published {
		font-size: 0.9em;
	}
	.news_item_content {
		padding: 0.5em 1em;
	}
	.news_item_updated {
		text-align: right;
		font-size: 0.9em;
		padding: 0.2em 0.4em;
	}
#news_old {
	-webkit-box-shadow: 0 0 1px 0 #273f77;
	box-shadow: 0 0 1px 0 #273f77;
	padding: 0.5em 1em;
}
	#news_old .news_item {
		border-bottom: none;
		margin-bottom: 0;
		-webkit-box-shadow: unset;
		box-shadow: unset;
		padding: 0;
	}
	.news_listitem {
		
	}
/* ### END --- News Styles ### */

.desktop {
	display: none;
}
.mobile {
	display: block;
}


@media (min-width: 900px) {
	.desktop {
		display: block;
	}
	.mobile {
		display: none;
	}
	.weather_data {
	    width: 100%;
		margin: 0;    
	}
	#top {
		background: #0f2358;
		background: url(/img/top_filler.jpg) repeat-x;
	}
	#content_container {
		width: 900px;
	}
	#content_menu {
		float: left;
		margin-top: 15px;
		width: 180px;
	}	
	#menu_languages, #menu_weather, #menu_weather_mobile {
		overflow: inherit;
	}
	#menu_languages h1, #menu_weather h1, #menu_weather_mobile h1 {
		margin: 5px;
		border-bottom: 1px solid rgb(39, 63, 119);
		float: none;
	}
	#menu_languages h1:after, #menu_weather h1:after, #menu_weather_mobile h1:after {
		content: "";
	}
	#menu_languages div {
		float: none;
	}
	#menu_languages div a {
		padding: 2px 10px;
		line-height: normal;
	}
	#menu_weather div, #menu_weather_mobile div {
		padding: 2px 4px;
		line-height: normal;
	}
	#content_text {
		float: left;
		border: #d9e1e6 1px solid;
		margin-top: 15px;
		margin-left: 20px;
		width: 678px;
	}
}