@media (max-width: 259px) {body{display:none;};}
/* LEFT MENU */
nav#contacts_left-menu {height: 100%; width: 80px; background: var(--black); z-index: 6; position: fixed;
    transition: left .8s ease-in-out; left: -80px; 
	overflow-y: auto; overflow-x: hidden; -ms-overflow-style: none; scrollbar-width: none;}
    nav#contacts_left-menu::-webkit-scrollbar {width: 0px; display:none;}
section.contacts_left-menu { left: 80px; top: 0; opacity: 0; height: 100vh; width:0px;
    transition: all .3s ease-in-out; overflow-x: hidden; position: fixed; z-index: 1; 
    background: var(--dark-blue3); padding-top: 122px; }
@media (min-width: 1024px) {
    header#pc_header.short + main#main_content aside nav section {padding-top: 50px;}
    nav#contacts_left-menu.show {left: 0;}
    nav#contacts_left-menu ul {width: 80px; position: relative; z-index: 6;
        display: flex;flex-direction: column; margin-bottom: 122px;}
    header#pc_header.short + main#main_content aside nav#contacts_left-menu ul {margin-bottom: 50px;}
    nav#contacts_left-menu li {width: 80px;height: 90px;border-bottom: 1px solid var(--black2);
        position: relative; z-index: 6;
        transition: background .2s ease-in-out;display: flex;align-items: center;justify-content: center;}
    nav#contacts_left-menu a.icon {width: 80px;height: 90px;
        background: none;opacity: .7; transition: opacity .2s linear;}
    nav#contacts_left-menu li:hover {background: var(--dark-blue3); cursor: pointer;}
    nav#contacts_left-menu li:hover section.contacts_left-menu {width: 350px; opacity: 1;}
    nav#contacts_left-menu li:hover a {opacity: 1;}
    nav#contacts_left-menu li section.contacts_left-menu p {min-width: 320px; min-height: 90px; margin-left: 30px;
        display: flex; align-items: center; line-height: 30px;
        font-size: 22px;opacity: 0;
        transition: opacity .3s linear; letter-spacing: 1px;
        text-transform: uppercase;color: var(--white);}
    nav#contacts_left-menu li:hover section.contacts_left-menu p {opacity: 1;}
    nav#contacts_left-menu li section.contacts_left-menu ul {overflow-y:auto; overflow-x: hidden;
        width: 320px;margin-left: 10px; max-height: calc(100vh - 280px);}
    nav#contacts_left-menu li section.contacts_left-menu ul::-webkit-scrollbar {width: 7px;}
    nav#contacts_left-menu li section.contacts_left-menu ul::-webkit-scrollbar-track {
        background: var(--dark-blue3);}
    nav#contacts_left-menu li section.contacts_left-menu ul::-webkit-scrollbar-thumb {
        background-color: var(--white2);}
    nav#contacts_left-menu li section.contacts_left-menu ul li {
        min-width: 320px;height: auto;border-bottom: none;}
    nav#contacts_left-menu li section.contacts_left-menu ul li a {
        width: calc(100% - 70px);margin-left: 10px;padding: 6px 20px; color: var(--grey2);font-size: 14px;
        line-height: 20px;border-bottom: 1px solid var(--white3);transition: all .2s ease-in-out;}
    nav#contacts_left-menu li section.contacts_left-menu ul li:hover a {
        color: var(--white); background: var(--dark-blue2);}
}
/* CONTACTS */
@media (min-width: 1024px) {
div#footer_copyrights {transform:translateY(-3px);}
div.breadcrumbs ol {padding: 25px 80px;}}
main#main_content footer {padding-top:10px; min-height:unset;}
section#contacts {width:100%; background: url(/img/background/services-background.webp); 
	background-repeat: no-repeat; background-size: contain; background-position: center top;}
div#contacts_background {width:100%; min-height:60px; background:url(/img/background/services-background.webp); 
	background-repeat: no-repeat; background-size: cover; background-position: center bottom;}
section#contacts h1 {width:100%; font-size: 36px; text-align: center; color: var(--dark-blue3);
        background: rgba(255, 255, 255, .9); padding-top: 30px; padding-bottom: 30px; margin-bottom: 60px;}
div#contacts_content {width:100%; padding-bottom:25px; background:linear-gradient(0deg, var(--dark-blue) 0%, var(--dark-blue2) 55%, var(--dark-blue) 100%);}

div#contacts_wrapper {width:800px; margin-left:calc(50% - 400px);} 
div#contacts_wrapper p.header {color:var(--white);width:calc(100% - 100px); text-align:center; padding:15px 50px; font-size: 21px; margin-top:20px; line-height: 28px;}

div#contacts_offices {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-around;}
div.office {width:calc(50% - 60px); border-right:1px solid var(--grey2); padding-right:40px;}
div.office:last-child {border-right:none; padding-right:0px;}
div.location {padding:20px 40px;}
div.location img {transition:filter .3s linear, border .3s linear; border:2px solid var(--dark-blue);}
div.location img:first-child {width:150px; height:150px; position: relative; border-radius:50%; left:55px;}
div.location img:first-child:hover, div.location img:last-child:hover {cursor: pointer; filter: sepia(40%); border:2px solid var(--grey2);}
div.location img:last-child {width:75px; height:75px; position: relative; border-radius:50%; bottom:75px;}

div.info {padding:20px; background:var(--dark-blue2); border-radius:10px;}
div.info address, div.info p {color:var(--white); font-size: 15px; line-height: 21px;}
div.info address {font-style:normal; text-align:center; font-size: 16px; line-height: 28px;}
div.info div.phones {padding:15px 0; margin:15px 0; border-top:1px solid var(--grey2); border-bottom:1px solid var(--grey2);}
div.info div.phones a {color:var(--white); font-size: 16px; line-height: 28px; width: 100%; text-align:center; display:block;}
div.info div.worktime p {font-size: 16px; line-height: 28px; width: 100%; padding-left:30px;}
div.info div.worktime p span {color:var(--orange);}

div#licences {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-around; border-bottom:1px solid var(--grey2); padding-bottom:20px;}
div#licences p {width:30%; padding:10px 15px; color:var(--white); font-size: 18px; line-height: 21px; text-align:center;}
div#licences p span {color:var(--orange); font-size: 15px;}

section#contacts form {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-around; padding:20px 0; background:var(--dark-blue2); border-radius:10px;}
section#contacts form input, section#contacts form textarea {background:transparent; border:none; border-bottom:2px solid var(--grey2); color:var(--white); caret-color:var(--orange);}
section#contacts form input {width: 32%; margin:15px 5%; padding:8px 15px; border-radius:10px; transition:background .3s linear, border .3s linear, color .3s linear;}
section#contacts form input[type=submit] { width:180px; border:2px solid var(--grey2); color:var(--white); background:var(--orange); cursor:pointer; font-size: 16px;}
section#contacts form input[type=submit]:hover {border:2px solid var(--dark-blue); color:var(--dark-blue); background:var(--white);}
section#contacts form textarea { max-width:82%; min-width:82%; margin:15px 5%; padding:8px 15px; border-radius:10px;  border-top:2px solid var(--grey2);
	min-height:250px; max-height:80vh; font-size: 16px;}
section#contacts form textarea::placeholder, section#contacts form input::placeholder {font-size: 16px; color:var(--grey2);}
section#contacts form textarea:focus, section#contacts form input:focus {outline: none;}
section#contacts form input.invalid, section#contacts form textarea.invalid {background:var(--red); color:var(--white); caret-color:var(--white);}
section#contacts form input.valid, section#contacts form textarea.valid {background:var(--blue); color:var(--white); caret-color:var(--white);}

div#modal-wrapper div#form-wrapper img.big, div#modal-wrapper div#form-wrapper iframe {width:auto; margin-top:20px; max-height: 70vh; border-radius:10px;}
div#modal-wrapper div#form-wrapper {max-width: 1000px; max-height: calc(100vh - 100px); display:flex; flex-direction:column; justify-content:center; align-items:center;}
div#modal-wrapper div#form-wrapper iframe {width: calc(100% - 20px); height:calc(100vh - 280px);}

@media (min-width: 1200px) {
	div#contacts_wrapper {width:1000px; margin-left:calc(50% - 500px);}
	div.location {padding:20px 80px;}
}

@media (min-width: 680px) and (max-width: 1023px) {
	section#contacts {background-size: 120%;}
	div#footer_copyrights {transform:translateY(-14px);}
	div#contacts_wrapper {width:660px; margin-left:calc(50% - 330px);}
	div.location {padding:20px 5px;}
	div#modal-wrapper div#form-wrapper img.big {width:auto; max-height:70vh;}
}

@media (min-width: 260px) and (max-width: 679px) {
	div#modal-wrapper div#form-wrapper img.big { max-width:100%; max-height:calc(100vh - 270px);}
	section#contacts {width:100%; background: var(--white);}
	section#contacts h1 {margin-bottom: 0px;}
	div#contacts_wrapper {width:calc(100% - 40px); margin-left:20px;}
	div#contacts_wrapper p.header {width: calc(100% - 40px); padding: 15px 20px;}
	div.office {width:100%; padding-right: 0px; border-right: unset; margin-bottom: 20px; border-bottom: 2px solid var(--white);}
	div.location {padding:0px; width:210px; max-height:180px; overflow:hidden; margin-left:calc(50% - 105px);}
	div#licences p {width:100%;}
	section#contacts form input {width: 100%; margin: 15px;}
	section#contacts form textarea {min-width: unset; max-width: unset; width: 100%; margin: 15px;}
	div#contacts_background {display:none;}
	main#main_content footer {padding-top: 0px;}
	div#footer_copyrights {padding:20px 0;}
}