/* Custom css styling for Vallentuna Dans
with theme Blogstream by Alexander Agnarson as platform

247,148,29,xx = Vallentuna Dans orange (rgb), xx sets the opacity
#F7941D= Vallentuna Dans orange (hex)
29,128,247,xx = complement color blue (rgb), xx sets the opacity
#1d80f7 = complement color blue (hex)

*/ 
/*========= Main layout of site ======================================================

/* set site background to Vallentuna Dans orange (95% opacity) with gradient to white*/
.main{
	background: linear-gradient(180deg, rgba(247,148,29,0.95) 1%, rgba(255,255,255,1) 100%) !important;
}
/* set the width, and turn off shadowed outline of content area */
#wrapper{
	max-width: 1300px!important;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
/* set the size and weight of header text "Vallentuna Dans" since we use .site-title
as container for logotype*/
.site-description{
	/*font-family: "Lucida Bright", serif;*/
	font-size: 3em !important;
	font-weight: 600 !important;
	color: rgb(29,128,247,1)!important;
}
/*set the background image to fill browser window*/
.site-image{
	width: -webkit-fill-availabl1
}
.entry-footer{
	display: none;
}
.toggle-search{
	top:-75px!important;
	z-index:99;
}
.search-expand{
	top:-55px;
}
#header{
    border-bottom: none!important;
}
/*=====================================================================================*/

/*========== Menu layout ==============================================================*/

/* turn off the bottom border in header so only bottom shadow is visible*/
#header{
	border-bottom: 0px solid #1d80f7;
}
/* set menu text color to complement color */
.nav-menu a{
	color: #1d80f7 !important;
}
/* set the backgound color of active menu item to complement color with 20% opacity*/
/* TODO .... shorten the reference list */
.nav-menu:not(.mobile) .menu > li.current_page_item > span, .nav-menu:not(.mobile) .menu > li.current-menu-item > span, .nav-menu:not(.mobile) .menu > li.current-menu-ancestor > span, .nav-menu:not(.mobile) .menu > li.current-post-parent > span {
	background: rgb(29,128,247,0.2) !important;
}
/* set background color in menu drop down list */
.nav-menu .menu ul {
	background: #F8F9F9  !important;
}
/*==================================================================================*/

/*======= Blog post layout ==========================================================*/

/* turn off some design features from theme that not fit in Vallentuna Dans design */
.entry-line-bullet{
	display:none;
}
.entry-line{
	display:none
}
/* turn off author and category from meta data information box */
.entry-category{
	display: none
}
.byline{
	display:none;
}
/* set text style in meta data information box */
.entry-meta-inner {
	font-size: 1em;
	color:rgb(0,0,0,0.8);
}
/* set text style and position in blog post header,
padding-left and padding-right should be the same as
.entry-content to have a stright left side of text
prefer to use % as the site will be more responsive*/
.entry-title {
	/*color:rgb(0,0,0,0.8) !important;*/
	font-weight:500 !important;
}
.entry-header{
	max-width: 100%;
	padding-left: 7% !important;
	padding-right:7% !important;
}
/* set text position in post blog content */
.entry-content{
	padding-left: 7% !important;
	padding-right: 7% !important;
	max-width: 870px !important;
}
/* override theme style */
.entry-content a {
	text-decoration: underline;
	color: #1d80f7;
}
/* style image block inside blog post */
.wp-block -image{
	
}
/* set background color in buttons with Vallentuna Dans orange and black border*/
.wp-element-button{
	background-color:rgb(247,148,29,0.6)!important;
	border: 2px solid!important;
	color: currentcolor !important;
}
p:has(> strong){
	padding-top:1em;
}
.alt p{
	padding-top:1em;
}
:where(.wp-block-columns.is-layout-flex){
	gap:0em!important;
}
/*==============================================================================*/

/*=========== Side Bar =========================================================*/
.dansdotse-post-item{
	margin: 0px!important;
	padding: 8px 0px 0px!important;
	line-height:1.2em;
}
.dansdotse-post-title{
	-webkit-line-clamp:1!important;
}
.dansdotse-post-item div{
	display: inline-flex!important;
}
.widget > ul li:before{
	display: inline!important;
}
.widget > h3{
	margin:0px;
}
/* set size and layout of side bar element */
.widget{
	margin-bottom: 4% !important;
	border-radius: 16px !important;
	/*width: 260px !important;*/
}
/* set the sidebar position in respect to right side */
/*if width in .sidebar is changed then padding-right and width */
/* must follow otherwise the sidebar will overflow right side*/
.col-2cl .main-inner{
	padding-right:370px !important;
}
.sidebar .widget{
	width: 89%;
	padding: 20px 30px 20px;
}
/* format the side bar header, text color should be the complement color */
.sidebar .group{
	color: #1d80f7;
	font-size:1.2em;
	font-weight:900;
	text-transform: uppercase
}
.sidebar .post-nav{
    display: none;
}

/*======================================================================*/

/*========== Blog Post Content =========================================*/

/* set text position and layout on blog post conent */
.wp-block-post-template{
	margin: 2em 0 15px 0 !important;
}
.wp-block-post-content{
	padding: 0 0 0 0 !important;
	margin-top: 5% !important;
}
/* set layout on links in blog post title */
.wp-block-post-title a {
	text-decoration: none !important;
	box-shadow: 0 0 0 !important;
	/*color: #1d80f7 !important;*/
}
.wp-block-post-template h2{
	font-weight:500 !important;
	font-size: 1.3em !important;
	/*color: #1d80f7 !important;*/
	color: #73798e!important;
}
/*=========================================================================*/

/*=========== Bugs ============================================================= */
#bug-library-item-table{
	/*overflow-x:auto;*/
}
#bug-library-item-table td{
	max-width: 100px;
	overflow-x:auto;
}
#bug-library-currentfilters{
	display:none;
}
#bug-library-newissuebutton{
	display:none;
}
#bug-library-data2{
	display:none;
}
input#new-bug-title{
	width: 85%!important;
}
/* ========== General ===========================================================*/

/* style the list format globaly */
.entry ul li, .entry ol ul li{
	list-style:disc !important;
	margin: 0px !important;
}
.entry a {
	box-shadow:0 0 0;
}
.entry p{
	margin-bottom:1em;
}
.entry ul{
	margin: 0 0 15px 20px;
}
/*============================================================================*/

/*===================== style the Cogwork app ================================*/
.cwInfoArea > h2{
	font-size:1.5em;
}
.cwProfileImageHolder{
	padding-bottom:1em;
}
.cwProfileImage{
	/*width:800px!important;*/
	height:400px!important;
	max-width:100%;
	object-fit:content;
	display:block;
	margin-right:auto;
	margin-left:auto;
}
.cwEvents{
	font-size: 0.75em!important;
	line-height:normal;
}
TABLE.cwEvents .title A{
	font-size:0.9em;
	padding-left:0!important;
}
TABLE.cwEvents .title{
	padding-left:0!important;
}
div:has(> table){
	overflow-x:auto;
}
.sl-close{
	top:60px !important;
}
.galogin{
	display:none;
}
.wp-print{
	position:absolute;
	top: 40px;
	right: 20px;
}
.cwOccasions{
	width: 50%!important;
}
.cwOccasions caption{
	text-align:left;
}
.cwOccasions td{
	border: 0px solid!important;
}
/*==============================================================================*/

/*============= Init animation =================================================*/
@keyframes resize {
  from {transform:scale(0.1);}
  to {transform:scale(1);}
}
/*===============================================================================*/

/*============= Check-in ========================================================*/
#result_checkin{
	font-size: 1.5em!important;
}
#result_checkin div{
    position: fixed;
    top: 250px;
    left: 25%;
    width: 900px;
    height: 350px;
	padding-top: 50px;
    border-radius: 10px;
	text-align: center;
    box-sizing: border-box;
	box-shadow: 5px 5px rgb(0 0 0 / 0.1);
	animation-name: resize;
	animation-duration: 0.5s;
}
#result_checkin h3{
	font-size: 1.3em!important;
	font-weight: 4;
	font-style: italic!important;
}
#wait_checkin {
    position: fixed;
	background-color: tomato;
	color:white;
	font-size: 1.5em!important;
    top: 350px;
    left: 25%;
    width: 200px;
    height: 75px;
	line-height: 75px;
    border-radius: 10px;
	text-align: center;
    box-sizing: border-box;
	box-shadow: 5px 5px rgb(0 0 0 / 0.1);
	animation-name: resize;
	animation-duration: 0.5s;
	display: none;
}
.cwCheckin-content h6{
	color:cadetblue;
	margin-bottom:0px;
}
.cwCheckin-open{
	font-style: italic!important;
	font-size: 0.95em;
}
.cwCheckin-image-container{
	display: inline-block;
	width: 29%;
}
.cwCheckin-image-container img{
	padding-bottom:75px;
}
.cwCheckin-info{
	display: inline-block;
	width: 70%;
}
/*===========================================================================*/

/*============= Member-check =================================================*/
#result_member{
	font-size: 1.5em!important;
}
#result_member div{
    position: fixed;
    top: 250px;
    left: 25%;
    width: 900px;
    height: 350px;
	padding-top: 50px;
    border-radius: 10px;
	text-align: center;
    box-sizing: border-box;
	box-shadow: 5px 5px rgb(0 0 0 / 0.1);
	animation-name: resize;
	animation-duration: 0.5s;
}
#result_member h3{
	font-size: 1.3em!important;
	font-weight: 4;
	font-style: italic!important;
}
#wait_member {
    position: fixed;
	background-color: tomato;
	color:white;
	font-size: 1.5em!important;
    top: 350px;
    left: 25%;
    width: 200px;
    height: 75px;
	line-height: 75px;
    border-radius: 10px;
	text-align: center;
    box-sizing: border-box;
	box-shadow: 5px 5px rgb(0 0 0 / 0.1);
	animation-name: resize;
	animation-duration: 0.5s;
	display: none;
}
.cwCheckin-content h6{
	color:cadetblue;
	margin-bottom:0px;
}
.cwCheckin-open{
	font-style: italic!important;
	font-size: 0.95em;
}
.cwCheckin-image-container{
	display: inline-block;
	width: 29%;
}
.cwCheckin-image-container img{
	padding-bottom:75px;
}
.cwCheckin-info{
	display: inline-block;
	width: 70%;
}
/*===========================================================================*/

/*===== Handling the adaptive functions for screen between 460 and 965px ====*/
@media only screen and (max-width: 965px){
	.col-2cl .main-inner{
		padding-right:10px !important;
	}
	.toggle-search .svg-icon{
		fill:white;
	}
	.site-description{
		display: inherit;
		width:100%;
		text-align:center;
		font-size: 2.5em!important;
		margin-top:0!important;
		/*font-family: "Lucida Bright", serif;*/
	}
	.site-title{
		border-bottom: 0px solid #e4e6ed;
	}
	#header img{
		display: none;
	}
	#header {
		box-shadow: none;
	}
}
/*============================================================================*/

/*===== Handling the adaptive funktions for screen smaller than 966px ========*/
@media only screen and (max-width: 470px /*965px*/){
	
	#header .pad{
		padding-bottom: 30px;
	}
	.site-description{
		display:inherit;
		width:100%;
		text-align:center;
		font-size: 2em!important;
		margin-top:0!important;
		/*font-family: "Lucida Bright", serif;*/
	}
	.site-title{
		border-bottom: 0px solid #e4e6ed;
	}
	.site-image{
		width: 100%;
		height: auto;
		max-height: 430px;
		object-fit: cover;
		object-position: center;
		content: url(https://www.vallentunadans.se/wp-content/uploads/2024/01/vallentunadans_BG_mobile_2.png);
	}
	#header img{
		display: none;
	}
	#header-bottom{
		position: absolute;
		width: 100%;
	}
	#nav-mobile-nav{
		background-color: transparent !important;
	}
	.menu-toggle-icon span{
		background:white;
	}
	.toggle-search .svg-icon{
		fill:white;
	}
	#nav-mobile{
		/*width:70%!important;*/
		position:relative;
		z-index:500;
		background:rgb(250,250,250,1) !important;
	}
	.menu-meny-container{
		position:absolute!important;
		width: 70%!important;
	}
	.toggle-search{
		top:5px;
		left:20px;
	}
	#nav-header{
		visibility:hidden;
	}
	.nav-menu.mobile button:focus, .menu-toggle:focus{
		background:transparent !important;
	}
	.col-2cl .main-inner{
		padding-right:10px
	}
	.nav-menu a {
		/*color: rgb(0,0,0,0.9) !important;*/
	}
	.menu-toggle{
		display:block!important;
		float:right;
		top:20px;
	}
	.content{
		padding-right: 15px!important;
		padding-left:15px!important;
	}
	.sidebar-content{ padding:20px;
	}
	.em-icon-clock{
		display: none !important;
	}
	.em-icon-location{
		display: none !important;
	}
	.locations{
		display:none;
	}
	.col-2cl .main-inner{
		padding-right:0% !important;
		padding-left: 0% !important;
	}
	.em-item-info{
		font-size:0.9em;
	}
	/* set the column size för location and event in location view*/
	.em-item-meta-line{
		grid-template-columns:90% !important;
	}
	.wp-block-site-logo img{
		/*max-width: 50%;*/
		float:right;
	}
	.wp-block-site-logo p{
		display:flow-root;
	}
	.wp-block-site-logo{
	    width: 40%;
    	padding-left: 10px;
	}
	/* style the Cogwork app */
	.cwProfileImage{
		width:800px!important;
		height:auto!important;
		max-width:100%;
		object-fit:cover;
	}
	.wp-print{
		display: none;
	}
	.cwOccasions{
		width: 100%!important;
}
}
@media print{
	.main-inner{
		padding-right:0px!important;
	}
	.col-2cl{
		padding-right:0px!important;
	}
}

