/* roboto-100 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 100; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-100.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-100italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 100; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-100italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-300 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 300; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-300italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 300; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-regular - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 400; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 400; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-500 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 500; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-500italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 500; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-700 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 700; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-700italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 700; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-900 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: normal; font-weight: 900; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-900.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */ } /* roboto-900italic - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Roboto'; font-style: italic; font-weight: 900; src: url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.eot'); /* IE9 Compat Modes */ src: url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */ url('../fonts/roboto-v30-latin/roboto-v30-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */ } body{ font-family: 'Roboto', sans-serif; overflow-x: hidden; color: #50596c; } p, a, li, h1, h2, h3, h4, h5{ font-family: 'Roboto', sans-serif; } p, a, li{ font-size: 20px; } h1{font-size: 30px} h2,.accordion-wrapper label{font-size: 28px} h3{font-size: 26px} h4{font-size: 24px} h5{font-size: 22px} /* ======================= generix ======================= */ .ListStyleNone{ list-style: none; } a, a:visited { text-decoration: none; color: #50596c; outline: 0; } a:hover { text-decoration: underline; color: #50596c; outline: 0; } /* ======================= navigation ======================= */ section#header{ border: none; background-color: #dadada; } .header-fixed #header { z-index: 11; } li.CMenu_Item a { text-transform: uppercase; font-weight: 500; letter-spacing: 1px; } .dropmenu ul li a.active, .dropmenu ul li a:focus, .dropmenu ul li a:hover{ color: black!important; } .mobile-menu { z-index: 99; } .mobile-container nav.overlay-menu { margin-top: 10vh; } .mobile-container .mobile-logo img, .mobile-container .mobile-logo svg { display: none; } .mobile-container .treemenu li { background: transparent; } .mobile-container .treemenu li a { font-size: 2rem; margin-left: 0; line-height: 1.2; text-transform: uppercase; } .mobile-container .treemenu .toggler:before { display: none; } .mobile-container .treemenu li a.active, .mobile-container .treemenu li a:focus, .mobile-container .treemenu li a:hover { color: #000!important; } .mobile-menu .button_container.active .top, .mobile-menu .button_container.active .bottom { background: #000; } .mobile-menu .button_container span { background: #3a414e; } .BoxTel { min-width: 225px; text-align: center; } /* ======================= ANIMATION ======================= */ .Contc2anim { position: relative; } #Wr_c2anim { position: relative; background-color: transparent; height: 85vh; overflow: hidden; } #elem_a { position: absolute; z-index: 9; top: 50%; left: calc(50% + 0px); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); height: fit-content; /*width: 400px;*/ width: 80vw; background-color: transparent; /*z-index: 99;*/ opacity: 0; -webkit-animation: fadeIn 2s ease-in-out; -moz-animation: fadeIn 2s ease-in-out; -o-animation: fadeIn 2s ease-in-out; animation: fadeIn 2s ease-in-out; -webkit-animation-iteration-count: finite; -moz-animation-iteration-count: finite; -o-animation-iteration-count: finite; animation-iteration-count: finite; animation-fill-mode: forwards; animation-delay: 4s; } #elem_b { position: absolute; top: 0vh; left: calc(50% - 25vw); display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; justify-content: flex-start; -webkit-justify-content: flex-start; background-color: transparent; width: 200vw; height: 280vh; transform-origin: bottom; padding-top: 200px; z-index: 10; -webkit-transform: translate(-100vw); -moz-transform: translate(-100vw); -ms-transform: translate(-100vw); -o-transform: translate(-100vw); transform: translate(-100vw); -webkit-animation: shifter 3s ease-in-out; -moz-animation: shifter 3s ease-in-out; -o-animation: shifter 3s ease-in-out; animation: shifter 3s ease-in-out; -webkit-animation-iteration-count: finite; -moz-animation-iteration-count: finite; -o-animation-iteration-count: finite; animation-iteration-count: finite; animation-fill-mode: forwards; animation-delay: 1s; } @keyframes shifter{ 0%{ -webkit-transform: translate(-100vw); -moz-transform: translate(-100vw); -ms-transform: translate(-100vw); -o-transform: translate(-100vw); transform: translate(-100vw); } 100%{ -webkit-transform: translate(60vw); -moz-transform: translate(60vw); -ms-transform: translate(60vw); -o-transform: translate(60vw); transform: translate(60vw); } } #W_elems_b { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; align-items: center; } #elem_ba{ position: relative; height: 200px; width: 200px; background-color: transparent; opacity: 0; -webkit-animation: fadeIn 1s ease-in-out; -moz-animation: fadeIn 1s ease-in-out; -o-animation: fadeIn 1s ease-in-out; animation: fadeIn 1s ease-in-out; -webkit-animation-iteration-count: finite; -moz-animation-iteration-count: finite; -o-animation-iteration-count: finite; animation-iteration-count: finite; animation-fill-mode: forwards; animation-delay: 1s; } #elem_baa{ position: absolute; top: 12vh; left: 100%; -webkit-transform: rotate(5deg) translate(-50%, -50%); -moz-transform: rotate(5deg) translate(-50%, -50%); -ms-transform: rotate(5deg) translate(-50%, -50%); -o-transform: rotate(5deg) translate(-50%, -50%); transform: rotate(5deg) translate(-50%, -50%); width: 50vh; height: 50vh; background-image: url(../images/asset/kelle_2_Cropped.png); background-size: contain; background-repeat: no-repeat; background-position: center; background-color: transparent; } @keyframes fadeIn{ 0%{ opacity: 0; } 100%{ opacity: 1; } } #elem_bb{ background-color: white; height: 100vw; width: 200vw; } p.c2anim_caption { color: black; font-size: 26px; line-height: 1.1; text-align: center; } #elem_z { position: absolute; height: 100vh; width: 100%; background-repeat: no-repeat; background-size: cover; background-position: center center; top: 5vh; left: 0; opacity: 1; /* opacity: 0; -webkit-animation: fadeIn 2s ease-in-out; -moz-animation: fadeIn 2s ease-in-out; -o-animation: fadeIn 2s ease-in-out; animation: fadeIn 2s ease-in-out; -webkit-animation-iteration-count: finite; -moz-animation-iteration-count: finite; -o-animation-iteration-count: finite; animation-iteration-count: finite; animation-fill-mode: forwards; animation-delay: 2.7s; */ } /* p.c2anim_caption::before { background-color: lightgrey; background-image: url(../images/samples/Square.jpg); background-repeat: no-repeat; background-size: contain; height: 200px; width: 200px; content: ""; position: absolute; top: -200px; left: 50%; transform: translate(-50%, -5%); } */ /* --- --- */ .baguetteBoxOne .column{ position: relative; } /* .baguetteBoxOne .column:after { content: ""; display: block; padding-bottom: 100%; } */ .baguetteBoxOne .column .inner{ /* position: absolute; width: 100%; height: 100%; */ aspect-ratio: 1/1; background-size: cover; background-repeat: no-repeat; } /* ===================== KONTAKT ===================== */ #kontakt p{ text-align: center; } /* ===================== CONTENT ===================== */ h2.sectiontitle{ position: relative; text-transform: uppercase; width: fit-content; margin: 0 auto 2rem } h2.sectiontitle:before{ position: absolute; content: url(../images/asset/AVB_heading_bg.svg); left: 50%; top: 0; z-index: -1; -webkit-transform: translate(-50%, 0) scale(4); -moz-transform: translate(-50%, 0) scale(4); -ms-transform: translate(-50%, 0) scale(4); -o-transform: translate(-50%, 0) scale(4); transform: translate(-50%, 0) scale(4); } .accordion-wrapper label { text-align: center; color: black; } .accordion-wrapper label:hover { color: white; } .accordion-wrapper div:nth-child(odd) label { background-color: #c6c6c6; } .accordion-wrapper div:nth-child(even) label { background-color: #dadada; } .accordion-wrapper label:hover:after, input:checked + .accordion-wrapper label:hover:after { /* width: 30px; height: 20px; right: 15px; */ top: 13px!important; } .LbGal { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; justify-content: space-between; -webkit-justify-content: space-between; position: relative; width: 100%; } a.LbGalItem { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; width: 100%; } .LbGalItemPV { aspect-ratio: 1/1; background-repeat: no-repeat; background-size: cover; background-color: transparent; margin: 4vh 0; width: 100%; height: auto; } .CustSection { padding: 15vh 0; margin: 10vh 0; } .CustSection.center p{ text-align: center; } /* ===================== navbar extra ===================== */ /* section.NavBar_Appx{ display: none!important; } */ /* ===================== FOOTER ===================== */ #footer { background-color: #fff!important; } #footer a{ color: #50596c; } #footer a:hover{ color: #50596c; text-decoration: underline; } /* ===================== OVERLAY ===================== */ #overlay { background: #dadada; } /* #################################################### ooo ooooo .o8 o8o .oooooo. o8o `88. .888' "888 `"' d8P' `Y8b `"' 888b d'888 .ooooo. .oooo888 oooo .oooo. 888 888 oooo oooo .ooooo. oooo d8b oooo .ooooo. .oooo.o 8 Y88. .P 888 d88' `88b d88' `888 `888 `P )88b 888 888 `888 `888 d88' `88b `888""8P `888 d88' `88b d88( "8 8 `888' 888 888ooo888 888 888 888 .oP"888 888 888 888 888 888ooo888 888 888 888ooo888 `"Y88b. 8 Y 888 888 .o 888 888 888 d8( 888 `88b d88b 888 888 888 .o 888 888 888 .o o. )88b o8o o888o `Y8bod8P' `Y8bod88P" o888o `Y888""8o `Y8bood8P'Ybd' `V88V"V8P' `Y8bod8P' d888b o888o `Y8bod8P' 8""888P' #################################################### */ /* :::::::::::::::::::::::::::::::::::::::::::::::::::: Bootstrap 4 breakpoints */ /* Extra small devices (portrait phones, less than 576px) No media query since this is the default in Bootstrap because it is "mobile first" */ /* oooooooo ooooooooo .ooo dP""""""" d"""""""8' .88' d88888b. .8' d88' `Y88b .8' d888P"Ybo. ]88 .8' Y88[ ]88 o. .88P .8' `Y88 88P `8bd88P' .8' `88bod8' Small devices (landscape phones, 576px and up) */ @media (min-width: 576px) { } /* ooooooooo .ooo .ooooo. d"""""""8' .88' d88' `8. .8' d88' Y88.. .8' .8' d888P"Ybo. `88888b. .8' Y88[ ]88 .8' ``88b .8' `Y88 88P `8. .88P .8' `88bod8' `boood8' Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */ @media (min-width: 768px) { .LbGal { -webkit-flex-direction: row; flex-direction: row; } .LbGalItemPV { margin: 0vh 0; } a.LbGalItem { padding: 1rem; } #elem_b { top: -10vh; } #elem_baa { top: 7vh; } .BoxTel { min-width: unset; text-align: unset; } } /* .oooo. ooooooooo oooooooo .ooooo. .o .oooo. .dP""Y88b d"""""""8' dP""""""" d88' `8. o888 .dP""Y88b ]8P' .8' d88888b. Y88.. .8' 888 ]8P' <88b. .8' `Y88b `88888b. 888 .d8P' `88b. .8' ]88 8888888 .8' ``88b 888 .dP' o. .88P .8' o. .88P `8. .88P 888 .oP .o `8bd88P' .8' `8bd88P' `boood8' o888o 8888888888 ----------- iPhone X ----------- */ @media only screen and (min-device-width: 375px) and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) { } /* .ooooo. .ooooo. .oooo. 888' `Y88. 888' `Y88. .dP""Y88b 888 888 888 888 ]8P' `Vbood888 `Vbood888 .d8P' 888' 888' .dP' .88P' .88P' .oP .o .oP' .oP' 8888888888 Large devices (desktops, 992px and up) */ @media (min-width: 992px) { } /* .o .oooo. .oooo. .o o888 d8P'`Y8b .dP""Y88b .d88 888 888 888 ]8P' .d'888 888 888 888 .d8P' .d' 888 888 888 888 .dP' 88ooo888oo 888 `88b d88' .oP .o 888 o888o `Y8bd8P' 8888888888 o888o */ @media (min-width: 1024px) { } /* .o .oooo. .oooo. .oooo. o888 .dP""Y88b d8P'`Y8b d8P'`Y8b 888 ]8P' 888 888 888 888 888 .d8P' 888 888 888 888 888 .dP' 888 888 888 888 888 .oP .o `88b d88' `88b d88' o888o 8888888888 `Y8bd8P' `Y8bd8P' Extra large devices (large desktops, 1200px and up) */ @media (min-width: 1200px) { p, a, li{ font-size: ; } h1, h2, h3, h4, h5{ font-family: 'Roboto', sans-serif; } .header-fixed #header{ /*display: none;*/ } nav.dropmenu.animated { margin: 0 auto; } .header-fixed #body-wrapper { padding: 0; } .container.Contc2anim { padding: 0!important; } /* --------------------------------- */ #elem_a { width: calc(50vw - 200px); } #elem_b { padding-top: 0; } #elem_bb { height: 75vw; } /* --------------------------------- */ p.c2anim_caption { font-size: 2rem; } p.c2anim_caption::before { left: -101px; top: -40px; } /* --------------------------------- */ img.ImgCentered.ImgSmall { display: block; padding: 0; max-width: 40%; margin: 5vh auto; } } /* .o .o .o .oooo. o888 .d88 .d88 d8P'`Y8b 888 .d'888 .d'888 888 888 888 .d' 888 .d' 888 888 888 888 88ooo888oo 88ooo888oo 888 888 888 888 888 `88b d88' o888o o888o o888o `Y8bd8P' Extra large devices (large desktops, 1440px and up) */ /* Extra large devices (large desktops, 1440px and up) */ @media (min-width: 1440px) { } /* .o .ooo .oooo. .oooo. o888 .88' d8P'`Y8b d8P'`Y8b 888 d88' 888 888 888 888 888 d888P"Ybo. 888 888 888 888 888 Y88[ ]88 888 888 888 888 888 `Y88 88P `88b d88' `88b d88' o888o `88bod8' `Y8bd8P' `Y8bd8P' */ @media (min-width: 1600px) { p, a, li{ font-size: 22px; } h1{font-size: 32px} h2,.accordion-wrapper label{font-size: 30px} h3{font-size: 28px} h4{font-size: 26px} h5{font-size: 24px} .CustSection { padding: 1rem 0; min-height: 100vh; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; justify-content: center; align-items: center; } #elem_baa { top: -5vh; } body:not(.title-center) #body-wrapper .container { padding: 20vh 0; } section#header, #header .navbar-section { height: 6rem; } body.header-fixed.header-animated #header.scrolled, body.header-fixed.header-animated #header.scrolled .navbar-section { height: 5rem; } } /* .o .ooooo. .oooo. .oooo. o888 888' `Y88. .dP""Y88b d8P'`Y8b 888 888 888 ]8P' 888 888 888 `Vbood888 .d8P' 888 888 888 888' .dP' 888 888 888 .88P' .oP .o `88b d88' o888o .oP' 8888888888 `Y8bd8P' */ @media (min-width: 1920px) { p, a, li{ font-size: 28px; } h1{font-size: 36px} h2,.accordion-wrapper label{font-size: 34px} h3{font-size: 32px} h4{font-size: 30px} h5{font-size: 28px} h2.sectiontitle:before { top: -10px; } } /* .oooo. oooooooo .ooo .oooo. .dP""Y88b dP""""""" .88' d8P'`Y8b ]8P' d88888b. d88' 888 888 .d8P' `Y88b d888P"Ybo. 888 888 .dP' ]88 Y88[ ]88 888 888 .oP .o o. .88P `Y88 88P `88b d88' 8888888888 `8bd88P' `88bod8' `Y8bd8P' */ @media (min-width: 2560px) {} /* .oooo. .ooooo. .oooo. .oooo. .dP""Y88b d88' `8. d8P'`Y8b d8P'`Y8b ]8P' Y88.. .8' 888 888 888 888 .d8P' `88888b. 888 888 888 888 .dP' .8' ``88b 888 888 888 888 .oP .o `8. .88P `88b d88' `88b d88' 8888888888 `boood8' `Y8bd8P' `Y8bd8P' */ @media (min-width: 2800px) { } /* .oooo. .oooo. .oooo. .oooo. .dP""Y88b .dP""Y88b d8P'`Y8b d8P'`Y8b ]8P' ]8P' 888 888 888 888 <88b. .d8P' 888 888 888 888 `88b. .dP' 888 888 888 888 o. .88P .oP .o `88b d88' `88b d88' `8bd88P' 8888888888 `Y8bd8P' `Y8bd8P' */ @media (min-width: 3200px) {} /* .oooo. .ooooo. .o .oooo. .dP""Y88b d88' `8. .d88 d8P'`Y8b ]8P' Y88.. .8' .d'888 888 888 <88b. `88888b. .d' 888 888 888 `88b. .8' ``88b 88ooo888oo 888 888 o. .88P `8. .88P 888 `88b d88' `8bd88P' `boood8' o888o `Y8bd8P' */ @media (min-width: 3840px) { #elem_baa { top: -4vh; } } /* .o .oooo. .ooooo. .ooo .d88 d8P'`Y8b 888' `Y88. .88' .d'888 888 888 888 888 d88' .d' 888 888 888 `Vbood888 d888P"Ybo. 88ooo888oo 888 888 888' Y88[ ]88 888 `88b d88' .88P' `Y88 88P o888o `Y8bd8P' .oP' `88bod8' */ @media (min-width: 4096px) { #elem_baa { top: -10vh; } }