@charset "utf-8";
/*  essaywritersguild.org/css/common.css
    v1
    2024-10-14 copied over from ezsay.org
*/

html {  
    scroll-behavior: smooth;
    --color-bl: black;
    --color-wt: white; 
    /* 30-white; 3-black */
    --color-tx-main: white;
    --color-tx-foot: black;
    /* 30-black; 3-white */
    --color-tx-btn: white;
    /* 30---color-1-5; 3-white*/
    --color-bg-btn-active: white;
    /* 16 */ 
    --color-1-1: #2c3531; 
    --color-1-2: #116466;    
    --color-1-3: #d9b08c;    
    --color-1-4: bisque;
    --color-1-5: #d1e8e2;
    
    --footer-height: 100px;
}

body { 
    margin: 0;
    background-color: var(--color-1-3);
}

.c-bg-main { background-color: var(--color-1-2); }
.c-col-main { color: var(--color-tx-main); } /* цвет текста в основном разделе*/
.c-m-menu-l::-webkit-scrollbar{display:none;}
.c-m-menu-t::-webkit-scrollbar{display:none;}

.cust-r-1 {   border-radius: 2rem; }

.c-main-text { color: var(--color-tx-main); }

.c-m-menu-l{
    white-space: nowrap;
    height: 100%;
    background-color: var(--color-1-4);
    color: var(--color-1-5);
    position: fixed;
    overflow-x: hidden;
}
    
.c-m-menu-t {
    display: none;
    overflow-y: hidden;
    position: fixed;
    top: 0px;
    z-index: 99; 
    width: 100%;
    height: 40px;
    background-color: var(--color-1-4);
}
    
.footer{
    height: var(--footer-height);
    width: 100%;
    /*
    left: -20%;
    */
    bottom: 0px;
    background-color: var(--color-1-3);
    color: var(--color-tx-foot);
}

.c-lm-nav a, .c-tm-nav a { text-decoration: none; }
.c-lm-nav li, .c-tm-nav li {display: block;}

.c-lm-nav h4, .c-tm-nav h4 {
    background-color: var(--color-1-1);
    color: var(--color-tx-btn);
    padding-left: 1rem;
    margin-left: -1rem;
    padding-bottom: 0.4rem;
    padding-top: 0.2rem;
    width: 100%;
    border-radius: 1rem;
}

.cust-footer a {
    text-decoration: none;
    color: var(--color-tx-foot);
}

.cc-bold {
    font-weight: bold;
    background-color: var(--color-bg-btn-active)!important;
    color: var(--color-1-1)!important;
}

.modal-dialog {    max-width: max-content;    }

.cust-m-radio {
    width: 30px;
    height: 30px;
    border-style: solid;
    border-width: thin;
    border-color: var(--color-1-1);
}

.c-m-r1 { background-color: #116466; }  /* 16 */
.c-m-r2 { background-color: #efe2ba; }  /* 14 */
.c-m-r3 { background-color: #d8c3a5; }  /* 19 */
.c-m-r4 { background-color: #d2fdff; } /* 37 */

/* color scheme buttons */
.form-check-inline {
    margin-right: 0.9rem;
    margin-left: -0.5rem;
}

.c-main-content { 
    padding-bottom: var(--footer-height);
    overflow-x: hidden;
}

.cc-show-1 {
    display: block;
}

@media screen and (max-width: 1200px) and (orientation: portrait) {
    .footer{
        width: 100%;
        left: -0%;
    }
}
 
@media screen and (max-width: 992px) and (orientation: portrait){

    .c-m-menu-l { display: none; }
    .c-m-menu-t { display: block; }

    .c-main-content{
        width: 100%;
        padding-top: 40px;
    }

    .footer{
        height: 100px;
        width: 100%;
        left:0; 
    }
    
    .c-lm-nav h4, .c-tm-nav h4 {
        width: max-content;        
        font-size: medium;
        margin-right: 20px;
        padding-right: 20px;
        padding-bottom: 0.3rem;
        padding-top: 0.2rem;
    }
     
    .cc-au-info { display: inline!important; }
}

@media screen and (max-width: 600px) and (orientation: portrait) {
    .cc-show-1 {  display: none; }
}
    
@media screen and (max-width: 1400px) and (orientation: landscape){
    .c-lm-nav h4, .c-tm-nav h4 {  font-size: large; }
}

@media screen and (max-width: 1200px) and (orientation: landscape){
    .c-lm-nav h4, .c-tm-nav h4 {
        font-size: x-large;
        padding-bottom: 0.3rem;
        padding-top: 0.2rem;
    }
    .footer{
        width: 100%;
        left: 0;
    }
}
    
@media screen and (max-width: 992px) and (orientation: landscape){
    .c-lm-nav h4, .c-tm-nav h4 {  font-size: smaller;   }
    /* color scheme buttons */
    .form-check-inline { margin-left: -1rem; }
}

@media screen and (max-width: 640px) and (orientation: landscape){
    .form-check-inline { margin-left: -1.1rem; }
}