@import url("font-sourcesanspro.css"); html { background-color: #1c0920; color: white; } a { color: white; text-decoration: none; } body { font-size: 15pt; line-height: 1.85em; font-family: 'Source Sans Pro', sans-serif; font-weight: 300; } #nav { position: absolute; top: 0; left: 0; width: 100%; text-align: center; padding: 1.5em 0 31.5em 0; z-index: 1; overflow: hidden; } ul, li { list-style: none; } #nav > ul { line-height: 0px; position: relative; display: inline-block; margin: 0; height: 21px; border-left: solid 1px rgba(192, 192, 192, 0.35); border-right: solid 1px rgba(192, 192, 192, 0.35); padding: 0 0.5em; } #nav > ul > li { display: inline-block; margin: -9px 0.5em 0 0.5em; border-radius: 0.5em; padding: 0.85em; border: solid 1px transparent; position: relative; } #nav > ul::before { left: 100%; margin-left: 1px; } #nav > ul::after { right: 100%; margin-right: 1px; } #nav > ul::before, #nav > ul::after { content: ''; display: block; width: 300%; position: absolute; top: 50%; margin-top: -2px; height: 3px; border-top: solid 1px rgba(192, 192, 192, 0.35); border-bottom: solid 1px rgba(192, 192, 192, 0.35); } .dropdown { left: 0; top: 100%; font-size: 0.88em; margin: 0.4em -35px 0; } .dropdown, .submenu { display: none; position: absolute; z-index: 5; text-align: left; background: rgba(255, 255, 255, 0.975); padding: 0.5em 1em; border-radius: 0.5em; box-shadow: 0 0.15em 0.25em 0 rgba(0, 0, 0, 0.25); line-height: 1em; } .submenu { left: calc(100% + 1em); top: 0; margin: 0; width: 115%; } .dropdown a { color: rgb(91, 91, 91); padding: 0.5em 0; display: block; } .dropdown a:hover{ color: #ef8376; } .dropdown li { border-top: solid 1px rgba(128, 128, 128, 0.2); position: relative; } .dropdown li:first-child { border-top: 0; } .dropdown::before { content: ''; position: absolute; left: 50%; top: -0.45em; margin-left: -0.75em; border-bottom: solid 0.5em rgba(255, 255, 255, 0.975); border-left: solid 0.7em rgba(64, 64, 64, 0); border-right: solid 0.7em rgba(64, 64, 64, 0); } li:hover .dropdown, .dropdown li:hover .submenu, li:focus-within .dropdown, .dropdown li:focus-within .submenu { display: block; } #header { height: 100vh; text-align: center; min-height: 40em; } #header h1 { font-size: 3.75em; line-height: 1em; font-weight: 400; margin: 0; } #header::before { content: ''; display: inline-block; vertical-align: middle; height: 100%; } #header .inner { position: relative; z-index: 1; margin: 0; display: inline-block; vertical-align: middle; } #header header > p { font-size: 1.25em; margin: 0; } #header hr { top: 1.5em; margin-bottom: 3em; border-top: solid 1px rgba(192, 192, 192, 0.35); border-bottom: solid 1px rgba(192, 192, 192, 0.35); position: relative; height: 3px; border-left: none; border-right: none; } #header hr::before, #header hr::after { background: rgba(192, 192, 192, 0.35); content: ''; position: absolute; top: -8px; display: block; width: 1px; height: 21px; } hr::before { left: -1px; } hr::after { right: -1px; } #header footer { margin: 1.5em 0 0; } #header footer .button { display: inline-block; border-radius: 100%; width: 4.9em; height: 4.9em; line-height: 4.75em; text-align: center; font-size: 1.25em; padding: 0.5em; background: #df7366; font-weight: 300; } @media screen and (max-width: 736px) { #header { min-height: 0; padding: 5.5em 0 5em 0; height: auto; } #header h1 { font-size: 2.5em; } #header .inner { padding-top: 1.5em; padding-left: 1em; padding-right: 1em; } } #header .background { background: linear-gradient(145deg, #3f2b4e 0%,#7b6b75 23%,#58445d 42%,#56425b 52%,#c7bbbd 81%,#422d4f 100%); filter: blur(50px); width: 100%; height: 100%; z-index: 0; position: absolute; top: 0; left: 0; overflow: hidden; background-size: 100% 150%; } /* contact section */ section#contact { width:98%; } section.split { width: 45%; display:inline-block; } section#contact section.alt h3{ margin-bottom:0; } section#contact section.alt p, section#contact section.alt ul{ margin-top:0; } /* End of contact section */ /* Footer style */ footer p{ margin: 0; } /* end Footer style */