* { box-sizing: border-box; } html,body { width: 100%; height: 100%; margin: 0px; padding: 0px; overflow-x: hidden; } [class*="col-"] { float: left; } .row:after { content: ""; clear: both; display: block; } html { font-family: "Arial", sans-serif; } h1 { color: #800000; text-align: center; margin-top: 80px; margin-bottom: 50px; } h2 { color: #800000; } h3 { color: #800000; } /* For mobile phones: */ [class*="col-"] { width: 100%; } /* For tablets: */ @media only screen and (min-width: 600px) and (max-width: 924px) { .col-m-1 {width: 8.33%;} .col-m-2 {width: 16.66%;} .col-m-3 {width: 25%;} .col-m-4 {width: 33.33%;} .col-m-5 {width: 41.66%;} .col-m-6 {width: 50%;} .col-m-7 {width: 58.33%;} .col-m-8 {width: 66.66%;} .col-m-9 {width: 75%;} .col-m-10 {width: 83.33%;} .col-m-11 {width: 91.66%;} .col-m-12 {width: 100%;} } /* For desktop: */ @media only screen and (min-width: 925px) { .col-1 {width: 8.33%;} .col-2 {width: 16.66%;} .col-3 {width: 25%;} .col-4 {width: 33.33%;} .col-5 {width: 41.66%;} .col-6 {width: 50%;} .col-7 {width: 58.33%;} .col-8 {width: 66.66%;} .col-9 {width: 75%;} .col-10 {width: 83.33%;} .col-11 {width: 91.66%;} .col-12 {width: 100%;} } header { background: #FFFFFF; height: 90px; } nav { text-align: center; font-family: Helvetica, Arial, sans-serif; text-transform: uppercase; width: 100%; } nav ul { background: #FCF2F2; /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ box-shadow: 0px 0px 9px rgba(0,0,0,0.15); padding: 0 0; margin: auto; border-radius: 0px; list-style: none; position: relative; display: inline-table; color: #222222; /*border-left: 1px solid hsla(0, 0%, 0%, 0.22);*/ } nav ul:after { content: ""; clear: both; display: block; } nav ul li:hover { background: linear-gradient(to top, #FFB3B3, #FF5757); } nav ul li a:hover { color: #ffffff; } @media only screen and (max-width: 599px) { #navbarbg { /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ height: 252px; } nav ul li { /*background-color: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ /*background: #FCF2F2;*/ background: #FFFFFF; float: left; border-right: 1px solid hsla(0, 0%, 0%, 0.22); border-left: 1px solid hsla(0, 0%, 0%, 0.22); /*border-top: 2px solid #FF5858;*/ /*border-bottom: 2px solid #FF5858;*/ color: #222222; width: 100%; height: 36px; } nav ul li a { display: block; border-top: 2px solid #FF5858; border-bottom: 2px solid #FF5858; padding: 10px 30px; color: #222222; text-decoration: none; font-size: 13px; font-weight: bold; letter-spacing: 1.5px; } nav ul li a:link { color: #222222; } nav ul ul { display: none; } } @media only screen and (min-width: 600px) and (max-width: 924px){ #navbarbg { /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ background: #FFFFFF; height: 72px; } nav ul { background: #FFFFFF; /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ box-shadow: 0px 0px 9px rgba(0,0,0,0.15); padding: 0 0; margin: auto; border-radius: 0px; list-style: none; position: relative; display: inline-table; color: #222222; border-left: 1px solid hsla(0, 0%, 0%, 0.22); width: 100%; } nav ul:after { content: ""; clear: both; display: block; } nav ul li.toprow { /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ background: #FCF2F2; float: left; border-right: 1px solid hsla(0, 0%, 0%, 0.22); border-bottom: 1px solid hsla(0, 0%, 0%, 0.22); border-top: 2px solid #FF5858; border-bottom: 2px solid #FF5858; color: #222222; height: 36px; width: 25%; } nav ul li.bottomrow { /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ background: #FCF2F2; float: left; border-right: 1px solid hsla(0, 0%, 0%, 0.22); border-bottom: 2px solid #FF5858; color: #222222; height: 36px; width: 33.3%; } nav ul li a { display: block; padding: 10px 30px; color: #222222; text-decoration: none; font-size: 13px; font-weight: bold; letter-spacing: 1.5px; } nav ul li a:link { color: #ffffff; } nav ul li:hover { background: linear-gradient(to top, #FFB3B3, #FF5757); } nav ul ul { display: none; } } @media only screen and (min-width: 925px) { #navbarbg { /*background: #FCF2F2;*/ background: #FFFFFF; height: 36px; } nav ul { background: #FCF2F2; /*background: linear-gradient(to top, #000000 0%, #222222 50%, #3c3c3c 51%, #393939 78%, #888888 100%);*/ box-shadow: 0px 0px 9px rgba(0,0,0,0.15); padding: 0 0; margin: auto; border-radius: 0px; list-style: none; position: relative; display: inline-table; color: #222222; border-left: 1px solid hsla(0, 0%, 0%, 0.22); } nav ul:after { content: ""; clear: both; display: block; } nav ul li { float: left; border-right: 1px solid hsla(0, 0%, 0%, 0.22); border-top: 2px solid #FF5858; border-bottom: 2px solid #FF5858; color: #222222; } nav ul li:hover { background: linear-gradient(to top, #FFB3B3, #FF5757); } nav ul li:hover a { color: #222222; } nav ul li a:hover { color: #FFFFFF; } nav ul li:hover > ul { display: block; } nav ul li a { display: block; padding: 10px 30px; color: #222222; text-decoration: none; font-size: 13px; font-weight: bold; letter-spacing: 1.5px; } nav ul li a:link { color: #222222; } nav ul ul{ display: none; border-radius: 0px; position: absolute; top: 100%; z-index: 1; } nav ul ul li { float: none; border-top: 1px solid #000000; border-bottom: 1px solid #000000; /*background: linear-gradient(to top, #222222 0%, #444444 50%, #444444 51%, #5b5b5b 78%, #aaaaaa 100%);*/ background: #FCF2F2 position: relative; } nav ul ul li a { padding: 10px 10px; text-align: left; } nav ul ul li a:hover { background: linear-gradient(to top, #FFB3B3, #FF5757); color: #FFFFFF; } } #main { height: auto; } footer { line-height: 150%; text-align: center; } @media only screen and (min-width: 1200px) { #main { float: none; margin: auto; overflow: hidden; width: 1200px; } } @media only screen and (max-width: 1199px) { #main { float: none; margin: auto; overflow: hidden; width: 100%; } } ul.smallarrow { list-style-position: outside; list-style-image: url(Images/30.gif); padding: 20px; } ul.redarrow { list-style-position: outside; list-style-image: url(Images/icon_link.gif); padding: 0px; padding-left: 25px; } ul.redarrow li { line-height: 25px; } .leftNavItemSelect { FONT-WEIGHT: bold; FONT-SIZE: 11px; COLOR: #ff0000; FONT-FAMILY: Verdana, Arial, Helvetica, sans-serif; TEXT-DECORATION: none } #logo { width: 1024px; margin: auto; height: 100px; } #logo2 { position: relative; left: 50px; top: 10px; } #HeaderText2 { position: absolute; top: 20px; left: 250px; font-family: "Arial", sans-serif; font-size: 43px; font-weight: bold; color: transparent; -webkit-text-stroke: 0.75px #FF5858; text-stroke: 0.75px #FF5858; } #HeaderText { position: absolute; top: 20px; left: 80px; font-family: "Arial", sans-serif; font-size: 43px; font-weight: bold; color: #FF5858; } @media only screen and (min-width: 925px) { #LeftSideBar { position: relative; /*width: 190px;*/ height: 100%; float: left; } #NewsAndEvents { position: relative; top: 5px; height: 24px; /*width: 180px;*/ background: linear-gradient(to top, #BD2626, #FF5858); border-radius: 10px 10px 2px 2px; padding-left: 10px; color: #FCF2F2; font-size: 12px; font-family: Arial, sans-serif; font-weight: bold; } #NAEcontents { position: absolute; bottom: 3; left: 10; } #MarqueeFrame { /*width: 190px;*/ height: auto; overflow: hidden; } #NewsMarquee { position: relative; height: 520px; /*width: 175px;*/ animation: scrollv 12s linear infinite; } @keyframes scrollv { from {top: 310px;} to {top: -556px;} } #MoreNews { /*width: 180px;*/ height: 20px; background: #0535ba; text-align: left; border-radius: 2px 2px 10px 10px; padding-left: 10px; padding-top: 2px; background: linear-gradient(to top, #BD2626, #FF5858); } #MoreNews a { color: #FCF2F2; font-size: 12px; font-family: Arial, sans-serif; font-weight: bold; text-decoration: none; } } @media only screen and (max-width: 924px) { #LeftSideBar { display: none; } } #Address { width: 100%; height: 150px; overflow: hidden; position: relative; } #Address p { margin: 0px; } .billboardcopy2 { FONT-SIZE: 14px; COLOR: #8B346B; FONT-FAMILY: Andale Mono, monospace, Helvetica, Arial, sans-serif; } A { FONT-WEIGHT: normal; FONT-SIZE: 1em; COLOR: #2151d6; FONT-FAMILY: Arial, Helvetica, sans-serif; font-decoration: underline } A:link { COLOR: #000066} A:hover { COLOR: #666666 } #topbar { width: 100%; border: 3px solid #FF731E; margin: 20px 4px; } @media only screen and (max-width: 599px) { #French { display: none; } } #French { height: 22px; } .billboardCopy { /*FONT-SIZE: 16px; COLOR: #222222; FONT-FAMILY: cursive, Arial, Helvetica, sans-serif; text-align: center;*/ FONT-SIZE: 16px; COLOR: #222222; FONT-FAMILY: Helvetica, Arial, sans-serif; text-align: center; font-weight:bold; } #intro {} #introtext { line-height: 200%; } #rightsidepic {} @media only screen and (max-width: 599px) { #rightsidepic { display: none; } #emailtable { float: left; } } @media only screen and (min-width: 600px) { #Email { padding-top: 150px; padding-right: 70px; } #emailtable { float: right; } } .MainBody { FONT-SIZE: 15px; COLOR: #8B346B; LINE-HEIGHT: 17px; FONT-FAMILY: verdana } #Payment { padding: 5px; padding-top: 40px; text-align: center; } .listlink { position: relative; } .listlink a{ font-size: 16px; font-weight: bold; } .listdesc { position: relative; } .NewsListItem { position: relative; } .MonthFormat { position: relative; font-size: 18px; color:#800000; padding-bottom: 5px; } .MonthLink { font-size: 18px; padding-bottom: 10px; } .MonthLink a{ font-size: 0.8em; } @media only screen and (min-width: 925px) { .MonthLink { position: absolute; left: 100px; top: 0px; } } @media only screen and (max-width: 924px){ .MonthLink { position: relative; } } .MenuLink a{ font-size: 1em; font-weight: bold; } .MenuLinkV a{ font-size: 1em; font-weight: bold; color: #ffffff; background: linear-gradient(to top, #BD2626, #FF5858); border-radius: 10px; padding: 10px; line-height: 2.5em; text-decoration: none; position: relative; left: 100px; } .item { position: relative; padding-bottom: 10px; height: auto; } @media only screen and (min-width: 600px) { .newtag { text-transform: uppercase; color: #FF0000; } } @media only screen and (max-width: 599px) { .newtag { display: none; } } .imagecaption { text-align: center; font-weight: bold; font-size: 12px; } @media only screen and (max-width: 599px) { .LargeImage1 { width: 100%; } .LargeImage2 { display: none; } } @media only screen and (min-width: 600px) { .LargeImage1 { display: none; } } .note { font-style: italic; } .featureslist ul li { font-size: 1.2em; margin: 5px; } .tableparameter { margin: auto; } .tableparameter table { border: 1px solid black; border-collapse: collapse; } .tableparameter table th{ border: 1px solid black; padding: 5px; font-weigth: bold; } .tableparameter table td { border: 1px solid black; padding: 5px; } .tablegrating th, td { padding: 2px 5px; } .tablegrating { border-collapse: collapse; } .tablemask { margin: auto; } .tablemask table { border: none; } .tablemask table th{ padding: 5px; } .tablemask table td { padding: 5px; } .itemtag { text-transform: uppercase; } .products ul li { padding-bottom: 20px; } .products ul li a{ color: #0000FF; font-size: 1.2em; }