.modal {
/* Overlay page content */ 
position: fixed; 
top: 0; 
left: 0; 
right: 0; 
bottom: 0; 
background: rgba(0,0,0,0.5); 
z-index: 10000;
/* Transition opacity on open */ 
-webkit-transition: opacity 500ms ease-in; 
-moz-transition: opacity 500ms ease-in; 
transition: opacity 500ms ease-in;
/* Hide for now */ 
opacity: 0; 
pointer-events: none; 
}
/* Show modal */ 
.modal:target { 
opacity: 1; 
pointer-events: auto; 
/* at time of writing (Feb 2012), pointer-events not supported by Opera or IE */ 
}
/* Content */ 
.modal > div { 
width: 500px; 
background: #fff; 
position: relative; 
margin: 10% auto;
/* Default minimise animation */ 
-webkit-animation: minimise 500ms linear; 
-moz-animation: minimise 500ms linear;
/* Prettify */ 
padding: 30px; 
border-radius: 7px; 
box-shadow: 0 3px 20px rgba(0,0,0,0.9); 
background: #fff; 
background: -moz-linear-gradient(#fff, #ccc); 
background: -webkit-linear-gradient(#fff, #ccc); 
background: -o-linear-gradient(#fff, #ccc); 
text-shadow: 0 1px 0 #fff; 
}
/* Override animation on modal open */ 
.modal:target > div { 
-webkit-animation-name: bounce; 
-moz-animation-name: bounce; 
}
.modal h2 { 
font-size: 36px; 
padding: 0 0 20px; 
}
@-webkit-keyframes bounce { 
  0% { 
      -webkit-transform: scale3d(0.1,0.1,1); 
      box-shadow: 0 3px 20px rgba(0,0,0,0.9); 
  } 
  55% { 
      -webkit-transform: scale3d(1.08,1.08,1); 
      box-shadow: 0 10px 20px rgba(0,0,0,0); 
  } 
  75% { 
      -webkit-transform: scale3d(0.95,0.95,1); 
      box-shadow: 0 0 20px rgba(0,0,0,0.9); 
  } 
  100% { 
      -webkit-transform: scale3d(1,1,1); 
      box-shadow: 0 3px 20px rgba(0,0,0,0.9); 
  } 
}
@-webkit-keyframes minimise { 
  0% { 
      -webkit-transform: scale3d(1,1,1); 
  } 
  100% { 
      -webkit-transform: scale3d(0.1,0.1,1); 
  } 
}
@-moz-keyframes bounce { 
  0% { 
      -moz-transform: scale3d(0.1,0.1,1); 
      box-shadow: 0 3px 20px rgba(0,0,0,0.9); 
  } 
  55% { 
      -moz-transform: scale3d(1.08,1.08,1); 
      box-shadow: 0 10px 20px rgba(0,0,0,0); 
  } 
  75% { 
      -moz-transform: scale3d(0.95,0.95,1); 
      box-shadow: 0 0 20px rgba(0,0,0,0.9); 
  } 
  100% { 
      -moz-transform: scale3d(1,1,1); 
      box-shadow: 0 3px 20px rgba(0,0,0,0.9); 
  } 
}
@-moz-keyframes minimise { 
  0% { 
      -moz-transform: scale3d(1,1,1); 
  } 
  100% { 
      -moz-transform: scale3d(0.1,0.1,1); 
  } 
}
/* Modal close link */ 
.modal a[href="#close"] { 
position: absolute; 
right: 0; 
top: 0; 
color: transparent; 
}
/* Reset native styles */ 
.modal a[href="#close"]:focus { 
outline: none; 
}
/* Create close button */ 
.modal a[href="#close"]:after { 
content: 'X'; 
display: block;
/* Position */ 
position: absolute; 
right: -10px; 
top: -10px; 
width: 1.5em; 
padding: 1px 1px 1px 2px;
/* Style */ 
text-decoration: none; 
text-shadow: none; 
text-align: center; 
font-weight: bold; 
background: #000; 
color: #fff; 
border: 3px solid #fff; 
border-radius: 20px; 
box-shadow: 0 1px 3px rgba(0,0,0,0.5); 
}
.modal a[href="#close"]:focus:after, 
.modal a[href="#close"]:hover:after { 
-webkit-transform: scale(1.1,1.1); 
-moz-transform: scale(1.1,1.1); 
}
.modal a[href="#close"]:focus:after { 
outline: 1px solid #000; 
}
/* Open modal */ 
a.openModal { 
-moz-box-shadow:inset 0px 1px 0px 0px #caefab; 
    -webkit-box-shadow:inset 0px 1px 0px 0px #caefab; 
    box-shadow:inset 0px 1px 0px 0px #caefab; 
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #77d42a), color-stop(1, #5cb811) ); 
    background:-moz-linear-gradient( center top, #77d42a 5%, #5cb811 100% ); 
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#77d42a', endColorstr='#5cb811'); 
    background-color:#77d42a; 
    -moz-border-radius:6px; 
    -webkit-border-radius:6px; 
    border-radius:6px; 
    border:1px solid #268a16; 
    display:inline-block; 
    color:#306108; 
    font-family:Verdana; 
    font-size:15px; 
    font-weight:bold; 
    padding:6px 24px; 
    text-decoration:none; 
    text-shadow:1px 1px 0px #aade7c; 
}
a.openModal:hover, 
a.openModal:focus { 
background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #5cb811), color-stop(1, #77d42a) ); 
    background:-moz-linear-gradient( center top, #5cb811 5%, #77d42a 100% ); 
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#5cb811', endColorstr='#77d42a'); 
    background-color:#5cb811; 
}