/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px, Gutter: 20px, Unit: 44px */
@media only screen and (min-width: 768px) and (max-width: 1007px) {

}


/*  #Mobile (Portrait)
================================================== */

/* Note: Design for a width of 320px Gutter: 10px, Unit: 15px */
@media only screen and (max-width: 767px) {

	body {
		margin: 0;
		padding: 0;
	}
	div#cap-registration,
	div#main,
	div#notallowed {
		position: relative;
		width: 90%;
		left: 0;
		margin: 0 auto;
		padding: 30px 0;
	}
	div#cap-registration.with-cookies {
		padding: 30px 0 60px 0 ;
	}
		div#print {
			width: 100%;
			padding: 0;
			margin: 0;
		}
		div#cap-registration div#outerbanner,
		div#print div#outerbanner {
			width: 100%;
			height: auto;
			margin: 0;
			padding: 0;
			background: #fff;
			-moz-box-shadow: 0px 0px 5px 0px #c0c0c0;
			-webkit-box-shadow: 0px 0px 5px 0px #c0c0c0;
			-o-box-shadow: 0px 0px 5px 0px #c0c0c0;
			box-shadow: 0px 0px 5px 0px #c0c0c0;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=5);
		}
		div#cap-registration div#outerbanner img,
		div#print div#outerbanner img {
			width: 100%;
		}

		div#cap-registration div#msgregistration,
		div#cap-registration form,
		div#print h2,
		div#main div#print p.explanations,
		div#main div#print p#thanks {
			margin: 20px 0;
			padding: 0 20px;
		}
		div#cap-registration form p {
			height: auto;
			margin-bottom: 20px;
			padding: 0 0px;
		}
		div#cap-registration form label:not(.btn),
		div#cap-registration form p.radio label.main,
		div#cap-registration form p.checkbox label.main {
			width: 100%;
			padding: 2px 0;
			line-height: 18px;
			text-align: left;
		}
		div#cap-registration form input[type="text"],
		div#cap-registration form p.select select,
		div#cap-registration form select,
		div#cap-registration form select#day,
		div#cap-registration form select#month,
		div#cap-registration form select#year,
		div#cap-registration form select.day,
		div#cap-registration form select.month,
		div#cap-registration form select.year {
			width: 97%;
			height: 40px;
			margin: 0;
			padding: 0 1.5%;
			border: 1px solid #c2c2c2;
			background: #fff;
			-moz-box-shadow: inset 2px 2px 5px 0px #E5E5E5;
			-webkit-box-shadow: inset 2px 2px 5px 0px #E5E5E5;
			-o-box-shadow: inset 2px 2px 5px 0px #E5E5E5;
			box-shadow: inset 2px 2px 5px 0px #E5E5E5;
			filter:progid:DXImageTransform.Microsoft.Shadow(color=#E5E5E5, Direction=134, Strength=5);
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			border-radius: 5px;
		}
		div#cap-registration form p.select select,
		div#cap-registration form select {
			width: 100%;
		}
		div#cap-registration form select#day,
		div#cap-registration form select#month,
		div#cap-registration form select#year,
		div#cap-registration form select.day,
		div#cap-registration form select.month,
		div#cap-registration form select.year {
			width: 30%;
			margin-right: 2%;
		}
		div#cap-registration form input#submit,
		div#cap-registration form input#submitPrint,
		div#cap-registration form input#sendbyemail,
		div#cap-registration form p.optIn {
			margin-left: 0;
			outline: none;
		}
		div#cap-registration form p.submit {
			position: relative;
			height: 100px;
		}
		div#cap-registration form input#submitPrint {
			position: absolute;
			top: 50px;
			margin-top: 0;
			left: 50%;
			margin-left: -97px;
		}
		div#cap-registration form input#sendbyemail {
			position: absolute;
			top: 0px;
			margin-top: 0;
    		left: 50%;
			margin-left: -102px !important;
		}
		div#cap-registration form p.submitResponsive input#submitPrint + input#sendbyemail {
    		margin-left: 25%;
		}

		div#print ul.actionprint,
		div#main div#print div.rules {
			width: 98%;
			height: auto;
			margin: 0;
			padding: 2%;
		}

			div#print ul.actionprint li {
				width: 100%;
				height: auto;
				margin: 0 0 1em 0;
				padding: 0;
				text-align: center;
			}
				div#print ul.actionprint li img {
					width: 30%;
					max-width: 191px;
					margin: 0 auto;
					padding: 0;
					display: block;
				}
				div#print ul.actionprint li span,
				div#print ul.actionprint li p {
					width: auto;
					float: none;
					display: inline;
				}

		div#cap-registration form input#optIn, 
		div#cap-registration form input#optIn18Plus, 
		div#cap-registration form input#optIn1, 
		div#cap-registration form input#optIn2 {
			margin-left: 0;
		}
		div#cap-registration form p.optIn label,
		div#cap-registration form fieldset label,
		div#cap-registration form label[for="optIn"],
		div#cap-registration form label[for="optIn18Plus"],
		div#cap-registration form label[for="optIn1"],
		div#cap-registration form label[for="optIn2"],
		div.rules label {
			width: 90%;
		}

		a#printbtn {
			height: auto;
			display: inline-block;
			margin: 1em 0;
		}

		div#cap-registration p.radioOptin {
			padding-left: 0px;
		}
}

/* #Mobile (Landscape)
================================================== */

/* Note: Design for a width of 480px */
@media only screen and (min-width: 480px) and (max-width: 767px) {


		div#cap-registration div#msgregistration,
		div#cap-registration form {
			margin: 30px 0;
			padding: 0 23px;
		}
		div#cap-registration form p {
			height: auto;
			margin-bottom: 20px;
		}
		div#cap-registration form p.optIn {
			margin-bottom: 10px;
		}
		div#cap-registration form label:not(.btn),
		div#cap-registration form p.radio label.main,
		div#cap-registration form p.checkbox label.main {
			width: 23%;
			padding: 12px 2% 12px 0;
			line-height: 18px;
			text-align: right;
		}
		div#cap-registration form p.radioOptin {
			margin-left: 25%;
			text-align: left;
		}
		div#cap-registration p.radioOptin label.main {
			float: left;
			width: 100% !important;
			display: block;
			text-align: left;
		}

		/*div#cap-registration form p.radioOptin label:not(.main) {*/
			/*margin-left: 23%;*/
		/*}*/

		div#cap-registration form p.optIn label {
			text-align: left;
    		padding-top: 0;
		}

		div#cap-registration form p.radioOptin label,
		div#cap-registration form p.radio label,
		div#cap-registration form p.checkbox label {
			padding-top: 12px;
		}
		div#cap-registration form input[type="text"],
		div#cap-registration form p.select select,
		div#cap-registration form select {
			width: 50%;
		}
		div#cap-registration form select#day,
		div#cap-registration form select#month,
		div#cap-registration form select#year,
		div#cap-registration form select.day,
		div#cap-registration form select.month,
		div#cap-registration form select.year {
			width: 16%;
			margin-right: 2%;
		}
		div#cap-registration form input#submit,
		/*div#cap-registration form input#submitPrint,*/
		/*div#cap-registration form input#sendbyemail,*/
		div#cap-registration form p.optIn {
			margin-left: 25%;
		}

			div#print ul.actionprint li {
				width: 32%;
				margin-left: 1%;
			}
			div#print ul.actionprint li#printexplanation {
				margin-left: 0;
			}
				div#print ul.actionprint li img {
					width: 100%;
				}


}

@media only screen and (max-width: 767px) {
	
	div.action-choice {
		width: 100%;
   	 	margin: 2% 0;
	}
}

@media only screen and (max-width: 479px) {
	
		div#cap-registration form p.submitResponsive input#submitPrint + input#sendbyemail {
    		margin-left: 0;
		}
		div#cap-registration p.radioOptin label.main {
			width: 100% !important;
		}
}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/


.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}


.clearfix:before,
.clearfix:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix {
  zoom: 1;
}