.section-services {
     font-family: "Poppins", sans-serif;
     color: #202020;
     padding-top: 80px;
     padding-bottom: 80px;
 }
 
 .section-services .header-section {
     margin-bottom: 34px;
     text-align: center;
 }
 
 .section-services .header-section .title {
     position: relative;
     padding-bottom: 14px;
     margin-bottom: 25px;
     font-weight: 500;
     font-size: 32px;
 }
 
 .section-services .header-section .title:before {
     content: "";
     position: absolute;
     bottom: 0;
     left: 50%;
     transform: translateX(-50%);
     width: 50px;
     height: 3px;
     background-color: #ff4500;
     border-radius: 3px;
 }
 
 .section-services .header-section .title:after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 50%;
     transform: translateX(30px);
     width: 10px;
     height: 3px;
     background-color: #504f93;
     border-radius: 3px;
 }
 
 .section-services .header-section .description {
     font-size: 14px;
     color: #282828;
 }
 
 .section-services .single-service {
     position: relative;
     margin-top: 30px;
     background-color: #f8f8f8;
     border-radius: 10px;
     padding: 40px 30px;
     overflow: hidden;
     height: 325px;
 }
 
 .section-services .single-service .content {
     position: relative;
     z-index: 20;
 }
 
 .section-services .single-service .circle-before {
     position: absolute;
     top: 0;
     right: 0px;
     transform: translate(40%, -40%);
     width: 150px;
     height: 150px;
     background-color: #ff4500;
     border: 6px solid #504f93;
     border-radius: 50%;
     opacity: 0.5;
     z-index: 10;
     transition: all .6s;
 }
 
 .section-services .single-service:hover .circle-before {
     width: 100%;
     height: 100%;
     transform: none;
     border: 0;
     border-radius: 0;
     opacity: 1;
 }
 
 .section-services .single-service .icon {
     display: inline-block;
     margin-bottom: 26px;
     width: 70px;
     height: 70px;
     background-color: #ff4500;
     border-radius: 5px;
     line-height: 70px;
     text-align: center;
     color: #fff;
     font-size: 30px;
     transition: all .3s;
 }
 
 .section-services .single-service:hover .icon {
     background-color: #fff;
     color: #ff4500;
 }
 
 .section-services .single-service .title {
     margin-bottom: 18px;
     font-weight: 700;
     font-size: 23px;
     transition: color .3s;
 }
 
 .section-services .single-service:hover .title {
     color: #fff;
 }
 
 .section-services .single-service .description {
     margin-bottom: 20px;
     font-size: 14px;
     transition: color .3s;
 }
 
 .section-services .single-service:hover .description {
     color: #fff;
 }
 
 .section-services .single-service a {
     position: relative;
     font-size: 13px;
     color: #202020;
     text-decoration: none !important;
     transition: color .3s;
 }
 
 .section-services .single-service:hover a {
     color: #fff;
 }
 
 .section-services .single-service a:after {
     content: "";
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     height: 1px;
     /* background-color: #ff4500; */
     transition: background-color .3s;
 }
 
 .section-services .single-service:hover a:after {
     background-color: #fff;
 }