html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
fieldset { position: relative; }
:focus { outline: 0; }
body { line-height: 1; color: black; background: white;  }
ol, ul { list-style: none; }
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }
div.clr { position: relative; display: block; float: none; clear: both; left: 0px; top: 0px; width: 1px; height: 0px; margin: 0px; padding: 0px; overflow: hidden; visibility: hidden;}
/* reset */

body {
	background-color: #e66d25;
	font-family: Tahoma, Geneva, sans-serif;
}

/* */

div#debug, div#debug2 {
	position: absolute;
	top: 5px;
	left: 5px;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;
}

div#debug2 {
	left: 100px;
	height: 200px;
	overflow: hidden;
}

/* */

div#bg {
	position: relative;
}

div.wrap {
	position: absolute;
	width: 1200px;
	height: 770px;
}

body.main div.bg_base {
	background: url(../i/fanta_main.jpg) center bottom no-repeat;
	width: 1200px;
	height: 800px;
	position: absolute;
	bottom: 0;
}

div.clouds {
	width: 300px;
	height: 100px;
	display: block;
	position: absolute;
	top: 150px;
	left: 800px;
	z-index: 100;
}

div.clouds object {
	display: block;	
}

body.main div.bottle {
	background: left bottom no-repeat;
	width: 500px;
	height: 650px;
	position: absolute;
	bottom: 69px;
	left: 150px;
}

body.main div.grass {
	background: url(../i/grass_main.png) center bottom no-repeat;
	width: 1200px;
	height: 350px;
	position: absolute;
	bottom: 0;
}

div.grass_left {
	background: url(../i/grass_repeat.png) right 10px repeat-x;
	width: 179px;
	height: 150px;
	position: absolute;
	bottom: 0;
	left: 0px;
	z-index: 3;
}

div.grass_right {
	background: url(../i/grass_repeat.jpg) left bottom repeat-x;
	width: 179px;
	height: 150px;
	position: absolute;
	bottom: 0;
	left: 1200px;
	z-index: 3;
}

/* */

body.main div.menu,
body.main div.menu-map {
	position: absolute;
	width: 230px;
	height: 270px;
	top: 275px;
	left: 705px;
	z-index: 20;
	background: 0 0 no-repeat;
}

body.main div.menu-over {
	position: absolute;
	width: 390px;
	height: 360px;
	top: 210px;
	left: 680px;
	z-index: 10;
}

body.main div.menu-over-1 div.menu-over { background: url(../i/menu_over_1.gif) 0 0 no-repeat; width: 320px; height: 170px; left: 750px; }
body.main div.menu-over-2 div.menu-over { background: url(../i/menu_over_2.jpg) 0 0 no-repeat; width: 105px; heigth: 105px; top: 330px; left: 735px; }
body.main div.menu-over-3 div.menu-over { background: url(../i/menu_over_3.png) 0 0 no-repeat; width: 105px; height: 105px; top: 380px; left: 825px; z-index: 20; }
body.main div.menu-over-4 div.menu-over { background: url(../i/menu_over_4.gif) 0 0 no-repeat; width: 70px; height: 110px; top: 309px; }
body.main div.menu-over-5 div.menu-over { background: url(../i/menu_over_5.jpg) 0 0 no-repeat; width: 150px; height: 150px; top: 420px; left: 750px; }
body.main div.menu-over-3 div.menu { z-index: 10; }
body.main div.menu-map { z-index: 30; }

/* */

div.footer {
	position: absolute;
	top: 701px;
	left: 100px;
	width: 1000px;
	z-index: 20;
}

div.footer div.footer-menu {
	position: absolute;
	left: 15px;
	height: 20px;
	font-size: 11px;
}

div.footer div.footer-menu a {
	color: #fff200;
	text-decoration: none;
	padding: 0 3px 0 2px;
	height: 20px;
	display: block;
	background: url(../i/sprite-main.png) right -40px no-repeat;
}

div.footer div.footer-menu a span {
	float: left;
	display: block;
	cursor: pointer;
}

div.footer div.footer-menu a span.e {
	width: 8px;
	height: 20px;
}

div.footer div.footer-menu a:hover span {
	background-image: url(../i/footer_over.gif);
}


div.footer div.footer-menu li.m1 a:hover span { background-position: left -100px; background-repeat: repeat-x; color: #fff; }
div.footer div.footer-menu li.m1 a:hover span.l { background-position: left 0; }
div.footer div.footer-menu li.m1 a:hover span.r { background-position: right 0; }
div.footer div.footer-menu li.m2 a:hover span { background-position: left -120px; background-repeat: repeat-x; color: #aa3728; }
div.footer div.footer-menu li.m2 a:hover span.l { background-position: left -20px; }
div.footer div.footer-menu li.m2 a:hover span.r { background-position: right -20px; }
div.footer div.footer-menu li.m3 a:hover span { background-position: left -140px; background-repeat: repeat-x; color: #fff; }
div.footer div.footer-menu li.m3 a:hover span.l { background-position: left -40px; }
div.footer div.footer-menu li.m3 a:hover span.r { background-position: right -40px; }
div.footer div.footer-menu li.m4 a:hover span { background-position: left -160px; background-repeat: repeat-x; color: #fff; }
div.footer div.footer-menu li.m4 a:hover span.l { background-position: left -60px; }
div.footer div.footer-menu li.m4 a:hover span.r { background-position: right -60px; }
div.footer div.footer-menu li.m5 a:hover span { background-position: left -180px; background-repeat: repeat-x; color: #fff; }
div.footer div.footer-menu li.m5 a:hover span.l { background-position: left -80px; }
div.footer div.footer-menu li.m5 a:hover span.r { background-position: right -80px; }

div.footer div.footer-menu li.m0 a:hover span { background: none; color: #fff; }

div.footer div.footer-menu ul {
	background: url(../i/sprite-main.png) 0 0 no-repeat;
	height: 20px;
	float: left;
}

div.footer div.footer-menu ul li {
	height: 20px;
	float: left;
	line-height: 18px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
	div.footer div.footer-menu ul li { line-height: 20px; }
}

div.footer div.footer-menu ul li.m5 a {
	background: none;
	padding-right: 0;
}

div.footer div.footer-menu ul:after {
	content: "";
	float: left;
	display: block;
	background: url(../i/sprite-main.png) 0 -40px no-repeat;
	height: 20px;
	width: 10px;
	position: absolute;
	right: -9px;
}

div.footer div.copyright {
	position: absolute;
	left: 30px;
	top: 20px;
	height: 20px;
	font-size: 11px;
}

div.footer div.copyright span {
	background: url(../i/sprite-main.png) 0 -20px no-repeat;
	height: 20px;
	float: left;
	color: #972629;
	font-size: 10px;
	padding-left: 10px;
	line-height: 18px;
	text-transform: uppercase;
}

div.footer div.copyright span:after {
	content: "";
	float: left;
	background: url(../i/sprite-main.png) -10px -40px no-repeat;
	height: 20px;
	width: 10px;
	position: absolute;
	right: -9px;
}

/* */

/* */

body.inner {
	background: #e66d25 100px top no-repeat fixed;
}

body.inner div.clouds {
	top: 140px;
	left: 850px;
	z-index: 10;
}

body.inner div.menu,
body.inner div.menu-map {
	position: absolute;
	width: 364px;
	height: 71px;
	top: 54px;
	right: 114px;
	z-index: 20;
}

body.inner div.menu {
	background: 0 0 no-repeat;
}

body.inner div.menu-over {
	position: absolute;
	width: 390px;
	height: 360px;
	top: 18px;
	right: 202px;
	z-index: 10;
	background: url(../i/menu_inner_over.png) 0 0 no-repeat;
	display: none;
}

body.inner div.menu-over-1 div.menu-over { display: block; background-position: 0 0; width: 104px; height: 78px; right: 406px; }
body.inner div.menu-over-2 div.menu-over { display: block; background-position: -104px 0; width: 73px; height: 72px; top: 53px; right: 332px; z-index: 20; }
body.inner div.menu-over-3 div.menu-over { display: block; background-position: -177px 0; width: 34px; height: 55px; top: 17px; right: 316px; }
body.inner div.menu-over-4 div.menu-over { display: block; background-position: -211px 0; width: 80px; height: 80px; top: 50px; right: 182px; }
body.inner div.menu-over-5 div.menu-over { display: block; background-position: -291px 0; width: 90px; height: 90px; top: 44px; right: 104px; }
body.inner div.menu-over-2 div.menu { z-index: 10; }
body.inner div.menu-map { z-index: 30; }

body.inner div.inner-wrap {
	width: 1200px;
	position: absolute;
	padding-bottom: 69px;
	background: url(../i/grass_inner_btm.jpg) right bottom no-repeat;
}


body.inner div.content {
	margin-left: 334px;
	margin-top: 147px;
	width: 650px;
	padding-top: 100px;
	background: url(../i/content_head.png) 0 0 no-repeat;
	z-index: 20;
}

body.inner div.content div.content-inner {
	width: 562px;
	background: #fbf6f2 url(../i/content_btm.jpg) 0 bottom no-repeat;;
	margin: 0 0 0 6px;
	padding: 0 47px 140px 28px;
	color: #000;
	font-size: 12px;
	line-height: 19px;
}

body.inner div.grass-over {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 340px;
	background: url(../i/grass_inner_over.png) 0 0 no-repeat;
	height: 260px;
	z-index: 20;
}

body.inner div.footer {
	position: absolute;
	top: auto;
	bottom: 29px;
	left: 100px;
	width: 1000px;
	height: 40px;
	z-index: 20;
}

/* */

div.content-inner p.lead {
	font-weight: bold;
}

div.content-inner div.sep {
	width: 600px;
	height: 3px;
	background: url(../i/sep.gif) 0 0 no-repeat;
	display: block;
	border: 0;
	position: relative;
	left: -12px;
	margin: 15px 0;
}

/* */

body.inner div.content {
	position: relative;	
}

body.inner div.canhead {
	width: 110px;
	height: 110px;
	background: url(../i/can_head.png) 0 0 no-repeat;
	display: block;
	overflow: hidden;
	position: absolute;
	top: -20px;
	left: 280px;
}

body.inner h2,
body.funzone h3,
body.facts h3 {
	background-repeat: no-repeat;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
}

body.inner h2 {
	position: absolute;
	top: 22px;
	left: -12px;
}

/* */

div.goodies {
	width: 587px;	
}

div.goodies div.g {
	float: left;
	height: 201px;
	background: url(../i/sprite.gif) 193px 0 repeat-y;
}

div.goodies div.g p {
	font-size: 11px;
	line-height: 14px;
	padding: 0 3px 10px 3px;
}

body.funzone div.wallpapers {
	width: 180px;
	padding-right: 13px;
	background-position: 192px;
}

body.funzone div.ringtones {
	width: 163px;
	padding: 0 19px 0 11px;
	background-position: 192px;
}

body.funzone div.mobile {
	width: 185px;
	padding: 0 0 0 16px;
	background: none;
}

body.funzone div.wallpapers h3 {
	margin: 15px 0 7px 0;
	background-position: 0 0;
	width: 140px;
	height: 35px;
}

body.funzone div.ringtones h3 {
	margin: 15px 0 7px 0;
	background-position: -140px 0;
	width: 115px;
	height: 35px;
}

body.funzone div.mobile h3 {
	margin: 15px 0 0 0;
	background-position: -255px 0;
	width: 154px;
	height: 35px;
}

div.wallpapers ul {
	width: 172px;
	height: 56px;
	display: block;
	background: url(../i/sprite.gif) -1px 0 no-repeat;
	padding: 4px;
	margin: 0 0 6px 0;
}

div.wallpapers ul li {
	display: block;
	float: left;
	width: 63px;
	height: 18px;
	margin-bottom: 1px;
}

div.wallpapers ul li.img {
	width: 106px;
	height: 56px;
	margin: 0 2px 0 0;
}

div.wallpapers ul li a {
	display: block;
	font-size: 11px;
	width: 63px;
	height: 18px;	
	line-height: 16px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

div.wallpapers ul li a:hover {
	background: url(../i/sprite.gif) -157px -107px no-repeat;
	color: #cf0000;
}

div.ringtones ul {
	width: 157px;
	height: 37px;
	display: block;
	background: url(../i/sprite.gif) -1px -64px no-repeat;
	padding: 3px;
	margin: 0 0 10px 0;
}

div.ringtones ul li {
	display: block;
	width: 157px;
	height: 18px;
	float: left;
	margin-bottom: 1px;
}

div.ringtones ul li a {
	display: block;
	font-size: 11px;
	width: 145px;
	height: 18px;	
	line-height: 16px;
	text-align: left;
	text-decoration: none;
	color: #fff;
	padding: 0 6px;
}

div.ringtones ul li a:hover {
	background: url(../i/sprite.gif) -1px -107px no-repeat;
	color: #cf0000;
}

div.goodies div.mobile p.i {
	padding: 0 0 4px 0;
}

div.video {
	width: 562px;
	height: 415px;
}

div.video div.fantaplayer {
	width: 520px;
	height: 350px;
	margin: 0 auto;
	background: url(../media/video/fanta_25_preview.jpg) 53px 0 no-repeat;
}

body.funzone div.video h3 {
	margin: 15px auto;
	background-position: -409px 0;
	width: 386px;
	height: 35px;
}

/* */

body.about div.content div.content-inner {
	padding-bottom: 210px;
	padding-right: 0;
	width: 609px;
	position: relative;
}

body.about div.content div.content-inner p.lead {
	padding: 80px 307px 0 25px;	
	height: 380px;
	background: right 0 no-repeat;	
	font-size: 12px;
	font-weight: normal;
	color: #005b30;
	line-height: 20px;
}

body.about div.content div.content-inner p.leaf {
	position: absolute;
	overflow: hidden;
	display: block;
	text-indent: -9999px;
}

body.about div.content div.content-inner p.leaf1 {
	top: -53px;
	left: 351px;
	width: 109px;
	height: 126px;
}

body.about div.content div.content-inner p.leaf2 {
	top: 20px;
	left: -59px;
	width: 106px;
	height: 124px;
}

body.about div.content div.content-inner h4 {
	display: none;	
}


/* */

div.products {
	width: 580px;	
	height: 160px;
	margin: 20px 0;
}

div.products div.bg {
	width: 580px;	
	height: 160px;
	display: block;
	position: absolute;
	z-index: 1;
	background: 0 0 no-repeat;
}

div.products ul {
	width: 580px;	
	height: 160px;
	display: block;
	position: absolute;
	z-index: 2;
}

div.products ul li,
div.products ul li a {
	float: left;
	display: block;
	width: 186px;
	height: 160px;
}

div.products ul li a {
	text-indent: -9999px;
}

div.products ul li {
	margin-right: 11px;	
}

div.products ul li.mango {
	margin: 0;	
}

body.products div.overlay {
	display: none;
	background: #000;
	opacity: 0.6;
	filter: alpha(opacity=60);
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}

body.products div.overlay-bg,
body.products div.overlay-content {
	position: absolute;
	width: 310px;
	height: 510px;
	top: 50%;
	left: 50%;
	margin: -255px 0 0 -155px;
	display: none;
	z-index: 110;
}
	
body.products div.overlay-bg { 
	z-index: 105;
	background: url(../i/products_overlay.png) 0 0 no-repeat;
}

body.products div.overlay-content a.close {
	width: 45px;
	height: 45px;
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	text-indent: -9999px;
}

body.products div.overlay-content img {
	position: relative;
	top: 38px;
	left: 93px;
}

/* */

body.story div.content h4 {
	color: #eb813c;
	font-size: 16px;
	font-weight: bold;
	margin: 0 0 10px 0;
}

/* */

body.facts div.content ul li {
	background: url(../i/sprite.gif) -1px -125px no-repeat;
	padding: 0 0 7px 20px;
}

body.facts div.content dt {
	color: #eb813c;
	font-size: 14px;
	font-weight: bold;
	margin: 20px 0 5px 0;
	background: url(../i/sprite.gif) -1px -125px no-repeat;
	padding: 0 0 0 20px;
}

body.facts div.content dd {
	padding: 0 0 0 20px;	
}