@import url(../../../../eremitimages/all.css);

/* COLORS */
/*
 ORANGE: #F8981C;
 GREY:   #4C4C4C;
 BLUE: #004469;
 GREEN: #418500;
 RED:  #d92e00
 DARK ORANGE: #FC5700;*/

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    overflow-y: scroll;
    font-size: 16px;
    line-height: 1.25em;
}

body {
    margin: 0 auto;
    padding-left: 0;
    padding-right: 0;
}

#main {
    background: #ffffff;
    padding: 0px;
    margin: 0;
    /*adding to fix css? */
    width: 100%;
}

.red {
    background: red;
}

#content {
    /*width: 90% !important; */
    padding: 0;
    display: block;
    margin: 0 auto !important;
}

section.one-third {
    width: 33%;
    padding: 0 1%;
    float: left;
}

section.two-third {
    width: 66%;
    padding: 0 1%;
    float: left;
    background: none;
}

section.full-width {
    width: 100%;
    padding: 1%;
}

.top {
    /*height: 79px;*/
    background-color: #3A3A3A;
    color: #d3d3d3;
    font-size: 14px;
    line-height: 22px;
    padding: 15px 0;
    padding-right: 40px;
    margin-bottom: 0px;
    text-align:right;
}

.dataTables_wrapper .top{
    color: black;
}

.top span {
    color: #d3d3d3;
    padding: 0;
    font-family: "Urw-din", Arial, sans-serif;
}

.top .mini-home {
    background-image: url("../../eremitimages/images/icons/home-icon-2.png");
    background-repeat: no-repeat;
    height: 12px;
    padding-left: 20px;
    margin-right: 20px;
}

.top .mini-phone {
/*    background-image: url("data:image/svg+xml,%3Csvg%20version=%221.1%22%20xmlns=%22http://www.w3.org/2000/svg%22%20xmlns:xlink=%22http://www.w3.org/1999/xlink%22%20x=%220px%22%20y=%220px%22%20width=%2216px%22%20height=%2216px%22%20viewBox=%220%200%2016%2016%22%20enable-background=%22new%200%200%2016%2016%22%20xml:space=%22preserve%22%3E%3Cpath%20fill=%22%23ffffff%22%20d=%22M10.938,11.047c-0.07-0.388-0.134-0.632-0.328-0.812c-0.096-0.088-0.252-0.257-0.452-0.278c-0.045-0.005-0.176,0.002-0.222,0.011l-1.311,0.486C8.461,10.193,7.907,9.517,7.906,7.5c0-2.031,0.523-2.652,0.688-2.906l1.343,0.439c0.045,0.008,0.088,0.013,0.133,0.012c0.509,0.002,0.668-0.389,0.821-1.014l0.391-2.516c0.003-0.023,0.016-0.335,0.016-0.359c0-0.327,0.058-0.465-0.203-0.703c-0.224-0.206-0.377-0.298-0.677-0.305L8.115,0.001C8.1,0.001,8.085,0,8.068,0C6.869,0,6.328,0.703,5.55,2.504C5.031,4.25,4.875,5.921,4.875,7.5c0,2.531,1.225,5.85,2.013,6.955l0,0C7.282,14.816,7.679,15,8.068,15c0.017,0,0.032-0.001,0.047-0.002l2.302-0.146c0.664-0.016,0.849-0.294,0.849-0.945%20M8,0.859l2.487,0.221L9.984,4.006l-1-0.271c-0.02-0.003-0.103-0.014-0.125-0.016c-0.31-0.031-0.535-0.056-0.78,0.146C7.447,4.386,7.063,6.111,7.094,7.5c0.038,1.737,0.337,3.044,0.935,3.59l0,0c0.254,0.234,0.579,0.346,0.914,0.312c0.021-0.002,0.041-0.006,0.062-0.01l0.994-0.414l0.36,2.858l-2.103,0.226C8.222,14.047,8,14.005,7.751,13.89c-0.672-0.812-1.86-2.765-2.063-6.39C5.688,7.649,5.281,1.719,8,0.859z%22/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    padding-left: 16px;
    margin-right: 20px;
    vertical-align:bottom; */
    display:inline-block;
    font-family: "Urw-din", Arial, sans-serif;
}

.top-right {
    margin-top: 0;
    float: right;
    margin-right: 50px;
}

.top-right a {
    color: #d3d3d3;
}

.top-right a:hover {
    color: #fff;
}

.top:after {
    content: '';
    display: table;
    clear:both;
}

.homelink {
    z-index: 1000;
}

blockquote {
    border-left: 3px solid #EE8A22;
    padding: 2%;
    margin: 1% 0;
}

blockquote.hw-blockquote {
    border-left-color: #D92E00;
}

.btn {
    background-color: #EE8A22;
    color: #fff;
    text-transform: uppercase;
    font-family: 'urw-din', 'open sans', arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    padding: 5px 15px;
    border: none;
    border-radius: 3px;
}

.btn:hover {
    opacity: .9;
}

#logout-button {
    display:inline;
    vertical-align:middle;
    background-color: #EE8A22;
    text-transform:uppercase;
    font-family: 'urw-din', 'open sans', arial, sans-serif;
    font-size: 15px;
    font-weight: 700;
    margin-left: 10px;
    margin-bottom: 25px;
    padding: 5px 15px;
}

#logout-button a {
    color: #FFFFFF;
    text-decoration:none;
}
#logout-button:hover {
    background-color: #ed7a00;
    text-decoration:none;
}


/*----------COLORS---------*/

.pension {
    color: #004469;
}

.grey {
    color: #4c4c4c;
}

.hw {
    color: #D92E00;
}

.annuity {
    color: #418500;
}

.legal {
    color: #F8981C;
}

.hw-color {
    background-color: #D92E00;
}

td {
    font-size: 16px;
}

TD#header {
    padding: 0 50px !important;
}

TD#header img {
    margin: 20px 0 0 0;
    /*width: 240px;*/
    padding: 0 44px;
}

TD#tag {
    color: #000000;
    padding: 20px 0 0px 0;
}

TR#navbar1 {
    margin: 200px 0 0 0;
    padding: 0;
}

.user {
    display: none;
}

.navtext {
    text-align: right;
    font-family: "Urw-din", Arial, Helvetica, sans-serif;
    font-size: 1.1em;
    font-weight: normal;
    text-decoration: none;
    padding: 10px 44px;
    color: #4c4c4c;
    background-color: #fff;
    margin: 0;
}

.navtext a {
    color: #4c4c4c;
}

.navtext a:hover {
    color: #5b5b5b;
    text-decoration: underline;
}

a {
    font-family: "Open Sans", Arial, sans-serif;
    color: #004469;
    text-decoration: underline;
}

a:hover {
    color: #53729A;
    text-decoration: underline;
}

a.company {
    color: #000;
    text-decoration: underline;
}

a.company:hover {
    color: #000;
    text-decoration: underline;
}

.imgright {
    float: right;
    margin-left: 10px;
}

#employer_button {
    display: none;
}

#member_button {
    display: none;
}

.pipe {
    display: none;
}

.textbox1 {
    border: 0;
    margin: 0;
    padding: 0 44px;
    min-height: 400px;
}

.box {
    display: inline;
    background: #4c4c4c;
    float: left;
    border: 3px solid #333;
    width: 18%;
    margin: 10px 1%;
    padding: 10px 1%;
    min-height: 200px;
    text-align: center;
}

.hw {
    background: #D92E00;
}

.pension {
    background: #004469;
}

.annuity {
    background: #418500;
}

.legal {
    background: #F8981C;
}

.box a {
    color: #fff;
}

.box p {
    color: #FFF;
    padding: 10px 0 20px 0;
    margin: 0;
}

.box h4 {
    color: #FFF;
    margin: 0;
    text-align: center;
    padding: 0;
}

#homelink, .linkbutton {
    display: inline-block;
    color: #eee;
    margin-top: 10px;
    padding: 4px 8px;
    background: #222222;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    font-weight: bold;
    font-size: 1em;
    text-decoration: none;
    border: 1px solid #222;
    background: #5e5e5e; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzVlNWU1ZSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM2JSIgc3RvcC1jb2xvcj0iIzYwNjA2MCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzYTNhM2EiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #5e5e5e 0%, #606060 36%, #3a3a3a 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5e5e5e), color-stop(36%, #606060), color-stop(100%, #3a3a3a)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #5e5e5e 0%, #606060 36%, #3a3a3a 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #5e5e5e 0%, #606060 36%, #3a3a3a 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #5e5e5e 0%, #606060 36%, #3a3a3a 100%); /* IE10+ */
    background: linear-gradient(to bottom, #5e5e5e 0%, #606060 36%, #3a3a3a 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5e5e5e', endColorstr='#3a3a3a', GradientType=0); /* IE6-8 */
}

#homelink {
    font-size: .9em;
    font-weight: normal;
    float: left;
}

#homelink:hover, .linkbutton:hover {
    color: #fff;
    border: 1px solid #222;
    background: #828282; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzgyODI4MiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM2JSIgc3RvcC1jb2xvcj0iIzdjN2M3YyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM1NjU2NTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #828282 0%, #7c7c7c 36%, #565656 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #828282), color-stop(36%, #7c7c7c), color-stop(100%, #565656)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #828282 0%, #7c7c7c 36%, #565656 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #828282 0%, #7c7c7c 36%, #565656 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #828282 0%, #7c7c7c 36%, #565656 100%); /* IE10+ */
    background: linear-gradient(to bottom, #828282 0%, #7c7c7c 36%, #565656 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#828282', endColorstr='#565656', GradientType=0); /* IE6-8 */

    text-decoration: none;
    cursor: pointer;
    background-color: #e0f3fa;
}

.section {
    padding: 10px 1%;
    border: 1px solid #aaa;
    margin: 0 1% 25px 1%;
    background: #eFeFeF;
    width: 44%;
    float: left;
    box-shadow: 0px 0px 5px #999;
    -moz-box-shadow: 0px 0px 5px #999;
    -webkit-box-shadow: 0px 0px 5px #999;
}

#disclaimer {
    font-size: 10pt;
}

textarea, input[type="textbox"], input[type="text"], input[type="password"], input[type="email"], select {
    background: #e8e8e8;
    border: 1px solid #F2F2F2;
    line-height: 20px;
    margin: 0;
    padding: 5px;
    color: #5f6a5f;
    border-radius: 5px;
    box-shadow: 0px 2px 3px #bcbcbc inset;
}
@media only screen and (min-width: 601px){
    .row .col.login-container.l8.m6 {
        padding-right: 6em;
    }
}
.login-portal__subtitle {
    font-weight:400px;
    font-size:1.5em;
}
#loginright {
    padding: 10px 1%;
    float: right;
    width: 40%;
    margin-left: 2%;
    margin-top: -80px;
}

.yellow h4 {
    background: none;
    color: #444;
    margin: 8px 0 5px 0;
}

.post-it {
    margin-top: 20px;
    position: relative;
}

.note {
    color: #333;
    position: relative;
    width: 300px;
    margin: 0 auto;
    padding: 20px;
    box-shadow: 0 6px 6px 2px rgba(0, 0, 0, 0.3);
}

.yellow {
    background: #eae672;
    /*
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    -o-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    transform: rotate(2deg);*/
}

.pin {
    background-color: #aaa;
    display: block;
    height: 32px;
    width: 2px;
    position: absolute;
    left: 50%;
    top: -16px;
    z-index: 1;
}

.pin:after {
    background-color: #A31;
    background-image: radial-gradient(25% 25%, circle, hsla(0, 0%, 100%, .3), hsla(0, 0%, 0%, .3));
    border-radius: 50%;
    box-shadow: inset 0 0 0 1px hsla(0, 0%, 0%, .1),
    inset 3px 3px 3px hsla(0, 0%, 100%, .2),
    inset -3px -3px 3px hsla(0, 0%, 0%, .2),
    inset 23px 20px 3px hsla(0, 0%, 0%, .15);
    content: '';
    height: 12px;
    left: -5px;
    position: absolute;
    top: -10px;
    width: 12px;
}

.pin:before {
    background-color: hsla(0, 0%, 0%, 0.1);
    box-shadow: 0 0 .25em hsla(0, 0%, 0%, .1);
    content: '';
    height: 24px;
    width: 2px;
    left: 0;
    position: absolute;
    top: 8px;
    transform: rotate(57.5deg);
    -moz-transform: rotate(57.5deg);
    -webkit-transform: rotate(57.5deg);
    -o-transform: rotate(57.5deg);
    -ms-transform: rotate(57.5deg);
    transform-origin: 50% 100%;
    -moz-transform-origin: 50% 100%;
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    -o-transform-origin: 50% 100%;
}

.info, #member-error, .success, .warning, .errormsg, .importantMessage, .redirect {

    font-weight: bold;
    border: 1px solid;
    margin: 10px auto;
    padding: 10px 10px 10px 50px;
    background-repeat: no-repeat;
    background-position: 10px center;
    background-size: 30px;
    -moz-border-radius: .5em;
    -webkit-border-radius: .5em;
    border-radius: .5em;
    margin-left: auto;
    margin-right: auto;
}

.importantMessageTitle {
    background: none;
}

.info {
    color: #00529B;
    background-color: #BDE5F8;
    background-image: url('../../eremitimages/images/icons/info.png');

}

.success {
    color: #4F8A10;
    background-color: #DFF2BF;
    background-image: url('../eremitimages/images/icons/success.png');
}

.warning, #member-error {
    color: #9F6000;
    font-size: 1.2em;
    background-color: #FEEFB3;
    background-image: url('../eremitimages/images/icons/warning2.png');
}

.importantMessage {
    font-size: 100%;
    font-weight: normal;
    color: #D8000C;
    background-color: #FFBABA;
    background-image: url('../images/icons/error.png');
}

/*  ----------------- FONTS  ------------------- */

h2, h3 {
    width: auto;
    margin: 0px;
    /*	font-family: Times New Roman, Georgia;*/
    font-family: 'urw-din', sans-serif;
    color: #4c4c4c;
    padding: 20px 0 0 0;
    font-size: 2.5em;
    line-height: 1.25;
    font-weight: bold;
}

h2 {
    padding: 20px 0 15px 0;
    border-top: 15px solid #FFF;
}

h3 {
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 1.75em;
    line-height: 1.25em;
}

.secure-server {
    font-size: .8em;
}

#profileright {
    background: #efefef;
    border: 1px solid #ddd;
    padding: 0;
    float: right;
    width: 50%;
}

#profileright p {
    padding: 0 2%;
    line-height: 160%;
}

#profileright h3 {
    background: #4c4c4c;
    color: #fff;
    padding: 5px 2%;
}

h4 {
    font-family: 'urw-din', sans-serif;
    color: #14508F;
    font-size: 1.25em;
    margin: 15px 0;
    padding: 0;
    background-color: #fff;
    font-weight: bold;
}

h4.pension {
    color: #004469;
    background-color: #fff;
    border-bottom: 3px solid #004469
}

h4.hw {
    color: #D92E00;
    background-color: #fff;
    border-bottom: 3px solid #d92e00
}

h4.annuity {
    color: #418500;
    background-color: #fff;
    border-bottom: 3px solid #418500
}

h4.legal {
    color: #F8981C;
    background-color: #fff;
    border-bottom: 3px solid #F8981C
}

td {
    font-family: "urw-din", Arial, sans-serif;
}

table#testing td {
    font-size: 10pt;
}

p {
    font-size: 105%;
    font-family: "Urw-din", Arial, sans-serif;
    padding: 5px 0;
    margin: 0px 0 10px 0;
    color: #333;
}

/* span { color : #333; } JH1015 */
li {
    font-family: "Urw-din", Arial, sans-serif;
}

.login-span {
    font-size: 1.3em !important;
    font-family: "Urw-din", Arial, sans-serif;
}

img.benefits {
    display: block;
    margin: 0 auto;
}

#parentDiv {
    width: 100%;
}

#parentDiv2 {
    width: 100%;
}

#wrapper span {
    font-size: 1.2em;
}

#wrapper label {
    font-size: 1em;
    margin-top: 5px;
}

.right-menu {
    width: 100%;
    margin-top: 20px;
    border: 1px solid #ddd;
    padding-left: 15px;
    padding-top: 10px;
    background: #efefef;
}


.right-menu:after {
    display: block;
    content: " ";
    clear: both;
}

.right-menu h3 {
    font-size: 1.2em;
    margin: 0;
}

.right-menu ul {
    padding-top: 0;
    -webkit-margin-before: .5em;
    -webkit-padding-start: 0px;
    list-style-type: none;
    padding-left: 0;
    float: left;
}

.right-menu ul li {
    padding-bottom: 5px;
    float: left;
}

.right-menu a {
    float: left;
    color: #333;
    padding-right: 15px;
}

.homelink {
    float: right;
    top: 0;
    margin-top: 0px
}

/*-------- FUND-SPECIFIC COLORS -------*/

/*----------- FOOTER -----------*/

footer {
    padding: 20px 50px;
    overflow: auto;
    background-color: #F0F0F0;
    line-height: 26px;
}

footer section {
 /*   width: 67%;
    float: left;*/
    padding: 10px 1%;
}

footer section p {
    font-size: 16px;
    text-align: left;
    color: #333232;
}

footer section p a {
    font-size: 16px;
    font-family: "Urw-din", Arial, sans-serif;
    color: #ea8a22;
}

footer section.half {
    width: 50%;
    float:left;
}
footer section.quarter {
    width:25%;
    float:left;
}

footer section#contact {
    width: 33%;
    float: left;
}

footer section#contact p {
    text-align: right;
}

footer section#social {
    text-align: center;
    width: 100%;
}

footer #fineprint {
    font-size: .9em;
}

footer .content {
    padding: 24px;
}

footer #fineprint p {
    color: #B5B5B5;
}

footer section.company {
    text-align: left;
    width: 100%;
    background: #2d2d2d;
    color: #FFF;
}

footer section.company p {
    color: #8c8c8c;
    font-size: 14px
}

a.company {
    color: #999;
}

a.company:hover {
    color: #fff;
    cursor: pointer
}

/*---------- HOME --------*/

#home .box {
    width: 23%;
    border: none;
    min-height: 300px;
}

#home .box h3 {
    color: #fff;
    text-align: center;
}

.box.hw:hover {
    opacity: .9;
}

.box.pension:hover {
    opacity: .9;
}

.box.annuity:hover {
    opacity: .9;
}

.box.legal:hover {
    opacity: .9;
}

#home #news {
    margin-top: 8px;
    padding: 0;
    background: #EFEFEF;
    border: 1px solid #ccc;
}

#home #news p {
    padding: 5px 3%;
    line-height: 110%;
}

#home #news h3 {
    padding: 5px 3%;
    background: #4c4c4c;
    color: #fff;
}

/*---------- REGISTRATION PAGE ----------*/

#register {
    width: 50%;
    border: 1px solid #ccc;
    -moz-box-shadow: 0px 0px 5px #ccc;
    -webkit-box-shadow: 0px 0px 5px #ccc;
    box-shadow: 0px 0px 5px #ccc;
    background: #f8f8f8;
    margin: 0 auto;
}

#register h2 {
    background: #efefef;
    color: #444;
    margin: 0 0 5px 0;
    padding: 5px;
    border-top: none;
    border-bottom: 1px solid #ddd;
    text-align: center;
}

#register input[type="text"],
#register input[type="password"],
#register input[type="date"],
#register input[type="datetime"],
#register input[type="email"],
#register input[type="number"],
#register input[type="search"],
#register input[type="tel"],
#register input[type="time"],
#register input[type="url"],
#register textarea,
#register select {
    background: #FFF;
    border: 1px solid #d2d2d2;
    font-size: 16px;
    height: auto;
    margin: 0;
    outline: 0;
    padding: 10px;
    width: 100%;
}

#register input:focus {
    border: 1px solid #b6d5ea;
    border-top-color: #b6d5ea;
    border-bottom-color: #b8d4ea;
    box-shadow: 0 2px 3px #b9d4e9 inset;
    color: #444444;
}

#register fieldset {
    margin-bottom: 0px;
    border: none;
    padding: 10px;
}

#register legend {
    font-size: 1.4em;
    margin-bottom: 10px;
}

#register label {
    display: block;
    color: #444444;
    margin: 10px 0;
    font-weight: bold;
    font-family: 'Urw-din', Arial, sans-serif;
    font-size: 1.1em;
}

#register button {
    padding: 19px 39px 18px 39px;
    color: #FFF;
    background-color: #F8981C;
    font-size: 20px;
    text-align: center;
    font-family: 'Urw-din', Arial, sans-serif;
    font-style: normal;
    border-radius: 5px;
    width: 100%;
    border: 1px solid #e58612;
    border-width: 1px 1px 3px;
    margin-bottom: 10px;
}

a#submit {
    display: block;
    text-decoration: none;
    /* padding: 20px 39px 20px 39px; */
    color: #FFF;
    background-color: #F8981C;
    font-size: 20px;
    text-align: center;
    font-family: 'Urw-din', Arial, sans-serif;
    font-style: normal;
    border-radius: 5px;
    width: 100%;
    border: 1px solid #e58612;
    border-width: 1px 1px 3px;
    margin-bottom: 10px;
}

#register ul {
    list-style-type: none;
}

.invalid {
    background: url('../../eremitimages/images/icons/error.png') no-repeat 0 50%;
    background-size: 15px;
    padding-left: 22px;
    line-height: 24px;
    color: #ec3f41;
}

.valid {
    background: url('../../eremitimages/images/icons/success.png') no-repeat 0 50%;
    background-size: 15px;
    padding-left: 22px;
    line-height: 24px;
    color: #3a7d34;
}

#register #pswd_info {
    position: absolute;
    /*bottom: -45px; */
    bottom: -115px \9; /*IE Specific*/
    right: 30%;
    width: 40%;
    padding: 15px;
    background: #f5f5f5;
    font-size: .875em;
    border-radius: 5px;
    box-shadow: 0 1px 5px #888;
    border: 1px solid #bbb;
}

#register #pswd_info h4 {
    background: none;
    margin: 0 0 10px 0;
    padding: 0;
    font-weight: normal
}

#register #pswd_info::before {
    content: "\25B2";
    position: absolute;
    top: -12px;
    left: 45%;
    font-size: 14px;
    line-height: 14px;
    color: #bbb;
    text-shadow: none;
    display: block;
}

/*---------- DASHBOARD ----------*/

#grey h2 {
    background: #4c4c4c;
    color: #FFF;
    padding-left: 20px;
    margin-bottom: 10px;
}

table .annuity-dash {
    padding: 5px
}

table .annuity-dash td {
    vertical-align: top;
    text-align: center;
}

table .annuity-dash td:first-child {
    width: 40%;
    text-align: left;
}

table .annuity-dash td:last-child {
    text-align: right !important;
}


/*---------- ANNUITY--------*/

#annuity section {
    float: left;
    width: 32%;
    margin-right: 1%;
    padding: 10px 1%;
    border: 1px solid #ddd;
    background: #EFEFEF;
}

#annuity section img {
    max-width: 100%;
}

#annuity h2, #annuity h3 {
    background: #418500;
    color: #FFF;
    padding-left: 20px;
}

#annuity p {
    margin-bottom: 5px;
    line-height: 150%;
}

#annuity .forms a {
    background-image: url('../../eremitimages/images/pdfsmall.gif');
    background-repeat: no-repeat;
    background-size: 18px;
    padding-left: 20px;
}

#annuity.forms a.noimg {
    background: none;
    padding: 0;
}

#annuity.forms a.doc {
    background: url('../../eremitimages/images/icons/word.png');
    background-repeat: no-repeat;
    background-size: 18px;
}

.highlight {
    background: #FFFFb5;
    border: 1px solid #FFFF87;
}

/*---------- PENSION--------*/

#learn .box {
    width: 31%;
    text-align: left;
}

#learn .box p {
    padding-bottom: 0;
}

.right {
    width: 32%;
    border: 1px solid #ddd;
    margin-left: 1%;
    padding: 10px 1%;
    background: #efefef;
    float: right;
}

.right img {
    width: 100%;
}

#pension section {
    float: left;
    width: 32%;
    margin-right: 1%;
    padding: 10px 1%;
    border: 1px solid #ddd;
    background: #EFEFEF;
}

#pension h2, #pension h3 {
    background: #004469;
    color: #FFF;
    padding-left: 20px;
}

#pension p {
    margin-bottom: 5px;
    line-height: 150%;
}

#pension .forms a {
    background-image: url('../../eremitimages/images/pdfsmall.gif');
    background-repeat: no-repeat;
    background-size: 18px;
    padding-left: 20px;
}

#pension.forms a.noimg {
    background: none;
    padding: 0;
}

#pension.forms a.doc {
    background: url('../../eremitimages/images/icons/word.png');
    background-repeat: no-repeat;
    background-size: 18px;
}

/*---------- HEALTH-WELFARE--------*/
#hw section {
    float: left;
    width: 32%;
    margin-right: 1%;
    padding: 10px 1%;
    border: 1px solid #ddd;
    background: #EFEFEF;
}

#hw h2, #hw h3 {
    background: #D92E00;
    color: #FFF;
    padding-left: 20px
}

#hw p {
    margin-bottom: 5px;
    line-height: 150%;
}

#hw .forms a {
    background-image: url('../../eremitimages/images/pdfsmall.gif');
    background-repeat: no-repeat;
    background-size: 18px;
    padding-left: 20px;
}

#hw .forms a.noimg {
    background: none;
    padding: 0;
}

#hw .forms a.doc {
    background: url('../../eremitimages/images/icons/word.png');
    background-repeat: no-repeat;
    background-size: 18px;
}

/*--------------LEGAL --------------*/
#legal #whosWho {
    overflow: auto;
}

#legal #whosWho section {
    text-align: center;
}

#legal-staff img {
    width: 200px;
}

#legal section {
    float: left;
    width: 33%;
    padding: 2%;
}

#legal article {
    clear: both;
}

#legal h2, #legal h3 {
    color: #FFF;
    background: #F8981C;
    padding-left: 20px;
}

/*#legal h2 { border-top: 15px solid #F8981C;}*/

#legal h4 {
    margin: 0;
    color: #4c4c4c;
}

#legal h3 {
    font-size: 1.4em;
    margin: 0;
}

#legal .linkbutton {
    font-size: .9em;
    font-weight: normal;
}

hr {
    color: #4c4c4c;
    background-color: #4c4c4c;
    height: 3px;
    margin-bottom: 20px;
}

/* ---------- CONTACT ------- */

#contact section {
    float: left;
    width: 50%;
    padding: 10px 1%;
}

#contact h4 {
    margin: 0;
    color: #4c4c4c;
}

#contact h3 {
    font-size: 1.4em;
}

#contact table {
}

#contact table td {
    padding: 2px 15px 2px 0;
}

#contact #map { /*width: 111.5%; margin-left: -6%; */
    margin-bottom: 10px;
}

#email {
    background: #efefef;
    padding: 10px 1%;
    border: 1px solid #ccc;
    margin-bottom: 10px;
}

/* ---------- MENU ------- */

#leftcontent-hide {
    display: none;
}

#leftcontent {
    display: none;
    float: left !important;
    width: 100% !important;
    /*	background-image:url(bg.jpg); */
    padding: 0;
    margin: 0px auto !important;
    display: block !important;
}

.shadow {
    background: #fcfcfc !important;
    -moz-box-shadow: 0px 0px 5px #333333;
    -webkit-box-shadow: 0px 0px 5px #333333;
    box-shadow: 0px 0px 5px #333333;
    padding-top: 0;
    padding-bottom: 0;
}

#brand {
    width: 15%;
    float: left;
}

#brand h1 {
    font-size: 1em;
}

.toggleMenu {
    display: none;
}












/*------ adding in code for quicklinks menu, taken from c388.css file (which was copied from c394 test) ---*/


.nav {
    list-style: none;
    *zoom: 1;
    width: auto;
    display:block;
    position:relative;
    float:right;
    margin-top: 40px;
    margin-right:40px;
/*    border: 1px solid #eee;
    background :#f9f9f9;*/
    padding: 0 10px;
    font-size:16px;
}
.nav:before,
.nav:after {
    content: " ";
    display: table;
}
.nav:after {
    clear: both;
}
.nav ul {
    list-style: none;
    width: 11em;
    -webkit-padding-start: 0;
    padding-left: 0;
}

.nav li {
    position: relative;
    padding: 0 5px;
    /*height: 74px;*/
    /*min-height: 74px;*/
    line-height: 54px;
    /*display:inline-block;*/
    vertical-align:middle;
    /*background :#f9f9f9;*/
}

.nav a {
    color:#ee8b22;
    font-family: "Urw-din", Arial, sans-serif;
    font-size: 18px;
    font-weight:bold;
    display:inline;
    margin:0px;
    text-decoration:none;
    vertical-align:middle !important;
    margin: 0 12px;
}
/* ------------- RESPONSIVE -----------*/

/**
    >=769px
*/
@media screen and (min-width: 769px) {

    #desktopNav {
        display: block;
    }

    #mobileNav {
        display: none !important;
    }


    .nav a:hover {color: #3a3a3a; /*border-bottom: 2px solid #444;*/}


    .nav > li {
        float: left;
    }
    .nav > li > .parent {
        /* background-image: url("https://ecommerce.issisystems.com/isite-test394/eremitimages/394/images/dropdownarrow.png");*/
        background-repeat: no-repeat;
        background-position: right;
    }
    .nav > li > a {
        /* display: block; */
        vertical-align: middle
    }
    .nav li ul {
        position: absolute;
        left: -9999px;
        background: #4c4c4c;
    }
    .nav > li:hover > ul {
        left: 0;
    }
    .nav li li:hover ul {
        left: 100%;
        top: 0;
    }



    .nav ul li a {
        display: block;
        /*border-right: solid 1px transparent;*/
        /*border-left: solid 1px transparent;*/
        margin: 0 0 2px -1px;
        padding: 7px 30px 7px 10px;
        font-weight: 400;
        text-align: left;
        text-decoration: none;
        line-height: 20px;
        color: #fff;
    }

    .nav li:hover ul.general{z-index: 1;}
    .nav li:hover ul.hw{ background: #D92E00; z-index: 1;}
    .nav li:hover ul.pension{ background: #004469; z-index: 1;}
    .nav li:hover ul.annuity{ background: #418500; z-index: 1;}
    .nav li:hover ul.legal{ background: #F8981C; z-index: 1;}


    .nav li li li a {
        background:#249578;
        z-index:200;
        border-top: 1px solid #1d7a62;
    }

    .nav li .documents {
        line-height:24px;
        padding-bottom:10px;
    }


    .nav .main:after {
        width: 0;
        height: 0;
        content: "";
        position: absolute;
        top: 25px;
        right: 5px;
        border-top: 4px solid rgba(211, 211, 211, 1);
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
    }


    .nav .menu-item-link-general:hover {
        background-color:#FFF;
        opacity: .5;
        color: #4c4c4c;
        border-bottom: 0px solid #FFF;
    }

    .nav .menu-item-link-pension:hover {
        background-color:#FFF;
        opacity: .5;
        color: #004469;
        border-bottom: 0px solid #FFF;
    }

    .nav .menu-item-link-annuity:hover {
        background-color:#FFF;
        opacity: .5;
        color: #418500;
        border-bottom: 0px solid #FFF;
    }

    .nav .menu-item-link-hw:hover {
        background-color:#FFF;
        opacity: .5;
        color: #D92E00;
        border-bottom: 0px solid #FFF;
    }

    .nav .menu-item-link-legal:hover {
        background-color:#FFF;
        opacity: .5;
        color: #F8981C;
        border-bottom: 0px solid #FFF;
    }

    .nav .menu-item-link-undefined:hover {
        background-color:#FFF;
        opacity: .5;
        color: #F8981C;
        border-bottom: 0px solid #FFF;
    }

}



/*#mobileNav {*/
/*display: none;*/
/*}*/
/*}*/

/*@media screen and (max-width: 719px){*/
/*#desktopNav {*/
/*display: none;*/
/*}*/
/*#mobileNav {*/
/*display: block;*/
/*}*/
/*}*/


/**
    <=768px
*/

@media all and (max-width: 768px) {

    .general{ background: #F8981C; }

    #desktopNav {
        display: none;
    }

    #mobileNav {
        display: block;
        z-index: 9999;
        position: relative;
    }

    ul#mobileNav > li.navItem {
        display: none;
    }

    ul#mobileNav > li.navItem ul li {
        display: none;
    }

    .toggleMenu a {
        color: #fff;
    }
    #smallTitle {
        display:block;
    }

    .menu {
        width: 100%;
    }

    #brand {
        display:none;
    }

    .active {
        display: block;
    }

    .nav {
        width: 100%;
        float:none;
        background: #4c4c4c;
        text-align: center;
        z-index: 9999;
    }

    .nav a {
        color: #FFF;
        padding: 10px;
    }

    .nav > li {
        float: none;
    }
    .nav > li > .parent {
        background-position: 95% 50%;
    }

    .nav > li > .parent {
        background-image: none;
    }

    .nav ul {
        /*display: block;*/
        width: 100%;
        -webkit-margin-before:0;
        -webkit-padding-start: 0;
        padding-left: 0;
    }

    .nav li {
        padding: 0 0px;
    }

    .nav li a {
        padding-left: 0px;
    }

    .nav > li.hover > ul , .nav li li.hover ul {
        position: static;

    }

    .nav .main:after {
        width: 0;
        height: 0;
        content: "";
        position: absolute;
        top: 25px;
        right: 5px;
        border-top: 4px solid rgba(211, 211, 211, 1);
        border-left: 4px solid transparent;
        border-right: 4px solid transparent;
    }

    .nav li.general{ background: #808080; }
    .nav li.hw{ background: #D92E00; }
    .nav li.pension{ background: #004469; }
    .nav li.annuity{ background: #418500; }
    .nav li.legal{ background: #F8981C; }

    footer section.half {
        width: 100%;
        float:left;
    }
    footer section.quarter {
        width: 100%;
        float:left;
    }

    footer img, #header img { width: 100%}

}



/**
   600px - 960px
*/
@media all and (max-width: 960px) and (min-width: 600px) {

    .textbox1 { padding: 0 1%; }

    footer section{ float:left;width: 100%; }
    footer section#contact p { text-align:left }
    footer section#contact { width: 100%; }

    #cssmenu { width: 95%; }
    #register { width: 80%; }
}

/**
    220px - 599px
*/
@media all and (max-width: 599px) and (min-width: 220px) {

    #desktopNav {
        display: none;
    }

    #mobileNav {
        display: block;
    }


    #wrapper span {  font-size: 1.4em; }
    #wrapper label {  font-size: 1.2em; }
    .textbox1 {padding: 0 1%;  }
    #pension img { max-width: 100%; }
    footer section{ float:left;width: 100%; }
    footer section#contact p { text-align:left; }
    footer section#contact { width: 100%; }

    #loginright { display:none; }

    h2 { font-size: 1.5em;}

    #left-30 { float:left; width: 100%;}

    #right-70 {
        float:left; width: 98%; margin-left: 2%;
    }

    #register  {
        width: 95%;
        max-width: 480px;
    }


}






.navi {
    list-style: none;
    *zoom: 1;
    width: auto;
    display: block;
    position: relative;
    float: right;
    margin-right: 20px;
    margin-top: 40px;
    border: 1px solid #eee;
    background: #f9f9f9;
    padding: 0 10px;
}

.navi:before,
.navi:after {
    content: " ";
    display: table;
}

.navi:after {
    clear: both;
}

.navi ul {
    list-style: none;
    width: 11em;
    -webkit-padding-start: 0;
    padding-left: 0;
}

.navi li {
    position: relative;
    padding: 0 5px;
    height: 74px;
    min-height: 74px;
    line-height: 74px;
    display: inline-block;
    vertical-align: middle;
    background: #f9f9f9;
}

.navi a {
    color: #4c4c4c;
    font-family: "Urw-din", Arial, sans-serif;
    font-size: 1em;
    display: inline;
    margin: 0px;
    text-decoration: none;
    vertical-align: middle !important;
    margin: 0 12px;
}

.navi a:hover {
    color: #dd9933;
    border-bottom: 2px solid #444;
}

.navi > li {
    float: left;
}

.navi > li > .parent {
    /*    background-image: url("http://webdesigntutsplus.s3.amazonaws.com/tuts/378_tessa/tessa-lt-dropdowns-21c7868/images/downArrow.png");*/
    background-repeat: no-repeat;
    background-position: right;
}

.navi > li > a {
    /*  display: block; */
    vertical-align: middle
}

.navi li ul {
    position: absolute;
    left: -9999px;
    background: #4c4c4c;
}

.navi > li.hover > ul {
    left: 0;
}

.navi li li.hover ul {
    left: 100%;
    top: 0;
}

.navi li li a {
    display: block;
    position: relative;
    z-index: 100;
    color: #fff;
    font-size: 1em;
}

.navi ul li a:hover {
    background: #FFF;
    opacity: .5;
    color: #dd9933;
}

.navi li.hover ul.hw {
    background: #D92E00;
    border-top: 5px solid #4c4c4c;
}

.navi li.hover ul.pension {
    background: #004469;
    border-top: 5px solid #4c4c4c;
}

.navi li.hover ul.annuity {
    background: #418500;
    border-top: 5px solid #4c4c4c;
}

.navi li.hover ul.legal {
    background: #F8981C;
    border-top: 5px solid #4c4c4c;
}

.navi li li li a {
    background: #249578;
    z-index: 200;
    border-top: 1px solid #1d7a62;
}

#errmsg {
    color: red;
}

/* ------------- RESPONSIVE -----------*/

@media screen and (max-width: 768px) {

    .toggleMenu {
        width: 100%;
        background: #4c4c4c;
        padding: 10px 15px;
        background-image: url("http://webdesigntutsplus.s3.amazonaws.com/tuts/378_tessa/tessa-lt-dropdowns-21c7868/images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
    }

    .toggleMenu a {
        color: #fff;
    }

    #smallTitle {
        display: block;
    }

    .menu {
        width: 100%;
    }

    ul.navi {
        -webkit-padding-start: 0;
        padding-left: 0;
        -webkit-margin-before: 0;
        margin: 0;
        display: none;
    }

    .navi li.hover ul.hw {
        background: #D92E00;
        border-top: 0px solid #4c4c4c;
    }

    .navi li.hover ul.pension {
        background: #004469;
        border-top: 0px solid #4c4c4c;
    }

    .navi li.hover ul.annuity {
        padding-left: 10px;
        background: #418500;
        border-top: 0px solid #4c4c4c;
    }

    .navi li.hover ul.legal {
        background: #F8981C;
        border-top: 0px solid #4c4c4c;
    }

    #brand {
        display: none
    }

    .active {
        display: block;
    }

    .navi {
        width: 100%;
        background: #4c4c4c;
    }

    .navi a {
        color: #FFF;
        padding: 10px;
    }

    .navi > li {
        float: none;
    }

    .navi > li > .parent {
        background-position: 95% 50%;
    }

    .navi > li > .parent {
        background-image: none;
    }

    .navi li .more {
        background-image: url("http://webdesigntutsplus.s3.amazonaws.com/tuts/378_tessa/tessa-lt-dropdowns-21c7868/images/downArrow.png");
        background-repeat: no-repeat;
        background-position: 95% 50%;
        float: right;
        width: 50%;
        padding: 8px auto;
        margin: 2px 5px 2px 0px;
        cursor: pointer;
        z-index: 200;
        position: relative;
    }

    .navi li .more:before {
        content: "";
        background: rgba(0, 0, 0, .3);
        display: block;
        position: relative;
        float: right;
        top: 0;
        bottom: 0;
        left: -2px;
    }

    .navi ul {
        display: block;
        width: 100%;
        -webkit-margin-before: 0;
        -webkit-padding-start: 0;
        padding-left: 0;
    }

    .navi li {
        padding: 0;
    }

    .navi li a {
        padding-left: 20px;
    }

    .navi > li.hover > ul, .navi li li.hover ul {
        position: static;

    }

    .navi li.hw {
        background: #D92E00;
    }

    .navi li.pension {
        background: #004469;
    }

    .navi li.annuity {
        background: #418500;
    }

    .navi li.legal {
        background: #F8981C;
    }

}

@media all and (max-width: 960px) and (min-width: 600px) {

    .textbox1 {
        padding: 0 1%;
    }

    footer section {
        float: left;
        width: 100%;
    }

    footer section#contact p {
        text-align: left
    }

    footer section#contact {
        width: 100%;
    }

    #cssmenu {
        width: 95%;
    }

}

/*end 220-500 MQ */

@media all and (max-width: 599px) and (min-width: 220px) {

    #wrapper span {
        font-size: 1.4em;
    }

    #wrapper label {
        font-size: 1.2em;
    }

    .textbox1 {
        padding: 0 1%;
    }

    #pension img {
        max-width: 100%;
    }

    footer section {
        float: left;
        width: 100%;
    }

    footer section#contact p {
        text-align: left;
    }

    footer section#contact {
        width: 100%;
    }

    #loginright {
        display: none;
    }

    h2 {
        font-size: 1.5em;
    }

    #left-30 {
        float: left;
        width: 100%;
    }

    #right-70 {
        float: left;
        width: 98%;
        margin-left: 2%;
    }

}

/* end 220-599 */

@media all and (max-width: 960px) and (min-width: 600px) {
    #register {
        width: 80%;
    }
}

@media all and (max-width: 599px) and (min-width: 220px) {
    #register {
        width: 95%;
        max-width: 480px;
    }
}

.item-header {
background: #005072;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
padding: 10px;
}