
/*=================================================
Class Definitions
=================================================*/


.sb {
position: fixed;
top: 50%;
left: 50%;
margin-left: -750px;
margin-top: -100px;
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, 0.5);
z-index: 10000;
opacity: 0;
width: 350px;
height: 315px;
padding: 25px 25px 0 400px;
text-align: left;
background: #d7dadc url("../grafika/bg-nl5.jpg") no-repeat bottom left;
border: 5px solid #dacbb7;
display: none;
}

.sb h2 {
font-size: 220%;
font-weight: normal;
color: #c4953e;
margin-bottom: 1.2em;
}

.sb h2 strong {
font-size: 120%;
}

.sb p {
font-size: 140%;
line-height: normal;
}

.sb p.small {
font-size: 100%;
font-style: italic;
}

.sb p.smaller {
font-size: 120%;
margin-bottom: 2.5em;
}

.sb label {
font-size: 120%;
margin-bottom: 5px;
display: block;
}

.sb input[type="email"] {
background: white;
color: black;
border: 1px solid #845f3b;
font-size: 140%;
padding: 5px;
margin-bottom: 10px;
}

.sb input[type="submit"] {
background: #5d3d1e;
color: white;
font-weight: bold;
font-size: 120%;
padding: 8px 10px;
}


.sb.sb-withoverlay {
position: absolute;
top: 200px;
left: 50%;
margin-left: -400px;
}

.sb-open.sb-open-with-overlay {
overflow: hidden;
}

.sb-open .sb-overlay {
opacity: 1;
}

.sb-open .sb {
opacity: 1;
}

.sb-overlay {
height: 100%;
width: 100%;
background: rgba(0, 0, 0, 0.58);
opacity: 0;
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 9999;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
overflow: auto;
}

.sb-close-backdrop {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
}
 [class^="sb-animation-"], [class*=" sb-animation-"] {
 -webkit-animation-duration: 500ms;
 -moz-animation-duration: 500ms;
 -o-animation-duration: 500ms;
 animation-duration: 500ms;
}

.sb-animation-flyInRight {
-webkit-animation-name: flyInRight;
-moz-animation-name: flyInRight;
-o-animation-name: flyInRight;
animation-name: flyInRight;
}

.sb-animation-flyOutRight {
-webkit-animation-name: flyOutRight;
-moz-animation-name: flyOutRight;
-o-animation-name: flyOutRight;
animation-name: flyOutRight;
}

.sb-animation-flyInLeft {
-webkit-animation-name: flyInLeft;
-moz-animation-name: flyInLeft;
-o-animation-name: flyInLeft;
animation-name: flyInLeft;
}

.sb-animation-flyOutLeft {
-webkit-animation-name: flyOutLeft;
-moz-animation-name: flyOutLeft;
-o-animation-name: flyOutLeft;
animation-name: flyOutLeft;
}

.sb-animation-flyInUp {
-webkit-animation-name: flyInUp;
-moz-animation-name: flyInUp;
-o-animation-name: flyInUp;
animation-name: flyInUp;
}

.sb-animation-flyOutUp {
-webkit-animation-name: flyOutUp;
-moz-animation-name: flyOutUp;
-o-animation-name: flyOutUp;
animation-name: flyOutUp;
}

.sb-animation-flyInDown {
-webkit-animation-name: flyInDown;
-moz-animation-name: flyInDown;
-o-animation-name: flyInDown;
animation-name: flyInDown;
}

.sb-animation-flyOutDown {
-webkit-animation-name: flyOutDown;
-moz-animation-name: flyOutDown;
-o-animation-name: flyOutDown;
animation-name: flyOutDown;
}
/*=================================================
Animation Library
=================================================*/

@-webkit-keyframes 
flyInRight {
 0% {
 opacity: 0;
 -webkit-transform: translateX(3000px);
}
 100% {
 -webkit-transform: translateX(0);
}
}
 @-moz-keyframes 
flyInRight {
 0% {
 opacity: 0;
 -moz-transform: translateX(3000px);
}
 100% {
 -moz-transform: translateX(0);
}
}
 @-o-keyframes 
flyInRight {
 0% {
 opacity: 0;
 -o-transform: translateX(3000px);
}
 100% {
 -o-transform: translateX(0);
}
}
 @keyframes 
flyInRight {
 0% {
 opacity: 0;
 transform: translateX(3000px);
}
 100% {
 transform: translateX(0);
}
}
 @-webkit-keyframes 
flyOutRight {
 0% {
 -webkit-transform: translateX(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateX(3000px);
}
}
 @-moz-keyframes 
flyOutRight {
 0% {
 -moz-transform: translateX(0);
}
 100% {
 opacity: 0;
 -moz-transform: translateX(3000px);
}
}
 @-o-keyframes 
flyOutRight {
 0% {
 -o-transform: translateX(0);
}
 100% {
 opacity: 0;
 -o-transform: translateX(3000px);
}
}
 @keyframes 
flyOutRight {
 0% {
 transform: translateX(0);
}
 100% {
 opacity: 0;
 transform: translateX(3000px);
}
}
 @-webkit-keyframes 
flyInLeft {
 0% {
 opacity: 0;
 -webkit-transform: translateX(-3000px);
}
 100% {
 -webkit-transform: translateX(0);
}
}
 @-moz-keyframes 
flyInLeft {
 0% {
 opacity: 0;
 -moz-transform: translateX(-3000px);
}
 100% {
 -moz-transform: translateX(0);
}
}
 @-o-keyframes 
flyInLeft {
 0% {
 opacity: 0;
 -o-transform: translateX(-3000px);
}
 100% {
 -o-transform: translateX(0);
}
}
 @keyframes 
flyInLeft {
 0% {
 opacity: 0;
 transform: translateX(-3000px);
}
 100% {
 transform: translateX(0);
}
}
@-webkit-keyframes 
flyOutLeft {
 0% {
 -webkit-transform: translateX(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateX(-3000px);
}
}
 @-moz-keyframes 
flyOutLeft {
 0% {
 -moz-transform: translateX(0);
}
 100% {
 opacity: 0;
 -moz-transform: translateX(-3000px);
}
}
 @-o-keyframes 
flyOutLeft {
 0% {
 -o-transform: translateX(0);
}
 100% {
 opacity: 0;
 -o-transform: translateX(-3000px);
}
}
 @keyframes 
flyOutLeft {
 0% {
 transform: translateX(0);
}
 100% {
 opacity: 0;
 transform: translateX(-3000px);
}
}
 @-webkit-keyframes 
flyInUp {
 0% {
 opacity: 0;
 -webkit-transform: translateY(-2000px);
}
 100% {
 -webkit-transform: translateY(0);
}
}
 @-moz-keyframes 
flyInUp {
 0% {
 opacity: 0;
 -moz-transform: translateY(-2000px);
}
 100% {
 -moz-transform: translateY(0);
}
}
 @-o-keyframes 
flyInUp {
 0% {
 opacity: 0;
 -o-transform: translateY(-2000px);
}
 100% {
 -o-transform: translateY(0);
}
}
 @keyframes 
flyInUp {
 0% {
 opacity: 0;
 transform: translateY(-2000px);
}
 100% {
 transform: translateY(0);
}
}
 @-webkit-keyframes 
flyOutUp {
 0% {
 -webkit-transform: translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateY(-2000px);
}
}
 @-moz-keyframes 
flyOutUp {
 0% {
 -moz-transform: translateY(0);
}
 100% {
 opacity: 0;
 -moz-transform: translateY(-2000px);
}
}
 @-o-keyframes 
flyOutUp {
 0% {
 -o-transform: translateY(0);
}
 100% {
 opacity: 0;
 -o-transform: translateY(-2000px);
}
}
 @keyframes 
flyOutUp {
 0% {
 transform: translateY(0);
}
 100% {
 opacity: 0;
 transform: translateY(-2000px);
}
}
 @-webkit-keyframes 
flyInDown {
 0% {
 opacity: 0;
 -webkit-transform: translateY(2000px);
}
 100% {
 -webkit-transform: translateY(0);
}
}
 @-moz-keyframes 
flyInDown {
 0% {
 opacity: 0;
 -moz-transform: translateY(2000px);
}
 100% {
 -moz-transform: translateY(0);
}
}
 @-o-keyframes 
flyInDown {
 0% {
 opacity: 0;
 -o-transform: translateY(2000px);
}
 100% {
 -o-transform: translateY(0);
}
}
 @keyframes 
flyInDown {
 0% {
 opacity: 0;
 transform: translateY(2000px);
}
 100% {
 transform: translateY(0);
}
}
 @-webkit-keyframes 
flyOutDown {
 0% {
 -webkit-transform: translateY(0);
}
 100% {
 opacity: 0;
 -webkit-transform: translateY(2000px);
}
}
 @-moz-keyframes 
flyOutDown {
 0% {
 -moz-transform: translateY(0);
}
 100% {
 opacity: 0;
 -moz-transform: translateY(2000px);
}
}
 @-o-keyframes 
flyOutDown {
 0% {
 -o-transform: translateY(0);
}
 100% {
 opacity: 0;
 -o-transform: translateY(2000px);
}
}
 @keyframes 
flyOutDown {
 0% {
 transform: translateY(0);
}
 100% {
 opacity: 0;
 transform: translateY(2000px);
}
}
