/********************************************************
* Filename:     responsive.css
* Description:  css-Datei für responsives Layout
* Author:		    Ing. Andreas Gabriel - 2020-10-16
********************************************************/


/************************************************************
  Responsive Layouts
************************************************************/

@media (max-width: 1200px) {
  body { font-size:17px; }
	#logo { width:600px; }	
	#header { padding-top:25px; height:115px; }

	#contact-block { margin-top: -2px; }
	#address div::after { margin:0 7px; }
	#contact div::after { margin:0 7px; }
	
	#imagewrapper { height:250px; }
	
	.subwrapper { margin-left:25px; margin-right:25px; }
	#portrait img { width: 230px; height: 230px; border-width: 5px; margin-bottom: 17px; }
	h2 { margin-bottom: 17px; }
	.right { margin-top:-8px; }
	
	#subheader { padding:8px 0;	}
	.content-block { padding-top:33px; padding-bottom:50px; }
	#footer { padding-top:8px; padding-bottom:42px; }
}

@media (max-width: 950px) {
  body { font-size:16px; }
	#logo { width:90%; }
	#header { padding-top:20px; height:180px; }
	
	#contact-block {
		margin-top:30px;
float: left;
width: 100%;
	}
	
	#address div {display:inline; float:left;}
	#address div::after { content:' | '; margin:0 6px; }
	#agreement { margin-top: 5px; }
	#contact div::after { margin:0 6px; }
	
	#imagewrapper { height:200px; }
	
	.subwrapper { margin-left:20px; margin-right:20px; }
	#portrait img { width: 200px; height:200px; border-width: 4px; margin-bottom: 13px; }
	h2 { margin-bottom: 13px; }
	.right { margin-top:-6px; }

	#subheader { padding:7px 0;	}
	.content-block { padding-top:26px; padding-bottom:40px; }
	#footer { padding-top:7px; padding-bottom:33px; }
}

@media (max-width: 800px) {
	#header { padding-top:17px; height:130px; }
	
	#contact-block { margin-top: 15px; }
	#address div::after { margin:0 5px; }
	#agreement { margin-top:5px; }
	#contact div::after { margin:0 5px; }
	#contact {
    margin-top: 2px;
}

	#imagewrapper { height:170px; }
	
	.subwrapper { margin-left:15px; margin-right:15px; }
	#portrait img { width: 190px; height:190px; border-width: 3px; margin-bottom: 12px; }
	h2 { margin-bottom: 12px; }
	.right { margin-top:-5px; }

	#subheader { padding:6px 0;	}
	.content-block { padding-top:24px; padding-bottom:33px; }
	#footer { padding-top:6px; padding-bottom:31px; }
}

@media (max-width: 730px) {	/* Burgermenu */
  #header {
    padding-top: 16px;
		padding-bottom: 16px;
    height: auto;
  }
	#imagewrapper {
		height:185px;
	}
  .col {
    float: none;
    width: 100%;
    text-align: left;
  }
  .content-block {
    padding-top: 22px;
    padding-bottom: 29px;
  }
	#contact {
    margin-top: 7px;
    clear: both;
    float: left;
}
	#logo {
    width: 100%;
}

	#menu {
		display: none;
	}
	#burgermenu {
		display: block;
	}
}

@media (max-width: 460px) {
	#contact-block { margin-left:0; }
	.subwrapper { margin-left:10px; margin-right:10px; }
	.content-block { padding-top:15px; padding-bottom:17px; }
}

@media (max-width: 360px) {
	#header {
    padding-bottom: 5px;
	}
	#city::after {
		display:none;
	}
	#country {
		display:block !important;
		line-height: 1.6;
	}
	#phone::after {
		display:none;
	}
	#email {
		display:block !important;
		line-height: 1.6;
	}
}