/*

Custom stylesheet for www.intercom.at
Author: Christoph Letmaier
Vienna, May 2019  

*/



/* Increase border to 1px to see div borders */






/* Main font styles */


.font-italic { font-style: italic; }
.font-darkblue { color: #0073bc !important; }

.quotation { width: 90%; float: left; }
.intercom-quotation { display: inline; float: right; width: 20px; height: auto; margin-top: 5px; }


.twocols-tight { width: 49% !important; float: left; }

.img70 { width: 70%; height: auto; }



.nopadding { padding: 0; }
.nomargin { margin: 0; }

.bluelinesbackground { position: absolute; content: ""; width: 100%; height: 5px; background: url(../images/assets/bluelines-background.svg) no-repeat; background-position: center top; background-size: cover; overflow: hidden; }

#headertable { display: table; width: 100%; margin-top: 3rem; }
.intercom-row { display: table-row; }



#mainmenu-subpage { opacity: 1; position: absolute; z-index: 1000; width: 100%; height: 50px; margin-top: -50px; background-image: linear-gradient(-20deg, rgba(21, 90, 154, 1), rgba(0, 59, 113, 1)); padding: 1rem 0; }
#mainmenu-subpage:before { position: absolute; content: ""; width: 100%; height: 8px; margin-top: -18px; background: url(../images/assets/bluelines-background.svg) no-repeat; background-position: center top; background-size: cover; overflow: hidden;  }
#mainmenu-subpage ul { font-family: 'Rambla', sans-serif; font-size: 1.5rem; font-weight: 400; list-style: none; float: left; display: inline; margin-bottom: 0; }
#mainmenu-subpage ul li { float: left; padding: 0 2.5rem; display: block; border-left: 0.5px solid rgba(255, 255, 255, 0.7); }
#mainmenu-subpage ul li:first-child { padding-left: 0rem; display: block; border-left: 0px; }
#mainmenu-subpage li a { color: #fff !important; text-decoration: none; }
#mainmenu-subpage ul li a:hover { color: #d6e6fb !important; text-decoration: none; }
.topmenu-link { color: #777; text-decoration: none; }

.lingbutton:after { content: ""; display: block; width: 100%; height: 5px; clear: both; }
.linkbutton:hover { color: #d6e6fb !important; }




@-webkit-keyframes fadeInUp5 { from { opacity: 1; -webkit-transform: translate3d(0, 5%, 0); transform: translate3d(0, 5%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInUp5 { -webkit-animation-name: fadeInUp5; animation-name: fadeInUp5; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes zoomIn-custom { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50% { opacity: 1; } }
@keyframes zoomIn-custom { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50% { opacity: 1; } }

.zoom-image { transition: all .5s ease; }
.zoom-image:hover { transform: scale(1.1, 1.1); }

@keyframes fadeInImg { from { opacity: 0; } to { opacity: 1; } }
.fadeInImg { -webkit-animation-name: fadeInImg; animation-name: fadeInImg; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-timing-function: cubic-bezier(0,.76,.2,1); animation-fill-mode: both; }

@keyframes fadeOutImg { from { opacity: 1; } to { opacity: 0; } }
.fadeOutImg { -webkit-animation-name: fadeOutImg; animation-name: fadeOutImg; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-timing-function: cubic-bezier(0,.76,.2,1); animation-fill-mode: both; }
.fadeOutImg { -webkit-animation-name: fadeOutImg; animation-name: fadeOutImg; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-timing-function: cubic-bezier(0,.76,.2,1); animation-fill-mode: both; }



/* Animations */


@-webkit-keyframes fadeInUp30 { from { opacity: 0; -webkit-transform: translate3d(0, 30%, 0); transform: translate3d(0, 30%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInUp30 { -webkit-animation-name: fadeInUp30; animation-name: fadeInUp30; animation-delay: 0.5s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes fadeInUp5 { from { opacity: 1; -webkit-transform: translate3d(0, 5%, 0); transform: translate3d(0, 5%, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
.fadeInUp5 { -webkit-animation-name: fadeInUp5; animation-name: fadeInUp5; animation-delay: 0s; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes swing-custom {
  0% { 	transform-origin: center center; }
  20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform-origin: center center; transform: rotate3d(0, 0, 1, 15deg); }
  40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform-origin: center center; transform: rotate3d(0, 0, 1, -10deg); }
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform-origin: center center; transform: rotate3d(0, 0, 1, 5deg); }
  80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform-origin: center center; transform: rotate3d(0, 0, 1, -5deg); }
  to {  -webkit-transform: rotate3d(0, 0, 1, 0deg);	transform-origin: center center; transform: rotate3d(0, 0, 1, 0deg); }
}

@keyframes swing-custom {
  0% { 	transform-origin: center center; } 
  20% { -webkit-transform: rotate3d(0, 0, 1, 15deg); transform-origin: center center; transform: rotate3d(0, 0, 1, 15deg); }
  40% { -webkit-transform: rotate3d(0, 0, 1, -10deg); transform-origin: center center; transform: rotate3d(0, 0, 1, -10deg); }
  60% { -webkit-transform: rotate3d(0, 0, 1, 5deg); transform-origin: center center; transform: rotate3d(0, 0, 1, 5deg); }
  80% { -webkit-transform: rotate3d(0, 0, 1, -5deg); transform-origin: center center; transform: rotate3d(0, 0, 1, -5deg); }
  to { -webkit-transform: rotate3d(0, 0, 1, 0deg); transform-origin: center center; transform: rotate3d(0, 0, 1, 0deg); }
}

.swing-custom { -webkit-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing-custom; animation-name: swing-custom; }

@-webkit-keyframes zoomIn-custom { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50% { opacity: 1; } }
@keyframes zoomIn-custom { from { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 0.9); transform: scale3d(0.9, 0.9, 0.9); } 50% { opacity: 1; } }
.zoomIn-custom { -webkit-animation-name: zoomIn-custom; animation-name: zoomIn-custom; animation-delay: 0s; animation-duration: 3s; animation-fill-mode: forwards; visibility: visible !important; }

@-webkit-keyframes zoomIn-custom-overflow  { from {  -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); transform-origin: center center; } to { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); transform-origin: center center; } }
@keyframes zoomIn-custom-overflow  { from { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); transform-origin: center center; } to { -webkit-transform: scale3d(1.05, 1.05, 1.05);  transform: scale3d(1.05, 1.05, 1.05); transform-origin: center center; } }
.zoomIn-custom-overflow { -webkit-animation-name: zoomIn-custom-overflow; animation-name: zoomIn-custom-overflow; animation-delay: 0s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

@-webkit-keyframes zoomIn-custom-overflow-out  { from {  -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); transform-origin: center center; } to { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); transform-origin: center center; } }
@keyframes zoomIn-custom-overflow-out  { from { -webkit-transform: scale3d(1.05, 1.05, 1.05); transform: scale3d(1.05, 1.05, 1.05); transform-origin: center center; } to { -webkit-transform: scale3d(1, 1, 1);  transform: scale3d(1, 1, 1); transform-origin: center center; } }
.zoomIn-custom-overflow-out { -webkit-animation-name: zoomIn-custom-overflow-out; animation-name: zoomIn-custom-overflow-out; animation-delay: 0s; -webkit-animation-duration: 0.5s; animation-duration: 0.5s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }

.zoom-image { transition: all .5s ease; }
.zoom-image:hover { transform: scale(1.1, 1.1); }

.openarrow-open { transition: all 0.5s ease; transform: scale(1, -1); }
.openarrow-close { transition: all 0.5s ease; transform: scale(1, 1); }

@keyframes closeiconrotate {  from { transform: rotate(0deg); } to { transform: rotate(180deg); } }
.closeicon-rotate { animation-name: closeiconrotate; animation-duration: 1s; }

@keyframes closeiconscale { from { transform: scale(1, 1); } to { transform: scale(0, 0); } }
.closeicon-close { animation-name: closeiconscale; animation-duration: 0.3s; animation-fill-mode: forwards; }

@keyframes imagezoom-animation { from { transform: scale(1, 1) rotate(0deg); transform-origin: 50% 50%; } to { transform: scale(1.8, 1.8) rotate(30deg); transform-origin: 50% 50%; } }
.imagezoom { animation-name: imagezoom-animation; animation-duration: 60s; animation-fill-mode: forwards; }


@-webkit-keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }
@keyframes slideInDown { from { -webkit-transform: translate3d(0, -100%, 0); transform: translate3d(0, -100%, 0); visibility: visible; } to { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } }

.borderbox { border: 2px solid #0073bc; padding: 2rem 2.5rem; box-sizing: border-box; }
.people-container { display: inline-block; }
.connection-line { width: 0px; height: 50px; border-left: 2px solid #0073bc; margin: 0 auto; }
.flexrow { display: flex; flex-direction: column; justify-content: center; align-items: center; }


/* Media queries */

@media (min-width: 1921px) {

}

@media (min-width: 2100px) {

}

@media (min-width: 2300px) {

}

@media (max-width: 1920px) {
	#mainimage-subpage { height: 45vh; max-height: 415px; }
	#mainwrapper-subpage { height: 45vh; max-height: 415px; }
}

@media (max-width: 1210px) {
	#mainimage-subpage { height: 45vh; }
	#mainwrapper-subpage { height: 45vh; }
}

@media (max-width: 1025px) {
	#mainimage-subpage { height: 45vw; }
	#mainwrapper-subpage { height: 45vw; }
	#europestars-subpage { margin-left: 2rem; }
	#mainmenu-subpage { height: 35px; margin-top: -50px; }
}

@media (max-width: 940px) and (max-height: 499px) {
	h2 { font-size: 2.5rem; }
	#mainimage-subpage { height: 95vh; }
	#mainwrapper-subpage { height: 95vh; }
	#europestars img { width: 12vw; height: auto; }
	#produkte-netzwerk { width: 87%; left: -24vw; top: -11.5vw; }
	#europestars { padding-top: 2rem; }
	#intercom-logo { padding-top: 2rem; }
	.namebreak2 { display: inline; }
}

@media (max-width: 940px) and (min-height: 500px) )  {
	#mainimage-subpage { height: 33vh; }
	#mainwrapper-subpage { height: 33vh; }
	.namebreak2 { display: inline; }
}

@media (max-width: 940px) {

}


@media (max-width: 550px) {
	h1 { font-size: 2rem; }
	h1 sup { font-size: 1.2rem; }
	h4 { line-height: 2.5rem; }
	.marginbottommobile { margin-bottom: 0rem; }
	.font-justify { text-align: left; }
	.nopaddingmobile { padding: 0; }
	.bluebackground { background: url(../images/assets/mainimage_background_smartphone.jpg) no-repeat; background-position: left top; background-size: cover; overflow: hidden; }
	#mainwrapper-subpage { height: 32vh; }
	#mainimage-subpage { height: 32vh; }
	#mainwrapper-subpage:after { position: absolute; content: ""; width: 100%; left: 0px; height: 8px; margin-top: 0px; background: url(../images/assets/bluelines-background.svg) no-repeat; background-position: center top; background-size: cover; overflow: hidden; }

	#mainimagemobile { display: flex; flex-direction: column; text-align: center;}
	
	#europestars { float: none; padding-top: 1rem; order: 2; }
	#europestars img { width: 40vw; height: auto; }
	#europestars-subpage { float: left; padding-top: 3rem; padding-left: 2rem; }
	#europestars-subpage img { width: 100px; height: auto; }
	
	#netzwerkgrafik { order: 3; width: 100%; height: auto; margin-top: -46vw; }

	#intercom-logo { float: none; padding-top: 3rem; order: 1; }
	#intercom-logo img { width: 80vw; height: auto; }
	#intercom-logo-subpage { float: right; padding-top: 3rem; padding-right: 2rem; }
	#intercom-logo-subpage img { width: 250px; height: auto; }	

	#produkte-netzwerk { position: static; width: 100%; }

	#mobilemenuheader { display: block; position: relative; width: 100%; }
	#mobilemenu { display: none; }
	.logomobile { display: block; width: 65vw; height: auto; margin: 0.5rem 0rem 1rem 2rem; }
	#menuswitch { position: absolute; width: 30px; height: 20px; top: 1rem; right: 2rem; cursor: pointer; }
	#closeicon { display: none; position: absolute; width: 30px; height: 20px; top: 1rem; right: 2rem; cursor: pointer; }
	.mainmenucontainer { margin: 0rem 0 0 0; text-align: left; overflow: hidden; box-sizing: border-box; }
	#mainmenu, #mainmenu-subpage { opacity: 0; position: fixed; top: 0px; bottom: auto; height: auto; background-image: linear-gradient(-20deg, rgba(21, 90, 154, 1), rgba(0, 59, 113, 1)); padding: 1rem 0; margin: 0; }
	#mainmenu-subpage { margin-top: 0px; }
	#mainmenu ul, #mainmenu-subpage ul { display: block; width: 100%; font-size: 2rem; }
	#mainmenu ul li, #mainmenu-subpage ul li { float: none; border: 0; padding: 1rem 2rem; border-bottom: 0.5px solid rgba(255, 255, 255, 0.7); }
	#mainmenu ul li:first-child, #mainmenu-subpage ul li:first-child { padding-left: 2rem; display: block; border-left: 0px; }
	#mainmenu ul li:last-child, #mainmenu-subpage ul li:last-child { border-bottom: 0px; }

	#mainmenu:before, #mainmenu-subpage:before { position: absolute; content: ""; width: 100%; height: 0px; margin-top: -18px; background: url(../images/assets/bluelines-background.svg) no-repeat; background-position: center top; background-size: cover; overflow: hidden;  }
	#mainmenu:after, #mainmenu-subpage:after { position: absolute; content: ""; width: 100%; left: 0px; height: 8px; margin-top: 5px; background: url(../images/assets/bluelines-background.svg) no-repeat; background-position: center top; background-size: cover; overflow: hidden;  }

	#logocontainer { display: block; }
	#logo1 { float: left; width: 100%; text-align: center; margin-bottom: 5rem; }
	#logo1 img { width: 70%; }
	#logo2 { float: left; width: 100%; text-align: center; margin-bottom: 5rem; }
	#logo2 img { width: 60%; }
	#logo3 { float: left; width: 100%; text-align: center; margin-bottom: 5rem; }
	#logo3 img { width: 50%; }
	#logo4 { float: left; width: 100%; text-align: center; margin-bottom: 5rem; }
	#logo4 img { width: 70%; }
	#logo5 { float: left; width: 100%; text-align: center; margin-bottom: 5rem; }
	#logo5 img { width: 70%; }
	
	#footer { padding-bottom: 2rem; }
	.logofooter { display: block; width: 80%; height: auto; margin: 0 0 2rem -3px; }
	.linkspacer { display: none; }
	.footerlink { display: block; }
	.namebreak { display: inline; }
	.namebreak2 { display: none; }
	.fifth-column-margin { margin-left: 0%; }
}

@media (max-width: 450px) {
	.introimage img { margin-top: -35px; }
	#europestars-subpage { padding-left: 1rem; }
	#europestars-subpage img { width: 20vw; height: auto; }
	#intercom-logo-subpage { padding-right: 1rem; }
	#intercom-logo-subpage img { width: 55vw; height: auto; }
}

@media (max-width: 410px) {
	
}

@media (max-width: 380px) {
	#europestars img { width: 30vw; height: auto; }
	#intercom-logo img { width: 70vw; height: auto; }
	#europestars-subpage img { width: 20vw; height: auto; }
	#intercom-logo-subpage img { width: 55vw; height: auto; }
	#netzwerkgrafik { margin-top: -41vw; }
}