﻿/* Panel Styles - move to panel.css */
    .container {/*width: 1000px!important;*/ -moz-box-shadow: none!important; -webkit-box-shadow: none!important; box-shadow: none!important;}
   /* .content {width:1000px!important; height:auto;  background-color:#fff;  margin:0px; padding:0px 0px!important;}*/
    #panelWrap .chat h2 {
    font-size: 1.32em;
    font-weight: 600;
    text-decoration: none;
    color: #474747 /*#c82af5*/;
    background: transparent url(/childsupport/PublishingImages/home/icon-chat.png) 10px 0px no-repeat;
    padding: 0px 0 0 60px;
    margin: 0px!important;
    }
    
    #panelWrap .chat em.SC {
    font-variant: small-caps;
    font-style: normal;
}

#panelWrap .chat {
    float: left;
    width: 295px;
    height: 122px;
    background: transparent;
    margin: 0;
}


#panelWrap .chat h2 span {
    display: block;
    font-size: 0.70em;
    color: #333;
    font-family: "Open Sans", Helvetica, sans-serif;
}

/* end panel styles */



#panelWrap {width:900px; height:auto; background-color:#fff; border-radius: 20px!important; margin: 250px auto 0 auto;padding :20px 10px 20px 20px;border : 1px solid #ccc; box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.5);
 }
style="margin-top:250px;"


#myTabContent.tab-content{}

.nav-link{color:#003366!important; height: 125px; width: 135px;}

.content .right_column ul.nav-tabs li {
	display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(125px, 1fr));
    gap: 30px!important;
    padding: 0 0 0 30px;
    color:#003366!important;
    margin:0;
    
}

.nav-tabs li #parents-tab {background: transparent url(/childsupport/PublishingImages/panel/sprite_p.png) no-repeat center -10px;  color: #003366!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs .nav-item.show #parents-tab.nav-link, .nav-tabs #parents-tab.nav-link.active  {background: #003366 url(/childsupport/PublishingImages/panel/sprite_p.png) no-repeat center -145px!important; color: #fff!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs li #resources-tab {background: transparent url(/childsupport/PublishingImages/panel/sprite_r.png)  no-repeat center -10px;  color: #003366!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs .nav-item.show #resources-tab.nav-link, .nav-tabs #resources-tab.nav-link.active {background: #8952dc url(/childsupport/PublishingImages/panel/sprite_r.png) no-repeat center -145px!important; color: #fff!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs li #employers-tab {background: transparent url(/childsupport/PublishingImages/panel/sprite_e.png)  no-repeat center -10px;  color: #003366!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs .nav-item.show #employers-tab.nav-link, .nav-tabs #employers-tab.nav-link.active {background: #33bdb4 url(/childsupport/PublishingImages/panel/sprite_e.png) no-repeat center -145px!important; color: #fff!important; border-radius: 20px 20px 0 0; border:none!important;}

.nav-tabs li #contact-tab {background: transparent url(/childsupport/PublishingImages/panel/sprite_c.png)  no-repeat center -10px;  color: #003366!important; border-radius: 20px 20px 0 0; border:none!important;padding-top: 95px}

.nav-tabs .nav-item.show #contact-tab.nav-link, .nav-tabs #contact-tab.nav-link.active {background: #c82af5 url(/childsupport/PublishingImages/panel/sprite_c.png) no-repeat center -145px!important;  color: #fff!important; border-radius: 20px 20px 0 0; border:none!important;}

.nav-tabs li #login-tab {background: transparent url(/childsupport/PublishingImages/panel/sprite_l.png)  no-repeat center -10px;  color: #003366!important; border-radius: 20px 20px 0 0; border:none!important; padding-top: 95px }

.nav-tabs .nav-item.show #login-tab.nav-link, .nav-tabs #login-tab.nav-link.active {background: #fc7419 url(/childsupport/PublishingImages/panel/sprite_l.png) no-repeat center -145px!important;  color: #fff!important; border-radius: 20px 20px 0 0; border:none!important;}

.content .right_column ul.nav-tabs {margin:0; border: 0;}

/* hover and focus */
.nav-item .nav-link:hover {background-color: #ebebeb!important; border-radius: 20px 20px 0 0!important; color:#003366!important;}


#parents-tab-pane.tab-pane {}
#resources-tab-pane.tab-pane {}
#employers-tab-pane.tab-pane {}
#contact-tab-pane.tab-pane {}
#login-tab-pane.tab-pane {}


hr.round-p {background-color: #003366; border:none;height: 10px; border-radius: 10px!important; width: 100%; margin:0; opacity: 100; z-index:2;}
hr.round-r {background-color: #8952dc; border:none;height: 10px; border-radius: 10px!important; width: 100%; margin:0; opacity: 100; z-index:2;}
hr.round-e {background-color: #33bdb4; border:none;height: 10px; border-radius: 10px!important; width: 100%; margin:0; opacity: 100; z-index:2;}
hr.round-c {background-color: #c82af5; border:none;height: 10px; border-radius: 10px!important; width: 100%; margin:0; opacity: 100; z-index:2;}
hr.round-l {background-color: #fc7419; border:none;height: 10px; border-radius: 10px!important; width: 100%; margin:0; opacity: 100; z-index:2;}


.right_column ul.panel-l2 {display:grid; list-style-type:none; color:#474747; margin: 0px 0px 0px 5px;}

.panelTop {height:125px;} /* match the grid-template-columns settings for .content .right_column ul.nav-tabs li */

.parents-panel {grid-template-columns: 11% 20% 21% 16% 28%; gap:15px; width:95%; padding: 0 0px 15px 5px!important;}

.resources-panel {grid-template-columns: 55% 30%; gap: 50px; width: 95%; padding: 0 30px 15px 120px!important;}

.employers-panel {grid-template-columns: 35% 33% 30%; gap: 32px; width: 95%; padding: 0 30px 15px 50px!important;}
    
.contact-panel {grid-template-columns: 32% 12% 25% 28%; gap: 35px; width: 95%; padding: 0 10px 15px 10px!important;}  

.log-in-panel {grid-template-columns: 34% 30% 30%; gap: 25px; width: 95%; padding: 0 30px 15px 50px!important;}    
    
.content .right_column ul.panel-l2 li {margin: 0; padding:0;} 
   
.panel-l2 > li > a, .panel-l2 > li > a:visited {display:block; text-decoration:none!important; color:#474747!important; line-height:1.25em!important; padding: 15px 0 5px 0; font-size: 16px; margin-bottom:15px}

.panel-l2 span.panel-subtitle {display:block; font-size:18px; font-weight:500}
.panel-l2 span.panel-minititle {display:block; font-size:16px; font-weight:500; padding: 20px 0 0 0;}
.panel-l2 span.panel-subtext {display:block; font-size:15px; font-weight:300; padding: 2px 0;}

.panel-title {}  
.panel-title:hover  {text-decoration:none!important; cursor:default!important;} /* set cursor for a tags that are not links */
   
    
ul.panel-l3 {list-style-type:none; margin:10px 0 0 0!important; padding:0!important; }

.panel-l3 > li > a, .panel-l3 > li > a:visited {display:block; text-decoration:none; color :#003366!important; font-weight:normal; font-size: 15px; padding:2px 0;  }
.panel-l3 > li > a:hover {color: #000!important; text-decoration:underline; transition: color 0.3s ease /* Apply transition */}

.panel-l3 > li > span.panel-subtitle > a, .panel-l3 > li > span.panel-subtitle > a:visited {display:block; font-size:18px; font-weight:500; text-decoration:none;}

.panel-l3 > li > span.panel-subtitle > a:hover {color: #000!important; text-decoration:underline; transition: color 0.3s ease}

    