@font-face { font-family: "NetCosterCustomFont"; src: url("https://netcoster.com/fonts/StencilBT-Regular/fonts/StencilBT-Regular.eot"); src: url("https://netcoster.com/fonts/StencilBT-Regular/fonts/StencilBT-Regular.woff") format("woff"), url("https://netcoster.com/fonts/StencilBT-Regular/fonts/StencilBT-Regular.otf") format("opentype"), url("https://netcoster.com/fonts/StencilBT-Regular/fonts/StencilBT-Regular.svg#filename") format("svg"); } html{ height:100%; min-height:100%; } body { margin: 0px; background-color: #F4F3FE; font-size: 13px; background-size:cover; background-repeat:no-repeat; background-position: center center; background-attachment:fixed; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif"; min-height:100%; } img { border: none; } h1 { color: white; font-size: 45px; font-family: 'News Cycle', sans-serif; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif" } .frontPageH1 { display: block; margin: 50px auto 0px auto; text-align: center; line-height: 100px; } h2 { color: white; font-size: 35px; font-family: 'News Cycle', sans-serif; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif" } .frontPageH2 { display: block; margin: 0px auto 0px auto; padding: 30px 0px 0px 0px; text-align: center; } h3 { color: #039; margin: 0px 0px 0px 0px; } .h3Div5 { line-height: 26px; margin: 10px 0px 20px 0px; } .div1 { height: 150px; width: 100%; background-color: none; position: relative; top: 0px; z-index: 100; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0)); } .div1TitleBar { height: 100px; text-align: center; } @media all and (max-width: 1200px) { .div1TitleBar { height: auto; width: 100%; text-align: center; } .div1TitleBar img { height: auto; width: 100%; } } @media all and (max-width: 1200px) { .div1 { height: auto; width: 100%; background-color: none; position: relative; top: auto; z-index: auto; } } .div1Logo { float: left; margin: 5px 0px 0px 30px; } @media all and (max-width: 1200px) { .div1Logo { float: left; width: 250px; margin: 5px 0px 0px 30px; } .div1Logo img { max-width: 250px; margin: 15px 0px 0px 30px; } } @media all and (max-width: 1100px) { .div1Logo { float: left; width: 200px; margin: 5px 0px 0px 30px; } .div1Logo img { max-width: 100%; margin: 25px 0px 0px 30px; } } @media all and (max-width: 1200px) { .div1Logo { float: none; width: 100%; margin: 0px 0px 0px 0px; text-align: center; } .div1Logo img { max-width: auto; margin: 5px 0px 0px 0px; } } .div1Nav { } @media all and (max-width: 1200px) { .div1Nav { clear: both; width: 100%; } } .div2 { margin: 110px 0px 0px 0px; padding: 150px auto 0px auto; background-color: transparent; height: 30vh; overflow:auto; color: white; } @media all and (max-width: 1200px) { .div2 { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; height: auto; overflow: none; color: white; } } .div2Home2 { height: 500px; } @media all and (max-width: 1200px) { .div2Home2 { height: auto; } } .div2Internal { background-image:url(../images/2017/backgroundShader.gif); background-size: cover; height: 300px; padding: 0px 0px 0px 0px; } @media all and (max-width: 1200px) { .div2Internal { background-image: none; background-size: cover; height: auto; padding: 0px 0px 0px 0px; } } .div2InternalNav { } @media all and (max-width: 1200px) { .div2InternalNav { display: none; } } .div2InternalContainer { width: 1200px; margin: 0px auto 0px auto; background-image:url(../images/2017/Inner-Background/background001.jpg); height: 300px; position: relative; } @media all and (max-width: 1200px) { .div2InternalContainer { width: 100%; margin: 0px 0px 0px 0px; background-image:none; height: auto; position: relative; } } .div2InternalLeft { position: absolute; width: 250px; bottom: 0px; left: 200px; padding: 0px 0px 10px 0px; font-size: 16px; } .div2InternalLeft h1 { padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; line-height: 40px; } @media all and (max-width: 1200px) { .div2InternalLeft { position: relative; width: 90%; bottom: auto; left: auto; padding: 30px 5% 30px 5%; font-size: 16px; } .div2InternalLeft h1 { padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; line-height: 40px; } } .div2Home2Message { position: relative; font-size: 40px; width: 70%; z-index: 50; text-align: center; margin: 40px auto 0px auto; padding: 10px 20px 10px 20px; background-color: rgba(130,130,130,0.50); } .div2Home2Message h1 { font-size: 60px; line-height: 24px; } @media all and (max-width: 1200px) { .div2Home2Message { position: relative; font-size: 40px; width: 70%; z-index: 50; height: auto; text-align: center; margin: 40px auto 40px auto; padding: 10px 20px 10px 20px; background-color: rgba(130,130,130,0.50); } .div2Home2Message h1 { font-size: 30px; line-height: 24px; } } .sliderText { position: relative; width: 70%; z-index: 50; text-align: center; margin: 40px auto 0px auto; padding: 10px 20px 10px 20px; } @media all and (max-width: 1200px) { .sliderText { position: relative; width: 70%; z-index: 50; text-align: center; margin: 40px auto 0px auto; padding: 10px 20px 10px 20px; font-size: 14px; line-height: 18px; } .sliderText h1 { font-size: 20px; line-height: 24px; } } @media all and (max-width: 400px) { .sliderText { position: relative; width: 80%; z-index: 50; text-align: center; margin: 5px auto 0px auto; padding: 5px 5px 5px 5px; font-size: 14px; line-height: 18px; } .sliderText h1 { font-size: 20px; line-height: 24px; margin: 5px 5px 05px 5px; } } .sliderText1 { color: white; background-color: rgba(140,232,240,0.50); } .sliderText1 h1 { color: white; } .sliderText2 { color: black; background-color: rgba(255,255,255,0.70); } .sliderText2 h1 { color: black; } .globeLinksFullScreen { margin: 0px auto 0px auto; width: 100%; height: 100%; color: black; } .globeLinksFullScreen, .globeLinksFullScreen a, .globeLinksFullScreen a:link, .globeLinksFullScreen a:hover, .globeLinksFullScreen a:active, .globeLinksFullScreen a:visited { color: white; text-decoration: underline; font-size: 15px; } @media all and (max-width: 600px) { .globeLinksFullScreen { margin: 50px auto 0px auto; width:500px; height:500px; color: black; } } @media all and (max-width: 500px) { .globeLinksFullScreen { margin: 50px auto 0px auto; width:400px; height:400px; color: black; } } @media all and (max-width: 400px) { .globeLinksFullScreen { margin: 50px auto 0px auto; width:300px; height:300px; color: black; } } @media all and (max-width: 300px) { .globeLinksFullScreen { margin: 50px auto 0px auto; width:250px; height:250px; color: black; } } .globeLinks { margin: 50px auto 0px auto; width:600px; height:600px; color: black; } .globeLinks, .globeLinks a, .globeLinks a:link, .globeLinks a:hover, .globeLinks a:active, .globeLinks a:visited { color: black; text-decoration: underline; font-size: 15px; } @media all and (max-width: 600px) { .globeLinks { margin: 50px auto 0px auto; width:500px; height:500px; color: black; } } @media all and (max-width: 500px) { .globeLinks { margin: 50px auto 0px auto; width:400px; height:400px; color: black; } } @media all and (max-width: 400px) { .globeLinks { margin: 50px auto 0px auto; width:300px; height:300px; color: black; } } @media all and (max-width: 300px) { .globeLinks { margin: 50px auto 0px auto; width:250px; height:250px; color: black; } } .globeKey { width: 1200px; margin: 0px auto 20px auto; padding: 0px 0px 0px 0px; min-height: 48px; min-height: 100px; background-color: white; color: black; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 150px; } @media all and (max-width: 1200px) { .globeKey { width: 100%; margin: 0px auto 20px auto; padding: 0px 0px 0px 0px; min-height: 48px; } } .globeKeyPin { height: auto; line-height: 25px; display: grid; grid-template-columns: 48px 1fr; } .globeKeyPinLast { grid-template-columns: 1fr; } .globeKeyPin img { margin: 0px 0px 0px 10px; } .globeKeyPinHolder { height: 100%; display: flex; justify-content: center; align-items: center; } .globeKeyPinText { height: 100%; display: flex; justify-content: center; align-items: center; } .globeKeyFullScreen { position: absolute; bottom: 0px; width: 100%; margin: 0px auto 0px auto; padding: 0px 0px 0px 0px; min-height: 48px; color: black; font-size: 25px; line-height: 40px; background-color: white; z-index: 10000; display: grid; grid-template-columns: repeat(8, 1fr); } @media all and (max-width: 1200px) { .globeKeyFullScreen { width: 100%; margin: 0px auto 20px auto; padding: 0px 0px 0px 0px; min-height: 48px; } } .div3 { padding: 50px 0px 50px 0px; background-color: rgba(130,130,130,0.50); } @media all and (max-width: 700px) { .div3 { padding: 0px 0px 0px 0px; } } .div3Internal { padding: 0px 0px 0px 0px; background-color: none; } @media all and (max-width: 1200px) { } .div3Inner { width: 900px; margin: 0px auto 0px auto; font-size: 30px; line-height: 40px; color: white; } .div3Inner a:link, .div3Inner a:hover, .div3Inner a:active, .div3Inner a:visited { color: white; } .div3InnerFull { width: 1000px; margin: 0px auto 0px auto; padding: 40px 0px 0px 0px; font-size: 20px; color: white; } @media all and (max-width: 1200px) { .div3InnerFull { width: 90%; margin: 0px 5% 0px 5%; padding: 40px 0px 0px 0px; font-size: 20px; color: white; } } .div3InnerFull p { margin: 0px 0px 0px 0px; } .div3InnerFull a:link, .div3InnerFull a:hover, .div3InnerFull a:active, .div3InnerFull a:visited { color: white; } .div3InnerHome { width: 700px; margin: 0px auto 0px auto; font-size: 30px; line-height: 40px; color: white; } @media all and (max-width: 700px) { .div3InnerHome { width: 90%; margin: 0px 5% 0px 5%; font-size: 30px; line-height: 40px; text-align: center; } } .div3InnerLeft { width: 380px; margin: 0px 20px 30px 0px; padding: 40px 0px 0px 200px; color: white; float: left; font-size: 16px; } .div3InnerRight { width: 300px; padding: 40px 0px 30px 80px; margin: 0px 0px 0px 20px; color: white; float: left; font-size: 22px; } .div4 { background-color: aliceblue; padding: 50px 0px 50px 0px; } .div4Inner { width: 1200px; margin: 0px auto 0px auto; } @media all and (max-width: 1200px) { .div4 { background-color: aliceblue; padding: 50px 0px 50px 0px; } .div4Inner { width: 100%; margin: 0px 0px 0px 0px; } } .div4InnerSection { height: 400px; float: left; position: relative; padding: 50px 30px 70px 30px; margin: 0px 0px 0px 0px; font-size: 20px; background-color: #CFCFCF; } .div4InnerSection1 { width: 240px; margin: 0px 20px 0px 0px; } .div4InnerSection2 { width: 240px; margin: 0px 10px 0px 10px; } .div4InnerSection3 { width: 240px; margin: 0px 0px 0px 20px; } .div4InnerSection4 { width: 240px; margin: 0px 0px 0px 20px; } .div4InnerSection a:link, .div4InnerSection a:active, .div4InnerSection a:visited { text-decoration: none; color: #039; position: absolute; bottom: 0px; left: 30px; border: solid #039 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px 0px 10px 0px; } .div4InnerSection a:hover { } @media all and (max-width: 1200px) { .div4InnerSection { height: auto; float: none; position: relative; padding: 50px 5% 70px 5%; font-size: 20px; background-color: #CFCFCF; } .div4InnerSection1 { width: 80%; margin: 0px 5% 0px 5%; } .div4InnerSection2 { width: 80%; margin: 30px 5% 30px 5%; } .div4InnerSection3 { width: 80%; margin: 0px 5% 0px 5%; } .div4InnerSection a:link, .div4InnerSection a:active, .div4InnerSection a:visited { text-decoration: none; color: #039; position: absolute; bottom: 0px; left: 30px; border: solid #039 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px 0px 10px 0px; } .div4InnerSection a:hover { } } .div5 { background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0)); } .div5 a:link, .div5 a:hover, .div5 a:active, .div5 a:visited { color: white; } .div5Inner { width: 1200px; margin: 0px auto 0px auto; } @media all and (max-width: 1200px) { .div5Inner { width: 100%; margin: 0px 0px 0px 0px; } } .div5InnerTitle { padding: 20px 0px 0px 0px; color: white; font-size: 22px; } .div5InnerTitleAddress { text-align: center; } .div5InnerSection { width: 500px; height: 350px; float: left; position: relative; padding: 10px 20px 10px 20px; margin: 50px 30px 40px 30px; font-size: 25px; background-color: rgba(130,130,130,0.50); color: white; } .div5InnerSectionHomeLast { width: 1100px; } .div5InnerSection h3 { color: white; } .div5InnerSection a:link, .div5InnerSection a:active, .div5InnerSection a:visited { text-decoration: none; color: white; position: absolute; bottom: 0px; left: 30px; border: solid white 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px 0px 10px 0px; } .div5InnerSection a:hover { } @media all and (max-width: 1200px) { .div5InnerSection { width: 80%; height: auto; float: none; clear: both; position: relative; padding: 10px 5% 80px 5%; margin: 20px 5% 20px 5%; font-size: 20px; background-color: rgba(130,130,130,0.50); color: white; } .div5InnerSection a:link, .div5InnerSection a:active, .div5InnerSection a:visited { text-decoration: none; color: white; position: absolute; bottom: 0px; left: 30px; border: solid white 1px; display: inline-block; padding: 8px 0px 8px 0px; margin: 0px 0px 10px 0px; } } .div5InnerSection ul { margin: 15px 0px 0px 20px; padding: 0px 0px 0px 0px; font-size: 24px; list-style: none; } .div5InnerSection li { margin: 4px 0px 0px 0px; padding: 0px 0px 0px 0px; } .div5InnerGrid { display: grid; grid-template-columns: repeat(7, 1fr); max-width: 100%; } .div5InnerGridItem { text-align: center; display: flex; justify-content: center; align-items: center; max-width: 90%; } .div5InnerGridItem img { max-width: 100%; } .div5Flags { float:right; padding: 0px 0px 0px 0px; margin: 40px 0px 0px 0px; width: 100px; } .div5Flags img { width: 100px; } .div5FullScreen { height: 100vh; width: 100%. } .teamProfilePic { width: 300px; height: auto; float: left; position: relative; padding: 10px 20px 10px 20px; margin: 50px 30px 40px 30px; font-size: 25px; background-color: rgba(130,130,130,0.50); color: white; } .teamProfilePic h2 { color: white; margin: 0px 0px 70px 5px; } .teamProfilePic a:link, .teamProfilePic a:active, .teamProfilePic a:visited { text-decoration: none; color: white; position: absolute; bottom: 0px; left: 30px; border: solid white 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px 0px 10px 0px; } .teamProfilePic a:hover { } .profilePageImage { float: right; } .div6 { background-color: rgba(130,130,130,0.50); text-align: center; padding: 130px 0px 120px 0px; font-size: 25px; color: white; } .div6GeneralContactButton { text-decoration: none; color: white; border: solid #fff 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px auto 10px auto; } .div6ContactForm { padding: 60px 0px 60px 0px; font-size: 25px; background-color: rgba(130,130,130,0.70); color: white; } .div6ContactFormInner { width: 800px; margin: 0px auto 0px auto; } .div6ContactForm label { clear: both; display: inline-block; position:relative; width: 250px; text-align: right; margin: 0px 20px 0px 0px; } .div6ContactForm input[type=text], .div6ContactForm input[type=email] { width: 300px; border: none; background-color: #203141; color: white; height: 40px; line-height: 40px; padding: 3px 3px 3px 3px; margin: 3px 3px 3px 3px; font-size: 18px; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif" } .div6ContactForm input[type=submit] { width: 306px; border: none; background-color: #203141; color: white; height: 50px; margin: 3px 3px 3px 3px; font-size: 18px; } .div6ContactForm input[type=file] { width: 306px; border: none; background-color: #203141; color: white; height: 50px; margin: 3px 3px 3px 3px; font-size: 18px; } .div6ContactForm textarea { width: 300px; height: 80px; border: none; background-color: #203141; color: white; padding: 3px 3px 3px 3px; margin: 3px 3px 3px 3px; font-size: 18px; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif" } .div6ContactContainer { width: 1200px; margin: 0px auto 0px auto; } .div6ContactContainerHolder1 { width: 465px; margin: 0px 30px 0px 30px; text-align: center; float: left; } .div6ContactContainerHolder2 { width: 150px; margin: 0px 0px 0px 0px; text-align: center; float: left; } .div6ContactContainerHolder3 { width: 465px; margin: 0px 30px 0px 30px; text-align: center; float: left; } .googleCaptchaDiv { width: 300px; height: 80px; display: inline-block; text-align: right; } @media all and (max-width: 1200px) { .div6 { background-color: rgba(130,130,130,0.50); text-align: center; padding: 130px 0px 120px 0px; font-size: 25px; color: white; } .div6GeneralContactButton { text-decoration: none; color: white; border: solid #fff 1px; display: inline-block; padding: 8px 15px 8px 15px; margin: 0px auto 10px auto; } .div6ContactForm { padding: 60px 0px 60px 0px; font-size: 25px; background-color: rgba(130,130,130,0.70); color: white; text-align: center; } .div6ContactFormInner { width: 100%; margin: 0px auto 0px auto; } .div6ContactForm label { clear: both; display: block; position:relative; width: 100%; text-align: center; margin: 0px 0px 0px 0px; } .div6ContactForm input[type=text], .div6ContactForm input[type=email] { width: 96%; max-width: 300px; border: none; background-color: #203141; color: white; height: 40px; line-height: 40px; padding: 3px 2% 3px 2%; margin: 3px auto 3px auto; font-size: 18px; font-family: "Times New Roman", Times, "serif" } .div6ContactForm input[type=submit] { width: 100%; max-width: 320px; border: none; background-color: #203141; color: white; height: 50px; margin: 3px auto 3px auto; font-size: 18px; } .div6ContactForm input[type=file] { width: 96%; max-width: 300px; border: none; background-color: #203141; color: white; height: 50px; margin: 3px auto 3px auto; font-size: 18px; } .div6ContactForm textarea { width: 96%; max-width: 300px; height: 80px; border: none; background-color: #203141; color: white; padding: 3px 2% 3px 2%; margin: 3px auto 3px auto; font-size: 18px; font-family: 'Khula', sans-serif; font-family: "Times New Roman", Times, "serif" } .div6ContactContainer { width: 100%; margin: 0px 0px 0px 0px; } .div6ContactContainerHolder1 { width: 90%; margin: 0px 5% 0px 5%; text-align: center; float: none; clear: both; } .div6ContactContainerHolder2 { width: 90%; margin: 0px 5% 0px 5%; text-align: center; float: none; clear: both; } .div6ContactContainerHolder3 { width: 90%; margin: 0px 5% 0px 5%; text-align: center; float: none; clear: both; } } .fileContainer { overflow: hidden; position: relative; background: #203141; float: left; float: none; padding: 3px 0px 0px 0px; margin: 3px 3px 0px 3px; display: inline-block; color: white; text-align: center; width: 306px; height: 43px; } .fileContainer [type=file] { float: left; position: absolute; right: 0; text-align: right; top: 0; cursor: pointer; width: 306px; height: 43px; } .div7 { background-color: rgba(130,130,130,0.70); color: white; } .div7Internal { width: 1200px; margin: 0px auto 0px auto; padding: 0px 0px 50px 0px; font-size: 20px; } @media all and (max-width: 1200px) { .div7Internal { width: 100%; margin: 0px auto 0px auto; padding: 0px 0px 50px 0px; } } .div7Internal h3 { color: white; padding: 40px 0px 20px 0px; } .div7Block { float: left; width: 20%; padding: 0px 3% 20px 2%; } @media all and (max-width: 1200px) { .div7Block { float: left; width: 44%; padding: 0px 3% 20px 2%; } } @media all and (max-width: 700px) { .div7Block { float: none; width: 90%; padding: 0px 5% 20px 5%; } } .div7Block a:link, .div7Block a:hover, .div7Block a:active, .div7Block a:visited { color: white; text-decoration: none; } .div7Block1 { width: 20%; } .div7Block2 { width: 20%; } .div7Block3 { width: 20%; } .div7Block4 { width: 20%; } @media all and (max-width: 1200px) { .div7Block1 { width: 44%; } .div7Block2 { width: 44%; } .div7Block3 { width: 44%; } .div7Block4 { width: 44%; } } @media all and (max-width: 700px) { .div7Block1 { width: auto; } .div7Block2 { width: auto; } .div7Block3 { width: auto; } .div7Block4 { width: auto; } } .div8 { background-color: rgba(130,130,130,0.70); color: white; } .div8Internal { width: 1200px; margin: 0px auto 0px auto; padding: 50px 0px 30px 0px; border-top: solid 1px white; } @media all and (max-width: 1200px) { .div8Internal { width: 90%; margin: 0px 0px 0px 0px; padding: 50px 5% 30px 5%; border-top: solid 1px white; } } .div8Logo { width: 200px; float: left; } .div8Text { color: white; width: 400px; float: right; text-align: right; } @media all and (max-width: 1200px) { .div8Logo { width: 100%; float: none; text-align: center; } .div8Logo img { max-width: 90%; } .div8Text { color: white; width: 100%; float: none; text-align: center; } } .div8Text a:link, .div8Text a:hover, .div8Text a:active, .div8Text a:visited { color: white; } .clearBoth { clear: both; } .responsiveNav { float: right; margin: 0px 80px 0px 0px; background-color: none; } @media all and (max-width: 1200px) { .responsiveNav { float: none; clear: both; margin: 0px 40px 0px 0px; } } .div2InternalMobileNav { display: none; } @media all and (max-width: 1200px) { .div2InternalMobileNav { display: block; float:right; position:absolute; top: 70px; right: 5px; text-align: centre; z-index: 100; } } @media all and (max-width: 800px) { .div2InternalMobileNav { display: block; float:right; position:absolute; top: 40px; right: 5px; text-align: centre; } } @media all and (max-width: 500px) { .div2InternalMobileNav { display: block; float:right; position:absolute; top: 30px; right: 5px; text-align: centre; } } .projectsTypeMenu { width: 300px; left: 0px; } #primary_nav_wrap { } #primary_nav_wrap li { width: 100%; text-align: center; display: inline; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; cursor: pointer; } @media all and (max-width: 750px) { #primary_nav_wrap li { width: 100%; text-align: center; display: block; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } } @media all and (max-width: 750px) { } #primary_nav_wrap ul li a:hover { background-color: none; color: #fff; } #primary_nav_wrap ul ul li { position: relative; background-color: none; display: block; width: 100%; color: #fff; } #primary_nav_wrap ul { list-style:none; position:relative; float: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } @media all and (max-width: 750px) { #primary_nav_wrap ul { list-style:none; position:relative; float: none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; } } #primary_nav_wrap ul a { font-family:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif; font-family: "Times New Roman", Times, "serif"; text-align: center; display: inline-block; line-height: 30px; font-size: 22px; font-weight: 100; background-color: none; padding: 0px 20px 0px 20px; text-decoration: none; color: #fff; margin: 0px 0px 0px 0px; } @media all and (max-width: 1200px) { #primary_nav_wrap ul a { font-family:"HelveticaNeue","Helvetica Neue",Helvetica,Arial,sans-serif; font-family: "Times New Roman", Times, "serif"; text-align: center; display: inline-block; line-height: 30px; font-size: 22px; font-weight: 100; background-color: none; padding: 0px 20px 0px 20px; text-decoration: none; color: #fff; width: 100%; margin: 0px 0px 0px 0px; } } #primary_nav_wrap ul li { position:relative; float:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; display: inline; width: 100%; height: auto; text-align: center; background-color: none; color: white; } @media all and (max-width: 750px) { #primary_nav_wrap ul li { position:relative; float:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; display: block; width: 100%; height: auto; text-align: center; background-color: none; color: white; } } #primary_nav_wrap ul li.current-menu-item { background: none; color: white; } #primary_nav_wrap ul li:hover { background-color: transparent; color: white; } #primary_nav_wrap ul ul { display: none; position: absolute; top: 100%; right: 0px; padding:0; z-index: 500; } @media all and (max-width: 750px) { #primary_nav_wrap ul ul { display: none; position: relative; top: 100%; right: 0px; padding: 0px 0px 0px 0px; z-index: 500; } } #primary_nav_wrap ul ul li { float:none; width: 100%; color: white; } #primary_nav_wrap ul ul a { line-height:120%; padding: 10px 20px 10px 20px; margin: 0px 0px 0px 0px; width: 100%; color: white; display: block; } #primary_nav_wrap ul ul ul { top:0; right:100% } #primary_nav_wrap ul li:hover > ul { display:block; } #primary_nav_wrap ul li:focus > ul { display:block; } #showedClickable, #showedClickable2 { position:absolute; display:none; } @media all and (max-width: 750px) { #showedClickable, #showedClickable2 { position:relative; display:none; } } #showedClickable:target, #showedClickable2:target { display:block; } #showedClickable { width: 400px; } @media all and (max-width: 750px) { #showedClickable { width: 100%; } } #showedClickable2 { width: 250px; left: -100%; } @media all and (max-width: 750px) { #showedClickable2 { width: 100%; left: auto; } } .mobileClick { display: none; } @media all and (max-width: 1200px) { .mobileClick { display: block; } } .projectItemImageDiv { width: 295px; height: 295px; float:left; text-align:center; background-size: cover; margin: 0px 5px 5px 0px; background-position: center center; } .projectMap { width: 800px; height: 500px; margin-left:auto; margin-right:auto; } @media all and (max-width: 1200px) { .projectMap { width: 100%; height: 340px; margin-left: 0px; margin-right: 0px; } } .multicolumn4 { -moz-column-count: 4; -moz-column-gap: 20px; -webkit-column-count: 4; -webkit-column-gap: 20px; column-count: 4; column-gap: 20px; } .newsGraphic { float: left; position: relative; width: 300px; height: 300px; background-size: cover; } .newsGraphic a:link, .newsGraphic a:active, .newsGraphic a:visited { width: 300px; height: 300px; z-index: 1000; position: absolute; top: 0px; left: 0px; } .newsGraphic a:hover { background-color: rgba(27,38,68,0.50); } .newsGraphic h2 { width: 300px; position: absolute; bottom: 0px;color: white; background-color: rgba(27,38,68,0.50); margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; text-align: center; } .newsGraphicItem { float: left; position: relative; width: 300px; height: 300px; background-size: cover; } .newsGraphicItem a:link, .newsGraphicItem a:active, .newsGraphicItem a:visited { width: 300px; height: 300px; z-index: 1000; position: absolute; top: 0px; left: 0px; } .newsGraphicItem a:hover { background-color: rgba(27,38,68,0.50); } .netCosterLogo { color: rgb(102, 153, 204); font-family: "NetCosterCustomFont", stencil, Stencil, Stencil Std, "Stencil Std", "stencil", "Stencil",'Stardos Stencil', sans-serif; } .div4LeftImageGallery { width:700px; height:350px; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-position:center center; margin: 0px auto 0px auto; background-repeat: no-repeat; } .div4LeftImageGalleryNav { width:700px; height:40px; margin: 0px auto 80px auto; } .div4LeftImageGalleryNav a, .div4LeftImageGalleryNav a:link, .div4LeftImageGalleryNav a:hover, .div4LeftImageGalleryNav a:active, .div4LeftImageGalleryNav a:visited { width: 350px; height: 40px; float: left; background-color: black; display: block; text-align: center; cursor: pointer; line-height: 40px; font-size: 30px; font-weight: bold; } .div4LeftImageGalleryIcon { width:82px; height:53px; float:left; margin: 0px 15px 15px 0px; text-align:center; background: center center; background-size:cover; } .div4LeftImageGalleryIconLink { width:82px; height:53px; display:block; } .bigButton { border: 2px solid; border-radius: 25px; padding: 6px 14px 6px 14px; background-color:#E90408; color: #ffffff; clear: left; display: inline-block; margin: 0px 0px 10px 0px; } a.bigButton:hover{ border: 2px solid black; color: #000000; background-color:#FFE81A; } .projectPDFBook { margin: 0px 0px 20px 0px; } .projectContact { margin: 0px 0px 20px 0px; } .globeKeyPinLink { margin: 8px 4px 4px 4px; } .globeKeyPinLink a:link, .globeKeyPinLink a:active, .globeKeyPinLink a:visited { color: white; background-color: red; padding: 0px 10px 0px 10px; text-decoration: none; text-align: center; margin: 4px 4px 4px 4px; border: 2px solid black; border-radius: 4px; line-height: 40px; height: 40px; } .globeKeyPinLink a:hover { background-color: white; color: red; } .contentLinkRed a:link, .contentLinkRed a:active, .contentLinkRed a:visited, .contentLinkRed a:hover { color: white; background-color: red; }