/* These are class overrides to Bootstrap.css and relate only to the CalHFA webiste Classes should be in the same order as in the original Bootstrap.css file. Refer to the original line numbers in bootstrap.css file and add them to any class overrides. This file refernce must appear right after the bootstrap.css file inside the tag */ /* colors: Primary Blue (Banner): #0054A4 Secondary Blue: #4C71BC Blue-Gray (Tabs): #3F4F5F Our Partners box (burnt orange): #BD4D25 Bright Orange (accent): #FF8200 Dark Orange (H1): #AC5500 (was #b35c00) Footer background (light gray): #DDDDDD; Dark Gray (box header) #333333; */ /* 309 */ .glyphicon-search:before { content: "\e003"; color:#FFF; font-size:large; } /* 1084 */ body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 1.4em; line-height: 1.42857143; color: #000000; background-color: #fff; } /* 1099 */ a { color: #15458d; text-decoration: underline; } /* 1118: this only overrides img-responsive in the group */ .img-responsive { display: block; max-width: 100%; /*width: 100%;*/ height: auto; margin-bottom:10px; } .btn-danger { background-color:#A7211D !important; } /* HEADING STYLES */ /* 1174 */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: inherit; font-weight:400; line-height: 1.25; color: inherit; } /* 1242 */ h4, .h4, h5, .h5, h6, .h6 { margin-top: 10px; margin-bottom: 10px; } /* 1265 */ h1, .h1 { font-size: 28px; font-weight:bold; color:#AC5500; width:auto; } h2, .h2 { font-size: 24px; } h3, .h3 { font-size: 20px; } h4, .h4 { font-size: 16px; } /* Optional Horizontal Rule for h1 page titles */ h1 hr { margin-top: 2px; margin-bottom: 10px; border: 0; border-top: 1px solid #AC5500; } /* Main page container format */ /* 1584 */ .container { padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; /*min-height:400px;*/ border: solid 0px #0054a4; } @media (min-width: 768px) { .container { width: 768px; } } @media (min-width: 992px) { .container { width: 970px; } } @media (min-width: 1200px) { .container { width: 970px; } } /* 1611 */ .row { margin-right: -15px; margin-left: -15px; } /* 2268 */ .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td { padding: 8px; line-height: 1.42857143; vertical-align: top; border-top: 1px solid #e5edf5; } .table-bordered > thead > tr > th, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > tbody > tr > td, .table-bordered > tfoot > tr > td { padding: 8px; line-height: 1.42857143; vertical-align: top; } /* 2279 */ .table > thead > tr > th { vertical-align: bottom; border-bottom: 0px solid #ddd; /* background-color: #0054a4;*/ background-color: #004064; color: #FFF; } .table-bordered > thead > tr > th { vertical-align: bottom; background-color: #004064; color: #FFF; } /* 2320 */ .table-striped > tbody > tr:nth-of-type(even) { /* background-color: #e5edf5;*/ background-color: #f0f2f9; } /* 2549 */ .form-control { display: block; width: auto; height: 30px; padding: 6px 12px; font-size: 1.4em; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none; border: 1px solid #ccc; border-radius: 4px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } /* 2631 */ .form-group { margin-bottom: 0px; } /* 3003 */ .btn { display: inline-block; padding: .375rem .75rem; margin-bottom: 0; font-size: 1.25rem; font-weight: normal; line-height: 1.42857143; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: .25rem; } /* 3116 */ .btn-primary { color: #fff; background-color: #0054a4; border-color: transparent; /*height:35px;*/ } .btn-primary:focus, .btn-primary.focus { color: #fff; background-color:transparent; border-color: #FFF; } .btn-primary:hover { color: #fff; background-color: #0054a4; border-color: #FFF; } .btn-primary:active, .btn-primary.active, .open > .dropdown-toggle.btn-primary { color: #fff; background-color:transparent; border-color: #FFF; } /* 3139 */ .btn-primary:active:hover, .btn-primary.active:hover, .open > .dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .dropdown-toggle.btn-primary.focus { color: #fff; background-color:transparent; border-color: #FFF; } /* Applied to Search in nav bar */ /* 3520 */ .dropdown-menu { position: absolute; top: 20px; left: -5px; z-index: 1000; display: none; float: left; min-width: 160px; padding: 0; margin: 5px 0 0; font-size: 1.4em; text-align: left; list-style: none; background-color: #DDD; -webkit-background-clip: padding-box; background-clip: padding-box; border: 1px solid #ccc; border: 1px solid rgba(0, 0, 0, 1); border-radius: 4px; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .7); box-shadow: 0 6px 12px rgba(0, 0, 0, .7); } /* 3826 */ .input-group .form-control { position: relative; z-index: 2; float: left; width: auto; margin-bottom: 0; } /* 3988 */ .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: transparent; } /* SUB-NAVIGATION TAB FORMATTING */ /* 4020 */ .nav-tabs { border-bottom: 0px solid #ddd; background-color: #3f4f5f; color: #FFF; } .nav-tabs > li { float: left; margin-bottom: 0px; height: 62px; width:auto; } .nav-tabs > li > a { margin-right: 2px; line-height: 1.25; border: 0px solid transparent; color: #FFF; border-radius: 0; height: 62px; width: auto; } /* new: vertically centers text inside of tabs */ .nav-tabs > li > a > div { position: relative; top: 50%; transform: translateY(-50%); } .nav-tabs > li > a:hover { border-top-color: #3f4f5f; border-bottom-color: #3f4f5f; background-color: #FFF; color: #3f4f5f; height: 62px; } .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { color: #FFF; cursor: default; background-color: #fff; border: 0px solid #ddd; border-bottom-color: transparent; } .nav-tabs.nav-justified { width: auto; border-bottom: 0; } .nav-tabs.nav-justified > li { float: none; } .nav-tabs.nav-justified > li > a { margin-bottom: 0px; margin-top: 0px; text-align: center; } .nav-tabs.nav-justified > .dropdown .dropdown-menu { top: auto; left: auto; } @media (min-width: 768px) { .nav-tabs.nav-justified > li { display: table-cell; width: 1%; } .nav-tabs.nav-justified > li > a { margin-bottom: 0; } } .nav-tabs.nav-justified > li > a { margin-right: 0; border-radius: 0px; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border: 0px solid #ddd; } @media (min-width: 768px) { .nav-tabs.nav-justified > li > a { border-bottom: 1px solid #3f4f5f; border-top: 1px solid #3f4f5f; border-radius: 0; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border-bottom-color: #fff; } } @media (min-width: 768px) { .nav-tabs.nav-justified > li { display: table-cell; width: 1%; } .nav-tabs.nav-justified > li > a { margin-bottom: 0; } } .nav-tabs.nav-justified > li > a { margin-right: 0; border-radius: 0px; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border: 0px solid #ddd; } @media (min-width: 768px) { .nav-tabs.nav-justified > li > a { border-bottom: 1px solid #3f4f5f; border-top: 1px solid #3f4f5f; border-radius: 0; } .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus { border-bottom-color: #fff; } } /* NAVBAR FORMATTING */ /* 4166 */ .navbar { position: relative; min-height: 5px; margin-bottom: 5px; border: 0px solid transparent; } .navbar > li > a { color:#FFF; height: 20px; margin-bottom:0px; } /* 4172 */ @media (min-width: 768px) { .navbar { border-radius: 0px; } } /* 4177 */ @media (min-width: 768px) { .navbar-header { float: left; } } /* 4182 */ .navbar-collapse { padding-right: 15px; padding-left: 15px; overflow-x: visible; -webkit-overflow-scrolling: touch; border-top: 0; -webkit-box-shadow: inset 0 0px 0 rgba(255, 255, 255, 0); box-shadow: inset 0 0px 0 rgba(255, 255, 255, 0); /* additional properties to position navbar */ float: right; position: absolute; bottom: -20px; right: 0; width:100%; } /* 4294 */ .navbar-toggle { position: relative; float: left; padding: 9px 10px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; background-color: transparent; background-image: none; border: 0px solid transparent; border-radius: 4px; } /* 4326 */ .navbar-nav > li > a { padding-top: 10px; padding-bottom: 10px; line-height: 12px; margin-bottom:10px; } /* 4367 */ .navbar-form { padding: 1px 1px; margin-top: 10px; margin-right: -15px; margin-bottom: 8px; margin-left: -15px; border-top: 1px solid transparent; border-bottom: 1px solid transparent; -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 1px 0 rgba(255, 255, 255, .1); } /* 4460 */ .navbar-btn { margin-top: 1px; margin-bottom: 0px; } /* 4591 */ .navbar-inverse { background-color: #0054a4; border-color: transparent; } /* 4606 */ .navbar-inverse .navbar-nav > li > a { color: #FFF; } /* 4693 */ .breadcrumb { padding: 15px 20px; margin-bottom: 0px; list-style: none; background-color: #FFFFFF; border-radius: 4px; } .breadcrumb > li { display: inline-block; } .breadcrumb > li + li:before { padding: 0 5px; color: #ccc; content: "/\00a0"; } .breadcrumb > .active { color: #777; } @media (max-width: 768px) { .breadcrumb { padding: 2px 5px; margin-bottom: 0px; list-style: none; background-color: #FFFFFF; border-radius: 4px; } } /* handles position of navbar under the hamburger */ @media (max-width: 768px) { .navbar-collapse { float: left; position: relative; bottom: 0; right: 0; width: auto; } } /* Panel overrides for News and Updates box: Primary color is Blue */ /* 5450 */ .panel { margin-bottom: 20px; background-color: #fff; border: 1px solid #0054a4; border-radius: 2px; -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05); box-shadow: 0 1px 1px rgba(0, 0, 0, .05); } .panel-body { padding: 15px; } .panel-heading { padding: 10px 15px; border-bottom: 1px solid transparent; border-top-left-radius: 2px; border-top-right-radius: 2px; background-color: #0054a4; } /* 5470 */ .panel-title { margin-top: 0; margin-bottom: 0; font-size: 16px; color: #FFF; } /* Carousel styling */ /* 6317 */ .carousel-control { position: absolute; top: 0; bottom: 0; left: 0; width: 70px; font-size: 10px; color: #fff; text-align: center; text-shadow: 0 2px 2px rgba(0, 0, 0, 1); background-color: rgba(0, 0, 0, 0); filter: alpha(opacity=50); opacity: .5; } /* 6367 */ .carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { left: 20%; margin-left: -10px; } .carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { right: 20%; margin-right: -10px; } /* 6390 */ .carousel-indicators { position: absolute; bottom: 10px; left: 80%; z-index: 15; width: 20%; padding-left: 0; margin-left: -40%; text-align: center; list-style: none; background-color: rgba(0, 0, 0, .4); border-radius: 12px; padding-top: 3px; } .carousel-indicators li { display: inline-block; width: 10px; height: 10px; margin: 3px; text-indent: -999px; cursor: pointer; background-color: #000 \9; background-color: rgba(0, 0, 0, 0); border: 1px solid #fff; border-radius: 12px; } .carousel-indicators .active { width: 12px; height: 12px; margin: 3px; background-color: #fff; } /* 6419 */ .carousel-caption { position: absolute; right: 0; bottom: 0; left: 0; z-index: 10; padding-top: 30px; padding-bottom: 20px; padding-left: 60px; padding-right: 40px; color: #fff; text-align: left; text-shadow: 0 1px 2px rgba(0, 0, 0, .6); top: 0px; text-align: left; border: solid 0px red; } /* 1146 */ hr { border-top: 1px solid #ccc; } /*1781*/ .col-sm-12 { padding-bottom: 20px; } /* TWITTER OVERRIDE */ .customisable:hover, .customisable:focus, .customisable:active, .customisable-highlight:hover, .customisable-highlight:focus, a:hover .customisable-highlight, a:focus .customisable-highlight { color: #23527c !important; } /*2519*/ input[type="radio"], input[type="checkbox"] { margin: 4px 4px 0; } /*2254*/ caption { padding-top: 8px; padding-bottom: 8px; color: #656565 !important; text-align: left; } /*Bootstrap 4 add*/ .btn-outline-primary { color: #004064; background-color:transparent; background-image: none; border-color:#004064; } .btn-outline-primary:focus, .btn-outline-primary.focus { color: #fff; background-color:transparent; border-color: #FFF; } .btn-outline-primary:hover { color: #fff; background-color: #d7d7d7; border-color: #FFF; } .btn-outline-primary:active, .btn-outline-primary.active, .open > .dropdown-toggle.btn-outline-primary { color: #fff; background-color:transparent; border-color: #FFF; }