@import url(//fonts.googleapis.com/css?family=Open+Sans:400,600,700,300);
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
    display:block
}
body{
    line-height:1
}
ol,ul{
    list-style:none
}
blockquote,q{
    quotes:none
}
blockquote:after,blockquote:before,q:after,q:before{
    content:'';
    content:none
}
table{
    border-collapse:collapse;
    border-spacing:0
}
*{
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box
}
:focus{
    outline:none
}
.clearfix{
    clear:both;
    display:block
}
a{
    text-decoration:none;
    color:inherit
}
::-webkit-input-placeholder{
    color:inherit
}
:-moz-placeholder,::-moz-placeholder{
    color:inherit
}
:-ms-input-placeholder,::-ms-input-placeholder{
    color:inherit
}
:placeholder-shown{
    color:inherit
}
@font-face{
    font-family:Galano;
    src:url(../fonts/329FF9_0_0.eot);
    src:url(../fonts/329FF9_0_0.eot?#iefix) format("embedded-opentype"),url(../fonts/329FF9_0_0.woff2) format("woff2"),url(../fonts/329FF9_0_0.woff) format("woff"),url(../fonts/329FF9_0_0.ttf) format("truetype")
}
.bx-wrapper{
    position:relative;
    padding:0;
    *zoom:1
}
.bx-wrapper img,
.bx-wrapper video{
    max-width:100%;
    display:block
}
.bx-wrapper .bx-viewport{
    -webkit-transform:translatez(0);
    transform:translatez(0)
}
.bx-wrapper .bx-controls-auto,.bx-wrapper .bx-pager{
    position:absolute;
    bottom:-30px;
    width:100%
}
.bx-wrapper .bx-loading{
    min-height:50px;
    background:url(../images/spinner-2x.gif) 50% no-repeat #fff;
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    z-index:5
}
.bx-wrapper .bx-pager{
    text-align:center;
    font-size:.85em;
    font-family:Arial;
    font-weight:700;
    color:#666;
    padding-top:20px
}
.bx-wrapper .bx-controls-auto .bx-controls-auto-item,.bx-wrapper .bx-pager .bx-pager-item{
    display:inline-block;
    *zoom:1;
    *display:inline
}
.bx-wrapper .bx-pager.bx-default-pager a{
    background:#666;
    text-indent:-9999px;
    display:block;
    width:10px;
    height:10px;
    margin:0 5px;
    outline:0;
    border-radius:5px
}
.bx-wrapper .bx-pager.bx-default-pager a.active,.bx-wrapper .bx-pager.bx-default-pager a:hover{
    background:#000;
}
.bx-wrapper .bx-prev{
    left:10px
}
.bx-wrapper .bx-next{
    right:10px
}
.bx-wrapper .bx-prev:hover{
    background-position:0 0
}
.bx-wrapper .bx-next:hover{
    background-position:-43px 0
}
.bx-wrapper .bx-controls-direction a{
    position:absolute;
    top:50%;
    margin-top:-16px;
    outline:0;
    width:32px;
    height:32px;
    text-indent:-9999px;
    z-index:6
}
.bx-wrapper .bx-controls-direction a.disabled{
    display:none
}
.bx-wrapper .bx-controls-auto{
    text-align:center
}
.bx-wrapper .bx-controls-auto .bx-start{
    display:block;
    text-indent:-9999px;
    width:10px;
    height:11px;
    outline:0;
    margin:0 3px
}
.bx-wrapper .bx-controls-auto .bx-start.active,.bx-wrapper .bx-controls-auto .bx-start:hover{
    background-position:-86px 0
}
.bx-wrapper .bx-controls-auto .bx-stop{
    display:block;
    text-indent:-9999px;
    width:9px;
    height:11px;
    outline:0;
    margin:0 3px
}
.bx-wrapper .bx-controls-auto .bx-stop.active,.bx-wrapper .bx-controls-auto .bx-stop:hover{
    background-position:-86px -33px
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager{
    text-align:left;
    width:80%
}
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto{
    right:0;
    width:35px
}
.bx-wrapper .bx-caption{
    position:absolute;
    bottom:0;
    left:0;
    background:#666\9;
    background:rgba(80,80,80,.75);
    width:100%
}
.bx-wrapper .bx-caption span{
    color:#fff;
    font-family:Arial;
    display:block;
    font-size:.85em;
    padding:10px
}
.sweet-overlay{
    background-color:rgba(0,0,0,.4);
    position:fixed;
    left:0;
    right:0;
    top:0;
    bottom:0;
    display:none;
    z-index:4
}
.sweet-alert{
    background-color:#fff;
    font-family:Open Sans,sans-serif;
    width:478px;
    padding:17px;
    border-radius:5px;
    text-align:center;
    position:fixed;
    left:50%;
    top:50%;
    margin-left:-256px;
    margin-top:-200px;
    overflow:hidden;
    display:none;
    z-index:5
}
@media all and (max-width:540px){
    .sweet-alert{
        width:auto;
        margin-left:0;
        margin-right:0;
        left:15px;
        right:15px
    }
}
.sweet-alert h2{
    color:#575757;
    font-size:30px;
    font-weight:600;
    text-transform:none;
    margin:25px 0;
    line-height:25px;
    display:block
}
.sweet-alert h2,.sweet-alert p{
    text-align:center;
    position:relative;
    padding:0
}
.sweet-alert p{
    color:#797979;
    font-size:16px;
    font-weight:300;
    margin:0;
    line-height:normal
}
.sweet-alert button{
    background-color:#aedef4;
    color:#fff;
    border:none;
    box-shadow:none;
    font-size:17px;
    font-weight:500;
    border-radius:5px;
    padding:10px 32px;
    margin:26px 5px 0;
    cursor:pointer
}
.sweet-alert button:focus{
    outline:none;
    box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)
}
.sweet-alert button:hover{
    background-color:#a1d9f2
}
.sweet-alert button:active{
    background-color:#81ccee
}
.sweet-alert button.cancel{
    background-color:#d0d0d0
}
.sweet-alert button.cancel:hover{
    background-color:#c8c8c8
}
.sweet-alert button.cancel:active{
    background-color:#b6b6b6
}
.sweet-alert button.cancel:focus{
    box-shadow:0 0 2px rgba(197,205,211,.8),inset 0 0 0 1px rgba(0,0,0,.0470588)!important
}
.sweet-alert button::-moz-focus-inner{
    border:0
}
.sweet-alert[data-has-cancel-button=false] button{
    box-shadow:none!important
}
.sweet-alert .icon{
    width:80px;
    height:80px;
    border:4px solid gray;
    border-radius:50%;
    margin:20px auto;
    padding:0;
    position:relative;
    box-sizing:content-box
}
.sweet-alert .icon.error{
    border-color:#f27474
}
.sweet-alert .icon.error .x-mark{
    position:relative;
    display:block
}
.sweet-alert .icon.error .line{
    position:absolute;
    height:5px;
    width:47px;
    background-color:#f27474;
    display:block;
    top:37px;
    border-radius:2px
}
.sweet-alert .icon.error .line.left{
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg);
    left:17px
}
.sweet-alert .icon.error .line.right{
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    right:16px
}
.sweet-alert .icon.warning{
    border-color:#f8bb86
}
.sweet-alert .icon.warning .body{
    position:absolute;
    width:5px;
    height:47px;
    left:50%;
    top:10px;
    border-radius:2px;
    margin-left:-2px;
    background-color:#f8bb86
}
.sweet-alert .icon.warning .dot{
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    margin-left:-3px;
    left:50%;
    bottom:10px;
    background-color:#f8bb86
}
.sweet-alert .icon.info{
    border-color:#c9dae1
}
.sweet-alert .icon.info:before{
    content:"";
    position:absolute;
    width:5px;
    height:29px;
    left:50%;
    bottom:17px;
    border-radius:2px;
    margin-left:-2px;
    background-color:#c9dae1
}
.sweet-alert .icon.info:after{
    content:"";
    position:absolute;
    width:7px;
    height:7px;
    border-radius:50%;
    margin-left:-3px;
    top:19px;
    background-color:#c9dae1
}
.sweet-alert .icon.success{
    border-color:#a5dc86
}
.sweet-alert .icon.success:after,.sweet-alert .icon.success:before{
    content:'';
    border-radius:50%;
    position:absolute;
    width:60px;
    height:120px;
    background:#fff;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
}
.sweet-alert .icon.success:before{
    border-radius:120px 0 0 120px;
    top:-7px;
    left:-33px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    -webkit-transform-origin:60px 60px;
    transform-origin:60px 60px
}
.sweet-alert .icon.success:after{
    border-radius:0 120px 120px 0;
    top:-11px;
    left:30px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg);
    -webkit-transform-origin:0 60px;
    transform-origin:0 60px
}
.sweet-alert .icon.success .placeholder{
    width:80px;
    height:80px;
    border:4px solid hsla(98,55%,69%,.2);
    border-radius:50%;
    box-sizing:content-box;
    position:absolute;
    left:-4px;
    top:-4px;
    z-index:2
}
.sweet-alert .icon.success .fix{
    width:5px;
    height:90px;
    background-color:#fff;
    position:absolute;
    left:28px;
    top:8px;
    z-index:1;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
}
.sweet-alert .icon.success .line{
    height:5px;
    background-color:#a5dc86;
    display:block;
    border-radius:2px;
    position:absolute;
    z-index:2
}
.sweet-alert .icon.success .line.tip{
    width:25px;
    left:14px;
    top:46px;
    -webkit-transform:rotate(45deg);
    transform:rotate(45deg)
}
.sweet-alert .icon.success .line.long{
    width:47px;
    right:8px;
    top:38px;
    -webkit-transform:rotate(-45deg);
    transform:rotate(-45deg)
}
.sweet-alert .icon.custom{
    background-size:contain;
    border-radius:0;
    border:none;
    background-position:50%;
    background-repeat:no-repeat
}
@-webkit-keyframes a{
    0%{
        transform:scale(.7);
        -webkit-transform:scale(.7)
    }
    45%{
        transform:scale(1.05);
        -webkit-transform:scale(1.05)
    }
    80%{
        transform:scale(.95);
        -webkit-tranform:scale(.95)
    }
    to{
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}
@keyframes a{
    0%{
        transform:scale(.7);
        -webkit-transform:scale(.7)
    }
    45%{
        transform:scale(1.05);
        -webkit-transform:scale(1.05)
    }
    80%{
        transform:scale(.95);
        -webkit-tranform:scale(.95)
    }
    to{
        transform:scale(1);
        -webkit-transform:scale(1)
    }
}
@-webkit-keyframes b{
    0%{
        transform:scale(1);
        -webkit-transform:scale(1)
    }
    to{
        transform:scale(.5);
        -webkit-transform:scale(.5)
    }
}
@keyframes b{
    0%{
        transform:scale(1);
        -webkit-transform:scale(1)
    }
    to{
        transform:scale(.5);
        -webkit-transform:scale(.5)
    }
}
.showSweetAlert{
    -webkit-animation:a .3s;
    animation:a .3s
}
.hideSweetAlert{
    -webkit-animation:b .2s;
    animation:b .2s
}
@-webkit-keyframes c{
    0%{
        width:0;
        left:1px;
        top:19px
    }
    54%{
        width:0;
        left:1px;
        top:19px
    }
    70%{
        width:50px;
        left:-8px;
        top:37px
    }
    84%{
        width:17px;
        left:21px;
        top:48px
    }
    to{
        width:25px;
        left:14px;
        top:45px
    }
}
@keyframes c{
    0%{
        width:0;
        left:1px;
        top:19px
    }
    54%{
        width:0;
        left:1px;
        top:19px
    }
    70%{
        width:50px;
        left:-8px;
        top:37px
    }
    84%{
        width:17px;
        left:21px;
        top:48px
    }
    to{
        width:25px;
        left:14px;
        top:45px
    }
}
@-webkit-keyframes d{
    0%{
        width:0;
        right:46px;
        top:54px
    }
    65%{
        width:0;
        right:46px;
        top:54px
    }
    84%{
        width:55px;
        right:0;
        top:35px
    }
    to{
        width:47px;
        right:8px;
        top:38px
    }
}
@keyframes d{
    0%{
        width:0;
        right:46px;
        top:54px
    }
    65%{
        width:0;
        right:46px;
        top:54px
    }
    84%{
        width:55px;
        right:0;
        top:35px
    }
    to{
        width:47px;
        right:8px;
        top:38px
    }
}
@-webkit-keyframes e{
    0%{
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    5%{
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    12%{
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
    to{
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
}
@keyframes e{
    0%{
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    5%{
        transform:rotate(-45deg);
        -webkit-transform:rotate(-45deg)
    }
    12%{
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
    to{
        transform:rotate(-405deg);
        -webkit-transform:rotate(-405deg)
    }
}
.animateSuccessTip{
    -webkit-animation:c .75s;
    animation:c .75s
}
.animateSuccessLong{
    -webkit-animation:d .75s;
    animation:d .75s
}
.icon.success.animate:after{
    -webkit-animation:e 4.25s ease-in;
    animation:e 4.25s ease-in
}
@-webkit-keyframes f{
    0%{
        transform:rotateX(100deg);
        -webkit-transform:rotateX(100deg);
        opacity:0
    }
    to{
        transform:rotateX(0deg);
        -webkit-transform:rotateX(0deg);
        opacity:1
    }
}
@keyframes f{
    0%{
        transform:rotateX(100deg);
        -webkit-transform:rotateX(100deg);
        opacity:0
    }
    to{
        transform:rotateX(0deg);
        -webkit-transform:rotateX(0deg);
        opacity:1
    }
}
.animateErrorIcon{
    -webkit-animation:f .5s;
    animation:f .5s
}
@-webkit-keyframes g{
    0%{
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    50%{
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    80%{
        transform:scale(1.15);
        -webkit-transform:scale(1.15);
        margin-top:-6px
    }
    to{
        transform:scale(1);
        -webkit-transform:scale(1);
        margin-top:0;
        opacity:1
    }
}
@keyframes g{
    0%{
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    50%{
        transform:scale(.4);
        -webkit-transform:scale(.4);
        margin-top:26px;
        opacity:0
    }
    80%{
        transform:scale(1.15);
        -webkit-transform:scale(1.15);
        margin-top:-6px
    }
    to{
        transform:scale(1);
        -webkit-transform:scale(1);
        margin-top:0;
        opacity:1
    }
}
.animateXMark{
    -webkit-animation:g .5s;
    animation:g .5s
}
@-webkit-keyframes h{
    0%{
        border-color:#f8d486
    }
    to{
        border-color:#f8bb86
    }
}
@keyframes h{
    0%{
        border-color:#f8d486
    }
    to{
        border-color:#f8bb86
    }
}
.pulseWarning{
    -webkit-animation:h .75s infinite alternate;
    animation:h .75s infinite alternate
}
@-webkit-keyframes i{
    0%{
        background-color:#f8d486
    }
    to{
        background-color:#f8bb86
    }
}
@keyframes i{
    0%{
        background-color:#f8d486
    }
    to{
        background-color:#f8bb86
    }
}
.pulseWarningIns{
    -webkit-animation:i .75s infinite alternate;
    animation:i .75s infinite alternate
}
body{
    background:url(../images/background.jpg?v=2.0) 0 0 ;
    /* background-size:cover; */
    background-position: center;
    font-size:16px;
    color:#4f4f4f;
    font-family:Galano,sans-serif;
    padding-bottom:100px
}
body:after{
    content:"";
    clear:both
}
#siteWrapper,body:after{
    display:block;
    position:relative
}
#siteWrapper{
    width:100%;
    max-width:1436px;
    margin:120px auto
}
aside{
    display:block;
    position:relative;
    float:left;
    width:17%;
    max-width:250px;
    min-height:620px
}
@media screen and (max-width:1380px){
    aside{
        position:absolute;
        min-height:1px;
        height:308px;
        top:0;
        width:250px;
        left:10px
    }
}
@media screen and (max-width:1380px){
    #navigation{
        position:relative;
        height:900px
    }
}
#player{
    position:relative;
    text-align:center;
    float:right
}
@media screen and (max-width:1380px){
    #player{
        position:absolute;
        float:left;
        top:309px;
        left:10px
    }
}
*>img{
    max-width:100%;
    position:relative
}
#ekolanLogo{
    display:block;
    position:relative;
    width:100%;
    text-align:center;
    margin-bottom:37px
}
#slideInfo{
    /* border:solid #fff; */
    /* border-width:1px 0; */
    width:100%
}
#slideInfo:before,
#slideInfo:after{
    content: '';
    display: block;
    width: 100%;
    height: 2px;
    background-image: url(../images/linia.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}
#buttons{
    position:absolute;
    bottom:-50px;
    left:0;
    display:block;
    text-align:center;
    width:500px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}
@media screen and (max-width:1380px){
    #buttons{
        margin-top:20px
    }
}
#buttons #sent_btn,#buttons .btn{
    position:absolute;
    display:inline-block;
    max-width:248px;
    width:100%;
    height:37px;
    cursor:pointer;
    background-size:100% auto;
    left:0;
    text-indent:-9999px
}
#buttons #sent_btn i,#buttons .btn i{
    position:relative;
    display:inline-block;
    text-indent:-999px
}
/* #buttons #sent_btn:active,#buttons #sent_btn:hover,#buttons .btn:active,#buttons .btn:hover{
    background-color: #005f3b;
} */
#buttons .next{
    background:url(../images/dalej?v=1) 0 0 no-repeat;
    background-size:100% auto;
    right:0;
    left:auto;
    z-index:2
}
#buttons .back{
    background:url(../images/wstecz.png?v=1) 0 0 no-repeat;
    background-size:100% auto
}
#buttons #sent_btn{
    background:url(../images/wyslij.png) 0 0 no-repeat;
    text-indent:-999px;
    border-width:0;
    left:auto;
    top:0;
    right:0
}
#buttons .back{
    display:none
}
#sendeWrapper{
    z-index:1;
    height:40px;
    position:absolute;
    top:0;
    right:0;
    width:248px
}
#buttons{
    height:40px;
    width:500px
}
#audioPlayer{
    width:100%;
    border-bottom:1px solid #fff;
    padding-bottom:90px;
    margin-bottom:50px
}
#audioControl,#audioPlayer{
    position:relative;
    display:inline-block;
    height:37px
}
#audioControl{
    width:55px;
    margin-left:10px;
    background:url(../images/speaker.png) 0 -39px no-repeat;
    background-size:55px auto;
    cursor:pointer
}
#audioControl.mute{
    background-position:0 0
}
#songWrapper{
    position:absolute;
    bottom:0;
    left:0;
    width:100%
}
.bxslider li{
    background:#fff
}
#slide-3-txt1{
    position:absolute;
    top:13.1%;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    opacity:.5
}
#email{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%
}
#reEmail_wrapper,#reName_wrapper{
    position:absolute;
    display:block;
    height:58px;
    text-align:center;
    width:100%;
    max-width:684px;
    top:43%;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}
#reEmail_wrapper:before,#reName_wrapper:before{
    content:"";
    display:block;
    width:119px;
    height:38px;
    display:inline-block;
    margin-top:-30px;
    background:url(../images/kroki/krok3_txt2.png) top no-repeat
}
@media screen and (max-width:1160px){
    #reEmail_wrapper,#reName_wrapper{
        padding:0 10px
    }
}
#reEmail_wrapper{
    top:65%
}
#reEmail_wrapper:before{
    background:url(../images/kroki/krok3_txt3.jpg) top no-repeat
}
#reEmail,#reName{
    height:58px;
    text-align:center;
    max-width:684px;
    border-width:0;
    background:#f0f0f0
}
#content,#reEmail,#reName{
    position:relative;
    width:100%
}
#content{
    display:block;
    float:left;
    max-width:863px;
    margin:0 36px
}
@media screen and (max-width:1436px){
    #content{
        margin:0 10px
    }
}
@media screen and (max-width:1380px){
    #content{
        position:absolute;
        float:left;
        left:270px;
        top:0;
        width:calc(100% - 290px)
    }
}
@media screen and (max-width:1160px){
    #content .bxslider li{
        width:100%;
        min-height:800px
    }

}
#sliderStepWrapper{
    margin-top:13px
}
#sliderStep{
    text-align:center
}
#sliderStep img{
    display:inline-block
}
#slide1-txt{
    position:absolute;
    top:37%;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    width:100%;
    max-width:533px;
    height:auto;
    opacity:1
}
#kartka{
    position: absolute;
    bottom: 40.5%;
    right: 0;
    margin: auto;
    text-align: center;
    left: 0;
}
#kartka input[type=text]{
    text-align: center;
    width: 260px;
    height: 36px;
    border-width: 0;
    letter-spacing: 1px;
    background: transparent;
    color: #fff;
    font-size: 18px;
    padding: 2px;
    font-weight: 100;
    border-bottom: 2px solid #fff;
}

 @media screen and (max-width: 850px){
    #kartka input[type=text]{
        font-size: 14px; 
        width: 183px;
        height: 34px;
 }
}
@media screen and (max-width: 674px){
    #kartka{
        /* left: 16%;  */
    }
    #kartka input[type=text]{
        font-size: 12px;
        width: 154px;
        height: 27px;
    }
}
@media screen and (max-width: 576px){
    #kartka input[type=text]{
        font-size: 10px;
        width: 134px;
        height: 19px;
   }
}
@media screen and (max-width: 472px){
    #kartka input[type=text]{
        font-size: 8px;
        width: 109px;
        height: 17px;
   }
}
@media screen and (max-width: 400px){
    #kartka{
        /* left: 15%;  */
    }
    #kartka input[type=text]{
        font-size: 7px;
        width: 101px;
        height: 17px;
    }
   
} 
@media screen and (max-width: 320px){
    #kartka{
        /* left: 14%;  */
    }
    #kartka input[type=text]{
        font-size: 6px;
        width: 92px;
        height: 16px;
    }
   
} 

#import-list{
    visibility:hidden;
    height:0
}
#addresses{
    display:block;
    position:absolute;
    top:80px;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%);
    max-width:686px;
    width:100%;
    height:264px;
    resize:none;
    padding-top:15%;
    white-space:normal;
    text-align:justify;
    -moz-text-align-last:center;
    text-align-last:center;
    text-transform:uppercase;
    background:#f0f0f0;
    border-width:0
}
@media screen and (max-width: 745px){
    #addresses{
        height: 211px;
        padding-top: 13%;
        
   }
}
@media screen and (max-width: 688px){
    #addresses{
        height: 137px;
        padding-top: 9%;
        
   }
}
@media screen and (max-width: 555px){
    #addresses{
        height: 75px;
        padding-top: 26px;
        
   }
}

@media screen and (max-width: 460px){
    #addresses{
        top: 50px;
        height: 75px;
        padding-top: 26px;
        
   }
   #krok3slajd_txt {
       height: 110px;
   }
}
@media screen and (max-width: 400px){
    #addresses{
        top: 39px;
        height: 64px;
        padding-top: 26px;
        
   }
   #krok3slajd_txt {
       height: 85px;
   }
}
#manualy label,#preview,#slide-3 .text,#slide-3 .text1{
    display:none
}
#slide-3{
    min-height: 514px;
    position:absolute;
    display:block;
    top:0;
    left:0;
    width:100%;
    height:100%
}

#krok1slajd_txt{
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    position:absolute;
    max-width: 100%;
}

@media screen and (max-width: 600px){
    #slide-3-txt1{
        height: 60px;
    }
    #slide-3{
        top: -51px;
    }
}
@media screen and (max-width: 505px){
    #slide-3-txt1{
        height: 60px;
    }
    #slide-3{
        min-height: 375px;
        top: -8px;
    }
    #reEmail, #reName {
        height: 40px;
        font-size: 10px;
    }
    #reEmail_wrapper:before, #reName_wrapper:before {
        height: 25px;
    }
}

@media screen and (max-width: 414px){
    #slide-3-txt1{
        height: 60px;
    }
    #slide-3{
        top: -36px;
    }
}

#krok3slajd_txt{
    bottom:30%;
    opacity:.5;
    position:absolute;
    bottom:20%;
    left:50%;
    -webkit-transform:translateX(-50%);
    transform:translateX(-50%)
}

#podglad{
    position:relative
}
#podglad .podglad_imie{
    position: absolute;
    bottom: 43.5%;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
    font-family: arial;
}

/* @media screen and (max-width: 846px){
    #podglad .podglad_imie{
        bottom:12%;
        left:21%;
        
    }
} */
@media screen and (max-width: 670px){
    #podglad .podglad_imie{
       font-size: 13px;
       
   }
}
/* @media screen and (max-width: 670px){
    #podglad .podglad_imie{
        left:18%;
       
   }
} */
@media screen and (max-width: 400px){
    #podglad .podglad_imie{
        margin-top: 2px;
        font-size: 8px;
       
   }
}
#podglad{
   margin: 0 auto;
   vertical-align: top;
   max-width: 100%;
}
footer{
    position:fixed;
    bottom:0;
    left:0;
    background:#050505;
    display:block;
    width:100%;
    padding:0 0 0 80px
}
footer span {
     display: block;
     padding: 0.85rem 0.5rem;
     line-height: 1;
     font-family: sans-serif;
     letter-spacing: 2px;
     font-size: 12px;
     color: #f7f8fab5;
}
@media screen and (max-width: 1160px){
    #content .bxslider li {
         min-height: unset;
    }
}

@media screen and (max-width: 1024px){
    #sliderStepWrapper{
        display: none;
    }
    #ekolanLogo img{
            max-width: unset;
            width: 82px;
            top: 50%;

            opacity: 0 !important;
    }
    #navigation{
            left: 50%;
    transform: translateX(-50%);
            height: 131px;
            display: flex;
            flex-direction: row;
            width: 500px;
            max-width: unset;
    }
    #content {
            margin: 0 auto;
        position: relative;
         float: unset; 
        left: 0;
        top: 30px;
        width: 100%;
    }
    #content .bxslider li {
            min-height: unset;
    }
}

@media screen and (max-width: 767px){

    #siteWrapper{
        margin-top: 15px;
        margin-bottom: 80px;
    }
    footer {
        padding: 0 10px;
    }

    #navigation {
        width: 100%;
        height: auto;
    }
    #buttons{
        width: 100%;
    }
    #buttons > #sendeWrapper, 
    #buttons > .btn {
        max-width: 50%;
    }
    #buttons #sent_btn, 
    #buttons .btn {
        width: 180px;
        height: 26px;
        background-size: 100% auto;
    }
    /* #ekolanLogo {
        margin-bottom: 0;
    } */
    /* #navigation {
        left: calc(50% - -74px);
    } */
    /* #kartka{

        bottom: 4%;
    } */

}

#main {
    position: relative;
}
#main:after,
#podglad:after {
    content: '';
    position: absolute;
    right: 0;
    width: 10px;
    height: 100%;
    top: 0;
    background: white;
}
#podglad .link{
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 55%;
    margin: auto;
    z-index: 2;
}