@font-face {
    font-family: "Open Sans Condensed";
    src: url("fonts/OpenSans-CondBold.ttf");
}

@font-face {
    font-family: "Trebuchet MS";
    src: url("fonts/trebuc.ttf");
    src: local("☺"),
}

body {
    /*
	background-color : #A11B20;
	*/
	margin : 0;
    padding : 0;
    font-family: "Trebuchet MS", sans-serif;
    background-color : #2F353C;
}

b {
    color : #2a515d;
}

a {
    color : #A11B20;
    text-decoration : none;
}
a:visited {
    color : #A11B20;
    text-decoration : none;
}
a:active {
    color : #A11B20;
    text-decoration : none;
}

a:link {
    color : #A11B20;
    text-decoration : none;
}

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

img {
    border : 0;
    margin : 0;
}

.keskipalikka {
    margin : 0;
    padding : 40px 0 40px 0;
    background-color : #839CA9;
    width : 100%;
}

.sisalto {
	width : 850px;
	margin : 0 auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.sinipalikka1 {

    margin : 0 0 0 0;
    background-color : white;
    padding-top : 15px;
    width : 850px;
    text-align : left;
    color : black;
    font-size : 16px;
}

.sinipalikka2 {

	margin : 0 0 0 0;
    background-color : white;
    padding-top : 5px;
    padding-bottom : 15px;
	width : 850px;
	text-align : left;
	color : black;
	font-size : 16px;
}

.palikka {
    background-color : #e0e6e9;
    padding-top : 25px;
    padding-bottom : 20px;
	width : 850px;
	text-align : center;
}

.teksti {
    padding-left : 25px;
    padding-right : 20px;
}

.header_palikka {
    margin : 0;
    padding : 20px 0 20px 0;
    width : 100%;
    background-color : white;
}

.header {
    margin-left: auto;
    margin-right: auto;
    width : 850px;
}

.header_kuva:hover {
    cursor : pointer;
}


.footer {
    margin-top : 0;
    margin-bottom : 0;
    margin-left: auto;
    margin-right: auto;
    padding : 20px 0 20px 0;
    color : white;
    width : 100%;
    bottom: 0;
    overflow:hidden;
    font-size : 15px;
    white-space: nowrap;
    text-align : center;
}

.footer_link {
    text-decoration : none;
    color : white;
}

.footer_link:visited {
    text-decoration : none;
    color : white;
}

.footer_link:active {
    text-decoration : none;
    color : white;
}

.footer_link:link {
    text-decoration : none;
    color : white;
}

.footer_link:hover {
    text-decoration : underline;
    color : white;
    cursor : pointer;
}



.otsikko1 {
    font-family : 'Open Sans Condensed', sans-serif;
    margin-top : 15px;
    margin-bottom : 30px;
    color : black;
    text-align : center;
    font-size : 35px;
    padding-left : 25px;
    padding-right : 15px;
    line-height : 125%;
}

.otsikko2 {
    font-family : 'Open Sans Condensed', sans-serif;
    color : #2a515d;
    text-align : left;
    padding-left : 25px;
    padding-right : 15px;
    margin-bottom : -5px;
    font-size : 22px;
}

.iso_nappi {
	background-color : #A11B20;
	margin : 15px 0 15px 0;
	color : white;
	font-size : 18px;
	padding : 18px;
	border : none;
    overflow: visible;
}

.iso_nappi:hover {
    background-color : #8b171c;
    cursor : pointer;
}

.pieni_nappi {
    background-color : #A11B20;
    color : white;
    font-size : 17px;
    font-weight : bold;
    padding : 12px 18px 12px 18px;
    border : none;
}

.pieni_nappi:hover {
    background-color : #8b171c;
    cursor : pointer;
}

hr {
    height : 2px;
    background-color : black;
    border : none;
    margin-left : 70px;
    margin-right : 70px;
    margin-top : 10px;
    margin-bottom : 10px;
}

.tausta_label {
    float : left;
    width : 150px;
    padding-left : 25px;
}

.text{
    background-color : white;
    border-color : black;
    border-style : solid;
    border-width : 1px;
    margin-left : 50px;
    width : 250px;
    margin-bottom : 5px;
    padding-left : 3px;
}

.text_muu{
    background-color : white;
    border-color : black;
    border-style : solid;
    border-width : 1px;
    margin-left : 20px;
    width : 250px;
    margin-bottom : 5px;
    padding-left : 3px;
    display : none;
}

.clear {
    clear : both;
}

/*radio */

body:not(#foo) input[type='checkbox'] {
    opacity: 0;
}

body:not(#foo) input[type='radio'] {
    opacity: 0;
}

/* set default styles for the checkboxes and radio buttons */
body:not(#foo) .radiobtn {
    width: 20px;
    height: 17px;
    display: inline-block;
    margin: 0 3px 0 0;
    cursor: pointer;
    position: relative;
}

label span.radiobtn {
    background: url(images/radio6a.png) 0px 0px;
    padding-top : 4px;
    vertical-align : middle;
}

.label_radio:hover {
    text-decoration : underline;
    cursor : pointer;
}

input[type='radio']:checked + label span.radiobtn {
     background: url(images/radio6a.png) 0px -22px;
    padding-top : 4px;
    vertical-align : middle;
 }

input[type='radio']:not(:focus):hover + label span.radiobtn {
    background: url(images/radio6b.png) 0px -22px;
    padding-top : 4px;
    vertical-align : middle;
}

.radiopalikka {
    float : left;
    margin-bottom : 8px;
    margin-left : 2px;
}

/*checkbox */

body:not(#foo) .checkbox {
    width: 18px;
    height: 17px;
    display: inline-block;
    margin: 0 3px 0 0;
    cursor: pointer;
    position: relative;
}

label span.checkbox {
    background: url(images/check_a.png) 0px 0px;
    padding-top : 4px;
    vertical-align : middle;
}

input[type='checkbox']:checked + label span.checkbox {
    background: url(images/check_a.png) 0px -22px;
}

input[type='checkbox']:not(:focus):hover + label span.checkbox {
    background: url(images/check_b.png) 0px -22px;
    padding-top : 4px;
    vertical-align : middle;
}

.checkpalikka {
    margin-left : -20px;
}