/*RESET*/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;} body {line-height: 1;}ol, ul{list-style:none;} blockquote, q{quotes:none;} blockquote:before, blockquote:after, q:before, q:after{content:'';content:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0;} /*MAIN CODE FOR PAGE LAYOUT DEFAULTS*/ /* Hide scrollbar for Chrome, Safari and Opera */ .no_scrollbar::-webkit-scrollbar { display: none; } } /* Hide scrollbar for IE and Edge */ .no_scrollbar { -ms-overflow-style: none; } /*Body area setup*/ body { font-size: 1.75em; /*20px*/ line-height: 1.25em; /*line spacing using em*/ font-family: arial; background: #1E90FF;/*background color*/ color: #00FF7F;/*font color*/ } /*Controls for top area of page-header*/ header { background: #FF00FF; /*background color of header*/ width: 100%; /*100% of screen area*/ height: 75px; position: fixed; /*stays in place*/ top: 0; /*top margin*/ left: 0; /*left margin*/ border-bottom: 4px solid #4C9CF1; /*border on bottom of link area*/ z-index: 100; } /*Banner controls*/ .img_banner { margin-top:20px; width: 100%; border:2px red; } /*Link area settings*/ nav { float: right; padding: 20px; } /*Main link controls*/ a { color: #00FF7F; text-decoration: underline; font-weight: bold; } /*Link HOVER*/ a:hover { color: #C71585; text-decoration:none; } /***Mobile menu icon controls***/ #menu-icon { display: hidden; /*hidden until @media activates*/ width: 40px; height: 40px; background: url(../images/menu-icon.png) center; } /*when person touches or mouse goes over mobile icon on smaller screen*/ a:hover#menu-icon { background-color: purple; border-radius: 4px 4px 0 0; } ul { list-style: none; } li { display: inline-block; float: left; padding: 10px } /***Setup of main SECTION area where items show on page***/ section { margin: 80px auto 40px; max-width: 1000px; /*width of display area*/ position: relative; padding: 20px } /*****MEDIA QUERY-changes website for mobile or smaller screens*****/ @media only screen and (max-width : 800px) { /*Main page @ media controls*/ header { position: fixed; } #menu-icon { display:inline-block; } nav ul, nav:active ul { display: none; position: fixed; /*was moving-absolute*/ padding: 20px; background: #fff; border: 5px solid #444; right: 20px; top: 60px; width: 35%; border-radius: 4px 0 4px 4px; } nav li { text-align: center; width: 100%; padding: 10px 0; margin: 0; } nav:hover ul { display: block; } }/*closes @media section*/