﻿/*.container {*/
    /* 4/29/20 EJC - changed background as requested to be i line with DDMA PA site (deltadental.com)  */
    /*background-color: #F6F6F6;*/
    /*background-color: #ffffff;
    width: 100%;
}*/

header {
    padding: 10px;
    text-align: center;
    color: #000000;
    height: 250px;
    border-bottom: 1px solid lightgrey;
    background-color: #FFFFFF;
}

.header-right {
    float: right;
}

    .header-right a {
        float: left;
        text-align: center;
        padding: 10px;
        color: #000000;
        text-decoration: none;
        font-size: 15px;
    }

/*.masterHeaderTable > tbody > tr > td {
    border-top: none;
    text-align: right;
    width: 10%;
}*/

/*.masterHeaderTable > tbody > tr:first-child > td > a {
    color: #002080;
    font-weight: bold;
    font-size: 17px;
}*/

ul > li > a {
    color: #000000;
    font-size: 15px;
    text-decoration: none;
}

/*.masterFooterTable > tbody > tr > td {
    border-top: none;
    text-align: left;
}*/

/*    .masterFooterTable > tbody > tr > td > a {
        color: #000000;
        font-size: 15px;
        text-decoration: none;
    }*/

.fa {
    font-size: larger;
    padding: 5px;
}
/* Style the footer */
footer {
    /*border-top: 1px solid lightgrey;*/
    padding: 10px;
    text-align: center;
    color: #000000;
    background-color: #F6F6F6;
}

@media screen and (max-width: 500px) {
    .header-right a {
        float: none;
        display: block;
        text-align: left;
    }

    .masterHeaderTable > tbody > tr:first-child > td > a {
        float: none;
        display: block;
        text-align: left;
    }

    .header-right {
        float: none;
    }
}

.nav {
    color: #FFFFFF;
    background-color: #FFFFFF;
}



/* 6/17/2020 EJC: moved the CSS from the Kentico Master page to this CSS file */

.mb-5 .col-sm-3:first-child {
    padding-left: 100px;
}

.footer-copyright {
    padding-top: 25px;
    /*padding-left: 45px;*/
}

.row.mb-5 {
    padding-top: 40px;
}

p.socialAnchors {
    padding-top: 0px !important;
}

/* 4/24/2020 EJC: removed width as the icons were spaced too far apart */
/*
		p.socialAnchors > a {
			width: 50px;
		}
		*/

.mb-7 .col-sm-3:last-child {
    padding-left: 75px;
}

span.classFollowUs {
    font-size: 14px;
}

.socialIcons {
    display: inline-block;
    /*position: unset;*/
    position: static;
}

.footer-links {
    color: #000000;
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    display: inline-block;
    background-color: rgba(255, 255, 255, 0);
    text-align: left;
}

    .footer-links li:not(:last-child) {
        padding-bottom: 13px;
    }

.navbar-custom {
    background: inherit;
    /*background-color:rgba(29, 66, 138, 1);*/
    background-color: rgba(65, 177, 73, 1);
    border: none;
}

    .navbar-custom .navbar-toggle .icon-bar {
        background-color: black;
    }

    .navbar-custom .navbar-nav > li > a {
        color: #ffffff;
        background-color: rgba(65, 177, 73, 1) !important;
    }

    .navbar-custom .navbar-collapse {
        border: none !important;
    }

    .navbar-custom .navbar-nav > .active > a {
        color: #ffffff;
        background-color: rgba(65, 177, 73, 1);
    }

        .navbar-custom .navbar-nav > li > a:hover,
        .navbar-custom .navbar-nav > li > a:focus,
        .navbar-custom .navbar-nav > .active > a:hover,
        .navbar-custom .navbar-nav > .active > a:focus,
        .navbar-custom .navbar-nav > .open > a {
            background-color: rgba(65, 177, 73, 1);
        }


.nav.navbar-nav a:hover {
    background-color: #1D428A;
}



@media only screen and (max-width: 600px) {
    span.classFollowUs {
        font-size: 14px !important;
    }

    .row.mb-5 {
        padding-top: 15px !important;
    }

    .footer-copyright {
        margin-left: -55px !important;
        padding-left: 0px !important;
    }

    .row.mb-5 {
        padding-left: 15px !important;
    }

    .mb-7 .col-sm-3:last-child {
        padding-left: 15px !important;
        padding-top: 30px !important;
    }

    footer {
        text-align: left !important;
    }

    .secondlist {
        padding-top: 10px;
    }

    .mb-5 .col-sm-3:first-child {
        padding-left: 0px !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .mb-5 .col-sm-3:first-child {
        padding-left: 50px !important;
    }

    .footer-copyright {
        padding-left: 45px !important;
        width: 47% !important;
    }

    /* 4/24/2020 EJC: removed fixed width for tablets and larger tablets - causing the new/4th social media icon to wrap to next line */
    /*
		p.socialAnchors {
			width: 150px !important;
		}
		*/

    p.socialAnchors > a {
        width: 47px !important;
    }
}
/*
	.navbar-nav li a:hover, .navbar-nav > .active > a {
	  background:inherit;
	  background-color:rgba(29, 66, 138, 1);

	}

	.navbar-nav > .active > a {
	  color: aqua;
	   background-color:rgba(135, 212, 212, 1);
	}
	.nav-item > a:hover {
	  background:inherit;
	  background-color:rgba(29, 66, 138, 1);
	}*/




/* small screens */
@media all and (max-width:600px) {
    #TopFooter_div {
        /*background-color: #f6f6f6;*/
        /*padding-left: 10px;*/
        /*padding-left: 26px;*/
        padding-right: 25px;
    }
}

/* phones */
@media only screen and (max-width:767px) {
    #TopFooter_cntr {
        padding-bottom: 50px;
        /*width: 80%;*/
        /*width: 1185px;*/
        /*margin-left: 47px;*/
        /*margin-left: 9px;*/
        /*padding-left: 106px;*/
    }

    /*
		#u68 {
			margin-left: 55px;
		}

		#u65_text {
			padding-left: 22px;
		}

		#u67 {
			margin-left: 22px;
		}
		*/

    p.classFollowUs {
        padding-top: 15px !important;
    }

    #BelowHeader_div {
        width: inherit !important;
    }
}

/* tablets */
@media only screen and (min-width:768px) and (max-width:991px) {
    #TopFooter_cntr {
        padding-bottom: 50px;
        /*width: 776px;*/
        /*margin-left: 47px;*/
        /*margin-left: 9px;*/
        /*padding-left: 106px;*/
    }

    #u68 {
        margin-left: -25px;
        width: 100%;
    }

    #u68_text {
        width: 100%;
    }

    #u65_text {
        /*padding-left: 22px;*/
        margin-left: -55px;
    }

    #u67 {
        /*margin-left: 22px;*/
        margin-left: -55px;
    }

    #BelowHeader_div {
        width: inherit !important;
    }

        #BelowHeader_div img {
            padding-left: 0px !important;
            margin-left: -15px !important;
        }
}


/* large tablets (i.e. iPad Pro) */
@media all and (min-width:992px) and (max-width:1024px) {
    #TopFooter_cntr {
        padding-bottom: 50px !important;
        padding-left: 0px !important;
    }


    #BelowHeader_div {
        width: inherit !important;
    }

        #BelowHeader_div img {
            padding-left: 0px !important;
            margin-left: -15px !important;
        }

    #divTellMeAboutTourself {
        background-color: red; /* TEST - REMPOVE*/
    }
    /*
		div#divTellMeAboutTourself.card {
			margin-left: 0px !important;
		}

		div#divTellMeAboutTourself.card-title {
			width: 350px !important;
		}
		*/
}


/* large screens */
/*@media only screen and (min-width:768px) {*/
@media only screen and (min-width:992px) {
    #TopFooter_cntr {
        padding-bottom: 50px;
        /*
			width: 1185px;
			margin-left: 367px;
			*/
        padding-left: 106px;
    }

    #u68 {
        margin-left: 55px;
    }

    #u65_text {
        padding-left: 22px;
    }

    #u67 {
        margin-left: 22px;
    }

    div#divTellMeAboutTourself.card {
        margin-left: 0px !important;
    }

    div#divTellMeAboutTourself.card-title {
        width: 350px !important;
    }

    #BelowHeader_div {
        padding-right: 0px;
        margin-bottom: 5px !important;
        background-color: #ffffff;
    }
}

@media only screen and (min-width:1024px) {

    #divTellMeAboutTourself {
        margin-left: 0px !important; /* this is a test - REMOVE*/
    }

        #divTellMeAboutTourself.card {
            margin-left: 0px !important;
        }

        #divTellMeAboutTourself.card-title {
            width: 350px !important;
        }
}

/* 6/8/2020 EJC - added CSS for Plans dropdown in header */
/* Dropdown Button */
.dropbtn {
    background-color: #f6f6f6;
    color: #000000;
    padding: 16px;
    /*font-size: 16px;*/
    border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f1f1f1;
    min-width: 210px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

    /* Links inside the dropdown */
    .dropdown-content a {
        color: black;
        padding: 12px 16px 0px;
        text-decoration: none;
        display: block;
    }

        /* Change color of dropdown links on hover */
        .dropdown-content a:hover {
            background-color: #ddd;
        }

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
/*
		.dropdown:hover .dropbtn {
		background-color: #00205b;
	}
	*/



/* End: move CSS from Master page */









/* 4/8/20 EJC - added CSS for section above the footer */

/*.topFooter_SearchProviders {
    left: 793px;
    top: 1015px;
    border-width: 0px;
    left: 10px;
    top: 2152px;
    height: 50px;
    display: flex;
    font-family: 'Arial Bold', 'Arial';
    font-weight: 700;
    font-style: normal;
    color: #00205B;
    text-align: center;
    font-size: 14px;
}

.topFooter_SearchProviders_Div {
    border-width: 0px;
    left: 0px;
    top: 0px;
    width: 175px;
    height: 50px;
    background: inherit;
    background-color: rgba(255, 255, 255, 1);
    box-sizing: border-box;
    border-width: 2px;
    border-style: solid;
    border-color: #41a928;
    border-radius: 0px;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-family: 'Arial Bold', 'Arial';
    font-weight: 700;
    font-style: normal;
    color: #000000;
    text-align: center;
}

.topFooter_SearchProviders_Text {
    align-self: center;
    box-sizing: border-box;
    border-width: 0px;
    word-wrap: break-word;
    text-transform: none;
    font-family: 'Arial Bold', 'Arial';
    font-weight: 700;
    font-style: normal;
    color: #00205B;
    text-align: center;
    font-size: 14px;
}*/

.ddPlans {
    text-decoration: underline !important;
    background-color: transparent !important;
}

    .ddPlans a:hover {
        text-decoration: none !important;
    }

a.ddPlans:hover {
    text-decoration: none !important;
}


.plansLevel2 {
    color: #000000 !important;
    /*font-weight: 700;*/
    text-decoration: underline !important;
    letter-spacing: normal;
    margin: 0px !important;
    font-family: Arial;
    font-size: 14px;
    z-index: 1;
    position: relative;
    top: auto;
    text-align: left !important;
    border-color: rgba(65, 177, 73, 1) !important;
    border-style: border-style: solid;
}


/* 4/8/20 EJC - added CSS for social media icons */
.fb-social {
    top: 59px;
    right: 185px; /*opacity: 0.75;*/
    width: 35px;
    height: 35px;
    background: url(/media/images/Facebook.png) top left no-repeat;
}

.tw-social {
    top: 59px;
    right: 113px; /*opacity: 0.75;*/
    width: 35px;
    height: 35px;
    background: url(/media/images/Twitter.png) top left no-repeat;
}

.ln-social {
    top: 59px;
    right: 148px; /*opacity: 0.75;*/
    width: 35px;
    height: 35px;
    background: url(/media/images/Linkedin.png) top left no-repeat;
}

.yt-social {
    top: 59px;
    right: 148px;
    width: 35px;
    height: 35px;
    background: url(/media/images/Social.png) top left no-repeat;
}

footer .tw-social:hover { /*opacity: 1.0;*/
}

footer .fb-social:hover { /*opacity: 1.0;*/
}

footer .ln-social:hover { /*opacity: 1.0;*/
}

footer .yt-social:hover { /*opacity: 1.0;*/
}

/*footer .tw-social { right: 33px; background-position: right top; }*/
footer .tw-social i {
    display: none;
}

footer .fb-social i {
    display: none;
}

footer .ln-social i {
    display: none;
}

footer .yt-social i {
    display: none;
}

.nav.navbar-nav li:hover {
    background-color: transparent;
}

.nav.navbar-nav li a:hover {
    background-color: transparent;
}

/*Ipad*/
@media screen and (max-width: 768px) {
    #divSessionAlertPopup {
        left: 0% !important;
    }
}
/*mobile*/
@media only screen and (min-width: 320px) and (max-width:640px) {
    #divSessionAlertPopup {
        left: 12% !important;
    }

    #ZoomInOut {
        position: relative;
        top: -20px;
    }

    .navbar-nav {
        margin: 0px -15px !important;
    }
}

/* 6/10/20 EJC: added for mobile display of the Plans dropdown */
.plansLevel2 {
    color: #ffffff !important;
    font-weight: 700;
    text-decoration: none;
    letter-spacing: normal;
    /*margin: 0 0 0 8px;*/
    font-family: Arial;
    font-size: 15px;
    /*z-index: 1;*/
    /*position: relative;*/
    /*top: auto;*/
}

/* 6/10/20 EJC: added for mobile display of the Plans dropdown */
@media only screen and (min-width: 320px) and (max-width:767px) {
    .plansLevel2 {
        color: #ffffff !important;
        font-weight: 700;
        text-decoration: none;
        letter-spacing: normal;
        /*margin: 0 0 0 8px;*/
        font-family: Arial;
        font-size: 15px;
        /*z-index: 1;*/
        /*position: relative;*/
        /*top: auto;*/
        line-height: 1.5;
    }

    .plansTopLevel {
        position: relative !important;
        /*width: 300px;*/
        text-align: left !important;
        background-color: #41B149 !important;
        /*margin-top: 50px;*/
        list-style-type: none !important;
        margin-left: -5px;
        z-index: 2;
    }
}


/*@media only screen and (min-width: 993px) and (max-width:1200px) {*/
/*@media only screen and (min-width: 993px) {*/
@media only screen and (min-width: 768px) {
    /* 6/4/2020 EJC: added style for the Plans dropdown menu */
    .plansTopLevel {
        position: absolute !important;
        width: 300px !important;
        /*text-align: left;*/
        /*padding-left: 0px;*/
        /*margin-left: -20px;*/
        background-color: #41B149 !important;
        margin-top: 50px !important;
        list-style-type: none !important;
        z-index: 2;
    }
}


/* 6/11/2020 EJC: from responsive.css to handle PLANS dropdown menu for mobile */

@media screen and (max-width: 973px) {
    body.mobile-nav-open header .mobile-header {
        left: calc(100% - 50px);
        right: auto;
    }
}

@media screen and (max-width: 973px) {
    body.mobile-nav-open header .mobile-header .menu-button-container .close-icon {
        display: block;
    }
}

@media screen and (max-width: 973px) {
    body.mobile-nav-open header .mobile-header .menu-button-container .menu-icon {
        display: none;
    }
}

@media screen and (max-width: 973px) {
    body.mobile-nav-open header .mobile-nav {
        transform: translate(0%);
        box-shadow: 2px 0px 6px rgba(0, 0, 0, 0.16);
    }
}

@media screen and (max-width: 973px) {
    body.mobile-nav-open .menu-overlay {
        z-index: 20;
        opacity: 1;
    }
}

@media screen and (max-width: 973px) {
    body.mobile-login-open header .mobile-header {
        left: auto;
        right: calc(100% - 50px);
    }
}

@media screen and (max-width: 973px) {
    body.mobile-login-open header .mobile-login {
        transform: translate(0%);
        box-shadow: -2px 0px 6px rgba(0, 0, 0, 0.16);
    }
}

@media screen and (max-width: 973px) {
    body.mobile-login-open .menu-overlay {
        z-index: 3;
        opacity: 1;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav {
        position: fixed;
        left: 0;
        top: 0;
        width: calc(100% - 50px);
        height: 100vh;
        overflow-y: auto;
        background: white;
        transform: translate(-100%);
        box-shadow: 0px 0px 0px transparent;
        transition: all 0.25s;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul {
        background: white;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li {
        display: table;
        width: 100%;
        /* 06/17/19 EJC - changed border-bottom color as part on ADA 508 Compliance project */
        /*border-bottom: 1px solid #98b52a;*/
        /*border-bottom: 1px solid #1D428A;*/
        border-bottom: 1px solid #41B149;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li.highlight-item span {
        /* 06/17/19 EJC - changed text color and background color as part on ADA 508 Compliance project */
        /*color: white;*/
        color: #41B149;
        /*background: #c56f01;*/
        background: #EF6079;
        padding: 10px 15px;
        width: 100%;
        display: table-cell;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li.highlight-item .caret-right {
        /* 06/17/19 EJC - changed background color as part on ADA 508 Compliance project */
        /*background: #c56f01;*/
        background: #ef6079;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li.highlight-item .second-level .backlink-container span {
        color: #c56f01;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li.highlight-item .second-level .backlink-container .caret-left svg {
        fill: #c56f01;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li a {
        color: white;
        /* 06/17/19 EJC - changed text color and background color as part on ADA 508 Compliance project */
        /*background: #a8c535;*/
        background: #1D428A;
        padding: 10px 15px;
        width: 100%;
        display: table-cell;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .caret-right {
        min-width: 40px;
        display: table-cell;
        vertical-align: middle;
        /* 06/17/19 EJC - changed background color as part on ADA 508 Compliance project */
        /*background: #a8c535;*/
        background: #1D428A;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .caret-right svg {
        width: 22px;
        height: 17px;
        fill: white;
        display: block;
        margin: 0 auto;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level {
        position: fixed;
        width: 100%;
        left: 0;
        top: 0;
        transform: translateX(-100%);
        height: 100vh;
        overflow-y: auto;
        transition: transform 0.25s;
        background: white;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level.open {
        transform: translate(0%);
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level .backlink-container {
        display: table;
        width: 100%;
        border-bottom: 1px solid #98b52a;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level .backlink-container span {
        color: #a8c535;
        background: white;
        font-weight: bold;
        padding: 10px 15px;
        padding-right: 55px;
        width: 100%;
        display: table-cell;
        vertical-align: middle;
        font-size: 16px;
        font-size: 1rem;
        text-align: center;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level .backlink-container .caret-left {
        min-width: 40px;
        display: table-cell;
        vertical-align: middle;
        background: white;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav ul.first-level li .second-level .backlink-container .caret-left svg {
        width: 22px;
        height: 17px;
        fill: #a8c535;
        display: block;
        margin: 0 auto;
    }
}

header .mobile-nav ul.util-links {
    padding: 15px;
}

    header .mobile-nav ul.util-links li {
        margin-bottom: 15px;
    }

@media screen and (max-width: 973px) {
    header .mobile-nav .search-container {
        padding: 10px 15px;
        display: table;
        width: 100%;
        box-sizing: border-box;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav .search-container .input-container {
        display: inline-block;
        vertical-align: middle;
    }

        header .mobile-nav .search-container .input-container input {
            font-size: 16px;
            font-size: 1rem;
            max-width: 120px;
        }
}

@media screen and (max-width: 973px) {
    header .mobile-nav .search-container .button-container {
        display: inline-block;
        vertical-align: middle;
        margin-left: 10px;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav .search-container .button-container .button {
        display: block;
        box-sizing: border-box;
        text-align: center;
        width: 100%;
        font-weight: bold;
        border: 1px solid;
        border-color: #1896de #2c9edf;
        /* 06/24/19 EJC - changed background color as part on ADA 508 Compliance project */
        /*background: #29a8de;*/
        background: #41B149;
        border-radius: 4px !important;
        padding: 8px 12px;
        margin-bottom: 0px;
        position: static;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-nav .plain-link {
        margin-left: 15px;
        margin-top: 15px;
        display: inline-block;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login {
        position: fixed;
        right: 0;
        top: 0;
        width: calc(100% - 50px);
        height: 100vh;
        overflow-y: auto;
        background: white;
        transform: translateX(100%);
        box-shadow: 0px 0px 0px transparent;
        transition: all 0.25s;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login ul {
        background: white;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login ul.first-level li {
        border-bottom: 1px solid #0070B0;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login ul.first-level li span {
        color: #0070B0;
        padding: 10px 15px;
        width: 100%;
        display: block;
        font-weight: bold;
        border-bottom: 1px solid #0070B0;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login ul.first-level li ul li:not(:last-of-type) {
        border-bottom: 1px solid #06b1e8;
    }
}

@media screen and (max-width: 973px) {
    header .mobile-login ul.first-level li ul li a {
        color: #06b1e8;
        padding: 10px 15px;
        padding-left: 35px;
        width: 100%;
        display: block;
    }
}

@media screen and (min-width: 974px) {
    .mobile-header,
    .mobile-nav,
    .mobile-login {
        display: none;
    }
}
