/* Start of CMSMS style sheet 'tyyli' */
body {
background: #000000;
margin: 20px auto 0 auto;
font-family: tahoma,arial,helvetica,sans-serif;
color: #fff;
font-size: 13px;
}

a {
color: gray;
}

a:hover {
color: #FAF196;
}

:focus {
outline-style:none;
}

.wrapper {
background: #000 url("uploads/happening_background.jpg");
margin: 0 auto;
width: 938px;
height: 746px;
}

.header {
width: 938px;
margin: 0;
padding: 0;
height: 235px;
}

.navi {
width: 260px;
float: left;
margin-left: 62px;
height: 408px;
margin-top: 15px;
}

.navi ul {
margin: 0;
padding: 0px 0 0 0px;
width: 260px;
height: 408px;
}

li.no1 {
width: 260px;
height: 15px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no1 a {
width: 260px;
height: 15px;
display: block;
}

li.no2 {
width: 260px;
height: 22px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no2 a {
width: 260px;
height: 22px;
display: block;
}

li.no3 {
width: 260px;
height: 15px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no3 a {
width: 260px;
height: 15px;
display: block;
}

li.no4 {
width: 260px;
height:17px;
overflow: hidden;
float: left;
padding-top: 5px;
padding-bottom: 5px;
display: block;
text-indent: -9999px;
}

li.no4 a {
width: 260px;
height: 17px;
display: block;
}

li.no5 {
width: 260px;
height: 17px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no5 a {
width: 260px;
height: 20px;
display: block;
}

li.no6 {
width: 260px;
height: 20px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no6 a {
width: 260px;
height: 20px;
display: block;
}

li.no7 {
width: 260px;
height: 20px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no7 a {
width: 260px;
height: 20px;
display: block;
}

li.no8 {
width: 260px;
height: 20px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no8 a {
width: 260px;
height: 20px;
display: block;
}
li.no9 {
width: 260px;
height: 20px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no9 a {
width: 260px;
height: 20px;
display: block;
}
li.no10 {
width: 260px;
height: 17px;
overflow: hidden;
float: left;
display: block;
text-indent: -9999px;
}

li.no10 a {
width: 260px;
height: 20px;
display: block;
}

.no1 a {
background-image: url(uploads/happening-etusivu.png);
}

.no1 a:hover {
background-image: url(uploads/happening-etusivu_h.png);
}

.no2 a {
background-image: url(uploads/happening-tapahtumat.png);
}

.no2 a:hover {
background-image: url(uploads/happening-tapahtumat_h.png);
}

.no3 a {
background-image: url(uploads/happening-palvelut.png);
}

.no3 a:hover {
background-image: url(uploads/happening-palvelut_h.png);
}

.no4 a {
background-image: url(uploads/happening-catering.png);
}

.no4 a:hover {
background-image: url(uploads/happening-catering_h.png);
}

.no5 a {
background-image: url(uploads/happening-varainhankinta.png);
}

.no5 a:hover {
background-image: url(uploads/happening-varainhankinta_h.png);
}

.no6 a {
background-image: url(uploads/happening-tapahtumapromootio.png);
}

.no6 a:hover {
background-image: url(uploads/happening-tapahtumapromootio_h.png);
}

.no7 a {
background-image: url(uploads/happening-viranomaispalvelut.png);
}

.no7 a:hover {
background-image: url(uploads/happening-viranomaispalvelut_h.png);
}

.no8 a {
background-image: url(uploads/happening-yhteistyokumppanit.png);
}

.no8 a:hover {
background-image: url(uploads/happening-yhteistyokumppanit_h.png);
}

.no9 a {
background-image: url(uploads/happening-atk-apua.png);
}

.no9 a:hover {
background-image: url(uploads/happening-atk-apua_h.png);
}

.no10 a {
background-image: url(uploads/happening-yhteys.png);
}

.no10 a:hover {
background-image: url(uploads/happening-yhteys_h.png);
}

.content {
width: 520px;
float: left;
height: 410px;
*height: 360px;
overflow: hidden;
padding: 0 50px 0 35px;
overflow:visible;
}

h1 {
color: #efe88f;
text-transform: uppercase;
font-size: 16px;
font-weight: lighter;
}

p {
color: #fff;
font-size: 13px;
}


.clear {
clear: both;
} 

.panic {
margin: 0 auto;
padding: 40px 0 0 0;
width: 220px;
height: 53px;
text-indent: -9999px;
}

.panic a {
display: block;
width: 195px;
height: 53px;
}

#mycustomscroll {
/* percentage width without the fix*/
width: 20%;
height: 380px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
background-color: transparent;
margin: 0.3em auto;
padding: 15px;
}

#mycustomscroll2 {
/*percantage width: make it 100% to match container*/
width: 100%;
height: 370px;
*height: 350px;
overflow: auto;
/* IE overflow fix, position must be relative or absolute*/
position: relative;
background-color: transparent;
margin: 0.3em auto 0.3em -20px;
/* negative left margin to compensate for the padding,
not related to fleXcroll, and may not be needed elsewhere */
padding: 20px;
}

/*
percentage width: the real percentage is done by the wrapper
this is to fix various IE6 bugs
*/
.percentagewrap {
	width: 80%;
	margin: 0 auto;
	padding: 10px;
}

#palvelut-menu {
text-align: left;
}

#palvelut-menu ul {
list-style-type: none;
text-align: left;
padding: 0px;
}

#palvelut-menu .currentpage {
color: #FAF196;
}

#palvelut-menu li {
float: left;
display: inline;
font-size: 12px;
padding-right: 5px;
}

#mycustomscroll2_hscrollerbase, #mycustomscroll2_scrollerjogbox, .hscrollerbar {
background-color: transparent;
}


.Yhteydenotto textarea {
width: 200px;
height: 60px;
}

.Yhteydenotto input[type="text"] {
width: 200px;
}

.Yhteydenotto  #fbrp__34 {
width: 100px;
}

.Yhteydenotto  .tapahtumista input {
position: relative;
float:left;
left: 150px;
margin-top:-55px;
position:relative;
width:60px;
}

.Yhteydenotto .muusta input {
position: relative;
float:left;
left:150px;
margin-top:-37px;
position:relative;
width:60px;
}
/* End of 'tyyli' */

