/*Yhteyden otto kenttä*/
form {
	text-align:center;
}
form.spostiS {
	font-size: 1.3em;
}
label {
	display:block;
	padding:40px 5px 5px 2px;
	font-size:1.1em;
	text-transform:uppercase;
	letter-spacing:1px;
	cursor:auto;
}
span label.ylaViiva {
        font-size: 1.4em;
        color: #fff;
} 
span label.ylaViiva#vasen:after {
        position: absolute;
        left: 6%;/*Sijoitettu vasemmalle*/
        width: 30%;
        height: 1px;
        background: rgb(255, 174, 0);
        content: '';
}
span label.ylaViiva#oikea:after {
        position: absolute;
        left: 44%;/*Sijoitettu oikealle (keskelle)*/
        width: 30%;
        height: 1px;
        background: rgb(255, 174, 0);
        content: '';
}
a#spLinkki {
        color: rgb(210, 210, 210);
}
input,textarea, {
	line-height:1.5;
	font-size:1.4em;
	padding:5px 10px;
	text-transform:none;
	color:#fff;
	display:block;
	width:100%;
	background:#2E2E2E;
}
input,textarea {
	background:#2E2E2E;
}
textarea {
	min-height:200px;
	min-width:350px;
	padding:15px 30px;
	width:auto;
	background:#2E2E2E;
	border:0px;
	border-radius:2px;
	font-size:1em;
}
input:focus,textarea:focus,label:active+input,label:active+textarea {
	outline:none;
	border:1px solid #ED9F26;
}
textarea,input p {
	color: #ECECEC;
        font-family: 'Lato', Calibri, Arial, sans-serif;
        font-weight: 300;
}
::-webkit-input-placeholder {
	color:#ECECEC;
	text-transform:normal;
	font-style:normal;
}
:-moz-placeholder {
	color:#ECECEC;
	text-transform:uppercase;
	font-style:oblique;
}
::-moz-placeholder {
	/* Firefox 19+*/
	color:#ECECEC;
	text-transform:uppercase;
	font-style:oblique;
}
:-ms-input-placeholder {
	/* IE 10+*/
	color:#ECECEC;
	text-transform:uppercase;
	font-style:oblique;
}
#submit {
	text-align:center;
	margin:2em;
	clear:both;
	background:#2E2E2E;
        font-family: 'Lato', Calibri, Arial, sans-serif;
        font-weight: 300;
}
input {
	border:none;
	color:#fff;
	width:auto;
	cursor:auto;
	text-transform:none;
	display:inline-block;
	padding:15px 30px;
	font-size:1.1em;
	border-radius:2px;
	letter-spacing:1px;
        font-family: 'Lato', Calibri, Arial, sans-serif;
        font-weight: 300;
}
input:hover {
	background: #4E4B4B;
}


/* MEDIA Q ~ 32em ja 20em (Erittäin pienet näytöt) */
/*Ei tarvetta 55 koska ei overflow ongelmaa kentissä (.ylaViiva ongelmaan yksi 55em mQ)*/

@media screen and (max-width: 55em) {/*Liikkuu nyt oLaatikkojen kanssa 55em--*/
        span label.ylaViiva#vasen:after {
                position: absolute;
                left: 35%;/*Keskitetty*/
                width: 30%;
                height: 1px;
                background: rgb(255, 174, 0);
                content: '';
        }
        span label.ylaViiva#oikea:after {
                position: absolute;
                left: 35%;/*Keskitetty*/
                width: 30%;
                height: 1px;
                background: rgb(255, 174, 0);
                content: '';
        }
}

@media screen and (max-width: 32em) {
        span label.ylaViiva#vasen:after {
                position: absolute;
                left: 35%;/*Keskitetty*/
                width: 30%;
                height: 1px;
                background: rgb(255, 174, 0);
                content: '';
        }
        span label.ylaViiva#oikea:after {
                position: absolute;
                left: 35%;/*Keskitetty*/
                width: 30%;
                height: 1px;
                background: rgb(255, 174, 0);
                content: '';
        }
        label {
                padding:40px 5px 5px 2px;
                padding:1.5em 0.5em 0.7em 0.2em;
                font-size:1.2em;
        }
        span label {
                font-size: 1.3em;
        } 
        input,textarea, {
                line-height:1.5;
                font-size:0.9em;
                padding:5px 10px;
                padding:0.5em 1em;
        }
        textarea {
                min-height:200px;
                min-width:210px; /*270px isommille?*/
                padding:0.9em 0.5em; /*20px 10px*/
        }
        input {
                padding: 0.9em 0.5em; /*20px 10px*/
        }
}

@media screen and (max-width: 20em) {
        label {
                padding:1.8em 0.3em 0.3em 0.1em; /*20px 5px 5px 2px?*/
                font-size:1.1em;
        }
        span label {
                font-size: 1.3em;
        } 
        span label:after {
                left: 35%;
                width: 30%;
        }
        input,textarea, {
                line-height:1.5;
                font-size:0.7em;
                padding:5px 10px;
        }
        textarea {
                min-height:200px;
                min-width:100px;
                padding:0.8em 0.8em; /*15px 15px*/
                font-size:0.7em;
        }
        input {
                padding:0.8em 0.8em; /*10px 10px?*/
                font-size:0.7em;
        }
}