/* 
    Document   : style
    Created on : Aug 23, 2012, 10:43:38 AM
    Author     : Arttu Pekkarinen
    Description:
        Alustava tarjova.fi html tyylien kääntö css:lle.
*/

/*Globaalit*/
body {
    width: 100%;
    text-align: center;
    padding: 0;
    margin: 0 auto;
    overflow-y: scroll; /* This will fix the content jumping */
    background-image: url('../img/body_main.gif');
    background-repeat: repeat-y;
    background-position: 50%;
    font-family: 'Calibri', 'Arial', 'Helvetica', sans-serif;
}

#wrapper {
    width: 950px;
    margin: 0 auto;
    text-align: left;
}

a:link, a:visited, a:hover, a:active {
    color: white; 
    text-decoration: none;
}

.float_left {
    float: left;
}

.float_right {
    float: right;
}

/*Header*/
table#headerwrap {
    width: 950px;
    min-height: 70px;
    padding: 0px !important;
    border: none !important;
}

#logodiv {
    min-width: 170px;
    max-width: 200px;
    min-height: 70px;
    padding: 0px;	
}

td#navbardiv {
    min-height: 70px;
    padding: 0px !important;
}

#logindiv {
    font-size: 17px;
    max-width: 180px;
    min-height: 70px;
    padding: 0px;
}

p.header_default {
	margin: 8px 0px;
}

p.loginp {
    margin: 40px 20px;
}

p.loggedp {
    margin: 0px 20px;
}

a.loginlink:link, a.loginlink:visited {
    text-decoration: underline !important;
    color: #257325 !important;
}

a.loginlink:hover, a.loginlink:active {
    text-decoration: underline !important;
    color: #A0A0A0 !important;
}

a.logoutlink:link, a.logoutlink:visited {
    text-decoration: underline;
    color: #257325;
}

a.logoutlink:hover, a.logoutlink:active {
    text-decoration: underline;
    color: #A0A0A0;
}

#loginform {
    float: left;
    margin: auto;
    width: 100%
}

/*navbuttons*/
td.navbuttons {
    height: 35px !important;
    padding: 0px !important;
    float: none !important;
}

table#alignbuttons {
    margin: auto;
    padding: 0px;
}

.navlinks {
    font-family: Calibri !important; 
    font-size: 13px !important; 
    height: 20px !important; 
    font-weight: bold !important; 
    width: 80px !important;
    /*background-image: url('../img/button.gif');*/
    /*Tehdään html5:lla:*/
    background-color: #006600 !important;
    border: 1px solid #257325 !important;
    -moz-border-radius: 10px !important;
    border-radius: 10px !important;
    border-bottom-right-radius: 0px !important;
    border-bottom-left-radius: 0px !important;
    padding: 5px 15px 0px 15px !important;

    /*Gradientit buttoneille*/
    background-image: linear-gradient(bottom, rgb(0,102,0) 0%, rgb(0,102,0) 58%, rgb(68,143,68) 79%);
    background-image: -o-linear-gradient(bottom, rgb(0,102,0) 0%, rgb(0,102,0) 58%, rgb(68,143,68) 79%);
    background-image: -moz-linear-gradient(bottom, rgb(0,102,0) 0%, rgb(0,102,0) 58%, rgb(68,143,68) 79%);
    background-image: -webkit-linear-gradient(bottom, rgb(0,102,0) 0%, rgb(0,102,0) 58%, rgb(68,143,68) 79%);
    background-image: -ms-linear-gradient(bottom, rgb(0,102,0) 0%, rgb(0,102,0) 58%, rgb(68,143,68) 79%);

    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, rgb(0,102,0)),
            color-stop(0.58, rgb(0,102,0)),
            color-stop(0.79, rgb(68,143,68))
    );

}

a.navlinks:hover, a.navlinks:active {
    font-family: Calibri; 
    font-size: 13px; 
    height: 20px; 
    font-weight: bold; 
    width: 80px;
    /*background-image: url('../img/button.gif');*/
    /*Tehdään html5:lla:*/
    background-color: #288C28;
    border: 1px solid #257325;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    padding: 5px 15px 0px 15px !important;

    /*Gradientit buttoneille*/
    background-image: linear-gradient(bottom, rgb(60,128,60) 0%, rgb(87,166,87) 58%, rgb(71,158,71) 80%);
    background-image: -o-linear-gradient(bottom, rgb(60,128,60) 0%, rgb(87,166,87) 58%, rgb(71,158,71) 80%);
    background-image: -moz-linear-gradient(bottom, rgb(60,128,60) 0%, rgb(87,166,87) 58%, rgb(71,158,71) 80%);
    background-image: -webkit-linear-gradient(bottom, rgb(60,128,60) 0%, rgb(87,166,87) 58%, rgb(71,158,71) 80%);
    background-image: -ms-linear-gradient(bottom, rgb(60,128,60) 0%, rgb(87,166,87) 58%, rgb(71,158,71) 80%);

    background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, rgb(60,128,60)),
            color-stop(0.58, rgb(87,166,87)),
            color-stop(0.8, rgb(71,158,71))
    );
}

td#navbar {
    background-image: url('../img/bg.gif');
    background-repeat: repeat-x;
    width: 760px;
    height: 10px;
    padding: 0px !important;
    border: none;
}

/*Ie7, Ie8 header*/
.ie7 img {
	border: none;
}
.ie7 #navbardiv {
    min-height: 70px;
    padding: 0px;
    text-align: center;
}
.ie7 #alignbuttons {
    text-align: center;
}
.ie7  .navlinks {
    font-family: Calibri;
    font-size: 12px;
    font-weight: bold;
    border: none;
    z-index: 0;
    background-color: transparent;
    text-align: center;
}
.ie7 .navbuttons {
    background-image: url('../img/button.gif');
    display: inline-block;
    width: 80px;
    height: 18px;
}
.ie7 #indexb, .ie7 #hyodytb, .ie7 #palvelutb {
    padding: 20px !important;
}

.ie7 #kustannuksetb {
    padding: 0px 20px 0 5px !important;
}
.ie7 #tarjovab {
    padding: 0px 15px 0px 10px !important;
}
.ie7 #otayhteyttab {
    padding: 0 5px 0 8px !important;
}
.ie7 a.navlinks:hover, .ie7 a.navlinks:active {
    text-align: center;
    font-family: Calibri;
    font-size: 12px;
    font-weight: bold;
    border: none;
    z-index: 0;
    background-color: transparent;
}

.ie8 #navbardiv {
    min-height: 70px;
    padding: 0px;
    text-align: center;
}
.ie8 #alignbuttons {
    text-align: center;
}
.ie8  .navlinks {
    font-family: Calibri;
    font-size: 12px;
    font-weight: bold;
    border: none;
    z-index: 0;
    background-color: transparent;
    text-align: center;
}
.ie8 .navbuttons {
    background-image: url('../img/button.gif');
    display: inline-block;
    width: 80px;
    height: 18px;
}
.ie8 #indexb, .ie7 #hyodytb, .ie7 #palvelutb {
    padding: 20px !important;
}

.ie8 #kustannuksetb {
    padding: 0px 20px 0 5px !important;
}
.ie8 #tarjovab {
    padding: 0px 15px 0px 10px !important;
}
.ie8 #otayhteyttab {
    padding: 0 5px 0 8px !important;
}
.ie8 a.navlinks:hover, .ie7 a.navlinks:active {
    text-align: center;
    font-family: Calibri;
    font-size: 12px;
    font-weight: bold;
    border: none;
    z-index: 0;
    background-color: transparent;
}

/*Content*/

#main {
    text-align: left;
    width: 950px;
}

#container {
    width: 957px; 
    margin: 0 auto;
}

#container td, tr {
    padding: 5px;
}

/*Reload div - ajax div, joka päivittää sisältöä*/
#ReloadThis {

}

/*Purkkakorjaus demolle*/
#demodiv {
    width: 1007px; 
    height: 100%;
    margin: auto;
    clear: both;
}

/*Tonttihuutokaupan taulujen class muotoilut*/
.tonttitables {
    border-collapse: collapse; 
    float: left; 
    margin-right: 750px; 
    padding: 7px;  
    border: 1px solid grey; 
    float: left; 
    margin-bottom: 50px; 
    font-family: Arial; 
    font-size: 14px;
}

/*Tonttihuutokaupan rivien class muotoilut (sininen ja valkoinen)*/
.tonttib {
    background-color: #e9e9e9;
}

.tonttitw {
    background-color: white;
}

/*Ensimmäinen tonttihuutokaupan taulu*/
#ts1 {
    width: 920px;
    border-spacing: 7px;
    border-collapse: collapse;
    border: 1px solid grey;
    font-family: Arial;
    font-size: 14px;
}

/*Ensimmäinen pistehuutokaupan taulu*/
#pt1 {
    width: 920px;
    border-spacing: 7px;
    border-collapse: collapse;
    border: 1px solid grey;
    font-family: Arial;
    font-size: 14px;
}

/*Toinen taulu(div) johon tonttihuutokaupan aika ja viimeisimmät huudot päivittyvät*/
#ts2 {
    border-collapse: collapse; 
    float: left; 
    margin-right: 750px; 
    border: 1px solid grey; 
    float: left; 
    margin-bottom: 25px; 
    font-family: Arial; 
    font-size: 14px;
    width: 240px;
}

/*Toinen taulu(div) johon pistehuutokauppaan aika ja viimeisimmät huudot päivittyvät*/
#pt2 {
    border-collapse: collapse; 
    float: left; 
    margin-right: 50px; 
    border: 1px solid grey; 
    float: left; 
    margin-bottom: 25px; 
    font-family: Arial; 
    font-size: 14px;
    width: 270px;
}

/*Kolmas taulu johon päivittyvät tarjoukset*/
#ts3 {
    border-spacing: 7px;
    padding: 7px;
    border-collapse:collapse; 
    border-left: 1px solid grey; 
    border-top: 1px solid grey; 
    border-bottom: 1px solid grey; 
    float: left; 
    margin-bottom: 50px; 
    font-family: Arial; 
    font-size: 14px;
}

/*Kolmas taulu johon päivittyvät tarjoukset*/
#pt3 {
    border-spacing: 7px;
    padding: 7px;
    border-collapse:collapse; 
    border: 1px solid grey; 
    float: left; 
    margin-bottom: 25px; 
    font-family: Arial; 
    font-size: 14px;
    width: 270px;
}

/*Purukumikorjaus purukumipistehuutokauppahässäkkään 
(divillä wrapataan kaksi taulua, niin että "jätä tarjous" osio ei pomppaa ulos)*/
#wrap_pt2 {
    float: left;
    width: 300px;
    display: inline-block;
}

/*Samaa purkkaa*/
#calculatepiste {
    max-width: 550px;
    float: left;
    display: inline-block;
}

#pistefooter {
    width: 950px; 
    clear: both; 
    height: 2px; 
    margin: auto;
    font-size:3;
    color: #A0A0A0;  
}

/*Määritellään tonttihuutokauppojen linkkien värejä ja muotoiluja*/
a.tonttilink:link, a.tonttilink:visited {
    text-decoration: underline;
    color: black;
}

a.tonttilink:hover, a.tonttilink:active {
    text-decoration: underline;
    color: #257325;
}

/*Tonttihuutokauppa taulun 3 solujen määritykset*/
#ts3td {
    width: 170px;
    background-color: #e9e9e9;
    padding: 10px 7px;
}

#ts3tdtesti {
    width: 100px;
    background-color: #e9e9e9;
    padding: 10px 7px;
}

/*Pistehuutokauppa solujen määritykset*/
#pt3td {
    background-color: #e9e9e9;
    padding: 10px 7px;
}

#pt3th {
    background-color: #e9e9e9;
    padding: 10px 7px; 
}

#omatarjous {
    color: #257325;
}

/*Footer*/
#footer {
    float: left;
    margin: auto;
    width: 950px;
    display: inline-block;
    padding: 0px 0px 20px 0px;
}

#hrdiv {
    float: left;
    width: 100%;
    padding: 0px 0px 5px 0px;
}

#copyrightdiv {
    float: left;
    width: 50%
}

#footerlinksdiv {
    float: right;
    width: 50%
}

.footerspans {
    font-family: Calibri;
    font-size: 17px;
    color: #A0A0A0;
}

hr.footerhr {
    width: 100%; 
    height: 2px; 
    margin-left: 0px; 
    margin-right: auto;
}

a.footerlinks {
    font-size: 17px;
    color: #A0A0A0;
    text-decoration: underline;
    float: right;
}

/* Costs - hinnasto */

#costs > p {
    font-size:0.9em;
}

#costs {
    font-family:"Calibri", Arial, Helvetica, sans-serif;
    width:530px;
    border-collapse:collapse;
}
#costs td, #costs th {
    font-size:0.9em;
    border:1px solid #257325;
    padding:3px 7px 2px 7px;
}
#costs th {
    font-size:0.9em;
    text-align:left;
    padding-top:5px;
    padding-bottom:4px;
    background-color:#005b00;
    color:#ffffff;
}
#costs tr.alt td {
    color:#000000;
    background-color:#e3e5e1;
}