@charset "utf-8";
/* CSS Document */

/* Start custom button CSS here
    ---------------------------------------- */
.btn {
	display:inline-block;
	background:none;
	margin:0;
	padding:0 0 2px 0;
	border-width:0;
	overflow:visible;
	font: 11px Arial, Sans-serif;
	text-decoration:none;
	color:#eee;
}
* html button.btn {
	padding-bottom:0;
}
    /* Immediately below is a temporary hack to serve the 
       following margin values only to Gecko browsers
       Gecko browsers add an extra 3px of left/right 
       padding to button elements which can't be overriden.
       Thus, we use -3px of left/right margin to overcome this. */

/* This is now commented away, since the 3px extra indent looks better than
 * a -3px counter-indent, which in Safari makes the button jump to the left
 *
html:not([lang*=""]) button.btn {
 margin:0 -3px;
}
*/

/*
 * Modified button colours to make the darker and better contrast */
.btn span {
	background: rgb(91,89,76) url(/images/btnBg-darker.gif) no-repeat 0 50%; /*#b4b0a1=rgb(180,176,161) */
	margin:0;
	padding:0 0 2px 0;
	border-left:1px solid rgb(136,136,119);
	border-right:1px solid rgb(73,73,63);
	font-size: 11px;
}
* html .btn span {
	padding-bottom:0;
}
.btn span span {
	background: url(/images/btnBg2-darker.gif) no-repeat 100% 50%;
	position:relative;
	padding:0 .8em 2px .8em;
	border-width:0;
	border-top:1px solid rgb(136,136,119);
	border-bottom:1px solid rgb(61,61,52);
	font-size: 11px;
    /* letter-spacing:1px; */
}
.btn.tight span span {
    padding:0 0.2em 2px 0.2em;
}
.btn:hover span, .btn:hover span span, .btn:focus span, .btn:focus span span {
	cursor:pointer;
	color:#fff;
}
.btn:hover span {
	background: #8b8875 url(/images/btnBgHover-darker.gif) no-repeat 0 50%;
	border-left-color: rgb(174,174,148) !important;
	border-right-color: rgb(112,112,96) !important;
}
.btn:hover span span {
	background: url(/images/btnBgHover2-darker.gif) no-repeat 100% 50%;
	border-top-color: rgb(174,174,148) !important;
	border-bottom-color: rgb(104,104,89) !important;
}
.btn:active span {
	background-image: none;
	background-color: #999;
	outline:none;
}
.btn:focus, .btn:active {
	outline:none;
}


.btn.disabled {
    opacity:0.5 !important;
    filter:alpha(opacity=50) !important;
    color:#fff !important;
}

.btn.veryvisible {
}
.btn.veryvisible span {
    background-color: rgb(155,84,21);
    background-image:none;
    border-left-color: rgb(188,102,26) !important;
    border-right-color: rgb(118,64,16) !important;
}
.btn.veryvisible span span {
    border-top-color: rgb(188,102,26) !important;
    border-bottom-color: rgb(118,64,16) !important;
}
.btn.veryvisible:hover span, .btn.veryvisible:hover span span {
    background-color: rgb(188,102,26);
    border-bottom-color: rgb(155,84,21) !important;
    border-right-color: rgb(155,84,21) !important;
    border-left-color: rgb(221,120,30) !important;
    border-top-color: rgb(221,120,30) !important;
    background-image:none;
}

/********************************************************************
 *
 * Tiny buttons
 *
 ********************************************************************/
.tinybutton {
    /* background:#5a594c url(/images/tinybutton_small-13px.png) no-repeat center center; */
    background: transparent url(/images/tinybutton_small-13px.png) no-repeat center center;
    width:13px;
    height:13px;
    text-align:center;
    font-weight:bold;
    cursor:default;
    display:inline-block;
    position:relative;
    top:3px;
}
.tinybutton:hover {
    background:#8d8c7f;
}
.tinybutton.plus1 span {
    position:relative;
    top:-2px;
}
.tinybutton.minus1 span {
    position:relative;
    top:-3px;
}



/*
 * Original settings by AirDice with much lighter button colours

.btn span {
	background:#b4b0a1 url(/images/btnBg.gif) no-repeat 0 50%;
	margin:0;
	padding:0 0 2px 0;
	border-left:1px solid #bba;
	border-right:1px solid #998;
	font-size: 11px;
}
* html .btn span {
	padding-bottom:0;
}
.btn span span {
	background: url(/images/btnBg2.gif) no-repeat 100% 50%;
	position:relative;
	padding:0 .8em 2px .8em;
	border-width:0;
	border-top:1px solid #bbc;
	border-bottom:1px solid #665;
	font-size: 11px;
}
.btn:hover span, .btn:hover span span, .btn:focus span, .btn:focus span span {
	cursor:pointer;
	color:#fff;
}
.btn:hover span {
	background: #8b8875 url(/images/btnBgHover.gif) no-repeat 0 50%;
	border-left-color: #887 !important;
	border-right-color: #556 !important;
}
.btn:hover span span {
	background: url(/images/btnBgHover2.gif) no-repeat 100% 50%;
	border-top-color: #887 !important;
	border-bottom-color: #334 !important;
}
.btn:active span {
	background-image: none;
	background-color: #999;
	outline:none;
}
.btn:focus, .btn:active {
	outline:none;
}
*/

/* pill classes only needed if using pill style buttons ( LEFT | CENTER | RIGHT ) */
button.pill-l span {
	border-right-width:0;
}
button.pill-l span span {
	border-right:1px solid #bbb;
}
button.pill-c span {
	border-right-style:none;
	border-left-color:#fff;
}
button.pill-c span span {
	border-right:1px solid #bbb;
}
button.pill-r span {
	border-left-color:#fff;
}

/* use if one button should be the 'primary' button */
.primary {
	font-weight:bold;
	color:#000;
}
/* DARK BUTTON */
#kuvatilaukset .btn {
	color:#ccc;
}
#kuvatilaukset .btn span {
	background:#2a4460 url(/images/btnBgAlt.gif) no-repeat 0 50%;
	border-width:0;
	border-left:1px solid #457;
	border-right:1px solid #344;
}
#kuvatilaukset .btn span span {
	background: url(/images/btnBgAlt2.gif) no-repeat 100% 50%;
	border-width:0;
	border-top:1px solid #457;
	border-bottom:1px solid #344;
}
#kuvatilaukset .btn:hover span {
	background: #1f3348 url(/images/btnBgAltHover.gif) no-repeat 0 50%;
	border-left-color: #246 !important;
	border-right-color: #122 !important;
}
#kuvatilaukset .btn:hover span span {
	background: url(/images/btnBgAltHover2.gif) no-repeat 100% 50%;
	border-top-color: #246 !important;
	border-bottom-color: #122 !important;
}
#kuvatilaukset .btn:active span {
	background-image: none;
	background-color: #134;
}


.paybuttonimg {
    /* background-image: url(/images/maksa-tasta.png); */
    width: 141px;
    height: 29px;
}

.paybuttonimg:hover {
    /* background-image: url(/images/maksa-tasta-hover.png); */
}