/* Main Contaiers */
#aboutModal {}
#aboutModalDiv {
     font-family: Arial;
     width: 620px;
     padding: 0;
     /* overflow: hidden; */
}

#aboutModalTitle { margin: 10px; }

.about_modal_scroll_helper {
     background-color: #F7F8F9;
     width: 100%;
     max-width: 100%;
     padding-top: 1px;
     max-height: calc(100vh * 0.65);
     overflow: auto;
     box-shadow: 0 -2px 2px -2px rgba(0,0,0,.3);
     border-radius: 0 0 10px 10px;
}

/* List Container */
.about_modal_list {
     background: white;
     border-radius: 6px;
     box-shadow: 0px 2px 10px 0px rgba(0,0,0,0.63);
     margin: 10px;
     overflow: hidden;
}

#about_modal_build_number {
     color: #70768a;
     font-size: 15px;
     /* color: #5c5e61db; */
}

/* List Item And Group Contaiers */
.about_modal_list_group_container {
     position: relative;
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
}
.about_modal_list_item {
     display: flex;
     height: 45px;
}
.about_modal_list_item:not(:last-child) { border-bottom: 1px solid #F0F0F0; }

/* List Item Components */
.about_modal_list_item_left_container {
     width: 450px;
     display: flex;
     flex-direction: column;
     align-items: flex-start;
     justify-content: center;
     overflow: hidden;
}
.about_modal_list_item_title_container {
     position: relative;
}
.about_modal_list_item_title_container .about_modal_list_item_icon {
     position: absolute;
     left: 20px;
     top: 6px;
     /* color: #70768a */
}
.about_modal_list_item_title {
     /* background: lightblue; */
     margin: 0px;
     height: 100%;
     text-align: left;
     font-size: 16px;
     font-family: Roboto;
     font-weight: 500;
     display: flex;
     align-items: center;
     text-indent: 54px;
}
.about_modal_list_item_description {
     /* background: lightcoral; */
     margin: 0px;
     height: 40%;
     text-align: left;
     font-size: 12px;
     text-indent: 54px;
     padding-top: 1px;
     color: #70768a;
}

.about_modal_list_item_action_container {
     width: 150px;
     display: flex;
     justify-content: flex-end;
     align-items: center;
}
.about_modal_list_item_action_container * { /* All Children*/
     margin-right: 8px;
     cursor: pointer;
}

/* List Item Action Components*/
.about_modal_list_item_button {
     padding: 8px 16px;
     /* border: 1px solid rgb(218, 220, 224); */
     border-radius: 4px;
     font-weight: 500;
     height: 32px;
     text-decoration: none;
     text-transform: none;
     font-family: Roboto, Arial;
     font-size: 81.25%;
     /* color: #1a73e8; */
     /* background-color: #fff; */
     letter-spacing: 0.6px;
}
/* .about_modal_list_item_button:hover { background-color: #ecf1f7 !important; } */
.about_modal_list_item_action_icon::before {
     content: " ";
     width: 100%;
     height: 100%;
     border-radius: 50%;
     position: absolute;
     z-index: -1;
     transition: transform 400ms linear, background-color 200ms ease-out;
}
.about_modal_list_item_action_icon {
     max-width: 24px;
}
.about_modal_list_item_action_icon:hover::before {
     transform: scale(1.3);
     background-color: #dedede;
}

.version_info {
     height: 45px;
     width: 150px; /* width: 124px; */
     text-align: center;
     position: relative;
     display: flex;
     justify-content: space-evenly;
     align-items: center;
     margin: 0px;
     border-radius: 4px 0 0 4px;
}

/* List Group Componets */
.about_modal_list_group_title {
     /* background: lavender; */
     width: 100%;
     height: 50px;
     display: flex;
     justify-content: flex-start;
     align-items: center;
     font-size: 27px;
     text-indent: 20px;
     font-weight: 600;
     padding-top: 10px;
}
.about_modal_list_group_title:after {
     content: "";
     display: block;
     position: absolute;
     top: 53px;
     left: 12px;
     right: 12px;
     border-bottom: 1px solid #c3c1c1;
}
#about_modal_version_group_title:after { display: none; }

.whole_item_is_action { cursor: pointer; }

.about_modal_bottom_links_container {
     height: 15px;
     margin-bottom: 10px;
     width: 100%;
     display: flex;
     justify-content: center;
     align-items: center;
}
.about_modal_bottom_link {
     color: #383636;
     font-family: Arial;
     font-size: 12px;
     transition: 200ms all ease-in-out;
     text-decoration: none;
}
.about_modal_bottom_link:hover { color: #949494; }
.about_modal_bottom_link:not(:first-child)::before {
     content: '\2022';
     padding-right: 5px;
     color: black;
     font-size: 14px;
     margin: 10px;
}