E:
/
home
/
kbcomunicacao1
/
Web
/
paulomagri
/
css
/
Upload File
HOME
/* Theme Name: Metrico - Responsive Bootstrap 4 Landing page template Author: Coderthemes Author e-mail: coderthemes@gmail.com Version: 2.0.0 Created: March 2016 File Description: Main CSS file of the template */ /* Google font */ @import url('https://fonts.googleapis.com/css?family=Libre+Franklin:400,500,600'); body { background-color: #FFF; color: #505458; font-size: 14px; font-family: 'Open Sans', sans-serif; } .logo { max-width: 300px; } a{ text-decoration: none !important; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } /* BUTTONS */ .btn { font-size: 14px; } .btn-sm{ font-size: 12px; } .btn-dark { background-color: #3b4a69; color: #fff !important; padding: 9px 20px !important; text-transform: uppercase; font-weight: 500; border: none; letter-spacing: 0.04em; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } .btn-white { background-color: #fff; color: #505458 !important; padding: 9px 20px !important; text-transform: uppercase; font-weight: 500; letter-spacing: 0.04em; border: none; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } .btn-custom,.btn-custom:hover,.btn-custom:focus { background-color: #43cea2; color: #fff !important; padding: 9px 20px !important; text-transform: uppercase; font-weight: 500; letter-spacing: 0.04em; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } .btn-dark:hover,.btn-white:hover { background-color: #43cea2; color: #fff !important; box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12); } .btn-yellow { background-color: #f9c851; color: #ffffff !important; padding: 9px 20px !important; text-transform: uppercase; font-weight: 500; letter-spacing: 0.04em; -webkit-transition: all 400ms ease-in-out; -moz-transition: all 400ms ease-in-out; -o-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; } .video-btn { color: #ffffff !important; letter-spacing: 1px; padding-top: 20px; outline: none !important; box-shadow: none !important; } .video-btn i { margin-right: 7px; width: 34px; height: 34px; border: 2px solid #fff; border-radius: 50%; line-height: 30px; vertical-align: middle; text-align: center; font-size: 12px; padding-left: 3px; margin-left: -12px; } .btn-app-download { padding: 10px 22px 10px 65px; position: relative; border: 2px solid #43cea2; display: inline-block; color: #43cea2; margin-right: 10px; text-align: left; } .btn-app-download:hover,.btn-app-download:focus{ color: #fff; outline: none; background: #43cea2; } .btn-app-download i { font-size: 30px; left: 0; line-height: 1; margin: 13px 0 0 20px; position: absolute; top: 0; } .btn-app-download strong { display: block; font-weight: 700; margin-bottom: 6px; } .btn-app-download span { display: block; font-size: 11px; font-weight: 700; letter-spacing: 0.5px; margin-top: -3px; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); -moz-opacity: 0.8; -khtml-opacity: 0.8; opacity: 0.8; } .btn-purchase { font-size: 16px; } .btn-purchase i { font-size: 36px; } .btn-purchase span { font-size: 14px; opacity: 1; } /* HELPER CLASSES */ h1 { font-size: 36px; } h2 { font-size: 30px; } h3 { font-size: 24px; } h4 { font-size: 17px; } h1, h2, h3 { margin-top: 20px; margin-bottom: 10px; } h4, h5, h6 { margin-top: 10px; margin-bottom: 10px; } .center-page { float: none; margin: 0 auto; } .section { padding-top: 100px; padding-bottom: 100px; } .section-md { padding-top: 70px; padding-bottom: 70px; } .section-lg { padding-top: 150px; padding-bottom: 150px; } .padding-b-0 { padding-bottom: 0px !important; } .bg-white { background-color: #fff !important; } .bg-dark { background-color: #28282e !important; } .title { margin-top: 0px; font-size: 26px; } .title-alt { color: #767D8E; line-height: 24px; margin: 0px auto 50px auto; font-size: 15px; } .text-muted { color: #98a6ad !important; } .grosso{height: 420px; border-top: 4px solid #1A5B41; border-bottom: 4px solid #1A5B41; border-right: 4px solid #1A5B41; margin-top: -30px; margin-bottom: -50px; padding: 0} .fino{height: 420px; border: 1px solid #1A5B41; margin-top: 20px; margin-left: 50px; padding-bottom: 20px} .maos{background: url(../images/iustracao1.png); background-repeat: no-repeat;} .vertical-content { display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; align-items: center; -webkit-align-items: center; justify-content: center; -webkit-justify-content: center; flex-direction: row; -webkit-flex-direction: row; } .bg-img { background: url("../images/bg-1.jpg") center; position: relative; background-size: cover; } .bg-img-1 { background: url("../images/bg-2.jpg") center; position: relative; background-size: cover; } .bg-overlay { position: absolute; width: 100%; height: 100%; top: 0; background-color: rgba(0,0,0,0.7); } .bg-trans { background-color: transparent !important; } .bg-solid { background-color: #28282e !important; background-image: url("../images/bg-pattern.png"); background-repeat: repeat; } .bg-solid-1 { background-color: #6A76FC !important; background-image: url("../images/bg-pattern.png"); background-repeat: repeat; } .bg-solid-2 { background-color: #43CEA2 !important; background-image: url("../images/bg-pattern.png"); background-repeat: repeat; } .bg-overlay-gradient { opacity: 0.7; background: #fc00ff; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #fc00ff , #00dbde); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #fc00ff , #00dbde); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .bg-gradient { background: #2c3e50; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #2c3e50 , #3498db); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #2c3e50 , #3498db); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .shadow { -moz-box-shadow: 0 2px 2px rgba(0,0,0,.1); -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.1); box-shadow: 0 2px 2px rgba(0,0,0,.1) !important; } .text-colored { color: #43cea2; } iframe { max-width: 100%; } .frame-border { border: 9px solid rgba(0, 0, 0, 0.3); webkit-border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; border-radius: 5px 5px 5px 5px; } /* Navbar */ .navbar-default .navbar-nav>li>a { color: #182433 !important; letter-spacing: 0.03em; } .navbar-default .navbar-nav>li>a:hover { color: #43cea2 !important; } .navbar-custom { background-color: #f2f6fa; border: none; padding: 10px 0px; margin-bottom: 0px; border-radius: 0px; z-index: 9999; -webkit-transition: background-color 1s ease-in-out, border 1s ease-in-out; -moz-transition: background-color 1s ease-in-out, border 1s ease-in-out; -o-transition: background-color 1s ease-in-out, border 1s ease-in-out; transition: background-color 1s ease-in-out, border 1s ease-in-out; } .navbar-custom .navbar-brand { height: auto; } .navbar-custom-dark.navbar-default .navbar-nav>li>a { color: #ddd !important; } .navbar-toggle { background-color: transparent !important; margin-top: 14px; border: none; } .navbar-default .navbar-toggle .icon-bar { background-color: #3B4A69; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { background-color: transparent; color: #43cea2 !important; } .nav-alt.navbar-default .navbar-nav>li>a { font-weight: 500; text-transform: uppercase; font-size: 13px; } /* STICKY HEADER */ .sticky-wrapper { height: 0px !important; z-index: 9999; } .is-sticky.navbar-custom{ background-color: #ffffff !important; width: 100%; -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.1); -moz-box-shadow: 0 2px 2px rgba(0,0,0,.1); box-shadow: 0 2px 2px rgba(0,0,0,.1); } .logo .logo-white { display: inline-block; } .is-sticky .logo .logo-dark { display: inline-block; } .is-sticky .logo .logo-white { display:none; } .logo .logo-dark { display: none; } .is-sticky.navbar-custom .navbar-nav li a { color: #333 !important; } /* Home Typed */ .typed-cursor { opacity: 1; -webkit-animation: blink .6s infinite; -moz-animation: blink .6s infinite; -ms-animation: blink .6s infinite; -o-animation: blink .6s infinite; animation: blink .6s infinite; } @-webkit-keyframes blink { 0% { opacity: 1; } 50% { opacity: 1; } 50.01% { opacity: 0; } 100% { opacity: 0; } } @-moz-keyframes blink { 0% { opacity: 1; } 50% { opacity: 1; } 50.01% { opacity: 0; } 100% { opacity: 0; } } @-ms-keyframes blink { 0% { opacity: 1; } 50% { opacity: 1; } 50.01% { opacity: 0; } 100% { opacity: 0; } } @-o-keyframes blink { 0% { opacity: 1; } 50% { opacity: 1; } 50.01% { opacity: 0; } 100% { opacity: 0; } } @keyframes blink { 0% { opacity: 1; } 50% { opacity: 1; } 50.01% { opacity: 0; } 100% { opacity: 0; } } /* Home */ .home { background-color: #f2f6fa; padding-bottom: 150px; } .home-wrapper p { font-size: 15px; letter-spacing: 2px; color: #787787; } .text-tran-box { background: #43cea2; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #43cea2 , #185a9d); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #43cea2 , #185a9d); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .text-tran-box-dark { background: #24C6DC; /* fallback for old browsers */ background: -webkit-linear-gradient(to left, #24C6DC , #514A9D); /* Chrome 10-25, Safari 5.1-6 */ background: linear-gradient(to left, #24C6DC , #514A9D); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ } .text-transparent { background: #f2f6fa; color: #240e35; mix-blend-mode: lighten; overflow: hidden; font-size: 48px; margin-bottom: 40px; line-height: 54px; font-weight: 600; } .text-tran-box-dark .text-transparent { color: #fff; background: #28282e; mix-blend-mode: darken; } .home-alt p { color: #eee !important; } .home-alt h1 { color: #ffffff; font-size: 48px; margin-bottom: 40px; line-height: 54px; font-weight: 600; } /* FUN FACTS / Testimonials Box */ .facts-box { margin-top: -40px; background: #fff; /*box-shadow: 0 -3px 31px 0 rgba(0, 0, 0, 0.05),0 6px 20px 0 rgba(0, 0, 0, 0.02);*/ padding: 0px 20px; border-radius: 15px 15px 0 0; } .facts-box h2 { color: #767D8E; } .facts-box p { margin-bottom: 20px; } .testimonial-cta { padding: 20px; z-index: 9; position: relative; } .testimonial-cta img{ height: 54px; width: 54px; float: left; } .testimonial-cta p { padding-left: 65px; margin-bottom: 0px; font-size: 15px; line-height: 26px; } /* Features */ .features-box h3{ font-size: 18px; } .features-box p{ line-height: 26px; width: 85%; margin: 10px auto; } .feature-icon { height: 80px; width: 80px; border: 2px solid #767D8E; margin: 0px auto; border-radius: 50%; font-size: 42px; line-height: 84px; } .features-box-fill .feature-icon{ background-color: #767D8E; color: #ffffff } .features-alt i{ font-size: 42px; } .features-alt h4{ font-style: italic; margin-bottom: 0px; } .features-alt h3{ margin-top: 5px; margin-bottom: 20px; } .features-alt p { font-size: 15px; line-height: 24px; } .feat-facts { display: table; width: 100%; margin-top: 20px; } .feat-facts .feat-facts-box { display: table-cell; vertical-align: middle; text-align: center; } .feat-facts .feat-facts-box h2 { color: #43cea2; } .feat-facts .feat-facts-box h4 { font-weight: 600; } .feat-facts .feat-facts-box p { font-style: italic; } /* Pricing */ .pricing-column { position: relative; margin-bottom: 40px; } .pricing-column .inner-box { position: relative; margin: 20px auto 0px auto; max-width: 320px; padding: 0px 30px 50px; border: 2px solid #767D8E; } .inner-box p { padding: 0px 20px; text-align: center; font-size: 15px; line-height: 26px; color: #7f7f7f; margin-bottom: 30px; } .inner-box.active { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .pricing-column .plan-header { position: relative; padding: 30px 20px 25px; } .pricing-column .plan-title { font-size: 16px; margin-bottom: 10px; color: #43cea2; text-transform: uppercase; letter-spacing: 1px; font-weight: 400; } .pricing-column .plan-price { font-size: 38px; margin-bottom: 10px; color: #435966; } .pricing-column .plan-duration { font-size: 13px; color: #98a6ad; } .pricing-column .plan-stats { position: relative; padding: 30px 20px 15px; } .pricing-column .plan-stats li { margin-bottom: 15px; line-height: 24px; } .pricing-column .plan-stats li i { font-size: 18px; width: 26px; vertical-align: middle; } /* Clients */ .client-list { padding-top: 30px; } /* Subscribe Form */ .subscribe-form h3 { color: #fff; margin: 0px 0px 30px 0px; } .subscribe-form form{ position: relative; max-width: 600px; margin: 0px auto; } .subscribe-form input { padding: 15px 20px; width: 100%; font-size: 17px; color: #fff; border: none; outline: none !important; padding-right: 150px; padding-left: 30px; background-color: rgba(255, 255, 255, 0.19); border-radius: 30px; } .subscribe-form button { position: absolute; top: 4px; right: 4px; outline: none !important; border-radius: 30px; border: none; color: #fff; font-size: 17px; background: #43cea2; padding: 11px 30px; } /* Footer */ .footer { padding: 20px 0px; border-top: 1px solid #3B3B40; } .copyright { color: #a0a0a0; margin: 0px; } /* Testimonial */ .testi-img { height: 68px; width: 68px; margin-bottom: 10px; margin-top: 25px; } .testi-text { line-height: 30px; letter-spacing: 0.04em; font-size: 15px; } /* PORTFOLIO (WORKS)*/ .thumb { background-color: #ffffff; border: 1px solid #eee; border-radius: 3px; box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1); margin-top: 20px; margin-bottom: 20px; padding: 10px; width: 100%; } .thumb-img { border-radius: 2px; overflow: hidden; width: 100%; } .gal-detail h4 { margin: 20px 0px 5px; font-weight: 600; font-size: 16px; } .gal-detail h4 a{ color: #43cea2; } .gal-detail p { font-size: 13px; } /* TEAM MEMBER */ .team-box { margin: 20px 0px; } .team-box img { max-width: 240px; } .team-box h4 { margin-bottom: 5px; } .team-box p { color: #98a6ad; margin-bottom: 20px; } .team-member-social a{ background-color: #F9F9F9 !important; color: #505458; font-size: 12px !important; line-height: 34px !important } .team-member-social a:hover { background-color: #43cea2 !important; } /* Home Video */ .home-video { position: relative; } .home-video .container{ max-width: none; } .video-bg-slider { height: 600px; background: #000; position: relative; } .video-bg-slider:after{ background:rgba(0, 0, 0, 0.5); content: ""; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 2; } .slidero { padding-top: 10px; top: 50%; transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); -webkit-transform: translateY(-50%); position: absolute; width: 100%; z-index: 100; } /* Contact */ .contact-form .form-control { height: 42px; box-shadow: none; border: 2px solid rgba(40, 40, 46, 0.3); font-size: 14px; } textarea.form-control { height: auto !important; } .error { margin: 8px 0px; display: none; color: red; } #ajaxsuccess { font-size: 16px; width: 100%; display: none; clear: both; margin: 8px 0px; } /* HOME REGISTER */ .home-register { padding-top: 70px; } .home-register .home-wrapper h1 { color: #ffffff; } .home-wrapper h4 { line-height: 24px; margin-top: 30px; color: rgba(249, 249, 249, 0.78); margin-bottom: 50px; font-size: 16px; font-weight: normal; } /* Intro Form */ .intro-form { background-color: #FFFFFF; padding: 30px; border-radius: 5px; border: 3px solid #eee; } .intro-form h3{ color: #949799; font-size: 17px; font-weight: 600; text-transform: uppercase; margin-bottom: 30px; margin-top: 0px; } .intro-form input { border: 1px solid #eee; height: 38px; font-size: 14px; box-shadow: none !important; } /* Footer-alt */ .footer-one { color: #9ba1ac; padding-top: 60px; padding-bottom: 0px; } .footer-one h5{ color: #ffffff; font-size: 15px; margin-bottom: 20px; letter-spacing: 1px; } .footer-one .about-text { padding-right: 10px; line-height: 22px; margin-top: 10px; } .footer-one a{ color: #9ba1ac; line-height: 28px; } .footer-one a:hover{ color: #43cea2; } .footer-one ul li { margin: 5px 0px; } .footer-one-alt { margin-top: 40px; padding: 20px 0px; border-top: 1px solid #3B3B40; } .footer-one-alt .copyright { line-height: 34px; } .footer-social-one { font-size: 16px; margin-bottom: 0px; } .footer-social-one li { padding: 0; margin: 0 2px !important; } .footer-social-one a { border-radius: 50%; text-align: center; background-color: #212125; width: 34px; display: block; height: 34px; line-height: 36px; font-size: 12px; } .footer-social-one a:hover { color: #ffffff; background-color: #43cea2; } /* FAQ */ .question-box { padding: 20px; } .question-box p { color: #98a6ad; line-height: 24px; } .question-box h4 { font-size: 16px; } .question-box span { margin-right: 5px; } /* Home Subscribe */ .home-subscribe { padding-top: 70px; } /* Home App */ .item-list-right.item-list-big li { padding: 0 70px 30px 0; list-style: none; } .item-list-left.item-list-big li { padding: 0 0px 30px 70px; list-style: none; } .item-list-big .number { height: 42px; width: 42px; line-height: 30px; color: #fff; background: #43cea2; text-align: center; border-radius: 50%; position: absolute; border: 5px solid rgba(255,255,255,0.5); cursor: pointer; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; } .item-list-right li { padding: 0 60px 20px 0; position: relative; text-align: right; } .item-list-right li .number { right: 0; top: 0; } .item-list-left li .number { left: 0; } /* Home Showcase */ .home-showcase { padding-top: 60px; padding-bottom: 0px; } .home-showcase h2 { margin-top: 0px; margin-bottom: 30px; } /* Home Showcase */ #macbook { background: url("../images/mac.png"); width: 967px; height: 484px; margin: 0px auto; margin-top: 50px; } #macbook #tour { margin: 0 auto; width: 652px; height: 432px; position: relative; top: 22px; left: -4px; } #macbook .carousel-indicators{ align-items: center; } #macbook .carousel-indicators li { border: 1px solid #333b4d; display: inline-block; width: 10px; height: 10px; margin: 2px; text-indent: -999px; cursor: pointer; background-color: rgba(0,0,0,0); border-radius: 10px; } #macbook .carousel-indicators .active { background: #333b4d; width: 12px; height: 12px; } #macbook .carousel-inner>.item { margin-top: -2px; } /* Home Book */ .author-content .author-img { width: 160px; height: 160px; } .author-content h3 { font-weight: 600; } .author-content p { font-size: 15px; line-height: 24px; margin-top: 20px; margin-bottom: 30px; } .author-content .author-social a{ background-color: #F2F6FA; color: #43CEA2; } /* Home Coming soon */ #count-down { margin-top: 50px; } #count-down .clock-presenter { height: 140px; line-height: 30px; padding: 0px 30px; text-align: center; } #count-down .clock-presenter .digit { margin-top: 20px; font-size: 60px; line-height: 60px; height: 60px; display: inline-block; overflow: hidden; text-align: center; position: relative; cursor: default; color: #ffffff; } #count-down .clock-presenter .note { position: relative; bottom: 0px; padding-top: 5px; cursor: default; font-size: 16px; opacity: 0.7; } /* Home Construction */ .home-construction { background: url("../images/bg-construction.jpg") center; background-size: cover; } .feature-icon-const i{ font-size: 64px; line-height: 1; color: #f9c851; } .home-const-services { margin-top: 40px; } /* Home Comingsoon 2 */ .bg-overlay-cd { background: #000; opacity: 0.6; position: fixed; height: 100%; width: 100%; } .subscribe-cs { margin-top: 80px; } .subscribe-cs h4 { color: #ffffff; line-height: 32px; margin-bottom: 30px; } /* Home Minimal */ .home-minimal { background: url("../images/bg-4.jpg") center; background-size: cover; } .home-minimal .tlt { margin-bottom: 35px; line-height: 46px; font-size: 32px; } /* Home Carousel */ .home-carousel { background: url("../images/bg-5.jpg") center; background-size: cover; } .carousel-custom { min-height: 450px; } .carousel-custom .carousel-item{ padding-bottom: 160px; padding-top: 150px; } .carousel-indicators-dark li{ width: 15px; height: 15px; margin: 2px; border: 2px solid #767D8E; border-radius: 10px; background-color: rgba(0,0,0,0); } .carousel-indicators-dark .active { width: 15px; height: 15px; margin: 2px; background-color: #767D8E; } /* RESPONSIVE */ @media (min-width: 768px) { .navbar-nav>li>a { padding: 20px 15px !important; } } @media screen and (max-width: 1024px) { #macbook { width: 750px; height: 375px; background-size: 100%; margin-left: auto; margin-right: auto; margin-bottom: -20px; position: static; } #macbook #tour { width: 504px; height: 358px; top: 17px; left: -2px; right: 10px; } #macbook #tour .carousel-inner img { width: 518px; height: 321px; } } @media (max-width: 992px) { #count-down .clock-presenter .digit { font-size: 42px; } } @media screen and (max-width: 768px) { .navbar-custom { padding: 10px 0px !important; } .navbar-nav { margin: 7.5px 0px; } .navbar-custom .navbar-brand { height: auto; padding: 15px 15px; font-size: 18px; line-height: 20px; } .navbar-toggler { font-size: 20px; margin-top: 0px; margin-bottom: 0px; padding: 9px 10px; margin-right: 15px; outline: 0 !important; } .navbar-light .navbar-toggler { color: #3B4A69; border-color: transparent; } .navbar-dark .navbar-toggler { color: #fff; border-color: transparent; } .nav>li>a { position: relative; display: block; padding: 10px 15px !important; } .navbar-default .navbar-collapse { border-top: 1px solid #e7e7e7; } .navbar-custom-dark .navbar-toggler{ color: #fff; } .bg-trans { background-color: #ffffff !important; } .logo-white { display: none !important; } .logo-dark { display: block !important; } .sticky.navbar-custom-dark.navbar-default .navbar-nav>li>a { color: #333 !important; } #macbook { background-image: none; width: 448px; height: 265px; background-size: 100%; margin-left: auto; margin-right: auto; margin-bottom: -56px; position: static; } #macbook #tour { width: 344px; height: 217px; top: 12px; left: 1px; } #macbook #tour .carousel-inner img { width: 344px; height: 217px; } } @media screen and (max-width: 480px) { .grosso{height: 520px; border-top: 4px solid #1A5B41; border-bottom: 4px solid #1A5B41; border-right: 4px solid #1A5B41; margin-top: -30px; margin-bottom: -50px; padding: 0} .fino{height: 5200px; border: 1px solid #1A5B41; margin-top: 20px; margin-left: 50px; padding-bottom: 20px} .maos{background: url(../images/iustracao0.png); background-size: 100% 100%; background-repeat: no-repeat;} #macbook { background-image: none; text-align: center; width: 100%; } #macbook #tour { top: 0; left: 0; width: 100%; max-width: 300px; height: 189px; margin-left: auto; margin-right: auto; } #macbook #tour .carousel-inner img { max-width: 300px; height: 189px; overflow: hidden; } } @media screen and (max-width: 767px) { .grosso{height: 550px; border-top: 4px solid #1A5B41; border-bottom: 4px solid #1A5B41; border-right: 4px solid #1A5B41; margin-top: -30px; margin-bottom: -50px; padding: 0} .fino{height: 550px; border: 1px solid #1A5B41; margin-top: 20px; margin-left: 50px; padding-bottom: 20px} .maos{background: url(../images/iustracao0.png); background-size: 100% 100%; background-repeat: no-repeat;} .features-box { padding: 10px 0px; } .navbar-custom-dark.navbar-default .navbar-nav>li>a { color: #f9f9f9; } .vertical-content { display: inherit; } .features-alt { margin: 30px 0px; text-align: center !important; } .home-wrapper { text-align: center; margin-bottom: 40px !important; } .footer-one h5 { margin-top: 30px; } .footer-one-alt { text-align: center !important; } .footer-one-alt .footer-social-one { float: none !important; margin-top: 20px; } #count-down .clock-presenter { width: 50%; float: left; } #count-down .clock-presenter .digit { font-size: 36px; } #count-down .hours_dash { border-right: none; } }