@import url(https://fonts.googleapis.com/css?family=Khand);

/* Templaten rakenne */
html, body {height: 100%;}
body {background-color:#a2a2a2; text-align: center; height: 100%; margin: 0; padding: 0;}
#pagewrap {width: 1100px; margin: 0 auto; background-color: #f1f1f1;}
#header {width: 98%; margin: 0 auto; padding: 0; text-align: center; background-color: #cd1b16; overflow: hidden;}
#menu {width:98%; margin-left: auto; margin-right: auto; margin-top: 10px; position: relative; height: auto; z-index: 10;}
#contact {width:98%; margin: 0 auto; padding: 0; text-align: right; overflow:hidden;}
#banner {width: 98%; margin: 0 auto; padding: 0; text-align: center; overflow: hidden; position: relative;}
#info {width: 98%; margin: 0 auto; padding: 0; text-align: center; overflow: hidden; position: relative;}
#contentwrap {width: 100%; margin: 0 auto; padding: 0; text-align: center; overflow: hidden; position: relative;}
#maincontent {width: 100%; margin-left: auto; margin-right: auto; margin-top: 10px; position: relative; text-align: left; overflow: hidden;}
#left {width:33.3%; float: left; position: relative;}
* html #left {height: 100%;}
#leftcontent {width:94%; margin: 0 auto; position: relative; background-color: #ffffff;overflow: hidden;}
#center {width:33.4%; float: left; position: relative;}
* html #center {height: 100%;}
#centercontent {width:94%; margin: 0 auto; position: relative; background-color: #ffffff;overflow: hidden;}
#right {width:33.3%; float:right; position: relative;}
* html #right {height: 100%;}
#rightcontent {width:94%; margin: 0 auto; position: relative; background-color: #ffffff;overflow: hidden;}
#footer {width:98%; padding-top: 35px; padding-bottom: 35px; margin:0 auto; clear: both; text-align: center; background-color: #cd1b16;margin-top: 10px;}

/* Joomlan tekstisisällön tyylit */
p {font-family: Khand,Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 15pt; line-height: 20pt; font-weight: normal; padding-left: 25px; padding-right: 25px; color:#000000;text-align: left;}
#contact p{text-align: right;}
#banner p {font-size: 0pt !important; line-height: 0pt !important; padding-left: 0px !important; padding-right: 0px !important;}
#footer p{font-family: Khand, Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 14pt; line-height:16pt; color:#ffffff; text-align: center; padding-left: 30px; padding-right: 30px; margin: 0;} 
#footer a{font-family: Khand, Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 14pt; line-height: 16pt; font-weight: bold; color:#ffffff; text-decoration: none;}
#footer a:hover{text-decoration: underline;}
h1 {font-family: Khand,Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 29pt; line-height: 31pt; font-weight: bold; padding-left: 25px; padding-right: 25px; color:#cd1b16; text-align: left;}
h2 {font-family: Khand,Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 21pt; line-height: 23pt; font-weight: bold; padding-left: 25px; padding-right: 25px; color:#cd1b16; text-align: left;}
h3 {font-family: Khand,Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 18pt; line-height: 20pt; font-weight: bold; padding-left: 25px; padding-right: 25px; color:#cd1b16; text-align: left;}
h4 {font-family: Khand,Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 16pt; line-height: 18pt; font-weight: bold; padding-left: 25px; padding-right: 25px; color:#cd1b16; text-align: left;}
a {font-family: Khand, Verdana,Trebuchet MS,Arial,Helvetica,sans-serif; font-size: 15pt; line-height: 20pt; font-weight: bold; Text-decoration: none; color:#000000;}
a:hover {text-decoration: underline;}

/* Kuvat skaalautumaan */
img {max-width: 100%; height: auto;}

.bfQuickMode .bfLabelLeft label {width: 45%; float: left; margin: 0px 10px 0px 25px; font-family: Khand, Verdana, Arial, Helvetica, Sans-Serif; font-size: 15pt;}
.bfQuickMode section input[type='text'], .bfQuickMode section textarea, .bfQuickMode section select {float: left; margin: 0px;margin-left: 25px;width: 45%;}
.bfQuickMode .bfLabelLeft input, .bfQuickMode .bfLabelLeft textarea, .bfQuickMode .bfLabelLeft select, .bfQuickMode .bfLabelLeft button { /*width: auto;*/ float: left; margin: 0px; margin-left: 25px;}
.bfQuickMode .bfNextButton, .bfQuickMode .bfSubmitButton, .bfQuickMode .bfCancelButton {float: left; margin-left: 25px;}
.bfQuickMode .bfCaptcha .ff_capimg {margin-bottom: 10px; margin-left: 25px;margin-top: 10px;}

/************************************************************************************
Mobiililaitteet pelittämään oikein
*************************************************************************************/
/* for 990px or less */
@media screen and (max-width: 990px) {

#pagewrap {width: 100%;}
#header {width: 98%;}
#menu {width: 98%;}
#contact {width: 98%;}
#banner{width: 98%;}
#contentwrap {width: 98%; margin: 0 auto;}  
#maincontent {width: 100%;}  
#left {width: 100%; padding-left: 0px; padding-right: 0px;}
#leftcontent {width: 100%;}
#center {width: 100%; padding-left: 0px; padding-right: 0px;}
#centercontent {width: 100%;}
#right {width:100%; padding-left: 0px; padding-right: 0px; clear: both; width: auto; float: none;}
#rightcontent {width: 100%;}
#footer{width: 100%;}
   
/* for 750px or less */
@media screen and (min-width: 320px) and (max-width: 750px) {

/* for 460px or less */
@media screen and (max-width: 480px) {
}

/* for 320px or less */
@media screen and (max-width: 320px) {
}