@media (max-width: 1200px) { /* от 1000 до 1200 */ body { .wrapper { .section-wrapper { width: 1000px; } nav.main-navigation ul.menu { width: 1000px; } .express_order_form { .title { font-size: 18px; margin: 0 30px 0 0; padding: 0 50px 0 32px; } .wpcf7-form { span { &.express_telephone, &.express_email { width: 180px; } } .wpcf7-submit { margin: 0; } } } .gallery_images { img { max-width: 199px; } } section.container { .content { width: 680px; } .homepage_rooms { .room { width: 212px; } } } footer { .map { width: 680px; } .footer-menu > div ul.menu { width: 1000px; } } } } } @media (max-width: 1000px) { /* от 800 до 1000 */ body { .wrapper { .section-wrapper { width: 800px; } nav.main-navigation ul.menu { width: 800px; } .express_order_form { .title { font-size: 18px; line-height: 20px; margin: 0 10px 0 0; padding: 8px 25px 12px 15px; width: 200px; } .wpcf7-form { span { &.express_telephone, &.express_email { width: 150px; } } .wpcf7-submit { margin: 0; } } } .gallery_images { img { max-width: 159px; } } section.container { .content { width: 480px; } .homepage_rooms { .room { margin: 0 0 15px; width: 100%; } } } footer { .map { width: 480px; } .footer-menu > div ul.menu { width: 800px; } } } } } @media (max-width: 800px) { /* от 600 до 800 */ body { .wrapper { .section-wrapper { width: 600px; } header .section-wrapper .contacts, .express_order_form { display: none; } nav.main-navigation { position: relative; .responsive_title { cursor: pointer; box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) inset; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) inset; border-radius: 5px; -webkit-border-radius: 5px; box-sizing: border-box; color: #333; display: block; font-size: 20px; font-weight: 500; line-height: 34px; margin: 5px 0; padding: 0 15px; text-align: center; position: relative; width: 100%; &:after { font-family: 'Glyphicons Halflings'; content: "\e114"; font-size: 18px; font-weight: 100; position: absolute; right: 15px; transition: all 0.15s linear 0s; -webkit-transition: all 0.15s linear 0s; } &.opened:after { transform: rotate(180deg); -webkit-transform: rotate(180deg); } } ul.menu { background-color: #bbc3ce; border: 2px solid #3981e6; box-sizing: border-box; display: none; width: 600px; >li { display: block; border-bottom: 2px solid transparent; &:before, &:after { display: none; } >a { line-height: 36px; } } } &.opened { ul.menu { display: block; } } } .gallery_images { img { max-width: 119px; } } section.container { margin: 0 auto; .sidebar { float: none; margin: 0 auto; } .content { width: 100%; float: none; margin: 70px 0 0; } .homepage_rooms { .room { margin: 0 0 15px; width: 100%; } } } footer { height: auto; .map { width: 100%; float: none; } .contacts { float: none; margin: 20px auto; } .footer-menu { display: none; } } .callback-fixed { transform: scale(0.7, 0.7); -webkit-transform: scale(0.7, 0.7); } } } } @media (max-width: 600px) { /* от 320 до 600 */ body { .wrapper { .section-wrapper { width: 100%; padding: 0 20px !important; box-sizing: border-box; } header .section-wrapper .contacts, .express_order_form { display: none; } nav.main-navigation { position: relative; .responsive_title { cursor: pointer; box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) inset; -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.75) inset; border-radius: 5px; -webkit-border-radius: 5px; box-sizing: border-box; color: #333; display: block; font-size: 20px; font-weight: 500; line-height: 34px; margin: 5px 0; padding: 0 15px; text-align: center; position: relative; width: 100%; &:after { font-family: 'Glyphicons Halflings'; content: "\e114"; font-size: 18px; font-weight: 100; position: absolute; right: 15px; transition: all 0.15s linear 0s; -webkit-transition: all 0.15s linear 0s; } &.opened:after { transform: rotate(180deg); -webkit-transform: rotate(180deg); } } ul.menu { background-color: #bbc3ce; border: 2px solid #3981e6; box-sizing: border-box; display: none; width: 100%; >li { display: block; border-bottom: 2px solid transparent; &:before, &:after { display: none; } >a { line-height: 36px; } } } &.opened { ul.menu { display: block; } } } .gallery_images { img { max-width: 20%; margin: 0; } } section.container { margin: 0 auto; .sidebar { float: none; margin: 0 auto; } .content { width: 100%; float: none; margin: 70px 0 0; } .homepage_rooms { .room { margin: 0 0 15px; width: 100%; } } } footer { height: auto; .map { width: 100%; float: none; } .contacts { float: none; margin: 20px auto; } .footer-menu { display: none; } } .callback-popup_mobile{ .cp__wrap{ width: 290px!important; padding: 0 10px 20px; left: 0!important; right: 0; margin: 0 auto; background-position: 10px 0; .close-popup{ font-size: 33px; } .cpw__title { margin: 20px 25px 30px 94px; text-indent: 0; font-size: 20px; &:before { display: none; } } .cpw__content{ .conf{ font-size: 11px; } p { .callback-tel { width: 100%; } .wpcf7-submit { width: 100%; margin: 15px 0 0; } } } .cpw__description { display: none; } } } .callback-fixed{ height:100px; width: 100px; .cf__radial1{ height:80px; width: 80px; left: 0; right: 0; top: 0; bottom: 0; margin: auto auto; } .cf__radial2{ height: 50px; width: 50px; left: 0; right: 0; top: 0; bottom: 0; margin: auto auto; } .cf__logo{ height: 25px; width: 25px; left: 0; right: 0; top: 0; bottom: 0; margin: auto auto; } } } } }