/* BreadTalk Philippines | CSS Document */
* {margin: 0; padding: 0;}

html, body {width: 100%; height: 100%;}
html {
	background: -moz-radial-gradient(50% 60%, circle, #FFF 20px, #E2E1DD 400px);
	background: -webkit-gradient(radial, 50% 60%, 20, 50% 50%, 400, from(#FFF), to(#E2E1DD));
	background-color: #E2E1DD;
	background-attachment: fixed;
	background-position: top center;
	background-repeat: no-repeat;	
}

body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
}

div {border: 0px dashed #999;}

a:link, a:visited {color: #F90; text-decoration: none;}
a:hover, a:active, a.current {color: #F30;}

a, img, iframe, input, textarea {border: none; outline: none;}
p {margin: 0.8em 0;}

h1 {font-size: 24px;}
h2 {font-size: 20px;}
h3 {font-size: 16px;}

/* BreadTalk Philippines | Global Variables */
.clear {zoom: 1;}
.clear:after {
	height: 0;
	line-height: 0;
	content: ".";
	clear: both;
	display: block;
	visibility: hidden;
	overflow: hidden;
}

.lfloat {float: left;}
.rfloat {float: right;}

.talkbubble {width: 250px; height: 250px; margin-right: 20px;}
.talkbubble h1 {
	font-size: 24px;
	color: #FFF;
	letter-spacing: -2px;
	line-height: 250px; 
	text-align: center;
}
.talkbubble.lfloat {
	background-image: url(../images/talkbubble_left.png);
	background-repeat: no-repeat;
}

.talkbubble.rfloat {
	background-image: url(../images/talkbubble_right.png);
	background-repeat: no-repeat;
}

#container {
	background-image: url(../images/diagonal.png);
	background-attachment: fixed;
	width: 100%; min-width: 1240px;
	min-height: 100%;
	position: relative;
	zoom: 1;
}

/* BreadTalk Philippines | Header */
#header {
	background-color: #E2E1DD;
	background-image: url(../images/diagonal.png);
	width: 90%;
	height: 100px;
	position: fixed;
	top: 0;
	padding: 0 5%;
	z-index: 10;
}

#header div.background {
	background-color: #F90;
	width: 100%;
	height: 4px;
	position: fixed;
	top: 0;
	left: 0;
}

#header div.logo {
	width: 284px;
	height: 30px;
	position: absolute;
	top: 50%; margin-top: -15px;
}

/* BreadTalk Philippines | Footer */

#footer {
	background-color: #616265;
	background-image: url(../images/diagonal.png);
	color: #FFF;
	width: 90%;
	padding: 0 5%;
	padding-top: 20px;
	margin-top: 140px;
}

#footer div.talkbubble {margin-top: -120px;}

#footer div.feedback {margin-right: 20px;}
#footer div.feedback ul {float: left; display: block;}
#footer div.feedback ul li {display: block; margin: 4px; list-style: none;}
#footer div.feedback ul li p {
	margin-top: 8px;
	margin-bottom: 16px;
	margin-right: 10px;
	text-align: right;
}

#footer div.feedback ul li input,
#footer div.feedback ul li textarea {
	background-color: #CCC;
	width: 360px;
	padding: 4px 14px;
	border-radius: 14px;
 -moz-border-radius: 14px;
 -webkit-border-radius: 14px;
}

#footer div.feedback ul li textarea {padding: 14px; height: 100px; resize: none;}
#footer div.feedback ul li input:hover,
#footer div.feedback ul li input:focus,
#footer div.feedback ul li textarea:hover,
#footer div.feedback ul li textarea:focus {background-color: #FFF;}
#footer div.feedback ul li.button {float: right;}
#footer div.feedback ul li.button input {
	width: 80px;
	float: left;
	margin-right: 4px;
	cursor: pointer;
}

#footer div.contactinfo p img {margin-bottom: 4px; margin-right: 4px; vertical-align: middle;}

#footer div.copyright {
	padding: 20px 0;
	float: none; 
	clear: both;
}
#footer div.copyright p {font-size: 11px; text-align: center;}
#footer div.copyright p img {
	margin-right: 4px;
	margin-bottom: 4px;
	vertical-align: middle;
}

#footer a:link, #footer a:visited {color: #FFF;}
#footer a:hover, #footer a:active {color: #F90;}