/* CCCglobal - css for the CCC site */ /* Basic styles -

etc */ body, h1, h2, h3, h4, h5, h6, p, ul, form, blockquote { margin: 0px; padding: 0px; } h1, h2, h3, h4, h5, h6, pre, code { font-size: 16px; } h1 { font-size: 23px; padding: 10px 0 5px 0; } h2 { font-size: 20px; padding-top: 10px; padding-bottom: 10px; } h3 { font-size: 16px; padding-left: 10px; } .h14 { font-size: 14px; } h4 { font-size: 12px; padding-left: 10px; } hr, th { color: #c64141; } body { font: 75% Arial, Helvetica, sans-serif; font-weight: bold; color: #c64141; background-color: #c1cecd; } .b457 { margin: auto; width: 461px; } .b595 { margin: auto; width: 599px; } .b457 img { border-bottom: 2px solid #900; } .b595 img { border-bottom: 2px solid #900; } p { font-size: 16px; font-weight: bold; padding: 0px 10px 10px 10px; } a { color: #c64141; } a:hover { color: #b00; background: #a9a9a9; } #wrapper { width: 930px; height: 515px; border: solid 2px #900; margin: auto; } #wrapper-lg, #wrapper-lgslides { width: auto; height: auto; border: solid 2px #900; margin: auto; } #wrapper-lgslides table { width: 98%; } #wrapper-lgslides td { font-size: 16px; } #wrapper-lgslides td img {border: none; } #wrapper-lgslides a {text-decoration: none; } /* navigation links */ /* Nav definitions - 7 main pages - includes email link */ body#home a#homeLink, body#vms a#vmsLink, body#web a#webLink, body#net a#netLink, body#us a#usLink, body#site a#siteLink, body#cc a#ccLink { padding-right: 10px; background: url(images/star.jpg) no-repeat left center; } .home { display: block; background: url(images/home.png) no-repeat; background-position: 8px; } #Nav { float: right; width: 19%; font-weight: bold; } #Nav ul { width: 100%; list-style: none; font-size: 13px; } #Nav a { text-decoration: none; padding: 1px 0 2px 25px; display: block; border-width: 4px; border-style: solid; border-top-color: #e5e5e5; border-right-color: #666; border-bottom-color: #666; border-left-color: #ddd; } #Nav a:hover { background: #a9a9a9 url(images/redR.gif) no-repeat left center; } .email { display: block; background: url(images/email.gif) no-repeat; background-position: 110px; } .mck { margin-left: -14px; } /* Color Country Page navigation styles */ .newMenu { padding-top: 5px; } .ccMenu { text-decoration: none; padding: 2px; font-size: 14px; border-width: 4px; border-style: solid; border-top-color: #e5e5e5; border-right-color: #666; border-bottom-color: #666; border-left-color: #ddd; } /* html buttons */ .button { font-size: 14px; height: 20px; margin: 5px 20px 10px 0; } .button a { padding: 2px 15px 2px 15px; text-decoration: none; border-width: 4px; border-style: solid; border-top-color: #e5e5e5; border-right-color: #666; border-bottom-color: #666; border-left-color: #ddd; } .button a:hover { color: #900; background: #a9a9a9; } .bgc.button a { /* background color for transparent buttons over colored elements */ background-color: #c1cecd; } .bgc.button a:hover { color: #900; background: #a9a9a9; } .nbc { /* reverse of above, for transition in button background color */ background-color: transparent; } .tdu { text-decoration: underline; } /* for links inside slides */ .tdb { background-color: #b6b6b6; } /* highlight for popup links */ /* form buttons */ input.btn { color: #c64141; font-size: 14px; font-weight: bold; padding-left: 20px; padding-right: 20px; padding-bottom: 2px; background-color: #c1cecd; text-decoration: none; border-width: 4px; border-style: solid; border-top-color: #e5e5e5; border-right-color: #666; border-bottom-color: #666; border-left-color: #ddd; } input.btnhov { color: #b00; background: #a9a9a9; } .linkBox { font-size: 14px; } .linkBox a { border: 1px solid #c64141; background: #c1cecd; padding: 3px 10px 3px 10px; } .gb { background-repeat: no-repeat; background-position: 10px; background-image: url('/images/green_left_arrow.jpg'); } input.btnhov { color: #b00; background: #a9a9a9; } input.btnhov-gb { color: #b00; background: #a9a9a9; background-repeat: no-repeat; background-position: 10px; background-image: url('/images/green_left_arrow.jpg'); } /* styles for images */ img { border: none; } .imgbdr { border: solid 2px #c64141; } #BannerPix { border-bottom: solid 2px #900; width: 100%; } #caption { width: 80%; font-size: 12px; padding-left: 10px; border-bottom: 1px solid #900; } #caption2 { padding-left: 10px; border-bottom: 1px solid #900; } #caption3 { /* no padding - assumed it will be centered in code */ font-size: 16px; border-bottom: 1px solid #900; } /* specific element styles */ #main textarea { /* 2 definitions for email form */ font-size: 16px; font-weight: bold; color: #c64141; } #main input { font-size: 16px; font-weight: bold; color: #c64141; } #home-main h1 { font-size: 32px; padding: 25px 0 12px 0; } #home-main h2 { padding: 5px 0 27px 0; } .emphasize { font-style: italic; } .hikehd { font-weight: bold; text-align: center; margin-top: 10px; margin-bottom: 10px; } .dec-off { text-decoration: none; } /* positioning */ table#w400 { text-align: center; width: 400px; } table#w800 { text-align: center; width: 800px; } table#w920 { text-align: center; width: 920px; } table#w920 td { font-size: 14px; } table#w920 td a { text-decoration: none; } table#t-12 a:hover { background: #c1cecd; } .leftFloat { float: left; } .rightFloat { float: right; } .rel { position: relative; } .pt10 { padding-top: 10px; } .pt3 { padding-top: 3px; } .ml10 { margin-left: 10px; } /* ML10 */ .ml15 { margin-left: 15px; } /* ditto */ .mt-80 { margin-top: -80px; } .mt-70 { margin-top: -70px; } .mt-60 { margin-top: -60px; } .mt-45 { margin-top: -45px; } .mt-40 { margin-top: -40px; } .mt-30 { margin-top: -30px; } .mt-25 { margin-top: -25px; } .mt-15 { margin-top: -15px; } .mt-10 { margin-top: -10px; } .mt-4 { margin-top: -4px; } .mt4 { margin-top: 4px; } .mt-0 { margin-top: -0px; } .mt5 { margin-top: 5px; } .mt10 { margin-top: 10px; } .mt12 { margin-top: 12px; } .mt15 { margin-top: 15px; } .mt40 { margin-top: 40px; } .mr10 { margin-right: 10px; } .mb-5 { margin-bottom: -5px; } .mb3 { margin-bottom: 3px; } .mb8 { margin-bottom: 8px; } .mb6 { margin-bottom: 6px; } .mb10 { margin-bottom: 10px; } .mb25 { margin-bottom: 25px; } .mb32 { margin-bottom: 32px; } .mb50 { margin-bottom: 50px; } .cath { position: absolute; top: 585px; left: 650px; } /* Cathedral Canyon */ .face { position: absolute; top: 455px; left: 180px; } /* Face Canyon */ .burrwpkt { position: absolute; top: 580px; left: 130px; } /* Burr/Waterpocket */ .mrblcyn { position: absolute; top: 615px; left: 110px; } /* Burr/Waterpocket */ .coconf { position: absolute; top: 595px; left: 390px; } /* COLtlCO Confluence */ .coba { position: absolute; top: 630px; left: 395px; } /* Grand-Bright Angel */ .ut12a { position: absolute; top: 623px; left: 650px; } .ut12b { position: absolute; top: 628px; left: 390px; } .gnsp { position: absolute; top: 325px; left: 775px; } .gnge { position: absolute; top: 630px; left: 650px; } .earth-c { position: absolute; top: 585px; left: 360px; } /* centered under © on 620+px win */ .ecg { position: absolute; top: 580px; left: 45px; } /* escalante canyongs geology */ .button-sat1 { position: absolute; top: 60px; left: 20px; } /* NASA satellite b-1 */ .button-sat2 { position: absolute; top: 100px; left: 20px; } /* NASA satellite b-2 */ .button-sat3 { position: absolute; top: 140px; left: 20px; } /* NASA satellite b-3 */ .sp75 { margin-left: 75px; } .sp100 { margin-left: 100px; } .sp150 { margin-left: 150px; } .sp200 { margin-left: 200px; } #compPt { /* Compass Point, used in Scenic U-12 */ background: #c1cecd; color: #c64141; position: absolute; top: 450px; left: 50px; z-index: 2; visibility: hidden; width: 470px; padding: 10px; margin: 10px; border: 2px solid #900; } #slickRk { /* Slickrock definition, used in Scenic U-12 */ background: #c1cecd; color: #c64141; position: absolute; top: 390px; left: 350px; z-index: 2; visibility: hidden; width: 520px; padding: 10px; margin: 10px; border: 2px solid #900; } #u95pUp { position: absolute; top: 30px; left: 25px; visibility: hidden; } /* end of CCCGlobal.css */ /* begin anylinkmenu.css */ /*CSS class that gets added to the currently selected anchor link (assuming it's a text link)*/ .selectedanchor{ background: #c3c3c3; } /* ######### Default class for drop down menus ######### */ .anylinkmenu{ position: absolute; left: 0; top: 0; visibility: hidden; border: 1px solid #900; border-bottom-width: 0; font: normal 12px Verdana; line-height: 18px; z-index: 100; /* zIndex should be greater than that of shadow's below */ background: #E9E9E9; width: 220px; /* default width for menu */ } .anylinkmenu ul{ margin: 0; padding: 0; list-style-type: none; } .anylinkmenu ul li a{ width: 100%; display: block; text-indent: 3px; border-bottom: 1px solid #900; padding: 2px 0; text-decoration: none; font-weight: bold; text-indent: 5px; } .anylinkmenu a:hover{ /*hover background color*/ background: #c3c3c3; color: #900; } /* ######### Custom style for Banners (menu4) (not so wide) */ .anylinkmenu2{ position: absolute; left: 0; top: 0; visibility: hidden; border: 1px solid #900; border-bottom-width: 0; font: normal 12px Verdana; line-height: 18px; z-index: 100; /* zIndex should be greater than that of shadow's below */ background: #E9E9E9; width: 175px; /* custom width for menu4 */ } .anylinkmenu2 ul{ margin: 0; padding: 0; list-style-type: none; } .anylinkmenu2 ul li a{ width: 100%; display: block; text-indent: 3px; border-bottom: 1px solid #900; padding: 2px 0; text-decoration: none; font-weight: bold; text-indent: 5px; } .anylinkmenu2 a:hover{ /*hover background color*/ background: #c3c3c3; color: #900; } /* ######### Custom style for National Parks (not so wide) */ .anylinkmenu3{ position: absolute; left: 0; top: 0; visibility: hidden; border: 1px solid #900; border-bottom-width: 0; font: normal 12px Verdana; line-height: 18px; z-index: 100; /* zIndex should be greater than that of shadow's below */ background: #E9E9E9; width: 195px; /* custom width for Parks */ } .anylinkmenu3 ul{ margin: 0; padding: 0; list-style-type: none; } .anylinkmenu3 ul li a{ width: 100%; display: block; text-indent: 3px; border-bottom: 1px solid #900; padding: 2px 0; text-decoration: none; font-weight: bold; text-indent: 5px; } .anylinkmenu3 a:hover{ /*hover background color*/ background: #c3c3c3; color: #900; } /* ######### Alternate multi-column class for drop down menus ######### */ .anylinkmenucols{ position: absolute; width: 330px; left: 0; top: 0; visibility: hidden; border: 1px solid #900; padding: 5px; font: normal 12px Verdana; z-index: 100; /*zIndex should be greater than that of shadow's below*/ background: #E9E9E9; } .anylinkmenucols li{ padding-bottom: 3px; font-weight: bold; } .anylinkmenucols .column{ float: left; padding: 3px 8px; margin-right: 5px; background: #E0E0E0; } .anylinkmenucols .column ul{ margin: 0; padding: 0; list-style-type: none; } .anylinkmenucols a:hover{ /*hover background color*/ background: #c3c3c3; color: #900; } /* ######### class for shadow DIV ######### */ .anylinkshadow{ /*CSS for shadow. Keep this as is */ position: absolute; left: 0; top: 0; z-index: 99; /*zIndex for shadow*/ background: black; visibility: hidden; }