body{

    --myContainerWidth:1900px;
    
    --myHeaderHeight:160px;
    --myLogoWidth:240px;
    --myLogoBlockHeight:500px;
    --myTextBlockHeight:620px;
    --myLangBlockHeight:100px;
    --myCellarHeight: 200px;

    --myLangMargin:100px;

    --myMainLogo:90%;
    
    --myHeaderFontSize:24px;
    --myMainFontSize:26px;
    --myLangFontSize:26px;
    --myCellarFontSize:24px;

    --mySocialWidth:44px;


    --myPostWidth: 1700px;
    --myPostTitleFontSize: 24px;
    --myPostDateFontSize: 16px;
    --myPostTextFontSize: 22px;

    margin: 0px;
    background: rgb(0, 0, 0);

    overflow-y: scroll;

}



.container {
    width: var(--myContainerWidth);
    background-color: rgb(0, 0, 0);
    height: 100%;
    display: flex;
    align-items: center; /* по вертикали */
}

.midder {
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: auto;
    margin-right: auto;
}

.blog {
    display: flex;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}

.header {
    height: var(--myHeaderHeight);
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;  /* по горизонтали */
}

.imageblock {
    
    background-color: rgb(0, 0, 0);
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
}

.logoblock {
    height: var(--myLogoBlockHeight);
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
    align-items: center;
}

.textblock {
    height: var(--myTextBlockHeight);
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
}

.langblock {
    height: var(--myLangBlockHeight);
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
    
}

.cellar {
    height: var(--myCellarHeight);
    background-color: rgb(0, 0, 0);
    display: flex;
    justify-content: center;
}




/* Elements */


.logo {
    width: var(--myLogoWidth);    
}

.text {
    font-family: "Source Code Pro", monospace;
    color: #b6755d;
    text-decoration: none;
    font-weight: 400;
    font-size: var(--myHeaderFontSize); 
}

#Menubutton1 {
    margin-left: auto;    
}

#Menubutton2 {
    margin-left: 30px;    
}

#Menubutton3 {
    margin-left: 100px;    
}


.mainpicture {
    width: 100%;
}

.mainlogo {
    width: var(--myMainLogo);
    display: block;
}

#Maintext {
    width: 100%;
    overflow-wrap: break-word;
    font-size: var(--myMainFontSize);
    line-height: 1.4;
}

#Langtext1 {
    overflow-wrap: break-word;
    font-size: var(--myLangFontSize);
    margin-left: var(--myLangMargin);
}

#Langtext2 {
    overflow-wrap: break-word;
    font-size: var(--myLangFontSize);
    margin-left: 14px;   
}

#Cellartext {
    font-size: var(--myCellarFontSize);
}

.social1 {
    margin-left: auto;
}

.social2 {
    margin-left: 20px;
}

.socialimage {
    width: var(--mySocialWidth);    
}







