.wpcf7-response-output {
border: none !important;
padding: 0 !important;
margin: 0px 0 10px 0 !important;
font-size: 14px !important;
width: 100% !important; bottom: 0;
}
.wpcf7-submit {
cursor: pointer;
}
.wpcf7-not-valid-tip {
display: none !important;
}
.wpcf7-not-valid {
border: 1px solid red !important;
}
.wpcf7-form {
position: relative;
}
.wpcf7 {
width: 100%;
}#trp-floater-ls {
display: none;
}
.trp-language-switcher .trp-ls-shortcode-current-language {
width: unset !important;
}
.trp-language-switcher {
position: relative;
width: unset;
height: unset;
z-index: 10000;
}
.trp-ls-shortcode-language {
width: unset !important;
padding: 0 !important;
}
.trp-language-switcher:hover .trp-ls-shortcode-language {
display: flex !important;
flex-direction: column;
}
.trp-language-switcher > div {
border: none;
background-image: none;
background: transparent;
}
.trp-ls-shortcode-current-language {
padding: 0 !important;
}
.trp-language-switcher > div > a,
.trp-language-switcher > div > a.trp-ls-shortcode-disabled-language {
color: #000000;
font-size: 16px;
font-weight: 400;
text-transform: uppercase;
padding: 5px 10px !important;
background: transparent;
display: block;
}
.trp-language-switcher > div > a:hover {
background: #0000002c !important;
}
.mobile-lang .trp-language-switcher > div > a,
.mobile-lang
.trp-language-switcher
> div
> a.trp-ls-shortcode-disabled-language {
color: #000000;
font-size: 16px;
font-weight: 600;
text-transform: uppercase;
padding: 5px 10px !important;
background: transparent;
display: block;
}@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap");
* {
margin: 0;
padding: 0;
font-family: "Inter", serif;
font-weight: 400;
font-style: normal;
line-height: normal;
-webkit-box-sizing: border-box;
box-sizing: border-box;
color: #011c4d;
}
*:focus {
outline: none;
}
html,
body {
height: 100%;
width: 100%;
scroll-behavior: smooth;
}
body {
-ms-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
display: flex;
flex-direction: column;
}
main {
flex: auto;
}
ol,
ul {
list-style: none;
}
a {
text-decoration: none;
}
b {
font-weight: 600;
display: inline;
}
strong {
font-weight: 700;
display: inline;
}
img {
width: 100%;
height: auto;
}
input,
textarea,
select {
vertical-align: middle;
padding: 0;
box-sizing: border-box;
resize: none;
border: 1px solid transparent;
color: rgba(1, 28, 77, 0.6);
font-size: 14px;
background-color: #f9f9f9;
}
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder {
color: #000c49;
font-size: 14px;
}
textarea:focus::-webkit-input-placeholder,
input:focus::-webkit-input-placeholder {
color: #b9b9b9;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-background-clip: text;
-webkit-text-fill-color: #000000;
transition: background-color 5000s ease-in-out 0s;
box-shadow: inset 0 0 20px 20px transparent;
background-color: #f9f9f9;
}
.hover {
transition: opacity 0.4s;
}
.hover:hover {
opacity: 0.5;
}
.container {
display: block;
position: relative;
width: 1440px;
padding: 0;
margin: 0 auto;
height: 100%;
}   .header {
position: fixed;
z-index: 20;
padding: 10px 0;
background-color: #fff;
width: 100%;
z-index: 10;
display: block;
}
.header__inner {
display: flex;
justify-content: space-between;
align-items: center;
}
.logo {
display: block;
width: 175px;
height: 40px;
}
.heade-menu {
width: 100%;
display: flex;
justify-content: space-between;
gap: 10px;
}
.heade-menu ul {
display: flex;
justify-content: space-between;
align-items: center;
gap: 30px;
}
.header-navigation {
display: flex;
justify-content: space-between;
align-items: center;
gap: 30px;
}
.arrow {
width: 20px;
height: 20px;
}
.w-l .btn {
margin-top: 20px;
}
.btn {
width: max-content;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
padding: 14px 24px;
border-radius: 50px;
color: #fff;
border: 2px solid #c62127;
background: #c62127;
transition: 0.3s;
}
.btn .arrow {
transition: 0.3s;
}
.btn:hover .arrow {
transform: translateX(8px);
}
.btn:hover {
opacity: 0.8;
border: 2px solid #c62127;
background: #c62127;
}
.btn p {
color: #fff;
font-size: 16px;
font-weight: 600;
}
.heade-menu ul li,
.translate {
font-size: 16px;
font-weight: 500;
transition: 0.3s;
}
.heade-menu ul li:hover,
.translate:hover {
color: #c62127;
}
.heade-menu ul li:hover,
.translate:hover {
opacity: 0.7;
}
.about {
position: relative;
height: 90vh;
}
.about .container {
display: flex;
justify-content: space-between;
flex-direction: column;
}
.about h2.title {
width: 511px;
}
.services h2.title {
width: 990px;
}
h2.title {
font-family: Inter;
font-size: 40px;
font-style: normal;
font-weight: 700;
}
.about__number {
display: flex;
}
.about__bottom {
gap: 80px;
display: flex;
}
.about__number p,
.about__number span {
color: #c62127;
font-family: Inter;
font-size: 100px;
font-style: normal;
font-weight: 600;
line-height: normal;
}
.about__subtext {
font-family: Inter;
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: normal;
text-transform: uppercase;
}
.about-beg {
top: 50px;
position: absolute;
}
.about-beg img {
object-fit: cover;
object-position: center;
}
.services {
border-top: 2px solid rgba(1, 28, 77, 0.2);
background: #f2f2f2;
padding-top: 40px;
}
.subtitle {
font-family: Inter;
font-size: 20px;
font-weight: 500;
padding: 22px 0 0px;
}
.services-item {
display: flex;
align-items: center;
justify-content: space-between;
gap: 120px;
padding: 50px 120px;
border-radius: 20px;
background: #f9f9f9;
margin-top: 30px;
}
.serv-num {
width: 80%;
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/line.png);
background-position: center;
background-repeat: no-repeat;
background-size: contain;
padding: 52px 50px;
font-size: 200px;
font-weight: 700;
text-align: center;
text-transform: uppercase;
}
.serv-title {
margin: 20px 0 25px;
font-size: 24px;
font-weight: 700;
text-transform: uppercase;
}
.serv-left-box img {
width: 20px;
}
.serv-left-box ul li {
display: flex;
gap: 10px;
align-items: center;
margin-bottom: 15px;
}
.serv-left-box ul li p {
color: rgba(1, 28, 77, 0.6);
font-size: 18px;
font-weight: 400;
}
.serv-text {
font-size: 18px;
font-weight: 600;
text-transform: uppercase;
}
.serv-right ul li {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 15px;
}
.serv-right ul li p {
font-size: 18px;
font-weight: 500;
}
.serv-right ul li img {
width: 32px;
height: 32px;
}
.serv-right ul {
margin: 20px 0 25px;
}
.serv-left {
flex: 50%;
}
.serv-right {
flex: 50%;
}
.forms .container,
.modal-container {
display: flex;
background-color: #fff;
border-radius: 20px;
}
.forms-l {
display: flex;
justify-content: space-between;
flex-direction: column;
padding: 50px 50px 60px;
border-radius: 20px;
background: #deefff;
}
.f-img {
width: 108px;
height: 108px;
}
.social-icons {
display: flex;
gap: 30px;
margin-top: 50px;
}
.social-icons img {
width: 50px;
height: 50px;
}
section {
background-color: #f2f2f2;
padding-bottom: 120px;
}
.contact-w a {
display: flex;
align-items: center;
border-radius: 42px;
background: #011c4d;
padding: 14px 26px;
width: max-content;
gap: 5px;
transition: 0.3s;
}
.social-icons a {
transition: 0.3s;
}
.contact-w {
display: flex;
flex-direction: column;
gap: 12px;
align-items: flex-end;
}
.contact-w p {
color: #fff;
font-size: 16px;
font-weight: 600;
}
.forms-l,
.forms-r {
flex: 50%;
}
.forms-contacts {
display: flex;
justify-content: space-between;
}
.contacts-l p {
font-size: 24px;
font-style: normal;
font-weight: 500;
padding-top: 20px;
}
.forms-del p {
margin-top: 90px;
font-size: 48px;
font-style: normal;
font-weight: 500;
}
.forms-del p span {
font-size: 48px;
font-style: normal;
font-weight: 700;
}
.forms-r {
padding: 0 100px;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.forms-r p {
text-align: center;
font-size: 28px;
font-style: normal;
font-weight: 500;
}
.form {
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 50px;
}
.m_name {
width: 100%;
margin-bottom: 10px;
}
.m_name input.input {
padding: 12px 24px;
width: 100%;
color: rgba(1, 28, 77, 0.6);
font-family: Inter;
font-size: 14px;
font-style: normal;
font-weight: 400;
background-color: none;
border-radius: 50px;
background: #f9f9f9;
}
.m_name textarea::-webkit-input-placeholder,
.m_name input::-webkit-input-placeholder {
color: rgba(1, 28, 77, 0.6);
font-family: Inter;
font-size: 14px;
}
.form-btn {
cursor: pointer;
padding: 13px 55px;
border-radius: 42px;
background: #c62127;
color: #fff;
font-size: 16px;
font-weight: 600;
width: max-content;
margin-top: 70px;
transition: 0.3s;
}
.form-btn:hover {
opacity: 0.8;
}
.navigation_btn-img img {
width: 65px;
height: 65px;
cursor: pointer;
}
.slide-wrap {
position: relative;
}
.navigation_btn-img {
display: flex;
width: 100%;
justify-content: space-between;
position: absolute;
z-index: 2;
top: 50%;
padding: 0 20px;
}
.r-title {
display: flex;
align-items: center;
gap: 14px;
justify-content: center;
margin-bottom: 30px;
}
.r-icon {
width: 40px;
height: 40px;
}
.revies .title {
text-align: center;
}
.rev-mark {
display: flex;
gap: 10px;
justify-content: center;
margin-top: 10px;
margin-bottom: 30px;
}
.rev-mark img {
width: 100px;
height: 17px;
}
.rev-mark p {
font-size: 14px;
font-weight: 500;
}
.faq-item {
position: relative;
transition: 0.5s;
cursor: pointer;
border-radius: 20px;
background: #f9f9f9;
padding: 19px 19px 19px;
margin-top: 10px;
}
.a-top {
display: flex;
justify-content: space-between;
align-items: center;
}
.a-close {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 30px;
height: 30px;
transition: 0.3s;
}
.a-close span {
position: absolute;
font-size: 30px;
font-style: normal;
font-weight: 600;
}
.a-close span:nth-child(2) {
transform: rotate(90deg) translateX(2.5px) translateY(-2.5px);
transition: 0.3s;
}
.active .a-close span:nth-child(2) {
transform: rotate(0) translateX(0) translateY(0);
}
.active .a-bottom {
height: auto;
}
.a-bottom {
height: 0;
overflow: hidden;
width: 90%;
font-size: 16px;
}
.faq-item h3 {
font-size: 20px;
font-weight: 600;
}
.faq {
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/bg-down.png);
background-repeat: no-repeat; padding-top: 280px;
background-size: cover;
}
.faq-left p {
margin-top: 30px;
font-size: 18px;
font-weight: 500;
}
.faq-container {
display: flex;
gap: 30px;
justify-content: space-between;
}
.recomend {
padding-bottom: 20px;
}
.faq-left,
.faq-right {
width: 48%;
}
.faq .form-btn {
margin-top: 60px;
}
.w-l-background{
position: absolute;
bottom:0;
right:0;
width: 90%
}
.w-l {
height: 480px;
margin-right: 50px;
border-radius: 20px;
position:relative;
background: #deefff; position: sticky;
top: 100px;
}
.why_content {
display: flex;
justify-content: space-between;
border-top: 2px solid rgba(1, 28, 77, 0.2);
padding-top: 40px; }
.w-l,
.w-r {
width: 50%;
}
.w-l__wrap {
width: 430px;
padding: 50px 0 0 50px;
}
.btn-blue {
color: #fff;
font-size: 16px;
font-weight: 600;
transition: 0.3s;
padding: 15px 38px;
border-radius: 42px;
background: #011c4d;
width: max-content;
display: block;
margin-top: 40px;
}
.btn-blue:hover {
opacity: 0.8;
}
.w-r {
border-left: 2px solid rgba(1, 28, 77, 0.2);
position: relative;
}
.w-r__item::before {
content: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%2210%22%20fill%3D%22%23DEEFFF%22%2F%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%224%22%20fill%3D%22%23011C4D%22%2F%3E%3C%2Fsvg%3E");
position: absolute;
left: -11px;
}
.w-r__item {
padding-left: 40px;
margin-bottom: 40px;
}
.w-r__title {
font-size: 20px;
font-weight: 600;
}
.w-r__text {
padding-top: 10px;
font-size: 18px;
font-weight: 400;
}
.tab-work__content {
display: flex;
gap: 15px;
margin: 40px 0 30px;
padding-left: 85px;
}
.tab_work-item {
cursor: pointer;
padding: 15px 48px;
color: rgba(1, 28, 77, 0.6);
font-size: 16px;
font-weight: 600;
border-radius: 42px;
background: #fff;
transition: 0.4s all;
}
.tab_work-item.active {
color: #011c4d;
background: #deefff;
}
.swiper.mySwiperWork2 {
position: absolute;
z-index: 80;
bottom: 30px;
height: 100px;
width: 100%;
padding: 0 100px;
}
.tab_apparat-item.active {
opacity: 1;
z-index: 1;
position: relative;
}
.work-slider__content {
position: relative;
overflow: hidden;
}
.work-slider__item {
position: absolute;
opacity: 0;
z-index: -1;
top: 0;
overflow: hidden;
transition: opacity 1s ease-out;
}
.work-slider__item.active {
position: relative;
opacity: 1;
z-index: 1;
}
.work-left {
position: relative;
display: flex;
justify-content: center;
}
.mySwiperWork2 img {
object-fit: cover;
height: 100%;
border-radius: 20px; }
.swiper-slide__flex {
display: flex;
gap: 20px;
padding: 0 85px;
}
.work-left,
.work-right {
width: 50%;
}
.work .navigation_btn-img {
padding: 0 0px;
}
.mySwiperWork img {
border-radius: 20px;
}
.work-right {
padding: 70px 35px 10px;
border-radius: 20px;
background: #f9f9f9;
}
h3.work-r__title {
color: #c62127;
font-size: 24px;
font-weight: 700;
margin-bottom: 30px;
}
.work-container {
border-top: 2px solid rgba(1, 28, 77, 0.2);
padding-top: 40px;
}
.work-title {
display: flex;
justify-content: space-between;
gap: 60px;
}
.work-title .title {
min-width: max-content;
}
.work-title p {
padding-right: 85px;
font-size: 18px;
}
.how-del_container {
display: flex;
gap: 20px;
flex-wrap: wrap;
justify-content: space-between;
}
.how-del-item {
width: 32%;
border-radius: 20px;
padding: 30px 30px;
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 10px;
height: 350px;
}
.h-bottom {
display: flex;
width: 100%;
justify-content: flex-end;
}
.h-bottom.end {
display: flex;
width: 100%;
justify-content: space-between;
align-items: flex-end;
gap: 20px;
}
.h-bottom.end .form-btn {
padding: 13px 30px;
min-width: max-content;
margin-top: 30px;
}
.how-del-item.item-1 {
align-items: start;
justify-content: center;
}
.hov-del-el:nth-child(even) {
background: #deefff;
}
.hov-del-el:nth-child(odd) {
background: #f9f9f9;
}
.h-num {
color: #011c4d;
font-size: 36px;
font-weight: 700;
text-transform: uppercase;
}
.how-title {
font-size: 20px;
font-weight: 600;
margin-bottom: 20px;
}
p.span {
color: rgba(1, 28, 77, 0.6);
font-size: 16px;
font-weight: 400;
margin-bottom: 10px;
}
.h-top li,
.how-text {
margin-bottom: 10px;
font-size: 18px;
font-weight: 400;
}
.r_top img {
width: 100px;
height: 16px;
}
.r_top {
display: flex;
gap: 10px;
}
.r_top p {
font-size: 14px;
font-weight: 500;
}
h1.title-1 {
color: #011c4d;
font-size: 40px;
font-weight: 700;
margin: 20px 0 30px;
}
h1.title-1 span {
color: #c62127;
font-size: 40px;
font-weight: 700;
}
.hero-c {
display: flex;
gap: 20px;
align-items: center;
margin-bottom: 20px;
}
.hero-c img {
height: 20px;
width: 20px;
}
.hero-b {
margin-top: 80px;
display: flex;
align-items: center;
gap: 24px;
}
.hero-b .btn-blue,
.hero-b .form-btn {
margin-top: 0;
}
.hero-container {
display: flex;
align-items: center;
}
.hero-l,
.hero-r {
width: 50%;
}
.hero-l {
position: relative;
}
.herol-l-img {
display: flex;
gap: 15px;
justify-content: center;
position: relative;
z-index: 1;
}
.herol-l-img img {
position: relative;
width: 230px;
height: 545px;
}
.herol-l-img img:nth-child(2) {
transform: translateY(84px);
}
.herol-l-img2 {
position: absolute;
top: 0;
width: 100%;
height: 100%;
z-index: 2;
}
.herol-l-img2 img {
position: absolute;
display: block;
width: 249px;
height: 125px;
}
.herol-l-img2 img:nth-last-child(1) {
top: -60px;
left: 15px;
}
.herol-l-img2 img:nth-last-child(2) {
bottom: -40px;
left: -50px;
}
.herol-l-img2 img:nth-last-child(3) {
right: 0;
}
.herol-l-img2 img:nth-last-child(4) {
right: 0;
bottom: 70px;
}
.hero {
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/bg-top.png);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
padding-top: 190px;
padding-bottom: 300px;
}
.menu-mob {
display: none;
}
.modal {
width: 100%;
height: 100vh;
opacity: 0;
position: fixed;
z-index: -10;
display: block;
top: 0;
scale: 1.1;
background: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(7.5px);
-webkit-backdrop-filter: blur(7.5px);
transition: 0.3s all;
}
.modal.modal_active {
opacity: 1;
z-index: 22;
top: 0;
scale: 1;
}
.form-wrap-content-close {
display: flex;
justify-content: flex-end;
margin-bottom: -50px;
padding: 0 20px;
z-index: 2;
}
.close_el {
cursor: pointer;
font-size: 30px;
font-weight: 500;
color: #000000;
}
.modal-wrap.container {
display: flex;
flex-direction: column;
justify-content: center;
z-index: -1;
}
.m_open {
cursor: pointer;
}
.swiper-button-lock {
display: flex !important;
}
.wpcf7-spinner {
display: block;
}
.how-del-item ul {
list-style: disc;
margin-left: 15px;
}
.contact-w-social{
display:flex;
flex-direction: row-reverse;
gap:5px;
align-items: center;
}
.contact-w a.wechat {
display: block;
width: 50px;
height: 50px;
padding: 0;
background: #1a386f00;
}
.work-r__text p{
padding-bottom: 10px;
}
.swiper-slide img {
border-radius: 20px;
} .slide-revies img {
-webkit-filter: grayscale(100%); 
filter: grayscale(100%);
height:100%
}
.instaSwiper img, .slide-revies img, .slide-recomend img{
height:100%;
}.hero-about__list img {
width: 39px;
}
.hero-about__inner {
display: flex;
gap: 20px;
justify-content: space-between;
}
.hero-about__item {
flex: 1;
}
.hero-about__title {
font-size: 40px;
font-weight: 700;
margin-bottom: 30px;
}
.red {
color: #c62127;
}
.hero-about__text {
font-size: 20px;
margin-bottom: 35px;
font-weight: 600;
line-height: 130%; }
.hero-about__list li {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
}
.hero-about__list p {
font-size: 18px;
font-weight: 700;
line-height: 130%; text-transform: uppercase;
}
.hero-about__subtitle {
font-size: 24px;
font-weight: 600;
line-height: 130%; margin-bottom: 15px;
}
.hero-about__subtext {
font-size: 18px;
line-height: 130%; margin-bottom: 15px;
}
.hero-about {
padding-bottom: 270px;
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/bg-top.png);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
padding-top: 110px;
}
.hero-about__image {
width: 70%;
}
.double__inner {
display: flex;
justify-content: space-between;
align-items: flex-end;
gap: 10px;
}
.double__title {
font-size: 40px;
font-weight: 700;
margin-bottom: 40px;
}
.double__text {
font-size: 18px;
line-height: 130%; margin-bottom: 10px;
}
.double__text:first-child {
margin-bottom: -20px;
}
.double__right {
display: flex;
gap: 20px;
}
.double__it {
border-radius: 20px;
background: #fff;
padding: 30px 30px 0 30px;
}
.double__it:last-child {
background: #deefff;
}
.double__it h4 {
color: #c62127;
display: flex;
gap: 5px;
align-items: center;
font-size: 20px;
font-weight: 600;
line-height: 130%; margin-bottom: 5px;
}
.double__it p {
font-weight: 600;
line-height: 130%; margin-bottom: 18px;
}
.double__it span {
color: rgba(1, 28, 77, 0.6);
font-size: 18px;
line-height: 130%; }
.double__left {
flex: 2;
}
.double__right {
flex: 3;
}
.double__it h4 img {
width: 20px;
height: 20px;
}
.license__inner {
padding: 55px 120px 55px 50px;
border-radius: 20px;
background: #f9f9f9;
display: flex;
justify-content: space-between;
gap: 40px;
align-items: center;
}
.license__left {
display: flex;
justify-content: space-between;
flex-direction: column;
gap: 60px;
flex: 1;
}
.license__title {
font-size: 40px;
margin-bottom: 30px;
font-weight: 700;
}
.license__text {
font-size: 20px;
margin-top: 20px;
line-height: 130%;
}
.license__list li {
display: flex;
gap: 10px;
align-items: center;
margin-bottom: 15px;
}
.license__list img {
width: 30px;
height: 30px;
}
.license__list p {
font-size: 18px;
font-weight: 500;
line-height: 130%; }
.license__right {
flex: 1;
display: flex;
justify-content: flex-end;
gap: 20px;
}
.insta__arrows {
position: absolute;
top: 50%;
left: 50%;
translate: -50% -50%;
display: flex;
justify-content: space-between;
width: 98%;
z-index: 2;
}
.insta__arrow {
background-color: #f9f9f9;
width: 65px;
height: 65px;
cursor: pointer;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
.insta__arrow:last-child {
rotate: 180deg;
}
.insta__bottom {
margin-top: 45px;
position: relative;
}
.insta__top {
display: flex;
flex-direction: column;
align-items: flex-end;
flex-direction: column;
}
.insta__title {
margin-bottom: 5px;
text-align: right;
font-size: 40px;
font-weight: 700;
line-height: 130%; }
.insta__link {
text-align: right;
font-size: 40px;
font-weight: 700;
line-height: 130%; }
.insta {
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/bg-down.png);
background-repeat: no-repeat;
background-size: cover;
padding-top: 180px;
}
.footer__inner {
display: flex;
justify-content: space-between;
padding: 50px 0 40px;
}
.footer__item {
display: flex;
flex-direction: column;
justify-content: space-between;
}
.footer__text {
font-size: 14px;
font-weight: 500;
}
.footer__list {
display: flex;
flex-direction: column;
justify-content: space-between;
gap: 10px;
height: 100%;
}
.input {
border-radius: 550px;
background: #f9f9f9;
padding: 10px 20px;
width: 100%;
}
.footer__form-wrap {
margin-bottom: 10px;
}
.footer__form-text {
margin-bottom: 15px;
text-align: center;
font-weight: 500;
line-height: 130%; }
.footer__form {
width: 466px;
}
.footer__form-btn {
cursor: pointer;
padding: 13px 55px;
border-radius: 42px;
background: #c62127;
color: #fff;
font-size: 16px;
font-weight: 600;
width: max-content;
margin: 0 auto;
transition: 0.3s;
display: block;
}
.hero-about__left {
padding: 70px 0;
}
.about-beg svg {
width: 100%;
}
.about-beg {
width: 100%;
}
.forms {
overflow: hidden;
}
.hero-contact {
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/hero-contact-bg.png);
background-repeat: no-repeat;
background-size: cover;
background-position: bottom;
padding-top: 110px;
}
.hero-contact__inner {
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
margin-bottom: 50px;
}
.hero-contact__title {
font-size: 40px;
font-weight: 700;
}
.hero-contact__col {
flex-direction: column;
display: flex;
align-items: flex-end;
gap: 20px;
}
.hero-contact__col p {
display: flex;
align-items: center;
gap: 10px;
}@media screen and (max-width: 1480px) {
.container {
width: 1220px;
}
.herol-l-img img {
width: 200px;
height: 455px;
}
.herol-l-img2 img {
width: 195px;
height: 102px;
}
.herol-l-img2 img:nth-last-child(4) {
right: 0;
bottom: 30px;
}
.herol-l-img2 img:nth-last-child(2) {
bottom: -10px;
left: -35px;
}
.herol-l-img img:nth-child(2) {
transform: translateY(55px);
}
.how-del-item {
height: 405px;
}
h2.title {
font-size: 35px;
}
.about__number p,
.about__number span {
font-size: 85px;
}
.about__subtext {
font-size: 23px;
}
.serv-title {
font-size: 22px;
}
.serv-left-box ul li p,
.serv-right ul li p {
font-size: 17px;
}
.forms-del p span,
.forms-del p {
font-size: 40px;
}
.contacts-l p {
font-size: 21px;
}
.hero {
padding-top: 140px;
padding-bottom: 230px;
}
}
@media screen and (max-width: 1240px) {
.container {
width: 900px;
}
.menu-mob {
position: relative;
z-index: 20;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
}
.hamburger {
width: 30px;
display: flex;
flex-direction: column;
align-items: flex-end;
}
.hamburger span {
border-radius: 30px;
display: block;
height: 3px;
width: 25px;
background-color: #000;
transition: 0.5s all;
margin-bottom: 8px;
}
.hamburger span:nth-child(2) {
width: 15px;
}
.hamburger.active span:nth-child(1) {
display: none;
}
.hamburger.active span:nth-child(2) {
width: 25px;
transform: translateY(2px) rotate(-45deg);
}
.hamburger.active span:nth-child(3) {
transform: translateX(0px) translateY(-8px) rotate(45deg);
}
nav.burger_list {
position: fixed;
width: 100vw;
height: 100vh;
background: linear-gradient(180deg, #deefff 0%, #f2f2f2 72%, #f2f2f2 100%);
background-repeat: no-repeat;
background-position: bottom;
left: -100vw;
top: 0;
z-index: 1;
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: column;
transition: 0.5s all;
gap: 20px;
padding-top: 100px;
}
nav.burger_list.active {
left: 0;
}
.translate {
margin-top: 80px;
}
.burger_list.heade-menu ul,
.header-navigation {
display: flex;
flex-direction: column;
gap: 30px;
align-items: flex-start;
width: 85%;
}
.heade-menu ul a {
width: 100%;
}
.b-m {
display: none;
}
.hero .form-btn,
.hero .btn-blue {
min-width: max-content;
}
.hero .btn-blue {
padding: 11px 20px;
}
.hero .form-btn {
padding: 11px 20px;
}
.how-del-item {
height: auto;
}
.how-del-item {
width: 48%;
}
.how-title {
font-size: 18px;
font-weight: 600;
margin-bottom: 15px;
}
.work-title {
gap: 20px;
display: flex;
justify-content: space-between;
flex-direction: column;
}
.work-title .title {
min-width: auto;
}
.tab-work__content {
padding-left: 0px;
}
.work-title p {
padding-right: 20px;
font-size: 18px;
}
.swiper-slide__flex {
padding: 0 0px;
flex-direction: column;
}
.swiper.mySwiperWork2 {
padding: 0px 80px 0px 100px;
}
.work .navigation_btn-img {
padding: 0 0px;
position: static;
justify-content: center;
margin-top: 20px;
gap: 30px;
}
.work-left,
.work-right {
width: 100%;
}
.work-left {
height: 495px;
}
.mySwiperWork img {
height: 100%;
object-fit: cover;
}
.work-right {
padding: 30px 35px 25px;
border-radius: 20px;
background: #f9f9f9;
}
.w-l__wrap {
width: 420px;
}
p.a-bottom {
height: 0;
overflow: hidden;
width: 90%;
font-size: 14px;
}
.faq-item h3 {
font-size: 16px;
font-weight: 600;
}
.faq-left p {
font-size: 16px;
}
.services-item {
gap: 46px;
padding: 40px 30px;
}
.serv-num {
width: 80%;
font-size: 180px;
padding: 15px 50px;
}
section {
padding-bottom: 95px;
}
.forms-l {
padding: 45px 15px 35px 35px;
}
.contact-w p {
font-size: 14px;
font-weight: 600;
}
.contact-w a {
padding: 12px 14px;
}
.forms-del p span,
.forms-del p {
font-size: 28px;
}
.forms-del p {
margin-top: 50px;
}
.social-icons {
margin-top: 27px;
}
.social-icons img {
width: 40px;
height: 40px;
}
.contacts-l p {
font-size: 14px;
}
.form-btn {
padding: 13px 40px;
border-radius: 42px;
font-size: 16px;
margin-top: 14px;
}
.forms-r {
padding: 0 35px 10px 25px;
}
.forms-r p {
font-size: 24px;
}
.navigation_btn-img img {
width: 40px;
height: 40px;
}
.services h2.title {
width: auto;
}
}
@media screen and (max-width: 920px) {
.container {
width: 750px;
}
h1.title-1,
h1.title-1 span {
font-size: 27px;
}
.h-top li,
.how-text {
margin-bottom: 10px;
font-size: 14px;
font-weight: 400;
}
.h-bottom.end .form-btn {
margin: 20px 0 0px;
}
.hero .form-btn,
.hero .btn-blue {
margin: 0;
}
.herol-l-img img {
width: 150px;
height: 344px;
}
.herol-l-img2 img {
width: 151px;
height: 77px;
}
.hero-c p {
font-size: 14px;
}
.herol-l-img2 img:nth-last-child(2) {
bottom: -10px;
left: -15px;
}
.herol-l-img {
display: flex;
gap: 10px;
justify-content: center;
}
.herol-l-img img:nth-child(2) {
transform: translateY(40px);
}
p.span {
font-size: 14px;
margin-bottom: 10px;
}
.tab_work-item {
cursor: pointer;
font-size: 14px;
padding: 12px 30px;
min-width: max-content;
}
h3.work-r__title {
color: #c62127;
font-size: 18px;
font-weight: 700;
margin-bottom: 15px;
}
.work-r__text {
font-size: 14px;
}
.tab-work__content {
overflow: auto;
}
.w-l__wrap {
width: auto;
padding: 40px 0 0 40px;
}
.w-r__title {
font-size: 18px;
}
.w-r__text {
font-size: 16px;
}
.faq .form-btn {
margin-top: 30px;
}
.faq-left p {
margin-top: 20px;
}
.about__number p,
.about__number span {
font-size: 65px;
}
.about__subtext {
font-size: 18px;
}
.about {
height: 60vh;
}
section {
padding-bottom: 80px;
}
h2.title {
font-size: 29px;
}
.subtitle {
font-size: 16px;
}
.serv-left-box ul li p,
.serv-right ul li p {
font-size: 15px;
}
.serv-title {
font-size: 17px;
}
.serv-text {
font-size: 16px;
}
.btn {
padding: 10px 16px;
border-radius: 50px;
}
.serv-num {
width: 80%;
font-size: 150px;
padding: 15px 10px;
}
.serv-right ul li img {
width: 25px;
height: 25px;
}
.forms .container,
.modal-container {
display: flex;
background-color: #fff;
border-radius: 20px;
flex-direction: column;
}
.form-btn {
padding: 13px 40px;
margin-top: 15px;
margin-bottom: 15px;
}
.forms-r {
padding: 35px 35px 10px 35px;
}
.form {
width: 80%;
display: flex;
flex-direction: column;
align-items: center;
margin-top: 50px;
}
.forms-l {
padding: 45px 35px 35px 35px;
}
.contacts-l p {
font-size: 16px;
}
.forms-del p {
margin-top: 30px;
}
.modal_active .form-content.modal_content {
top: 0;
overflow: scroll;
z-index: 1;
padding: 30px;
}
.hero {
padding-top: 100px;
padding-bottom: 200px;
}
}
@media screen and (max-width: 770px) {
.container {
width: 560px;
}
.container.hero-container {
display: flex;
flex-direction: column;
align-items: normal;
gap: 25px;
justify-content: space-between;
padding-bottom: 68px;
}
.hero-l,
.hero-r {
width: 100%;
}
h1.title-1,
h1.title-1 span {
font-size: 23px;
}
.hero-b {
margin-top: 40px;
display: flex;
align-items: center;
gap: 15px;
}
.hero .form-btn,
.hero .btn-blue {
font-size: 14px;
}
.herol-l-img img {
width: 110.631px;
height: 257.343px;
}
.herol-l-img2 img {
width: 148.063px;
height: 76.875px;
}
.herol-l-img2 img:nth-last-child(1) {
top: -30px;
left: 60px;
}
.herol-l-img2 img:nth-last-child(2) {
bottom: -4px;
left: 33px;
}
.herol-l-img2 img:nth-last-child(3) {
right: 36px;
}
.herol-l-img2 img:nth-last-child(4) {
right: 36px;
bottom: 30px;
}
.r_top p {
font-size: 12px;
}
.r_top img {
width: 89px;
height: 14px;
}
h1.title-1 {
margin: 10px 0 20px;
}
.r_top {
align-items: center;
}
.how-del-item {
width: 100%;
}
.swiper.mySwiperWork2 {
padding: 0px 20px 0px 20px;
}
.mySwiperWork2 .swiper-slide {
display: flex;
justify-content: center;
}
.work-title p {
padding-right: 0px;
font-size: 14px;
}
.work-right {
padding: 20px 20px;
}
.navigation_btn-img {
padding: 0 0px;
position: static;
justify-content: center;
margin-top: 10px;
gap: 20px;
}
.swiper.mySwiperWork2 {
padding: 0px 60px 0px 80px;
}
.why_content {
display: flex;
flex-direction: column;
gap: 20px;
}
.container.work-container {
padding-top: 20px;
}
.w-l {
position: relative;
top: 0;
}
.w-l,
.w-r {
width: 100%;
}
.faq-left,
.faq-right {
width: 100%;
}
.a-top {
gap: 10px;
}
.faq {
background-position: top right;
padding-top: 125px;
}
.faq-container {
display: flex;
gap: 0px;
justify-content: space-between;
flex-direction: column;
}
.about__bottom {
padding-top: 50px;
gap: 25px;
display: flex;
flex-direction: column;
}
.about {
height: auto;
}
h2.title {
font-size: 25px;
}
.about__number p,
.about__number span {
font-size: 55px;
}
.services-item {
gap: 20px;
padding: 30px 23px;
}
.serv-left-box ul li p,
.serv-right ul li p {
font-size: 14px;
}
.serv-num {
width: 100%;
font-size: 120px;
padding: 15px 10px;
}
.services-item {
display: flex;
align-items: flex-start;
flex-direction: column;
}
.serv-right,
.serv-left {
width: 100%;
}
.r-icon {
width: 31px;
height: 31px;
}
.contact-w a.wechat {
width: 40px;
height: 40px;
}
}
@media screen and (max-width: 585px) {
.container {
width: 100%;
padding: 0 20px;
}
.h-num {
font-size: 28px;
}
.how-title {
font-size: 16px;
}
h1.title-1,
h1.title-1 span {
font-size: 21px;
}
.swiper.mySwiperWork2 {
padding: 0px 10px 0px 20px;
}
.container.why_content {
padding-top: 20px;
}
.w-r__title {
font-size: 16px;
}
.w-r__text {
font-size: 14px;
}
.w-r__item {
padding-left: 25px;
margin-bottom: 25px;
}
.w-l {
height: 345px;
}
.btn-blue {
padding: 11px 20px;
margin-top: 25px;
}
.faq-item h3,
.faq-left p {
font-size: 15px;
}
.about h2.title {
width: auto;
}
h2.title {
font-size: 18px;
}
.form-btn {
padding: 13px 30px;
font-size: 14px;
}
.how-del-item {
padding: 20px 20px;
}
.about__number p,
.about__number span {
font-size: 45px;
}
.serv-title {
font-size: 16px;
}
.forms .container,
.modal-container {
background-color: #f2f2f2;
}
.forms-r {
margin-top: -20px;
padding: 55px 15px 10px 15px;
background-color: #fff;
border-radius: 0 0 20px 20px;
}
.forms-l {
position: relative;
z-index: 2;
}
.forms-del p span,
.forms-del p {
font-size: 20px;
}
.forms-r p {
font-size: 16px;
}
.form {
margin-top: 30px;
}
.contacts-l {
display: flex;
gap: 15px;
align-items: center;
}
.f-img {
width: 69px;
height: 69px;
}
.contacts-l p {
flex: 50%;
padding-top: 0;
font-size: 14px;
}
.forms-contacts {
gap: 20px;
flex-direction: column;
}
.contact-w {
align-items: flex-start;
}
.hero {
padding-top: 90px;
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/hero-about-mobile.png);
padding-bottom: 160px;
}
.modal_active .form-content.modal_content {
padding: 10px 0;
}
.hero .form-btn,
.hero .btn-blue {
font-size: 12px;
}
.wpcf7-response-output {
bottom: 0px;
}
}
@media screen and (max-width: 515px) {
.contacts-l p {
font-size: 14px;
}
.logo {
width: 118px;
height: 28.606px;
}
.header .btn p {
font-size: 10px;
font-weight: 600;
}
.header .btn {
padding: 10px 10px;
min-width: max-content;
}
.header .arrow {
width: 15px;
height: 15px;
}
h1.title-1,
h1.title-1 span {
font-size: 18px;
}
.herol-l-img2 img:nth-last-child(1) {
top: -30px;
left: 0px;
}
.herol-l-img2 img:nth-last-child(2) {
bottom: -4px;
left: 0px;
}
.herol-l-img2 img:nth-last-child(3) {
right: 0;
}
.herol-l-img2 img:nth-last-child(4) {
right: 0;
}
.w-l__wrap {
width: auto;
padding: 35px 0 0 20px;
}
.forms-del p span,
.forms-del p {
font-size: 18px;
}
.form {
width: 100%;
}
section {
padding-bottom: 50px;
}
.forms-l {
padding: 45px 15px 35px 15px;
}
.serv-text {
font-size: 14px;
}
}
@media screen and (max-width: 450px) {
.contact-w a.wechat {
width: 35px;
height: 35px;
}
.herol-l-img img {
width: 100px;
height: auto;
}
.herol-l-img2 img {
width: 140px;
height: auto;
}
.hero-b {
gap: 6px;
}
.container.hero-container {
gap: 53px;
padding-bottom: 30px;
}
section.hero {
background-repeat: no-repeat;
background-size: cover;
background-position: bottom right;
}
.social-icons {
gap: 20px;
margin-top: 20px;
}
.social-icons img {
width: 35px;
height: 35px;
}
.btn p {
color: #fff;
font-size: 14px;
font-weight: 600;
}
.form-btn {
padding: 11px 30px;
margin-top: 15px;
margin-bottom: 35px;
}
}
@media screen and (max-width: 400px) {
.hero-c {
display: flex;
gap: 10px;
align-items: center;
margin-bottom: 12px;
}
.container.hero-container {
gap: 45px;
padding-bottom: 30px;
}
.h-bottom.end .form-btn {
padding: 10px 15px;
font-size: 14px;
min-width: max-content;
margin-top: 30px;
}
}
@media screen and (max-width: 375px){
.hero-b {
flex-wrap: wrap;
}
}
@media (max-height: 700px) and (max-width: 900px) {
.about {
height: 75vh;
}
}@media screen and (max-width: 1220px) {
.footer__inner {
flex-wrap: wrap;
gap: 40px 20px;
}
}
@media screen and (max-width: 1040px) {
.hero-about__title {
font-size: 34px;
}
.license__list p,
.license__text,
.hero-about__subtext,
.hero-about__list p,
.hero-about__text {
font-size: 16px;
}
.double__inner {
flex-direction: column;
}
.hero-about {
padding-bottom: 120px;
background-position: right;
}
.license__inner {
flex-direction: column;
padding: 30px;
}
.insta {
padding-top: 60px;
}
.double__right {
flex: 100%;
width: 100%;
}
.double__it {
flex: 1;
}
.hero-contact__title {
font-size: 30px;
}
.faq {
background-position: top;
padding-top: 200px;
}
}
@media screen and (max-width: 840px) {
.hero-about__inner {
flex-direction: column;
}
.hero-about__left {
padding: 0;
}
.hero-about .hero-b {
margin-top: 20px;
flex-direction: row;
}
.hero-about .form-btn {
margin-bottom: 0;
}
.hero-about__image {
width: 50%;
}
.hero-about__list li {
margin-bottom: 10px;
}
.hero-about__text {
margin-bottom: 20px;
}
.insta__title,
.license__title,
.double__title {
margin-bottom: 20px;
font-size: 32px;
}
.double__text {
font-size: 16px;
}
.license__left {
gap: 20px;
}
.insta {
padding-top: 150px;
background-position: top;
}
.insta__link {
font-size: 32px;
}
.footer__inner {
gap: 20px;
}
.footer__item:last-child,
.footer__item:first-child {
width: 100%;
}
.footer__item:nth-child(3),
.footer__item:nth-child(2) {
width: 42%;
}
.footer__item {
gap: 10px;
}
.footer__form {
width: 100%;
}
.footer__inner {
padding: 40px 20px;
}
.insta__arrows {
position: relative;
top: 0;
left: 0;
translate: 0;
display: flex;
justify-content: center;
gap: 20px;
margin-top: 20px;
}
.insta__arrow {
width: 50px;
height: 50px;
}
.footer__form-text {
text-align: left;
}
.hero-contact__inner {
grid-template-columns: 1fr;
gap: 20px;
}
.hero-contact__col {
align-items: flex-start;
gap: 10px;
}
.hero-contact__title {
font-size: 24px;
} }
@media screen and (max-width: 600px) {
.work-left {
height: 400px;
}
.license__list p,
.license__text,
.hero-about__subtext,
.hero-about__list p,
.hero-about__text {
font-size: 14px;
}
.hero-about__title {
font-size: 18px;
}
.hero-about .btn-blue,
.hero-about .form-btn {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
padding: 13px 10px;
font-size: 12px;
}
.hero-about__image {
width: 100%;
}
.insta__title,
.license__title,
.double__title {
font-size: 18px;
}
.hero-about {
background-image: url(//roma-global.com/wp-content/themes/romaTheme/assets/images/hero-about-mobile.png);
padding-bottom: 200px;
}
.double__right {
flex-direction: column;
}
.double__it {
display: grid;
grid-template-columns: 1fr 1fr;
padding: 0 15px;
}
.double__it span,
.double__it p {
font-size: 12px;
}
.double__it h4 {
font-size: 14px;
}
.double__it div {
display: flex;
flex-direction: column;
justify-content: center;
}
.insta__link {
margin-top: -10px;
font-size: 16px;
}
.hero-contact__title {
font-size: 18px;
}
.hero-contact__col p {
font-size: 14px;
}
.about-beg {
width: 200%;
right: -100px;
}
.about {
overflow: hidden;
}
}