/*@use "variables" as *; @use "media-query" as *;*/ .Process_main_new{ .Process_inner_new{ .Process_mainboth_new{ .Process_innerboth_new{ text-align: center; .Process_innerboth_maintext_new{ padding-bottom: 16px; .Process_innerboth_innertext_new{ font-size: 18px; font-weight: 500; line-height: 120%; text-transform: uppercase; font-family: var(--font-gopher--family); } } } } .Process_mainloop_new {padding-top:56px; .Process_innerloop_new{display:flex; grid-gap: 16px; flex-wrap: wrap; .Process_mainblock_new{height: auto; cursor: pointer; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; -ms-transition: all .3s linear; transition: all .3s linear; .Process_innerblock_new{height: 100%; position: relative; transition: transform 0.8s; transform-style: preserve-3d; transform: rotateY(0); .Process_innerblock_mainstatic_new{ min-height: 320px; height: 100%; width:100%; display: flex; align-items:center; z-index:2; justify-content: center; padding: 10px; position: relative; -webkit-backface-visibility: hidden; backface-visibility: hidden; .Process_innerblock_innerstatic_new{ .Process_innerblock_innerstatic_icons_new{position:absolute; top:24px; right:24px; svg{ width:40px; height: auto; } } .Process_innerblock_innerstatic_title_new{text-align: center; font-family: var(--font-gopher--family); font-size: 24px; font-weight: 500; line-height: 128%; text-transform: uppercase;} } } .Process_innerblock_mainhovers_new{ transform: rotateY(180deg); -webkit-backface-visibility: hidden; backface-visibility: hidden; min-height: 320px; display:flex; align-items:center; justify-content:center; padding:10px; position:absolute; z-index:1; width:100%; height:100%; top:0; left:0; background:#060709; .Process_innerblock_innerhovers_new{ .Process_innerblock_innerhovers_icons_new{position: absolute; top:24px; right:24px; svg{ width:40px; height: auto; } } .Process_innerblock_innerhovers_infos_new{text-align: center; font-family: var(--font-gopher--family); font-size: 18px; font-weight: 500; line-height: 120%; max-width: 272px; margin: auto; p{margin: 0px 0px 16px 0px; &:last-child{margin: 0px;} } } } } } .Process_innerblock_new.fliped { transform: rotateY(180deg); } } .Process_desktop_25_new{ width:calc(25% - 12px); } .Process_desktop_50_new{ width:calc(50% - 8px); } .Process_mainmedia_new{ height: auto; .Process_innermedia_new{ position:relative; padding-bottom: 100%; height:100%; img{width:100%; position:absolute; object-fit:cover; top:0; left:0; bottom:0; right:0; height:100%; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; -ms-transition: all .3s linear; transition: all .3s linear; } video{width:100%; position:absolute; object-fit:cover; top:0; left:0; bottom:0; right:0; height:100%; -webkit-transition: all .3s linear; -moz-transition: all .3s linear; -o-transition: all .3s linear; -ms-transition: all .3s linear; transition: all .3s linear; } } } .Process_mainitems_new{ display:flex; align-items:center; justify-content:center; height: auto; .Process_inneritems_new{ .Process_inneritems_mainboth_new{ .Process_inneritems_innerboth_new{display:flex; max-width:528px; margin: auto; .Process_inneritems_innerboth_icon_new{width:16px; margin-top: 7px; img{width: 100%; height: auto;} } .Process_inneritems_innerboth_info_new{text-align: center; font-size:24px; width: calc(100% - 16px); padding-left:8px; font-weight:500; line-height: 128%; font-family: var(--font-gopher--family); p{margin: 0px 0px 16px 0px; &:last-child{margin: 0px;} } } } } .Process_inneritems_mainbutton_new{ padding-top: 16px; .Process_inneritems_innerbutton_new{ a{ min-width:184px; } } } } } } } } } @media(min-width:0px) and (max-width:749px){ .Process_main_new{ .Process_inner_new{ .Process_mainboth_new{ .Process_innerboth_new{ max-width:335px; margin: auto; .Process_innerboth_maintitle_new{ .Process_innerboth_innertitle_new{ *{ font-size: 32px; line-height: 112%; } } } } } .Process_mainloop_new { padding-top:32px; .Process_innerloop_new{grid-gap: 8px; .Process_mainblock_new{ .Process_innerblock_new{ .Process_innerblock_mainstatic_new{ min-height: 160px; .Process_innerblock_innerstatic_new{ .Process_innerblock_innerstatic_icons_new{top:4px; right:4px; svg{ width:24px; } } .Process_innerblock_innerstatic_title_new{ font-size: 18px; line-height: 120%; } } } .Process_innerblock_mainhovers_new{ min-height: 160px; .Process_innerblock_innerhovers_new{ .Process_innerblock_innerhovers_icons_new{ top:4px; right:4px; svg{ width:24px; } } .Process_innerblock_innerhovers_infos_new{ font-size: 12px; p{margin: 0px 0px 8px 0px; &:last-child{margin: 0px;} } } } } } } .Process_mobile_50_new{ width:calc(50% - 4px); } .Process_mobile_100_new{ width:100%; } .Process_mainitems_new{ padding: 16px 0; .Process_inneritems_new{ .Process_inneritems_mainboth_new{ .Process_inneritems_innerboth_new{ .Process_inneritems_innerboth_icon_new{width:16px; margin-top: 0;} .Process_inneritems_innerboth_info_new{text-align: left; font-size:18px; width: calc(100% - 16px); padding-left:12px; line-height: 120%; p{margin: 0px 0px 8px 0px; &:last-child{margin: 0px;} } } } } .Process_inneritems_mainbutton_new{ padding-top: 24px; .Process_inneritems_innerbutton_new{ a{ min-width:100%; } } } } } } } } } } @media(min-width:750px) and (max-width:989px){ .Process_main_new{ .Process_inner_new{ .Process_mainloop_new {padding-top:40px; .Process_innerloop_new{ .Process_mainblock_new{ .Process_innerblock_new{ .Process_innerblock_mainstatic_new{ min-height: 165px; .Process_innerblock_innerstatic_new{ .Process_innerblock_innerstatic_icons_new{ top:8px; right:8px; svg{ width:24px; } } .Process_innerblock_innerstatic_title_new{ font-size: 18px; } } } .Process_innerblock_mainhovers_new{ min-height: 165px; .Process_innerblock_innerhovers_new{ .Process_innerblock_innerhovers_icons_new{top:8px; right:8px; svg{ width:24px; } } .Process_innerblock_innerhovers_infos_new{ font-size: 14px; } } } } } .Process_mainitems_new{ .Process_inneritems_new{ .Process_inneritems_mainboth_new{ .Process_inneritems_innerboth_new{ max-width: 337px; .Process_inneritems_innerboth_icon_new{width:12px; margin-top: 3px; } .Process_inneritems_innerboth_info_new{font-size:15px; } } } } } } } } } } @media(min-width:990px) and (max-width:1439px){ .Process_main_new{ .Process_inner_new{ .Process_mainloop_new {padding-top:40px; .Process_innerloop_new{ .Process_mainblock_new{ .Process_innerblock_new{ .Process_innerblock_mainstatic_new{ min-height: 165px; .Process_innerblock_innerstatic_new{ .Process_innerblock_innerstatic_icons_new{ top:8px; right:8px; svg{ width:24px; } } .Process_innerblock_innerstatic_title_new{ font-size: 18px; } } } .Process_innerblock_mainhovers_new{ min-height: 165px; .Process_innerblock_innerhovers_new{ .Process_innerblock_innerhovers_icons_new{top:8px; right:8px; svg{ width:24px; } } .Process_innerblock_innerhovers_infos_new{ font-size: 14px; } } } } } .Process_mainitems_new{ .Process_inneritems_new{ .Process_inneritems_mainboth_new{ .Process_inneritems_innerboth_new{ max-width: 400px; .Process_inneritems_innerboth_icon_new{width:12px; margin-top: 3px; } .Process_inneritems_innerboth_info_new{font-size:18px; } } } } } } } } } }