lokales CSS

Studienkolleg.css CSS stylesheet, 11 KB

File contents

.button {
    color: blue;
}

/* Menü */

.wiso-all{
	position: relative;
	display: inline-block;
	max-width: 960px;
	min-height: auto;
	background-color: #f3f3f3;
}

.wiso-left{
	width: 20%;
	height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	background-color: #f3f3f3;
	margin: 0;
	float: left;
	clear: none;
	padding: 2%;
} 

.wiso-left img{
	margin-bottom: 0.5em;
}

.wiso-left figcaption{
	text-align: left;
	width: 100%;
	height: auto;
	display: contents;
	color: #323232;
	font-weight: bold;
}

.wiso-left figcaption a{
	display: table-cell;
	vertical-align: middle;
	position: relative;
	opacity: 1;
	color: #000000 !important;
}

.wiso-left img{
	max-width: 100%;
	max-height: 100%;
}


.wiso-middle{
	width: 45%;
	height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	background-color: #f3f3f3;
	margin: 0;
	float: left;
	clear: none;
	padding: 2%;
}  
 
.wiso-right{
	width: 20%;
	height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	background-color: #f3f3f3;
	margin: 0;
	float: left;
	clear: none;
	padding: 3.5%;
} 

.wiso-right .button {
	display: inline-block;
	width:100%; 
	height:auto; 
	padding: 2%; 
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.wiso-right .button:hover {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.wiso-right .button2 {
	display: inline-block;
	width:100%; 
	height:auto; 
	padding: 2%; 
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
    margin-top: 10%;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.wiso-right .button2:hover {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.clear { clear: both; }

@media screen and (max-width: 959px) {
	
	
.wiso-all {
	position: inherit;
	display: inline-block;
	min-width: 96%;
	min-height: 100%;
	background-color: #f3f3f3;
	vertical-align: top;
}	
	
	
.wiso-left{
	min-width: 96%;
	min-height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	margin: 0;

} 


.wiso-left figcaption{
	text-align: left;
	width: 96%;
	height: auto;
	display: contents;
	color: #323232;
	font-weight: bold;
}

.wiso-left figcaption a{
	display: table-cell;
	vertical-align: middle;
	position: relative;
	opacity: 1;
	color: #323232 !important;
}

.wiso-middle{
	min-width: 96%;
	min-height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	margin: 0;

} 

.wiso-right{
	min-width: 96%;
	min-height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	margin: 0;
	padding: 1%;

} 

.wiso-right .button {
	display: inline-block;
	vertical-align: top;
	min-width: 90%; 
	min-height: auto; 
	padding: 1%;
	box-shadow: 0 0 0 0; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align: center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.wiso-right .button:hover   {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}
    
.wiso-right .button2 {
	display: inline-block;
	vertical-align: top;
	min-width: 90%; 
	min-height: auto; 
	padding: 1%;
    margin-top: 5%;
	box-shadow: 0 0 0 0; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align: center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

    .wiso-right .button2:hover   {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}
	 
img{
	max-width: 100%;
	max-height: 100%;
}

.clear { clear: both; 
	background-color: white;}
}

/* Link Blöcke Startseite */

.start {
	position: relative;
	display: inline-block;
	width: 100%;
	min-height: auto;
    margin-left: auto; 
    margin-right: auto;
    color: white;
}

.start-links {
    width: 43%; 
    float:left;
    height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: white;
	margin: 0;
	clear: none;
	padding: 2%;
    margin-left: auto; 
    margin-right: auto;
}

.start-rechts {
    width: 43%; 
    float: left;
    height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: black;
	margin: 0;
	clear: none;
	padding: 2%;
    margin-left: auto; 
    margin-right: auto;
}

.start-links .button {
	display: inline-block;
	width:100%; 
	height:auto; 
	padding: 2%; 
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-links .button:hover {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-links .button a {
    display: block;
}

.start-rechts .button {
	display: inline-block;
	width:100%; 
	height:auto; 
	padding: 2%; 
    margin-left: 7%;
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-rechts .button:hover {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-rechts .button a {
    display: block;
}

@media screen and (max-width: 959px) {
	
	
.start {
	position: inherit;
	display: inline-block;
	min-width: 96%;
	min-height: 100%;
	background-color: #f3f3f3;
	vertical-align: top;
}	
	
	
.start-links{
	min-width: 96%;
	min-height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	margin: 0;

} 


.start-rechts{
	min-width: 96%;
	min-height: 100%;
	position: relative;
	display: inline-block;
	vertical-align: top;
	color: #000000;
	margin: 0;

} 


.start-links .button {
	display: inline-block;
	vertical-align: top;
	min-width: 90%; 
	min-height: auto; 
	padding: 1%;
	box-shadow: 0 0 0 0; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align: center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-links .button:hover   {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}
    
.start-rechts .button {
	display: inline-block;
	vertical-align: top;
	min-width: 90%; 
	min-height: auto; 
	padding: 1%;
	box-shadow: 0 0 0 0; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align: center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}

.start-rechts .button:hover   {
	background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
}
}

/* Link Container Startseite */ 

.containerlinks {
    position: relative;
    display: inline-block;
	min-height: auto;
    max-width: 690px
}

.linkskolleg{
    margin-top: 3%; 
    border: 5px solid white;
    float: left; 
    width: 48%;
    background-color: #f3f3f3;
}
.linkkollegbutton{
    display: inline-block;
	width:90%; 
	height:auto; 
    margin-top: 10%; 
    margin-left: 3%;
	padding: 2%; 
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #00677c;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
    text-decoration: none;
}
.linkkollegbutton:hover {
    background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
    margin-top: 10%; 
    margin-left: 3%;
}
.linkkollegbutton a {
    display: block;
    text-decoration:none;
}

.linkkollegbutton2{
    display: inline-block;
	width:90%; 
	height:auto; 
    margin-top: 10%; 
    margin-left: 3%;
	padding: 2%; 
	box-shadow:2px 2px 2px 2px grey; 
	background-color: #005459;
	font-size: 1.1rem;
	line-height:200%;
	white-space: nowrap;
	text-align:center;
	color:white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
    text-decoration: none;
}
.linkkollegbutton2:hover {
    background-color: #1D8E9F;
	color: white;
	transition: all 500ms linear 0s;
	transition-property: color, background-color;
    margin-top: 10%; 
    margin-left: 3%;
}
.linkkollegbutton2 a {
    display: block;
    text-decoration:none;
}
@media screen and (max-width: 959px) {
	
	
.containerlinks {
    position: inherit;
    display: inline-block;
    min-width: 96%;
    min-height: 100%;
    background-color: #f3f3f3;
    vertical-align: top;
    margin-top: 2%;
    border: 5px solid white;
}	
.linkskolleg {
    min-width: 96%;
    min-height: 100%;
    position: relative;
    display: inline-block;
    vertical-align: top;
    color: #000000;
    margin: 0;
}
.linkkollegbutton {
    display: inline-block;
    vertical-align: top;
    min-width: 80%;  
    min-height: auto; 
    padding: 1%;
    box-shadow: 0 0 0 0; 
    background-color: #00677c;
    font-size: 1.1rem;
    line-height:200%;
    white-space: nowrap;
    text-align: center;
    color:white;
    transition: all 500ms linear 0s;
    transition-property: color, background-color;
}
.linkkollegbutton:hover {
    background-color: #1D8E9F;
    color: white;
    transition: all 500ms linear 0s; 
    transition-property: color, background-color;
}
    
.linkkollegbutton2 {
    display: inline-block;
    vertical-align: top;
    min-width: 80%;  
    min-height: auto; 
    padding: 1%;
    box-shadow: 0 0 0 0; 
    background-color: #005459;
    font-size: 1.1rem;
    line-height:200%;
    white-space: nowrap;
    text-align: center;
    color:white;
    transition: all 500ms linear 0s;
    transition-property: color, background-color;
}
.linkkollegbutton2:hover {
    background-color: #1D8E9F;
    color: white;
    transition: all 500ms linear 0s; 
    transition-property: color, background-color;
}
}

/* Hover Effekt Bilder Ansprechpartner */ 

.imgpartner {
    margin-left: 2%;
}

.imgpartner:hover {
    box-shadow: 0px 0px 10px grey;
}