/*version=20171025*/
body{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

label{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-style: italic;
    font-weight: normal;
}


.server-error{
    color: #ed1c24;
    margin: 0 15px 10px 15px;
    padding: 0px 5px;
    font-weight: normal;
    font-style: italic;
}

/*-----------------------*/
.container {
    padding-right: 0px;
    padding-left: 0px;
    margin-right: auto;
    margin-left: auto;
}


.glyphicon-chevron-down{
    font-size: 12px;
    margin: 0 0 0 8px;
    top: 0px;
}

/*---------------------------*/

#collapseOne{
    margin-top: 30px;
}
#triangle-down {
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 12px solid #046285;
    position: absolute;
    top: 30px;
    right: 22px;
}


#col1{
    padding: 0;
}

#login input{
    margin-left: 15px;
    border: 2px solid #cdd6d3;
    height: 36px;
    border-radius: 2px;
}

#login label {
    text-align: left;
}

#header{
    border-bottom: 2px solid #EBEBEB;
    background-color: #FAFAFA;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

#Login_logo{
    margin: 7px 0 0 10px;
}

/*--------------------------*/

#Login_advisorsText{
    margin-bottom: 10px;
}

#agreement{
    margin-bottom: 30px;
    font-size: 11px;
}

footer{
    height: 50px;
    border-top: 2px solid #EBEBEB;
    background-color: #FAFAFA;
    margin-top: 40px;
    padding: 5px 0;
}

/*-----------------------------*/
#login{
    margin-bottom: 30px;
}

#login h1{
    font-size: 40px;
    padding-left: 15px;
    margin: 0 0 20px 0;
    font-family: arial;
    font-weight: normal;
}

#login button{
    border: 3px solid #11718B;
    background-color: #ffffff;
    border-radius: 35px;
    width: 130px;
    padding: 14px 20px 14px 0;
    margin-right: -15px;
    color: #11718B;
    font-weight: bold;
}

#login #arrowIcon{
    width: 25px;
    height: 25px;
    position: absolute;
    right: 15px;
    bottom: 12px;
    background-image: url("/ftgw/pages/templates/cgfcust/images/button-arrow.png");
}

#login #arrowIcon b{
    font-size: 16px;
    margin: -3px 0px 0 -4px;
    position: absolute;
}

#login .questionIcon{
    width: 20px;
    height: 20px;
    border-radius: 25px;
    border: 2px solid #abc6d1;
    margin-left: 30px;
    margin-top: 7px;
    padding: 0;
}

#login .questionIcon b{
    font-size: 14px;
    margin: -1px 0px 0 4px;
    position: absolute;
    color: #11718B;
}

/*-------------*/
#collapsePassword, #collapseUser{
    padding-left: 15px;
    padding-right: 0px !important;
}

#collapsePassword p, #collapseUser p{
    background-color: #fafafa;
    padding: 13px;
    margin: 0 0 15px;
}

.questionIcon{
    cursor: pointer;
}

/*-----------------*/

#newUser{
    margin: 30px 0;
}

#manageUser{
    margin: 30px 0 0 0;
}

#manageUser li{
    margin: 0 0 10px -20px;
}

/*----------------------------*/

input, #col2{
    border-radius: 3px;
}

input{
    border: 2px solid #d7dedc;
    height: 30px;
}

.form-group{
    padding: 0;
}

#login button{
    float: right;
}


/*--------------*/


footer p{
    margin: 2px 0 2px 0;
    color: #999999;
    font-size: 12px;
}


/*-------------------------------*/


.line-divider{
    border-top: 2px solid #e8eceb;
}

/*------------------------------*/

a{
    color: #006990;
    font-style: italic;
}

#header_MobileMenuButton{
    border: 1px solid #CCCCCC;
    background-color: #FFFFFF;
    border-radius: 2px;
    height: 25px;
    width: 28px;
    position: absolute;
    right: 10px;
    top: 12px;
    padding: 3px 6px;
    cursor: pointer;
}


#userLinksParent{
    width: 100%;
    /*background-color: #666;*/
    height: 100%;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 999999;
}

#blackBack{
    background-color: #000;
    opacity: 0;
    width: 100%;
    height: 100%;
}

#userLinksOuterContainer{
    width: 100%;
    height: 100%;
    margin: 0 -100% 0 0;
    background-color: #fff;
    position: absolute;
    top: 0;
    right: 0;
    border-left: 1px solid #CCC;
}
#userLinks{
    width: 100%;
    margin: 0px 0px 0 0;
    background-color: #FAFAFA;
}

#userLinks div{
    border-bottom: 2px solid #CCCCCC;
    color: #293335;
    display: block;
    margin: 0px 0px;
    padding: 20px 0 20px 30px;
    font-style: italic;
    font-weight: bold;
}


#userLinks a{
    color: #293335;
}



#userLinks #Login_backtoLoginHomeButton{
    font-style: normal;
    height: 50%;
    width: 55px;
    background-image: url("/ftgw/pages/templates/cgfcust/images/MenuSlideout_icon.png");
    background-repeat: no-repeat;
    background-size: 20px 20px;
    position: absolute;
    right: 20%;
    top: 20px;
}


#lines div{
    height: 1px;
    border: 1px solid #999999;
    margin: 3px 0;
}



#col2 {
    padding: 0 0 0 15px;
}




/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) {

    #header{
        height: 75px;
    }

    /*---------------------*/
    #header_MobileMenuButton{
        border: 0px solid #CCCCCC;
        background-color: transparent;
        border-radius: 2px;
        height: 25px;
        width: auto;
        position: absolute;
        right: 10px;
        top: 12px;
        padding: 3px;
        cursor: none;
    }


    #userLinksDesktop{
        margin: 2px -1px 0 0;
        width: 250px;
        background-color: transparent;
        padding: 10px 0px 10px 0px;
        position: relative;
        float: right;
        display: block;
    }
    #userLinksDesktop a{
        display: inline-block;
        border: 0px solid #CCC;
        color: #293335;
        margin: 0px 0px;
        padding: 20px 0 20px 30px;
        font-style: italic;
        font-weight: bold;
    }

    #lines div{
        width: 100%;
        height: 1px;
        border: 1px solid #999999;
        margin: 3px 0;
        display: none;
    }
    /*---------------------*/

    #Login_logo{
        margin: 20px 0 0 10px;
    }

    #login input{
        margin-left: 0;
    }

    #login .questionIcon{
        margin-left: 15px;
    }

    #Login_advisorsText{
        padding: 0;
    }

    #col1{
        padding: 0 50px 50px 0;
        margin-top: 20px;
    }

    #col2{
        /*border-left: 2px solid #e8eceb;*/
        margin-top: 30px;
        height: 350px;
        padding: 0 0 0 0px;
    }



    #newUser{
        padding: 20px 0 20px 30px;
        border-left: 2px solid #e8eceb;
        padding-left: 30px;
    }

    #advisor{
        margin-top: 30px;
        border-left: 2px solid #006990;
        padding: 20px 0 40px 30px;
    }



    #newUser p, #manageUser p{
        margin: 15px 0;
    }

    #manageUser{
        margin: 20px 0;
    }

    #agreement{
        padding-left: 0;
        /*margin-top: 10px;*/
    }

    #collapsePassword, #collapseUser{
        padding-left: 0;
        padding-right: 37px !important;
    }

    footer p{
        float: right;
    }

    #login button{
        margin-right: 0px;
    }
}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) {

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {

}



/*--------------------------*/

/* This style sheet only contains overrides where possible and some changes may be declared in comments.
   ONLY the Properties that are being overridden are shown.
  '!important' is only used to ensure specificity and should not be used in production code

   The primary font-family for entire page should be 'lato'. 'lato-italic' is used in place of 'font-style: italic;'
   EXACT FONT SIZING CAN NOT BE SPEC'D UNTIL LATO FONT IS RENDERED

   RESPONSIVE BREAKPOINTS
   Desktop: min-width: 1200px
   Tablet(Landscape): min-width: 993px
   Tablet(Landscape): min-width: 768px
   Mobile: n/a, default */

/* Font Styles and Colors */

/* This font-family order should be applied through the page */

/** {
    font-family: Helvetica-Light, Helvetica, Arial, san-serif !important;
}*/

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, #Login_websitesText, #Login_manageUserText {
    color: #435359;
}

#Login_usageText{
    font-size: 1.2rem;
}


/* Resizes header bar height and thickens bottom border */

@media (min-width: 1200px) {
    #header {
        height: 86px !important;
    }
}

@media (min-width: 1200px) {
    #header {
        border-bottom: 3px solid #EBEBEB !important;
    }
}

/* Manual resizing of page logo and alignment */

@media (min-width: 1200px) {
    #Login_logo {
        margin: 18px 0 0 15px !important;
        height: 43.9219px !important;
        width: 262.5px !important;
    }
}

/* Removes 'font-weight: bold;' and applies correct color and spacing to right nav links */
/* 'font-style: italic' should also be removed (redundant) once 'font: "lato-italic"...;' is properly rendered */

@media (min-width: 1200px) {
    #userLinksDesktop a {
        color: #232d31 !important;
        font-size: 1.3rem !important;
        font-weight: normal !important;
    }
}

@media (min-width: 1200px) {
    #userLinksDesktop {
        width: 230px !important;
        padding: 13px 0px 13px 0px !important;
    }
}


@media (min-width: 1200px) {
    #col1 {
        margin-top: 40px !important;
    }
}

@media (min-width: 1200px) {
    #col2 {
        margin-top: 40px !important;
        padding-top: 10px !important;
        padding-bottom:10px !important;
    }
}

/* Log in form */

@media (min-width: 1200px) {
    #login h1 {
        font-size: 55px !important;
        margin: 0 0 30px 0 !important;
    }
}

@media (min-width: 1200px) {
    #login {
        margin-bottom: 30px !important;
    }
}

#loginInfo{
    padding-left: 15px;
}

/* Updates padding and styles for log in forms fields and right column 'New User' box


/* 'Username' and 'Password' vertically centering to fields */

@media (min-width: 768px) {
    #login label {
        padding-left: 0 !important;
    }


    #loginInfo{
        padding-left: 0;
    }
}

/* Security Notice box */

@media (min-width: 768px) {
    #securityNotice {
        padding-left: 0;
    }
}






/* Header spacing */
#newUser {
    margin: 15px 0 !important;
}

#manageUser {
    margin: 30px 0 !important;
}

h4#Login_newUserHeader {
    margin: 0 0 5px 0 !important;
    /*padding: 0 0 10px 0 !important;*/
}

h4#Login_manageUserHeader {
    margin: 0px !important;
    padding: 0 0 0px 0 !important;
}


/* Feedback and Contact links for @media (min-width: 768px) I had to have these placed before the @media (min-width: 1200px), probably stating the obvious but just something I noticed/learned :-) */

@media (min-width: 768px) {

    #login h1{
        padding-left: 0;
    }

    #userLinksDesktop {
        padding: 6px 0px 10px 0px !important;
    }

    #userLinksDesktop a {
        color: #232d31 !important;
        font-weight: normal !important;
        font-size: 1.3rem !important;
    }

    .server-error{
        margin: 0 0 10px 0;
    }

}



#forgot{
    text-align: right;
}

#securityNotice p{
    font-size: 1.2rem !important;
}

.spacer{
    margin-bottom: 20px;
}


#advisor{
    margin-top: 30px;
    margin-bottom: 40px;
}

#advisor img{
    width: 55px;
    margin: 0 0 13px 0;
}

#advisor #givingCentralLink {
    position: relative;
    float: left;
}

#advisor #arrowIcon {
    width: 14px;
    height: 15px;
    position: relative;
    float: left;
    bottom: -3px;
    left: 5px;
    background-image: url(/ftgw/pages/templates/cgfcust/images/arrow-right.png);
}