.media-icon{
    width:auto;
    height:4rem;
}

/*css for circular label text */

.image-container{
    margin-top:-18%;
    margin-left: -18%;
}

.image-container1{
    width:350px;
    height:auto;
}

.chart{
    background-image: url('/img/digital-icons/3/TIMESHEET.png');
    background-size: cover;
    z-index:100;
    position:absolute;
    top: 6.4vw;
    left: 6.4vw;
    width: 265px;
    height: 265px;
}

.arrow-chart {
    
    width: 455px;
    height: 455px;
    position: relative;
    text-align: center;
    border-radius: 100%;
    overflow: hidden;
    clip-path: circle(50% at 50% 50%);
  /*   -ms-transform: scale(0.35, 0.35);
    -webkit-transform: scale(0.35, 0.35);
    transform: scale(0.35, 0.35); */
  }
  .arrow-chart:after {
    content: "";
    display: block;
    width: 50%;
    height: 50%;
    z-index: 10;
    position: absolute;
    border-radius: 100%;
    top: 25%;
    left: 25%;
  /*   opacity: .8; */
  /*   display: none; */
  }
  
  .arrow-chart section {
    height: 48%;
    width: 55%;
    position: absolute;
    text-align: center;
    color: black;
    
    
    display: flex;
    align-items: center;
    justify-content: center;
    -webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
    clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
  }
  
  
  .arrow-chart section label {
    font-size: .65rem;
    font-weight: bold;
    position: relative;
    width: 55%;
    padding: 0 5%;
    margin: 30% 0 0 0;
    display: block;
    color: black;
  }

  .list{
      font-size:0.2rem;
      font-weight:normal;
      text-align: left;
      line-height: 2px;
      padding-right:2rem;
  }

  .list1{
    font-size:0.2rem;
    font-weight:normal;
    text-align: right;
    line-height: 2px;
    padding-right:2rem;
  }

  .list-item{
      line-height: 0.5rem;
  }
  
  .arrow-chart section:nth-child(7) {
      transform: rotate(0);
      margin-top:-15%;
      margin-left:24%;
  }

  .arrow-chart section:nth-child(8) {
    transform: rotate(0);
    margin-top:53%;
    margin-left:24%;
}
  
  .arrow-chart section:nth-child(1) {
    transform: rotate(0);
    margin-left: 50%;
    margin-top: -5%
  }
  .arrow-chart section:nth-child(1) label {
    transform: rotate(0);
  }
  .arrow-chart section:nth-child(2) {
  /*   display: none; */
    transform: rotate(60deg);
    margin-left: 72%;
    margin-top: 26%;
  }
  .arrow-chart section:nth-child(2) label {
    transform: rotate(-60deg);
  }
  .arrow-chart section:nth-child(3) {
  /*   display: none; */
    transform: rotate(120deg);
    margin-left: 59%;
    margin-top:57%;
  }
  .arrow-chart section:nth-child(3) label {
    transform: rotate(-120deg);
  }
  .arrow-chart section:nth-child(4) {
  /*   display:none; */
    transform: rotate(180deg);
    margin-left: -8%;
    margin-top: 57%;
  }
  .arrow-chart section:nth-child(4) label {
    transform: rotate(-180deg);
  }
  .arrow-chart section:nth-child(5) {
  /*   display:none; */
    transform: rotate(240deg);
    margin-left: -24.5%;
    margin-top: 33%;
  }
  .arrow-chart section:nth-child(5) label {
    transform: rotate(-240deg);
  }
  .arrow-chart section:nth-child(6) {
  /*   display:none; */
    transform: rotate(300deg);
    margin-left: -19%;
    margin-top: -2%;
  }
  .arrow-chart section:nth-child(6) label {
    transform: rotate(-300deg);
  }
  
  
  

.icon-text img{
    max-width:65%;
}

.icon-text2 img{
    max-width:65%;
}

.img-erp{
    max-width:260px;
    height:auto;
}

.dcn{
    border:none;
}

.bnn-top{
    float:right;
}

.brc {
    margin: 63px auto;
    display: block;
    text-align: right;
}

.bros {
    text-align: center;
    display: block;
    margin: 32px auto;
}

.bros select 
{
     padding: 8px 16px; 
    border:1px solid black;
    background-color:transparent;
     border-radius: 8px; 
    width: 250px;
    
}
.bros select:focus 
{
   border:1px solid black;
    border-radius: 8px; 
   outline:none!important;
}

button:focus {
  
    outline: none;
}

.dwn {
    margin: 28px auto;
    display: block!important;
}

.btn-solid-reg {
    display: inline-block;
    padding: 19px 27px 18px;
    border: 0.125rem solid #1e4169;
    border-radius: 2rem;
    background-color: #1e4169;
    color: #fff;
    font: 700 0.75rem/0 "Raleway", sans-serif;
    text-decoration: none;
    transition: all 0.2s;
    font-size: 16px;
}

.btn-solid-reg i 

{
    margin-top:-8px;
}

.vcn {
    background-color: #cccccc5c;
    margin: 65px 0px 30px 0px;
}



.digital-header {
    background: url(../../img/franchise/digital.jpg) center center no-repeat;
background-size: cover;
height: 78%;
background-position: center;
}

.digital-header .digital-header-content {
    padding-top: 13.5rem;
    text-align: left;
    padding-bottom: 20.5rem;
}

.digital-header .text-container {
    margin-top: 0;
    margin-bottom: 0;
}


.cc  {
    max-width: 100%!important;
    padding: 10px 100px 10px 100px;
}
.ch 
    {
        max-width: 100%!important;
        padding: 10px 73px 10px 73px;
    }

    .header {
        background-color: #fff;
    }
    
    .header .header-content {
        padding-top: 8rem;
        padding-bottom: 4rem;
        text-align: center;
    }
    
   
    .header h1 {
        margin-bottom: 1.125rem;
        font-size: 2.5rem;
        line-height: 3.125rem;
    }
    
    .header .p-large {
        margin-bottom: 1.875rem;
    }
    .text-container .pars
    {
        font-size: 44px;
        line-height: 3.5rem;
        font: 700 3rem/3.5rem "Raleway", sans-serif;
    }
    
    h2 {
        color: #393939;
        font: 700 2.25rem/2.75rem "Raleway", sans-serif;
    }
.tew 
{
	list-style-type: none;
    line-height: 31px;
    font-size: 17px;
    margin: 30px 0px 0px -35px;
}
.tew li:nth-child(even)
{
	background-color: #cccccc7a;
    padding: 5px 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    border-left: 2px solid #322a2a;
}
.tew li:nth-child(odd)
{
	background-color: #ffd76e;
	padding: 5px 10px;
    border-radius: 5px;
    margin-bottom: 10px;
    border-left: 2px solid #322a2a;
}
.parp {
	line-height: 24px;
    margin: 20px 0px;
    font-size: 17px;
}
/* list */

#list{ 
	/* color: green; 
	background: white; 
	font-size: 30px;  */
	margin-left: -16px;
} 

#list li{ 
    list-style: none;
    text-indent: -24px;
    font-size: 15px;
    margin-bottom: 15px;
    text-align: justify;
} 


#list li::before{ 


	content: "\00BB"; 
	margin-right: 14px;
} 
.dif {
    background-color: #cccccc2b;
    padding: 40px 30px;
}
/* list-end */

 .header h1 {
        font-size: 44px;
        line-height: 3.5rem;
    }
   
.tur {
        margin-top: 30px;
        background-color: #f2f2f2;
        width: fit-content;
        padding: 68px 40px;
    }

    @media only screen and (max-width:1440px){
        .img-erp{
            max-width:100%!important;
            height:auto;
        }
    }

    @media only screen and (min-width:1024px){
        .icon-text{
            max-width:14%;
        }

        .icon-text2{
            max-width:12%;
        }
        
    }
    

    @media only screen and (max-width:768px)
    {
        .img-erp{
            max-width:100%!important;
            height:auto;
        }
        .digital-header .digital-header-content {
            padding-top: 60px;
            text-align: left;
            padding-bottom: 40px;
        }
        .header h1 {
            margin-bottom: 1.125rem;
            font-size: 18px;
            line-height: 2.125rem;
            margin-left: 193px;
            margin-top: -73px;
        }
        .turquoise {
            color: #292B2C;
            font-size: 26px;
        }
        .tur {
            margin-top: 30px;
            background-color: #f2f2f2;
            width: 143px;
            padding: 18px 12px;
            font-size: 16px;
            line-height: 20px;
        }
        .text-container .pars 
        {
            font-size: 15px;
            line-height: 3.5rem;
            font: inherit;
        }
        .cc {
            max-width: 100%!important;
            padding: 10px 0px 10px 0px;
        }
        .ch {
            max-width: 100%!important;
            padding: 10px 0px 10px 0px;
        }
        .lis {
            list-style-type: none;
            margin-bottom: 0px;
            margin-left: -51px;
            color: #1e4169;
            font-size: 12px;
        }

        .bnn-top{
            float: none !important;
        }

        .bnn-bottom{
            margin-top:5%;
        }
        
        
    }

  

    @media screen and (min-width:768px) and (max-width:1024px)and (orientation : landscape)
{
    .lis {
        list-style-type: none;
        margin-bottom: 0px;
        margin-left: -35px;
        color: #1e4169;
        margin-right: 0%;
    }
 
    
    .tur {
        margin-top: -45px;
        background-color: #f2f2f2;
        width: 284px;
        padding: 35px 12px;
        margin-left: 36px;
    }
    .text-container .pars {
        font-size: 31px;
        line-height: 3.5rem;
        font: inherit;
    }
    .header h1 {
        margin-bottom: 1.125rem;
        font-size: 18px;
        line-height: 2.125rem;
        margin-left: 115px;
        margin-top: 0px;
    }
    .disabled-link 
	{
		pointer-events: none;
		cursor: default;
		text-decoration: none;
		color: black;
    }
    
    
    
}
@media screen and (min-width:768px) and (max-width:1024px)and (orientation : portrait)
{
    .lis {
        list-style-type: none;
        margin-bottom: 0px;
        margin-left: -35px;
        color: #1e4169;
        margin-right:57%;
    }
    .navbar-custom {
      
        box-shadow: none;
        background: #fff;
		
    }
    .digital-header .digital-header-content {
        padding-top: 12.5rem;
        text-align: left;
        padding-bottom: 11.5rem;
    }
    
   
    .tur {
        margin-top: 10px;
        background-color: #f2f2f2;
        width: 258px;
        padding: 35px 12px;
        text-align: center;
        font-size: 23px;
        margin-left: 0px;
    
    }
    .header h1 {
        margin-bottom: 1.125rem;
        font-size: 31px;
        line-height: 2.125rem;
        margin-left: 133px;
        margin-top: 32px;
    }
    .disabled-link 
	{
		pointer-events: none;
		cursor: default;
		text-decoration: none;
		color: black;
	}
}
@media screen and (min-width:1024px) and (max-width:1366px)
{
    .lis {
        list-style-type: none;
        margin-bottom: 0px;
        margin-left: -35px;
        color: #1e4169;
        margin-right: 0%;
    }
    
    .turquoise {
        color: #292B2C;
        font: 700 2rem/3.5rem "Raleway", sans-serif;
    }
  
}

@media screen and (min-width:2060px)
{
    .chart{
        top:3.6vw;
        left:3.6vw;
    }

    .image-container{
        margin-left:7%;
    }
}

@media screen and (min-width:1890px) and (max-width:2060px)
{
    .chart{
        top:4.2vw;
        left:4.2vw;
    }

    .image-container{
        margin-left:4%;
    }
}


@media screen and (min-width:992px) and (max-width:1330px)
{
    .chart{
        top:7.6vw;
        left:7.6vw;
        width:235px;
        height:235px;
    }

    .image-container{
        margin-left:-60%;
    }

    .arrow-chart{
        width:400px;
        height:400px;
    }
}


@media screen and (min-width:769px) and (max-width:991px)
{
    .chart{
        top:10vw;
        left:10vw;
        width:235px;
        height:235px;
    }

    .image-container{
        margin-left:5%;
    }

    .arrow-chart{
        width:400px;
        height:400px;
    }
}

@media screen and (min-width:670px) and (max-width:768px)
{
    .chart{
        top:10.4vw;
        left:10.4vw;
        width:235px;
        height:235px;
    }

    .image-container{
        margin-left:23%;
    }

    .arrow-chart{
        width:400px;
        height:400px;
    }
}

@media screen and (min-width:500px) and (max-width:670px)
{
    .chart{
        top:11.6vw;
        left:11.6vw;
        width:235px;
        height:235px;
    }

    .image-container{
        margin-left:18%;
    }

    .arrow-chart{
        width:400px;
        height:400px;
    }
}

@media screen and (min-width:370px) and (max-width:500px)
{
    .chart{
        top:16.6vw;
        left:16.6vw;
        width:195px;
        height:195px;
    }

    .image-container{
        margin-left:5%;
    }

    .arrow-chart{
        width:345px;
        height:345px;
    }
}

@media screen and (min-width:320px) and (max-width:370px)
{
    .chart{
        top:22.6vw;
        left:22.6vw;
        width:195px;
        height:195px;
    }

    .image-container{
        margin-left:-15%;
    }

    .arrow-chart{
        width:345px;
        height:345px;
    }
}

.vcn {
    background-color: #cccccc5c;
    margin: 65px 0px 30px 0px;
}

.dd 
{
	padding: 40px 0px 40px 0px;
}