/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

/* Left & Right alignment */

.left { float:left;}
.right { float:right;}
.wrapper {width:100%; overflow:hidden;}

/* Global properties ======================================================== */

body{ background: url(../images/bg_top2.jpg) top center no-repeat #202020; border:0; font:13px Arial, Helvetica, sans-serif; color:#494949; line-height:18px; min-width:960px;}
#page1{background: url(../images/bg_top.jpg) top center no-repeat #202020;}
#page2a{background: url(../images/bg_top2.jpg) top center no-repeat #202020; min-width:1020px;}
#page3{background: url(http://www.whitsundaymobilemarketing.com.au/images/bg_top3.jpg) top left no-repeat #202020;}

.css3{border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; box-shadow: 0 0 4px rgba(0, 0, 0, .4); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .4); -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .4);  position: relative;}

/* Global Structure ============================================================= */

.body1{ background:url(../images/bg_content_top1.gif) top repeat-x #ffffff;}
.body2{ background:url(../images/bg_content_top2.jpg) top repeat-x #e3e3e3}
.body3{ background:url(../images/bg_content_top1.gif) top repeat-x #ffffff;}
.body4{ background:url(../images/bg_content_top3.jpg) top center no-repeat}

/* ============================= main layout ====================== */

a{ color:#494949; text-decoration: underline; outline:none}
a:hover{ text-decoration: none}
h1{ float:left; padding:5px 0 0 12px;}
h2{ font-size:22px; line-height:1.2em; color:#000000; padding:20px 0 13px 0; font-weight:normal}
p{ padding-bottom:18px;}

strong{ color:#009fcd}

/* ============================= header ====================== */
header{ width:100%; height:322px}

#page1 header{ height:872px; overflow:hidden; position:relative}

#logo{ display:block; background:url(../images/wmmlogo.png) no-repeat; width:249px; height:108px; text-indent:-9999px;}

#menu { float:right; padding:50px 16px 0 0; position:relative; z-index:101;}
#menu > li { float:left; padding-right:1px; position:relative}
#menu > li > a{ display:block; font-size:18px; color:#959a9c; line-height:38px; text-decoration:none; text-transform:uppercase; padding:0 15px;border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;  position: relative;}
#menu > li > a:hover{ color:#0f191e}
#menu > #active > a{ color:#fe4800; background:#e0e0e0;}

#menu .ul_1{ position:absolute; width:122px; left:50%;  margin-left:-61px; top:65px;}
#menu .ul_1 > li{ background:url(../images/bg_menu.png) repeat; height:28px;}
#menu .ul_1 > li > a{ display:block; background:url(../images/menu_line.png) bottom repeat-x; font-size:14px; color:#fff; font-style:italic; line-height:24px; padding-bottom:4px; text-decoration:none; padding-left:12px;}
#menu .ul_1 > .marker{ background:url(../images/menu_marker.gif) no-repeat; width:13px; display:block; height:7px; font-size:0; line-height:0; position:absolute; top:-7px; left:55px;}
#menu .ul_1 > .top{ padding-top:14px;}
#menu .ul_1 > .bot{ padding-bottom:15px; background:url(../images/menu_bg_bot.png) no-repeat}
#menu .ul_1 > .bot > a{ background:none}
#menu .ul_1 > li > a:hover{ color:#fe4800}

.roundabout-holder  {  height: 5em; }
.roundabout-moveable-item { cursor: pointer; width:510px; height:645px;}
.roundabout-in-focus { cursor: auto; }
#gallery{ position:absolute; top:485px; left:30px; width:900px; height:645px;}
#gallery img{ display:block; width:100%; height:100%}
#gallery li{}

#next, #prev{ position:absolute; z-index:101; right:10px; top:463px; height:63px; width:63px; display:block; background:url(../images/marker_right.png) 0 0 no-repeat}
#next:hover, #prev:hover{ background-position:right}
#prev{ left:10px;top:451px; background:url(../images/marker_left.png) 0 0 no-repeat}

#slogan{ position:absolute; top:198px; left:314px; display:block; background:url(../images/slogan.png) no-repeat; width:329px; height:64px; text-indent:-9999px;}
#slogan1{ position:absolute; top:178px; left:314px; display:block; background:url(../images/slogan1.png) no-repeat; width:395px; height:95px; text-indent:-9999px;}
#slogan2{ position:absolute; top:178px; left:314px; display:block; background:url(../images/slogan2.png) no-repeat; width:395px; height:95px; text-indent:-9999px;}
#slogan3{ position:absolute; top:400px; left:20px; background:url(../images/slogan3.gif) no-repeat; width:350px; height:60px; text-indent:-9999px;}
#slogan4{ position:absolute; top:178px; left:314px; display:block; background:url(../images/slogan4.png) no-repeat; width:329px; height:95px; text-indent:-9999px;}
#slogan5{ position:absolute; top:178px; left:314px; display:block; background:url(../images/slogan5.png) no-repeat; width:395px; height:95px; text-indent:-9999px;}
#slogan6{ position:absolute; top:178px; left:314px; display:block; background:url(../images/slogan6.png) no-repeat; width:395px; height:95px; text-indent:-9999px;}

/* ============================= content ====================== */

#content{ width:100%; overflow:hidden; padding: 25px 0 47px 0}
#content2{ width:100%; overflow:hidden;padding:20px 0 52px 0;}

.marg_right1{ margin-right:14px;}
.pad_bot1{ padding-bottom:13px;}
.pad_right1{ padding-right:40px;}

.font1{ font-size:17px; color:#0f191e; line-height:22px; font-style:italic; padding:10px 0 12px 0} 
.font2{ font-size:11px; color:#009fcd; font-weight:bold;}

.color1{ color:#009fcd}

.button1, .button2{ display:inline-block; font-size:19px;color:#000000; line-height:36px; background:url(../images/bg_button1.gif) top repeat-x #9c9c9c; height:39px; overflow:hidden; padding:0 16px;border-radius: 16px; -moz-border-radius: 16px; -webkit-border-radius: 16px; box-shadow: 0 1px 2px #000; -moz-box-shadow: 0 1px 2px #000; -webkit-box-shadow: 0 1px 2px #000; position: relative; text-decoration:none; margin-bottom:2px;}
.button1:hover, .button2{ background-position:bottom; background-color:#333333; color:#e3e3e3;}
.button2:hover{ background-position:top; background-color:#9c9c9c; color:#000000}

.button_tweets{ display:inline-block; width:142px; height:41px; font-size:19px; color:#e3e3e3; padding-top:46px; text-align:center; line-height:40px; background:url(../images/button_twitter.png) right 0 no-repeat; text-decoration:none; padding-right:8px}
.button_tweets:hover{ background-position:0px 0;}

.link1{ text-decoration:none}
.link1:hover{ color:#009fcd}

.link2{ text-decoration:none; color:#009fcd; font-weight:bold}
.link2:hover{ text-decoration: underline}

.comments{ color:#009fcd; font-weight:bold; padding-left:20px; background:url(../images/marker_2.gif) 0 5px no-repeat; margin-top:-5px; padding-bottom:21px}
.comments a{ color:#009fcd; text-decoration:none}
.comments a:hover{ text-decoration:underline}
.comments span{ font-size:11px; color:#a5a5a5; font-weight:normal; vertical-align:baseline}

.list1{ }
.list1 li{ margin-bottom:16px; font-size:12px; line-height:20px;}
.list1 li a{ text-transform:uppercase; text-decoration:none;  color:#858585; cursor:pointer}
.list1 li a span{ display:inline-block; padding-left:23px;background:url(../images/marker_1.gif) 0 5px no-repeat;}

.banner1{ padding-top:25px;}


#page1 #content{ padding:49px 0 47px 0;}
#page3 #content{ padding-bottom:25px}
#page4 .marg_right1{  margin-right:17px;}
#page4 #content{ padding-bottom:38px}
#page5 figure{ padding-top:3px; padding-bottom:13px}
#page5 .cols{ width:190px;}
#page5 #content{ padding-bottom:55px}

/*---------- bubble tooltip -----------*/
a.tt{
    position:relative;
    z-index:24;
    color:#535353;
    text-decoration:none;
}
a.tt span{ display: none; }

/*background:; ie hack, something must be changed in a for ie to execute it*/
a.tt:hover{ z-index:25; color: #009fcd; background:;}
a.tt { color:#535353; position:relative; text-decoration:none; z-index:24; }
a.tt:hover span.tooltip{
    display:block;
    position:absolute;
    bottom:-150px; right:-260px;
	padding: 0px 0 0 0;
	width:200px;
	color: #fff;
}
a.tt:hover span.top{
	display: block;
	padding: 0px 0px 0;
    background: url(../images/bubble_filler.png) no-repeat top;
}
a.tt:hover span.middle{ /* different middle bg for stretch */
	display: block;
	padding: 0 15px; 
	background: url(../images/bubble_filler.png) repeat bottom; 
}
a.tt:hover span.bottom{
	display: block;
	padding: 0px 0px 0px;
	color: #548912;
    background: url(../images/bubble_filler.png) no-repeat bottom;
}



/* ============================= footer ====================== */

footer { width:100%; overflow:hidden; padding:28px 0 40px 0; line-height:32px; color:#b1b1b1}
footer a{ color:#696969}

#icons{ float:right; padding-right:9px;}
#icons li{ float:left; padding-left:7px;}

/* Tooltips */
.aToolTip {	border:1px solid #000; background: url(../images/bg_menu.png) repeat; color:#fff;	margin:0; padding:2px 10px; font-size:11px;	}
.aToolTip .aToolTipContent { position:relative;	margin:0; padding:0; }
a.aToolTipCloseBtn { display:block;	height:20px; width:20px; overflow:hidden;background: url(../images/loading/close.gif) no-repeat;text-indent:-9999px;	outline:none; position:absolute; top:-15px;	right:-20px; }


/* ============================= forms ============================= */

#contact-form { padding-top:2px;}
#contact-form .button1{ float: right; margin-left:20px;}
#back{ float:right;}
#contact-form input {  width:306px; background: none; padding:7px 10px;  float:left; font:13px Arial, Helvetica, sans-serif; color:#494949; height:15px;}
#contact-form textarea { overflow: auto; width:516px; background: none; padding:7px 10px;  float:left; font:13px Arial, Helvetica, sans-serif; color:#494949; height:182px; margin:0}
#contact-form fieldset {border:none; width:100%; overflow:hidden;}
#contact-form .rowElem {display:block;position:relative; width:100%; overflow:hidden; min-height:42px}
#contact-form .textarea-box { width:100%;display:inline-block;position:relative; min-height:218px}
#contact-form label {padding:0;display: none;	font-size:10px;	position: relative;font-size:11px; left:10px;top:1px; margin-bottom:0px}
#contact-form .error {color:red;}
#contact-form fieldset {border:none;}
div#contact_form .download-box p{
	padding:20px 30px; background: none;border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; position: relative; border:1px solid #e0e0e0;
}
#contact-form .bg{ float:left; border:1px solid #e0e0e0; background: none;border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; position: relative;}