body {background-color: #e1d4c6; font-family: 'arial', sans-serif; font-size: 1em;} *.site-main {max-width: 75em; margin-left: auto; margin-right: auto; background-color: #FFFFFF; height: 100vh; /*height to be removed once stuff is got*/} *.site-main:after {content: ""; display: table; clear: both; background-color: #FFFFFF;} /*HEADING TAGS*/ /*h1 - Header Greeting - italic blue - center*/ /*h2 - Header greeting - normal blue - center*/ /*h3 - Subtitles - normal blue*/ /*h4 - Subtitles 2 - normal blue*/ /*h5 - same size - bold*/ /*h6 - same size - bold - center*/ h1 {font-weight: bold; color: #ffffff; text-align: center;} h2 {font-weight: bold; color: #00103D; text-align: center;} h3 {font-weight: bold; color: #00103D;} h4 {font-weight: bold; color: #00103D;} h5 {font-weight: bold;} h6 {font-weight: bold; text-align: center;} ul.a {list-style-type:disc;} ul.b {list-style-type:square;} ul.c {list-style-type:circle;} ul.d {list-style-type:none;} ol.a {list-style-type:decimal;} ol.b {list-style-type:lower-alpha;} ol.c {list-style-type:upper-alpha;} ol.d {list-style-type:lower-roman;} ol.e {list-style-type:upper-roman;} p.welcome {font-weight: bold; color: #00103D; text-align: center; font-size:300%; text-align: center; font-style:italic} p.center {text-align: center;} #header {float: left; background: #00103D; color: #ffffff; width: 100%; font-family: 'Times New Roman', serif; font-weight: bold; text-align: center;} #emailheader {float: left; background: #00103D; color: #ffffff; width: 100%; font-family: 'Times New Roman', serif; font-weight: bold; text-align: left;} #email2 {float: left; background: #00103D; color: #ffffff; width: 100%; font-family: 'Times New Roman', serif; font-weight: bold; text-align: center; height: 30px;} #homemain {float: left; background-color: #ffffff; width: 100%;} #chcffooter {float:left; width: 100%; background-color: #ffffff; color: #000000; font-size: 1em; text-align: center;} #meetingsmain {float: left; background-color: #ffffff; width: 100%;} #youngpeoplemain {float: left; background-color: #ffffff; width: 100%;} #christmasmain {float: left; background-color: #ffffff; width: 100%;} #gospelmain {float: left; background-color: #ffffff; width: 100%;} #gospelmessage {float: left; background-color: #ffffff; width: 92%; margin:auto; padding-left: 4%;} #directionsmain {float: left; background-color: #ffffff; width: 100%;} #believemain {float: left; background-color: #ffffff; width: 100%;} #visitorsmain {float: left; background-color: #ffffff; width: 100%;} #historymain {float: left; background-color: #ffffff; width: 100%;} #anniversarymain {float: left; background-color: #ffffff; width: 100%;} #anniversaryreport {float: left; background-color: #ffffff; width: 92%; margin:auto; padding-left: 4%;} #anniversaryaddress {float: left; background-color: #ffffff; width: 92%; margin:auto; padding-left: 4%;} #mediamain {float: left; background-color: #ffffff; width: 100%;} #linksmain {float: left; background-color: #ffffff; width: 100%;} /*HOME GENERAL*/ #noticeboard {float: left; background-color: #ffffff; width: 100%;} img.noticeboardstatic {width:100%} #bibleverse {float: left; background-color: #E1D4C6; width: 100%; padding-bottom: 15px; padding-top: 15px; text-align: center; } #homecols1-2cont2,#homecols3-4cont2,#homecols5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour border:*/ } #homecols1-2cont1,#homecols3-4cont1,#homecols5-6cont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */ /*padding-bottom: 15px; padding-top: 15px;*//*padding to separate from above/below*/} #homecols3-4cont2,#homecols3-4cont1 {background-color: #E1D4C6;} #homecols1,#homecols3,#homecols5 {float: left; width: 46%; position: relative; left: 52%; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols2,#homecols4,#homecols6 {float: left; width: 46%; position: relative; left: 56%; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols1 p,#homecols2 p,#homecols3 p,#homecols4 p,#homecols5 p,#homecols6 p {text-align: left;} #homecols3,#homecols4 {padding-top: 15px;} #homecols4 p {text-align: center; vertical-align: middle;} img.fblogo {width:10%; border-radius: 50%; float: center;} img.emaillogo {width:10%; border-radius: 50%; float: center;} .home-latest-broadcast-details {padding-left: 5px; padding-right: 5px; text-align: left;} .home-latest-broadcast {width: 45%; border: 5px solid #00103D; display: table-cell; vertical-align: middle;} .home-latest-broadcast-title-text {background-color: #00103D; font-weight: bold; vertical-align: middle; font-size: 150%; color: #ffffff; padding-top: 5px; padding-bottom: 7px;} .home-latest-broadcast-icon {width: 35px; height: 35px; clear: both; float: left;} .home-latest-broadcast-section {vertical-align: middle; list-style: none; border: 1px solid #3363ff; padding-left: 0px; margin-left: 5px; margin-right: 5px; display: block;} .home-latest-broadcast-section-item {border: 1px solid #00103D;} .home-latest-broadcast-section-item a {vertical-align: middle; text-align: center; display: block; height: 35px; min-width: 290px; color: #00103D; text-decoration: none; line-height: 40px;} .home-latest-broadcast-section-item a:hover {background-color: #00103D; color: #ffffff;} .home-latest-broadcast-details-title {font-size: 125%; text-align: left; color: #000000; font-weight: bold;} /* New rules */ .home-section-container {display: table; width: 100%;} .home-section-row {display: table-row;} .home-content-scroller {display: table-cell; background-color: #ffffff; color: #000000; vertical-align: middle; padding: 5%;} .home-content-nav {text-align: center; vertical-align: middle; display: table-cell; background-color: #00103D; color: #ffffff; width: 2%;} .home-content-column-separator {display: table-cell; width: 10px;} #home-content-scroller {float: none;} #timecount {float: left; background-color: #ffffff; width: 50%; padding-left: 25%;} #timecount3 {clear: left; float: left; width: 100%; overflow: hidden; background: #ffffff; /* column 3 background colour */ } #timecount2 {clear: left; float: left; width: 100%; position: relative; right: 33.333%; background: #ffffff; /* column 2 background colour */ } #timecount1 {float: left; width: 100%; position: relative; right: 33.33%; background: #ffffff; /* column 1 background colour */ vertical-align: text-bottom;} #datetime {float: left; width: 29.33%; position: relative; left: 68.67%; overflow: hidden; text-align: center; vertical-align: text-bottom; padding-top: 15px;} #countimg {float: left; width: 29.33%; position: relative; left: 72.67%; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} #counter {float: left; width: 29.33%; position: relative; left: 76.67%; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} img.counterlogo {margin-left: auto; margin-right: auto; width: 100%;} img.counter {margin-left: auto; margin-right: auto; width: 80%;} /*HOME GENERAL end*/ /*HISTORY GENERAL*/ #historymain p {padding-left: 15px; padding-right: 3px;} #historyphotos1-2cont2,#historycaptions1-2cont2,#historyphotos3-4cont2,#historycaptions3-4cont2,#historyphotos5-6cont2,#historycaptions5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour border:*/ } #historyphotos1-2cont1,#historycaptions1-2cont1,#historyphotos3-4cont1,#historycaptions3-4cont1,#historyphotos5-6cont1,#historycaptions5-6cont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #historyphotos1,#historycaptions1,#historyphotos3,#historycaptions3,#historyphotos5,#historycaptions5 {float: left; width: 46%; position: relative; left: 52%; overflow: hidden; text-align: center; vertical-align: bottom;} #historyphotos2,#historycaptions2,#historyphotos4,#historycaptions4,#historyphotos6,#historycaptions6 {float: left; width: 46%; position: relative; left: 56%; overflow: hidden; text-align: center; vertical-align: bottom;} #historyphotos2 p,#historycaptions2 p,#historyphotos4 p,#historycaptions4 p,#historyphotos6 p,#historycaptions6 p {text-align: left;} img.historyphoto {width: 75%; margin: auto;} /*END HISTORY GENERAL*/ #linkschurches,#linkswebsites {width: 100%; padding-top: 15px;} /*MEETINGS GENERAL*/ #bobcont2,#sundayschoolcont2,#prayermtgcont2,#biblestudycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ padding-top: 15px; } #bobcont1,#sundayschoolcont1,#prayermtgcont1,#biblestudycont1 {float: left; width: 100%; margin: auto; position: relative; right: 25%; background-color: #ffffff; /* column 1 background colour */ padding-top: 15px;} #boblogo,#sundayschoollogo,#prayermtglogo,#biblestudylogo {float: left; width: 15%; position: relative; left: 27%; overflow: hidden;} #prayermtglogo {text-align: center;} #bobinfo,#sundayschoolinfo,#prayermtginfo,#biblestudyinfo {float: left; width: 78%; position: relative; left: 30%; overflow: hidden;} img.boblogo,img.sundayschoollogo,img.prayermtglogo,img.biblestudylogo {width: 100%; margin: auto;} /*END MEETINGS GENERAL*/ /*YP SUNDAYSCHOOL GENERAL*/ #ypsundayschool {float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */ padding-top: 15px; padding-bottom: 15px; text-align:center;} img.ypsundayschoollogo {width: 50%; margin: auto;} /*END MEETINGS GENERAL*/ /*DIRECTIONS GENERAL*/ #carcont2,#buscont2,#traincont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ padding-top: 15px; } #carcont1,#buscont1,#traincont1 {float: left; width: 100%; margin: auto; position: relative; right: 25%; background-color: #ffffff; /* column 1 background colour */ padding-top: 15px;} #carlogo,#buslogo,#trainlogo {float: left; width: 15%; position: relative; left: 27%; overflow: hidden;} #trainlogo {text-align: center;} #carinfo,#businfo,#traininfo {float: left; width: 78%; position: relative; left: 30%; overflow: hidden;} img.carlogo,img.buslogo,img.trainlogo {width: 100%; margin: auto;} img.trainlogo {width: 50%; margin: auto;} /*END DIRECTIONS GENERAL*/ /*VISITORS GENERAL*/ #whocont2,#whichservicecont2,#locationcont2,#versioncont2,#disabilitiescont2,#visitorhistorycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ padding-top: 15px; } #whocont1,#whichservicecont1,#locationcont1,#versioncont1,#disabilitiescont1,#visitorhistorycont1 {float: left; width: 100%; margin: auto; position: relative; right: 25%; background-color: #ffffff; /* column 1 background colour */ padding-top: 15px;} #whologo,#whichservicelogo,#locationlogo,#versionlogo,#disabilitieslogo,#visitorhistorylogo {float: left; width: 15%; position: relative; left: 27%; overflow: hidden;} #locationlogo {text-align: center;} #whoinfo,#whichserviceinfo,#locationinfo,#versioninfo,#disabilitiesinfo,#visitorhistoryinfo {float: left; width: 78%; position: relative; left: 30%; overflow: hidden;} img.whologo,img.whichservicelogo,img.locationlogo,img.versionlogo,img.disabilitieslogo,img.visitorhistorylogo {width: 100%; margin: auto;} img.locationlogo {width: 50%; margin: auto;} /*END VISITORS GENERAL*/ /*LINKS GENERAL*/ #ashcroftcont2,#cornerstonecont2,#edgefieldcont2,#elchoplacecont2,#fairfieldcont2,#heathfieldcont2,#mountpleasantcont2,#peelcont2,#straightsmouthcont2,#jesuslovesmecont2,#biblegatewaycont2,#truthfortodaycont2,#scripturetruthpubcont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ padding-top: 15px;} #ashcroftcont1,#cornerstonecont1,#edgefieldcont1,#elchoplacecont1,#fairfieldcont1,#heathfieldcont1,#mountpleasantcont1,#peelcont1,#straightsmouthcont1,#jesuslovesmecont1,#biblegatewaycont1,#truthfortodaycont1,#scripturetruthpubcont1 {float: left; width: 100%; margin: auto; position: relative; right: 25%; background-color: #ffffff; /* column 1 background colour */ padding-top: 15px;} #ashcroftlogo,#cornerstonelogo,#edgefieldlogo,#elchoplacelogo,#fairfieldlogo,#heathfieldlogo,#mountpleasantlogo,#peellogo,#straightsmouthlogo,#jesuslovesmelogo,#biblegatewaylogo,#truthfortodaylogo,#scripturetruthpublogo {float: left; width: 15%; position: relative; left: 27%; overflow: hidden;} #ashcroftinfo,#cornerstoneinfo,#edgefieldinfo,#elchoplaceinfo,#fairfieldinfo,#heathfieldinfo,#mountpleasantinfo,#peelinfo,#straightsmouthinfo,#jesuslovesmeinfo,#biblegatewayinfo,#truthfortodayinfo,#scripturetruthpubinfo {float: left; width: 78%; position: relative; left: 30%; overflow: hidden;} img.ashcroftlogo,img.cornerstonelogo,img.edgefieldlogo,img.elchoplacelogo,img.fairfieldlogo,img.heathfieldlogo,img.mountpleasantlogo,img.peellogo,img.straightsmouthlogo,img.jesuslovesmelogo,img.biblegatewaylogo,img.truthfortodaylogo,img.scripturetruthpublogo {width: 100%; margin: auto;} /*END LINKS GENERAL*/ /*ANNIVERSARY GENERAL*/ p.addresstitle {text-align: center; font-size: 200%; font-variant:small-caps; font-weight: bold;} p.addressheading {font-size: 150%; font-variant:small-caps; font-weight: bold;} p.hymn {text-align: center; font-style: italic;} p.quote {font-style: italic; font-weight: bold; margin-left: 5%; margin-right: 5%;} p.addsubhead {font-style: italic; font-weight: bold; text-align: center; margin-left: 25%; margin-right: 25%;} p.author {text-align: right;} p.anniversary {font-size: 400%; text-align: center; font-weight: bold; color: #00103D;} /*END ANNIVERSARY GENERAL*/ /*MEDIA GENERAL*/ .mediadownload {text-align: center; height: 25px;} .mediaprog {text-align: left;} .mediahead {text-align: left; font-weight: bold;} .mediainfo {text-align: center; color: #00103D; width:50%;} .mediatitle {font-size: 125%; text-align: left; color: #00103D; font-weight: bold;} /*Make dropdown links vertical*/ #media01dwnld li,#media02dwnld li,#media03dwnld li,#media04dwnld li,#media05dwnld li,#media06dwnld li,#media07dwnld li,#media08dwnld li,#media09dwnld li,#media10dwnld li {display: block; float: left; width: 98%;} /*Prevent text wrapping*/ #media01dwnld li a,#media02dwnld li a,#media03dwnld li a,#media04dwnld li a,#media05dwnld li a,#media06dwnld li a,#media07dwnld li a,#media08dwnld li a,#media09dwnld li a,#media10dwnld li a {width: 200px; padding: 0 5px;} #media01cont2,#media02cont2,#media03cont2,#media04cont2,#media05cont2,#media06cont2,#media07cont2,#media08cont2,#media09cont2,#media10cont2 {clear: left; float: left; width: 100%; position: relative; overflow: hidden; background-color: #ffffff; border: 1px solid #00103D;} /* column 2 background colour */ #media01info,#media02info,#media03info,#media04info,#media05info,#media06info,#media07info,#media08info,#media09info,#media10info {float: left; width: 60%; position: relative; left: 5%; overflow: hidden; text-align: center;} #media01dwnld,#media02dwnld,#media03dwnld,#media04dwnld,#media05dwnld,#media06dwnld,#media07dwnld,#media08dwnld,#media09dwnld,#media10dwnld {float: right; width: 35%; overflow: hidden; height: 100%; height: 100%; margin-top:18px} /*Strip the ul of padding and list styling*/ #media01cont2 ul,#media02cont2 ul,#media03cont2 ul,#media04cont2 ul,#media05cont2 ul,#media06cont2 ul,#media07cont2 ul,#media08cont2 ul,#media09cont2 ul,#media10cont2 ul {list-style-type: none; margin: 0; padding: 0; position: relative;} /*keep*/ /*Create a horizontal list with spacing*/ #media01cont2 li,#media02cont2 li,#media03cont2 li,#media04cont2 li,#media05cont2 li,#media06cont2 li,#media07cont2 li,#media08cont2 li,#media09cont2 li,#media10cont2 li {display: inline-block; float: left; margin-right: 0px;} /*Style for menu links*/ #media01cont2 li a,#media02cont2 li a,#media03cont2 li a,#media04cont2 li a,#media05cont2 li a,#media06cont2 li a,#media07cont2 li a,#media08cont2 li a,#media09cont2 li a,#media10cont2 li a {display: block; height: 35px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #00103D; background-color: #ffffff; text-decoration: none; border: 1px solid #00103D;} /*end of keep*/ /*Hover state for top level links*/ #media01cont2 li:hover a,#media02cont2 li:hover a,#media03cont2 li:hover a,#media04cont2 li:hover a,#media05cont2 li:hover a,#media06cont2 li:hover a,#media07cont2 li:hover a,#media08cont2 li:hover a,#media09cont2 li:hover a,#media10cont2 li:hover a {background: #00103D; color: #ffffff; border: 1px solid #00103D;} #media01cont2 ul li img.mediahtml,#media02cont2 ul li img.mediahtml,#media03cont2 ul li img.mediahtml,#media04cont2 ul li img.mediahtml,#media05cont2 ul li img.mediahtml,#media06cont2 ul li img.mediahtml,#media07cont2 ul li img.mediahtml,#media08cont2 ul li img.mediahtml,#media09cont2 ul li img.mediahtml,#media10cont2 ul li img.mediahtml {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediawatch,#media02cont2 ul li img.mediawatch,#media03cont2 ul li img.mediawatch,#media04cont2 ul li img.mediawatch,#media05cont2 ul li img.mediawatch,#media06cont2 ul li img.mediawatch,#media07cont2 ul li img.mediawatch,#media08cont2 ul li img.mediawatch,#media09cont2 ul li img.mediawatch,#media10cont2 ul li img.mediawatch {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediapdf,#media02cont2 ul li img.mediapdf,#media03cont2 ul li img.mediapdf,#media04cont2 ul li img.mediapdf,#media05cont2 ul li img.mediapdf,#media06cont2 ul li img.mediapdf,#media07cont2 ul li img.mediapdf,#media08cont2 ul li img.mediapdf,#media09cont2 ul li img.mediapdf,#media10cont2 ul li img.mediapdf {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediamp3,#media02cont2 ul li img.mediamp3,#media03cont2 ul li img.mediamp3,#media04cont2 ul li img.mediamp3,#media05cont2 ul li img.mediamp3,#media06cont2 ul li img.mediamp3,#media07cont2 ul li img.mediamp3,#media08cont2 ul li img.mediamp3,#media09cont2 ul li img.mediamp3,#media10cont2 ul li img.mediamp3 {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01dwnldotr,#media02dwnldotr,#media03dwnldotr,#media04dwnldotr,#media05dwnldotr,#media06dwnldotr,#media07dwnldotr,#media08dwnldotr,#media09dwnldotr,#media10dwnldotr {display: table; position: absolute; height: 100%; width: 100%;} #media01dwnldmid,#media02dwnldmid,#media03dwnldmid,#media04dwnldmid,#media05dwnldmid,#media06dwnldmid,#media07dwnldmid,#media08dwnldmid,#media09dwnldmid,#media10dwnldmid {display: table-cell; vertical-align: middle;} #media01dwnldinr,#media02dwnldinr,#media03dwnldinr,#media04dwnldinr,#media05dwnldinr,#media06dwnldinr,#media07dwnldinr,#media08dwnldinr,#media09dwnldinr,#media10dwnldinr {margin-left: auto; margin-right: auto;} /*END MEDIA GENERAL*/ /* Tiny Screens */ @media screen and (max-width: 319px) { h1 {font-size: 200%;} /*NAVIGATION MENU <319*/ .row2 {display:none;} #nav {float: left; background: #00103D; width: 100%; border-top: solid 0.0625em #00103D; border-bottom: solid 0.0625em #00103D;} /*Strip the ul of padding and list styling*/ #nav ul {list-style-type: none; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 10;} /*Create a horizontal list with spacing*/ #nav li {display: inline-block; float: left; margin-right: 0em; position: static;} /*Style for menu links*/ #nav li a {display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} /*Hover state for top level links*/ #nav li:hover a {background: #E1D4C6; color: #00103D;} /*Style for dropdown links*/ #nav li:hover ul a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} /*Hover state for dropdown links*/ #nav li:hover ul a:hover {background: #00103D; color: #E1D4C6;} /*Hide dropdown links until they are needed*/ .hidden {display: none;} /*Make dropdown links vertical*/ #nav li ul li {display: block;} /*Prevent text wrapping*/ #nav li ul li a {width: 100%;} /*Display the dropdown onhover*/ #nav ul li a:hover + .hidden, .hidden:hover {display: block;} /*Style 'show menu' label button and hide it by default*/ #nav .show-menu {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #E1D4C6; background: #00103D; border-top: solid 3px #00103D; vertical-align: middle; text-align: center; display: none; font-weight: bold;} /*Hide checkbox*/ #nav input[type=checkbox]{display: none;} /*Show menu when invisible checkbox is checked*/ #nav input[type=checkbox]:checked ~ #menu{display: block;} #show-menu-activities:checked ~ .hidden {display: block;} #activities-menu li a {background: #E1D4C6; color: #00103D; height: 40px; border-top:0.0625em solid #00103D;} #show-menu-about:checked ~ .hidden {display: block;} #about-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-about-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-show-menu-about:checked ~ .hidden {display: block;} #show-menu-resources:checked ~ .hidden {display: block;} #resources-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-resources-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-show-menu-resources:checked ~ .hidden {display: block;} /*Make dropdown links appear inline*/ #nav ul {position: static; /*display: none;*/ } #menu {display: none;} /*Create vertical spacing*/ #nav li {border-bottom:0.0625em solid #E1D4C6;} /*Make all menu links full width*/ #nav ul li, li {width: 100%; border-top: 0em;} /*Display 'show menu' link*/ #nav .show-menu {cursor: pointer; display: block; height: 41px; line-height: 40px; float: left; width: 100%;} .show-menu#activities-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#about-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#drop-about-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#resources-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#drop-resources-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} /*Hide checkbox*/ #nav input[type=checkbox] {display: none;} /*Show menu when invisible checkbox is checked*/ #nav input[type=checkbox]:checked ~ #menu{display: block;} #nav li.navhome,#nav li.navactivities,#nav li.drop-navservices,#nav li.drop-navchildren,#nav li.drop-navchristmas,#nav li.navgospel,#nav li.navabout,#nav li.drop-location,#nav li.drop-beliefs,#nav li.drop-visitors,#nav li.drop-history,#nav li.drop-2009,#nav li.navresources,#nav li.drop-resources,#nav li.drop-media,#nav li.drop-links,#nav li.navctc {width: 100%;} /*END NAVIGATION MENU <319 */ /*HOME <319*/ #noticeboard {float: left; background-color: #ffffff; width: 100%;} img.noticeboardstatic {width:100%} #bibleverse {float: left; background-color: #E1D4C6; width: 100%; padding-bottom: 15px; padding-top: 15px; text-align: center; } #homecols1-2cont2,#homecols3-4cont2,#homecols5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour border:*/ } #homecols1-2cont1,#homecols3-4cont1,#homecols5-6cont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */ /*padding-bottom: 15px; padding-top: 15px;*//*padding to separate from above/below*/} #homecols3-4cont2,#homecols3-4cont1 {background-color: #E1D4C6;} #homecols1,#homecols3,#homecols5 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols2,#homecols4,#homecols6 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols1 p,#homecols2 p,#homecols3 p,#homecols4 p,#homecols5 p,#homecols6 p {text-align: left;} #homecols3,#homecols4 {padding-top: 15px;} #homecols4 p {text-align: center; vertical-align: middle;} img.fblogo {width:10%; border-radius: 50%; float: center;} img.emaillogo {width:10%; border-radius: 50%; float: center;} .home-latest-broadcast-details {padding-left: 5px; padding-right: 5px; text-align: left;} .home-latest-broadcast {width: 45%; border: 5px solid #00103D; display: table-cell; vertical-align: middle;} .home-latest-broadcast-title-text {background-color: #00103D; font-weight: bold; vertical-align: middle; font-size: 150%; color: #ffffff; padding-top: 5px; padding-bottom: 7px;} .home-latest-broadcast-icon {width: 35px; height: 35px; clear: both; float: left;} .home-latest-broadcast-section {vertical-align: middle; list-style: none; border: 1px solid #3363ff; padding-left: 0px; margin-left: 5px; margin-right: 5px; display: block;} .home-latest-broadcast-section-item {border: 1px solid #00103D;} .home-latest-broadcast-section-item a {vertical-align: middle; text-align: center; display: block; height: 35px; min-width: 290px; color: #00103D; text-decoration: none; line-height: 40px;} .home-latest-broadcast-section-item a:hover {background-color: #00103D; color: #ffffff;} .home-latest-broadcast-details-title {font-size: 125%; text-align: left; color: #000000; font-weight: bold;} /* New rules */ .home-section-container {display: block;} .home-section-row {display: block;} .home-content-scroller {vertical-align: middle; width: 98%;} .home-content-nav {text-align: center; vertical-align: middle; display: table-cell; background-color: #00103D; color: #ffffff; width: 2%;} .home-content-column-separator {display: table-cell; width: 10px;} #home-content-scroller {float: none;} #timecount {float: left; background-color: #ffffff; width: 30%; padding-left: 30%;} #timecount3 {clear: left; float: left; width: 100%; overflow: hidden; background: #ffffff; /* column 3 background colour */ } #timecount2 {clear: left; float: left; width: 100%; position: relative; right: 33.333%; background: #ffffff; /* column 2 background colour */ } #timecount1 {float: left; width: 100%; position: relative; right: 33.33%; background: #ffffff; /* column 1 background colour */ vertical-align: text-bottom;} #datetime {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: text-bottom; padding-top: 15px;} #countimg {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} #counter {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} img.counterlogo {margin-left: auto; margin-right: auto; width: 100%;} img.counter {margin-left: auto; margin-right: auto; width: 80%;} /*END HOME <319/ /*MEETINGS <319*/ #bobcont2,#sundayschoolcont2,#prayermtgcont2,#biblestudycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #bobcont1,#sundayschoolcont1,#prayermtgcont1,#biblestudycont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #boblogo,#sundayschoollogo,#prayermtglogo,#biblestudylogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #bobinfo,#sundayschoolinfo,#prayermtginfo,#biblestudyinfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.boblogo,img.sundayschoollogo,img.prayermtglogo,img.biblestudylogo {width: 30%; margin: auto;} /*MEETINGS <319*/ /*DIRECTIONS <319*/ #carcont2,#buscont2,#traincont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #carcont1,#buscont1,#traincont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #carlogo,#buslogo,#trainlogo {clear: both; clear: both; float: left; margin: auto; width: 90%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #carinfo,#businfo,#traininfo {float: left; width: 100%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.carlogo,img.buslogo,img.trainlogo {width: 30%; margin: auto;} /*END DIRECTIONS <319*/ /*VISITORS <319*/ #whocont2,#whichservicecont2,#locationcont2,#versioncont2,#disabilitiescont2,#visitorhistorycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #whocont1,#whichservicecont1,#locationcont1,#versioncont1,#disabilitiescont1,#visitorhistorycont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #whologo,#whichservicelogo,#locationlogo,#versionlogo,#disabilitieslogo,#visitorhistorylogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #whoinfo,#whichserviceinfo,#locationinfo,#versioninfo,#disabilitiesinfo,#visitorhistoryinfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.whologo,img.whichservicelogo,img.locationlogo,img.versionlogo,img.disabilitieslogo,img.visitorhistorylogo {width: 30%; margin: auto;} /*END VISITORS <319*/ /*HISTORY <319*/ #historymain p.paper {font-style: italic; width: 90%; margin: auto; padding-top: 7.5px; padding-bottom: 7.5px;} p.photoinfo {text-align: left; padding-right: 3px; padding-right:10px;} /*#historymain p.photocaption {display: none;}*/ #historycaptions1-2cont2,#historycaptions3-4cont2,#historycaptions5-6cont2 {display: none;} #historyphotos1-2cont2,#historyphotos3-4cont2,#historyphotos5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ /*border: solid 1px #3663ff;*/} #historyphotos1-2cont1,#historyphotos3-4cont1,#historyphotos5-6cont1 {clear: both; float: left; width: 100%; position: static; background-color: #ffffff; /* column 1 background colour */} #historyphotos1,#historyphotos3,#historyphotos5 {clear: both; clear: both; float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} #historyphotos2,#historyphotos4,#historyphotos6 {float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} img.historyphoto {width: 75%; margin: auto;} /*END HISTORY <319*/ /*MEDIA <319*/ .mediadownload {text-align: center; height: 25px;} .mediaprog {text-align: left;} .mediahead {text-align: left; font-weight: bold;} .mediainfo {text-align: center; color: #00103D; width:50%;} .mediatitle {font-size: 100%; text-align: left; color: #00103D; font-weight: bold;} /*Make dropdown links vertical*/ #media01dwnld li,#media02dwnld li,#media03dwnld li,#media04dwnld li,#media05dwnld li,#media06dwnld li,#media07dwnld li,#media08dwnld li,#media09dwnld li,#media10dwnld li {background-color: #ffffff; display: block; float: none; width: 96%;} /*Prevent text wrapping*/ #media01dwnld li a,#media02dwnld li a,#media03dwnld li a,#media04dwnld li a,#media05dwnld li a,#media06dwnld li a,#media07dwnld li a,#media08dwnld li a,#media09dwnld li a,#media10dwnld li a {width: 100%; padding: 0 5px;} #media01cont2,#media02cont2,#media03cont2,#media04cont2,#media05cont2,#media06cont2,#media07cont2,#media08cont2,#media09cont2,#media10cont2 {clear: left; float: left; width: 100%; position: relative; overflow: hidden; background-color: #ffffff; border: 1px solid #00103D;} /* column 2 background colour */ #media01info,#media02info,#media03info,#media04info,#media05info,#media06info,#media07info,#media08info,#media09info,#media10info {float: left; width: 100%; position: relative; left: 5%; overflow: hidden; text-align: center;} #media01dwnld,#media02dwnld,#media03dwnld,#media04dwnld,#media05dwnld,#media06dwnld,#media07dwnld,#media08dwnld,#media09dwnld,#media10dwnld {background-color: #ffffff; float: left; width: 100%; position: relative; left: 5%; padding-bottom: 10px;} /*Strip the ul of padding and list styling*/ #media01cont2 ul,#media02cont2 ul,#media03cont2 ul,#media04cont2 ul,#media05cont2 ul,#media06cont2 ul,#media07cont2 ul,#media08cont2 ul,#media09cont2 ul,#media10cont2 ul {list-style-type: none; margin: 0; padding: 0; position: relative; width: 100%;} /*keep*/ /*Create a horizontal list with spacing*/ #media01cont2 li,#media02cont2 li,#media03cont2 li,#media04cont2 li,#media05cont2 li,#media06cont2 li,#media07cont2 li,#media08cont2 li,#media09cont2 li,#media10cont2 li {display: inline-block; float: left; margin-right: 0px; width: 85%;} /*Style for menu links*/ #media01cont2 li a,#media02cont2 li a,#media03cont2 li a,#media04cont2 li a,#media05cont2 li a,#media06cont2 li a,#media07cont2 li a,#media08cont2 li a,#media09cont2 li a,#media10cont2 li a {display: block; width: 100%; height: 35px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #00103D; background-color: #ffffff; text-decoration: none; border: 1px solid #00103D;} /*end of keep*/ /*Hover state for top level links*/ #media01cont2 li:hover a,#media02cont2 li:hover a,#media03cont2 li:hover a,#media04cont2 li:hover a,#media05cont2 li:hover a,#media06cont2 li:hover a,#media07cont2 li:hover a,#media08cont2 li:hover a,#media09cont2 li:hover a,#media10cont2 li:hover a {background: #00103D; color: #ffffff; border: 1px solid #00103D;} #media01cont2 ul li img.mediahtml,#media02cont2 ul li img.mediahtml,#media03cont2 ul li img.mediahtml,#media04cont2 ul li img.mediahtml,#media05cont2 ul li img.mediahtml,#media06cont2 ul li img.mediahtml,#media07cont2 ul li img.mediahtml,#media08cont2 ul li img.mediahtml,#media09cont2 ul li img.mediahtml,#media10cont2 ul li img.mediahtml {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediawatch,#media02cont2 ul li img.mediawatch,#media03cont2 ul li img.mediawatch,#media04cont2 ul li img.mediawatch,#media05cont2 ul li img.mediawatch,#media06cont2 ul li img.mediawatch,#media07cont2 ul li img.mediawatch,#media08cont2 ul li img.mediawatch,#media09cont2 ul li img.mediawatch,#media10cont2 ul li img.mediawatch {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediapdf,#media02cont2 ul li img.mediapdf,#media03cont2 ul li img.mediapdf,#media04cont2 ul li img.mediapdf,#media05cont2 ul li img.mediapdf,#media06cont2 ul li img.mediapdf,#media07cont2 ul li img.mediapdf,#media08cont2 ul li img.mediapdf,#media09cont2 ul li img.mediapdf,#media10cont2 ul li img.mediapdf {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediamp3,#media02cont2 ul li img.mediamp3,#media03cont2 ul li img.mediamp3,#media04cont2 ul li img.mediamp3,#media05cont2 ul li img.mediamp3,#media06cont2 ul li img.mediamp3,#media07cont2 ul li img.mediamp3,#media08cont2 ul li img.mediamp3,#media09cont2 ul li img.mediamp3,#media10cont2 ul li img.mediamp3 {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01dwnldotr,#media02dwnldotr,#media03dwnldotr,#media04dwnldotr,#media05dwnldotr,#media06dwnldotr,#media07dwnldotr,#media08dwnldotr,#media09dwnldotr,#media10dwnldotr {display: table; position: relative; height: 100%; width: 100%;} #media01dwnldmid,#media02dwnldmid,#media03dwnldmid,#media04dwnldmid,#media05dwnldmid,#media06dwnldmid,#media07dwnldmid,#media08dwnldmid,#media09dwnldmid,#media10dwnldmid {display: table-cell; vertical-align: middle;} #media01dwnldinr,#media02dwnldinr,#media03dwnldinr,#media04dwnldinr,#media05dwnldinr,#media06dwnldinr,#media07dwnldinr,#media08dwnldinr,#media09dwnldinr,#media10dwnldinr {margin-left: auto; margin-right: auto;} /*END MEDIA <319*/ /*LINKS <319*/ #ashcroftcont2,#cornerstonecont2,#edgefieldcont2,#elchoplacecont2,#fairfieldcont2,#heathfieldcont2,#mountpleasantcont2,#peelcont2,#straightsmouthcont2,#jesuslovesmecont2,#biblegatewaycont2,#truthfortodaycont2,#scripturetruthpubcont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #ashcroftcont1,#cornerstonecont1,#edgefieldcont1,#elchoplacecont1,#fairfieldcont1,#heathfieldcont1,#mountpleasantcont1,#peelcont1,#straightsmouthcont1,#jesuslovesmecont1,#biblegatewaycont1,#truthfortodaycont1,#scripturetruthpubcont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #ashcroftlogo,#cornerstonelogo,#edgefieldlogo,#elchoplacelogo,#fairfieldlogo,#heathfieldlogo,#mountpleasantlogo,#peellogo,#straightsmouthlogo,#jesuslovesmelogo,#biblegatewaylogo,#truthfortodaylogo,#scripturetruthpublogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #ashcroftinfo,#cornerstoneinfo,#edgefieldinfo,#elchoplaceinfo,#fairfieldinfo,#heathfieldinfo,#mountpleasantinfo,#peelinfo,#straightsmouthinfo,#jesuslovesmeinfo,#biblegatewayinfo,#truthfortodayinfo,#scripturetruthpubinfo {float: left; width: 100%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.ashcroftlogo,img.cornerstonelogo,img.edgefieldlogo,img.elchoplacelogo,img.fairfieldlogo,img.heathfieldlogo,img.mountpleasantlogo,img.peellogo,img.straightsmouthlogo,img.jesuslovesmelogo,img.biblegatewaylogo,img.truthfortodaylogo,img.scripturetruthpublogo {width: 30%; margin: auto;} /*END LINKS <319*/ /* CONTACT PAGE <319*/ #ctccont2 {clear: left; float: left; width: 100%; overflow: hidden;} #ctccont1 {float: left; width: 100%; position: relative; background-color: #ffffff; /* column 1 background colour */} /*col1*/ #ctcinfo {float: left; width: 100%; position: relative; overflow: hidden; color: #000000;} /*col2*/ #ctcform {float: left; width: 100%; position: relative; overflow: hidden; color: #000000; background-color: #3363ff; padding-left: 10px; padding-bottom: 10px;} .ctcformbottom {display: initial;} .ctcformright {display: none;} /*END CONTACT PAGE <319*/ } /* Up to iPhone6 when viewed horizontally */ @media screen and (min-width: 320px) and (max-width: 449px) { h1 {font-size: 248%;} /*NAVIGATION MENU 320-449*/ .row2 {display:none;} #nav {width: 100%; border-top: solid 0.0625em #00103D; border-bottom: solid 0.0625em #00103D; background-color: #00103D;} /*Strip the ul of padding and list styling*/ #nav ul {list-style-type: none; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 10;} /*Create a horizontal list with spacing*/ #nav li {display: inline-block; float: left; margin-right: 0em;} /*Style for menu links*/ #nav li a {display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} /*Hover state for top level links*/ #nav li:hover a {background: #E1D4C6; color: #00103D;} /*Style for dropdown links*/ #nav li:hover ul a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} /*Hover state for dropdown links*/ /*#nav li:hover ul a:hover {background: #00103D; color: #E1D4C6;}*/ /*Hide dropdown links until they are needed*/ .hidden { display: none;} /*Make dropdown links vertical*/ #nav li ul li {display: block;} /*Prevent text wrapping*/ #nav li ul li a {width: 100%;} /*Display the dropdown onhover*/ #nav ul li a:hover + .hidden, .hidden:hover {display: block;} /*Style 'show menu' label button and hide it by default*/ #nav .show-menu {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #E1D4C6; background: #00103D; border-top: solid 3px #00103D; vertical-align: middle; text-align: center; display: none; font-weight: bold;} /*Hide checkbox*/ #nav input[type=checkbox]{display: none;} /*Show menu when invisible checkbox is checked*/ #nav input[type=checkbox]:checked ~ #menu {display: block;} #show-menu-activities:checked ~ .hidden {display: block;} #activities-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #show-menu-about:checked ~ .hidden {display: block;} #about-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-about-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-show-menu-about:checked ~ .hidden {display: block;} #show-menu-resources:checked ~ .hidden {display: block;} #resources-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-resources-menu li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} #drop-show-menu-resources:checked ~ .hidden {display: block;} /*Make dropdown links appear inline*/ #nav ul {position: static; /*display: none;*/ } #menu {display: none;} /*Create vertical spacing*/ #nav li {border-bottom:0.0625em solid #E1D4C6;} /*Make all menu links full width*/ #nav ul li,li a {width: 100%; border-top: 0em;} /*Display 'show menu' link*/ #nav .show-menu {display: block; font-weight: bold; border-top: solid 2px #00103D; height: 41px; line-height: 40px; float: left; width: 100%; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #E1D4C6; background: #00103D; vertical-align: middle; text-align: center;} .show-menu#activities-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#about-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#drop-about-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#resources-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} .show-menu#drop-resources-menu-label {border-right: 0em solid #E1D4C6; border-top:0.0625em solid #E1D4C6;} /*Hide checkbox*/ #nav input[type=checkbox]{display: none;} /*Show menu when invisible checkbox is checked*/ #nav input[type=checkbox]:checked ~ #menu{display: block;} #nav li.navhome,#nav li.navactivities,#nav li.drop-navservices,#nav li.drop-navchildren,#nav li.drop-navchristmas,#nav li.navgospel,#nav li.navabout,#nav li.drop-location,#nav li.drop-beliefs,#nav li.drop-visitors,#nav li.drop-history,#nav li.drop-2009,#nav li.navresources,#nav li.drop-media,#nav li.drop-links,#nav li.navctc {width: 100%;} /*END NAVIGATION MENU 320-449*/ /*HOME 320-449*/ #noticeboard {float: left; background-color: #ffffff; width: 100%;} img.noticeboardstatic {width:100%} #bibleverse {float: left; background-color: #E1D4C6; width: 100%; padding-bottom: 15px; padding-top: 15px; text-align: center; } #homecols1-2cont2,#homecols3-4cont2,#homecols5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour border:*/ } #homecols1-2cont1,#homecols3-4cont1,#homecols5-6cont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */ /*padding-bottom: 15px; padding-top: 15px;*//*padding to separate from above/below*/} #homecols3-4cont2,#homecols3-4cont1 {background-color: #E1D4C6;} #homecols1,#homecols3,#homecols5 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols2,#homecols4,#homecols6 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols1 p,#homecols2 p,#homecols3 p,#homecols4 p,#homecols5 p,#homecols6 p {text-align: left;} #homecols3,#homecols4 {padding-top: 15px;} #homecols4 p {text-align: center; vertical-align: middle;} img.fblogo {width:10%; border-radius: 50%; float: center;} img.emaillogo {width:10%; border-radius: 50%; float: center;} .home-latest-broadcast-details {padding-left: 5px; padding-right: 5px; text-align: left;} .home-latest-broadcast {width: 45%; border: 5px solid #00103D; display: table-cell; vertical-align: middle;} .home-latest-broadcast-title-text {background-color: #00103D; font-weight: bold; vertical-align: middle; font-size: 150%; color: #ffffff; padding-top: 5px; padding-bottom: 7px;} .home-latest-broadcast-icon {width: 35px; height: 35px; clear: both; float: left;} .home-latest-broadcast-section {vertical-align: middle; list-style: none; border: 1px solid #3363ff; padding-left: 0px; margin-left: 5px; margin-right: 5px; display: block;} .home-latest-broadcast-section-item {border: 1px solid #00103D;} .home-latest-broadcast-section-item a {vertical-align: middle; text-align: center; display: block; height: 35px; min-width: 290px; color: #00103D; text-decoration: none; line-height: 40px;} .home-latest-broadcast-section-item a:hover {background-color: #00103D; color: #ffffff;} .home-latest-broadcast-details-title {font-size: 125%; text-align: left; color: #000000; font-weight: bold;} /* New rules */ .home-section-container {display: block;} .home-section-row {display: block;} .home-content-scroller {vertical-align: middle; width: 98%;} .home-content-nav {text-align: center; vertical-align: middle; display: table-cell; background-color: #00103D; color: #ffffff; width: 2%;} .home-content-column-separator {display: table-cell; width: 10px;} #home-content-scroller {float: none;} #timecount {float: left; background-color: #ffffff; width: 30%; padding-left: 30%;} #timecount3 {clear: left; float: left; width: 100%; overflow: hidden; background: #ffffff; /* column 3 background colour */ } #timecount2 {clear: left; float: left; width: 100%; position: relative; right: 33.333%; background: #ffffff; /* column 2 background colour */ } #timecount1 {float: left; width: 100%; position: relative; right: 33.33%; background: #ffffff; /* column 1 background colour */ vertical-align: text-bottom;} #datetime {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: text-bottom; padding-top: 15px;} #countimg {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} #counter {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} img.counterlogo {margin-left: auto; margin-right: auto; width: 100%;} img.counter {margin-left: auto; margin-right: auto; width: 80%;} /*END HOME 320-449/ /*MEETINGS 320-449*/ #bobcont2,#sundayschoolcont2,#prayermtgcont2,#biblestudycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #bobcont1,#sundayschoolcont1,#prayermtgcont1,#biblestudycont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #boblogo,#sundayschoollogo,#prayermtglogo,#biblestudylogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #bobinfo,#sundayschoolinfo,#prayermtginfo,#biblestudyinfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.boblogo,img.sundayschoollogo,img.prayermtglogo,img.biblestudylogo {width: 30%; margin: auto;} /*MEETINGS <320-449*/ /*DIRECTIONS 320-449*/ #carcont2,#buscont2,#traincont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #carcont1,#buscont1,#traincont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #carlogo,#buslogo,#trainlogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #carinfo,#businfo,#traininfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.carlogo,img.buslogo,img.trainlogo {width: 30%; margin: auto;} /*END DIRECTIONS 320-449*/ /*VISITORS 320-449*/ #whocont2,#whichservicecont2,#locationcont2,#versioncont2,#disabilitiescont2,#visitorhistorycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #whocont1,#whichservicecont1,#locationcont1,#versioncont1,#disabilitiescont1,#visitorhistorycont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #whologo,#whichservicelogo,#locationlogo,#versionlogo,#disabilitieslogo,#visitorhistorylogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #whoinfo,#whichserviceinfo,#locationinfo,#versioninfo,#disabilitiesinfo,#visitorhistoryinfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.whologo,img.whichservicelogo,img.locationlogo,img.versionlogo,img.disabilitieslogo,img.visitorhistorylogo {width: 30%; margin: auto;} /*END VISITORS 320-449*/ /*LINKS 320-449*/ #ashcroftcont2,#cornerstonecont2,#edgefieldcont2,#elchoplacecont2,#fairfieldcont2,#heathfieldcont2,#mountpleasantcont2,#peelcont2,#straightsmouthcont2,#jesuslovesmecont2,#biblegatewaycont2,#truthfortodaycont2,#scripturetruthpubcont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #ashcroftcont1,#cornerstonecont1,#edgefieldcont1,#elchoplacecont1,#fairfieldcont1,#heathfieldcont1,#mountpleasantcont1,#peelcont1,#straightsmouthcont1,#jesuslovesmecont1,#biblegatewaycont1,#truthfortodaycont1,#scripturetruthpubcont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #ashcroftlogo,#cornerstonelogo,#edgefieldlogo,#elchoplacelogo,#fairfieldlogo,#heathfieldlogo,#mountpleasantlogo,#peellogo,#straightsmouthlogo,#jesuslovesmelogo,#biblegatewaylogo,#truthfortodaylogo,#scripturetruthpublogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #ashcroftinfo,#cornerstoneinfo,#edgefieldinfo,#elchoplaceinfo,#fairfieldinfo,#heathfieldinfo,#mountpleasantinfo,#peelinfo,#straightsmouthinfo,#jesuslovesmeinfo,#biblegatewayinfo,#truthfortodayinfo,#scripturetruthpubinfo {float: left; width: 100%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.ashcroftlogo,img.cornerstonelogo,img.edgefieldlogo,img.elchoplacelogo,img.fairfieldlogo,img.heathfieldlogo,img.mountpleasantlogo,img.peellogo,img.straightsmouthlogo,img.jesuslovesmelogo,img.biblegatewaylogo,img.truthfortodaylogo,img.scripturetruthpublogo {width: 30%; margin: auto;} /*END LINKS 320-449*/ /*HISTORY 320-449*/ #historymain p.paper {font-style: italic; width: 90%; margin: auto; padding-top: 7.5px; padding-bottom: 7.5px;} p.photoinfo {text-align: left; padding-right: 3px; padding-right:10px;} /*#historymain p.photocaption {display: none;}*/ #historycaptions1-2cont2,#historycaptions3-4cont2,#historycaptions5-6cont2 {display: none;} #historyphotos1-2cont2,#historyphotos3-4cont2,#historyphotos5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ /*border: solid 1px #3663ff;*/} #historyphotos1-2cont1,#historyphotos3-4cont1,#historyphotos5-6cont1 {clear: both; float: left; width: 100%; position: static; background-color: #ffffff; /* column 1 background colour */} #historyphotos1,#historyphotos3,#historyphotos5 {clear: both; clear: both; float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} #historyphotos2,#historyphotos4,#historyphotos6 {float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} img.historyphoto {width: 75%; margin: auto;} /*END HISTORY 320-449*/ /*MEDIA <320-449*/ .mediadownload {text-align: center; height: 25px;} .mediaprog {text-align: left;} .mediahead {text-align: left; font-weight: bold;} .mediainfo {text-align: center; color: #00103D; width:50%;} .mediatitle {font-size: 100%; text-align: left; color: #00103D; font-weight: bold;} /*Make dropdown links vertical*/ #media01dwnld li,#media02dwnld li,#media03dwnld li,#media04dwnld li,#media05dwnld li,#media06dwnld li,#media07dwnld li,#media08dwnld li,#media09dwnld li,#media10dwnld li {background-color: #ffffff; display: block; float: none; width: 96%;} /*Prevent text wrapping*/ #media01dwnld li a,#media02dwnld li a,#media03dwnld li a,#media04dwnld li a,#media05dwnld li a,#media06dwnld li a,#media07dwnld li a,#media08dwnld li a,#media09dwnld li a,#media10dwnld li a {width: 100%; padding: 0 5px;} #media01cont2,#media02cont2,#media03cont2,#media04cont2,#media05cont2,#media06cont2,#media07cont2,#media08cont2,#media09cont2,#media10cont2 {clear: left; float: left; width: 100%; position: relative; overflow: hidden; background-color: #ffffff; border: 1px solid #00103D;} /* column 2 background colour */ #media01info,#media02info,#media03info,#media04info,#media05info,#media06info,#media07info,#media08info,#media09info,#media10info {float: left; width: 100%; position: relative; left: 5%; overflow: hidden; text-align: center;} #media01dwnld,#media02dwnld,#media03dwnld,#media04dwnld,#media05dwnld,#media06dwnld,#media07dwnld,#media08dwnld,#media09dwnld,#media10dwnld {background-color: #ffffff; float: left; width: 100%; position: relative; left: 5%; padding-bottom: 10px;} /*Strip the ul of padding and list styling*/ #media01cont2 ul,#media02cont2 ul,#media03cont2 ul,#media04cont2 ul,#media05cont2 ul,#media06cont2 ul,#media07cont2 ul,#media08cont2 ul,#media09cont2 ul,#media10cont2 ul {list-style-type: none; margin: 0; padding: 0; position: relative; width: 100%;} /*keep*/ /*Create a horizontal list with spacing*/ #media01cont2 li,#media02cont2 li,#media03cont2 li,#media04cont2 li,#media05cont2 li,#media06cont2 li,#media07cont2 li,#media08cont2 li,#media09cont2 li,#media10cont2 li {display: inline-block; float: left; margin-right: 0px; width: 85%;} /*Style for menu links*/ #media01cont2 li a,#media02cont2 li a,#media03cont2 li a,#media04cont2 li a,#media05cont2 li a,#media06cont2 li a,#media07cont2 li a,#media08cont2 li a,#media09cont2 li a,#media10cont2 li a {display: block; width: 100%; height: 35px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #00103D; background-color: #ffffff; text-decoration: none; border: 1px solid #00103D;} /*end of keep*/ /*Hover state for top level links*/ #media01cont2 li:hover a,#media02cont2 li:hover a,#media03cont2 li:hover a,#media04cont2 li:hover a,#media05cont2 li:hover a,#media06cont2 li:hover a,#media07cont2 li:hover a,#media08cont2 li:hover a,#media09cont2 li:hover a,#media10cont2 li:hover a {background: #00103D; color: #ffffff; border: 1px solid #00103D;} #media01cont2 ul li img.mediahtml,#media02cont2 ul li img.mediahtml,#media03cont2 ul li img.mediahtml,#media04cont2 ul li img.mediahtml,#media05cont2 ul li img.mediahtml,#media06cont2 ul li img.mediahtml,#media07cont2 ul li img.mediahtml,#media08cont2 ul li img.mediahtml,#media09cont2 ul li img.mediahtml,#media10cont2 ul li img.mediahtml {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediawatch,#media02cont2 ul li img.mediawatch,#media03cont2 ul li img.mediawatch,#media04cont2 ul li img.mediawatch,#media05cont2 ul li img.mediawatch,#media06cont2 ul li img.mediawatch,#media07cont2 ul li img.mediawatch,#media08cont2 ul li img.mediawatch,#media09cont2 ul li img.mediawatch,#media10cont2 ul li img.mediawatch {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediapdf,#media02cont2 ul li img.mediapdf,#media03cont2 ul li img.mediapdf,#media04cont2 ul li img.mediapdf,#media05cont2 ul li img.mediapdf,#media06cont2 ul li img.mediapdf,#media07cont2 ul li img.mediapdf,#media08cont2 ul li img.mediapdf,#media09cont2 ul li img.mediapdf,#media10cont2 ul li img.mediapdf {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediamp3,#media02cont2 ul li img.mediamp3,#media03cont2 ul li img.mediamp3,#media04cont2 ul li img.mediamp3,#media05cont2 ul li img.mediamp3,#media06cont2 ul li img.mediamp3,#media07cont2 ul li img.mediamp3,#media08cont2 ul li img.mediamp3,#media09cont2 ul li img.mediamp3,#media10cont2 ul li img.mediamp3 {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01dwnldotr,#media02dwnldotr,#media03dwnldotr,#media04dwnldotr,#media05dwnldotr,#media06dwnldotr,#media07dwnldotr,#media08dwnldotr,#media09dwnldotr,#media10dwnldotr {display: table; position: relative; height: 100%; width: 100%;} #media01dwnldmid,#media02dwnldmid,#media03dwnldmid,#media04dwnldmid,#media05dwnldmid,#media06dwnldmid,#media07dwnldmid,#media08dwnldmid,#media09dwnldmid,#media10dwnldmid {display: table-cell; vertical-align: middle;} #media01dwnldinr,#media02dwnldinr,#media03dwnldinr,#media04dwnldinr,#media05dwnldinr,#media06dwnldinr,#media07dwnldinr,#media08dwnldinr,#media09dwnldinr,#media10dwnldinr {margin-left: auto; margin-right: auto;} /*END MEDIA 320-449*/ /* CONTACT PAGE 320-449*/ #ctccont2 {clear: left; float: left; width: 100%; overflow: hidden;} #ctccont1 {float: left; width: 100%; position: relative; background-color: #ffffff; /* column 1 background colour */} /*col1*/ #ctcinfo {float: left; width: 100%; position: relative; overflow: hidden; color: #000000;} /*col2*/ #ctcform {float: left; width: 100%; position: relative; overflow: hidden; color: #000000; background-color: #E1D4C6; padding-left: 10px; padding-bottom: 10px;} .ctcformbottom {display: initial;} .ctcformright {display: none;} /*END CONTACT PAGE 320-449*/ } /* larger phones/horizontal phones (two columns) */ @media screen and (min-width: 450px) and (max-width: 639px) { h1 {font-size: 360%;} /*NAVIGATION MENU 450-639*/ /*Six items: 1 and 6 are 15%, 2, 3, 4, are 17.5%)*/ .linebreak {display: none} #nav {width: 100%; float: left; height: 41px; position: relative;} /*Strip the ul of padding and list styling*/ #nav ul {list-style-type: none; margin: 0; padding: 0; width: 100%; font-size: 100%; position: absolute; z-index: 10;} /*Create a horizontal list with spacing*/ #nav li {display: inline-block; float: left; margin-right: 0em; position: static;} /*Style for menu links*/ #nav li a, #nav #activities-menu-label, #nav #more-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em; font-size: 85%;} #nav li a, #nav #about-menu-label, #nav #resources-menu-label,#nav #more-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em; font-size: 85%;} #nav li a, #nav #drop-about-menu-label, #nav #drop-resources-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em; width: 100%; font-size: 85%;} /*Hover state for top level links*/ #nav li ul li a {background: #E1D4C6; color: #00103D;} /*Style for dropdown links*/ #nav li ul li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} /*Hover state for dropdown links*/ #nav li:hover ul a:hover {background: #E1D4C6; color: #00103D;} /*Hide dropdown links until they are needed*/ /* #nav li ul {*/ .hidden { display: none;} /*Make dropdown links vertical*/ #nav li ul li {display: block; float: none; position: relative;} /*Prevent text wrapping*/ #nav li ul li a {width: 100%; padding: 0 0em; white-space: nowrap;} /*Display the dropdown onhover*/ #nav ul li a:hover + .hidden, .hidden:hover {display: block;} /*Style 'show menu' label button and hide it by default*/ #nav .show-menu {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #00103D; background: #E1D4C6; text-align: center; padding: 0em 0em; display: none;} /*Hide checkboxes*/ #nav input[type=checkbox]{display: none;} /* when the activities menu checkbox is checked, display the drop down menu */ :checked#show-menu-activities ~ .hidden {display: block;} :checked#show-menu-about ~ .hidden {display: block;} :checked#drop-show-menu-about ~ .hidden {display: block;} :checked#show-menu-resources ~ .hidden {display: block;} :checked#drop-show-menu-resources ~ .hidden {display: block;} #nav li.navhome,#nav li.navctc,#nav li.navabout,#nav li.drop-about,#nav li.drop-location,#nav li.drop-beliefs,#nav li.drop-visitors,#nav li.drop-history,#nav li.drop-2009 {width: 15%;} #nav li.navactivities,#nav li.drop-navservices,#nav li.drop-navchildren,#nav li.drop-navchristmas,#nav li.navgospel {width: 17.5%;} #nav li.navresources,#nav li.drop-media,#nav li.drop-links {width: 20%;} /*END NAVIGATION MENU 450-639*/ /*HOME 450-639*/ #noticeboard {float: left; background-color: #ffffff; width: 100%;} img.noticeboardstatic {width:100%} #bibleverse {float: left; background-color: #E1D4C6; width: 100%; padding-bottom: 15px; padding-top: 15px; text-align: center; } #homecols1-2cont2,#homecols3-4cont2,#homecols5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour border:*/ } #homecols1-2cont1,#homecols3-4cont1,#homecols5-6cont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */ /*padding-bottom: 15px; padding-top: 15px;*//*padding to separate from above/below*/} #homecols3-4cont2,#homecols3-4cont1 {background-color: #E1D4C6;} #homecols1,#homecols3,#homecols5 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols2,#homecols4,#homecols6 {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: bottom;} #homecols1 p,#homecols2 p,#homecols3 p,#homecols4 p,#homecols5 p,#homecols6 p {text-align: left;} #homecols3,#homecols4 {padding-top: 15px;} #homecols4 p {text-align: center; vertical-align: middle;} img.fblogo {width:10%; border-radius: 50%; float: center;} img.emaillogo {width:10%; border-radius: 50%; float: center;} .home-latest-broadcast-details {padding-left: 5px; padding-right: 5px; text-align: left;} .home-latest-broadcast {width: 45%; border: 5px solid #00103D; display: table-cell; vertical-align: middle;} .home-latest-broadcast-title-text {background-color: #00103D; font-weight: bold; vertical-align: middle; font-size: 150%; color: #ffffff; padding-top: 5px; padding-bottom: 7px;} .home-latest-broadcast-icon {width: 35px; height: 35px; clear: both; float: left;} .home-latest-broadcast-section {vertical-align: middle; list-style: none; border: 1px solid #3363ff; padding-left: 0px; margin-left: 5px; margin-right: 5px; display: block;} .home-latest-broadcast-section-item {border: 1px solid #00103D;} .home-latest-broadcast-section-item a {vertical-align: middle; text-align: center; display: block; height: 35px; min-width: 290px; color: #00103D; text-decoration: none; line-height: 40px;} .home-latest-broadcast-section-item a:hover {background-color: #00103D; color: #ffffff;} .home-latest-broadcast-details-title {font-size: 125%; text-align: left; color: #000000; font-weight: bold;} /* New rules */ .home-section-container {display: block;} .home-section-row {display: block;} .home-content-scroller {vertical-align: middle; width: 98%;} .home-content-nav {text-align: center; vertical-align: middle; display: table-cell; background-color: #00103D; color: #ffffff; width: 2%;} .home-content-column-separator {display: table-cell; width: 10px;} #home-content-scroller {float: none;} #timecount {float: left; background-color: #ffffff; width: 30%; padding-left: 30%;} #timecount3 {clear: left; float: left; width: 100%; overflow: hidden; background: #ffffff; /* column 3 background colour */ } #timecount2 {clear: left; float: left; width: 100%; position: relative; right: 33.333%; background: #ffffff; /* column 2 background colour */ } #timecount1 {float: left; width: 100%; position: relative; right: 33.33%; background: #ffffff; /* column 1 background colour */ vertical-align: text-bottom;} #datetime {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; vertical-align: text-bottom; padding-top: 15px;} #countimg {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} #counter {float: left; width: 90%; position: relative; overflow: hidden; text-align: center; font-size: 75%; padding-top: 15px;} img.counterlogo {margin-left: auto; margin-right: auto; width: 100%;} img.counter {margin-left: auto; margin-right: auto; width: 80%;} /*END HOME 450-639/ /*MEETINGS 450-639*/ #bobcont2,#sundayschoolcont2,#prayermtgcont2,#biblestudycont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #bobcont1,#sundayschoolcont1,#prayermtgcont1,#biblestudycont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #boblogo,#sundayschoollogo,#prayermtglogo,#biblestudylogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #bobinfo,#sundayschoolinfo,#prayermtginfo,#biblestudyinfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.boblogo,img.sundayschoollogo,img.prayermtglogo,img.biblestudylogo {width: 30%; margin: auto;} /*END MEETINGS <320-449*/ /*DIRECTIONS 450-639*/ #carcont2,#buscont2,#traincont2 {clear: both; float: left; width: 100%; margin: auto; overflow: hidden; background-color: #ffffff; /* column 2 background colour */} #carcont1,#buscont1,#traincont1 {clear: both; float: left; width: 100%; margin: auto; position: relative; background-color: #ffffff; /* column 1 background colour */padding-bottom: 15px; padding-top: 15px;} #carlogo,#buslogo,#trainlogo {clear: both; clear: both; float: left; margin: auto; width: 100%; position: relative; overflow: hidden; padding-left: 0px; padding-right: 3px; text-align: center;} #carinfo,#businfo,#traininfo {float: left; width: 90%; position: relative; overflow: hidden; padding-left: 3px; padding-right: 3px;} img.carlogo,img.buslogo,img.trainlogo {width: 30%; margin: auto;} /*END DIRECTIONS 450-639*/ /*HISTORY 450-639*/ #historymain p.paper {font-style: italic; width: 80%; margin: auto; padding-top: 7.5px; padding-bottom: 7.5px;} #historyphotos2 p,#historycaptions2 p, #historyphotos1 p,#historycaptions1 p,#historyphotos4 p,#historycaptions4 p, #historyphotos3 p,#historycaptions3 p,#historyphotos6 p,#historycaptions6 p, #historyphotos5 p,#historycaptions5 p {text-align: left;} p.photoinfo {text-align: left; padding-right: 3px; padding-right:10px;} /*#historymain p.photocaption {display: none;}*/ #historycaptions1-2cont2,#historycaptions3-4cont2,#historycaptions5-6cont2 {display: none;} #historyphotos1-2cont2,#historyphotos3-4cont2,#historyphotos5-6cont2 {clear: both; float: left; width: 100%; overflow: hidden; background-color: #ffffff; /* column 2 background colour */ /*border: solid 1px #3663ff;*/} #historyphotos1-2cont1,#historyphotos3-4cont1,#historyphotos5-6cont1 {clear: both; float: left; width: 100%; position: static; background-color: #ffffff; /* column 1 background colour */} #historyphotos1,#historyphotos3,#historyphotos5 {clear: both; clear: both; float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} #historyphotos2,#historyphotos4,#historyphotos6 {float: left; width: 90%; position: static; overflow: hidden; text-align: center; padding-left: 3px; padding-right: 3px;} img.historyphoto {width: 75%; margin: auto;} /*END HISTORY 450-639*/ /*MEDIA <450-639*/ .mediadownload {text-align: center; height: 25px;} .mediaprog {text-align: left;} .mediahead {text-align: left; font-weight: bold;} .mediainfo {text-align: center; color: #00103D; width:50%;} .mediatitle {font-size: 100%; text-align: left; color: #00103D; font-weight: bold;} /*Make dropdown links vertical*/ #media01dwnld li,#media02dwnld li,#media03dwnld li,#media04dwnld li,#media05dwnld li,#media06dwnld li,#media07dwnld li,#media08dwnld li,#media09dwnld li,#media10dwnld li {background-color: #ffffff; display: block; float: none; width: 96%;} /*Prevent text wrapping*/ #media01dwnld li a,#media02dwnld li a,#media03dwnld li a,#media04dwnld li a,#media05dwnld li a,#media06dwnld li a,#media07dwnld li a,#media08dwnld li a,#media09dwnld li a,#media10dwnld li a {width: 100%; padding: 0 5px;} #media01cont2,#media02cont2,#media03cont2,#media04cont2,#media05cont2,#media06cont2,#media07cont2,#media08cont2,#media09cont2,#media10cont2 {clear: left; float: left; width: 100%; position: relative; overflow: hidden; background-color: #ffffff; border: 1px solid #00103D;} /* column 2 background colour */ #media01info,#media02info,#media03info,#media04info,#media05info,#media06info,#media07info,#media08info,#media09info,#media10info {float: left; width: 100%; position: relative; left: 5%; overflow: hidden; text-align: center;} #media01dwnld,#media02dwnld,#media03dwnld,#media04dwnld,#media05dwnld,#media06dwnld,#media07dwnld,#media08dwnld,#media09dwnld,#media10dwnld {background-color: #ffffff; float: left; width: 100%; position: relative; left: 5%; padding-bottom: 10px;} /*Strip the ul of padding and list styling*/ #media01cont2 ul,#media02cont2 ul,#media03cont2 ul,#media04cont2 ul,#media05cont2 ul,#media06cont2 ul,#media07cont2 ul,#media08cont2 ul,#media09cont2 ul,#media10cont2 ul {list-style-type: none; margin: 0; padding: 0; position: relative; width: 100%;} /*keep*/ /*Create a horizontal list with spacing*/ #media01cont2 li,#media02cont2 li,#media03cont2 li,#media04cont2 li,#media05cont2 li,#media06cont2 li,#media07cont2 li,#media08cont2 li,#media09cont2 li,#media10cont2 li {display: inline-block; float: left; margin-right: 0px; width: 85%;} /*Style for menu links*/ #media01cont2 li a,#media02cont2 li a,#media03cont2 li a,#media04cont2 li a,#media05cont2 li a,#media06cont2 li a,#media07cont2 li a,#media08cont2 li a,#media09cont2 li a,#media10cont2 li a {display: block; width: 100%; height: 35px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #00103D; background-color: #ffffff; text-decoration: none; border: 1px solid #00103D;} /*end of keep*/ /*Hover state for top level links*/ #media01cont2 li:hover a,#media02cont2 li:hover a,#media03cont2 li:hover a,#media04cont2 li:hover a,#media05cont2 li:hover a,#media06cont2 li:hover a,#media07cont2 li:hover a,#media08cont2 li:hover a,#media09cont2 li:hover a,#media10cont2 li:hover a {background: #00103D; color: #ffffff; border: 1px solid #00103D;} #media01cont2 ul li img.mediahtml,#media02cont2 ul li img.mediahtml,#media03cont2 ul li img.mediahtml,#media04cont2 ul li img.mediahtml,#media05cont2 ul li img.mediahtml,#media06cont2 ul li img.mediahtml,#media07cont2 ul li img.mediahtml,#media08cont2 ul li img.mediahtml,#media09cont2 ul li img.mediahtml,#media10cont2 ul li img.mediahtml {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediawatch,#media02cont2 ul li img.mediawatch,#media03cont2 ul li img.mediawatch,#media04cont2 ul li img.mediawatch,#media05cont2 ul li img.mediawatch,#media06cont2 ul li img.mediawatch,#media07cont2 ul li img.mediawatch,#media08cont2 ul li img.mediawatch,#media09cont2 ul li img.mediawatch,#media10cont2 ul li img.mediawatch {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediapdf,#media02cont2 ul li img.mediapdf,#media03cont2 ul li img.mediapdf,#media04cont2 ul li img.mediapdf,#media05cont2 ul li img.mediapdf,#media06cont2 ul li img.mediapdf,#media07cont2 ul li img.mediapdf,#media08cont2 ul li img.mediapdf,#media09cont2 ul li img.mediapdf,#media10cont2 ul li img.mediapdf {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01cont2 ul li img.mediamp3,#media02cont2 ul li img.mediamp3,#media03cont2 ul li img.mediamp3,#media04cont2 ul li img.mediamp3,#media05cont2 ul li img.mediamp3,#media06cont2 ul li img.mediamp3,#media07cont2 ul li img.mediamp3,#media08cont2 ul li img.mediamp3,#media09cont2 ul li img.mediamp3,#media10cont2 ul li img.mediamp3 {clear: both; float: left; display: inline-block; background-position: left top; height: 35px; width: 35px; border: none;} #media01dwnldotr,#media02dwnldotr,#media03dwnldotr,#media04dwnldotr,#media05dwnldotr,#media06dwnldotr,#media07dwnldotr,#media08dwnldotr,#media09dwnldotr,#media10dwnldotr {display: table; position: relative; height: 100%; width: 100%;} #media01dwnldmid,#media02dwnldmid,#media03dwnldmid,#media04dwnldmid,#media05dwnldmid,#media06dwnldmid,#media07dwnldmid,#media08dwnldmid,#media09dwnldmid,#media10dwnldmid {display: table-cell; vertical-align: middle;} #media01dwnldinr,#media02dwnldinr,#media03dwnldinr,#media04dwnldinr,#media05dwnldinr,#media06dwnldinr,#media07dwnldinr,#media08dwnldinr,#media09dwnldinr,#media10dwnldinr {margin-left: auto; margin-right: auto;} /*END MEDIA 450-639*/ /* CONTACT PAGE 450-639*/ #ctccont2 {clear: left; float: left; width: 100%; overflow: hidden;} #ctccont1 {float: left; width: 100%; position: relative; background-color: #ffffff; /* column 1 background colour */} /*col1*/ #ctcinfo {float: left; width: 100%; position: relative; overflow: hidden; color: #000000;} /*col2*/ #ctcform {float: left; width: 100%; position: relative; overflow: hidden; color: #000000; background-color: #E1D4C6; padding-left: 10px; padding-bottom: 10px;} .ctcformbottom {display: initial;} .ctcformright {display: none;} /*END CONTACT PAGE 450-639*/ } /* Three column menu tablet layout */ @media screen and (min-width: 640px) and (max-width: 899px) { h1 {font-size: 393%;} .linebreak {display: none} /*NAVIGATION MENU 640-899*/ /*Six items: 1 and 6 are 16%, 2, 3, 4, are 17%)*/ #nav {width: 100%; float: left; height: 41px; position: relative;} /*Strip the ul of padding and list styling*/ #nav ul {list-style-type: none; margin: 0; padding: 0; width: 100%; font-size: 90%; position: absolute; z-index: 10;} /*Create a horizontal list with spacing*/ #nav li {display: inline-block; float: left; margin-right: 0em; position: static;} /*Style for menu links*/ #nav li a, #nav #activities-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em;} #nav li a, #nav #about-menu-label, #nav #resources-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em;} #nav li a, #nav #drop-about-menu-label, #nav #drop-resources-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right:0.0625em solid #E1D4C6; border-top:0.0625em solid #E1D4C6; padding: 0em;} /*Hover state for top level links*/ #nav li ul li a {background: #E1D4C6; color: #00103D;} /*Style for dropdown links*/ #nav li ul li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D; width: 100%;} /*Hover state for dropdown links*/ #nav li:hover ul a:hover {background: #00103D; color: #E1D4C6;} /*Hide dropdown links until they are needed*/ /* #nav li ul {*/ .hidden { display: none;} /*Make dropdown links vertical*/ #nav li ul li {display: block; float: none;} /*Prevent text wrapping*/ #nav li ul li a {width: 100%; padding: 0em 0em; white-space: nowrap;} /*Display the dropdown onhover*/ #nav ul li a:hover + .hidden, .hidden:hover {display: block;} /*Style 'show menu' label button and hide it by default*/ #nav .show-menu {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #00103D; background: #E1D4C6; text-align: center; padding: 0em 0em; display: none;} /*Hide checkboxes*/ #nav input[type=checkbox]{display: none;} /* when the activities menu checkbox is checked, display the drop down menu */ :checked#show-menu-activities ~ .hidden {display: block;} :checked#show-menu-about ~ .hidden {display: block;} :checked#drop-show-menu-about ~ .hidden {display: block;} :checked#show-menu-resources ~ .hidden {display: block;} :checked#drop-show-menu- resources ~ .hidden {display: block;} #nav li.navhome,#nav li.navctc {width: 16%;} #nav li.navactivities,#nav li.drop-navservices,#nav li.drop-navchildren,#nav li.drop-navchristmas,#nav li.navgospel,#nav li.navabout,#nav li.drop-location,#nav li.drop-beliefs,#nav li.drop-visitors,#nav li.drop-history,#nav li.drop-2009,#nav li.navresources,#nav li.drop-media,#nav li.drop-links {width: 17%;} /*END NAVIGATION MENU 640-899*/ /*HOME 640-899*/ #timecount {float: left; background-color: #ffffff; width: 60%; padding-left: 20%;} /*END HOME 640-899*/ /*HISTORY 640-899*/ #historymain p.paper {font-style: italic; width: 80%; margin: auto; padding-top: 7.5px; padding-bottom: 7.5px;} #historyphotos2 p,#historycaptions2 p, #historyphotos1 p,#historycaptions1 p,#historyphotos4 p,#historycaptions4 p, #historyphotos3 p,#historycaptions3 p,#historyphotos6 p,#historycaptions6 p, #historyphotos5 p,#historycaptions5 p {text-align: left;} p.photoinfo {display: none;} /*END HISTORY 640-899*/ /*CONTACT FORM 640-899*/ #ctccont2 {clear: left; float: left; width: 100%; overflow: hidden;} #ctccont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */} /*col1*/ #ctcinfo {float: left; width: 46%; position: relative; left: 52%; overflow: hidden; color: #000000;} /*col2*/ #ctcform { float: left; width: 46%; position: relative; left: 56%; overflow: hidden; color: #000000; background-color: #E1D4C6; padding-left: 10px; padding-bottom: 10px;} .ctcformbottom {display: none;} .ctcformright {display: initial;} /*END CONTACT 640-899*/ } /* Tablets and computer monitors */ @media screen and (min-width: 900px) { h1 {font-size: 393%;} .linebreak {display: none} .row2 {display:none;} /*NAVIGATION MENU >900*/ /*Six items: 1 and 6 are 16%, 2, 3, 4, are 17%)*/ #nav {float: left; background: #00103D; width: 100%; float: left; height: 41px; position: relative;} /*Strip the ul of padding and list styling*/ #nav ul {list-style-type: none; margin: 0; padding: 0; position: absolute; width: 100%; z-index: 10;} /*Create a horizontal list with spacing*/ #nav li {display: inline-block; float: left; margin-right: 0em; position: static;} /*Style for menu links*/ #nav li a, #nav #activities-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right: 0.0625em solid #E1D4C6; border-top: 0.0625em solid #E1D4C6; padding: 0em;} #nav li a, #nav #about-menu-label, #nav #resources-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right: 0.0625em solid #E1D4C6; border-top: 0.0625em solid #E1D4C6; padding: 0em;} #nav li a, #nav #drop-about-menu-label, #nav #drop-resources-menu-label {cursor: pointer; display: block; height: 40px; text-align: center; line-height: 40px; font-family: Arial, sans-serif; color: #E1D4C6; background: #00103D; text-decoration: none; border-right: 0.0625em solid #E1D4C6; border-top: 0.0625em solid #E1D4C6; padding: 0em;} /*Hover state for top level links*/ #nav li ul li a {background: #E1D4C6; color: #00103D;} /*Style for dropdown links*/ #nav li ul li a {background: #E1D4C6; color: #00103D; height: 40px; line-height: 40px; border-top:0.0625em solid #00103D;} /*Hover state for dropdown links*/ #nav li:hover ul a:hover {background: #00103D; color: #E1D4C6;} /*Hide dropdown links until they are needed*/ .hidden { display: none;} /*Make dropdown links vertical*/ #nav li ul li {display: block; float: none;} /*Prevent text wrapping*/ #nav li ul li a {width: 100%; padding: 0em 0em;} /*Display the dropdown onhover*/ #nav ul li a:hover + .hidden, .hidden:hover {display: block;} /*Style 'show menu' label button and hide it by default*/ #nav .show-menu {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; text-decoration: none; color: #00103D; background: #E1D4C6; text-align: center; padding: 0em 0em; display: none;} /*Hide checkboxes*/ #nav input[type=checkbox] {display: none;} /* when the activities menu checkbox is checked, display the drop down menu */ :checked#show-menu-activities ~ .hidden {display: block;} :checked#show-menu-about ~ .hidden {display: block;} :checked#drop-show-menu-about ~ .hidden {display: block;} :checked#show-menu-resources ~ .hidden {display: block;} :checked#drop-show-menu-resources ~ .hidden {display: block;} #nav li.navhome,#nav li.navctc {width: 16%;} #nav li.navactivities,#nav li.drop-navservices,#nav li.drop-navchildren,#nav li.drop-navchristmas,#nav li.navgospel,#nav li.navabout,#nav li.drop-location,#nav li.drop-beliefs,#nav li.drop-visitors,#nav li.drop-history,#nav li.drop-2009,#nav li.navresources,#nav li.drop-media,#nav li.drop-links {width: 17%;} /*END NAVIGATION MENU >900*/ #main {height: 100vh; background-color: #ffffff; color: #000000;} /*HISTORY >900*/ #historymain p.paper {font-style: italic; width: 80%; margin: auto; padding-top: 7.5px; padding-bottom: 7.5px;} #historyphotos2 p,#historycaptions2 p, #historyphotos1 p,#historycaptions1 p,#historyphotos4 p,#historycaptions4 p, #historyphotos3 p,#historycaptions3 p,#historyphotos6 p,#historycaptions6 p, #historyphotos5 p,#historycaptions5 p {text-align: left;} p.photoinfo {display: none;} /*END HISTORY >900*/ /*CONTACT >900*/ #ctcemailcont2,#ctcnamecont2,#ctcsubjectcont2,#ctcmessagecont2 {clear: left; float: left; width: 100%; overflow: hidden; background: #ffa7a7; /* column 2 background colour */} #ctcemailcont1,#ctcnamecont1,#ctcsubjectcont1,#ctcmessagecont1 {float: left; width: 100%; position: relative; right: 50%; background: #fff689; /* column 1 background colour */} #ctcemailcol1,#ctcnamecol1,#ctcsubjectcol1,#ctcmessagecol1 {float: left; width: 46%; position: relative; left: 52%; overflow: hidden;} #ctcemailcol2,#ctcnamecol2,#ctcsubjectcol2,#ctcmessagecol2 {float: left; width: 46%; position: relative; left: 56%; overflow: hidden;} #ctccont2 {clear: left; float: left; width: 100%; overflow: hidden;} #ctccont1 {float: left; width: 100%; position: relative; right: 50%; background-color: #ffffff; /* column 1 background colour */} /*col1*/ #ctcinfo {float: left; width: 46%; position: relative; left: 52%; overflow: hidden; color: #000000;} /*col2*/ #ctcform {float: left; width: 46%; position: relative; left: 56%; overflow: hidden; color: #000000; background-color: #E1D4C6; padding-left: 10px; padding-bottom: 10px;} .ctcformbottom {display: none;} .ctcformright {display: initial;} /*END CONTACT >900*/ }