/* Minification failed. Returning unminified contents. (6392,21): run-time error CSS1039: Token not allowed after unary operator: '-body-text' (6405,21): run-time error CSS1039: Token not allowed after unary operator: '-body-text' (6436,21): run-time error CSS1039: Token not allowed after unary operator: '-body-text' (6451,21): run-time error CSS1039: Token not allowed after unary operator: '-body-text' (6460,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-blue' (6464,25): run-time error CSS1039: Token not allowed after unary operator: '-primary-light-blue' */ /*! * jQuery UI CSS Framework 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Theming/API */ /* Layout helpers ----------------------------------*/ .ui-helper-hidden { display: none; } .ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); } .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; } .ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; } .ui-helper-clearfix:after { clear: both; } .ui-helper-clearfix { zoom: 1; } .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); } /* Interaction Cues ----------------------------------*/ .ui-state-disabled { cursor: default !important; } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; } /* Misc visuals ----------------------------------*/ /* Overlays */ .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /*! * jQuery UI Resizable 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Resizable#theming */ .ui-resizable { position: relative;} .ui-resizable-handle { position: absolute;font-size: 0.1px; display: block; } .ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; } .ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; } .ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; } .ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; } .ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; } .ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; } .ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; } .ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; } .ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;} /*! * jQuery UI Selectable 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Selectable#theming */ .ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; } /*! * jQuery UI Accordion 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Accordion#theming */ /* IE/Win - Fix animation bug - #4615 */ .ui-accordion { width: 100%; } .ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; } .ui-accordion .ui-accordion-li-fix { display: inline; } .ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; } .ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } .ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; } .ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; } .ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; } .ui-accordion .ui-accordion-content-active { display: block; } /*! * jQuery UI Autocomplete 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Autocomplete#theming */ .ui-autocomplete { position: absolute; cursor: default; } /* workarounds */ * html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */ /* * jQuery UI Menu 1.8.24 * * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Menu#theming */ .ui-menu { list-style:none; padding: 2px; margin: 0; display:block; float: left; } .ui-menu .ui-menu { margin-top: -3px; } .ui-menu .ui-menu-item { margin:0; padding: 0; zoom: 1; float: left; clear: left; width: 100%; } .ui-menu .ui-menu-item a { text-decoration:none; display:block; padding:.2em .4em; line-height:1.5; zoom:1; } .ui-menu .ui-menu-item a.ui-state-hover, .ui-menu .ui-menu-item a.ui-state-active { font-weight: normal; margin: -1px; } /*! * jQuery UI Button 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Button#theming */ .ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */ .ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */ button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */ .ui-button-icons-only { width: 3.4em; } button.ui-button-icons-only { width: 3.7em; } /*button text element */ .ui-button .ui-button-text { display: block; line-height: 1.4; } .ui-button-text-only .ui-button-text { padding: .4em 1em; } .ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; } .ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; } .ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; } .ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; } /* no icon support for input elements, provide padding by default */ input.ui-button { padding: .4em 1em; } /*button icon element(s) */ .ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; } .ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; } .ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; } .ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; } /*button sets*/ .ui-buttonset { margin-right: 7px; } .ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; } /* workarounds */ button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */ /*! * jQuery UI Dialog 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Dialog#theming */ .ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; } .ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; } .ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } .ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; } .ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; } .ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; } .ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; } .ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; } .ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; } .ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; } .ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; } .ui-draggable .ui-dialog-titlebar { cursor: move; } /*! * jQuery UI Slider 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Slider#theming */ .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } .ui-slider-horizontal { height: .8em; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } /*! * jQuery UI Tabs 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Tabs#theming */ .ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */ .ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; } .ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; } .ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; } .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; } .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */ .ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; } .ui-tabs .ui-tabs-hide { display: none !important; } /*! * jQuery UI Datepicker 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Datepicker#theming */ .ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; } .ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; } .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; } .ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; } .ui-datepicker .ui-datepicker-prev { left:2px; } .ui-datepicker .ui-datepicker-next { right:2px; } .ui-datepicker .ui-datepicker-prev-hover { left:1px; } .ui-datepicker .ui-datepicker-next-hover { right:1px; } .ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; } .ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; } .ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; } .ui-datepicker select.ui-datepicker-month-year {width: 100%;} .ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year { width: 49%;} .ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; } .ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; } .ui-datepicker td { border: 0; padding: 1px; } .ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; } .ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; } .ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; } .ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; } /* with multiple calendars */ .ui-datepicker.ui-datepicker-multi { width:auto; } .ui-datepicker-multi .ui-datepicker-group { float:left; } .ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; } .ui-datepicker-multi-2 .ui-datepicker-group { width:50%; } .ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; } .ui-datepicker-multi-4 .ui-datepicker-group { width:25%; } .ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; } .ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; } .ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; } .ui-datepicker-row-break { clear:both; width:100%; font-size:0em; } /* RTL support */ .ui-datepicker-rtl { direction: rtl; } .ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; } .ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; } .ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; } .ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; } .ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; } .ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; } .ui-datepicker-rtl .ui-datepicker-group { float:right; } .ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; } .ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; } /* IE6 IFRAME FIX (taken from datepicker 1.5.3 */ .ui-datepicker-cover { position: absolute; /*must have*/ z-index: -1; /*must have*/ filter: mask(); /*must have*/ top: -4px; /*must have*/ left: -4px; /*must have*/ width: 200px; /*must have*/ height: 200px; /*must have*/ } /*! * jQuery UI Progressbar 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Progressbar#theming */ .ui-progressbar { height:2em; text-align: left; overflow: hidden; } .ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; } /*! * jQuery UI CSS Framework 1.8.24 * * Copyright 2012, AUTHORS.txt (http://jqueryui.com/about) * Licensed under the MIT license. * http://jquery.org/license * * http://docs.jquery.com/UI/Theming/API * * To view and modify this theme, visit http://jqueryui.com/themeroller/ */ /* Component containers ----------------------------------*/ .ui-widget { font-family: 'opensansregular', Arial, sans-serif; font-size: 1.1em/*{fsDefault}*/; } .ui-widget .ui-widget { font-size: 1em; } .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: 'opensansregular', Arial, sans-serif; font-size: 1em; } .ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ url(/Content/themes/base/minified/images/ui-bg_flat_75_ffffff_40x100.png)/*{bgImgUrlContent}*/ 50%/*{bgContentXPos}*/ 50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/; color: #222222/*{fcContent}*/; } .ui-widget-content a { color: #222222/*{fcContent}*/; } .ui-widget-header { border: 1px solid #aaaaaa/*{borderColorHeader}*/; background: #cccccc/*{bgColorHeader}*/ url(/Content/themes/base/minified/images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/; color: #222222/*{fcHeader}*/; font-weight: bold; } .ui-widget-header a { color: #222222/*{fcHeader}*/; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #d3d3d3/*{borderColorDefault}*/; background: #e6e6e6/*{bgColorDefault}*/ url(/Content/themes/base/minified/images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #555555/*{fcDefault}*/; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #999999/*{borderColorHover}*/; background: #dadada/*{bgColorHover}*/ url(/Content/themes/base/minified/images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcHover}*/; } .ui-state-hover a, .ui-state-hover a:hover { color: #212121/*{fcHover}*/; text-decoration: none; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #aaaaaa/*{borderColorActive}*/; background: #ffffff/*{bgColorActive}*/ url(/Content/themes/base/minified/images/ui-bg_glass_65_ffffff_1x400.png)/*{bgImgUrlActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/; font-weight: normal/*{fwDefault}*/; color: #212121/*{fcActive}*/; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; text-decoration: none; } .ui-widget :active { outline: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #fcefa1/*{borderColorHighlight}*/; background: #fbf9ee/*{bgColorHighlight}*/ url(/Content/themes/base/minified/images/ui-bg_glass_55_fbf9ee_1x400.png)/*{bgImgUrlHighlight}*/ 50%/*{bgHighlightXPos}*/ 50%/*{bgHighlightYPos}*/ repeat-x/*{bgHighlightRepeat}*/; color: #363636/*{fcHighlight}*/; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636/*{fcHighlight}*/; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a/*{borderColorError}*/; background: #fef1ec/*{bgColorError}*/ url(/Content/themes/base/minified/images/ui-bg_glass_95_fef1ec_1x400.png)/*{bgImgUrlError}*/ 50%/*{bgErrorXPos}*/ 50%/*{bgErrorYPos}*/ repeat-x/*{bgErrorRepeat}*/; color: #cd0a0a/*{fcError}*/; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #cd0a0a/*{fcError}*/; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #cd0a0a/*{fcError}*/; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; } /* Icons ----------------------------------*/ /* states and images */ .ui-icon { width: 16px; height: 16px; background-image: url(/Content/themes/base/minified/images/ui-icons_222222_256x240.png)/*{iconsContent}*/; } .ui-widget-content .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_222222_256x240.png)/*{iconsContent}*/; } .ui-widget-header .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_222222_256x240.png)/*{iconsHeader}*/; } .ui-state-default .ui-icon { background-image: url(/Content/themes/base/minified/images/ui-icons_888888_256x240.png)/*{iconsDefault}*/; } .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_454545_256x240.png)/*{iconsHover}*/; } .ui-state-active .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_454545_256x240.png)/*{iconsActive}*/; } .ui-state-highlight .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_2e83ff_256x240.png)/*{iconsHighlight}*/; } .ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(/Content/themes/base/minified/images/ui-icons_cd0a0a_256x240.png)/*{iconsError}*/; } /* positioning */ .ui-icon-carat-1-n { background-position: 0 0; } .ui-icon-carat-1-ne { background-position: -16px 0; } .ui-icon-carat-1-e { background-position: -32px 0; } .ui-icon-carat-1-se { background-position: -48px 0; } .ui-icon-carat-1-s { background-position: -64px 0; } .ui-icon-carat-1-sw { background-position: -80px 0; } .ui-icon-carat-1-w { background-position: -96px 0; } .ui-icon-carat-1-nw { background-position: -112px 0; } .ui-icon-carat-2-n-s { background-position: -128px 0; } .ui-icon-carat-2-e-w { background-position: -144px 0; } .ui-icon-triangle-1-n { background-position: 0 -16px; } .ui-icon-triangle-1-ne { background-position: -16px -16px; } .ui-icon-triangle-1-e { background-position: -32px -16px; } .ui-icon-triangle-1-se { background-position: -48px -16px; } .ui-icon-triangle-1-s { background-position: -64px -16px; } .ui-icon-triangle-1-sw { background-position: -80px -16px; } .ui-icon-triangle-1-w { background-position: -96px -16px; } .ui-icon-triangle-1-nw { background-position: -112px -16px; } .ui-icon-triangle-2-n-s { background-position: -128px -16px; } .ui-icon-triangle-2-e-w { background-position: -144px -16px; } .ui-icon-arrow-1-n { background-position: 0 -32px; } .ui-icon-arrow-1-ne { background-position: -16px -32px; } .ui-icon-arrow-1-e { background-position: -32px -32px; } .ui-icon-arrow-1-se { background-position: -48px -32px; } .ui-icon-arrow-1-s { background-position: -64px -32px; } .ui-icon-arrow-1-sw { background-position: -80px -32px; } .ui-icon-arrow-1-w { background-position: -96px -32px; } .ui-icon-arrow-1-nw { background-position: -112px -32px; } .ui-icon-arrow-2-n-s { background-position: -128px -32px; } .ui-icon-arrow-2-ne-sw { background-position: -144px -32px; } .ui-icon-arrow-2-e-w { background-position: -160px -32px; } .ui-icon-arrow-2-se-nw { background-position: -176px -32px; } .ui-icon-arrowstop-1-n { background-position: -192px -32px; } .ui-icon-arrowstop-1-e { background-position: -208px -32px; } .ui-icon-arrowstop-1-s { background-position: -224px -32px; } .ui-icon-arrowstop-1-w { background-position: -240px -32px; } .ui-icon-arrowthick-1-n { background-position: 0 -48px; } .ui-icon-arrowthick-1-ne { background-position: -16px -48px; } .ui-icon-arrowthick-1-e { background-position: -32px -48px; } .ui-icon-arrowthick-1-se { background-position: -48px -48px; } .ui-icon-arrowthick-1-s { background-position: -64px -48px; } .ui-icon-arrowthick-1-sw { background-position: -80px -48px; } .ui-icon-arrowthick-1-w { background-position: -96px -48px; } .ui-icon-arrowthick-1-nw { background-position: -112px -48px; } .ui-icon-arrowthick-2-n-s { background-position: -128px -48px; } .ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; } .ui-icon-arrowthick-2-e-w { background-position: -160px -48px; } .ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; } .ui-icon-arrowthickstop-1-n { background-position: -192px -48px; } .ui-icon-arrowthickstop-1-e { background-position: -208px -48px; } .ui-icon-arrowthickstop-1-s { background-position: -224px -48px; } .ui-icon-arrowthickstop-1-w { background-position: -240px -48px; } .ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; } .ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; } .ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; } .ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; } .ui-icon-arrowreturn-1-w { background-position: -64px -64px; } .ui-icon-arrowreturn-1-n { background-position: -80px -64px; } .ui-icon-arrowreturn-1-e { background-position: -96px -64px; } .ui-icon-arrowreturn-1-s { background-position: -112px -64px; } .ui-icon-arrowrefresh-1-w { background-position: -128px -64px; } .ui-icon-arrowrefresh-1-n { background-position: -144px -64px; } .ui-icon-arrowrefresh-1-e { background-position: -160px -64px; } .ui-icon-arrowrefresh-1-s { background-position: -176px -64px; } .ui-icon-arrow-4 { background-position: 0 -80px; } .ui-icon-arrow-4-diag { background-position: -16px -80px; } .ui-icon-extlink { background-position: -32px -80px; } .ui-icon-newwin { background-position: -48px -80px; } .ui-icon-refresh { background-position: -64px -80px; } .ui-icon-shuffle { background-position: -80px -80px; } .ui-icon-transfer-e-w { background-position: -96px -80px; } .ui-icon-transferthick-e-w { background-position: -112px -80px; } .ui-icon-folder-collapsed { background-position: 0 -96px; } .ui-icon-folder-open { background-position: -16px -96px; } .ui-icon-document { background-position: -32px -96px; } .ui-icon-document-b { background-position: -48px -96px; } .ui-icon-note { background-position: -64px -96px; } .ui-icon-mail-closed { background-position: -80px -96px; } .ui-icon-mail-open { background-position: -96px -96px; } .ui-icon-suitcase { background-position: -112px -96px; } .ui-icon-comment { background-position: -128px -96px; } .ui-icon-person { background-position: -144px -96px; } .ui-icon-print { background-position: -160px -96px; } .ui-icon-trash { background-position: -176px -96px; } .ui-icon-locked { background-position: -192px -96px; } .ui-icon-unlocked { background-position: -208px -96px; } .ui-icon-bookmark { background-position: -224px -96px; } .ui-icon-tag { background-position: -240px -96px; } .ui-icon-home { background-position: 0 -112px; } .ui-icon-flag { background-position: -16px -112px; } .ui-icon-calendar { background-position: -32px -112px; } .ui-icon-cart { background-position: -48px -112px; } .ui-icon-pencil { background-position: -64px -112px; } .ui-icon-clock { background-position: -80px -112px; } .ui-icon-disk { background-position: -96px -112px; } .ui-icon-calculator { background-position: -112px -112px; } .ui-icon-zoomin { background-position: -128px -112px; } .ui-icon-zoomout { background-position: -144px -112px; } .ui-icon-search { background-position: -160px -112px; } .ui-icon-wrench { background-position: -176px -112px; } .ui-icon-gear { background-position: -192px -112px; } .ui-icon-heart { background-position: -208px -112px; } .ui-icon-star { background-position: -224px -112px; } .ui-icon-link { background-position: -240px -112px; } .ui-icon-cancel { background-position: 0 -128px; } .ui-icon-plus { background-position: -16px -128px; } .ui-icon-plusthick { background-position: -32px -128px; } .ui-icon-minus { background-position: -48px -128px; } .ui-icon-minusthick { background-position: -64px -128px; } .ui-icon-close { background-position: -80px -128px; } .ui-icon-closethick { background-position: -96px -128px; } .ui-icon-key { background-position: -112px -128px; } .ui-icon-lightbulb { background-position: -128px -128px; } .ui-icon-scissors { background-position: -144px -128px; } .ui-icon-clipboard { background-position: -160px -128px; } .ui-icon-copy { background-position: -176px -128px; } .ui-icon-contact { background-position: -192px -128px; } .ui-icon-image { background-position: -208px -128px; } .ui-icon-video { background-position: -224px -128px; } .ui-icon-script { background-position: -240px -128px; } .ui-icon-alert { background-position: 0 -144px; } .ui-icon-info { background-position: -16px -144px; } .ui-icon-notice { background-position: -32px -144px; } .ui-icon-help { background-position: -48px -144px; } .ui-icon-check { background-position: -64px -144px; } .ui-icon-bullet { background-position: -80px -144px; } .ui-icon-radio-off { background-position: -96px -144px; } .ui-icon-radio-on { background-position: -112px -144px; } .ui-icon-pin-w { background-position: -128px -144px; } .ui-icon-pin-s { background-position: -144px -144px; } .ui-icon-play { background-position: 0 -160px; } .ui-icon-pause { background-position: -16px -160px; } .ui-icon-seek-next { background-position: -32px -160px; } .ui-icon-seek-prev { background-position: -48px -160px; } .ui-icon-seek-end { background-position: -64px -160px; } .ui-icon-seek-start { background-position: -80px -160px; } /* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */ .ui-icon-seek-first { background-position: -80px -160px; } .ui-icon-stop { background-position: -96px -160px; } .ui-icon-eject { background-position: -112px -160px; } .ui-icon-volume-off { background-position: -128px -160px; } .ui-icon-volume-on { background-position: -144px -160px; } .ui-icon-power { background-position: 0 -176px; } .ui-icon-signal-diag { background-position: -16px -176px; } .ui-icon-signal { background-position: -32px -176px; } .ui-icon-battery-0 { background-position: -48px -176px; } .ui-icon-battery-1 { background-position: -64px -176px; } .ui-icon-battery-2 { background-position: -80px -176px; } .ui-icon-battery-3 { background-position: -96px -176px; } .ui-icon-circle-plus { background-position: 0 -192px; } .ui-icon-circle-minus { background-position: -16px -192px; } .ui-icon-circle-close { background-position: -32px -192px; } .ui-icon-circle-triangle-e { background-position: -48px -192px; } .ui-icon-circle-triangle-s { background-position: -64px -192px; } .ui-icon-circle-triangle-w { background-position: -80px -192px; } .ui-icon-circle-triangle-n { background-position: -96px -192px; } .ui-icon-circle-arrow-e { background-position: -112px -192px; } .ui-icon-circle-arrow-s { background-position: -128px -192px; } .ui-icon-circle-arrow-w { background-position: -144px -192px; } .ui-icon-circle-arrow-n { background-position: -160px -192px; } .ui-icon-circle-zoomin { background-position: -176px -192px; } .ui-icon-circle-zoomout { background-position: -192px -192px; } .ui-icon-circle-check { background-position: -208px -192px; } .ui-icon-circlesmall-plus { background-position: 0 -208px; } .ui-icon-circlesmall-minus { background-position: -16px -208px; } .ui-icon-circlesmall-close { background-position: -32px -208px; } .ui-icon-squaresmall-plus { background-position: -48px -208px; } .ui-icon-squaresmall-minus { background-position: -64px -208px; } .ui-icon-squaresmall-close { background-position: -80px -208px; } .ui-icon-grip-dotted-vertical { background-position: 0 -224px; } .ui-icon-grip-dotted-horizontal { background-position: -16px -224px; } .ui-icon-grip-solid-vertical { background-position: -32px -224px; } .ui-icon-grip-solid-horizontal { background-position: -48px -224px; } .ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; } .ui-icon-grip-diagonal-se { background-position: -80px -224px; } /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px/*{cornerRadius}*/; -webkit-border-top-left-radius: 4px/*{cornerRadius}*/; -khtml-border-top-left-radius: 4px/*{cornerRadius}*/; border-top-left-radius: 4px/*{cornerRadius}*/; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px/*{cornerRadius}*/; -webkit-border-top-right-radius: 4px/*{cornerRadius}*/; -khtml-border-top-right-radius: 4px/*{cornerRadius}*/; border-top-right-radius: 4px/*{cornerRadius}*/; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px/*{cornerRadius}*/; -webkit-border-bottom-left-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-left-radius: 4px/*{cornerRadius}*/; border-bottom-left-radius: 4px/*{cornerRadius}*/; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px/*{cornerRadius}*/; -webkit-border-bottom-right-radius: 4px/*{cornerRadius}*/; -khtml-border-bottom-right-radius: 4px/*{cornerRadius}*/; border-bottom-right-radius: 4px/*{cornerRadius}*/; } /* Overlays */ .ui-widget-overlay { background: #aaaaaa/*{bgColorOverlay}*/ url(/Content/themes/base/minified/images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlOverlay}*/ 50%/*{bgOverlayXPos}*/ 50%/*{bgOverlayYPos}*/ repeat-x/*{bgOverlayRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityOverlay}*/; } .ui-widget-shadow { margin: -8px/*{offsetTopShadow}*/ 0 0 -8px/*{offsetLeftShadow}*/; padding: 8px/*{thicknessShadow}*/; background: #aaaaaa/*{bgColorShadow}*/ url(/Content/themes/base/minified/images/ui-bg_flat_0_aaaaaa_40x100.png)/*{bgImgUrlShadow}*/ 50%/*{bgShadowXPos}*/ 50%/*{bgShadowYPos}*/ repeat-x/*{bgShadowRepeat}*/; opacity: .3;filter:Alpha(Opacity=30)/*{opacityShadow}*/; -moz-border-radius: 8px/*{cornerRadiusShadow}*/; -khtml-border-radius: 8px/*{cornerRadiusShadow}*/; -webkit-border-radius: 8px/*{cornerRadiusShadow}*/; border-radius: 8px/*{cornerRadiusShadow}*/; } .headerWhiteBackgroundWrap { background-color: #ffffff; border-bottom: 5px solid #f9c229; box-sizing: content-box; margin: 0; padding: 0; position: relative; } .logoPartialWhiteBackground { display: block; } .logoPartialWhiteBackground .logoWrap { bottom: 0; box-sizing: content-box; height: auto; left: 0; padding: 12px 0; position: relative; right: 0; top: 0; } .logoPartialWhiteBackground .logoWrap .aaLogoSt0 { fill: #56565a; } .logoPartialWhiteBackground .logoWrap .aaLogoSt1 { fill: #FFC229; } .logoPartialWhiteBackground .logoWrap .aaLogoSt2 { fill: #FFC228; } .aaLogoNoLinkSt0 { fill: #56565a; } .aaLogoNoLinkSt1 { fill: #FFC229; } .aaLogoNoLinkSt2 { fill: #FFC228; } .loginLinkWrap { padding: 5px 10px 5px 10px; position: absolute; right: 0; top: 24px; border-radius: 5px; border: 2px solid darkslategrey; font-family:'opensansregular', "Open Sans", sans-serif, Helvetica, Arial; } .loginLinkWrap a { color: #464646; font-family: Helvetica, Arial, sans-serif; font-size: 11px; font-weight: normal; text-decoration: none; } .loginLinkWrap a:hover, .loginLinkWrap a:focus { color: #7e7e7e; } .loginLinkWrap a .loginIconWrap { display: block; height: 28px; margin: 0 auto; width: 28px; } .loginLinkWrap a .loginIconWrap svg { } .loginLinkWrap a .loginIconWrap #loginIconBG { fill: #464646 } .loginLinkWrap a:hover .loginIconWrap #loginIconBG { fill: #7e7e7e; } .loginLinkWrap a .loginIconWrap #loginIconHead, .loginLinkWrap a .loginIconWrap #loginIconBody { fill: #fff; } .loginLinkWrap a .loginTextWrap { /* The login text */ margin: 3px 0 0 0; text-align: center; font-weight: bold; font-size: medium; font-family:'opensansregular', "Open Sans", sans-serif, Helvetica, Arial; color: #464646; } .svgVerticalAlign { vertical-align:top; } .danicaPhoneNumber { float: right; margin-top: -49px; position: relative; } .danicaPhoneNumber label { color: #56565a; font-size: 12px !important; position: relative; text-align: right; } @media only screen and (max-width: 40.5em) { .logoPartialWhiteBackground .logoWrap, #aaLogoHorizontal { /* This overrides the Header.css styles. Instead of switching to the A, the logo will become smaller. */ display: block !important; height: 46px !important; width: 160px !important; } .logoPartialWhiteBackground .logoMobileWrap { display: none !important; } .loginLinkWrap { top: 16px; } .danicaPhoneNumber { margin-top: -45px; } } /* Keep all of the custom fonts in this file and load it across the website. More info about font optimizations: https://developers.google.com/web/fundamentals/performance/optimizing-content-efficiency/webfont-optimization Serve WOFF 2.0 variant to browsers that support it. Serve WOFF variant to the majority of browsers. Serve TTF variant to old Android (below 4.4) browsers. Serve EOT variant to old IE (below IE9) browsers. */ @font-face { font-family: 'bankCheckFont'; font-display: swap; /* auto, block, swap, fallback, optional */ src: url('/Fonts/micrenc.ttf'); /* http://www.1001fonts.com/micr-encoding-font.html#styles */ } @font-face { font-family: 'opensanslight'; font-display: swap; src: url('/Fonts/opensans-light-webfont.woff') format('woff'), url('/Fonts/opensans-light-webfont.eot?#iefix') format('embedded-opentype'), url('/Fonts/opensans-light-webfont.ttf') format('truetype'), url('/Fonts/opensans-light-webfont.svg#open_sanslight') format('svg'); /* http://www.1001fonts.com/micr-encoding-font.html#styles */ } @font-face { font-family: 'opensansregular'; font-display: swap; src: url('/Fonts/opensans-regular-webfont.woff') format('woff'), url('/Fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/Fonts/opensans-regular-webfont.ttf') format('truetype'), url('/Fonts/opensans-regular-webfont.svg#open_sansregular') format('svg'); } @font-face { font-family: 'opensanssemibold'; font-display: swap; src: url('/Fonts/opensans-semibold-webfont.woff') format('woff'), url('/Fonts/opensans-semibold-webfont.eot?#iefix') format('embedded-opentype'), url('/Fonts/opensans-semibold-webfont.ttf') format('truetype'), url('/Fonts/opensans-semibold-webfont.svg#open_sanssemibold') format('svg'); } /*Global------------------------------------------ ---------------------------------------------------------------------------------------------*/ /* The @font-face should only live in FontFace.css from now on. Any other custom fonts should be added to FontFace.css */ #divDoclistItem_BankConnFail ul li { margin-left: 20px; list-style-type: disc; } .NoBlackBackground { background-color: #fafafa !important; } .noPaddingForRefi { padding: 0 !important; } #divDoclistItem { padding-left: 2em; } #divDoclistItem ul li { margin-left: 20px; list-style-type: none; font-size: 16px; } #divDocs_uploadLaterPopUp ul li { margin-left: 130px; list-style-type: disc; } .repositionSpinner { height: 150px !important; top: initial !important; bottom: 400px !important; } .tooltip.in { opacity: 1 !important; } .paddingTop20 { padding-top: 20px; } /*STARTING Optimizely Code*/ .redirectToPendingEsignBtn { height: 59px; width: 254px; border-radius: 3px; background-color: #fec63f; color: #333333; font-size: 16px; font-weight: bold; margin-bottom: 30px; border: none; display: block; padding: 1em; } .centerDivSignDocs { text-align: center; } .openSansRegular *, .openSansRegular { font-family: 'opensansregular' !important; } .openSansBold *, .openSansBold { font-family: 'opensanssemibold' !important; } .openSansLight *, .openSansLight { font-family: 'open_sanslight' !important; } .posEsignheader { font-size: 28px; font-weight: bold; color: #555555; } .posEsignheaderReqDoc { font-size: 28px; font-weight: bold; color: #555555; text-align: center; font-family: 'opensansregular' !important; margin-top: 2em; } .makeZeroPaymentMsg { font-size: 16px; color: #555555; } .posEsignHr { width: 84%; margin-right: 7%; margin-left: 8%; border: 1px solid #E5E5E5 !important; } .customerErrorMsg { background: #FFC429; border-radius: 3px; padding: 1em; color: #333333; } .posEsignHrWithlessMarginBottom { width: 84%; margin-right: 7%; margin-left: 8%; border: 1px solid #E5E5E5 !important; margin-bottom: 4px; } .zeroAuthErrorMessageResponseStyle { color: #C60909; font-size: 14px; } .selectLanguageToggle select { background: transparent; margin-left: 79%; color: #54565b; font-weight: 300; padding: 2px; font-family: opensansregular; font-size: 1em; border: 1px solid #9B9B9B; border-radius: 4px; } .expirationStorePickup { margin-left: 8%; font-size: 12px; } .eSignThankyouH1 { text-align: center; font-weight: bold; margin-bottom: 40px; } .eSignThankYouP { /*text-align: center;*/ margin-bottom: 15px; font-size: 18px; } .posRefiBox { background: #2d94b6; box-shadow: 0 1px 2px rgba(0,0,0,.256693); border-radius: 8px; padding: 1.5em; } .POSRefiTextp { color: #ffffff; font-weight: bold; padding-top: 1em; margin: 1em 0 0; } .accountSummaryThankyouMsgP { font-size: 16px; font-weight: bold; margin-top: 0; } .accountSummaryThankyouMsg { font-size: 16px; margin-top: 0; } .uploadNowValidationMsgpP { color: #c1272d; font-size: 14px; font-weight: 100; } .accountSumaryNoProductMsg { font-size: 16px !important; margin-top: 18px !important; padding-bottom: 4% !important; } .uploadLaterStyles { font-size: 16px; font-weight: bold; text-decoration: underline; } .InlineBlockLinePOI { text-align: center; padding: 1.5em 0; } .POIHR { margin: 0 0 0.5em 0 !important; border-color: #979797 !important; background-color: #979797 !important; } .POIHRDiv { width: 43%; display: inline-grid !important; } .accountSummaryThankyouMsgh { font-size: 28px; font-weight: bold; margin-bottom: 8px; } .eSignNewDiv { margin-left: 7%; } .fontStyle { font-size: 16px !important; font-weight: bold; } .eSignNewThankyouH1 { font-weight: bold; margin-bottom: 30px; color: #555555; } .pdfImgSize { height: 21px; margin-right: 5px; } .eSignNewThankYouP { font-size: 16px; margin: 0px; color: #555555; margin-bottom: 20px; } .posRefiBox { background: #2D94B6; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.256693); border-radius: 8px; padding: 1.5em; } .POSRefiTextp { color: #ffffff; font-weight: bold; padding-top: 1em; margin: 1em 0 0; } .eSignNewThankYouA { color: #2093B6; font-weight: bold; } .eSignNewThankYouPContact { font-size: 14px; margin-top: 0; margin-bottom: 15px; } .adverseActionOnlinetoStoreConcerns { font-size: 14px !important; font-weight: bold !important; text-align: center; } .eSignThankYouPContact { /*text-align: center;*/ margin-top: -10px; font-size: 16px; } .eSignThankyouIPASurveyWrap { text-align: center; margin-top: 45px; } .eSignThankyouIPASurveyBtn { background-color: #ffc423; border: none; border-radius: 3px; text-align: center; font-size: 26px; cursor: pointer; padding: 20px 40px; color: #000; font-weight: 500; border-style: solid; border-color: #ffc423; } .adverseActionOnlinetoStore { font-weight: bold; font-size: 28px; color: #555555; margin-bottom: 0; margin-top: 2em; text-align: center; } /* TODO - This is a duplicate with Instantfunding.css: */ .customer_account_details_tabapay_Select_option_MM { width: 60% !important; height: 2em; font-size: 14px; color: #555555; padding-left: 2px; border: 1px dashed #CECECE; background-color: #F0F0F0 !important; } .customer_account_details_tabapay_Select_option_YYYY { margin-left: 1em; width: calc(40% - 1em); height: 2em; font-size: 14px; color: #555555; padding-left: 2px; border: 1px dashed #CECECE; background-color: #F0F0F0 !important; } .eSignThankyouIPASurveyText { font-size: 24px; } .eSignThankyouIPASurveyBtn:active, .eSignThankyouIPASurveyBtn:hover { background-color: #ffc423; border-color: #ffc423; } .militaryDisclosure { position: relative; font-weight: 500; font-size: 1.5em; top: 5px; } .otherAgreements { position: relative; font-weight: 500; font-size: 1.5em; bottom: 5px; } .NewProductIcons { height: 74px; width: 100px; } .sectionStepTitle { color: #000000; font-size: 20px; font-weight: 500; padding-bottom: 20px; } #fourstepProgBar { background-color: #f6f5f4; color: #8F8C87; position: relative; bottom: 20px; } #fourstepProgBar ol { position: relative; bottom: 14px; } #fourstepProgBar ol li { width: 25%; } .noTransactionFound { font-size: 12px !important; } .loanhistoryheadertext { font-size: 20px; font-weight: bold; } .offerSteps .probarFourStepProgBar { top: 16px; background-color: #8F8C87; width: 72%; max-width: 900px; height: 2px; } .positionRelative { position: relative; } .bankingDisclaimer { min-height: 35px; padding-bottom: 10px; } .upload-bk-color { background: #3293b8 !important; border-color: #3293b8 !important; color: white !important; } .uploadbtnDisabled { background-color: #EBEBEB !important; border: 1px solid !important; border-color: #C4C4C4 !important; color: white !important; cursor: default !important; text-shadow: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; } .WiMaritalStatus1 { margin-left: 15%; width: 58%; } .WiMaritalStatus2 { margin: 0 0 0 0 !important; } .mtop10 { margin-top: 10px; } .leftmright10 { float: left; margin-right: 10px; } #fourstepProgBar .confirmOffer .offerStepsList { max-width: 1210px; } @media only screen and (min-device-width: 320px) and (max-device-width: 823px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) { #divDocs_uploadLaterPopUp ul li { margin-left: 20px; } } @media only screen and (max-width:450px) { .centerButtonPOI { margin: 1em auto; text-align: left; font-size: 16px; font-weight: bold; } } @media only screen and (max-width:1038px) { .POIHRDiv { width: 45%; } .repositionSpinner { height: 150px !important; top: initial !important; bottom: 300px !important; } } @media only screen and (max-width:622px) { .POIHRDiv { width: 40%; } .repositionSpinner { height: 150px !important; top: initial !important; bottom: 100px !important; } } @media only screen and (max-width:40.5em) { #fourstepProgBar { bottom: 0; } .informationPolicyExp2 { display: none; } .mobileVersion { display: block !important; } .progressBarSection:nth-child(2) { position: static; left: 0; } .progressBarSection:nth-child(3) { position: static; left: 0; } .sectionTitle { padding-top: 20px; } #contactInfo, #incomeInfo { position: relative; bottom: 10px; } } /*iPhone 6s Landscape */ @media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) { #fourstepProgBar { bottom: 20px !important; } } /*iPad Landscape */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) { .offerSteps .probarFourStepProgBar { width: 75%; right: 10px; } #fourstepProgBar { bottom: 0 !important; } } /* iPad Portrait */ @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) { #divDocs_uploadLaterPopUp ul li { margin-left: 130px; } .offerSteps .probarFourStepProgBar { width: 75%; right: 10px; } .sectionTitle { margin-left: 40px; } } /* Samsung Galaxy s5 */ @media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) { .repositionSpinner { height: 150px !important; top: initial !important; bottom: 100px !important; } } /*Task 20581:WEB - Replicate CFSA Bullets Found on AA.net Home Page (https://www.advanceamerica.net/about-us/cfsa) */ /*Flex Grid Properties*/ .flexColumn { display: -webkit-flex; display: flexbox; -webkit-flex-direction: row; flex-direction: row; -webkit-justify-content: space-between; justify-content: space-between; } .preApproveBreak { display: block; } .cd-filter { /* SVG animation style switcher - not needed in production */ margin-top: 1em; text-align: center; } .cd-filter li { display: inline-block; margin: 4px; } .cd-filter a { display: block; border-bottom: 2px solid rgba(76, 92, 98, 0); padding: .8em 1em; font-size: 1.2rem; font-weight: bold; text-transform: uppercase; letter-spacing: .1em; color: #4c5c62; } .no-touch .cd-filter a:hover { border-bottom: 2px solid rgba(76, 92, 98, 0.6); } .cd-filter a.selected { color: #00A7E1; border-bottom: 2px solid rgba(0, 167, 225, 0.4); } .no-touch .cd-filter a.selected:hover { border-bottom: 2px solid rgba(0, 167, 225, 0.4); } @media only screen and (min-width: 768px) { .cd-filter { margin-top: 2em; } } /* -------------------------------- Slider -------------------------------- */ .cd-slider-wrapper { position: relative; width: 100%; margin: auto; /* hide horizontal scrollbar on IE11 */ overflow-x: hidden; } .cd-slider > li { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; /* hide vertical scrollbar on IE11 */ overflow: hidden; } .cd-slider > li.visible { position: relative; z-index: 2; opacity: 1; } .cd-slider > li.is-animating { z-index: 3; opacity: 1; } .cd-slider .cd-svg-wrapper { /* using padding Hack to fix bug on IE - svg height not properly calculated */ height: 0; padding-bottom: 39.15%; } /*Review Carousel Styles*/ .reviewCarouselWrap { position: relative; margin: 0px auto; top: 0px; left: 0px; width: 1000px; height: 400px; overflow: hidden; visibility: visible; } .reviewCarouselSlides { cursor: default; position: relative; top: 0px; left: 0px; width: 1000px; height: 400px; overflow: hidden; } /* Width: 100vw - We want it to fill the width of the view port, and not extend beyond it. */ .reviewCarouselCaption { position: absolute; top: 44%; width: 100vw; padding-left: 10%; padding-right: 10%; height: auto; background-color: transparent; font-size: 18px; line-height: 1.5em; color: #ffffff; text-align: center; pointer-events: none; text-shadow: 2px 2px 3px #333; } .reviewImg1 { display: none; } .reviewImg2 { display: block; } .reviewCarouselImg { position: relative; left: 0; } .fiveStar { position: absolute; bottom: 9%; text-align: center; margin: auto; display: block; width: 100vw; filter: drop-shadow(0px 0px 3px #4d4d4d); -webkit-filter: drop-shadow(0px 0px 3px #4d4d4d); } .fiveStar svg { height: 26px; width: 192px; } .starPolygon { fill: #FFC72A; } .jssorb01 { position: absolute; } .jssorb01 div, .jssorb01 div:hover, .jssorb01 .av { position: absolute; /* size of bullet element */ width: 12px; height: 12px; filter: alpha(opacity=70); opacity: .7; overflow: hidden; cursor: pointer; border: #000 1px solid; } .jssorb01 div { background-color: gray; } .jssorb01 div:hover, .jssorb01 .av:hover { background-color: #d3d3d3; } .jssorb01 .av { background-color: #fff; } .jssorb01 .dn, .jssorb01 .dn:hover { background-color: #555555; } .jssora02l, .jssora02r { display: none; position: absolute; /* size of arrow element */ width: 55px; height: 55px; cursor: pointer; background: url('/Images/a21.png') no-repeat; overflow: hidden; } .jssora02l { background-position: -3px -33px; } .jssora02r { background-position: -63px -33px; } .jssora02l:hover { background-position: -123px -33px; } .jssora02r:hover { background-position: -183px -33px; } .jssora02l.jssora02ldn { background-position: -3px -33px; } .jssora02r.jssora02rdn { background-position: -63px -33px; } /* -------------------------------- Slider navigation -------------------------------- */ .cd-slider-navigation li { position: absolute; z-index: 3; top: 51%; bottom: auto; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); right: 10px; height: 64px; width: 48px; } .cd-slider-navigation li a { display: block; height: 100%; overflow: hidden; /*text-indent: 100%;*/ white-space: nowrap; color: transparent; /*background:url(/Images/cd-icon-arrows.svg); using CSS ICONS instead of SVG*/ -webkit-transition: -webkit-transform 0.2s; -moz-transition: -moz-transform 0.2s; transition: transform 0.2s; } .cd-slider-navigation li:last-of-type { left: 10px; right: auto; } .cd-slider-navigation li:last-of-type a { background-position: -48px 0; } .no-touch .cd-slider-navigation li a:hover { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -ms-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1); } /* -------------------------------- Slider dots/controls -------------------------------- */ .cd-slider-controls { display: none; position: absolute; padding: 0; bottom: 20px; left: 50%; right: auto; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); z-index: 3; text-align: center; width: 90%; } .cd-slider-controls::after { clear: both; content: ""; display: table; } .cd-slider-controls li { display: inline-block; margin-right: 10px; } .cd-slider-controls li:last-of-type { margin-right: 0; } .cd-slider-controls li.selected a { background-color: #ffffff; } .cd-slider-controls a { display: block; /* image replacement */ overflow: hidden; text-indent: 100%; white-space: nowrap; color: transparent; height: 10px; width: 10px; border-radius: 50%; border: 2px solid #ffffff; } .no-touch .cd-slider-controls a:hover { background-color: #ffffff; } .checkmarkContents { display: none; } .checkmark-circle { width: 35px; height: 35px; position: relative; display: none; vertical-align: middle; } .checkmark-circle .checkmark-background { width: 35px; height: 35px; border-radius: 50%; background: #2EB150; position: absolute; } .checkmark-circle .x-checkmark-background { width: 34.5px; height: 34.5px; border-radius: 50%; background: red; position: absolute; } .checkmark-circle .checkmark, .checkmark-circle .x-checkmark { border-radius: 5px; } .checkmark-circle .checkmark.draw:after { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; animation-delay: 100ms; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-name: checkmark; -moz-animation-name: checkmark; animation-name: checkmark; -webkit-transform: scaleX(-1) rotate(135deg); -moz-transform: scaleX(-1) rotate(135deg); -ms-transform: scaleX(-1) rotate(135deg); -o-transform: scaleX(-1) rotate(135deg); transform: scaleX(-1) rotate(135deg); -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; } .checkmark-circle .x-checkmark.draw:after { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; animation-delay: 100ms; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-name: checkmark; -moz-animation-name: checkmark; animation-name: checkmark; -webkit-transform: scaleX(-1) rotate(135deg); -moz-transform: scaleX(-1) rotate(135deg); -ms-transform: scaleX(-1) rotate(135deg); -o-transform: scaleX(-1) rotate(135deg); transform: scaleX(-1) rotate(135deg); -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; } .checkmark-circle .x-checkmark.draw:before { -webkit-animation-delay: 100ms; -moz-animation-delay: 100ms; animation-delay: 100ms; -webkit-animation-duration: 1s; -moz-animation-duration: 1s; animation-duration: 1s; -webkit-animation-timing-function: ease; -moz-animation-timing-function: ease; animation-timing-function: ease; -webkit-animation-name: checkmark; -moz-animation-name: checkmark; animation-name: checkmark; -webkit-transform: scaleX(-1) rotate(225deg); -moz-transform: scaleX(-1) rotate(225deg); -ms-transform: scaleX(-1) rotate(225deg); -o-transform: scaleX(-1) rotate(225deg); transform: scaleX(-1) rotate(225deg); -webkit-animation-fill-mode: forwards; -moz-animation-fill-mode: forwards; animation-fill-mode: forwards; } .checkmark-circle .checkmark:after { opacity: 1; height: 75px; width: 37.5px; -webkit-transform-origin: left top; -moz-transform-origin: left top; -ms-transform-origin: left top; -o-transform-origin: left top; transform-origin: left top; border-right: 3px solid white; border-top: 3px solid white; border-radius: 2.5px !important; content: ''; left: 4px; top: 19px; position: absolute; } .checkmark-circle .x-checkmark:after { opacity: 1; height: 75px; width: 37.5px; -webkit-transform-origin: left top; -moz-transform-origin: left top; -ms-transform-origin: left top; -o-transform-origin: left top; transform-origin: left top; border-right: 3px solid white; border-top: 0px solid white; border-radius: 2.5px !important; content: ''; left: 2px; top: 16.5px; position: absolute; } .checkmark-circle .x-checkmark:before { opacity: 1; height: 75px; width: 37.5px; -webkit-transform-origin: right top; -moz-transform-origin: right top; -ms-transform-origin: right top; -o-transform-origin: right top; transform-origin: right top; border-right: 3px solid white; border-top: 0px solid white; border-radius: 2.5px !important; content: ''; left: 12px; top: 23.25px; position: absolute; } .ex { stroke: green; stroke-dashoffset: 745.74853515625; stroke-dasharray: 745.74853515625; animation: ex 1s ease-out forwards infinite; } @-webkit-keyframes dash { to { stroke-dashoffset: 100; } } @-moz-keyframes dash { to { stroke-dashoffset: 100; } } @keyframes dash { to { stroke-dashoffset: 100; } } @-webkit-keyframes stroke { 100% { stroke-dashoffset: 0; } } @-moz-keyframes stroke { 100% { stroke-dashoffset: 0; } } @keyframes stroke { 100% { stroke-dashoffset: 0; } } @-webkit-keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } } @-moz-keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } } @keyframes scale { 0%, 100% { transform: none; } 50% { transform: scale3d(1.1, 1.1, 1); } } @-webkit-keyframes fill { 100% { box-shadow: inset 0px 0px 0px 30px #ffc423; } } @-moz-keyframes fill { 100% { box-shadow: inset 0px 0px 0px 30px #ffc423; } } @keyframes fill { 100% { box-shadow: inset 0px 0px 0px 30px #ffc423; } } @keyframes ex { 0% { stroke-dashoffset: 745.74853515625; } 100% { stroke-dashoffset: 2; } } @-webkit-keyframes checkmark { 0% { height: 0; width: 0; opacity: 1; } 20% { height: 0; width: 10px; opacity: 1; } 40% { height: 38px; width: 10px; opacity: 1; } 100% { height: 38px; width: 10px; opacity: 1; } } @-moz-keyframes checkmark { 0% { height: 0; width: 0; opacity: 1; } 20% { height: 0; width: 10px; opacity: 1; } 40% { height: 20px; width: 10px; opacity: 1; } 100% { height: 20px; width: 10px; opacity: 1; } } @keyframes checkmark { 0% { height: 0; width: 0; opacity: 1; } 20% { height: 0; width: 10px; opacity: 1; } 40% { height: 20px; width: 10px; opacity: 1; } 100% { height: 20px; width: 10px; opacity: 1; } } .check { stroke-dasharray: 130px 130px; stroke-dashoffset: 130px; -webkit-transition: stroke-dashoffset 4.1s linear 0s; transition: stroke-dashoffset 500ms ease-in-out; } .width-3-4 { width: 75%; } .phoneStamp { display: none; vertical-align: top; float: right; text-align: center; background-color: #333333; color: #ffffff; padding: 3% 3%; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; max-width: 30%; } .phoneStamp p { max-width: 190px; font-size: 14px; /*font-weight:bold;*/ } .phoneStamp h2 { font-size: 16px; } #companyHours { text-align: left; } .upCaret, .downCaret { position: relative; cursor: pointer; } .upCaret:before { content: ''; position: absolute; top: 0; left: 10px; border-left: 11px solid #999; border-top: 11px solid transparent; border-bottom: 11px solid transparent; } .upCaret:after { content: ''; position: absolute; left: 10px; top: 1px; border-left: 10px solid #000; border-top: 10px solid transparent; border-bottom: 10px solid transparent; } .upCaretBlue:after { border-left: 10px solid #2D94B6; /* old color - #186d98 */ } .downCaret:before { content: ''; position: absolute; top: 5px; left: 5px; border-top: 11px solid #999; border-left: 11px solid transparent; border-right: 11px solid transparent; } .downCaret:after { content: ''; position: absolute; left: 6px; top: 5px; border-top: 10px solid #000; border-left: 10px solid transparent; border-right: 10px solid transparent; } .downCaretBlue:after { border-top: 10px solid #2D94B6; /* old color - #186d98 */ } /*DIRECT MAIL STYLES*/ /*#confirmOfferForm input:hover, #confirmOfferForm input:focus { border-width: 1px; box-shadow: 0 0 3px #ffc423; border-color: #ffc423; } #confirmOfferForm input:disabled:hover { border: 1px solid #d5d5d5; box-shadow: none; }*/ .offerForm input[type="text"]:disabled { background: rgb(235, 235, 228) !important; box-shadow: none; color: #222222; } .offerForm fieldset { position: relative; } .offerForm .field-validation-error { background: #333; color: #fff; text-align: center; } .offerForm .field-validation-error:before { border-bottom: 0.625em solid #333; } .offerForm .SectionNeedsInfo input[type="text"] { border: 1px solid #3293B8; } .SectionNeedsInfo input::-webkit-input-placeholder { color: #3293B8; } .SectionNeedsInfo input:-moz-placeholder { /* Firefox 18- */ color: #3293B8; } .SectionNeedsInfo input::-moz-placeholder { /* Firefox 19+ */ color: #3293B8; } .SectionNeedsInfo input:-ms-input-placeholder { color: #3293B8; } .SectionNeedsClarity, .posRelative { position: relative; } .tooltipMsgIcn, .tooltipPopIcn { background: #F5AA1B; color: black; padding: 0px 8px; /* height: 5px; */ position: absolute; right: 18px; top: 10px; -moz-border-radius: 35px; -webkit-border-radius: 35px; -ms-border-radius: 35px; border-radius: 35px; font-weight: 600; font-family: 'Calisto MT'; cursor: pointer; z-index: 1001; } .tooltipMsgBox { /*content: "The information in this field cannont be changed.";*/ display: none; background: #333333; color: #fff; font-weight: 500; padding: 12px; opacity: 0; position: absolute; bottom: 41px; right: -2px; width: 200px; text-align: center; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; -webkit-box-shadow: 0px 2px 7px -2px; -moz-box-shadow: 0px 2px 7px -2px; box-shadow: 0px 2px 7px -2px; pointer-events: none; z-index: 1002; } .tooltipMsgBox:after { border-left: 0.625em solid transparent; border-right: 0.625em solid transparent; border-top: 0.625em solid #333; bottom: -8px; content: ''; display: block; left: 86%; margin-left: -3%; position: absolute; } #confirmOfferForm > .toolTipMsgBox { top: -62px; } /* Hide the Google ReCaptcha badge, which is used for the V3 scoring. Instead, the footer will have Google's privacy policy and terms of service. */ .grecaptcha-badge { display: none !important; } #recaptchaCheckBox { overflow: hidden; /* The smallest screens cannot fit the full ReCaptcha plugin for width. There was also a vertical scroll bar for the overflow-y. The height pixels are set by Google. */ } .uploadDocMsg { font-family: 'opensansregular'; font-weight: bold; font-size: 22px; margin: 0; } /* Loan History Page*/ .loanDetailsContainer { margin-left: 20px; margin-bottom: 25px; } .loanDetailsHR { width: 95%; } .marginRight { margin-right: 1.5em; } .detailedLoanHistory { width: 100%; } .detailedLoanHistory thead { /* background: #27819F !important;*/ color: #57585D !important; } .detailedLoanHistory table thead tbody tr td{ border: none } .pendingPaymentsScheduleWrap { margin-bottom: 36px; margin-top: 30px; } .paymentHistoryTransactionLastRow { /* The tr is displayed as a table-row in desktop and inline-block for mobile: */ border-bottom: solid white 34px; } .paymentHistoryRowBackground { background-color: #f3f3f3; } /*.tooltipTextPendingPayment { display: none; position:absolute; bottom: 0; left: 0; right: 0; }*/ .pendingIconStyles { position: absolute; vertical-align: middle; margin-left: 10px; margin-top: 4px; } .ui-tooltip-blue { background: #dbf6ff !important; padding: 10px; color: #000000 !important; font-size: 11px; opacity: 1; width: 100px; position: absolute; display: inline; } .ui-tooltip-white { background: #ffffff !important; padding: 10px; color: #000000 !important; font-size: 11px; opacity: 1; width: 100px; position: absolute; display: inline; } .offerSteps .checkmark__circle { stroke-dasharray: 166; stroke-dashoffset: 166; stroke-width: 2; stroke-miterlimit: 10; /*stroke: rgba(0, 0, 0, 0.35);*/ fill: none; animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards; } .offerSteps .checkmark { width: 42px; height: 42px; border-radius: 50%; display: inline; stroke-width: 2; /*stroke: #fff;*/ stroke-miterlimit: 10; /*margin: 10% auto;*/ box-shadow: inset 0px 0px 0px #e5a700; animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both; z-index: 8; } .offerSteps .checkmarkFilled { width: 42px; height: 42px; border-radius: 50%; display: inline; stroke-width: 2; stroke: #fff; stroke-miterlimit: 10; box-shadow: inset 0px 0px 0px #e5a700; background: #ffc423; } .offerSteps .checkmark__check { transform-origin: 50% 50%; stroke-dasharray: 48; stroke-dashoffset: 48; animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards; } .offerSteps .fill { width: 100px; height: 100px; background: red; -webkit-transition: width 2s; /* For Safari 3.1 to 6.0 */ transition: width 2s; } .offerSteps .fill:before { width: 300px; } .offerSteps .path { stroke-dasharray: 100; stroke-dashoffset: 200; animation: dash 1s linear; } .offerSteps .probar { display: none; top: 26px; width: 65%; max-width: 636px; background: #777; height: 10px; /*left: 22px;*/ } .offerSteps .probarFill { width: 50%; background: yellow; } .FLPaydayWithdrawal { font-weight: bold; font-size: 14px; } .resNumPop { text-align: left; color: #dd8026; text-decoration: underline; cursor: pointer; } .abbyInStore { display: none; width: 100%; } .abbyInStore img { width: 90%; position: absolute; z-index: 8000; top: 75px; right: 20px; } .overlayAbby { background-color: #000; height: 100%; width: 100%; position: absolute; z-index: 7000; } #threeBlock4 { display: inline-block; } #threeBlock3 { display: none; } .threeBlockBanner { background-color: #ffffff; } .threeBlockBanner div > span { display: block; color: #54565b; text-align: center; font-family: arial, sans-serif; float: none; position: relative; vertical-align: middle; max-width: 100%; margin: 25px auto; width: 242px; } .threeBlockBanner div span img { display: none; width: 100%; } .threeBlockBanner div span > h2 { font-size: 22px; font-weight: 700; font-family: arial, sans-serif; } .threeBlockBanner .phoneStamp { max-width: 100%; position: relative; padding: 30px 25px; display: block; float: none; height: 242px; width: 242px; text-align: center; margin: auto; } .threeBlockBanner .phoneStamp p { font-size: 12px; max-width: 100%; } .threeBlockBanner .phoneStamp span { display: block; max-width: 100%; margin: 0; text-align: center; } .stamp2 { height: 242px; } .whoWeAreTxt { line-height: 24px; margin: 19px auto; width: 50%; } .offerDisclaimerMailer { display: none; } svg.ipadFade { float: left; left: 49.5%; display: none; } .application_wrap .offerSteps .probar rect { width: 100%; } .application_wrap .phoneStamp { position: relative; top: 200px; } .faqBannerRight .phoneStamp { display: block; width: 240px; float: none; max-width: 100%; position: relative; padding: 20px; margin: 50px auto; } .faqBannerRight .phoneStamp p { max-width: 100%; font-size: 12px; } /*#directMailFaq div > div { display: none; }*/ #confirmOfferForm { width: 100%; display: inline-block; padding-bottom: 15px; } #confirmOfferForm fieldset { margin-bottom: 20px; padding-top: 0; } #confirmOfferForm section { width: 100%; display: block; vertical-align: top; float: left; } #confirmOfferForm section:first-child { padding-right: 0px; margin-bottom: 20px; } #confirmOfferForm section:after { clear: both; } .offerForm div { margin: 20px 0; } .confirmOfferFormStyles div { margin: 0; } #offerFormTop .btnBlack:hover { background-color: #474747; } #offerFormTop .tooltipMsgBox, #offerFormBtm .tooltipMsgBox { bottom: auto; top: -77px; } .offerForm input[type="text"], .offerForm input[type="date"], .offerForm input[type="tel"] { -webkit-transition: all 0.30s ease-in-out; -moz-transition: all 0.30s ease-in-out; -ms-transition: all 0.30s ease-in-out; -o-transition: all 0.30s ease-in-out; outline: none; border: 1px solid #939291; height: 40px; } .offerForm input[type="date"] { color: #999; } .offerForm input[type=text]:focus, .offerForm textarea:focus, .offerForm input[type=date]:focus { box-shadow: 0 0 5px rgba(81, 203, 238, 1); border: 1px solid rgba(81, 203, 238, 1); } #offerFormTop input[type=text] { border: 1px solid #F5AA1B; } /*.offerForm input:hover { border: 1px solid blue; }*/ .confirmOffer .offerLine { top: 34px; max-width: 37%; } .confirmOffer .offerStepsList li { /*padding: 5px 11%!important;*/ display: table-cell; } .confirmOffer .offerStepsList li h3 { display: none; margin: 5px; } .confirmOffer .pronum { /*top: -32px; position: relative;*/ /*vertical-align: top;*/ } .confirmOffer .probar { display: block; } .offerLine { border-top: 10px solid #222; position: relative; top: 18px; max-width: 34%; margin: auto; display: none; } .confirmOffer.offerSteps { background: #333; color: #fff; padding: 0; height: 60px; } .confirmOffer .offerStepsList { max-width: 1040px; } .offerSteps { text-align: center; margin: auto; padding: 70px 20px; background: #fff; pointer-events: none; } .offerStepsList { padding: 0; z-index: 10; width: 100%; max-width: 960px; margin: auto; text-align: center; display: table; list-style-type: none; } .offerSteps svg { text-align: center; margin: auto; position: relative; } .offerSteps h3 { font-weight: bold; font-family: Arial, sans-serif; } .abbyClose { position: relative; right: 16px; top: 43px; background-color: #ffc423; z-index: 9000; border-radius: 44%; height: 35px; width: 35px; color: black; border: 1px solid #f5aa1b; font-size: 19px; font-weight: 500; padding: 4px 0 3px; border-radius: 40px; float: right; text-align: center; } .riddlerTxt { display: none; background: #FFC72A; text-transform: uppercase; text-align: left; color: #333; font-size: 36px; border-bottom: 6px solid #333; margin: 0; position: absolute; bottom: -55px; left: 0; padding: 5px 10px; font-weight: 700; font-family: Arial, sans-serif; line-height: 40px; } .riddlerTxt:first-child { border-bottom: 0; bottom: -6px; } /*Right pointing*/ .triangle-right { width: 0; height: 0; padding-top: 5px; padding-bottom: 5px; padding-left: 14px; overflow: hidden; float: left; position: relative; top: 6px; left: -16px; } .rotate90 { display: inline-block; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); top: 6px; } .triangle-right:after { content: ""; display: block; width: 0; height: 0; margin-top: -5px; margin-left: -5px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; border-left: 5px solid #DEDEDD; } .rotate90:after { border-left: 5px solid #333; } ::-webkit-input-placeholder { color: #B9B9BA; } .reviewBanner form { width: 100%; max-width: 300px; margin: 30px auto 0; text-align: left; padding: 0 10px 50px; } .reviewBanner img { width: 100%; height: 100%; } .reviewBanner canvas { } .reviewBanner .icn--arrow-left2, .reviewBanner .icn--arrow-right2 { position: relative; font-size: 65px; color: #fff; opacity: .5; display: none; } #abbyAppDMImg { display: none; position: relative; top: -23px; /* right: 406px; */ height: 300px; float: right; } .padding-10 { padding: 15px; } .btn_offer { width: 50%; padding: 10px; } .checkmark_offer { line-height: 1.5 !important; background-color: #ffc423 !important; } .gmi_upload_ul { width: 100%; } .gmi_upload_ul li { display: inline-block; padding: 0 0 15px 0; font-size: 18px; } .gmi_select input, .gmi_select .styled-select, .gmi_select button { width: 100%; display: inline-block; vertical-align: top; height: 37px; margin-bottom: 1em; } .portal-content { width: 100%; } .sliderLeft { margin-left: -50% !important; } #ThankYou-Line, #ThankYou-Line2, #passwordResetConfirmation { font-size: 0.675rem; } .newWrap { width: 100%; margin: auto; } .topRadio { vertical-align: top; top: 10px; position: relative; } .newRequired { width: 107%; position: absolute; right: 34px; top: -6px; background-image: url('~/Images/required-left'); } .mobile-login a { font-weight: bold; } .extraHeight { height: 100% !important; } .small-input-box { width: 100px !important; } .wrap { max-width: 1040px; width: 90%; position: relative; margin: 0 auto; } .altWrap { background-color: #ffffff; width: 100%; /*text-align: center;*/ margin: auto; background: #FFFFFF; /* This used to be #DEDEDD */ } .grayWrap { background: #DEDEDD; } .long-question { white-space: pre-wrap; width: 100% !important; padding-right: 20% !important; min-height: 35px; } .nodisplay, .hiddenUntilLoaded, .emailTemplateOnly, .hideValidationMessage { display: none !important; } /* emailTemplateOnly is for the Adverse Action templates (Task 20582). Any elements wrapped in this class will NOT be visibile on the portal. */ .visibilityHidden { visibility: hidden !important; /* Similar to display:none, except the elements still contain space on the screen. */ } /* A workaround for using input text types, without the type changing to hidden. */ .hiddenTextBox { position: absolute; left: -5000000px; } .noDisplayButton { height: 0px !important; margin-left: 4px; /* Move the upload button slightly behind the rectangle box */ margin-top: 4px; position: absolute !important; width: 0px !important; } .nav-position { position: relative !important; } * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } html { background-color: #333; font-family: sans-serif; font-size: 100%; } body { font-size: 14px; font-size: 0.875rem; color: #333; font-family: 'opensansregular', Arial, sans-serif; line-height: 1.4; height: 100%; position: relative; margin: 0; } a:focus { outline: thin dotted; } sup { font-size: 75%; line-height: 0; position: relative; } img { vertical-align: middle; border: 0; } hr { display: block; height: 1px; border: 0; border-top: 1px solid #d3d3d3; margin: 1em 0; padding: 0; margin-top: 0px; } h1 { font-size: 2em; margin: 0.67em 0; } h2 { font-size: 1.27em; margin: 0.83em 0; } h2 strong { font-weight: 600; } h3 { font-size: 1.17em; margin: 1em 0; } h4 { font-size: 1em; margin: 1.33em 0; } h5 { font-size: 0.83em; margin: 1.67em 0; } h6 { font-size: 0.67em; margin: 2.33em 0; } button, input, select, textarea, .inputOptionTag { font-size: 16px; font-size: 1rem; color: #777; font-family: opensansregular; font-weight: 400; margin: 0; vertical-align: baseline; } .top { vertical-align: top; } .pop-image { width: 100%; } figure { margin: 0; } .form-radio label strong:before { content: ' $'; } input[type="checkbox"], input[type="radio"] { margin-right: 10px; } input[type="email"], input[type="password"], input[type="search"], input[type], input[type="text"], input[type="url"], textarea { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #d5d5d5; padding: 5px 10px; width: 100%; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background-color: #fff !Important; } h1, h2, h3, h4, h5, h6 { font-family: 'opensansregular', Arial, sans-serif; font-weight: 500; } ::selection { background: #b3d4fc; text-shadow: none; } ::-webkit-scrollbar { background-color: #efefef; -webkit-appearance: none; width: 7px; border-left: 1px solid #d5d5d5; } ::-webkit-scrollbar-thumb { border-radius: 42px; background-color: #d8d8d8; -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); } .applicationInputField::-webkit-scrollbar { -webkit-appearance: none; width: 7px; border-left: 1px solid #d5d5d5; } .applicationInputField::-webkit-scrollbar-thumb { border-radius: 42px; background-color: #ffc423; -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5); } p, ol, ul, dl, address { font-family: 'opensansregular', Arial, sans-serif; } nav ul, nav ol { padding-left: 0; } .mediaQueryMeasurement { display: none; } p { margin: 1em 0; } .arialFont { font-family: 'opensansregular', Helvetica, Arial, sans-serif !important; /* Helvetica must be declared first, otherwise some characters become buggy on iOS devices - see Bug 15059 */ } .arialFontAllElements * { /* The asterik will impact every child tag, including p, h2, button, text, and input*/ /* font-family: Helvetica, Arial, sans-serif!important; /* Helvetica must be declared first, otherwise some characters become buggy on iOS devices - see Bug 15059 */ font-family: 'opensansregular' !important; } .poppinsFontAllElements * { /* The asterik will impact every child tag, including p, h2, button, text, and input*/ font-family: Poppins, 'opensansregular', Arial, Helvetica, sans-serif !important; } .arialFont14 { font-family: 'opensansregular', Helvetica, Arial, sans-serif !important; font-size: 14px !important; } .arialFont16 { font-family: 'opensansregular', Helvetica, Arial, sans-serif !important; font-size: 16px !important; } .arialFont24 { font-family: 'opensansregular', Helvetica, Arial, sans-serif !important; font-size: 24px !important; } .arialFont24_textAlign { font-family: 'opensansregular', Helvetica, Arial, sans-serif !important; font-size: 24px !important; text-align: center; } .whiteFont { color: #ffffff; } .margin10 { margin: 1em 0; } .add2emLeftPadding { padding-left: 2em; } ul.dashed { list-style-type: none; padding-left: 2em; } ul.dashed > li { text-indent: -20px; } ul.dashed > li::before { content: "- "; text-indent: -20px; } input[type="text"]:disabled, input[type="password"]:disabled, input[type="tel"]:disabled, select:disabled { background: #f7f7f7; background-clip: padding-box; border: 1px dashed #b8b8b9; box-shadow: none; color: #54565b; opacity: 1; outline: none; -webkit-text-fill-color: #54565b; /* iOS Fix */ } .one-appostrophe sup, .two-appostrophe sup, .three-appostrophe sup { font-size: 14px; } .one-appostrophe sup, .two-appostrophe sup, .three-appostrophe sup { margin-left: -12px; } .one-appostrophe, .two-appostrophe { margin-left: 20px; max-width: 676px; font-size: 14px; } .three-appostrophe { margin-left: 17px; max-width: 676px; } .two-thirds { max-width: 676px; } .createASuperScript1:after { content: "¹"; } .createASuperScript2:after { content: "²"; } .createASuperScript3:after { content: "³"; } .keepAll { word-break: keep-all; white-space: nowrap; } .wordWrapBreak { word-wrap: break-word; } .popup-refi-cancel-overlay { position: fixed; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.6); display: none; } .popup-refi-cancel { max-width: 600px; width: 328px; max-height: 300px; height: auto; padding: 1em; position: relative; background: #ffffff; margin: 20px auto; border: #E4E4E4 2px solid; border-radius: 8px; box-sizing: border-box; text-align: center; } .popup-refi-cancel-innerDiv { padding-top: 1em; } .popup-refi-cancel-close { position: absolute; top: -10px; right: -6px; cursor: pointer; color: #000; border-radius: 50%; width: 1.5em; height: 1.5em; font-weight: bold; background-color: #FEC63F; } .popup-refi-confirm-cancel { height: 36px; width: 270px; border-radius: 6px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.5); border-color: transparent; margin-bottom: 0.6em; color: #000000; font-weight: bold; } .popup-refi-cancel-return-AS { box-sizing: border-box; height: 36px; width: 247px; border: 2px solid #27AAE1; border-radius: 8px; background-color: #FFFFFF; color: #000000; font-weight: bold; margin-bottom: 0.6em; } .popup-refi-cancel { max-width: 600px; width: 328px; max-height: 300px; height: auto; padding: 1em; position: relative; background: #ffffff; margin: 20px auto; border: #E4E4E4 2px solid; border-radius: 8px; box-sizing: border-box; text-align: center; } .popup-refi-cancel-innerDiv { padding-top: 1em; } .popup-refi-cancel-close { position: absolute; top: -10px; right: -6px; cursor: pointer; color: #000; border-radius: 50%; width: 1.5em; height: 1.5em; font-weight: bold; background-color: #FEC63F; } .popup-refi-confirm-cancel { height: 36px; width: 270px; border-radius: 6px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.5); border-color: transparent; margin-bottom: 0.6em; color: #000000; font-weight: bold; } .popup-refi-cancel { max-width: 600px; width: 328px; max-height: 300px; height: auto; padding: 1em; position: relative; background: #ffffff; margin: 20px auto; border: #E4E4E4 2px solid; border-radius: 8px; box-sizing: border-box; text-align: center; } .popup-refi-cancel-innerDiv { padding-top: 1em; } .popup-refi-cancel-close { position: absolute; top: -10px; right: -6px; cursor: pointer; color: #000; border-radius: 50%; width: 1.5em; height: 1.5em; font-weight: bold; background-color: #FEC63F; } .popup-refi-confirm-cancel { height: 36px; width: 270px; border-radius: 6px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.5); border-color: transparent; margin-bottom: 0.6em; color: #000000; font-weight: bold; } .popup-refi-cancel-return-AS { box-sizing: border-box; height: 36px; width: 247px; border: 2px solid #27AAE1; border-radius: 8px; background-color: #FFFFFF; color: #000000; font-weight: bold; margin-bottom: 0.6em; } .popup-refi-cancel { max-width: 600px; width: 328px; max-height: 300px; height: auto; padding: 1em; position: relative; background: #ffffff; margin: 20px auto; border: #E4E4E4 2px solid; border-radius: 8px; box-sizing: border-box; text-align: center; } .popup-refi-cancel-innerDiv { padding-top: 1em; } .popup-refi-cancel-close { position: absolute; top: -10px; right: -6px; cursor: pointer; color: #000; border-radius: 50%; width: 1.5em; height: 1.5em; font-weight: bold; background-color: #FEC63F; } .popup-refi-confirm-cancel { height: 36px; width: 270px; border-radius: 6px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.5); border-color: transparent; margin-bottom: 0.6em; color: #000000; font-weight: bold; } .popup-refi-cancel { max-width: 600px; width: 328px; max-height: 300px; height: auto; padding: 1em; position: relative; background: #ffffff; margin: 20px auto; border: #E4E4E4 2px solid; border-radius: 8px; box-sizing: border-box; text-align: center; } .popup-refi-cancel-innerDiv { padding-top: 1em; } .popup-refi-cancel-close { position: absolute; top: -10px; right: -6px; cursor: pointer; color: #000; border-radius: 50%; width: 1.5em; height: 1.5em; font-weight: bold; background-color: #FEC63F; } .popup-refi-confirm-cancel { height: 36px; width: 270px; border-radius: 6px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); box-shadow: 0 1px 2px 0 rgba(0,0,0,0.5); border-color: transparent; margin-bottom: 0.6em; color: #000000; font-weight: bold; } .popup-refi-cancel-return-AS { box-sizing: border-box; height: 36px; width: 247px; border: 2px solid #27AAE1; border-radius: 8px; background-color: #FFFFFF; color: #000000; font-weight: bold; margin-bottom: 0.6em; } .checkbox_copy { width: 95%; /* This was originally max-width: 95%, but it caused a wrapping issue when the text was shorter than the full width of the page. See Task 18377 for an example screenshot.*/ } .floatLeft { float: left; } .floatRight { float: right !important; } .floatNone { float: none !important; } .clearBoth { clear: both !important; } .handCursor { cursor: pointer; } .fullWidth { width: 100%; } .fullHeight { height: 100% !important; } .maxWidth100 { max-width: 100%; } .inlineBlock { display: inline-block; } .inline { display: inline; } .boldFont { font-weight: bold !important; } .semiBoldFont { font-weight: 500; } .normalFont { font-weight: normal !important; } .underlineFont { text-decoration: underline; } .italicFont { font-style: italic !important; } .alignLeft { text-align: left !important; } .sectionLeft { display: inline-block; } .textRight { text-align: right; } .textLeft { text-align: left; } .lineBreak { margin-top: 1em !important; } .noBottomMargin { margin-bottom: 0em !important; } .marginBottom1Em { margin-bottom: 1em; } .overflowAuto { overflow: auto !important; } .overflowHidden { overflow: hidden !important; } .verticalAlignSuper { vertical-align: super; } .verticalAlignTop { vertical-align: top; } .verticalAlignMiddle { vertical-align: middle; } .mobileOnly { display: none; /* This is changed to display-block in the mobile media query. */ } .tabletAndMobileInlineBlockOnly { display: none; /* This is changed to display: block in the tablet media query. */ } .tabletAndMobileOnly, .tabletOnly { display: none; /* This is changed to display: inline-block in the tablet media query. */ } .desktopOnly { display: none; /* This is changed to display: block in the desktop media query. */ } .desktopOnlyInlineBlock { display: none; /* This is changed to display: inline-block in the desktop media query. */ } #clicks:after { content: '.00'; } /*#loanAmountselected:before, #clicks:before, #financeCharge:before, #totalDue:before { content: '$'; }*/ #dropCarot { } #term__values { position: relative; } #term__values ul { position: absolute; width: 100%; } #term__values li { text-align: center; padding: 10px; background-color: #222; opacity: .6; color: #fff; display: none; cursor: pointer; } #selectTerm { background: #ffdc89; background: -webkit-linear-gradient(#ffdc89, #e4a824); background: -o-linear-gradient(#ffdc89, #e4a824); background: -moz-linear-gradient(#ffdc89, #e4a824); background: linear-gradient(#ffdc89, #e4a824); background: -ms-linear-gradient(#ffdc89, #e4a824); padding: 10px; text-align: left; color: #222; opacity: 1; display: block; /* cursor:pointer; When there is only one loan term option, the dropdown list will not be clickable. */ font-family: 'opensansregular', Helvetica, Arial, sans-serif !Important; font-size: 16px; font-weight: bold; } #dropcarot { background: url("/Images/carot.png"); height: 30px; width: 32px; float: right; position: relative; right: 18px; top: 5px; cursor: pointer; } #apr:after { content: '%'; } .overlayDisabled { background-color: #000000; opacity: 0.5; pointer-events: none; z-index: 4000; width: 100%; height: 100%; position: fixed; top: 0; left: 0; } .pageDisabled { pointer-events: none; } .switchACHFont { font-family: Arial, sans-serif; } .switchACHLine { border-top: 1px solid #d5d5d5; } .loanDetails { width: 100%; display: block; margin-top: -18px; } .loanDetailsAgreements { display: inline-block; margin-right: 20px; margin-bottom: 16px; } .loanDetailsContainers { margin: -20px 0 25px 20px; } .loanDetailsInfo { background-color: #ffffff; width: 100%; column-span: all; /* border-top-style: solid; border-top-color: #27819F;*/ } .loanDetailsBTN { text-decoration: underline; color: #27AAE1; border: none !important; background: none !important; padding: 0 !important; cursor: pointer; display: inline; font: inherit; font-weight: bold; } /*.loanDetailsPrintBtn { margin-left: 59%; }*/ button:focus, button:hover { color: #27819F; } .loanDetailsHRBottom { margin-top: -30px !important; margin-bottom: 24px !important; margin-left: 1.5em !important; /* margin-right: 1em; */ width: 93% !important; border-top: 1px solid #ccc; } /* Message Alert Box (Warning): --------------------------------------------------------- */ .pc-banner { height: 62px; float: right; } .warning-overflow { overflow: visible !important; } .warning_img_left img { height: 133px; } .warning_img_left { float: left; position: relative; top: -58px; margin-left: 10%; } .warning_img { /*text-align: right;*/ margin-right: 5%; } .cso_warning_img { position: relative; top: 16%; left: 9%; } .moneyClip { margin: 0 5px; width: 58px; /* Make sure this matches the image dimensions */ } .warning_textbox { margin: 0; padding: 0; font-weight: 600; font-family: "openSansBold", Arial, sans-serif; font-size: 18px; /*margin-bottom:15px;*/ } .cso_warning_textbox h1 { margin: 0; padding: 0; font-weight: 600; font-family: 'opensanssemibold', Arial, sans-serif; font-size: 20px; /*margin-bottom:15px;*/ margin: -30px 0; position: relative; bottom: 10px; } .warning_textbox h1:last-child { margin-bottom: 0; } .warning_textbox { /*width: 50%; float: left; top: 15px; position: relative; left: 10%;*/ padding: 0 8px; } .warning.warningFlat { border-radius: 0; box-shadow: none; font-size: 16px; padding: 40px 10px; background-color: #F5AA1B; border: 1px solid #DD8026; } .warning.warningFlat > p { width: 100%; max-width: 800px; text-align: center; margin: auto; } .cso-warning_textbox { left: 0px; position: relative; } .cso_warning_textbox { bottom: 1%; left: 1%; position: relative; top: 0; padding: 0 159px; } .warning { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); -webkit-box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); background-color: #ffc423; color: #333333; font-family: Arial, sans-serif; font-weight: 500; margin-bottom: 20px; overflow: hidden; padding: 20px 25px; position: relative; text-align: left; display: block; /*height:240px; overflow:visible;*/ } .cso_warning { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); -webkit-box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); background-color: #ffc423; color: #333333; font-family: Arial, sans-serif; font-weight: 500; overflow: hidden; text-align: left; display: block; margin-bottom: 10px; padding: 5px 25px; position: relative; } .circle--warning { border-radius: 0; /*border-bottom-left-radius: 50px; border-top-left-radius: 50px; -moz-border-bottom-left-radius: 50px; -moz-border-top-left-radius: 50px;*/ } .circle--warning h2 { margin: 0; text-align: center; } .circle--warning p { margin: 5px 0; } .rebateAsterisk { right: 8px; } .exclamationPointPositioning { margin-left: -5px; /* Positioning the exclamation point closer to pre-approved for Ohio Installment on the Congratulations page*/ } .bills { top: 15px; position: relative; right: 10px; } .centerInMobile { text-align: center; } #creditServiceBanner, #refinanceBanner, #pastDueBanner, #cashRebateBanner, .eligibilityBanner { margin-bottom: 10px; } #cashBannerImg { max-width: 100px; } .customerCommentLine { position: relative; margin: 0 auto; text-align: center; float: right; left: 65px; } /* login ----------------------------------------------------------*/ .welcome-message { margin: 0; } /*Mobile Navigation Buttons---------------------------------------------- -----------------------------------------------------------------------------------------*/ .nav-item { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; border: 1px solid #d5d5d5; color: #ffffff; padding: 0 5px; position: absolute; text-align: right; top: 0.65em; vertical-align: middle; width: 4.75em; } .nav-item span { font-size: 12px; display: inline-block; line-height: 0.9; } .nav-item .icn { font-size: 20px; font-size: 1.25rem; display: none; } .nav-open { top: 7px; left: -10px; } .nav-open span { padding-top: 0.7em; } .user-open { min-width: 90px; right: -10px; top: -10px; } .user-open span { padding: 10px; } #OfferConfirmCtnBtn { height: 50px; margin-top: 20px; } .site-logo-alt { width: 59%; max-width: 185px; display: inline-block; } .whiteBorder { background: #fff !important; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35); } /*.home_header_bg { background: none; background-color: rgba(0, 0, 0, .5); }*/ /*PrimaryNav----------------------------------------------------------------- ----------------------------------------------------------------------------------------*/ .primarynav_link:focus { outline: none; } .primarynav_link { color: #fff; display: block; font-size: 1em; font-weight: 300; line-height: 1.28571em; } .primarynav_item { display: block; } .primarynav_list { margin: 0 -5.5%; display: block; } .primarynav { width: 100%; z-index: 998; color: #fff; overflow: hidden; display: none; } .leftto { } .site-title--dark { display: none; } .site-title--light { display: inline-block; vertical-align: middle; } .site-title--light-none { display: none !important; } .site-title a { display: block; } /*Subnav----------------------------------------------------------------------------- ----------------------------------------------------------------------------------*/ .subnav_link { font-size: 14px; font-size: .875rem; color: #fff; display: block; padding: 20px; padding-left: 10%; text-decoration: none; } .subnav_item:hover, .subnav_item:focus { background-color: #292929; } .subnav_item { border-top: 1px solid #434343; background: #333; position: relative; } .subnav { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 0 3px 3px 3px; -webkit-border-radius: 0 3px 3px 3px; border-radius: 0 3px 3px 3px; background-color: #2b2b2b; color: #fff; text-align: left; } /*Side Mobile Navigation ------------------------------------------------------------- --------------------------------------------------------------------------------------*/ .controls { background-image: url("/Images/icon-menu-top.png"); opacity: .8; display: block; float: left; text-indent: 100%; white-space: nowrap; } .close-btn { background-position: -1px -84px; height: 20px; width: 20px; } /*--SubPromo---and----Steps-------------------------------------------------------- -------------------------------------------------------------------------------------*/ .steps { margin: 40px 0; display: none; } .steps_ul { padding-left: 0; margin: 0; text-align: center; } .steps_li { display: block; margin-left: 0; border-top: 1px solid #d5d5d5; height: auto; padding: 5px 0; width: auto; position: relative; vertical-align: middle; } .steps_link { -webkit-background-clip: padding-box; background-clip: padding-box; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; font-size: 17px; display: inline-block; margin-right: 20px; padding: 5px 10px; vertical-align: middle; background-color: #ebebeb; color: #777777; font-weight: 500; line-height: 1.65; position: relative; text-align: center; text-decoration: none; text-transform: uppercase; z-index: 2; width: 35%; } .steps_li.is_active .steps_link { background-color: #333333; color: #fff; } .steps_link span { display: inline-block; padding-right: 4px; } .is_active .steps_link::after { display: block; content: ""; position: absolute; top: 50%; right: -7px; margin-top: -8px; border-top: 8px transparent solid; border-bottom: 8px transparent solid; border-left: 8px #333333 solid !important; } .steps_li_text { width: 56%; display: inline-block; vertical-align: middle; margin: 0; } .steps_li_text_inactive { color: #777777; } .subpromo-img { background-clip: padding-box; -webkit-background-clip: padding-box; border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; display: block; max-width: 100%; } .subpromo.subpromo-fancy { text-align: center; } .subpromo { margin-bottom: 20px; margin-top: 20px; } .congrats-table-wrap { width: 100%; } .congrats-table-wrap ul { /* padding-left: 20px; */ } .congrats-table-wrap ul li { padding: 5px 0 5px 15px; font-size: 16px; font-family: Arial, Helvetica, sans-serif; } .congrats-table-wrap ul li:before { content: "\2022 "; color: #e5a700; font-weight: 900; margin-right: 1em; } /*Links------------------------------------------------------------------------------------ ------------------------------------------------------------------------------------------*/ .application a { cursor: pointer; } #MarketingAppPC { width: 86%; position: relative; top: 10px; float: right; } /*-Interim Login---------------------------------------------------------------------- ------------------------------------------------------------------------------------------*/ #InterApplyBtn:before { content: 'Apply'; } #InterReturnBtn:before { content: 'Main Page'; } #InterContactBtn:before { content: 'Contact'; } #InterReturnBtn:before { content: 'Return'; } #InterGuestBtn:before { content: 'Guest Login'; } .interim-btn { padding: 10px; display: inline-block; width: 47%; } .interim-btn:first-child { margin-right: 10px; } .accountLoginHeader { margin-bottom: 0px; /* Resolves bug 11986 */ } .site-subpromo-btn { display: block; margin: 0; } .site-subpromo-container { margin: 40px 0 20px; position: relative; } .site-subpromo + .site-subpromo { float: right; position: relative; } .site-subpromo { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; border-radius: 3px; background-color: #ebebeb; padding: 20px; width: 49%; float: left; height: 100%; position: absolute; } .site-subpromo-img { display: block; margin: 0 auto 15px; max-width: 100%; } .site-subpromo-title { font-size: 14px; font-size: 0.875rem; font-weight: 500; } .site-subpromo-title, .site-subpromo-subtitle { line-height: 1.15; } .site-subpromo-info { font-size: 14px; font-size: 0.875rem; } .site-subpromo-info, .site-subpromo-title, .site-subpromo-subtitle { margin-top: 0; margin-bottom: 15px; } .login-locator-txt { margin: 10px 0 0 0; } .login-locator-input { width: 45%; float: left; } .login-locator-formfield { margin: 10px 0; } input.login-locator-btn { width: auto; margin: 15px 0; padding: 10px 15px; border-color: #e5a700; } input.go { padding: 10px 47px; } .login-locator-subtitle { font-size: 26px; margin: 0; } .login-locator-title { font-size: 24px; font-size: 1.5rem; line-height: 1.15; margin: 0; } .login-locator-info { border-bottom: 1px solid #737270; margin-bottom: 10px; padding-bottom: 10px; } .login-locator { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: url(/Images/bg-locator.jpg); color: #fff; display: block; padding: 20px; } /*Application----------------------------------------------------------------------------- ------------------------------------------------------------------------------------------------*/ .alert__info { font-size: 12px; font-size: 0.75rem; margin: 0; } .alert { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #ffc423; color: #333333; display: none; font-weight: 400; margin-top: 15px; padding: 7px; padding-left: 10px; padding-right: 10px; position: relative; width: 100%; height: 200px; } .label_block { display: block; line-height: 1.15; margin-bottom: 5px; } .application label { font-family: opensansregular; font-size: .875rem; margin-top: 10px; } .application .display-block { display: block !important; } .application .margin-top { margin-top: 20px; } .application .form-radio { display: inline-block; padding-right: 15px; } .application input[type="radio"], .application input[type="checkbox"] { margin-right: 5px; width: auto; border: 0px !important; } /* Patriot Act: This notice is on all three applications. */ #patriotActNoticeWrap { display: inline-block; } .postDatedCheckList { margin-top: 0.25em; padding-left: 2em; } .appDisclaimerText { font-size: 0.8em; } .questionTip { cursor: pointer; float: left; margin-top: 0.5em; margin-left: 1em; } .portalTip /*Tooltips found inside the Account Summary Portal*/ { cursor: pointer; float: right; margin-top: 0.5em; margin-left: 1em; } .pdfErrorText { color: #ffffff; font-family: Arial, Helvetica, sans-serif, Freesans, 'DejaVu Sans', 'Liberation Sans'; padding-left: 1em; } .pdfErrorText a { color: #6ec1ff; } .xsltImageSmaller img { height: 50px; /* QA wanted the HTML print to match the size of the PDF print. Bug 14651 */ } .loanProductTypeToggleWrap .radioToggleLeft { margin-right: 1em; } /* Organic Application - Tooltip Icon: */ .loanProductTypeToggleWrap #applicationForToolTipIcon { margin-left: 0.5em; margin-top: -0.25em; position: absolute; } /* Preferred Applications - Tooltip Icon: */ .loanProductTypeToggleWrap #applicationForPreferredToolTipIcon { margin-left: 99%; } #installmentToPaydayPopup { max-width: 600px; /* There isn't a lot of text, so the pop up can be smaller. */ vertical-align: baseline !important; /* The jQuery pop up class adds styles, including vertical-align: middle, which doesn't look good for a small pop up. */ } /* ------------------------------------------------------------------------------ Account Summary - Note: Any desktop styles are in a media query ------------------------------------------------------------------------------ */ /* This is the left column in desktop and tablet: */ .installmentOfferBannerContent { display: inline-block; margin-right: 0.5em; vertical-align: middle; width: 76%; } .installmentOfferBannerContent ul { font-size: 1.14em; /* Roughly 16px in desktop and will scale in mobile. */ line-height: 1.5em; margin-left: 1.15em; /* This aligns the bullet points with the text content. */ } .installmentOfferBannerContent ul li { list-style-type: disc; } .installmentOfferBannerContent h2 { font-weight: bold; margin-top: 0px; margin-bottom: 0.25em; } /* This is the right column in desktop and tablet: */ .installmentOfferBannerButtons { display: inline-block; text-align: center; vertical-align: middle; } .installmentOfferBannerButtons p { margin-bottom: 0px; } .installmentOfferBannerButtons p a { color: #333333; font-weight: bold; text-decoration: underline; } .installmentOfferBannerButtons .banner-button { border-radius: 8px; -moz-border-radius: 8px; } #eppThankYouBannerWrap h2 { font-size: 1.33em; text-align: left; } .lightDivider { border-top: 1px solid #E5E5E5; } .eSignHeaderAndDivider h3 { color: #555555; margin-bottom: 0.25em; } .extendYourLoanOfferWrap { background-color: #ffeab0; border-radius: 8px; box-shadow: 4px 4px 12px #535353; -moz-border-radius: 8px; margin-top: 1em; padding: 1em 1em 0em 1em; } .extendYourLoanOfferWrap h1 { /* These font sizes were setup to match the PhotoShop mock up: */ font-family: Arial, Helvetica, sans-serif; font-size: 26px; line-height: 1.15em; } .extendYourLoanOfferWrap h2 { font-family: Arial, Helvetica, sans-serif; font-size: 22px; line-height: 1.33em; margin: 0.33em 0em 0.33em 0em; } .extendYourLoanOfferDivider { border-top: 3px solid #000000; height: 3px; margin-top: 2em; } .extendYourLoanOfferInformationWrap { display: inline-block; text-align: left; width: 100%; /* In Tablet/Mobile, this column is one column. */ } .extendYourLoanOfferInformationWrap ul li { font-size: 14px; line-height: 1.7em; list-style-position: outside; list-style-type: disc; margin-left: 1.1em; /* The bullet points should aling with the content above it. */ } .extendYourLoanOfferButtonWrap { display: inline-block; text-align: center; width: 100%; /* In Tablet/Mobile, this column is one column. */ } .extendYourLoanOfferContent { height: 100%; width: 100%; } #extendYourLoanOfferButton { font-size: 14px; margin-top: 20px; /* 0px in desktop */ margin-bottom: 2px; margin-left: 0px; margin-right: 0px; padding: 7px 15px !Important; } .extendYourLoanDetailsWrap { margin-left: 1em; /* This aligns the page's content with the Accordion Header text. */ margin-right: 1em; } .extendYourLoanPageWrap h3 { font-family: Arial, Helvetica, sans-serif; font-size: 21px; font-weight: 600; margin-top: 0px; margin-bottom: 0px; } #extendYourLoanSubmitButton { margin-bottom: 1em; margin-top: 1em; padding: 10px 20px; width: 100%; /* In mobile, this will stretch the entire screen. */ } .extendYourLoanDetailsWrap ul li { line-height: 24px; margin: 0px; padding: 0px; } .extendYourLoanDetailsWrap .leftColumn { display: inline-block; font-weight: bold; text-align: left; width: 50%; } .extendYourLoanDetailsWrap .rightColumn { display: inline-block; float: right; font-weight: normal; text-align: right; width: 50%; } .extendYourLoanDivider { margin-bottom: 0.66em; margin-top: 0px; } .pastDueLoc { width: 100%; } .pastDueLoc .centerText, .pastDueLoc .banner-button-a-tag { font-size: 1em; line-height: 1.5em; } /* Refinance Pop Up Banner */ .refiOfferWrap * { box-sizing: border-box; font-family: Arial, Helvetica, sans-serif; } .refiOfferWrap h1, .refiOfferWrap h2 { text-align: left; } .refiOfferWrap h1 { font-weight: bold; } .refiLeftSide, .refiMiddle, .refiRightSide { display: inline-block; vertical-align: middle; } .refiLeftSide { /* This has the money clip - we'll hide this in mobile */ width: 12%; } .refiMiddle { /* This has the text content */ width: 63%; } .refiMiddle h1 { margin-bottom: 0px; margin-top: 0px; } .eppMiddle h1 { font-size: 22px; } .eppMiddle h2 { font-size: 20px; } .refiRightSide { /* This has the button. */ text-align: center; width: 23%; /* In mobile, this will change to 35% and the left side will be changed to display - none */ } /* POS Refinance Banner*/ .POSRefiText { height: 29px; width: 443px; color: #0E406A; font-size: 21px; font-weight: bold; line-height: 31px; } .POSRefiButton { transform: translateY(-25%); height: 36px; width: 185px; border: 4px; background: linear-gradient(90deg, #FFC429 0%, #FFE600 100%); font-weight: 900; float: right; cursor: pointer; } .POSRefiBtnText { color: #0E406A; font-size: 16px; line-height: 25px; width: 166px; height: 23px; } .earlyPayoffHeader { background-color: #333333; } .earlyPayoffHeader h2 { color: #efefef; display: inline-block; margin-bottom: 0px; margin-top: 0px; padding-bottom: 1em; padding-top: 1em; width: 64%; } .earlyPayoffHeader .earlyPayoffHeaderText { margin-left: 2em; /* This should match the padding on the eSigPopUpInnerWrap */ } .earlyPayoffInfoWrap { margin-bottom: 0.25em; /* This overrides the default 1em bottom and top margins. */ margin-top: 1.75em; } .earlyPayoffInfoWrap p { font-size: 1.25em; font-weight: bold; } .earlyPayoffText { display: inline-block; margin-bottom: 0px; margin-top: 0px; text-align: left; width: 78%; } .earlyPayoffValue { display: inline-block; margin-bottom: 0px; margin-top: 0px; text-align: right; width: 21%; white-space: nowrap; /* This prevents the money amounts from breaking onto multiple lines. */ } /*Marketing Banner*/ .banner-button { text-align: center; margin: auto; background-color: black; color: white; padding: 15px; font-family: "omes-pro",Arial, Sans-serif; cursor: pointer; /* Don't put width on this, use padding to control the width: width:100%; */ } .cso_banner-button { text-align: center; margin: auto; background-color: black; color: white; padding: 15px; font-family: "omes-pro",Arial, Sans-serif; cursor: pointer; width: 20% !important; margin-left: 80% !important; margin-top: -20px; position: relative; bottom: 17px; right: 26px; } .banner-button-a-tag { /* Styles the link tag as a button */ border-bottom: #898989 2px solid; border-left: #dddddd 2px solid; border-right: #898989 2px solid; border-top: #dddddd 2px solid; font-size: 1.2em; } .rebate-banner div:nth-child(2n+2) { text-align: center; } .rebate-banner .warning_img { left: 50px; position: relative; top: 30px; vertical-align: top; } .rebate-banner a { color: #333; } .rebate-txt { display: inline-block; margin: 0; margin-bottom: 10px; font-weight: 600; } #directMailApprovedBanner { padding: 25px 10px; margin: 0 auto 25px; text-align: center; width: 100%; border-radius: 4px 4px; margin-bottom: 50px; margin-top: 35px; } #directMailApprovedBanner p { font-size: 18px; font-weight: 600; font-family: Arial, sans-serif; } /* Account Summary - Info Table: */ .accountSummaryTableWrap { border: 1px solid #f5aa1b; border-radius: 4px; box-shadow: 0 0 8px rgba(51, 51, 51, 0.15); height: 100%; padding: 40px 40px 48px 40px; position: relative; width: 100%; z-index: 3; /* The table border should appear in front of the tabs. */ } .accountSummaryTabWrapActive { background-color: #27AAE1; border: 1px solid #27AAE1; border-radius: 2px; display: inline-block; margin-bottom: -1px; /* These tabs should appear behind the table border */ vertical-align: bottom; } .accountSummaryTabWrapActive p { color: #ffffff; font-size: 16px; font-weight: bold; line-height: 18px; margin: 16px 8px; text-align: center; } .accountSummaryTabWrapInactive { background-color: #eaeaea; border: 1px solid #b4b4b4; border-radius: 2px; box-shadow: 0 0 15px rgba(51, 51, 51, 0.05) inset; cursor: pointer; display: inline-block; margin-bottom: -1px; /* These tabs should appear behind the table border */ vertical-align: bottom; } .accountSummaryTabWrapInactive p { color: #787878; font-size: 14px; font-weight: bold; line-height: 18px; margin: 12px 8px; text-align: center; } .accountSummaryTotalTabItems2 { width: 50%; } .accountSummaryTotalTabItems3 { width: 33.33333333333333333333333333333333333333333333333333333333333333333333333%; } .accountSummaryTotalTabItems4 { width: 25%; } .accountSummaryTotalTabItems5 { width: 20%; } /*Account Portal Styles--------------------------------------------------------------------------- ----------------------------------------------------------------------------------------------------*/ .account .controls-stacked { margin: 1rem 0; } .account .file { position: relative; display: inline-block; cursor: pointer; margin: 0; width: 100%; } .account .file input { min-width: 14rem; margin: 0; } .account .file-custom { position: absolute; top: 0; right: 0; left: 0; line-height: 1.25em; z-index: 5; padding: .5rem 1rem; color: #555; background-color: #fff; border: .075rem solid #ddd; border-radius: .25rem; box-shadow: inset 0 0.2rem 0.4rem rgba(0, 0, 0, 0.05); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; } .account .file-custom:before { position: absolute; top: -.075rem; right: -.075rem; bottom: -.075rem; z-index: 6; display: block; content: "Browse"; padding: .5rem 1rem; line-height: 1.5; color: #FFFFFF; background-color: #333333; border: .075rem solid #ddd; border-radius: 0 .25rem .25rem 0; } .requiredText { font-weight: bold; font-size: 0.8em; } .document_description { max-height: 180px; overflow-x: hidden; overflow-y: auto; overflow: auto; resize: vertical; display: block; width: 100%; resize: none; } .denial-message { font-size: 16px; font-weight: bold; } .disclaimer_legal { font-size: 12px; font-size: .75rem; } .category_legal { font-size: 12px; font-size: .75rem; color: #777; } #payment-date { background: url(/Images/icn-calendar.png)no-repeat right center; background-color: #f5f5f5; border: 1px solid #d5d5d5; color: #6b6b6b; cursor: pointer; height: 36px; padding: .5em; width: 100%; -webkit-appearance: none; -webkit-background-clip: padding-box; appearance: none; text-indent: .01px; text-overflow: ''; background-clip: padding-box; border-radius: 4px; } .account .styled-calendar { position: relative; overflow: hidden; border-radius: 4px; -webkit-border-radius: 4px; -webkit-background-clip: padding-box; background-clip: padding-box; } .account .input-wrap-1-3 { width: 33.33% !important; } .dollarSign:before { content: '$'; } /*.input-lg { max-width: 300px; } .input-wrap-1-20 { width: 114px; } .input-padding { padding-left: 10px; }*/ #uploadFailureMessage { max-width: 550px; margin-top: 0; display: none; } .multipleValidationMsg { display: inline-block; position: relative; margin-bottom: 4em; } .multipleValidationMsg .validationBox { position: absolute; left: 0; width: 115px; top: 3em; text-align: center; margin: 0; } .multipleValidationMsg:first-child .validationBox { left: 10px; } .validation-2 { width: 30%; display: inline-block; left: 150px; margin: 0; margin-right: 10px; } .validation-3 { width: 30%; display: inline-block; left: 280px; margin: 0; margin-right: 10px; } .hangingIndent { text-indent: 24px; } .paragraphIndent { margin-left: 2em; } /*.account .inline-block { display: inline-block!important; }*/ .account .display-block { display: block !important; } .account .margin-top { margin-top: 15px; } .account_subSection_title { font-weight: 500; font-family: 'opensansregular', sans-serif, Arial, Helvetica; font-size: 18px; margin-bottom: 1.5em; } .accountSummaryRow { padding: 0.15em 0; } /*LOC 2.0 styles*/ .account-summary_loc_table-header { font-size: 20px; font-weight: 700; color: #27AAE1; text-decoration: underline; line-height: 30px; padding: 5px 5px 5px 25px; background-color: #ededed; margin-bottom: 0 !important; } .account-summary_loc_table-body { border: 2px solid #ededed; margin-top: 0; padding: 0 5% 4%; } .account-summary_loc_table-body p { font-size: 16px !important; } .gray-vertical-line-center { // border-left: 1px solid #979797; height: 116px; position: absolute; left: 57%; /*margin-left: -5px;*/ top: 52%; border-bottom: none !important; } .gray-horizontal-line-center{ display: none !important; } .highlight-min-payment-amount-span { font-size: 24px; font-weight: 700; color: #27AAE1; } .table-right-div { display: inline-block; width: 50% !important; } .table-left-div { display: inline-block; width: 45% !important; position: relative; /* top: -4.5em;*/ } .make-a-payment-btn { background: linear-gradient( 45deg, #FFE600 0%, #FFC429 100%), #D8D8D8; border-radius: 8px; padding: 10px; font-weight: bold; color: #0E406A; } .hide-sm-a-view-details{ display: none !important; } .account-summary_loc_table-footer-div { overflow: hidden !important; background-color: #27AAE1; height: 45px !important; line-height: 12px; } .account-summary_loc_table-footer-div p { float: right; padding-right: 10%; color: #ffffff; font-size: 18px; } .account-summary_loc_table-footer-div a { color: #ffffff; font-weight: 700; text-decoration: underline; } @media only screen and (min-width: 1000px) and (max-width: 1024px) { /*.gray-vertical-line-center { left: 52%; top: 37%; } */ .table-right-div { width: 50% !important; } .table-left-div{ width: 40% !important; } } @media only screen and (min-width: 420px) and (max-width: 999px) { /*.gray-vertical-line-center { left: 35%; top: 39%; }*/ .table-right-div { width: 50% !important; } .table-left-div { width: 40% !important; } } @media only screen and (max-width:650px) { .account-summary_loc_table-header { font-size: 16px; } /* .gray-vertical-line-center { display: none !important; }*/ .gray-horizontal-line-center { display: block; border-bottom: 1px solid #979797; margin: 10% 0 3%; } .add-btm-margin { margin-bottom: 2em !important; } .table-right-div{ margin-top: 1em !important; } .table-left-div, .table-right-div { width: 100% !important; } .table-left-div p { font-size: 12px !important; } .highlight-min-payment-amount-span { font-size: 16px !important; } .account-summary_loc_table-footer-div { height: 75px !important; } .account-summary_loc_table-footer-div p { margin-left: 7%; line-height: 18px; float: none; font-size: 14px !important; } .hide-lg-a-view-details { display: none !important; } .hide-sm-a-view-details { display: block !important; float: left; font-size: 14px !important; } table, td, th { font-size: 12px !important; } } /* End of LOC2.0*/ .account-section-title.account-section-alt-title { padding-left: 0; } .account .account-section-title { margin-bottom: 0px; border-bottom: 1px solid #ccc; /*margin-top: 10px;*/ } .account-section-title { font-family: opensansregular !important; font-size: 36px !important; font-size: 1.5rem; line-height: 1.15; margin: .5em 0 1em; padding-left: 65px; position: relative; font-weight: bold; } .account-section-title-payment { font-family: opensansregular !important; font-size: 36px !important; line-height: 1.15; margin: .5em 0 1em; padding-left: 65px; position: relative; color: #333333 !important; font-weight: bold !important; margin-bottom: 0px; margin-top: 10px; padding: 0; } .paymentConfirmationThankyou { color: #333333 !important; font-family: opensansregular; font-size: 24px !important; font-weight: bold !important; margin-top: 5px; } .paymentThankyouHR { margin-top: 4px; border: 1px solid #ccc; } .paymentConfirmationThankyouNote li { list-style-type: disc !important; margin-left: 33px !important; line-height: 27px; padding-bottom: 4px; } .paymentNewLoanEligibleNote { font-size: 18px; margin-top: 20px; } .paymentConfirmationThankyouNote { font-size: 18px; margin-top: -8px; } .coolOffBannerDiv { border: 3px solid #AEAEAE; border-radius: 8px; padding: 2em 2em 4em 2em; } .coolOffBannerP { margin: 0 0 20px 0 !important; font-size: 18px; } .coolOffBanner { font-size: 18px; margin-top: -8px; } .coolOffBannerDiv { border: 3px solid #AEAEAE; border-radius: 8px; padding: 2em 2em 4em 2em; } .coolOffBannerP { margin: 0 0 20px 0 !important; font-size: 18px; } .coolOffBanner { font-size: 18px; margin-top: -8px; } .coolOffBanner li { list-style-type: disc !important; margin-left: 33px !important; line-height: 27px; padding-bottom: 4px; } .cooloffButton { float: right; background: linear-gradient( 45deg, #FFE600 0%, #FFC429 100%), #D8D8D8; height: 40px; width: 126px; border-radius: 8px; font-size: 16px; font-weight: 900; border: 2px solid #ffc429; color: #0E406A; } .paymentReceiptNote { font-size: 18px; margin-top: 40px; } #other_amount { font-size: 16px; } .textBlueColor { color: #2f95b7; text-decoration: underline; font-weight: bold; } .input-wrap { width: 100%; } input.ForgotSubmit { width: 22%; background-color: transparent; border: 0; text-align: right; cursor: pointer; min-width: 140px; } input.ForgotSubmit:focus { border: 0 !important; } .move_right { text-align: right; } .loan-data-table-amount, .loan-data-table-amount-no-background { color: #54565b; text-align: right; float: right; } a.loan-data-table-amount, a.loan-data-table-amount-no-background { color: #1f6e96; font-weight: bold; } .loan-data-table-amount { padding: 10px 8px; width: 44%; } .loan-data-table-amount-no-background { padding-top: 20px; padding-bottom: 7px; padding-left: 8px; padding-right: 0px; } /* There's no reason to limit the width, the right side column will still wrap under the text. */ .loan-data-table-title, .loan-data-table-title-no-background { color: #54565b; display: inline-block; float: left; margin-top: 0 !important; /*This will overwrite the property coming from .application label*/ } .loan-data-table-title { padding: 10px 7px; } .loan-data-table-title-no-background { padding-top: 7px; padding-bottom: 7px; padding-left: 0px; /* The cells must align left with the content */ padding-right: 7px; } .loan-data-table-row:last-child { border-bottom: 0; } .loan-data-table-row { border-bottom: 1px solid #d5d5d5; display: block; width: 100%; /*padding: 10px 15px; Padding will now come from the child elements*/ display: table; } .loan-data-table { background-color: #ebebeb; margin-bottom: 15px; } .loan-data-table-no-background { margin-bottom: 15px; } .row { width: 100%; } .warning_img { display: none; } /*------------------------------------------CONTACT US ------------------------------------------------------------------- ---------------------------------------------------------------------------------------------------------*/ #Message { width: 100%; } .req_after::after { content: ' *'; color: red; } .reqs:before { content: '* '; color: red; } .reqs { color: #777; } .category_info:first-child { margin-top: 0; } .category_info { color: #777; margin-bottom: 0; margin-top: 1em; } /* --------------------------------------------- Account - Contact Customer Service (Desktop): --------------------------------------------- */ .contactCustomerSupportLeftCol, .contactCustomerSupportRightCol { /* If we want gray text: color: #616161; font-weight: bold; */ color: #000000; font-family: 'opensansregular', Arial, sans-serif; } .contactCustomerSupportLeftCol { float: left; padding-right: 1em; width: 40%; } .contactCustomerSupportRightCol { float: right; width: 60%; } .contactCustomerSupportLeftCol h2, .contactCustomerSupportRightCol h2 { color: #000000; font-size: 1.75em; font-weight: 500; margin-bottom: 0em; } .contactCustomerSupportLeftCol p, .contactCustomerSupportRightCol p { margin-top: 0em; } .contactCustomerSupportFieldsLeft { float: left; padding-right: 5px; width: 40%; } .contactCustomerSupportFieldsRight { float: right; padding-left: 5px; width: 60%; } /*Accont Portal*/ .loanDetailsWrap { display: block; width: 100%; } .loanDetailsBodyWrap { border: 2px solid #d9d9d9; border-collapse: collapse; margin-top: -26px; } .loanDetailsTable { display: table; width: 100%; color: #000; } .loanDetailsTableRow { display: table-row; /*border-bottom: 2px solid #d9d9d9;*/ transition: height 0.3s ease-in; transition-delay: 1s; } div.loanDetailsTableRow:last-child { border-bottom: none; } .loanDetailsHeading { margin-bottom: 0px !important; background-color: #fff; font-weight: bold; padding: 10px; font-size: 16px; font-family: Arial, sans-serif; text-align: center; margin-top: -26px; } .table-header-cell { display: table-cell; width: 25%; /* Change it to 20 when the funding date is uncommented*/ padding: 10px; text-align: center; } .table-header-p-cell { text-align: center; } .table-body-cell { display: table-cell; width: 25%; /* Change it to 20 when the funding date is uncommented*/ padding: 10px; text-align: center; position: relative; } .loanDetailsBody { /*display: table-row-group;*/ } div.loanDetailsBody:nth-child(even) { background-color: #d8d8d8; } div.loanDetailsBody:nth-child(odd) { background-color: #efefef; } .loanDetailsBody .active .loadDetailsDropdownArrow { transform: rotate(0deg); } .account_data_table_cell a { font-weight: bold; color: #2D94B6 !important; } .loan_history_header { font-size: 28px; margin: 30px 0 20px 0; font-weight: normal; } .account_data_table { width: 100%; margin-top: 15px; cursor: pointer; } .uploadDocMsg { } .loanDetailsInfo { column-span: all; display: none; } .active .loanDetailsInfo:not(:first-child) { display: block; column-span: all; background-color: #fff; } .documentsTypeColumn { width: 40px; } .account_data_table_header th { background-color: #fff; font-weight: bold; padding: 10px; font-size: 16px; font-family: 'opensansregular'; text-align: center; width: 20%; } .account_data_table_body tr { height: 54px !important; border: 2px solid #d8d8d8 !important; } .account_data_table tr:nth-child(odd) { background-color: #ebebeb; } .account_data_table tr:nth-child(even) { background-color: #f8f8f8; } .account_data_table_body td { padding: 10px; font-weight: 500; font-size: 14px; font-family: 'opensansregular'; text-align: center; cursor: pointer; } .account_data_table_body tr:hover, tr:focus { background-color: #d8d8d8; } .account_data_table_body td, th { padding: 10px; /*border-bottom: 1px solid #d9d9d9;*/ } /*CONTENT ---------------------------------------------------------------------------------- -------------------------------------------------------------------------------------*/ .label-block { display: block; line-height: 1.15; margin-bottom: 5px; } .label { font-weight: 500; } .application .margin-top { margin-top: 20px; } .application .border-bottom { border-bottom: 1px solid #d5d5d5; } .application .margin-bottom { margin-bottom: 15px; } .application .content-intro-title { padding-right: 0px; } .content-intro-title { font-size: 25px; font-size: 1.5625rem; line-height: 1.15; margin-bottom: 10px; margin-top: 0; margin-right: 0; } .content-primary { padding-bottom: 1em; } /*FOOTER*/ footer { background-color: #333; color: #fff; font-size: 11px; line-height: 13.2px; margin: 0; /*padding-top: 30px;*/ } a { text-decoration: none; color: #2D94B6; /* old color - #186d98 */ } ul li { list-style-type: none; } .force_ul_disc { list-style-type: disc !important; margin-left: 30px; } .force_ul_disc li { list-style-type: disc !important; } footer a { color: #fff; } .footer_nav_li_link:hover { color: #ffc423; } .footer_nav_link.is-active::after { content: "\e608"; } /* SILENT NAV*/ .silentnav { font-size: 11px; font-size: 0.6875rem; margin-top: 40px; } .silentnav__list { padding-left: 0; margin: 0; } .silentnav__item { border-left: 1px solid #fff; display: inline-block; margin-bottom: 5px; margin-left: 5px; padding-left: 5px; vertical-align: top; } .silentnav__item:first-child { border-left: none; margin-left: 0; padding-left: 0; } .silentnav__link { color: #fff; text-decoration: none; } .silentnav__link:focus, .silentnav__link:hover { color: #ffc423; text-decoration: none; } .footerSeeMore { cursor: pointer; } .footer-legal { border-bottom: 1px solid; border-color: #454545; padding-bottom: 30px; } .footer-legal a { text-decoration: underline; } .footer-legal-link:hover { color: #fff !important; background-color: none !important; } .footer-legal-alt { width: 75%; float: left; position: relative; } .footer-logo-links { float: left; } .footer-logo-links li { display: inline-block; vertical-align: middle; margin: 0px 5px; } /*SITE div ------------------------------------------------------------------------------------ ------------------------------------------------------------------------------------------*/ .site { position: relative; overflow: hidden; width: 100%; } .site-container { width: 100%; position: relative; } /*Loading Screen App---------------------------------------------------------------------------- --------------------------------------------------------------------------------------------*/ .loading-screen-app { background-color: rgba(0,0,0,0.5); display: none; height: 100%; left: 0; position: absolute; top: 0; width: 100%; z-index: 1200; } header, footer, hgroup, nav, section { display: block; } mark { background-color: #FFFF66; padding-left: 5px; padding-right: 5px; } .center { margin: auto !important; } .centerText { text-align: center; } .float-left { float: left; } .float-right { float: right; } .bold-font { font-weight: bold; } .noDisplay { display: none; } .noMarginLeft { margin-left: 0px !important; } .noMarginRight { margin-right: 0px; } .noMarginTop { margin-top: 0px; } .addMarginTop { margin-top: 25px !important; } .importantStateDisclosure { color: #4C4F50; font-weight: bold; font-size: 20px; } .importantStateDisclosureStmt { font-size: 18px; color: #4C4F50; margin-top: 0px !important; } .importantStateDisclosureStmta { color: #3294b8 !important; text-decoration: underline; font-weight: bold; } .AccountScoreImg { padding-right: 1em; padding-bottom: 1em; padding-top: 0.5em; } .noMarginBottom { margin-bottom: 0px !important; } .noPadding { padding: 0px !important; } .AccountScoreIframeStyles { height: 700px; width: 100%; } .clear-fix:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; } /* Usually, we don't want bullet points for lists: */ body ul li { list-style-type: none; } /* main layout ----------------------------------------------------------*/ .textureBackground { background: url(/Images/bg-content.jpg); background-position: top center; background-repeat: repeat-x; background-color: #fff; } .content { /* background: url(/Images/bg-content.jpg); */ background-position: top center; background-repeat: repeat-x; background-color: #fff; padding-bottom: 35px; padding-top: 12px; /* Use an offeset for the .accountNavMobile */ } .contentAlt { background: #ffffff; } .content-wrapper { margin: 0 auto; max-width: 960px; } main { /* The content pages should be white background-color: #efeeef; */ clear: both; } .main-content { /* background: url("../Images/accent.png") no-repeat; */ padding-left: 10px; padding-top: 30px; } .featured + .main-content { /* background: url("../Images/heroAccent.png") no-repeat; */ } header .content-wrapper { padding-top: 20px; } footer { clear: both; background-color: #333333; color: #fff; } /* menu ----------------------------------------------------------*/ ul, li { padding: 0; margin: 0; } ul#menu { font-size: 1.3em; font-weight: 600; margin: 0 0 5px; padding: 0; text-align: right; } ul#menu li { display: inline; list-style: none; padding-left: 15px; } ul#menu li a { background: none; color: #999; text-decoration: none; } ul#menu li a:hover { color: #333; text-decoration: none; } /* page elements ----------------------------------------------------------*/ /* featured */ .featured { background-color: #fff; } .featured .content-wrapper { background-image: linear-gradient(#7ac0da 0%, #a4d4e6 100%); color: #3e5667; padding: 20px 40px 30px 40px; } .featured hgroup.title h1, .featured hgroup.title h2 { color: #3e5667; } .featured p { font-size: 1.1em; } /* page titles */ hgroup.title { margin-bottom: 10px; } hgroup.title h1, hgroup.title h2 { display: inline; } hgroup.title h2 { font-weight: normal; margin-left: 3px; } /* features */ section.feature { width: 300px; float: left; padding: 10px; } /* ordered list */ ol.round { list-style-type: none; padding-left: 0; } ol.round li { margin: 25px 0; padding-left: 45px; } ol.round li.zero { background: url("../Images/orderedList0.png") no-repeat; } ol.round li.one { background: url("../Images/orderedList1.png") no-repeat; } ol.round li.two { background: url("../Images/orderedList2.png") no-repeat; } ol.round li.three { background: url("../Images/orderedList3.png") no-repeat; } ol.round li.four { background: url("../Images/orderedList4.png") no-repeat; } ol.round li.five { background: url("../Images/orderedList5.png") no-repeat; } ol.round li.six { background: url("../Images/orderedList6.png") no-repeat; } ol.round li.seven { background: url("../Images/orderedList7.png") no-repeat; } ol.round li.eight { background: url("../Images/orderedList8.png") no-repeat; } ol.round li.nine { background: url("../Images/orderedList9.png") no-repeat; } /* content */ article { float: left; width: 70%; } aside { float: right; width: 25%; } aside ul { list-style: none; padding: 0; } aside ul li { background: url("../Images/bullet.png") no-repeat 0 50%; padding: 2px 0 2px 20px; } .label { font-weight: 600; } /* login page */ .disclaimer { margin: 20px 0 5px 0; } #loginForm { border-right: solid 2px #c8c8c8; float: left; width: 55%; } #loginForm .validation-error { display: block; margin-left: 15px; } #loginForm .validation-summary-errors ul { margin: 0; padding: 0; } #loginForm .validation-summary-errors li { display: inline; list-style: none; margin: 0; } #loginForm input { width: 250px; } #loginForm input[type="checkbox"], #loginForm input[type="submit"], #loginForm input[type="button"], #loginForm button { width: auto; } #socialLoginForm { margin-left: 40px; float: left; width: 40%; } #socialLoginForm h2 { margin-bottom: 5px; } #socialLoginList button { margin-bottom: 12px; } #logoutForm { display: inline; } /* contact */ .contact h3 { font-size: 1.2em; } .contact p { margin: 5px 0 0 10px; } .contact iframe { border: 1px solid #333; margin: 5px 0 0 10px; } .proofOfIncomeHeading { font-size: 28px; font-weight: bold; color: #57585D; font-family: opensansregular; /* margin-bottom: 0.3em;*/ } #uploadDocument_uploadNow { margin-bottom: 2em; } .proofOfIncomeHeadingp { font-size: 16px; margin-top: 0; /* margin-bottom: 3em*/; } .proofOfIncomeSubHeading { /*width: 251px; height: 115px; margin: 10px 39px 24px 30px;*/ /*font-family: Poppins;*/ font-size: 16px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: normal; /*text-align: center;*/ color: var(--body-text); } .-Connect-your-bank { /* margin: 24px 45px 15px 30px; font-family: Poppins;*/ font-size: 14px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal; text-align: left; color: var(--body-text); } .-Connect-your-bank .text-style-1 { font-weight: bold; } .Shape { width: 23px; height: 24px; margin: 19px 2px 61px 30px; background-image: linear-gradient(39deg, #57c1e9 -2%, #1b94b8 84%); } img.Shape { width: 23px; height: 24px; margin: 19px 2px 61px 30px; object-fit: contain; } .-Your-bank-account { /*margin: 15px 25px 20px 7.9px; font-family: Poppins;*/ font-size: 14px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: normal; text-align: left; color: var(--body-text); } .-Upload-Documents { /*width: 263px; height: 103px; margin: 50px 27px 14px 30px; font-family: Poppins;*/ font-size: 14px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 1.5; letter-spacing: normal; text-align: left; color: var(--body-text); } .-Upload-Documents .text-style-1 { font-weight: bold; } .-Upload-Documents .text-style-2 { font-weight: bold; color: var(--primary-light-blue); } .-Upload-Documents .text-style-3 { color: var(--primary-light-blue); } .fastestWayP { font-size: 18px; font-weight: bold; margin-bottom: 0; } .fastestWaySubtextP { margin-top: 0; font-size: 16px; } .timingPOI { font-size: 16px; font-style: italic; } .proofOfIncomeFooterp { font-size: 14px; margin-top: 0; font-weight: bold; } /* forms */ fieldset { color: #57585D; border: none; margin: 0; padding: 0; padding-top: 10px; width: 100%; font-family: opensansregular; } fieldset.gmiUploadFieldset { padding: 0; /*max-width: 750px;*/ } fieldset legend { display: none; } fieldset ol { padding: 0; list-style: none; } fieldset ol li { padding-bottom: 5px; } fieldset p { font-family: opensansregular; } label.checkbox { display: inline; } textarea { font-family: inherit; width: 500px; } input[type="checkbox"] { background: transparent; border: inherit; width: auto; } .btn:focus, .btn:hover { background-color: #f9b600; text-decoration: none; } .btn-small { font-size: 12px; font-size: .75rem !important; padding: 10px !important; } .margin-right { margin-right: 30px !Important; } .btn, .btnGray, .btnLightGray, .btnDisabled, .btnBlack { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; /*font-size: 14px;*/ cursor: pointer; font-family: 'opensansregular', Helvetica, Arial, sans-serif; font-weight: 600; line-height: 1.083333333; /*margin: 0 0 10px 0;*/ outline: none; /*padding: 15px;*/ text-align: center; text-decoration: none; vertical-align: text-bottom; -webkit-appearance: none; } .btn { background-color: #ffc423; border: 1px solid; border-color: #e5a700; color: #333333; -webkit-appearance: none; } .btnGrayText { color: #c4c4c4 !important; background-color: #EBEBEB !important; border: 1px solid !important; border-color: #C4C4C4 !important; cursor: default !important; text-shadow: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; } .btnGray, .btnLightGray { background-color: #EBEBEB; border: 1px solid; border-color: #C4C4C4; color: #000000; -webkit-appearance: none; } .btnLightGray { background-color: #eaeaea; border-color: #d3d3d3; } .transBtn { width: 100px; text-align: center; background: yellow; /* Old browsers */ background: linear-gradient(to right, #f9b600 50%, #ffc423 50%); background-size: 200% 100%; background-position: right bottom; transition: all 2s ease; } /* Note, this is used as a disabled button: */ .btnDisabled { background-color: #EBEBEB !important; border: 1px solid !important; border-color: #C4C4C4 !important; color: #000000 !important; cursor: default !important; text-shadow: none !important; box-shadow: none !important; -webkit-box-shadow: none !important; } .btnBlack { background-color: #333333; border: 1px solid; border-color: #333333; color: #FFFFFF; } .btnBlackBorder { border-color: #C4C4C4; } .btnBlackBorder:hover { background-color: #121212; } .btnBlackBorder:active, .btnBlackBorder:focus { background-color: #000000; } .btnGray:hover, .btnLightGray:hover { background-color: #cacaca; border-color: #8b8b8b; } .btnDisabled:hover { background-color: #EBEBEB !important; border-color: #C4C4C4 !important; } .btn_full { display: block; width: 100%; margin-bottom: 10px; padding: 15px; } .btn_small, .btn_medium { display: block !Important; margin: 10px 0px; padding: 10px 20px !Important; } /* Use this when you have two buttons that are aligned horizontally */ .btnPairLeft, .btnPairRight { margin-bottom: 1em; /* When the buttons run out of space and stack, this will keep a line break of space between them */ padding: 0.75em 3em; /* Adds 3 character spaces to the sides for desktop. */ } .btnPairLeft { margin-right: 2em; } .btnPairRight { margin-left: 2em; } #btnReset { display: block !Important; padding: 10px 20px !Important; margin: 40px 0px !Important; /*for bug 2057 changed margin from 120px to 40px*/ } #btnContinue { display: block !Important; padding: 10px 20px !Important; margin: 120px 0px; /*for bug 1757 changed margin from 10px to 120px*/ } .btn-loanstatus { margin-right: 0px; margin-top: 1px; } .btn-summary { margin-right: 0px; /* This should be aligned right. */ margin-top: 1px; padding-left: 1em; padding-right: 1em; } .btn_small { width: 20%; min-width: 120px; } .btn_medium { width: 100%; } .btnLoanHistory { display: inline; margin: 0; padding: 0.5em 1em 0.5em 1em; } .btnLoanHistory a { color: #000000; line-height: 1.25em; } .btnEsigSubmit { display: inline-block !important; margin: 1em 1em 0em 0em !important; border-radius: 8px !important; height: 56px !important; } .backButtonSubmit { background-color: #ffffff !important; color: #555555 !important; border: 2px solid #FCC328 !important; } #IPAddressNote { margin-top: 20px !important; } .btnViewPrint { background-color: #eaeaea; color: #54565b; padding: 0.75em 3em; } .btnViewPrint:focus { background-color: #cacaca; border-color: #8b8b8b; } #achSignButton { margin-left: 0px; } td input[type="submit"], td input[type="button"], td button { font-size: 1em; padding: 4px; margin-right: 4px; } .accessFundsBtn { color: #54565b; display: inline-block; font-size: 14px; font-weight: bold; margin: 0em 0 0.5em 0; padding: 1em 4em; } /* info and errors */ .message-info { border: 1px solid; clear: both; padding: 10px 20px; } .message-error { clear: both; color: #e80c4d; font-size: 1.1em; font-weight: bold; margin: 20px 0 10px 0; } .message-success { color: #7ac0da; font-size: 1.3em; font-weight: bold; margin: 20px 0 10px 0; } .error { color: #e80c4d; } /* styles for validation helpers */ .field-validation-error { -webkit-background-clip: padding-box; background-clip: padding-box; -webkit-border-radius: 3px; border-radius: 3px; color: #c1272d; position: relative; width: 100%; display: block; font-family: Arial; font-weight: 400; line-height: 1.25; margin-top: 5px; } .field-validation-valid { display: none; } .eSig-validation-spacing { position: relative; bottom: 8px; } .input-validation-error { /* -moz-box-shadow: inset 0 0 6px #c1272d; -webkit-box-shadow: inset 0 0 6px #c1272d; box-shadow: inset 0 0 6px #c1272d; background-color: #fffcea!important; border:1px solid #d5d5d5;*/ box-shadow: 0 0 6px #f3d4d5; opacity: 1; outline: 1px solid #c1272d; } .input-validation-error-uploadDoc { box-shadow: 0 0 6px #f3d4d5; opacity: 1; border: 1px solid #c1272d; } .field-validation-error::before { border-left: 0.625em solid transparent; border-right: 0.625em solid transparent; border-bottom: 0.625em solid #c1272d; top: -0.5em; display: block; left: 50%; margin-left: -3%; position: absolute; } input[type="checkbox"].input-validation-error { border: 0 none; } .validation-summary-errors { color: #e80c4d; font-weight: bold; font-size: 1.1em; } .validation-summary-valid { display: none; } .docTypeError:before { left: 14%; } /* tables ----------------------------------------------------------*/ table { border-collapse: collapse; border-spacing: 0; margin-top: 0.75em; border: 0 none; } th { /*font-size: 1.2em;*/ text-align: left; border: none 0px; padding-left: 0; } th a { display: block; position: relative; } th a:link, th a:visited, th a:active, th a:hover { color: #333; font-weight: 600; text-decoration: none; padding: 0; } th a:hover { color: #000; } th.asc a, th.desc a { margin-right: .75em; } th.asc a:after, th.desc a:after { display: block; position: absolute; right: 0em; top: 0; font-size: 0.75em; } th.asc a:after { content: '▲'; } th.desc a:after { content: '▼'; } td { padding: 0.25em 2em 0.25em 0em; border: 0 none; } tr.pager td { padding: 0 0.25em 0 0; } /* ---------------------------------------------------------------------- Suv Nav for FAQ and Service Pages: ---------------------------------------------------------------------- */ .contentSubNav-special { background-color: #333; padding: 10px 5px; } .contentSubNav-sticky { padding: 10px 0 !important; position: absolute; top: 50px; } .contentSubNav { width: 100%; z-index: 700; /*position: fixed;*/ } .contentSubNav_s { display: block; } .contentSubNav_1 { display: none; visibility: hidden; } /*This makes the line between the Select Box labels and the Down Caret*/ .subNav_select_wrap:after { border-left: 1px solid #d5d5d5; content: ''; height: 100%; pointer-events: none; position: absolute; right: 35px; top: 0; } /*This makes the Down Caret in the Sub Nav Select Box*/ .subNav_select:after { font-size: 24px; content: ''; color: #333; font-family: 'icons-advanceamerica'; width: 0; height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 10px solid #333; line-height: 0; position: absolute; right: 11px; top: 38%; pointer-events: none; } .subNav_select { width: 100%; position: relative; overflow: hidden; border: 1px solid #d5d5d5; background-color: #fff; border-radius: 3px; background-clip: padding-box; -webkit-background-clip: padding-box; -webkit-border-radius: 3px; } #ListName { width: 120%; position: relative; padding: 5px 10px; height: 100%; cursor: pointer; border: none; background: transparent; -webkit-appearance: none; } .contentSubNav_list { background-clip: padding-box; -webkit-background-clip: padding-box; border-radius: 3px; -webkit-border-radius: 3px; font-size: 14px; font-size: .875rem; margin: 0; overflow: hidden; text-align: left; } .contentSubNav_link { color: #333333; text-decoration: none; display: block; padding: 10px; } .contentSubNav a:hover, .contentSubNav a:focus, .contentSubNavIsActive { background-clip: padding-box; -webkit-background-clip: padding-box; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; background-color: #333333; color: #ffffff !important; } .contentSubNav a:active { color: #ffc423 !important; } .contentSubNav a:visited { } .contentSubNavDivider { background-color: #ebebeb; display: none; } /* ---------------------------------------------------------------------- Frequently Asked Questions: ---------------------------------------------------------------------- */ .faqContent { float: left; width: 75%; /* Note, the hero image aside widget uses 25% of the screen. */ } .faqContent h1, .faqContent h2, .faqContent h3, .faqContent h4, .faqContent h5, .faqContent h6 { margin-bottom: 15px; font-family: 'opensansregular', Arial, Helvetica, sans-serif; font-weight: 400; } .faqContent h1 { font-size: 32px; } .faqContent h3 { font-size: 25px; } /* Controls the question color: */ .questionLink { color: #2D94B6; /* old color - #186d98 */ font-weight: 600; } .questionLink:hover { /* This wasn't in the original, but it looks better: */ text-decoration: underline; } /* Controls the answer color: */ .answerText { color: #777777; font-size: 14px; line-height: 1.4em; } /* Controls the styling of links within the FAQ answers: */ .answerText a { font-weight: normal; color: #2D94B6; /* old color - #186d98 */ } .answerText a:hover { text-decoration: underline; } /* This list item contains both the question and answer text: */ .questionItem { border-bottom: 1px solid #d5d5d5; padding: 1em 0em 1em 0em; /* Adds space between each question and answer set */ } .faqContent p, .faqContent ul li { font-family: Arial, Helvetica, sans-serif; margin-bottom: 0em; } .faqContent a:hover { background: none; } .faqIntro { border-bottom: 1px solid #d5d5d5; } /* Contains the icons for emailing and printing the FAQs page: */ .faqIntro ul { position: relative; float: right; top: -56px; right: 8px; } .faqIntro ul li { display: inline; border-style: none; margin-left: 6px; } .faqIntro ul li a:hover { text-decoration: none; } /* Email and Print icons, on FAQs page: */ .faqIntro .icn--print, .faqIntro .icn--envelope { font-size: 18px; color: #777777; } .faqIntro .icn--print:hover, .faqIntro .icn--envelope:hover { color: #333333; } /* The image of the bankers, on the right of the FAQs page: */ .faqHeroWrapper { float: right; width: 22%; margin-left: 3%; margin-top: 46px; } .faqHeroImage { float: left; } /* Controls the yellow background, below the bankers: */ .faqHeroCaption { background-color: #faebc3; padding: 32px; border-radius: 0px 0px 3px 3px; -webkit-border-radius: 0px 0px 3px 3px; -moz-border-radius: 0px 0px 3px 3px; text-align: center; line-height: 2em; } .faqHeroCaption p, .faqHeroCaption a { font-family: Arial, Helvetica, sans-serif; } .faqHeroCaption p { float: left; font-size: 18px; margin-top: 1em; } .faqHeroCaption a { color: #333333; font-weight: 600; } .faqViewNowBtn { font-size: 12px; border: 1px solid #d5d5d5; background-color: #ffffff; padding: 10px; } .faqViewNowBtn:hover { background-color: #ebebeb; } .faqBulletList { margin: 10px 0px 10px 0px; } .faqBulletList li { list-style-type: circle; list-style-position: outside; list-style-image: none; border: none !important; /* Overrides this page's borders, that seperate each question. */ line-height: 1.25em !important; } /*------------------------------------------------------------------------------------------------ jQuery datepicker - Calendar Overrides (This overwrites the styles set in /base/jquery themes file): ---------------------------------------------------------------------------------------------*/ .ui-datepicker-title select { color: #000000; /* Heading drop down box text color */ } .ui-datepicker-calendar .ui-state-active { background: #393939; /* The color of the selected date box. */ color: #ffffff; } .ui-datepicker-calendar .ui-state-hover { background: #ffc423; /* The color of the hovered date box. */ color: #000000; } .ui-datepicker .ui-datepicker-header { background: #ffc423; /* The background color for the month/year dropdowns. */ } .ui-datepicker-calendar thead { background: #FFFFFF; /* The background color for the Sunday - Saturday row. */ } .ui-datepicker-calendar th { font-size: 1em; /* Controls the Sunday - Saturday text size and day number size. */ } /* Corner radius */ .ui-datepicker .ui-corner-all, .ui-datepicker .ui-corner-top, .ui-datepicker .ui-corner-left, .ui-datepicker .ui-corner-tl { -moz-border-radius-topleft: 3px /*{cornerRadius}*/; -webkit-border-top-left-radius: 3px /*{cornerRadius}*/; -khtml-border-top-left-radius: 3px /*{cornerRadius}*/; border-top-left-radius: 3px /*{cornerRadius}*/; } .ui-datepicker .ui-corner-all, .ui-datepicker .ui-corner-top, .ui-datepicker .ui-corner-right, .ui-datepicker .ui-corner-tr { -moz-border-radius-topright: 3px /*{cornerRadius}*/; -webkit-border-top-right-radius: 3px /*{cornerRadius}*/; -khtml-border-top-right-radius: 3px /*{cornerRadius}*/; border-top-right-radius: 3px /*{cornerRadius}*/; } .ui-datepicker .ui-corner-all, .ui-datepicker .ui-corner-bottom, .ui-datepicker .ui-corner-left, .ui-datepicker .ui-corner-bl { -moz-border-radius-bottomleft: 3px /*{cornerRadius}*/; -webkit-border-bottom-left-radius: 2px /*{cornerRadius}*/; -khtml-border-bottom-left-radius: 3px /*{cornerRadius}*/; border-bottom-left-radius: 3px /*{cornerRadius}*/; } .ui-datepicker .ui-corner-all, .ui-datepicker .ui-corner-bottom, .ui-datepicker .ui-corner-right, .ui-datepicker .ui-corner-br { -moz-border-radius-bottomright: 3px /*{cornerRadius}*/; -webkit-border-bottom-right-radius: 3px /*{cornerRadius}*/; -khtml-border-bottom-right-radius: 3px /*{cornerRadius}*/; border-bottom-right-radius: 3px /*{cornerRadius}*/; } /*------------------------------------------------------------------------------------------------ Application Page: ---------------------------------------------------------------------------------------------*/ .app_fieldset { margin-bottom: 5px !Important; text-align: left; } .applicationInputField { margin: 10px 0; outline: none !important; border: 0 !important; } .application_wrap { display: inline-block; margin-top: 14px; width: 100%; max-width: 1040px; } #Valid_Customer div { margin-top: 0; } #Valid_Customer a { margin-top: 0; float: right; } .application_wrap label, .payFrequencyWrap label { font-weight: bold; margin-top: 5px; } .applicationSection { overflow: visible !Important; display: none; /* This must be set to none. When the application changes sections, the page is refreshed and all of the sections are opened. This ensures they're closed. */ } /* This will lock the wait spinner to using the entire screen: */ #waitSpinnerParent { height: 100%; left: 0; pointer-events: none; position: fixed; top: 0; width: 100%; z-index: 10000; } /* These two control the custom loading wheel that appears on every app: */ #waitSpinnerWrapper { height: 189px; /* margin-bottom: 1em; */ /* margin-top: 1em; */ width: 90%; z-index: 9000; border-radius: 10px; /*background: #fff; background: -moz-linear-gradient(#fff, #d3d3d3); background: -webkit-linear-gradient(#fff, #d3d3d3); background: -o-linear-gradient(#fff, #d3d3d3);*/ position: relative; /* top: -225px; */ margin: auto; max-width: 200px; /* text-align: center; */ /* left: 37%; */ } .waitSpinnerWrapperESign { margin-bottom: 0; top: 46% !important; /* Support non CSS3 browsers */ top: calc(50% - 95px) !important; /* Subtract the height of the spinner from its position. */ } .waitSpinnerWrapperESign { margin-bottom: 0; top: 46% !important; /* Support non CSS3 browsers */ top: calc(50% - 95px) !important; /* Subtract the height of the spinner from its position. */ } #waitSpinnerAnchor { height: 0; } .preferredSpinner { top: 2292px !important; } .customSpinner { top: 50% !important; /* The spin class adds a top and left, but it doesn't work well */ left: 50% !important; } .terms_header { font-family: Arial, sans-serif; font-size: 1.5em; margin-bottom: 7px; margin-top: 5px; font-weight: 500; } .military_disclosure_box { margin-bottom: 15px; -webkit-background-clip: padding-box; -moz-background-clip: padding-box; background-clip: padding-box; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border: 1px solid #d5d5d5; background-color: #ebebeb; } .military_disclosure_box_body { background-color: #fff; border-bottom: 1px solid #d5d5d5; max-height: 180px; overflow-x: hidden; overflow-y: auto; overflow: auto; padding: 10px; } .military_disclosure_box_text { font-size: 12px; margin: 0; } .required_tag_full { width: 100%; } .required_tag, .required_tag_small { background-color: #ffc423; /*position: relative; left: 40px;*/ } .required_tag_disabled, .required_tag_small_disabled { background-color: #9A9A9A !important; } .required_tag_small, .required_tag_small_disabled { display: inline-block; font-size: .8em; font-weight: 500; /*margin-left: -42px; margin-right: 15px;*/ padding: 5px 10px; /*position: relative;*/ font-family: 'opensansregular', Arial, sans-serif; /*display: none*/ } .requiredBox { /*width: 15%;*/ display: inline-block; } .requiredBox-full { width: 100%; display: block; } .required_tag_small::after, .required_tag_small_disabled::after { border-bottom: 12px solid transparent; border-top: 12px solid transparent; content: ""; height: 0; margin-left: 19px; margin-top: -5px; position: absolute; width: 0; display: none; } .required_tag_full:after { border-bottom: 12px solid transparent; border-top: 12px solid transparent; content: ""; height: 0; margin-left: 10px; margin-top: -5px; position: absolute; width: 0; display: none; } .required-rules { left: 75px; } .move-right { left: 37px !important; } .checkbox_right { position: relative; right: 70px; } .required-rules:after { margin-left: 10px; } .required_tag_small::after, .required_tag::after, .required_tag_full:after { border-left: 7px solid #ffc423; } .required_tag_small_disabled::after, .required_tag_disabled::after { border-left: 7px solid #9A9A9A !important; } .close_arrow:after { margin-left: 10px !important; display: none; } .arrow-left { width: 0; height: 0; border-top: 12px solid transparent; border-bottom: 13px solid transparent; border-right: 10px solid #ffc423; display: inline-block; position: relative; top: 8px; left: 1px; display: none !important; } .arrow-left-optional { width: 0; height: 0; border-top: 12px solid transparent; border-bottom: 13px solid transparent; border-right: 10px solid #ebebeb; display: inline-block; position: relative; top: 10px; left: 1px; display: none; } .optional { background-color: #ebebeb; } .app_hr { border-top: 1px solid #d5d5d5; float: left; margin-top: 20px; width: 100%; } .required_tag::before { border-bottom: 12px solid transparent; border-top: 12px solid transparent; content: ""; height: 0; margin-left: 10px; margin-top: -5px; position: absolute; width: 0; } .optional::after { border-left-color: #ebebeb; right: -7px; display: none; } .checkbox_box { position: relative; bottom: 17px; } .checkbox_copy, .radio_copy { /*display:block;*/ display: inline-block; position: relative; font-weight: normal !Important; margin: 0; } .radio_copy { width: 86%; } .not-checkbox_copy { /*display:block;*/ display: inline-block; position: relative; font-weight: normal !Important; width: 85%; } .not-requiredBox { position: relative; display: inline-block; vertical-align: top; top: 5px; } .checkbox_copy a, .radio_copy a { font-weight: bold; } .warning_info { margin-top: 15px; display: block; } .app-intro { width: 100%; } .app-intro, .maint-intro { padding: 0 0 7px 0; margin: 0 0 18px 0; border-bottom: 1px solid #d5d5d5; font-size: 32px; } .maint-intro { width: 100%; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { /* IE10+ CSS styles go here */ .loadDetailsDropdownArrow { margin-top: -82px !important; } } /* @-moz-document url-prefix() { .loadDetailsDropdownArrow { margin-top: -15px !important; } } */ .loadDetailsDropdownArrow { /* height: 5px; width: 11px; */ margin-left: -23px; margin-top: 12px; cursor: pointer; position: absolute; width: 16.5px; transform: rotate(-90deg); transition: all 300ms ease-in 0s; } .loadDetailsDropdownArrow svg path { fill: none; stroke: #b8b8b9; stroke-miterlimit: 10; } .loadDetailsDropdownArrow svg path:hover, .loadDetailsDropdownArrow svg path { stroke: #b8b8b9; stroke-width: 1.5px; } .loadDetailsDropdownArrow svg path:focus, .loadDetailsDropdownArrow svg path:active { stroke: #000000; } /*.loadDetailsDropdownArrowSVG{ position: absolute; }*/ /* Custom font styles for the maintenance or holiday warning message: */ .WarningBannerWrap { box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); -webkit-box-shadow: 1px 3px 4px rgba(0, 0, 0, 0.35); z-index: 10; } .maintenanceWarningMessageWrap p { font-size: 14px; /* Desktop font size. These font sizes are overwritten in the mobile and tablet media queries. */ /*font-weight: 600;*/ margin-top: 0; margin-bottom: 8px; } .maintenanceWarningMessageWrap h1 { font-size: 20px; font-family: Arial, sans-serif; font-weight: 600; margin: 10px 0 0; } .WarningBannerWrap { background-color: #fec224; padding: 0.25em 0em 0.25em 0em; /*position: relative; top: -30px;*/ width: 90%; -moz-border-radius: 25px; -webkit-border-radius: 25px; border-radius: 25px; margin-bottom: 16px; } .WarningBannerWrap .warning_textbox { text-align: center; margin-top: 10px; width: 100%; } .WarningBannerWrap .warning_img { vertical-align: top; margin-right: 9px; } .WarningBannerWrap .wrap { text-align: center; } .warningMessageReadMore { text-align: center; display: inline-block; font-family: Arial, sans-serif; font-weight: 600; margin: 5px 0; text-decoration: underline; cursor: pointer; } .warningMessageText { display: none; } .noselect { -webkit-touch-callout: none; /* iOS Safari */ -webkit-user-select: none; /* Chrome/Safari/Opera */ -khtml-user-select: none; /* Konqueror */ -moz-user-select: none; /* Firefox */ -ms-user-select: none; /* Internet Explorer/Edge */ user-select: none; /* Non-prefixed version, currently not supported by any browser */ } .refinanceMoreInfoWrap { line-height: 1.5em; margin-top: 0; width: 100%; } .refinanceMoreInfoWrap ul { margin-bottom: 24px; margin-left: 20px; } .refinanceMoreInfoWrap ul li { font-size: 18px; line-height: 1.33333333333333333333333333333333333em; list-style-type: disc; list-style-position: outside; margin-bottom: 0.5em; text-align: left; } .refinanceExampleWrap { margin-bottom: 18px; text-align: center; } .refinanceExampleWrap table { margin: 0 0 10px 0; text-align: left; } .refinanceExampleWrap table tr { line-height: 1.2em; margin: 0; } .refinanceExampleWrap table tr td { font-size: 18px; line-height: 1.1em; padding: 5px; } .refinanceExampleWrap table tr td:first-child { padding-left: 0; } .ohioRefiShowMoreLinkWrap { color: #2D94B6; /* old color - #186d98 */ display: block; font-size: 18px; font-weight: bold; margin-bottom: 1em; margin-top: 1em; text-align: left; text-decoration: underline; } .ohioRefiShowMoreArrow { } .ohioRefiShowMoreArrow:after { } .ohioRefiShowMoreText { } .ohioRefiActionButtonWrap { margin-top: 20px; } .requestAdvanceBtn { display: inline-block; font-size: 18px; margin-bottom: 1.5em; padding: 1em; } .refinanceMoreInfoWrap { line-height: 1.5em; margin-top: 0; width: 100%; } .refinanceMoreInfoWrap ul { margin-bottom: 24px; margin-left: 20px; } .refinanceMoreInfoWrap ul li { font-size: 18px; line-height: 1.33333333333333333333333333333333333em; list-style-type: disc; list-style-position: outside; margin-bottom: 0.5em; text-align: left; } .refinanceExampleWrap { margin-bottom: 18px; text-align: center; } .refinanceExampleWrap table { margin: 0 0 10px 0; text-align: left; } .refinanceExampleWrap table tr { line-height: 1.2em; margin: 0; } .refinanceExampleWrap table tr td { font-size: 18px; line-height: 1.1em; padding: 5px; } .refinanceExampleWrap table tr td:first-child { padding-left: 0; } .ohioRefiShowMoreLinkWrap { color: #2D94B6; /* old color - #186d98 */ display: block; font-size: 18px; font-weight: bold; margin-bottom: 1em; margin-top: 1em; text-align: left; text-decoration: underline; } .ohioRefiShowMoreArrow { } .ohioRefiShowMoreArrow:after { } .ohioRefiShowMoreText { } .ohioRefiActionButtonWrap { margin-top: 20px; } .requestAdvanceBtn { display: inline-block; font-size: 18px; margin-bottom: 1.5em; padding: 1em; } .app_content_left p:first-child { /* padding-right:40px; */ } .app_content_left { width: 65%; } .app_content_right { float: right; width: 30%; display: none; } .store_locator_img { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px 3px 0 0; -webkit-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; display: block; max-width: 100%; } .fieldset_wrap_left { float: left; width: 50%; padding-right: 5px; } .fieldset_wrap_right { float: right; width: 50%; padding-left: 5px; } .eSign_wrap_small_left { /*float: left;*/ padding-right: 5px; width: 25%; margin: 10px 0; } /* This will override any field styles. Use this on drop down lists that you want disabled: */ .applicationDisabledField { background-color: #ebebe4 !important; cursor: default !important; /* No hand cursor */ } .applicationInputField { margin: 0; } .required::after, .fieldLabel:after { content: ":"; } .required::before { content: "*"; } .dob::after { content: " (mm/dd/yyyy):"; font-size: .92em; font-weight: normal; } .dob, .whiteSpaceNoWrap { white-space: nowrap; } .ssn:after { content: " (xxx-xx-xxxx):"; font-size: .92em; font-weight: normal; } .applicationAccordion, .applicationSubAccordion { /* The SubAccordion class is not loaded into the JavaScript functions. These should only be used within sections. */ color: #000000; background-color: #ebebeb; border-radius: 3px; font-family: 'opensansregular', Arial, sans-serif; margin-bottom: 1.5em; margin-top: 1.5em; /* cursor: pointer; This will get added by the JavaScript in Scripts/ApplicationFunctions.js, only if the section was previously opened. */ } /* Controls the text that is displayed on each accordion heading: */ .applicationAccordion h2, .applicationAccordion h3, .applicationAccordion h4, .applicationSubAccordion h2, .applicationSubAccordion h3, .applicationSubAccordion h4 { margin-left: 20px; font-weight: 500; /* Any bolder and it looks like the Dunkin Donuts font */ padding-top: 10px; padding-bottom: 10px; font-family: 'opensansregular', Helvetica, Arial, sans-serif; } .applicationAccordion h2, .applicationSubAccordion h2 { font-size: 2em; } .applicationAccordion h3, .applicationSubAccordion h3 { font-size: 1.7em; } .applicationAccordion h4, .applicationSubAccordion h4 { font-size: 1.5em; } /* Note: The SubAccordion class is not loaded into the JavaScript functions. These should only be used within sections. */ .applicationAccordionActive, .applicationSubAccordionActive { color: #FFFFFF; background-color: #333333; } .applicationAccordionActive { color: #FFFFFF; background-color: #333333; } .appContinueBtn, .appPreviousBtn, .appLoginBtn { text-decoration: none; padding: 10px 20px !Important; margin: 20px 10px 10px 0px; width: auto !Important; font-weight: 600; font-size: 12px; } .appContinueBtn { border: 1px solid #e5a700 !Important; } .appPreviousBtn { background-color: #E0E0E0 !important; border-color: #d2cfcf; } .appContinueBtn:hover, .appPreviousBtn:hover { color: #434343; } .appContinueBtn:active, .appPreviousBtn:active { color: #000000; } .appContinueBtn:hover, .appContinueBtn:focus, .appContineueBtn:active { background-color: #F5D98D !important; } .veritecPrintWrap { } .veritecPrintWrap button { font-size: 14px; } .veritecErrorPageWrap { margin: 0 auto; /* The content was difficult to read per line in desktop: */ max-width: 770px; } .appPreviousBtn:hover, .appPreviousBtn:focus, .appPreviousBtn:active { background-color: #F9F9F9 !important; } .noTopMargin { margin-top: 0; } .store_locator { margin: 20px 0; } .store_locator_img { border-radius: 3px 3px 0 0; display: block; max-width: 100%; } .store_locator_body { text-align-last: left; border-radius: 0 0 3px 3px; background-color: #faebc3; padding: 20px; } .store_locator_text { margin: 15px; font-size: 15px; } .existing_customer { background-color: #ebebeb; border-radius: 3px; padding: 20px 20px 15px 20px; margin-bottom: 20px; } .existing_customer p { padding: 0; margin: 0 0 15px 0; font-size: 12px; } .existing_customer button { border: none; } .scam_alert { margin-top: 20px; text-align: center; } .scam_alert_link { background-color: #ffc423; display: block; font-weight: 600; padding: 20px 25px; padding-right: 25px; position: relative; text-decoration: none; border: none; padding-left: 50px; } .scam_alert_link::before { font-size: 40px; font-size: 2.5rem; opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; filter: alpha(opacity=20); content: "\e613"; font-family: 'icons-advanceamerica'; height: 28px; left: 10px; margin-top: -23px; position: absolute; top: 50%; width: 27px; } .meterTooltip { display: block; pointer-events: none; } #multiple-dropdown { background: -webkit-linear-gradient(#fff, #d3d3d3); background: -o-linear-gradient(#fff, #d3d3d3); background: -moz-linear-gradient(#fff, #d3d3d3); background: linear-gradient(#fff, #d3d3d3); } .docBrowsed { border-left: none; margin-left: -8px; font-family: opensansregular !important; font-weight: bold !important; font-size: 16px !important; max-width: 30% !important; } .DocInputBrowseNoMargin { float: left; margin: 0 0 10px 0 !important; } .POIWidthSelect { width: 30% !important; } .uploadNowSelectStlyes { display: inline-block; width: 65%; } #uploadDropDownList { font-family: opensansregular !important; } .DocInputBrowse { margin-left: 20px !important; max-width: 50%; } .styled-select { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #fff; border: 1px solid #d5d5d5; overflow: hidden; position: relative; width: 100%; } .styled-select select { -webkit-appearance: none; -moz-appearance: none; } .styled-select select:not(:-internal-list-box) { overflow-y: no-display !important; } .styled-select:after { font-size: 24px; font-size: 1.5rem; color: #333333; content: '\e608'; font-family: 'icons-advanceamerica'; font-weight: 300; line-height: 0; pointer-events: none; position: absolute; right: 5px; top: 55%; /*top:18px;*/ } /*Fix for IE 10 and below*/ .styled-select::after { display: none\9; } /*Fix for placeholders in IE9*/ .ieNineLabel { display: block; position: absolute; top: -18px; } .styled-select .styled-select-wrap:after { border-left: 1px solid #d5d5d5; content: ''; height: 100%; pointer-events: none; position: absolute; right: 35px; top: 0; } .styled-select-preferred { margin: -1px; } .portal-dropdown { width: 75%; margin: 20px 0; } .docBrowse:disabled { background-color: rgb(235, 235, 228); cursor: default; } .styled-select select { cursor: pointer; height: 100%; padding: 5px 10px; position: relative; width: 100%; border: none !important; } /*Fix for IE 10 and below*/ .styled-select select { width: 100%; } /* -------------------------------------------------------------------------------- Adverse Action Redirect Page (Desktop): -------------------------------------------------------------------------------- */ .adverseActionOnlinetoStoreP { font-size: 16px !important; } .AdverseActionRedirectLinkColor { color: #2a93b4; text-decoration: underline; font-weight: bold; } .AdverseActionRedirectFontSize { font-size: 16px; } .adverseActionDenialTextWrap { /*line-height: 24px; padding-right: 14%; vertical-align: top;*/ margin-bottom: 3% !important; } .paddingTopClass { padding-top: 1% !important; } .adverseActionDenialTextWrap p { color: #555555; } .adverseActionDenialTextWrap h1 { font-weight: bold; font-size: 28px; color: #555555; text-align: left; } .adverseActionDenialTextWrap svg { display: none; /* The notepad icon is only in mobile */ } .adverseActionWaitSpinner { margin-bottom: 3em; } .ncpOhioAdverseActionHeading { margin-bottom: 0.5em; text-decoration: underline; } .ncpOhioThankYou { text-indent: 4em; } .ncpOhioSignature { margin-left: 50%; } .ncpOhioFederalNotice { border: 1px solid #000000; font-size: 0.9em; /* The requirements have 11pt for the body text and 10pt for this notice. */ font-weight: bold; padding: 0.5em; } /* This is only for the store locator that is on the Adverse Action page: */ #storeLocatorWrap { margin-top: 32px; } /* -------------------------------------------------------------------------------- Store Locator Map: -------------------------------------------------------------------------------- */ .StoreLocatorDesktopLeftColumn, .AdverseActionDesktopLeftColumn { display: inline-block; } .StoreLocatorDesktopLeftColumn { width: 64%; } .StoreLocatorDesktopRightColumn { display: inline-block; width: 35%; } .StoreLocatorDesktopRightColumnImage { margin-left: -2px; /* This corrects a positioning issue, due to the border on the navigation list. */ width: 100%; } #advanceAmericaMap { border: 1px solid #B8B8B9; height: 100%; /* Desktop width and height */ vertical-align: top; } #advanceAmericaMapWrap { position: relative; vertical-align: top; } #StoreLocatorNavigationWrap { height: 100%; margin-left: -5px; /* Fixes a small gap between the map and nav. */ vertical-align: top; } .StoreMapDirectionsBtn { color: #54565B; margin-bottom: 18px; padding: 12px 18%; } /* This styles each store item in the navigation list: */ .StoreNavItem { background-color: #f7f7f7; border-left: 1px solid #929190; border-right: 1px solid #929190; border-top: 1px solid #929190; border-bottom: 1px solid #929190; cursor: pointer; margin: -1px 0; padding-bottom: 10px; padding-top: 8px; vertical-align: top; } .StorePhoneAndHoursLabels { display: inline-block; text-align: center; width: 23%; /* In desktop, this is on the left column. */ vertical-align: top; } /* This styles the store locator pins that are on the navigation list: */ .storeIconWrap { display: inline-block; padding-top: 15px; /* The selected store icon will align with the mileage */ width: 23%; /* In desktop, this is on the left column. */ vertical-align: top; } .StoreNavItemDeSelected .storeIconWrap { padding-top: 0px; /* The selected store icon will align with the mileage */ } .storeIconWrap svg { height: 45px; /* 4:3 ratio */ margin: 0 auto; /* This will center the icon. */ } .storeIconWrap svg text { color: #333333; font-weight: bold; } .StoreNavItemIconDisabled { display: none; } .StoreInfoPhoneIcon, .StoreInfoClockIcon { display: block; height: 18px; margin: 14px auto 0px auto; /* Centers the icons */ } .StoreInfoNotepadIcon { /* This is for the denial letter icon on the Adverse Action section. This will become hidden when the map takes up the full screen. */ cursor: pointer; display: inline-block; height: 42px; margin-right: 10px; vertical-align: middle; } .StoreInfoNotepadIcon .StoreInfoNotepadIconMapOverlay { /* This is for the denial letter icon that's overlaid on the Google Map. This class will be applied to the SVG when the map takes up the full screen. */ /* Position this over the map */ } .StoreInfoNotepadIconMapOverlay { /* position: relative or absolute */ } #StoreInfoMobile { background-color: #333333; display: none; height: 200px; /* This height property is changed in the StoreLocatorMapFunctions.js file, to fit on the screen */ overflow-y: scroll; padding-bottom: 30px; padding-top: 8px; } /* There are different font sizes for the phone number, hours and address: */ #StoreInfoMobile .StoreInfoPhone { font-size: 16px; line-height: 20px; margin-top: 0px; } #StoreInfoMobile .StoreInfoHours { font-size: 11px; line-height: 16px; } #StoreInfoMobile .StoreInfoAddress { font-size: 12px; line-height: 16px; } /* This styles the store's information, such as their hours, phone number, and distance */ .StoreInfoWrap, .StorePhoneAndHoursData { display: inline-block; width: 75%; /* In desktop, this is on the right column. */ } .StoreInfoWrap h3 { color: #54565B; font-size: 21px; font-weight: bold; margin-top: 20px; margin-bottom: 12px; } .StoreInfoWrap p { color: #54565B; font-size: 14px; font-weight: normal; line-height: 20px; margin-right: 30px; margin-top: 0px; } /* This tag is the clickable close button, for exiting from the store details accordion: */ .StoreInfoDetailsCloseBtn { cursor: pointer; display: none; margin-top: -24px; margin-right: 16px; text-align: right; z-index: 6; /* The close button should be above the background. */ } .StoreInfoDetailsCloseBtn:hover { color: #FFFFFF; } /* This is the close button that's in the mobile view. The parent element toggles the visibility: */ #StoreInfoMobile .StoreInfoDetailsCloseBtn { display: block; margin-top: 0px; margin-right: 16px; } .StorePhoneAndHoursWrap { margin: 0 auto; } .StorePhoneAndHoursWrap p, #StoreInfoMobile p, .StorePhoneAndHoursData .StoreInfoPhone a { color: #DEDEDD; } .StorePhoneAndHoursWrap p, #StoreInfoMobile p { font-size: 12px; line-height: 20px; } #StoreInfoMobile h4 { font-size: 12px; font-weight: bold; } #StoreInfoMobile ol li { color: #EAEAEA; font-size: 11px; line-height: 14px; } /* List of items to bring - mobile: */ #StoreInfoMobile .StorePhoneAndHoursData h4 { color: #ffffff; font-size: 12px; font-weight: bold; margin-bottom: 0px; } #StoreInfoMobile .StoreInfoIcon { height: 18px; margin-top: 16px; } #StoreInfoMobile .StoreApprovalItemsBody { background-color: #333333; border: none; padding-bottom: 0px; padding-left: 24%; padding-right: 8%; padding-top: 0px; } #StoreInfoMobile .StoreApprovalItemsBody li { color: #ffffff; font-size: 12px; margin-bottom: 4px; margin-top: 0px; } #StoreInfoMobile .StoreApprovalItemsBody li .checkMarkWrap svg { margin-top: 12px; } #StoreInfoMobile .StoreNavItemIconEnabled { height: 32px; } #StoreInfoMobile .StoreNavItemIconEnabled .StoreNavItemNumber { display: none; } #StoreInfoMobile .StoreNavItemIconEnabled .StoreNavItemStar { display: block; } #StoreInfoMobile .StoreInfoPhoneIcon { margin-bottom: 21px; margin-top: 0px; } #StoreDirectionsAndInstructionsWrap { height: 100%; margin-top: 36px; width: 100%; } /* These styles appear when a store is selected on the navigation list. Every style should use either StoreNavItemSelected or DeSelected: */ .StoreNavItemSelected { background-color: #333333; padding-bottom: 36px; } .StoreNavItemSelected .StoreInfoWrap p, .StoreNavItemSelected .StoreInfoWrap h3 { color: #DEDEDD; } .StoreNavItemSelected .StoreNavItemIconDisabled { display: none; } .StoreNavItemIconEnabled, .StoreNavItemSelected .StoreInfoDetailsCloseBtn, .StoreNavItemSelected .StorePhoneAndHoursWrap { display: block; /* This will appear when the store is selected */ } .StoreNavItemSelected .StoreInfoAddress { margin-bottom: 0px; } /* These styles appear when a store is not selected on the navigation list: */ .StoreNavItemDeSelected { padding-bottom: 0px; padding-top: 0px; } .StoreNavItemDeSelected .StoreInfoWrap p, .StoreNavItemDeSelected .StoreNavItemIconEnabled, .StoreNavItemDeSelected .StorePhoneAndHoursWrap { display: none; /* This will be hidden when the store is not selected */ } .StoreNavItemDeSelected .StoreNavItemIconDisabled { display: block; } .StoreNavItemDeSelected .StoreInfoWrap h3 { margin-bottom: 0px; margin-top: 8px; } /* The required list of items that must be brought to the store */ .StoreApprovalItemsWrap { vertical-align: top; } /* OLD: .StoreApprovalItemsHeader { background-color: #333333; border-top-left-radius: 5px; -moz-top-left-radius: 5px; -webkit-top-left-radius: 5px; border-top-right-radius: 5px; -moz-top-right-radius: 5px; -webkit-top-right-radius: 5px; padding: 25px 35px; } */ .StoreApprovalItemsHeader h4 { color: #54565b; font-size: 22px; font-weight: bold; margin-bottom: 1em; margin-top: 0; } .StoreApprovalItemsHeaderMobile, .StoreNavItemIconDisabledMobile { display: none; } .StoreLocatorMapPopUp { background-color: #000000; /* Kathryn's design had #333333, but the opacity changes this bg color. */ padding: 0% 7% 7% 7%; /* The close X button is at the top */ position: absolute; margin: 18% 22% 22% 22%; opacity: 0.77; z-index: 2; } .StoreLocatorMapPopUp h2 { color: #DEDEDD; font-size: 21px; font-weight: normal; } .StoreLocatorMapPopUp p { color: #DEDEDD; font-size: 14px; line-height: 24px; } .StoreLocatorMapPopUpCloseBtn { margin: 20px 0px 0px 8px; text-align: right; width: 100%; } .StoreLocatorMapPopUpCloseBtn a { color: #B8B8B9; } .StoreLocatorMapCloseBtnFont { font-family: Verdana, Arial, Helvetica, 'DejaVu Sans', sans-serif; font-size: 16px; font-weight: normal; } #LocateNewStoreSearchBarWrap { display: inline-block; padding: 20px 22px 20px 22px; position: absolute; width: 100%; z-index: 3; } #LocateNewStoreSearchBarWrap input { border-color: #B8B8B9; border-radius: 0px; color: #54565B; display: inline-block; height: 32px; vertical-align: top; width: 74%; } #LocateNewStoreSearchBarWrap button { background-color: #333333; border-color: #B8B8B9; border-radius: 0px; color: #DEDEDD; display: inline-block; height: 32px; margin-left: -4px; /* Note: This is changed in the desktop media query to -6px */ vertical-align: top; width: 25%; } #LocateNewStoreSearchBarWrap button:hover { background-color: #1E1E1E; color: #ffffff; } #LocateNewStoreSearchBarWrap button:after { content: "Update Address"; font-family: Helvetica, Arial, sans-serif !important; padding-left: 7px; } .StoreLocatorErrorMessage { color: #ff0000; } #DrivingDirectionsWrap { height: 100%; /* Desktop width and height */ max-width: 80%; margin: 60px auto; vertical-align: top; } /* This is the turn by turn navigation instructions. These were restyled to match the mock ups. */ #DrivingDirectionsNavigationTable { background-color: #FFFFFF; } #DrivingDirectionsNavigationTable table { background-color: #FFFFFF; border: none; color: #54565B; font-family: Arial, Helvetica, sans-serif; font-size: 14px; line-height: 20px; width: 99%; /* This adds 14% margin to the right. */ } /* These are the direction headers, such as the home address and destination address text. */ #DrivingDirectionsNavigationTable .adp-placemark tr td { font-size: 21px; font-weight: bold; line-height: 26px; } #DrivingDirectionsNavigationTable .adp-marker { background-repeat: no-repeat; display: block; height: 40px !important; /* This overwrites the Google CSS for the icon images */ margin-left: -4px; margin-right: -26px; width: 30px !important; /* This overwrites the Google CSS for the icon images */ } #DrivingDirectionsNavigationTable .adp-summary { color: #54565B; font-size: 14px; margin-left: 40px; } #DrivingDirectionsNavigationTable .adp-directions tr { border-top: 1px solid #B8B8B9; } #DrivingDirectionsNavigationTable .adp-directions tr:first-child, #DrivingDirectionsNavigationTable .adp-directions tr:last-child { border-top: 2px solid #54565B; } #DrivingDirectionsNavigationTable .adp-directions tr td { padding-bottom: 21px; padding-top: 21px; } #PrintDrivingDirectionsBtn { margin-left: 20px; margin-top: 2em; } .GoogleMapsBtn { color: #54565B; margin-top: 0px; padding: 12px 18.8%; } .GoogleMapsPrintBtn { color: #54565B; margin-top: 0px; padding: 12px 10.8%; } .storeLocatorPageHeadingWrap { } .storeLocatorPageHeadingWrap h2, .storeLocatorPageBottomWrap h2 { color: #54565b; font-weight: bold; font-size: 22px; text-align: center; } .storeLocatorPageHeadingWrap h2 { margin-bottom: 0; } .storeLocatorPageBottomWrap h2 { margin-top: 0; } .storeLocatorPageHeadingWrap p { color: #54565b; font-size: 16px; line-height: 1.5em; margin-bottom: 3em; margin-left: auto; margin-right: auto; max-width: 506px; text-align: center; } .StoreApprovalItemsBody { } .StoreApprovalItemsBody li { color: #54565b; font-size: 16px; line-height: 20px; list-style-type: none; margin-bottom: 4px; } .StoreApprovalItemsBody li .checkMarkWrap { display: block; height: 8px; width: 15px; } .StoreApprovalItemsBody li .checkMarkWrap svg { margin-top: 14px; } .StoreApprovalItemsBody li .whatToBringContent { display: block; margin-left: 29px; } .requiredStoreItems h4 { color: #54565b; font-size: 22px; font-weight: bold; text-align: center; } .requiredStoreItems ul { margin-left: auto; margin-right: auto; max-width: 46.1em; /* Note: This will need to change if the content is longer */ } .requiredStoreItems ul li { display: inline-block; font-size: 16px; line-height: 20px; list-style-type: none; /* We'll use the :before selector for the check mark */ margin-bottom: 12px; padding-left: 46px; width: 49%; } .requiredStoreItems ul li:before { background-image: url('/Images/Check-Graphic.png'); content: " "; height: 12px; margin-left: -46px; margin-top: 0.33em; position: absolute; width: 18px; } /* Styles for when no store results are found: */ .noStoreResultsFound #advanceAmericaMap, .noStoreResultsFound #StoreLocatorNavigationWrap { border: none; } .noStoreResultsFound #LocateNewStoreSearchBarWrap { margin-left: 30%; /* Centers the search bar */ position: relative; } .noStoreResultsFound .storeLocatorPageHeadingWrap p { max-width: 9999px; /* The no results message should fill the width of the screen */ } .noStoreResultsFound .StoreLocatorMapPopUp { display: none; } .StoreInfoExpandButtonWrap, .StoreInfoCloseButtonWrap { cursor: pointer; height: 36px; margin-top: 16px; position: absolute; right: 18px; /* 30px */ width: 36px; } .StoreInfoExpandButtonWrap .expandBtnBackground, .StoreInfoCloseButtonWrap .expandBtnBackground { fill: #929190; } .StoreInfoExpandButtonWrap .expandBtnBackground:hover, .StoreInfoCloseButtonWrap .expandBtnBackground:hover { fill: #b8b8b9; } .StoreInfoExpandButtonWrap .expandBtnPlus, .StoreInfoCloseButtonWrap .expandBtnPlus { fill: #fff; pointer-events: none; /* This solves an issue where hovering over the plus symbol skipped the background hover style. */ } .StoreNavItemDeSelected .StoreInfoExpandButtonWrap { margin-top: 5px; } .StoreNavItemSelected .StoreInfoExpandButtonWrap { display: none; /* The expand button is not visibile when the store results are opened */ } .StoreInfoCloseButtonWrap { display: none; transform: rotate(45deg); /* The close button replaces the plus button. */ } .StoreNavItemSelected .StoreInfoCloseButtonWrap { display: block; /* The close button only appears for a selected store. */ } /* Interim Login Page - Both AA-Net Customers and Kickstand Lending: */ .login_page_wrap { width: 60%; margin: 0 auto; } .ksl_login_page_wrap { width: 100%; } .kslRedirectHeader { font-size: 2.25em; } .kslInterimLoginNewCustomer, .kslInterimLoginExistingCustomer { display: inline-block; vertical-align: top; width: 49.8%; /* 50% won't make them align in two columns. */ } .kslInterimLoginNewCustomer { padding-left: 2em; } .kslInterimLoginExistingCustomer { border-right: 1px #454545 solid; padding-right: 2em; } .existingKslCustomerSubHeading { display: block; /* Starts a new line, without the extra space a
causes. */ font-size: 0.8em; /* The h2 font is 1.27em; */ } .interimLoginCompanyNameLineBreak { display: none; /* The line break in the AA-Net company title should not appear in desktop or tablet. It will only go in mobile. */ } .app_radio { width: 20px; vertical-align: middle; } .ap_radio, .eSign_radio { vertical-align: top; position: relative; } .ap_radio { margin-top: 3px; } .eSign_radio { margin-top: 0.5em; /* This will center the label text and radio button, vertically, on mobile & tablet */ } -ms-.app_radio { display: none !important; } .app_radio_label { cursor: pointer; font-weight: 400; margin: 0; padding: 0; margin-top: 10px; display: inline; margin-right: 10px; } .app_radio_label span { font-weight: normal; } #Weekly, #BiWeekly, .width-1-2 { width: 50%; } .semi_monthly_h3 { font-size: 1em; font-weight: 600; font-family: Arial,sans-serif; } .semi_monthly_fieldset { float: right; } .styled_select_half_left { width: 30%; float: left; margin-right: 1em; } .styled_select_AND { width: 10%; float: left; vertical-align: middle; padding-left: 15px; padding-right: 15px; } .of_the_month { width: 30%; float: left; vertical-align: middle; padding-left: 15px; } .payFrequencyChoice { margin-bottom: 1.5em !important; } .payheck_frequency_h3 { font-family: Arial,sans-serif; font-size: 14px; font-weight: 500; } .app_income_text { font-size: .92em; line-height: 1.3em; margin-bottom: 0; /*padding-top: 20px;*/ } .appLegalDisclaimer { font-size: 0.85em; color: #777777; } .appLegalDisclaimerBottom { margin-bottom: 2em; } #paydateFreq { margin: 10px 0; display: block; } /* Seen on the update paydates page: */ .preApprovedDisclaimerWrap { margin: 1.5em 0em; padding: 0.5em 1em; max-width: 600px; font-size: 11px; color: #929190; } .preApprovedDisclaimerWrap p { font-style: normal; color: #929190; } .preApprovedCongrats h1, .preApprovedCongrats h2, .preApprovedCongrats p { font-family: Arial, Helvetica, sans-serif; font-weight: bold; } .preApprovedCongrats p { font-size: 14px; line-height: 1.5em; width: 100%; text-align: center; font-style: italic; margin: auto; } /*__________________________________________________________________________________________*/ /*______________________________________PREFERRED APPLICATION:______________________________*/ /*__________________________________________________________________________________________*/ /*.preferred_application_wrap { width:100%; display:inline-block; }*/ .preferredAppIntro { padding: 0 0 7px 0; margin: 0 0 18px 0; width: 100%; border-bottom: 1px solid #d5d5d5; font-size: 1.4rem; } .preferredAccordion { color: #000000; background-color: #ebebeb; border-radius: 3px; float: none; font-family: 'opensansregular', Arial, sans-serif; margin-top: 1.5em; margin-bottom: 1.5em; width: 100%; /* cursor: pointer; This will get added by the JavaScript in Scripts/ApplicationFunctions.js, only if the section was previously opened. */ } /* Controls the text that is displayed on each accordion heading: */ .preferredAccordion h2 { margin-left: 12px; margin-right: 12px; font-weight: 500; /* Any bolder and it looks like the Dunkin Donuts font */ padding-top: 0.75em; padding-bottom: 0.75em; font-size: 1.5em; font-family: Arial, sans-serif; } .preferredAccordionActive { color: #FFFFFF; background-color: #333333; } .preferredSection { overflow: visible !Important; } /* This wraps an entire section of information (such as Identity Info and Contact Info) */ .preferredCategory, .preferredCategoryView, .preferredCategoryStatic, /* The static class does not get modified by JavaScript. The View and Edit are changed when the Edit buttons are pressed. */ .preferredCategoryEdit { display: block; /* overflow:hidden and display:block - Fixes a Safari positioning issue: Bug 7014 and 7015 */ overflow: hidden; width: 100%; } .preferredCategory { padding: 1.25em 0 0 0; } .preferredCategoryView, .preferredCategoryStatic, .preferredCategoryEdit { padding: 1.25em 1em 1.25em 1em; } /* Note: This is only seen for CNU customers or users not logged in: */ .preferredAccountCreationWrap { padding: 0.5em 1em 0.5em 1em; } /* Make sure the padding left and right matches the above categories. There's no top padding due to the question mark icon: */ .preferredProductToggleWrap { padding: 0em 1em 1.5em 1em; width: 100%; } #btnContinuePreferredApp { margin-top: 0px; margin-bottom: 1.5em; } /* Note, the preferredCategoryView is for the normal page view, preferredCategoryEdit is shown when the pencil edit button is clicked. preferredCategory is simply the Military and Other Disclosures section. */ .preferredCategoryEdit { background-color: #ebebeb; /* Note: The edit section is not visible until they click the pencil. This is toggled in Scripts/ApplicationPreferredFunctions.js */ } .preferredCategory h2, .preferredCategoryView h2, .preferredCategoryEdit h2 { font-weight: 500; margin-bottom: 0em; margin-top: 0em; text-decoration: none; } /* This allows the validation messages to push down the rest of the content: */ .preferredAppFieldWrap { /* It's time to give the flicks to float: left; */ display: inline-block; margin-bottom: 0.5em; margin-top: 0.5em; width: 100%; } .preferredPencilEdit, #preferredPencilEditAll { color: #2D94B6; /* old color - #186d98 */ cursor: pointer; float: right; } .preferredPencilEdit { margin-top: -1.6em; /* This centers the Pencil Edit with the Header text */ } #preferredPencilEditAll { display: inline-block; margin-top: 0em; padding: 0.25em 1em 0.25em 1em; } .preferredPencilEdit label, #preferredPencilEditAll label { margin-right: 0.5em; /* Set the Edit button text */ cursor: pointer; } #preferredPencilEditAll label:hover { text-decoration: underline; } /* This replaces the pencil, when in edit mode: */ .btnPreferredSave, #btnPreferredSaveAll { background-color: #f9b600; border: 1px solid #595959; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; display: block; /*float: right;*/ /*don't float right til Tablet*/ font-size: 0.75rem; margin-top: 0em; margin-left: 0px; margin-bottom: 0px; margin-right: 10px; padding: 7px 20px !important; } .preferredSaveHeader { float: left; height: 100%; width: 100%; } .preferredSaveHeader h2 { float: left; } /* When the mouse rolls over a category view, the background will turn gray and the cursor will become a hand: */ .preferredCategoryViewHover { background-color: #ebebeb; /* cursor: pointer; */ } /* This only appears for KSL customers who do not have a previous username. */ .preferredKslApplyWrap { /* float: left; */ } .preferredKslApplyWrap h2 { font-weight: 500; } .preferredKslApplyWrap p { font-size: 1.2em; } .preferredAppMissingFieldsDirections { margin-bottom: 0em !important; } /* Original highlights (yellow): .preferredAppLabelHighlight { background-color: #ffc423; padding: 0.35em; } */ .preferredAppLabelHighlight { border: 1px dotted #ff0000; color: #ff0000; padding: 0.35em; } .preferredProductType { font-family: Arial, Helvetica, sans-serif; font-size: 1.5em; } .kslApplyWrap { padding-top: 0em; } /*__________________________________________________________________________________________*/ /*______________________________________E-SIGNATURE:________________________________________*/ /*__________________________________________________________________________________________*/ /* Use this class to wrap each disclosure checkbox and text. */ .disclosureGroupWrap { margin-bottom: 4em; } .eSignatureNameWrap { margin-bottom: 1em; } .disclosureCheckWrap { width: 100%; } .disclosureCheckWrap_margin { margin-bottom: 45px; } .disclosuresCheckWrap { width: 100%; display: inline-block; } .achfundingwrap { margin-top: 10px; } /*CODEPEN STARTING */ /* @import url('http://fonts.googleapis.com/css?family=Lato'); */ div.radioBtn { color: #AAAAAA; display: block; position: relative; float: left; width: 100%; height: 100px; } div.radioBtn input[type=radio] { position: absolute; visibility: hidden; } div.radioBtn label { display: block; position: relative; font-weight: 300; font-size: 1.35em; padding: 25px 25px 25px 80px; margin: 10px auto; height: 30px; z-index: 9; cursor: pointer; -webkit-transition: all 0.25s linear; } div.radioBtn .check { display: block; position: absolute; border: 1px solid #000; border-radius: 100%; height: 25px; width: 25px; top: 30px; left: 20px; z-index: 5; transition: border .25s linear; -webkit-transition: border .25s linear; } div.radioBtn .check::before { display: block; position: absolute; content: ''; border-radius: 100%; height: 20px; width: 20px; top: 2px; left: 2px; margin: auto; transition: background 0.25s linear; -webkit-transition: background 0.25s linear; } input[type=radio]:checked ~ .check { border: 1px solid #000; } input[type=radio]:checked ~ .check::before { background: #F4A81C; } /*CODEPEN ENDING*/ /* Place this in a label tag around the radio or checkbox button. It will create a column for only the input areas. */ .disclosureInputBtnWrap { display: block; text-align: center; width: 2%; padding-left: 0px !important; } .application .radioButton { -webkit-appearance: button !important; -moz-appearance: button !important; appearance: button !important; border: 1px solid #979797 !important; background: #D8D8D8 !important; width: 22px !important; height: 22px !important; border-radius: 50% !important; } .application .radioButton:checked { border: 7px solid #3293B8 !important; padding: 0px !important; } .disclosureRadioBtn, .disclosureCheckboxBtn { font-size: 14px; margin: 0 auto !important; transform: scale(2); -moz-transform: none; -o-transform: none; vertical-align: middle; /*background: #F4A81C;*/ border: 1px solid #000; } .disclosureRadioBtnIcon { font-size: 14px; margin-left: 146px; margin-top: -33px; margin-right: -50px !important; margin-bottom: -28px !important; transform: scale(2); -moz-transform: none; -o-transform: none; vertical-align: middle; /*background: #F4A81C;*/ border: 1px solid #000; } .disclosureText { color: #787878; display: inline-block; font-size: 14px !important; /* The !important tag is needed to overwrite the global .application style */ font-weight: normal !important; line-height: 1.5em; margin: -1.5em 0 0 5% !important; vertical-align: top; width: 92%; } .disclosureInputIconBtnWrap { display: block; text-align: center; width: 15%; /*margin:0 15px 0 50px;*/ } .iconWrap { display: inline-block; } .pickupInStoreToggle { display: inline-block; vertical-align: middle; /* Align the icon in the middle of the toggle text */ width: 85%; } .pickupInStoreToggle .disclosureInputBtnWrap { /* The wrapping div is only 85% compared to the other disclosures. This will align the radio button and disclosure text with the other full width disclosures. 15% * 1.15 = 17.25% */ width: 25%; } .pickupInStoreToggle .disclosureText { margin: -1.8em 12.75% 0 17.25% !important; width: 78%; } .pickupInStoreGraphic { display: inline-block; vertical-align: middle; /* Align the icon in the middle of the toggle text */ width: 14%; } .pickupIntantGraphic { display: inline-block; vertical-align: top; /* Align the icon in the top of the toggle text */ width: 14%; } .iconEsignPage, .iconEsignPageStore { width: 55px; } .disclosureTextIcon { color: #787878; display: inline-block; font-size: 14px !important; /* The !important tag is needed to overwrite the global .application style */ font-weight: normal !important; line-height: 1.5em; vertical-align: text-top; width: 70%; } .disclosureDarkText { color: #333; } .disclosureTextFieldWrapEPP { display: block; width: 70%; } .disclosureValidationWrap, .disclosureTextFieldWrap { display: block; margin: 0 15% 0 15% !important; /* The !important tag is needed to overwrite the global .application style */ width: 70%; } .disclosureHeaderText { color: #54565b; font-size: 16px; font-weight: bold; } .disclosureHeaderTextSmall { font-size: 14px; } .disclosureHeaderEsignTexts { font-size: 16px; color: #555555; font-weight: bold; line-height: 19px; } .disclosureStorePickupCardTexts { font-size: 14px; color: #555555; font-weight: bold; } .disclosureHeaderTexts { color: #54565b; font-size: 16px; font-weight: bold; /* margin-top: 0px; margin-left: 61px !important; margin-bottom: 0; */ } .disclosureRegularText { color: #787878; font-size: 14px; font-weight: normal !important; line-height: 1.5em; } .disclosureLightText { color: #929190; font-size: 12px; font-weight: normal; } .eSignViewPrintWrap { margin-bottom: 2em; margin-top: 2em; } .InstantFundingItalics { color: #555555; font-size: 14px; font-style: italic; margin-top: 0px; } .eSignAlign { margin-left: 0; } .eSigPopUpWrap { overflow: visible; } .eSigPopUpWrap, .LoanHistoryTransactionsWrap { background-color: #FFFFFF; color: #000000; /*padding: 2em;*/ display: none; } .eSigPopUpInnerWrap, .eSigPopUpPdfInnerWrap { padding: 1em; height: auto; } .eSigPopUpInnerWrapFixedHeight { height: 550px; /* Fallback for non-CSS3 browsers */ height: 80vh; } .eSigPopUpInnerWrap { overflow: scroll; } #installmentOfferRatesPopup .eSigPopUpInnerWrap { /* This accounts for the header height: 550px - 85px */ height: 465px; } .earlyPayoffInnerWrap { padding: 2em; } .docSignPdfWrap { border: 1px solid #b8b8b9; margin: 30px 0; } .docSignPdfWrap object, .docSignPdfWrap iframe { height: 85vh !important; /* The embedded PDF will use 85% of the screen height. */ height: 500px; /* Fallback for non CSS3 browsers */ width: 100%; } .docSignPdfDisclaimer { line-height: 1.25em; margin: 2em 2em 1em 2em; } .docSignDownloadPdfButton { margin-top: 2em; } .docSignPdfDisabledWrap { opacity: 0.2; } .repaymentTextACH { color: #57585D; font-weight: bold; margin-top: 0.5em; } .sendToMyBankAccountBold { color: #57585D; font-family: "Open Sans"; font-size: 14px; font-weight: bold; line-height: 19px; } .noDebitCard { height: 38px; width: 274px; color: #C60909; font-family: "Open Sans"; font-size: 14px; line-height: 19px; } .xAttemptsMessage { height: 38px; width: 274px; color: #C60909; font-family: "Open Sans"; font-size: 14px; line-height: 19px; } /* Internet explorer only - The object tag isn't working with opacity, so we'll hide it: */ @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .docSignPdfDisabledWrap { visibility: hidden; } } /* Use this wrapper for any PDF pop ups. It will hide the extra scroll bars: */ .eSigPopUpPdfInnerWrap { overflow: hidden; } .eSigPopUpWrap { width: 90%; max-width: 1000px; } .eSigPopUpWrap h1 { font-size: 1.4em; } .eSigPdfPopUp { height: 90%; } #loanMeterPaydayInstallmentWrap { margin-bottom: 30px; } /* Sets the print button's position: */ .popUpPrintBtn { margin: 0 20px; } #printableMsPamphlet, #printableMsPamphletESign { max-width: 1209px; max-height: 934px; } #printableMsPamphlet img { width: 175%; height: 100%; } #printableMsPamphlet img { width: 175%; height: 100%; } .imagePopUp { height: 90%; overflow: scroll; max-width: 1000px; } /* Note: This replaces eSigPopUpWrap for images: */ .imagePopUpWrap, .pdfPopUpWrap { background-color: #FFFFFF; color: #000000; display: none; height: 90%; width: 90%; /*max-width: 1250px;*/ max-width: 1000px; } .pdfPopUp { background-color: #333; height: 100%; width: 100%; margin-top: 24px; /* This prevents the X close button from overlapping with the PDF scrollbar. */ overflow: hidden; /* The scrollbars should be part of the PDF plug in. */ } .pdfObject { background-color: #FFFFFF; /* Fixes a bug where the PDF file has a transparent background color. */ height: 90%; /* This allows for enough space to fit the download link below the PDF plugin. */ margin-top: 0px; margin-bottom: 0px; vertical-align: -webkit-baseline-middle; vertical-align: middle; width: 100%; } /* Spacing between each disclaimer paragraph: */ .eSigDisclaimerWrap { display: inline-block; margin-bottom: 1em; margin-top: 0em; width: 100%; } /* Heading for signature box: */ .eSignFieldHeading { color: #54565b; font-size: 14px; /* Kristie requested this to be smaller than the default. However, an H3 tag is too small. */ font-weight: bold; margin-bottom: 0.25em; } /* The Previous and Submit group: */ .eSignButtons { width: 50%; } .eSignDisableAgreement { background-color: #c2c2c2; color: #9a9a9a; overflow: hidden; } .eSignDisableText { opacity: .2; } .eSignDisableTextPosition { /*Adding margin-left for Please ACCEPT the terms of your loan*/ margin-left: 0 !important; } .eSignDirections, .eSignRequiredDirections { display: block; /*margin-left: 2em;*/ } /* Use this for a non-required text block. */ .eSignDirections { } .eSignOrStatement { display: inline-block; margin-top: 0.5em; margin-bottom: 0.5em; } /* The password criteria is a standalone CSS file now */ .mclNotice { /* The requirements called for a 36pt font-size, but it's unreadable on mobile devices font-size: 36pt; */ font-size: 2em; } .mclNotice ol { margin-left: 1em; /* This prevents 10. from being cut off on the pop up. */ } .mclNotice .leftColumn { display: inline-block; width: 100%; } .mclNotice .rightColumn { display: inline-block; width: 100%; /* position: absolute; This will align the text to the top */ } .preLoanDisclosureTXCAB10px { padding-left: 10px; } .preLoanDisclosureTXCAB20px { /* margin-left: 30px;*/ padding-left: 20px; } .preLoanDisclosureTXCAB250bwpdlPrintImage, .preLoanDisclosureTXCAB500bwpdlPrintImage, .preLoanDisclosureTXCAB750bwpdlPrintImage, .preLoanDisclosureTXCAB250mpdlPrintImage, .preLoanDisclosureTXCAB500mpdlPrintImage, .preLoanDisclosureTXCAB750mpdlPrintImage, .preLoanDisclosureTXCAB500bwmplPrintImage, .preLoanDisclosureTXCAB700bwmplPrintImage, .preLoanDisclosureTXCAB1000bwmplPrintImage, .preLoanDisclosureTXCAB500mmplPrintImage, .preLoanDisclosureTXCAB700mmplPrintImage, .preLoanDisclosureTXCAB1000mmplPrintImage { height: auto; max-width: 100%; border: 0 none; vertical-align: middle; } /* This is on a DIV that wraps the image. This will prevent the image from being cut off on a mobile device: */ #LeastExpensiveToMostExpensiveLoans { overflow-x: scroll; overflow-y: visible; } /* Line of Credit - Denial Pop Up: */ .locDenialWrap { background: #FFFFFF; background: -webkit-linear-gradient(#ffffff, #d3d3d3); background: -o-linear-gradient(#ffffff, #d3d3d3); background: -moz-linear-gradient(#ffffff, #d3d3d3); background: -ms-linear-gradient(#ffffff, #d3d3d3); background: linear-gradient(#ffffff, #d3d3d3); border-radius: 16px; max-width: 720px; } .locDenialWrap .locDenialLogo { display: block; margin-left: auto; margin-right: auto; max-width: 480px; } .locDenialWrap .locDenialLogo svg { width: 100%; } /* SVG logo styling: */ .aaLogoGrayColor { fill: #55565c; } .aaLogoPrimaryColor { fill: #ffc429; } .aaLogoSecondaryColor { fill: #ffc425; } #dacAddNewCardErrorMessage{ color: red; } .locDenialWrap p { color: #333333; font-size: 18px; font-weight: bold; line-height: 1.5em; } .locFundingWrap p { font-weight: normal; font-size: 20px; } .locDenialWrap .loginBtn { /* 14px font: padding: 1em 4em; */ padding: 0.75em 3em; } .locDenialWrap .eSigPopUpInnerWrap { height: auto; overflow: hidden; } /* Line of Credit - E-Signature Page: */ .locMarginSpace { margin-top: 60px !important; } #LineOfCreditMeterWrap { margin-top: 2em; } .locManagePayments { margin: 0 auto; text-align: center; } .locManagePaymentsSvgWrap { height: 65px; margin: 4em auto 0 auto; width: 65px; } .locManagePayments h2 { color: #54565b; font-size: 18px; font-weight: bold; margin-bottom: 0; margin-top: 0; } .locManagePayment h2 { color: #54565b; font-size: 18px; font-weight: bold; margin-bottom: 30px; margin-top: -40px; } .loanAgreementTitle { color: #0E5388; font-size: 18px; font-weight: bold; margin-bottom: 0.25em; margin-top: 0.25em; } p.locManagePayments { color: #787878; font-size: 14px; font-weight: normal; line-height: 1.5em; margin-bottom: 2em; margin-top: 0; max-width: 425px; } .locRadioButton { transform: scale(2); } .radioButtonLabelSpacing { margin-left: 40px; } .eSignPaymentIcon { margin-top: 4em; } /* TODO - Delete this class and resave the image so that there is no empty space at the bottom of the image. */ .eSignAccessFundsImage { margin-bottom: -10px; } /* The margin-top accounts for the absolute positioned handle: */ #lineOfCreditSlider { background-color: #f7f7f7; border: 1px solid #787878; border-radius: 24px; -moz-border-radius: 24px; -ms-border-radius: 24px; -webkit-border-radius: 24px; height: 40px; margin-bottom: 2em; margin-top: 90px; } /* The slider handle moves along this invisible track. The width is slightly smaller than the slider graphic, which keeps the handle from moving beyond the min and max edges: */ #lineOfCreditSliderTrack { background: none; border: none; height: 40px; margin-bottom: 50px; margin-left: auto; margin-right: auto; margin-top: -68px; width: 70%; /* Fallback for non-CSS3 browsers */ width: calc(70% - 44px); } /* This is the hamburger button - the important width and margin overrides the jQuery slider CSS The margin-left: -30px offsets the handle button to stay centered in the slider. It should be half of the element width. */ #locSliderHandle { background: none; background-image: url('/Images/LOC-Slider-Handle-Button.png'); background-repeat: no-repeat; border: none; cursor: move; height: 60px; margin-left: -30px !important; margin-top: -6px; width: 60px !important; z-index: 5; } /* Note: The left property is set by JavaScript, to position it above the slider: */ #locSliderHandleElements { background-image: url('/Images/LOC-Slider-Handle.png'); background-repeat: no-repeat; bottom: 40px; height: 60px; margin-bottom: 6px; margin-left: -90px; position: absolute; width: 180px; } #locSliderHandleElements .locCurrentAmountWrap { display: inline-block; } #locSliderHandleElements .locCurrentAmountWrap .locCurrentAmountText, #locSliderHandleElements .locCurrentAmountWrap #locCurrentAmount { width: 94px; } #locSliderHandleElements .locCurrentAmountWrap #locCurrentAmount { color: #ffffff; display: block; font-size: 21px; margin-top: -26px; position: absolute; text-align: center; } #locSliderHandleElements .locPlusMinusBtnsWrap { display: inline-block; height: 25px; margin-top: 13px; width: 25px; } #locSliderHandleElements .locMinusBtnWrap { margin-left: 13px; } #locSliderHandleElements .locPlusMinusBtnsWrap button { background: none; border: none; cursor: pointer; display: block; height: 25px; margin: 0px; padding: 0px; width: 25px; } #lineOfCreditSlider .locSliderMinMaxLabels { cursor: pointer; display: inline-block; font-size: 12px; font-weight: bold; padding: 0px 10px 0px 10px; position: relative; z-index: 2; } /* The slider-range is the grayed out shape that appears to the left of the handle button. Note: The track is not as wide as the background graphic, so this must be pushed to the left: */ #lineOfCreditSliderTrack .ui-slider-range { background: #b8b8b9; border: 1px solid #787878; border-left: none; border-right: none; border-top-left-radius: 24px; border-bottom-left-radius: 24px; -moz-border-top-left-radius: 24px; -moz-border-bottom-left-radius: 24px; -ms-border-top-left-radius: 24px; -ms-border-bottom-left-radius: 24px; -webkit-border-top-left-radius: 24px; -webkit-border-bottom-left-radius: 24px; border-top-right-radius: 24px; border-bottom-right-radius: 24px; -moz-border-top-right-radius: 24px; -moz-border-bottom-right-radius: 24px; -ms-border-top-right-radius: 24px; -ms-border-bottom-right-radius: 24px; -webkit-border-top-right-radius: 24px; -webkit-border-bottom-right-radius: 24px; margin-left: -22px; } #lineOfCreditSliderTrack .ui-slider-range:after { background: #b8b8b9; height: 40px; width: 20px; } .locMeterSubHeading { color: #54565b; font-weight: bold; font-size: 14px; } .locHowMuchWouldYouLike { margin-bottom: 0px; margin-top: 2em; text-align: center; } .locRatesWrap, #lineOfCreditSlider { margin-left: auto; margin-right: auto; width: 70%; } .locMeterLegalText { color: #000000; font-size: 11px; } .locRatesTableDisclosure { font-size: 12px; line-height: 13px; margin-left: auto; margin-right: auto; width: 70%; } .locTableWrap { background-color: #f7f7f7; border: 1px solid #787878; border-radius: 4px; margin-left: auto; margin-right: auto; width: 70%; } .locCreditTableWrap { margin-top: 3.5em; width: 55%; } #locRatesTable, #locCreditTable { margin-top: 0; width: 100%; } #locRatesTable tr, #locCreditTable tr { border-bottom: 1px solid #b8b8b9; } #locRatesTable tr:last-child, #locCreditTable tr:last-child { border-bottom: none; } #locRatesTable tr td, #locCreditTable tr td { color: #54565b; height: 50px; padding: 0px 40px; vertical-align: middle; } #locRatesTable tr td:nth-of-type(odd), #locCreditTable tr td:nth-of-type(odd) { } #locRatesTable tr td:nth-of-type(even), #locCreditTable tr td:nth-of-type(even) { text-align: right; } #locRatesTable #locMeterCreditLine, #locRatesTable #locMeterDrawAmount, #locMeterPaymentDueDate, #locMeterMonthlyPayment, #locCreditTable tr td.locTableBigText { font-weight: bold; font-size: 18px; } /* Line of Credit - Make a Payment*/ .paymentRadioBtn { position: relative; bottom: 5px; } /* Line of Credit - Request an Advance (Make a Draw): */ .locFundsHeader { color: #54565b; font-size: 18px; font-weight: bold; line-height: 1.25em; margin-bottom: 0px; margin-top: 2em; text-align: center; } .locFundsDescription { color: #333333; font-size: 16px; line-height: 1.5em; } .locFundsDescription strong { font-weight: bold; } #locConfirmCancelBtn { margin-right: 2em; } .locFundsDisclaimer { color: #929190; font-size: 11px; line-height: 1.5em; margin-top: 0.5em; text-align: center; } .locFundsErrorMessage { margin-bottom: 3em; text-align: center; } .locFundsAccountSummaryBtnWrap { margin-bottom: 4em; margin-top: 4em; } .locFundsSubmitBtnWrap { text-align: center; } .locFundsSubmitBtnWrap button, .locFundsSubmitBtnWrap a { background-color: #ffc72b; border: 1px solid #f5aa1b; border-radius: 4px; color: #54565b; cursor: pointer; font-size: 14px; font-weight: bold; padding: 1em 15%; } .locFundsSubmitBtnWrap a { padding: 1em 10%; } .locFundsSubmitBtnWrap button:hover, .locFundsSubmitBtnWrap button:active, .locFundsSubmitBtnWrap a:hover, .locFundsSubmitBtnWrap a:active { background-color: #f5aa1b; border: 1px solid #ffc72b; } .locFundsBtn { border-radius: 8px; -moz-border-radius: 8px; -ms-border-radius: 8px; -webkit-border-radius: 8px; font-size: 14px; padding: 0.75em 4%; } #locCancelRequestBtn { height: 3em; /* Needs to be tall enough to fit the wait spinner graphic */ margin-left: 1em; position: relative; } #locConfirmRequestBtn { height: 3em; /* Needs to be tall enough to fit the wait spinner graphic */ margin-right: 1em; position: relative; } .locFundsText { margin-bottom: 1.5em; } .locFundsLabelWrap { display: inline-block; width: 74%; } .locFundsLabelWrap .locFundsDescription { margin: 0 0 0.5em 0; text-align: left; } .locFundsValueWrap { display: inline-block; width: 26%; } .locFundsValueWrap .locFundsDescription { margin: 0 0 0.5em 0; text-align: right; } .centerAlignTxtorBtn { margin: 0 auto; position: relative; text-align: center; } .locRecentTransactionsTableWrap, .locBillingStatementsTableWrap { margin-top: 1em; /* overflow-x: scroll; */ } .noTableBorder { border: 0 !important; } .locRecentTransactionsTable { border-top: 2px solid rgba(0, 0, 0, 0.03); border-bottom: 2px solid rgba(0, 0, 0, 0.03); border-left: 1px solid rgba(0, 0, 0, 0.03); border-right: 1px solid rgba(0, 0, 0, 0.03); width: 100%; } .locRecentTransactionsTable * { text-align: center; } .locRecentTransactionsTable thead { height: 3em; } .locRecentTransactionsTable tbody tr:nth-of-type(even) { background-color: #ebebeb; } .locRecentTransactionsTable tbody tr:nth-of-type(odd), .locRecentTransactionsTable thead tr { background-color: #ffffff; } .locRecentTransactionsTable td, .locRecentTransactionsTable th { border-right: 1px solid rgba(0, 0, 0, 0.03); padding: 10px; } .locRecentTransactionsTable tr td:first-child, .locRecentTransactionsTable tr th:first-child { border-left: 1px solid rgba(0, 0, 0, 0.03); } /* Heading Text: */ .locRecentTransactionsTable thead th { font-size: 14px; font-weight: bold; } /* Heading Text for Billing Statements: */ .locBillingStatementsTableWrap .locRecentTransactionsTable thead th { font-size: 16px; } .locRecentTransactionsTableHead { background-color: #DBF6FF !important; } .locRecentTransactionsTable .mobileTableHeader { display: none; } .pickupInStoreOptionWrap { margin-top: 4em; } .pickupInStoreOptionWrap .disclosureText { /* TODO: Kathryn wants all of the E-Sign page in this color - color: #54565b; */ padding-bottom: 10px; } .pickupInStoreOptionWrap .disclosureText a { color: #3294b8; font-weight: bold; } .pickupInStoreHeading { color: #54565b; margin-bottom: 35px; text-align: center; } .pickupInStoreChoice { color: #54565b; display: block; font-weight: bold; margin-bottom: 8px; margin-left: 15px; } .CashPickupBold { /* margin: 0px 0px 0px 61px !important; */ width: 100%; } /*__________________________________________________________________________________________*/ /*______________________________________ACCOUNT PORTAL:_____________________________________*/ /*__________________________________________________________________________________________*/ .CashPickupBoldItalicas { font-style: italic; } .storeLocator { font-size: 14px; font-weight: bold; text-decoration: underline; color: #3294B8; } .storeLocatorEsignThankYou { font-size: 16px; font-weight: bold; text-decoration: underline; color: #3294B8; } /*__________________________________________________________________________________________*/ /*______________________________________ACCOUNT PORTAL:_____________________________________*/ /*__________________________________________________________________________________________*/ /* Line of Credit - Portal Pages: */ .locInvitationBannerWrap { } .locInvitationBannerCloseWrap { width: 100%; } .locInvitationBannerCloseWrap p { cursor: pointer; font-size: 24px; font-weight: bold; margin: -0.75em 0 -0.5em 100%; } .locInvitationBannerCloseWrap p:hover, .locInvitationBannerCloseWrap p:active { color: #7f7f7f; } .locInvitationBannerGraphic, .locInvitationBannerContent, .locInvitationBannerLinksWrap { display: inline-block; vertical-align: middle; } .locInvitationBannerGraphic { margin-right: 0px; width: 8%; } .locInvitationBannerContent { width: 66%; } .locInvitationBannerContent h2 { font-size: 24px; font-weight: bold; line-height: 1.5em; } .locInvitationBannerLinksWrap { width: 23%; } .locInvitationBannerLinksWrap .locInvitationBannerApplyNowBtn { text-align: right; } .locInvitationBannerLinksWrap .banner-button-a-tag { border-radius: 12px; font-size: 20px; padding: 0.6em 0.85em; } .locInvitationBannerLinksWrap .banner-button-a-tag:hover, .locInvitationBannerLinksWrap .banner-button-a-tag:active { border-left-color: #ffffff; border-top-color: #ffffff; border-bottom-color: #cacaca; border-right-color: #cacaca; color: #ffdc89; } .locInvitationBannerLearnMore { font-size: 14px; margin-top: 0.75em !important; /* Overwrites the .circle--warning p property. */ text-align: right; } .locInvitationBannerLearnMore a { color: #333333; font-weight: normal; text-decoration: underline; } .accountSummaryNotificationBannersWrap { background-color: #ffffff; border: 3px solid #27AAE1; border-radius: 8px; box-shadow: 1px 1px 4px 0 rgba(0,0,0,0.5); margin: 8px auto 90px auto; padding: 22px 48px 32px 48px; } .accountSummaryNotificationBannersWrap h3 { color: #066897; font-size: 24px; font-weight: bold; line-height: 35px; } .accountSummaryNotificationBannersWrap h3:first-child { margin-top: 0; /* No space above the first heading */ } .accountSummaryNotificationBannersWrap p, .accountSummaryNotificationBannersWrap ol li, .accountSummaryNotificationBannersWrap ul li { color: #57585D; font-size: 18px; line-height: 27px; margin-left: 10px; } .lightGrayText li { color: #78797F !important; } .accountSummaryNotificationBannersWrap h3 { color: #066897; font-size: 24px; font-weight: bold; line-height: 35px; } .accountSummaryNotificationBannersWrap h3:first-child { margin-top: 0; /* No space above the first heading */ } .accountSummaryNotificationBannersWrap p, .accountSummaryNotificationBannersWrap ol li, .accountSummaryNotificationBannersWrap ul li { color: #57585D; font-size: 18px; line-height: 27px; margin-left: 10px; } .lightGrayText li { color: #78797F !important; } /* ------------ View/Update Profile Page: ----------------- */ .toUpperCase { text-transform: uppercase; } /*.profileWrapper { margin-left: 23%; }*/ /* Positions the pencil icon within the accordion: */ .profilePencilEdit .icn--edit { float: right; margin-top: 0em; margin-left: 1em; margin-right: 1em; } .profilePencilEdit { color: #2D94B6; /* old color - #186d98 */ cursor: pointer; float: right; margin-top: -2.1em; /* This centers the Pencil Edit with the Header text. This precise number makes it align with the heading text. */ min-height: 27px; /* Some of the sections will not have an Edit button. This keeps the header height consistent. */ padding-bottom: 10px; /* This allows for spacing below the heading text. */ } .profilePencilEdit label { float: left; margin-top: -0.1em !important; /* Set the Edit button text */ cursor: pointer; } .profileWrapper select { border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 1px solid #d5d5d5; padding: 5px 10px; width: 100%; } /* This replaces the pencil, when in edit mode: */ .btnSave, .btnCancel { border: 1px solid #595959; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; display: inline-block; font-size: 0.75rem; padding: 7px 20px !important; } .btnAccountScore { height: 35px; width: 139px; margin-top: 10px; } .btnSave { background-color: #f9b600; } .btnCancel { background-color: #EBEBEB; margin-right: 0.5em; /* This creates spacing between the Cancel and Save buttons */ z-index: 5; } .btnCancel:hover, .btnCancel:active { background-color: #c8c8c8; } .profileViewSection { display: block; float: left; padding: 20px 0px 10px 20px; width: 100%; } .profileViewItemWrapLeft { float: left; width: 50%; } .profileViewItemWrapRight { float: right; width: 50%; } .profileViewItemWrapFull { float: left; width: 100%; } .profileViewItemWrapLeft label, .profileViewItemWrapRight label, .profileViewItemWrapFull label { float: left; margin-bottom: 0em; margin-left: 0em; margin-right: 0.25em; /* This pushes the value further to the right */ margin-top: 0.5em; } .profileEditSection { /* Note: The edit section is not visible until they click the pencil. This is toggled in Scripts/AccountPortalEditProfile.js */ background-color: #ebebeb; float: left; padding: 10px 20px 30px 15px; width: 100%; } .profileAccordion { color: #000000; background-color: #ebebeb; border-radius: 3px; font-family: 'opensansregular', Arial, sans-serif; margin-top: 2em; float: left; width: 100%; /* cursor: pointer; */ } .profileCredentialsChanged { color: #000000; background-color: #FFC300; border-radius: 3px; font-family: 'opensansregular', Arial, sans-serif; margin-top: 2em; float: left; width: 100%; text-align: center; } .newEmailAddress { font-weight: bold; /*text-decoration: underline; font-style: ITALIC; */ } /* Controls the text that is displayed on each accordion heading: */ .profileAccordion h2 { margin-left: 12px; font-weight: 500; /* Any bolder and it looks like the Dunkin Donuts font */ font-size: 14px; font-family: 'opensansregular', Helvetica, Arial, sans-serif; } .profileHeadersMobile { display: none; } .profileAccordionActive { color: #FFFFFF; background-color: #333333; } .profileColon::after { content: ": "; } .profileChangePasswordVerbiage { font-weight: bold; color: #c1272d } .profileCancelSaveButtonWrap { display: block; margin-bottom: 0.5em; /* This gives some space below the buttons, and pushes the black accordion background down. */ margin-right: 1em; margin-top: -2.5em; /* This pulls the buttons up, so they're inline with the header text (Desktop only) */ text-align: right; } #smsOptOutSection, #smsOptInSection { padding-left: 2em; /* This creates an indent on the sub selections */ } /* ------------ My Documents Page (Desktop): ----------------- */ .documentBtnWrap { display: block; float: left; height: 100%; position: relative; text-align: left; width: 100%; } .vehicleListLastRow { /* padding-bottom: 24px; */ border-bottom: 24px solid transparent; /* A workaround to allow extra space on table rows. */ } .vehicleListLastRow:last-child { border-bottom: 0; /* Removes extra space after the last vehicle info */ } .vinWordBreak { word-break: break-all; } .docUploadWrapSpacing { padding-right: 1.5em; } /* Button styles (Add a New Document and Submit): */ .btn_submit, .btn_addNewDoc { /* display: block; */ padding: 0.75em 1em; } .btn_submit { margin: 1em 0.5em 0em 0.5em; width: 18%; } .btn_addNewDoc { margin: 2em auto; height: 59px; width: 221px; border-radius: 3px; margin-top: 1em; margin-bottom: 1em; width: 221px; height: 59px; } .uploadFileBrowseBtn { float: right; height: 2.5em; margin-top: -2.4em; pointer-events: none; /* This fixes a bug with Mac's Safari, because it will click behind the browse button into the input field. */ position: relative; width: 5em; } .account .mobile-table-name { display: none; } /* ----------------------------------- Account - History page: ---------------------------------- */ .LoanHistoryTransactionsWrap h1, .LoanHistoryTransactionsWrap h2, .LoanHistoryTransactionsWrap h3, .LoanHistoryTransactionsWrap h4, .LoanHistoryTransactionsWrap h5, .LoanHistoryTransactionsWrap h6, .LoanHistoryTransactionsWrap { font-family: Arial, Helvetica, sans-serif; margin: 1em 0em 0em 0em; } .LoanHistoryTransactionsWrap table { margin-bottom: 0.5em; margin-top: 0em; } .LoanHistoryTransactionsWrap td, .LoanHistoryTransactionsWrap th { padding: 0.5em 0.75em 0.5em 0.75em; } .LoanHistoryTransactionsWrap thead { background-color: #ebebeb; } .LoanHistoryTableBorder { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; } /*__________________________________________________________________________________________*/ /*_________________________________________HOME PAGE________________________________________*/ /*__________________________________________________________________________________________*/ .home_banner { background: url(/Images/banner-main.jpg); background-size: cover; padding-bottom: 125px; padding-top: 200px; text-align: center; width: 100%; visibility: visible; -moz-box-shadow: inset 0 -25px 100px rgba(0, 0, 0, 0.75); -webkit-box-shadow: inset 0 -25px 100px rgba(0, 0, 0, 0.75); box-shadow: inset 0 -25px 100px rgba(0, 0, 0, 0.75); } .home_banner_h1 { color: #fff; font-weight: 500; line-height: 1; margin: 0; text-shadow: 2px 2px 1px rgba(0, 0, 0, 0.75); font-size: 60px; font-size: 3.75rem; display: none; } .home_banner_h1 > span { display: block; } .home-content { background: url(/Images/bg-content.jpg); background-position: top center; background-repeat: repeat-x; background-color: #fff; padding: 30px 0px; } .home_top_box { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background: url(/Images/bg-locator.jpg); color: #fff; padding: 20px; } .home_top_box_h3 { font-size: 24px; font-size: 1.5rem; line-height: 1.15; margin: 0; } .home_container { padding-bottom: 1em; /*line-height: 1.4em;*/ } .home_top_box > div:first-child { border-bottom: none; margin-bottom: 0; margin-right: -1px; padding-bottom: 0; padding-right: 40px; } .home_top_box > div:last-child { border-left: 1px solid #737270; padding-left: 40px; } .home_top_box > div { display: inline-block; vertical-align: middle; width: 49.8%; } .home_bottom_box_wrap { margin: 40px 0 20px; position: relative; } .home_bottom_box_wrap::before { border-top: 1px solid #d5d5d5; top: -20px; } .home_bottom_box_wrap::after { border-bottom: 1px solid #d5d5d5; bottom: -20px; } .home_bottom_box_wrap::after, .home_bottom_box_wrap::before { content: ''; display: table; left: 0; position: relative; width: 100%; height: 0; } .home_bottom_box { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; border-radius: 3px; -webkit-border-radius: 3px; background-color: #ebebeb; padding: 20px; width: 49%; float: left; height: 100%; position: absolute; } .home_bottom_box + .home_bottom_box { float: right; position: relative; } .bottom_box_img { display: block; margin: 0 auto 15px; max-width: 100%; } .bottom_box_h3 { font-size: 18px; font-weight: 500; } warning_img .bottom_box_body > a { display: block; margin: 0; padding: 10px; font-size: 12px; } /*****************************************************************************/ /**************************Loan Meter Calculator******************************/ /*****************************************************************************/ /********************/ /***Number Circles***/ /********************/ .numberCircle { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; /*behavior: url(PIE.htc); would need to upload pie files for ie8 css support */ width: 42px; height: 42px; padding: 9px 8px; background: #ffdc89; background: -webkit-linear-gradient(#ffdc89, #e4a824); background: -o-linear-gradient(#ffdc89, #e4a824); background: -moz-linear-gradient(#ffdc89, #e4a824); background: -ms-linear-gradient(#ffdc89, #e4a824); background: linear-gradient(#ffdc89, #e4a824); border: 4px solid #000; color: #000; text-align: center; font-weight: bold; font: 16px Arial, sans-serif; display: inline-block; /*box-shadow: 2px 2px 5px #ccc; text-shadow: rgba(253,223,141,1) 0 1px 1px;*/ font-weight: bold; } .numberCircleDisabled { background: #9a9a9a; text-shadow: none; } .calc { display: block; font-family: Arial, sans-serif; position: relative; } .submit-terms__header, .submit-terms__header-no-number { display: inline-block; vertical-align: sub; font-family: Arial, Helvetica, sans-serif; font-weight: 500; margin-bottom: 0; } .submit-terms__header { margin-left: 10px; width: 75%; } p.submit-terms__instructions { margin-bottom: 50px; } #preferredSection1, #preferredSection2, #preferredSection3, #preferredSection4 { display: block; } #preferredSection2 h2, #preferredSection3 h2 { position: relative; top: 10px; } #opener::before { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=45)"; filter: alpha(opacity=45); cursor: pointer; left: -1px; position: relative; top: 1px; content: "\e615"; font-family: 'icons-advanceamerica'; } #opener { color: #000; opacity: 0.45; } #opener:hover, #opener:focus { opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=1)"; filter: alpha(opacity=1); } .noMargin { margin: 0 !important; } .loan-status-tooltip-mark { content: "\e615"; width: 18px; float: right; /*left;*/ margin-left: 6px; text-align: center; background: #000; color: #fff; border-radius: 50px; cursor: pointer; position: relative; /*left: 167px; display:none*/ } .loan-status-tooltip, .payoff-amount-tooltip { width: 89%; position: absolute; text-align: center; margin: auto; background-color: black; color: white; display: none; padding: 10px; } .payoff-amount-tooltip-mark { content: "\e615"; width: 18px; float: right; /*left;*/ margin-left: 1em; text-align: center; background: #000; color: #fff; border-radius: 50px; cursor: pointer; top: 7px; position: relative; right: 5px; } .uploadPlus, .uploadMinus { color: #ffffff; background-color: #222; font-size: 12px; border-radius: 50%; height: 35px; width: 35px; text-align: center; vertical-align: top; display: inline-block; } .uploadPlus h1, .uploadMinus h1 { margin: 0; font-size: 45px; position: relative; top: -19px; left: -.5px; } #select3 { display: none; } .toolTip { color: #ffffff; background-color: #222; font-size: 12px; border-radius: 50%; height: 17px; width: 17px; text-align: center; vertical-align: top; display: inline-block; } .toolTipSmall .toolTip { position: relative; top: 20px; float: left; } .closeTip { position: relative; top: -10px; right: -10px; font-weight: bold; float: right; } #uploadToolTip { display: none; position: absolute; border: 1px solid #222; padding: 10px 15px; width: 300px; z-index: 10; background-color: #fff; left: 0px; top: 230px; box-shadow: 10px 10px 5px #888888; } #uploadToolTip .toolTip { float: left; position: relative; top: 10px; } #uploadToolTip span { display: block; margin-left: 30px; margin-right: 5px; } #uploadPayStubTip, #uploadBankStatementTip { display: none; position: absolute; width: 200px; background-color: #ffc423; padding: 10px 15px; } #uploadPayStubTip { top: 127px; left: 96px; } #uploadBankStatementTip { top: 112px; left: 0px; } .uploadLaterPopUp > div { -moz-border-radius: 1.2em; -webkit-border-radius: 1.2em; /*border: 3.5px solid #979797;*/ border-radius: 1.2em; background-color: #ffffff; position: relative; padding: 30px 35px; top: 70px; max-width: 875px; margin: 30% 5%; } .uploadLaterPopUp p { text-align: left; padding: 10px 40px; } .toolTipSmall span { display: block; margin-left: 30px; margin-right: 5px; } .tooltipSpacing { float: left; margin-top: 0.1em; margin-left: 0.1em; } .tooltipLoanDocPrint { font-size: 1.25em; /* A larger font size so you can see the question mark */ margin-left: 0.75em; position: relative; top: -10px; vertical-align: top; } .close-x { stroke: black; fill: transparent; stroke-linecap: round; stroke-width: 5; } /*Content Overlay*/ .appPopUpOverlay { position: fixed; background: rgba(0, 0, 0, 0.4); top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; opacity: 1; pointer-events: none; display: none; text-align: center; margin: auto; } #resCodePopUp .appPopUpLight { border-radius: 3px; width: 85%; background: #ffffff; padding: 50px 10px; } .appPopUpLight > p { margin: 20px auto 0; max-width: 300px; text-align: center; font-size: 12px; color: #939291; } .appPopUpLight > a { background: #FFC72A; border: 1px solid #F5AA1B; color: #54565B; -webkit-box-shadow: none; box-shadow: none; } .resTable { display: flex; flex-wrap: wrap; padding: 0; } .resTable-cell { box-sizing: border-box; flex-grow: 1; width: 100%; padding: 4px; overflow: hidden; list-style: none; background: transparent; text-align: left; color: #000; font-size: 12px; display: inline-block; } .textRight.resTable-cell { text-align: right; } .resTable-2cols > div { width: 50%; } .appPopUpDark { width: 50%; min-width: 285px; margin: auto; position: relative; top: 150px; background: #222; max-width: 500px; padding: 75px 10px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; } .appPopUpDark input { background: #DD8026; color: #fff; height: 50px; border: #f5aa1b; width: 77.5%; } .appPopUpDark input:hover { } .appPopUpOverlay .popup_close { float: right; position: relative; top: -83px; background: #ffc423; color: #222; width: 35px; height: 35px; -moz-border-radius: 40px; -webkit-border-radius: 40px; border-radius: 40px; padding: 4px 0 3px; font-weight: 500; font-size: 19px; border: 1px solid #f5aa1b; } .appPopUpOverlay div p { color: #fff; font-weight: normal; } .appPopUp-wrap { width: 70%; margin: 0 auto; text-align: center; font-weight: 700 !important; /*position:relative; bottom: 5px;*/ } /* ------------------------------------------------- Account - Make a Payment: ------------------------------------------------- */ .paymentPendingNotification, .paymentSummaryInfoWrap { border-radius: 4px; margin: 1.5em 15% 2.75em 15%; width: 70%; } .paymentSummaryInfoWrap { background-color: #333333; } .paymentSummaryInfoWrap .paymentSummaryLabel { color: #b8b8b9; display: block; font-size: 12px; margin: 0; text-align: left; width: 50%; /* Make this match the Value width below */ } .paymentSummaryInfoWrap .paymentSummaryValue { color: #ffffff; display: block; margin: 0; font-size: 16px; text-align: left; width: 50%; /* Make this match the Label width above */ } .paymentSummaryInfoWrap hr { border-top: 1px solid #b8b8b9; height: 1px; margin: 0; width: 100%; } .paymentSummaryGroup { display: inline-block; vertical-align: top; width: 50%; } .paymentSummaryGroup:nth-of-type(odd) { margin-right: 1%; width: 49%; } .paymentSummaryGroup:nth-of-type(even) { margin-left: 1%; width: 49%; } .paymentSummaryGroupTop { padding-bottom: 12px; padding-top: 12px; } .paymentSummaryGroupBottom { padding-bottom: 12px; } .paymentPayoffOptionWrap { margin-bottom: 0.75em; } /* The Payoff Box is static and cannot be changed. The One Time payment can be edited. Both boxes should have a similar style: */ .paymentPayoffBox, .paymentOneTimeFieldsWrap input { border-radius: 4px; display: inline-block; height: 50px; margin: 1.25em 0 0 0; width: 47.5%; } .paymentPayoffBox { background-color: #f7f7f7; border: 1px dashed #b8b8b9; margin-bottom: 2em; } .paymentPayoffBox:nth-of-type(odd), .paymentOneTimeFieldsWrap input:nth-of-type(odd) { margin-right: 5%; } .paymentPayoffBox .paymentPayoffLabel, .paymentOneTimeFieldsWrap .paymentPayoffLabel { color: #aeaeae; display: block; font-size: 11px; margin: -2px 0 0 0.5em; } .paymentPayoffBox .paymentPayoffValue { color: #54565b; display: block; font-size: 14px; margin: 0 0 0.5em 1em; } .paymentOneTimeFieldsWrap { margin-bottom: 2em; } .paymentOneTimeFieldsWrap input { border: 1px solid #b8b8b9; font-size: 14px; } .paymentOneTimeFieldsWrap .paymentPayoffLabel { display: inline; position: absolute; margin-left: 7px; margin-top: 15px; } .paymentOneTimeText { display: block; padding-bottom: 0.5em; padding-top: 0.75em; } .MakePaymentOnDueDateContinueWrap { text-align: center; } .submitPaymentBtnWrap { margin-bottom: 2.5em; margin-top: 1.25em; } .submitPaymentBtnWrap button { border-radius: 2px; color: #54565b; font-size: 14px; font-weight: bold; padding-bottom: 1.25em; padding-top: 1.25em; position: relative; width: 100%; } .submitPaymentBtnWrapHalf { display: inline-block; width: 47.5%; } .cancelPaymentBtnWrapHalf { display: inline-block; margin-right: 5%; width: 47.5%; } .cancelPaymentBtnWrapHalf button { background-color: #eaeaea; border: 1px solid #b8b8b9; border-radius: 2px; color: #54565b; font-size: 14px; font-weight: bold; padding-bottom: 1.25em; padding-top: 1.25em; width: 100%; } .cancelPaymentBtnWrapHalf button:hover, .cancelPaymentBtnWrapHalf button:active, .cancelPaymentBtnWrapHalf button:focus { background-color: #c8c8c8; border: 1px solid #8d8d8d; } .paymentLegalText { color: #929190; font-size: 11px; margin-top: 0; } .paymentPageFontColor { color: #54565b; } .asteriskSize { font-size: 14px !important; } .paymentPrintBtn { width: 220px; height: 59px; border-radius: 3px; } .paymentThankYouPageWrap { } .paymentThankYouPageWrap h3 { font-size: 16px; margin: 1.5em 0 1.75em 0; } .paymentReceiptTableWrap { background-color: #f7f7f7; border: 1px solid #787878; border-radius: 2px; /*margin: 0 auto;*/ width: 60%; margin-top: -18px; } .paymentReceiptTableWrap table { margin: 0; width: 100%; } .paymentReceiptTableWrap table tr { border-bottom: 1px solid #b8b8b9; } .paymentReceiptTableWrap table tr:last-child { border-bottom: none; } .paymentReceiptTableWrap table tr td { padding: 1.25em 2.75em; } .paymentReceiptTableWrap table tr td:nth-child(even) { text-align: right; } .PaymentThankYouPrintWrapFuse { width: 60%; } .PaymentThankYouPrintWrapFuse a { display: block; font-weight: bold; padding: 1.25em 0; font-size: 16px; margin-top: 22px; } .PaymentThankYouPrintWrap { margin: 2.75em auto 0 auto; width: 60%; } /* TA36527 - The Safari iPhone browser needs these CSS classes - https://davidwalsh.name/scroll-iframes-ios */ .paymentIFrameWrapper { -webkit-overflow-scrolling: auto !important; z-index: 10005; } .paymentIFrameWrapper iframe { -webkit-overflow-scrolling: auto !important; z-index: 10006; } .PaymentThankYouPrintWrap a { display: block; font-weight: bold; padding: 1.25em 0; } .PaymentConfirmationPopUp { } .PaymentConfirmationPopUp h1 { color: #54565b; margin: 0.25em 0 0.5em 0; font-size: 24px; text-align: center; } .PaymentConfirmationPopUp h2 { color: #54565b; font-size: 14px; font-weight: bold; } .PaymentConfirmationPopUp .PaymentConfirmationAuthorization { margin: 2.5em 0 1em 0; } .PaymentConfirmationPopUp .PaymentConfirmationLegalText { margin: 1em 0 1.5em 0; } .PaymentConfirmationPopUp .eSigPopUpInnerWrap { padding: 2em 5em; /* Desktop */ } .PaymentConfirmationDetailWrap { display: inline-block; width: 33.33333333333333333333333333333333333333333333333333333333333333333333333%; } .PaymentConfirmationDetailWrap h2 { margin: 0.5em 0; } .PaymentConfirmationDetailWrap label { color: #54565b; font-size: 16px; } .PaymentConfirmationLegalText { color: #929190; font-size: 11px; line-height: 1.5em; } .PaymentConfirmationButtons { margin-top: 3.5em; padding: 0 2em; } .PaymentConfirmationButtons button { color: #54565b; display: inline-block; font-size: 14px; padding: 1.25em 0; width: 49%; } .PaymentConfirmationButtons button:first-child { margin-right: 1%; } .PaymentConfirmationButtons button:last-child { margin-left: 1%; } .paymentCancelMessage { font-size: 16px; margin-top: 2em; text-align: center; } .paymentIsEnrolledAutoPayments { display: block; margin-bottom: 2em; } .paymentPendingNotification { background-color: #3293B8; margin-bottom: -0.75em; margin-top: -0.25em; } .paymentPendingNotification p { color: #ffffff; font-size: 12px; padding: 0.15em 1em; text-align: center; } .PaymentPopup_wrap { max-width: 1000px !important; min-width: 300px !important; margin: 10px auto; padding: 40px !important; position: static !important; /* This overwrites .ForgotPopUp > div, .appPopUp > div - Look into refactoring later */ overflow-y: scroll; text-align: left; width: 90% !important; } .paymentPageFieldWrap { margin: 0 auto; max-width: 80%; } /* New Cancel and Action buttons - do not change these. Put any positioning and sizing properties on another class, so we can reshare these everywhere. */ .buttonCancel, .buttonAction, .buttonActionBlue { border-radius: 2px; color: #54565b; cursor: pointer; font-size: 16px; font-weight: bold; padding: 1.25em 1.75em; position: relative; } /* Do not change these */ .buttonCancel { background-color: #eaeaea; border: 1px solid #b8b8b9; } /* Do not change these */ .buttonCancel:hover { background-color: #b8b8b9; } .buttonAction { background-color: #ffc72b; border: 1px solid #f5aa1b; } /* Do not change these */ .buttonAction:hover { background-color: #f5aa1b; } .buttonActionBlue { background-color: #2A93B4; border: 1px solid #3293B8; color: #FFFFFF; } .buttonActionBlue:hover { background-color: #28839f; color: #FFFFFF; } /* End New Cancel and Action buttons - do not change these. */ /* When the wait spinner becomes active, the button text will dissappear and an animation will be shown: */ .waitSpinnerAnimationOnButton { background-color: #f5aa1b; /* Make sure this matches the buttonAction:hover color */ border: none; color: rgba(0, 0, 0, 0) !important; color: transparent !important; outline: none; } .waitSpinnerAnimationOnButton:focus { outline: none; } .waitSpinnerAnimationOnButton::before { animation: spin .5s linear infinite; -moz-animation: spin .5s linear infinite; -webkit-animation: spin .5s linear infinite; background-image: url('/Images/ButtonSpinnerIcon.png'); background-position: center center; background-repeat: no-repeat; background-size: 38px; content: ''; height: 38px; left: 50%; margin-left: -19px; /* This should be half of the image's width */ margin-top: -12px; position: absolute; width: 38px; } @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } .ForgotPopUp, .appPopUp, .uploadLaterPopUp { position: fixed; font-family: Arial, Helvetica, sans-serif; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,0.8); z-index: 99999; opacity: 1; -webkit-transition: opacity 200ms ease-in; -moz-transition: opacity 200ms ease-in; transition: opacity 200ms ease-in; pointer-events: none; display: none; overflow: auto; } .ForgotPopUp > div, .appPopUp > div { width: 50%; min-width: 255px; max-width: 488px; position: relative; margin: 10% auto; padding: 40px 0; border-radius: 10px; background: #fff; background: -moz-linear-gradient(#fff, #d3d3d3); background: -webkit-linear-gradient(#fff, #d3d3d3); background: -o-linear-gradient(#fff, #d3d3d3); } .my_popup_img { margin: 0 auto; width: 20%; } .my_popup { background-color: white; border-radius: 4px; border: 1px solid #222; margin: auto auto; padding: 10px; left: 0; right: 0; } .my_popup_img { margin: 0 auto; } #my_popup p { width: 80%; margin: 10% auto; text-align: center; font-weight: bold; font-size: 16px; } .my_popup_close { background: #606061; color: #FFFFFF; line-height: 25px; position: absolute; right: 0; /*This is a fix to the close btn cutoff in mobile*/ text-align: center; top: -10px; width: 24px; text-decoration: none; font-weight: bold; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; } .popup_close { /*Used for Popups without a click event*/ background: #606061; color: #54565b; line-height: 25px; position: absolute; right: -12px; text-align: center; top: -10px; width: 24px; text-decoration: none; font-weight: bold; -webkit-border-radius: 12px; -moz-border-radius: 12px; border-radius: 12px; -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #000; box-shadow: 1px 1px 3px #000; } .my_popup_close:hover, .popup_close:hover { background-color: #ffc423; color: #000000; } span.xPositioning { position: relative; top: 2px; } .aaImage { /*bottom: 25px; position: relative;*/ width: 100%; } /*How It Works */ .howItWorksList { margin-left: 60px; } .howItWorksList li { list-style-type: disc; } .howItWorksIcons { display: inline-table; width: 30%; } #my_popup { transform: scale(0.8); } .popup_visible #my_popup { transform: scale(1); } /* Stick headers */ .component { line-height: 1.5em; margin: 0 auto 3em 0; overflow: auto; padding: 0; width: 100%; } .component .filler { font-family: "Blokk", Arial, sans-serif; color: #d3d3d3; } .component table { background: #fff; border: 1px solid #ccc; border-collapse: collapse; display: table; width: 100%; } .component td, .component th { padding: 0.75em 1.5em; text-align: left; } .component td.err { background-color: #e992b9; color: #fff; font-size: 0.75em; text-align: center; line-height: 1; } .component th { background-color: #ffc423; font-weight: normal; color: #000; white-space: nowrap; } .component tbody th { background-color: #2ea879; } .component tbody tr:nth-child(2n-1) { background-color: #ccc; transition: all .125s ease-in-out; } .component tbody td { border: 1px solid #ddd; } /* For appearance */ .sticky-wrap { overflow-x: auto; overflow-y: hidden; position: relative; margin: 0; width: 100%; } .sticky-wrap .sticky-thead, .sticky-wrap .sticky-col, .sticky-wrap .sticky-intersect { opacity: 0; position: absolute; top: 0; left: 0; transition: all .125s ease-in-out; z-index: 50; width: auto; /* Prevent table from stretching to full size */ } .sticky-wrap .sticky-thead { box-shadow: 0 0.25em 0.1em -0.1em rgba(0,0,0,.125); z-index: 100; width: 100%; /* Force stretch */ } .sticky-wrap .sticky-intersect { opacity: 1; z-index: 150; } .sticky-wrap .sticky-intersect th { background-color: #666; color: #eee; } .sticky-wrap td, .sticky-wrap th { box-sizing: border-box; } /* Not needed for sticky header/column functionality */ td.user-name, .capitalizeText { text-transform: capitalize; } .sticky-wrap.overflow-y { overflow-y: auto; max-height: 50vh; } .congrats_h1 { background-color: #000; color: #fff; padding: 10px 15px; font-size: 1.3em; } .table-breakdown { width: 50%; margin-bottom: 20px; margin-left: 20px; font-family: Arial, sans-serif; } .table-breakdown thead > tr > th, .table-breakdown tbody > tr > th, .table-breakdown tfoot > tr > th, .table-breakdown thead > tr > td, .table-breakdown tbody > tr > td, .table-breakdown tfoot > tr > td { padding: 8px; line-height: 1.428571429; vertical-align: top; border-top: 1px solid #ddd; } .table-left { text-align: right; } .intro-head { font-weight: bold; margin-top: 8px; margin-left: 0px; } .intro-head h2 { font-family: Arial, helvetica, sans-serif; font-weight: 600; margin-bottom: 0; } .table-right { font-weight: bold; } .alignBottom { vertical-align: bottom; } .oklahoma-font-size, .oklahoma-font-size thead tr th { font-size: 20px !Important; font-family: Arial, sans-serif; } /* New Loan Slider Styles*/ #slider { text-align: center; margin: auto; background-color: transparent; height: 50px; z-index: 11; cursor: pointer; } .calc__head .ui-widget-content { border: none; background: none; } .calc__head .ui-slider-handle { top: -39px; border: none; /* background: transparent!important; */ background: #ffdc89 !important; background: -webkit-linear-gradient(#ffdc89, #e4a824) !important; background: -o-linear-gradient(#ffdc89, #e4a824) !important; background: -moz-linear-gradient(#ffdc89, #e4a824) !important; background: linear-gradient(#ffdc89, #e4a824) !important; height: 49px; border-radius: 0; cursor: pointer; background-color: transparent; color: #393839; font-weight: 600; font-size: 16px; font-family: Arial, sans-serif; position: absolute; margin-top: 39px; display: none; } .teardrop:before { content: '-'; display: block; color: transparent; background-image: url('/Images/tear.png'); text-align: center; margin: auto; z-index: -10; background-repeat: no-repeat; width: 46px; height: 54px; margin-top: -42px; margin-bottom: 3px; } .tearHide:before { visibility: hidden; } /* Fixes a visual issue from upgrading jQuery-UI to version 1.12 - An outline appears in the newest version. See Task 20833 for an impact analysis: */ .ui-slider-handle { outline: none; } /*.ui-slider-handle:after { width: 0; height: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 10px solid #E5A923; content: '?'; color: transparent; position: relative; top: -1px; left: -26px; }*/ #calc__values { position: relative; margin-top: -51px; width: 100%; text-align: center; display: table; /*margin-bottom: 3px;*/ z-index: 10; } #calc__values li { display: table-cell; color: #e6e7e8; font-size: 16px; cursor: default; text-decoration: none; padding: 14px 0; position: relative; top: 2px; } /*#calc__values li:nth-child(2n+1) { visibility: hidden; }*/ .calc__output { border: 1px solid #e5a700; margin: 50px auto 20px auto; background-color: #808285; width: 70%; } .calc { display: block; font-family: Arial, sans-serif; position: relative; } .calc__amount, .padBottom { padding-bottom: 20px; } .calc__amount h3 { font-size: 14px; font-size: 0.875rem; font-family: Arial, sans-serif; font-weight: 600; margin-bottom: 5px; margin-top: 0; } .calc__amount > div { display: inline-block; width: 68%; padding-right: 30px; vertical-align: middle; } .calc__amount .calc__slider { height: 0.875em; } .calc__amount > .calc__field { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; background-color: #ebebeb; border: 1px solid #d5d5d5; color: #333333; display: inline-block; font-weight: 600; overflow: hidden; padding: 5px; text-align: center; vertical-align: middle; width: 30%; } .calc__output > div { font-size: 13px; font-size: 0.8125rem; font-weight: 600; padding: 10px; } /* Orange - First payment due date */ .calc__output > div:nth-child(2) { background: #fec36a; background: -webkit-linear-gradient(#fec36a, #fbac21); background: -o-linear-gradient(#fec36a, #fbac21); background: -moz-linear-gradient(#fec36a, #fbac21); background: linear-gradient(#fec36a, #fbac21); } .calc__output > div:nth-child(3) { background: #dfe0e1; background: -webkit-linear-gradient(#dfe0e1, #c2c4c6); background: -o-linear-gradient(#dfe0e1, #c2c4c6); background: -moz-linear-gradient(#dfe0e1, #c2c4c6); background: linear-gradient(#dfe0e1, #c2c4c6); } .calc__output > div:nth-child(4) { background: #E2E3E4; background: -webkit-linear-gradient(#dfe0e1, #d1d3d4); background: -o-linear-gradient(#dfe0e1, #d1d3d4); background: -moz-linear-gradient(#dfe0e1, #d1d3d4); background: linear-gradient(#dfe0e1, #d1d3d4); } .calc__output > div:nth-child(5) { background: #e4e5e6; background: -webkit-linear-gradient(#e4e5e6, #dcddde); background: -o-linear-gradient(#e4e5e6, #dcddde); background: -moz-linear-gradient(#e4e5e6, #dcddde); background: linear-gradient(#e4e5e6, #dcddde); } .calc__output > div:nth-child(6) { background: #eeeff0; background: -webkit-linear-gradient(#eeeff0, #e6e7e8); background: -o-linear-gradient(#eeeff0, #e6e7e8); background: -moz-linear-gradient(#eeeff0, #e6e7e8); background: linear-gradient(#eeeff0, #e6e7e8); } .calc__output > div:nth-child(7) { background: #f6f6f6; background: -webkit-linear-gradient(#f6f6f6, #ededee); background: -o-linear-gradient(#f6f6f6, #ededee); background: -moz-linear-gradient(#f6f6f6, #ededee); background: linear-gradient(#f6f6f6, #ededee); } .calc__output > div:nth-child(8) { background: #f8f8f9; background: -webkit-linear-gradient(#f8f8f9, #f1f2f2); background: -o-linear-gradient(#f8f8f9, #f1f2f2); background: -moz-linear-gradient(#f8f8f9, #f1f2f2); background: linear-gradient(#f8f8f9, #f1f2f2); } .calc__output > div:nth-child(9) { background: #f9f9f9; background: -webkit-linear-gradient(#f9f9f9, #dedede); background: -o-linear-gradient(#f9f9f9, #dedede); background: -moz-linear-gradient(#f9f9f9, #dedede); background: linear-gradient(#f9f9f9, #dedede); } .calc__output > div:nth-child(10) { background: #f2f2f2; background: -webkit-linear-gradient(#f2f2f2, #d7d7d7); background: -o-linear-gradient(#f2f2f2, #d7d7d7); background: -moz-linear-gradient(#f2f2f2, #d7d7d7); background: linear-gradient(#f2f2f2, #d7d7d7); } .calc__output > div:first-child { -moz-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1); box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.1); border-top: none; padding: 0; font-weight: 500; } .calc__label { display: inline-block; vertical-align: middle; width: 68%; font-family: 'opensansregular', Helvetica, Arial, sans-serif !Important; font-size: 16px !important; } .calc__info { display: inline-block; text-align: right; vertical-align: middle; width: 30%; font-family: 'opensansregular', Helvetica, Arial, sans-serif !Important; font-size: 1.2em; } .calc__legal { font-size: 10px; font-size: 0.625rem; margin-bottom: 0; } .calc__icn { opacity: 0.45; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=45)"; filter: alpha(opacity=45); cursor: pointer; left: -1px; position: relative; top: 1px; } .calc__icn:focus, .calc__icn:hover { opacity: 0.85; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; filter: alpha(opacity=85); } .calc__head h3 { font-size: 14px; font-size: 0.875rem; /* Sam, I removed this based on Mickey's feedback: border-bottom: 1px solid #d5d5d5; */ font-family: Arial, sans-serif; /*font-weight: 600;*/ margin-bottom: 10px; margin-top: 10px; margin-left: 58px; padding-bottom: 5px; width: 60%; } .calc__head h3 span { font-weight: 100; } .calc__adjust { background-color: #ebebeb; padding: 5px; display: none; } .calc__adjust > button, .calc__adjust > .calc__sum { display: inline-block; vertical-align: middle; } .calc__adjust > button { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; -moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); -webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25); font-size: 35px; font-size: 2.1875rem; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -ms-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; background-color: #ffc423; border: 1px solid; border-color: #e5a700; color: #333333; cursor: pointer; font-family: Arial, sans-serif; font-weight: 600; line-height: 1; outline: none; padding: 0; text-align: center; text-decoration: none; text-transform: capitalize; width: 20%; text-shadow: rgba(253,223,141,1) 0 1px 1px; } .calc__adjust > button:focus, .calc__adjust > button:hover { -moz-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.25); -webkit-box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.25); box-shadow: inset 0px 0px 2px rgba(0, 0, 0, 0.25); background-color: #f9b600; } .calc__adjust > button.is-inactive { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background-color: #ebebeb; border: 1px solid #d5d5d5; color: #777777; cursor: default; } .calc__adjust > button.is-inactive:focus, .calc__adjust > button.is-inactive:hover { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; background-color: none; } .calc__adjust > .calc__sum { font-size: 21px; font-size: 1.3125rem; font-weight: 600; margin: 7px -4px; text-align: center; width: 57%; } /* Resolves TA43059 */ #debug_messages p { margin: 0; padding: 1em 0; } .omniMeterWaitSpinnerWrap { display: none; /* This is changed to block with the omniMeterLoadingScreen class */ left: 50%; margin: 0 auto; pointer-events: none; position: absolute; top: 50%; } .omniMeterLoadingScreen { background-color: #ffffff; cursor: wait; position: relative; } .omniMeterLoadingScreen .calc__output { opacity: 0.15; pointer-events: none; } .omniMeterLoadingScreen .omniMeterWaitSpinnerWrap { display: block; } .repayIframeClass { border: none; height: 155%; width: 100% } .tabapayIframeClass { border: none; height: 100%; width: 100% } .repayEsignIframeClass { border: none; height: 1100px; width: 100% } .tabapayEsignIframeClass { border: none; height: 360px; width: 100%; margin-right: 3px; } iframeTabaPayContainerEsignClass { margin: 0; text-align: center; height: 900px; border: none; } /*css last one wins rule*/ @media only screen and (min-width: 280px) and (max-width: 654px) { .repayIframe { height: 179%; width: 97%; } .tabapayEsignIframeClass { width: 99%; } .coolOffBannerDiv { padding: 2em; } .coolOffBannerSubDiv { text-align: center; margin-top: 1em; } .cooloffButton { float: none; } } @media only screen and (min-width: 320px) and (max-width: 570px) { .repayIframe { height: 197%; width: 98%; } } @media only screen and (min-width: 360px) and (max-width: 640px) { .repayIframe { height: 188%; width: 98%; } } @media only screen and (min-width: 370px) and (max-width: 840px) { .repayIframe { height: 146%; width: 98%; } .tabapayEsignIframeClass { width: 98%; } } @media only screen and (min-width: 360px) and (max-width: 767px) { .repayIframe { height: 188%; width: 98%; } } @media only screen and (device-width : 375px) and (device-height : 812px) and (-webkit-device-pixel-ratio : 3) { .repayIframe { height: 146%; width: 98%; } } @media only screen and (min-width: 410px) and (max-width: 740px) { .repayIframe { height: 157%; width: 97%; } .tabapayEsignIframeClass { width: 99%; } } @media only screen and (min-width: 540px) and (max-width: 740px) { .repayIframe { height: 151%; width: 98%; } } @media only screen and (min-width:510px) and (max-width:600px) { .docBrowsed { max-width: 35% !important; } } /* Fuse Refi Banner - Mobile*/ @media only screen and (max-width:600px) { .POSRefiTextp { padding-top: 0; } .POSRefiButton { clear: both; float: none; margin: 10px 0px; } .POSRefiMobileAlign { text-align: center; } } @media only screen and (max-width:430px) { .uploadLaterPopUp p { padding: 0 !important; } } @media only screen and (max-width:510px) { .POIWidthSelect { width: 100% !important; } .uploadNowSelectStlyes { width: 100% !important; } .DocInputBrowseNoMargin { margin: 0 !important; } .docBrowsed { max-width: 51.5% !important; } } @media only screen and (max-width:600px) { .disclosureRadioBtnIcon { /*margin-left: 0px;*/ margin-left: -50px; } .disclosureHeaderTexts, .CashPickupBold, .storeLocator { /*margin-left: 32px!important; margin-left: 0px!important; */ } } .detailedLoanHistory td { padding: 0.25em 1em; } .detailedLoanHistory th { padding: 0.75em 2em; } .deferredPaymentRow td { font-weight: bold; } /************************************************************************************************ ********************************* In Between Desktop and Tablet **************************** *********************************************************************************************/ @media screen and (max-width: 865px) { .warning { height: auto; overflow: hidden; } .repositionSpinner { height: 150px !important; top: initial !important; bottom: 170px !important; } } @media only screen and (min-width: 767px) and (max-width: 1025px) { .tabapayEsignIframeClass { width: 100%; } } @media screen and (max-width: 768px) { /*.table-header-p-cell{ margin-bottom: 0px; margin-top: 0px; }*/ .loanDetailsPrintBtn { margin-left: 54%; } .loadDetailsDropdownArrow { margin-left: -21px; margin-top: 14px; } } /* Desktop and Tablet only: */ @media screen and (min-width: 40.5em) { .lineoFcreditTransactionTr { line-height: 2.25em; } .lineoFcreditTransactionTr:nth-child(odd) { background-color: #fcfcfc; } .lineoFcreditTransactionTr:nth-child(even) { background-color: #f3f3f3; } } @media screen and (max-width: 79.05em) and (min-width: 62.5em) { .subnav--offset { left: -56px; width: 155% !important; } .silentnav { text-align: left; padding: 0; } /*.application_wrap { max-width: 90%; margin-left:25px; }*/ } /* We should not use this media query, because it conflicts with the other max-width: 40.5em query. If you change this back to 40.5em and look at the app side bar at 518px width, you will see an overlap. */ @media only screen and (min-width:40.49999em) { /*Task 20580:WEB - Put phone apply # below the continue buttons (mobile)*/ .phoneNoContBtn { position: relative; left: 100px; } .confirmOffer.offerSteps { height: auto; padding: 5px; } /*DIRECT MAIL STYLES*/ .stamp1 { display: none !important; } .resNumPop { display: none; } #resCodePopUp .appPopUpLight { padding: 75px 40px; } .resTable-cell { font-size: 16px; } .site-logo-alt { max-width: 350px; padding: 10px 19px 10px 0; } .site-title-alt { box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25); -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.25); } .site-title-alt ul { top: 30px; } .reviewImg1 { display: block; } .reviewImg2 { display: none; } .reviewCarouselCaption { position: absolute; top: 50%; height: auto; background-color: transparent; font-size: 20px; color: #ffffff; text-align: center; } #jssor_1 { left: 0 !important; } .offerDisclaimerMailer { display: block; } /*.offerBannerImg, .offerBannerContentRight { display:inline-block; margin: 25px 0 20px 40px; }*/ .reviewBanner form { width: 28%; } #confirmOfferForm section { display: inline-block; width: 49%; } #confirmOfferForm section:nth-child(2) { float: right; } #confirmOfferForm section:first-child { margin-bottom: 0; } /*.accountNavMobile { top: -65px; }*/ .rebate-break { display: none; } .popup_wrapper div:first-child { padding: 0 0; } .my_popup_close { right: -12px; } .WarningBannerWrap a { text-align: center; margin: auto; background-color: transparent; color: black; padding: 0; cursor: pointer; display: inline-block; position: static; text-transform: none; } .WarningBannerWrap a:after { content: '.'; } .rwd-break { display: none; } /*Header buttons*/ .home_banner { background-position: center 25%; padding-bottom: 250px; padding-top: 250px; } .nav-item { color: #ebebeb; top: 1em; width: auto; padding: 4px; } .nav-item span { font-size: 12px; display: inline-block; } .nav-item .icn { font-size: 20px; font-size: 1.25rem; color: #c5c5c5; display: inline-block; margin-right: 0.5em; } .user-open { right: 0; } .nav-open { left: 0; } /*Header*/ .home_banner + .content { padding-top: 40px; } .home_banner_h1 { font-size: 45px; font-size: 2.8125rem; line-height: 1.15; } .site-title img { max-width: 150px; } .site-mast-header + .content, .site-promo + .content, .paths-promo + .content, .alt-promo + .content, .locator + .content, .hero-locator + .content, .paths-promo-content + .content, .alt-promo + .content { padding-top: 30px; } /*----Subpromo and Steps ---------------------------------------------------------------*/ .steps_li:first-child { border-top: none; } .steps_ul { text-align: left; } .steps { margin-top: 0; } .offerSteps li { display: table-cell; } .offerLine, .reviewBanner .icn--arrow-right2, .reviewBanner .icn--arrow-left2, .confirmOffer .offerStepsList li h3, .offerSteps .probar { display: block; } .subpromo.subpromo-fancy { display: block; margin-top: 20px; } .content-secondary { width: 31.7708%; } .content-right { float: right; padding-left: 20px; } .app_content_right { display: block; } .account-section-title { font-size: 36px !important; font-size: 1.75rem; display: block; line-height: 1.65; margin-top: 0; font-weight: bold; } /*-------Intermin Login Page--------------------------------------------------------------------*/ .login_page_wrap h1 { font-weight: 500; } /*.login-locator-form h2 { font-weight: 600; margin: 0; }*/ .login-locator-info { border-bottom: none; margin-bottom: 0; margin-right: -1px; padding-bottom: 0; padding-right: 40px; } input.login-locator-btn { width: 30%; } .login-locator-info, .login-locator-form { margin: 0 auto; width: 480px; } #InterApplyBtn:before { content: 'Apply for an Online Loan'; } #InterReturnBtn:before { content: 'Return to Login'; } #InterContactBtn:before { content: 'Contact Customer Service'; } #InterReturnBtn:before { content: 'Return to Login'; } #InterGuestBtn:before { content: 'Continue As Guest'; } .preferredAppIntro { font-size: 2em; } .btnPreferredSave, #btnPreferredSaveAll { float: right; } /*Content --------------------------------------------------------------------------- ----------------------------------------------------------------------------------*/ h2 { font-size: 24px; font-size: 1.5rem; } .mobile-login { display: none; } .content-intro-title { padding-right: 65px; font-weight: 500; /*AG, I added this property to fit the design*/ font-family: Arial, sans-serif; /*AG, I added this property to fit the design*/ } .content-multi { float: left; padding-right: 20px; width: 68.22016667%; } .uploadLaterPopUp > div { margin: 10% auto; } .uploadLaterPopUp img { float: left; position: relative; top: 100px; } .uploadLaterPopUp p { margin-left: 60px; margin-right: 18px; } .gmi_select input, .gmi_select .styled-select { max-width: 250px; } /*.gmi_select button { max-width: 150px; }*/ #uploadToolTip { left: 90px; top: 140px; } .phoneStamp { display: inline-block; position: absolute; right: 0; } #printableMsPamphlet img { width: 100%; } /*DIRECT MAIL STYLES*/ #confirmOfferForm { width: 62%; } #ThankYou-Line, #ThankYou-Line2, #passwordResetConfirmation { font-size: 1.175rem; } } @media only screen and (min-width:30em) { .preApproveBreak { display: none; } #uploadPayStubTip { top: 50%; left: 53%; } #uploadBankStatementTip { top: 47%; left: 54%; } .btn_medium { width: 40% !important; } .long-question { white-space: pre-wrap; width: 120% !important; padding-right: 0% !important; } .loan-status-tooltip-mark { display: block; } .btn-summary { max-width: 12em; margin-right: 0px; } .nav-open span { padding-top: 0.5em; } .nav-item { width: auto; min-width: 4em; top: -10px; font-family: Arial; } .user-open { min-width: 90px; } #preferredSection2 h2, #preferredSection3 h2 { top: 0px; } #achSignButton { margin-left: 20px; } /*Direct Mail*/ /* #preLoanDisclosureTXCAB250mpdlPopupLink, */ .preLoanDisclosureTXCAB250mpdlPopupLink { padding-left: 18px !important; } } /*End Min-width 30.5em*/ /* *********************************** END mobile styles ************************************/ @media screen and (min-width: 54em) { .threeBlockBanner div > span { display: inline-block; text-align: center; font-family: arial, sans-serif; float: none; position: relative; vertical-align: middle; width: 242px; height: 242px; } .threeBlockBanner div span > img { display: block; } #threeBlock3 { display: inline-block; } #threeBlock4 { display: none; } } /************************************************************************************************ *************************************** Desktop Styles *************************************** ************************************************************************************************/ /* 14px font * 62.5em = 875px This controls the desktop view. Only specific classes go here, otherwise, keep them outside the media queries: */ @media screen and (min-width: 62.505em) { .circle--warning { padding: 20px 0px 20px 25px; } .circle--warning-padding-right { padding-right: 20px; } /*Global------------------------------------------------------------------------ -------------------------------------------------------------------------------------------*/ .riddlerTxt { display: block; left: 30px; } .faqBannerRight .phoneStamp { margin: 30px 0; } .whoWeAreTxt { margin: 10px 0 20px; width: 100%; } .threeBlockBanner div > .middleBlock { margin: 0 6%; } .sectionLeft { height: 200px; } #abbyAppDMImg, .cd-slider-controls { display: block; } .desktopOnly { display: block; } .desktopOnlyInlineBlock { display: inline-block; } .centerInMobile { text-align: left; } #creditServiceBanner, #refinanceBanner, #pastDueBanner, #cashRebateBanner, .eligibilityBanner { width: 60%; margin-bottom: 0; } .bannerTextWrap { width: 67%; } .bannerActionButtonWrap { display: inline-block; margin: 0 auto; position: relative; text-align: center; vertical-align: middle; width: 20%; } .content { padding-bottom: 70px; padding-top: 36px; } .portal-content { width: 73%; display: inline-block; } .customerErrorMsg { background: #FFC429; border-radius: 3px; padding: 1em; color: #333333; } .preferredSpinner { top: 1287px !important; } .hour-br { display: none; } .preApprovedCongrats p { font-size: 18px; width: 60%; } .loan-status-tooltip, .payoff-amount-tooltip { width: 27%; right: 100px; /*left:602px;*/ } .LoanDoc { min-height: 400px; } .mediaQueryMeasurement { color: rgb(30, 30, 30); /* Must be larger than 62.5em. This class is meausered in the JavaScript footer/header code */ } .phoneStamp h2 { font-size: 26px; } /*Direct Mail*/ .jssora02l, .jssora02r { display: block; } .input-3-4 { width: 75%; } .tooltipMsgBox { right: -70px; } .tooltipMsgBox::after { left: 50%; } /*HOME PAGE*/ .home_container { padding-top: 0px; } .bottom_box_img { left: 0; position: absolute; top: 0; } .home_bottom_box { height: auto; min-height: 188px; overflow: hidden; } .bottom_box_body { padding-left: 180px; } .home_bottom_box + .home_bottom_box { padding-bottom: 0px; } /*Login------------------------------------------------------------------------------ -------------------------------------------------------------------------------------------------*/ .hover-gold { color: #ffc423 !important; } .userTitle p { float: left; padding: 0 5px 0 10px; color: #ada7a6; line-height: 13px; } .FirstName:before { content: 'Hello,'; } .FirstName:after { content: '!'; } .username { float: left; } /*Header Mobile Buttons------------------------------------------------------------- ---------------------------------------------------------------------------------------------*/ .nav-item { display: none; } /* PrimaryNav---------------------------------- ------------------------------------------------------------------------------------------------*/ .primarynav_list { float: right; margin-right: -1.45em; text-align: right; white-space: nowrap; } .primarynav_item:first-child { margin-left: 0px; } .primarynav_item { float: left; position: relative; margin-left: 3px; height: 28px; } .primarynav_item:hover, .primarynav_item.hover-state { background-color: #333; border-radius: 3px; } .primarynav_item.hover-state > .primarynav_link { color: #ffc423 !important; } .primarynav_link { color: #ebebeb; padding: 0.42857em 0.85714em; } .primarynav .close-btn { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .primarynav { /*display: none;*/ top: 3.65em; position: fixed; overflow: visible; } /* Header Sub Navgation----------------------------------------------------- -------------------------------------------------------------------------------------------*/ .WarningBannerWrap .warning_textbox { text-align: left; margin-top: 10px; width: 90%; } .WarningBannerWrap { position: relative; top: -25px; /* This was originally -30px, but it overlapped the header background. */ } .maintenanceWarningMessageWrap h1 { font-size: 24px; font-family: Arial, sans-serif; font-weight: 600; width: 72%; display: inline-block; margin: 10px 0; } .WarningBannerWrap h4, .WarningBannerWrap h1, #warningMessageCaret { vertical-align: middle; } .warningMessageReadMore { width: 20%; text-align: right; display: inline-block; } .arrow-left, .arrow-left-optional { display: none !important; } .subnav_link:hover { background-color: #ffc423; } .subnav_link { padding: 10px !important; } .subnav_item:first-child { -webkit-background-clip: padding-box; background-clip: padding-box; -moz-background-clip: padding-box; -webkit-border-radius: 0 3px 0 0; border-radius: 0 3px 0 0; border-top: none; } .subnav { position: absolute; width: 240%; background-color: #333333; display: none; margin-top: -2px; padding: 0; } .subnav_link:hover { color: #222 !important; } .subnav_list li:first-child a { border: 0 !important; } .blkTxt:hover nav ul li a:hover { color: #222 !important; } .blkTxt:hover nav ul li a { color: #fff !important; } .blkTxt:hover a { color: #ffc423 !important; } .blkTxt a { color: #222 !important; } .blkCaret:hover:after { border-top-color: #ffc423 !important; } .blkCaret:after { border-top-color: #222 !important; } .js-has-dropdown.hover-state:after { border-top-color: #ffc423 !important; } .js-has-dropdown:after { position: relative; top: -14px; left: -16px; content: ""; height: 0; width: 0; padding: 0; border-top: 6px solid transparent; border-left: 3.5px solid transparent; border-right: 3.5px solid transparent; border-top-color: #FFF; pointer-events: none; } /* In desktop mode, the slideshow does not fill the width of the screen. Instead of using the viewport width, use the relative wrapping box width: */ .reviewCarouselCaption, .fiveStar { width: 100%; } .reviewCarouselCaption { padding-left: 12%; padding-right: 12%; } .reviewCarouselCaptionLong { top: 45%; } .js-has-dropdown a { padding: 6px 30.5px 6px 12px; } .col--3-5 { width: 60%; } .col--right { float: right; padding-left: 20px; } .col--2-5 { width: 40%; } .radio_label { float: right; } .checkbox_copy_text { margin-left: 30px; } .application label { margin-top: 0; } .maintenanceWarningMessageWrap p { font-size: 16px; line-height: 1.5em; /* Larger line height for desktop */ } /* E-Sign Desktop Only - Move the buttons closer to the disclosure text */ .disclosureInputBtnWrap { padding-left: 50px; } .disclosureInputBtnWrapNotESign { padding-left: 0px; } .eSign_radio { margin-top: 0.2em; /* This will center the label text and radio button, vertically, on the desktop */ } .application_wrap { margin-top: 0; /* Remove extra space for the desktop E-Sign banner. */ } .not-requiredBox { top: 0; } p.submit-terms__instructions { width: 63%; margin-bottom: 50px; margin-left: 55px; } .required-rules { left: -30px; position: absolute; } .checkbox_right { position: relative; right: 0px; } /*DropDown Navigation -------------------------------------------------------------*/ .meterTooltip { display: none; } .meterTooltipHover { position: absolute; width: 50%; background-color: black; color: white; padding: 10px; top: 264px; display: none; left: 102px; } .dropDown li { text-align: left; padding: 5px 10px; } .showDrop { display: block !important; } .dropDown li:hover { background: #ffc423; } .subNav { width: 279px; -webkit-background-clip: padding-box; background-clip: padding-box; -moz-border-radius: 0 3px 3px 3px; -webkit-border-radius: 0 3px 3px 3px; border-radius: 0 3px 3px 3px; background-color: #2b2b2b; color: #fff; text-align: left; } /************************************* Services Navigation**************************************/ .contentSubNav_1 { visibility: visible; display: block; } .contentSubNav_s { display: none; visibility: hidden; } .contentSubNav { background-color: #ebebeb; border-bottom: 1px solid #d5d5d5; border-top: 1px solid #d5d5d5; line-height: 1.3; padding: 5px 0; } .contentSubNav-special { background-color: #ebebeb; } .contentSubNav-sticky { top: 100px; } /*----Interim Login Page------------------------------------------------------------------------*/ .login-locator { padding: 30px; } .site-subpromo-container { border-bottom: 1px solid #d5d5d5; border-top: 1px solid #d5d5d5; margin-bottom: 0; margin-top: 30px; padding-bottom: 30px; padding-top: 30px; display: inline-block; } .site-subpromo + .site-subpromo { float: left; margin-left: 2%; } .site-subpromo { float: left; height: auto; min-height: 188px; overflow: hidden; position: relative; } .site-subpromo-img { position: absolute; left: 0; top: 0; } .site-subpromo-body { padding-left: 180px; } .site-subpromo-btn { display: inline-block; } /*Customer Portal*/ .input-wrap-left { float: left; padding-right: 5px; } .input-wrap-right { float: right; padding-left: 5px; } .input-wrap-1-3 { width: 33.33%; } .input-wrap-1-2 { width: 50%; } .content-sidebar { width: 77%; } .circle--warning { border-bottom-left-radius: 50px; border-top-left-radius: 50px; } .reapplyBannerImageWrap { vertical-align: middle; width: 9%; } .reapplyBannerTextWrap { vertical-align: middle; width: 89%; } .warning_textbox, .warning_img, .circle--warning button { display: inline-block; } .rebate-banner > .warning_textbox { width: 78%; } #warning_textbox1 { padding: 0 20px; } #RefiOffer { margin-left: 30px; } #uploadBankStatementTip { left: 65%; } #uploadPayStubTip { left: 62%; } .textMessagingMobileProfile { margin-left: 20px; } /* -------------------------------- Account Summary - Desktop Only: ------------------------------- */ .extendYourLoanOfferWrap { margin-top: 0em; padding: 2em; } .extendYourLoanOfferContent { margin-bottom: -1.4em; /* This brings the background up to the button, in desktop only. */ } .extendYourLoanOfferWrap h1 { /* These font sizes were setup to match the PhotoShop mock up: */ font-size: 32px; /* 2.285714285714286em; when body font is 14px. */ line-height: 1.13em; } .extendYourLoanOfferWrap h2 { font-size: 24px; line-height: 1.13em; margin: 0.33em 0em 0.33em 0em; } .extendYourLoanOfferInformationWrap { display: inline-block; text-align: left; width: 75%; /* In desktop, this column is aligned to the left. */ } .extendYourLoanDetailsWrap ul { width: 67%; /* In desktop only, this should be smaller in width, to make the two columns easier to read. */ } .extendYourLoanOfferInformationWrap ul li { font-size: 16px; line-height: 1.75em; } .extendYourLoanOfferButtonWrap { display: block; margin-top: -2em; /* This aligns the button text with the content text. */ text-align: right; width: 100%; /* In desktop, this column is aligned to the right. */ } #extendYourLoanOfferButton { margin-top: 0px; } .extendYourLoanPageWrap { /* margin-left: 25%; In desktop, the Portal Navigation is on the left. Instead of this, we will use the class name "portal-content" to position the content. */ } #extendYourLoanSubmitButton { width: 45%; } /* This corrects Bug 18053: */ #earlyPayoffOptionPopup { margin-left: 240px; /* This will align the popup over the account summary info */ max-width: 747px; } .refinanceMoreInfoWrap ul { margin-left: 40px; } /*Content----------------------------------------------------------------------- ---------------------------------------------------------------------------------*/ #newKslCustomerHeading { margin-bottom: 46px; /* Frederick wanted the two columns to align, without a line break worth of space. This is in desktop only. */ } .form-info { margin-top: 0px; } .content-intro-title { font-size: 32px; font-size: 2rem; margin-bottom: 15px; } .content-primary { padding-bottom: 0; } .rebate-banner button { left: -34px; } .circle--warning button { /* Use padding to customize the button width width: 20%; */ margin-left: 3%; } .cso-circle--warning button { width: 20%; margin-left: 6%; position: relative; bottom: 30px; left: 500px; } .cso_circle--warning button { width: 100%; margin-left: 76%; } .applicationProductToggleWrap { display: block; } .loanProductTypeToggleWrap .field-validation-error::before { margin-left: -1.1%; /* In desktop, the validation message arrow must fit in the center of the two rows */ } /*Preferred Application ----------------------------------------------------------------------- ----------------------------------------------------------------------------------------------------*/ .preferredAccountCreationWrap { /* width: 60%; */ } /*FOOTER NAV*/ .footer_nav_ul { margin: 5px 0; } .footer_nav_link { color: #ffc423; font-size: 1.2em; } .footer_nav_ul { line-height: 20px; } .footer_nav > div { display: inline-block; width: 24%; vertical-align: top; } .footer_nav_link.is-active { color: #ffc423; } /*Loan Meter Calculator*/ .calc { margin-top: 0; padding-top: 0; } .preferredProductToggleWrap { width: 50%; } /* Preferred Applications - Tooltip Icon: */ .loanProductTypeToggleWrap #applicationForPreferredToolTipIcon { margin-left: 100%; } /*ESIGN PAGE*/ .submit-terms__header, .submit-terms__header-no-number { font-size: 1.75em; /* We want a large font for desktop only. */ } .mclNotice .leftColumn { margin-right: 1em; /* Desktop styles */ width: 60%; } .mclNotice .rightColumn { width: 33%; } /* --------------------------------------------------- Store Locator - GeoLocation (desktop only): ------------------------------------------------------- */ /* If we do not want the icons in desktop: .StoreInfoPhoneIcon, .StoreInfoClockIcon { display: none; } */ #LocateNewStoreSearchBarWrap button { margin-left: -6px; /* Resolves Bug 15054 */ } .StoreInfoExpandButtonWrap, .StoreInfoCloseButtonWrap { right: 30px; } .locFundsLabelWrap .locFundsDescription, .locFundsValueWrap .locFundsDescription { font-size: 24px; } table#recentTransactions{ border: none!important; } .detailedLoanHistory th, .detailedLoanHistory td { text-align: center !important; border: none } tbody.detailedLoanHistoryTBody { border: 2px solid #f2f2f2; } } /* *********************************** END desktop styles ************************************/ /*NEW Paydate Frequency Styles*/ .sidebar { background-color: #fff; width: 29%; display: inline-block; } .boldText { font-weight: bold; } .main { background-color: /*#CE9B64;*/ #fff; padding: .5rem; display: inline-block; width: 70%; vertical-align: top; } .box1, .box2 { min-height: 100%; padding: 1em; } .primaryPayDateFreqMsg { max-width: 375px; display: block; } .secondaryPayDateFreqMsg { max-width: 400px; font-weight: bold; display: block; } .paydateFreqContinueButton { text-align: center; max-width: 500px; padding-top: 20px; } .aaTitle { font-size: 16px; color: #54565B; } .aaDesc { font-size: 12px; color: #929190; display: block; width: 175px; } .required::before { content: ""; } .payFreqLabelBlockStyle { margin-top: 15px !important; } /*Congratulations */ .congratsMessageStyle { color: #000000; background-color: #ffffff; } .congratsMessageWidth { max-width: 355px; } /************************************************************************************************ *************************************** Tablet Styles *************************************** ************************************************************************************************/ /* 14px font * 62.5em = 875px view This controls the tablet view: */ @media only screen and (max-width: 62.5em) { .selectLanguageToggle select { margin: 0 !important; border: 1px solid #a7a7a7 !important; } /*.loanDetailsResponsiveTable { display: inline-block; width: 100%; } .loanDetailsResponsiveTable tr { display: inline-block; width: 100%; } #fundingDate { display: none; } #fundingDateTableCell { display: none; } #loanStatus { display: none; } #loanType { display: none; } #loanStatusTableCell { display: none; } #loanTypeTableCell { display: none; } .fullLabel { display: inline-block; width: 47%; } .fullData { display: inline-block; width: 50%; text-align: right; padding-right: 14px; } .detailedLoanHistory td { padding: 0.25em 0em; } .pendingIconStyles{ display: none; } .detailedLoanHistoryTBody tr{ margin-right: -14px; } .form-info { margin-bottom: 0px !important; } .loadDetailsDropdownArrow { margin-left: -30px; margin-top: 13px; } .table-header-cell { width: 50%; } .table-header-p-cell { margin-bottom: 0px; margin-top: 0px; } .table-body-cell { width: 50%; } .loanDetailsBodyWrap { margin-top: 0px; } .loanDetailsHeading { margin-top: 0px; } .loanDetailsContainer { margin-left: 12px; margin-bottom: 0px; } .loanDetailsContainerBGColor { background: #dbf6ff !important; padding-bottom: 1.25em; } .loanDetailsContainer { padding-top: 1.25em; } .loanDetailsHR { margin-bottom: 0px !important; width: 95%; border-top: 1px solid #ccc; margin-top: 6px; } .loanDetailsHRBottom{ display: none; } /*.loanDetailsBTN { display: block; } */ .accountSummaryNotificationBannersWrap { margin-bottom: 80px; margin-top: 32px; } .loanDetailsPrintBtn { margin-left: 0px !important; margin-top: 13px; } .tableScrollWrap { margin-bottom: 0px !important; } .detailedLoanHistory thead { border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .detailedLoanHistory tr { display: block; } .detailedLoanHistory td { display: block; font-size: 0.875rem; text-align: right; } .detailedLoanHistory td::before { content: attr(data-label); float: left; font-weight: bold; } /*Global -------------------------------------------------------------- -----------------------------------------------------------------------------*/ .meterTooltipHover { display: none !important; pointer-events: none; } .mediaQueryMeasurement { color: rgb(20, 20, 20); /* This class is meausered in the JavaScript footer/header code */ } .tabletAndMobileOnly, .tabletOnly { display: block; } .tabletAndMobileInlineBlockOnly { display: inline-block; } .form-info { margin-bottom: 0px !important; } /* login */ #login { display: none !important; } .checkbox_copy { max-width: 90%; } /*Side Mobile Navigation ---------------------------------------------------------------- ---------------------------------------------------------------------------------*/ .primarynav .close-btn { left: 0; margin: 0; position: absolute; top: -2.35em; } .js-ready .site-container { left: 0; } .js-nav .site-container { left: 70%; } .js-has-dropdown:after { display: none; } .primarynav_list { margin: 0 -5.5%; } .primary_nav-side .close-btn { left: 0; margin: 0; position: absolute; top: -2.35em; } .primarynav_link { line-height: 2; padding: 1em 5.5%; } .primarynav_item:focus, .primarynav_item:hover, .primarynav_item.is-active { background-color: #292929; } .primarynav_item { border-top: 1px solid rgba(255, 255, 255, 0.1); position: relative; } .primarynav { -webkit-transform: translate3d(-100%, 0, 0); -moz-transform: translate3d(-100%, 0, 0); -ms-transform: translate3d(-100%, 0, 0); -o-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } .primarynav { backface-visibility: hidden; left: 0; border-right: 1px solid #252525; background: #333; height: 100%; width: 70%; position: absolute; top: 0; padding-top: 3.5em; color: #fff; overflow: hidden; font-family: Arial, sans-serif; line-height: 1.4; z-index: 101; } ul#menu { margin: 0; padding: 0; text-align: center; } ul#menu li { margin: 0; padding: 0; } /* main layout ----------------------------------------------------------*/ .main-content, .featured + .main-content { background-position: 10px 0; } .content-wrapper { padding-right: 10px; padding-left: 10px; } .featured .content-wrapper { padding: 10px; } /* page content */ article, aside { float: none; width: 100%; } /* ordered list */ ol.round { list-style-type: none; padding-left: 0; } ol.round li { padding-left: 10px; margin: 25px 0; } ol.round li.zero, ol.round li.one, ol.round li.two, ol.round li.three, ol.round li.four, ol.round li.five, ol.round li.six, ol.round li.seven, ol.round li.eight, ol.round li.nine { background: none; } /* features */ section.feature { float: none; padding: 10px; width: auto; } section.feature img { color: #999; content: attr(alt); font-size: 1.5em; font-weight: 600; } /* forms */ input { width: 100%; } /* login page */ #loginForm { border-right: none; float: none; width: auto; } #loginForm .validation-error { display: block; margin-left: 15px; } .login_page_wrap { width: 90%; margin: 0 auto; } /* KSL - New and Returning Customers - Tablet: This will fill the width of the entire screen. */ .kslInterimLoginNewCustomer, .kslInterimLoginExistingCustomer { padding-left: 0px; padding-right: 0px; width: 100%; } .kslInterimLoginNewCustomer { padding-top: 1em; } .kslInterimLoginExistingCustomer { border-right: none; border-bottom: 1px #454545 solid; padding-bottom: 2em; } .kslRedirectHeader { font-size: 1.75em; } .accountLoginHeader { font-size: 1.5em; } /* --------------------------------------------------- Header Styles: --------------------------------------------------- */ .contentAlt { padding-top: 0; } #socialLoginForm { margin-left: 0; float: none; width: auto; } .footer-container { margin: 0 auto; max-width: 90%; position: relative; } .footer-legal { border: none; } /*FOOTER NAV in tablet view*/ .footer_nav > div { border-top: 1px solid #434343; margin: 0 -5.5%; padding: 0 5.5%; } .footer-legal-alt { width: 100%; } .footer_nav > div:first-child { border-top: 1px solid #434343; } .footer_nav > div:last-child { border-bottom: 1px solid #434343; } .footer_nav_link { font-size: 16px; background-color: transparent; display: block; margin: 0 -5.5%; padding: 15px 5.5%; position: relative; } .footer_nav_link.is-active { background-color: #2b2b2b; color: #ffc423; } .footer_nav_link:after { font-size: 24px; color: #fff; content: "\e60a"; font-family: 'icons-advanceamerica'; margin-top: -15px; position: absolute; right: 5.5%; top: 50%; } .footer_nav_ul { margin: 0; display: none; } .footer_nav_ul.is-active { visibility: visible; overflow: visible; display: block; } .footer_nav_li_link { background-color: #2b2b2b; border-top: 1px solid #353535; display: block; color: #fff; margin: 0 -5.5%; padding: 15px 5.5% 15px 8%; } /* APPLICATION PAGE */ .fieldset_wrap_left, .fieldset_wrap_right { width: 100%; padding-left: 0px; padding-right: 0px; } .fieldset_wrap_right { padding-top: 10px; /* This fixes the spacing between wrapped fields in the mobile view, so that the space between fieldsets are consistent. */ } .fieldset_wrap_right_no_padding { padding-top: 0px; } .eSign_wrap_small_left { width: 38%; padding-left: 0px; padding-right: 0px; } .steps_link { width: 46%; } .steps_li_text { width: 42%; } /* Patriot Act - Tablet: This notice is on all three applications. */ #patriotActNoticeWrap { margin-top: 1em; } .mobileSmallText { margin-left: 10px; font-size: 0.75em; /* This reduces the font size in tablet and mobile only */ } .requiredTextNoMargin { margin-top: -12px; /* This reduces the space between the accordion header and text. */ margin-bottom: 0px; } #Weekly, #BiWeekly { width: 100%; } /*HOME PAGE BANNER*/ .home_banner { padding-top: 85px; padding-bottom: 125px; } .warning_img_left { display: none; } .warning_textbox { font-family: Arial, Helvetica, sans-serif; text-align: center; } .reviewCarouselCaptionLong { top: 45%; } /*______________________________________ACCOUNT PORTAL (Tablet):____________________________*/ .installmentOfferBannerContent h2 { font-size: 1.5em; } /* Line of Credit (Tablet) - Invitation to Apply: */ .locInvitationBannerContent { width: 64%; } .locInvitationBannerContent h2 { font-size: 22px; } .locInvitationBannerLinksWrap { width: 26%; } .locRecentTransactionsTable tr { display: block; padding: 1.5em; } .locRecentTransactionsTable td, .locRecentTransactionsTable th { border-right: none; display: block; text-align: left; width: 100%; } .locRecentTransactionsTable tr td:first-child { border-left: none; } /* The table header will not be used in mobile. Instead, we will use the table data tags with labels in them */ .locRecentTransactionsTable thead { display: none; } /* This controls the label that appears to the left of each value, only on smaller size screens: */ .locRecentTransactionsTable .mobileTableHeader { display: inline-block; font-weight: bold; text-align: left; width: 9em; /* Make this width match the longest header text name, it will align all the values */ } /* This is similar to above, except for the Billing Statements page: */ .locBillingStatementsTableWrap .locRecentTransactionsTable .mobileTableHeader { width: 12em; /* Make this width match the longest header text name, it will align all the values */ } /* This controls the value that appears to the right of each label, only on smaller size screens: */ .locRecentTransactionsTable .mobileTableValue { display: inline-block; text-align: left; vertical-align: top; width: 40%; /* Fallback for non-CSS3 browsers */ width: calc(97% - 9em); /* Make sure this matches the width on the mobileTableHeader */ } /* Billing Statements page: */ .locBillingStatementsTableWrap .locRecentTransactionsTable .mobileTableValue { width: calc(97% - 12em); /* Make sure this matches the width on the mobileTableHeader */ } .locBillingStatementsTableWrap .locRecentTransactionsTable td, .locBillingStatementsTableWrap .locRecentTransactionsTable th { padding: 6px; } .locBillingStatementsTableWrap .locRecentTransactionsTable tr { padding: 1em; } /* ------------ View/Update Profile Page (Tablet): ----------------- */ .profileWrapper { margin-left: 0px; /* This accounts for the navigation menu */ } .profileViewItemWrapLeft, .profileViewItemWrapRight { float: left; width: 100%; } /* ------------ Application Page (Tablet): ----------------- */ .appContinueBtn, .appPreviousBtn { width: 48%; } .appContinueBtn { margin-right: 0px; } .preferred_application_wrap { margin-top: 1em; } .content-primary { width: 100%; } .preferredKslApplyWrap p { font-size: 1em; } .preferredKslApplyWrap h2 { margin-top: 0em; margin-bottom: 0em; } .kslApplyWrap { padding-top: 1em; } /* Update pay frequency page: */ .btnPairLeft, .btnPairRight { padding: 0.5em 2em; /* Adds 2 character spaces to the sides and a half to the top and bottom for tablet. */ } .btnPairLeft { margin-right: 1em; } .btnPairRight { margin-left: 1em; } .styled_select_half_left { width: 100%; margin-bottom: 1em; } .styled_select_AND { float: left; margin-top: -0.5em; margin-bottom: 0.5em; text-align: center; width: 100%; } .of_the_month { float: left; margin-top: -0.5em; /* Keeps the text near the second drop down box */ width: 100%; } .preLoanDisclosureTXCAB250PrintImage, .preLoanDisclosureTXCAB500PrintImage, .preLoanDisclosureTXCAB750PrintImage { max-width: 800px !important; } /* ------------------------------------------------- My Documents page (Tablet): ------------------------------------------------- */ #uploadDocumentPopUp { background-color: #FFFFFF; left: 5%; padding: 2em 2em; width: 90%; } .docUploadWrapSpacing { padding-right: 0em; } .btn_submit { width: 20%; } .btn_addNewDoc { width: 40%; } /* ----------------------------------- Account - History page (Tablet): ---------------------------------- */ .tableScrollWrap { margin-bottom: 1.4em; overflow-x: scroll; } /* ----------------------------------- Account - Loan Extension Page (Tablet): ---------------------------------- */ #extendYourLoanSubmitButton { width: 65%; } /* ------------------------------------------------- Account - Make a Payment (Tablet): ------------------------------------------------- */ .paymentReceiptTableWrap, .PaymentThankYouPrintWrap { width: 100%; } /* ------------------------------------------------- E-Signature Page (Tablet): ------------------------------------------------- */ .eSignButtons { width: 100%; } /* When the required tag turns into a tab, turn off the float: */ .eSignRequiredDirections, .eSignDirections { float: none; } /* Use this for a