﻿.lawcc_section {
    margin: 10px 20px;
    border-radius: 15px;
    padding:10px;
}
.item_subtitle_1 li {
    margin: 4px;
    background-color: #ffdc88;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_1 {
    font-weight: bold;
    background-color: #ffdc88;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_2 li {
    margin: 4px;
    background-color: #ebe56b;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_2 {
    font-weight: bold;
    background-color: #ebe56b;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_3 li {
    margin: 4px;
    background-color: #fabe30;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_3 {
    font-weight: bold;
    background-color: #fabe30;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_4 li {
    margin: 4px;
    background-color: #93ecd7;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_4 {
    font-weight: bold;
    background-color: #93ecd7;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_5 li {
    margin: 4px;
    background-color: #fabe30;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_5 {
    font-weight: bold;
    background-color: #fabe30;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_6 li {
    margin: 4px;
    background-color: #7ff5ff;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_6 {
    font-weight: bold;
    background-color: #7ff5ff;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_7 li {
    margin: 4px;
    background-color: #ead9ff;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_7 {
    font-weight: bold;
    background-color: #ead9ff;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_8 li {
    margin: 4px;
    background-color: #a2e8b5;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_8 {
    font-weight: bold;
    background-color: #a2e8b5;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.item_subtitle_9 li {
    margin: 4px;
    background-color: #ffd29d;
    padding: 5px 0 5px 15px;
    font-size: 19px;
    font-weight:bold;
    color: #5a5a5a;
}
.stitle_9 {
    font-weight: bold;
    background-color: #ffd29d;
    padding: 2px 5px 2px 10px;
    color: #5a5a5a;
}
.stitle {
    font-weight:bold;
}
.item_gp_title {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
    width: auto;
    margin: 0 5px 10px 5px; 
    color:#ffffff;
}
.item_gp {
    font-size: 19px;
    margin-bottom: 10px;
    font-weight: normal;
}
ol > li {
    margin:3px 0 3px 0;
}
.section_title {
    padding: .2em .3em .2em;
    font-size:30px;
    border-radius: .25em;
    width:100%;
    color:#ffffff;
    font-weight:bold;
    text-shadow: 1px 1px #b7b7b7;
    cursor:pointer;
}
.icon {
    width: calc(33% - 1px);
}
.icon_section {
    text-align:center;
}
.icon_section img{
    width: 140px;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 5px;
    cursor:pointer;
}
.icon_desc {
    text-align:center;
    font-size:16px;
    font-weight:bold;
}
.section_item {
    margin-top:10px;
}
.section_1 {
   border: 4px solid #fd9007;
}
.section_title_1 {
    background: rgb(254,140,9);
    /*background: linear-gradient(90deg, rgba(254,140,9,1) 0%, rgba(247,157,0,1) 35%, rgba(255,252,138,1) 100%);*/
}
.section_2 {
   border: 4px solid #d0c71d;
}
.section_title_2 {
    background: rgb(208,199,29);
    /*background: linear-gradient(90deg, rgba(208,199,29,1) 0%, rgba(240,234,120,1) 38%, rgba(240,235,131,1) 100%);*/
}
.section_3 {
      border: 4px solid #1a8eff;
}
.section_title_3 {
    background: rgb(0,129,255);
    /*background: linear-gradient(90deg, rgba(0,129,255,1) 0%, rgba(111,184,255,1) 35%, rgba(223,241,255,1) 100%);*/
}
.section_4 {
    border: 4px solid #05b9ae;
}
.section_title_4 {
    background: rgb(5,185,174);
    /*background: linear-gradient(90deg, rgba(5,185,174,1) 0%, rgba(2,189,152,1) 38%, rgba(226,255,225,1) 100%);*/
}
.section_5 {
    border: 4px solid #bc6107;
}
.section_title_5 {
    background: rgb(185,95,5);
    /*background: linear-gradient(90deg, rgba(185,95,5,1) 0%, rgba(236,140,51,1) 38%, rgba(237,215,173,1) 100%);*/
}
.section_6 {
    border: 4px solid #04e2f7;
}
.section_title_6 {
    background: rgb(2,226,247);
    /*background: linear-gradient(90deg, rgba(2,226,247,1) 0%, rgba(123,245,255,1) 38%, rgba(219,245,255,1) 100%);*/
}
.section_7 {
    border: 4px solid #b61b57;
}
.section_title_7 {
    background: rgb(182,27,87);
   /* background: linear-gradient(90deg, rgba(182,27,87,1) 0%, rgba(162,36,87,1) 38%, rgba(233,219,255,1) 100%);*/
}
.section_8 {
    border: 4px solid #019711;
}
.section_title_8 {
    background: rgb(0,150,15);
    /*background: linear-gradient(90deg, rgba(0,150,15,1) 0%, rgba(21,177,71,1) 38%, rgba(93,226,129,1) 100%);*/
}
.section_9 {
    border: 4px solid #ffd29d;
}
.section_title_9 {
    background: rgb(255,210,157);
    /*background: linear-gradient(90deg, rgba(255,210,157,1) 0%, rgba(255,225,188,1) 38%, rgba(255,242,226,1) 100%);*/
}

#pop_panel {
    position: fixed;  
    padding: 24px;
    margin: 0 auto 0 62px;
    max-width: 900px;
    width:100%;
    border-radius: 5px;
    background-color: #fdffce;
    font-size: 18px;
    font-weight: bold;
    border: 4px solid #dfe640;
    min-height: 250px;
    z-index: 9999;
}
#pop_desc {
    overflow-y:auto;
}
.close_btn {
  position: absolute;
    font-size: 37px;
    right: 5px;
    margin-top: -20px;
    cursor: pointer;
}

.close_btn li {
    background-color: #585757;
    color: #bdbdbd;
    width: 45px;
    text-align: center;
    padding: 3px 3px 4px 4px;
    border-radius: 4px;
}



.item_title {
   font-size: 18px;
    color: #ffffff;
    cursor: pointer;
    background: #0a3a92;
    border-radius: 1.1em;
    padding: 13px 18px 13px 18px;
    text-align: center;
    font-weight: bold;
}


@media only screen and (max-width: 650px) {

    .section_title {
        font-size:20px;
    }

    .lawcc_section ul li {
        padding: 1px 0 1px 5px;
        font-size: 16px;
    }
    .item_gp {
        font-size:16px;
    }
    .icon_section img {
        width: 100px;
    }
    #pop_panel {
        margin: auto;
        max-width: none;
        width: calc(100% - 30px)!important;
        margin-left: -20px;
        padding: 5px;
    }
    .close_btn {
        font-size: 30px;
        margin-top: -30px;
        right: -15px;
    }
    .close_btn li {
        width:36px;
        border-radius: 100%;
    }
    .item_gp_title {
        font-size:20px;
    }
    .item_title {
        font-size:16px;
    }
}