/* -------------------------------------------------------------------------------- */
/* section contact */
/* -------------------------------------------------------------------------------- */
.section-contact {
    background:#000 url(../images/section-contact.jpg) center 0 no-repeat;
    width:100%;
    min-height: 704px;
    text-align: right;
    position: relative;
}
.section-contact > .page-center {
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    max-width:720px;
    position:relative;
    padding-right:20px;
    height:100%;
}
.section-contact .text {
    margin:10px 0 20px 0;
}
.section-contact .adress-box {
    display: inline-block;
    max-width:255px;
    text-align: left;
}
.section-contact .title {
    background: url(../images/okropnie-dobry-kontakt.png) no-repeat;
    width: 262px;
    height: 134px;
    margin-bottom:10px;
    display: inline-block;
    margin-top:130px;
}
@media only screen and ( max-width: 650px) {
    .section-contact .title {
        margin-top:50px
    }
}
.section-contact .adress {
    background: url(../images/icon-adress.png) no-repeat;
    min-height: 20px;
    padding-left:35px;
}
.section-contact .mail {
    background: url(../images/icon-mail.png) 6px 0 no-repeat;
    min-height: 16px;
    padding-left:35px;
    margin-top:10px;
    margin-bottom:7px;
    display: inline-block;
}
.section-contact .mail a {
    color:#fff;
    margin-bottom:7px;
    display: inline-block;
}
.section-contact .tel {
    background: url(../images/icon-tel.png) 5px 0 no-repeat;
    min-height: 16px;
    padding-left:35px;
}
.section-contact .light {
    position: absolute;
    top:412px;
    left:50%;
    margin-left:-119px;
    width: 0;
    height: 0;
    z-index:1;
    background: rgba(255,255,255,0.4);
    border-radius:50%;
    box-shadow:0 0 80px 40px rgba(255,255,255,0.3);
    display: block;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -moz-animation: aboutSwieczkaLight 1s linear 0s infinite alternate;
    -webkit-animation: aboutSwieczkaLight 1s linear 0s infinite alternate;
    -o-animation: aboutSwieczkaLight 1s linear 0s infinite alternate;
    animation: aboutSwieczkaLight 1s linear 0s infinite alternate;
}
.section-contact .light:after {
    top:0;
    left:0;
    width:0;
    height:0;
    box-shadow:0 0 40px 25px rgba(255,255,255,0.2);
    content:'';
    display:block;
}
.section-contact .light {
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -moz-animation: swieczkaContact 1s linear 0s infinite alternate;
    -webkit-animation: swieczkaContact 1s linear 0s infinite alternate;
    -o-animation: swieczkaContact 1s linear 0s infinite alternate;
    animation: swieczkaContact 1s linear 0s infinite alternate;
}

@-webkit-keyframes swieczkaContact {
    0%   { opacity: 1; }
    25%  { opacity: 0.8; }
    50%  { opacity: 1; }
    60%  { opacity: 0.8; }
    70%  { opacity: 1; }
    100%  { opacity: 0.8; }
}
@-moz-keyframes swieczkaContact {
    0%   { opacity: 1; }
    25%  { opacity: 0.8; }
    50%  { opacity: 1; }
    60%  { opacity: 0.8; }
    70%  { opacity: 1; }
    100%  { opacity: 0.8; }
}
@-o-keyframes swieczkaContact {
    0%   { opacity: 1; }
    25%  { opacity: 0.8; }
    50%  { opacity: 1; }
    60%  { opacity: 0.8; }
    70%  { opacity: 1; }
    100%  { opacity: 0.8; }
}
@keyframes swieczkaContact {
    0%   { opacity: 1; }
    25%  { opacity: 0.8; }
    50%  { opacity: 1; }
    60%  { opacity: 0.8; }
    70%  { opacity: 1; }
    100%  { opacity: 0.8; }
}
/* eyes */
.section-contact .eyes-in-hole {
    width:6px;
    height:6px;
    position:absolute;
    border-radius:50%;
    background:#470000;
    box-shadow:0 0 5px 2px rgba(71,0,0,0.8);
    top:535px;
    left:50%;
    margin-left:-416px;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: contactEyesInHole 1s linear 0s infinite alternate;
    -moz-animation: contactEyesInHole 1s linear 0s infinite alternate;
    -o-animation: contactEyesInHole 1s linear 0s infinite alternate;
    animation: contactEyesInHole 1s linear 0s infinite alternate;
}
.eyes-in-hole:after {
    width:5px;
    height:5px;
    position:absolute;
    border-radius:50%;
    background:#470000;
    box-shadow:0 0 5px 2px rgba(71,0,0,0.8);
    top:-2px;
    left:10px;
    content:'';
}
@-webkit-keyframes contactEyesInHole {
    0%   { opacity:1; }
    100% { opacity:0.5; }
}
@-moz-keyframes contactEyesInHole {
    0%   { opacity:1; }
    100% { opacity:0.5; }
}
@-o-keyframes contactEyesInHole {
    0%   { opacity:1; }
    100% { opacity:0.5; }
}
@keyframes contactEyesInHole {
    0%   { opacity:1; }
    100% { opacity:0.5; }
}

/* rejestr data */
.rejestr-data {
    margin:20px 0;
    text-decoration:underline;
    color:#fff;
    text-shadow:1px 1px 0 #000,1px 1px 0 #000;
    display:inline-block;
    padding:4px 0;
    font-size:13px;
    -moz-transition: 0.5s;
    -webkit-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
}

.rejestr-data-cnt {
    display:none;
    max-width:300px;
    margin-bottom:20px;
}

/* kruk w oknie */
.kruk-w-oknie {
    background:url(../images/contact-bird.png) 0 -4px no-repeat;
    width:61px;
    height:71px;
    position:absolute;
    top:364px;
    left:50%;
    margin-left:-444px;
    opacity:0;
}
.kruk-w-oknie .eye {
    width:11px;
    height:8px;
    background:url(../images/contact-bird.png) -64px 0 no-repeat;
    position:absolute;
    left:35px;
    top:10px;
}
.kruk-w-oknie.animate {
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: krukWOknie 15s;
    -moz-animation: krukWOknie 15s;
    -o-animation: krukWOknie 15s;
    animation: krukWOknie 15s;
}

@-webkit-keyframes krukWOknie {
    0%   { opacity:0; }
    10%   { opacity:0.5; }
    90% { opacity:0.5; }
    100% { opacity:0; }
}
@-moz-keyframes krukWOknie {
    0%   { opacity:0; }
    10%   { opacity:0.5; }
    90% { opacity:0.5; }
    100% { opacity:0; }
}
@-o-keyframes krukWOknie {
    0%   { opacity:0; }
    10%   { opacity:0.5; }
    90% { opacity:0.5; }
    100% { opacity:0; }
}
@keyframes krukWOknie {
    0%   { opacity:0; }
    10%   { opacity:0.5; }
    90% { opacity:0.5; }
    100% { opacity:0; }
}

/* man on line */
.man-on-line {
    position:absolute;
    top:545px;
    left:50%;
    margin-left:-110px;
}
.man-on-line .line {
    border-right:1px solid rgba(200,200,200,0.2);
    height:20px;
    position:absolute;
    top:0;
    bottom:0;
    left:3px;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: contactManLine 3s linear 0s infinite alternate;
    -moz-animation: contactManLine 3s linear 0s infinite alternate;
    -o-animation: contactManLine 3s linear 0s infinite alternate;
    animation: contactManLine 3s linear 0s infinite alternate;
}
@-webkit-keyframes contactManLine {
    0%   { height:20px; }
    30%   { height:90px; }
    100%   { height:90px; }
}
@-moz-keyframes contactManLine {
    0%   { height:20px; }
    30%   { height:90px; }
    100%   { height:90px; }
}
@-o-keyframes contactManLine {
    0%   { height:20px; }
    30%   { height:90px; }
    100%   { height:90px; }
}
@keyframes contactManLine {
    0%   { height:20px; }
    30%   { height:90px; }
    100%   { height:90px; }
}
.man-on-line .man {
    background:url(../images/contact-man1.png);
    width:15px;
    height:20px;
    position:absolute;
    top:0;
    left:0;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: contactManMan 3s linear 0s infinite alternate;
    -moz-animation: contactManMan 3s linear 0s infinite alternate;
    -o-animation: contactManMan 3s linear 0s infinite alternate;
    animation: contactManMan 3s linear 0s infinite alternate;
}
@-webkit-keyframes contactManMan {
    0%   {
        -webkit-transform: translate(0, 0);
    }
    30%   {
        -webkit-transform: translate(0, 70px);
    }
    100%   {
        -webkit-transform: translate(0, 70px);
    }
}
@-moz-keyframes contactManMan {
    0%   {
        -moz-transform: translate(0, 0);
    }
    30%   {
        -moz-transform: translate(0, 70px);
    }
    100%   {
        -moz-transform: translate(0, 70px);
    }
}
@-o-keyframes contactManMan {
    0%   {
        -o-transform: translate(0, 0);
    }
    30%   {
        -o-transform: translate(0, 70px);
    }
    100%   {
        -o-transform: translate(0, 70px);
    }
}
@keyframes contactManMan {
    0%   {
        transform: translate(0, 0);
    }
    30%   {
        transform: translate(0, 70px);
    }
    100%   {
        transform: translate(0, 70px);
    }
}
/* paper man */
.paper-man {
    background:url(../images/paper-man.png) no-repeat;
    width:64px;
    height:44px;
    position:absolute;
    top:400px;
    left:50%;
    margin-left:-110px;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: paperMan .2s steps(3, end) infinite alternate;
    -moz-animation: paperMan .2s steps(3, end) infinite alternate;
    -o-animation: paperMan .2s steps(3, end) infinite alternate;
    animation: paperMan .2s steps(3, end) infinite alternate;
}
@-webkit-keyframes paperMan {
    from  { background-position: 0 0; }
    to   { background-position:-193px 0; }
}
@-moz-keyframes paperMan {
    from  { background-position: 0 0; }
    to   { background-position:-193px 0; }
}
@-o-keyframes paperMan {
    from  { background-position: 0 0; }
    to   { background-position:-193px 0; }
}
@-webkit-keyframes paperMan {
    from  { background-position: 0 0; }
    to   { background-position:-193px 0; }
}
/* ludek on stairs */
.ludek-stairs {
    position:absolute;
    top:648px;
    left:50%;
    margin-left:100px;
    width:15px;
    height:21px;
    background:url(../images/contact-ludek1.png);
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: contactLudekStairs .8s steps(3, end) infinite alternate;
    -moz-animation: contactLudekStairs .8s steps(3, end) infinite alternate;
    -o-animation: contactLudekStairs .8s steps(3, end) infinite alternate;
    animation: contactLudekStairs .8s steps(3, end) infinite alternate;
}
@-webkit-keyframes contactLudekStairs {
    from  { background-position: 0 0; }
    to   { background-position:-45px 0; }
}
@-moz-keyframes contactLudekStairs {
    from  { background-position: 0 0; }
    to   { background-position:-45px 0; }
}
@-o-keyframes contactLudekStairs {
    from  { background-position: 0 0; }
    to   { background-position:-45px 0; }
}
@-webkit-keyframes contactLudekStairs {
    from  { background-position: 0 0; }
    to   { background-position:-45px 0; }
}

.contact-window-light {
    background:url(../images/contact-window-light.png);
    width:461px;
    height:523px;
    position:absolute;
    top:131px;
    left:50%;
    margin-left:-443px;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -webkit-animation: contactWindowLight 0.3s linear 0s infinite alternate;
    -moz-animation: contactWindowLight 0.3s linear 0s infinite alternate;
    -o-animation: contactWindowLight 0.3s linear 0s infinite alternate;
    animation: contactWindowLight 0.3s linear 0s infinite alternate;
}
@-webkit-keyframes contactWindowLight {
    0% { opacity:0.5; }
    100% { opacity:0.3; }
}
@-moz-keyframes contactWindowLight {
    0% { opacity:0.5; }
    100% { opacity:0.3; }
}
@-o-keyframes contactWindowLight {
    0% { opacity:0.5; }
    100% { opacity:0.3; }
}
@keyframes contactWindowLight {
    0% { opacity:0.5; }
    100% { opacity:0.3; }
}

@media only screen and ( max-width:650px) {
    .section-contact .title {
        width:100%;
        background-position:center 0;
    }
    .section-contact > .page-center {
        margin:0;
        padding:0;
    }
    .section-contact .adress-box {
        max-width:90%;
        margin-left:5%;
    }
}
@media only screen and ( max-width: 650px) {
    .section-contact {background-position:-160px top;}
    .section-contact > .page-center {text-align: center;}
    .ludek-stairs {margin-left:330px;}
    .paper-man {marign-left:140px;}
    .main-on-line {margin-left:142px;}
}