/*======================================= CSS Layout / Resets =======================================*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var { font-weight: normal; font-style: normal; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h5,h6 {font-weight: normal; font-size: 100%; } q:before,q:after { content:''; } abbr,acronym { border: 0; } /* The below restores some sensible defaults */ strong { font-weight: bold } em { font-style: italic } ol, ul, li { list-style:none } * a { position:relative } /* Gets links displaying over a PNG background */ a { outline:none } /* Gets rid of Firefox's dotted borders */ a img { border:none } /* Gets rid of IE's blue borders */ .clear { clear: both;} /*============== Layout ===============*/ body { background:#fff url(../images/bg_summer.jpg) center top; font-family: lucinda sans unicode; font-size: 14px; } #wrapper { margin: 0 auto; width: 950px; background: url(../images/summer_wrapperbg.jpg) repeat-y} #header { width: 950px; height: 315px; margin:0 0 10px 0; position:relative; background: url(../images/summer_headerbg.jpg) center top no-repeat; } #main { width:950px; position:relative;} #mainbody { width:100%; overflow:visible; position:relative} #leftcolumn {width: 692px; float: left; margin-right:0; position:relative} #rightcolumn {width: 220px; display: inline; float: left; margin:3px 0 0 0; height: 565px; background: url(../images/summer_whatsnewbg.jpg) center top no-repeat} #footer {clear: both; margin:0 0; height:154px; width:950px; background:#fff url(../images/summer_footerbg.jpg) no-repeat center top;} p { font-size:14px; color:#555;font-family:"Arial","Lucida Grande",Garuda,sans-serif; } h1 { font-size:30px; font-weight:bold; margin-bottom:24px; color:#000} h2 { font-size:24px; font-weight:normal; margin-bottom:8px; color:#555;font-family:"Arial","Lucida Grande",Garuda,sans-serif;} h4 { font-size:20px; font-weight:bold; margin:8px 0; color:#555} a {color:#673401;text-decoration:underline;font-weight:bold;} a:hover {color:#572b00;text-decoration:underline;font-weight:bold;} a:active {color:#572b00;text-decoration:underline;font-weight:bold;} a:visited {color:#673401;text-decoration:underline;font-weight:bold;} /*============== Header ===============*/ #header_home { position:absolute; top:95px; left:40px;} #header_home a{ width:865px; height:220px; display:block} #rotator_container { position:relative; width:611px; height:320px; background:url(../images/summer_homephoto.jpg) no-repeat; padding:20px; margin-left:36px;} #photo_container { position:relative; height:320px;} #tabs_summer { float:left; position:relative; width:350px; height:76px; background:url(../images/tabs_summer.png) no-repeat; margin-left:50px} #tabs_summer li {float:left; height:43px;} #tabs_summer li.nolink {width:115px;} #tabs_summer a {width:100px !important; display:block;height:75px;} #tabs_summer span {display:none;} #tabs_donate { float:right; position:relative; width:345px; height:67px; background:url(../images/summer_donatenow.jpg) no-repeat; margin-left:0px} #tabs_donate li {height:43px;} #tabs_donate li.nolink {width:115px;} #tabs_donate a {width:345px !important; display:block;height:67px;} #tabs_donate li a:hover{ background: url(../images/summer_donatenow.jpg) 0px -67px;} #tabs_donate span {display:none;} #tabs_register { float:right; position:relative; width:150px; height:76px; background:url(../images/tabs_register.png) no-repeat; margin-left:50px} #tabs_register li {float:left; height:43px;} #tabs_register li.nolink {width:115px;} #tabs_register a {width:100px !important; display:block;height:75px;} #tabs_register span {display:none;} /*============== Main Nav ===============*/ #mainnav {width:900px; height:35px; background:url(../images/summer_mainnav.jpg) no-repeat; margin:0 auto;text-align: center;clear: left;} #mainnav li{ display: block; float: left; text-align: center;} #mainnav li a span{ display:none;} #mainnav li a{ height:35px; display: block;} /* -- Hovers -- */ #mainnav li a#nav_about {width:110px; margin-left:14px;} #mainnav li a#nav_about:hover{ background: url(../images/summer_mainnav.jpg) -14px -35px;} #mainnav li a#nav_schedule { width:145px; margin-left:15px;} #mainnav li a#nav_schedule:hover{ background: url(../images/summer_mainnav.jpg) -139px -35px;} #mainnav li a#nav_parents { width:125px; margin-left:15px;} #mainnav li a#nav_parents:hover{ background: url(../images/summer_mainnav.jpg) -299px -35px;} #mainnav li a#nav_jobs { width:95px; margin-left:15px;} #mainnav li a#nav_jobs:hover{ background: url(../images/summer_mainnav.jpg) -439px -35px;} #mainnav li a#nav_news { width:75px; margin-left:15px;} #mainnav li a#nav_news:hover{ background: url(../images/summer_mainnav.jpg) -549px -35px;} #mainnav li a#nav_photos { width:100px; margin-left:20px;} #mainnav li a#nav_photos:hover{ background: url(../images/summer_mainnav.jpg) -644px -35px;} #mainnav li a#nav_contactus { width:113px; margin-left:20px;} #mainnav li a#nav_contactus:hover{ background: url(../images/summer_mainnav.jpg) -764px -35px;} #mainnav li { display:inline; } #dropmenudiv{ position:absolute; border:1px solid #89b2b0; border-bottom-width: 0; line-height:18px; z-index:100; } #dropmenudiv p{ width: 100%; display: block; text-indent: 1px; border-bottom: 1px solid #89b2b0; padding: 1px 0; text-decoration: none; font-weight: bold;background-color: #94b9b7; color:#446668; font-family:Arial, Helvetica, sans-serif; font-size:12px; } #dropmenudiv a{ width: 100%; display: block; text-indent: 3px; border-bottom: 1px solid #89b2b0; padding: 1px 0; text-decoration: none; font-weight: bold;background-color: #94b9b7; color:#fff; font-family:Arial, Helvetica, sans-serif; font-size:12px; } #dropmenudiv a:hover{ /*hover background color*/ background-color: #abd5d3;} /*============== Subnav ===============*/ #subnav_about {width:900px; height:35px; background:url(../images/summersubnav_about.jpg) no-repeat; margin:0 auto;text-align: center;clear: left;} #subnav_about li{ display: block; float: left; text-align: center;} #subnav_about li a span{ display:none;} #subnav_about li a{ height:35px; display: block;} /* -- Hovers -- */ #subnav_about li a#nav_about {width:110px; margin-left:14px;} #subnav_about li a#nav_about:hover{ background: url(../images/summersubnav_about.jpg) -14px -35px;} #subnav_about li a#nav_schedule { width:145px; margin-left:20px;} #subnav_about li a#nav_schedule:hover{ background: url(../images/summersubnav_about.jpg) -144px -35px;} #subnav_about li a#nav_parents { width:125px; margin-left:20px;} #subnav_about li a#nav_parents:hover{ background: url(../images/summersubnav_about.jpg) -309px -35px;} #subnav_about li a#nav_jobs { width:95px; margin-left:20px;} #subnav_about li a#nav_jobs:hover{ background: url(../images/summersubnav_about.jpg) -454px -35px;} #subnav_about li a#nav_news { width:65px; margin-left:20px;} #subnav_about li a#nav_news:hover{ background: url(../images/summersubnav_about.jpg) -569px -35px;} #subnav_about li a#nav_photos { width:90px; margin-left:17px;} #subnav_about li a#nav_photos:hover{ background: url(../images/summersubnav_about.jpg) -651px -35px;} #subnav_about li a#nav_contactus { width:113px; margin-left:20px;} #subnav_about li a#nav_contactus:hover{ background: url(../images/summersubnav_about.jpg) -761px -35px;} #subnav_about li { display:inline; } /*============== What's New ===============*/ #blogfeed { margin:0 auto; width:170px; margin-top:30px;} #blogfeed table{ margin-top:35px;} #blogfeed td{height:126px; width:170px; overflow:hidden} #blogfeed td p{font-family:"Arial","Lucida Grande",Garuda,sans-serif;font-size:12px; color:#524e45;margin-top:10px;} a.blog_title {font-family:"Arial","Lucida Grande",Garuda,sans-serif;text-decoration:none; font-weight:bold; font-size:12px; color:#524e45;} #morenews { width:200px; text-align:right; margin-top:14px;font-family:"Arial","Lucida Grande"; font-size:14px;} /*============== Flikr Stream ===============*/ #flickrstream {width:215px; text-align:center; margin-top:35px;} .flickr_badge { float: left; width:215px;} .flickr_badge img { width: auto; height: 80px; padding: 0px; margin: 10px 10px 10px 15px; border: 1px solid #000; background: #ccc; float: left; } /*============== Home ===============*/ #boxes {width:647px; height:370px; clear: left; margin:15px 0 0 41px;} #boxes ul {} #boxes li{ display: block; float: left; text-align: center; width:302px; height:172px; margin-bottom:15px;} #boxes li a span{ display:none;} #boxes li a{ height:172px; display: block;} /* -- Hovers -- */ #boxes li a#box_register { width:302px; height:172px; background: url(../images/home_register.jpg) top left;} #boxes li a#box_register:hover{ background: url(../images/home_register.jpg) 0 -172px;} #boxes li a#box_forms { width:302px; height:172px; margin-left:35px; background: url(../images/home_forms.jpg) top left;} #boxes li a#box_forms:hover{ background: url(../images/home_forms.jpg) 0 -172px;} #boxes li a#box_schedule { width:302px; height:172px; margin-left:35px; background: url(../images/home_schedule.jpg) top left;} #boxes li a#box_schedule:hover{ background: url(../images/home_schedule.jpg) 0 -172px;} #boxes li a#box_jobs { width:302px; height:172px; margin-left:0; background: url(../images/home_jobs.jpg) top left;} #boxes li a#box_jobs:hover{ background: url(../images/home_jobs.jpg) 0 -172px;} #boxes li a#box_parents { width:302px; height:172px; margin-left:35px; background: url(../images/home_parents.jpg) top left;} #boxes li a#box_parents:hover{ background: url(../images/home_parents.jpg) 0 -172px;} #boxes li { display:inline; } /*============== Content ===============*/ #content { width: 615px; margin-top:25px; margin-left:5px; padding: 0 35px; padding-bottom:25px;} #content h1 { font-size:30px; font-weight:bold; margin-bottom:24px;} #content h3 { font-size:18px; font-weight:bold;} #contentlist {margin:24px 0; padding-left:20px; list-style:square} #contentlist li {margin-left:10px; padding-left:10px; list-style:square; font-size:14px; color:#555; font-family:"Arial","Lucida Grande",Garuda,sans-serif; } #bodyimg { float:left; margin:10px} #content p { line-height:24px; margin-bottom:24px;} #content ul, #content ol {font-family:"Arial","Lucida Grande",Garuda,sans-serif; color:#555; } ul.jobInfo { margin-left:30px;} ul.jobInfo li {margin-bottom:12px;} ol.jobDesc { list-style:upper-alpha; margin: 20px; padding-left:10px} ol.jobDesc li {list-style:upper-alpha; margin-left: 20px; padding-left:10px} ol.subJobDesc { list-style:decimal; margin: 20px; padding-left:0px} ol.subJobDesc li {list-style:decimal; margin-left: 20px; padding-left:10px; line-height:24px;} #drivingbox { width:200px; float:right; margin-right:10px;} #rHead {height: 20px; width: 100%; background-color: #673401; border: 1px solid #673401;} #rHead img {margin-top: 5px; margin-left: 20px;} #rHead p {text-transform: uppercase; display: inline; color: white; margin: 0; margin-left: 10px; font-weight: bold;} #rMain {width: 100%; border: 1px solid #673401; background-color: #ccc; margin-bottom: 10px;} #rMain p {font-size: 11px; line-height: 1.2em; margin: 12px; margin-bottom: 1em;} #rMain li {font-size: 11px; margin: 9px; margin-bottom: 9px;} /*============== Alumni Forms ===============*/ div#alumniform { border:1px solid #999999; width:555px; margin:0 auto; background-color:#c2dcef; padding:20px;color:#555;font-family:"Arial","Lucida Grande",Garuda,sans-serif; } input, select, textarea { font-size: 85%; background: #fff; line-height: 1em !important; vertical-align: middle; margin-bottom:5px; } textarea, input[type="text"], input[type="password"] { width: 400px; border: 5px solid #fff; } input#id_year,input#id_phone1 { width: 50px;} input#id_phone2 {width:70px} input#id_othercountry { width: 250px;} input#id_add {width:550px;} label { display: block; font-weight: bold; font-size: 85%; margin-bottom: 2px;font-family:"Arial","Lucida Grande",Garuda,sans-serif; color:#555} .button { padding: 2px 6px; font-size: 85%; vertical-align: middle; border: 1px solid #fff; font-weight: bold;} select { border: 3px solid #fff;} div#alumniform p{ font-size:10px; line-height:normal;margin-bottom:10px;} /*============== Right Side Form ===============*/ div#rightcolumn_form { width: 220px; display: inline; float: left; margin:3px 0 0 0; background: url(../images/bg_rightform.jpg) center top repeat-y} #rightcolumn_form table { margin-left:20px; width:180px;} #rightcolumn_form td { margin-bottom:10px;font-family:"Arial","Lucida Grande",Garuda,sans-serif; color:#333; font-size:11px; padding:1px;} #rightcolumn_form td.date { text-align:right} #rightcolumn_form td.age { text-align:center; color:#555} /*============== footer ===============*/ #footer p { text-align:center; font-size:11px; margin-right:160px;} #footer p.below { margin-right:20px; text-align:right; margin-top:18px;font-size:11px; color:#673401;font-family:"Arial","Lucida Grande",Garuda,sans-serif;} #footermenu {width:700px; height:60px; background:url(../images/rental_footermenu.jpg) no-repeat; text-align: center;clear: left; margin:10px auto 0 auto;} #footermenu li{ display: block; float: left; text-align: center;} #footermenu li a span{ display:none;} #footermenu li a{ height:60px; display: block;} #footer_anglican a {float:right; margin:10px 18px; width:167px; height:61px; background:url(../images/footer_anglican.png); text-indent:-10000px; outline:none;} /* -- Hovers -- */ #footermenu li a#footer_cc {width:170px; margin-right:15px;} #footermenu li a#footer_cc:hover{ background: url(../images/rental_footermenu.jpg) 0px -58px;} #footermenu li a#footer_bcca { width:64px; margin-right:20px;} #footermenu li a#footer_bcca:hover{ background: url(../images/rental_footermenu.jpg) -185px -58px;} #footermenu li a#footer_fcc { width:103px; margin-right:20px;} #footermenu li a#footer_fcc:hover{ background: url(../images/rental_footermenu.jpg) -269px -58px;} #footermenu li a#footer_v3 { width:100px;} #footermenu li a#footer_v3:hover{ background: url(../images/rental_footermenu.jpg) -392px -58px;} #footermenu li { display:inline; } #downloadlist h5 { font-size: 20px; color: #000000; font-weight:bold; } #downloadlist li a:hover { background:url(../images/download_icon.gif) no-repeat right #e0e0e0;} #downloadlist li a { background:url(../images/download_icon.gif) no-repeat right;} #downloadlist ul { border: 1px solid #e7e7e7; width: 620px; margin: 0; padding: 0;} #downloadlist ul li a { padding: 10px; display: block; width: 600px; clear: both; text-decoration:none; height:30px; } #downloadlist ul li { background: #c2dcef; height:50px; border-bottom: 1px solid #dbdbdb; margin-bottom:10px; } .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} .clearfix { display: inline-block;} html[xmlns] .clearfix { display: block;} * html .clearfix { height: 1%;} /*============== SiFR ===============*/ .sIFR-flash {visibility: visible !important;margin: 0;} .sIFR-replaced {visibility: visible !important;} span.sIFR-alternate {position: absolute;left: 0;top: 0;width: 0;height: 0;display: block;overflow: hidden;} .sIFR-hasFlash #content h1 { visibility:hidden;}