/*Wearables*/ .ma-wearables .site-wrap{ overflow: hidden; } .ma-wearables .navigation_bar .content_navigation li a.btn_start_project{ background: #0091ff; } .ma-wearables .navigation_bar.active .content_navigation li a.btn_start_project{ background: none; } /*Hero*/ .ma-wearables .hero-section{ height: 100vh; min-height: 850px; margin-bottom: 180px; position: relative; background: rgb(23,7,67); background: linear-gradient(117deg, rgba(23,7,67,1) 0%, rgba(49,14,141,1) 51%, rgba(23,7,67,1) 100%); } .ma-wearables .hero-section .mask{ width: 100%; height: 200px; position: absolute; bottom: -30px; left: 0; z-index: 10; overflow: hidden; } .ma-wearables .hero-section .mask .shape{ width: 1920px; height: 200px; background: url("../svg/curve-2.svg") no-repeat; background-size: 100% 100%; position: absolute; left: 50%; margin-left: -960px; } .ma-wearables .hero-section .content{ width: 1160px; position: absolute; left: 50%; margin-left: -580px; height: 280px; top: 50%; text-align: center; margin-top: -230px; } .ma-wearables .hero-section .content .case_study_title{ color: #FFF; font-size: 16px; line-height: 1.2; } .ma-wearables .hero-section .content .case_title{ color: #FFF; font-size: 58px; font-weight: normal; padding: 20px 0 30px; line-height: 1.1; max-width: 760px; margin: 0 auto; } .ma-wearables .hero-section .content .description{ color: #FFF; font-size: 32px; font-weight: normal; font-style: italic; line-height: 1.2; } .ma-wearables .hero-section .content .tags_list{ width: 444px; margin: 0 auto; } .ma-wearables .hero-section .content .tags_list li{ float: left; background: #13052f; border-radius: 8px; color: #FFF; font-size: 16px; display: block; width: 138px; height: 38px; line-height: 38px; margin: 8px 5px; } .ma-wearables .hero-section .content .tags_list li.violet{ background: #6a539b; } .ma-wearables .hero-section .wearable_one{ display: block; background: url("../svg/hero-wearable-1.svg"); background-size: 650px 347px; width: 650px; height: 347px; position: absolute; top: 0; right: 50%; margin-right: -900px; } .ma-wearables .hero-section .wearable_two{ display: block; background: url("../svg/hero-wearable-2.svg"); background-size: 650px 508px; width: 650px; height: 508px; position: absolute; bottom: 0; left: 50%; margin-left: -800px; } .ma-wearables .hero-section .phone{ width: 900px; position: absolute; bottom: -130px; left: 50%; margin-left: -450px; z-index: 20; } .ma-wearables .hero-section .phone .white_bg{ display: block; width: 300px; height: 200px; position: absolute; bottom: -15px; background: #FFF; } .ma-wearables .hero-section .hero_watch{ position: absolute; width: 1300px; left: 50%; margin-left: -650px; top: 50%; margin-top: -300px; } /*Product Innovation*/ .ma-wearables .product-innovation{ width: 90%; margin: 0 auto; margin-top: 100px; } .ma-wearables .product-innovation .content{ width: 1010px; margin: auto; position: relative; left: -50px; } .ma-wearables .product-innovation .content:after{ clear: both; display: block; content: ""; } .ma-wearables .product-innovation .content .left-content{ width: 420px; float: left; } .ma-wearables .product-innovation .content .left-content figure{ width: 100%; } .ma-wearables .product-innovation .content .right-content{ width: 550px; float: right; padding-top: 70px; } .ma-wearables .product-innovation .content .right-content p{ font-size: 38px; font-weight: 300; color: #434c6b; } /*Case Studies*/ .ma-wearables .case-studies{ width: 100%; margin-top: 100px; } .ma-wearables .case-studies:after{ content: ""; display: block; clear: both; } .ma-wearables .case-studies .content{ width: 1160px; margin: auto; position: relative; } .ma-wearables .case-studies .content .header { text-align: center; margin-bottom: 80px; } .ma-wearables .case-studies .content .header p{ display: inline-block; font-size: 21px; position: relative; } .ma-wearables .case-studies .content .header p:before{ content: ""; display: block; width: 72px; height: 6px; background-image: linear-gradient(93deg, #6de6ff, #5b00ff); left: 50%; position: absolute; bottom: -15px; border-radius: 5px; margin-left: -36px; } .ma-wearables .case-studies .content .case_studies_list{ display: block; width: 900px; margin: 0 auto; } .ma-wearables .case-studies .content .case_studies_list li{ float: left; text-align: center; width: 16.6666%; } .ma-wearables .case-studies .content .case_studies_list li.mobile_only{ display: none; } .ma-wearables .case-studies .content .case_studies_list li a{ display: block; border: 1px solid transparent; padding: 10px 0; width: 140px; font-size: 15px; height: auto; text-align: center; line-height: 1; border-radius: 20px; color: #000; transition: border 0.3s ease; } .ma-wearables .case-studies .content .case_studies_list li a:hover{ border: 1px solid #5b00ff; font-weight: bold; } /*Biostrap*/ .ma-wearables .biostrap-section:before{ content: ""; width: 1920px; height: 2300px; position: absolute; background: url("../svg/fondo.svg"); top: 180px; background-repeat: no-repeat; display: block; } /*Apollo*/ .ma-wearables .apollo{ width: 100%; color: #fff; } .ma-wearables .apollo .content{ width: 1160px; margin: auto; padding-top: 50px; } .ma-wearables .apollo .content:after{ clear: both; display: block; content: ""; } .ma-wearables .apollo .content .box-left{ width: 550px; float: left; position: relative; left: 0; } .ma-wearables .apollo .content .box-left .first-box .header p{ font-size: 48px; margin-bottom: 20px; } .ma-wearables .apollo .content .box-left .first-box .header ul{ display: inline-block; } .ma-wearables .apollo .content .box-left .first-box .header ul li{ font-size: 14px; float: left; margin-right: 10px; padding: 5px 0; width: 95px; text-align: center; border: solid 1px #FFF; border-radius: 8px; } .ma-wearables .apollo .content .box-left .first-box .header ul li.element-3{ background: #363fc1; border-color: #363fc1; } .ma-wearables .apollo .content .box-left .first-box .section-header{ margin-top: 35px; } .ma-wearables .apollo .content .box-left .second-box .title{ font-size: 21px; padding-top: 53px; } .ma-wearables .apollo .content .box-left .first-box .section-header .title{ font-size: 21px; padding-bottom: 7px; } .ma-wearables .apollo .content .box-left .second-box .second-title, .ma-wearables .apollo .content .box-left .third-box .title{ font-size: 21px; color: #fff; font-weight: bold; line-height: 1.5; padding-top: 20px; } .ma-wearables .apollo .content .box-left .sub-title{ font-weight: bold; font-size: 28px; margin-bottom: 15px; } .ma-wearables .apollo .content .box-left p{ font-size: 16px; color: #fff; line-height: 1.5; } .ma-wearables .apollo .content .box-right{ width: 600px; float: right; position: relative; bottom: 65px; left: 79px; } .ma-wearables .apollo .content .box-right figure{ width: 100%; position: relative; float: right; } /*Celbrea*/ .ma-wearables .celbrea{ width: 100%; padding-top: 50px; } .ma-wearables .celbrea .content{ width: 1160px; margin: 100px auto 0; } .ma-wearables .celbrea .main-content:after{ clear: both; display: block; content: ""; } .ma-wearables .celbrea .content .main-content .box-left{ width: 30%; float: left; color: #434c6b; } .ma-wearables .celbrea .content .mobile_image{ display: none; } .ma-wearables .celbrea .content .main-content .box-left{ width: 390px; float: left; color: #434c6b; position: relative; } .ma-wearables .celbrea .content .main-content .box-left .first-box{ width: 100%; position: relative; } .ma-wearables .celbrea .content .main-content .box-left .first-box::after{ clear: both; display: block; content: ""; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header .title{ font-size: 48px; font-weight: normal; display: inline-block; margin-bottom: 20px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header h6{ display: inline-block; font-weight: normal; font-size: 20px; padding-left: 10px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul{ display: inline-block; margin-top: -10px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul li{ width: 95px; font-size: 14px; border: solid 1px #8c98c1; margin-right: 10px; padding: 5px 0; float: left; color: #8c98c1; border-radius: 8px; text-align: center; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul .element-3{background: #8c98c1; border: solid 1px transparent; font-weight: 600; color: #fff; text-align: center; width: 156px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header{ padding: 35px 0 0 0; line-height: 1.5; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .title{ font-size: 28px; color: #434c6b; margin-bottom: 14px; font-weight: bold; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .description{ font-size: 16px; line-height: 1.5; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .button-welwaze{ padding: 15px 35px; border-radius: 30px; font-size: 21px; background: #3cc8e5; color: #FFF; position: relative; margin-top: 90px; float: left; } .ma-wearables .celbrea .content .main-content .box-center{ width: 440px; float: left; margin-left: -39px; position: relative; top: -110px; } .ma-wearables .celbrea .content .main-content .box-center figure{ width: 100%; position: relative; } .ma-wearables .celbrea .content .main-content .box-right{ width: 360px; float: left; line-height: 1.5; color: #434c6b; padding-left: 43px; z-index: 10; position: relative; } .ma-wearables .celbrea .content .main-content .box-right .first-box{ margin-top: 15px; } .ma-wearables .celbrea .content .main-content .box-right .first-box .title{ font-size: 28px; color: #434c6b; font-weight: bold; } .ma-wearables .celbrea .content .main-content .box-right .first-box .second-title{ font-size: 21px; font-weight: bold; line-height: 1.5; padding-top: 20px; color: #434c6b } .ma-wearables .celbrea .content .main-content .box-right .first-box .description, .ma-wearables .celbrea .content .main-content .box-right .second-box .description{ font-size: 16px; line-height: 1.5; } .ma-wearables .celbrea .content .main-content .box-right .first-box .description span{ font-weight: bold; font-style: italic; } .ma-wearables .celbrea .content .main-content .box-right .second-box{ margin-top: 85px; } .ma-wearables .celbrea .content .main-content .box-right .second-box{ margin-top: 50px; } .ma-wearables .celbrea .content .main-content .box-right .second-box .title{ font-size: 18px; font-weight: bold; color: #434c6b } .ma-wearables .celbrea .content .footer-celbrea{ width: 100%; position: relative; bottom: 192px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer{ width: 1160px; margin: auto; } .ma-wearables .celbrea .content .footer-celbrea .content-footer:after{ clear: both; display: block; content: ""; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left { width: 455px; float: left; padding-left: 260px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left p{ font-size: 21px; color: #707fb2; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right { width: auto; float: left; line-height: 1.5; padding-left: 80px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right .title{ font-size: 21px; font-weight: bold;color: #424b6a; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right p{ font-size: 18px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left:before { content: "";display: block; width: 70px; height: 6px; border-radius: 5px; background-image: linear-gradient(93deg, #6de6ff, #5b00ff); position: absolute; top: 130%; } .ma-wearables .celbrea .more_work_about{ margin: 0; color: #707fb2; position: relative; top: -200px; } .ma-wearables .celbrea .more_work_about .big{ font-size: 20px; margin-bottom: 20px; } .ma-wearables .celbrea .more_work_about .big:after{ content: ""; display: block; width: 70px; height: 6px; background-image: linear-gradient(94deg, #6de6ff 3%, #5b00ff 102%); border-radius: 10px; margin-top: 20px; } .ma-wearables .celbrea .more_work_about p{ margin-bottom: 5px; font-size: 16px; } .ma-wearables .celbrea .more_work_about a{ color: #707fb2; } .ma-wearables .celbrea .more_work_about a:hover{ text-decoration: underline; } .ma-wearables .introduction, .ma-wearables .biostrap-section{ width: 100%; } .ma-wearables .introduction .main-content, .ma-wearables .biostrap-section .main-content{ color: #fff; width: 1160px; margin: 0 auto; font-size: 16px; } /*Introduction Section*/ .ma-wearables .introduction .main-content .text-content{ max-width: 690px; margin: 0 auto; } .ma-wearables .introduction .main-content .text-content p{ color: #424b6a; font-size: 20px; font-weight: normal; line-height: 1.4; } .ma-wearables .introduction .main-content .text-content p:after{ display: block; content: ""; width: 100px; height: 6px; background: linear-gradient(to right, #6de6ff , #5b00ff); margin-top: 30px; border-radius: 5px; } /*Biostrap Section*/ .ma-wearables .biostrap-section{ margin-top: 120px; } .ma-wearables .biostrap-section .main-content .header-content{ position: relative; margin-top: 80px; } .ma-wearables .biostrap-section .main-content .header-content .left-box{ width: 680px; display: inline-block; margin-left: -80px; top: 50px; } .ma-wearables .biostrap-section .main-content .header-content .left-box .biostrap-mobile{ width: 100%; top: 0; } .ma-wearables .biostrap-section .main-content .header-content .left-box .biostrap-mobile img{ width: 100%; } .ma-wearables .biostrap-section .main-content .header-content .right-box{ width: 540px; position: relative; top: 70px; display: inline-block; left: 80px; } .ma-wearables .biostrap-section .main-content .header-content .right-box .title{ font-weight: normal; font-size: 48px; margin-bottom: 20px; } .ma-wearables .biostrap-section .main-content .header-content .right-box ul { margin: 0 0 30px; } .ma-wearables .biostrap-section .main-content .header-content .right-box ul:after{ clear: both; content: ""; display: block; } .ma-wearables .biostrap-section .main-content .header-content .right-box ul li{ font-size: 14px; float: left; margin-right: 10px; padding: 5px 0; width: 95px; text-align: center; border: solid 1px #FFF; border-radius: 8px; } .ma-wearables .biostrap-section .main-content .header-content .right-box ul li.item-3{ background: #3854c1; border-color: #3854c1; } .ma-wearables .biostrap-section .main-content .header-content .right-box .sub-title{ font-weight: bold; font-size: 28px; margin-bottom: 15px; } .ma-wearables .biostrap-section .main-content .header-content .right-box p{ line-height: 1.7; } .ma-wearables .biostrap-section .main-content .center-content{ width: 1030px; text-align: left; margin: 0 auto; } .ma-wearables .biostrap-section .main-content .center-content:after{ clear: both; content: ""; display: block; } .ma-wearables .biostrap-section .main-content .center-content{ position: relative; top: -80px; } .ma-wearables .biostrap-section .main-content .center-content .title{ font-weight: normalp; font-size: 18px; margin-bottom: 15px; text-align: left; } .ma-wearables .biostrap-section .main-content .center-content .left-box p, .ma-wearables .biostrap-section .main-content .center-content .right-box p{ font-size: 16px; line-height: 1.7; } .ma-wearables .biostrap-section .main-content .center-content .left-box p{ margin-right: 35px; font-size: 16px; } .ma-wearables .biostrap-section .main-content .center-content .left-box p b{ font-size: 18px; } .ma-wearables .biostrap-section .main-content .center-content .right-box p{ margin-right: 35px; } .ma-wearables .biostrap-section .main-content .center-content .right-box p b{ font-size: 18px; } .ma-wearables .biostrap-section .main-content .center-content .left-box, .ma-wearables .biostrap-section .main-content .center-content .right-box{ width: 515px; display: block; text-align: left; float: left; } .ma-wearables .biostrap-section .main-content .buttons-content{ width: 540px; text-align: left; margin-bottom: 70px; position: relative; line-height: 1.4; } .ma-wearables .biostrap-section .main-content .buttons-content:after{ clear: both; content: ""; display: block; } .ma-wearables .biostrap-section .main-content .buttons-content .left-box{ width: auto; float: none; display: inline-block; } .ma-wearables .biostrap-section .main-content .buttons-content .right-box{ width: auto; float: none; display: inline-block; } .ma-wearables .biostrap-section .main-content .buttons-content .left-box .download-app-store{ padding: 0 10px; width: 180px; height: 55px; background: #000; border-radius: 5px; margin: 0; margin-right: 10px; } .ma-wearables .biostrap-section .main-content .buttons-content .left-box .download-app-store img{ width: 100%; height: 100%; } .ma-wearables .biostrap-section .main-content .buttons-content .right-box .download-play-store{ padding: 0 10px; width: 180px; height: 55px; background: #000; border-radius: 5px; margin: 0 8px; } .ma-wearables .biostrap-section .main-content .buttons-content .right-box .download-play-store img{ width: 100%; height: 100%; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about{ margin-top: 80px; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about .big{ font-size: 20px; margin-bottom: 20px; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about .big:after{ content: ""; display: block; width: 70px; height: 6px; border-radius: 10px; background-image: linear-gradient(94deg, #6de6ff 3%, #5b00ff 102%); transform: rotate(180deg); margin-top: 20px; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about p{ margin-bottom: 5px; font-size: 16px; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about a{ color: #FFF; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about a:hover{ text-decoration: underline; } .ma-wearables .biostrap-section .main-content .footer-content{ width: 780px; margin: 0 auto; } .ma-wearables .biostrap-section .main-content .footer-content:after{ clear: both; content: ""; display: block; } .ma-wearables .biostrap-section .main-content .footer-content .left-box{ width: 230px; position: relative; display: block; float: left; font-size: 21px; } .ma-wearables .biostrap-section .main-content .footer-content .left-box p:before{ content: ""; display: block; width: 70px; height: 6px; border-radius: 5px; position: absolute; bottom: -20px; background: linear-gradient(to right, #ff88cb , #00e9ff); } .ma-wearables .biostrap-section .main-content .footer-content .right-box{ width: 510px; display: block; float: right; } .ma-wearables .biostrap-section .main-content .footer-content .right-box p{ text-transform: capitalize; line-height: 1.5; } .ma-wearables .biostrap-section .main-content .footer-content .right-box span{ text-transform: none; } .ma-wearables.cases .content_more_cases{ background: none; } .ma-wearables.cases .content_more_cases h3{ color: #FFF; font-weight: normal; font-size: 48px; } /*Elliegrid Section*/ .ma-wearables .elliegrid-section{ width: 100%; margin-top: -100px; padding-top: 0; } .ma-wearables .elliegrid-section .main-content{ color: #fff; width: 1160px; margin: 0 auto; position: relative; } .ma-wearables .elliegrid-section .main-content .header-content{ color: #424b6a; top: 40px; } .ma-wearables .elliegrid-section .main-content .header-content .elliegrid-mobile{ width: 900px; position: relative; margin: 0 auto; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box{ position: absolute; top: 95px; right: 60px; width: 400px; z-index: 10; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box .title{ font-weight: normal; font-size: 48px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box .title{ display: inline-block; margin-right: 10px; margin-bottom: 20px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box h6{ display: inline-block; font-weight: normal; font-size: 20px; padding-left: 10px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul{ margin: 0 0 30px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul:after{ clear: both; content: ""; display: block; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul li{ color: rgba(112, 127, 178, 0.8); font-size: 14px; float: left; margin-right: 10px; padding: 5px 0; width: 95px; text-align: center; border-radius: 8px; border: solid 1px rgba(112, 127, 178, 0.8); } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul .item-2{ padding: 5px 10px; width: auto; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul .item-3{ border: solid 1px transparent; background: rgba(112, 127, 178, 0.8); color: #fff; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box p{ max-width: 400px; line-height: 1.5; font-size: 16px; } .ma-wearables .elliegrid-section .main-content .center-content{ width: 100%; text-align: left; margin: 0 auto; font-size: 16px; line-height: 1.5; color: #424b6a; } .ma-wearables .elliegrid-section .main-content .center-content:after{ clear: both; content: ""; display: block; } .ma-wearables .elliegrid-section .main-content .center-content .title{ font-weight: normal; margin-bottom: 15px; text-align: left; } .ma-wearables .elliegrid-section .main-content .center-content .left-box, .ma-wearables .elliegrid-section .main-content .center-content .right-box{ width: 48%; display: block; text-align: left; } .ma-wearables .elliegrid-section .main-content .center-content .left-box{ float: left; } .ma-wearables .elliegrid-section .main-content .center-content .right-box{ float: right; } .ma-wearables .elliegrid-section .main-content .buttons-content{ width: 100%; text-align: center; margin-bottom: 70px; margin: 80px 0 0; z-index: 10; } .ma-wearables .elliegrid-section .main-content .buttons-content:after{ clear: both; content: ""; display: block; } .ma-wearables .elliegrid-section .main-content .buttons-content .left-box{ width: auto; float: none; display: inline-block; } .ma-wearables .elliegrid-section .main-content .buttons-content .right-box{ width: auto; float: none; display: inline-block; } .ma-wearables .elliegrid-section .main-content .buttons-content .left-box .download-app-store{ padding: 0 10px; width: 200px; height: 60px; background: #000; border-radius: 5px; margin: 0 8px; } .ma-wearables .elliegrid-section .main-content .buttons-content .left-box .download-app-store img{ width: 100%; height: 100%; } .ma-wearables .elliegrid-section .main-content .buttons-content .right-box .download-play-store{ padding: 0 10px; width: 200px; height: 60px; background: #000; border-radius: 5px; margin: 0 8px; } .ma-wearables .elliegrid-section .main-content .buttons-content .right-box .download-play-store img{ width: 100%; height: 100%; } .ma-wearables .elliegrid-section .main-content .sub-title{ font-weight: bold; font-size: 28px; margin-bottom: 15px; } .ma-wearables .elliegrid-section .mobile_image{ display: none; } /*Inspire section*/ .ma-wearables .inspire{ width: 100%; margin-top: 100px; padding-bottom: 100px; } .ma-wearables .inspire .content{ width: 1160px; margin: 0 auto; padding-top: 120px; top: 120px; padding-bottom: 90px; position: relative; } .ma-wearables .inspire .content:after{ clear: both; display: block; content: ""; } .ma-wearables .inspire .main-content:after{ clear: both; display: block; content: ""; } .ma-wearables .inspire:before{ content: ""; width: 1920px; height: 2500px; position: absolute; background: url("../svg/fondo-inspire.svg"); top: 80px; } .ma-wearables .inspire .content .box-left{ color: #FFF; width: 420px; float: left; line-height: 1.5; font-size: 16px; } .ma-wearables .inspire .content .box-left .first-box .header p{ font-size: 48px; margin-bottom: 20px; } .ma-wearables .inspire .content .box-left .first-box .header ul{ display: inline-block; margin: 0 0 30px; } .ma-wearables .inspire .content .box-left .first-box .header ul li{ font-size: 14px; float: left; margin-right: 10px; padding: 5px 0; width: 95px; text-align: center; border-radius: 8px; border: solid 1px #fff; } .ma-wearables .inspire .content .box-left .first-box .header ul .element-2{ width: 150px; padding: 5px 5px; } .ma-wearables .inspire .content .box-left .first-box .header ul .element-3{ background: rgba(112, 127, 178, 0.8); border: solid 1px transparent; } .ma-wearables .inspire .content .box-left .first-box .title, .ma-wearables .inspire .content .box-left .second-box .title{ font-size: 28px; font-weight: bold; margin-bottom: 20px; } .ma-wearables .inspire .content .box-left .first-box .section-header .description{ font-size: 16px; } .ma-wearables .inspire .content .box-left .second-box{ margin-top: 50px; } .ma-wearables .inspire .content .box-left .second-box .header .second-title{ margin-top: 20px; } .ma-wearables .inspire .content .box-left .third-box{ width: 70%; margin-top: 30px; } .ma-wearables .inspire .content .box-left .third-box .description{ width: 400px; } .ma-wearables .inspire .content .box-left .third-box .button{ width: 168px; height: 49px; border-radius: 29px; background-color: #3cc8e5; position: relative; top: 57px; left: 3px; } .ma-wearables .inspire .content .box-left .third-box .button a{ font-size: 17px; } .ma-wearables .inspire .content .box-right{ width: 740px; float: right; position: relative; top: 130px; top: 0; left: 60px; } .ma-wearables .inspire .content .box-right figure{ width: 100%; } .ma-wearables .inspire .buttons-content{ float: left; padding-left: 0; margin-top: 70px; } .ma-wearables .inspire .buttons-content .download-app-store, .ma-wearables .inspire .buttons-content .download-play-store{ width: 200px; height: 60px; padding: 0 5px; background: #000; border-radius: 5px; float: left; margin-bottom: 15px; } .ma-wearables .inspire .buttons-content .download-app-store{ margin-right: 20px; } .ma-wearables .inspire .buttons-content .download-app-store img, .ma-wearables .inspire .buttons-content .download-play-store img{ width: 100%; height: 100%; } .ma-wearables .biostrap-section .main-content .buttons-content .biostrap-button{ margin-bottom: 40px; } .ma-wearables .apollo .content .box-left .apollo-button{ margin-top: 60px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .welwaze-button{ margin-top: 50px; } .ma-wearables .elliegrid-section .main-content .buttons-content .biostrap-button{ margin: 0 auto 40px; } .ma-wearables .elliegrid-section .main-content .buttons-content .biostrap-button:hover, .ma-wearables .celbrea .content .main-content .welwaze-button:hover{ border: 2px solid #3cc8e5; color: #3cc8e5; } .ma-wearables .inspire .buttons-content .inspire-button{ margin-bottom: 30px; } .ma-wearables .biostrap-button{ width: 200px; height: 56px; line-height: 56px; border-radius: 30px; background: #3cc8e5; border: 2px solid #3cc8e5; position: relative; color: #FFF; font-size: 18px; text-align: center; display: block; transition: all .3s; } .ma-wearables .inspire-button{ width: 210px; height: 56px; line-height: 56px; border-radius: 30px; background: #3cc8e5; border: 2px solid #3cc8e5; position: relative; color: #FFF; font-size: 18px; text-align: center; display: block; transition: all .3s; } .ma-wearables .welwaze-button{ width: 185px; height: 56px; line-height: 56px; border-radius: 30px; background: #3cc8e5; border: 2px solid #3cc8e5; position: relative; color: #FFF; font-size: 18px; text-align: center; display: block; transition: all .3s; } .ma-wearables .apollo-button{ width: 207px; height: 56px; line-height: 56px; border-radius: 30px; background: #3cc8e5; border: 2px solid #3cc8e5; position: relative; color: #FFF; font-size: 18px; text-align: center; display: block; transition: all .3s; } .ma-wearables .biostrap-button:hover, .ma-wearables .inspire-button:hover, .ma-wearables .welwaze-button:hover, .ma-wearables .apollo-button:hover{ color: #FFF; background: transparent; border-color: #FFF; } /*One Milo Section*/ .ma-wearables .onemilo-content{ float: left; width: 100%; } .ma-wearables .onemilo-content .center-content{ width: 1180px; text-align: left; margin: 0 auto; float: left; padding: 200px 0 80px; color: #FFF; } .ma-wearables .onemilo-content .center-content:after{ clear: both; content: ""; display: block; } .ma-wearables .onemilo-content .left-box{ width: 680px; display: block; float: left; margin: -100px 0 0 -80px; } .ma-wearables .onemilo-content .right-box{ width: 540px; float: right; font-size: 16px; } .ma-wearables .onemilo-content .right-box .title{ font-weight: normal; font-size: 48px; margin-bottom: 30px; } .ma-wearables .onemilo-content .right-box ul{ margin: 0 0 50px; } .ma-wearables .onemilo-content .right-box ul:after{ clear: both; content: ""; display: block; } .ma-wearables .onemilo-content .right-box ul li{ font-size: 18px; float: left; margin-right: 10px; padding: 5px 20px; width: auto; text-align: center; border: solid 1px #FFF; border-radius: 8px; } .ma-wearables .onemilo-content .right-box ul li.item-3{ background: #3854c1; border-color: #3854c1; } .ma-wearables .onemilo-content .right-box .sub-title{ font-weight: bold; font-size: 28px; margin-bottom: 15px; } .ma-wearables .onemilo-content .right-box p{ line-height: 1.7; } /*MOBILE*/ @media (max-width: 1700px){ .ma-wearables .introduction .main-content{ width: 100%; } .ma-wearables .case-studies .content{ width: 100%; } } @media (max-width: 1500px){ .ma-wearables .celbrea .content{ width: 90%; } .ma-wearables .celbrea .content .main-content .box-left{ width: 33.333%; } .ma-wearables .celbrea .content .main-content .box-center{ width: 33.333%; top: -50px; } .ma-wearables .celbrea .content .main-content .box-center figure{ width: 100%; } .ma-wearables .celbrea .content .main-content .box-right{ width: 33.333%; } .ma-wearables .celbrea .content .footer-celbrea{ bottom: 0; } .ma-wearables .celbrea .content .main-content .box-right .second-box{ margin-top: 30px; } .ma-wearables .celbrea .more_work_about{ top: -180px; } .ma-wearables .apollo .content .box-left{ left: 0; } .ma-wearables .biostrap-section .main-content .header-content .right-box{ left: 40px; } .ma-wearables .celbrea .content .main-content .box-center{ margin-left: 0; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul li{ width: 90px;} } @media (max-width: 1280px){ /* Hero */ .ma-wearables .hero-section { height: 75vh; min-height: 830px ; } .ma-wearables .hero-section .wearable_one{ margin-right: -510px; right: 0; top: -40px; } .ma-wearables .hero-section .phone { width: 800px; margin-left: -400px; bottom: -140px; } .ma-wearables .hero-section .content .case_study_title{ font-size: 19px; } .ma-wearables .hero-section .content .case_title{ font-size: 50px; } .ma-wearables .hero-section .content .description{ font-size: 25px; } .ma-wearables .hero-section .wearable_two{ margin-left: -950px; } /* Biostrap */ .ma-wearables .introduction .main-content, .ma-wearables .biostrap-section .main-content{ width: 90%; } .ma-wearables .biostrap-section .main-content .header-content .left-box{ width: 520px; top: 30px; margin-left: 0; } .ma-wearables .biostrap-section .main-content .header-content .right-box{ left: 50px; top: 340px; width: 410px; } .ma-wearables .biostrap-section .main-content .center-content{ top: 0; margin-bottom: 60px; width: 90%; } .ma-wearables .biostrap-section .main-content .center-content .left-box, .ma-wearables .biostrap-section .main-content .center-content .right-box{ width: 48%; } .ma-wearables .biostrap-section .main-content .center-content .right-box{ float: right; } .ma-wearables .product-innovation .content{ width: 90%; left: auto; margin: 0 auto; max-width: 1010px; } .ma-wearables .product-innovation .content .left-content{ width: 40%; } .ma-wearables .product-innovation .content .right-content{ width: 55%; } .ma-wearables .apollo .content .box-right{ left: 0; } .ma-wearables .biostrap-section:before{ top: 160px; } .ma-wearables .product-innovation .content .right-content p{ font-size: 36px; } .ma-wearables .apollo .content{ padding-top: 60px; width: 90%; margin: 0 auto; } .ma-wearables .apollo .content .box-right{ width: 500px; left: auto; right: -50px; } .ma-wearables .apollo .content .box-left{ left: 0; } .ma-wearables .celbrea .content .main-content .box-left{ width: 400px; } .ma-wearables .celbrea .content .main-content .box-center{ width: 450px; top: -140px; float: right; } .ma-wearables .celbrea .content .main-content .box-center figure{ width: 100%; } .ma-wearables .celbrea .content .main-content .box-right{ width: 100%; padding-left: 0; margin-top: -230px; } .ma-wearables .celbrea .content .main-content .box-right .first-box{ width: 48%; float: left; } .ma-wearables .celbrea .content .main-content .box-right .second-box{ width: 48%; float: right; } .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .welwaze-button{ margin-top: 50px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer{ width: 100%; margin-top: 50px; max-width: 700px; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left{ padding-left: 0; width: 30%; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right{ padding-left: 0; width: 70%; } .ma-wearables .elliegrid-section .main-content{ width: 90%; } .ma-wearables .elliegrid-section .main-content .header-content .elliegrid-mobile{ margin-left: -20px; width: 670px; margin-top: 140px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box{ top: 20px; } .ma-wearables .elliegrid-section .main-content .center-content{ width: 100%; } .ma-wearables .elliegrid-section .main-content .center-content .left-box{ width: 48%; } .ma-wearables .elliegrid-section .main-content .center-content .right-box{ width: 48%; float: right; } .ma-wearables .inspire .content{ width: 90%; } .ma-wearables .inspire .content .box-right{ width: 600px; margin-right: -50px; } .ma-wearables .biostrap-section .main-content .buttons-content{ width: 410px; } .ma-wearables .apollo .content .box-left{ width: 390px; } .ma-wearables .celbrea .more_work_about{ top: 0; } .ma-wearables .celbrea .content { margin: 340px auto 0; } .ma-wearables .elliegrid-section{ margin-top: -30px; } .ma-wearables .hero-section .content{ width: 90%; left: 5%; margin-left: 0; } .ma-wearables .inspire:before{ height: 2760px; } .ma-wearables .onemilo-content .left-box{ width: 510px; margin: -100px 0 0 -70px; } .ma-wearables .onemilo-content .center-content{ width: 100%; } .ma-wearables .onemilo-content .right-box{ width: 450px; float: right; margin-top: -20px; } } @media (max-width: 1100px){ .ma-wearables .biostrap-section .main-content .header-content{ padding-top: 80px; } .ma-wearables .apollo .content{ padding-top: 0; } .ma-wearables .apollo .content .box-right{ width: 500px; } .ma-wearables .biostrap-section .main-content .header-content .left-box{ width: 450px; left: -30px; } .ma-wearables .biostrap-section{ margin-top: -100px; } .ma-wearables .apollo .content .box-right{ width: 450px; top: 50px; } .ma-wearables .inspire .content .box-right{ margin-right: -150px; } .ma-wearables .biostrap-section:before { top: 240px; height: 2050px; background-size: contain; } .ma-wearables .onemilo-content .right-box{ width: 380px; } } @media (max-width: 1024px){ .ma-wearables .product-innovation .content .right-content{ padding-top: 40px; } .ma-wearables .product-innovation .content .right-content p{ font-size: 32px; } .ma-wearables .biostrap-section .main-content .footer-content{ width: 90%; } .ma-wearables .biostrap-section .main-content .footer-content .left-box{ float: none; margin: 0 auto; padding-bottom: 40px; width: 90%; max-width: 450px; } .ma-wearables .biostrap-section .main-content .footer-content .right-box{ float: none; margin: 0 auto; width: 90%; max-width: 450px; } .ma-wearables .biostrap-section .main-content .footer-content .left-box p:before{ bottom: 30px; } .ma-wearables .biostrap-section .main-content { width: 100%; margin: 0; } .ma-wearables .biostrap-section .main-content .header-content{ padding-top: 50px; top: 0; } .ma-wearables .biostrap-section .main-content .header-content .left-box{ width: 90%; max-width: 520px; float: none; margin: 0 auto; display: block; left: -20px; } .ma-wearables .biostrap-section .main-content .header-content .right-box{ top: 0; width: 90%; position: relative; left: auto; margin: 0 auto; display: block; max-width: 450px; margin-bottom: 40px; margin-top: -80px; } .ma-wearables .biostrap-section .main-content .center-content{ top: 0; width: 90%; max-width: 450px; } .ma-wearables .biostrap-section .main-content .center-content .left-box, .ma-wearables .biostrap-section .main-content .center-content .right-box{ width: 100%; margin-bottom: 40px; } .ma-wearables .biostrap-section{ margin-top: 0; margin-bottom: 100px; } .ma-wearables .apollo .content .box-right{ left: 0; margin: 0 auto; width: 90%; max-width: 470px; float: none; top: 40px; } .ma-wearables .apollo .content .box-left{ float: none; left: auto; margin: 0 auto; } .ma-wearables .apollo .content .box-right figure{ float: none; } .ma-wearables .biostrap-section:before{ height: 3430px; background-size: cover; background-position: right; top: 0; } .ma-wearables .celbrea .content{ margin-top: 160px; } .ma-wearables .celbrea .content .main-content .box-left{ width: 100%; max-width: 450px; margin: 0 auto; float: none; margin-top: -40px; } .ma-wearables .celbrea .content .main-content .box-center{ width: 100%; max-width: 450px; top: 0; margin: 0 auto; float: none; display: none; } .ma-wearables .celbrea .content .main-content .box-right{ width: 100%; padding-left: 0; max-width: 450px; margin: 0 auto; float: none; } .ma-wearables .celbrea .content .main-content .box-right .first-box{ width: 100%; float: left; } .ma-wearables .celbrea .content .main-content .box-right .second-box{ width: 100%; float: right; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left{ width: 90%; max-width: 450px; padding-left: 0; margin: 40px auto; float: none; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right{ width: 90%; max-width: 450px; float: none; padding-left: 0; margin: 0 auto; } .ma-wearables .elliegrid-section .main-content .center-content{ max-width: 450px; margin-top: 40px; } .ma-wearables .elliegrid-section .main-content .center-content .left-box{ width: 100%; } .ma-wearables .elliegrid-section .main-content .center-content .right-box{ width: 100%; } .ma-wearables .elliegrid-section .main-content .header-content .elliegrid-mobile{ position: relative; width: 100%; max-width: 600px; margin: 80px auto 30px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box{ position: relative; right: auto; margin: 0 auto; width: 100%; max-width: 450px; } .ma-wearables .inspire{ margin-top: 30px; } .ma-wearables .inspire .content .box-right{ width: 100%; max-width: 450px; float: none; margin: 0 auto; top: 30px; } .ma-wearables .inspire .content .box-left{ float: none; margin: 0 auto; width: 100%; max-width: 450px; } .ma-wearables .inspire .content .box-right figure{ transform: none !important; } .ma-wearables .inspire:before{ height: 3600px; top: 192px; } .ma-wearables .hero-section .phone{ width: 90%; margin-left: 0; left: auto; bottom: auto; top: 100%; max-width: 730px; margin: 0 auto; float: none; position: relative; margin-top: -230px; } .ma-wearables .case-studies .content .case_studies_list{ width: 90%; } .ma-wearables .case-studies .content .case_studies_list li a{ width: 100%; font-size: 13px; } .ma-wearables .biostrap-section .main-content .buttons-content{ margin: 0 auto; width: 90%; max-width: 450px; } .ma-wearables .elliegrid-section{ margin-top: 140px; padding-top: 0; } .ma-wearables .elliegrid-section .main-content{ padding-top: 30px; } .ma-wearables .celbrea .more_work_about{ margin: 0 auto; max-width: 450px; margin-top: 40px; } .ma-wearables .apollo .content .box-left{ width: 100%; max-width: 450px; } .ma-wearables .celbrea .content .mobile_image{ display: block; max-width: 450px; width: 100%; margin: 0 auto; } .ma-wearables .elliegrid-section .mobile_image{ display: block; max-width: 450px; width: 100%; margin: 0 auto; } .ma-wearables .elliegrid-section .main-content .header-content .elliegrid-mobile{ display: none; } .ma-wearables .elliegrid-section .main-content .header-content{ top: 0; } .ma-wearables.cases .content_more_cases h3, .ma-wearables .biostrap-section .main-content .header-content .right-box .title, .ma-wearables .apollo .content .box-left .first-box .header p, .ma-wearables .celbrea .content .main-content .box-left .first-box .header .title, .ma-wearables .elliegrid-section .main-content .header-content .absolute-box .title, .ma-wearables .inspire .content .box-left .first-box .header p, .ma-wearables .onemilo-content .right-box .title{ font-size: 28px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header h6, .ma-wearables .elliegrid-section .main-content .header-content .absolute-box h6{ font-size: 13px; padding-left: 0; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul li, .ma-wearables .biostrap-section .main-content .header-content .right-box ul li, .ma-wearables .apollo .content .box-left .first-box .header ul li, .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul li, .ma-wearables .inspire .content .box-left .first-box .header ul li, .ma-wearables .onemilo-content .right-box ul li{ width: auto; font-size: 13px; padding: 5px 10px; margin-bottom: 10px; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul{ width: 100%; } .ma-wearables .celbrea .content .main-content .box-left .first-box .header ul .element-3{ width: auto; padding: 5px 10px; } .ma-wearables .elliegrid-section .main-content .header-content .absolute-box ul .item-2, .ma-wearables .inspire .content .box-left .first-box .header ul .element-2{ width: auto; padding: 5px 10px; } .ma-wearables .inspire .content .box-left .third-box .description, .ma-wearables .inspire .content .box-left .third-box{ width: 100%; } .ma-wearables .introduction .main-content, .ma-wearables .biostrap-section .main-content, .ma-wearables .apollo .content .box-left p, .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .description, .ma-wearables .celbrea .content .main-content .box-right .first-box .description, .ma-wearables .celbrea .content .main-content .box-right .second-box .description, .ma-wearables .celbrea .content .main-content .box-right .first-box .second-title, .ma-wearables .celbrea .content .main-content .box-right .second-box .title, .ma-wearables .elliegrid-section .main-content .header-content .absolute-box p, .ma-wearables .elliegrid-section .main-content .center-content, .ma-wearables .inspire .content .box-left .first-box .section-header .description, .ma-wearables .inspire .content .box-left, .ma-wearables .onemilo-content .right-box{ font-size: 15px; } .ma-wearables .introduction .main-content{ width: 100%; } .ma-wearables .biostrap-section .main-content .header-content .right-box .sub-title, .ma-wearables .apollo .content .box-left .sub-title, .ma-wearables .celbrea .content .main-content .box-left .first-box .section-header .title, .ma-wearables .celbrea .content .main-content .box-right .first-box .title, .ma-wearables .elliegrid-section .main-content .sub-title, .ma-wearables .inspire .content .box-left .first-box .title, .ma-wearables .inspire .content .box-left .second-box .title, .ma-wearables .onemilo-content .right-box .sub-title{ font-size: 20px; } .ma-wearables .biostrap-button, .ma-wearables .apollo-button, .ma-wearables .celbrea .content .main-content .welwaze-button, .ma-wearables .biostrap-button, .ma-wearables .inspire .buttons-content .inspire-button{ width: 160px; height: 40px; line-height: 40px; font-size: 15px; margin: 0 auto 20px; } .ma-wearables .celbrea .content .main-content .welwaze-button{ margin-top: 30px; } .ma-wearables .inspire .buttons-content{ float: none; padding-left: 0; margin: 70px auto; width: 300px; } .ma-wearables .biostrap-section .main-content .buttons-content .left-box .download-app-store, .ma-wearables .elliegrid-section .main-content .buttons-content .left-box .download-app-store, .ma-wearables .biostrap-section .main-content .buttons-content .right-box .download-play-store, .ma-wearables .elliegrid-section .main-content .buttons-content .right-box .download-play-store, .ma-wearables .inspire .buttons-content .download-app-store, .ma-wearables .inspire .buttons-content .download-play-store{ width: 140px; height: 40px; } .ma-wearables .biostrap-section .main-content .buttons-content .stores{ width: 310px; margin: 40px auto; } .ma-wearables .product-innovation{ margin-top: 50px; } .ma-wearables .elliegrid-section .main-content .buttons-content, .ma-wearables .inspire .buttons-content{ margin-top: 30px; } .mobile_only{ display: block !important; } .desktop_only{ display: none !important; } .ma-wearables .biostrap-section .main-content .header-content .right-box ul li.item-3{ background-color: #262A90; border-color: #262A90; } .ma-wearables .biostrap-section .main-content .buttons-content .more_work_about{ margin-top: 40px; } .ma-wearables .biostrap-section .main-content .header-content .left-box .biostrap-mobile{ top: -80px; } .ma-wearables .apollo{ padding-top: 0; } .ma-wearables .inspire .content{ padding-top: 0; } .ma-wearables .case-studies .content .case_studies_list li.mobile_only{ display: inline-block !important; } .ma-wearables .case-studies .content .case_studies_list li.desktop_only{ display: none; } .ma-wearables .onemilo-content .left-box { width: 100%; margin: 0 auto; max-width: 440px; float: none; } .ma-wearables .onemilo-content .right-box{ width: 100%; float: none; margin: 0 auto; max-width: 470px; } .ma-wearables .onemilo-content .center-content{ padding-top: 40px; } } @media (max-width: 850px){ .ma-wearables .product-innovation .content .right-content p{ font-size: 26px; } .ma-wearables .introduction{ width: 90%; margin: 0 auto; } } @media(max-width:800px){ /*Hero*/ .ma-wearables .hero-section .content .case_title{ font-size: 40px; } .ma-wearables .hero-section .content .tags_list{ width: 385px; } .ma-wearables .hero-section .content .tags_list li{ width: 118px; } .ma-wearables .product-innovation .content{ max-width: 400px; text-align: center; } .ma-wearables .product-innovation .content .left-content{ width: 100%; } .ma-wearables .product-innovation .content .right-content{ width: 100%; } .ma-wearables .hero-section{ min-height: 800px; margin-bottom: 90px; margin-bottom: 20%; } .ma-wearables .hero-section .hero_watch { width: 800px; margin-left: -400px; margin-top: -250px; } .ma-wearables .case-studies .content .case_studies_list{ text-align: center; } .ma-wearables .case-studies .content .case_studies_list li{ width: 32%; margin-bottom: 15px; float: none; display: inline-block; } .ma-wearables .hero-section .content .tags_list li{ font-size: 14px; } } @media (max-width:750px){ .ma-wearables .case-studies .content figure{ width: 90%; left: 20px; } /* Inspire */ .ma-wearables .inspire:before { height: 3900px; top: 90px; background-repeat: no-repeat; } .ma-wearables .inspire .content .box-right { width: 100%; max-width: 450px; float: none; margin: 0 auto; top: 30px } .cases .content_more_cases .content_other_cases li{ max-width: 390px; margin: 0 auto 20px; float: none !important; } .ma-wearables .hero-section .phone{ margin-top: -130px; } .ma-wearables .hero-section{ min-height: 700px; } .ma-wearables .biostrap-section:before{ height: 3370px; } } @media (max-width:620px){ /* Hero */ .ma-wearables .hero-section .wearable_one{ margin-right: -790px; } .ma-wearables .hero-section .content .case_title{ font-size: 40px; } .ma-wearables .hero-section .content .description{ font-size: 20px; } /*Biostrap*/ .ma-wearables .biostrap-section .main-content .header-content .left-box{ left: 0; } /* Elliegrid */ .ma-wearables .elliegrid-section .main-content .header-content .elliegrid-mobile{ left: 30px; } /* Inspire */ .ma-wearables .inspire .content .box-right { top: 20px; left: 0; } } @media (max-width: 550px){ .ma-wearables .biostrap-section:before { height: 3230px; } } @media (max-width: 500px){ /* Hero */ .ma-wearables .hero-section { height: 75vh; min-height: 600px; } .ma-wearables .hero-section .wearable_one{ margin-right: -555px; right: 0; top: -125px; } .ma-wearables .hero-section .wearable_two{ margin-left: -800px; } .ma-wearables .hero-section .content .case_title{ font-size: 30px; } .ma-wearables .hero-section .content .description{ font-size: 19px; } .ma-wearables .introduction .main-content .text-content p{ font-size: 17px; } .ma-wearables .introduction .main-content .text-content{ width: 100%; } /*Product innovation*/ .ma-wearables .product-innovation .content { left: 0; width: 100%; } .ma-wearables .product-innovation .content .right-content{ float: none; width: 100%; } .ma-wearables .product-innovation .content .right-content p{ font-size: 23px; } .ma-wearables .product-innovation .content .left-content{ float: none; margin: auto; } .ma-wearables .product-innovation .content .left-content figure{ width: 70%; margin: 0 auto; } /*Case studies*/ .ma-wearables .case-studies .content{ width: auto; left: 0; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-left{ margin: 40px 0; } .ma-wearables .celbrea .content .footer-celbrea .content-footer .box-right, .ma-wearables .biostrap-section .main-content .footer-content .left-box, .ma-wearables .biostrap-section .main-content .footer-content .right-box{ margin: 0; } .ma-wearables .hero-section .content{ margin-top: -150px; width: 90%; left: 5%; margin-left: 0; } .ma-wearables .hero-section .content .tags_list li { font-size: 13px; width: 95px; height: 32px; line-height: 32px; } .ma-wearables .hero-section .content .tags_list{ width: 315px; } .ma-wearables .biostrap-section:before { height: 3110px; } .ma-wearables .celbrea .content{ margin-top: 90px; } .ma-wearables .content_wwu h3{ font-size: 30px; } .ma-wearables .inspire{ padding-bottom: 40px; } } @media (max-width: 490px){ .ma-wearables .biostrap-section:before { height: 3050px; } }