/*
Theme Name: VogelArt
Theme URI: www.vogelart.de
Author: Eckstaedt
Author URI: www.eckstaedt-fotografie.de
Description: VogelArt is an Theme with a menu in the logo.
Version: 1.3.1
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: VogelArt
Domain Path: /languages/
Tags: design,


This theme, like WordPress, is licensed under the GPL.

sparkling is based on Underscores http://underscores.me/, (C) 2012-2015 Automattic, Inc.

*/





@font-face { font-family: 'MyriadPro-BoldCond'; src: url('fonts/MyriadPro-BoldCond.otf') format('opentype'); }
@font-face { font-family: 'MyriadPro-BoldCondIt'; src: url('fonts/MyriadPro-BoldCondIt.otf') format('opentype'); }
@font-face { font-family: 'MyriadPro-Cond'; src: url('fonts/MyriadPro-Cond.otf') format('opentype'); }
@font-face { font-family: 'MyriadPro-CondIt'; src: url('fonts/MyriadPro-CondIt.otf') format('opentype'); }


.header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: #fff;
    z-index: 1000;
    overflow: hidden;
    text-align:center;
    -webkit-transition: height 1.7s;
    -moz-transition: height 1.7s;
    -ms-transition: height 1.7s;
    -o-transition: height 1.7s;
    transition: height 1.7s;
}

.header.shrink {
	height: 12%;
    padding-top: 1%;
    padding-bottom: 1%;
}

#menu-menue.shrink {
	height: 100%;
	margin: auto;
    padding-bottom: 0;	
}

#menu-menue {
	background: url('pictures/vogelart_logo_1200dpi.png') center / contain no-repeat;
    padding-left: 5%;
	padding-right: 5%;
	margin-top: 5%;
    width:90%;
	float:left;
	position: relative;
    height:100%;
    -webkit-transition: all 0.7s;
    -moz-transition: all 0.7s;
    -ms-transition: all 0.7s;
    -o-transition: all 0.7s;
    transition: all 0.7s;
}

#content {
	padding-top: 45%;
}

#content.shrink {
	padding-top: 17%;
}

.vogel{
	background: url('pictures/vogel.png') center / contain no-repeat;
	width:64.65%;
	background-color: #FFFFFF;
	float: left;
	opacity: 1;	
}

.vogel li {
	height: 100%;
}

.vogel:hover{
	background: url('pictures/vogelart_ueberuns.png') center / contain no-repeat;
	margin:0 auto;
    width:64.65%;
    height:72.32%;
	float: left;
	opacity: 1;
	 display: table-cell;
    vertical-align: middle;
	line-height: 100%;
}


.art{
	margin:0 auto;
    width:35.2%;
    padding-bottom:25.3%;	
	background-color: #FFFFFF;
	float: right;
	opacity: 0;
}

.art:hover{
	background: url('pictures/vogelart_bestof.png') center / contain no-repeat;
	margin:0 auto;
    width:35.2%;
    padding-bottom:25.3%;	
	float: right;
	opacity: 1;
}
	
#home{
	margin:2.88% 0% 0% 0% ;
    width:2%;
    padding-bottom:7%;	
	background-color: #FFFFFF;
	float: left;
	opacity: 0;
}

.smoothing{
	margin:2.88% 0% 0% 0.2% ;
    width:31.6%;
    padding-bottom:7%;	
	background-color: #FFFFFF;
	float: right;
	opacity: 0;
}

.smoothing:hover{
	background: url('pictures/vogelart_raumdesign.png') center / contain no-repeat;
	margin:2.88% 0% 0% 0.2% ;
    width:31.6%;
    padding-bottom:7%;	
	float: right;
	opacity: 1.0;
}

.ceiling{
	margin:2.88% 2% 0% 1.84% ;
    width:21.3%;
    padding-bottom:7%;	
	background-color: #FFFFFF;
	float: right;
	opacity: 0;

}

.ceiling:hover{
	background: url('pictures/vogelart_deckenkonzepte.png') center / contain no-repeat;
	margin:2.88% 2% 0% 1.84% ;
    width:21.3%;
    padding-bottom:7%;	
	float: right;
	opacity: 1.0;
}

.painting{
	margin:2.88% 1% 0% 0% ;
    width:26.3%;
    padding-bottom:7%;	
	background-color: #FFFFFF;
	float: right;
	opacity: 0;
}

.painting:hover{
	background: url('pictures/vogelart_fassadentechnik.png') center / contain no-repeat;
	margin:2.88% 1% 0% 0%  ;
    width:26.3%;
    padding-bottom:7%;	
	float: right;
	opacity: 1.0;
}

#footer {
	position: fixed;
	width: 100%;
	height: 4%;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: darkgrey;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 999;
}
	

a {
	font-family: MyriadPro-Cond;
	font-size: 0.8em; 	
	text-align: center;
	vertical-align: middle;
	color: #1b97a7;
	text-decoration:none;
}


p {
	font-family: MyriadPro-Cond;
	font-size: 1em;
	color: #000;
}

h1 {
	font-family: MyriadPro-BoldCond;
	font-size: 2em;
	color: #000;
	text-align: center;
}

h2 {
	padding-top: 11%;
	font-family: MyriadPro-BoldCond;
	font-size: 2em;
	color: #000;
	text-align: center;
}

ul, li{
	
	list-style: none;
}

/*
@media only screen and (min-width: 400px) {
	#logo {
		z-index: moz-transform: rotate(270deg);
    	-ms-transform: rotate(270deg);
    	-o-transform: rotate(270deg);
    	-webkit-transform: rotate(270deg);
    	transform: rotate(270deg);
    	margin-top: 230px;
    	margin-left: -150px;
	}
}
*/