@charset "UTF-8";


#postcard-header {height:90px; width:552px; float:left; margin:0 0 10px 50px;}
#postcard-header img {float:left; margin:0 15px 0 0;}
#postcard-header h2 { color:#EB008B; font-size:210%; font-weight:lighter; margin:10px 0 0 0; padding:0; float:left; display:block;}
#postcard-header h3 { color:#50B2CB; font-size:170%; font-weight:lighter; margin:5px 0 0 0; padding:0; float:left; display:block;}
#panelwidget { margin:0 0 0 55px; float:left;}
/*/----IE hack---/*/
* html #widgetNav {margin:20px 0 60px 200px; float:left;}

#widgetNav {margin:20px 0 60px 290px; float:left;}
#widgetNav a {color:#333; padding:0 30px 0 30px;}
#widgetNav img {}

#postcard-instructions { float:left; width:748px; height:100%; margin:0 0 100px 50px;}

#postcard-instructions ul.postcard-info { list-style:none; list-style-position:inside; margin:0 0 30px 0;}
#postcard-instructions ul.postcard-info h3{ color:#EB008B; margin:0 0 10px 0;}
#postcard-instructions ul.postcard-info li{ color:#333; font-size:130%; line-height:1.3em;}
#postcard-instructions ul.postcard-info p { font-size:70%; color:#999;}

#postcard-instructions ol.submit-instructions li { color:#666; list-style-type:decimal; list-style-position:inside; margin:0 0 0 15px; font-size:110%; line-height:1.3em;}


#postcard-submit-form { margin:20px 0 0 0;}
#postcard-submit-form label{float:left;width:120px;font-weight: normal; text-align:right; margin:0 10px 0 0;}
#postcard-submit-form input, textarea{width: 180px;margin-bottom: 5px;}
#postcard-submit-form textarea{width: 250px;height: 150px;}
#postcard-submit-form .boxes{width: 1em;}
#postcard-submit-form #submitbutton{margin-left: 120px;margin-top: 5px;width: 90px;}
#postcard-submit-form br{clear: left;}



/*//-----porno quiz ----//*/

/*/---IE hack---/*/
* html #quizContainer { width:920px; height:100%; float:left; padding:60px 0 40px 30px; margin:0;}

#quizContainer { width:920px; height:100%; float:left; padding:60px 0 40px 50px; margin:0;}

#panelwidgetQuiz { margin:0 0 100px 0px; float:left;}
#quizInstruction {float:left; width:184px; height:275px;} 
#porno-header {float:left; width:853px; height:180px; margin:0 0 20px 0;}
#porno-header img {float:left;}
#porno-header #porno-headline {float:left; width:610px; height:100%; padding:20px 0 0 10px;}
#porno-header #porno-headline h3{padding: 0 0 0 10px; color:#333; font-weight:normal; line-height:1.2em;}

.SlidingPanelsContentQuiz ul { list-style:none; list-style-type:none; list-style-position:outside; margin: 70px 0 0 50px;}
.SlidingPanelsContentQuiz ul li.question { font-family: Helvetica, arial, sans-serif; font-size:20px;}
.SlidingPanelsContentQuiz ul li.answer {font-size:14px; line-height:1.6em; padding:10px 0 0 20px;}
.SlidingPanelsContentQuiz ul li.next {font-size:20px;text-align:right; padding:50px 20px 0 0;}
.SlidingPanelsContentQuiz ul li.next a{ color:#852142; text-decoration:none;}
.SlidingPanelsContentQuiz ul li.next a:hover { color:#333; text-decoration:none;}
.SlidingPanelsContentQuiz ul li.submitQuiz {font-size:20px;padding:20px 0 0 20px;}


/*//-----meter results ----//*/
/*/---IE hack---/*/
* html #pornometerResults { float:left; width:895px; height:100%; margin:70px 0 0 0px; position:relative;}
* html #pornometer-polls { float:left; width:880px; height:422px; margin:0 0 30px 0px;}
* html #meterResult-3 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 310px; float:left;}

* html #meterResult-2 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 158px; float:left;}

* html #meterResult-1 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 10px; float:left;}


#pornometerResults { float:left; width:895px; height:100%; margin:70px 0 0 50px;}
#pornoresults-headline { margin:0 0 80px 0; padding:0; width:680px; height:44px;}
#pornoresults-headline h3 { margin:0; padding:0; color:#cc3366; font-size:25px; font-weight:normal;}
#meterResult-3 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 595px; float:left;}

#meterResult-2 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 298px; float:left;}

#meterResult-1 { width:245px; height:115px; background: url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_resultsbox.gif) no-repeat; padding:13px 0 0 20px; margin: 25px 0 0 0px; float:left;}

#meterResult-3 span.readout h4, #meterResult-2 span.readout h4, #meterResult-1 span.readout h4 { font-size:17px; color:#333; padding:0; margin:0 0 5px 0;}
#meterResult-3 span.readout p, #meterResult-2 span.readout p, #meterResult-1 span.readout p { font-size:13px; color:#cc3366; padding:0; margin:0;}

#pornometer-polls { float:left; width:880px; height:422px; margin:0 0 30px 30px;}


/* SprySlidingPanels.css - version 0.1 - Spry Pre-Release 1.6 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main SlidingPanels container. This selector
 * defines the width and height of the view port for the widget. Note that
 * this selector does not set the overflow property since that is done programatically
 * by the widget. Setting the overflow property programatically ensures that
 * the contens of the widget will be fully visible should JavaScript be disabled
 * in the browser.
 *
 * If you want to constrain the width of the SlidingPanels widget, set a width on
 * the SlidingPanels container. By default, our sliding panels widget expands
 * horizontally to fill up available space.
 *
 * The SlidingPanels container is positioned relative so that content inside it
 * can be positioned relative to its upper left corner.
 *
 * Avoid placing any CSS border or padding properties on the SlidingPanels container
 * as they can affect the proper positioning and sliding animations of the contents
 * inside the container.
 *
 * The name of the class ("SlidingPanels") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * SlidingPanels container.
 */
.SlidingPanels {
	position: relative;
	width: 748px;
	height: 374px;
	padding: 0px;
}

.SlidingPanelsQuiz {
	position: relative;
	width: 668px;
	height: 275px;
	padding: 0px;
	background:url(http://www.wannasnuggle.com/index/wp-content/themes/default/images/pornometer_box.gif) no-repeat;
}



/* This is the selector for the container that holds all of the content panels
 * for the widget. The SlidingPanelsContentGroup container is what gets programtically
 * positioned to create the slide animation. It is also what governs the layout of
 * the panels.
 *
 * By default, the width of the container is the same as its parent, the SlidingPanels
 * container.
 *
 * You can make the panels within the SlidingPanelsContentGroup container layout
 * horizontally by giving the SlidingPanelsContentGroup container a width that is as wide
 * or larget than the sum of the widths of all of the content panels, and then floating
 * the content panels inside the SlidingPanelsContentGroup container so they all appear
 * on the same line. You may also need to float the SlidingPanels and SlidingPanelsContentGroup
 * containers to insure that none of the content panels "leak" outside of the widget.
 *
 * Avoid placing any CSS border, margin, or padding properties on the SlidingPanels
 * container as they can affect the proper positioning and sliding animations of the
 * the container within the widget.
 *
 * The name of the class ("SlidingPanelsContentGroup") used in this selector is not
 * necessary to make the widget function. You can use any class name you want to style the
 * SlidingPanelsContentGroup container.
 */
.SlidingPanelsContentGroup {
	position: relative;
	width:1000em;
	margin: 0px;
	padding: 0px;
}

.SlidingPanelsContentGroupQuiz {
	position: relative;
	width:1000em;
	margin: 0px;
	padding: 0px;
}


/* This is the selector for the container that holds content for a given panel. In our
 * default style implementation, the dimensions of each content panel exactly match the
 * dimensions of the view port (SlidingPanels) container. This ensures that only one
 * panel ever shows within the view port.
 *
 * Avoid placing any CSS border, margin, or padding properties on the SlidingPanels
 * container as they can affect the proper positioning and sliding animations of the
 * the panel within the widget. You can place border, margins and padding on any content
 * *inside* the content panel.
 *
 * The name of the class ("SlidingPanelsContent") used in this selector is not
 * necessary to make the widget function. You can use any class name you want to style the
 * SlidingPanelsContent container.
 */
.SlidingPanelsContent {
	width: 748px;
	height: 374px;
	float:left;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
}

.SlidingPanelsContentQuiz {
	width: 668px;
	height: 275px;
	float:left;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	border: none;
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime we are animating between panels. This rule makes sure that *all* content inside
 * the widget is overflow:none to avoid a rendering glitch that occurs in FireFox 1.5 whenever
 * there is an element inside the widget that displays a scrollbar.
 *
 * The class is automatically removed once the animation has stopped so that the overflow
 * properties of the content inside the widget should be restored.
 */
.SlidingPanelsAnimating * {
	overflow: hidden !important;
}

.SlidingPanelsAnimatingQuiz * {
	overflow: hidden !important;
}

/* The class used in this selector is programatically added to the SlindingPanelsContent
 * container that is currently visible in the view port. The class is automatically removed
 * when the widget switches to a different panel.
 */
.SlidingPanelsCurrentPanel {
}

.SlidingPanelsCurrentPanelQuiz {
}

/* The class used in this selector is programatically added to the SlidingPanels container
 * anytime the SlidingPanels container is given focus. The class is automatically removed
 * once the SlidingPanels container loses focus.
 */
.SlidingPanelsFocused {
}
#p1 {
	background-color: #fff;
}
#p2 {
	background-color: #fff;
}
#p3 {
	background-color: #fff;
}
#p4 {
	background-color: #fff;
}
#p5 {
	background-color: #fff;
}
#p6 {
	background-color: #fff;
}


.SlidingPanelsFocusedQuiz { 
}


.SlidingPanelsQuiz #p1, .SlidingPanelsQuiz #p2, .SlidingPanelsQuiz #p3, .SlidingPanelsQuiz #p4, .SlidingPanelsQuiz #p5, .SlidingPanelsQuiz #p6, .SlidingPanelsQuiz #p7, .SlidingPanelsQuiz #p8, .SlidingPanelsQuiz #p9, .SlidingPanelsQuiz #p10  { background-color: transparent;}

.SlidingPanelsContent h1 {color:#00FF33;}
#floater{ float:left; color:#0033FF;background-color:#00CCFF; margin:0 0 0 5px;}
#floater2{ float:right; color:#FF0000; background-color:#00CCFF;}

/* CLEARFIX (http://www.positioniseverything.net/easyclearing.html)
--------------------------------------------------------------------*/
.clear {height: 0px; clear: both; font-size: 1px;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-table;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */