/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
/* ========================================================================== */
@font-face { font-family: 'Source Sans Pro'; font-style: normal; font-weight: 400; src: local('Source Sans Pro'), local('SourceSansPro-Regular'), url('../fonts/source-sans-pro-v9-latin-regular.woff2') format('woff2'), url('../fonts/source-sans-pro-v9-latin-regular.woff') format('woff'); }
@font-face { font-family: 'Source Sans Pro'; font-style: normal; font-weight: 600; src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), url('../fonts/source-sans-pro-v9-latin-600.woff2') format('woff2'), url('../fonts/source-sans-pro-v9-latin-600.woff') format('woff'); }
@font-face { font-family: 'Source Sans Pro'; font-style: normal; font-weight: 700; src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url('../fonts/source-sans-pro-v9-latin-700.woff2') format('woff2'), url('../fonts/source-sans-pro-v9-latin-700.woff') format('woff'); }
@font-face { font-family: 'Yanone Kaffeesatz'; font-style: normal; font-weight: 400; src: local('Yanone Kaffeesatz Regular'), local('YanoneKaffeesatz-Regular'), url('../fonts/yanone-kaffeesatz-v7-latin-regular.woff2') format('woff2'), url('../fonts/yanone-kaffeesatz-v7-latin-regular.woff') format('woff'); }
@font-face { font-family: 'Lobster Two'; font-style: normal; font-weight: 400; src: url('../fonts/lobster-two-regular.woff2') format('woff2'), url('../fonts/lobster-two-regular.woff') format('woff'); }
@font-face { font-family: 'icomoon'; font-style: normal; font-weight: 400; src: url('../fonts/icomoon.eot?475w5u'); src: url('../fonts/icomoon.eot?#iefix475w5u') format('embedded-opentype'), url('../fonts/icomoon.woff?475w5u') format('woff'), url('../fonts/icomoon.ttf?475w5u') format('truetype'), url('../fonts/icomoon.svg?475w5u#icomoon') format('svg'); }
@font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; }
/* ========================================================================== */
*, *::before, *::after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; }
html { overflow-y: scroll; }
body { margin : 0; padding : 0; color: #484848; background-color: #598d9c; font-family: "Source Sans Pro", sans-serif; font-size: 16px; font-size: 1rem; line-height: 1.5; font-weight: 400;  }
h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-family: "Yanone Kaffeesatz", sans-serif; font-weight: 400; }
#logo a { color: #fff; font-family: 'Lobster Two', Arial, helvetica, sans-serif; font-weight: 400; }

#logo a { font-size: 76px; line-height: 1em; text-decoration: none; border-bottom: none; letter-spacing: 0.01rem; margin-left: 4px;}
h1, .h1 { font-size: 30px; line-height: 34px; margin-top: 0px; text-transform: uppercase; }
h2, .h2 { font-size: 28px; line-height: 32px; margin-top: 2rem; margin-bottom: 1rem; text-transform: none; }
h3, .h3 { font-size: 24px; line-height: 28px; margin-top: 1rem; text-transform: none; }
h4, .h4 { font-size: 22px; margin-top: 1rem; margin-bottom: 0.5rem; text-transform: none; }

p, ul, ol, pre, table, blockquote { margin: 0px 0px 1.250rem; }

h2.bar { font-size: 26px; text-transform: uppercase; background-color: #b5d3d6; padding-left: 4px; overflow: hidden; }
h3.bar { text-transform: uppercase; background-color: rgb(155, 190, 204); padding-left: 4px; overflow: hidden; }
h2.bar a { float: right; font-size: 40px; line-height: 26px; margin: 0px; padding: 0px 10px 6px; text-decoration: none !important; }
h4.bar { background-color: #9fd2df; padding-left: 4px; margin-top: 0px; margin-bottom: 0px; }

b, strong, .strong { font-weight: 600; }
small, .small { font-size: 0.813rem; }
hr, .hr { display: block; clear: both; height: 0; margin: 1.5rem 0; border: 0; outline: none; border-top: 1px solid #d9d9d9; }
.semibold { font-weight: 600; color: #757262; }


/* ---- Links ---- */

a:link, a:visited { color: rgb(33, 36, 241); outline: 0; text-decoration: none; }
a:hover, a:active { text-decoration: underline; }
a[href^="http:"], a[href^="https:"] { color: rgb(99, 101, 214); background: url(/img/ext_link_darker.png) no-repeat scroll right center transparent; margin-right: 4px; padding-right: 16px; }
a.no-ext-icon { background: none; margin-right: 0px; padding-right: 0px; }
a[href^="http://www.vaskivesi.fi"] { background-image: none; padding-right: 0; margin-right: 0; }
a:active { color: #15a1ff; background-color: rgba(41, 136, 202, 0.2); }
a.button { font-family: Arial, sans-serif; font-size: 14px; letter-spacing: 1px; line-height: 50px; text-align: center; text-transform: uppercase; text-decoration: none; color: #fff; border-bottom: none; background-color: #0786db; display: block; height: 50px; width: 350px; margin: 20px 0; border-radius: 3px; overflow: hidden; }
a.button:hover { color: #ffbd07; }
a.button:active { color: #fdc75f; transform: translateY(2px); }

#page-container  { width: 95%; max-width: 1500px; margin: 0 auto; border-left: 1px solid rgb(38, 85, 99); border-right: 1px solid #ccc; box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); }
header, #footer, .main-container { width: 100%; max-width: 1500px; margin: 0 auto;}
header { position: relative; height: 200px; border-top: 2px solid #fdc75f; background-image: url(../img/vaskiveden-raitti.jpg); background: center bottom no-repeat #1488d6; background-size : cover; display:contain;}
#logo { margin: 0px; padding: 30px 600px 20px 260px; border-bottom: 2px solid #2970a0; height: 200px; background-image: linear-gradient(90deg, #06cdff 10%, #08aee0f5 20%, #00b7ff6e 50%, #00b7ff00 80%);}
#logo a:hover, #logo a:active { color: #fdc75f; }

/* ---- Navigation ---- */


#menu-toggle { display: none; }
.sidebar-container { display: table-cell; width: 200px; background-color: #2970a0; border-top: 7px solid #fdc75f; padding: 40px 0px; border-right : 1px solid rgb(92, 142, 175);}
#sidebar { width: 228px; border-top: 1px solid #0b517a; border-bottom: 1px solid #0b517a; background-color: #d1e6f1; }

ul.sidenav { list-style: none; margin: 20px 0px; padding: 0;}
ul.sidenav li { border-bottom: 1px solid #78a1c9; }
ul.sidenav li a { color: #494949; font-size: 14px; line-height: 20px; padding: 4px 2px 4px 18px; display: block; text-decoration: none; }
ul.sidenav li a:hover { background-color: #5da0df; }
ul.sidenav li a:active { background-color: rgba(41, 136, 202, 0.2); }
ul.sidenav li a.current { border-left: 6px solid rgb(36, 34, 121); color: rgb(36, 34, 121); font-weight: 600; }
ul.sidenav li.subhead { color: #484848; padding: 14px 0px 4px 10px; font-size: 15px; font-family: Arial, helvetica, sans-serif; font-weight: bold; text-transform: uppercase; }

.main-container { display: table; padding-top: 0px; background-color: #fff; width : 100%; margin : 0 auto;}
#content { display: table-cell; vertical-align: top; max-width: 922px; padding: 40px 40px 40px 50px; }

.article { float: left; clear:left; width: 72%; max-width: 1150px; text-align: justify; align-self: center;}
.article-wide { width: 74%; max-width: 800px; }
.article-full { width: 100%; max-width: 832px; }
.aside { float: right; width: 35%; max-width: 292px; padding-left: 40px; }
.aside-narrow { width: 25%; max-width: 212px; padding-left: 20px; }

.col-1 { float: left; clear: left; width: 55%; padding-right: 5px;}
.col-2 { float: right; width: 41%; padding-left: 5px;}
.col-3 { float: left; width: 31%; }
.col-1 { float: left; clear: left; width: 50%; }
.col-2 { float: right; width: 46%; }

.col-full { width: 100%; }
.col-half { float: left; clear: left; width: 46%; }
.col-half-left { float: left; width: 48%; }
.col-half-right { float: right; width: 48%; }

ul.zebra-list li.zebra-list-image-post{ margin: 0px; padding: 0px; }
ul.zebra-list li.zebra-list-image-post figure { margin: 0px; }
ul.zebra-list li.zebra-list-image-post figure figcaption { margin: 0px; }

.image-wrap { display: block; max-width: 340px; }
.image-wrap img { width: 100%; }

.superkuvat { float: right; width: 36%; text-align: right; }
.superkuvat img { width: 100%; max-width: 250px; }

.nostot { width: 100%; overflow: hidden;}
.nostot > div { width: 31%; float: left; margin: 0px 0px 20px 3.5%; border: 1px solid #d9d9d9; background-color: #f5f5ea; }
.nostot > div:nth-child(3n+1) { margin-left: 0px; }
.nostot > div img { width: 100%; display: block; border-bottom: 1px solid #d9d9d9; }
.nostot > div p { font-size: 15px; line-height: 1.4; margin: 0; padding: 8px 2px; text-align: center; background-color: #f5f5ea; }
.nostot > div span { display: block; }
.nostot > div.tmp-hide { display: none; }

.tapahtumanostot { margin-top:  0px; }
.tapahtumanostot h3 { margin-bottom: 2px; }
.tapahtumanostot a { white-space: nowrap; }
.tapahtumanostot p { margin-top: 0px; margin-bottom: 0px; }

.infobox { text-align: center; padding: 6px 16px; background-color: #a8ecec; border: 1px solid #e3e3e3; border-radius: 5px; }
.infobox h4 { margin-top: 8px; margin-bottom: 2px; }
.infobox p { margin: 10px 4px; }

.to-lower { text-transform: none; }
.to-upper { text-transform: uppercase; }
a.overstike, .overstrike { text-decoration: line-through !important; }
.no-top { margin-top: 0px; }
.no-bottom { margin-bottom: 0px; }
.half-top { margin-top: 0.5em; }
.half-bottom { margin-bottom: 0.5em; }
.double-top { margin-top: 2em; }
.double-bottom { margin-bottom: 2em; }
.triple-top { margin-top: 3em; }
.triple-bottom { margin-bottom: 3em; }
.nobr { white-space: nowrap; }
.korostus { background-color: #b8eefc !important; }
.highlight { background-color: #ffd56a !important; }
.huomio { background-color: #c7fbff !important; }

p.aside-nb { text-align: center; font-size: 14px; padding: 16px; }


/* ---- Images ---- */

figure img { display: block; width: 100%; }
figure.article-image { margin: 0 0 30px 0; }
figure.article-image.float-left { margin: 6px 20px 20px 0; max-width: 50%; float: left; clear: left;}
figure.article-image.float-right { margin: 6px 0px 20px 20px; max-width: 50%; float: right; clear: right;}
figure.article-image.aikataulu-image { max-width: 540px; }
figure.article-image.big-nosto { max-width: 640px; }
figure.ajankohtaista-image { display: block; width: 100%; margin: 0; }
figure.ajankohtaista-image figcaption { margin: 0px; }

figure.aside-image { margin: 0;}
figure.supernosto { margin: 1em 10px; }
figure.supernosto figcaption.caption { font-size: 14px; }
figure figcaption { margin: 4px 0px 24px 0px; padding: 10px; background-color: #eef4f6; font-size: 14px; text-align: center; z-index: 2; }
figure figcaption.caption { font-size: 13px; }
figure figcaption.mini-caption { font-size: 13px; color: #727272; background-color: #fff; padding: 0px 4px; text-align: right; }
figure figcaption.mini-caption a { color: #727272; }

figure.kuitudia { float: left; margin: 0 20px 20px 0; }
figure.kuitudia img { max-width: 250px; height: auto; }

/* --- Image addition --- */
figure > .tapahtuma-kuva { margin: 0 0 30px 0; width : 85%;}
.teaser-image {margin: 0 0 30px 0; width : 100%; display: contain;}
/* ---- Tables ---- */

table.aikataulut { width: 100%; margin-top: 25px; margin-bottom: 25px; font-size: 14px; line-height: 16px; text-align: center; }
table.aikataulut thead tr { background-color: #eeece3; }
table.aikataulut tfoot tr { background-color: #f6f6ee; }
table.aikataulut th, table.aikataulut td { padding: 3px 8px; }
table.aikataulut thead tr, table.aikataulut tfoot tr, table.aikataulut tbody td { border-width: 1px; border-color: #d0d0d0; border-style: solid; }
table.aikataulut th { vertical-align: bottom; }
table.aikataulut td { vertical-align: top; }
table.aikataulut thead th:first-of-type, table.aikataulut tfoot th:first-of-type, table.aikataulut tbody td:first-of-type { text-align: left; }
table.aikataulut tfoot th { font-weight: 600; }

/* Footer */
#footer { clear: both; padding: 10px; text-align: center; background-color: #1d3949; color: #fff; }
#footer p { font-size: 14px; margin: 4px; }
#footer a { color: #ccc; }
#footer p.footer-linkit a { margin: 2px; padding: 8px; }
#footer a:hover { color: #fff; background-color: transparent; text-decoration: underline; }

/* http://stackoverflow.com/a/5308785 */
ul.tiny-dot, ul.tiny-dot ul { list-style: none outside none; }
ul.tiny-dot { position: relative; margin-left: .2em; padding-left: 1em; }
ul.tiny-dot li::before { position: absolute; content: "•"; color: #737373; left: 0; }
ul.tiny-dot ul li::before { left: .5em; }
ul.tiny-dot ul li { padding-left: .2em; }

ul.no-dot li::before { content: " "; }


/* ---- Events frontpage ---- */

.tapahtuma-viikko { margin-bottom: 1rem; }
.tapahtuma-viikko h3 { text-transform: uppercase; background-color: #cbe4e7; padding-left: 4px; margin-top: 1em; margin-bottom: 0px; overflow: hidden; }
.tapahtuma-viikko ul { position: relative; margin: 0px; padding: 0px; list-style-type: none; }
.tapahtuma-viikko li { padding: 4px 2px 4px 120px; border-bottom: 1px solid #688faa; }
.tapahtuma-viikko li:last-of-type { border-bottom: none; }
.tapahtuma-viikko ul.last li { border-bottom: 1px solid #e3e3e3; }
.tapahtuma-viikko li span:first-of-type { position:  absolute; left: 4px; }
.tapahtuma-viikko li p { margin: 0px 0px 2px; }
.tapahtuma-viikko li p.double-top { margin: 8px 0px 2px; }
.tapahtuma-viikko h4 { font-family: 'Source Sans Pro'; font-style: normal; font-weight: 600; margin: 8px 0px; line-height: 26px; }
ul.sub-list { margin-bottom: 8px !important; }
.tapahtuma-viikko ul > li > ul { margin-bottom: 8px; }
ul.sub-list li { padding: 2px 2px 2px 20px; border-bottom: none; }
.tapahtuma-viikko ul > li > ul > li { padding: 2px 2px 2px 20px; border-bottom: none; }

ul.zebra-list { position: relative; margin: 0px; padding: 0px; list-style-type: none; border-top: 1px solid #aec6d1; }
ul.zebra-list li { padding: 3px 2px; border-bottom: 1px solid #aec6d1; }
ul.zebra-list li div { float: left; max-width: 120px; }
ul.zebra-list li p { margin: 0px 0px 0px 130px; }
ul.zebra-list li p + p { margin: 1em 0px 0px 130px; }
ul.zebra-list span { position: absolute; left: 130px; }

ul.zebra-list-even li:nth-child(even), ul.zebra-list-odd li:nth-child(odd) { background-color: #d3ebf0; }
ul.zebra-list-narrow li div { max-width: 95px; }
ul.zebra-list-narrow li p { margin-left: 105px; }
ul.zebra-list ul li { border-bottom: none; }

ul.nosto li strong:first-of-type { margin-right: 4px; }


/* ---- Events page ---- */

.tapahtuma { overflow: hidden; padding: 8px 2px; border-top: 1px solid #e3e3e3; }
.tapahtuma > .aika { float: left; width: 130px; max-width: 130px; margin-right: 20px; }
.tapahtuma > .aika strong { display: block; color: #3b393b; font-size: 1.063em; }
.tapahtuma > .aika span   { display: block; color: #3b393b; }
.tapahtuma > .info { clear: none; overflow: hidden; }
.tapahtuma > .info h3 { margin: 0px; }
.tapahtuma > .info p { margin-top: 0px; }
.tapahtuma > .info p + p { margin-top: 14px; }

.tapahtuma > .section { overflow: hidden; padding: 8px 2px; border-top: none; }
.tapahtuma > .section > .aika { float: left; width: 130px; max-width: 130px; margin-right: 20px; }
.tapahtuma > .section > .aika strong { display: block; color: #3b393b; font-size: 1.063em; }
.tapahtuma > .section > .aika span   { display: block; color: #3b393b; }
.tapahtuma > .section > .info { clear: none; overflow: hidden; }
.tapahtuma > .section > .info h3 { margin: 0px; }
.tapahtuma > .section > .info p { margin-top: 0px; }
.tapahtuma > .section > .info p + p { margin-top: 14px; }

h2.bar + .tapahtuma { border-top: none; }

.tapahtuma-nosto { overflow: hidden; 
                    padding: 8px 15px; margin-bottom: 3px; 
                    border-radius: 15px; 
                    border-bottom: 1px solid #d6d6d6; 
                    filter: drop-shadow(1px, 1px, 2px, rgb(24, 53, 54, 1));
                }
.tapahtuma-nosto > .kuva { float: left; width: 120px; max-width: 120px; margin: 4px 15px 4px 0px; }
.tapahtuma-nosto > .kuva img { width: 120px; }
.tapahtuma-nosto > .aika strong { color: #3b393b; margin-right: 8px; }
.tapahtuma-nosto > .aika span   { display: inline; color: #3b393b; font-size: 0.92em; white-space: nowrap; }
.tapahtuma-nosto > .info { clear: none; overflow: hidden; line-height: 1.2; margin-bottom: 4px; }
.tapahtuma-nosto > .info h3 { margin: 0px; }
.tapahtuma-nosto > .info p { margin-top: 0px; }
.tapahtuma-nosto > .info p + p { margin-top: 14px; }
.tapahtuma-nosto:nth-of-type(odd) { background-color: #effcfc; }
.tapahtuma-nosto:nth-of-type(even) { background-color: #e1f1f7; }


.taptesti { position: relative; overflow: hidden; }
.taptesti > p { margin-left: 120px; margin-bottom: 0px; line-height: 1.5;}
.taptesti > p:first-of-type { margin-left: 0px; font-weight: bold; }
.taptesti > p:first-of-type span { position: absolute; top: 0; left: 120px; }


.lahjavinkki { margin: 20px 0px 10px 0px; padding: 4px; background-color: #eaf3f5; }
.lahjavinkki img { float: left; margin: 10px 10px 4px 0px; width: 110px; }
.lahjavinkki h3 { margin-bottom: 8px; }
.lahjavinkki p { line-height: 1.3em; }


/* ---- Yritykset ---- */

.yritys { padding: 8px 2px; border-top: 1px solid #e3e3e3; }
.yritys > h3 { margin: 0px 0px 4px 0px; }
.yritys > p + p { margin: 16px 0px 2px 0px; }
.yritys > p.yhteys { margin: 4px 0px 4px 30px; position: relative; }
.yritys > p.yhteys span { position: absolute; left: -30px; font-family: "FontAwesome"; font-style: normal; color: #9e9e9e; }
.yritys > img.ylogo { float: right; margin: 6px 0px 10px 10px; }

h2.bar + .yritys { border-top: none; }


/* ---- Yhdistykset ---- */

.yhdistys { padding: 8px 2px; border-top: 1px solid #e3e3e3; }
.yhdistys > h3 { margin: 0px 0px 4px 0px; }
.yhdistys > p + p { margin: 16px 0px 2px 0px; }
.yhdistys > p.yhteys { margin: 4px 0px 4px 30px; position: relative; }
.yhdistys > p.yhteys span { position: absolute; left: -30px; font-family: "FontAwesome"; font-style: normal; color: #9e9e9e; }

.yhdistykset > div:first-of-type { border-top: none; }

.sivukartta h3 { margin-bottom:  8px; margin-top: 32px; }

h2.icon { margin: 2em 0px 1rem 1em; position: relative; }
h2.icon span { position: absolute; left: -30px; font-family: "FontAwesome"; font-style: normal; color: #9e9e9e; }

.icon-home::before { content: "\f015"; }
.icon-camera-retro::before { content: "\f083"; }
.icon-camera::before { content: "\f030"; }
.icon-phone::before { content: "\f095"; }
.icon-email::before { content: "\f0e0"; }
.icon-email::before { content: "\f003"; }
.icon-location::before { content: "\f041"; }
.icon-compass::before { content: "\f14e"; }
.icon-mobile::before { content: "\f10b"; }
.icon-web::before { content: "\f0ac"; }

.icon-sfb::before { content: "\f230"; }
.icon-stw::before { content: "\f099"; }

.y-left { float:left; clear: left; width: 45%; }
.y-right { float: right; width: 45%; }

.v-cols { display: table; width: 100%; }
.v-col { display: table-cell; padding: 10px 0px; }
.v-cols img { margin: 0px; max-width: 100%;}


/* Float clearing */
.cf::after, .main-container::after, #content::after, .group::after { clear: both; content: ' '; display: table; }

.cf:nth-of-type(2) {border-top: 1px solid rgba(41, 136, 202, 0.5);}

form { margin-top: 20px; }
fieldset { border: 1px solid #e3e3e3; margin-bottom: 18px; padding: 10px 12px; max-width: 550px; }
fieldset textarea { height: 150px; }
fieldset label { display: block; }
fieldset p { display: inline-block; }
fieldset input, fieldset select, fieldset textarea, fieldset p { width: 100%; max-width: 300px; margin: 0 0 8px 10px; }
fieldset input.error, fieldset textarea.error { border: 3px solid #e998a5; background-color: #eed9d5; border-radius: 4px; }
fieldset label.error { display: block; margin: -4px 0 10px 10px; color: #a90c1f; font-size: 14px; }
fieldset div.f-left { display: block; float: left; clear: both; width: 28%; }
fieldset div.f-right { display: block; float: right; width: 71%; }
fieldset img.trigger { margin-left: 10px; }
fieldset input[name="laheta"],
fieldset input[name="tyhjenna"] { width: 100%; max-width: 300px; border-radius: 5px; border: none; }
fieldset input[name="tyhjenna"] { padding: 6px 25px; background-color: #dadada; font-size: 14px; }
fieldset input[name="laheta"] { padding: 10px 25px; background-color: #599c6d; color: #fff; text-shadow: 1px 1px 1px #636363; }
fieldset input[name="laheta"]:hover{ background-color: #63AD7A; }
fieldset input[name="tyhjenna"]:hover{ background-color: #e6e6e6; }
fieldset input[name="laheta"]:active, fieldset input[name="tyhjenna"]:active { transform: translateY(2px); }


/* # # # Additions # # # */
p.news-feed { margin-left: unset !important; }
/* # # # # # # # # # # # */


/* Font Awesome */
.fa {
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ========================================================================== */

@media only screen and (max-width: 1024px) {
    #page-container { width: 100%; max-width: 1024px; box-shadow: none; }
}
@media only screen and (max-width: 970px) {
    .main-container { min-height: 320px; padding-top: 0; }
    #content { display: block; width: 100%; padding: 40px; max-width: 970px; }
    #menu-toggle { display: block; position: relative; padding: 0 20px 0 34px; border: none; outline: 0; color: #fff; text-transform: uppercase; text-align: left; letter-spacing: 1px; font-weight: bold; line-height: 34px; overflow: hidden; margin-left: 18px; background: url(../img/menu-icon.png) no-repeat center left; }
    .menu-toggle { background-color: #1ea5ff; }
    .sidebar-container { width: 100%; display: block; padding: 0px;}
    #sidebar { width: 100%; margin-left: 0; border: none; border-bottom: 4px solid #a43741; }
    ul.sidenav { width: 100%; margin: 20px 0; display: none; }
    ul.sidenav li a { width: 100%; }
    .nostot > div, .nostot > div:nth-child(3n+1) { width: 48%; float: left; margin: 0px 0px 20px 4%; border: 1px solid #d9d9d9; background-color: #f5f5ea; }
    .nostot > div:nth-child(2n+1) { margin-left: 0px; }
    .nostot > div.tmp-hide { display: block; }
}
@media only screen and (max-width: 740px) {
    .article-wide { float: none; display: block; width: 100%; max-width: 740px; }
    .aside-narrow { float: none; display: block; padding-left: 0px; }
    fieldset div.f-left { float: none; clear: both; width: 100%; }
    fieldset div.f-right { float: none; width: 100%; margin-left: 0; }
    fieldset input, fieldset select, fieldset textarea, fieldset p { margin: 0 0 8px 0;}
    fieldset label.error { margin: -4px 0 10px 0; }
}
@media only screen and (max-width: 680px) {
    #content { max-width: 680px; padding: 30px 14px; }
    .col-half-left, .col-half-right, .col-1, .col-2, .article, .aside { float: none; display: block; width: 100%; max-width: 680px; }
    .aside, .aside-narrow { padding-left: 0px; }
    header { height: 60px; background: none; background-color: #1ea5ff; }
    #logo { height: 60px; width: 100%; padding: 14px 0px 0px 0px; text-align: center; }
    #logo a { font-size: 36px; margin-left: 0px; }
    .superkuvat { display: none; }
    .v-cols, .v-col { display: block; width: 100%; }
    .v-col { margin-bottom: 0px; }
    .v-col img { max-width: 100%; }
}
@media only screen and (max-width: 480px) {
    body { background: none; }
    #content { width: 100%; max-width: 480px; padding: 30px 10px; }
    .tapahtuma { border-top: none; }
    .tapahtuma > .aika { float: none; display: block; width: 100%; max-width: 480px; margin-bottom: 10px; padding: 2px; background-color: #eeece3; }
    .tapahtuma > .aika strong { display: inline; font-size: 1.063em; padding: 0px 4px; }
    .tapahtuma > .aika span   { display: inline; }
    .col-3 { float: none; display: block; width: 100%; max-width: 480px; }
}
@media only screen and (max-width: 420px) {
    .nostot > div, .nostot > div:nth-child(3n+1), .nostot > div:nth-child(2n+1) { float: none; width: 100%; margin: 0 0 20px 0; }
    a.button { width: 100%; }
    .tapahtuma-viikko li { padding: 4px 2px 4px 110px; border-bottom: 1px solid #e3e3e3; }
    .y-left, .y-right { float: none; width: 100%; max-width: 420px; }
    .y-left { margin-bottom: 0px;}
}
@media print {
    @page { size: A4 portrait; margin: 2cm; }
    html, body { height: 297mm; width: 210mm; }
    * { position:static !important; }
    body { margin: 0px; color: #333; background-color: #fff; font-family: Arial, Geneva, sans-serif; font-size: 11pt; line-height: 13pt; }
    #sidebar { display: none !important;}
    #page-container { width: 100%; border-left: none; border-right: none; box-shadow: none; }
    .main-container { width: 100%; padding-top: 10px; }
    #content { width: 100%; float: none; padding: 0px 20px 10px; }
    header { width: 100%; height: 50pt; border-top: none; page-break-after: avoid; }
    #logo a { font-size: 34px; }
    #footer { width: 100%; border-top: 1pt solid #000; margin-top: 10pt; padding-top: 1pt;}
    #footer p { font-size: 10pt; margin-top: 6pt; line-height: 10pt;}
    .nostot > div p { font-size: 10pt; }
    /* h1, h2 { page-break-after: avoid; } */
    h1 { page-break-before: avoid; page-break-after: auto ;}
    p { orphans: 3; widows: 3; }
    ul { page-break-inside: auto; }
    ul.tiny-dot li::before { content: ""; }
    ul.tiny-dot li { list-style: disc outside none; }
    .noprint, .no-print { display: none !important; }
    .footer-linkit { display: none !important; }
    .infobox { text-align: center; background-color: #fff; border: 1px solid #333; border-radius: 5px; padding: 6px 16px; }
    /* Yritysluettelo */
    .yritys > p.yhteys { margin-left: 0px; }
    .yritys > p.yhteys span { display: none !important; }
    h2.bar { border-bottom: 1pt solid #000; margin-left: 0px; padding-left: 0px; }
    h2.bar a { display: none; }
    /* Sarakkeet */
    .article, .aside { width: 100%; float: none; }
    .aside { padding-left: 0px; page-break-before: always; }
    /* Avoid page-breaks */
    figure { page-break-before: avoid; page-break-after: auto;  }
    a:link, a:visited { color: #333; text-decoration: underline; }
    a[href^="http:"], a[href^="https:"] { color: #333; background: none; margin-right: 0px; padding-right: 0px; }
    a[href^="http://www.vaskivesi.fi"] { background-image: none; padding-right: 0; margin-right: 0; }
}