cwsvJudo/homepage/redesign2018/markdownExperiment/wkParticipo/styleDev.css

/* Box-Sizing global auf die BorderBox stellen */
html{
	box-sizing: border-box;
}
*, ::before, ::after {
	box-sizing: inherit;
}


body{
	background-color: #ffae00;
}


.loginForm{}
.loginForm fieldset{
	display: flex;
	flex-direction: row;
}

/* touchable Links*/
.touchLink{
	display: inline-block;
	padding: 0.25em 0 0.25em 0;
	margin: 0.25em 0 0.25em 0;
	background-color: #FF8100;
	border-radius: .5em;
}

/* touchable Buttons */

.touchButton{
	display: block;
	margin: .5em 0;
	font-size: 1em;
	line-height: 1.5em;
	color: #333;
	font-weight: bold;
	width: 100%;
	background: #fdfdfd;
	background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
	border: 1px solid #bbb;
}
.touchButton[disabled]{
	color: Grey;
}


nav ul {
	width: 100%;
	list-style: none;
	padding: 0;
}

nav ul li a{
	text-decoration: none;
	color: black;
}

nav ul li a div{
	text-align: center;
	font-size: large;
	font-weight: bolder;
	border: 3px gray outset;
	background: linear-gradient(to bottom, #FFAE00 0%,#FF8100 100%);
	padding-top: .25em;
	padding-bottom: .25em;
}

.navLink div{
	display: inline;
}
meldungsBox{
	border: 1px solid black;
}


@media only screen and (min-device-width: 481px){
	.wkBox{
		border: 1px solid black;
		display: inline-block;
		width: 100%;
	}
	
	.wkBox nav{
		width: 32%;
		float: left;
	}
	
	.wkBox nav ul li{
		display: list-item;
	}
	.wkInfo{
		width: 68%;
		float: right;
	}
	
	nav ul{
		display: table;
	}
	
	nav ul li{
		display: table-cell;
	}
	
	nav ul li a div{
		text-align: center;
	}
	
	button[type=submit] {
		display: block;
		margin: .5em 0;
		font-size: 1em;
		line-height: 1.5em;
		color: #333;
		font-weight: bold;
		width: 100%;
		background: #fdfdfd;
		background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
		border: 1px solid #bbb;
	}
	button[disabled]{
		color: Grey;
	}
}

@media only screen and (max-device-width: 481px) {
	nav ul li a div{
		text-align: left;
	}


	.touchLink div{
		border: 3px gray outset;
		padding-top: .5em;
		font-size: large;
		font-weight: bolder;
		background: linear-gradient(to bottom, #FFAE00 0%,#FF8100 100%);
		padding-top: .25em;
		padding-bottom: .25em;
		text-align: center;
	}
	.touchLink li{
		border: 3px gray outset;
		padding-top: .5em;
		font-size: large;
		font-weight: bolder;
		background: linear-gradient(to bottom, #FFAE00 0%,#FF8100 100%);
		padding-top: .25em;
		padding-bottom: .25em;
		text-align: center;
	}
	.touchLink{
		text-decoration: none;
		color: black;
	}
	button[type=submit] {
		-webkit-appearance: none; -moz-appearance: none;
		display: block;
		margin: .5em 0;
		font-size: 1em;
		line-height: 1.5em;
		color: #333;
		font-weight: bold;
		width: 100%;
		background: #fdfdfd;
		background: -moz-linear-gradient(top, #fdfdfd 0%, #bebebe 100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fdfdfd), color-stop(100%,#bebebe));
		background: -webkit-linear-gradient(top, #fdfdfd 0%,#bebebe 100%);
		background: -o-linear-gradient(top, #fdfdfd 0%,#bebebe 100%);
		background: -ms-linear-gradient(top, #fdfdfd 0%,#bebebe 100%);
		background: linear-gradient(to bottom, #fdfdfd 0%,#bebebe 100%);
		border: 1px solid #bbb;
		-webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;
	}
	button[disabled]{
		color: Grey;
	}
	input[type=text], input[type=url], input[type=email], input[type=password], input[type=tel] {
		-webkit-appearance: none; -moz-appearance: none;
		display: block;
		margin: 0;
		width: 100%;
		height: 2em;
//		line-height: 1.6em;
		font-size: 1.5em;
		border: 1px solid #bbb;
	}
	#meldungsBox{
//		font-size: 3em;
		border: 1px solid black;
	}
	.wkBox{
//		font-size: 3em;
		border: 1px solid black;
		
	}
	fieldset div{
		font-size: 2em;
	}
}