/**

  Button.css
  
  Styling van Buttons. Form-buttons, Call-to-Action-links, etc. Inclusief touch/no-touch aanpassingen e.d.
  
*/

button, input[type=button], input[type=reset], input[type=submit] { cursor: pointer; -webkit-appearance: button; }

.button,
.button:link,
.button:visited,
input[type=reset],
input[type=submit],
button {
	position: relative;
  display: inline-block;
  vertical-align: baseline;

  margin-top: 5px;
  margin-bottom: 5px;
  padding: 0;
  
  font-family: 'NimbusSansNovusCond-Bold', 'Impact', 'Arial', sans-serif;
  font-size: 18px;
  line-height: 18px;
  font-weight: normal;
  color: #000;
  
  text-align: center;
  text-decoration: none;
  text-shadow: none;

  background: #EBEAE9 url('Lotto/images/backgrounds/button-grey.png') center center repeat-x;
  
  border: 1px solid #EBEAE9;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0, 0.6);
  box-shadow: 0 1px 2px rgba(0,0,0, 0.6);

  behavior: url(/cspublish/Lotto/images/PIE.htc);

  -webkit-tap-highlight-color: rgba(0,0,0,0);
  tap-highlight-color: rgba(0,0,0,0);
  -webkit-touch-callout: none;
  touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	-webkit-user-drag: none;
	-moz-user-drag: none;
	-ms-user-drag: none;
	-o-user-drag: none;
	user-drag: none;
}
.ie7 input[type=reset],
.ie7 input[type=submit],
.ie7 button {
  top: -1px;
}

.button:hover,
.button:focus,
input[type=reset]:hover,
input[type=reset]:focus,
input[type=submit]:hover,
input[type=submit]:focus,
button:hover,
button:focus {
  background: #EBEAE9 url('Lotto/images/backgrounds/button-grey-active.png') center center repeat-x;
  -webkit-box-shadow: 0 1px 4px rgba(0,0,0, 0.8);
  box-shadow: 0 1px 4px rgba(0,0,0, 0.8);
  behavior: url(/cspublish/Lotto/images/PIE.htc);
}
.button:active,
.button:link:active,
input[type=reset]:active,
input[type=submit]:active,
button:active {
	top: 1px;
  -webkit-box-shadow:  0 0 2px rgba(0,0,0, 0.6);
  box-shadow:  0 0 2px rgba(0,0,0, 0.6);
  behavior: url(/cspublish/Lotto/images/PIE.htc);
  outline: none;
}


/* 
    Text buttons:
*/

.surpriseme .button-action:link, .surpriseme .button-action:visited, .surpriseme .button-action {
	min-width: 28px !important;
}

.button-action:link,
.button-action:visited,
.button-action {
  color: #fff;
  border: 1px solid #000;
  background: #000 url('Lotto/images/backgrounds/button-black.png') center center repeat-x;
  /* min-width: 240px; removed 22/11/13 */
}
.mycollections-button-action:link,
.mycollections-button-action:visited,
.mycollections-button-action {
  color: #fff;
  border: 1px solid #000;
  background: #000 url('Lotto/images/backgrounds/button-black.png') center center repeat-x;

}
.button-action:hover,
.button-action:focus,
.mycollections-button-action:hover,
.mycollections-button-action:focus {
  background: #000 url('Lotto/images/backgrounds/button-black-active.png') center center repeat-x;
}
.button-action:link:active,
.button-action:active,
.mycollections-button-action:link:active,
.mycollections-button-action:active{
}

.button-info:link,
.button-info:visited,
.button-info {
  text-shadow: 0 1px 2px rgba(255,255,255, 0.9);
  background: #FFD500 url('Lotto/images/backgrounds/button-yellow.png') center center repeat-x;
  border: 1px solid #FFD500;
}
.button-info:hover,
.button-info:focus {
  background: #FFD500 url('Lotto/images/backgrounds/button-yellow-active.png') center center repeat-x;
}
.button-info:link:active,
.button-info:active {
}


.button-action2:link,
.button-action2:visited,
.button-action2 {
  color: #fff;
  background: #D10019 url('Lotto/images/backgrounds/button-red.png') center center repeat-x;
  border: 1px solid #D10019;
}
.button-action2:hover,
.button-action2:focus {
  background: #D10019 url('Lotto/images/backgrounds/button-red-active.png') center center repeat-x;
}
.button-action2:link:active,
.button-action2:active {
}


/* Social buttons */

.button-twitter:link,
.button-twitter:visited,
.button-twitter {
  color: #fff;
  background: #65CFF3 url('Lotto/images/backgrounds/button-twitter.png') center center repeat-x;
  border: 1px solid #65CFF3;
}
.button-twitter:hover,
.button-twitter:focus {
  background: #65CFF3 url('Lotto/images/backgrounds/button-twitter-active.png') center center repeat-x;
}
.button-twitter:link:active,
.button-twitter:active {
}

.button-facebook:link,
.button-facebook:visited,
.button-facebook {
  color: #fff;
  background: #3B619B url('Lotto/images/backgrounds/button-facebook.png') center center repeat-x;
  border: 1px solid #3B619B;
}
.button-facebook:hover,
.button-facebook:focus {
  background: #3B619B url('Lotto/images/backgrounds/button-facebook-active.png') center center repeat-x;
}
.button-facebook:link:active,
.button-facebook:active {
}



/* 
    Image/Icon buttons:
*/
.button-icon-label,
.button-icon-label:link,
.button-icon-label:visited,
.button-icon,
.button-icon:link,
.button-icon:visited {
  padding: 0;
  vertical-align: middle;
  margin-left: 5px;
  margin-right: 5px;
}

button span,
.button span {
  display: block;
  vertical-align: middle;
  padding: 7px 40px 9px 40px;
}
button.button-icon span,
.button-icon span {
  width: 34px;
  height: 34px;
  padding: 0;
  overflow: hidden;
  text-indent: -999em;
  text-align: left;
}

/* Sprites: */
a .icon,
.button i,
button i {
  position: absolute;
  top: 4px;
  left: 3px;
  display: inline-block;
  width: 28px;
  height: 28px;
  overflow: hidden;
  background-color: transparent;
  background-image: url('Lotto/images/sprites/button-icons.png');
  background-repeat: no-repeat;
}
.button:active i {
  top: 1px;
}
a .icon {
  position: relative;
  vertical-align: bottom;
}

.icon-refresh { background-position: 0 0; }
.icon-edit {    background-position: 0 -28px; }
.icon-clear {   background-position: -28px 0; }
.icon-magic {   background-position: 0 -84px; }

.icon-plus { background-position: -56px 0; }
.icon-min {  background-position: -84px 0; }

.icon-next {     background-position: -56px -28px; }
.icon-previous { background-position: -28px -28px; }

.icon-email { background-position: 0 -56px; }
.icon-phone { background-position: -28px -56px; }
.icon-print { background-position: -112px 0; }
.icon-twitter {    background-position: -84px -56px; }
.icon-facebook {   background-position: -84px -28px; }
.icon-googleplus { background-position: -112px -28px; }
.icon-youtube {    background-position: -112px -56px; }

.icon-c-facebook {   background-position: -28px -84px; }
.icon-c-twitter {    background-position: -56px -84px; }
.icon-c-googleplus { background-position: -84px -84px; }


/* Button-icons: HD */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {

  button-icon i {
    background-image: url('Lotto/images/sprites/button-icons-hd.png');
    background-size: 140px;
  }

}/*  / HD */

.icon-small {
  display: inline-block;
  padding-left: 16px;
}
.icon-s-login {
  background: transparent url('Lotto/images/layout/icon-small-login.png') left center no-repeat;
}

.icon-s-facebook {
  background: transparent url('Lotto/images/layout/icon-small-facebook.png') left center no-repeat;
}
.icon-s-twitter {
  background: transparent url('Lotto/images/layout/icon-small-twitter.png') left center no-repeat;
}
.icon-s-googleplus {
  background: transparent url('Lotto/images/layout/icon-small-googleplus.png') left center no-repeat;
}



.subline {
  font-family: 'NimbusSansNovusCond-Medium', 'Arial Narrow', 'Arial', sans-serif;
	font-size: 16px;
	font-style: normal;
}

.button[disabled],
button[disabled],
button.disabled {
  cursor: default;
	opacity: 0.5;
	filter: alpha(opacity=50);
}