html {height: 100%;}
body {height: 100%;}
main {height: 100%;}

body {color:#313632; font-family: Montserrat, Helvetica, Arial, sans-serif;}
.bg-soft {background: url(../img/bg_signin.png); background-size: cover;}
.bg-secondary {background-color:#8B5CF6 !important}
.bg-secondary img {max-width: none;}

a {color: #8B5CF6;}
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {color: #313632;}
label {font-weight: normal;}
main {overflow:auto; overflow-x: hidden;}
p, ol li, ul, ul li {font-family: Montserrat, Helvetica, Arial, sans-serif;}
:root {--bs-font-sans-serif: Montserrat, Helvetica, Arial, sans-serif;}


.h-as100 {min-height: 100vh;}
.fs-3 {font-size: 1.6rem; font-weight: normal;}
.fs-4 {font-size: 0.9rem; font-weight: normal;}
.here-block {margin-bottom: 40px;}
.bottom-60 {bottom: 60px;}
.scotch {background: url(../img/scotch.png) 0 0; padding: 5px 10px; margin-left: -10px;}
.w-30 {width: 30% !important;}
.chat-fixblockclass {height: 100%;}

/*
.menu-container {top:0}
.menu-block {margin-top: 94px;}
.navbar-light .navbar-nav .nav-link {font-size: 0.8rem;}ƒ
.navbar .possibilities-block a {color: #313632;}
.navbar .possibilities-block a:hover {color: #000;}
*/

/* menu and modal */
.section-header {padding-top: 0; padding-bottom: 0;}
.menu-button {cursor: pointer;}
.modal-header .logo-header {padding-top: 9px;}
.menu-list-longlist h4 {margin-top: 15px;}
.modal-content_menu .modal-header {padding: 14px 0 13px;}

.menu-list-mobile {list-style-type: none; color: #313632; padding: 0; margin: 0;}
.menu-list-mobile__item { position: relative; padding-top: 14px; padding-bottom: 4px;}
.menu-list-mobile__item a {color: #313632; font-size: 1.3rem;}
.menu-list-mobile__item a:hover {color: #000;}

.menu-list-longlist {margin-bottom: 30px;}
.menu-list-longlist ul { list-style-type: none; color: #313632; padding: 0; margin: 0;}
.menu-list-longlist li { position:relative;}
.menu-list-longlist li a {color: #313632;}
.menu-list-longlist li a:hover {color: #000;}

.modal-dialog .footer__text {padding-bottom: 20px;}
.menu-list-longlist h4 {margin-top: 15px;}
.modal {background-color: #fff;}
/* \ menu and modal */



input.form-control::placeholder {
    color: #bababa;
  }

textarea.form-control::placeholder {
    color: #bababa;
  }
  
.text-primary, .text-primary:hover {
    color: #8B5CF6 !important;
}

.form-control {
    color: #313632;
    border-color: #bababa;
    border-radius: 0;
}
.form-control:focus {
    border-color: #8B5CF6;
    color: #313632;
}

.btn {border-radius: 9999px;}

.btn-primary {
    padding-left: 2rem;
    color: #FFFFFF;
    background-color: #8B5CF6;
}

.btn-primary:hover {
    color: #FFFFFF;
    background-color: #7C3AED;
}

.btn-primary.btn-towhite:hover {
    color: #313632;
    background-color: #F1FBDB;
}


.btn-whitebg {
    color: #313632;
    background-color: #fff;
}
.btn.btn-whitebg:hover {
    color: #000;
    background-color: #fff;
}

.btn-check:focus + .btn-primary, .btn-primary:focus {
    color: #313632;
    background-color: #8B5CF6;
    border-color: #83A82D;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(23, 31, 56, 0.075), 0 0 0 0.2rem rgba(94, 156, 140, 0.5);
}

.btn-check:checked + .btn-primary,
  .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active,
  .show > .btn-primary.dropdown-toggle {
    color: #313632;
    background-color: #83A82D;
    border-color: #8B5CF6;
}
.btn-burger-block {justify-content: flex-end; margin: 40px;}


.bg-left-moda {background: url(../img/bg-left-moda.png) 100% 0; background-size: cover;}
.bg-preloader {background-color: #8B5CF6;}


.form-check-input {
    border-color: #D9D9D9;
}
.form-check-input:focus {
    border-color: #8B5CF6;
    outline: 0;
    box-shadow: none;
}



.form-check-input:checked {
    background-color: #8B5CF6;
    border-color: #7C3AED;
    color: #313632;
}
.form-check-input[type="checkbox"] {
    border-radius: 0;
}
.form-check-input:hover[type="checkbox"] {
    border-color: #8B5CF6;
}

.form-check-input:checked[type="checkbox"] {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23313632' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    border-radius: 0;
}


.form-check-input:hover[type="radio"] {
    border-color: #8B5CF6;
}

.form-check-input:checked[type="radio"] {
    background-color: #313632;
    border-color: #313632;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%238B5CF6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
}


.bg-preloader  {padding: 0; margin: 0;}

.left-moda-block {position: relative; background: url(../img/bg-left-moda.png); background-size: cover; background-position: 98% 0;}

img.logo {margin: 70px 100px 0 80px;}
.bg-hello-white {background-color: #fff;}
.bg-green {background-color: #8B5CF6;}
.bg-grey {background-color: #E1E0FE;}

.left-block-site {padding: 60px 65px 60px 63px; color: #313632;}
.left-block-site a {color: #313632;}
.left-block-site a:hover {color: #000;}
.left-block-site img {width: 100%; max-width: 188px;}
.left-block-site .logo-block {margin-bottom: 40px;}

.smalltext {font-size: 70%;}

.hello-page .block-container h1 {font-size: calc(3.5rem + 1.5vw); line-height: 100%; font-weight: 400;}
.block-container {padding: 70px 200px 70px 80px;}
.block-container.block-container-equalpaddingrl {padding-right: 80px; padding-left: 80px;}
.padding-as-container-equalpaddingrl {padding-right: 80px;}
.block-container h1 {line-height: 100%;}
.block-container h3 {font-size: 1rem; font-weight: normal;}
.block-container h4 {font-size: 60%;}
h4 {font-size: 60%; opacity: 0.6; text-transform: uppercase; margin-bottom: 0.1rem;}
.block-container a {color:#313632;}
.block-container a:hover {color:#8B5CF6;}
.block-container ul {list-style: none; padding-left: 0; margin-left: 0;}

.border-right-green {background: url(../img/greenline.png) repeat-y 100% 0;}
 
.possibilities-block {margin-top: 10px; margin-bottom: 50px;}
.possibilities-block h4 {font-size: 0.8rem;}
.possibilities-block ul {padding-left: 0; margin-left: 0;}
.possibilities-block ul li {font-size: 1.2rem; list-style: none; padding-left: 0; margin-left: 0; line-height: 120%; padding-bottom: 12px;}

.btn-createtext {margin-top: 30px;}


.nav-fileType {text-transform: uppercase; margin-bottom: 20px;}
.nav-fileType .nav-link.active {background-color: #8B5CF6; color: #313632; font-weight: 500;}
.nav-fileType a {color: #313632}
.nav-fileType li {font-size: 0.9rem; }
.nav-fileType .nav-link {padding: 0.25rem 0.7rem;}

.bottom-block-absolute {position: absolute; bottom: 40px;}
.chat-fixblockclass .bottom-block-absolute {position: relative; bottom: -20px;} 

/* chat */
.user.message {padding: 10px 15px; background-color: #8B5CF6; margin-bottom: 12px;}
.user.message .user-icon {color: #8B5CF6; visibility: hidden;}
.user.message .user-icon:before {
    content: "Я:"; 
    color: #313632; 
    visibility: visible; 
    opacity: 0.8; 
    font-style: normal; 
}

.assistant.message .user-icon {color: #fff; visibility: hidden;}
.assistant.message .user-icon:before {
    content: "MODA GPT:"; 
    color: #313632; 
    opacity: 0.5; 
    font-style: normal; 
    visibility: visible; 
    font-size: 0.9rem;
}

.message .content, 
.message .content p, 
.message .content ol, 
.message .content ul {
    font-size: 1.4rem; line-height: 1.5; font-weight: 300;
}
/* \ chat */


.btn.btn-link {border: 0; box-shadow: none; color: #313632;}
.btn.btn-link:focus {border: 0; box-shadow: none;}
.greytext {color: #838684;}
.textcupslock {text-transform: uppercase;}
.btn.btn-link.greytext {color: #838684;}
.btn.btn-link.greytext:hover {color: #313632;}
.btn-back {padding-left: 0;}

/* .block-answer p {font-size: 1.4rem; line-height: 1.5;} */

.block-centralhello {max-width: 1300px;}
.block-headerglobal {max-width: 1300px;}

.block-madeby, .block-madeby a {color:#999;}
.block-madeby a:hover {color: #000;}
.bg-green .block-madeby, .bg-green .block-madeby a {color:#9CC14B;}
.bg-green .block-madeby a:hover {color: #313632;}

.block-tools .card {border: none; border-radius:0}
.block-tools h5 {position: relative; padding-right: 52px; font-weight: 400;}
.block-tools [class^="icofont-"], .block-tools [class*=" icofont-"] {position: absolute; right: 0; top: 3px; font-size: 2.6rem;}
.block-tools .card-footer {border: none;}
.block-tools .card:hover {color: #313632;}
.block-tools .card p {font-weight: 400;}
.block-tools .card .btn {display: none;}
.block-tools .card:hover {background-color: #8B5CF6;}
.block-tools .card:hover .btn {display: inline-block;}

.tools-card p {margin-bottom: 0; line-height: 130%;}
.tools-card .card {height: 220px;}
.tools-card .card-body {padding-bottom: 0;}
.tools-card .h5 {padding-bottom: 0;}


/* .block-examples .card-group {margin-right: -0.5rem; margin-left: -0.5rem;} */
.block-examples .card-group {margin-right: -0.5rem; margin-left: -0.5rem; padding-left: 0; padding-right: 0;}
.block-examples .card {color: #fff; text-shadow: 0 1px 2px #222}
.block-examples :hover .card {color: #fff;}
.block-examples h5 {color: #fff;}
.block-examples .card .card-color {display: none;}
.block-examples .card:hover .card-bw {display: none;}
.block-examples .card:hover .card-color {display: block;}
.block-examples .card .card-trylink {display: none; font-weight: 500; margin-top: 4px;}
.block-examples .card:hover .card-trylink {display: block;}
.block-examples .card p {margin-bottom: 0; width: 70%; line-height: 130%;}
.block-examples .card-img-overlay {padding: 1.25rem 1.5rem}

.block-container .block-ican h3 {font-size: 1.3rem;}

.block-login form {max-width: 600px; padding-bottom: 100px;}
.block-login  .btn-primary {padding-left: 1rem; padding-right: 1rem;}


.long-main-container {justify-content: space-between; display: flex; flex-direction: column; width: 100%;}
.long-main-container .view {display: flex; flex-direction: column; overflow-y: auto;}
.long-main-container .message-form {box-sizing: border-box; bottom: 20px;}
.long-main-container .block-container .conversation-view {padding-bottom: 30px;}
.long-main-container .block-container.message-form {padding-bottom: 0; padding-top: 10px;}

.btn-outline-secondary {border-color:#bababa;}

.overfl-y {overflow-y: auto; overflow-x: hidden;}

.accent-block {background-color: #F6F4EE; padding: 1.5rem 1.8rem ; margin-bottom: 20px; position: relative;}
.accent-block h5 {font-size: 0.85rem; font-weight: 300; margin-bottom: 0.3rem;}
.accent-block p {font-size: 1.1rem; margin-bottom: 11px; font-weight: normal; line-height: 120%;}
.accent-block p span {background: url(../img/dot-bg.png) repeat-x 0 100%;}
.accent-block p span:hover {background: none; cursor: pointer;}
.accent-block .ico-close {position: absolute; top: 1.5rem; right: 1.8rem; font-size: 0.85rem; font-weight: 300; line-height: 1.3;}
.accent-block .ico-close:hover {cursor: pointer; color: #000;}
.accent-block .ico-close::after {content: "Скрыть";}


@media (min-width: 2100px) {
    .col-xhd-2 {flex: 0 0 auto; width: 16.66667%;}
}

@media (min-width: 1200px) {
    .tools-card .card {height: 230px;}
}

@media (max-width: 1200px) {
    .block-container {padding-right: 150px;}
    .block-container.block-container-equalpaddingrl {padding-right: 80px; padding-left: 80px;}
    .padding-as-container-equalpaddingrl {padding-right: 80px;}
    .possibilities-block ul li {font-size: 1rem;}
    .tools-card .card {height: 220px;}
}
@media (max-width: 1150px) {
    .block-container {padding-right: 80px;}
    .left-block-site {padding-left: 40px; padding-right: 40px;}
    .tools-card .card {height: 220px;}
}

@media (max-width: 991.98px) {
    .navbar-main {position: fixed;}
    .navbar-collapse.collapsing, .navbar-collapse.show {border-radius: 0}
    .block-container.block-container-equalpaddingrl {padding-right: 40px; padding-left: 40px;}
    .padding-as-container-equalpaddingrl {padding-right: 40px;}
    .block-container {padding-right: 40px;}
    .block-container {padding-left: 40px;}
    .block-container {padding-top: 40px;}
    .block-container.block-login {padding-bottom: 90px;}
    .block-container h3 {font-size: 1.2rem;}
    .left-moda-block {height: 50%; background-position: 0 20%;}
    .hello-page .block-container h1 {font-size: calc(2.2rem + 1.5vw);}
    .here-block.fs-3 {font-size: 1.4rem; line-height: 130%;}
    .fs-4 {font-size: 0.8rem;}
    .border-right-green {background: none;}

    .block-madeby {right: 20px; bottom: 10px;}

/*
    .navbar-theme-secondary .navbar-nav .nav-link, .navbar-theme-secondary .navbar-nav .nav-link:focus, .navbar-theme-secondary .navbar-nav .nav-link.active, .navbar-theme-secondary .navbar-nav .nav-link:hover, .navbar-theme-secondary .navbar-nav .show > .nav-link, .navbar-theme-secondary .navbar-nav .show > .nav-link:focus, .navbar-theme-secondary .navbar-nav .show > .nav-link.active, .navbar-theme-secondary .navbar-nav .show > .nav-link:hover, .navbar-theme-secondary .navbar-nav .dropdown-item, .navbar-theme-secondary .navbar-nav .dropdown-item:focus, .navbar-theme-secondary .navbar-nav .dropdown-item.active, .navbar-theme-secondary .navbar-nav .dropdown-item:hover, .navbar-theme-secondary .navbar-nav .list-group-item, .navbar-theme-secondary .navbar-nav .list-group-item:focus, .navbar-theme-secondary .navbar-nav .list-group-item.active, .navbar-theme-secondary .navbar-nav .list-group-item:hover {color: #313632;}

    .navbar-light .navbar-nav .nav-link {font-size: 1.1rem;}
    .menu-block {margin-top: 20px;}
*/
    .mt-onlg {margin-top: 1em;}
    #ShowForm {margin-top: 30px;}
}


@media (max-width: 750px) {
    .message .content, 
    .message .content p, 
    .message .content ol, 
    .message .content ul {
        font-size: 1rem;
    }
    .assistant.message .user-icon:before,
    .user.message .user-icon:before {
        font-size: 0.8rem;
    }
}

@media (max-width: 578px) {
    .tools-card .card {height: 180px;}
    .tools-card .card h5 {font-size: 1rem;}
    .tools-card .card p {font-size: 0.8rem;}

    .block-examples h5 {font-size: 1rem;}
    .block-examples p {font-size: 0.8rem;}
    .block-examples .card-trylink {font-size: 0.7rem;}
    .block-examples .card-img-overlay {padding: 0.7rem;}

    .accent-block .ico-close::after {content: "X";}
}

@media (min-width: 992px){
    .navbar-expand-lg .navbar-collapse {justify-content: flex-end;}
    .btn-burger {display: none;}
}