body, html { height: 100%; margin: 0; font: 16px "arial", sans-serif; color: #777; } /*---------Logo and Navigation---------------------------------------------------> */ .navbar-brand { height: 60px; } .navbar-light { background-color: rgba(255,255,255,0.8); box-shadow: 0 2px 5px 0 rgba(0,0,0,0.16), 0 2px 10px 0 rgba(0,0,0,0.12); } .navbar .navbar-nav .nav-link { color: #000; } .navbar .navbar-nav .nav-link:hover { color: #777; } .navbar-nav li { padding: 0 30px; font-size: 1.5em; } /*---------Background Images-----------------------------------------------------> */ @media (max-width: 1099.98px) { .home, .background-1, .background-2 { position: relative; opacity: 1; /* background-attachment: fixed;*/ background-position: center; background-repeat: no-repeat; background-size: cover; } .home { background-image: url("../images/slide-1.jpg"); min-height: 100%; } .background-1 { background-image: url("../images/slide-2.jpg"); min-height: 400px; } .background-2 { background-image: url("../images/slide-3.jpg"); min-height: 400px; } .credits { position: absolute; top: 90%; right: 10%; color: #fff; } .credits a { color: #fff; } } /*------------------------------*/ @media (min-width: 1100px) { .home, .background-1, .background-2 { position: relative; opacity: 1; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .home { background-image: url("../images/slide-1.jpg"); min-height: 100vh; } .background-1 { background-image: url("../images/slide-2.jpg"); min-height: 100vh; } .background-2 { background-image: url("../images/slide-3.jpg"); min-height: 100vh; } .credits { position: absolute; top: 70%; right: 10%; color: #fff; } .credits a { color: #fff; } } /*-----------Text Content-----------------------------------------------------------*/ /*-------Home Section-----------------------*/ .background-title h1 { text-align: center; color: #fff; font-size: 2.8em; margin-top: 350px; } .background-title p { color: #fff; font-size: 1.3em; line-height: 1.5; margin-top: 30px; } .scroll-down { text-align: left; color: #fff; font-size: 1.2em; margin-top: 200px; } /*-------About Section-----------------------*/ #about { padding: 100px 0; } .section-content-about { background-color: white; padding: 50px 35px; } .section-content-about h2 { font-size: 2.1em; color: #555; margin-bottom: 50px; padding-bottom: 5px; border-bottom: 1px solid #000; } .section-content-about p { line-height: 1.7; font-size: 1.3em; } /*-------Backgrounds 1,2----------------------*/ .background-title h2 { position: absolute; left: 0; top: 50%; width: 100%; text-align: center; color: #fff; font-size: 1.8em; } /*---------Services--------------------------->*/ #services { padding: 100px 0; background-color: #333; } #services h2 { font-size: 2.1em; color: #fff; margin-bottom: 0px; padding-bottom: 5px; border-bottom: 1px solid #fff; } #services h3 { color: #fff; font-size: 1.9em; background-image: linear-gradient(to left, rgba(62, 151, 207,0), rgba(62, 151, 207,1)); padding: 5px 20px; margin: 75px 0 30px 0; } #services p { line-height: 1.7; font-size: 1.3em; color: #e3e3e3; } /*---------Contact------------------------------>*/ #contact { padding: 100px 0; } #contact h2 { font-size: 2.1em; color: #555; margin-bottom: 50px; padding-bottom: 5px; border-bottom: 1px solid #000; } .contact-text p { line-height: 1.7; font-size: 1.3em; margin-top: 25px; } .bi { padding: 0 5px; color: rgba(84,88,133,1); } .bi:hover { color: #999; } .contact-map { margin-top: 25px; } /*------------Footer------------------------------------------------------*/ footer { text-align: center; padding: 10px; background-color: #000; color: #fff; } footer h2 { font-size: 1em; }