/*
 *  ROCKIN' UNIVERSAL
 */

	h1, h2, h3 { text-transform:none; }
	.left { float:left; }
	.right { float:right; }
	.clear { clear:both; }
	#rockin { width:100%; }
        #rockin, #rockin p, #rockin span {
            font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
            font-weight: normal;
            font-style: normal;
            font-size: 14px;
            line-height: 22px;
            color: #333333;
        }
	.rockinHw {
		width:46%;
		margin:0px 2%;
	}
	.rockinBtn {
		display:block;
		width:100%;
		margin-top:14px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}
        .rockinBtn, .rockinBtn:hover {
            font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
            font-weight: 800;
            font-style: normal;
            font-size: 20px;
            line-height: 50px;
            text-align: center;
            text-decoration: none;
            color: #ffffff;
        }
	.rockinBtn:hover {
		background-color:#1a305c;
	}
	.hwButton {
		display:inline-block;
		width:49%;
	}
	.hwButton:first-child { margin-right:2%; }


/*
 *  ROCKIN' MAIN IMAGE
 */

	#rockinMain { width:100%; height:auto; margin-bottom:30px; }



/*
 *  ROCKIN' LEFT COLUMN
 */

#rockin h1 {
    font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
    font-weight: 800;
    font-style: normal;
    font-size: 24px;
    line-height: 32px;
    color: #1f4e80;
}
.rockinField {
    width: 99%;
    height: 40px;
    margin-top: 10px;
    padding-left: 10px;
    border: 1px solid #c8c8c8;
    box-sizing: border-box;
    font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
    font-weight: normal;
    font-style: normal;
    font-size: 14px;
    color: #808080;
}
	.rockinCheckBox {
		display:block;
		margin-top:15px;
	}
	.rockinBtnGreen, .hwButton {
		background:#81bc4b;
		border:none;
	}
	#rockinLinks { margin-top:10px; }
	#rockinLinks a {
		font-size:13px;
		color:#931c2d;
		text-decoration:none;
	}
	#rockinLinks a:hover { text-decoration:underline; }



/*
 *  FORM VALIDATION
 */

	.rockinHw input[type=text].valid, .rockinHw input[type=text].zip.valid, .rockinHw select.valid { border:1px solid #81bc4b; }
	.rockinHw input[type=text].invalid, .rockinHw input[type=text].zip.invalid, .rockinHw select.invalid { border:1px solid #af2832; }
	.rockinHw input[type=text].valid { background:#ffffff url('/images/promo/rockinWinterGiftaway/valid.png') 98% 50% no-repeat; }
	.rockinHw input[type=text].invalid { background:#ffffff url('/images/promo/rockinWinterGiftaway/invalid.png') 98% 50% no-repeat; }
	.rockinHw input[type=text].zip.valid { background:#ffffff url('/images/promo/rockinWinterGiftaway/valid.png') 94% 50% no-repeat; }
	.rockinHw input[type=text].zip.invalid { background:#ffffff url('/images/promo/rockinWinterGiftaway/invalid.png') 94% 50% no-repeat; }



/*
 *  ROCKIN' RIGHT COLUMN
 */

#rockin h2 {
    width: 100%;
    height: 100px;
    padding-top: 25px;
    background-image: url('/images/promo/rockinWinterGiftaway/rockin_h2bg.jpg');
    background-repeat: no-repeat;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
    font-weight: 800;
    font-style: normal;
    font-size: 20px;
    text-align: center;
    color: #ffffff;
}
    #rockin h2 span {
        display: block;
        font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
        font-weight: 800;
        font-style: normal;
        font-size: 39px;
        line-height: 59px;
        color: #ffffff;
    }
 	#rockinWeeklyPrize {
 		margin-bottom:50px;
 		text-align:center;
 	}
 	#rockinWeeklyPrize p, #rockinWeeklyPrize span {
 		font-size:18px;
 		line-height:26px;
 	}
        #rockinWeeklyPrize span {
            font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
            font-weight: 800;
            font-style: normal;
            color: #b33039;
        }
 	#rockinWeeklyPrize img { width:100%; height:auto; }

 	/* REWARDS CONTAINER */

 	#rockinRewards {
 		width:100%;
 		padding:20px;
		border:1px solid #c8c8c8;
		background-color:#f5f5f5;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		box-sizing:border-box;
 	}
#rockin h3 {
    margin: 0px;
    font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
    font-weight: 800;
    font-style: normal;
    font-size: 24px;
    line-height: 32px;
    color: #f97910;
}
	#rockinBadges { text-align:center; }
	#rockinBadges img { margin-right:5px; }
	#rockinBadges img:last-child { margin-right:0px; }
	.rockinBtnOrange { background-color:#f97910; }

/*
 *  
 */

#rockin p.rockinAltHead {
    font-family: 'Open Sans', Arial, Helvetica, Sans-Serif;
    font-weight: 800;
    font-style: normal;
    font-size: 18px;
}

    #weeklyWinners {
	    width:90%;
	    margin:0 auto;
	}
	
	.winnerImage {
	    display: inline-block;
        float: left;
        max-width: 410px;
        padding: 10px 10px 10px 27px;
        width: 45%;
	}
	
	    .winnerImage img {
	        width:100%;
	    }

/*
 *  MEDIA QUERIES
 */
 
/* bigger than 768px */
@media only screen and (min-width:768px) {
	#rockinBadges img {
		width:17%;
		margin-right:2%;
	}
}

/* smaller than 768px */
@media only screen and (max-width:767px) {
	.rockinHw {
		width:99%;
		margin:0px 0px 50px 0px;
	}
}

/* between 480 & 767 */
@media only screen and (min-width:480px) and (max-width:767px) {
	#rockinWeeklyPrize img {
		width:440px;
		height:auto;
	}
    .winnerImage {
	    width:100%;
	    max-width:95%;
	}
}

/* bigger than 480px */
@media only screen and (min-width:480px) {
	#rockinBreak { display:none; }
}

/* smaller than 480px */
@media only screen and (max-width:479px) {
	#rockin h1 {
		font-size:20px;
		line-height:28px;
	}
 	#rockin h2 {
 		height:84px;
 		padding-top:16px;
 		font-size:16px;
 		line-height:26px;
 	}
 	#rockin h2 span {
 		font-size:30px;
 		line-height:40px;
 	}
	#rockin h3 {
		font-size:20px;
		line-height:28px;
	}
 	#rockinWeeklyPrize p, #rockinWeeklyPrize span {
 		font-size:16px;
 		line-height:24px;
 	}
	.hwButton {
		display:block;
		width:100%;
	}

    #weeklyWinners {
	    width:95%;
	    margin:0;
	}
	
	    .winnerImage {
	        width:100%;
	    }
}