header{
        position: fixed;
        margin: 0 auto;
        left: 0;
        top: 0;

        height: calc(var(--boxHeight) * 1.5);
        width: 100%;
        z-index: 2;

        background-color:  var(--headerBoxColor);
        overflow: hidden;
    }

    .postHeader{
        position: fixed;
        margin: 0 auto;
        left: 0;
        top: 0;
        margin-top: calc(var(--boxHeight) * 1.5);

        height: calc(var(--boxHeight) * 0.2);
        width: 100%;
        z-index: 2;

        border-bottom-right-radius: 1vw;
        border-bottom-left-radius: 1vw;

        background-color:  var(--postHeaderBoxColor);
        overflow: hidden;
    }
    
    body{
        background-color: var(--bodyBoxColor);
    }

    .vologdaDescription{
        position:relative;
        left: calc(100% - (50% + var(--blockSize)/2));
        margin-top: calc(var(--boxHeight) * 2.2);

        width: var(--blockSize);
        height: calc(var(--boxHeight) * 2.8);

        text-align: center;

        background-color:  var(--vologdaBoxColor);
        border-radius: 1vw;
        overflow: hidden;
    }

    .vologdaPlace{
        position:relative;
        left: calc(100% - (50% + var(--blockSize)/2));

        width: var(--blockSize);
        margin-top: 6vw;
        height: calc(var(--boxHeight) * 10);

        text-align: center;

        background-color:  var(--vologdaBoxColor);
        border-radius: 1vw;
        overflow: hidden;
    }

    .vologdaMap{
        position:relative;
        left: calc(100% - (50% + var(--blockSize)/2));
        margin-top: var(--vologdaBoxMargin);

        width: var(--blockSize);
        height: calc(var(--boxHeight) * 8);

        text-align: center;

        background-color:  var(--vologdaBoxColor);
        overflow: hidden;

        -moz-border-radius: 1vw 1vw 1vw 1vw; /* Firefox */
        -webkit-border-radius: 1vw 1vw 1vw 1vw; /* Safari, Chrome */
        -khtml-border-radius: 1vw 1vw 1vw 1vw; /* KHTML */
        border-radius: 1vw 1vw 1vw 1vw; /* CSS3 */
    }

    footer{
        position:relative;
		margin: auto;

        margin-top: calc(var(--boxHeight) * 1.5);
        width: 70%;
    }


    .prevFooter{
        height: calc(var(--boxHeight) * 0.4);

        border-top-right-radius: 1vw;
        border-top-left-radius: 1vw;
        background-color:  var(--postHeaderBoxColor);
    }

    .postFooter{
        height: calc(var(--boxHeight) * 1);
		
		border-bottom-right-radius: 1vw;
        border-bottom-left-radius: 1vw;
        background-color:  var(--headerBoxColor);
     
        text-align: center;
        overflow: hidden;
    }
 
    :root {
        --headerBoxColor:rgb(177, 250, 250);
        --postHeaderBoxColor:rgb(175, 238, 238);

        --bodyBoxColor:rgb(255, 255, 255);

        --vologdaBoxMargin: 6vw;
        --blockSize: 40vw;
        --vologdaBoxColor: rgb(177, 250, 250);

        --boxHeight: 3.1vw;
    }

    @media screen and (max-width: 980px) {
        :root {
            --vologdaBoxMargin: 12vw;
            --blockSize: 80vw;

            --boxHeight: 6.2vw;
        }
    }