.names-grid {
  text-align: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.name-item {
  flex: 0 0 20%;
  position: relative;
  padding-bottom: 15px;
  padding-top: 40px;
  margin-right: 20px;
  margin-left: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 4px solid transparent;
  transition: border-color 0.3s, border-width 0.3s;

}

.name-item::after {
  position: absolute;
  bottom: 0;
  left: 25%;
  width: 50%;
  height: 2px;
  background-color: currentColor;
  transition: height 0.3s;
}

.name-item:hover {
  border-width: 7px;
}

.name-item:hover::after {
  height: 4px;
  border-color: currentColor;
  border-width: 5px;

}

.name-item a {
  width: 80%;
}

.last-row-item {
  margin: 0 auto;
}

.modal {
  display: none;
  position: fixed;
  z-index: 999999999;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.4);
}

.modal-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 90%;
}
.close {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

body {
  font-family: Arial, Helvetica, sans-serif;
}

.occupational_header {
  display: flex;
  max-width: 100%;
  flex-direction: row;
  margin: 0 auto;
  border-radius: 5px;
  background: linear-gradient(270deg, #E03794 21.1%, #9747FF 100.11%);
}

.occupational_header .title h3 {
  color: #FFFFFF;
  font-family: Nunito Sans;
  font-style: normal;
  font-weight: 900;
  line-height: 34px;
  letter-spacing: 0.15px;
  margin-top:10px;
  margin-bottom:10px;
}

.occupational_header .title {
  width: 50%;
  padding-left: 85px;
  padding-top: 16px;
  padding-bottom: 16px;
}

.occupational_header .image {
  width: 50%;
  text-align: right;
  padding-left: 0px;
  padding-right: 85px;
}

.custom_accordion {
  max-width: 100%;
}

.custom_accordion .acontainer {
  position: relative;
  border-radius: 10px;
  margin-bottom: 15px;
  background: #FFFFFF;
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
}

.custom_accordion .label {
  position: relative;
  padding: 15px;
  color: #005CAB;
  font-family: Nunito Sans;
  font-size: 20px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
}

.custom_accordion .label::before {

  color: black;
  position: absolute;
  top: 50%;
  right: 15px;
  font-size: 30px;
  transform: translateY(-50%);
  content: "\f107";
  font-family: "FontAwesome";
  font-size: 18px;
}

.custom_accordion .content {
  position: relative;
  background: white;
  height: 0;
  font-family: Nunito Sans;
  font-size: 20px;
  text-align: justify;
  width: 100%;
  overflow: hidden;
  transition: none;
}

.custom_accordion hr {
  width: 100;
  margin-left: 0;
  border: 1px solid grey;
}

.custom_accordion .acontainer.active .content {
  height: auto;
  border-radius:10px;
}

.custom_accordion .acontainer.active .label::before {
  content: '\f106';
  font-size: 18px;
}

.custom_accordion-body p {
  color: rgba(0, 0, 0, 0.87);
  font-family: Nunito Sans;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  padding-left: 15px;
  padding-right: 15px;
}

.accord_content {
  display: flex;
  flex-wrap: wrap;
  gap: 0 30px;
  padding-left: 10px;
  padding-bottom: 60px;
}

.accord_content .title {
  display: flex;
  font-family: Nunito Sans;
  flex: 0 0 100%;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
  color: #000;

}

.box {
  display: flex;
  /* flex: 0 0 25%; */
  flex: 0 0 31%;
  border-bottom: 4px solid #7C3694;
  background: #FFFFFF;
  flex-wrap: wrap;
  padding: 16px;
}

.iconcontainer1,
.iconcontainer2 {
  display: flex;
  width: 100%
}

.level {
  color: #000;
  font-family: Nunito Sans;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 20px;
  padding-left: 8px;
  padding-right: 8px;
}

.iconcontainer1 .iconbox1 {
  flex: 0 0 80%;
  display: inline-flex;
  align-items: center;
}

.iconcontainer2 .iconbox1 {
  flex: 0 0 50%;
  display: inline-flex;
  align-items: center;
}

.iconcontainer2 .iconbox2 {
  flex: 0 0 50%;
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
}

.iconcontainer1 .iconbox2 {
  display: flex;
  flex: 0 0 20%;
  justify-content: flex-end;
  align-items: center;
}

.tooltip.show {
  opacity: 1;
  max-width:270px;
}
.tooltip.show .tooltip-inner {text-align:left;max-width:270px;padding-top:10px;padding-bottom:10px;}
.bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow,
.bs-tooltip-top .tooltip-arrow {
  display: none;
}

.tooltip-inner ,.tooltip-inner a,.tooltip-inner a:hover,.tooltip-inner a:active,.tooltip-inner a:focus{
  border-radius: 4px;
  background: #666;
  opacity: 1;
	color: #FFF;
	font-family: Nunito Sans;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 14px;
}
.tooltip-inner a,.tooltip-inner a:hover,.tooltip-inner a:active,.tooltip-inner a:focus{line-height:45px;}

.iconuse .dropdown-toggle::after {
  display: none
}

.iconuse .dropboth {
  text-align: right;
}

.iconuse a#dropdownMenuLink {
  text-decoration: none;
  color: #005CAB;
  font-family: Nunito Sans;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.iconuse .dropdown-menu {
  position: absolute !important;
  inset: 0px 0px auto auto !important;
  margin: 0px !important;
  transform: translate3d(0px, 23.2px, 0px) !important;
  border: none;
  background: rgb(255, 255, 255);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.15);
  margin-top: 5px !important;
}

.iconuse .dropdown-item:active {
  background-color: #e9ecef;
}

.iconuse .dropdown-item {
  color: #334AFF;
  font-family: Nunito Sans;
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
}

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

.occu_btns {
  display: flex;
  flex-direction: row-reverse;
  column-gap: 16px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.occu_btns .btn1 {
  border-radius: 4px;
  border: 1px solid #000;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  padding-left: 16px;
  padding-right: 16px;
  margin-bottom: 18px;
	letter-spacing: 0.4px;
    width: 272px;
    height: 36px;
}

.occu_btns .btn2 {
  color: #FFFFFF;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
  background: #1976D2;
  padding-left: 10px;
  padding-right: 10px;
  margin-bottom: 18px;
letter-spacing: 0.4px;
width: 238px;
height: 36px;

}

.occu_btns .btn2 img {
	width: 16px;
	vertical-align: sub;
	margin-left: 8px;
}
.occu_btns .btn2 i {
  padding-left: 8px;
}

.popbottom {
  display: flex;
  flex-direction: row;
  border-radius: 8px;
  border-top: 4px solid #AB47BC;
  flex-wrap: wrap;
}

.popbottom .boxleft,
.popbottom .boxright {
  width: 50%;
  padding: 16px;
}

.popbottom .boxleft dd,
.popbottom .boxleft dt,
.techproduct dd,
.techproduct dt {
  display: inline-block;
}

.techproduct dt {
  width: 5%;
  vertical-align: top;
}

.techproduct dd {
  width: 95%;
}

.popbottom .boxleft dl,
.techproduct dl {
  margin-bottom: 0px;
}

.popbottom .boxleft dd,
.techproduct dd {
  padding-left: 10px;
}

.popbottom .boxleft .ref dt,
.popbottom .boxleft .status dt,
.popbottom .boxleft .salary dt,
.popbottom .boxright ul li.title {
  color: rgba(0, 0, 0, 0.87);
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 20px;
}

.popbottom .boxleft .salary dt {
  /* color: #334AFF !important; */
}

.popbottom .boxleft .status span {
  /* color: #334AFF; */
}

.popbottom .boxright ul {
  list-style: none;
}

.popbottom .listitems {
  color: rgba(0, 0, 0, 0.87);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 24px;
}

.leveltext {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.leveltext a,.leveltext a:hover {
  color: rgba(0, 0, 0, 0.87) !important;
  font-family: Nunito Sans;
  font-size: 14px;
  font-style: normal;
  font-weight: 300;
  line-height: 20px;
  text-decoration: none;
}
.occudiv a,.leveltext a{cursor: text;}
.h1title {
  margin-bottom: 18px;
  color: var(--light-text-primary, rgba(0, 0, 0, 0.87));
  font-family: Nunito Sans;
  font-size: 32px;
  font-style: normal;
  font-weight: 900;
  line-height: normal;
}

.h3title {
  color: var(--light-text-primary, rgba(0, 0, 0, 0.87));
  font-family: Nunito Sans;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.15px;
}

.popuppara {
  color: var(--light-text-primary, rgba(0, 0, 0, 0.87));
  font-family: Nunito Sans;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.popup-flex-list {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  margin-bottom: 24px;
}

.popup-flex-list ul {
  list-style: none;
  margin-left: 0px;
  padding-left: 0px;
}

.popup-flex-list li {
  display: inline;
  color: var(--light-text-primary, rgba(0, 0, 0, 0.87));
  font-family: Nunito Sans;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.h3linktype {
  color: rgba(0, 0, 0, 0.87);
  font-family: Nunito Sans;
  font-size: 22px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  letter-spacing: 0.15px;
}

.techproduct {
  margin-bottom: 24px;
}

.techproduct .info1 {
  color: var(--link, #334AFF);
  font-family: Nunito Sans;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
}

@media screen and (max-width: 480px) {
	.tooltip-inner ,.tooltip-inner a,.tooltip-inner a:hover,.tooltip-inner a:active,.tooltip-inner a:focus{
		font-size: 12px !important;
	}
}
@media screen and (max-width: 576px) {
  .techproduct dt {
    width: 8%;
  }

  .techproduct dd {
    width: 90%;
  }

  .popbottom .boxleft,
  .popbottom .boxright {
    width: 100%;
  }
  .custom_accordion .label{padding-right:33px;}
  .occupational_header .title {padding-left:15px;}
  .occupational_header .image {padding-right:15px;}
  /* #occTab button{width: 96px !important;} */
  .accordian_container{padding-left: 15px; padding-right: 15px;}
  #occTab .nav-link,#occTab .nav-link:active{padding-left:5px;padding-right:5px;}
}
@media screen and (min-width: 768px) {
	#occupation-modal .modal-dialog{width:100%;max-width:100%;}
}
@media screen and (max-width: 768px) {
  .occu_btns{flex-direction: column-reverse;}
  .occu_btns .btn1,
  .occu_btns .btn2 {
    width: 100%;
  }
  .custom_accordion .box{
	flex: 0 0 98%;
  }
  #occupation-modal .modal-dialog{width:90%;max-width:90%;margin:0 auto !important;}
  #occupation-modal .modal-content{width:100%;max-width:100%;}
  .occupational_header_main .title h3{font-size:16px !important;}
  .occupational_header .image img, .occupational_header_main .image img{width: 100px !important;}
  .occupational_header .image, .occupational_header_main .image {width: 30% !important;}
  .occupational_header .title, .occupational_header_main .title {width: 70% !important;}
  #occupation-details-content .leveltext .leveldiv, #occupation-details-content .leveltext .occudiv{width: 100% !important;}
}
@media only screen and (max-width: 768px) and (min-width: 576px){
	  /* #occTab button{width: 157px !important;} */
  .accordian_container{margin-left:65px !important;margin-right:65px !important;padding-left:0px !important;padding-right:0px !important;}
  .occupational_header .title{padding-left:65px;}
  .occupational_header .image{padding-right:65px;}
}
@media only screen and (max-width: 1200px) and (min-width: 992px){
  .occupational_content_main .box_main {
	flex: 0 0 31%;
  }
  /* #occTab button{width:286px !important;} */
}
@media only screen and (max-width: 992px) and (min-width: 769px){
  .custom_accordion .box{
	flex: 0 0 45%;
  }
  /* #occTab button{width: 210px !important;} */
  .occupational_content_main .box_main {
	flex: 0 0 30%;
  }
  .accordian_container{margin-left:39px !important;margin-right:39px !important;padding-left:0px !important;padding-right:0px !important;}
  .occupational_header .title{padding-left:39px;}
  .occupational_header .image{padding-right:39px;}
}
@media only screen and (max-width: 1024px) and (min-width: 768px){
	/* #occTab button{width:200px !important;} */
}
.occupational_header_main {
	display: flex;
	max-width: 100%;
	flex-direction: row;
	margin: 0 auto;
	border-radius: 5px;
	background: #D42183;
}
.occupational_header_main .title h3,.occupational_header_main .title h2{
	color:#FFFFFF;
	font-family: Nunito Sans;
	font-size: 20px;
	font-style: normal;
	font-weight: 900;
	line-height: 24px;
	letter-spacing: 0.15px;
	margin-bottom:0px;
}
.occupational_header_main .title{
	width: 50%;
	padding-left:15px;
	padding-top:5px;
	padding-bottom:5px;
}
.occupational_header_main .image{
	width: 50%; 
	text-align:right;
	padding-left:0px;
	padding-right:15px;
	padding-top:5px;
	padding-bottom:5px;
}
.occupational_content_main {
    justify-content: center;
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap:0 30px;
}
/* .box_main {
  display: flex;
  flex: 0 0 31%;
  border-bottom: 4px solid #7C3694;
  background: #FFFFFF;
  flex-wrap: wrap;
  padding: 16px;
} */
.box_main{
    display: flex;
    width: 300px;
    height: 76px;
    padding: 16px 8px;
    justify-content: center;
    text-align: center;
    align-items: center;
    border-bottom: 4px solid #7C3694;
    background: #FFFFFF;
}
.box_main:hover{
	border-bottom-width:8px !important;
}
.box_main:hover span{
	font-size: 16px !important;
	font-weight: 700 !important;
}
@media only screen and (max-width: 1200px) {
	.occupational_header .title h3 {font-size: 24px;}
}
@media only screen and (min-width: 1200px) {
	.occupational_content_main .box_main {
		flex:0 0 22.9%;
	}
	.occupational_header .title h3 {font-size: 32px;}
}
@media only screen and (min-width: 1024px) {
	.occupational_container_main{
		max-width: 1140px;
		margin: 0 auto;
		padding-left: 15px;
		padding-right: 15px;
	}
}
@media only screen and (max-width: 1024px) {
	.occupational_container_main{
		padding-left: 2rem;
		padding-right: 2rem;
	}
}
.occupational_container_main p{
	color: rgba(0, 0, 0, 0.87);
	font-size: 14px;
	font-family: Nunito Sans;
	font-weight: 300;
	letter-spacing: 0.17px;
}
.occupational_container_main span{
	color: rgba(0, 0, 0, 0.87);
	font-size: 16px;
	font-family: Nunito Sans;
	font-style: normal;
	font-weight: 300;
	line-height: normal;
}
.accordian_container{max-width:1280px;margin:0 auto;}
#occupation-modal .modal-header{    
padding-top: 10px;
border-bottom: 0px;
padding-left: 0px;
}

.occupation_container{
	background: var(--grey-100, #F5F5F5);
}
.dropboth .menulinks li a{
	color: var(--Light-Text-Primary, rgba(0, 0, 0, 0.87));
	text-overflow: ellipsis;
	font-family: Nunito Sans;
	font-size: 16px;
	font-style: normal;
	font-weight: 300;
	line-height: normal;
}
.dropboth .menulinks li img{
	margin-right: 8px;
}

#occTab{
	border: none;
	border-color: #FFFFFF;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
	width:100%;
}
#occTab button{
	/* width: 350px; */
	border-color: #FFFFFF;
}
#occTab .nav-item{
	margin-top:5px;
	width: 33.33%;
}
#occTab .nav-link{
	color: #005CAB;
	font-family: Nunito Sans;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: 0.17px;
	border-radius:0px;
	border-top:0px;
	border-left:0px;
	border-right:0px;
	text-transform: capitalize;
	width: 100%;
	padding-left:5px;
	padding-right:5px;
}
#occTab .nav-link.active{
	color: rgba(0, 0, 0, 0.87);
	border-radius: 0px !important;
	font-family: Nunito Sans;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: 0.17px;
	border-top: none !important;
	border-left:none !important;
	border-right: none !important;
	border-bottom: 2px solid rgba(0, 0, 0, 0.87) !important;
}
#occTab .nav-item .nav-link:focus {
    /* border-color: rgba(0,0,0,0); */
	border-radius:0px;
	border-top:0px;
	border-left:0px;
	border-right:0px;
}
#occTab .nav-item .nav-link:hover {
    background-color: #FFF;
    /* border-color: rgba(0,0,0,0); */
	border-radius:0px;
	border-top:0px;
	border-left:0px;
	border-right:0px;
}
#occTab .nav-link:focus-visible{box-shadow:none;}
.kinfo{
	margin-top:8px;
	margin-bottom:24px;
	width:100%;
	float: left;
}
.kinfo h6{
	color: var(--Light-Text-Primary, rgba(0, 0, 0, 0.87));
	font-family: Nunito Sans;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	letter-spacing: 0.15px;
	display:inline;
}
.kinfo p{
	color: rgba(0, 0, 0, 0.87);
	font-family: Nunito Sans;
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: 0.15px;
	margin-bottom: 0px;
	display:inline;
}
.tooltip-inner .toolimg{vertical-align:sup !important;}
.tooltip-inner a{text-decoration:underline !important;}
.custom_accordion-body:last-child{
	padding-bottom:30px;
}
.loadingpop-svg {
	width: 24px;
	height: 24px;
	animation: spin 1s linear infinite;
	display:inline-block;
}