.hidden{
    display:none;
}

.popup-window{
    position:fixed;
    top:25%;
    left:30%;
    width:35%;
    height:20%;
    background:#fff;
    -moz-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.6);
    -webkit-box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 15px 5px rgba(0, 0, 0, 0.6);
    border:1px solid #eee;
    padding:1em;
    -webkit-animation:fadeIn .1s;
    -moz-animation:fadeIn .1s;
    -ms-animation:fadeIn .1s;
    -o-animation:fadeIn .1s;
    animation:fadeIn .1s;
}

.popup-close{
    position:absolute;
    top:-.9em;
    right:-.9em;
    padding:.5em .75em;
    background:#032f4a;
    color:#fff;
    cursor:pointer;
    border-radius:50%;
    -webkit-box-shadow: 1px -1px 15px 1px rgba(0, 0, 0, 0.75);
    -moz-box-shadow:    1px -1px 15px 1px rgba(0, 0, 0, 0.75);
    box-shadow:         1px -1px 15px 1px rgba(0, 0, 0, 0.75);
}

.popup-ok,
.popup-cancel{
    position:absolute;
    bottom:1em;
    width:6em;
    height:2em;
    color:#fff;
    text-align:center;
    line-height:2em;
    cursor:pointer;
	background:#032f4a;
}

.popup-ok:hover,
.popup-cancel:hover,
.popup-close:hover{
    background:#375f93;
}

.popup-ok{
    left:25%;
}

.popup-cancel{
    right:25%;
}

#iframe-back,
#iframe-forward{
    top:45%;
    position:absolute;
    font-size:2em;
    height:2em;
    color:#fff;
    text-align:center;
    line-height:2em;
    cursor:pointer;
	background:#032f4a;
    border:none;
    padding:0 .3em;
}
#iframe-back:hover,
#iframe-forward:hover {
    background: #375f93;
}

#iframe-back{
    left:-.75em;
    -webkit-box-shadow: -2px 0px 15px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow:    -2px 0px 15px 0px rgba(0, 0, 0, 0.75);
    box-shadow:         -2px 0px 15px 0px rgba(0, 0, 0, 0.75);
}

#iframe-forward{
    right:-.75em;
    -webkit-box-shadow: 2px 0px 15px 0px rgba(0, 0, 0, 0.75);
    -moz-box-shadow:    2px 0px 15px 0px rgba(0, 0, 0, 0.75);
    box-shadow:         2px 0px 15px 0px rgba(0, 0, 0, 0.75);
}

.popup-ok.center{
    left:40%;
}

.popup-msg{
    position:absolute;
    top:1em;
    width:96%;
    height:50%;
    padding:.25em .25em 1em .25em;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
}

.popup-background{
    background:#000;
    height:100%;
    width:100%;
    position:fixed;
    top:0;
    left:0;
    filter: alpha(opacity=60);
    -moz-opacity: 0.6;
    -khtml-opacity: 0.6;
    opacity:.6;
    -webkit-animation:fadeInSemiTransparent .3s;
    -moz-animation:fadeInSemiTransparent .3s;
    -ms-animation:fadeInSemiTransparent .3s;
    -o-animation:fadeInSemiTransparent .3s;
    animation:fadeInSemiTransparent .3s;
}

@keyframes fadeIn{
    from{
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity:0;
    }
    to{
        filter: alpha(opacity=100);
        -moz-opacity: 1;
        -khtml-opacity: 1;
        opacity:1;
    }
}

@-webkit-keyframes fadeIn{
    from{
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity:0;
    }
    to{
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        -khtml-opacity: 0.6;
        opacity:.6;
    }
}

@keyframes fadeInSemiTransparent{
    from{
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity:0;
    }
    to{
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        -khtml-opacity: 0.6;
        opacity:.6;
    }
}

@-webkit-keyframes fadeInSemiTransparent{
    from{
        filter: alpha(opacity=0);
        -moz-opacity: 0;
        -khtml-opacity: 0;
        opacity:0;
    }
    to{
        filter: alpha(opacity=60);
        -moz-opacity: 0.6;
        -khtml-opacity: 0.6;
        opacity:.6;
    }
}

@media (max-width:1200px){
    .popup-window {
        height:25%;
        width: 40%;
        left:30%;
    }
}

@media (max-width:934px){
    .popup-window {
        width: 60%;
        left:18%;
    }
}

@media (max-width:600px){
    .popup-window{
        height:30%;
        width:75%;
        left:12%;
        top:20%;
        padding:2%;
    }

    .popup-ok{
        left:20%;
    }

    .popup-cancel{
        right:20%;
    }

    .popup-ok.center{
        left:38%;
    }
}

@media (max-width:425px){
    .popup-window {
        height: 35%;
    }
    .popup-ok.center{
        left:33%;
    }
    .popup-ok{
        left:7%;
    }
    .popup-cancel{
        right:7%;
    }
    #iframe-back{
    left:-.5em;
    }

    #iframe-forward{
        right:-.5em;
    }
}

@media (max-width:360px){
    .popup-window {
        height: 50%;
    }
}