/* --------------- (c) 2017 alogis ag / beat schaub ----------------------------------------------------------------------------------------------------------------- */
@charset "utf-8";
/* --------------- Colors & Z-Stack ------------------------------------------------------------------------------------------------------------------------------------
blue															#065da6				rgba( 6,93,166,1 )
light blue													#598ac2				rgba( 89,138,194,1 )
bright blue													#35a2db				rgba( 53,162,219,1 )
------------------ End Colors --------------------------------------------------------------------------------------------------------------------------------------- */
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* --------------- Skelleton ---------------------------------------------------------------------------------------------------------------------------------------- */
html															{ }
body															{ font-family: 'Muli', sans-serif; color: #464646; font-size: 15px; line-height: 24px; font-weight: 300; }
main															{ position: relative; z-index: 10; display: block; }
main section:last-of-type								{ padding-bottom: 100vH !important; }

.container													{ width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 24px; }
.flex_container											{ display: flex; justify-content: space-between; flex-wrap: wrap; width: 100%; }
.flex_container.flex_container_left					{ justify-content: flex-start;  }
.flex_container.flex_container_center				{ justify-content: center;  }
.flex_box_empty											{ padding: 0 !important; margin: 0 !important; }

main a														{ color: #065da6; text-decoration: none; }
main a:hover												{ text-decoration: underline; }
main ul														{ padding-left: 18px; }

.section_slider 											{ overflow: hidden; }
/* --------------- End Skelleton ------------------------------------------------------------------------------------------------------------------------------------ */
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* --------------- HEADER ------------------------------------------------------------------------------------------------------------------------------------------- */
header														{ position: absolute; left: 0; top: 0; z-index: 1000; width: 100%; box-shadow: 0 0 10px rgba( 0,0,0,0.25 ); }
.scrolled header											{ position: fixed; top: -100px; }

/* --------------- SERVICE & LOGO ----------------------------------------------------------------------------------------------------------------------------------- */
header .servic_box_50									{ width: 49.45%; padding: 20px 0 0 0; }
header .servic_box_25									{ width: 32.6%; }

#search														{ position: relative; width: 100%; }
#search input[type="text"]								{ width: 85%; }
#search input[type="submit"]							{ width: 15%; border-color: #065da6 !important; background: url("/pages/img/icons/search_white.svg") no-repeat center #065da6; background-size: auto 14px; }
#search input[type="submit"]:hover					{ background-color: #2c2c2c !important; border-color: #2c2c2c !important; }

header #sNav												{ width: calc(100% + 100px); margin-left: -100px; }
header #sNav ul											{ display: flex; align-items: center; justify-content: flex-end; padding: 6px 0 20px 0; }
header #sNav ul:after									{ display: block; content: ""; clear: both; }
header #sNav ul li										{ list-style: none; float: left; padding: 4px 0; }
header #sNav ul li:last-child a						{ margin-right: 0; padding-right: 0; border-right: none; }
header #sNav ul li a										{ display: block; margin-right: 12px; padding-right: 12px; font-size: 13px; letter-spacing: 1px; line-height: 16px; color: #000000; text-decoration: none; text-align: center; border-right: 1px solid #000000; }

header #logo												{ display: block; position: relative; width: 192px; height: 60px; margin: 15px 0 0 0; background: url("/pages/img/Reformierte_Kirche_Aarau_Wortmarke_CMYK.svg") no-repeat left center; background-size: contain; }
header #logo .logo_text									{ display: none; }

/*header #logo												{ display: block; position: relative; width: 192px; height: 60px; margin: 20px 0 0 0; padding: 11px 71px 0 0; line-height: 16px; font-size: 12px; color: #464646; text-decoration: none; }
header #logo:after										{ display: block; position: absolute; right: 0; top: 0; width: 60px; height: 60px; content: ""; background: url("/pages/img/logo.png") no-repeat right center; background-size: contain; }*/

/* --------------- NAVIGATION --------------------------------------------------------------------------------------------------------------------------------------- */
header #mNav												{ background: #065da6; }
header #mNav ul li										{ list-style: none; }
header #mNav ul li a										{ display: block; padding: 10px; font-size: 13px; font-weight: bold; line-height: 30px; color: #ffffff; text-decoration: none; text-align: center; }
header #mNav ul li.current a							{ background: #598ac2; color: #ffffff; }
header #mNav ul li a:hover								{ background: #598ac2; color: #ffffff; }

header #msNav												{ background: #598ac2; }
header #msNav ul											{ }
header #msNav ul li										{ list-style: none; padding-right: 3px; }
header #msNav ul li a									{ display: block; padding: 0 10px; font-size: 13px; font-weight: bold; line-height: 30px; color: #ffffff; text-decoration: none; text-align: center; }
header #msNav ul li a:hover							{ background: #35a2db; color: #ffffff; }

header #hFB													{ display: block; position: absolute; left: -40px; top: -2px; width: 30px; height: 30px; background: #598ac2; opacity: 0.5; border-radius: 5px; cursor: pointer; }
header #hFB:after											{ display: block; content: ""; position: absolute; left: 5px; top: 5px; width: 20px; height: 20px; background: url("/pages/img/facebook_white.svg") no-repeat center; background-size: contain; }
header #hFB:hover											{ background-color: #065da6; opacity: 1; }
header #hInsta												{ display: block; position: absolute; left: -80px; top: -2px; width: 30px; height: 30px; background: #598ac2; opacity: 0.5; border-radius: 5px; cursor: pointer; }
header #hInsta:after										{ display: block; content: ""; position: absolute; left: 5px; top: 5px; width: 20px; height: 20px; background: url("/pages/img/instagram_white.svg") no-repeat center; background-size: contain; }
header #hInsta:hover										{ background-color: #065da6; opacity: 1; }
header #hYT													{ display: block; position: absolute; left: -120px; top: -2px; width: 30px; height: 30px; background: #598ac2; opacity: 0.5; border-radius: 5px; cursor: pointer; }
header #hYT:after											{ display: block; content: ""; position: absolute; left: 5px; top: 5px; width: 20px; height: 20px; background: url("/pages/img/yt_white.svg") no-repeat center; background-size: contain; }
header #hYT:hover											{ background-color: #065da6; opacity: 1; }

@media screen and (max-width: 959px) {
header #hFB													{ display: none; position: fixed; left: 6vW; top: 15px; opacity: 1; }
body.open header #hFB									{ display: block; z-index: 10000000; }
header #hInsta												{ display: none; position: fixed; left: calc(6vW + 40px); top: 15px; opacity: 1; }
body.open header #hInsta								{ display: block; z-index: 10000000; }
header #hYT													{ display: none; position: fixed; left: calc(6vW + 80px); top: 15px; opacity: 1; }
body.open header #hYT									{ display: block; z-index: 10000000; }

}


/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* --------------- SECTIONS ----------------------------------------------------------------------------------------------------------------------------------------- */
section													{ display: block; width:100% }
section.section_stretch									{ background-repeat: no-repeat; background-position: center; background-size: cover; }
section.section_pattern									{ background-repeat: repeat; background-position: left Top; }
section.article											{ padding: 30px 0 0 0; }
section.article > div									{ position: relative; }
section.article > div > h1								{ margin: 0; line-height: 40px; font-size: 32px; padding-bottom: 20px; color: #598ac2 }

/*section.section_slider									{ height: 20.8333vW; max-height: 400px; }*/
section.section_slider									{ height: 50vW; max-height: 600px; }

h1																{ width: 100%; line-height: 36px; font-size: 24px; font-weight: 200; }
h2																{ width: 100%; line-height: 30px; font-size: 20px; font-weight: 200; padding-bottom: 10px; margin-bottom: 15px; border-bottom: 2px solid #646464; }
/* --------------- FLEX BOXES --------------------------------------------------------------------------------------------------------------------------------------- */
.flex_container											{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-wrap: wrap; flex-wrap: wrap; width: 100% }
.flex_box													{ margin-bottom: 40px; }

.flex_box img												{ width: 100%; padding-bottom: 8px; }
.flex_box_33												{ width: 30%; }
.flex_box_66												{ width: 65%; }
.flex_box_50												{ width: 47.5%; }
.flex_box_100												{ width: 100%; }

.flex_box.flex_box_3-2-1								{ width: 30%; }
.flex_box.flex_box_2-2-1								{ width: 45%; }
.flex_box.flex_box_4-2-1								{ width: 23%; }
.flex_box.flex_box_2-1-1								{ width: 23%; }
.flex_box.flex_box_75-2-1								{ width: 75%; }
.flex_box.flex_box_75-75-100							{ width: 75%; }
.flex_box.flex_box_25-25-100							{ width: 25%; }
.flex_box.flex_box_50-100-100							{ width: 47.5%; }

.infobox														{ position: relative; border: solid #598ac2; border-width: 2px 2px 2px 40px; padding: 18px; margin-bottom: 20px; font-weight: bold; }
.infobox:after												{ display: block; content: ""; position: absolute; left: -30px; top: 50%; width: 20px; height: 32px; margin-top: -16px; background: url("/pages/img/info.svg") no-repeat center #ffffff; background-size: 100% auto; }
/* --------------- TEAM --------------------------------------------------------------------------------------------------------------------------------------------- */
.team_box													{ display: -webkit-flex; display: flex; -webkit-justify-content: space-between; justify-content: space-between; -webkit-flex-wrap: wrap; flex-wrap: wrap;
																  width: 100%; }
.team_text													{ width: 59%; }
.team_image													{ width: 40%; }
/* --------------- TEAM --------------------------------------------------------------------------------------------------------------------------------------------- */
.cms_table													{ width: 100%; }
.cms_table td												{ padding-right: 15px; }
.cms_table td:last-child								{ padding-right: 0; }
/* --------------- EVENTS ------------------------------------------------------------------------------------------------------------------------------------------- */
.evtFilter_container										{ width: 100%; padding: 20px; background: rgba( 89,138,194,0.5 ); }
.flex_box_evtFilter * 									{ width: 100%; }
.evtFilter_container	.flex_box						{ margin-bottom: 0px; }
.evtFilter_container input,
.evtFilter_container select							{ background: #ffffff; border: 1px solid #dddddd; }

#event_lst_box												{ width: 100%; padding: 0 0 40px 0; }
#event_lst_box tr.row_0 td								{ background: rgba( 100,100,100,0.1 ); }
#event_lst_box tr.row_toggle:hover td				{ background: #7bacdc; color: #ffffff; cursor: pointer; }

.evtOpen														{ padding-right: 5px; padding-left: 5px; }
.evtOpen div												{ width: 24px; height: 24px; }
.evtOpenLoud div											{ background: url("/pages/img/icons/arrow_right_686868.svg") no-repeat center; background-size: auto 14px; }
.evtOpenLoud div:hover									{ background: url("/pages/img/icons/arrow_right_065da6.svg") no-repeat center; background-size: auto 14px; }
.open .evtOpenLoud div									{ background: url("/pages/img/icons/arrow_down_686868.svg") no-repeat center; background-size: 16px auto; }
.open .evtOpenLoud div:hover							{ background: url("/pages/img/icons/arrow_down_065da6.svg") no-repeat center; background-size: 16px auto; }

#event														{ width: 100%; border-bottom: 2px solid rgba( 100,100,100,0.3 ); }
#event thead td											{ font-weight: bold; padding: 10px 0; background: rgba( 100,100,100,0.3 ); }
#event tbody td											{ padding-top: 3px; padding-bottom: 3px; }
.evtDate														{ white-space: nowrap; padding-right: 10px; }
.evtTime														{ white-space: nowrap; padding-right: 25px; }
.evtTitle													{ width: 100%; padding-right: 25px; font-weight: bold; }
.evtLocation												{ white-space: nowrap; padding-right: 25px; }
.evtContact													{ white-space: nowrap; padding-right: 10px; }
.evtText														{ padding-right: 10px; }

.row_hidden													{ display: none; }
.row_hidden td												{ padding-bottom: 23px !important; }
.row_hidden.open											{ display: table-row; }

/* --------------- GALLERY ------------------------------------------------------------------------------------------------------------------------------------------ */
.gal_box														{ margin-bottom: 40px; }
.gal_box:hover												{ text-decoration: none !important; background: rgba( 255,255,255,0.5 ); }
.gal_box > div												{ margin-bottom: 0px; }
.gal_picture												{ background-repeat: no-repeat; background-position: center; background-size: cover; }
.gal_picture img											{ width: 100%; }
.gal_title													{ font-weight: bold; }
.gal_text													{ color: #464646; }
.gal_text:hover											{}
.gal_box_2019												{ background: #f5f5f5; }
.gal_box_2019:hover										{ background: #598ac2; color: #ffffff; }
.gal_box_2019:hover .gal_text							{ color: #ffffff; }
.gal_box_2019 > div:nth-of-type(2)					{ padding: 15px; }

/* --------------- ROOM --------------------------------------------------------------------------------------------------------------------------------------------- */
.room_container											{ padding-top: 20px; }
.room_container .flex_container						{ padding: 15px 0 45px 0; }

.room_location_title										{ padding: 5px 15px; line-height: 30px; font-size: 20px; background: #eeeeee; }
.flex_box_roo												{ color: #464646; text-decoration: none; }
.flex_box_roo:hover										{ text-decoration: none; }
.flex_box_roo:hover h2									{ color: #065da6; border-color: #065da6 !important; }
.flex_box_roo:hover .roo_button						{ background: #065da6; }
.roo_button													{ width: 50%; margin: 15px 0 0 50%; padding: 3px 0; background: #598ac2; color: #ffffff; text-align: center; }

.roo_det_gallery_toggler								{ width: 100%; margin-top: 15px; border-top: 2px solid #eeeeee; }
.roo_det_gallery_toggler div:after					{ display: block; content: ""; clear: both; }
.roo_det_gallery_toggler div							{ float: right; min-width: 18.4%; padding: 0 15px; background: #eeeeee; cursor: pointer; text-align: center; }
.roo_det_gallery_toggler div .gallery_hide		{ display: none; }
.open .roo_det_gallery_toggler div .gallery_hide{ display: block; }
.open .roo_det_gallery_toggler div .gallery_show{ display: none; }

.roo_det_gallery_toggler div:hover					{ background: #065da6; color: #ffffff; }


.room_box													{ margin-bottom: 40px; color: inherit; text-decoration: none !important; }
.room_box:hover											{ cursor: pointer; background: rgba( 255,255,255,0.5 ); }
.room_box .flex_box										{ margin-bottom: 0; }
.room_text													{ padding-top: 10px; }
.room_text > *												{ padding-left: 15px !important; padding-right: 15px !important; }
.room_image													{ line-height: 1px; }
.room_image img											{ padding-bottom: 0; }

.roo_det_text div:after									{ display: block; content: ""; clear: both; }
.roo_det_image												{ float: right; width: 52%; padding: 0 0 10px 4%; }
.roo_det_instructions									{ padding-top: 20px; }
.roo_det_gallery											{ width: 100%; height: 150px; overflow: hidden; }
.open .roo_det_gallery									{ height: auto; }
.roo_det_gallery .container							{ padding: 0; }

.roo_res_box												{ width: 50%; margin: 0 auto; padding: 0 0 20px 0; }
.roo_res_box table										{ width: 100%; }
.roo_res_box table td.roo_res_label					{ padding: 2px 15px 2px; font-weight: bold; white-space: nowrap; }
.roo_res_box table td.roo_res_input					{ width: 100%; padding: 2px 0; line-height: 25px; }
.roo_res_box table td.roo_res_input > *			{ width: 100%; }
.roo_res_box table td.roo_res_input_flex > label{ width: 32% !important; }
.roo_res_box table td.roo_res_input_flex .wZip	{ width: 19% !important; margin: 0 !important; }
.roo_res_box table td.roo_res_input_flex .wCity	{ width: 80% !important; }

.date_error													{ padding: 10px; border-left: 5px solid #f00000; background: rgba( 240,0,0,0.6 ); color: #ffffff; }
.date_show													{ padding-bottom: 39px; margin-bottom: 39px; border-bottom: 2px solid #646464; }
.date_date													{ position: relative; padding: 0 30px 0 0; }
.date_date:nth-of-type(2N)									{ background: #f0f0f0; }
.date_date_del												{ display: block; content: ""; position: absolute; top: 0; right: 0; width: 24px; height: 24px; cursor: pointer; background-color: #dddddd; background-image: url("/pages/img/del_white.svg"); background-position: center; background-repeat: no-repeat; background-size: 16px auto; }
.date_date_del:hover										{ background-color: #f00000; }
#getall 														{ color:#065da6;float:right; cursor:pointer;}
#getall:hover 												{color:#598ac2}
.getFullsizeGallery										{ height:auto !important; overflow:visible;}

/* --------------- SEARCH ------------------------------------------------------------------------------------------------------------------------------------------- */
#section_search .search_box							{ padding: 0 0 40px 0; }
#section_search ul:after								{ display: block; content: ""; clear: both; }
#section_search ul li									{ float: left; list-style: none; }
#section_search ul li.search_cat						{ padding-right: 21px; position: relative; }
#section_search ul li.search_cat:before			{ display: block; content: ""; position: absolute; right: 0px; top: 5px; border-width: 6px; border-style: solid; border-color: transparent transparent transparent #7c7c7c; }
#section_search ul li.search_cat:after				{ display: block; content: ""; position: absolute; right: 2px; top: 5px; border-width: 6px; border-style: solid; border-color: transparent transparent transparent #eeeeee; }
#section_search ul li a									{ padding: 3px 0; line-height: 16px; height: 22px; }
#section_search ul li.search_cat a					{ color: #7c7c7c; }
#section_search ul li.search_cat a:hover			{ color: #065da6; }
/* --------------- HOME Agenda -------------------------------------------------------------------------------------------------------------------------------------- */
.new_flex_container										{ display: flex; justify-content: flex-start; flex-wrap: wrap; width: 100%; margin: 0; padding: 20px; }
.new_flex_box												{ padding: 20px; }
.new_flex_box_33											{ width: 33.3333%; }

.home_agenda_box > div									{ height: 100%; background: #f5f5f5; cursor: pointer; }
.home_agenda_box:hover > div							{ background: #598ac2; color: #ffffff; }
.home_agenda_image										{ padding: 30%; background-repeat: no-repeat; background-position: center; background-size: cover; }
.home_agenda_title										{ padding: 15px; font-size: 13px; font-weight: bold; }
.home_news_image											{ position: relative; }
.home_news_image > div									{ position: absolute; top: 15px; right: 0; padding: 0 15px; line-height: 30px; text-transform: uppercase; color: #ffffff; letter-spacing: 1px; font-weight: bold; background: #F10026; }
.home_news_image > div:after							{ display: block; content: ""; position: absolute; top: 0px; left: -10px; border-style: solid; border-width: 30px 10px; border-color: #F10026 transparent transparent transparent }

#section_49 > div > div									{ display: none; }


/* --------------- END SECTIONS ------------------------------------------------------------------------------------------------------------------------------------- */
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */

.button_blue												{ background: #7bacdc !important; color: #ffffff; }
.button_blue:hover										{ background: #065da6 !important; }
.button_grey												{ background: #7bacdc !important; color: #ffffff; }
.button_grey:hover										{ background: #065da6 !important; }

.mobile														{ display: none; }


/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */
/* --------------- infoscreen ------------------------------------------------------------------------------------------------------------------------------------- */

.infoscreen_body					{ margin: 0px; }
.infoscreen_header 				{ margin: 0px; padding: 0px; width: 100%; background-color: white; color: #075CA5; text-align: center; line-height: 100px; font-size: 36px; }
.infoscreen_titel  	 			{ margin: 0px; line-height: 100px; font-size: 60px; font-weight: bolder; }
.infoscreen_footer 				{ margin: 0px; padding: 0px; width: 100%; height: auto; color: white; text-align: center; line-height: 40px; font-size: 28px; position: fixed; left: 0; right: 0; bottom: 0; }
.infoscreen_blauerBalken 		{ z-index: 20; margin: 0px; padding: 0px; width: 100%; height: auto; color: white; background-color: #075CA5; text-align: center; line-height: 70px; font-size: 40px; font-weight: normal; }
.infoscreen_datenBereich 		{ z-index: 0; margin: 0px; padding: 0px; min-height: -webkit-fill-available; color: black; text-align: left; background-color: #DAE3F3; }
.infoscreen_footer .infoscreen_time 					{ font-size: 15px; position: absolute; right: 5px; }
.infoscreen_table 				{ margin: 0px; width:1400px; line-height: 63px; font-size: 45px; padding-top: 200px; padding-bottom: 20px; margin-left: auto; margin-right: auto; font-weight: bolder; }
.infoscreen_td 					{ padding: 5px; }

/* --------------- ENDE infoscreen ------------------------------------------------------------------------------------------------------------------------------------- */
/* XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX */