Custom Mail Chimp Form Code

Tweak your MailChimp form code by adding the styles below to your themes stylesheet and then editing them to your liking.

/* Presentation Tweaks
------------------------------------------------------------ */

#mc_display_rewards {
         display: none;
}

#optin { 
        width: 340px;
        float: right;
        margin: -100px 30px 0 0; 
        overflow: hidden; 
        text-align: center; 
	font-size: 13px;
        line-height: 14px;

}

#optin h2 { 
        margin: 0;
        display: inline;
	color: #b63838;
        font-weight: bold;
	font-size: 14px;
}

#optin p { 

        margin: 6px 0;
        font-family: verdana, georgia;
	font-size: 16px;
        line-height: 18px;
        font-weight: bold;
}

#optin input {
		background: #fff url(images/input.png) repeat-x bottom;
		border: 1px solid #ccc;
		float: left;
		font-size: 10px;
		margin: 0 10px 6px 0;
		padding: 4px 6px;
		width: 110px;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		box-shadow: 0 2px 2px #ddd;
		-moz-box-shadow: 0 2px 2px #ddd;
		-webkit-box-shadow: 0 2px 2px #ddd
	}
		#optin input.name { }
		#optin input.email {  }
		#optin input[type="submit"] {
			background: #8B9EB6;
			border: 1px solid #137725;
			color: #fff;
			cursor: pointer;
			float: right;
			font-size: 10px;
			font-weight: bold;
                        margin: -27px 0 0 0; 
			padding: 3px 5px;
			text-shadow: -1px -1px #1c5d28;
			text-transform: uppercase;
			width: auto;
		}
			#optin input[type="submit"]:hover { color: #c6ffd1; }

		#optin span { background: url(images/lock.png) no-repeat center left; float: left; margin-left: 15px; padding-left: 20px; }