/* Default classes. */ * {margin:0px; padding:0px; border:0px; border-color: #ececec;} html{height:100%;} body {margin:0px; font-family: Helvetica, Arial, sans-serif; font-size:12px; height: 100%; line-height: 17px;} h2 {margin:15px 0px 0px 0px; color:#333333; font-size:13px; text-transform:uppercase; font-weight:bold; border-bottom:1px solid #cdd3d5; padding-top:5px;padding-bottom:5px;} h3 {padding:12px 0px 2px 6px; color: #333333; font-size:12px; } ul {padding-left:20px;} em {color:#bcbbb3;} a:not(.visibleLink) {text-decoration:none; color:#000000;} option {padding-left:2px; } pre { white-space: pre-wrap; word-wrap: break-word; } /* Structure. The most global structure elements is a table (#structureTable) that divides the screen in zones : #topBarZone, #menuZone, #bodyZone and #footerZone */ #structureTable {width:100%; height:100vh; position:absolute;} #bodyZone {padding: 0px 15px 15px 15px; vertical-align:top; position:relative;} #bodyZone #innerBody {margin-top:20px; padding-right:35px;} #topRightZone{float:right;font-size: 12px;color: #808080;text-transform: none;font-weight: normal;} /* Top bar and hub selector. */ #topBarZone {height:27px; color:#ffffff; font-size:12px; position:relative; line-height:27px; padding:0px 5px 0px 0px; background-color:#7d7b6f;} #topBarZone .topLogo {position:absolute; top:0px; left:0px; padding:0px 0px 0px 5px;} #topBarZone .topCustomLogo {position:absolute; top:0px; left:0px; padding:0px 0px 0px 0px;} #topBarZone .left {float: left; top:0px; left:0px; padding:0px 5px 0px 40px;} #topBarZone .right {float: right; top:0px; right:0px; height:27px;} #topBarZone .right .help {padding-left:30px;} #topBarZone .right .remainingdays {opacity: 0.85;} #topBarZone .right .remainingdays a {color:white; text-decoration: underline;} #topBarZone .help img, #topBarZone .currentHub img{margin-left:6px;} #topBarZone .right .logout {padding:0px 30px 0px 15px; background:url('images/common/topbar/logout.png') no-repeat 85% 5px; height:27px; line-height:27px; display:inline-block; cursor:pointer; background-color:#ed7d00;} #hubSelectorContainer {position:relative; cursor:pointer; margin-right: 20px; } #hubSelector { left:50%; margin-left:-125px; width:250px;} #hubSelector.admin { left:50%; margin-left:-200px; width:400px; height:535px; padding:5px; } #hubSelector.admin .hubSelectorIntro {color:#000; } #helpContainer {position:relative; cursor:pointer; padding-right: 10px;} #helpSelector { right:0px; width:190px; } #topBarZone .ui-effects-wrapper {display:inline-block;} #hubSelector, #helpSelector {background:#ffffff; display:none; position:absolute; top:21px; z-index:100; text-align:left; border-right: 1px solid #9cc4de; border-left: 1px solid #9cc4de; border-bottom: 1px solid #9cc4de;} #hubSelector input {border:1px solid #9cc4de; width:200px; padding:1px; } #hubSelector div, #helpSelector div {padding:0px 10px 0px 10px; color:#333333;} #hubSelector div:hover, #helpSelector div:hover {background:#bcbbb3; color:#ffffff;} #testBannerZone {height:27px; color:#ffffff; font-size:12px; position:fixed; line-height:27px; background-color:#ff781e; top: 27px; width:100%; z-index:50 } #testBannerZone .topLogo {position:absolute; top:0px; left:0px; padding:6px 0px 0px 11px;} #testBannerZone .left {float: left; top:0px; left:0px; padding:0px 5px 0px 40px;} /* Menu. Inside #menuZone, the menu is just a list of divs, for every (sub-)menu item. The first-level menu items are marked with the class 'menu1', and the second-level menu items are marked with the class 'menu2'. All the second-level menu items of the same first-level are surrounded in a div with the class 'menu2Panel'. The active menu entries have the supplementary 'active' class. The divs only contain a 'a' tag with text. */ #menuZone { width:230px;background-color:#f8f8f8; font-size:12px; vertical-align:top; height:100%; border-right: 1px solid #e4e4e4; position:relative;} #menu { width:230px; height:100%; } #menuZone .menu1 {font-size:15px; } #menuZone .menu1 a div {padding-left:45px; padding-top: 15px;padding-bottom: 15px;} #menuZone .menu1:first-child div {padding-top: 20px;} #menuZone .menu1 a, #menuZone .menu2 a { font-weight: bold; color:#b6b6b0;} #menuZone .menu1.active {background-color:#ffffff;} #menuZone .menu1.active a,#menuZone .menu1:hover a {color:#ed7d00;} #menuZone .menu2 { height:26px; line-height:26px; background: #ffffff; font-size:12px;} #menuZone .menu2Panel .menu2:last-child div {padding-bottom:15px;} #menuZone .menu2 a {font-weight: normal; color:#b6b6b0;} #menuZone .menu2.active, #menuZone .menu2:hover { background:url('images/common/menu/marker.ed7d00.png') #ffffff no-repeat 45px 8px ; } #menuZone .menu2.active a { color:#ed7d00; font-weight:bold; } #menuZone .menu2:hover a { color:#ed7d00;} #menuZone .menu2 div {padding-left:55px; } #menuZone .menu1.home div { background: url('images/common/menu/home.b6b6b0.png') 20px 22px no-repeat;} #menuZone .menu1.home.active div, #menuZone .menu1.home:hover div { background: url('images/common/menu/home.ed7d00.png') 20px 22px no-repeat; } #menuZone .menu1.exploitation a div { background: url('images/common/menu/monitoring.b6b6b0.png') 20px 17px no-repeat;} #menuZone .menu1.exploitation.active a div, #menuZone .menu1.exploitation:hover a div { background: url('images/common/menu/monitoring.ed7d00.png') 20px 17px no-repeat;} #menuZone .menu1.channels a div { background: url('images/common/menu/channels.b6b6b0.png') 16px 20px no-repeat;} #menuZone .menu1.channels.active a div, #menuZone .menu1.channels:hover a div { background: url('images/common/menu/channels.ed7d00.png') 16px 20px no-repeat;} #menuZone .menu1.admin a div { background: url('images/common/menu/admin.b6b6b0.png') 20px 17px no-repeat;} #menuZone .menu1.admin.active a div, #menuZone .menu1.admin:hover a div { background: url('images/common/menu/admin.ed7d00.png') 20px 17px no-repeat;} #menuZone .menu1.bwAdmin div { background: url('images/common/menu/babelway.b6b6b0.png') 20px 17px no-repeat;} #menuZone .menu1.bwAdmin.active div, #menuZone .menu1.bwAdmin:hover div { background: url('images/common/menu/babelway.ed7d00.png') 20px 17px no-repeat;} #menuZone .menuhighlight div {width: 100%; text-align: center; padding-top: 15px;padding-bottom: 15px; -webkit-transition: background-color 500ms linear; -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear;} #menuZone .menuhighlight {font-size:15px; position: absolute; bottom:15px; width:100%; background-color: #FAC64B;} #menuZone .menuhighlight a {color: white; font-weight:bolder;} #menuZone .menuhighlight:hover div { background-color:#F9B233; -webkit-transition: background-color 500ms linear; -moz-transition: background-color 500ms linear; -o-transition: background-color 500ms linear; -ms-transition: background-color 500ms linear; transition: background-color 500ms linear; } #menuZone .menuhighlight .lefticonmenu {background-color: #F9B233; width:20%; height:100%; float: left;} /* Logo */ #logoZone { height:62px; text-align:center; vertical-align:bottom; background-color:#f8f8f8; padding-bottom:35px; border-right: 1px solid #e4e4e4; color:#929395;} #logoZone a { padding-top:20px; display:block;} #logoZone div a { padding-top: 0px; color: #0071b4; text-decoration:underline} /* Footer */ #bodyToFooter { background: url("images/common/footer/separator.png") repeat-x bottom;} #footerZone { color: #929395; padding: 10px 10px 14px 10px; font-size:10px; } #footerZone span {padding: 0px 15px 0px 15px;} #footerZone span:first-child {padding: 0px 15px 0px 0px;} #footerZone span a {color: #929395; text-decoration:underline;} #feedback { position:fixed; bottom:0; right:0; cursor:pointer; z-index:2000;} #SendFeedBackForm textarea {height:100px; width:500px;} #externalOuterBody {background-color: #ffffff; } #externalOuterBody #logo {width:680px; margin:0px auto 0px auto;} #externalContainer { background-color:#f8f8f8; border:2px solid #cccccc; width:680px; min-height:330px; margin:0px auto 0px auto; padding:10px; position:relative;} #waitExternal { position:absolute; left:180px; top:0px; } /* Display of notifications : validation/warning/info/error/... messages. Read http://css.dzone.com/news/css-message-boxes-different-me for choice of colors. See showNotification() in selfservice.js notification will be displayed as a floating box on top of the application userMessage are messages that are displayed in the page flow (confirmation message, ...) */ .notifications {position: fixed;height: auto;z-index: 8999;width: 650px;opacity: 1;display: block;overflow: visible;cursor: auto;margin-right:auto;margin-left:-210px;top:0px;left:50%;} .notification { color: #ffffff;margin: 0px 0px 10px 0px; padding:5px 20px 15px 50px; background-repeat: no-repeat; background-position: 15px 12px; } .userMessage { color: #ffffff;border: 1px solid; margin: 10px 0px 10px 0px; padding:10px 10px 10px 50px; background-repeat: no-repeat; background-position: 15px 8px; } .info { background-color: #0382b9; background-image: url('images/common/notification/info.png'); } .success { background-color: #72c267; background-image: url('images/common/notification/success.png'); } .warning { background-color: #ff781e; background-image: url('images/common/notification/warning.png');} .error { background-color: #f81222; background-image: url('images/common/notification/error.png'); } .info a, .success a, .warning a, .error a, .validation a { color: inherit; text-decoration:underline;} img.rounded{ -webkit-border-radius:50%; -moz-border-radius:50%; border-radius:50%; border:2px solid #7d7b6f;} .notificationActions {overflow: auto;min-height: 10px; margin-right: -15px;} .notificationAction {background-repeat: no-repeat;min-height: 10px;background-size: 10px 10px;width: 10px;cursor: pointer;float: right;padding-left:2px;} .notificationAction.close {background-image:url('images/common/notification/close.png');} /* Page introduction (hideable help of the page). Just a div with class 'pageIntroduction'. */ .pageIntroduction {color:#b6b6b0; font-size:12px; padding:0px 40% 0px 6px; margin:0px; position:relative; margin-top:10px;} .pageIntroduction a {color:inherit; text-decoration:underline;} .pageIntroduction .closer {background:url('images/common/pageIntroduction/closePageIntro.png'); background-repeat: no-repeat; background-size: 7px 7px; width:7px;min-height:7px; display: inline-block;margin-left: 10px;cursor:pointer;} .helpTitle {padding-top:3px; padding-left: 5px;} /* Actions. Actions are just a text surrounded by 2 spans (second span because impossible to set 2 different backgrounds on only one span). The outer span has the following classes : - actionLink - level1, level2 or level3 - active or inactive - A class that tells the action ('add', 'cancel', 'delete', ...). The clickable effect is made with a surrounding <a>, or an onclick on the outer span. */ .actionLink { border: none; font-size: 12px; font-family: Helvetica, Arial, sans-serif; padding: 6px 6px 6px 6px; margin:20px 8px 2px 0px; display:inline-block; height:16px; min-width: 70px; text-align: center; font-weight: bold;} .actionLink.active {cursor:pointer;} .actionLink.level1.active { background-color:#ed7d00; color: #FFFFFF; } .actionLink.level1.active:hover { opacity: 0.7; } .actionLink.level1.inactive { background-color: #c6c6c6; color: #FFFFFF; } .actionLink.level2.active { background-color:#F8F8F8; color: #ed7d00; border: 1px solid #e4e4e4; } .actionLink.level2.inactive {background-color:#fefefe; color: #ed7d00; border: 1px solid #f1f1f1;} .actionLink.level3.active { background-color:#f8f8f8; color: #464646; border: 1px solid #e4e4e4;} .actionLink.level3.active:hover { opacity: 0.8; } .actionLink.level3.inactive {background-color:#fefefe; color: #464646; border: 1px solid #f1f1f1;} .actionLink>span { background-repeat:no-repeat; background-position:left center;padding:5px 5px 5px 22px; } .actionLink.inactive>span {opacity:0.4;} .actionLink.level1>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_62.png');} .actionLink.level2>span {background-image:url('images/common/actions/Icones_ed7d00_01_62.png');} .actionLink.level3>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_62.png');} .actionLink.level1.activate>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_95.png');} .actionLink.level2.activate>span {background-image:url('images/common/actions/Icones_ed7d00_05_95.png');} .actionLink.level3.activate>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_95.png');} .actionLink.level1[class*=" add"]>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_102.png');} .actionLink.level2[class*=" add"]>span {background-image:url('images/common/actions/Icones_ed7d00_01_102.png');} .actionLink.level3[class*=" add"]>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_102.png');} .actionLink.level1.back>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_56.png');} .actionLink.level2.back>span {background-image:url('images/common/actions/Icones_ed7d00_01_56.png');} .actionLink.level3.back>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_56.png');} .actionLink.level1.buy>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_02_65.png');} .actionLink.level2.buy>span {background-image:url('images/common/actions/Icones_ed7d00_02_65.png');} .actionLink.level3.buy>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_02_65.png');} .actionLink.level1.cancel>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_56.png');} .actionLink.level2.cancel>span {background-image:url('images/common/actions/Icones_ed7d00_01_56.png');} .actionLink.level3.cancel>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_56.png');} .actionLink.level1.close>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_106.png');} .actionLink.level2.close>span {background-image:url('images/common/actions/redIcons/Icones_Rouges_01_106.png');} .actionLink.level3.close>span {background-image:url('images/common/actions/redIcons/Icones_Rouges_01_106.png');} .actionLink.level1.closeTicket>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_02_54.png');} .actionLink.level2.closeTicket>span {background-image:url('images/common/actions/Icones_ed7d00_02_54.png');} .actionLink.level3.closeTicket>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_02_54.png');} .actionLink.level1.confirm>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_62.png');} .actionLink.level2.confirm>span {background-image:url('images/common/actions/Icones_ed7d00_01_62.png');} .actionLink.level3.confirm>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_62.png');} .actionLink.level1.continue>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_62.png');} .actionLink.level2.continue>span {background-image:url('images/common/actions/Icones_ed7d00_01_62.png');} .actionLink.level3.continue>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_62.png');} .actionLink.level1.delete>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_106.png');} .actionLink.level2.delete>span {background-image:url('images/common/actions/redIcons/Icones_Rouges_01_106.png');} .actionLink.level3.delete>span {background-image:url('images/common/actions/redIcons/Icones_Rouges_01_106.png');} .actionLink.level1.deploy>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_03_103.png');} .actionLink.level2.deploy>span {background-image:url('images/common/actions/Icones_ed7d00_03_103.png');} .actionLink.level3.deploy>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_03_103.png');} .actionLink.level1.desactivate>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.desactivate>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.desactivate>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.detail>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_143.png');} .actionLink.level2.detail>span {background-image:url('images/common/actions/Icones_ed7d00_01_143.png');} .actionLink.level3.detail>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_143.png');} .actionLink.level1.edit>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.edit>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.edit>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.editPassword>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_61.png');} .actionLink.level2.editPassword>span {background-image:url('images/common/actions/Icones_ed7d00_05_61.png');} .actionLink.level3.editPassword>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_61.png');} .actionLink.level1.fixAndResubmit>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_35.png');} .actionLink.level2.fixAndResubmit>span {background-image:url('images/common/actions/Icones_ed7d00_01_35.png');} .actionLink.level3.fixAndResubmit>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_35.png');} .actionLink.level1.goToItem>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_62.png');} .actionLink.level2.goToItem>span {background-image:url('images/common/actions/Icones_ed7d00_01_62.png');} .actionLink.level3.goToItem>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_62.png');} .actionLink.level1.hide>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.hide>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.hide>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.import>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_04_91.png');} .actionLink.level2.import>span {background-image:url('images/common/actions/Icones_ed7d00_04_91.png');} .actionLink.level3.import>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_04_91.png');} .actionLink.level1.moreOptions>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_143.png');} .actionLink.level2.moreOptions>span {background-image:url('images/common/actions/Icones_ed7d00_01_143.png');} .actionLink.level3.moreOptions>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_143.png');} .actionLink.level1.lessOptions>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_143.png');} .actionLink.level2.lessOptions>span {background-image:url('images/common/actions/Icones_ed7d00_01_143.png');} .actionLink.level3.lessOptions>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_143.png');} .actionLink.level1.previous>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_56.png');} .actionLink.level2.previous>span {background-image:url('images/common/actions/Icones_ed7d00_01_56.png');} .actionLink.level3.previous>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_56.png');} .actionLink.level1.refresh>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_35.png');} .actionLink.level2.refresh>span {background-image:url('images/common/actions/Icones_ed7d00_01_35.png');} .actionLink.level3.refresh>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_35.png');} .actionLink.level1.reopenTicket>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_02_55.png');} .actionLink.level2.reopenTicket>span {background-image:url('images/common/actions/Icones_ed7d00_02_55.png');} .actionLink.level3.reopenTicket>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_02_55.png');} .actionLink.level1.rerunWizard>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_35.png');} .actionLink.level2.rerunWizard>span {background-image:url('images/common/actions/Icones_ed7d00_01_35.png');} .actionLink.level3.rerunWizard>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_35.png');} .actionLink.level1.resubmit>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_35.png');} .actionLink.level2.resubmit>span {background-image:url('images/common/actions/Icones_ed7d00_01_35.png');} .actionLink.level3.resubmit>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_35.png');} .actionLink.level1.reset>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.reset>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.reset>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.revert>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.revert>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.revert>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.runTestCase>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_96.png');} .actionLink.level2.runTestCase>span {background-image:url('images/common/actions/Icones_ed7d00_05_96.png');} .actionLink.level3.runTestCase>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_96.png');} .actionLink.level1.save>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_04_31.png');} .actionLink.level2.save>span {background-image:url('images/common/actions/Icones_ed7d00_04_31.png');} .actionLink.level2.checked>span {background-image:url('images/common/actions/Icones_ed7d00_01_130.png');} .actionLink.level3.save>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_04_31.png');} .actionLink.level1.search>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_135.png');} .actionLink.level2.search>span {background-image:url('images/common/actions/Icones_ed7d00_01_135.png');} .actionLink.level3.search>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_135.png');} .actionLink.level1.send>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_11.png');} .actionLink.level2.send>span {background-image:url('images/common/actions/Icones_ed7d00_05_11.png');} .actionLink.level3.send>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_11.png');} .actionLink.level1.show>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_05_98.png');} .actionLink.level2.show>span {background-image:url('images/common/actions/Icones_ed7d00_05_98.png');} .actionLink.level3.show>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_05_98.png');} .actionLink.level1.visit>span {background-image:url('images/common/actions/whiteIcons/Icones_blc_01_66.png');} .actionLink.level2.visit>span {background-image:url('images/common/actions/Icones_ed7d00_01_66.png');} .actionLink.level3.visit>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_66.png');} .actionLink.level2.archive>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_03_103.png');} .actionLink.level2.linkChainInfo>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_03_103.png');} .actionLink.level2.process>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_97.png');} .actionLink.level2.linkChain>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_129.png');} .actionLink.level2.linkChain>span {background-image:url('images/common/actions/darkGrayIcons/Icones_grisfonce_01_129.png');} .actionLink.loading>span {background-image: url("images/common/actions/loader.gif") !important;} .inlineLink .ui-icon{ display:inline-block; height:13px; padding-left:1px;} .inlineLink { margin-left:10px; white-space:nowrap;} .inlineLink.active { color: #ed7d00; } .inlineLink.inactive { color: #c6c6c6; } .inlineLink.active:hover { color:#bcbbb3; text-decoration:underline; cursor:pointer;} .channelStatus {padding-right:10px; cursor:pointer;} .deployAction {padding: 4px 10px 1px 10px; border-left:#d3d3d3 solid 1px;} .deployAction a {text-decoration: underline;color: #ed7d00;cursor: pointer;} .deployAction a.inactive{color: #bbbbbb;} /* Static tabs. */ .staticTabs { width:100%; border-style: none; border-width: medium; position:relative; color: #333333; border-bottom: 1px solid #f2f2f2;margin-bottom:20px;} .staticTabs>div {color: #808080; display:inline-block; padding: 0px 12px 10px 6px; font-weight: normal;} .staticTabs>div.active {border-bottom:4px solid #ed7d00;color:#ed7d00;cursor:pointer;} .staticTabs>div.disabled { opacity: .35; filter: Alpha(Opacity=35);} .staticTabs>div:hover:not(.disabled):not(.active) { color:#ed7d00; border-bottom:4px solid #ed7d00;cursor:pointer; opacity: 0.7;} /* Channel tabs. */ .channelTabs { position:relative; display:block; line-height:25px; border-bottom:1px solid #ececec; margin-top:-21px;margin-bottom:20px;} .channelTabs .secondBlock { display:inline-block; position: absolute; right: 0px; } .channeltabs img {vertical-align:bottom;} .channelTab { position:relative; display:inline-block; background-color: #bcbbb3; padding:6px 12px; color:#ffffff; border-left: 14px solid #bcbbb3; cursor:pointer; } .channelTab:before { position:absolute; bottom:0px; left:-14px; width: 0; border-bottom: 19px solid transparent; border-top: 19px solid transparent; border-right: 0px solid transparent; border-left: 14px solid #FFFFFF; content: " "; font-size: 0; line-height: 0;} .channelTab:after { position:absolute; bottom:1px; left:-14px; width: 0; border-bottom: 18px solid transparent; border-top: 18px solid transparent; border-right: 0px solid transparent; border-left: 13px solid #bcbbb3; content: " "; font-size: 0; line-height: 0;} .channelTab.active,.channelTab:hover { background-color:#ed7d00; border-left-color:#ed7d00;color:#ffffff;} .channelTab.active+.channelTab:after,.channelTab:hover+.channelTab:after {border-left-color:#ed7d00;} .channelTab:first-child:after {border-left-color:#ed7d00; } .channelTab:last-child {background-color:transparent; border-left-color:transparent;} .channelOtherTab {display:inline-block; color: #808080; padding:6px 10px 3px 10px; cursor:pointer;} .channelOtherTab.active {border-bottom:4px solid #ed7d00;color:#ed7d00;} .channelOtherTab:not(.disabled):not(.active):hover {color:#ed7d00; border-bottom:4px solid #ed7d00; } .channelOtherTab.disabled {opacity: .35; filter: Alpha(Opacity=35); } /* FormTable. Form tables are invisible 2-columns tables that are used for ALL our forms. First column contains the label, and second column the value. */ .formTable { border-collapse:collapse; border:1px solid #ececec; color:#333333; background-color:#f8f8f8; display:block; padding:10px 0px 10px 0px; min-height: 30px; margin-top:20px;} .formTable>tbody>tr>td:first-child {padding: 4px 0px 0px 16px; vertical-align: top; width:200px; height:26px; } .formTable>tbody>tr>td:nth-child(2) {padding-left:10px; padding-right:16px;} .formTable>tbody>tr>td.separator { background-color:#ffffff;} .formTable>tbody>tr>td.title { background-color:#ffffff; color:#006699; padding-top:10px; font-weight:bold;} .formTable.wideLabel>tbody>tr>td:first-child {width:300px; } input[name="workPrefix"]{ width: 100px; !important;} input[name="workSuffix"]{ width: 100px; !important;} .separated {margin-top:20px;} /* FormDiv. When you have to display things like in formTable, but in only one zone. */ .formDiv { border:1px solid #ececec; color:#333333; background-color:#f8f8f8; display:block; padding:10px 5px 10px 16px; margin-top:20px;} /*parametersSection */ .parametersSection { position:relative; margin-top:20px; min-width:500px;} .parametersSection .formTable {margin-top:5px; border:none; } .parametersSection fieldset { border:1px solid #ececec; width:calc(100%-10px); min-height:60px; background-color:#f8f8f8; } .parametersSection fieldset legend { margin-left:20px; } .parametersSection fieldset legend div {border:1px solid #f8f8f8; padding: 1px 4px 1px 4px; background-color:#ffffff;} .customZone{margin-top:20px;} /* Splitable. Invisible table just used to split the sreen in zones. */ .splitTable { border-collapse:collapse; border:none; } .splitTable td { vertical-align:top; padding:5px;} /* Lists */ .listOverlay { display:none; position:fixed; background-color:#eeeeee; border:1px solid #bcbbb3; padding:2px 5px 2px 5px; margin:20px; white-space:normal; z-index:2000; color:#bcbbb3;} /* Form elements. */ input[type='text'], select {border:1px solid #ececec;} .custom-combobox i {color:#b6b6b0;} .picker { border:1px solid #ececec; text-align: left; font-family:Helvetica, Arial, sans-serif; padding:2px 0px 2px 3px; margin:2px 10px 2px 0px; color:#333333; font-size:12px;} .picker.BigDecimal {text-align: right;} input[type='text'].picker, input[type='password'].picker, select.picker { width:400px; } input[type='file'].picker {background-color:#ffffff;} input[type='number'].picker {width:40px;} textarea.picker {height:70px; width:400px;} input[type='checkbox'].picker { width:14px; height:14px; border:1px solid #ececec; margin:0 8px 0 0; } input[type='text'].datePicker {width:140px;} input[type='text'].Date.picker {width:140px;} input[type='text'].picker.SmtpUserName {width:200px;} input[name="workPrefix"]{ width: 100px !important; margin-right:3px; margin-left: 0px;} input[name="workSuffix"]{ width: 100px !important; margin-right:0px; margin-left: 3px;} .UnwrapAttachmentDefinition input[type='text'].picker {width:155px;} .WrapAttachmentDefinition input[type='text'].picker {width:155px;} .NameValueDefinition input[type='text'].picker {width:155px;} .FileMap input[type='text'].picker {width:155px;} .EncodingWithMetadata select.picker {width:100px;} .EncodingWithMetadata input.picker {width:300px;} input[type='text'].metadataKey {width:295px; margin-right:0px;} input[type='text'].metadataValue {width:185px;} select.picker option {padding-left:4px; } .checkBoxContainer {padding-right:8px;} .checkBoxContainer label {padding-left:2px;} .formTable tr>td:first-child input[type='text'] {width:170px;} /* Should only happen for add of properties. */ .gridPicker { border:1px solid #ececec; color:#333333; font-size:12px;} .PartnerIdentifier select.picker {width:75px;} .PartnerIdentifier input.picker {width:300px;} .PartnerContact {display:inline-block; padding-bottom:8px; } .PartnerContact .intro {display:inline-block; width:75px; } .PeppolParticipantIdentifier select.picker {width:140px;} .PeppolParticipantIdentifier input.picker {width:140px;} .PartnerDataAccess select.picker.Partner {width:200px;} .PartnerDataAccess select.picker.PartnerDataAccessLevel {width:120px;} .picker.FieldDescription, .picker.FieldDescriptionArray {border:none;} .picker.FieldDescription .name {width:220px; display:inline-block; vertical-align:top;} .picker.FieldDescription .name input {width:190px; } .picker.FieldDescription .type {width:400px; display:inline-block; vertical-align:top; } .picker.FieldDescription .type input {width:335px; } .picker.FieldDescription .type .DocumentType {width:285px; } .horizontalRule {width: 100%; height: 7px; margin: 30px 0; border-bottom: 2px solid lightgray; text-align: center;} .horizontalRule span {font-size: 20px; font-weight:bold; background-color: white; padding: 0 10px;} .inputValid { border-color : #ef0101; } .inputError { border-color: #9dcf32; } td.elementName {height:25px;} td.elementName input { border:1px solid #DCEDF5; color:#333333; font-size:16px; font-weight:normal; } td.elementDescription { vertical-align:top; font-style:italic;} td.elementDescription textarea { border:1px solid #DCEDF5; color:#333333; } table.elementPresentation { padding: 0px 0px 5px 0px; max-width:1000px;} table.elementPresentation td {min-width:100px; } .FMWTHElement {height:30px;} .FMWTHElement .labelKey {padding:2px 0px 2px 3px; margin:2px 10px 2px 0px; width: 150px; } select .more {direction:rtl;font-size:smaller; text-decoration:underline;} /* Titles. Titles are just h2 tags. */ .relatedItem {color:#bcbbb3 !important;text-decoration:underline; cursor:pointer;} .metaData {font-size:11px; } .metaData input {border: 1px solid #cccccc; } .metaData li {list-style:disc; float:left; margin-left:20px;} .requiredStar {color:red;} /* Mask */ .blockingMask {background-color: #BBBBBB; height: 100%; left: 0; top:0; opacity: 0.7; position: fixed; width: 100%; z-index: 20000; } .blockingText {position:fixed; left: 43%; top:45%; background: url("images/common/blockingMask/loading.gif") no-repeat scroll 5px 5px #EEEEEE; z-index: 20001; padding:5px 5px 5px 30px; border:2px solid #AAAAAA; } /* Useful standard classes, that can be used by everybody. */ .pointer {cursor:pointer; } .light { color:#cccccc;} .centered { display:block; margin:0px auto 0px auto;} .hidden {display:none;} .emptyPageTitle {width:800px; text-align:center; margin:0px auto 0px auto; font-size:18px; font-weight:bold; margin-top:40px;} .emptyPageText {text-align:center; margin:0px auto 0px auto; font-size:14px; margin-top:5px;} .emptyPageMainButton { background-color:#e17c00; width:200px; padding:10px 0px; font-size:14px; font-weight:bold; color:#ffffff; display:inline-block; text-align:center; vertical-align:middle; margin:5px 20px; cursor:pointer;} .emptyPageMainButton:hover { background-color:#f99200; } .emptyPageSecondButton { background-color:#EFEFEF; width:200px; padding:10px 0px; font-size:14px; font-weight:bold; color:#e17c00; display:inline-block; text-align:center; vertical-align:middle; margin:5px 20px; cursor:pointer;} .emptyPageSecondButton:hover {color:#f99200; } .emptyPageButtons { display:block; margin:20px auto 0px auto; width:500px; } /* Renamable field. */ .renamable {position:relative; cursor:pointer; font-style:italic; padding:2px 3px 2px 1px; margin:0px;} .renamable:hover {background-color:white; } .renamable:hover:before { position: absolute; top: 102%; left: 50%; z-index:100; margin-top: 5px; margin-left:-40px; width:80px; padding: 3px 0px 3px 0px; font-style:normal; white-space:nowrap; background-color: #000; background-color: hsla(0, 0%, 20%, 0.9); color: #fff; content: 'Rename me'; text-align: center; font-size: 11px; line-height: 1.2;} .renamable:hover:after { position: absolute; top: 102%; left: 50%; z-index:100; margin-left: -5px; width: 0; border-bottom: 5px solid #000; border-bottom: 5px solid hsla(0, 0%, 20%, 0.9); border-right: 5px solid transparent; border-left: 5px solid transparent; content: " "; font-size: 0; line-height: 0;} .renamableInput {width:300px;} /* Clickable field. */ .clickMe:hover:before { position: absolute; top: 102%; left: 50%; z-index:100; margin-top: 5px; margin-left:-40px; width:attr(data-content-width); padding: 3px 3px 3px 3px; font-style:normal; white-space:nowrap; background-color: #000; background-color: hsla(0, 0%, 20%, 0.9); color: #fff; content: attr(data-content); text-align: center; font-size: 11px; line-height: 1.2;} .clickMe:hover:after { position: absolute; top: 102%; left: 50%; z-index:100; margin-left: -5px; width: 0; border-bottom: 5px solid #000; border-bottom: 5px solid hsla(0, 0%, 20%, 0.9); border-right: 5px solid transparent; border-left: 5px solid transparent; content: " "; font-size: 0; line-height: 0;} .clickMe {position:relative; cursor:pointer; font-style:italic; padding:2px 3px 2px 1px; margin:0px;} /* ----------------------------------------------------------------------------------------------------------------------------------. */ /* For specific pages. */ /* Home */ .homeMessage {border-bottom: 1px solid #d3d3d3;padding: 20px 0px 20px 0px;color: #0071b4;} .homeMessage a {text-decoration: underline; color: #0071b4;} .homeMessage.marketingMessage {color: #000000; text-align: center; font-size: 14px;} .homeMessage.marketingMessage .title {font-size: 16px;text-transform: uppercase;font-weight: bold;} .homeMessage.marketingMessage .subtitle {font-size: 15px;} .homeMessage.marketingMessage .content {margin-top:20px;} .homeMessage.marketingMessage .content img {padding: 0px 20px 0px 20px;margin-bottom: 20px;border-bottom: 1px solid #d3d3d3;} /* Tutorial */ #tutorialMask {background-color: #BBBBBB; height: 100%; left: 0; top:0; opacity: 0.7; position: fixed; width: 100%; z-index: 20000; } .tutorialBig,.tutorialSmall,.tutorialSmallWithExercise {background: none repeat scroll 0 0 #98BED9; border-radius: 3px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);} .tutorialBig {width:800px; height:450px; margin:0px -400px -245px 0px; line-height: 18px; padding: 16px; position: absolute; z-index: 20001; bottom:50%;right:50%} .tutorialSmall {width:140px; height:80px; padding: 2px 2px 2px 2px; position: absolute; text-align: left; z-index: 20001;right:2%; bottom:10%;} .tutorialSmallWithExercise {width:180px; height:auto; padding: 15px 2px 60px 2px; position: absolute; text-align: left; z-index: 20001;right:2%; bottom:10%;} .tutorialMinimizer {position:absolute; right:23px; top:5px; cursor:pointer;} .tutorialCloser {position:absolute; right:1px; top:1px; cursor:pointer;} .tutorialBig .tutorialTeacher {position:absolute; left:8px; bottom:8px;} .tutorialSmall .tutorialTeacher, .tutorialSmallWithExercise .tutorialTeacher {position:absolute; right:2px; bottom:2px; cursor:pointer;} .tutorialTitle {font-family:'Arial'; font-size:20px; font-weight:bold; width:100%; text-align:center; padding:10px; } .tutorialRight { position:relative; width:590px; height:450px; right:0px; margin-left:200px;} .tutorialContent {font-family:'Arial'; font-size:12px; padding:12px 0px 0px 0px;} .tutorialContent p{padding-bottom:10px;} .tutorialActions {position:absolute; bottom:-2px; left:0px; } .tutorialExercise {margin:10px 0px 10px 0px; } .tutorialExerciseNumber {font-weight:bold; } .tutorialExerciseText {padding: 5px 0px 5px 0px;} .tutorialExerciseSolution {font-style:italic; color:#2FAE45;} .tutorialClickHere {position:absolute; right:-14px; top:4px;} .tutorialMenu {position:absolute; left:10px; top:20px; width:180px; height:400px; padding:40px 0px 0px 0px; border-right:3px solid #88ACC3; line-height:20px;} .tutorialMenuEntry.current {font-weight:bold;} .tutorialMenuEntry.accessible {cursor:pointer; } .tutorialMenuEntry.nonAccessible {color:#888888;} .tutorialMenuTitle {font-weight:bold;} #tutorialBig iframe {margin:0px auto; display:block;} #tutorialMoving {color:#F9EDBE} #tutorialMoving .tutorialExerciseSolution{color:#F9EDBE} #tutorialMoving .inlineLink {color:#F9EDBE} #tutorialMoving .ui-icon {background:none;} /* Login page. */ /* Draw and position the 2 boxes. */ #loginPage #topBarZone {height:27px; color:#ffffff; font-size:12px; line-height:27px; padding:0px; } #loginPage #topBar { width:835px; text-align:right; margin:0px auto 0px auto;} #loginPage .centeredTable { width:835px; margin:0px auto 0px auto; border:0px; padding:0px; } #loginPage .centeredTable tr{ width:100%; } #loginPage .logo {padding-left:5px;padding-top:10px;} #loginPage .notifications { height:30px; padding-left:5px;} #loginPage #boxesRow { background:url('images/loginPage/boxesBackground.png') no-repeat; float:left; /* float:left is stupid, but is a workaround for a bug of Chrome. Without this, the border is not applied on the tr, but on every td of the tr. */} #loginPage #loginBox { width:418px; text-align:center; height:372px; margin:20px; vertical-align:top;} #loginPage #registerBox { width:417px; text-align:center; height:372px; margin:20px; vertical-align:top;} #loginPage .boxTitle { color:#ffffff; font-size: 17px; padding: 27px 0px 20px 0px; } #loginPage .introText { color: #333333; text-align: left; margin: 0px 20px 0px 20px; padding: 16px 0px 20px 0px; background: url('images/loginPage/doubleLigne.png') bottom no-repeat;} #loginPage .formZone { height:190px;} #loginPage .loginFormTable { color: #333333; background: url('images/loginPage/doubleLigne.png') bottom no-repeat; font-size:12px; border-spacing:0px;} #loginPage #loginBox .loginFormTable { margin:0px 20px 0px 20px; padding:5px 0px 10px 0px;} #loginPage #registerBox .loginFormTable { margin:0px 20px 0px 20px; padding:5px 0px 5px 0px;} #loginPage .loginFormTable td { height:32px; } #loginPage .loginFormTable td:nth-child(1) { padding: 0px ; width: 126px; text-align: left; font-size: 12px; background:inherit; border:inherit; } #loginPage #registerBox .loginFormTable td:nth-child(1) { width: 170px; } #loginPage input[type='text'],#loginPage input[type='password'] {width:240px; border:1px solid #9cc4de; } /* Submit buttons */ #loginPage input[type='submit'] { color: #fff; width: 115px; height:31px; text-align:center; padding:1px 0 3px 0; text-transform:uppercase; font-size:15px; border:none; cursor:pointer;} #loginPage #loginBox input[type='submit'] {background-color:#00689f ; } #loginPage #registerBox input[type='submit'] {background-color:#5ca346 ;} /* Connection problems. */ #loginPage .connectionProblem {font-size:12px; color:#bdbdbf; padding-left:5px;} #loginPage .connectionProblem a { color: #0381B8; } /* Catalogue and footer */ #loginPage .catalogueZone { width:835px; text-align:right; margin:90px auto 0px auto; position:relative; top:8px;} #loginPage .separator { width:100%; background:url('images/common/footer/separator.png') repeat-x; height:8px; padding-top:10px; } #loginPage .footer { color: #646567; width:835px; margin:0px auto 0px auto;} #loginPage .footer a { font-size:10px; color: #646567;} #loginPage .actionLink.level1.active { color: #FFFFFF; background: url('images/common/actions/blueActive.png') no-repeat; border: 1px solid #3c9ec8;} #loginPage .actionLink.level1.active:hover { color: #FFFFFF; background: url('images/common/actions/blueOver.png') no-repeat; border: 1px solid #3c9ec8;} #registrationPage #topBarZone {height:35px; color:#ffffff; font-size:12px; line-height:26px; padding:0px; background: url('images/common/topbar/background.png') repeat-x;} #registrationPage #topBar { width:835px; text-align:right; margin:0px auto 0px auto;} #registrationPage .centeredTable { width:835px; margin:0px auto 0px auto; border:0px; padding:0px; } #registrationPage .centeredTable tr{ width:100%; } #registrationPage .title {color: #0079C2; font-family: 'Abel',Arial,Helvetica,sans-serif; font-size: 22px; font-weight: lighter; line-height: 24px; text-transform: uppercase; } #registrationPage .logo {padding-left:5px;} #registrationPage .notifications { height:30px; padding-left:5px;} #registrationPage .currentUser { text-align:right; } #registrationPage .currentUser a{ color: #0381B8;} #registrationPage #boxesRow { background:url('images/loginPage/boxesBackground.png') no-repeat; float:left; /* float:left is stupid, but is a workaround for a bug of Chrome. Without this, the border is not applied on the tr, but on every td of the tr. */} #registrationPage #loginBox { width:418px; text-align:center; height:372px; margin:20px; vertical-align:top;} #registrationPage #registerBox { width:417px; text-align:center; height:372px; margin:20px; vertical-align:top;} #registrationPage .boxTitle { color:#ffffff; font-size: 17px; padding: 27px 0px 20px 0px; } #registrationPage #registerBox .introText { color: #333333; text-align: left; margin: 0px 20px 0px 20px; padding: 16px 0px 20px 0px; background: url('images/loginPage/doubleLigne.png') bottom no-repeat;} #registrationPage #loginBox .introText { color: #333333; text-align: left; margin: 0px 20px 0px 20px; padding: 16px 0px 20px 0px; } #registrationPage .advice { color: #333333; text-align: left; margin: 20px 20px 0px 20px; padding: 0px 0px 0px 25px; background: url('images/loginPage/check.png') top left no-repeat;} #registrationPage .formZone { height:190px;} #registrationPage .loginFormTable { color: #333333; background: url('images/loginPage/doubleLigne.png') bottom no-repeat; font-size:12px; border-spacing:0px;} #registrationPage #loginBox .loginFormTable { margin:0px 20px 0px 20px; padding:5px 0px 10px 0px;} #registrationPage #registerBox .loginFormTable { margin:0px 20px 0px 20px; padding:5px 0px 5px 0px;} #registrationPage .loginFormTable td { height:32px; } #registrationPage .loginFormTable td:nth-child(1) { padding: 0px ; width: 126px; text-align: left; font-size: 12px; background:inherit; border:inherit; } #registrationPage #registerBox .loginFormTable td:nth-child(1) { width: 170px; } #registrationPage input[type='text'],#registrationPage input[type='password'] {width:240px; border:1px solid #9cc4de; } /* Submit buttons */ #registrationPage input[type='submit'] { color: #fff; width: 115px; height:31px; text-align:center; padding:1px 0 3px 0; text-transform:uppercase; font-size:15px; border:none; cursor:pointer;} #registrationPage #registerBox input[type='submit'] { background-color:#5ca346 ;} /* Connection problems. */ #registrationPage .connectionProblem {font-size:12px; color:#bdbdbf; padding-left:5px;} #registrationPage .connectionProblem a { color: #0381B8; } /* Catalogue and footer */ #registrationPage .separator { width:100%; background:url('images/common/footer/separator.png') repeat-x; height:8px; padding-top:10px; margin-top:80px; } #registrationPage .footer { color: #646567; width:835px; margin:0px auto 0px auto;} #registrationPage .footer a { font-size:10px; color: #646567;} #registrationPage .actionLink.level1.active { color: #FFFFFF; background: url('images/common/actions/blueActive.png') no-repeat; border: 1px solid #3c9ec8;} #registrationPage .actionLink.level1.active:hover { color: #FFFFFF; background: url('images/common/actions/blueOver.png') no-repeat; border: 1px solid #3c9ec8;} #EndOfTrialFormPage #endOfTrialFormPage #topBarZone {height:35px; color:#ffffff; font-size:12px; line-height:26px; padding:0px; background: url('images/common/topbar/background.png') repeat-x;} #endOfTrialFormPage #topBar { width:835px; text-align:right; margin:0px auto 0px auto;} #endOfTrialFormPage .centeredTable { width:835px; margin:0px auto 0px auto; border:0px; padding:0px; } #endOfTrialFormPage .centeredTable tr{ width:100%; } #endOfTrialFormPage .logo {padding-left:5px;} #endOfTrialFormPage .separator { width:100%; background:url('images/common/footer/separator.png') repeat-x; height:8px; padding-top:10px; margin-top:80px; } #endOfTrialFormPage .footer { color: #646567; width:835px; margin:0px auto 0px auto;} #endOfTrialFormPage .form {padding-right:10px;} #endOfTrialFormPage textarea {width:100%; border:1px solid #b6b6b0;} /* Monitoring */ #exploitation_messagesStats .formTable { margin-bottom:20px;} /* Transformation tree. */ .transformationZone { vertical-align:top; } #channels_duplicateTransformationPage #ConfirmCopy select {width:auto;} /* Channels. Define element. */ .channelOn { width: 100%; background-image: url(images/channels/channels/channelOn.png); background-repeat: no-repeat; background-position-y: 5px; background-position-x: 5px; padding-left: 15px; } .channelOff { width: 100%; background-image: url(images/channels/channels/channelOff.png); background-repeat: no-repeat; background-position-y: 5px; background-position-x: 5px; padding-left: 15px; } .createChoices td{width:250px; padding:10px; text-align:center; vertical-align:middle; cursor:pointer;} h2.channelDetail{border-style: none;} /* Lookuptable */ .ui-jqgrid tbody tr.ui-row-ltr.ui-state-hover td .inlineLink {color:#ffffff;} /* HistoricalData (tab in md, gw and transforms). */ #HistoricalData .formTable { margin-top:0px; } /* Routing */ .routingTitleHelp { font-style:italic; color:#aaaaaa; padding:0px 5px 0px 5px;} #routingList tbody tr:nth-child(even).ui-row-ltr td{background-color: inherit;} /*BABELWAY*/ #routingList tr:not(.ui-state-hover)>td.grayIfEmpty:empty { background-color:#e0e0e0; } #routingList tr:not(.ui-state-hover)>td.grayIfEmpty.routingActiveStep { background-color:#cccccc; } tr.hightlighChannel:not(.ui-state-hover) {background:#9FD0EF;} .routingRulesTable input[value=""] {background-color: #e2001a;color: #ffffff;} .ui-widget-content a.relatedItem {color:#bcbbb3; text-decoration:underline; cursor:pointer; } .ui-widget-content.ui-state-hover a.relatedItem {color:#fffFFF !important;} /* Billing */ #admin_buyUnitsStep1 input {width:200px;} #admin_billing .pricePlanDescription {padding-top:8px;} #admin_billing .negativeBalance {color:#ff0000; } /* Users */ #admin_usersInvitationForm textarea.picker { height:180px; } /* Partners */ #channels_partnerDetail_relatedItems .relatedItemsTable { border-collapse:collapse; border:1px solid #DCEDF5; color:#333333;background-color:#f8f8f8; padding: 0px 16px 10px 16px; display:inline-block;} #channels_partnerDetail_relatedItems .relatedItemsTable tr.newCategory td {padding-top:10px;} #channels_partnerDetail_relatedItems .relatedItemsTable td {padding:0px 30px 0px 4px; vertical-align:top; } /* Notifications */ #emailsTable input[type='text'].picker { width:calc(100% - 28px); margin: 2px 5px 2px 0px;} /*Extra processing */ /*Extra processing */ [id^="extraProcessing"] .icon {position:absolute; right:13px; top:22px; height: 50px; width: 50px} [id^="extraProcessing"] .delete {position:absolute; right:1px; top:11px; cursor:pointer; height: 12px; width: 12px} .extraProcessingsTypesTable {width:100%; border-collapse:collapse;} .extraProcessingsTypesTable tr {border-style: solid; border-color:#acaeb3; border-width: 0px 0px 1px 0px; cursor:pointer; height: 70px;} .extraProcessingsTypesTable td {vertical-align:top; padding:5px} .extraProcessingsTypesTable .name {color:#bcbbb3; font-size:12px; font-weight:bold; } .extraProcessingsTypesTable .description {color:#acaeb3; ; font-size:10px; font-weight:bold; } .extraProcessingsTypesTable img {height: 50px; width: 50px} /* show log popup */ .log pre { font-family:monospace; font-size:10px; width:2000px; } /* Table for adding reuseAndSaveTime component */ .reuseStructureTable { border-collapse:collapse; border:none;margin-top: 20px; } .reuseStructureTable>tbody>tr>td { vertical-align:top; } .reuseStructureTable>tbody>tr>td:first-child { width:700px; } .reuseStructureTable>tbody>tr>td:last-child { width:260px; position:relative;} .reuseStructureTable>tbody>tr>td:last-child .reuseArrow { position:absolute; left:-10px; top:25px; } .reuseStructureTable>tbody>tr>td:last-child .reuseSearch { padding:5px 5px 0px 5px; border: 1px solid #bcd7e9; border-bottom:none; } .reuseStructureTable>tbody>tr>td:last-child .reuseSearch .title { color:#bcbbb3; font-weight:bold;} .reuseStructureTable>tbody>tr>td:last-child .reuseSearch input { width:calc(100% - 2px); } .reuseStructureTable>tbody>tr>td:last-child .reuseResult { border: 1px solid #bcd7e9; border-top:none;} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection .title { color:#bbbbbb; font-weight:normal; padding:20px 0px 0px 5px; position:relative;} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection .viewAll { position:absolute; right:5px; text-decoration:underline; cursor:pointer;color: #bcbbb3;} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection table {border-collapse:collapse; width:100%;} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection td { border-bottom:1px solid #a8cbe2; border-top:1px solid #a8cbe2; height:36px; width:100%; overflow:hidden; position:relative; cursor:pointer; } .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection td .name { position:absolute; left:5px; top:2px; width:205px; overflow:hidden; color: #bcbbb3; white-space: nowrap} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection td .description { position:absolute; left:5px; top:18px; width:205px; overflow:hidden;} .reuseStructureTable>tbody>tr>td:last-child .reuseResult .resultSection td .use { position:absolute; right:5px; top:8px; display:inline-block; color: #bcbbb3; border: 1px solid #bcd7e9; padding:1px 3px 1px 3px; cursor:pointer; } .reuseBox { width:260px; position:relative; background-color:#ffffff; z-index:90;} .reuseBox .reuseArrow { position:absolute; left:-10px; top:25px; } .reuseBox .reuseSearch { padding:5px 5px 0px 5px; border: 1px solid #bcd7e9; border-bottom:none; } .reuseBox .reuseSearch .title { color:#bcbbb3; font-weight:bold;} .reuseBox .reuseSearch input { width:calc(100% - 2px); } .reuseBox .reuseResult { border: 1px solid #bcd7e9; border-top:none;} .reuseBox .reuseResult .resultSection .title { color:#bbbbbb; font-weight:normal; padding:20px 0px 0px 5px; position:relative;} .reuseBox .reuseResult .resultSection .viewAll { position:absolute; right:5px; text-decoration:underline; cursor:pointer;color: #bcbbb3;} .reuseBox .reuseResult .resultSection table {border-collapse:collapse; width:100%;} .reuseBox .reuseResult .resultSection td { border-bottom:1px solid #a8cbe2; border-top:1px solid #a8cbe2; height:36px; width:100%; overflow:hidden; position:relative; cursor:pointer; } .reuseBox .reuseResult .resultSection td .name { position:absolute; left:5px; top:2px; width:205px; overflow:hidden; color: #bcbbb3; white-space: nowrap} .reuseBox .reuseResult .resultSection td .description { position:absolute; left:5px; top:18px; width:205px; overflow:hidden;} .reuseBox .reuseResult .resultSection td .use { position:absolute; right:5px; top:8px; display:inline-block; color: #bcbbb3; border: 1px solid #bcd7e9; padding:1px 3px 1px 3px; cursor:pointer; border-radius: 2px; -moz-border-radius: 2px; } .shareOrCopyElementName {color: #bcbbb3; } .shareOrCopyChannel {color: #bcbbb3; cursor:pointer; } .shareOrCopyBox {border:1px solid #bcd7e9; display:inline-block; margin:25px; padding:5px; width:270px; text-align:center; min-height: 140px; position:relative;} .shareOrCopyBox .text {position:absolute; top:10px;} .shareOrCopyBox .action {position:absolute; bottom:15px; width:260px;} /* New message definition tree. */ /* Sizes of main zones are adapted dynamically in Javascript.*/ #mdTree {position:relative; margin:10px 0px; min-height:500px; } .treePdf #mdTree { margin:0; height:100%;} .treePdf { height: calc(100% - 2px); } #mdTreeZoneActions {position:absolute; top:0px; left:0px; height:25px; background-color:#eeeeee; width:400px; border:1px solid #A8CBE2;} #mdTreeSearch {width: 140px; border:1px solid #cccccc; } #mdTreeZoneContainer {width:400px; height:calc(100% - 25px); resizable:true; overflow-y:scroll; position:absolute; top:25px; border:1px solid #A8CBE2;} #mdTreeZone { } #mdTreeZone li.inError>a:after{content: " " url(images/pickers/error.png);} #mdTreeZone li.withValidation>a:after{content:" " url(images/channels/messageDefinition/shield.png);} #mdTreeZone li.withValidation.inError>a:after{content: " " url(images/channels/messageDefinition/shield.png) " " url(images/pickers/error.png);} #mdTreeZone li.hidden a:before {position:absolute; content: " " url(images/channels/messageDefinition/transparent.png) } #mdTreeNodeZone {width:520px; height:100%; position:absolute; left:420px; border:1px solid #A8CBE2; overflow-y: hidden;} #mdTreeNodeZone .editor{height: 100%; position: relative;} #mdTreeNodeZone .scrollableArea{overflow-y: auto; height: 100%; padding:0px 10px; overflow-x: hidden; width:500px; position: relative;} #mdTreeNodeZone .stickyBottomAction{position: absolute; bottom:0px; line-height:25px; background-color: #eeeeee; width:100%; border-top:1px solid #A8CBE2; padding: 5px 0 5px 0;} #mdTreeNodeZone .editorIcon {position:absolute; right:10px; top : 3px; height:24px; width:24px;} #mdTreeNodeZone .editorTitle {color:#bcbbb3; font-size:14px; padding:4px 2px 0px 0px;} #mdTreeNodeZone .formTable>tbody>tr>td:first-child {width:115px; } #mdTreeNodeZone input[type='text'].picker, #mdTreeNodeZone input[type='password'].picker, #mdTreeNodeZone select.picker { width:325px; } #mdTreeNodeZone textarea.picker{ width:325px; height:30px; } #mdTreeNodeZone .withPrefixes input[type='text'].picker {width:265px;} #mdTreeNodeZone .withPrefixes select.picker {width:50px; margin-right:0px;} #mdTreeNodeZone input[type='text']#elementNodeMinLength, #mdTreeNodeZone input[type='text']#elementNodeMaxLength { width:50px; margin:0px;} #mdTreeNodeZone input[type='text']#elementNodeMinNumberValue, #mdTreeNodeZone input[type='text']#elementNodeMaxNumberValue { width:90px; margin:0px;} #mdTreeNodeZone input[type='text']#elementNodeMinDecimalValue, #mdTreeNodeZone input[type='text']#elementNodeMaxDecimalValue { width:90px; margin:0px;} #mdTreeNodeZone input[type='text']#loopNodeMinOccurences, #mdTreeNodeZone input[type='text']#loopNodeMaxOccurences { width:50px; margin:0px;} #mdTreeNodeZone .customValidation input[type='text']{ width:305px; margin-right:2px; } #mdTreeNodeZone .error { background-color:#FFBABA; background-image:none;} .treeSave .actionLink { margin:2px 8px 2px 0px; } #edifactOverlay select {width:100%;} /* Pdf Template list Panel in Message definition channel tab */ #templateListPanel{ display: inline-block; vertical-align: top; position: relative; width: 200px; margin: 10px 10px 0 10px; } #templateSearchBar{ position: absolute; top: 0; left: 0; height: 25px; background-color: #eeeeee; width: 100%; border: 1px solid #A8CBE2; } #templateSearchBar input{ width: 140px; border: 1px solid #cccccc; position: absolute; top: 4px; left: 4px; } #templateSearchBar #addTemplateBar{ position: absolute; right: 6px; top:4px; cursor: pointer; color: #ed7d00; } #templateListContent{ position: absolute; top:26px; width: 100%; border: 1px solid #A8CBE2; overflow: auto; } .templateBox{ width: 200px; border-bottom: 1px solid #f9f9f9; height: 70px; position: relative; display: inline-block; } .templateBox:hover{ background: #f8f8f8; } .templateBox:hover .templateControls{ display: inline-block; } .templateEdit, .templateRemove{ cursor: pointer; color: #ed7d00; } .templateControls{ display: none; position: absolute; top:25px; left: 60px; } .templateBox .templateThumbnail{ position: absolute; width: 50px; height: 60px; top:5px; left: 5px; background-repeat: no-repeat; background-size: contain; background-position: center; background-color: white; border: 1px solid rgba(206, 206, 206, 0.52); } .templateBox .templateName{ position: absolute; width: 50px; top:6px; left: 60px; } /* New mapping tool. */ #mappingTool {position:relative; margin:10px 0px;width:100%;} #mappingToolStructure {width:100%; border:none;} #mappingTool .mappingMdZoneActions {height:17px; background-color:#ffffff; position:relative; padding:1px;} #mappingTool .mappingMdZoneActions .mappingIterator {position:absolute; right:12px;} #mappingTool #mdInActions {border-left:1px solid #A8CBE2; border-right:1px solid #A8CBE2;} #mappingTool #mdOutActions {border-right:1px solid #A8CBE2;} #mappingTool .mappingMdZoneTree { width:50%; position:relative; z-index:0; border:1px solid #A8CBE2; } #mappingTool .mappingMdZoneTree:last-child {border-left:none;} #mappingTool .mappingMdZoneTree>div { width:100%; height:500px;overflow-y:scroll; vertical-align:top;} #mappingTool .searchInput {width: 220px; border:1px solid #cccccc; } #mappingTool li.mapped>a {font-weight:bold; } .mappingDropActive { color: #148A10; background-color: #C8F2BF; border-radius: 2px;} #mappingTool #linesContainer { height:500px; width:1000px; overflow:hidden; position:absolute; top:47px; left:0; pointer-events:none; z-index:50;} #mappingTool #dragSvg { height:100%; width:100%; position:fixed; top:0; left:0; pointer-events:none; z-index:75;} #mappingTool #mappingFunction {position:absolute; z-index:51; pointer-events:auto; cursor:pointer;} #mappingTool #mappingFunctionLight {position:absolute; z-index:52; pointer-events:none; opacity:0.7; width:24px; height:24px;} #formulaZone {background-color:white; } #formulaZone .whenEmpty {color:#A9A9A9; height:19px; padding:4px; border-bottom:1px solid #A8CBE2;} #formulaZone .whenNotEmpty {width:calc(100%-4px); white-space:nowrap; position:relative; border:2px solid #007AB4;} #formulaZone.highlighted .whenNotEmpty {border:2px solid #FF781E;} #formulaZone #formulaTargetNode {background-color:#007AB4; color:#ffffff; white-space:nowrap; display:inline-block; height:24px; line-height:24px; vertical-align:top; padding: 0px 5px 0px 3px; } #formulaZone #formulaTargetNode .operationIndication {font-size:8px; line-height:8px; background-color:#ccc; border-radius:1px; color:#666; text-transform: uppercase; font-weight:bold; padding:0px 1px 0px 1px; margin-left:3px;} #formulaZone #formulaInput {display:inline-block; width:500px; padding-left:2px; white-space:nowrap; overflow-x:hidden; height:24px; line-height:24px; vertical-align:top; } #formulaZone #formulaInput:focus {outline-width: 0; } #formulaZone #forWidth {font-size:12px; font-family:Arial;} #formulaZone .formulaElement {font-size:12px; font-family:Arial; } #formulaZone input::-ms-clear { display: none; } #formulaZone .formulaElement.nodeSummary { padding:2px 2px 0px 2px; background-color:#EEE; border-radius: 2px; border: 1px solid #DDD; margin:0px 0px 0px 0px; } #formulaZone .formulaElement.constant {color:#0000FF; border:none; height:24px;} #formulaZone .formulaElement.text {border:none; height:24px;} #formulaZone .formulaElement.parenthesis.highlightedParenthesis{color:red;font-weight: bold; } #formulaZone .formulaElement.functionName {color:#0080FF; font-style:italic;} #formulaZone .formulaElement.subFormula { padding:2px 2px 0px 2px; background-color:#EEE; border-radius: 2px; border: 1px solid #DDD; margin:0px 0px 0px 0px; color:#B200FF; } #formulaZone .formulaElement.cursor {border:none; width:1px; height:100%;} #formulaZone .formulaElement.cursor:focus {outline-width: 0; } #formulaZone .nodeSummary.element:before {content: url('images/channels/messageDefinition/element.png') " "; } #formulaZone .nodeSummary.option:before {content: url('images/channels/messageDefinition/option.png') " ";} #formulaZone .nodeSummary.elementStatic:before {content: url('images/channels/messageDefinition/elementStatic.png') " "; } #formulaZone .nodeSummary.elementStructure:before {content: url('images/channels/messageDefinition/elementStructure.png') " "; } #formulaZone .nodeSummary.attribute:before {content: url('images/channels/messageDefinition/attribute.png') " "; } #formulaZone .nodeSummary.attributeStatic:before {content: url('images/channels/messageDefinition/attributeStatic.png') " "; } #formulaZone .nodeSummary.loop:before {content: url('images/channels/messageDefinition/loop.png') " "; } #formulaZone .subFormula:before {content: url('images/channels/messageDefinition/subFormula.png') " "; } #mappingTool #formulaZone #formulaInputActions { display:inline-block; padding:5px 3px 0px 3px; cursor:pointer;} #mappingTool #formulaZone #formulaEditorOpener {display:inline-block; position:absolute; right:0; height:24px; line-height:24px; padding:0px 5px 0px 5px; vertical-align:top; background-color:#007AB4; color:white;} #mappingTool #formulaZone #formulaEditorOpener>span { cursor:pointer; padding:0px 5px; white-space:nowrap; } #mappingTool #formulaZone.highlighted #formulaEditorOpener { background-color:#FF781E; } #mappingTool #formulaHelp {padding:5px; position:absolute; right:0px; width:700px; background-color:white; border: 1px solid #dddddd; opacity:0.9; display:none; z-index:60;} #mappingTool #formulaHelp .dataHelp {padding-left:20px; color:#006699;} #mappingTool .functionProposal.selected { border: 1px solid #DDD; background-color:#EEE; border-radius: 2px;} .functionNameSummary {color:#0080FF; cursor:pointer;} #mappingTool #mask {background-color: #BBBBBB; height: 100%; left: 0; top:0; opacity: 0.6; position: fixed; width: 100%; z-index: 200; } #mappingTool #modalDialog {border:1px solid #bcbbb3; position:fixed; left:50%; top:50%; margin: -125px 0px 0px -350px; width:700px; z-index:201; background-color:white; padding:4px;} #mappingTool #modalDialog .closer {position:absolute; right:5px; top:5px; cursor:pointer;} #mappingTool #modalDialog .title {font-weight:bold; color:#bcbbb3; padding-bottom:5px;} #mappingTool #modalDialog .mappingChoice {border: 1px solid #DDD; display:inline-block; background-color:#EEE; border-radius: 2px; margin:4px; cursor:pointer;} #mappingTool #formulaEditor {border:2px solid #007AB4; position:absolute; right:-2px; top:24px; width:580px; z-index:70; background-color:white; color:#333; padding:0px 6px 6px 6px; box-shadow: -10px 10px 25px 0px rgba(168,203,226,1); white-space:normal; line-height:16px;} #formulaEditor .closer {position:absolute; right:-3px; top:-3px; cursor:pointer;} #formulaEditor .steps {color:#999999; padding-top:2px; padding-bottom:10px; display:block;} #formulaEditor .steps span { text-transform:uppercase; font-size:11px;} #formulaEditor .steps span:nth-child(1) {padding-right:8px;} #formulaEditor .steps span:nth-child(2) {padding-left:8px;} #formulaEditor .steps span.active {color:#333333; font-weight:bold; } #formulaEditor .steps span.clickable {cursor:pointer;} #formulaEditor .step1 td {padding:6px; } #formulaEditor .step1 #formulaEditorSearch {padding-left:5px;} #formulaEditor .step1 #formulaEditorChoices { width:calc(100%-30px); margin:15px 0px 15px 0px; max-height:300px; overflow-x:hidden; overflow-y:auto; } #formulaEditor .step1 .functionProposal {cursor:pointer; white-space:nowrap;} #formulaEditor .step1 .functionProposal:hover { border: 1px solid #DDD; background-color:#EEE; border-radius: 2px;} #formulaEditor .step1 .functionProposal .functionName {font-weight:bold; color:#0080FF; } #formulaEditor .step1 .link {cursor:pointer; text-decoration:underline;} #formulaEditor .inError { background-color:#FFBABA; background-image:none;} #formulaEditor .step2>div {padding: 5px 0px; } #formulaEditor .step2 #formulaEditorStep2Pattern .functionName{font-style:italic; color:#0080FF; } #formulaEditor .step2 #formulaEditorStep2Lib { position: absolute; right:10px; top:30px;} #formulaEditor .step2 #formulaEditorStep2Description {color:#b6b6b0; } #formulaEditor .step2 #formulaEditorStep2Returns {border-bottom: 1px solid #a8cbe2; color:#b6b6b0; } #formulaEditor .step2 #formulaEditorStep2Params table {margin:5px 0px; } #formulaEditor .step2 #formulaEditorStep2Params td:nth-child(1) {width:120px; padding:2px 0px 2px 2px; } #formulaEditor .step2 #formulaEditorStep2Params td:nth-child(1)>div {width:118px; overflow-x:hidden; } #formulaEditor .step2 #formulaEditorStep2Params td:nth-child(2) {width:212px; padding:0px;} #formulaEditor .step2 #formulaEditorStep2Params td:nth-child(3) {width:235px; padding:0px 5px 0px 10px; vertical-align:top;} #formulaEditor .step2 #formulaEditorStep2Params td:nth-child(3)>div {padding:0px; width:220px; position:absolute; word-wrap:break-word;} #formulaEditor .step2 #formulaEditorStep2Examples { border-top: 1px solid #a8cbe2; color:#b6b6b0; } #formulaEditor .step2 #formulaEditorStep2AdditionalInfos { border-top: 1px solid #a8cbe2; color:#b6b6b0; } #formulaEditor .step2 #formulaEditorStep2Params .editableParamDiv {border:1px solid #a8cbe2; width:210px; overflow-x:hidden; white-space: nowrap; padding: 1px; height:20px; margin-bottom:4px;} #formulaEditor .step2 #formulaEditorStep2Params .editableParamDiv .placeholder {color:#aaa; } #formulaEditor .step2 #formulaEditorStep2ParamTooltipContent {background-color:#EBF2FC; color:#1483BB; position:relative; width:100%; border:1px solid #A8CBE2; padding:6px; white-space:normal; line-height:14px;} #formulaEditor .step2 #formulaEditorStep2ParamTooltipArrow {position:absolute; margin-left:-10px; z-index:71;} #formulaEditor .stepEditFunction .title {font-size:14px; color:#bcbbb3; padding-bottom:5px;} #formulaEditor .stepEditFunction #EditFunctionDescription, #mappingTool #formulaEditor .stepEditFunction #EditFunctionXpath {width:480px; } #formulaEditor .stepEditFunction td {vertical-align:top; padding:5px 3px 5px 3px; } #formulaEditor .stepEditFunction input[type="text"] {padding:1px;} #formulaEditor .stepEditFunction select {width:120px;} #formulaEditor .stepEditFunction #EditFunctionsParameters td {vertical-align:top; padding:0px 5px 5px 0px; } #formulaEditor .actionButton {display:inline-block; height:24px; line-height:24px; padding:0px 8px 0px 8px; vertical-align:top; background-color:#007AB4; color:white; cursor:pointer; } select { color:#000;} select.empty { color:#aaa; } select option { color:#000; } select option.empty { color:#aaa; } .mappingActions .actionLink { margin-top:0px;} .mappingActions .actionLink.run { margin-right:0px; padding-right:0px;} .mappingActions .actionLink.runNew { margin-right:0px; padding-right:0px;} .mappingActions select {width:auto;} /* Admin/Environment/Partners */ .userFieldsTable {padding-left:16px;} .userFieldsTable td {vertical-align:top;} .userFieldsTable td:nth-child(1) {line-height:22px; } .userFieldsTable td:nth-child(2) .picker.String {width:200px; } .userFieldsTable td:nth-child(3) .picker.CVDType {width:220px; } .userFieldsTable td:nth-child(3) .picker.String {width:250px; } /* Admin/Billing/Invoices */ .billingTable {width:100%; border-collapse:collapse; border:1px solid #DCEDF5; margin-top:20px;} .billingTable tr.main { color:#333333; font-size:12px; height:25px; border-top:1px solid #DCEDF5;} .billingTable tr.detail { color: #6e6e6e; font-size:11px; height:22px;} .billingTable tr.odd { background-color:#f8f8f8; } .billingTable tr.even { background-color:#FFFFFF; } .billingTable td {padding : 0px 12px 0px 12px; } .billingTable tr>td:nth-child(1) { width:10px; padding : 0px 0px 0px 4px; } .billingTable tr>td:nth-child(2) { width:210px; } .billingTable tr>td:nth-child(3) { width:100px; text-align:right; } .billingTable tr>td:nth-child(4) { width:200px; overflow-x:hidden; white-space: nowrap; } .billingTable tr.main>td:nth-child(5) { text-align:right; padding-right:20px; width:calc(100%-656px);} .pricePlanDetailOverlay { display:none; position:fixed; background-color:#eeeeee; border:1px solid #bcbbb3; padding:2px 5px 2px 5px; margin:20px; white-space:normal; max-width:500px; z-index:2000; color:#bcbbb3;} /* Mhs Host */ .mhsHostTable {width:100%; border-collapse:collapse; border:1px solid #DCEDF5; margin-top:20px;} .mhsHostTable tr.main { color:#333333; font-size:12px; height:25px; border-top:1px solid #DCEDF5;} .mhsHostTable tr.detail { color: #6e6e6e; font-size:11px; height:22px;} .mhsHostTable tr.odd { background-color:#f8f8f8; } .mhsHostTable tr.even { background-color:#FFFFFF; } .mhsHostTable tr:hover {cursor: pointer;} .mhsHostTable td {padding : 0px 12px 0px 12px; } .mhsHostTable tr>td:nth-child(1) { width:250px; } .mhsHostTable tr>td:nth-child(2) { width:250px; text-align:right; } /* Admin/Billing/Invoices */ .invoicesTable {width:100%; border-collapse:collapse; margin-top:20px; border:1px solid #E4E4E4;} .invoicesTable thead {background-color:#f8f8f8; color:#8D8D8D; font-weight:normal; text-align:left;} .invoicesTable tr {font-size:12px; height:25px;} .invoicesTable tr:nth-child(even) { border:1px solid #DCEDF5; color:#333333; background-color:#f8f8f8; } .invoicesTable td {padding : 0px 8px 0px 8px; } .invoicesTable th {padding : 0px 8px 0px 8px; border:1px solid #E4E4E4;} /* User rights */ #bwAdmin_hubDetail_rights .checkBoxContainer, #admin_users .checkBoxContainer {display:block;} /* Fedict */ #monitoring_fedict_newInvoice fieldset { border:1px solid #DCEDF5; width:auto; min-height:60px; background-color:#f8f8f8; margin: 4px; padding:4px; } #monitoring_fedict_newInvoice fieldset legend { margin-left:20px; } #monitoring_fedict_newInvoice fieldset legend div {border:1px solid #a8cbe2; padding: 1px 4px 1px 4px; background-color:#ffffff;} #monitoring_fedict_newInvoice .partnerInfoZone {font-size:12px; } #monitoring_fedict_newInvoice .partnerInfoZone .picker { padding:1px 0px 1px 2px; margin:1px; font-size:12px; width:270px; } #monitoring_fedict_newInvoice .partnerInfoZone .picker.PostalCode { width:70px; } #monitoring_fedict_newInvoice .partnerInfoZone .picker.City { width:190px; } #monitoring_fedict_newInvoice #invoiceHeaders, #monitoring_fedict_newInvoice #invoiceLines, #monitoring_fedict_newInvoice #invoiceReferences, #monitoring_fedict_newInvoice #partnersZone {width:1000px; } #monitoring_fedict_newInvoice #invoiceHeaders table {width:100%; } #monitoring_fedict_newInvoice #invoiceHeaders .picker { width:300px; margin:1px;} .FedictInvoiceLineHeader span,.FedictInvoiceLine span {display:inline-block; width:90px; } .FedictInvoiceLineHeader span:nth-child(1), .FedictInvoiceLine span:nth-child(1) {width:102px;} .FedictInvoiceLineHeader span:nth-child(2), .FedictInvoiceLine span:nth-child(2) {width:292px;} .FedictInvoiceLineHeader span:nth-child(6), .FedictInvoiceLine span:nth-child(6) {width:90px; } .FedictInvoiceLineHeader span:nth-child(7), .FedictInvoiceLine span:nth-child(7) {width:90px; text-align:right;} .FedictInvoiceLineHeader span:nth-child(8), .FedictInvoiceLine span:nth-child(8) {width:90px; text-align:right;} .FedictInvoiceLine input[type="text"].picker, .FedictInvoiceLine select.picker {width:52px; margin:1px;} .FedictInvoiceLine span:nth-child(1) input[type="text"].picker, .FedictInvoiceLine span:nth-child(1) select.picker {width:77px; } .FedictInvoiceLine span:nth-child(2) input[type="text"].picker, .FedictInvoiceLine span:nth-child(2) select.picker {width:267px; } .FedictInvoiceLineHeader span .requiredStar {width:8px;} /* FAQ */ .faqQuestion { margin: 10px 0px 0px 0px; padding: 4px 20px 0px 16px; color:#7d7b6f !important;text-decoration:underline; cursor:pointer; font-weight: bold; } .faqAnswerContainer { margin: 0px 0px 10px 0px; padding: 4px 20px 0px 16px; height: 0px; overflow: hidden;} .faqAnswerContainer img{ display: block; margin: 0 auto;} .faqAnswerContainer p{ padding-top: 10px; padding-bottom: 10px} .faqAnswerContainer .important{color: #ed7d00;} /* Support */ div.support {padding:10px;} div.support ol.l1 {list-style-type: lower-latin;} div.support ol.l2 {list-style-type: lower-roman; padding-left:20px; padding-bottom:5px;} /*custom */ .selectboxit-btn { border: 1px solid #ececec !important;} .ui-jqgrid tbody tr:nth-child(even).ui-row-ltr.ui-state-hover td{background-color: #ed7d00 !important ;} .ui-jqgrid .ui-row-ltr.ui-state-hover td{background-color: #ed7d00 !important ;} .fadedGrid {opacity:.5} /* Util */ .cursorClickable{ cursor:pointer; } #admin_environment_documentTypes textarea {height:30px;} /* Walkthrough */ .firstChannelWalkthrough{color: #ffc559; cursor:pointer; opacity: 1 !important;} .firstChannelWalkthrough:hover{color: #ffb638; cursor:pointer; opacity: 1 !important;} .topbar-progress-container{ width:50px; height:10px; position:relative; display:inline-block; background-color: white; border-radius:4px !important; } .topbar-progressbar{ position: absolute; bottom:0; left:0; height:10px; background-color: #F9B233; border-radius:4px !important; } .highlight-window{ position:fixed; top:-20px; left:-20px; width:110%; height:110%; z-index: 2000000; border: 10000px solid rgba(0,0,0,.6); margin-left: -10000px; margin-top: -10000px; pointer-events: none; transition: all .6s ease .3s,border-radius .3s ease; -webkit-transition: all .6s ease .3s,border-radius .3s ease; -moz-transition: all .6s ease .3s,border-radius .3s ease; -ms-transition: all .6s ease .3s,border-radius .3s ease; -o-transition: all .6s ease .3s,border-radius .3s ease; display:none; } .highlight-window-content{ width:100%; height:100%; position:absolute !important; top:0; left:0; } div.lookupTableValueSelector{ padding: 8px; background-color: #ececec; margin: 3px; } div.lookupTableValueSelector div.title{ font-weight: bold; } /*********************************** PDF TEMPLATE DEFINITION EDITOR ************************************/ #pdfTable{ width: 100%; height: 100%; vertical-align: top; text-align: center; position: relative; overflow: hidden; } /* layout */ #pdfTable #pdfPagesViewerColumn {height:100%; padding:0; display: block; position: absolute; top:0; left:0; width: 65%; overflow: hidden;} #pdfTable #pdfExtractorEditorColumn {height:100%; padding:0; display: block; position: absolute; top:0; left:65%; width:0; overflow:hidden; -webkit-transition: width 0.5s, left 0.5s;; -moz-transition: width 0.5s, left 0.5s;; -o-transition: width 0.5s, left 0.5s;; transition: width 0.5s, left 0.5s;} #pdfTable #pdfExtractedFieldsColumn {height:calc(100% - 4px); padding:0; display: block; position: absolute; top:0; left:65%; width: 35%; -webkit-transition: width 0.5s, left 0.5s;; -moz-transition: width 0.5s, left 0.5s;; -o-transition: width 0.5s, left 0.5s;; transition: width 0.5s, left 0.5s;} #pdfTable #pdfErrorEditorColumn {height:100%; padding:0; display: block; position: absolute; top:0; left:65%; width: 35%; -webkit-transition: width 0.5s, left 0.5s;; -moz-transition: width 0.5s, left 0.5s;; -o-transition: width 0.5s, left 0.5s;; transition: width 0.5s, left 0.5s;} #pdfTable #settingsBox {height:100%; padding:0; display: block; position: absolute; top:0; left:65%; width: 35%;} #pdfTable.editoropened #pdfPagesViewerColumn {padding:0; display: block; position: absolute; top:0; left:0; width: 65%;} #pdfTable.editoropened #pdfExtractorEditorColumn {padding:0; display: block; position: absolute; top:0; z-index:2; left:calc(65% - 2px); width:35%; overflow: auto; border: 2px solid #057AC0; background-color: white;} #pdfTable.editoropened #pdfExtractedFieldsColumn {padding:0; display: block; position: absolute; top:0; left:100%; width: 25%;} .red-tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; } .red-tooltip .tooltiptext { visibility: hidden; width: 200px; background-color: #F81222; color: #fff; text-align: center; border-radius: 1px; padding: 5px 0; position: absolute; z-index: 1; top: 150%; left: 50%; margin-left: -100px; } .red-tooltip .tooltiptext::after { content: ""; position: absolute; bottom: 100%; /* At the top of the tooltip */ left: 50%; margin-left: -7px; border-width: 7px; border-style: solid; border-color: transparent transparent #F81222 transparent; } .red-tooltip:hover .tooltiptext { visibility: visible; } #pdfTableRowFooter{ height:40px; position:absolute; left:0; width:100%; background-color: #f8f8f8; border-top: 1px solid #e4e4e4; bottom:0; z-index:10; } #pdfTableRowFooter .saveButton{ height: 30px; background-color: forestgreen; color: white; margin-top: 2px; cursor: pointer; float: right; padding: 4px; line-height: 30px; } .gifhelp{ border: 3px solid rgba(106, 106, 106, 0.4); opacity: .8; width: 95%; } /* ******************* */ /* 1 . PDF Page Viewer */ #pdfPagesViewerColumn{ height: calc(100% - 80px); z-index:1; vertical-align: top; } #addSamplePage { position: absolute; border: 4px dashed #C0C0C0; width: calc(100% - 8px); height: calc(100% - 69px); text-align: center; z-index: 100; top: 61px; left:0; background-color: white; display: table; color: #C0C0C0; font-size: 24px; visibility: hidden; } #addSamplePage > div.verticallycentered{ display: table-cell; vertical-align: middle; height: 30%; } #addSamplePage .closeDialog { position: absolute; top: 8px; right: 8px; cursor: pointer; } #addSamplePage .closeDialog:hover { opacity: .5; } #addSamplePage div:not(.closeDialog) i{ font-size: 65px; } #pdfPagesViewerTop{ height: 39px; width: 100%; font-weight: bold; color: white; position: relative; border-bottom: 1px solid #e4e4e4; text-align: left; } #pdfPagesViewerTop #templatePicker, #pdfPagesViewerTop #pdfSampleTabs, #pdfPagesViewerTop #actions { display: inline-block; height: 100%; vertical-align: top; } #pdfPagesViewerTop #templatePicker{ width: 210px; } #pdfPagesViewerTop #templatePicker select { width: calc(100% - 10px); text-transform: uppercase; height: calc(100% - 1px); font-weight: bold; color: #343434; letter-spacing: 1px; font-size: 12px; box-sizing: content-box; padding-left: 10px; border:0; border-right: 1px solid #e4e4e4; } #pdfPagesViewerTop #templatePicker div { width: calc(100% - 10px); text-transform: uppercase; height: calc(100% - 1px); font-weight: bold; color: #343434; letter-spacing: 1px; font-size: 12px; box-sizing: content-box; padding-left: 10px; border:0; border-right: 1px solid #e4e4e4; text-align: center; padding-top: 11px; } #pdfPagesViewerTop #actions { padding: 0 10px 0 10px; border-right: 1px solid #e4e4e4; } #pdfPagesViewerTop .action{ line-height: 40px; color: #C0C0C0; display: inline-block; vertical-align: top; height: 100%; } #pdfPagesViewerTop #rightactions{ float: right; } #pdfPagesViewerTop #backto{ margin-top: 4px; cursor: pointer; vertical-align: top; } #pdfPagesViewerTop #settings{ font-size: 16px; cursor: pointer; color: #ed7d00; padding: 0 10px 0 10px; position: relative; } #pdfPagesViewerTop #settings .fa-warning{ color:red; font-size: 12px; padding-right: 5px; } #settingsBox{ background-color: rgba(0, 0, 0, 0.4); z-index: 11; } #settingsBox > div{ width: 85%; min-height: 100px; background-color: #FAFAFA; border: 1px solid #ECECEC; text-align: left; padding: 29px 27px; position: relative; margin:10px; max-height: 80%; overflow: auto; } #settingsBox .closeDialog { font-size:13px; position: absolute; top: 8px; right: 8px; cursor: pointer; } #settingsBox .closeDialog:hover { opacity: .5; } #settingsBox .matchingError { margin-top: 15px; padding-left: 20px; color: #F81222; position: relative; padding-right: 25px; } #settingsBox .matchingError::before { content: '\f00d'; color: #F81222; font-family: 'FontAwesome'; position: absolute; left: 0px; } #settingsBox .settingTitle{ font-size: 12px; text-transform: uppercase; padding-bottom: 20px; border-bottom: 1px solid #E4E4E4; margin-bottom: 12px; } #settingsBox p{ font-size: 13px; margin-bottom: 15px; margin-top: 7px; } #settingsBox #selectMatchingConditions, #settingsBox #selectSplitterConditions{ margin-top: 0; } #settingsBox .inputSplitter{ margin-top: 10px; } #settingsBox .insideStepContent { padding-bottom: 15px; border-bottom: 1px solid #E4E4E4; } #pdfPagesViewerTop #save{ margin-left: 10px; border: 1px solid #ed7d00; margin-top: 4px; vertical-align: top; } #pdfPagesViewerTop .actionseparator{ margin-right: 5px; margin-left:5px; height: 100%; width:1px; border-left: 1px solid #dfdfdf; display: inline-block; vertical-align: top; } #pdfPagesViewerSamples { height: 20px; line-height: 22px; width:100%; color: #C0C0C0; position: relative; border-bottom: 1px solid #e4e4e4; text-align: left; } #pdfPagesViewerSamples span{ line-height: 20px; vertical-align: top; padding-left: 10px; text-transform: uppercase; font-size: 8px; } #pdfPagesViewerSamples #pdfSampleTabs{ text-align: left; padding-left: 10px; display: inline-block; vertical-align: top; } #pdfPagesViewerSamples .pdfSampleTab{ line-height: 20px; padding: 0 5px 0 5px; cursor: pointer; vertical-align: top; overflow: hidden; max-width: 80px; text-align: center; display: inline-block; height: 20px; position: relative; } #pdfPagesViewerSamples .pdfSampleTab .sampleFileName{ overflow: hidden; } #pdfPagesViewerSamples .pdfSampleTab.withRightPadding{ padding: 0 20px 0 5px; } #pdfPagesViewerSamples .pdfSampleTab .deleteSample{ width: 15px; position: absolute; top: 0; right: 0; height: 20px; line-height: 20px; display: inline-block; } #pdfPagesViewerSamples .pdfSampleTab .deleteSample i{ padding-top: 4px; } .filenamehover{ position: fixed; z-index: 400; background-color: white; padding: 5px 10px; border: 1px solid #C0C0C0; } #pdfPagesViewerSamples .pdfSampleTab.selected, pdfPagesViewerTop .pdfSampleTab:not(.selected):hover{ background-color: white; color: #ed7d00; border-bottom: 4px solid #ed7d00; } .dropForm{ display:none; } #selectionableZoneTitle{ position: fixed; padding: 10px; background-color: #deb544; border-radius: 15px; color: #464429; font-size: 12px; pointer-events: none; z-index: 40; } #selectionableHorizontalPosition{ position: absolute; width: 100%; height: 2px; background-color: red; pointer-events: none; } .horizontalPosition{ position: absolute; width: 100%; height: 2px; background-color: #057AC0; pointer-events: none; } .loopRow{ position: absolute; width: 100%; left:0; pointer-events: none; background-color: #e3c47b; opacity: .15; border: 1px solid #9c8754; } .loopDelim{ position: absolute; pointer-events: none; background-color: #e3503f; opacity: .3; border: 1px solid #8d3227; } .loopRowWindow{ pointer-events: none; border: 1000px solid rgba(0, 0, 0, 0.7); position: absolute; width: 100%; left:-1000px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; } #pdfPagesViewer{ display: block; position: relative; height: calc(100% - 61px); width:100%; overflow-y: auto; -webkit-user-drag: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; overflow-x: hidden; } #pdfPagesViewer.creational{ cursor: crosshair; } #pdfPagesViewer.currentextractor{ cursor: auto; } .pdfPage{ display:inline-block; width: 100%; text-align: center; position: relative; -webkit-user-drag: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; overflow: hidden; border-bottom: 5px solid #979797; } .pdfPage img{ width: 100%; z-index: 3; pointer-events: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; -webkit-user-drag: none; } .extractedField { position:absolute; z-index:4; background-color: #0a6aa1; opacity: 0.1; cursor: pointer; pointer-events: auto; } .extractedField:hover { opacity: 0.3; } #currentExtractorArea{ position:absolute; z-index:4; border: 1px solid #ed7d00; pointer-events: auto; } #manualExtractionZone{ background-color: #66a15d; opacity: 0.5; position:absolute; z-index:4; } .updateExtractorArea{ position: absolute; width: 6px; height: 6px; pointer-events: auto; background-color: white; border: 1px solid #02618a; } .updateExtractorArea.topRight{ top: -4px; right: -4px; cursor: nesw-resize; } .updateExtractorArea.topLeft{ top: -4px; left: -4px; cursor: nwse-resize; } .updateExtractorArea.bottomRight{ bottom: -4px; right: -4px; cursor: nwse-resize; } .updateExtractorArea.bottomLeft{ bottom: -4px; left: -4px; cursor: nesw-resize;} #currentExtractorArea.extractionError, #currentExtractorArea.extractionError .updateExtractorArea, .extractorView.extractionError {border: 1px solid #F81222; } #currentExtractorArea.extractionWarning, #currentExtractorArea.extractionWarning .updateExtractorArea, .extractorView.extractionWarning {border: 1px solid #F5A623; } #currentExtractorArea.extractionGood, #currentExtractorArea.extractionGood .updateExtractorArea, .extractorView.extractionGood {border: 1px solid #5CA346; } #currentKeyExtractorArea { position:absolute; z-index:4; border: 1px solid #a19e33; } .extractorView:not(#currentExtractorArea) { position: absolute; z-index: 5; pointer-events: auto; cursor: pointer; border: 1px solid #ed7d00; background-color: rgba(0,0,0,.1); } .keyExtractorView:not(#currentKeyExtractorArea) { position:absolute; z-index:5; background-color: #a19e33; opacity: 0.5; pointer-events: auto; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } .keyExtractorView.hasKeyError{ position:absolute; z-index:5; background-color: red; opacity: 0.5; pointer-events: auto; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } .keyExtractorView.hasKeyError::before { font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; content: '\f071 Multiple keys found'; font-size: 11px; position: absolute; top:-20px; left: 0px; color: red; text-align: left; } .splitterConditionExtractorView, .matchingConditionExtractorView { position:absolute; pointer-events: auto; color: #36a190; border: 1px solid #36a190; cursor: pointer; } .splitterConditionExtractorView:before { font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; content: '\f0c4'; font-size: 16px; position: absolute; top:-20px; left: 20px; text-align: left; } .matchingConditionExtractorView:before { font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; content: '\f13d'; font-size: 16px; position: absolute; top:-20px; left: 0px; text-align: left; } .itemdelimiterZone{ position:absolute; z-index:5; background-color: #057AC0; opacity: 0.2; pointer-events: none; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } .skipZone { position:absolute; z-index:5; background-color: #a1004e; opacity: 0.2; pointer-events: none; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; } /* ************************** */ /* 1bis. PDF extraction rules */ #extractorEditorTop { width: 100%; position: relative; color: #343434; text-align: center; font-size: 12px; font-weight: bold; letter-spacing: 1px; padding-top: 16px; height: 24px; background-color: #ECECEC; } #extractorEditorTop .cancel { position: absolute; left: 7px; top: 7px; margin: 0; } #extractorEditorTop .cancel:hover{ opacity: .9; } #extractorEditorTop .cancel .fa{ font-size: 17px; margin-right: 5px; margin-left: 5px; } #extractorEditorTop .live{ color: #F81222; font-size: 12px; font-weight: bold; letter-spacing: 1px; line-height: 15px; padding: 7px 15px; position: absolute; top:5px; right:5px; text-transform: uppercase; } #extractorEditorTop .fieldNameTitle { background-color: #ed7d00; color: white; border-radius: 3px; padding: 3px 5px 3px 5px; } #currentExtractorLiveInput{ width: 70%; border: 1px solid rgba(173,24,19,0.3); } #currentExtractorLiveInput.hasError{ background-color: #e38784; } #extractorEditorStepListContainer{ overflow-y : auto; overflow-x: hidden; min-width: 28vw; width: 100%; } #extractorEditorStepListContainer .extractionRulesTitle{ text-transform: uppercase; font-weight: bold; font-size: 11px; color: #a9a9a9; margin: 10px 10px 4px 10px; text-align: left; } #extractorEditorStepList{ border-left: 4px solid #eeeeee; margin-left: 40px; position: relative; padding: 0 15px 15px 0; } .extractorEditorStep{ width: 100%; position: relative; left: -30px; /* margin of the list above ^^ */ } .editorStepVisible{ height: 30px; position: relative; padding-top: 10px; } .extractorEditorStep.current .editorStepVisible{ padding-bottom: 10px; } #positiontext{ font-weight: bold; } .stepnote { font-size: 13px; color: #343434; padding: 19px 0 19px 0; line-height: 20px; position: relative; width: 99%; } .stepnote p{ margin-left: 50px; text-align: left; } .stepnote::before{ font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; position: absolute; top:19px; left: 20px; text-decoration: none; font-size: 15px; } .stepnote.extractionGood::before { content: '\f00c'; color: #72C267; } .stepnote.extractionError::before { content: '\f00d'; color: #F81222; } .stepnote.extractionWarning::before { content: '\f071'; color: #F5A623; } .stepNumber{ position: absolute; top:10px; left: 13px; height: 30px; width: 30px; font-size: 15px; } .stepNumber svg{ height: 30px; width: 30px; } .stepTitleContent{ width: calc(100% - 36px); display: inline-block; height: 30px; vertical-align: middle; overflow:hidden; text-align: left; line-height:30px; } .stepTitleContent > .label { font-size: 12px; margin-left: 35px; text-transform: uppercase; letter-spacing: 1px; } .stepTitleContent > input { font-size: 14px; color: #3f3f3f; height: 20px; border: 1px solid #e0e0e0; margin-left: 20px; } .checkboxStep{ position: absolute; margin-right: 3px; right:0; top:0; height: 100%; font-size: 20px; color: #5c5c5c; } .checkboxStep i{ line-height: 35px; } .extractorEditorStep.current .editorStepCollapsable{ border-top: 1px solid rgb(5, 122, 192); padding: 15px 0 0 35px; } .editorStepCollapsable { height: 0; -webkit-transition: height 0.5s; -moz-transition: height 0.5s; -o-transition: height 0.5s; transition: height 0.5s; overflow: hidden; padding-left: 35px; } .editorStepCollapsable p{ text-transform: uppercase; font-weight: bold; font-size: 11px; color: #a9a9a9; margin: 10px 10px 4px 10px; text-align: left; } .stepError { overflow: hidden; height: 0; display: none; border: 2px solid #F81222; width: calc(100% - 45px); z-index: 300; position: relative; left: -2px; top: 2px; padding: 20px 10px 20px 35px; color: #F81222; text-align: left; } .stepError > div { color: #343434; padding-top: 20px; } .extractorEditorStep.current .editorStepCollapsable, .extractorEditorStep.current .stepError { height: auto; overflow: auto; padding-bottom: 15px; position: relative; display: block; } .editorStepCollapsable .done{ position: absolute; background-color: #3a753e; color: white; padding: 5px 10px 5px 10px; right:0; bottom:0; cursor: pointer; } .editorHelperText{ margin:10px; font-size: 13px; color: #393939; } .btn-group button { background-color: #eeeeee; border: 1px solid #033249; color: #033249; padding: 5px 10px; cursor: pointer; float: left; height: 60px; border-bottom: 2px solid #033249; } /* Add a background color on hover */ .btn-group button:hover { background-color: #033249; color: white; } .btn-group button:not(:last-child) { border-right: none; /* Prevent double borders */ } .btn-group button:first-child { -webkit-border-top-left-radius: 5px; -moz-border-radius-topleft:5px; border-top-left-radius:5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft:5px; border-bottom-left-radius:5px; } .btn-group button:last-child { -webkit-border-top-right-radius: 5px; -moz-border-radius-topright:5px; border-top-right-radius:5px; -webkit-border-bottom-right-radius: 5px; -moz-border-radius-bottomright:5px; border-bottom-right-radius:5px; } /* Clear floats (clearfix hack) */ .btn-group:after { content: ""; clear: both; display: table; } #focus{ border: 10000px solid rgba(125,125,125,0.7); webkit-border-radius:10010px; -moz-border-radius:10010px; border-radius:10010px; z-index: 119; position: absolute; } #popover { position: absolute; background-color: white; border: 2px solid #057AC0; z-index: 120; max-width: 65%; } #popover .arrowtopleft{ width: 15px; height: 15px; background-color: white; border-top: 2px solid #057AC0; border-right: 2px solid #057AC0; -ms-transform: rotate(-45deg); /* IE 9 */ -webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */ transform: rotate(-45deg); position: absolute; top: -10px; left: 30px; } #popover .arrowbottomleft{ width: 15px; height: 15px; background-color: white; border-right: 2px solid #057AC0; border-bottom: 2px solid #057AC0; -ms-transform: rotate(45deg); /* IE 9 */ -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */ transform: rotate(45deg); position: absolute; bottom: -10px; left: 30px; } .popovertitle { height: 30px; line-height: 30px; font-size: 12px; text-transform: uppercase; color: #343434; text-align: left; padding-left: 20px; padding-top: 10px; letter-spacing: 1px; } .popovertitle .closeDialog { position: absolute; top: 8px; right: 8px; cursor: pointer; } .popovertitle .closeDialog:hover { opacity: .5; } .popover_content{ padding: 15px; text-align: left; max-height: 260px; overflow-y: auto; } .popover_content table td{ vertical-align: top; } .popover_content table td div.choice{ background-color : white; cursor : pointer; padding: 15px; text-align:left; } .popover_content table td div.choice:hover, .popover_content table td div.choice.selected{ background-color : #0382B9; } .popover_content table td div.choice .choicetitle { font-size: 13px; font-weight: bold; line-height: 16px; color: #0382B9; text-align: left; padding-bottom: 10px; height: 25px; } .popover_content .multipleKeyFoundStrategy td { width: 30%; } .popover_content table td div.choice:hover{ background-color : #0382B9; } .popover_content table td div.choice:hover .choicetitle, .popover_content table td div.choice:hover .choicedescription, .popover_content table td div.choice.selected .choicetitle, .popover_content table td div.choice.selected .choicedescription{ color: white; } #how_to_find_this_value td { width: 33%; } #relativeTo, #surroundings{ position: relative; margin-left: 20px; margin-top: 5px; text-align: left; } .valueExtractionRule, .positionExtractionRule{ padding: 5px 10px 5px 25px; } .valueExtractionRule i{cursor: pointer;} .valueExtractionRule .operator select{ text-transform: uppercase; width: 100%; height: 32px; line-height: 30px; border: 1px solid #C0C0C0; background-color: #ECECEC; color: #057AC0; padding-left: 10px; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; appearance: none; } .valueExtractionRule .operator select:focus{outline: none;} .valueExtractionRule .operator { position: relative; display: inline-block; vertical-align: top; width: 45%; height:32px;} .valueExtractionRule .operator::before{ position: absolute; right: 15px; top: 0; line-height: 32px; font-family: FontAwesome; content: '\f0d7'; } .valueExtractionRule input.operand { display: inline-block; vertical-align: top; width: 45%; height: 30px; line-height: 30px; border: 1px solid #C0C0C0; background-color: #ECECEC; color: #5CA346; padding-left: 10px; } .valueExtractionRule input.operand:focus{outline: none;} .valueExtractionRule div.deleteExtractionRule{ display: inline-block; vertical-align: top; width: 30px; height: 30px; line-height: 30px; font-size: 16px; } .insideStepTitle{ font-size: 13px; color: #343434; margin: 10px 10px 4px 10px; text-align: left; position: relative; } .insideStepTitle::before{ font-family: FontAwesome; font-size: 11px; position: absolute; top:0; left: -20px; } .insideStepTitle.move::before{content: '\f047';} .insideStepTitle.link::before{content: '\f0c1';} .insideStepTitle.magnify::before{content: '\f002';} .insideStepTitle.list::before{content: '\f00b';} .insideStepTitle.align::before{content: '\f036';} .insideStepTitle.pickerlineitem::before{content: '\f05b';} .insideStepContent{ padding-left: 30px; } .insideStepParam{ text-align: left; margin: 10px 10px 4px 20px; } .insideStepParam select, .insideStepParam input{ margin-left: -5px; } .addRule{ text-transform: uppercase; text-decoration: underline; font-size: 8px; color: #07467b; margin: 10px 10px 4px 30px; text-align: left; position: relative; cursor: pointer; } .addRule::before{ font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; content: '\f196'; font-size: 11px; position: absolute; top:0px; left: -20px; text-decoration: none; } .editRule{ text-transform: uppercase; text-decoration: underline; font-size: 8px; color: #07467b; margin-left: 20px; display: inline-block; position: relative; cursor: pointer; } .editRule::before{ font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; content: '\f040'; font-size: 11px; position: relative; left:-4px; } /* Effects step */ .extractorEditorStep {} .extractorEditorStep .stepNumber:before {position:absolute; text-align:center; width:100%; line-height:30px; color: #c1c2cc; font-family: 'FontAwesome'; content: '\f059'} .extractorEditorStep .stepNumber svg circle.circleborder {stroke: #c1c2cc;} .extractorEditorStep .stepNumber svg circle.circlefill {fill: #e3e5f0; } .extractorEditorStep .label {color: #b4b5be;} .extractorEditorStep .editorStepVisible:hover{ cursor:pointer; } .extractorEditorStep .editorStepVisible:hover .stepNumber svg circle.circleborder {} .extractorEditorStep .editorStepVisible:hover .stepNumber svg circle.circlefill {} .extractorEditorStep.extractionError {} .extractorEditorStep.extractionError .stepNumber:before {font-size: 11px; position:absolute; text-align:center; width:100%; line-height:30px; color: rgba(248, 18, 34, 0.32); font-family: 'FontAwesome'; content: '\f071'} .extractorEditorStep.extractionError .stepNumber svg circle.circleborder {stroke: #c1c2cc;} .extractorEditorStep.extractionError .stepNumber svg circle.circlefill {fill: #e3e5f0;} .extractorEditorStep.extractionError .label {color: #b4b5be;} .extractorEditorStep.extractionError .editorStepVisible:hover{ cursor:pointer; } .extractorEditorStep.extractionError .editorStepVisible:hover .stepNumber svg circle.circleborder {} .extractorEditorStep.extractionError .editorStepVisible:hover .stepNumber svg circle.circlefill { } .extractorEditorStep.extractionError .editorStepVisible:hover .label {} .extractorEditorStep.finished {} .extractorEditorStep.finished .stepNumber:before {position:absolute; text-align:center; width:100%; line-height:30px; color: #768f75; font-family: 'FontAwesome'; content: '\f00c'} .extractorEditorStep.finished .stepNumber svg circle.circleborder {stroke: #768f75;} .extractorEditorStep.finished .stepNumber svg circle.circlefill {fill: #95b493;} .extractorEditorStep.finished .label {color: #768f75;} .extractorEditorStep.finished .editorStepVisible:hover{ cursor:pointer; } .extractorEditorStep.finished .editorStepVisible:hover .stepNumber svg circle.circleborder {stroke: #6a816a;} .extractorEditorStep.finished .editorStepVisible:hover .stepNumber svg circle.circlefill {fill: #86a284; } .extractorEditorStep.finished .editorStepVisible:hover .label {color: #6a816a;} .extractorEditorStep.current { border: 2px solid #057AC0; background-color: white; color: #0382B9; margin-top:10px; } .extractorEditorStep.current.needAction { animation: border-current-pulsate 1.5s infinite; } .extractorEditorStep.current .stepNumber:before {position:absolute; text-align:center; width:100%; color: #0382B9; line-height:30px; font-family: 'FontAwesome'; content: '\f040'} .extractorEditorStep.current.extractionError .stepNumber:before {position:absolute; text-align:center; width:100%; color: #F81222; line-height:30px; font-family: 'FontAwesome'; content: '\f071'} .extractorEditorStep.current .stepNumber svg circle.circleborder {stroke: white; stroke-dasharray: 26, 2; animation: dash 100s linear infinite;} .extractorEditorStep.current .stepNumber svg circle.circlefill {fill: white; } .extractorEditorStep.current .label {color: #343434;} .extractorEditorStep.current .editorStepVisible:hover{} .extractorEditorStep.current .editorStepVisible:hover .stepNumber svg circle.circleborder {} .extractorEditorStep.current .editorStepVisible:hover .stepNumber svg circle.circlefill {} .extractorEditorStep.current .editorStepVisible:hover .label {} @keyframes border-current-pulsate { 0% { border-color: rgba(5, 122, 192, 1); } 50% { border-color: rgba(5, 122, 192, 0.2); } 100% { border-color: rgba(5, 122, 192, 1); } } @keyframes dash { from{ stroke-dashoffset: 1000; } to { stroke-dashoffset: 0; } } /* *********************** */ /* 2. PDF ExtractedFields */ #pdfExtractedFieldsColumn{ vertical-align: top; z-index:10; } #pdfExtractedFieldsTop{ height: 39px; line-height: 39px; text-transform: uppercase; width: calc(100% - 20px); background-color: #f8f8f8; font-weight: bold; text-align: left; padding-left: 20px; border-bottom: 1px solid #E4E4E4; border-left: 1px solid #E4E4E4; } .loadingFieldsPanel { width: 100%; margin: 10px auto 0 auto; } .loadingFieldsPanel .loadingTitle{ width: 100%; text-align: center; text-transform: uppercase; color: rgb(226, 222, 217); } .loadingFieldsPanel > .field div{ background-color: rgb(226, 222, 217); -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; animation: blink-animation 2s infinite; -webkit-animation: blink-animation 2s infinite; } .emptyGuide{ display: none; } .loadingFieldsPanel .field{ margin-top: 5px; height: 30px; } .loadingFieldsPanel .fieldName, .loadingFieldsPanel .fieldValue{ width: 40%; height: 30px; display: inline-block; position: relative; } .loadingFieldsPanel .fieldValue::before{ content: ''; width: 15px; height: 15px; position: absolute; right: 8px; top: 7px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; background-color: rgb(214, 210, 206); } .blink { animation: blink-animation 2s infinite; -webkit-animation: blink-animation 2s infinite; } @keyframes blink-animation { 50% { opacity: .4; } 100% {opacity: 1; } } @-webkit-keyframes blink-animation { 50% { opacity: .4; } 100% {opacity: 1; } } #pdfExtractedFields{ height: calc(100% - 60px); width:100%; position:relative; top: 0; left:0; overflow-x: hidden; padding-top: 20px; overflow-y: auto; background-color: #FAFAFA; border-left: 1px solid #E4E4E4; } table.extractedFieldTable{ width: calc(100% - 20px); margin-left: 20px; table-layout: fixed; border-spacing: 0; border-collapse: collapse; } table.extractedFieldTable tbody tr{ width:100%; height: 30px; } /* greyed extractor */ table.extractedFieldTable tbody tr.greyedExtractor > td > div { height: 100%; color: #C0C0C0; line-height: 30px; opacity: .4; } table.extractedFieldTable tbody tr.greyedExtractor > td.fieldValue input { cursor: pointer; } table.extractedFieldTable tbody tr.greyedExtractor:hover > td > div, table.extractedFieldTable tbody tr.greyedExtractor.nextExtractor > td.fieldName > div { opacity: 1; } table.extractedFieldTable tbody tr.greyedExtractor.nextExtractor > td.fieldName > div input { color: white; background-color: #ed7d00; } table.extractedFieldTable tbody tr.greyedExtractor.nextExtractor > td.fieldValue > div input { color: #ed7d00; animation: newExtractorBlink 1.5s infinite; background-color: white; } @keyframes newExtractorBlink { 0% {opacity: .3;} 50% {opacity: 1} 100% {opacity: .3} } table.extractedFieldTable tbody tr.greyedExtractor.nextExtractor > td > div { border: 1px solid #ed7d00; z-index: 3; } table.extractedFieldTable tbody tr.greyedExtractor td.fieldName.table > div::before { position: absolute; content: '\f0ce'; font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; right:0; height: 100%; width: 30px; line-height: 30px; } /* On error */ table.extractedFieldTable tbody tr.extractionError td.fieldName > div::before { position: absolute; content: '\f071'; font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; right:0; height: 100%; width: 30px; color: #F81222; line-height: 30px; } .extractedTableName.extractionError > div.tableName::before{ position: absolute; content: '\f071'; font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; right:30px; height: 100%; width: 30px; color: #F81222; line-height: 30px; } .extractedTableName.extractionWarning > div.tableName::before{ position: absolute; content: '\f071'; font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; right:30px; height: 100%; width: 30px; color: #F5A623; line-height: 30px; } table.extractedFieldTable tbody tr.extractionWarning td.fieldName > div::before{ position: absolute; content: '\f071'; font-family: 'FontAwesome', 'Abel',Arial,Helvetica,sans-serif; right:0; height: 100%; width: 30px; color: #F5A623; line-height: 30px; } table.extractedFieldTable tbody tr.extractionError:hover td.fieldName > div::before, table.extractedFieldTable tbody tr.extractionError.selected td.fieldName > div::before{ color: white; } table.extractedFieldTable tr td.fieldNameSelected input { background-color: #F81222; color: white; } table.extractedFieldTable tr td.fieldNameSelectedCorrect input { background-color: #5CA346; color: white; } table.extractedFieldTable tr td.fieldNameUndefSelected input { background-color: #ed7d00; color: white; } /* On hover */ table.extractedFieldTable tbody tr:hover td > div, table.extractedFieldTable tbody tr.selected td > div{ border: 1px solid #ed7d00; z-index: 3; } table.extractedFieldTable tr:hover td.fieldName input, table.extractedFieldTable tr.selected td.fieldName input{ background-color: #ed7d00; color: white; } table.extractedFieldTable tr:hover td.fieldNameSelected input, table.extractedFieldTable tr.selected td.fieldNameSelected input{ background-color: #F81222; color: white; } table.extractedFieldTable tr:hover td.fieldNameSelectedCorrect input, table.extractedFieldTable tr.selected td.fieldNameSelectedCorrect input{ background-color: #5CA346; color: white; } table.extractedFieldTable tr:hover td.fieldNameUndefSelected input, table.extractedFieldTable tr.selected td.fieldNameUndefSelected input{ background-color: #ed7d00; color: white; } table.extractedFieldTable tr:hover td.fieldName input::selection, table.extractedFieldTable tr.selected td.fieldName input::selection{ background: white; color: #ed7d00; } table.extractedFieldTable tr:hover td.fieldValue input, table.extractedFieldTable tr.selected td.fieldValue input{ color: #ed7d00; } table.extractedFieldTable tbody td{ position: relative; } table.extractedFieldTable tbody td > div{ margin: -1px 0 0 -1px; position: relative; width: 100%; border: 1px solid #C0C0C0; z-index: 2; } .editextractorbutton{ color: #ed7d00; position: absolute; right:0; top:0; padding-top: 9px; padding-right: 15px; font-size: 14px; } .createExtractorFromMdButton{ color: #ed7d00; position: absolute; right:0; top:0; padding-top: 9px; padding-right: 15px; font-size: 14px; } .editextractorbutton i, .editextractorbutton span{ cursor:pointer; } table.extractedFieldTable tbody td.edit{ border: 1px solid transparent; } table.extractedFieldTable tbody td.transformer, span.transformer{ border: 1px solid transparent; text-transform: uppercase; font-weight: bolder;; } table.extractedFieldTable tbody td.transformer.noTransformers{ color: #C0C0C0; } table.extractedFieldTable tbody td.transformer.errorTransformers{ color: #F81222; } table.extractedFieldTable input{ padding: 3px 57px 3px 7px; width: calc(100% - 64px); height: 25px; line-height: 25px; outline-width: 0; border: 0px; } table.extractedFieldTable th{ text-align:left; color: #343434; padding-bottom: 5px; padding-left: 10px; text-transform: uppercase; font-size: 12px; font-weight: bold; letter-spacing: 1px; } .extractedTableName{ margin-bottom: 5px; } .extractedTableName *{ display: inline-block; vertical-align: middle; margin-left: 5px; } .extractedTableName input.table{ padding: 3px 57px 3px 7px; height: 25px; line-height: 25px; outline-width: 0; width: 200px; border: 1px solid #C0C0C0; } .extractedTableName.greyedExtractor input.table{ opacity: .4; cursor: pointer; } table.extractedFieldTable th.fieldName, table.extractedFieldTable td.fieldName, table.extractedFieldTable td.fieldNameSelected, table.extractedFieldTable td.fieldNameSelectedCorrect, table.extractedFieldTable td.fieldNameUndefSelected{ width: 35%; } table.extractedFieldTable th.fieldValue, table.extractedFieldTable td.fieldValue{ width: 45%; } table.extractedFieldTable th.edit, table.extractedFieldTable td.edit{ width: 40px; } table.extractedFieldTable th.transformer, table.extractedFieldTable td.transformer{ width: 20px; padding-left: 15px;} table.extractedFieldTable td.edit, .extractedTableName .edit, table.extractedFieldTable td.transformer{ font-size: 15px; color: #ed7d00;} table.extractedFieldTable td.edit i, table.extractedFieldTable td.transformer{cursor: pointer;} table.extractedFieldTable td.edit i:hover, table.extractedFieldTable td.transformer:hover{opacity: .5;} table.extractedFieldTable div.edit {display: inline-block;} table.extractedFieldTable td{ position: relative; } .extractedTable{ padding-top : 20px; } .extractedTableName{ font-size: 16px; } /* Specific rules for the currentExtractor live preview table : EXTRACTION GOOD */ #currentExtractorLivePreview{ background-color: #ECECEC; width: 100%; padding: 15px 0 0 0; border-bottom: 1px solid #C0C0C0; position: relative; } #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionGood td.fieldName > div{ color: #5CA346; } #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionGood td > div { border: 1px solid #5CA346; color: #5CA346; z-index: 3; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionGood input{ color: #5CA346; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionGood:hover td.fieldName input, table.extractedFieldTable tr.selected.extractionGood td.fieldName input{ background-color: #5CA346; color: white !important; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionGood:hover td.fieldName input::selection, table.extractedFieldTable tr.selected.extractionGood td.fieldName input::selection{ background: white; color: #5CA346; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionGood:hover td.fieldValue input, table.extractedFieldTable tr.extractionGood.selected td.fieldValue input{ color: #5CA346; } /* Specific rules for the currentExtractor live preview table : EXTRACTION WARNING */ #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionWarning td.fieldName > div{ color: #F5A623; } #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionWarning td > div { border: 1px solid #F5A623; color: #F5A623; z-index: 3; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionWarning input{ color: #F5A623; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionWarning:hover td.fieldName input, #currentExtractorLivePreview table.extractedFieldTable tr.selected.extractionWarning td.fieldName input{ background-color: #F5A623; color: white; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionWarning:hover td.fieldName input::selection, #currentExtractorLivePreview table.extractedFieldTable tr.selected.extractionWarning td.fieldName input::selection{ background: white; color: #F5A623; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionWarning:hover td.fieldValue input, #currentExtractorLivePreview table.extractedFieldTable tr.extractionWarning.selected td.fieldValue input{ color: #F5A623; } /* Specific rules for the currentExtractor live preview table : EXTRACTION ERROR */ #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionError td.fieldName > div { color: #F81222; } #currentExtractorLivePreview table.extractedFieldTable tbody tr.extractionError td > div{ border: 1px solid #F81222; color: #F81222; z-index: 3; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionError input{ color: #F81222; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionError:hover td.fieldName input, #currentExtractorLivePreview table.extractedFieldTable tr.selected.extractionError td.fieldName input{ background-color: #F81222; color: white; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionError:hover td.fieldName input::selection, #currentExtractorLivePreview table.extractedFieldTable tr.selected.extractionError td.fieldName input::selection{ background: white; color: #F81222; } #currentExtractorLivePreview table.extractedFieldTable tr.extractionError:hover td.fieldValue input, #currentExtractorLivePreview table.extractedFieldTable tr.extractionError.selected td.fieldValue input{ color: #F81222; } /* **************************************** */ /* SVG lines from PDF to ExtractorEditor */ #lineContainerPdfToExtractorEditor { position: absolute; top : 0; left: 0; width: 100%; height: calc(100% - 75px); overflow: hidden; z-index: 50; pointer-events:none; } #lineSVGPdfToExtractorEditor{ position: fixed; top : 57px; left: 0; width: 100%; height: 100%; z-index: 50; pointer-events:none; } #lineSVGPdfToExtractorEditor path.liveLine{ stroke:#ed7d00; stroke-miterlimit:"10"; fill: #ed7d00; stroke-width:2; pointer-events:none; } #lineSVGPdfToExtractorEditor path.liveError{ stroke: #b43730; stroke-miterlimit:"10"; fill: #b43730; stroke-width:2; pointer-events:none; } #lineSVGPdfToExtractorEditor path.liveGood{ stroke: #5CA346; stroke-miterlimit:"10"; fill: #5CA346; stroke-width:2; pointer-events:none; } #lineSVGPdfToExtractorEditor path.liveWarning{ stroke: #F5A623; stroke-miterlimit:"10"; fill: #F5A623; stroke-width:2; pointer-events:none; } #lineSVGPdfToExtractorEditor path.liveAskForKey{ stroke: #F5A623; stroke-miterlimit:"10"; fill: #F5A623; stroke-width:2; pointer-events:none; marker-end: url(#circleAskForKey); } #circleAskForKey{ fill: #F5A623; } .refreshOverlay{ position: absolute; top:0; left:0; width:100%; height:100%; pointer-events: none; z-index: 100; background-color: white; color: rgb(160, 157, 153); display: none; opacity: .9; transition: all .3s ease-in; } .refreshOverlay .refreshText{ position: absolute; top:40%; text-align: center; width:100%; font-size: 15px; font-weight: bold; display: block; } .refreshOverlay .refreshText::before{ content: '\f1c1'; font-family: 'FontAwesome'; font-size: 45px; } .refreshOverlay.blink { animation: refreshBlink 2s infinite; } @keyframes refreshBlink { 0% {opacity: .7;} 50% {opacity: .95} 100% {opacity: .7} } #textTransformerEditor{ position:fixed; text-align: left; z-index: 300; height: calc(50% + 15px); padding:0; display: block; top: calc(100% + 16px); right: 20px; width: calc(35% - 40px); background-color: white; border: 2px solid #057AC0; -webkit-transition: height 0.5s, bottom 0.5s, top 0.5s; -moz-transition: height 0.5s, bottom 0.5s, top 0.5s; -o-transition: width 0.5s, top 0.5s, bottom 0.5s;; transition: height 0.5s, bottom 0.5s, top 0.5s; } #textTransformerEditor div#textTransformerEditorContent{ height: calc(100% - 80px); width: 100%; overflow: auto; padding-top: 15px; padding-bottom: 15px; } #textTransformerEditor .toparrow{ position: absolute; height: 16px; width: 16px; top: -11px; left: 50%; display: block; background-color: white; border-top: 2px solid #057AC0; border-left: 2px solid #057AC0; transform:rotate(45deg); -ms-transform:rotate(45deg); /* IE 9 */ -webkit-transform:rotate(45deg); /* Opera, Chrome, and Safari */ } #textTransformerEditor #formulaEditor {padding:0 6px 6px 16px; margin-left: 10px; border-left: 3px solid #E4E4E4;} #formulaEditorTitle { font-size: 12px; padding-left: 35px; text-transform: uppercase; letter-spacing: 1px; color: #343434; height: 45px; line-height: 45px; border-bottom: 1px solid #057AC0; } #formulaEditorTitle::before{ content: '\f0d0'; color: #057AC0; font-family: 'FontAwesome'; position: absolute; left: 0px; height: 45px; line-height: 45px; margin-left: 10px; } #textTransformerEditor .closeDialog { font-size:13px; position: absolute; top: 8px; right: 8px; cursor: pointer; } #textTransformerEditor .closeDialog:hover { opacity: .5; } #textTransformerEditor .formulaElement {font-size:12px; font-family:Arial; } #textTransformerEditor .formulaElement.cursor {border:none; width:100%; height:100%;} #textTransformerEditor .formulaElement.cursor:focus {outline-width: 0; } #formulaEditorPreview{ } .overlayDuringTransformer{ width: 100%; height: 100%; opacity: 0; background-color: black; position: absolute; display:none; top:-10px; left:0; z-index:299; -webkit-transition: opacity 0.5s; -moz-transition: opacity 0.5s; -o-transition: opacity 0.5s; transition: opacity 0.5s; pointer-events: auto; } .textTransformer{ background-color : #ECECEC; height: 40px; width: calc(100% - 40px); padding: 0 10px 0 10px; margin: 0 10px 5px 10px; } .textTransformer div { display: inline-block; text-align: left; vertical-align: top; line-height: 40px;} .textTransformer > div.textTransformerDesc { color: #057AC0; width: 70%; overflow: hidden;} .textTransformer > div.floatright { float:right; width: 30%; text-align: right;} .textTransformer > div.floatright div.fieldBeforeTransformation { color: #343434; width: 30%; overflow: hidden; text-align: right;} .textTransformer > div.floatright div.fieldAfterTransformation { color: #343434; width: 30%; overflow: hidden; text-align: left;} .textTransformer > div.floatright div.arrowTransformation { color: #343434; font-size: 20px; font-weight: bold; width: 20px; text-align: center; position: relative; top: 9px;} .textTransformer > div.floatright div.editRemove { color: #057AC0; float: right; margin-right: 15px; } .textTransformer > div.floatright div.editRemove i{ cursor:pointer; } #textTransformerEditor .paramError{ border: 1px solid #b43730 !important; } #listTextTransformers .actionButton {margin: 10px 0 0 15px; display:inline-block; height:24px; line-height:24px; padding:0px 8px 0px 8px; vertical-align:top; background-color:#007AB4; color:white; cursor:pointer; } /* UsersList */ #list .picker.HubAccessLevel {width: 100%; height: 100%;} .openRightOverlayImg {width: 14px; height: 14px; color: #b6b6b0} .infoIcon{min-width: 14px; min-height: 14px; margin-right: 10px;} /* RightOverlay in user management */ #rightOverlay{width:650px; -webkit-box-shadow: -5px -5px 11px -4px rgba(0,0,0,0.33); -moz-box-shadow: -5px -5px 11px -4px rgba(0,0,0,0.33); box-shadow: -5px -5px 11px -4px rgba(0,0,0,0.33);right:-1000px; z-index: 8000; position: fixed; top:30px; background-color: #f8f8f8; height:calc(100% - 30px); border-left: 6px solid #7d7b6f; -webkit-transition: width .5s; -moz-transition:width .5s; -ms-transition: width .5s; -o-transition: width .5s; transition: width .5s; } #rightOverlay.showOverlay{right:0px; -webkit-transition: opacity .5s, right 1s; -moz-transition: opacity .5s,right 1s; -ms-transition: opacity .5s,right 1s; -o-transition: opacity .5s,right 1s; transition: opacity .5s,right 1s; } #rightOverlay.hideOverlay{right:-1500px; -webkit-transition: opacity .5s,right 1s; -moz-transition: opacity .5s,right 1s; -ms-transition: opacity .5s,right 1s; -o-transition: opacity .5s,right 1s; transition: opacity .5s,right 1s} #rightOverlay .staticTabs{margin-top: 10px;} #rightOverlay {overflow-y:auto;} #rightOverlay #closeRightOverlay{font-size:19px; font-weight: normal; padding-top: 10px; padding-left: 10px; color: #7d7b6f; float: right; padding-right: 20px;} #tabDetailsBody {margin-left: 20px; padding-right: 20px;} #rightOverlay h2 {padding-top: 18px; padding-left: 6px; padding-bottom: 0.65%; margin-top: 0px; color: #7d7b6f; display: inline-block; border-bottom: 0px;} #rightOverlay .formTable>tbody>tr>td:first-child {padding: 5px 0px 5px 16px; width: 170px;} #rightOverlay textarea.picker {width: 500px;} #rightOverlay select {width: auto;} #rightOverlay input[type='text'].picker {width: 500px;} #rightOverlay .Partner {width: 200px;} #rightOverlay .PartnerDataAccessLevel {width: 120px;} #rightOverlay .fa {cursor: pointer; color: #b6b6b0} #rightOverlay #titleRightOverlay {background-color: #ECECEC; color: #7d7b6f; border-bottom: 1px solid #cdd3d5; font-weight: bold;} /* User management */ #crossEnvRightsTable {width:100%; border-collapse:collapse; margin-top:20px; border-bottom: 1px solid #ddd;} #crossEnvRightsTable tr.main { color:#333333; font-size:12px; height:25px; border-bottom: 1px solid #ddd;} #crossEnvRightsTable tr.detail { color: #6e6e6e; font-size:11px; height:22px;} #crossEnvRightsTable tr.odd { background-color:#f8f8f8} #crossEnvRightsTable tr.even { background-color:#FFFFFF} #crossEnvRightsTable td.tdRightOverlay { text-align: center;} #crossEnvRightsTable td.tdPartnerData { padding-bottom: 10px; padding-top: 10px; } #crossEnvRightsTable .partnerName { padding-right: 20px; } #crossEnvRightsTable .openPartnerListIcon { position: absolute; padding-left: 5px;}