.slide1, .slide2, .slide3, .slide4 { opacity: 90% }
#logo1, #logo2, #logo3 { border: 1px solid #c5c5c5 }
.form_footer > *, .slider_content { vertical-align: middle; display: inline-block }
.center, .icon_wrapper.mid, .red_strip { text-align: center }
.float_pic, .fright { float: right }
.arrow_after:after, .arrow_before:before { content: ''; border-top: 16px solid transparent; border-bottom: 16px solid transparent }
#dots4, #dots6 { left: 290px }
#dots5, #dots7 { padding-right: 50px }
.left, .panel, .right, body * { box-sizing: border-box }
#software_panel, #websites_panel { margin-top: 100px; margin-left: 40px }
#dots11, #dots6 { top: 100% }
#dots11, #dots6, #dots8 { height: 50px; width: 10px }
#dots11, #dots12, #dots8, #dots9 { left: 150px }
#dots10, #dots13, #software_panel, #websites_panel { margin-left: 40px }
#dots10, #dots11, #dots13, #dots2, #dots4, #dots6, #dots8 { width: 10px }
#dots14, #dots5, #dots7 { left: -50px; height: 10px }
#dots1, #dots12, #dots14, #dots5, #dots7, #dots9 { height: 10px }
#cboxWrapper, .cboxPhoto { max-width: none }
#accept_cookies_btn, .blue_background, .bluebg { background-color: #122f4e }
.col img, body, html { max-width: 100% }
#progress, .menu ul, .sitemap_list, ol.legal { list-style-type: none }
    li ol.legal > li:before, ol.legal > li:before { content: counters(item, ".") " " }
@font-face { font-family: sofia-pro; src: url("https://use.typekit.net/af/02ad94/00000000000000003b9b46f3/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"); font-display: swap; font-style: normal; font-weight: 700 }
@font-face { font-family: sofia-pro; src: url("https://use.typekit.net/af/4cc789/00000000000000003b9b46ed/27/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"); font-display: swap; font-style: normal; font-weight: 400 }
body { font-family: sofia-pro,sans-serif; font-style: normal; font-weight: 100; padding: 110px 0 0; margin: 0 }
.black_title, .btn, .icon_item, .thanks .center_container, b, h1, h2 { font-weight: 700 }
body.policy { padding-bottom: 100px }
.mobile_only { display: none !important }
body, html { overflow-x: hidden }
.client_logo_panel, .margin-bottom-40, .red_panel_33_img:last-child { margin-bottom: 40px }
.client_logos img { margin-left: 50px; margin-right: 50px; margin-top: 20px }
.footer_container p, h3 { margin-top: 0 }
.center_container { width: 1200px; margin: 0 auto; position: relative }
a { color: inherit; text-decoration: none }
.block { display: block }
.btn { padding: 5px 35px 8px; cursor: pointer; font-size: 19px; display: inline-block; border: 0 }
.panel p, .white_box li, p, ul { font-size: 14px }
h1, h3.larger { font-size: 40px }
.map-iframe { position: absolute; top: 0; left: 0; width: 100%; height: 320px; border: 0 }
.home_sub_head, h2 { font-size: 30px !important; width: auto !important; font-weight: 700 }
h3 { font-size: 24px }
header { background-color: #fff; z-index: 100000; position: fixed; top: 0; left: 0; width: 100%; height: 110px }
    header .center_container { height: 100%; z-index: 100000 }
.header_logo { position: absolute; top: 0px; left: 15px }
#header_elements { list-style: none; display: inline-flex; padding: 0; margin: 0; align-items: center; position: absolute; right: 10px; top: 43px }
    #header_elements li { padding: 0 15px; border-left: 1px solid #fff }
        #header_elements li:first-child { border-left: none }
        #header_elements li a { font-size: 17px; color: #000; text-decoration: none }
            #header_elements li a:hover { font-size: 17px; color: #aaa7a7; text-decoration: none }
.home_icon { top: 40px; right: 610px }
.hide, .thanks, header .cross, header .hamburger, header .menu, label.check input { display: none }
.thanks.show { display: block !important }
#cookie_policy, .grey_background, .greybg { background-color: #ececec }
.red_background { background-color: #d83137 }
.blue { color: #122f4e }
#cookie_policy a, .red { color: #ca262c }
.black { color: #000 }
.red_panel_title, .white, footer .red { color: #fff }
.dark-grey { color: #383838 }
.light-grey { color: #dadada }
.flex { display: flex }
.flex_center { align-items: center }
.flex_even_spaced a, .flex_even_spaced div, .flex_even_spaced img { flex: 1 }
.client_swiper_container .slider_content img, .header_container .center_container { height: 100% }
.header_container .flex { height: 100%; align-items: center }
.footer_container h3, .red_panel_67 .btn { margin-bottom: 0 }
.dotted-spaced, footer .logos { margin-top: 10px }
.footer_bottom div:first-child { width: 100%; flex: 1 }
.footer_bottom div:last-child { width: 100%; text-align: right; flex: 1 }
.footer_bottom a:hover { color: #d83137 }
.footer_logos img { margin-right: 20px }
.footer_container .social_logos a, .social_logos a, footer .logos img { margin-right: 10px }
    .footer_container .social_logos a img { width: 100%; height: auto }
.dotted-spaced { background-image: linear-gradient(to right,#fff 10%,rgba(255,255,255,0) 0); background-position: top; background-size: 10px 2px; background-repeat: repeat-x; padding-top: 10px }
.recent_work_container .flex > *, .slide1, .slide2, .slide3, .slide4 { background-position: center; background-size: cover }
.col:last-child, footer .logos img:last-child { margin-right: 0 }
.dotted-spaced-black { border-top: 2px dotted #000 }
.flex > div:first-child { padding-right: 15px; padding-left: 0 }
.flex > div:last-child { padding-left: 15px; padding-right: 0 }
.flex > div { padding: 0 15px }
.flex .flex { padding: 0 !important }
.bspace, .field_container, .margin-bottom-10, .margin-bottom-20, .page_text_legal li, .page_text_legal > div { margin-bottom: 20px }
.margin-bottom-30 { margin-bottom: 30px }
.margin-left-30 { margin-left: 30px }
.margin-right-30 { margin-right: 30px }
.padding-bottom-20 { padding-bottom: 20px }
.padding-bottom-40 { padding-bottom: 40px }
.padding-top-0 { padding-top: 0 }
.margin-top-0 { margin-top: 0 !important }
.margin-top-20 { margin-top: 20px }
#dots7, .margin-top-40, .red_panel_33_img, .vcenter { margin-top: 40px }
.padding-top-20, .ptop { padding-top: 20px }
.padding-top-40 { padding-top: 40px }
.margin-top-60 { margin-top: 60px }
.margin-bottom-60 { margin-bottom: 60px }
.arrow_content { margin-bottom: 120px; margin-top: 120px; position: relative }
.nomargin, .remove_margin, li ol.legal > li { margin: 0 }
.remove_padding { padding: 0 }
.swiper-container { width: 100%; height: 100% }
video { width: 100%; margin-top: -30px; margin-bottom: auto; margin-left: auto; margin-right: auto; }
.slider_content { line-height: 30px; width: 45%; margin-left: 10px }
.slide1 { background-image: url(/img/banners/Design.webp) }
.slide2 { background-image: url(/img/banners/Dev.webp) }
.slide3 { background-image: url(/img/banners/Apps.webp) }
.slide4 { background-image: url(/img/banners/Web.webp) }
.tranistion-fade { width: 20px; height: 100%; position: absolute; right: 0; top: 0; background-image: linear-gradient(to right,rgba(255,255,255,0),#122f4e) }
.header-slider { height: 300px }
.slider_content h1 { font-size: 36px; line-height: 46px; margin: 0 }
.slider_content p, label { font-size: 18px }
.swiper-pagination-bullet { background: #fff !important; opacity: 1 !important; margin-right: 5px }
.swiper-pagination-bullet-active { background: #d83137 !important; opacity: 1 !important }
.narrow { padding-left: 240px; padding-right: 240px }
.wider { padding-left: 100px; padding-right: 100px }
.left_container { width: 100%; margin-right: 50px }
.right_container { width: 100%; margin-left: 20px }
.red_strip.get_in_touch, .red_strip.web { padding-top: 60px }
    .red_strip.web .white_explanation_text { width: 1000px }
.seo, .support-services { position: absolute; top: 20px; right: 60px }
.seo { top: 55px }
.web .text.greybg h3 { padding-right: 80px }
.recent_work_container { height: 450px; background: linear-gradient(to bottom,#fff 0,#fff 60%,#000 60%,#d83137 60%,#d83137 100%) }
    .recent_work_container .flex > * { height: 300px; flex: 1; padding: 0 }
#logo1 { margin-right: 25px }
#logo2 { margin: 0 25px }
#logo3 { margin-left: 25px }
.custom_form .form_body input:not([type=checkbox]):not([type=submit]), .custom_form .form_body textarea { outline: 0; font-size: 18px; width: 78%; border: 0; border-bottom: 1px solid #4d4d4d; background-color: transparent; height: 30px }
.custom_form input[type=submit] { font-size: 20px; font-weight: 700; display: inline-block }
.custom_form .form_footer { margin-top: 10px; text-align: center; position: relative }
.form_footer .required_note { font-size: 12px; position: absolute; left: 0; top: 5px }
.custom_form .form_body textarea { height: 70px }
.largearrow { position: absolute; right: 215px; top: -60px; height: 950px }
.abchildren, .click_image, .left-container { position: relative }
.grey_strip { background-color: #f7f7f7 }
.red_strip { background-color: #d83137 }
.red_panel_33, .red_panel_67 { background-color: #d83137; text-align: left }
.red_panel_33 { flex: 33%; width: 33% }
.red_panel_67 { flex: 67%; width: 67%; margin-left: 0 !important; padding-top: 35px; padding-bottom: 35px }
.button_67 { margin: 50px 0 60px }
.black_title { color: #122f4e; display: block; font-size: 40px; width: 100%; }
.red_panel_button { padding-top: 20px; padding-bottom: 60px }
.home.red_strip { padding-bottom: 50px }
.video-overlay p { color: #fff; font-size: 20px; display: block; width: 770px; text-shadow: 2px 2px 2px black }
.menu a, .menu a:hover, .menu ul li a, .menu ul li a:hover { text-decoration: none; color: #666 }
.swiper-button-next, .swiper-button-prev { color: #d83137 !important }
.client_swiper_container { height: 75px; width: 100%; margin-bottom: 60px; margin-top: 60px }
    .client_swiper_container > .swiper-container { height: 130px; width: 1000px }
.icons_container_inline { margin: auto auto 50px; text-align: center; width: 1000px }
.icons_container_inline_web { margin: auto auto 50px; text-align: center; width: 1200px; padding-right: 140px }
.icon_item, .icon_wrapper_web { width: 100px; text-align: center }
.icon_cols_3 { flex: 50%; margin: auto; text-align: center }
.alignr, .icon_cols_left { text-align: right }
.icon_cols_right, .page_text_legal, .text { text-align: left }
.icon_item { display: inline-block; margin: 0 25px; vertical-align: top }
.icon_wrapper_web { margin: auto; padding-right: 30px }
.thanks .center_container { padding: 25px; color: #fff; font-size: 24px; text-align: center; margin-bottom: 60px }
.image_text, .image_title, .panel .title { font-size: 20px; font-weight: 700 }
.mleft { margin-left: -25px }
.pad_box.shallow, .ptop50 { padding-top: 30px }
.seo-audit { padding: 50px 35px 0; text-align: left }
#progress, .arrow_container, .columns, .icon_wrapper, .image_text, .image_title, .menu, .portfolio_header, label.check { text-align: center }
.float_pic { margin-left: 20px; margin-bottom: 10px }
.icon_wrapper { margin: auto; display: block }
    .icon_wrapper > * { display: inline-block; vertical-align: top }
    #accept_cookies_btn, #cookie_policy p, .icon_wrapper.mid > *, .vcenter > *, label.check { vertical-align: middle }
    .icon_wrapper.mid > * { margin: 0 10px }
.grey_boxes_no_stripe { height: auto; max-height: unset; width: 100%; position: relative; margin-bottom: 60px }
.white_box { background: #fff; flex: 50%; max-height: 500px; overflow: hidden; z-index: 100 }
    .white_box.taller { max-height: 860px }
.combi_box { flex: 50% }
.app_box_row { margin-top: 30px }
.vcenter > img { margin: 0 20px }
.vcenter > * { display: inline-block; margin-top: 0 }
.vcenter > .btn { margin-top: 5px }
.white_explanation_text { width: 700px; margin: auto; color: #fff }
    .white_explanation_text > p { margin: 0; padding: 0 0 40px; font-size: 18px }
        .no_pad_b, .white_explanation_text > p:last-child { padding-bottom: 0 }
.illustration_bezier_pen { position: absolute; right: -20px; top: -60px; z-index: -100 }
.illustration_loud_speaker { position: absolute; top: 460px; left: -60px; z-index: -100 }
.illustration_mobile_device { position: absolute; right: -40px; top: -50px; z-index: -100 }
.illustration_globe { position: absolute; left: -20px; bottom: 0; z-index: -100 }
.portfolio_header { width: 700px; margin: auto }
    .portfolio_header h1 { margin: 0; display: block; padding-top: 20px }
    .portfolio_header p { font-size: 18px; padding-bottom: 40px; margin-bottom: 0 !important }
.pad_box_b, .portfolio_buttons { padding-bottom: 60px }
.portfolio_button { font-weight: 700; display: inline-block; padding: 10px; width: 100px; margin: 2px; color: #d83137; background: #fff; cursor: pointer }
.portfolio_images { width: 1200px; margin: auto }
.portfolio_strip { background: linear-gradient(to top,#fff 0,#fff 80%,#000 80%,#122f4e 78%,#122f4e 100%) }
.portfolio_button_active { color: #fff; background: #d83137 }
.image_text, .image_title { margin: 0 -50% 0 0; position: absolute; top: 40%; left: 50%; transform: translate(-50%,-50%); color: #fff; overflow: hidden; display: block; filter: brightness(100%) !important }
.image_text { top: 65%; font-weight: 400; padding: 0 30px }
.modal { display: none; position: fixed; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,.4); overflow: hidden }
.email_arrow, .left, .panel, .right { display: inline-block }
#article, #cboxContent, #progress li, .arrow1, .arrow2, .email_arrow, .map_container, .panel { position: relative }
.modal-content { background-color: #fefefe; margin: 5% auto; padding: 0; border: 1px solid #888; width: 50% }
.arrow_container { width: 450px; color: #fff; margin-top: 50px }
.email_arrow { padding: 10px 0; margin: 0 }
.arrow_left { background: #d83137; width: 150px }
.arrow_middle, .arrow_right { background: #122f4e; width: 150px }
.arrow1, .arrow2 { right: 0; top: 0 }
.contact_box { height: auto; max-height: unset }
.map_container { width: 100%; height: 320px }
#progress { padding: 0; font-family: arial; font-size: 12px; clear: both; line-height: 1em; margin: 50px -1px 0 }
    #progress li { float: left; padding: 10px 30px 10px 40px; background: #122f4e; border-top: 1px solid #666; border-bottom: 1px solid #666; width: 32%; margin: 0 1px; font-weight: 700; color: #fff }
.arrow_before:before { border-left: 16px solid #ececec; position: absolute; top: 0; left: 0 }
.arrow_after:after { border-left: 16px solid #122f4e; position: absolute; top: 0; left: 100%; z-index: 20 }
#progress li.active { background: #d93238 }
    #progress li.active:after { border-left-color: #d93238 }
#article { width: 1200px; margin: 60px auto }
.panel { padding: 60px; background-color: #f7f7f7; color: #000; vertical-align: top; border-radius: 30px }
#cboxOverlay, #cboxTitle, #cboxWrapper, #colorbox, .dots, .home_icon, .posabs { position: absolute }
#design_panel { width: 550px; margin-right: 50px }
.dots { background-image: url('/img-new/dot.png'); z-index: 10000 }
#dots1 { top: 50%; left: 550px; width: 40px; margin-top: -5px }
#dots2 { top: 0; left: 590px; height: 50%; padding-bottom: 5px }
#websites_panel { width: 550px }
#dots4 { top: -95px; height: 95px }
#dots5 { top: -100px; width: 341px }
#dots7 { top: 102%; width: 345px }
.left, .right { width: 600px; overflow: auto; vertical-align: top; z-index: 1 }
.right { padding-left: 50px }
#cookie_policy p, .cboxIframe, .menu ul { padding: 0; margin: 0 }
#apps_panel { width: 500px; margin-left: 50px; margin-right: 50px }
#software_panel { width: 500px; margin-right: 50px }
#dots8 { top: -50px }
#dots9 { top: -50px; width: 390px }
#dots10 { top: -50px; left: 100%; height: 100px }
#dots12 { top: calc(100% - 3px); margin-top: 50px; width: 395px }
#dots13 { bottom: -50px; left: 100%; top: 180px; height: auto }
#dots14 { top: 80px; width: 50px }
#home_design { right: 100px; top: -33px }
#home_websites { right: -40px; top: 40px }
#home_apps { left: -60px; top: 100px }
#home_software { right: -38px; bottom: -50px }
#cboxOverlay, #cboxWrapper, #colorbox { top: 0; left: 0; z-index: 9999; overflow: hidden; -webkit-transform: translate3d(0,0,0) }
#cboxOverlay { position: fixed; width: 100%; height: 100%; background: #000; opacity: .9 }
#cboxBottomLeft, #cboxMiddleLeft { clear: left }
#cboxContent { margin-top: 20px; background: #000 }
.cboxIframe, .menu li:hover { background: #fff }
#cboxLoadedContent { overflow: auto; -webkit-overflow-scrolling: touch; border: 5px solid #000; background: #fff }
#cboxTitle { margin: 0; top: -20px; left: 0; color: #ccc }
#cboxLoadingGraphic, #cboxLoadingOverlay { position: absolute; top: 0; left: 0; width: 100%; height: 100% }
#cboxClose, #cboxNext, #cboxPrevious, #cboxSlideshow { cursor: pointer; border: 0; padding: 0; margin: 0; overflow: visible; width: auto; background: 0 0 }
#cboxNext, #cboxPrevious { top: 50%; margin-top: -32px; width: 28px; height: 65px; text-indent: -9999px }
.cboxPhoto { float: left; margin: auto; border: 0; display: block; -ms-interpolation-mode: bicubic }
.cboxIframe { width: 100%; height: 100%; display: block; border: 0 }
.cross, .hamburger { background: 0 0; position: absolute; right: 0; color: #c5c5c5; outline: 0; z-index: 10000000000000; top: 0; border: 0; font-weight: 700; cursor: pointer }
#cboxContent, #cboxLoadedContent, #colorbox { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box }
#cboxClose:active, #cboxNext:active, #cboxPrevious:active, #cboxSlideshow:active, #colorbox { outline: 0 }
#cboxError { padding: 50px; border: 1px solid #ccc }
#cboxCurrent { position: absolute; top: -20px; right: 0; color: #ccc }
#cboxLoadingGraphic { background: url(images/loading.gif) center center no-repeat }
#cboxSlideshow { position: absolute; top: -20px; right: 90px; color: #fff }
#cboxPrevious { position: absolute; left: 5px; background: url(images/controls.png) top left no-repeat }
    #cboxPrevious:hover { background-position: bottom left }
#cboxNext { position: absolute; right: 5px; background: url(images/controls.png) top right no-repeat }
    #cboxNext:hover { background-position: bottom right }
#cboxClose { position: absolute; top: 5px; right: 5px; display: block; background: url(images/controls.png) top center no-repeat; width: 38px; height: 19px; text-indent: -9999px }
    #cboxClose:hover { background-position: bottom center }
.hamburger { display: none; line-height: 45px; padding: 18px 20px 0 15px; font-size: 50px }
.cross { padding: 25px 25px 0 15px; font-size: 120px; line-height: 65px }
#cookie_policy, .menu { position: fixed; left: 0 }
.menu, .pad_box_v { padding-top: 60px }
.menu { z-index: 1000; font-weight: 700; width: 100%; background: #f1f1f1; font-size: 20px; top: 0; max-height: 100%; overflow: auto }
    .menu ul { list-style-image: none }
    .menu li, .menu li:hover { display: block; padding: 15px 0; border-bottom: 1px solid #ddd }
    .menu ul li a { margin: 0 }
    .menu > ul > li { cursor: pointer }
.video-overlay-panel { position: absolute; top: 0; left: 0; width: 100%; height: 560px }
.columns, .pad_box, .video-overlay, .video-strip { position: relative }
.video-strip { width: 100%; margin: auto }
.video-overlay { top: 168px; left: 40px; z-index: 999; width: 1200px; margin: 0 auto }
.video-overlay-container { height: 0; width: 1200px; margin-left: auto; margin-right: auto }
.blue-strip { width: 100%; max-height: 560px; overflow: hidden; background: #122f4e }
.header-slider .center_container { background-size: contain; background-position: right; background-repeat: no-repeat; color: #fff; line-height: 300px; height: 300px }
.nobotpad { padding-bottom: 0 !important }
.design .illustration_loud_speaker { top: 600px }
#curator-feed-default-feed-layout { max-width: 380px; padding-left: 0 }
.crt-widget.crt-widget-branded .crt-logo { color: #fff !important; font-size: 12px !important }
.field_ticks .item { display: inline-block; width: 145px; vertical-align: top; line-height: 25px }
label.check { display: inline-block; width: 25px; height: 25px; border: 1px solid #000; user-select: none; cursor: pointer }
.banner img, .columns { display: block; width: 100% }
.checkmark { display: block; width: 23px; height: 23px; line-height: 23px }
label.check input:checked ~ .checkmark { background-color: #000 }
    label.check input:checked ~ .checkmark:after { content: '✓'; color: #fff; font-size: 18px; text-align: center }
#cookie_policy { width: 100%; bottom: 0; padding: 20px; z-index: 1100000; height: 100px }
    #cookie_policy p { display: inline-block; width: 80%; font-size: 20px }
#accept_cookies_btn { display: inline-block; width: 18%; height: 60px; border: 0; color: #fff; font-weight: 700; cursor: pointer }
.col { display: inline-block; margin-right: 5%; width: 47.5%; vertical-align: top }
    .col.vmid, .red_strip_text { vertical-align: middle }
.columns.nogap .col { margin-left: 0; margin-right: 0 }
.pad_box { padding: 60px }
.pad_box_v { padding-bottom: 60px }
.pad_box_h { padding-left: 60px; padding-right: 60px }
.renewi_work { top: 0; right: 60px }
.columns.design .col { min-height: 730px }
.columns.web .col { min-height: 1100px; height: 1100px; overflow: hidden }
.columns.dev .col { min-height: 580px; height: 580px; overflow: hidden }
.columns.contact .col { min-height: 677px; height: 677px; overflow: hidden }
.red_strip_text { padding-left: 60px; color: #fff; line-height: 20px; font-size: 14px }
    .red_strip_text h3 { line-height: 30px }
    .red_strip_text.larger p { font-size: 16px; line-height: 24px }
    .red_strip_text .btn, .red_strip_text .vcenter { margin-top: 20px; margin-bottom: 0 }
.nopadl { padding-left: 0 }
.red_follow { background: linear-gradient(to bottom,#fff 0,#fff 75%,#000 75%,#d83137 50%,#d83137 100%) }
.field_container > * { display: inline-block; width: 20% }
.center_container_portfolio { width: 1000px; margin: 0 auto; position: relative }

@media(max-width:1200px) {
    .center_container, .video-overlay-container, .video-strip { width: 100% !important }
    .video-overlay { top: unset; padding-top: 100px; padding-left: 20px; left: unset; width: 100% }
        .portfolio_header p, .video-overlay p, .video-overlay-container { width: 100%; font-size: 18px }
        .video-overlay p { max-width: 80% }
    body { box-sizing: inherit }
    .footer_container .social_logos a img { width: auto; height: auto }
    .flex > div:last-child { padding-left: 0; padding-right: 0 }
    .flex > div { padding: 0 }
    .footer_container .center_container { padding-left: 20px; padding-right: 20px }
    .footer_tech { margin-top: 0 }
    .apps_box { margin-left: 0 !important; margin-top: 50px }
    .right_container { margin: 0 }
    .software_box { margin-top: 100px }
    .combi_box { margin-left: 20px !important; margin-right: 20px !important }
    .icon_cols_3.icon_cols_web_adj { background: purple; margin-right: 130px }
    #article, .icon_wrapper_web, .portfolio_images, .red_panel_67 { width: 100% }
    .dots, .illustration_loud_speaker { display: none }
    .panel { width: 100%; margin: 0 20px 60px }
    #apps_panel, #design_panel, #software_panel, #websites_panel { width: unset; margin-right: 20px }
    #software_panel, #websites_panel { margin-top: 0; margin-left: 20px }
    #apps_panel { margin-left: 20px; margin-right: 20px }
    .margin-top-60 { margin-top: 50px }
    .recent_work_container .flex > * { height: 300px; width: 300px; margin: 0 15px; flex: 1; background-position: center; background-size: cover; padding: 0 }
    .recent_work_container { height: auto }
    .recent_logo { margin: 0 15px 30px !important; display: inline-block }
    .recent_inner_container { text-align: center; width: 100% }
    .arrow_content { margin-bottom: 0 !important }
    .white_box { margin-right: 20px !important; margin-left: 20px !important }
    .get_in_touch { padding-top: 50px !important }
    .modal-content { width: 80% }
    #home_apps, #home_software, #home_websites { right: 100px; top: -33px; left: unset }
    .design .col { min-height: 740px }
    .red_strip_text { padding-left: 30px; padding-top: 10px }
}

@media(max-width:1150px) {
    .renewi_work { width: 160px }
}

@media(max-width:1100px) {
    body { padding-top: 60px }
    .header_container, header { height: 60px }
    .header_logo { top: 5px; left: 5px }
    #header_elements { top: 18px }
    .home_icon { top: 13px }
    header .cross, header .hamburger { padding: 0; font-size: 40px; position: absolute; top: 0; right: 10px }
    header .cross { font-size: 60px; right: 18px }
    .header_logo img { height: 50px; width: 150px }
    #article { margin-bottom: 0 }
    .client_swiper_container > .swiper-container { width: 100% }
    .red_panel_33 { display: flex; width: 800px; margin: auto; text-align: center }
    .red_panel_33_img { display: inline; margin-right: 30px }
    .white_box img { max-width: 100% }
    .design .col { min-height: 755px }
    .red_strip_text { padding-left: 30px; padding-top: 20px; padding-bottom: 20px }
    .narrow { padding-left: 10%; padding-right: 10% }
}

@media(max-width:1015px) {
    .bspace, .col { margin-bottom: 45px }
    .icon_cols_left, .icon_cols_right, .red_strip_text { text-align: center }
    .center_container_portfolio, .icons_container_inline, .red_strip.web .white_explanation_text { width: 100% }
    .recent_work_container { background: 0 0 }
    .icon_wrapper { display: block }
    .white_explanation_text { width: 100%; padding-right: 50px; padding-left: 50px }
    #curator-feed-default-feed-layout { max-width: 300px }
    .support-services { top: 1px; right: 20px }
    .seo { top: 40px; right: 20px }
    .seo-audit { padding: 0 }
    .pad_box_b, .pad_box_v { padding-bottom: 45px }
    .renewi_work { width: auto }
    #cookie_policy p { font-size: 16px }
    .pad_box { padding: 45px }
    .pad_box_v { padding-top: 45px }
    .pad_box_h { padding-left: 45px; padding-right: 45px }
    .col { width: 70%; margin-right: 0; min-height: unset !important; height: auto !important; overflow: unset !important }
        .col:last-child { margin-bottom: 0 }
    .red_strip.fixed1 { margin-top: 165px }
    .block { margin: 0 auto }
    .red_strip.fixed1 .main { margin-top: -115px }
    .red_strip_text { padding-left: 0 }
        .red_strip_text ul { margin-left: 0; padding-left: 0 }
}

@media(max-width:800px) {
    .black_title, .portfolio_header h1, .slider_content h1, .video-overlay h1 { font-size: 35px }
    .home_sub_head { font-size: 25px; }
    #article, .black_title, .bspace, .col { margin-bottom: 20px }
        .col, .col:last-child { margin-right: 20px }
    #header_elements { display: none }
    .red_panel_33_img, header .hamburger { display: block }
    .flex, .flexy, .footer_tech > div { display: inline-block }
    .home_icon { right: 60px }
    .header-slider, .header-slider .center_container { height: auto; line-height: 200px }
    .portfolio_header { width: auto; padding: 0 40px }
        .portfolio_header p, .video-overlay p { font-size: 14px }
    .flex { text-align: center }
    .footer_container > .flex > div { display: inline-block; vertical-align: top; width: 40% }
        .footer_container > .flex > div:last-child { width: 80% }
    .footer_tech { display: block; margin-top: 20px }
        .footer_tech > div { margin: 0 20px }
    .app_box_row, .footer_links, .footer_logos, .vcenter { text-align: center !important }
        .flex > div:first-child, .footer_logos img:last-child { padding-right: 0; margin-right: 0 }
    body { padding-top: 60px }
    .header_container, header { height: 60px }
    .slider_content img { width: 80px }
    .red_panel_button { padding-top: 40px; padding-bottom: 40px }
    .pad_box_b, .pad_box_v { padding-bottom: 20px }
    .white_box { text-align: center }
    .client_swiper_container > .swiper-container { height: 40px; margin-top: 40px }
    .home.red_strip { padding-bottom: 0 }
    .slider_content p { padding-top: 0; font-size: 14px; line-height: 20px }
    .slider_content h1 { line-height: 40px }
    .video-overlay h1, h1 { font-size: 40px }
    .slider_content { margin-top: 0; margin-left: 15px }
        .slider_content.design { margin-top: 25px }
    .red_panel_33 { display: block; width: 100%; padding-top: 1px }
    .nogap .col, .red_panel_33_img:last-child { margin-bottom: 0 }
    .flex.instagram { max-width: 380px }
    .mleft { margin-left: unset }
    #curator-feed-default-feed-layout { max-width: 100% }
    .pad_box { padding: 20px }
    .pad_box_v { padding-top: 20px }
    .pad_box_h { padding-left: 20px; padding-right: 20px }
    .col { width: auto; margin-left: 20px; display: block }
    .nogap .col .red_strip_text { padding-top: 0 }
    .red_strip_text { padding: 30px }
    .seo { top: 20px }
}

@media(max-width:650px) {
    .black_title, h2, h3 { font-size: 22px }
        h3.larger { font-size: 30px }
    .web .text h3 { padding-right: 80px }
    .footer_container > .flex > div { display: block; vertical-align: top; width: auto }
        .footer_container > .flex > div:last-child { width: unset }
    .video-overlay { padding-top: 20px }
    .slider_content h1 .red { text-shadow: 0 0 3px #000 }
    .header-slider .center_container { background-size: 150px 84px; background-position: top 20px right }
    .portfolio_header h1, .slider_content h1, .video-overlay h1 { font-size: 30px }
    .home_sub_head { font-size: 20px !important; }
    .slider_content p { line-height: 20px }
    .slider_content h1 { width: 70%; line-height: 30px }
    #cookie_policy { height: 200px; text-align: center }
    body.policy { padding-bottom: 200px }
    #accept_cookies_btn, #cookie_policy p { display: block; width: 100% }
    #accept_cookies_btn { height: 30px; margin-top: 20px }
    #cookie_policy p { font-size: 14px }
    .white_box img { max-width: 100% }
    .narrow { padding-left: 20px; padding-right: 20px }
}

@media(max-width:600px) {
    .btn.fright, img.fright { float: none }
    .custom_form .form_footer { text-align: center }
    .g-recaptcha > div { margin: 0 auto }
}

@media(max-width:550px) {
    .columns.design .abchildren { text-align: center }
        .columns.design .abchildren .posabs { position: relative; left: unset; top: unset; right: unset }
        .columns.design .abchildren > img, .columns.dev .icon_wrapper > img { margin-bottom: 20px }
    .field_container input, .field_container textarea, .field_container > label { display: block; width: 100% !important }
    .custom_form input[type=submit] { margin-top: 20px }
}

@media(max-width:480px) {
    .mobile_only { display: inline-block !important }
    .slider_content { margin-left: 0; padding-left: 10px; padding-right: 5px }
        .slider_content h1 { width: 70%; line-height: 30px }
    .panel { padding: 25px }
    .home.red_strip { padding-bottom: 0 }
    .slider_content p { padding-top: 5px; font-size: 14px }
    .video-overlay { text-align: center; padding: 20px }
        .video-overlay p { width: 100%; max-width: 100% }
        .video-overlay .btn { font-size: 14px; margin-top: 5px }
    .video-overlay-container { height: auto; background-image: url('/img-new/mobile-version.png'); background-size: cover }
    .blue-strip video { display: none }
    .video-overlay-panel { position: relative; height: auto; background-image: url(/img/MainImage.webp); background-size: cover }
    .white_explanation_text { padding-left: 25px; padding-right: 25px }
    .app_box_row, .footer_links, .vcenter, footer h2, footer h3 { text-align: center !important }
        .footer_logos > img, .vcenter > img { display: block; margin: 20px auto }
    .footer_tech, footer .center_container, footer .social_logos, footer p { text-align: center; width: 100% }
        .footer_tech > div { display: inline-block }
        footer .social_logos a:last-child { margin-right: 0 }
    .footer_container .center_container { margin-left: 0; margin-right: 0; padding: 20px }
    .margin-top-40 { margin-top: unset }
    #home_apps, #home_design, #home_software, #home_websites { right: 20px }
    .support-services { top: 1px }
    .flex.instagram { max-width: 100% }
}

@media(max-width:414px) {
    .support-services { top: 10px }
}

ol.legal { counter-reset: item; margin: 0; padding: 0 }
    ol.legal > li { display: table; counter-increment: item; margin-bottom: .6em }
        ol.legal > li:before { display: table-cell; padding-right: .6em }
tr.tablebody:nth-child(2n) { background-color: #f2f2f2 }
.tablehead { color: #fff; background: #122f4e }
    .tablebody td, .tablehead th { padding: 10px; vertical-align: top }
.legaltable { width: 100% }
.flex-container { display: flex; flex-wrap: wrap; gap: 20px; align-items: baseline; }
.grid-container > * { box-sizing: border-box; border-radius: 0; padding: 0px; height: 100% }

@media (max-width: 768px) {
    .flex-container > * { flex: 1 1 100%; width: 100%; margin: 20px; }
}

#app_icons { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 40px; padding: 20px 200px; }
    #app_icons .app-icon { flex: 0 1 calc(16.666% - 40px); display: flex; justify-content: center; align-items: center; }
        #app_icons .app-icon img { max-width: 80px; height: auto; display: block; }

@media (max-width: 768px) {
    #app_icons .app-icon { flex: 0 1 calc(33.333% - 40px); }
    .video-overlay { background-color: #00000070; }
}

@media (max-width: 480px) {
    #app_icons { gap: 20px; padding: 20px 10px; }
        #app_icons .app-icon { flex: 0 1 calc(50% - 20px); }
}

.red_inverse { background-color: #ca262c; color: white; padding: 10px; }
.padding40 { padding: 20px; }
.grid-container { display: grid; gap: 20px; grid-template-columns: repeat(3, 1fr); gap: 20px; align-items: start; }

@media (max-width: 1024px) {
    .grid-container { grid-template-columns: 1fr; }
        .grid-container > * { width: 100%; margin: 0px; }
}
