/*-------------------------------------------------------------------------------- Adding Positivity Master Stylesheet Author: Matt Donovan Contact: mattddonovan[at]gmail[dot]com URL: http://dawnrecorder.org ---------------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------- Global Styles ---------------------------------------------------------------------------------*/ body { background-color: #BBBEC0; font-family: Verdana, Arial, Helvetica sans-serif; font-size: 10.5pt;} .floatRight { float: right;} .floatLeft { float: left;} span.arrowButton { background-image: url(../img/arrow_button.gif); cursor: pointer; display: block; height: 20px; width: 20px;} span.arrowButton:hover { background-image: url(../img/arrow_rollover.gif); cursor: pointer; display: block; height: 20px; width: 20px;} span.plusButton { background-image: url(../img/plus_button.gif); cursor: pointer; display: block; height: 20px; width: 20px;} span.plusButton:hover { background-image: url(../img/plus_rollover.gif); cursor: pointer; display: block; height: 20px; width: 20px;} a.moreQuestions{ background-image:url(../img/morequestions_link.gif); background-repeat:no-repeat; display:block; height:20px; position:relative; left:190px; top:15px; width:20px;} a.moreQuestions:hover{ background-image:url(../img/morequestions_link.gif); background-repeat:no-repeat; display:block; height:20px; position:relative; left:190px; top:15px; width:130px; z-index:1} #imagePreload { display: none; visibility: hidden;} /*-------------------------------------------------------------------------------- PageWrapper Styles ---------------------------------------------------------------------------------*/ #PageWrapper { border-collapse: collapse; height: 600px; left: 50px; position: relative; top: 0px; width: 920px;} /*-------------------------------------------------------------------------------- ColumnWrapper Styles ---------------------------------------------------------------------------------*/ #ColumnWrapper { float: left; height: 100%; width: auto;} /*-------------------------------------------------------------------------------- LeftColumn Styles ---------------------------------------------------------------------------------*/ #LeftColumn { float: left; height: 100%; width: 108px;} #LeftColumn .logo { background-image: url(../img/ap_logo_lrg.gif); clear: both; height: 96px; width: 96px;} #LeftColumn .navWrapper { clear: both; float: left; font-family: Verdana; font-size: 7pt; font-weight: bold; letter-spacing: .05cm; line-height: .34cm; margin-top: 20px; text-transform: uppercase; width: 100px;} #LeftColumn .navWrapper ul { list-style: none; margin: 0px; padding: 0px;} #LeftColumn .navWrapper ul li { color: black; margin: 0px; margin-bottom: 20px; padding-bottom: 2px; padding-left: 5px; padding-top: 2px;} #LeftColumn .navWrapper ul li:hover { background-color: #EBEBEB; color: black;} #LeftColumn .navWrapper ul li:hover a { background-color: #EBEBEB; color: black;} #LeftColumn .navWrapper ul li.selected { background-color: #efeff0; color: black;} #LeftColumn .navWrapper ul li.selected a { color: black;} #LeftColumn .navWrapper a { color: white; cursor: pointer; display: block; text-decoration:none;} #LeftColumn .navWrapper a:hover { cursor: pointer; display: block; text-decoration:none;} #LeftColumn .navWrapper a.selected { cursor: pointer; display: block; text-decoration:none;} #LeftColumn .navWrapper a.contributePositivity { background-image: url(../img/contributepositivity_link.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.contributePositivitySelected { background-image: url(../img/contributepositivity_hover.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.contributePositivity:hover { background-image: url(../img/contributepositivity_hover.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.viewAllPositivity { background-image: url(../img/viewallpositivity_link.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.viewAllPositivity:hover { background-image: url(../img/viewallpositivity_hover.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.contactUs { background-image: url(../img/contactus_link.jpg); height: 30px; width: 100px;} #LeftColumn .navWrapper a.contactUs:hover { background-image: url(../img/contactus_hover.jpg); height: 30px; width: 100px;} /*-------------------------------------------------------------------------------- MiddleColumn Styles ---------------------------------------------------------------------------------*/ #MiddleColumn { float: left; height: 100%; width: 272px;} #MiddleColumn .textWrapper { font-size: 9pt; margin-left: 45px; margin-top: 80px;} #MiddleColumn .textWrapper p { line-height: 0.54cm; margin: 0px; padding: 0px;} #MiddleColumn .textWrapper a {color:black; font-weight:bold; text-decoration:none;} #MiddleColumn .textWrapper a:hover {color:black; font-weight:bold; text-decoration:none;} #MiddleColumn .textWrapper a:visited {color:black; font-weight:bold; text-decoration:none;} #MiddleColumn .textWrapper img { clear: both; margin-bottom: 8px;} #MiddleColumn a.downloadOSX { background-image: url(../img/downloadOSX_link.jpg); display: block; height: 30px; margin-bottom: 10px; margin-top: 12px; width: 220px;} #MiddleColumn a.downloadOSX:hover { background-image: url(../img/downloadOSX_hover.jpg); display: block; height: 30px; margin-bottom: 10px; margin-top: 12px; width: 220px;} #MiddleColumn a.downloadVista { background-image: url(../img/downloadVista_link.jpg); display: block; height: 30px; margin-bottom: 18px; margin-top: 7px; width: 220px;} #MiddleColumn a.downloadVista:hover { background-image: url(../img/downloadVista_hover.jpg); display: block; height: 30px; margin-bottom: 18px; margin-top: 7px; width: 220px;} /*-------------------------------------------------------------------------------- RightColumn Styles ---------------------------------------------------------------------------------*/ #RightColumn { float: left; height: 100%; width: 540px;} /*-------------------------------------------------------------------------------- WidgetContent Styles ---------------------------------------------------------------------------------*/ #WidgetContainer { background-color: #DDC37E; height: 485px; margin-left: 60px; margin-top: 80px; width: 490px;} #WidgetContainer .widgetLeftColumn { float: left; width: 105px;} #WidgetContainer .widgetControls { float: left; font-family: Verdana; font-size: 7pt; letter-spacing: .03cm; line-height: .34cm; margin-top: 300px; text-transform: uppercase;} #WidgetContainer .widgetControls ul { list-style: none; margin: 0px; padding: 0px;} #WidgetContainer .widgetControls ul li { margin: 0px; padding-bottom: 8px; padding-left: 15px; padding-top: 8px;} #WidgetContainer .widgetControls a { cursor: pointer; display: block;} #WidgetContainer .widgetControls a:hover { color: #EBEBEB; cursor: pointer; display: block;} #WidgetContainer .widgetControls a.selected { color: white; cursor: pointer; display: block; font-weight:bold;} #WidgetContainer a.submitTextButton { background-image: url(../img/submit_link.gif); cursor: pointer; display: block; height: 20px; width: 75px;} #WidgetContainer a.submitTextButton:hover { background-image: url(../img/submit_hover.gif); cursor: pointer; display: block; height: 20px; width: 75px;} #WidgetContainer span.submit { position: relative; top: 50%;} #WidgetContent { float: left; height: 100%; width: 365px;} #WidgetContent h5 { font-family: Verdana, Arial, sans-serif; font-size: 7pt; font-weight: normal; letter-spacing: .03cm; line-height: 1em; margin: 0; padding: 0; text-transform: uppercase;} #WidgetContent p.question { bottom: 0px; font-family: Verdana, Arial, sans-serif; font-size: 7pt; font-weight: normal; letter-spacing: .03cm; line-height: .34cm; margin: 0; padding: 0; position: absolute; text-transform: uppercase;} #WidgetContent .topBox { clear: both; height: 79px;} #WidgetContent .greyBox { background-color: #C0BBB1; float: left; height: 335px; margin-left: 15px; margin-top: 30px; width: 335px;} #WidgetContent .submissionInput { background-color: #eae8e1; border-color: #667872; border-style: solid; border-width: 1px; font-family: Verdana, Arial, sans-serif; font-size: .9em; height: 203px; left: -55px; padding: 5px; position: relative; top: 2px; width: 205px;} #WidgetContent .questionDisplay { float: left; height: 38px; left: -50px; position: relative; top: 15px; width: 180px;} #WidgetContent .customDrop { background-color: #E3E4E5; background-image: url(../img/arrow_down_link.gif); background-position: top right; background-repeat: no-repeat; border-color: #AAA9A9; border-style: solid; border-width: 1px; cursor: pointer; font-family: Verdana, Arial, sans-serif; font-size: 7pt; letter-spacing: .03cm; margin-left: 75px; margin-top: 10px; padding-bottom: 4px; padding-left: 5px; padding-top: 4px; text-align: left; text-transform: uppercase; vertical-align: middle; width: 210px;} #WidgetContent .customDrop:hover { background-image: url(../img/arrow_down_hover.gif); background-position: top right; background-repeat: no-repeat; cursor: pointer; padding-bottom: 4px; padding-top: 4px;} #WidgetContent .customDropOptions { background-color: #E3E4E5; border-color: #AAA9A9; border-style: solid; border-top: 0px; border-width: 1px; font-family: Verdana, Arial, sans-serif; font-size: 7pt; height: 100px; letter-spacing: .03cm; overflow: auto; text-align: left; text-transform: uppercase; z-index: 10;} #WidgetContent .customDropOptions ul { font-family: Verdana; list-style: none; margin: 0px; padding: 0px;} #WidgetContent .customDropOptions li { font-family: Verdana; height: 10px; margin: 0px; padding: 5px; vertical-align: middle;} #WidgetContent .customDropOptions li:hover { background-color: #FAF9F5; cursor: pointer; font-family: Verdana; height: 10px; margin: 0px; padding: 5px; vertical-align: middle;} #WidgetContent .customDropOptions ul { font-family: Verdana, Arial, sans-serif; list-style-image: none; margin: 0px; padding: 0px;} #WidgetContent .customDropOptions li { font-family: Verdana, Arial, sans-serif; height: 10px; margin: 0px; padding: 5px; vertical-align: middle;} #WidgetContent .customDropOptions li:hover { background-color: #FAF9F5; cursor: pointer; font-family: Verdana, Arial, sans-serif; height: 10px; margin: 0px; padding: 5px; vertical-align: middle;} #WidgetContent .customDropSmall { background-color: #E3E4E5; background-image: url(../img/arrow_down_link.gif); background-position: top right; background-repeat: no-repeat; border-color: #AAA9A9; border-style: solid; border-width: 1px; cursor: pointer; font-family: Verdana, Arial, sans-serif; font-size: 7pt; left: -55px; letter-spacing: .03cm; margin-bottom: 17px; margin-top: 20px; padding-bottom: 4px; padding-left: 5px; padding-top: 4px; position: relative; text-align: middle; text-transform: uppercase; vertical-align: middle; width: 210px;} #categoryDisplay { float: left; height: 115px; left: -73px; position: relative; top: -14px; width: 115px; z-index: 100;} #categoryDisplay .catName { font-family: Verdana, Arial, sans-serif; font-size: 7pt; left: 17px; letter-spacing: .03cm; position: absolute; text-transform: uppercase; top: 43px;} #categoryDisplay .sensing { background-image: url(../img/sensingtheenvironment.jpg);} #categoryDisplay .experience { background-image: url(../img/personalexperience.jpg);} #categoryDisplay .contribution { background-image: url(../img/personalcontribution.jpg);} /*-------------------------------------------------------------------------------- DatePicker Styles ---------------------------------------------------------------------------------*/ #DatePicker { background-color: #E3E4E5; border-color: #AAA9A9; border-style: solid; border-width: 1px; height: 20px; margin-left: 75px; padding-left:5px; width: 210px;} #DatePicker .dateDisplay { float: left; font-size: .8em; height: 12px; padding-bottom: 4px; padding-top: 4px; text-align: left; text-transform: uppercase; width: 174px;} #DatePicker .leftArrowButton { background-image: url(../img/arrow_left_button.gif); cursor: pointer; display: block; float: left; height: 20px; width: 20px;} #DatePicker .leftArrowButton:hover { background-image: url(../img/arrow_left_rollover.gif); cursor: pointer; display: block; float: left; height: 20px; width: 20px;} #DatePicker .rightArrowButton { background-image: url(../img/arrow_button.gif); cursor: pointer; display: block; float: left; height: 20px; width: 20px;} #DatePicker .rightArrowButton:hover { background-image: url(../img/arrow_rollover.gif); cursor: pointer; display: block; float: left; height: 20px; width: 20px;} #DateStatic { float: right; height: 20px; margin-right:-20px; width: 240px;} #DateStatic .dateDisplay { background-color: #E3E4E5; float: right; font-size: .8em; height: 12px; padding-bottom: 4px; padding-top: 4px; text-transform: uppercase; width: 130px;} #LogoContainer { left: 0px; position: relative; top: 0px;} #toggleWidget { left: 63px; position: relative; top: -8px;} /*-------------------------------------------------------------------------------- FeedbackPopup Styles ---------------------------------------------------------------------------------*/ #FeedbackPopup { background-color: #7f8081; color: white; height: 80px; padding: 10px; width: 200px;} #FeedbackPopup .dialogText { color: white; font-family: Verdana; font-size: 7pt; font-weight: lighter; letter-spacing: .05cm; line-height: .34cm; text-transform: uppercase; width: 100%;} #FeedbackPopup a.confirmDialog { background-image: url(../img/confirmdialog_link.jpg); cursor: pointer; display: block; height: 20px; width: 50px;} #FeedbackPopup a.confirmDialog:hover { background-image: url(../img/confirmdialog_hover.jpg); cursor: pointer; display: block; height: 20px; width: 50px;} #fbContent { color: white; font-family: Verdana; font-size: 7pt; font-weight: lighter; letter-spacing: .05cm; line-height: .34cm; margin: 0px; text-transform: uppercase;} .dialogHidden { display: none; left: 690px; position: absolute; top: 0px; visiblity: hidden;} .dialogVisible { left: 690px; position: absolute; top: 300px;} /*-------------------------------------------------------------------------------- sIFR-Related Styles ---------------------------------------------------------------------------------*/ .sIFR-flash { margin: 0; padding: 0; visibility: visible !important;} .sIFR-replaced, .sIFR-ignore { visibility: visible !important;} .sIFR-alternate { display: block; height: 0; left: 0; overflow: hidden; position: absolute; top: 0; width: 0;} .sIFR-replaced div.sIFR-fixfocus { float: none; letter-spacing: 0px; margin: 0pt; overflow: auto; padding: 0pt;} h1 { font-size: 10pt; margin: 0; margin-bottom:2px; padding: 0;}