@font-face { font-family: 'DIN Pro'; src: url('/fonts/DINPro/DINPro.eot'); src: local('DIN Pro'), local('DINPro'), url('/fonts/DINPro/DINPro.eot?#iefix') format('embedded-opentype'), url('/fonts/DINPro/DINPro.woff') format('woff'), url('/fonts/DINPro/DINPro.ttf') format('truetype'); font-weight: normal; font-style: normal; } html { position : relative; } body { font-family : "DIN Pro"; font-size: 14px; } a { text-decoration : none !important; color : black !important; } a:hover, a:active, a:visited { -webkit-box-shadow : none !important; box-shadow : none !important; } a.link:hover { color : #8ac66c !important; } a[href^="mailto:"]:hover { color : blue !important; } a[href^="tel:"]:hover { color : lightblue !important; } main { } hr { border : none; color : lightgray; background-color: lightgray; height : 2px; } h1,h2,h3,h4,h5,h6 { line-height : 1; padding : 0; margin : 0; } h1 { font-size : 32px; } h2 { font-size : 24px; } h3 { font-size : 20px; } h4 { font-size : 18px; } p { font-size : 18px; padding : 0; margin : 0; } .bg_green { background-color: #8ac66c; } .bg_red { background-color: rgb(255,62,0); } .bg_gray { background-color: lightgray; } .color_mute { color: #cccccc !important; } .color_green { color: #8ac66c !important; } @media only screen and (max-width: 992px) { h1 { font-size : 30px; } h2 { font-size : 22px; } h3 { font-size : 18px; } h4 { font-size : 16px; } p { font-size : 16px; } } #preloader { position : fixed; width : 100%; height : 100%; background : rgb(221,221,221); z-index : 9999; } #preloader img, #preloader span { position : absolute; left : 50%; top : 50%; width : auto; height : auto; transform : translateX(-50%) translateY(-50%); } #preloader span { color : rgba(255,255,255,0.8); } .modal button.close { outline : none !important; border : none !important; -webkit-box-shadow : none !important; box-shadow : none !important; } #myModal .modal-title, #mySubModal .modal-title { font-size : 24px; color : #8ac66c; } myMessageBox .modal-title { font-size : 24px; } .navbar_custom { min-height : 80px; background-color: transparent; border-color : transparent; font-size : 18px; text-transform : uppercase; } .navbar_custom.collapse { display : flex; } .navbar_custom.collapsing, .navbar_custom.show { background : white !important; } .navbar_custom .navbar-brand { font-size : inherit; } .navbar_custom .navbar-brand:hover { color : #8ac66c !important; } .navbar_custom .navbar-brand img { position : fixed; top : 40px; left : 50%; height : 80px; transition : left 1s; } @media only screen and (max-width: 768px) { .navbar_custom .navbar-brand img { position : inherit; height : 48px; } } .navbar_custom .navbar-toggler { background : #ded8d8; } .navbar_custom .navbar-collapse.collapsing, .navbar_custom .navbar-collapse.show { background : white !important; } .navbar_custom .navbar-nav .nav-item > a:hover { color : #8ac66c !important; } .navbar_custom .navbar-nav .nav-item.active > a { color : #8ac66c !important; } .navbar_custom .navbar-nav .nav-item .dropdown-menu .dropdown-item { background-color: white !important; cursor : pointer; } .navbar_custom .navbar-nav .nav-item .dropdown-menu .dropdown-item:hover, .navbar_custom .navbar-nav .nav-item .dropdown-menu .dropdown-item:focus { color : #8ac66c !important; } .navbar_custom .navbar-nav .nav-item .dropdown-menu .dropdown-item.active { color : #8ac66c !important; font-weight : bold; } @media only screen and (max-width: 768px) { .navbar_custom .navbar-nav .nav-item .dropdown-menu { border : none; } } .navbar_custom .dropdown .dropdown-menu { overflow:auto; } .admin .navbar_custom { background-color: black !important; border-color : black !important; } .admin .navbar_custom.collapsing, .admin .navbar_custom.show { background : black !important; } .admin .navbar_custom .navbar-collapse.collapsing, .admin .navbar_custom .navbar-collapse.show { background : black !important; } .admin .navbar_custom a { color : white !important; } .admin .navbar_custom .navbar-nav .nav-item .dropdown-menu, .admin .navbar_custom .navbar-nav .nav-item .dropdown-menu .dropdown-item { background-color: black !important; } .admin .navbar_custom .navbar-brand img { display:none; } .admin main { padding-top : 80px !important; } .admin .table img { border : 1px solid lightgray; } .admin form .input-group-text { min-width:180px; } .admin form img { border : 1px solid lightgray; width:100%; } .admin form textarea { min-height:10em; } .admin form #map { width:100%; height:calc(100vh - 80px); } #google_map { width : 100%; height : calc(100vh - 80px); } #google_map .content { overflow : hidden; } #google_map .content img { max-height : 30vh; width : 100%; object-fit : cover; } #google_map .content p { text-align : justify; font-size : 1rem; } #slider { position : relative; height : 100vh; } #slider ul { list-style : none; position : fixed; width : 100%; height : 100%; top : 0; left : 0; margin : 0; padding : 0; z-index : -2; background-color: black; will-change : transform; } #slider li { position : fixed; width : 100%; height : 100%; top : 0; left : 0; background-size : cover; background-repeat : no-repeat; background-position : center; opacity : 0; animation : anim_slides 25s linear infinite 6s; } @keyframes anim_slides { 0% {opacity:0;} 3% {opacity:1;} 20% {opacity:1;} 25% {opacity:0;} 100% {opacity:0;} } .bg_fixed { position : relative; background-size : cover; background-repeat : no-repeat; background-position : center center; background-attachment : fixed !important; background-image : white; z-index : 0; height : calc(100vh - 80px); } @media only screen and (max-width: 1200px) { .bg_fixed { background-attachment : scroll !important; } } #arrowDown { position : absolute; bottom : 0; left : 50%; transform : translateX(-50%); cursor : pointer; transition : all 0.8s cubic-bezier(.32,2,.55,.27); } #arrowDown[data-show="true"] { bottom : 0; opacity : 1; } #arrowDown[data-show="false"] { bottom : 80%; opacity : 0; } @media only screen and (max-width: 768px) { #arrowDown { bottom : 0 !important; opacity : 1 !important; transition : none !important; } } #arrowUp { position:absolute; bottom:0; right:0; cursor:pointer; } #footer .btn-link { color : black; text-transform : uppercase; } #footer .contact { width : 50px; } #footer #impress { cursor : pointer; color : black; overflow : hidden; } #footer[data-impressopen="0"] #impress{ max-height : 0px; transition : max-height 1.8s cubic-bezier(0, 1, 0, 1) -.1s; } #footer[data-impressopen="1"] #impress{ max-height : 4000px; transition : max-height 1.8s; } #footer #protect { cursor : pointer; color : black; overflow : hidden; } #footer[data-protectopen="0"] #protect{ max-height : 0px; transition : max-height 1.8s cubic-bezier(0, 1, 0, 1) -.1s; } #footer[data-protectopen="1"] #protect{ max-height : 4000px; transition : max-height 1.8s; } #footer .format_columns { -webkit-column-width: 200px; -moz-column-width : 200px; column-width : 200px; -webkit-column-count: 3; -moz-column-count : 3; column-count : 3; -webkit-column-gap : 30px; -moz-column-gap : 30px; column-gap : 30px; } @media only screen and (max-width: 768px) { #footer .format_columns { -webkit-column-count: 2; -moz-column-count : 2; column-count : 2; } } @media only screen and (max-width: 576px) { #footer .format_columns { -webkit-column-count: 1; -moz-column-count : 1; column-count : 1; } } #buro_feature { cursor : pointer; } #buro_feature [class*="col-"] { position : relative; overflow : hidden; } #buro_feature .logo { width : 100%; opacity : 0.0; } #buro_feature .image { position : absolute; left : 0; width : 100%; height : 100%; object-fit : cover; } #buro_feature .info { position : absolute; top : 0; left : 0; width : 100%; height : 100%; text-transform : uppercase; } #buro_feature .row:nth-child(2n) { text-align : right; } @media only screen and (max-width: 768px) { #buro_feature .image { position : inherit; height : 250px; } #buro_feature .info { position : inherit; } #buro_feature .row:nth-child(2n) { text-align : left; } } #contact .logo { width : 100%; opacity : 0.0; } #contact .contact { width : 50px; } #contact .details { position : absolute; width : 100%; height : 100%; top : 0; left : 0; background-color: #EEE; } #contact #map { width : 100%; height : 100%; } @media only screen and (max-width: 992px) { #contact .details { position : inherit; max-height : 100vh; } #contact #map { max-height : 100vh; } } @media only screen and (max-width: 768px) { #contact #map { height : 100vh; } } @media only screen and (max-width: 576px) { #contact .details { position : inherit; } } #projects_not [class*="col-"] { height : calc(100vh - 80px); width : 100%; } #project_feature [class*="col-"] { position : relative; overflow : hidden; } #project_feature .logo { width : 100%; opacity : 0.0; } #project_feature .image { position : absolute; left : 0; width : 100%; height : 100%; object-fit : cover; } #project_feature .info { position : absolute; top : 0; left : 0; width : 100%; height : 100%; text-transform : uppercase; } #project_feature .row:nth-child(2n) { text-align : right; } @media only screen and (max-width: 768px) { #project_feature .image { position : inherit; height : 250px; } #project_feature .info { position : inherit; } #project_feature .row:nth-child(2n) { text-align : left; } } #figures .panel { min-width:25%; } #figures .figure { width : 100%; overflow : hidden; min-height : 50vh; } #figures .figure img { cursor:pointer; } #figures[data-scale="0"] .figure img { width : auto; max-height : 50vh; } #figures[data-scale="1"] .figure img { width : 100%; max-height : auto; } #figures[data-scale="1"] .my_row { -ms-flex-wrap : wrap !important; flex-wrap : wrap !important; } #figures .scale_btn { white-space : nowrap; } #figures .scale_btn:hover { font-weight : bold; cursor : pointer; } #figures .name { white-space:nowrap; } #figures .name:hover { color : #8ac66c; cursor : pointer; } #figures .name.selected { color : #8ac66c; font-weight : bold; pointer-events : none; } @media only screen and (max-width: 767px) { #figures .panel { min-width:100%; } #figures .figure { overflow : auto !important; min-height : auto; } #figures .figure img { max-height : 50vh !important; width : auto !important; cursor : default; pointer-events : none; } #figures .my_row { -ms-flex-wrap : wrap !important; flex-wrap : wrap !important; } } #projects .logo { width : 100%; opacity : 0.0; } #projects .image { position : absolute; left : 0; width : 100%; height : 100%; object-fit : cover; object-position : left top; cursor : pointer; } #projects .project[data-open="1"] .image { cursor : default; } #projects .project { position : relative; overflow : hidden; } #projects .select_info { position : absolute; top : 0; left : 0; width : 100%; height : 100%; font-size : 24px; } #projects .project .about { display : inline; position : absolute; top : 0; left : 100%; width : 50%; height : 100%; background-color: rgba(196,196,196,0.8); transition : left 0.5s; font-size : 16px } #projects .project .about .year { font-weight : bold; line-height : 1; } #projects .project .about .name { line-height : 1.2; } #projects .project[data-open="1"] .about { left : 50%; } @media only screen and (max-width: 1200px) { #projects .select_info { font-size : 20px; } } @media only screen and (max-width: 992px) { #projects .select_info { font-size : 18px; } #projects .about { font-size : 14px } } @media only screen and (max-width: 768px) { #projects .image { position : inherit; height : 200px; } #projects .select_info { position : inherit; font-size : 24px; } #projects .about { font-size : 16px } } @media only screen and (max-width: 576px) { #projects .image { position : inherit; height : 200px; } #projects .select_info { position : inherit; font-size : 22px; } #projects .about { font-size : 14px } } .select_panel { position : fixed; z-index : 1; top : 80px; width : 33.33%; transition : all 0.5s; height : calc(100vh - 80px); overflow : auto; background-color: rgba(196,196,196,0.8); } .select_panel.year[data-open="0"] { right : -33.33%; } .select_panel.year[data-open="1"] { right : 0%; } .select_panel.term[data-open="0"] { left : -33.33%; } .select_panel.term[data-open="1"] { left : 0%; } .select_panel .item { line-height : 1; font-size : 18px; cursor : pointer; } .select_panel .item.selected { color : #8ac66c; font-weight : bold; pointer-events : none; } .select_panel .item:hover { font-weight : bold; } .select_panel .item.selected:hover { color : #8ac66c; border : none; } @media only screen and (max-width: 768px) { .select_panel { width : 50%; z-index : 1500; } .select_panel.year[data-open="0"] { right : -50%; } .select_panel.year[data-open="1"] { right : 0%; } .select_panel.term[data-open="0"] { left : -50%; } .select_panel.term[data-open="1"] { left : 0%; } } .icon_panel { position:fixed; top:50%; color:rgba(196,196,196,0.8); font-size:24px; z-index : 1; transition: all 0.5s; transform:scaleY(2); cursor:pointer; } .icon_panel.year { right:0; } .icon_panel.year[data-open="1"] { right:50%; } .icon_panel.term { left:0; } .icon_panel.term[data-open="1"] { left:50%; } .offer_temp .offer_name { font-size:20px; font-weight:bold; } .offer_temp .offer_content { font-size:16px; font-weight:normal; }