@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100;200;300;400;500;600;700;800;900&display=swap');





:root {
    --padding-amount: 7%;
    --color-text: #000000;
    --color-round-fon: #f0e5f5;
    --color-round-fon-red: #f0e5a5;        /* Цвета от Паши  #d99292; #99d992; */
    --shrift:  Roboto Slab, Verdana;
    --shrift_poem:    Verdana
}



.background {
    background-color: #ffffff;
    font-family: var(--shrift);  
    color:   var( --color-text) ;
    background-image: url('paper_grey.jpg'); 
}
               

a {
    color:   var( --color-text) ;
}
               


    
.Text 
{ font-family: var(--shrift); 
/* font-family: Roboto Slab; */
font-size: calc(0.5em + 0.8vw);

/* font-weight: bold;*/
color:   var( --color-text) ;
text-align: justify;
margin-bottom: 3ex; 
margin-top: 0.8ex;
margin-left: 0.0; 
margin-right: 0.0;
text-indent: 3.0ex; 
line-height:130%;}



.Poem_otstup 
{ font-family: var(--shrift); 

font-size: calc(0.5em + 0.8vw);
/*  font-weight: bold;*/
color:   var( --color-text) ;
text-align: left;
margin-bottom: 0; 
margin-top: 0.0ex;
margin-left: 3.0em; 
margin-right: 0.0;
text-indent: 0; 
line-height:130%;}





.Podpis
{ font-family: var(--shrift); 

font-size: calc(0.5em + 0.8vw);

color: var( --color-text); 
text-align: right; text-decoration: none;

margin-top: 1.5ex; margin-bottom: 1.5ex; margin-left: 1.5ex; margin-right: 1.5ex;
text-indent: 1.0cm; 
line-height:100%;
}








.Text_zgl 
{ font-family: var(--shrift); 

font-size: calc(1.2em + .9vw);
color:   var( --color-text) ;
text-align: left;
margin-bottom: 0ex; 
margin-top: 0.8ex;
margin-left: 0.0; 
margin-right: 0.0;
text-indent: 0.4em; 
line-height:130%;}




.Comment_Cent 
{ font-family: var(--shrift_poem);  
font-size: 10pt;
color:   var( --color-text) ;
margin-top: -0.5ex;
margin-bottom: 0.0ex; 
margin-right: 0cm;
text-align: center;
text-indent: 0; 
line-height:140%;}








h2
{ font-family: var(--shrift);  
font-size: 30pt;   
color:   var( --color-text) ;
font-weight: bold;
margin-bottom: 5px; 
margin-top: 5px;
text-indent: 10px; }


h4
{ font-family: var(--shrift); 
font-size: 14pt; 
color:   var( --color-text) ;    /*color: #000000; */
font-weight: normal;
margin-top: 4px;
margin-bottom: 1px; 
line-height:130%;}



























/* ooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooo */






.text-center {
    text-align: center;
}

.justified {
    text-align: justify;
}

.padded {
    padding: 0 var( --padding-amount ) !important;
}



.row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    padding: 10px;
}

.row > div {
    padding: 10px;
    flex-grow: 1;
}

.m_right {
    margin-left: auto;
}

.m_left {
    margin-right: auto;
}

.col-full {
    flex-grow: 0 !important;
    width: calc( 100% - 22px );
}

/* 75% */
.col-75 {
    flex-grow: 0 !important;
    width: calc( 75% - 22px );
}

/* 1/2 of width */
.col-2 {
    flex-grow: 0 !important;
    width: calc( 50% - 22px );
}

/* 1/3 of width */
.col-3 {
    flex-grow: 0 !important;
    width: calc( 33.33334% - 22px );
}






/*SMALL*/
@media screen and (max-width: 999px) {
    .container {
        width: calc(100% - 30px);
        padding: 15px;
    }

    .big-link {
        font-size: 14pt;
    }
    
    .padded {
        padding: 0 calc(var( --padding-amount ) / 5) !important;
    }

    .col-sm-full {
        flex-grow: 0 !important;
        width: calc( 100% - 22px ) !important;
    }

    .col-sm-75 {
        flex-grow: 0 !important;
        width: 75% !important;
    }

    .col-sm-2 {
        flex-grow: 0 !important;
        width: calc( 50% - 22px ) !important;
    }

    .col-sm-3 {
        flex-grow: 0 !important;
        width: calc( 33.33334% - 22px ) !important;
    }
    

}



/*LARGE*/
@media screen and (min-width: 1000px) {
    .container {
        width: 23cm;      /*70%;*/
        margin: 5px auto;
        padding: 0 15px;
    }

    .container_big {
        width: 28cm;      /*70%;*/
        margin: 5px auto;
        padding: 0 15px;
    }

    .big-link {
        font-size: 18pt;
    }

    .col-lg-full {
        flex-grow: 0 !important;
        width: calc( 100% - 22px ) !important;
    }

    .col-lg-75 {
        flex-grow: 0 !important;
        width: 75% !important;
    }

    .col-lg-2 {
        flex-grow: 0 !important;
        width: calc( 50% - 22px ) !important;
    }

    .col-lg-3 {
        flex-grow: 0 !important;
        width: calc( 33.33334% - 22px ) !important;
    }
    
    
}