/* INDEX PAGE ===================== */ #IndexPage { display: inline-block; float: left; width: 980px; height: auto; margin-top: 10px; margin-bottom: 20px; margin-left: 0px; margin-right: 0px;} .Home-Page-Top-Row { display: block; width: 980px; height: 360px; margin-top: 20px; margin-bottom: 30px; margin-left: 50px; margin-right: 50px;} .Home-Page-Row { display: block; width: 980px; margin-top: 20px; margin-bottom: 30px; margin-left: 50px; margin-right: 50px;} #Home-Page-Left { display: inline-block; float: left; width: 600px; height: 360px; margin-right: 20px;} #Home-Page-Right { display: inline-block; float: left; width: 360px; height: 360px; } #Home-Page-R1 { display: inline-block; float: left; width: 360px; height: 260px; } #Home-Page-R2 { display: inline-block; float: left; width: 360px; height: 100px; } .Home-Page-Box-A { display: inline-block; float: left; width: 230px; min-height: 170px; margin-right: 20px ;font-size: 13px; line-height: 15px; color:#454545; } .Home-Page-Box-B { display: inline-block; float: left; width: 230px; min-height: 170px; font-size: 13px; line-height: 15px; color:#454545; } .Home-Page-Box-C { display: inline-block; float: left; width: 480px; min-height: 170px; font-size: 13px; line-height: 15px; color:#454545; } .Home-Page-Box-C div { width: 100%; margin-bottom: 25px; font-size: 12px; line-height: 13px; text-align: center; } .Home-Page-Box-C div b { width: 100%; font-size: 17px; line-height: 20px; color: #EF6620; } .Home-Page-Box-A b, .Home-Page-Box-B b, .Home-Page-Box-C b { font-size: 14px; line-height: 16px; color:#000000; } .Home-Page-Box-A a, .Home-Page-Box-B a, .Home-Page-Box-C a { color:#000000; text-decoration: none; } .Home-Page-Box-A a:hover, .Home-Page-Box-B a:hover, .Home-Page-Box-C a:hover { color:#000000; text-decoration: underline; } .What-Is-New { display: inline-block; float: left; font-family: 'Roboto Slab', serif; font-size: 18px; line-height: 18px; width: 890px; margin-bottom: 15px; color: #000000; } #Index-Quotes b { font-family: 'Roboto Slab', serif; font-size: 28px; line-height: 32px; color: #666666; font-weight: lighter; } #Index-Quotes { display: inline-block; float: left; width: 480px; height: auto; padding-top: 15px; text-align: center; font-size: 12px; line-height: 14px; color: #999999; } /* #Index-Quotes { display: block; width: 980px; height: auto; margin-top: 20px; margin-bottom: 30px; margin-left: 50px; margin-right: 50px; text-align: center; font-size: 12px; line-height: 14px; color: #999999; } */ /* GENERAL SETTINGS ===================== */ div { font-family: 'Open Sans', sans-serif; font-size: 12px; color: #454545; } td { font-family: 'Open Sans', sans-serif; font-size: 14px; line-height: 16px; color: #454545; } body { background-image: url(../Images/Body-Background.jpg); margin: 0px; padding: 0px; } h1,h2,h3,h4,h5 { font-family: 'Roboto Slab', serif; color: #000000;} input { font-family: 'Open Sans', sans-serif; } a { color: #3366cc; text-decoration: none;} a:hover {text-decoration: underline;} ul { margin-left: 0;padding-left: 0; } ol { margin-left: 0;padding-left: 0; } ul li { margin-left: 1.5em;margin-bottom: 10px; } ol li { margin-left: 1.5em;margin-bottom: 10px; } .Clear { clear: both; display: inline-block; width: 100%; } #Masthead { width: 1080px; height: 140px; display: block; margin: 0px auto; position: relative; } #Logo { width: 1080px; height: 140px; position: absolute; z-index: 1001; left: 0px; top: 0px; } #MastheadSocial { width: 220px; height: 23px; position: absolute; z-index: 1002; right: 18px; top: 30px; } #MastheadSocial div { display: inline-block; float: right; width: 23px; height: 23px; margin-left: 2px; } #Content { background-image: url(../Images/Content-Background.png); background-repeat: repeat-y; min-height: 500px; width: 1080px; display: block; margin: 0px auto; } #Content-Bottom { background-image: url(../Images/Content-Bottom.png); background-repeat: none; height: 20px; width: 1080px; display: block; margin: 0px auto; } #Footer { width:1080px; padding: 40px 20px 0px; margin: 0px auto 20px; font-size: 11px; text-align: center; color: #FFFFFF; } #Footer a { color: #FFFFFF; text-decoration: underline; } #Headline { display: inline-block; float: left; font-family: 'Roboto Slab', serif; font-size: 24px; color: #00aeef; width: 1000px; height: auto; margin-bottom: 40px; } #DownloadTerms { font-size: 11px; line-height: 12px; } /* PAGE BOTTOM (LOGOS) ===================== */ #Logos { width: 1080px; min-height: 300px; margin: 20px auto 0px; font-size: 12px; color: #FFFFFF; } #Logos-1 { width: 600px; float: left; display: inline-block; margin-right: 15px; } #Logos-2 { width: 130px; float: left; display: inline-block; margin-right: 15px; } #Logos-2 div { display: block; width: 100%; clear: both; margin-bottom: 10px; font-size: 14px; } #Logos-2 div img { float: left; margin-right: 7px; } #Logos-3 { width: 300px; float: left; display: inline-block; font-size: 14px; } .Logo-Block { display: inline-block; float: left; width: 260px; margin: 10px 20px; text-align: center; } .Logo-Block img { margin-bottom: 7px; } #Logos a { color: #FFFFFF; text-decoration: none; } #Logos a:hover { color: #FFFFFF; text-decoration: underline; } /* SOCIAL BUTTONS ================== */ #Social { width:100%; height: auto; display: inline-block; margin-bottom: 30px; clear: both; } #Social div { font-size: 13px; height: 23px; background-color: #cccccc; float: left; display: inline-block; margin-right: 2px; padding-left: 20px; padding-top: 4px; padding-right: 10px; color: #ffffff; text-align: center; cursor: pointer; } #Social #twitter { background-color: #00acee; background-image: url(../Images/Icon-Social-Twitter.gif); background-position: 8px center; background-repeat: no-repeat; min-width: 100px; } #Social #facebook { background-color: #29447e; background-image: url(../Images/Icon-Social-Facebook.gif); background-repeat: no-repeat; background-position: 6px center; min-width: 100px; } #Social #google { background-color: #cd3d2b; background-image: url(../Images/Icon-Social-Google-Plus.gif); background-repeat: no-repeat; background-position: center; width: 23px; padding-left: 5px; padding-right: 5px; } #Social #add2any { background-color: #333333; background-repeat: no-repeat; background-position: center; width: 23px; padding-left: 5px; padding-right: 5px; } #Social #pinterest { background-color: #cb2027; background-image: url(../Images/Icon-Social-Pinterest.gif); background-repeat: no-repeat; background-position: center; width: 23px; padding-left: 5px; padding-right: 5px; } #Social #diaspora { background-color: #f26522; background-image: url(../Images/Icon-Social-Diaspora.gif); background-repeat: no-repeat; background-position: center; width: 23px; padding-left: 5px; padding-right: 5px; } /* AD SPOTS ============================== */ #AD-728-Top { display: inline-block; float: left; width: 728px; height: 90px; margin: 20px 176px; background-color: #ececec; } #AD-300 { display: inline-block; float: left; width: 300px; height: auto; margin: 15px 0px; background-color: #99CC33; } /* PAGE NAVIGATION ==================== */ #Nav { display: inline-block; width: 1000px; padding: 6px 0px; text-align: center; } #Nav a { padding: 5px 10px; text-decoration: none; border:1px solid #D2F2FF; color: #00aeef; } #Nav a:hover { text-decoration: underline; background-color: #D2F2FF; } .Nav-Active { background-color: #D2F2FF; font-weight: bold; padding: 5px 10px; border:1px solid #D2F2FF; color: #00aeef; } /* PAGE CONTAINERS ================================ */ #FullPage { display: inline-block; float: left; width: 1000px; height: auto; margin-top: 20px; margin-bottom: 20px; margin-left: 50px; margin-right: 0px; } #Left { display: inline-block; float: left; width: 640px; height: auto; margin-top: 20px; margin-bottom: 20px; margin-left: 50px; margin-right: 40px; } #Right { display: inline-block; float: left; width: 300px; height: auto; margin-top: 20px; margin-bottom: 20px; } #Download-Media-Left { display: inline-block; float: left; width: 560px; height: auto; margin-top: 20px; margin-bottom: 20px; margin-left: 50px; margin-right: 40px; } #Download-Media-Right { display: inline-block; float: left; width: 380px; height: auto; margin-top: 20px; margin-bottom: 20px; font-size: 14px; line-height: 20px; } #Download-Info-Left { display: inline-block; float: left; width: 560px; height: auto; margin-top: 0px; margin-bottom: 20px; margin-left: 50px; margin-right: 40px; } #Download-Info-Right { display: inline-block; float: left; width: 380px; height: auto; margin-top: 0px; margin-bottom: 20px; } /* CONTENT PAGE ELEMENTS ================================ */ #Download-Media-Right h1 { font-size: 24px; line-height: 28px; padding-top: 0px; margin-top: 0px; color: #000000; } .Download-Version { font-size: 12px; line-height: 15px; color: #454545; } .Download-Version a { color: #454545; text-decoration: underline; } #Breadcrumbs { display: inline-block; float: left; width: 100%; height: auto; margin-top: 20px; margin-bottom: 10px; font-size: 10px; text-transform: uppercase; color: #333333; clear: both; } #Download-Breadcrumbs { display: inline-block; float: left; width: 980px; height: auto; margin-top: 40px; margin-bottom: 10px; margin-left: 50px; margin-right: 0px; font-size: 10px; text-transform: uppercase; color: #333333; clear: both; } #Breadcrumbs a, #Download-Breadcrumbs a { color: #333333; text-decoration: none; } #Breadcrumbs a:hover, #Download-Breadcrumbs a:hover { color: #333333; text-decoration: underline; } #Title { display: inline-block; float: left; width: 100%; height: auto; margin-bottom: 10px; clear: both; } #Title h1 { color: #000000; font-size: 32px; line-height: 34px; font-weight: 700; margin-bottom: 0px; padding-bottom: 0px; margin-top: 0px; padding-top: 0px; } #Date { display: inline-block; float: left; width: 100%; height: auto; color: #999999; font-size: 12px; margin-bottom: 10px; clear: both; } #Date a { color: #999999; text-decoration: none; } #Date a:hover { color: #999999; text-decoration: underline; } #Article { display: inline-block; float: left; width: 100%; height: auto; font-size: 16px; line-height: 23px; margin-bottom: 30px; clear: both; } #Article h1, #Article h2 { font-size: 22px; line-height: 26px; } #Media { display: inline-block; float: left; width: 100%; height: auto; position: relative; margin-bottom: 15px; clear: both;} .Credit { font-size: 12px; color: #454545; } .Credit a { color: #454545; text-decoration: underline; } #Instructions { display: inline-block; float: left; width: 100%; height: auto; font-size: 14px; line-height: 20px; margin-bottom: 30px; } #Instructions h1, #Instructions h2 { font-size: 22px; line-height: 26px; } #Instructions h3 { font-size: 18px; line-height: 22px; color: #000000; } #License-Info { display: inline-block; float: left; width: 100%; height: auto; font-size: 16px; line-height: 23px; margin-bottom: 30px; } #License-Info h1, #License-Info h2 { font-size: 22px; line-height: 26px; } #Comments { display: inline-block; float: left; width: 100%; height: auto; margin-bottom: 30px; clear: both; } #Contest { display: inline-block; float: left; width: 600px; margin-top: 10px; margin-left: 186px; font-size: 14px; line-height: 22px; text-align: center; } #Contest h1 { font-size: 40px; line-height: 44px; } #Sponsors { display: inline-block; float: left; width: 800px; margin-top: 10px; margin-left: 86px; font-size: 14px; line-height: 22px; text-align: center; } #Sponsors div { display: inline-block; float: left; width: 224px; margin-right: 28px; margin-bottom: 20px; font-size: 14px;} /* KEYWORD/TAGS ================================ */ #Keywords { display: inline-block; float: left; width: 100%; height: auto; margin-bottom: 30px; clear: both; } .Keywords { display: inline-block; font-size: 11px; line-height: 100%; padding: 8px; margin-right: 2px; margin-bottom: 2px; font-weight: 700; text-align: center; min-width: 30px; background-color: #c7c7c7; } .Keywords a { color: #ffffff; text-decoration: none; } #Related { display: inline-block; float: left; width: 100%; height: auto; margin-top: 30px; clear: both;} /* MEDIA ELEMENTS ================================ */ .cycle-slideshow { } .cycle-slideshow div { width: 100%; height: auto; } #Media-Prev { position: absolute; left: -7px; top: 50%; width: 40px; z-index: 9000; cursor: pointer; } #Media-Next { position: absolute; right: -7px; top: 50%; width: 40px; z-index: 9001; cursor: pointer; } #Media-Prev div, #Media-Next div { position: absolute; left: 0px; top: -35px; } .Photo { display: block; width: 100%; height: auto; } .Photo img { max-width: 100%; height: auto; } .YouTube { position: relative; padding-bottom: 56.25%; height: 0px; background-color: #000000; } /* 16:9 ratio */ .YouTube iframe { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } .Vimeo { position: relative; padding-bottom: 56.25%; height: 0px; background-color: #000000; } /* 16:9 ratio */ .Vimeo iframe { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; } /* CONTACT FORM ============================ */ .Input-Message { width: 400px; margin-bottom: 15px; font-size: 14px; color: #007A75; } .Input-400 { width: 400px; margin-bottom: 15px; font-size: 14px; height: 30px; color: #007A75; } .Input-200 { width: 200px; margin-bottom: 15px; font-size: 14px; height: 30px; color: #007A75; } #Right-Contact-Info { font-size: 14px; line-height: 16px; color: #454545; background-color: #E6F4FB; display: block; width: 260px; padding: 20px; } #Right-Contact-Info b { color: #000000; } #Right-Contact-Info a { color: #2580ae; text-decoration: underline; } /* SUBSCRIBE FORM ============================ */ #Subscribe-Form { display: inline-block; float: left; width: 640px; margin-top: 30px; margin-left: 180px; font-size: 14px; line-height: 22px; text-align: center; } #Subscribe-Form h1 { color: #000000; font-size: 30px; line-height: 30px; font-weight: 700; margin: 0px; padding: 0px; } .Privacy { font-size: 12px; line-height: 14px; color: #999999; padding-top: 20px; } .Privacy a { text-decoration: underline; color: #999999; } #SubscribeInput { color: #999999; text-align: center; font-size: 16px; height: 48px; width: 580px; border: 1px solid #CCCCCC; margin-top: 15px; } /* SUBSCRIBE OVERLAY /* ========================== */ #Subscribe-Overlay-Form { display: inline-block; float: left; width: 640px; margin-top: 30px; margin-left: 30px; font-size: 14px; line-height: 22px; text-align: center; } #Subscribe-Overlay-Form h1 { color: #000000; font-size: 30px; line-height: 30px; font-weight: 700; margin: 0px; padding: 0px; } #Subscriber-Overlay-Container { position: fixed; top: 0%; left: 0%; width: 100%; height: 100%; z-index: 39002; display: none; } #Subscriber-Overlay-BG { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 39001; background-color: #000000; -moz-opacity: 0.85; opacity:.85; filter: alpha(opacity=85); } #Subscriber-Overlay { height: 100%; width: 700px; position: relative; z-index: 39003; background-position: right bottom; background-repeat: no-repeat; margin: 0px auto; } #Subscriber-Overlay-Body { position: absolute; min-height: 500px; height: 500px; width: 700px; top: 0px; left: 0px; z-index: 39004; background-color: #FFFFFF; display: block; } /* PAGE NAVIGATION /* ========================== */ .Page-Nav-Prev { font-size: 14px; line-height: 14px; color: #999999; } .Page-Nav-Next { font-size: 14px; line-height: 14px; color: #999999; text-align: right; } .Page-Nav-Count { font-size: 14px; line-height: 14px; color: #999999; text-align: center; } .Page-Nav-Prev a, .Page-Nav-Next a, .Page-Nav-Count a { color: #999999; text-decoration: none; } .Page-Nav-Prev a:hover, .Page-Nav-Next a:hover, .Page-Nav-Count a:hover { color: #999999; text-decoration: underline; } /* REPEAT REGIONS ========================== */ #Index { display: inline-block; float: left; width: 100%; height: auto; } .Index-Container { display: inline-block; float: left; width: 640px; height: auto; padding-bottom: 7px; margin-bottom: 7px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #ececec; font-size: 12px; line-height: 15px; color: #454545; } .Index-Container-Photo { display: inline-block; float: left; width: 230px; min-height: 129px; margin-right: 15px; } .Index-Container-Text { display: inline-block; float: left; width: 395px; min-height: 129px; font-size: 12px; line-height: 14px; color: #454545; } .Index-Container-Date { font-size: 12px; line-height: 14px; margin-top: 10px; } .Index-Container b, .Index-Container-Text b { font-size: 16px; line-height: 20px; color: #000000; } .Index-Container a, .Index-Container-Text a { color: #000000; text-decoration: none; } .Index-Container a:hover, .Index-Container-Text a:hover { color: #000000; text-decoration: underline; } /* ===================================== */ .Index-Box { display: inline-block; float: left; width: 180px; min-height: 200px; margin-bottom: 20px; margin-right: 19px; position: relative; } .Index-Box a { color: #999999; text-decoration: none; } .Index-Photo { display: inline-block; float: left; width: 180px; height: 101px; margin-bottom: 10px; background-color: #ececec; } .Index-Text { display: inline-block; float: left; width: 180px; font-size: 11px; color: #999999; font-family: Arial, Helvetica, sans-serif; } .Index-Text b { font-size: 13px; color: #000000; } .Duration { font-size: 11px; line-height: 11px; color: #ffffff; background-color: #000000; padding: 3px; width: 30px; text-align: center; position: absolute; right: 0px; top: 0px; } .Index-Preview { width: 100%; height: auto; font-size: 14px; line-height: 16px; margin-bottom: 50px; padding-bottom: 15px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #ececec; } .Index-Preview h1 { color: #000000; font-size: 24px; line-height: 26px; font-weight: 700; } .Index-Preview a { color: #000000; text-decoration: none; } .Index-Preview a:hover { color: #3366cc; text-decoration: underline; } .Index-Social { display: block; width: auto; } .Index-Social-Left { display: inline-block; float: left; width: 200px; min-height: 22px; font-size: 14px; line-height: 22px; color: #999999; margin-right: 20px; } .Index-Social-Right { display: inline-block; float: left; width: 420px; min-height: 22px; } .Index-Social-Right div { display: inline-block; float: right; width: auto; margin-left: 2px; font-size: 14px; line-height: 22px; color: #000000; } .Index-Icons { cursor: pointer; } .Author { font-size: 12px; line-height: 12px; color: #999999; margin-top: 0px; } /* ===================================== */ #Revisions { display: inline-block; float: left; width: 980px; margin-right: 0px; margin-left: 50px; height: auto; padding-bottom: 100px; } #Revisions h2 { font-size: 18px; line-height: 20px; padding-top: 0px; margin-top: 0px; } .Revision-Header { display: inline-block; float: left; width: 980px; margin-bottom: 10px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCCCCC; } .Revision-Row { display: inline-block; float: left; width: 980px; height: auto; margin-bottom: 10px; padding-bottom: 10px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #CCCCCC; } .Revision-C1, .Revision-C2, .Revision-C5 { display: inline-block; float: left; width: 70px; min-height: 20px; margin-right: 10px; font-size: 12px; line-height: 14px; text-align: center; } .Revision-C3 { display: inline-block; float: left; width: 200px; min-height: 20px; margin-right: 10px; font-size: 12px; line-height: 14px; } .Revision-C4 { display: inline-block; float: left; width: 450px; min-height: 20px; margin-right: 10px; font-size: 12px; line-height: 14px; } .Revision-C6 { display: inline-block; float: left; width: 70px; min-height: 20px; margin-right: 0px; font-size: 12px; line-height: 14px; } .Revision-C6 a { color: #454545; text-decoration: underline; } /* ===================================== */ .New-Posts { display: block; float: left; width: 300px; } .New-Posts-Label { display: inline-block; float: left; width: 300px; margin-bottom: 10px; font-size: 16px; line-height: 18px; color: #000000; } .New-Posts-Label h2 { font-size: 18px; line-height: 24px; } .New-Posts-Row { display: inline-block; float: left; width: 300px; min-height: 75px; padding-bottom: 5px; margin-bottom: 5px; font-size: 13px; line-height: 15px; color: #454545; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #ECECEC; } .New-Posts-Pic { display: inline-block; float: left; width: 75px; min-height: 75px; margin-right: 10px; } .New-Posts-Title { display: inline-block; float: left; width: 215px; min-height: 75px; font-size: 13px; line-height: 15px; color: #454545; } .New-Posts-Row a, #New-Posts-Title a { color: #454545; text-decoration: none; } .New-Posts-Row a:hover, #New-Posts-Title a:hover { color: #454545; text-decoration: underline; } .New-Posts-Link { display: inline-block; float: left; width: 300px; margin-top: 5px; font-size: 13px; line-height: 15px; } .New-Posts-Link a { color: #000000; text-decoration: none; } .New-Posts-Link a:hover { color: #000000; text-decoration: underline; } .New-Posts-Date { font-size: 11px; line-height: 11px; color: #999999; } .New-Posts-Bottom { display: block; float: left; width: 640px; font-size: 14px; line-height: 16px; } .New-Posts-Bottom a { color: #000000; text-decoration: none; } .New-Posts-Bottom a:hover { color: #000000; text-decoration: underline; } .New-Posts-Bottom h2 { font-size: 16px; line-height: 18px; color: #000000; } /* ===================================== */ #Related { display: block; float: left; width: 640px; } .Related-Posts-Label { display: inline-block; float: left; width: 640px; margin-bottom: 10px; font-size: 16px; line-height: 18px; color: #000000; } .Related-Posts-Label h2 { font-size: 18px; line-height: 24px; } .Related-Posts-Row { display: inline-block; float: left; width: 300px; min-height: 75px; padding-bottom: 5px; margin-right: 20px; margin-bottom: 5px; font-size: 13px; line-height: 15px; color: #454545; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #ECECEC; } .Related-Posts-Pic { display: inline-block; float: left; width: 75px; min-height: 75px; margin-right: 10px; } .Related-Posts-Title { display: inline-block; float: left; width: 215px; min-height: 75px; font-size: 14px; line-height: 16px; color: #454545; } .Related-Posts-Row a, #Related-Posts-Title a { color: #454545; text-decoration: none; } .Related-Posts-Row a:hover, #Related-Posts-Title a:hover { color: #454545; text-decoration: underline; } .Related-Posts-Link { display: inline-block; float: left; width: 300px; margin-top: 5px; font-size: 14px; line-height: 16px; } .Related-Posts-Link a { color: #000000; text-decoration: none; } .Related-Posts-Link a:hover { color: #000000; text-decoration: underline; } .Related-Posts-Date { font-size: 11px; line-height: 11px; color: #999999; } /* PLANT GUIDE ============================ */ .PG-Icons { text-align: center; font-weight: bold; color: #343434; font-size: 13px; } .PG-Space {height: 12px;} .PG-Section { font-size:16px; background-color:#a4c546; color:#343434; text-align:center; padding-top: 10px; padding-bottom: 10px; font-weight: bold; } .PG-Row-B{ background-color:#e7ffa0; text-align:center; padding-top: 7px; padding-bottom: 7px; } .PG-Row-A{ background-color:#dffb8d; text-align:center; padding-top: 7px; padding-bottom: 7px; } /* ===================================== */