/* This file contains all URL related styles that should not be compressed for delivery */ /* ------------------------------------------------------------------------------------ */ /* URL RELATED STYLES FOR CSS FILES UNDER FOLDER */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* ------------------ buttons_skins.css start */ button, .button{ background: #fff url("../styles/signature/signomStandard/common/images/buttons/bg_button.png") bottom repeat-x; } /* ------------------ buttons_skins.css end */ /* ------------------ datatable.css start */ .paginate_disabled_previous { background-image: url("../styles/signature/signomStandard/common/images/datatables/back_disabled.jpg"); } .paginate_enabled_previous { background-image: url("../styles/signature/signomStandard/common/images/datatables/back_enabled.jpg"); } .paginate_disabled_next { background-image: url("../styles/signature/signomStandard/common/images/datatables/forward_disabled.jpg"); } .paginate_enabled_next { background-image: url("../styles/signature/signomStandard/common/images/datatables/forward_enabled.jpg"); } .sorting_asc { background-color: #fff; } .sorting_desc { background-color: #fff; } .sorting { background: url("../styles/signature/signomStandard/common/images/datatables/sort_both.png") no-repeat center right; } .sorting_asc_disabled { background: url("../styles/signature/signomStandard/common/images/datatables/sort_asc_disabled.png") no-repeat center right; } .sorting_desc_disabled { background: url("../styles/signature/signomStandard/common/images/datatables/sort_desc_disabled.png") no-repeat center right; } /* ------------------ identification_skins.css end */ /* ------------------ infomessage_skins.css start */ div.infomessage, #infomessage { background: #f0f0f0 url("../styles/signature/signomStandard/common/images/fugue/24/information.png") 15px 10px no-repeat; } div.infomessageLoading { background: #f0c5c5 url("../styles/signature/signomStandard/common/images/ajax-loader-transparent.gif") 15px 14px no-repeat; } div.infomessageError, #infomessage.error { background: #f0c5c5 url("../styles/signature/signomStandard/common/images/fugue/24/cross.png") 15px 12px no-repeat; } div.infomessageSuccess, #infomessage.success { background: #D5E8B1 url("../styles/signature/signomStandard/common/images/fugue/24/tick.png") 15px 10px no-repeat; } div.infomessagePlain, #infomessage.plain { background: url("../styles/signature/signomStandard/common/images/fugue/24/information.png") 15px 0px no-repeat; } div.infomessageWarning, #infomessage.warning { background: #FFFDDD url("../styles/signature/signomStandard/common/images/fugue/24/exclamation.png") 15px 10px no-repeat; } /* ------------------ infomessage_skins.css end */ /* ------------------ main_skins.css start */ #headercontainer { background: #308FB1 url("../styles/signature/signomStandard/common/images/menu/header_bg.png") repeat-x top; } #headercontainer .outer_container { background: none; } @media only screen and (max-width: 900px) { #headercontainer .outer_container { background-image: none; } } #submenu-container { background: #fff url("../styles/signature/signomStandard/common/images/menu/submenu_bg.png") repeat-x bottom; } #footercontainer { /* Fallback (IE 10 and lower) (could use .jpg/.png alternatively) */ background-color: #EFF0F1; /* The Background */ background-image: -webkit-gradient( #EFF0F1, #FFF ); /* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */ background-image: -webkit-linear-gradient( #EFF0F1, #FFF); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */ background-image: -moz-linear-gradient( #EFF0F1, #FFF); /* Firefox 3.6 - 15 */ background-image: -o-linear-gradient( #EFF0F1, #FFF); /* Opera 11.1 - 12 */ background-image: linear-gradient(#EFF0F1, #FFF); /* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */ } #homepagebox { /*background: #fff url("../styles/signature/signomStandard/login/images/signom_login_bg.png") top right repeat-x;*/ background: linear-gradient(#daebf5,#daebf5 20%, RGBA(255, 255, 255, 0) ); } /* ------------------ main_skins.css end */ /* ------------------ menu_skins.css start */ .mainmenu li a { background: url("../styles/signature/signomStandard/common/images/menu/menu-right.png") no-repeat top right; } .mainmenu li a span { background: url("../styles/signature/signomStandard/common/images/menu/menu-left.png") no-repeat 0px 0px; } /* Hover */ .mainmenu a:hover span { background: url("../styles/signature/signomStandard/common/images/menu/menu-left.png") no-repeat 0px -81px; } .mainmenu a:hover { background: url("../styles/signature/signomStandard/common/images/menu/menu-right.png") no-repeat 100% -81px; } /* Selected, white bg */ .mainmenu li.selected a span, .mainmenu li.selected a:hover span { background: url("../styles/signature/signomStandard/common/images/menu/menu-left.png") no-repeat 0px -162px; } .mainmenu .selected a, .mainmenu .selected a:hover { background: url("../styles/signature/signomStandard/common/images/menu/menu-right.png") no-repeat 100% -162px; } /* ------------------ menu_skins.css end */ /* ------------------ table_skins.css start */ a.arrow { background: transparent url("../styles/signature/signomStandard/common/images/tables/arrows.png") no-repeat scroll 0px -16px; } /* ------------------ table_skins.css end */ /* URL RELATED STYLES FOR CSS FILES UNDER FOLDER */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* ------------------ main_skins.css start */ #SignomLogin{ /*background: #fff url("../styles/signature/signomStandard/login/images/signom_login_bg.png") top left repeat-x; */ /*background: linear-gradient(#ddd , RGBA(0, 0, 0, 0) 8%, RGBA(0, 0, 0, 0) 80%, #71a6c3);*/ } #loginHeader{ /*background: #0871A5 url("../styles/signature/signomStandard/login/images/signom_login.png") top left no-repeat; background-color: #08628b; background-image: linear-gradient(#3d94bc, #08628b); */ /* Fallback (IE 10 and lower) (could use .jpg/.png alternatively) */ background-color: #08628b ; /* The Background */ background-image: -webkit-gradient( #3d94bc, #08628b); /* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */ background-image: -webkit-linear-gradient( #3d94bc, #08628b); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */ background-image: -moz-linear-gradient( #3d94bc, #08628b); /* Firefox 3.6 - 15 */ background-image: -o-linear-gradient( #3d94bc, #08628b); /* Opera 11.1 - 12 */ background-image: linear-gradient(#3d94bc, #08628bb); /* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */ } form#loginForm{ /*background: #fff url("../styles/signature/signomStandard/login/images/signom_login_bg.png") top left repeat-x;*/ background: linear-gradient(#c5d5de , #daebf5 9%, RGBA(255, 255, 255, 0) 70%, RGBA(255, 255, 255, 0) ); } /* ------------------ main_skins.css end */ /* URL RELATED STYLES FOR TOOLTIPS */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ .tooltipTop { background: url("../styles/signature/signomStandard/common/images/tooltip_arrow_top.png"); } .tooltipCenter { background:url("../styles/signature/signomStandard/common/images/tooltip_arrow_center.png") top left repeat-y; } .tooltipBottom { background:url("../styles/signature/signomStandard/common/images/tooltip_arrow_bottom.png"); } a.openCloseIndicator, .hiddentabmenu li { background-image: url('../styles/signature/signomStandard/common/images/arrows.png'); } /* URL RELATED STYLES FOR FILEUPLOADER */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #fileuploader-button { background: #fff url('../styles/signature/signomStandard/common/images/buttons/bg_button.png') bottom repeat-x; color: #444; text-decoration: none; text-shadow: none; cursor: pointer; padding: 10px 25px 10px 25px; border: 1px solid #ccc; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } #headercontainer { background: #FFF; } #headercontainer .outer_container { background: none; } #wrap { background: #FFF; } #footercontainer { background: #FFF; } .mainmenu { background: #FFF; } .mainmenu li a { background-image: none; } .mainmenu li.last { background-image: none; } .mainmenu li a span { background-image: none; } .mainmenu a:hover span { background-image: none; } .mainmenu a:hover { background-image: none; } .mainmenu li.selected a span, .mainmenu li.selected a:hover span { background-image: none; } .mainmenu li.selected a, .mainmenu li a:hover, .mainmenu li.selected a:hover { background-image: none; background-color: none; } #SignomLogin, form#loginForm{ background: #fff url("../styles/signature/mandatumlife/images/signom_login_bg.png") top left repeat-x; } #loginHeader{ /*background: #777 url("../styles/signature/mandatumlife/images/signom_login_gray.png") top left no-repeat;*/ /* Fallback (IE 10 and lower) (could use .jpg/.png alternatively) */ background-color: #acacac ; background-image: url("../styles/signature/mandatumlife/images/signom_login_header_bg.jpg") top left repeat-x; /* The Background */ background-image: -webkit-gradient( #acacac, #8b8b8b); /* Safari 4, Chrome 1-9, iOS 3.2-4.3, Android 2.1-3.0 */ background-image: -webkit-linear-gradient( #acacac, #8b8b8b); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */ background-image: -moz-linear-gradient( #acacac, #8b8b8b); /* Firefox 3.6 - 15 */ background-image: -o-linear-gradient( #acacac, #8b8b8b); /* Opera 11.1 - 12 */ background-image: linear-gradient( #acacac, #8b8b8b); /* Opera 15+, Chrome 25+, IE 10+, Firefox 16+, Safari 6.1+, iOS 7+, Android 4.4+ */ } a.welcomeLink, a.welcomeLink:hover { background: #fff url("../styles/signature/mandatumlife/images/bg_button.png") bottom repeat-x; } html, body{ height: 100%; } #wrap { min-height: 100%; /* Footer sticks to the bottom of page, see http://www.cssstickyfooter.com/*/ } #main-top-element, #main-bottom-element, #wrap-top-element, #wrap-bottom-element, #contentBoxInnerContainer, #container_InnerElement1, #container_InnerElement2 { display: none; } #main{ /* overflow: auto;*/ /* Not needed? Produces a second horizontal scrollbar on narrow window */ padding-bottom: 83px; /* must be same height as the footer */ } body { margin: 0px; padding: 0px; } .no-display { display: none; } #footercontainer { border-width: 0px; border-top-width: 1px; /** override */ } #notificationcontainer, #headercontainer { float: left; width: 100%; } #notificationcontainer { border-width: 0px; border-bottom-width: 1px; /** override */ } #submenu-container { float: left; width: 100%; } .submenu { width: 860px; margin: 0 auto; padding: 0 20px; } .container { margin: 0px auto; text-align: left; width: 900px; position: relative; clear: left; } .outer_container { margin: 0px auto; text-align: left; width: 860px; position: relative; } #notificationcontainer .outer_container { padding: 10px 0px; } #headercontainer .outer_container { width: 900px; /* more space for logo and menu so that it's on the same level as contentn in a narrow window */ } div.browser_notify { border-width: 1px; width: 500px; position: absolute; left: 200px; top: 5px; } div.browser_notify p { margin: 0px; padding: 2px 8px; } .vatInfo { position: absolute; top: -10px; left: 0px; } #signom_header_logo { position: relative; padding: 20px 0 20px 20px; } #signom_header_logo a.headerLogo { display: block; width: 200px; height: 56px; } .mainmenu { margin-left: 20px; } div.mainmenu div.mainmenu-header, div.mainmenu div.mainmenu-footer, div.mainmenu div.mainmenu-header-left, div.mainmenu div.mainmenu-header-right { display: none; } /** For IE 6, even though not supported */ * html #contentBox {height:400px;} #contentBox { width: 900px; margin: 0px auto 20px auto; padding: 0 0 10px 0; min-height: 300px; position: relative; } #contentBox #infomessage, #contentBox div.upperInfoMessage, /*#contentBox h2#page-title,*/ #contentBox .innerBox { margin: 20px; } h1#page-title, h2#page-title, h2.page-title, h2.page-title-normal, div.innerBox div.page-title { clear: left; margin: 20px 20px 0px 20px; padding: 20px 0px 5px 0px; border-width: 0px; border-bottom-width: 1px; /** override */ } /* override */ h2.page-title, div.innerBox div.page-title { padding-left: 0px; margin-left: 0px; margin-right: 0px; margin-bottom: 20px; } /* override */ h2.page-title { padding-top: 0px; } h2.sub-heading { padding: 5px 0px; margin-top: 0px; border-width: 0px; border-bottom-width: 1px; /** override */ } h3.sub-heading { padding: 5px 0px; margin: 0px; border-width: 0px; } h3.fileupload-heading { color: #5B5B7B; font-size: 18px; font-weight: bold; margin: 0px; border-width: 0px; } /** In case infomessage is shown e.g. above table, which is inside innerbox div */ #contentBox .innerBox #infomessage { margin: 20px 0px; } /** innerBox groups information inside content box */ #contentBox .innerBox { position: relative; } /** col-2-layout is used with innerBox class
*/ div.col-2-layout div.content-col1, div.col-2-layout div.content-col2 { width: 415px; } div.col-2-layout div.content-col1-3 { width: 265px; margin-right: 15px; } div.col-3-layout div.content-col1-3 { width: 265px; margin-right: 15px; } /* override last element */ div.col-3-layout div.content-col1-3-last { width: 298px; margin-right: 0px; } div.col-4-layout div.content-col1-4, div.col-2-layout div.content-col1-4 { width: 190px; margin-right: 15px; } div.content-col1-5 { width: 156px; max-width: 156px; margin-right: 15px; } div.content-col1-5-last { width: 172px; margin-right: 0px; } div.content-col1-6 { width: 133px; margin-right: 10px; } div.content-col1-6-last { width: 143px; margin-right: 0px; } /* override last element */ div.innerBox div.col-4-layout div.content-col1-4-last, div.innerBox div.col-2-layout div.content-col1-4-last { width: 204px; margin-right: 0px; } div.col-2-layout div.content-col2-3 { width: 565px; } div.col-2-layout div.content-col1, div.col-2-layout div.content-col1-3, div.col-3-layout div.content-col1-3, div.col-2-layout div.content-col1-3-last, div.col-3-layout div.content-col1-3-last, div.col-4-layout div.content-col1-4, div.col-2-layout div.content-col1-4, div.col-4-layout div.content-col1-4-last, div.col-2-layout div.content-col1-4-last, div.content-col1-5, div.content-col1-5-last, div.content-col1-6, div.content-col1-6-last { float: left; } div.col-2-layout div.content-col2, div.col-2-layout div.content-col2-3 { float: right; } div.reverse-float div.col-2-layout div.content-col2-3 { float: left; } div.content-row { margin: 15px 0; } div.signom-full-content-width { width: 860px; } div.content-row-thin { margin: 5px 0; } #dialogBox { margin: 20px; width: 400px; } #dialogBoxWide { margin: 20px; width: 600px; } #confirmationBox, .confirmationBox { margin: 20px; width: 440px; } #footercontainer { position: relative; height: 83px; margin-top: -84px; /* negative value of footer height (including borders)*/ clear: both; border-width: 0px; border-top-width: 1px; /** override */ } #footercontainer .outer_container{ width: 900px; } #footer { padding: 20px 61px 0px 15px; border-width: 0px; position: relative; height: 40px; } #footer .infolinks { text-align: left; } #footer .copyright { text-align: left; } #footer a, #footer span { padding: 0px 5px; } #footer div.images { position: absolute; top: 4px; right: 20px; } #footer div.images { position: absolute; top: 4px; right: 20px; } h3{ margin: 20px 20px 0 20px; border-width: 0px; border-bottom-width: 1px; padding: 6px 0; } table.contractInfo h3, .display h3 { float: left; border: 0; margin: 0 10px 0 0px; padding: 0; } table.basicTable { border-spacing: 0; border: 0; } table.basicTable td { padding: 0; } p.textcontent, div.textcontent { padding-left: 25px; } div.simple-div-row { margin-bottom: 15px; } body#html-body div.no-print-info { display:none; } div#seleniumContent { display:block; } div.instructionIcon { float:left; margin-right:10px; } div.instructionText { float:left; width:350px; } #SignomLogin{ /*border: 1px solid #ccc; */ min-height: 230px; } #homepagebox{ min-height: 230px; } #loginForm{ padding: 10px 20px 20px 20px; margin: 0; /*IE7*/ } #loginHeader{ height: 40px; } #forgot_password_link{ float: right; text-decoration: none; } div.ajax-loader { text-align:center; margin-top:64px; } div.marginTopZero { margin-top:0px !important; } div.dialogBoxFixedHeight { height: 350px; } form#externalReferenceForm { background-color: #fff; border-style: solid; border-color: #DCDCDC; border-width: 1px; height: 300px; } form#externalReferenceAndSimpleLoginForm { background-color: #fff; border-style: solid; border-color: #DCDCDC; border-width: 1px; height: 400px; } form#externalReferenceForm input, form#externalReferenceForm div, form#externalReferenceAndSimpleLoginForm input, form#externalReferenceAndSimpleLoginForm div { width: 80%; margin: auto; padding: 6px 6px; } label[for=referenceId] { width: 100%; text-align: center; margin-left auto; position: absolute: left: } h3.referenceIdTitle { text-align: center; border-style: none; } h4.referenceIdTitle, .referenceIdTitle { text-align: center; border-style: none; padding: none; margin: none; } #accessibility-links { background-color: #ffffff; font-weight: bold; text-align: center; padding: 4px; position: absolute; left: -10000px; } #accessibility-links:focus-within { position: static; width: auto; } .separator { display: inline-block; } #wrap { } #footercontainer, #footercontainer .outer_container, #headercontainer .outer_container { width: 860px; margin: 0 auto; } .submenu { padding: 0px 20px 0px 0px; } #signom_header_logo a.headerLogo { height: 31px; width: 200px; } #signom_header_logo a.headerLogo img { height: 100%; } #footercontainer { margin-top: -84px; } #footer .infolinks { position: absolute; top: 5px; left: 0px; } #footer .copyright { position: absolute; top: 30px; left: 5px; } #signom_header_logo { padding: 20px 0px 20px 0px; position: relative; } span#siteNameContainer { position: absolute; right: 220px; top: 5px; } /* See images.css for url based styles */ body { font-family: Calibri, Trebuchet MS, Tahoma, sans-serif; background: white; /*letter-spacing: 0.5px;*/ } #container { background-color: #FFFFFF; } body a { color: #2F648C; } body a.delete, span.obligatory { color: #B72929; } #notificationcontainer { background: #FFFDDD; border-color: #FF9900; border-style: solid; } .submenu { text-align: left; } #footercontainer { border-color: #e2e2e2; border-style: solid; } h1#page-title, h2#page-title, h2.page-title, h2.page-title-normal, div.innerBox div.page-title { color: #333; border-color: #ccc; border-style: solid; font-weight: normal; } h2.sub-heading { color: #2F648C; border-color: #ccc; border-style: solid; } h3{ border-color: #dcdcdc; border-style: solid; font-weight: normal; } h3.sub-heading { font-weight: normal; } div.browser_notify { border-color: red; border-style: solid; background-color: #F0B2B2; } div.browser_notify p { color: red; } .vatInfo { font-style: italic; } pre { white-space: pre-wrap; /* css-3 */ white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap; /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */ word-wrap: break-word; /* Internet Explorer 5.5+ */ } #footer .infolinks a { margin: 10px 0px 10px 0px; text-align: center; text-decoration: none; white-space: nowrap; } #footer .infolinks a:hover { text-decoration: underline; } #footer .copyright { text-align: center; } #footer .infolinks { color: transparent; text-align: center; } #loginBox, #homepagebox { /* border-radius: 10px; border-radius: 10px; */ } div#loginHeader { /*border-top-right-radius: 8px; border-top-left-radius: 8px; */ } div#loginHeader span { position: relative; top: 13px; margin-left: 25px; font-size: 1.2em; font-weight: 300; letter-spacing: 0.5px; text-align: center; color: rgba(255,255,255,0.9); font-family: sans-serif; /*text-shadow: 0.5px 0.5px 2px #075173; */ } body a img { border: none; } /* Screen Reader only - element visible but only for the accessibility tools. */ .sr-only { overflow: hidden !important; position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; border: 0 !important; clip: rect(0,0,0,0) !important; } body { color: #000; font-size: 12px; } body a { color: #857040; } #seleniumContent { color: #FFF; } #headercontainer { border-bottom: 1px solid #E0E0E0; } a.pdfFormLink { font-size: 15px; } span#siteNameContainer { color: #333333; font-size: 20px; font-family: Times New Roman; } h2.sub-heading { color: #333333; font-weight: normal; } @media only screen and (max-width: 900px) { .submenu { width: 95%; margin: 0 auto; padding: 0 20px; } .container, #container { margin: 0px auto; text-align: left; width: 100%; position: relative; clear: left; } .outer_container { margin: 0px auto; text-align: left; width: 95%; position: relative; } #headercontainer .outer_container { width: 100%; /* more space for logo and menu so that it's on the same level as contentn in a narrow window */ } #wrap { width: 100%; } div.browser_notify { border-width: 1px; width: 500px; position: absolute; left: 200px; top: 5px; } /* #signom_header_logo { position: relative; padding: 20px 0 20px 20px; } */ #signom_header_logo a.headerLogo { display: no-display; } .mainmenu { margin-left: 20px; } #contentBox { width: 100%; margin: 0px auto 20px auto; padding: 0 0 10px 0; min-height: 300px; position: relative; } div.content-row { margin: 15px 0px; } div.col-1-layout { width: 98%; } /** col-2-layout is used with innerBox class
*/ div.col-2-layout div.content-col1, div.col-2-layout div.content-col2 { float: left; width: 48%; margin-right: 2%; } div.col-2-layout div.content-col1-3 { width: 30%; margin-right: 3%; } div.col-3-layout div.content-col1-3 { width: 30%; margin-right: 3%; } /* override last element */ div.col-3-layout div.content-col1-3-last { width: 31.5%; margin-right: 0px; } div.col-4-layout div.content-col1-4, div.col-2-layout div.content-col1-4 { width: 45%; margin-right: 5%; } div.content-col1-5 { width: 18%; margin-right: 2%; } div.content-col1-5-last { width: 20%; margin-right: 0px; } div.content-col1-6 { width: 13%; margin-right: 3%; } div.content-col1-6-last { width: 16%; margin-right: 0px; } /* override last element */ div.innerBox div.col-4-layout div.content-col1-4-last, div.innerBox div.col-2-layout div.content-col1-4-last { width: 49%; margin-right: 0px; } div.col-2-layout div.content-col2-3 { width: 49%; } div.signom-full-content-width { width: 100%; } #dialogBox { margin: 20px; width: 80%; } #dialogBoxWide { margin: 20px; width: 90%; } #confirmationBox, .confirmationBox { margin: 20px; width: 80%; } #footercontainer { position: relative; width: 100%; height: 140px; /*margin-top: -84px; negative value of footer height (including borders)*/ clear: both; border-width: 0px; border-top-width: 1px; /** override */ } #footercontainer .outer_container { width: 100%; } div#footercontainer, div#footer { padding: 0 0 0 0px; } #footer .infolinks { color: transparent; position: relative; text-align: center; } #footer .infolinks a { margin: 10px 10px 10px 10px; text-align: center; display: inline; text-decoration: none; white-space: nowrap; } #footer .copyright { text-align: center; position: relative; top: 30px; } div.instructionText { float: left; width: 50%; } } @media only screen and (max-width: 760px) { div.content-row { margin: 10px 0px; } div.col-1-layout { width: 100%; } /** col-2-layout is used with innerBox class
*/ div.col-2-layout div.content-col1, div.col-2-layout div.content-col2 { float: left; width: 100%; } div.col-2-layout div.content-col1-3 { width: 100%; margin-right: 0px; } div.col-3-layout div.content-col1-3 { width: 100%; margin-right: 0px; } /* override last element */ div.col-3-layout div.content-col1-3-last { width: 100%; margin-right: 0px; } div.col-4-layout div.content-col1-4, div.col-2-layout div.content-col1-4 { width: 45%; margin-right: 5%; } div.content-col1-5 { width: 45%; margin-right: 5%; } div.content-col1-5-last { width: 49%; margin-right: 0px; } div.content-col1-6 { width: 45%; margin-right: 5%; } div.content-col1-6-last { width: 50%; margin-right: 0px; } /* override last element */ div.innerBox div.col-4-layout div.content-col1-4-last, div.innerBox div.col-2-layout div.content-col1-4-last { width: 45%; margin-right: 5%; } div.col-2-layout div.content-col2-3 { width: 50%; } } @media only screen and (max-width: 400px) { /** col-2-layout is used with innerBox class
*/ div.col-2-layout div.content-col1, div.col-2-layout div.content-col2 { float: left; width: 100%; } div.col-2-layout div.content-col1-3 { width: 100%; } div.col-3-layout div.content-col1-3 { width: 100%; } /* override last element */ div.innerBox div.col-3-layout div.content-col1-3-last, { width: 100%; } div.col-4-layout div.content-col1-4, div.col-2-layout div.content-col1-4 { width: 100%; } div.content-col1-5 { width: 100%; } div.content-col1-5-last { width: 100%; margin-right: 0px; } div.content-col1-6 { width: 100%; } div.content-col1-6-last { width: 100%; margin-right: 0px; } /* override last element */ div.innerBox div.col-4-layout div.content-col1-4-last, div.innerBox div.col-2-layout div.content-col1-4-last { width: 100%; margin-right: 0px; } div.col-2-layout div.content-col2-3 { width: 100%; } } input.error { border-width: 1px; } span.error { display: block; } div.infomessage p.p_para, div.infomessage li.p_para { margin-bottom: 10px; } .main-form label { margin-bottom: 5px; } .main-form input, .main-form textarea, .main-form select { width: 98%; display: block; margin: 5px 0px; } .main-form input.inlineCheckBox { width: auto; display: inline; } .main-form select#workQueueOptionId, .main-form select#contractStateId { display: inline; } form#powerForm div.col-1-layout input { width: 99%; } .main-form input.inline-element, form#powerForm div.col-1-layout input.inline-element { width: auto; display: inline; margin: 0px; } .main-form select { width: auto; /** override */ } #addNewUserForm select { width: 98%; } .main-form span.required { float: right; margin-right: 5px; } #logoutForm { display: inline; } label.text-label { padding-bottom: 2px; } div.border-line-thin { margin: 5px 0px; border-width: 0px; border-bottom-width: 1px; /** override */ } button.inlineSubmit { display: inline; } form.inlineForm { display: inline; } table.form { border-collapse: collapse; margin: 0 0 10px 0; width: 860px; } table.form td { padding: 10px 10px 10px 0; border-width: 0px; border-bottom-width: 1px; vertical-align: top; } .form p { margin-top: 0; } form#mainInputForm .mainInputElement, form#contractForm .mainInputElement, form#invoicePayerInformation .mainInputElement, form#invoiceDeliveryInformation .mainInputElement, form#contractForm div.infotext { width: 415px; } form#roleActionForm .mainInputElement { width: 98%; } table.contractInfo{ border-collapse: collapse; } table.contractInfo td{ padding: 4px 10px 4px 10px; border-width: 0px; border-bottom-width: 1px; vertical-align: top; } table.contractInfo th{ padding: 3px 10px 3px 10px; border-width: 0px; border-bottom-width: 1px; line-height: 22px; } table.parties th{ border-width: 0px; border-bottom-width: 1px; vertical-align: bottom; } fieldset.contentRowFieldset { padding: 0px 10px; position: relative; width: 838px; } fieldset { width: 858px; padding: 0; margin: 0 0 25px 0; border-width: 1px; } legend { margin: 0px 10px; } fieldset table.form { width: 100%; margin: 0; } fieldset table.form td { padding-left: 15px; } fieldset table.form tr.last td { border: 0; } div.small-padding { padding-left: 15px; padding-right: 15px; } span.requiredElement { color: red; } span.instructionElement { float: right; padding-top: 2px; } form#powerForm div.col-1-layout input.embeddedtext, form#powerForm input.embeddedtext { width: 15%; min-width: 100px; display: inline; margin-right: 10px; } form#powerForm label, form.powerForm label { display: block; margin-bottom: 5px; } form#powerForm label.radioButtonLabelContainer, form.powerForm label.radioButtonLabelContainer, form#powerForm label.checkBoxLabel, form.powerForm label.checkBoxLabel { display: unset; } form#powerForm label.embeddedtext { width: 30%; min-width: 200px; display: block; float: left; padding-top:8px; } div.col-1-layout span.instructionElement { margin-right: 10px; } div.selectElementContainer, div.checkBoxContainer, div.timeFrameContainer, div.radioButtonContainer { margin: 5px 0px; } div.content-row-thin div.selectElementContainer, div.content-row-thin div.checkBoxContainer, div.content-row-thin div.timeFrameContainer, div.content-row-thin div.radioButtonContainer { margin: 0px; } div#emailInstructionTextContainer { width: 350px; float: left; } div.small-padding { padding: 0px; } a.removeDocumentLink { padding:4px 0px 0px 8px; display:block; } input.floatLeftCheckbox { width: auto; float: left; margin-right: 10px; } label.floatLeftLabel { float: left; padding-top: 3px; } #addNewEmailContent { padding:0px 10px; } table tbody tr td.tableFormHead { width: 200px; } #changePasswordForm { padding:0px 10px; } #addNewKnownContactContent { padding:0px 10px; } #changePasswordInfoContainer { padding-left: 20px; margin-top:5px; } div.centered { text-align: center; } .floatRight { float: right; } fieldset.manageEmailsTable { padding-left: 10px; width: 848px; margin-top: 15px; } table.manageEmailsTable { border-collapse: separate; border-spacing: 0px; } td.invoiceInformation { width: 200px; } div.virtualMailBoxSummary { background-color: #ffffff; border-style: solid; position: absolute; top: 200px; width : 200px; right: 10px; margin: 8px; } div.virtualMailBoxSummary h3 { font-size: 16px; margin: 5px; } div.virtualMailBoxSummary #emailBoxList { margin: 5px; } div.virtualMailBoxSummary p { font-size: 12px; } .highlighted { background-color: #4dff4d; padding: 3px; } .highlighted a { color: #000000; } div.virtualMailBoxSummary a { word-wrap: break-word; } div.virtualMailBoxSummary button { box-shadow: none; text-shadow: none; padding: 1px; margin: 5px; display: inline; } #attachFileUploadForm_label { display: inline-block; padding: 15px 25px 15px 25px; text-decoration: none; background: #fff; cursor: pointer; border: 1px solid #DCDCDC; font-size: 20px; font-weight: 300; color: #323232; } #attachFileUploadForm_label:hover { background-color: #fff; color: #FFF; background: #323232 } #attachFileUploadForm_file { position: absolute; z-index: -1; top: 6px; left: 0; } #documentForm { position: relative; } .attachFileUploadForm { position: relative; } div.small-padding { padding: 0px; } form#powerForm label#companyNameText_label { display:inline; } form#powerForm input#companyNameText { display:inline; width: 250px; } .error, alerttext { color: red; } input.error { border-color: red; border-style: solid; color: #000; } label.strong, .main-form label { font-weight: bold; } .main-form label.radioButtonLabelContainer, .main-form label.checkBoxLabel { font-weight: unset; } .main-form label.no-bold { font-weight: normal; } span.require { color: red; } .main-form span.required { } /* can be used also outside main form */ div.infotext, span.infotext { } div.fieldsetInfoText { color: #666; } div.statustext, span.statustext { color: black; } a.alertLink, div.alerttext, span.alerttext { color: red; } label.text-label { font-weight: bold; } .inline-label { font-weight: bold; } div.border-line-thin-tiny, div.border-line-thin { border-color: lightGray; border-style: dotted; } div.border-line-thin-tiny { border-color: #EFEFEF; border-style: solid; } div.border-line-thin-clear { border-color: #CCCCCC; border-style: solid; } .extraNotice { color: red; } .align_center { text-align: center; } div.permissionsExist, div.permissionsMissing { font-weight: bold; } span.permissionsExist, div.permissionsExist { color: green; } div.permissionsMissing { } .successNotice { color: green; } .infoNotice { } table.form td { border-style: solid; border-color: #f0f0f0; } form#roleActionForm .disabledInputElement, form.roleActionForm .disabledInputElement, table.roleActionForm .disabledInputElement, form#mandateActionForm .disabledInputElement { background: lightGray; } table.contractInfo td{ border-style: solid; border-color: #f0f0f0; background: #fff; } table.contractInfo th{ border-style: solid; border-color: #f0f0f0; } table.parties th { border-style: solid; border-color: #ccc; } fieldset{ border-style: solid; border-color: #e9e9e9; background: #f9f9f9; } legend{ font-weight: bold; } #manageBasicRoleInformationTable tr.signom { display: none; } div.checkBoxContainer input, div.radioButtonContainer input { border-width: 0px; border-style: none; } .notEnabled { background: lightgray; } div.constantValueContainer { background: #efefef; border: 1px solid lightgray; padding: 5px; margin-bottom: 10px; } div.exampleValueContainer { background: lightBlue; border: 1px solid lightgray; padding: 5px; margin-bottom: 10px; } @media only screen and (max-width: 900px) { /* Make text fields 100% wide */ input[type='text'] { /* Change input's box sizing so that their 10px padding doesn't make them too wide */ box-sizing: border-box; -moz-box-sizing: border-box; width: 100%; } /* Other pixel width elements that need to be 100% wide */ div#emailInstructionTextContainer{ width: 100%; /* From 350px */ } /* Add padding to make typing in mobile easier. */ .content-col1, .content-col2, .content-row { margin-top: 5px; margin-bottom: 5px; } form#roleActionForm .mainInputElement, form#mainInputForm .mainInputElement, form.roleActionForm .mainInputElement, table.roleActionForm .mainInputElement, form#mandateActionForm .mainInputElement, form#contractForm .mainInputElement, form#invoicePayerInformation .mainInputElement, form#invoiceDeliveryInformation .mainInputElement, form#contractForm div.infotext { width: 80%; } /* Add padding to make typing in mobile easier. */ .content-col1, .content-col2, .content-row { margin-top: 10px; margin-bottom: 10px; } } /* atleast iphone needs increased font size for input fields Iphone */ /* Tiny screens */ @media only screen and (max-width: 560px) { input[type='password'], input[type='text'],textarea {font-size:16px;} input[type='checkbox'],textarea { margin-top: 5px; padding-top: 5px; padding-bottom: 5px; font-size: 16px; } select,textarea {font-size:16px;} } #mainNav li a em, h4 { font-size: 114% } /* =15 */ #wizard, div.wizardInfoLink { padding: 0px; border-width: 0px; position: absolute; margin: 0px 20px 0px 0px; } #wizard { top: 25px; right: 0px; } div.wizardInfoLink { top: 28px; right: 10px; } div.contractWizard #wizard { margin: 0px 0px 0px 20px; left: 0px; } #wizard ul { padding: 0px; margin: 0px; list-style-type: none; } #wizard li { float: left; } #wizard li div.main { margin: 0px; padding: 0px; float: left; } #wizard li div.separator { float: left; padding: 0 10px; margin: 0; } div.outerWizardContainer .signom-wizard { margin: 20px 0px 0px 20px; } .signom-wizard { width: 100%; max-width: 870px; min-height: 90px; border:1px solid #d7d7d7; border-radius: 16px; background-color: #fff; } .signom-wizard .wizard-nav { -ms-box-orient: horizontal; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -moz-flex; display: -webkit-flex; display: flex; list-style: none; padding: 0px 10px 0px 10px; margin: 0; } .signom-wizard .wizard-nav .wizard-nav-step { -webkit-flex-direction: row; flex-direction: row; width: 100%; text-align: center; padding-top: 25px; position: relative; } .signom-wizard .wizard-nav .wizard-nav-step span.indicator { height: 20px; width: 20px; line-height: 20px; display: inline-block; background-color: #d7d7d7; border-radius: 100px; color: #fff; font-size: 11px; } .signom-wizard .wizard-nav .wizard-nav-step span { z-index: 10; } .signom-wizard .wizard-nav .wizard-nav-step span.text { display: block; color: #696969; font-size: 14px; padding-top: 10px; } .signom-wizard .wizard-nav .wizard-nav-step.active span.indicator { background-color: #004184; } .signom-wizard .wizard-nav .wizard-nav-step.active span.text { color:#004184; font-weight: bold; } .signom-wizard .wizard-nav .wizard-nav-step span.indicator:after { content: ''; width: 50%; border-bottom: solid 1px #d7d7d7; position: absolute; left: 56%; top: 50%; z-index: 0; } .signom-wizard .wizard-nav .wizard-nav-step span.indicator:before { content: ''; width: 50%; border-bottom: solid 1px #d7d7d7; position: absolute; right: 56%; top: 50%; z-index: 0; } .signom-wizard .wizard-nav .wizard-nav-step:last-child span.indicator:after, .signom-wizard .wizard-nav .wizard-nav-step:first-child span.indicator:before { content: ''; border-bottom: solid 0px #ccc; } //Nets specific wizard for nets-product-selection// #nets-wizard .wizard-nav .wizard-nav-step.active span.indicator { background-color: #005776; } #nets-wizard .wizard-nav .wizard-nav-step.active span.text { color:#005776; font-weight: bold; } #nets-wizard .wizard-nav .wizard-nav-step span.indicator { height: 20px; width: 20px; line-height: 20px; display: inline-block; background-color: #d7d7d7; border-radius: 30px; color: #fff; font-size: 14px; } #nets-wizard { width: 100%; max-width: 870px; min-height: 90px; border:1px solid #d7d7d7; border-radius: 30px; background-color: #fff; } #nets-wizard .wizard-nav .wizard-nav-step.active span.indicator { background-color: #005776; } #nets-wizard .wizard-nav .wizard-nav-step span.text { display: block; color: #696969; font-size: 12px; padding-top: 10px; } #wizard li { color: gray; } #wizard li.current div.main { color: black; font-weight: bold; } #wizard li.done div.main { color: green; } .mainmenu { min-height: 29px; } .mainmenu ul { margin: 0; padding: 0; } .mainmenu li { float: left; } .mainmenu li a { display: block; margin-right: 3px; padding-right: 8px; } .mainmenu li a span { display: block; padding: 6px 2px 6px 10px; } /* Selected, white bg */ .mainmenu li.selected a span, .mainmenu li.selected a:hover span { margin-bottom: 0px; } .mainmenu .selected a, .mainmenu .selected a:hover { margin-bottom: 0; } /* Submenu */ .submenu p.buttons { float: right; margin: 0; padding: 25px 0px 25px 0px; } .submenu ul { margin: 0; padding: 0; float: left; } .submenu li { float: left; padding: 20px 20px 20px 0; margin: 0; } /* Light tabs on the page */ .tabmenu { /*float: left;*/ } .tabmenu ul { margin: 0; padding: 0; height: 32px; } .tabmenu li { float: left; height: 31px; line-height: 30px; /* center text vertically */ margin: 0; margin-right: 4px; margin-bottom: -1px; overflow: hidden; } .tabmenu li a { display: block; padding: 0 8px; } .tabmenu .selected a, .tabmenu .selected a:hover { margin-bottom: 0; } /* hidden tabs on the page */ .hiddentabmenu ul { margin: 0; padding: 0; } .hiddentabmenu li { float: left; margin: 0; margin-right: 4px; padding-left: 5px; } .hiddentabmenu li a { display: block; padding: 0 8px; } .tabmenu .selected a, .tabmenu .selected a:hover { margin-bottom: 0; } .mainmenu { margin-left: -10px; } .mainmenu { font-weight: normal; } .mainmenu li { list-style: none; } .mainmenu li a { letter-spacing: 0.3px; color: #fff; text-decoration: none; } .mainmenu a:hover { text-decoration: underline; } .mainmenu .selected a, .mainmenu .selected a:hover { color: #333; } /* Submenu */ .submenu ul { list-style: none; } .submenu .selected a { color: black; font-weight: bold; text-decoration: none; cursor: default; } /* Light tab navigation on page */ .tabmenu { font-weight: normal; border-bottom: 1px solid #ccc; } .tabmenu li { list-style: none; border: 1px solid #ccc; border-radius: 5px 5px 0px 0px; -moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px; } .tabmenu li a { letter-spacing: 0.3px; border: 1px solid #f9f9f9; border-radius: 5px 5px 0px 0px; -moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px; background: #f0f0f0; } .tabmenu li a:hover { background: #e9e9e9; } .tabmenu li.selected, .tabmenu li.selected a{ background: #fff; border-bottom: 1px solid #fff; text-decoration: none; color: #333; cursor: default; /* cursor doesn't look like a link when hovering */ } /* hidden tab navigation on page */ .hiddentabmenu { font-weight: normal; } .hiddentabmenu li { list-style: none; background-repeat: no-repeat; background-position: 0px 3px; } .hiddentabmenu li.selected { background-position: 0px -17px; } .hiddentabmenu li a { letter-spacing: 0.3px; } .mainmenu li a { color: #555555; font-size: 15px; } .mainmenu .selected a, .mainmenu a:hover, .mainmenu .selected a:hover { color: #000; } .mainmenu a, .mainmenu a:hover { text-decoration: none; } @media only screen and (max-width: 900px) { .mainmenu { } .mainmenu ul { display: none; } .mainmenu li { display: none; } .mainmenu li a { display: none; } } div.space-line { clear: both; margin: 0px; padding: 0px; width: auto; } div.border-line { margin: 20px 0px; border-width: 0px; border-bottom-width: 1px; /** override */ } div.border-box { padding: 10px; } div.border-box, div.border-box-base { border-width: 1px; } a.arrow { height: 16px; width: 16px; display: block; } ul.auth { margin: 5px; padding: 0; } .auth li { margin: 0 0 0 13px; padding: 0; } .auth img /* Flag icons */ { margin: 0 0 0 3px; } /* See images.css for url based styles */ div.border-line { border-color: #2F648C; border-style: solid; } div.border-box, div.border-box-base { border-color: #ccc; border-style: solid; } a.arrow { cursor: pointer; } /** Has to be below arrow */ a.up { background-position: 0px 0px; } div.infomessage, #infomessage { padding: 15px 15px 15px 50px; margin: 1.5em 0; position: relative; border-width: 0px; } div.infomessagePlain { padding-top: 0px; margin-top: 0px; } div.infomessage p, #infomessage p { margin: 0px; } img.closeContainer { position: absolute; top: 5px; right: 5px; } /* See images.css for url based styles */ div.infomessage, #infomessage { border-color: #e0e0e0; border-style: solid; } div.infomessageInfo, #infomessage.info { background-color: #E6EDF7; border-color: #d0dced; } div.infomessageError, #infomessage.error { border-color: #f0b2b2; color: #650404; } div.infomessageSuccess, #infomessage.success { color: #2D5C38; border-color: #c0d695; } div.infomessagePlain, #infomessage.plain { border-style: none; color: none; } div.infomessageWarning, #infomessage.warning { border-color: #f3f0c4; } img.closeContainer { cursor: pointer; } div.infomessage, #infomessage.info { border: 1px solid #E0E0E0; } div.infomessageInfo, #infomessage.info { background-color: #FCFAFB; } #countryTabs ul.identificationProvidersContainer{ list-style-type: none; width: 100%; height: fit-content; padding: 0; vertical-align: baseline; padding: 1.5rem 1rem 1.5rem 1rem!important; border-top-left-radius: 5px; border-top-right-radius: 5px; border: 1px solid #DDD!important; background: none; box-sizing: border-box; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper { background: #fff; float: left; min-width: 180px; min-height: 180px; text-align: center; display: flex; align-items: center; justify-content: center; cursor: pointer; width: 25%; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle { display: block; min-height: 96px; text-decoration: none; overflow: hidden; padding: 60px 20px; color: #2a6ebb; cursor: pointer; border: 1px transparent solid; font-weight: normal; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle:hover { background-image: linear-gradient(to bottom, #fff, transparent); background-color: transparent; border: 1px #DDD solid; border-radius: 5px; -moz-box-shadow: inset 0 0 5px #DDD; -webkit-box-shadow: inset 0 0 5px #DDD; box-shadow: inset 0 0 5px #DDD; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle .orgLogoContainer { display: block; margin: 0 auto; text-align: center; line-height: 0; height: 60px; width: 145px; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle .orgLogoContainer img { max-width: 80%; height: auto; min-height: 50px; max-height: 4rem; margin-bottom: 1rem; object-fit: contain; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle .orgNameContainer { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; width: 100%; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper .linkButtonStyle .orgNameContainer span { font-size: 1rem; line-height: 2.2rem; display: block; text-align: center; word-break: break-all; overflow-wrap: break-word; -ms-word-break: break-all; } @media only screen and (max-width: 1279px) { #countryTabs .identificationProvidersContainer .identificationProviderWrapper { display: block; width: 25%; } } @media only screen and (max-width: 991px) { #countryTabs .identificationProvidersContainer .identificationProviderWrapper { display: block; width: 33.33%; } } @media only screen and (max-width: 768px) { #countryTabs .identificationProvidersContainer .identificationProviderWrapper { display: block; width: 50%; } } @media only screen and (max-width: 550px) and (min-width: 270px) { #countryTabs .identificationProvidersContainer { width: 90%; } #countryTabs .identificationProvidersContainer .identificationProviderWrapper { display: block; width: 100%; float: none; } } .identificationProvider-wrapper { float: left; } .identificationProvider-description { text-align: center; } .identificationProvider-logo:hover { border-width: 1px; padding: 4px; cursor: pointer; } /* Responsive styles * Updated: 2015-06-10 */ /*** IDENTIFICATION ***/ /* One column */ div.col-2-layout div.bank-logo-column { width: 100%; } /* Show bank logos in boxes */ .identificationProvider-wrapper { height: 120px; width: 25%; /* 4 per row as default */ min-width:150px; text-align: center; margin: 0 -1px -1px 0; } .other-identification-column .identificationProvider-wrapper { width: 100%; } .identificationProvider-wrapper { display: table; } .identificationProvider-logo { height: 120px; padding: 0; display: table-cell; vertical-align: middle; border: 1px solid #e9e9e9; } /* Overrides old styles */ .identificationProvider-logo:hover { border: 1px solid #e9e9e9; padding: 0; } /* Make sure the logos aren't too wide for their boxes */ .identificationProvider-logo img { max-width: 80%; height: auto; } /* Right now these descriptions under logos break the boxes */ .identificationProvider-description { display: none; } /* Bank logos in 2 cols */ @media only screen and (max-width: 800px) { .identificationProvider-wrapper { width: 33.33%; } } /* Bank logos in 2 cols */ @media only screen and (max-width: 650px) { .identificationProvider-wrapper { width: 50%; } } /* Bank logos in 1 col on a very small screen */ @media only screen and (max-width: 359px) { .identificationProvider-wrapper { width: 100%; } } /****** RESPONSIVE STYLES */ /* For tablets & small laptops */ @media only screen and (max-width: 940px) { /* Test divs break the layout horizontally */ div#VIRTUAL_MAILBOX, div#CONTENT_BOX_ANCHOR, div#seleniumContent { display: none !important; } /* Other pixel width elements that need to be 100% wide */ div#emailInstructionTextContainer { width: 100%; /* From 350px */ } div.instructionText { width: 80%; } /* Email address form */ #enterEmailAddressForm fieldset { width: 100%; /* From 858px */ box-sizing: border-box; -moz-box-sizing: border-box; } /* Separate columns visually */ #enterEmailAddressForm .content-col2 { margin-top: 15px; } } /**************************************/ div.pickCountry { line-height: 28px; float: left; margin-right: 10px; } /* Override jQuery UI styles */ div.signomTabs { border: 0; background: 0; padding: 0; } div.signomTabs .ui-tabs-panel { padding: 20px 0 0 0; } div.signomTabs li.ui-state-default { border: 0; } div.signomTabs .ui-tabs-nav { padding: 0; } div.signomTabs .ui-tabs-nav li { margin: 0; top: 0; padding: 0 !important; } div.signomTabs ul { float: left; font-weight: 400; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } div.signomTabs li a { padding: 8px 12px; } div.signomTabs li:first-child a { border-left: 0; } div.signomTabs .tab-panel { clear: left; } #countryTabs { border: 0; } /* See images.css for url based styles */ div.pickCountry { font-size: 16px; display: block; } div.signomTabs li.ui-state-default { background: transparent; } div.signomTabs .ui-state-default a { color: #444; font-weight: 400; } div.signomTabs ul { background-color: #e0e0e0; border: 1px solid #d9d9d9; -moz-box-shadow: inset 0px 1px 0px 0px #fff; -webkit-box-shadow: inset 0px 1px 0px 0px #fff; box-shadow: inset 0px 1px 0px 0px #fff; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #eeeeee ), color-stop(1, #e0e0e0)); background: -moz-linear-gradient(top, #eeeeee 5%, #e0e0e0 100%); background: -webkit-linear-gradient(top, #eeeeee 5%, #e0e0e0 100%); background: -o-linear-gradient(top, #eeeeee 5%, #e0e0e0 100%); background: -ms-linear-gradient(top, #eeeeee 5%, #e0e0e0 100%); background: linear-gradient(to bottom, #f9f9f9 5%, #e0e0e0 100%); } div.signomTabs li a { display: block; border-left: 1px solid #f9f9f9; border-right: 1px solid #b8b8b8; text-decoration: none; color: #333; } div.signomTabs .ui-state-active a { color: #fff; font-weight: bold; -moz-box-shadow: inset 0px 1px 0px 0px #61c1ff; -webkit-box-shadow: inset 0px 1px 0px 0px #61c1ff; box-shadow: inset 0px 1px 0px 0px #61c1ff; background: #0991d8; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #37b5f7 ), color-stop(1, #cccccc)); background: -moz-linear-gradient(top, #37b5f7 5%, #0991d8 100%); background: -webkit-linear-gradient(top, #37b5f7 5%, #0991d8 100%); background: -o-linear-gradient(top, #37b5f7 5%, #0991d8 100%); background: -ms-linear-gradient(top, #37b5f7 5%, #0991d8 100%); background: linear-gradient(to bottom, #37b5f7 5%, #0991d8 100%); } .identificationProvider-wrapper { float: left; } .identificationProvider-description { text-align: center; } .identificationProvider-logo:hover { border-width: 1px; padding: 4px; cursor: pointer; } /* Responsive styles * Updated: 2015-06-10 */ /*** IDENTIFICATION ***/ /* One column */ div.col-2-layout div.bank-logo-column { width: 100%; } /* Show bank logos in boxes */ .identificationProvider-wrapper { height: 120px; width: 25%; /* 4 per row as default */ min-width:150px; text-align: center; margin: 0 -1px -1px 0; } .other-identification-column .identificationProvider-wrapper { width: 100%; } .identificationProvider-wrapper { display: table; } .identificationProvider-logo { height: 120px; padding: 0; display: table-cell; vertical-align: middle; border: 1px solid #e9e9e9; } /* Overrides old styles */ .identificationProvider-logo:hover { border: 1px solid #e9e9e9; padding: 0; } /* Make sure the logos aren't too wide for their boxes */ .identificationProvider-logo img { max-width: 80%; height: auto; } /* Right now these descriptions under logos break the boxes */ .identificationProvider-description { display: none; } /* Bank logos in 2 cols */ @media only screen and (max-width: 800px) { .identificationProvider-wrapper { width: 33.33%; } } /* Bank logos in 2 cols */ @media only screen and (max-width: 650px) { .identificationProvider-wrapper { width: 50%; } } /* Bank logos in 1 col on a very small screen */ @media only screen and (max-width: 359px) { .identificationProvider-wrapper { width: 100%; } } /****** RESPONSIVE STYLES */ /* For tablets & small laptops */ @media only screen and (max-width: 900px) { /* Test divs break the layout horizontally */ div#VIRTUAL_MAILBOX, div#CONTENT_BOX_ANCHOR, div#seleniumContent { display: none !important; } div.instructionText { width: 80%; } /* Email address form */ #enterEmailAddressForm fieldset { width: 100%; /* From 858px */ box-sizing: border-box; -moz-box-sizing: border-box; } /* Separate columns visually */ #enterEmailAddressForm .content-col2 { margin-top: 15px; } } } /* Fix wizard heading so that it doesn't overlap */ @media only screen and (max-width: 560px) { #wizard { position: relative; top: auto; right: auto; margin: 10px 20px 20px 20px; } } /**************************************/ div.pickCountry { line-height: 28px; float: left; margin-right: 10px; } /* Override jQuery UI styles */ div.signomTabs { border: 0; background: 0; padding: 0; } div.signomTabs .ui-tabs-panel { padding: 20px 0 0 0; } div.signomTabs li.ui-state-default { border: 0; } div.signomTabs .ui-tabs-nav { padding: 0; } div.signomTabs .ui-tabs-nav li { margin: 0; top: 0; padding: 0 !important; } div.signomTabs ul { float: left; font-weight: 400; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } div.signomTabs li a { padding: 8px 12px; } div.signomTabs li:first-child a { border-left: 0; } div.signomTabs .tab-panel { clear: left; } #countryTabs { border: 0; } div#language_selection { position: absolute; top: 90px; right: 20px; padding: 0; margin: 0; } #language_selection a{ margin: 0 5px; } div#language_selection { position: absolute; top: 10px; right: 40px; } #language_selection, #language_selection a { color: #002d41; text-align: right; } #language_selection a:hover { text-decoration: underline; } #language_selection a.selected { color: black; font-weight: bold; text-decoration: none; cursor: default; } #language_selection, #language_selection a.selected, #language_selection a { color: #555555; } @media only screen and (max-width: 900px) { div#language_selection { position: absolute; top: 15px; right: 15px; padding: 0; margin: 0; } #language_selection a { margin: 4px; display: block; text-align: right; } #language_selection a:link { text-decoration: none; } .languageSelectionSeparator { display: none; } } div#user_info { position: absolute; top: 100px; right: 20px; padding: 0; } div#user_info .content { padding: 0; } #user_info strong { margin-right: 5px; } #user_info #log_out_link { margin-left: 5px; } div#user_info { position: absolute; top: 80px; right: 30px; padding: 0; } div#user_info .content { color: #002d41; } div#user_info a { color: #002d41; } /* progress bar container */ .progressbar{ border-width: 1px; height: 14px; position: relative; margin: 0px; margin-top: 5px; padding: 0px; } /* color bar */ .progressbar div.progress{ position: absolute; width: 0px; height: 100%; overflow: hidden; } /* text on bar */ .progressbar div.progress .text{ position: absolute; text-align: center; } /* text off bar */ .progressbar div.text{ position: absolute; width: 100%; height: 100%; text-align: center; } /* progress bar container */ .progressbar{ border-color: gray; border-style: solid; } /* color bar */ .progressbar div.progress{ background-color: #86aa61; } /* button elements and links with the button class */ button, .button{ display: block; padding: 6px 10px; border-width: 1px; } a.button { display: inline; } button[type]{line-height: 16px;} /* Safari fix */ /*button:focus, */ button:active, button:hover { outline: none; } /* Buttons including images */ .button.image{ padding: 8px 10px; } a.button img{ vertical-align: middle; width: 16px; height: 16px; padding-right: 4px; border: 0px; } a.button.imageright img { padding: 0; } /* button elements and links with the button class */ /* see images.css for url based styles */ button, .button{ color: #444; text-decoration: none; text-shadow: none; cursor: pointer; border-color: #ccc; border-style: solid; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; } button:active, .button:active{ background-color: #aaa; border-color: #999; color: #fff; text-shadow: none; } a.welcomeLink, a.welcomeLink:hover { background-color: #693; border-color: #7ea645; color: #fff; text-shadow: none; } /* Override previous settings */ a.welcomeLink:hover { background-color: #0871A5; border-color: #0983bf; } /* Removes dotted border line in Firefox */ button::-moz-focus-inner{ border-color: transparent; } /* INSET */ .inset{ border-color: #999; } .inset:hover{ border-color: #828282; } /* POSITIVE buttons (OK, confirm, continue, add...) */ .positive{ color: green; } .positive:active{ background-color: green; border-color: #ffff; } /* NEGATIVE buttons (delete) */ .negative{ color: #d12f19; } .negativeSimple{ color: #d12f19; } .negative:active{ background-color: #d12f19; border-color: #b22815; } /* DISABLED */ button[disabled]{ background: #ddd; border-color: #c9c9c9; color: #999; cursor: wait; } div.loginBox { background-color: #f9fafb; border-style: solid; border-color: #ccc; border-width: 1px; height: 250px; } h3.box-title { text-align: center; font-size: 1.9em; border-style: none; } div a.bigLink { font-size: 1.1em; padding: 12px 16px; margin: auto; text-align: center; display: inherit; width: 70%; } button#reference-submit { margin:auto; } // Revert fileuploader button focus for accessibility .fileuploader button:focus, .fileuploader-popup button:focus { outline: revert !important; } .checkbox:focus, .radio:focus, .checkboxContainer:focus, .checkBoxContainer:focus, .radioButtonContainer:focus{ outline: 2px solid; outline-offset: 3px; } a.welcomeLink, a.welcomeLink:hover { background-color: #FFF; border-color: #ccc; color: #444; text-shadow: 0 1px rgba(255, 255, 255, .75); } /* Override previous settings */ a.welcomeLink:active { background-color: #aaa; border-color: #999; } a#login_by_identification_link, a#simple_login_link { white-space: nowrap; } @media only screen and (max-width: 900px) { button, .button { padding: 10px 16px; white-space: nowrap; text-align: center; } } @media only screen and (max-width: 760px) { button, .button { padding: 10px 16px; text-align: center; } a.button { display: inherit; margin: auto; width: 60%; } } @media only screen and (max-width: 420px) { a.button { display: inherit; width: 60%; } } div.helpContainer { position: relative; } a.helpAnchor { position: absolute; top: 7px; left: -40px; } div.helpBox p.title { font-weight: bold; } /* * File: demo_table.css * CVS: $Id$ * Description: CSS descriptions for DataTables demo pages * Author: Allan Jardine * Created: Tue May 12 06:47:22 BST 2009 * Modified: $Date$ by $Author$ * Language: CSS * Project: DataTables * * Copyright 2009 Allan Jardine. All Rights Reserved. * * *************************************************************************** * DESCRIPTION * * The styles given here are suitable for the demos that are used with the standard DataTables * distribution (see www.datatables.net). You will most likely wish to modify these styles to * meet the layout requirements of your site. * * Common issues: * 'full_numbers' pagination - I use an extra selector on the body tag to ensure that there is * no conflict between the two pagination types. If you want to use full_numbers pagination * ensure that you either have "example_alt_pagination" as a body class name, or better yet, * modify that selector. * Note that the path used for Images is relative. All images are by default located in * images/datatables/ - relative to this CSS file. */ /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables features */ /* * NOTE: HV: SEE images.css for url based styles */ .dataTables_wrapper { position: relative; margin-bottom: 20px; /* min-height: 302px; */ clear: both; /*_height: 302px; */ /*zoom: 1; Feeling sorry for IE */ } .dataTables_processing { position: absolute; top: 50%; left: 50%; width: 250px; height: 30px; margin-left: -125px; margin-top: -15px; padding: 14px 0 2px 0; border: 1px solid #ddd; text-align: center; color: #999; font-size: 14px; background-color: white; } .dataTables_length { width: 40%; float: left; } .dataTables_filter { width: 50%; float: right; text-align: right; } .dataTables_info { width: 60%; float: left; } .dataTables_paginate { width: 44px; * width: 50px; float: right; text-align: right; } /* Pagination nested */ .paginate_disabled_previous, .paginate_enabled_previous, .paginate_disabled_next, .paginate_enabled_next { height: 19px; width: 19px; margin-left: 3px; float: left; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables display */ table.display { margin: 0 auto 10px auto; width: 100%; float: left; } table.display thead th { padding: 4px 10px; border-bottom: 1px solid #999; font-weight: bold; text-align: left; cursor: pointer; } table.display tfoot th { padding: 4px 10px; border-top: 1px solid #ddd; text-align: left; font-weight: bold; } table.display tr.heading2 td { border-bottom: 1px solid #aaa; } table.display td { padding: 4px 10px; border-bottom: 1px solid #eee; letter-spacing: 0; vertical-align: top; } table.display td.center { text-align: center; } table.display tr:hover td{ background: #f3f3f3; } table.display tr.active td{ background: #E7FBE6; } /** This style should override other colors */ table#contract-documents td.verified { background-color: #E7FBE6; } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * DataTables row classes */ table.display tr.odd.gradeA { /** background-color: #bbd7e2; */ } table.display tr.even.gradeA { /** background-color: #bbd7e2; */ } table.display tr.odd.gradeA { /** background-color: #bbd7e2; */ } table.display tr.even.gradeA { /** background-color: white; */ } table.display tr.odd.gradeC { /** background-color: #ddddff; */ } table.display tr.even.gradeC { /** background-color: #ddddff; */ } table.display tr.odd.gradeX { background-color: #ffdddd; } table.display tr.even.gradeX { background-color: #ffeeee; } table.display tr.odd.gradeU { background-color: #ddd; } table.display tr.even.gradeU { background-color: #eee; } tr.odd { background-color: #f9f9f8; } tr.even { /* background-color: white;*/ } /* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * Misc */ .top, .bottom { padding: 15px; background-color: #F5F5F5; border: 1px solid #CCCCCC; } .top .dataTables_info { float: none; } .clear { clear: both; } .dataTables_empty { text-align: center; } tfoot input { margin: 0.5em 0; width: 100%; color: #444; } tfoot input.search_init { color: #999; } td.group { background-color: #d1cfd0; border-bottom: 2px solid #A19B9E; border-top: 2px solid #A19B9E; } .example_alt_pagination div.dataTables_info { width: 40%; } .paging_full_numbers { width: 400px; height: 22px; line-height: 22px; } .paging_full_numbers span.paginate_button, .paging_full_numbers span.paginate_active { border: 1px solid #aaa; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 2px 5px; margin: 0 3px; cursor: pointer; *cursor: hand; } .paging_full_numbers span.paginate_button { background-color: white; } .paging_full_numbers span.paginate_button:hover { background-color: lightGray; } .paging_full_numbers span.paginate_active { background-color: lightGray; } table.display tr.even.row_selected td { background-color: #B0BED9; } table.display tr.odd.row_selected td { background-color: #9FAFD1; } /* * Sorting classes for columns */ /* For the standard odd/even */ tr.odd td.sorting_1 { /*background-color: #D3D6FF; /* background-color: #EEEEEE;*/ } tr.odd td.sorting_2 { /* background-color: #DADCFF; /* background-color: #EEEEEE;*/ } tr.odd td.sorting_3 { /** background-color: #E0E2FF; */ /*background-color: #EEEEEE;*/ } tr.even td.sorting_1 { /** background-color: #EAEBFF; */ /*background-color: #EEEEEE;*/ } tr.even td.sorting_2 { /** background-color: #F2F3FF; */ /* background-color: #EEEEEE;*/ } tr.even td.sorting_3 { /** background-color: #F9F9FF; */ /* background-color: #EEEEEE;*/ } /* For the Conditional-CSS grading rows */ /* Colour calculations (based off the main row colours) Level 1: dd > c4 ee > d5 Level 2: dd > d1 ee > e2 */ tr.odd.gradeA td.sorting_1 { /* background-color: #EEEEEE;*/ } tr.odd.gradeA td.sorting_2 { /* background-color: #EEEEEE;*/ } tr.odd.gradeA td.sorting_3 { /* background-color: #EEEEEE;*/ } tr.even.gradeA td.sorting_1 { /* background-color: #EEEEEE;*/ } tr.even.gradeA td.sorting_2 { /* background-color: #EEEEEE;*/ } tr.even.gradeA td.sorting_3 { /* background-color: #EEEEEE;*/ } tr.odd.gradeC td.sorting_1 { /* background-color: #EEEEEE;*/ } tr.odd.gradeC td.sorting_2 { /* background-color: #EEEEEE;*/ } tr.odd.gradeC td.sorting_3 { /* background-color: #EEEEEE;*/ } tr.even.gradeC td.sorting_1 { /* background-color: #EEEEEE;*/ } tr.even.gradeC td.sorting_2 { /* background-color: #EEEEEE;*/ } tr.even.gradeC td.sorting_3 { /* background-color: #EEEEEE;*/ } tr.odd.gradeX td.sorting_1 { background-color: #ffc4c4; } tr.odd.gradeX td.sorting_2 { background-color: #ffd1d1; } tr.odd.gradeX td.sorting_3 { background-color: #ffd1d1; } tr.even.gradeX td.sorting_1 { background-color: #ffd5d5; } tr.even.gradeX td.sorting_2 { background-color: #ffe2e2; } tr.even.gradeX td.sorting_3 { background-color: #ffe2e2; } tr.odd.gradeU td.sorting_1 { background-color: #c4c4c4; } tr.odd.gradeU td.sorting_2 { background-color: #d1d1d1; } tr.odd.gradeU td.sorting_3 { background-color: #d1d1d1; } tr.even.gradeU td.sorting_1 { background-color: #d5d5d5; } tr.even.gradeU td.sorting_2 { background-color: #e2e2e2; } tr.even.gradeU td.sorting_3 { background-color: #e2e2e2; } /* * Row highlighting example */ .ex_highlight #example tbody tr.even:hover, #example tbody tr.even td.highlighted { background-color: #ECFFB3; } .ex_highlight #example tbody tr.odd:hover, #example tbody tr.odd td.highlighted { background-color: #E6FF99; } /* * KeyTable */ table.KeyTable td { border: 3px solid transparent; } table.KeyTable td.focus { border: 3px solid #3366FF; } table.display tr.gradeA { background-color: white; } table.display tr.gradeC { background-color: white; } table.display tr.gradeX { background-color: #ffdddd; } table.display tr.gradeU { background-color: #ddd; } div.box { height: 100px; padding: 10px; overflow: auto; border: 1px solid #8080FF; background-color: #E5E5FF; } .hoverHelp{ cursor: help; } tr:hover .date span{ border-bottom: .1em dotted #999; } /* span with grey color (used in document file size in bytes) */ .size{ color: #777; } p.small{ margin-bottom: 2px; } table.license{ width: 858px; border-width: 1px; border-collapse: collapse; } .license td{ width: 143px; /* Base settings */ border-width: 0px; border-right-width: 1px; padding: 0px 0px 15px 0; } table.licenseCols1 td { width: 213px; } table.licenseCols4 td { width: 213px; } table.licenseCols5 td { width: 170px; } .license h2{ margin-top: 20px; } h2 span.selected{ display: block; margin: 0; } .license ul{ margin: 0; padding: 0; list-style: none; } .license ul li{ margin: 0; padding: 0 0 10px 0; line-height: 110%; text-align: center; } .license a.button, .license button { display: block; float: none; margin: 15px auto 0 auto; } .license button{ width: 140px; } .license a.button{ width: 120px; } p.selected{ padding: 4px 2px; } p.selected strong{ display: block; } /* STYLES FOR USER AGREEMENT PAGE */ /* Hack for IE7*/ form#confirmUserAgreementForm *{ * border: 1px solid #fff; } /* Position the checbox absolutely to keep it in the same place on every browser & responsive version */ #confirmUserAgreementForm .content-row{ position: relative; /* The checbox needs to positioned relative to this containing element */ } form#confirmUserAgreementForm input#termsAccepted{ position: absolute; width: auto; top: 0; left: 0; } form#confirmUserAgreementForm label#termsAcceptedLabel{ font-size: 15px; float: left; display: block; padding: 0 5px 0 25px; /* Left spacing needs to take into account different checkbox sizes in diff browsers */ margin: 0 0px 10px 0; line-height: 1.2em; } form#confirmUserAgreementForm label{ cursor: pointer; } form#confirmUserAgreementForm label span{ display: block; color: #444; margin: 0; font-weight: normal; font-size: 13px; } /* The link that opens the agreement */ a.openAgreement{ float: left; display: block; vertical-align: top; font-size: 15px; line-height: 1em; margin: 0 0 15px 25px; line-height: 1.2em; white-space: nowrap; /* Always on one line */ color: #369; /* A clearly visible link color here on every project! */ } #userAgreementBox{ position: relative; /*IE7 needs this, text flows over box otherwise */ display: none; height: 400px; /* Set inital height, this will be changed with JS */ border: 1px solid; overflow-x: hidden; overflow-y: scroll; } #userAgreementBox div.innerBox{ padding-bottom: 40px; } a.printUserAgreement{ float: right; font-size: 16px; color: #369; /* A clear link color here on every project! */ } /* Used when importing static terms from google storage bucket */ a.printUserAgreementNew{ float: right; font-size: 16px; color: #369; /* A clear link color here on every project! */ padding-right: 20px; } /* Styling for agreement text */ #userAgreementBox div.innerBox h2, #userAgreementBox div.innerBox h3{ margin: 25px 0px 25px 0px; } #userAgreementBox div.innerBox p.textcontent { padding: 0px 25px 0px 0px; } #userAgreementBox div.innerBox ol, #userAgreementBox div.innerBox ul{ padding: 0 25px 0 50px; } /* Mobile styles for user agreement page */ @media only screen and (max-width: 480px){ /* Break label into two lines */ #termsAcceptedLabel{ padding-right: 50px; } /* No need for print link in mobile version? */ a.printUserAgreement{ display: none; } /* More space to read the agreement on mobiles */ #userAgreementBox div.innerBox h2, #userAgreementBox div.innerBox h3{ margin: 10px; } #userAgreementBox div.innerBox p.textcontent { padding: 0 10px; } #userAgreementBox div.innerBox ol, #userAgreementBox div.innerBox ul{ padding: 0 10px 0 25px; } } p.small { margin-bottom: 2px; } table.license{ border-style: solid; border-color: #ccc; } .license td{ vertical-align: top; text-align: center; border-style: solid; border-color: #ccc; } .license ul { text-align: left; } /* Selected license, currently active */ .license td.selected{ background: #D5E8B1; } p.selected{ background: #669933; color: #fff; } /* override selected class */ p.terminated{ background: #D12F19; } /* Next license */ td.next{ background: #D2E1E9; } p.next{ background: #369; } .tooltip { display: none; margin: 0px; padding: 0px; width: 370px; } .tooltipTop { height: 40px; width: 370px; margin: 0px; padding: 0px; } .tooltipCenter { padding: 0px 30px 0px 30px; width: 310px; } .tooltipBottom { height: 65px; width: 370px; margin: 0px; padding: 0px; } /**/ div.added-contract-element, div.added-role-element { margin-bottom: 0px; padding-bottom: 0px; min-height: 60px; } div.added-role-element { min-height: 140px; } div.added-role-element-heading { padding-bottom: 10px; font-weight: bold; } div.added-role-element-heading span { font-weight: normal; } div.icon-element { float: left; } div.data-element { float: left; } div.file-data-element, div.role-data-element { float: left; width: 330px; } div.role-data-element-small { float: left; width: 248px; } div.role-data-element div.infotext { padding-top: 5px; } div.infoTextPadded { padding: 4px 0px 4px 0px; } div.contentText { padding-top: 5px; padding-bottom: 10px; } #notificationOrderVisualizationContainer { /** currently no styles */ } #notificationOrderVisualizationContainer fieldset.notificationGroup { width: 180px; min-height: 100px; float: left; padding: 10px; margin-right: 10px; border-width: 1px; } fieldset.notificationGroup div.notificationElement { border-width: 0px; border-bottom-width: 1px; } div.notificationSignatory, div.notificationObserver { width: 145px; float: left; } a.moveLeft, a.moveRight { width: 15px; } a.moveLeft { float: left; } a.moveRight { float: right; } div.openCloseIndicatorContainer { margin-top: 10px; } a.openCloseIndicator { float: left; display: block; padding-left: 13px; } div.downloadIconContainer { margin-right:10px; float:left; } div.downloadZipIconContainer, div.floatLefIconContainer { margin-right:10px; float:left; } div.floatLeft350Container { float:left; width:350px; } div.downloadZipIconContainer a { text-decoration:none; } div.downloadZipInfoContainer { margin-right:20px; float:left; } div.downloadZipInfoContainer strong { font-size:16px; } div.VIRTUAL_MAILBOX { position: absolute; top: 5px; right: -200px; } div.CONTENT_BOX_ANCHOR { position: absolute; top: 45px; right: -200px; } form.logoutForm { display: inline; } a.contentBoxAnchor { position:absolute;top:0px;left:0px; } ol.noBottomMargin { margin-bottom:0px; } #notificationOrderVisualizationContainer fieldset.notificationGroup { background: #f9f9f9; border-color: #dedede; border-style: solid; } fieldset.notificationGroup div.notificationElement { border-color: #dedede; border-style: solid; } a.moveLeft, a.moveRight { text-decoration: none; } div.notificationSignatory, div.notificationObserver { font-weight: bold; } div.notificationSignatory { color: green; } div.notificationObserver { color: gray; } div.openCloseIndicatorContainer a { background-repeat: no-repeat; background-position: 0px 3px; } div.openCloseIndicatorContainer a.selected { background-position: 0px -17px; } @media only screen and (max-width: 900px) { div.added-contract-element, div.added-role-element { } div.added-role-element { } div.added-role-element-heading { } div.added-role-element-heading span { } /* Hide subheadings and border lines*/ .documentFilesHeading, .signatureStatus, .border-line-thin { display: none; } .hiddentabmenu { display: none; } div.icon-element { margin-top: 5px; margin-bottom: 5px; } div.data-element { } div.file-data-element, div.role-data-element { float: left; width: 90%; } div.role-data-element-small { float: left; width: 90%; } div.role-data-element div.infotext { padding-top: 5px; } div.contentText { padding-top: 5px; padding-bottom: 10px; } #notificationOrderVisualizationContainer { /** currently no styles */ } #notificationOrderVisualizationContainer fieldset.notificationGroup { } fieldset.notificationGroup div.notificationElement { } div.notificationSignatory, div.notificationObserver { width: 90%; float: left; } a.moveLeft, a.moveRight { width: 15px; } a.moveLeft { } a.moveRight { } div.openCloseIndicatorContainer { } a.openCloseIndicator { } div.downloadIconContainer { } div.downloadZipIconContainer, div.floatLefIconContainer { } div.floatLeft350Container { } div.downloadZipIconContainer a { } div.downloadZipInfoContainer { } div.downloadZipInfoContainer strong { } div.VIRTUAL_MAILBOX { } div.CONTENT_BOX_ANCHOR { } form.logoutForm { } a.contentBoxAnchor { } ol.noBottomMargin { } } @media only screen and (max-width: 900px) { a#sign_contract_link { position: relative; top: 20px; margin: 20px 0px 5px 0px; } .rejectContractLinkContainer { position: relative; top: 20px; margin: 20px 0px 5px 0px; } select[name=roleAndMandate0] { margin: 5px 0px 5px 0px; } #rejectContractDescriptionContainer { position: relative; top: 20px; } } span.instructionElement { font-size: 10px; } div.infotext, span.infotext, div.permissionsExist, div.permissionsMissing, .infoNotice, span.requiredElement, .license ul, .vatInfo, ul.auth, .tooltip, #forgot_password_link { font-size: 11px; } #notificationOrderVisualizationContainer, .inline-label, table.parties th, div.helpBox p.content, div.infomessage, #infomessage, p.small, h2 span.selected, p.selected { font-size: 12px; } label.strong, .main-form label, span.require, .main-form span.required, label.text-label, .button.small.image, #language_selection, #language_selection a, #contentBox, #dialogBox, #dialogBoxWide, #confirmationBox, .confirmationBox, #footer, h1#page-title span, h2#page-title span, h2.page-title span, #notificationcontainer, div.browser_notify p, .submenu li a, .tabmenu li a, .hiddentabmenu li a, div#user_info, div.added-role-element-heading span { font-size: 13px; } button, .button, div.helpBox p.title, .mainmenu li a, div.contractWizard #wizard, div.added-role-element-heading, .dataTables_processing { font-size: 14px; } legend, p#welcomeContent, div.icon-element { font-size: 15px; } p.selected strong, p.terminated strong, p.next strong, h2.sub-heading { font-size: 16px; } h3, h3.sub-heading { font-size: 18px; } .license h2, h1#page-title, h2#page-title, h2.page-title-normal, h2.page-title, div.innerBox div.page-title { font-size: 20px; } @media only screen and (max-width: 560px) { button, .button { text-size: 1.1em; } /* span.instructionElement { font-size: 10px; } div.infotext, span.infotext, div.permissionsExist, div.permissionsMissing, .infoNotice, span.requiredElement, .license ul, .vatInfo, ul.auth, .tooltip, #forgot_password_link { font-size: 11px; } #notificationOrderVisualizationContainer, .inline-label, table.parties th, div.helpBox p.content, div.infomessage, #infomessage, p.small, h2 span.selected, p.selected { font-size: 12px; } label.strong, .main-form label, span.require, .main-form span.required, label.text-label, .button.small.image, #language_selection, #language_selection a, #contentBox, #dialogBox, #dialogBoxWide, #confirmationBox, .confirmationBox, #footer, h2#page-title span, h2.page-title span, #notificationcontainer, div.browser_notify p, .submenu li a, .tabmenu li a, .hiddentabmenu li a, div#user_info, div.added-role-element-heading span { font-size: 13px; } button, .button, div.helpBox p.title, .mainmenu li a, div.contractWizard #wizard, div.added-role-element-heading, .dataTables_processing { font-size: 14px; } legend, p#welcomeContent, div.icon-element { font-size: 15px; } p.selected strong, p.terminated strong, p.next strong, h2.sub-heading { font-size: 16px; } h3, h3.sub-heading { font-size: 18px; } .license h2, h2#page-title, h2.page-title, div.innerBox div.page-title { font-size: 20px; } */ /**/ #loginForm { background: #f7f7f7; }