/*************************************************************************************************
GracePoint Presbyterian Church website Style CSS (Desktop Version)
author:		Andy Yip (andy.tl.yip@gmail.com)
version:	1.0
date:		14/07/2012
copyright:	Copyright(c) Andy Yip 2012
*************************************************************************************************/

body { margin:0;padding:0;background-color:#000;font-family:Arial,san-serif;font-size:15px; }

.wrapper { position:relative;width:100%;height:100%; }
.inner { display:block;background-color:#fff;width:1000px;left:50%;margin-top:15px;margin-left:-500px;border-left:1px solid #aaa;position:absolute;box-shadow:10px 10px 5px #888888;padding-bottom:20px;min-height:700px; }
.header { display:block;height:120px; }
.topmenu { float:left;margin-top:20px;margin-left:20px; }
.topmenu .menuitem { font-size:16px;background-color:#fff;color:#000;height:20px;padding:10px; }
.topmenu .menucol { position:absolute; display:none; background-color:#fff;border:1px solid #999;z-index:100;margin-top:10px;margin-left:-10px; }
.topmenu .menuitem:hover { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99cdff', endColorstr='#99cdff'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#99cdff), to(#385998)); /* for webkit browsers */
    background:-moz-linear-gradient(#99cdff, #385998) repeat scroll 0 0 #99cdff; }
.topmenu .menuitem:hover a { color:#fff; }
.langmenu { float:right;margin-top:20px;margin-right:20px; }
.langbutton { float:right;margin:2px 2px 0 0;font-family:Arial,san-serif;width:20px;height:20px;border:1px solid #385998;color:#fff;cursor:pointer;display:block;font-size:15px;font-weight:bold;line-height:normal;padding:2px 4px;text-align:center;text-shadow:0 1px 0 #003399;text-transform:none;text-decoration:none;
    -moz-border-radius: 8px; /* Firefox */
    -webkit-border-radius: 8px; /* Safari, Chrome */
    border-radius: 8px; /* CSS3 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99cdff', endColorstr='#99cdff'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#99cdff), to(#385998)); /* for webkit browsers */
    background:-moz-linear-gradient(#99cdff, #385998) repeat scroll 0 0 #99cdff; }
.langbutton a { text-decoration:none;color:#fff; }
.slogin { margin-top:10px;float:right; }
.toptitle { display:block;float:left;padding-left:70px;width:220px;font-family:Arial,san-serif;cursor:pointer;font-size:20px;background:url("../images/presbyterian_logo_sml.png") no-repeat;background-size:70px 87px; }
.toptitle .ch { font-size:26px; }
.toptitle a { color:#000;text-decoration:none; }
.topmenubuttons { float:left; }
.topmenubutton { float:left;margin:15px 5px 0 5px;padding:5px;font-family:Arial,san-serif;height:25px;color:#000;cursor:pointer;display:block;font-size:18px;line-height:normal;padding:2px 4px;text-align:center;font-weight:bold;text-transform:none;text-decoration:none; }
.topmenubutton:hover { background-color:#CCD4FC; }
.topmenubutton a { text-decoration:none;color:#000; }
.mainbanners { display:block;overflow:hidden;width:958px;height:418px;border:none;z-index:20; }
.mainbanner { display:block;position:absolute;z-index:21; }
.bottombanners { margin-top:30px; }
.bottombanner { display:block;float:left;width:306px;height:109px;border:none;margin:8px 0 8px 20px; }
.bottombanner.first { margin:8px 0 8px 0; }  
.content { display:block;margin-left:20px;margin-right:20px;margin-bottom:20px;clear:both; }
.bannerbutton { display:block;position:absolute;cursor:pointer;width:15px;height:15px;background-color:#fff;-moz-border-radius:10px;-webkit-border-radius:10px;border-radius:10px;border:1px solid #385998;text-align:center;font-size:12px;margin-top:6px; }
.staffphoto { float:left;box-shadow:5px 5px 3px #ccc; }
.staffdesc { float:left; margin-left:30px;width:730px; }
.widebox { display:block;box-shadow:5px 5px 3px #ccc; padding:20px;border:1px solid #ccc;margin-bottom:40px; -moz-borderradius:8px;/* Firefox */
    -webkit-border-radius:8px; /* Safari, Chrome */
    border-radius:8px; /* CSS3 */ }
.newline { clear:both; }
.topbanner { display:block;width:1000px;height:300px;background:url("../images/topbanners/topbanner1.jpg") repeat scroll 0 0 #FFFFFF;
    -moz-border-radius: 8px; /* Firefox */
    -webkit-border-radius: 8px; /* Safari, Chrome */
    border-radius: 8px; /* CSS3 */ 
}
.tabs { margin-left:20px;margin-top:10px; }
.tab, .loctab { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffffff'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#ffffff)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #ffffff) repeat scroll 0 0 #ffffff; 
    -moz-border-top-right-radius:8px;-moz-border-top-left-radius:8px; /* Firefox */
    -webkit-border-top-right-radius:8px;-webkit-border-top-left-radius:8px; /* Safari, Chrome */
    border-top-right-radius:8px;border-top-left-radius:8px; /* CSS3 */
    text-shadow:2px 2px 2px #fff;cursor:pointer;float:left;font-size:16px;border:1px solid #ccc;padding:10px;font-weight:bold;display:block;box-shadow:5px 5px 3px #ccc;
}
.tabon { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #cccccc) repeat scroll 0 0 #ffffff; 
}
.tabline { width:100%;height:30px;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccccc', endColorstr='#ffffff'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#ffffff)); /* for webkit browsers */
    background:-moz-linear-gradient(#cccccc, #ffffff) repeat scroll 0 0 #ffffff; 
}
.icon { width:50px;height:50px; }
.sermons, .galleries { width:960px; }
.sermons th, .galleries th { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #cccccc) repeat scroll 0 0 #ffffff;
    padding:5px;
}
.sermons td, .galleries td { text-align:center;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #eeeeee) repeat scroll 0 0 #ffffff;
    padding:5px; }
.galleries th.date { width:200px; }
.galleries td { cursor:pointer;color:#385998; }
.paging { width:960px;text-align:center;margin-top:20px; }

.calendar { width:960px; border-collapse:collapse; }
.calendar th, .calendarmin th { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #cccccc) repeat scroll 0 0 #ffffff; 
    text-shadow:2px 2px 2px #fff;font-size:16px;border:1px solid #ccc;padding:10px;font-weight:bold;display:block;height:30px;
    -moz-border-top-left-radius:8px;-moz-border-top-right-radius:8px; /* Firefox */
    -webkit-border-top-left-radius:8px;-webkit-border-top-right-radius:8px; /* Safari, Chrome */
    border-top-left-radius:8px;border-top-right-radius:8px; /* CSS3 */ 
}
.calendarmin th { padding:0;font-size:13px;height:13px; } 
.calendarmin { width:306px; border-collapse:collapse;cursor:pointer; }
.calendarmin td { border-collpase:collpase;font-size:11px;border:1px solid #999;text-align:right;padding-right:5px;width:43px;vertical-align:top;}
.calendarmin td .date { font-size:11px;display:block; }
.calendarmin .days td { font-size:11px; }
.calendar td { border-collpase:collpase;border:1px solid #999;text-align:right;padding-right:5px;width:129px;vertical-align:top;min-height:100px;display:block;float:left; }
.calendar td .date { font-size:24px;display:block; }
.calendar .days, .calendarmin .days { background-color:#F1F3F5; }
.calendar .actday, .calendarmin .actday { background-color:#CCD4FC; font-weight:bold; }
.calendar .events { width:100%;text-align:left; }
.monthbutton { margin:2px 2px 0 0;font-family:Arial,san-serif;width:50px;height:20px;border:1px solid #385998;color:#fff;cursor:pointer;display:block;font-size:15px;font-weight:bold;line-height:normal;padding:2px 4px;text-align:center;text-shadow:0 1px 0 #003399;text-transform:none;text-decoration:none;
    -moz-border-radius: 8px; /* Firefox */
    -webkit-border-radius: 8px; /* Safari, Chrome */
    border-radius: 8px; /* CSS3 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#99cdff', endColorstr='#99cdff'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#99cdff), to(#385998)); /* for webkit browsers */
    background:-moz-linear-gradient(#99cdff, #385998) repeat scroll 0 0 #99cdff;
}
.monthbutton.leftside { float:left; }
.monthbutton.rightside { float:right; }
.calendarmin .monthbutton { font-size:13px;height:12px;margin:0 2px; 0 0;padding:0; }
.calendar .events .event { cursor:pointer;color:#385998; }
.popupdiv { display:block; }
.popupdiv h3 { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cccccc'); /* for IE */
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#cccccc)); /* for webkit browsers */
    background:-moz-linear-gradient(#ffffff, #cccccc) repeat scroll 0 0 #ffffff;
    padding:5px;width:870px;text-align:center; }
.closebtn { position:absolute;top:-15px;right:-15px;display:block;background:url('../images/close_button.png') no-repeat center center transparent;background-size:30px 30px;width:30px;height:30px;cursor:pointer; }
.popupdiv .fieldname { position:relative;padding:5px;display:block;float:left;width:150px;border:1px solid #ccc;background-color:#ccc; }
.popupdiv .fieldvalue { position:relative;padding:5px;display:block;float:left;width:705px;border:1px solid #ccc;margin-bottom:10px; }
.galleries .gallerygrid { padding:10px; }
.galleries .thumb { float:left;box-shadow:5px 5px 3px #ccc;border:3px solid #fff;width:100px;height:100px;margin-right:10px;margin-bottom:10px; }
.popupdiv.galleryframe { text-align:center; }
.galleryphoto { box-shadow:5px 5px 3px #ccc; }
#map_canvas1, #map_canvas2 { width:960px;height:480px; }