.tomsarkgh-modal
{
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;

    overflow: auto;

    box-sizing: border-box;
    width: 100%;
    height: 100%;
    padding: 50px 15px 15px;

    background-color: rgba(0,0,0,.8);
}

.tomsarkgh-modal-opened
{
    overflow: hidden;
}

.tomsarkgh-modal-content
{
    position: relative;
    z-index: 1000;

    overflow: hidden;

    box-sizing: border-box;
    width: 800px;
    min-height: 529px;
    height: 670px;
    margin: auto;
    padding: 35px 15px 20px;

    color: #000;
    border-top: 1px solid #fff;
    border-bottom: 0;
    border-radius: 6px 6px 0 0;
    border-radius: 0;
    background: url('https://www.tomsarkgh.am/images/rainbow5.png') repeat-x top #ececec;
    background-color: #ececec;
}

.tomsarkgh-modal-close
{
    font-size: 20px;
    font-weight: bold;
    line-height: 20px;

    position: absolute;
    top: 8px;
    right: 14px;

    margin-top: 2px;

    text-decoration: none;

    opacity: .2;
    color: #000;
    text-shadow: 0 1px 0 #fff;

    filter: alpha(opacity=20);
}

.tomsarkgh-modal-close:hover,
.tomsarkgh-modal-close:focus
{
    cursor: pointer;
    text-decoration: none;

    opacity: .4;
    color: #000;

    filter: alpha(opacity=40);
}

.tomsarkgh-modal-body
{
    height: 100vh;
}

.tomsarkgh-modal-body iframe
{
    width: 100%;
    height: 100%;

    border: 0;
}

@media (max-width: 820px)
{
    .tomsarkgh-modal-content
    {
        width: 100%;
        height: auto;
    }
}