﻿body
{
  background-color: #0064c3; /* fallback color if gradients are not supported */
}

body#signup, body#signup #header { background-color:White; height: auto; }

body#signup #header h1.logo {
	margin-left: 0px;
}
body#signup h1 
{
    font-weight:bold;
    font-size: 70px;
    color: #999;
    float: left;
    display: inline;
    clear: both;
    line-height:75px;
    text-align: center;
    margin: 0px 0px 10px 0px;
    padding: 10px 0px 10px 0px;
    width: 900px;
    text-transform: uppercase;
    text-shadow: -2px -2px 0px #555; /* CSS3 */
}
body#signup h1 span {
    background: url("../../Images/text-gradient.png") repeat-x;
    position: absolute;
    display: block;
    width: 900px;
    top: 20;
    height: 80px;
}

.signupFormHolder 
{
    display: inline; 
    float: left; 
    background: transparent url("../../Images/signup-form.jpg" ) no-repeat center top;
    width: 100%;
    min-height: 510px;
    padding: 30px 0 20px 0;
    width: 900px;
}

.signupFormBox
{
    display: inline; 
    float: left; 
    border: 1px solid #b0b0b0;
    background-color: #fbfbfb;
    background: -moz-linear-gradient(top, #fbfbfb, #f7f7f7);
    background: -webkit-gradient(linear, left top, left bottom, from(#fbfbfb), to(#f7f7f7));
    box-shadow: 4px 6px 15px #cecece; /* CSS3 */
    -moz-box-shadow: 4px 6px 15px #cecece; /* for Firefox */
    -webkit-box-shadow: 4px 6px 15px #cecece; /* for Safari */
    width: 404px;
    padding: 11px;
    margin: 60px 0px 20px 272px;
} 
.signupFormBoxInner
{
    display: inline; 
    float: left; 
    border: 1px solid #979797;
    background-color: White;
    width: 360px;
    padding: 25px 20px;
}


body#signup .signupFormBoxInner h2
{
    font-size: 26px;
    padding-bottom: 10px;
    width: 360px;
    text-align: center;
}
body#signup .signupFormBoxInner .basicFormBlock
{
    padding-left: 40px;
}
body#signup .signupFormBoxInner .basicFormBlock input[type="text"]
{
    padding: 6px 4px;
}
body#signup .signupFormBoxInner .basicFormBlock .signup-domain
{
    font-size: 14px;
}

body#signup .signupFormBoxInner .basicFormBlock .submitBtn2
{ 
    float: none;
    display:inline;
}

body#signup .signupWizard
{
    padding: 40px;
}
body#signup .signupWizard h1
{
    font-size: 30px;
    color: #0177cf;
    text-shadow: none; /* CSS3 */
    text-transform: none;
}
body#signup .signupWizard p
{
    text-align: center;
}

.created-for
{
    display: inline; 
    float: left; 
    padding: 10px 19px;
    width: 860px;
    border: 1px solid #e9e9e9;
    border-bottom: none;
    color: #222;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    -moz-border-radius-topleft: 12px;
    -moz-border-radius-topright: 12px;
    text-align: center;
    margin:auto;
}  

.created-for div
{
    width: 230px;  
    display: inline-block;  
    vertical-align: middle;  
    padding: 16px;
    margin: 0px 10px;
    vertical-align: top;
}

.created-for div h4
{
    font-weight:bold;
    font-size: 18px;
    color: #4d4d4d;
    text-transform: uppercase;
    display: inline;
    float: left;
}

.created-for div p
{
    font-weight:bold;
    font-size: 11px;
    color: #555555;    
    color: #656565;
    display: inline;
    float: left;
    clear: both;
    text-align: left;
}

/* ############### Container ############### */
#wrap { 
    /* overflow: hidden; FF fix */
    width: 970px;
    margin: 0 auto;
    text-align: left;
}
#container {
    float: left;
    display: block;
    display:inline;
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 0px 0px;
    width: 900px;
    /* overflow: hidden;
    background-color: transparent;
    background-color: #FFF;

    /* background: transparent url("../../App_Themes/Whirlpool/Images/bg_container.gif" ) no-repeat left bottom;     */
    /* background: #f9fbfe url("../../Images/bg_container.gif" ) no-repeat left bottom;  */
    /* background-color: #f9fbfe;*/
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    -moz-border-radius-bottomleft: 12px;
    -moz-border-radius-bottomright: 12px;

}

/* ############### Header ############### */
#header {
	/* position: relative; /* necessary for positioning .flags */
	width: 900px;
	float: left;
	display: block;
    display: inline;
	/* height: 100%;*/
    font-family: Trebuchet MS, helvetica, Arial, Sans-Serif;
    background-color: #f9fbfe;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    -moz-border-radius-bottomleft: 12px;
    -moz-border-radius-bottomright: 12px;
}

        #header h1.logo {
	        /* background: transparent url("../../Images/logo_gir.gif") no-repeat left top; 
            background-color: red; */
	        width: 330px;
	        /* height: 100%;*/
	        height: 30px;
	        border: none;
	        float: left;
	        display: inline;
	        margin: 30px 0px 16px 43px;
	        /* text-indent: -5000px; */
            padding:0;
            /* letter-spacing:-1px; */
        }

        #header ul.header_navigation {
            font-family: Verdana, Arial, Sans-Serif;
            float: right;
            /* background-color: red; */
	        margin: 26px 20px 0px 0px;
        }
                #header ul.header_navigation li, li#homeIcon {
                    background: transparent url( "../../Images/separator.gif" ) no-repeat left center;
                    color: #747576;
                    display: block;
                    float: left; /* display: inline; */
                    font-size: 10px;
                    list-style: none;
                    margin: 12px 0px 10px 12px;
                    padding: 0px 0px 0px 12px;
	                font-weight:bold;
	                font-size: 16px;
                }
                #header ul.header_navigation li.noSeparator {
                    background: none;
                    padding: 0px 2px 0px 0px;
                }
                #header ul.header_navigation li a, #header ul.header_navigation li a:visited {
                    color: #747576;
                    text-decoration: none;
                }
                #header ul.header_navigation li a:hover, #header ul.header_navigation li a.current {
                    color: #555;
                    text-decoration: underline;
                }

        #header .header_image {
            display: block;
            float: left;
            text-align: left;
            width: 900px;
            height: 290px;
            background: url("../../Images/header_image2.jpg" ) no-repeat left top;
            overflow: hidden;
        }
                .header_image h5 {
                    /* font-family: Myriad, Frutiger, Tahoma, Arial, Sans-Serif; */
	                font-weight:bold;
                    
                    font-family: Tahoma, Arial, helvetica, Sans-Serif;
                    margin: 65px 00px 25px 80px;
                    padding: 0px;
                    font-size: 27px;
                    line-height: 36px; 
                    letter-spacing: 1px;
                    color: #FFF;
	                font-weight: normal;
	                width: 320px;
                    /* background-color: red; */
                    display: block;
                    float: left;
                }
                        .header_image .button {
                            font-family: Tahoma, Arial, helvetica, Sans-Serif;
                            margin: 0px 0px 0px 80px;
                            background:  url("../../Images/header_button_r.gif" ) no-repeat right top;
                            padding: 0px 0px 0px 0px;
                            /* background-color: red; */
                            display: block;
                            float: left;
                            height: 39px;
                        }
                        .header_image .button a:link, .header_image .button a:visited, .header_image .button a:hover {
                            color: #FFF;
	                        font-weight:bold;
                            font-size: 14px; 
                            text-transform:uppercase;
                            text-decoration:none;
                            background:  url("../../Images/header_button_l.gif" ) no-repeat left top;
                            padding: 10px 25px 1px 25px;
                            margin: 0px;
        	                font-weight:bold;
                            display: block;
                            float: left; 
                            height: 39px;
                        }



/* ###############  S L I D E S  ############### */
#slides {
	/* position: relative; */
	display: block;
    display: inline;
    float: left;
    width: 900px;
	/* height: 100%;*/
    margin: 15px 0px 30px 0px;
    height: 140px; 
    font-family: Trebuchet MS, Arial;
}
        .slide, div.slideDisabled { 
            width: 225px; height: 140px; 
            margin: 0px 0px 15px 0px; padding: 0px;
            display: block; float: left; 
        }
                .slide a:link, .slide a:visited, .slideDisabled a:link, .slideDisabled a:visited { text-decoration: none; color: inherit; }
                .slide h1 {  margin-top: 22px; margin-left: 40px; color: #49b2ff; text-transform:uppercase; font-size: 30px; font-weight: bold; width: 150px; letter-spacing: 2px;  line-height: 30px; }
                .slide h1 a { color: #49b2ff; }
                .slide p {  margin-left: 40px; color: #01498c; text-transform:uppercase; font-size: 12px; font-weight: bold;  width: 160px; text-decoration: none; letter-spacing: 1px; line-height: 16px; }
                .slide p a { color: #01498c; }
                
                .slide1 {    background:  url("../../Images/slide_1_jaa.gif" ) no-repeat left top; }
                .slide2 {    background:  url("../../Images/slide_2_loyda.gif" ) no-repeat left top; }
                .slide3 {    background:  url("../../Images/slide_3_kuvita.gif" ) no-repeat left top; }
                .slide4 {    background:  url("../../Images/slide_4_saasta.gif" ) no-repeat left top; }
                
                .slide1:hover {    background:  url("../../Images/slide_1_jaaMVD.gif" ) no-repeat left top; cursor:pointer; cursor:hand; }
                .slide2:hover {    background:  url("../../Images/slide_2_loydaMVD.gif" ) no-repeat left top; cursor:pointer; cursor:hand; }
                .slide3:hover {    background:  url("../../Images/slide_3_kuvitaMVD.gif" ) no-repeat left top; cursor:pointer; cursor:hand; }
                .slide4:hover {    background:  url("../../Images/slide_4_saastaMVD.gif" ) no-repeat left top; cursor:pointer; cursor:hand; }
                                
                .slideDisabled .slide1 {    background:  url("../../Images/slide_1_jaaMV.gif" ) no-repeat left top; }
                .slideDisabled .slide2 {    background:  url("../../Images/slide_2_loydaMV.gif" ) no-repeat left top; }
                .slideDisabled .slide3 {    background:  url("../../Images/slide_3_kuvitaMV.gif" ) no-repeat left top; }
                .slideDisabled .slide4 {    background:  url("../../Images/slide_4_saastaMV.gif" ) no-repeat left top; }
                
                .slideDisabled:hover h1 a { color: #49b2ff; }
                .slideDisabled:hover p a  { color: #01498c; }
                
                .slideDisabled h1 { color: #c3ccd6; margin-top: 22px; margin-left: 40px; text-transform:uppercase; font-size: 30px; font-weight: bold; width: 150px; letter-spacing: 2px;  line-height: 30px; }
                .slideDisabled p { color: #c3ccd6; margin-left: 40px; text-transform:uppercase; font-size: 12px; font-weight: bold;  width: 160px; text-decoration: none; letter-spacing: 1px; line-height: 16px; }
                .slideDisabled h1 a, .slideDisabled p a { color: #c3ccd6; }
                .slideDisabled h1 a:hover { color: #49b2ff; }
                .slideDisabled p a:hover { color: #01498c; }
                /*
                .slideDisabled a:hover h1 { color: #49b2ff; margin-top: 25px; margin-left: 40px; text-transform:uppercase; font-size: 30px; font-weight: bold; width: 150px; letter-spacing: 2px;  line-height: 30px; }
                .slideDisabled a:hover p { color: #01498c; margin-left: 40px; text-transform:uppercase; font-size: 12px; font-weight: bold;  width: 160px; text-decoration: none; letter-spacing: 1px; line-height: 14px; }
                */
                

    .ingress 
    {
        float: left;
        display: block;
        width: 800px;
        padding: 20px 50px;
    }
    .ingress h1
    {
        font-style: italic;
        line-height: 36px;
        font-size: 26px;
        color: #878787;
        font-weight: bold;
        /*text-shadow: 1px 1px 0px #555; /* CSS3 */
    }
    
/* ###############  S T R I P E  ############### */
#stripe {
	/* position: relative; necessary for positioning .flags */
	width: 900px;
	float: left;
	display:block;
    display: inline;
	/* height: 101px; */
    margin: 0px 0px 15px 0px;
    background: #eee url("../../Images/bg_stripe.gif" ) repeat-x left top;
    border-bottom: 1px solid #AAA;
}
    /*
    #stripe img {
        margin: 7px 10px 0px 20px;
        border: solid 1px #eeeeee;
    } 
    */
    p.casecol1, p.casecol2
    {
        margin: 15px 0px;
        padding: 5px 20px 5px 10px;
        float: left; display: inline;
        width: 220px;
        background: transparent url("../../Images/quate_l.png" ) no-repeat top right;
        color: #5e5e5e;
        font-size: 14px;
        font-style:italic;
    }
    p.casecol1 
    {
        padding: 5px 0px 0px 50px;
        width: 190px;
    }
    p.casecol2
    {
        padding: 5px 30px 5px 20px;
        /* border-left: solid 1px #cecece; */
        background: transparent url("../../Images/quate_r.png" ) no-repeat right 48px;
        width: 580px;
        text-align: right;
    }
    p.casecol2 span 
    {
        display: block;
        padding-bottom:5px;
        text-align: left;
        font-size: 18px;
        line-height: 26px;
        font-style:italic;
}
    ul.caselist  
    {
        padding: 7px 10px 7px 20px; float: left; display: inline; list-style: none;
        width: 870px;
	    float: left;
	    display:block;
        display: inline;
        margin: 0px 0px 15px 0px;
        background:  url("../../Images/bg_stripe.gif" ) repeat-x left top;
        border-bottom: solid 1px #a5a5a5;
    }
    ul.caselist li { color: #464646; font-weight:bold; float: left; display: inline; list-style: none; /* border-left: solid 1px #bfbfbf*/;
                     font-size: 14px; padding: 2px 10px 0px 10px; margin:3px; }
    ul.caselist li.first { border-left: none; font-size: 30px; color: #bfbfbf; line-height: 40px; border-right: solid 1px #bfbfbf; }
    ul.caselist li a { color: #4988D6; font-weight:bold; text-decoration: none; }
    ul.caselist li a:hover { color: #4988D6; text-decoration: underline; }
    ul.caselist li a:visited { color: #4988D6; text-decoration: none; }
    
    ul.blog-list {  list-style-position: outside; margin: 0px 0px 0px 15px;  list-style-image: url("../../Images/dot2.gif"); }
    ul.blog-list li { color: #0080b6; margin: 6px 0px; }
    ul.blog-list li a { color: #0b56a9; text-decoration: none; }
    ul.blog-list li a:hover { text-decoration: underline; }
    
    h2.blog, h2.blog a, h2.blog a img.rss { padding: 0px; margin:0px; line-height: 24px; }
    h2.blog a img.rss { border: none; line-height: 14px; }
    .blog-rss { margin: 25px 0px 10px 0px; }
    .blog-rss img { float: left; display:block; width: 14px; height: 14px; padding:3px;  margin: 0px 3px 0px 10px; }
    .blog-rss a, .blog-rss a:visited { float: left;  display:block;  color: #0b56a9;  }
    .blog-rss a:hover { color: #0080b6; }
    
    h1.blog { margin: 0px 30px 0px 40px; border-bottom: 1px solid #cecece; }
    .contentBlog { width: 440px; margin: 20px 0px 20px 0px; padding: 0px 30px 0px 40px; float: left; display: block; border-right: 1px solid #cecece; }
    .contentBlogList { width: 308px; margin: 20px 0px 20px 0px; padding: 0px 30px 0px 40px; float: left; display: block; }
    
    ul.thumb {
	    float: left;
	    list-style: none;
	    margin: 0; padding: 7px; padding-left: 25px; margin-left: 31px;  padding: 0px;
	    /* width: 360px;*/
    }
        ul.thumb li {
	        margin: 7px; padding: 0px; 
	        float: left;
	        position: relative;  /* Set the absolute positioning base coordinate */
	        width: 113px;
	        height: 85px;
	        margin-left: 12px;
	        margin-right: 12px;
	        border: 1px solid #ddd;
        }
                ul.thumb li img {
	                width: 113px; height: 85px; /* Set the small thumbnail size */
	                -ms-interpolation-mode: bicubic; /* IE Fix for Bicubic Scaling */
	                /* border: 1px solid #ddd; */
	                /* padding: 1px; */
	                margin: 0px;
	                background: #f0f0f0;
	                background: #eee;
                    /* IE 8 */
                    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; 
                    /* IE5 - 7 */
                    filter: alpha(opacity=30); 
                    /* Everyone else */
                    opacity: .3; 
	                position: absolute;
	                left: 0; top: 0;
                }
                ul.thumb li img.hover {
	                background: url(../../Images/thumb_bg.png) no-repeat center center;  /* Image used as background on hover effect */
	                border: none; /* Get rid of border on hover */
                }
  



/* ###############  C O N T E N T  ############### */

#content, #content-feature {
    position: relative; 
    display: block;
    display: inline;
    float: left;
    width: 860px;
	margin: 20px 0px 0px 20px;
	padding-bottom: 15px;
	/* background-color: Gray; */
}
#content-feature 
{
    width: 900px;
    padding: 30px 0px 30px 0px;

	margin: 0px;
	background-color: #f9fbfe;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    -moz-border-radius-topleft: 12px;
    -moz-border-radius-topright: 12px;
}
.titlebar 
{
    background-color: #0064C3;
    padding: 20px 30px 15px 30px;
    color: #FFF;
    width: 840px;
    float: left;
    clear: both;
}
.titlebar h2, .titlebar h5
{
    color: #FFF;
    font-style: italic;
    font-size: 24px;
    padding: 0;
    margin: 0;
    text-shadow: 1px 1px 0px #0c558d; /* CSS3 */

}
.titlebar h5
{
    color: #aed8f8;
    font-size: 14px;
    font-weight: bold;
    font-style: normal;
    text-transform: uppercase;
}
    #content p.kuvateksti { margin: 0px; padding: 0px; font-size: 11px; line-height: 15px; color: #777; font-style:italic; }
    #content p.kuvateksti img { border: solid 1px #7e7e7e; margin: 0px 0px 5px 0px; }
    .content_block_left, .content_block_right, .content_block_case, .content_text {
        display: block;
        float: left;    
        width: 400px;
        font-size: 13px;
        line-height: 20px;
        /* background-color: Green; */
        margin-left: 10px;
        
    }

    .content_block_left {
        border-right: solid 1px #bcbcbc;
    	padding-right: 15px;
    	margin-right: 5px;
    }

    .content_block_case {
        /* border-left: solid 1px #bcbcbc; */
    	padding-left: 10px;
        /* background: url(../../Images/whirlpool_logo.jpg) no-repeat right top; 
         */
    }
            
            .content_block_right img, .content_block_case img {
                border: solid 1px #bcbcbc; margin: 0px 0px 10px 0px;
            }
    .content_text 
    {
        width: 440px;
        padding: 0 20px 0 80px;
    }
    .content_text img 
    {
        border: 1px solid #D1D1D1;
    }
    .content_text h3
    {
        padding: 6px 0;
    }

.btnAction {
    font-family: Arial, helvetica, Sans-Serif;
    margin: 0px 0px 0px 0px;
    background:  url("../../Images/header_button_r.png" ) no-repeat right top;
    padding: 0px 0px 0px 0px;
    /* background-color: red; */
    display: block;
    float: left;
    height: 39px;
}

.btnAction a:link, .btnAction a:visited, .btnAction a:hover {
    color: #FFF;
	font-weight:bold;
    font-size: 16px; 
    letter-spacing: 1px; 
    text-transform:uppercase;
    text-decoration:none;
    background:  url("../../Images/header_button_l.png" ) no-repeat left top;
    padding: 10px 25px 1px 25px;
    margin: 0px;
    font-weight:bold;
    display: block;
    float: left; 
    height: 39px;
    text-shadow: -1px 0px 1px #0558a8; /* CSS3 */
}
.sideWrapper
{
    padding: 20px 24px;
    background-color: #FAFAFA;
    border: 1px solid #DBDBDB;
    border-radius: 4px; /* CSS3 */
    -moz-border-radius: 4px; /* for Firefox */
    -webkit-border-radius: 4px; /* for Safari */
    box-shadow: 1px 1px 3px #e4e7e9; /* CSS3 */
    -moz-box-shadow: 1px 1px 3px #e4e7e9; /* for Firefox */
    -webkit-box-shadow: 1px 1px 3px #e4e7e9; /* for Safari */
}
.sideWrapper h2 
{
    color: #555;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
}
.sideWrapper p
{
    color: #555;
    font-size: 11px;
}


/* ########  F O O T E R  ###################### */

.footer-navigation 
{
    display: inline; 
    float: left; 
    padding: 20px;
    width: 858px;
    background-color: #F5F5F5;
    border: 1px solid #d9d9d9;
    color: #222;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    -moz-border-radius-bottomleft: 12px;
    -moz-border-radius-bottomright: 12px;
}
.footer-navigation .col-3 
{
    padding: 0 0px;
    margin-right: 20px;
    width: 170px;
}
.footer-navigation h3
{
    color: #6d6d6d;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 1px solid #DDD;
    padding: 0 5px;
    text-shadow: 1px 1px 0px #FFF; /* CSS3 */
}
.footer-navigation .col-3 ul  
{
    display: inline; 
    float: left; 
    width: 160px;
    padding: 0;
}

.footer-navigation  .col-3 ul li 
{
    display: inline; 
    float: left;
    width: 165px;
    margin: 2px 0px 2px 0px;
    line-height: 16px;
}

.footer-navigation  .col-3 ul li a
{
    color: #999;
    font-size: 11px;
    font-weight: bold;
    text-decoration: none;
    display: inline; 
    float: left;
    clear: both;
    width: 165px;
}

.footer-navigation .col-3 ul li span a
{
    color: #888;
    font-size: 11px;
    font-weight: normal;
    text-decoration: none;
    display: inline; 
    float: left;
    clear: both;
    padding-left: 15px;
    width: 145px;
}

.footer-navigation .col-3 ul li a:hover 
{
    color: #444;
}


#footer { 
    /* position: relative; */
    float: left;
    display: block;
    display: inline;
    margin: 0px 0px 0px 0px;
    padding: 5px 0px 10px 0px;
    /* overflow: hidden; */
    background-color: transparent;
    /* background-color: red;  */
    width: 900px;
    color: #e2e8ef; text-align:left; text-align:center; line-height: 18px;
} 
#signup #footer p {  color: #888;  /* float: right; width: 450px; */ }
#footer a, #footer a:link, #footer a:visited { color: #e2e8ef; text-decoration: none; }
#footer a:hover { color: #FFF; text-decoration: underline; }
#signup #footer a, #signup #footer a:link, #signup #footer a:visited { color: #888; text-decoration: none; }
#signup #footer a:hover { color: #555; text-decoration: underline; }


.contactPortraits { background-color: #ededed; padding: 15px; border: 1px solid #cfcfcf; margin-bottom: 20px; width: 368px;
    border-radius: 6px; /* CSS3 */
    -moz-border-radius: 6px; /* for Firefox */
    -webkit-border-radius: 6px; /* for Safari */
    box-shadow: 3px 2px 5px #ededed; /* CSS3 */
    -moz-box-shadow: 3px 2px 5px #ededed; /* for Firefox */
    -webkit-box-shadow: 3px 2px 5px #ededed; /* for Safari */
}
