/******************************* Defaults and templates *******************************/

body {
	margin: 0;
	padding: 0;
	color: #ffffff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1em;
	background-color: #ffffff;
}

a, a:link, a:visited, a:hover, a:active {
	color: #ffc662;
	text-decoration: none;
}

img {
	max-width: 100%;
	border: 0;
}

.title {
	margin: 0 0 0.75em 0;
	font-family: 'Open Sans', sans-serif;
	font-size: 3.125em;
	font-weight: 700;
	text-transform: uppercase;
}

p {
	line-height: 1.563;
	font-size: 1.438em;
	margin: 0 0 1.25em 0;
}

.bold {
	font-weight: 700;
}

.italic {
	font-style: italic;
}

.colored {
	color: #ffc662;
}

.clear {
	clear: both;
}

.heading {
	margin: 2.5em 0 1.25em 0;
	font-weight: 700;
}

.section {
	width: 100%;
	margin: 0;
	padding: 5em 0 5em 0;
}

.container {
	margin: 0 auto 0 auto;
	padding: 0 1em 0 1em;
}

.column {
	margin: 0 0 0 16.66666667%;
	width: 66.66666667%;
}

form {
	margin: 0;
	padding: 0;
}

label {
	display: block;
	margin: 1.25em 0 0.5em 0;
	padding: 0;
	font-size: 1.438em;
	font-weight: 700;
}

input, textarea, select {
	display: block;
	margin: 0.5em 0 0.5em 0;
	padding: 1em;
	width: 100%;
	max-width: 16em;/*TODO: have these widths change based on screen size*/
	color: #777777;
	background-color: #ffffff;
	font-family: 'Source Sans Pro', sans-serif;
	font-size: 1.25em;
	border: 0;
	outline: none;
}

input[type="hidden"] {
	display: none;
}

textarea {
	max-width: 24em;
	min-height: 6em;
}

select {
	padding-left: 0.25em;
	width: auto;
	border: 0.0625em solid #777777;
}

.button {
	display: inline-block;
	padding: 0.5625em 1.40625em 0.5625em 1.40625em;
	width: auto;
	color: #ffffff !important;
	background-color: #f4b649;
	font-size: 1.75em;
	font-weight: 700;
	text-transform: uppercase;
	cursor: pointer;
}

.button:hover {
	background-color: #ffc662;
}

.error {
	font-size: 1em;
	margin: 1em 0 1em 0;
	padding: 0.5em 1em 0.5em 1em;
	color: #a94442;
	background-color: #f2dede;
	border: 0.25em solid #ebccd1;
}

/******************************* Elements *******************************/

#cookie-notice {
	display: none;
	padding: 0;
	background-color: #ffffff;
}

	#cookie-notice-container {
	}
	
		#cookie-notice-content {
			position: relative;
			margin: 0;
			padding: 1em 4em 1em 4em;
			color: #777777;
			border-right: 0.125em solid #8a034f;
			border-bottom: 0.125em solid #8a034f;
			border-left: 0.125em solid #8a034f;
		}
		
			#cookie-notice-title {
				color: #8a034f;
				font-size: 1.5em;
				font-weight: 700;
			}
			
			#cookie-notice-content a {
				color: #8a034f;
			}
			
			#cookie-notice-close {
				position: absolute;
				right: 1em;
				bottom: 1em;
				cursor: pointer;
			}
			
#header {
	padding: 0;
	background-color: #ffffff;
}

	#header-container {
		overflow: auto;
		min-height: 4.375em;
		line-height: 4.375em;
	}
	
		#header-logo {
			position: relative;
			float: left;
			width: 10.3125em;
			min-height: 4.375em;
			margin: 0 2em 0 0;
			padding: 0;
		}
		
			#header-logo a {
				display: block;
			}
			
				#header-logo a img {
					position: absolute;
					top: 0;
					bottom: 0;
					margin: auto 0 auto 0;
				}
				
		#header-navigation {
			float: left;
			margin: 0 2em 0 0;
			padding: 0;
			list-style: none;
		}
		
			#header-navigation li {
				float: left;
				margin: 0 0 0 2.5em;
			}
			
			#header-navigation li:first-child {
				margin: 0;
			}
			
				#header-navigation li a, #header-navigation li a:link, #header-navigation li a:visited, #header-navigation li a:hover, #header-navigation li a:active {
					display: block;
					line-height: 1.1875em;
					padding: 1em 0 0 0;
					color: #8a034f;
					font-weight: 600;
					text-transform: uppercase;
				}
				
				#header-navigation li a.currentPage {
					border-bottom: 0.1875em solid #8a034f;
				}
				
				#header-navigation li a:hover {
					border-bottom: 0.1875em solid #8a034f;
				}
				
				#header-navigation li a:active {
					color: #ffc662;
					border-bottom: 0.1875em solid #ffc662;
				}
				
		#header-language {
			position: relative;
			float: left;
			margin: 0 2em 0 0;
			padding: 0 0.5em 0 0.5em;
			color: #ffffff;
			background-color: #f4b649;
			font-weight: 600;
			text-transform: uppercase;
		}
		
		#header-language:hover {
			background-color: #ffc662;
		}
		
			#header-language img {
				position: absolute;
				top: 0;
				bottom: 0;
				margin: auto 0 auto 0;
			}
			
			#header-language-name {
				margin: 0 0 0 28px;
				padding: 0 0 0 0.5em;
			}
			
		#header-astrazeneca {
			position: relative;
			float: right;
			width: 8.625em;
			min-height: 3.375em;
			margin: 0 2em 0 0;
			padding: 0;
		}
		
			#header-astrazeneca img {
				position: absolute;
				top: 0;
				bottom: 0;
				margin: auto 0 auto 0;
			}
			
#footer {
	padding: 4.375em 0 4.375em 0;
	background-color: #3b203d;
}

	#footer-container {
	}
	
		#footer-links {
			width: 100%;
			text-align: center;
		}
		
			#footer-links-list {
				display: inline-block;
				clear: both;
				margin: 1em 0 1em 0;
				padding: 0;
				list-style: none;
			}
			
				#footer-links li {
					float: left;
					margin: 0 0 0 1.5em;
					padding: 0 0 0 1em;
				}
				
				#footer-links li:first-child {
					margin: 0;
				}
				
					#footer-links li a, #footer-links li a:link, #footer-links li a:visited, #footer-links li a:hover, #footer-links li a:active {
						color: #ffffff;
					}
					
		#footer-info {
			clear: both;
			width: 100%;
			text-align: center;
		}

/******************************* Page: Home *******************************/

#home-video {
	padding: 5em 0 2.5em 0;
	background-color: #6d294f;
}

#home-timeline {
	padding: 0;
	background-color: #4cc199;
}

	.home-timeline-month {
		float: left;
		width: 8.33333333%;
		padding: 1.3038943em 0;
		font-size: 1.438em;
		text-align: center;
		text-transform: uppercase;
	}
	
	.home-timeline-month-active {
		background-color: #3aa882;
	}

#home-month-calendar {
	color: #6d294f;
}

	#home-month-calendar-about {
		width: 58.33333333%;
	}
	
#home-newsletter {
	padding: 2.5em 0 5em 0;
	background-color: #6d294f;
}

	.for-family-and-friends-list-item {
		margin: 0 0 0.625em 0;
		padding: 0 0 0 43px;
	}
	
#home-for-family-and-friends {
	background-color: #3b203d;
}

	#home-for-family-and-friends-left {
		float: left;
		width: 28.6875em;
		padding: 0 1em 0 0;
	}
	
		#home-for-family-and-friends-left-picture {
			display: block;
			width: 100%;
		}
		
	#home-for-family-and-friends-right {
		float: left;
		width: 40.5625em;
		padding: 0 0 0 1em;
	}
	
#home-faq {
	background-color: #3aa882;
}

	#home-faq-title {
		text-align: center;
	}
	
	#home-faq-introduction {
		margin: 0 0 1.5em 0;
		font-size: 1.625em;
		text-align: center;
	}
	
	#home-faq-questions {
	}
	
		.home-faq-questions-list-item {
			float: left;
			width: 16.75em;
			padding: 0 3.5em 0 3.5em;
		}
		
			.home-faq-questions-list-item-paragraph {
				font-size: 1.188em;
			}
			
	#home-faq-questions-all-questions {
		text-align: center;
	}
	
#home-about {
	background-color: #6d294f;
}

	#home-about-title {
		text-align: center;
	}

/******************************* Page: Reducing risk *******************************/

#reducing-risk-introduction {
	background-color: #3f2141;
}

#reducing-risk-steps {
	background-color: #513153;
}

	.reducing-risk-steps-list-item {
		margin: 0;
		padding: 2.5em 0 2.5em 0;
		border-top: 0.0625em solid #492c4b;
	}
	
	.reducing-risk-steps-list-item:first-child {
		border: 0;
	}
	
		.reducing-risk-steps-icon {
			float: left;
			width: 5.9375em;
			height: 5.9375em;
			margin: 0 2em 0 0;
		}
		
		.reducing-risk-steps-text {
			overflow: auto;
		}
		
			.reducing-risk-steps-heading {
				margin: 0 0 1em 0;
				text-transform: uppercase;
			}
			
			.reducing-risk-steps-sub-list {
				margin: 0 0 1em 0;
				line-height: 1.563;
				font-size: 1.438em;
				list-style: circle;
			}
			
#reducing-risk-calendar {
	background-color: #3aa882;
}

	#reducing-risk-calendar-icon {
		float: left;
		width: 5.9375em;
		height: 5.9375em;
		margin: 0 2em 0 0;
	}
	
	#reducing-risk-calendar-text {
		overflow: auto;
	}
	
		#reducing-risk-calendar-heading {
			margin: 0;
			text-transform: uppercase;
		}
		
		#reducing-risk-calendar-paragraph {
			margin: 0 0 1.5em 0;
		}

/******************************* Page: For family and friends *******************************/

#for-family-and-friends-above {
	padding: 5em 0 2.5em 0;
	background-color: #6d294f;
}

#for-family-and-friends-picture {
	padding: 0;
}

	#for-family-and-friends-picture-picture {
		display: block;
		width: 100%;
	}
	
#for-family-and-friends-below {
	padding: 2.5em 0 5em 0;
	background-color: #6d294f;
}

	.for-family-and-friends-list-item {
		margin: 0 0 0.625em 0;
		padding: 0 0 0 43px;
	}

/******************************* Page: FAQ *******************************/

#faq {
	background-color: #3aa882;
}

	#faq-title {
		text-align: center;
	}
	
	.faq-questions-list-item {
		min-height: 2.75em;
		margin: 0;
		padding: 2.5em;
		border-bottom: 0.0625em solid #503957;
		cursor: pointer;
	}
	
	.faq-questions-list-item:first-child {
		border-top: 0.0625em solid #503957;
	}
	
		.faq-questions-icon {
			float: left;
			width: 2.75em;
			height: 2.75em;
			margin: 0 1.25em 0 0;
			padding: 0;
		}
		
		.faq-questions-text {
			overflow: auto;
			padding: 0.25em 0 0 0;
			line-height: 1.563;
			font-size: 1.438em;
		}
		
			.faq-questions-question {
				margin: 0;
			}
			
			.faq-questions-answer {
				margin: 0.625em 0 0 0;
			}
			
				.faq-questions-sub-list {
					margin: 0 0 1em 0;
					font-size: 1em;
					list-style: circle;
				}

/******************************* Page: Contact us *******************************/

#contact-us {
	background-color: #6d294f;
}

	#questions-about-our-medicines-title {
		margin: 0.75em 0 0.75em 0;
	}
	
	#contact-form-notice {
		display: block;
		margin: 1em 0 1em 0;
	}

/******************************* Viewports *******************************/

@media (min-width: 48em) {/*768px*/
	.container {
		width: 45.75em;/*732px*/
	}
}

@media (min-width: 62em) {/*992px*/
	.container {
		width: 59.25em;/*948px*/
	}
}

@media (min-width: 75em) {/*1200px*/
	.container {
		width: 71.25em;/*1140px*/
	}
}

@media (min-width: 87.5em) {/*1400px*/
	.container {
		width: 83.75em;/*1340px*/
	}
}