.FACES-HEADER-TOP-TAB-UI{ width : 100%; flex : 1 1 100%; display : flex; flex-wrap : nowrap; flex-direction : row; justify-content : center; align-content : flex-start; align-items : stretch; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : #FAFAFA; z-index : 112; /* background : #111111 url(/images/header.bg.webp) center center repeat; background-size : 50% 100%; */ border-bottom : 0px solid #2A2A2A; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L{ white-space: collapse; flex : 1 1 180px; width : 35vw; min-width : 120px; max-width : 180px; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : flex-start; align-content : flex-end; align-items : flex-end; text-align : center; padding : 0vmin 4px 2vmin 1vmin; margin : 0px 0px 0px 0px; position : relative; background : transparent; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI{ flex : 1 1 100%; width : inherit; max-width : inherit; min-width : inherit; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : flex-start; align-content : flex-end; align-items : flex-end; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px -60% 0px; position : relative; background : transparent; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI img{ flex : 1 1 100%; width : inherit; max-width : 160px; min-width : inherit; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : space-between; align-items : flex-end; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI img.MEDIA-SCREEN-SMALL{ display : none; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI h1, .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI h2, .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-L .LOGO-UI strong{ flex : 1 1 100%; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; color : #f8e922; font-size : calc(12px + 0.4vmin); font-weight : normal; font-style : normal; font-family : LeagueGothic; } .FACES-HEADER-TOP-TAB-UI .HEADER-VIEW-R{ flex : 1 1 80%; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : space-between; align-items : flex-end; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; } .FACES-HEADER-TOP-TAB-UI .TOP-INFO-TAB{ flex : 1 1 100%; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : space-between; align-content : center; align-items : center; align-self : center; text-align : center; padding : 2vmin 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; } .UI-MENU-MEDIA-BUTTON{ z-index: 999999999; cursor: pointer; float: left; width: 30px; height: 30px; background: transparent url('./images/smartmenu.png'); margin: 2px 2px 0px 2px; } .FACES-PAGE-HEADER-STICKY{ position : fixed; top : 0; z-index : 999999; } .FACES-PAGE-HEADER-STICKY .UI-MENU a.UI-MENU-LINK{ background: transparent !important; } .FACES-PAGE-HEADER-STICKY .UI-MENU > li > a.UI-MENU-LINK h1, .FACES-PAGE-HEADER-STICKY .UI-MENU > li > a.UI-MENU-LINK h2, .FACES-PAGE-HEADER-STICKY .UI-MENU > li > a.UI-MENU-LINK strong{ padding : 0px 0px 5px 0px; margin : 0px 0px 0px 0px; font-weight : normal; } .FACES-PAGE-HEADER-STICKY .YAVAS-HEADER-TOP-TAB-LOGO-UI img{ flex : 0 0 auto; width : calc(60px + 2vw); max-width : calc(60px + 2vw); } .FACES-PAGE-HEADER-STICKY .YAVAS-HEADER-TOP-TAB-HIGHTLIGHT-UI{ display : none; } .FACES-PAGE-TOP-NAVI{ display : flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : center; align-items : center; text-align : center; margin : 5px 5px 5px 5px; right : 15px; bottom : 15px; position : fixed; background : #303030; z-index : 11; cursor : pointer; border : 0px solid #DDDDDD; -moz-border-radius : 4px; -webkit-border-radius : 4px; border-radius : 4px; } .FACES-PAGE-TOP-NAVI > div{ flex : 1 1 100%; display : inline-flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : center; align-items : center; text-align : center; width : 40px; height : 36px; padding : 4px 14px 4px 14px; position : relative; background-color : transparent; background-image : url('/images/icon.page.navi.scroll-top.svg'); background-position : center center; background-repeat : no-repeat; z-index : 1; cursor : pointer; } .FACES-PAGE-TOP-NAVI > div:hover{ background-image : url('/images/icon.page.navi.scroll-top.hover.svg'); } /* TOP-MENUE ********************************************************************************************** */ .FACES-HEADER-MENU-NODES-TAB{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : stretch; padding : 5px 5px 0px 5px; margin : 0px 0px 0px 0px; border-top : 1px solid #FFFFFF; border-bottom : 0px solid #0cb3de; background : transparent; z-index : 10; position : relative; } .FACES-HEADER-MENU-NODES-VIEW{ flex : 0 1 1100px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : stretch; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; margin-left : auto; margin-right : auto; z-index : 199; position : relative; } .FACES-HEADER-MENU-ROOT{ flex : 0 0 100px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 5px 10px 5px 10px; margin : 0px 0px 0px 0px; color : #777777; background : transparent; white-space : nowrap; cursor : pointer; } .FACES-HEADER-MENU-ROOT > a{ flex : 1 1 100%; height : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #e3a32f; background : transparent; font-size : calc(16px + 0.4vw); font-family : 'AbrilFatface', sans-serif; font-weight : normal; white-space : nowrap; cursor : pointer; } .FACES-HEADER-MENU-ROOT > a > span{ flex : 1 1 80%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-size : 12px; color : #555555; position : relative; background : transparent; white-space : nowrap; font-weight : normal; } .FACES-HEADER-MENU-ROOT:hover{ background : #ffaa12; color : #7f5409; } .FACES-HEADER-MENU-ROOT:hover > a > span{ color : #303030; } .FACES-HEADER-MENU-ROOT > .HOVER_UI{ display : flex; max-width : 100%; max-height : 0px; overflow : hidden; flex : 1 1 100%; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : #ffaa12; position : absolute; left : 0%; top : 100%; z-index : 99; cursor : initial; transition-property : max-height; transition-duration : 0.4s; transition-delay : 0s; } .FACES-HEADER-MENU-ROOT:hover > .HOVER_UI{ max-height : 1000px; display : inline-flex; transition-property : max-height; transition-duration : 2.4s; transition-delay : 0.2s; } .FACES-HEADER-MENU-NODES-TAB div.DECO-BUTTON{ padding : 16px; position : relative; flex : 0 0 80px; width : 80px; height : 80px; border-radius : 50%; background : #FFFFFF; border : 1px solid #FFFFFF; overflow : hidden; display : inline-flex; display : none; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; background: transparent; } .FACES-HEADER-MENU-NODES-TAB div.DECO-BUTTON > a{ flex : 1 1 100%; width : 100%; height : 100%; border : 0px solid #2aade2; cursor : pointer; box-shadow : 0px 2px 10px 0px #AAAAAA, inset 0px 1px 2px #fff; border-radius : 50%; padding : 5px; margin : 0px; color : #555555; font-size : 52px; overflow : hidden; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; font-weight : 900; font-family : 'AbrilFatface', sans-serif; background: rgb(244,244,244); background: -moz-linear-gradient(top, rgba(244,244,244,1) 0%, rgba(224,224,224,1) 100%); background: -webkit-linear-gradient(top, rgba(244,244,244,1) 0%,rgba(224,224,224,1) 100%); background: linear-gradient(to bottom, rgba(244,244,244,1) 0%,rgba(224,224,224,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#e0e0e0',GradientType=0 ); } .FACES-HEADER-MENU-NODES-TAB div.DECO-BUTTON > a > img{ flex : 0 0 auto; width : 28px; } .FACES-LOGO-TAB { flex : 1 1 100%; width : 100%; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; height : 120px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : flex-start; align-items : flex-start; border-top : 0px solid #F0F0F0; background : transparent url('/images/header.tab.bg.svg?v=16') center bottom repeat; background-attachment: scroll; background-size: auto 120px; } .FACES-LOGO-TAB > a.LOGO{ flex : 0 0 auto; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : flex-start; align-items : flex-start; background : transparent; border : 0px solid #FFFFFF; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; } .FACES-LOGO-TAB > a.LOGO > img{ flex : 0 0 auto; width : 200px; min-width : 200px; height : auto; border-right : 0px solid #D0D0D0; padding-right : 0px; } .FACES-SMART-MENU-TAB { flex : 1 1 100%; width : 100%; padding : 0px 0px 0px 0px; margin : 10px 0px 0px 0px; display : flex; flex-direction : column; flex-wrap : nowrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; align-self : flex-end; border-top : 0px solid #FFFFFF; border-bottom : 0px solid #FFFFFF; background : transparent; } .FACES-SMART-MENU-TAB .FACES-SMART-MENU-UI{ flex : 0 0 auto; min-height : 40px; width : 100%; border : 0px solid #2aade2; padding : 0px 10px 0px 10px; margin : 0px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : stretch; background : transparent; border-bottom : 0px solid #333333; gap : 4px 2vmin; } .FACES-SMART-MENU-UI > label{ flex : 0 0 38px; border : 0px solid #2aade2; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; display : none; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; cursor : pointer; } .FACES-SMART-MENU-UI > label > span{ flex : 1 1 100%; height : 32px; padding : 4px 4px 4px 4px; margin : 0px 0px 0px 0px; display : inline-flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; background : transparent; color : #32c6f1; font-size : 18px; z-index : 9998; cursor : pointer; -o-border-radius : 6px 6px 6px 6px; -moz-border-radius : 6px 6px 6px 6px; -webkit-border-radius : 6px 6px 6px 6px; border-radius : 4px 4px 4px 4px; } .FACES-SMART-MENU-UI > space{ flex : 1 1 40%; padding : 4px 10px 4px 10px; display : inline-flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; background : transparent; z-index : 9999; } .FACES-SMART-MENU-UI .AUTH-USER-ACCOUNT-ICON{ flex : 0 0 38px; width : 38px; height : 24px; padding : 0px 0px 0px 0px; margin : 0px 5px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; background : transparent; } .FACES-SMART-MENU-UI > .MENU-NODE-UI{ flex : 0 0 auto; padding : 0px 0px 1vmin 0px; margin : 0px 0px 0px 0px; display : inline-block; text-align : center; background : transparent; color : #aa4331; font-size : calc(14px + 0.4vw); font-weight : normal; font-family : 'AbrilFatface', 'Limelight', sans; white-space : nowrap; /* only Firefox supports this great feature font-size-adjust : 0.40; */ overflow : hidden; position : relative; border-top : 0px solid #DADADA; border-bottom : none; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK{ flex : 0 0 auto; padding : 5px 0px 5px 0px; margin : 0px 0px 0px 0px; display : inline-block; text-align : center; background : transparent; color : #3A3A3A; font-size : calc(14px + 0.4vw); font-weight : normal; font-family : 'AbrilFatface', 'Impact', sans; white-space : nowrap; /* only Firefox supports this great feature font-size-adjust : 0.40; */ overflow : hidden; position : relative; height : 100%; display : flex; flex-direction : column; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.JOBS{ background : #ffd633; -o-border-radius : 6px 6px 6px 6px; -moz-border-radius : 6px 6px 6px 6px; -webkit-border-radius : 6px 6px 6px 6px; border-radius : 6px 6px 6px 6px; color : #880000; padding : 6px 4vmin 6px 4vmin; clip-path: polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%); } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.JOBS > strong{ color : #000000; font-size : calc(14px + 0.8vmin); font-weight : normal; font-family : 'Impact', 'LeagueGothic', sans; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK > strong{ flex : 0 0 auto; padding : 6px 0px 6px 0px; margin : 0px 0px 0px 0px; display : block; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; background : transparent; color : #3A3A3A; font-size : calc(16px + 0.4vmin); font-weight : normal; font-family : 'Impact', 'LeagueGothic', sans; font-size : calc(16px + 1.2vmin); font-family : 'LeagueGothic','Impact', sans; white-space : nowrap; position : relative; z-index : 2; line-height : 100%; border-bottom : 0px solid #ffe26c; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK:hover > strong, .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.SELECTED-MENU > strong{ /* color : #ffffff; */ } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.PRIMARY{ color : #c8840e; font-size: calc(14px + 0.2vw); font-family: 'AbrilFatface', sans-serif; font-weight: normal; white-space: nowrap; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.LOGO{ display : inline-flex; background : transparent; border : 0px solid #FFFFFF; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.LOGO > img{ flex : 0 0 auto; width : 194px; max-width : 30vw; height : auto; border-right : 0px solid #D0D0D0; padding-right : 0px; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK > span{ padding : 0px 0px 4px 0px; margin : 0px 0px 0px 0px; display : block; text-align : center; background : transparent; color : #4A4A4A; font-size : 12px; z-index : 9999; font-weight : normal; position : relative; z-index : 2; border-top : 0px solid #303030; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK > span:after, .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.SELECTED-MENU > span:after{ content : " "; position : absolute; display : inline-block; overflow : hidden; /* border-bottom-left-radius : 10px; border-bottom-right-radius : 10px; */ z-index : -1; left : 50%; bottom : 0px; width : 0%; height : 1px; background : transparent; background-color : #000000; transition-property : width , left; transition-duration : 0.4s , 0.4s; transition-delay : 0.2s , 0.2s; } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK:hover, .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.SELECTED-MENU{ /* background : #A50000; */ } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK:hover > span, .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.SELECTED-MENU > span{ /* color : #ffffff; */ } .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK:hover > span:after, .FACES-SMART-MENU-UI > .MENU-NODE-UI > a.PAGE-TOP-HEADER-LINK.SELECTED-MENU > span:after{ flex : 1 1 100%; width : 100%; left : 0px; transition-property : width , left; transition-duration : 1.4s , 1.4s; transition-delay : 0.5s , 0.5s; } .FACES-SMART-MENU-UI label > input{ display : none; } .FACES-SMART-FIXED-POSITION{ height : 100%; flex : 1 1 100%; width : 100%; position : fixed; top : 0px; left : 0px; z-index : 99999; background : #FAFAFA; } .FACES-MENU-NODES-SMART-VIEW{ flex : 1 1 auto; width : 100%; overflow : auto; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; background : #FFFFFF; padding : 20px 20px 20px 20px; margin : 0px 0px 0px 0px; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; gap : 0px 5vmin; } .FACES-SMART-MENU-UI > label.MAIN-MENU > span{ background : transparent url('/images/icon.menu.smart.svg') center center no-repeat; } .FACES-SMART-MENU-UI > label.FULLSCREEN-MENU > span{ background : #353535 url('images/smart-menu-fullscreen-icon.svg') center center no-repeat; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT{ flex : 0 1 600px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 10px 10px 10px 10px; margin : 0px 0px 0px 0px; border-bottom : 1px solid #FAFAFA; border-top : 1px solid #E0E0E0; color : #D44032; background : transparent; font-size : calc(14px + 0.4vw); font-family : 'LeagueGothic', sans-serif; font-weight : normal; white-space : nowrap; cursor : pointer; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT.HOME{ padding-left : 32px; background : #FFFFFF url('images/home.icon.64.svg?x=0') 0px center no-repeat; background-size : 24px 24px; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT.ACCOUNT{ padding-left : 32px; background : #FFFFFF url('images/account.svg') 0px center no-repeat; background-size : 24px 24px; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT:first-child{ border-top : 0px solid #555555; -o-border-radius : 8px 8px 0px 0px; -moz-border-radius : 8px 8px 0px 0px; -webkit-border-radius : 8px 8px 0px 0px; border-radius : 8px 8px 0px 0px; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT:last-child{ border-bottom : 0px solid #000000; -o-border-radius : 0px 0px 8px 8px; -moz-border-radius : 0px 0px 8px 8px; -webkit-border-radius : 0px 0px 8px 8px; border-radius : 0px 0px 8px 8px; } .FACES-MENU-NODES-SMART-VIEW .MENU-ROOT span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-size : 12px; color : #4A4A4A; position : relative; background : transparent; white-space : nowrap; font-weight : normal; } /* FOOTER ********************************************************************************************** */ .UI-FOOTER, td.UI-FOOTER{ border-top : 0px solid #444; background : #111111; text-align : center; padding-bottom : 80px; } .UI-FOOTER a{ color: #DDD; text-decoration: none; font-weight: normal; } .UI-FOOTER link{ color: #DDD; text-decoration: none; font-weight: normal; } .UI-FOOTER a:link{ color: #DDD; text-decoration: none; font-weight: normal; } .UI-FOOTER a:visited { color: #DDD; text-decoration: none; font-weight: normal; } .UI-FOOTER a:hover { color: #FFF; text-decoration: none; } .FOOTER-GRID{ display: inline-flex; flex-wrap: wrap; flex-direction: row; justify-content: space-around; align-content: center; align-items: flex-start; width: 100%; } .FOOTER-GRID-CELL{ min-width: 200px; flex: 0 0 24%; margin: 0px; background: transparent; } .FOOTER-GRID-CELL a{ display: inline-block; width: 100%; height: 100%; padding: 5px; text-align: left; } .FOOTER-NOTE{ margin: 0px 0px 0px 0px; background: transparent; text-align: center; border-top: 1px solid #333; padding: 40px 0px 20px 0px; display: block; } .FOOTER-NOTE *{ color: #9BA5AB; } .FOOTER-NOTE a,.FOOTER-NOTE a:link,.FOOTER-NOTE link, .FOOTER-NOTE a:visited { color: #8AB66B; text-decoration: none; font-weight: normal; } .FOOTER-CHARTS-FRAME{ display: inline-block; padding: 5px; border: 0px solid #000; -moz-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -o-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -webkit-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; } .FOOTER-CHARTS-FRAME-INNER{ width: 320px; height: 200px; border: 0px solid #333; overflow: hidden; -moz-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -o-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -webkit-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; padding: 5px; margin: 5px; } .FOOTER-CHART-BAR-OUTER{ border: 0px solid #000; margin-top: 5px; margin-bottom: 5px; overflow: hidden; -moz-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -o-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -webkit-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; border-radius: 0px; -o-border-radius: 0px; -moz-border-radius: 0px; -webkit-border-radius: 0px; } .FOOTER-CHART-BAR-INNER{ border: 0px solid #333; overflow: hidden; -moz-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -o-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; -webkit-box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; box-shadow: -1px -1px 0px #333, 1px 1px 0px #000; } .FOOTER-CHART-BAR-LABEL{ margin: 5px; color: #888; font-size: 13px; text-align: left; font-weight: bold; } .FOOTER-CHART-BAR-COEFFICIENT{ color: #FFF; font-size: 22px; text-align: center; font-weight: bold; padding: 4px; } .FOOTER-CHART-BAR-POSITIVE{ padding: 1px; height: 35px; border: 1px solid #333; margin: 1px; width: 100%; max-width: calc(100% - 2px); -moz-box-shadow: -1px -1px 0px #333; -o-box-shadow: -1px -1px 0px #333; -webkit-box-shadow: -1px -1px 0px #333; box-shadow: -1px -1px 0px #333; background: #199841; } .FOOTER-CHART-BAR-NEGATIVE{ padding: 1px; height: 35px; border: 1px solid #333; margin: 1px; width: 100%; max-width: calc(100% - 2px); -moz-box-shadow: -1px -1px 0px #333; -o-box-shadow: -1px -1px 0px #333; -webkit-box-shadow: -1px -1px 0px #333; box-shadow: -1px -1px 0px #333; background: #BB0000; } .FOOTER-CHART-BAR-NEUTRAL{ padding: 1px; height: 35px; border: 1px solid #333; margin: 1px; width: 100%; max-width: calc(100% - 2px); -moz-box-shadow: -1px -1px 0px #333; -o-box-shadow: -1px -1px 0px #333; -webkit-box-shadow: -1px -1px 0px #333; box-shadow: -1px -1px 0px #333; background: #aaaa7f; } /* EFFECTS ********************************************************************************************** */ /** ************************************************************************************** Global Transition Effects Styles for every Effect Type *******************************************************************************************/ .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT, .FACES-EFFECT-HOVER-SLIDE-TO-TOP, .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT{ overflow : hidden !important; transition-property : padding-left , color , border-color; transition-duration : 2s , 2s , 2s; transition-delay : 0.5s , 0s , 0s; } .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT:hover, .FACES-EFFECT-HOVER-SLIDE-TO-TOP:hover, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-TO-TOP{ padding-left : 5% !important; color : #222222 !important; border-color : transparent !important; transition-property : padding-left , color , border-color; transition-duration : 2s , 2s , 2s; transition-delay : 0.0s , 0s , 0s; } .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT:hover, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT{ color : #222222 !important; border-color : transparent !important; transition-property : color , border-color; transition-duration : 2s , 2s; transition-delay : 0s , 0s; } /** ************************************************************************************** Left to Right Slide *******************************************************************************************/ .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT:after, .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT:after{ content : " "; position : absolute; display : inline-block; left : -110%; bottom : 0px; z-index : -1; width : 0%; height : 100%; border-right : 100px solid #252525; background : transparent; background-color : #ffe431; transition-property : width , border-right-width , left; transition-duration : 1.4s , 1.0s , 0.4s; transition-delay : 0.2s , 0.0s , 0.0s; } .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT:hover:after, .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT:hover:after, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-TO-RIGHT:after, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-BG-TO-RIGHT:after{ flex : 1 1 100%; width : 100%; border-right-width : 0px; left : 0px; transition-property : width , border-right-width , left; transition-duration : 1.4s , 1.0s , 0.4s; transition-delay : 0.2s , 0.0s , 0.0s; } /** ************************************************************************************** Bottom to Top Slide *******************************************************************************************/ .FACES-EFFECT-HOVER-SLIDE-TO-TOP:after{ content : " "; position : absolute; display : inline-block; left : 0px; bottom : -100px; z-index : -1; width : 100%; height : 0%; border-top : 100px solid #252525; background : transparent; background-color : #ffe431; transition-property : height , border-top-width , bottom; transition-duration : 1.4s , 1.0s , 0.4s; transition-delay : 0.2s , 0.0s , 0.0s; } .FACES-EFFECT-HOVER-SLIDE-TO-TOP:hover:after, .FACES-EFFECT-HOVER-ROOT:hover .FACES-EFFECT-HOVER-SLIDE-TO-TOP:after{ height : 100%; border-top-width : 0px; bottom : 0px; transition-property : height , border-top-width , bottom; transition-duration : 1.4s , 1.0s , 0.4s; transition-delay : 0.2s , 0.0s , 0.0s; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE{ overflow : hidden !important; position : relative !important; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:after, .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:before{ content : " "; position : absolute; display : inline-block; z-index : 100; width : 100%; height : 50%; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:before{ left : 0%; top : 0%; background-color : rgba(64, 106, 131, 0.4); transition-property : height , left; transition-duration : 1.4s , 2.4s; transition-delay : 0.2s , 0.0s; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:after{ left : 0%; top : 50%; background-color : rgba(255, 255, 255, 0.4); transition-property : height , left; transition-duration : 1.4s , 2.4s; transition-delay : 0.2s , 0.0s; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT:hover .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:before{ height : 0%; top : -200%; transition-property : height , top; transition-duration : 1.4s , 2.4s; transition-delay : 0.2s , 0.0s; } .FACES-OVERLAY-EFFECT-HOVER-IMG-ROOT:hover .FACES-OVERLAY-EFFECT-HOVER-IMG-NODE:after{ height : 0%; top : 200%; transition-property : height , top; transition-duration : 1.4s , 2.4s; transition-delay : 0.2s , 0.0s; } /* CONTACT - FORM ********************************************************************************************** */ .FACES-CONTACT-TABS-VIEW { flex : 1 1 100%; max-width : 100%; /* important to force no overflow flex contents where overflow-x=auto expected*/ height : 100% !important; display : flex; flex-direction : column !important; flex-wrap : nowrap !important; justify-content : flex-start; align-content : flex-start; align-items : flex-start; border : 0px solid #AAAAAA; padding : 10px 10px 10px 10px !important; margin : 0px 0px 0px 0px !important; position : relative; background : #FFFFFF; } .FACES-CONTACT-TABS-VIEW .TABS { flex : 0 0 36px !important; width : 100% !important; } .FACES-CONTACT-TABS-VIEW .TARGET-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; border : 1px solid #AAAAAA; padding : 0px 0px 0px 0px; margin : -1px 0px 0px 0px; position : relative; background : #FFFFFF; min-height : 20px; gap : 20px 20px; flex : 1 1 auto !important; overflow : auto !important; padding : 10px 10px 10px 10px !important; background : #FFFFFF !important; width : 100% !important; min-height : 60px; } .FACES-CONTACT-DIALOG-INFOS-UI{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; max-width : 600px; } .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS, .FACES-CONTACT-DIALOG-INFOS-UI ERROR{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; } .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS h1, .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS h2{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; font-weight : bold; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; } .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS h1{ font-size : calc(16px + 0.5vw); color : #666666; } .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS h2{ font-size : calc(14px + 0.4vw); color : #004892; } .FACES-CONTACT-DIALOG-INFOS-UI SUCCESS div{ font-size : calc(12px + 0.4vw); color : #444444; font-weight : normal; } .FACES-CONTACT-DIALOG-INFOS-UI ERROR h1, .FACES-CONTACT-DIALOG-INFOS-UI ERROR h2{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; font-weight : bold; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; } .FACES-CONTACT-DIALOG-INFOS-UI ERROR h1{ font-size : calc(14px + 0.4vw); color : #BB0000; } .FACES-CONTACT-DIALOG-INFOS-UI ERROR h2{ font-size : calc(14px + 0.4vw); color : #BB0000; } .FACES-CONTACT-DIALOG-INFOS-UI ERROR div{ font-size : calc(12px + 0.4vw); color : #444444; font-weight : normal; } .FACES-CONTACT-FORM-VIEW{ flex : 1 1 100%; padding : 0px 0px 200px 0px; margin : 0px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : left; border-bottom : 0px solid #888888; background : transparent; } .FACES-CONTACT-INFO-UI { flex : 0 1 500px; padding : 0px 0px 0px 0px; margin : 40px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : center; border : 0px solid transparent; background : transparent; } .FACES-CONTACT-FORM-UI { flex : 1 1 300px; min-width : 260px; max-width : 800px; padding : 20px 0px 20px 0px; margin : 0px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : center; border : 0px solid transparent; background : transparent; } .FACES-CONTACT-FORM-UI .FACES-FORM-ROW { padding : 10px 0px 0px 0px; margin : 0px 0px 0px 0px; } .FACES-CONTACT-FORM-UI .FACES-FORM-LABEL{ padding : 10px 0px 4px 0px; color : #777777; } .FACES-CONTACT-FORM-UI .FACES-FORM-LABEL span{ color : #444444; padding-left : 4px; margin-left : 4px; font-size : 12px; } /* .FACES-CONTACT-FORM-UI input[type="text"].FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI input[type="password"].FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI textArea.FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI select.FACES-FORM-INPUT{ border : 1px solid #666666; background : #505050; color : #0cb3de !important; } */ .FACES-CONTACT-FORM-UI input[type="text"].FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI input[type="password"].FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI input[type="date"].FACES-FORM-INPUT, .FACES-CONTACT-FORM-UI select.FACES-FORM-INPUT{ height : 32px; border : 1px solid #CCCCCC; padding : 4px 4px 4px 4px; color : #9a804c !important; -o-border-radius : 0px 0px 0px 0px; -moz-border-radius : 0px 0px 0px 0px; -webkit-border-radius : 0px 0px 0px 0px; border-radius : 0px 0px 0px 0px; font-size : calc(12px + 0.2vmin); } .FACES-CONTACT-FORM-UI textarea.FACES-FORM-INPUT{ border : 1px solid #CCCCCC; padding : 4px 4px 4px 4px; color : #9a804c !important; -o-border-radius : 0px 0px 0px 0px; -moz-border-radius : 0px 0px 0px 0px; -webkit-border-radius : 0px 0px 0px 0px; border-radius : 0px 0px 0px 0px; font-size : calc(12px + 0.2vmin); } .FACES-CONTACT-FORM-UI input[type="submit"]{ flex : 0 1 80%; max-width : 200px; padding : 10px 10px 10px 10px; margin : 20px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; -o-border-radius : 0px 0px 0px 0px; -moz-border-radius : 0px 0px 0px 0px; -webkit-border-radius : 0px 0px 0px 0px; border-radius : 4px 4px 4px 4px; font-weight : normal; font-size : calc(12px + 0.4vmin); color : #440000; background : #ffd633; word-wrap : break-word; overflow-wrap : break-word; white-space : pre-wrap; word-break : normal; align-self : center; border : 0px solid #a5c3d5; border-right : 0px solid #315063; border-bottom : 0px solid #315063; cursor : pointer; } .FACES-FORM-SECTION-LABEL-UI{ flex : 1 1 100%; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; font-weight : normal; font-size : calc(14px + 0.4vw); font-family : 'LeagueGothic','Arial', sans-serif; color : #444444; border-bottom : 1px solid #CCAA66; } .FACES-FORM-LABEL-INFO{ flex : 1 1 100%; padding : 0px 0px 2px 0px; margin : 0px 0px 0px 0px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; border : 0px solid transparent; background : transparent; color : #888888; font-weight : normal; font-size : calc(12px + 0.06vw); } .CONTACT-INLINE-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : center; text-align : center; padding : 10px 10px 10px 10px; margin : 80px 0px 0px 0px; background : #FFFFFF; } .CONTACT-INLINE-VIEW > .FACES-CONTACT-FORM-VIEW{ flex : 0 1 660px !important; height : 100%; display : flex !important; flex-direction : row !important; flex-wrap : wrap !important; justify-content : center !important; align-content : flex-start !important; align-items : center !important; text-align : center !important; padding : 3vw 3vw 3vw 3vw !important; margin : 0px 0px 0px 0px !important; border : 1px dashed #AA4330; background : #F0F0F0; /* background : #AA4330 url('/images/bg.inline.contact.form.svg?v=6') no-repeat center top; background-size : 100% 100%; */ } .CONTACT-INLINE-VIEW form.FACES-CONTACT-FORM-UI{ padding : 10px 10px 10px 10px !important; margin : 10px 10px 10px 10px !important; background : rgba(255, 255, 255, 0.95) !important; -o-border-radius : 0px 0px 0px 0px; -moz-border-radius : 0px 0px 0px 0px; -webkit-border-radius : 0px 0px 0px 0px; border-radius : 20px 20px 20px 20px; } form.FACES-CONTACT-FORM-UI .HEADER-ROW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 10px 0px 10px 0px; color : #333333; background : #FFFFFF; margin : 0px 0px 10px 0px; border-bottom : 1px solid #555555; font-weight : normal; font-size : calc(16px + 1.4vmin); font-family : 'LeagueGothic','AbrilFatface', sans-serif; } form.FACES-CONTACT-FORM-UI .HEADER-ROW > span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-size : 12px; font-weight : normal; color : #555555; } .CONTACT-INLINE-VIEW .FACES-CONTACT-FORM-UI .FACES-FORM-ROW { padding : 0px 0px 0px 0px; margin : 4px 0px 0px 0px; } .CONTACT-INLINE-VIEW .FACES-CONTACT-FORM-UI .FACES-FORM-ROW .FACES-FORM-LABEL{ padding : 0px 0px 4px 0px; margin : 4px 0px 0px 0px; } .CONTACT-INLINE-VIEW .FACES-CONTACT-FORM-UI input[type="submit"]{ padding : 8px 8px 8px 8px; margin : 0px 0px 0px 0px; } .POSTING-SLIDING-VIEW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 2vmin 2vmin 2vmin 2vmin; margin : 2vmin 0px 2vmin 0px; position : relative; background : #FFFFFF; } .POSTING-PREVIEW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : #FFFFFF; gap : 2vmin 2vmin; } .POSTING-PREVIEW .NODE-UI{ flex : 1 1 300PX; max-width : 100%; max-height : 160px; overflow : hidden; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; gap : 0vmin 0vmin; } .POSTING-PREVIEW .IMG-UI{ flex : 0 0 auto; max-width : 100%; overflow : hidden; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; border : none; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; } .POSTING-PREVIEW .IMG-UI picture{ flex : 1 1 100% !important; max-width : 160px !important; overflow : hidden !important; display : flex !important; flex-direction : row !important; flex-wrap : wrap !important; justify-content : center !important; align-content : flex-start !important; align-items : flex-start !important; border : none !important; padding : 0px 0px 0px 0px !important; margin : 0px 0px 0px 0px !important; position : relative; background : transparent; } .POSTING-PREVIEW .IMG-UI picture > img, .POSTING-PREVIEW .IMG-UI .NODE img{ flex : 0 0 auto !important; width : 100% !important; max-width : 100% !important; height : auto; border : none !important; padding : 0px 0px 0px 0px !important; margin : 0px 0px 0px 0px !important; position : relative; background : transparent !important; border-radius : calc(2% + 4px) calc(2% + 4px); } .POSTING-SLIDING-VIEW .NODE picture{ flex : 1 1 100% !important; max-width : 220px !important; overflow : hidden !important; display : flex !important; flex-direction : row !important; flex-wrap : wrap !important; justify-content : center !important; align-content : flex-start !important; align-items : flex-start !important; border : none !important; padding : 0px 0px 0px 0px !important; margin : 0px 0px 0px 0px !important; position : relative; background : transparent; } .POSTING-SLIDING-VIEW .NODE picture > img, .POSTING-SLIDING-VIEW .NODE img{ flex : 0 0 auto !important; width : 100% !important; max-width : 100% !important; height : auto; max-height : 140px !important; border : none !important; padding : 0px 0px 0px 0px !important; margin : 0px 0px 0px 0px !important; position : relative; background : transparent !important; border-radius : calc(2% + 4px) calc(2% + 4px); } .POSTING-SLIDING-VIEW h2{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0px 0px 10px 0px; margin : 0px 0px 10px 0px; position : relative; background : transparent; border-bottom : 1px dotted #4A4A4A; color : #3A3A3A; font-weight : normal; font-size : calc(14px + 2.0vmin); font-family : 'Impact','LeagueGothic'; } .POSTING-SLIDING-VIEW .NODE .TITLE{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; color : #3A3A3A; font-weight : normal; font-size : calc(14px + 0.6vmin); font-family : 'LeagueGothic', Impact; } .POSTING-SLIDING-VIEW .NODE p{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; color : #4A4A4A; font-weight : normal; font-size : calc(12px + 0.2vmin); } .PAGE-HIGHLIGHT-ITEMS-SLIDER-VIEW{ flex : 1 1 100%; max-width : inherit; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border-bottom : 0px solid #E2BC55; padding : 1vmin 0vmin 1vmin 0vmin; margin : 0px 0px 0px 0px; position : relative; background : #FFFFFF; } .PAGE-HIGHLIGHT-ITEMS-SLIDER-VIEW .SWIPE-VIEW{ background : transparent !important; border-radius : 0px 0px 0px 0px !important; border : none !important; padding : 0px 0px 0px 0px !important; } .PAGE-HIGHLIGHT-ITEMS-SLIDER-VIEW .FACES-ITEMS-SWIPER-NODE{ background : transparent !important; border-radius : 0px 0px 0px 0px !important; border : none !important; cursor : move !important; } .SERVICE-CATEGORIES-VIEW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 2vmin 2vmin 2vmin 2vmin; margin : 1vmin 0px 2vmin 0px; position : relative; background : #FFFFFF; gap : 0px 0px; } .SERVICE-CATEGORIES-VIEW .HEADER, .SERVICE-CATEGORIES-VIEW .BODY, .SERVICE-CATEGORIES-VIEW .FOOTER { flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; gap : 1px 10px; } .SERVICE-CATEGORIES-VIEW .BODY{ align-items : stretch; gap : 3vmin 3vmin; } .SERVICE-CATEGORIES-VIEW .HEADER h2, .SERVICE-CATEGORIES-VIEW .HEADER strong, .SERVICE-CATEGORIES-VIEW .HEADER p, .SERVICE-CATEGORIES-VIEW .HEADER span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #3A3A3A; background : transparent; font-weight : normal; font-size : calc(16px + 1.4vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .SERVICE-CATEGORIES-VIEW .HEADER p{ color : #4A4A4A; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'Oswald'; } .SERVICE-CATEGORIES-VIEW .HEADER span{ color : #5A5A5A; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; border-bottom : 1px solid #555555; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > h2, .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > h2 > strong, .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > h2 > span, .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #2A2A2A; background : transparent; font-weight : normal; font-size : calc(16px + 2.6vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; word-wrap : initial; overflow-wrap : break-word; white-space : pre-wrap; word-break : normal; } .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > h2 > strong{ justify-content : center; align-content : center; align-items : center; text-align : left; font-weight : normal; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > h2 > span{ justify-content : center; align-content : center; align-items : center; text-align : left; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldExtraLight', 'LeagueGothic', sans-serif; border : none; } .SERVICE-CATEGORIES-VIEW .HEADER.HOME-HIGHLIGHTS > span{ color : #5A5A5A; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; border-bottom : 1px solid #555555; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER h4, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER strong, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER p, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #3A3A3A; background : transparent; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER{ gap : 0px 0px; padding : 1vmin 0px 0px 0px; margin : 1vmin 0px 0px 0px; border-top : 1px solid #CDCDCD; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER strong{ color : #4A4A4A; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'Oswald'; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW .FOOTER span{ color : #5A5A5A; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW{ flex : 1 1 500px; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; border : none; padding : 0px 0px 0px 0px; margin : 1vmin 0px 0px 0px; position : relative; background : transparent; gap : 1px 10px; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW.POSTING-PREVIEW.EXTERNAL{ padding : 1vmin 1vmin 1vmin 1vmin; border : 1px solid #CDCDCD; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW a, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW span, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW p, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW h3{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #3A3A3A; background : transparent; font-weight : normal; font-size : calc(14px + 0.4vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW a, .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW h3.EXTLINK{ flex : 0 0 auto; display : inline; cursor : pointer; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW p{ font-size : calc(12px + 0.4vmin); font-family : inherit; } .SERVICE-CATEGORIES-VIEW .SERVICE-CATEGORY-VIEW span{ color : #5A5A5A; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; border-bottom : 0px solid #555555; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .FACES-PUBLIC-REVIEWS-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : center; text-align : center; padding : 2vmin 2vmin 2vmin 2vmin; margin : 0px 0px 0px 0px; background : #FFFFFF; } .FACES-PUBLIC-REVIEWS-UI{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; gap : 3vmin 3vmin; } .FACES-PUBLIC-REVIEWS-UI .REVIEWS-SUMMARY{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; gap : 10px 10px; } .RATINGS-SUMMARY-VIEW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : center; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; gap : 4px 4px; } .RATINGS-SUMMARY-VIEW.FILTER-PRODUCT, .RATINGS-SUMMARY-VIEW.FOOTER-SUMMARY{ justify-content : center; } .RATINGS-SUMMARY-VIEW.FOOTER-SUMMARY{ padding : 1vmin 1vmin 1vmin 1vmin; background : #FFFFFF; gap : 0px 0px; } .RATINGS-SUMMARY-VIEW .SUMMARY-UI{ max-width : 100%; color : #1A1A1A !important; font-size : calc(12px + 0.1vmin) !important; flex : 0 0 auto; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; gap : 0px 4px; } .RATINGS-SUMMARY-VIEW.FILTER-PRODUCT .SUMMARY-UI span{ color : #1A1A1A !important; font-size : 12px !important; } .RATINGS-SUMMARY-VIEW .SUMMARY-UI span{ flex : 0 0 auto; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; gap : 0px 0px; color : inherit; font-size : inherit; white-space : nowrap; word-break : keep-all; } .RATINGS-SUMMARY-VIEW.FOOTER-SUMMARY .SUMMARY-UI:hover{ color : #1A1A1A !important; font-size : calc(12px + 0.1vmin) !important; } .RATINGS-SUMMARY-VIEW .SUMMARY-UI .RATING-STARS-UI{ flex : 0 0 74px; width : 74px; height : 15px; overflow : hidden; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; gap : 0px 0px; position : relative; } .RATINGS-SUMMARY-VIEW .SUMMARY-UI .RATING-STARS-UI .RATING-FG, .RATINGS-SUMMARY-VIEW .SUMMARY-UI .RATING-STARS-UI .RATING-BG{ flex : 1 1 100%; width : 100%; height : 100%; left : 0px; top : 0px; overflow : hidden; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent url('/images/icon.rating.stars.74x15.fg.svg') center center no-repeat; background-position-x: 0px; background-position-y: center; gap : 0px 0px; position : absolute; z-index : 2; } .RATINGS-SUMMARY-VIEW .SUMMARY-UI .RATING-STARS-UI .RATING-BG{ background : transparent url('/images/icon.rating.stars.74x15.bg.svg') 0px center no-repeat; gap : 0px 0px; position : absolute; z-index : 1; } .FACES-PUBLIC-REVIEW-UI{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : center; padding : 2vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; border-top : 1px solid #CCCCCC; } .FACES-PUBLIC-REVIEW-UI h1{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; font-weight : normal; font-size : calc(14px + 0.4vmin); font-family : 'LeagueGothic','AbrilFatface', sans-serif; color : #555555; } .FACES-PUBLIC-REVIEW-UI span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; font-weight : normal; font-size : calc(12px + 0.1vmin); color : #777777; } .FACES-PUBLIC-REVIEW-UI .REVIEW-BODY{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 2vmin 8vmin 2vmin 8vmin; margin : 0px 0px 0px 0px; background : transparent; position : relative; } .FACES-PUBLIC-REVIEW-UI .REVIEW-BODY h1{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; position : relative; font-weight : normal; font-size : calc(14px + 0.4vmin); font-family : 'LeagueGothic','AbrilFatface', sans-serif; color : #666666; } .FACES-PUBLIC-REVIEW-UI .REVIEW-BODY .QUOTATION-START{ width : 4vmin; max-width : 24px; min-width : 12px; min-height : 20px; overflow : hidden; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent url('/images/icon.quotation.beginn.202020.24x20px.svg') center center no-repeat; background-size : 100% auto; position : absolute; left : 3vmin; top : 2vmin; } .FACES-PUBLIC-REVIEW-UI .REVIEW-BODY pre{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 0px 0px 0px; background : transparent; position : relative; font-weight : normal; font-size : calc(12px + 0.1vmin); color : #333333; word-wrap : break-word; overflow-wrap : break-word; white-space : pre-wrap; word-break : normal; } .FACES-PUBLIC-REVIEW-UI .RATING-STARS-UI{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 10px 0px 0px 0px; background : transparent; font-weight : normal; font-size : calc(12px + 0.1vmin); color : #777777; } .FACES-PUBLIC-REVIEW-UI .RATING-STARS-UI span{ flex : 0 0 auto; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0vmin 0vmin 0vmin 0vmin; margin : 0px 1vmin 0px 0px; background : transparent; font-weight : normal; font-size : calc(12px + 0.1vmin); color : #777777; } .FACES-PUBLIC-REVIEWS-VIEW .POSTING-FORM-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 2vmin 2vmin 2vmin 2vmin; margin : 0px 0px 0px 0px; background : #FFFFFF; } .FACES-PUBLIC-REVIEWS-VIEW .POSTING-FORM-VIEW .POSTING-FORM-UI { flex : 0 1 600px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 2vmin 2vmin 2vmin 2vmin; margin : 0px 0px 0px 0px; background : transparent; position : relative; } .PUBLIC-REVIEWS-SUMMARY-INLINE-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 1vmin 1vmin 1vmin 1vmin; margin : 0px 0px 0px 0px; background : #F5F5F5; gap : 0px 0px; } .PUBLIC-REVIEWS-SUMMARY-INLINE-VIEW .SUMMARY-UI{ color : #1A1A1A !important; font-size : 12px !important; flex : 0 0 auto; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; gap : 10px 10px; } .PUBLIC-REVIEWS-SUMMARY-INLINE-VIEW .SUMMARY-UI:hover{ color : #1A1A1A !important; font-size : 12px !important; } .EFFECT-CLIP-LEFT.CLIP-ROOT .CLIP-NODE{ clip-path : polygon(25% 0%, 100% 0%, 75% 100%, 0% 100%) !important; transition : clip-path 2s; } .EFFECT-CLIP-LEFT.CLIP-ROOT:hover .CLIP-NODE{ clip-path : polygon(0% 0%, 75% 0%, 100% 100%, 25% 100%) !important; transition : clip-path 2s; } .EFFECT-CLIP-CIRCLE.CLIP-ROOT .CLIP-NODE{ clip-path : circle(34%) !important; transition : clip-path 2s; } .EFFECT-CLIP-CIRCLE.CLIP-ROOT:hover .CLIP-NODE{ clip-path: circle(95%) !important; transition : clip-path 2s; } .HIGHLIGHTS-TAGS-VIEW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 2vmin 2vmin 2vmin 2vmin; margin : 1vmin 0px 2vmin 0px; position : relative; background : #FFFFFF; gap : 0px 0px; } .HIGHLIGHTS-TAGS-VIEW .HEADER, .HIGHLIGHTS-TAGS-VIEW .TAGS{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 0px 0px 0px 0px; margin : 0px 0px 2vmin 0px; position : relative; background : transparent; gap : 1px 10px; } .HIGHLIGHTS-TAGS-VIEW .TAGS{ justify-content : center; align-content : flex-start; align-items : stretch; text-align : center; padding : 2px 2px 2px 2px; margin : 0px 0px 0px 0px; gap : 2px 2px; } .HIGHLIGHTS-TAGS-VIEW .HEADER > h2, .HIGHLIGHTS-TAGS-VIEW .HEADER > h2 > strong, .HIGHLIGHTS-TAGS-VIEW .HEADER > h2 > span, .HIGHLIGHTS-TAGS-VIEW .HEADER > span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #2A2A2A; background : transparent; font-weight : normal; font-size : calc(16px + 1.4vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; word-wrap : initial; overflow-wrap : break-word; white-space : pre-wrap; word-break : normal; } .HIGHLIGHTS-TAGS-VIEW .HEADER > h2 > strong{ justify-content : center; align-content : center; align-items : center; text-align : left; font-weight : normal; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .HIGHLIGHTS-TAGS-VIEW .HEADER > h2 > span{ justify-content : center; align-content : center; align-items : center; text-align : left; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldExtraLight', 'LeagueGothic', sans-serif; } .HIGHLIGHTS-TAGS-VIEW .HEADER > span{ color : #5A5A5A; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; border-bottom : 1px solid #555555; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .HIGHLIGHTS-TAGS-VIEW .TAG{ flex : 1 1 auto; max-width : 200px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 2px 0px 2px 0px; margin : 0px 0px 0px 0px; border : 1px solid #A0A0A0; color : #097D66; background : transparent; font-weight : normal; font-size : calc(14px + 0.2vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } autocomplete{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; padding : 10px 0px 0px 10px; margin : 0px 0px 0px 0px; border : 1px solid #E0E0E0; background : #FFFFFF; } autocomplete > input[type="text"].MANAGED-KEYWORD-AUTO-LOOKUP-SELECT-ONE-INPUT{ flex : 1 1 100%; width : 0px; min-width : 120px; padding : 0px 0px 0px 40px; margin : 5px 10px 0px 0px; height : 46px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; background : #FFFFFF; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-weight : normal !important; font-size : calc(12px + 0.2vw) !important; color : #d0890e !important; background : #FFFFFF url('./images/search-icon.svg') left center no-repeat !important; border : 1px solid #FFAA12 !important; border-color : #FFAA12 !important; -o-border-radius : 0px 0px 0px 0px !important; -moz-border-radius : 0px 0px 0px 0px !important; -webkit-border-radius : 0px 0px 0px 0px !important; border-radius : 0px 0px 0px 0px !important; } autocomplete > selection > input[type="checkbox"] { display : none; } autocomplete > selection { flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 10px 0px 0px; background : transparent; border : 0px solid #E0E0E0; color : #c8840e; font-weight : bold; font-size : calc(12px + 0.1vw); cursor : pointer; position : relative; } autocomplete > selection > choice{ flex : 1 1 100%; min-height : 24px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : stretch; text-align : left; padding : 0px 5px 0px 20px; margin : 0px 0px 0px 0px; background : transparent; border : 0px solid #ABC196; color : #c8840e; font-weight : bold; font-size : calc(12px + 0.1vw); position : relative; } autocomplete > selection > choice:after{ content : ""; flex : 0 0 15px; width : 14px; height : 100%; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent url('./images/autocomplete-selection-choice-icon.svg') center center no-repeat; border : 0px solid #FFAA12; overflow : hidden; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; position : absolute; top : 0px; left : 0px; } autocomplete > target{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 5px 10px 0px; border-top : 0px dotted #FFAA12; background : #FFFFFF; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; } autocomplete > target > choice { flex : 1 1 auto; min-width : 120px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : space-between; align-content : center; align-items : stretch; text-align : left; padding : 5px 5px 5px 28px; margin : 5px 5px 0px 0px; background : #FFF5D4; border : 1px solid #D4C5A2; color : #815509; position : relative; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; cursor : pointer; } autocomplete > target > choice:after{ content : ""; flex : 0 0 15px; width : 18px; height : 18px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : #fffbeb; border : 1px solid #e8d8b8; overflow : hidden; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; position : absolute; top : calc( 50% - 9px ); left : 5px; } autocomplete > target > choice:hover:after{ background : #FFF5D4 url('./images/choice-checked.svg') center center no-repeat; border : 1px solid #FFAA12; } autocomplete > input[type="text"].MANAGED-KEYWORD-AUTO-LOOKUP-INPUT{ flex : 1 1 100%; padding : 0px 0px 0px 40px; margin : 0px 10px 0px 0px; height : 46px; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; background : #FFFFFF; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; width : 0px; min-width : 20px; font-weight : normal !important; font-size : calc(12px + 0.2vw) !important; color : #d0890e !important; background : #FFFFFF url('/images/icon.search.input.svg') left center no-repeat !important; border : 1px solid #FFAA12 !important; border-color : #097d66 !important; -o-border-radius : 0px 0px 0px 0px !important; -moz-border-radius : 0px 0px 0px 0px !important; -webkit-border-radius : 0px 0px 0px 0px !important; border-radius : 0px 0px 0px 0px !important; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; gap : 5px; padding : 10px 10px 10px 10px; margin : 0px 0px 0px 0px; border-top : 0px dotted #FFAA12; background : #FFFFFF; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > h1 { flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 5px 0px 5px 0px; margin : 0px 5px 0px 0px; background : transparent; border : 0px solid #ABC196; color : #c8840e; font-weight : bold; font-size : calc(12px + 0.1vw); border-top : 1px dotted #FFAA12; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag { flex : 1 1 auto; height : auto; min-width : 120px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : space-between; align-content : center; align-items : stretch; text-align : left; padding : 5px 25px 5px 5px; margin : 0px 0px 0px 0px; background : #FFE3AA; border : 1px solid #FFAA12; color : #815509; position : relative; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; cursor : pointer; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag:after{ content : ""; flex : 0 0 15px; width : 15px; height : 15px; display : flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : #FFE3AA url('./images/x-thin.svg') center center no-repeat; border : 0px solid #9FAC71; overflow : hidden; -moz-box-sizing : border-box; -webkit-box-sizing : border-box; box-sizing : border-box; position : absolute; top : calc( 50% - 8px ); right : 5px; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag.plus:after{ background : #FFF5D4 url('./images/plus-thin.svg') center center no-repeat; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag.plus { flex : 1 1 auto; background : #FFF5D4; border : 1px solid #D4C5A2; color : #815509; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag.plus:hover{ background : #FFE3AA; border : 1px solid #FFAA12; color : #815509; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag.plus:hover:after{ background-color : #FFE3AA; border : 1px solid #FFAA12; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag:hover { background : #FFF5D4; border : 1px solid #D4C5A2; color : #815509; } .MANAGED-KEYWORD-AUTO-COMPLETE-TAGS-VIEW > tag:hover:after{ background-color : #FFF5D4; } .CATALOG-SEARCH-AUTO-COMPLETE-TAGS-VIEW{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; } .CATALOG-SEARCH-AUTO-COMPLETE-TAGS-VIEW > tag{ flex : 0 0 auto; display : inline-flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : flex-start; align-items : center; text-align : left; padding : 5px 5px 5px 5px; margin : 0px 5px 5px 0px; background : #ffe3aa; border : 1px solid #FFAA12; color : #815509; } .PREPAGE, .PREPAGE .PREPAGE-VIEW, .PREPAGE .PREPAGE-VIEW-LEFT, .PREPAGE .PREPAGE-VIEW-RIGHT, .PREPAGE .PREPAGE-BODY-LEFT, .PREPAGE .PREPAGE-BODY{ max-width : 100%; flex : 1 1 100%; display : flex; flex-wrap : wrap; flex-direction : row; justify-content : center; align-content : flex-start; align-items : flex-start; text-align : center; padding : 3vmin 3vmin 3vmin 3vmin; gap : 3vmin 3vmin; margin : 0px 0px 0px 0px; position : relative; background : #F0F0F0; z-index : 1; } .PREPAGE{ padding : 3vmin 0px 3vmin 0px; } .PREPAGE .PREPAGE-VIEW{ gap : 3vmin 3vmin; padding : 3vmin 3vmin 3vmin 3vmin; margin : 0px 0px 0px 0px; background : #FFFFFF; align-items : stretch; } .PREPAGE .PREPAGE-VIEW .PREPAGE-VIEW-LEFT{ flex : 1 1 900px; min-width : 220px; flex-wrap : wrap-reverse; gap : 3vmin 3vmin; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; align-content : flex-start; align-items : stretch; } .PREPAGE .PREPAGE-VIEW .PREPAGE-VIEW-LEFT .PREPAGE-BODY{ flex : 1 1 560px; min-width : 200px; flex-wrap : wrap; gap : 3vmin 3vmin; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : #FFFFFF; align-items : stretch; } .PREPAGE .PREPAGE-VIEW .PREPAGE-VIEW-LEFT .PREPAGE-BODY-LEFT{ flex : 1 1 300px; min-width : 200px; max-width : 320px; flex-wrap : wrap; gap : 2vmin 2vmin; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; background : transparent; align-content : flex-start; align-items : flex-start; } .PREPAGE .PREPAGE-VIEW .PREPAGE-VIEW-RIGHT{ flex : 1 1 320px; min-width : 200px; max-width : 320px; gap : 3vmin 3vmin; padding : 3vmin 3vmin 3vmin 3vmin; margin : 0px 0px 0px 0px; background : #F1F1F1; } .PREPAGE-SIDE-UI{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; position : relative; background : transparent; gap : 0px 0px; } .PREPAGE-SIDE-UI .HEADER, .PREPAGE-SIDE-UI .TAGS{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; align-content : flex-start; align-content : flex-start; align-items : flex-start; text-align : left; border : none; padding : 0px 0px 0px 0px; margin : 0px 0px 1vmin 0px; position : relative; background : transparent; gap : 1px 1px; } .PREPAGE-SIDE-UI .TAGS .PREPAGE-SIDE-UI .ROWS{ justify-content : center; align-content : flex-start; align-items : stretch; text-align : center; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; gap : 4px 4px; } .PREPAGE-SIDE-UI .HEADER > h2, .PREPAGE-SIDE-UI .HEADER > h2 > strong, .PREPAGE-SIDE-UI .HEADER > h2 > span, .PREPAGE-SIDE-UI .HEADER > span{ flex : 1 1 100%; display : flex; flex-direction : row; flex-wrap : wrap; align-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; color : #3A3A3A; background : transparent; font-weight : normal; font-size : calc(14px + 1.0vmin); font-family : 'OswaldBold', 'LeagueGothic', sans-serif; word-wrap : initial; overflow-wrap : break-word; white-space : pre-wrap; word-break : normal; } .PREPAGE-SIDE-UI .HEADER > h2 > strong{ justify-content : center; align-content : center; align-items : center; text-align : left; font-weight : normal; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldBold', 'LeagueGothic', sans-serif; } .PREPAGE-SIDE-UI .HEADER > h2 > span{ justify-content : center; align-content : center; align-items : center; text-align : left; font-size : inherit; flex : 0 0 auto; font-family : 'OswaldExtraLight', 'LeagueGothic', sans-serif; } .PREPAGE-SIDE-UI .HEADER > span{ color : #5A5A5A; padding : 0px 0px 5px 0px; margin : 0px 0px 5px 0px; border-bottom : 1px solid #555555; font-weight : normal; font-size : calc(12px + 0.2vmin); font-family : inherit; } .PREPAGE-SIDE-UI .TAGS .TAG{ flex : 1 1 auto; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 4px 4px 4px 4px; margin : 0px 0px 0px 0px; border : 1px solid #E0E0E0; color : #097D66; background : transparent; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'Oswald', 'LeagueGothic', sans-serif; } .PREPAGE-SIDE-UI .ROWS .ROW{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; border : none; } .PREPAGE-SIDE-UI .ROWS .ROW > a{ flex : 0 0 auto; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; border : none; color : #4A4A4A; background : transparent; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'OswaldLight', sans-serif; } .PREPAGE-SIDE-UI .ROWS a:hover{ color : #097D66; font-family : 'Oswald', sans-serif; } .PREPAGE-SIDE-UI .HEADER{ align-content : flex-start; background : transparent; padding : 0px 0px 4px 0px; border-bottom : 1px solid #E0E0E0; } .PREPAGE-BODY .PREPAGE-HEADER{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : flex-start; align-items : stretch; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; border : none; background : transparent; gap : 0px 0px; } .PREPAGE-BODY .PREPAGE-HEADER .PREPAGE-NAVI-PATH{ flex : 1 1 100%; max-width : 100%; display : flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 1vmin 0px 1vmin 0px; margin : 0px 0px 0px 0px; border-bottom : 1px solid #CCCCCC; color : #777777; background : transparent; font-weight : normal; font-size : calc(12px + 0.4vmin); font-family : 'OswaldLight', sans-serif; gap : 4px 1vmin; } .PREPAGE-BODY .PREPAGE-HEADER .PREPAGE-NAVI-PATH a, .PREPAGE-BODY .PREPAGE-HEADER .PREPAGE-NAVI-PATH span{ flex : 0 0 auto; max-width : 100%; display : inline-flex; flex-direction : row; flex-wrap : nowrap; justify-content : flex-start; align-content : center; align-items : center; text-align : left; padding : 0px 0px 0px 0px; margin : 0px 0px 0px 0px; border : none; color : inherit; background : transparent; font-weight : inherit; font-size : inherit; font-family : inherit; gap : 0px 5px; line-height : 100%; } .PREPAGE-BODY .PREPAGE-HEADER .PREPAGE-NAVI-PATH a{ font-size : calc(12px + 0.4vmin); font-family : 'Oswald', sans-serif; font-weight : normal; color : #097D66; } .PREPAGE-BODY .PREPAGE-HEADER .PREPAGE-NAVI-PATH img{ flex : 0 0 auto; max-width : 100%; display : inline-flex; flex-direction : row; flex-wrap : nowrap; justify-content : center; align-content : center; align-items : center; text-align : center; padding : 0px 0px 0px 0px; margin : 1px 0px 0px 0px; } /* [target~=_blank]::after { content:"[Werbung]" !important; font-size: calc(6px + 0.4vmin); font-weight: normal; font-family : sans-serif; color: inherit; position: absolute; top: -2px; right: 0px; word-wrap: break-word; } */ /* .PARTNERLINKHINT::after { content:"[i]" !important; font-size: calc(6px + 0.4vmin); font-weight: normal; font-family : sans-serif; color: inherit; position: absolute; top: -4px; right: 0px; word-wrap: break-word; } /* .PARTNERLINKHINT::after { content:" [...] " !important; font-size: calc(8px + 0.4vmin); font-weight: normal; font-family : sans-serif; color: #000000; height: 100%; vertical-align: middle; } */ .PARTNERLINKHINTNOTICE::after { margin-top: 1vmin; content:"[Werbung]: Externe Werbelinks zu Partner-Websites " !important; font-size: calc(8px + 0.4vmin); font-weight: normal; font-family : sans-serif; color: #000000; height: 100%; vertical-align: middle; }