/*! * Start Bootstrap - Grayscale v5.0.4 (https://startbootstrap.com/template-overviews/grayscale) * Copyright 2013-2019 Start Bootstrap * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap-grayscale/blob/master/LICENSE) */ a { color: #212529; text-decoration: none; } a:hover { color: #1e7e34; } @media (min-width: 992px) { .header-image { background: url("/client-assets/FredTemplate/images/1.jpg") no-repeat center center; } } @media (min-width: 992px) { .masthead { height: 100vh; padding: 0; } } .about-section { padding-top: 5rem; /*background: -webkit-gradient(linear, left top, left bottom, from(#161616), color-stop(75%, rgba(22, 22, 22, 0.9)), to(rgba(22, 22, 22, 0.8))); background: linear-gradient(to bottom, #161616 0%, rgba(22, 22, 22, 0.9) 75%, rgba(22, 22, 22, 0.8) 100%);*/ } .about-section p { margin-bottom: 5rem; } .projects-section { padding: 5rem 0; } .projects-section .featured-text { padding: 2rem; } @media (min-width: 992px) { .projects-section .featured-text { padding: 0 0 0 2rem; border-left: 0.5rem solid #28a745; } } .projects-section .project-text { padding: 3rem; font-size: 90%; } @media (min-width: 992px) { .projects-section .project-text { padding: 5rem; } .projects-section .project-text hr { border-color: #28a745; border-width: .25rem; width: 30%; } } .signup-section { padding: 5rem 0; background: -webkit-gradient(linear, left top, left bottom, from(rgba(22, 22, 22, 0.1)), color-stop(75%, rgba(22, 22, 22, 0.5)), to(#161616)), url("../images/grass.jpg"); background: linear-gradient(to bottom, rgba(22, 22, 22, 0.1) 0%, rgba(22, 22, 22, 0.5) 75%, #161616 100%), url("../images/grass.jpg"); background-position: center; background-repeat: no-repeat; background-attachment: scroll; background-size: cover; } .signup-section .form-inline input { -webkit-box-shadow: 0 0.1875rem 0.1875rem 0 rgba(0, 0, 0, 0.1) !important; box-shadow: 0 0.1875rem 0.1875rem 0 rgba(0, 0, 0, 0.1) !important; padding: 1.25rem 2rem; height: auto; font-size: 80%; text-transform: uppercase; letter-spacing: 0.15rem; border: 0; } .contact-section { padding: 5rem 0 0; } .contact-section .card { border: 0; border-bottom: 0.25rem solid #64a19d; } .contact-section .card h4 { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.15rem; } .contact-section .card hr { border-color: #28a745; border-width: 0.25rem; width: 3rem; } .contact-section .social { margin-top: 5rem; } .contact-section .social a { text-align: center; height: 3rem; width: 3rem; background: rgba(255, 255, 255, 0.1); border-radius: 100%; line-height: 3rem; color: rgba(255, 255, 255, 0.3); } .contact-section .social a:hover { color: rgba(255, 255, 255, 0.5); } .contact-section .social a:active { color: #fff; } hr.divider { max-width: 3.25rem; border-width: 0.2rem; border-color: #343a40; } hr.light { border-color: #fff; } /* ******************************** MOVING BACKGROUND ****************************************** */ @keyframes moveclouds{ 0%{ margin-left:100% } 100%{ margin-left:-100% } } @-webkit-keyframes moveclouds{ 0%{ margin-left:100% } 100%{ margin-left:-100% } } @keyframes moveclouds2{ 0%{ margin-left:100% } 50%{ margin-left:100% } 100%{ margin-left:-100% } } @-webkit-keyframes moveclouds2{ 0%{ margin-left:100% } 50%{ margin-left:100% } 100%{ margin-left:-100% } } .background{ height:100%; left:0; position:fixed; top:0; width:100% } .background .layer{ height:100%; left:0; overflow:hidden; position:absolute; top:0; width:100% } .background .clouds{ overflow:hidden } .background .clouds .cloud{ bottom:0; left:0; position:absolute; -webkit-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0); width:100%; will-change:transform } .background .clouds .cloud-1{ -webkit-animation:moveclouds 15s linear infinite; animation:moveclouds 15s linear infinite } .background .clouds .cloud-2{ -webkit-animation:moveclouds 20s linear infinite; animation:moveclouds 20s linear infinite } .background .clouds .cloud-3{ -webkit-animation:moveclouds2 25s linear infinite; animation:moveclouds2 25s linear infinite } header.masthead { padding-top: 10rem; padding-bottom: calc(10rem - 72px); /* background: linear-gradient(to bottom, rgba(92, 77, 66, 0.8) 0%, rgba(92, 77, 66, 0.8) 100%), url("../img/bg-masthead.jpg"); */ background-position: center; background-repeat: no-repeat; background-attachment: fixed; background-size: cover; } header.masthead h1 { font-size: 2.25rem; } header { position: relative; background-color: black; height: 75vh; min-height: 25rem; width: 100%; overflow: hidden; } header .overlay { position: absolute; top: 0; left: 0; height: 100%; width: 100%; background-color: black; opacity: 0.3; z-index: 2; } header video { position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: 0; -ms-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } header .container { position: relative; z-index: 2; } /* MAIN NAV */ #mainNav { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); background-color: rgba(255, 255, 255, 0.7); transition: background-color 0.2s ease; } #mainNav .navbar-nav .nav-item .nav-link { color: #6c757d; font-family: "Merriweather Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; font-weight: 700; font-size: 0.9rem; padding: 0.75rem 0; } #mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link:active { color: #1e7e34; } #mainNav .navbar-nav .nav-item .nav-link.active { color: #28a745 !important; } @media (min-width: 992px) { #mainNav { box-shadow: none; background-color: transparent; } #mainNav .navbar-brand { color: rgba(255, 255, 255, 0.7); } #mainNav .navbar-brand:hover { color: #fff; } #mainNav .navbar-nav .nav-item .nav-link { color: rgba(255, 255, 255, 0.7); padding: 0 1rem; } #mainNav .navbar-nav .nav-item .nav-link:hover { color: #fff; } #mainNav .navbar-nav .nav-item:last-child .nav-link { padding-right: 0; } #mainNav.navbar-scrolled { box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15); background-color: #fff; } #mainNav.navbar-scrolled .navbar-brand { color: #212529; } #mainNav.navbar-scrolled .navbar-brand:hover { color: #1e7e34; } #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link { color: #212529; } #mainNav.navbar-scrolled .navbar-nav .nav-item .nav-link:hover { color: #1e7e34; } }