* {margin: 0; padding: 0}

img {border: 0;}

body {
  width: 1036px;
  margin-left: auto;
  margin-right: auto;
  background-image: url(../images/body.png);
  background-repeat: repeat-x;
  background-color: #3475ad;
  font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
  font-size: 13px;
}

/* YLEISET TYYLIT */

h1 {
    font-weight: normal;
    color:#214d72;
    font-size: 22px;
    margin-bottom: 15px;
    border-bottom: 1px solid #DBDBDB;
    padding-bottom: 7px;
    margin-top: 12px;
}

h2 {
    font-weight: normal;
    color:#214d72;
    font-size: 16px;
    margin-top: 10px;
    margin-bottom: 10px;
}

h3 {
    font-weight: normal;
    color:#214d72;
    font-size: 15px;
    margin-bottom: 10px;
}

p {
  margin-bottom: 10px;
}

a {
  color: #214d72;
  text-decoration: none;
}

a:hover {
  color: #17abdb;
}

hr {
    border: 0;    
    border-top: 1px solid #DBDBDB;    
    margin: 5px 0px 5px 0px;    
    }

table td{
    vertical-align: top;
    }    

table .palvelut {
  font-size: 10px;
  border: 1px solid #efefef;
}

table tr .otsikko {
  color:#214d72;
}

#content-right ul{
    margin-left: 25px;
    line-height: 1.6em;
    margin-bottom: 10px;
}
 

#content-right ol{
    margin-left: 25px;
    line-height: 1.6em;  
        margin-bottom: 10px;  
}   

#content-right h2, #content-right h3{
    margin-top: 20px;
}
        
#container {
    padding-left:70px;
    padding-right:70px;
    padding-top:10px;
    background-image:url(../images/content-bg.png);
    background-repeat:repeat-y;
}

#container_404 {
    padding-left:70px;
    padding-right:70px;
    padding-top:10px;
    background-color: #fff;
}

/* HEADER OSA JA SIVUSTON NAVIGAATIO */

#header-container {
    height: 84px;
    background-image:url(../images/header-bg.png);
    background-repeat:no-repeat;
    position:relative;
}

#logo {
  padding: 10px;
}

#logo p {
  margin-top: 4px;
  color: #a6a6a6;
  font-size:14px;
}

#wave {
    position:absolute;
    right:-130px;
    top:-10px;
    z-index:9999;
}

#navigation {
    height:30px;
    background-image:url(../images/nav-bg.png);
    background-repeat:repeat-x;
    position:relative;
}

#top_menu {
    float:left;
}

#top_menu ul {
    list-style-type:none;
    margin-top:4px;
}

#top_menu ul li {
    display:inline;
    padding-right:15px;
    padding-left:15px;
    background-image:url(../images/div.png);
    background-repeat:no-repeat;
    background-position:right top;
}

#top_menu ul li:last-child
{
    display:inline;
    background-image:none;
    padding-right:15px;
    padding-left:15px;
}

#top_menu ul li a {
    color:#fff;
    text-decoration:none;
}

#top_menu ul li a:hover {
    color: #17abdb;
    text-decoration:none;
}

#facebook {
    position:absolute;
    right:10px;
    top:-10px;
    z-index:10;
}

#image-container {
    height:228px;
}

#header-image {
    float:left;
    width:659px;
}

#header-image img {
    height:228px;
    width:659px;
}

#case-info {
    float:right; 
    width:237px;
    height:218px;
    background-image:url(../images/case-info-bg.png);
    background-repeat:no-repeat;
    padding-top:10px;
    position:relative;
}

#end-header {
    background-color:#3475ad;
    width:100%;
    height:5px;
}

/* CONTENT SISÄLTÖ ALUE */

#content-container {
    padding-top:20px;
}

/* VASEN */

#content-left {
    float: left;
    width: 200px;   
}

#content-left h2 {
  font-weight: normal;
    color: #214d72;
    font-size: 16px;
}

#content-left .divider {
    height:5px;
    background-image:url(../images/hr.png);
    background-repeat:no-repeat;
    margin-top: 5px;
    margin-bottom: 5px;
    width: 200px;
}

#ladders {
  margin-top: 0px;
}

#ladders ul {
  list-style-type:none;
}

#ladders li {
    line-height: 19px;
    padding: 3px 0px;
}

#ladders li a {
    text-decoration: none;
    color: #214d72;
    font-size: 14px;
    padding-top: 10px;
}

#ladders li a.active {
    color: #214D72;
    font-weight: bold;
}

#ladders li a:hover {
    text-decoration: none;
    color: #17abdb;
}

#ladders ul ul{
  margin-left: 20px;
}

#ladders ul ul li a{
    color: #535353;
    font-size: 12px;
}

/* OIKEA */

#content-right {
    float: right;
    text-align: left;
    width: 650px;
    color: #535353;
    line-height: 16px;
}

#content-right ul {
    margin-left:20px;
}

#content-right p {
    line-height: 170%;
}


#content-right .divider {
    height:5px;
    background-image:url(../images/hr.png);
    background-repeat:no-repeat;
    margin-top: 5px;
    margin-bottom: 5px;
}

#content-top-links {
    list-style-type:none;
    padding:5px;
    width: 100%;
    text-align: right;
}

#content-top-links li {
    display:inline;
    padding:5px;
}

#content-top-links li a {
    text-decoration:none;
    color:#214d72;
    font-size:12px;
    padding-left:30px;
    padding-top:15px;
}

#content-top-links li a:hover {
    text-decoration:none;
    color: #17abdb;
}

/* FOOTER */

#footer-container {
    margin-top:-10px;
    min-height: 125px;
}

#footer-left {
    float:left;
    width:400px;
    color:#838383;
    font-size:11px;
}

#footer-middle {
    float:left;
    width:260px;
    color:#838383;
    font-size:11px;
}

#footer-right {
    float:left;
    width:220px;
    color:#838383;
    font-size:11px;
}

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

/* STYLES */

.divider {
    height:20px;
    background-image:url(../images/hr.png);
    background-repeat:no-repeat;
    margin-top:20px;
    margin-bottom:20px;
}

#vert-divider {
    background-image:url(../images/vdiv.png);
    background-repeat:no-repeat;
    background-position:center;
    padding-left:15px;
    padding-right:15px;
    float:left;
    min-height:146px;
}

.page-title {
    font-size:14px;
    color:#214d72;
}

.footer-title {
    font-size:14px;
}

.bluelink {
    color:#214d72;
    text-decoration:none;
}


/* SIVUSTON CASE ESITTELYT */

#case-holder {
    width: 200px;
}


.case {
    margin-top: 5px;
    float:right;
    padding-left:60px;
    padding-bottom:10px;
    line-height:14px;
    margin-right: 5px;
}

.case img {
    width:40px;
    height:34px;
    position:absolute;
    left:10px;
}

.casetitle {
    font-size: 13px;
    color: #214d72;
}

/*.casetext {
    font-size: 10px;
    color: #848484;
}*/

.case-1-pic {
    width: 200px;
    float: left;
    margin-bottom: 5px;
    margin-top: 5px;
}

.case-1-text {
    width: 200px;
    font-size: 11px;
    color: #535353;
    line-height: 16px;
    float: left;
}

.casetext {
    font-size: 11px;
    line-height: 1.1em;
    color: #848484;
}

.casetext-big {
    font-size: 11px;
    color: #848484;
    line-height: 16px;
}

.casetitle-big {
    font-size:14px;
    color:#3a89cc;
    line-height:16px;
}

.caselink {
    font-size:11px;
    color:#214d72;
    text-decoration:none;
    margin-bottom: 10px;
}


/*

    GalleryView Stylesheet
    
    Use the CSS rules below to modify the look of your gallery.
     
    To create additional rules, use the markup below as a guide to GalleryView's architecture.
    NOTE - The markup below represents the DOM generated by the GalleryView plugin, NOT the markup you would include in your HTML file.
           Refer to README.txt to review markup requirements.
    
    <div class="gallery">
        <div class="panel">
            <img src="path/to/image.jpg" />
            <div class="panel-overlay">
                ...overlay content...
            </div>
            <div class="overlay-background"></div>
        </div>
        <ul class="filmstrip">
            <li class="frame current">
                <img src="path/to/thumbnail.jpg" />
                <div class="caption">caption text</div>
            </li>
            <li class="frame">
                <img src="path/to/thumbnail.jpg" />
                <div class="caption">caption text</div>
            </li>
        </ul>
    </div>
        

*/

/* GALLERY LIST */
/* IMPORTANT - Change '#photos' to the ID of your gallery list to prevent a flash of unstyled content */
#photos { visibility: hidden; }

/* GALLERY CONTAINER */
.gallery {padding: 5px;}

/* LOADING BOX */
.loader { background: url("images/galleryview/loader.gif") center center no-repeat #ddd; }

/* GALLERY PANELS */
.panel {width:650px;}
.panel img {border: 1px #ddd solid; padding:20px;overflow:visible;}

/* DEFINE HEIGHT OF PANEL OVERLAY */
/* NOTE - It is best to define padding here as well so overlay and background retain identical dimensions */
.panel .panel-overlay,
.panel .overlay-background { height: 60px; padding: 0 1em; }

/* PANEL OVERLAY BACKGROUND */
.panel .overlay-background { background: #222; }

/* PANEL OVERLAY CONTENT */
.panel .panel-overlay { color: white; font-size: 0.7em; }
.panel .panel-overlay a { color: white; text-decoration: underline; font-weight: bold; }

/* FILMSTRIP */
/* 'margin' will define top/bottom margin in completed gallery */
.filmstrip { margin: 5px;margin-top:90px; }

/* FILMSTRIP FRAMES (contains both images and captions) */
.frame {}

/* WRAPPER FOR FILMSTRIP IMAGES */
.frame .img_wrap {}
.filmstrip li {padding-right:5px;}
.filmstrip {}

/* WRAPPER FOR CURRENT FILMSTRIP IMAGE */
.frame.current .img_wrap { }

/* FRAME IMAGES */
.frame img { border: none; }

/* FRAME CAPTION */
.frame .caption { font-size: 11px; text-align: center; color: #888; }

/* CURRENT FRAME CAPTION */
.frame.current .caption { color: #000; }

/* POINTER FOR CURRENT FRAME */
.pointer {
    border-color: #000;
}

/* TRANSPARENT BORDER FIX FOR IE6 */
/* NOTE - DO NOT CHANGE THIS RULE */
*html .pointer {
    filter: chroma(color=pink);
}