/*GOOGLE FONTS IMPORT*/ @import url('https://fonts.googleapis.com/css?family=Open+Sans'); @import url('https://fonts.googleapis.com/css?family=Slabo+27px'); ::-moz-selection { /* Code for Firefox */ color: white; background: #DE0209; } ::selection { color: white; background: #DE0209; } body { font-family: 'Open-sans', sans-serif; font-size: 14px; line-height: 1.42857143; color: #333; background-color: #fff; } a { font-family: 'Open-sans', sans-serif; color: #DE0209; } .vertical-center { min-height: 100%; /* Fallback for vh unit */ min-height: 100vh; /* You might also want to use 'height' property instead. Note that for percentage values of 'height' or 'min-height' properties, the 'height' of the parent element should be specified explicitly. In this case the parent of '.vertical-center' is the element */ /* Make it a flex container */ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; /* Align the bootstrap's container vertically */ -webkit-box-align : center; -webkit-align-items : center; -moz-box-align : center; -ms-flex-align : center; align-items : center; /* In legacy web browsers such as Firefox 9 we need to specify the width of the flex container */ width: 100%; /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers hence the bootstrap's container won't be aligned to the center anymore. Therefore, we should use the following declarations to get it centered again */ -webkit-box-pack : center; -moz-box-pack : center; -ms-flex-pack : center; -webkit-justify-content : center; justify-content : center; } .glyphicon { color: white; top: 45px; font-size: 26pt; font-family: 'Glyphicons Halflings'; font-weight: 100; } .blink_me { animation: blinker 3s linear infinite; } @keyframes blinker { 50% { opacity: 0; } } /*MENU*/ /* menu show / hide */ .cd-top { display: inline-block; visibility: hidden; opacity: 0; -webkit-transition: opacity .3s 0s, visibility 0s .3s; -moz-transition: opacity .3s 0s, visibility 0s .3s; transition: opacity .3s 0s, visibility 0s .3s; } .cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover { -webkit-transition: opacity .3s 0s, visibility 0s 0s; -moz-transition: opacity .3s 0s, visibility 0s 0s; transition: opacity .3s 0s, visibility 0s 0s; } .cd-top.cd-is-visible { /* the button becomes visible */ visibility: visible; opacity: 1; } .navbar-default { background-color: #DE0209; border: none; } .navbar-default .navbar-nav>li>a { color: #fff; } .navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover { color: #fff; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { color: none; background-color: none; } .navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:focus, .navbar-default .navbar-nav>.active>a:hover { color: #fff; background-color: transparent; } .navbar-left{ padding-left: 20px; padding-right: 20px; } .snip1217 { font-family: 'Open-sans', sans-serif; text-transform: uppercase; font-weight: 500; letter-spacing: 2px; } .snip1217 * { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; } .snip1217 li { display: inline-block; list-style: outside none none; margin: 0em 2em; padding: 0; } .snip1217 a { padding: 0.3em 0; color: rgba(255, 255, 255, 1); position: relative; text-decoration: none; display: inline-block; } .snip1217 a:before, .snip1217 a:after { height: 3px; position: absolute; content: ''; -webkit-transition: all 0.35s ease; transition: all 0.35s ease; background-color: #fff; width: 0; } .snip1217 a:before { top: 0; left: 0; } .snip1217 a:after { bottom: 0; right: 0; } .snip1217 a:hover, .snip1217 .active a { color: #ffffff; } .snip1217 a:hover:before, .snip1217 .active a:before, .snip1217 a:hover:after, .snip1217 .active a:after { width: 100%; } .container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header { margin-right: 0px; margin-left: 0px; } .navbar-toggle { margin-top: 23px; border-radius: 0px; } .navbar-default .navbar-toggle .icon-bar { background-color: #fff; } @media (max-width: 768px) { .snip1217 li { display: block; text-align: center; } } /* fixed 20 20 bar */ .fixed-image { width: 250px; } .fixed-logos{ position: fixed; bottom: 0%; padding: 5px 0; background-color: white; width: 100%; z-index: 9000; text-align: center; } /* ///////////////// INTRO SECTION ///////////////////*/ .logo-intro { margin:auto; display: flex; align-items: center; } @media (max-width: 768px) { .logo-intro { width: 200px; } } .intro-section br { margin-top: 20%; } .lang-btn{ padding-top: 10%; } .btn-a { border: none; color: white; background: none; cursor: pointer; padding: 14px 37px; display: inline-block; margin: 15px 30px; text-transform: uppercase; letter-spacing: 1px; outline: none; position: relative; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.7s; border-radius: 0px; } .btn-a:after { content: ''; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .btn-a:before { speak: none; text-transform: none; line-height: 1; position: relative; -webkit-font-smoothing: antialiased; } /* Button 1 */ .a-1 { border: 1px solid #fff; font-family: 'Open-sans', sans-serif; text-decoration: none; } /* Button 1a */ .a-1a:hover, .a-1a:active{ color: #DE0209; background: #fff; text-decoration: none; } a:visited { text-decoration: none; } .dropdown-menu { background-color: #eee; border:none; box-shadow: none; } /*btn-dist*/ .btn-dist { border: none; color: inherit; background: none; cursor: pointer; padding: 14px 37px; display: inline-block; margin: 0px 0px; text-transform: uppercase; letter-spacing: 1px; outline: none; position: relative; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.7s; border-radius: 0px; margin-top: 5px; } .btn-dist:after { content: ''; position: absolute; z-index: -1; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .btn-dist:before { speak: none; text-transform: none; line-height: 1; position: relative; -webkit-font-smoothing: antialiased; } /* Button 2 */ .btn-2 { border: 1px solid #4D4D4D; font-family: 'Open-sans', sans-serif; } /* Button 2a */ .btn-2a:hover, .btn-2a:active { color: #eee; background: #DE0209; border:1px solid; } /* Button 3 */ .btn-3 { border: 1px solid #4D4D4D; font-family: 'Open-sans', sans-serif; display: flex; text-align: center; margin: auto } /* Button 2a */ .btn-3a:hover, .btn-3a:active { color: #eee; background: #DE0209; border:1px solid; } /*Dropdown button dsitinções*/ .dropdown:hover .dropdown-menu { display: block; margin-top: 0; } .apoios{ position: absolute; left: 0px; bottom: 0px; } .apoios a{ font-family: 'Open-sans', sans-serif; font-size: 9pt; } .apoios img{ margin-top: 15px; } /* ///////////////// END INTRO SECTION ///////////////////*/ /* ///////////////// ABOUT SECTION ///////////////////*/ .about-section h1{ font-family: 'Open-sans', sans-serif; font-size: 15pt; text-align: left; line-height: 18pt; color: #DE0209; } .about-section p{ font-family: 'Open-sans', sans-serif; font-size: 10pt; text-align: left; } .about-section img{ margin:auto; } @media (max-width: 768px) { .about-section img{ width: 60%; align-items: center; margin:auto; } } @media (max-width: 768px) { .about-section h1{ font-size: 13pt; text-align: center; line-height: 15pt; } } /* Modal do + info */ .modal-fullscreen { background: rgb(224, 224, 224); } .modal-fullscreen .modal-content { background: transparent; border: 0; -webkit-box-shadow: none; box-shadow: none; } .modal-backdrop.modal-backdrop-fullscreen.in { opacity: .97; filter: alpha(opacity=97); } .modal-footer { margin-top: 40px; } /* .modal-fullscreen size: we use Bootstrap media query breakpoints */ .modal-fullscreen .modal-dialog { margin-top: 30px; margin-right: auto; margin-left: auto; width: 100%; } @media (min-width: 768px) { .modal-fullscreen .modal-dialog { width: 750px; } } @media (min-width: 992px) { .modal-fullscreen .modal-dialog { width: 970px; } } @media (min-width: 1200px) { .modal-fullscreen .modal-dialog { width: 1170px; } } .fullscreenmodal{ padding-top: 10px; padding-bottom: 20px; } .btn-secondary-modal{ background-color: transparent; color: #fff; } .info-title { font-family: 'Open Sans', sans-serif; font-size: 12pt; font-weight: 700; text-align: center !important; } .info-corpo{ font-family: 'Open Sans', sans-serif; font-size: 10pt; font-weight: 300; text-align: center !important; } @media (max-width: 768px) { .text-mob-about { padding-top: 10%; padding-bottom: 10%; } } /*FIM MODAL*/ /* ///////////////// END ABOUT SECTION ///////////////////*/ /* ///////////////// JUMBOTHRON SECTION ///////////////////*/ .bg-jumbo { background: url('../img/jumbo.jpg') no-repeat center center; position: fixed; width: 100%; height: 100% !important; /*same height as jumbotron */ top:0; left:0; z-index: -1; } .jumbotron { height: 350px; background:transparent; } .jumbotron h1 { margin-top: 4%; color: white; font-family: 'Slabo 27px', serif; text-align: center; font-size: 25pt; } .jumbotron p { color: white; font-family: 'Open-sans', sans-serif; text-align: center; font-size: 10pt; } .jumbotron hr { width: 30%; border-style: solid 1px white; } @media (max-width: 768px) { .jumbotron h1 { font-size: 15pt; } .jumbotron{ height: auto; padding:20px; } } /* ///////////////// END JUMBOTHRON SECTION ///////////////////*/ /* ///////////////// SERVICES SECTION ///////////////////*/ .serv-section a{ font-family: 'Open-sans', sans-serif; font-size: 15pt; text-align: left; text-decoration: none; color: white; padding: 5px; line-height: 26pt; background-color: #DE0209; font-weight: lighter; letter-spacing: 1pt; } .serv-section p{ font-family: 'Open-sans', sans-serif; font-size: 10pt; text-align: left; } .serv-section h1{ color: #DE0209; font-family: 'Slabo 27px', serif; text-align: center; font-size: 40pt; } .serv-section li{ color: #DE0209; font-family: 'Open-sans', sans-serif; } .serv-section hr { width: 30%; border: solid 1px #DE0209; } .serv-square{ min-height: 200px; background-color: #DE001A; } /* ///////////////// END SERVICES SECTION ///////////////////*/ /* ///////////////// PORTEFOLIO SECTION ///////////////////*/ .portefolio-section h1{ color: #DE0209; font-family: 'Slabo 27px', serif; text-align: left; font-size: 40pt; text-align: center; } .portefolio-section hr{ width: 30%; border: solid 1px #DE0209; margin-bottom: 100px; } .portefolio-section h2{ font-family: 'Open-sans', sans-serif; font-size: 15pt; text-align: left; color: #DE0209; } @media (max-width: 768px) { .portefolio-section img{ display: inline; } } @media (max-width: 768px) { .portefolio-section h2{ text-align: center; } } /* ///////////////// END PORTEFOLIO SECTION ///////////////////*/ /* ///////////////// CONTACTS SECTION ///////////////////*/ .contact-section h2{ color: #DE0209; font-family: 'Slabo 27px', serif; font-size: 40pt; text-align: center; } .contact-section h1{ font-size:15pt; } .contact-section a:focus, a:hover { color: grey; } .contact-section hr { width: 30%; border: solid 1px #DE0209; } /* ///////////////// END CONTACTS SECTION ///////////////////*/ #map { width: 100%; height: 250px; } .footer-section a{ text-decoration: none; line-height: 30pt; } .footer-section a:hover{ text-decoration: none; color: grey; } .footer-section h1 { font-family: 'Open-sans', sans-serif; font-size: 10pt; text-align: left; color: #333; } .footer-section p { font-family: 'Open-sans', sans-serif; font-size: 7pt; text-align: left; color: #333; }