@media (max-width: 1024px){
#txtid {
    font-size: 32px;
    margin-top: 120px;
}
}
@media (max-width: 1024px){
#txtid1 {
    font-size: 20px;
    /*margin-top: 50px;*/
}
}
.consz {
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.infotxt p, ul{
    margin-top: 10px;
    font-size: 16px;
    text-align: justify;
    line-height: 24px;
    /*margin-top: 10px;*/
}
.infotxt h3{
     color: #3d7a9b!important;
}
.top-line {
    background-color: #3d7a9b;
    height: auto;
    color: white;
}
.opgn {
    color: #3d7a9b;
    margin-top: 69px;
    text-align: center;
}
.pssn {
    margin-bottom: 10px;
    color: #3d7a9b;
    text-align: center;
}
.cpdn {
    margin-top: 15px;
    color: #3d7a9b;
    text-align: center;
}
.crt_payn {
    text-align: center;
    margin-top: 25px;
}
.satisfaction__block {
    /*width: 33.3%;*/
    padding: 0 40px 0 22px;
    box-sizing: border-box;
    border-left: 3px solid #3d7a9b;
}
 .satisfaction__text {
    color: #0d244f;
    font-size: 14px;
    font-weight: 400;
    line-height: 21px;
    margin-bottom: 5px;
}
.satisfaction__title {
    color: #3d7a9b;
    font-size: 18px;
    font-weight: 400;
    line-height: 27px;
}

 .header-top{
 	background-color:  #3d7a9b;
    color: #fff;  
    text-align: right;
    padding: 7px 0;
    font-size: 14px;
}

.header-top__text {
	/*width: 100%;*/
    font-size: 16px;
    font-weight: 700;
    margin: 8px 0;
}
/*.nav-top{
	text-align: right;
    width: 42%;
    padding: 7px 0;display: flex;
    justify-content: space-evenly;"
}*/
/*css for box on image*/
.process {
    margin: 110px 0 160px 0;
}
.u-site-container {
    max-width: 952px;
    width: 100%;
    margin: 0 auto;
}
.u-flex {
    display: flex;
    flex-wrap: wrap;
}
.process__block {
    position: relative;
    width: 50%;
}
.process__photo {
    margin-top: 40px;
}
@media only screen and (max-width: 768px){
 .process__block {
 width: 100%; 
}
}
.process__content {
    box-shadow: 0 3px 6px rgb(0 0 0 / 13%);
    border: 1px solid #cbcbcb;
    background-color: #fff;
    padding: 49px 75px 70px 75px;
    box-sizing: border-box;
    position: absolute;
    width: 115%;
    right: 0;
}
.process__title {
    color: #3d7a9b;
    /*font-family: "Roboto Slab",Raleway,sans-serif;*/
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 35px;
}
.process__steps {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: li;
}
.process__step {
    position: relative;
    padding-left: 45px;
    margin-bottom: 44px;
}
.process__step-title {
    color: #3d7a9b;
    font-size: 16px;
    /*font-family: "Roboto Slab",Raleway,sans-serif;*/
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 10px;
    display: block;
}
.process__step-text {
    margin: 0;
    color: #484848;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}
.process__step:before {
    content: counter(li);
    counter-increment: li;
    font-size: 60px;
    /*font-family: "Roboto Slab",Raleway,sans-serif;*/
    color: #3d7a9b;
    position: absolute;
    left: 0;
    top: 0;
    line-height: 50px;
}
@media only screen and (max-width: 768px){
 .process__content {
    width: 100%;
    margin: -80px auto 0 auto;
    position: static;
    padding: 45px 16px;
}
}

/*carsouel css*/
/*.carousel{
    height: 600px; 
    perspective: 250px;    
    
}
.carousel .carousel-item {
    width: 450px;
    background: #fff;
    padding: 50px;
    height: auto;
    text-align: center;
    border-radius: 15px;
}
.img-area {
    width: 100px;
    height: 100px;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 50%;
    border: inset 8px deepskyblue;
}
        .img-area img{
            width: 100%;
        }
        .testi p {
    color: #262626;
    font-size: 18px;
    line-height: 1.9;
}
        .testi h4 {
    font-size: 20px;
    margin: 0;
    color: #000;
}
        .testi h5 {
    font-size: 14px;
    letter-spacing: 5px;
    margin: 7px 0;
}*/


@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');

.containers{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 600px;
   /* background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(253,29,29,1) 43%, rgba(252,176,69,1) 99%);
*/
}


.imgbox img{
    width:100px;
    height:100px;
    border-radius: 50%;
    object-fit: cover;

}

.imgbox{
    text-align: center;
}

.carousel-control{
    background: transparent!important;
}

.glyphicon {
    color:black
}


.carousel{
    background: white;
    padding: 30px;
    width: 50%;
    height: 340px;
    border-radius: 20px;
    box-shadow: 1px 1px 30px #b1aeae;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


.carousel-caption p{ 
    color:black!important;
    text-shadow: none;
    font-family: 'Roboto', sans-serif;
    padding:0 80px!important
}
 

.carousel-caption h3{ 
    color:#3d7a9b!important;
    text-shadow: none;
    font-family: 'Oswald', sans-serif;
}


.carousel-caption{
    position: relative!important;  
  right: 0%!important;  
    bottom: 0px!important;  
  left: 0%!important;
    
}

.carousel-indicators{
    bottom: -4px;
}

.carousel-indicators li{
    width: 50px;
    background:#454545;
}


.carousel-indicators li.active{
    width: 50px;
    background:#3d7a9b;
}
.cline:before {
    height: 1px;
    width: 100%;
    background-color: #104ecc;
    content: "";
    -moz-transform: translate(0,-50%);
    -o-transform: translate(0,-50%);
    -ms-transform: translate(0,-50%);
    -webkit-transform: translate(0,-50%);
    transform: translate(0,-50%);
    left: 0;
    right: 0;
    top: 496%;
    position: absolute;
    margin: 0 auto;
}

/*blog*/
 .blog-title {
    color: #0d244f;
    font-family: "Roboto Slab",Raleway,sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 18px;
    margin-bottom: 30px;
    text-transform: capitalize;
}

 .blog .u-flex {
    justify-content: space-between;
}

 .blog__post {
    width: 32%;
    text-decoration: none;
    box-sizing: border-box;
}

.u-img-responsive {
    display: block;
    max-width: 100%;
}

 .blog__title {
    color: #3d7a9b;
    font-family: "Roboto Slab",sans-serif;
    font-size: 18px;
    font-weight: 500;
    margin-top: 20px;
    line-height: 27px;
}
@media only screen and (max-width: 768px){
 .blog-title {
    text-align: center;
    margin-bottom: 45px;
}
}
@media only screen and (max-width: 768px){
 .blog__post {
    width: 100%;
}
}
@media only screen and (max-width: 768px){
 .blog__post img {
    width: 100%;
}
}
/*quick links*/
.quick-links {
    margin: 60px 0 50px 0;
}
.quick-links__title {
    color: #3d7a9b;
    font-family: "Roboto Slab",Raleway,sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 18px;
    display: block;
}
.quick-links .customer {
    margin: 26px 0 20px 0;
    box-shadow: 0 3px 6px rgb(0 0 0 / 13%);
    background-color: rgba(185,194,212,.58);
}
.quick-links .customer .u-site-container {
    max-width: 725px;
}
.quick-links .customer__block:first-child {
    width: 62%;
}
.u-flex-center {
    align-items: center;
    justify-content: center;
    display: flex;
}
.quick-links .customer__block:first-child p {
    color: #0d244f;
    font-size: 18px;
    font-weight: 400;
    line-height: 27px;
    margin-top: 0;
}
.quick-links .customer__form {
    margin: 26px 0 0 0;
    justify-content: space-between;
}
.quick-links .customer__select {
    position: relative;
}
.quick-links .customer__select .form-block {
    margin-bottom: 0;
}
.form-block {
    margin-bottom: 25px;
    position: relative;
}
.form-block--show .form-block__overlay {
    display: none;
}
.form-block__overlay {
    color: #3d7a9b;
    font-size: 16px;
    background-color: #fff;
    width: 100%;
    line-height: 24px;
    z-index: 1;
    display: none;
    cursor: pointer;
}
.form-block__overlay:before {
    display: inline-block;
    width: 20px;
    height: 20px;
    vertical-align: middle;
    margin-right: 10px;
    content: "";
    background: url(/bundles/paystubspaystubgenerator/images/form/form-action-sprite.png) no-repeat top left;
}
.form-block__content {
    display: none;
    flex-wrap: wrap;
    width: 100%;
}
.form-block__overlay span {
    display: inline-block;
    vertical-align: top;
    margin-top: 2px;
}
.form-block:not(.form-block--optional) .form-block__content {
    display: flex;
}
.form-block--not-empty .form-block__remove {
    padding-top: 0;
}
.form-block__group {
    width: 100%;
}
.form-block .form-input {
    position: relative;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    outline: 0;
}
.quick-links .customer__select .form-block .default-select {
    width: 205px;
    border-color: #3d7a9b;
    color: #0d244f;
    font-size: 16px;
    margin-top: 27px;
}
.form-block .form-input .form-label {
    position: absolute;
    top: 5px;
    left: 0;
    transform-origin: 0 0;
    transition: all .2s ease;
    color: #0d244f;
    font-family: "Roboto Slab",Raleway,sans-serif;
    font-size: 16px;
    font-weight: 300;
    text-transform: capitalize;
    cursor: text;
}
.form-block .default-select {
    background: rgba(185,194,212,.58);
    height: 43px;
    border: 1px solid #b9c2d4;
    border-radius: 5px;
    padding: 0 11px;
    box-sizing: border-box;
    width: 100%;
    font-size: 16px;
    -webkit-appearance: auto;
    margin-top: 23px;
    font-weight: 300;
    font-family: "Roboto Slab",Raleway,sans-serif;
    outline: 0;
    text-transform: capitalize;
}
.form-block__group .form-input .default-select~.form-label {
    color: #3d7a9b;
    font-size: 14px;
    font-family: Raleway,sans-serif;
    top: 0;
}
.quick-links .customer__select .form-block .form-label {
    font-size: 16px!important;
    color: #3d7a9b!important;
}
.quick-links .customer__cta {
    cursor: pointer;
    width: 216px;
    height: 43px;
    border-radius: 6px;
    background-color: #3d7a9b;
    color: #fff;
    font-size: 16px;
    outline: 0;
    font-weight: 400;
    border: none;
    letter-spacing: 0;
    margin-top: 27px;
}
.quick-links .customer__block:last-child {
    text-align: right;
    width: 38%;
}
.quick-links .customer__block:last-child img {
    display: inline-block;
    margin-top: 9px;
}
input .form-label {
    position: absolute;
    top: 5px;
    left: 0;
    transform-origin: 0 0;
    transition: all .2s ease;
    color: #0d244f;
    font-family: "Roboto Slab",Raleway,sans-serif;
    font-size: 16px;
    font-weight: 300;
    text-transform: capitalize;
    cursor: text;
}
@media only screen and (max-width: 1024px){
.u-site-container {
    width: 90%;
}
}
@media only screen and (max-width: 768px){
.quick-links__title {
    text-align: left;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer {
    text-align: center;
    padding-top: 40px;
    margin-top: 30px;
}
}

@media only screen and (max-width: 1024px){
.u-site-container {
    width: 90%;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__block:first-child {
    width: 100%;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__block:first-child p {
    font-size: 18px;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__form {
    max-width: 90%;
    margin: 16px auto 0 auto;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__select {
    width: 100%;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__select .form-block .default-select {
    width: 100%;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__cta {
    margin: 20px auto 0 auto;
    width: 100%;
}
}
@media only screen and (max-width: 768px){
.quick-links .customer__block:last-child {
    width: 100%;
    text-align: center;
}
}
/*customer spprt*/
 .customer-support {
    margin: 10px 0 75px 0;
}
 .customer-support .u-flex {
    justify-content: space-between;
}

 .customer-support__block {
    text-align: center;
    padding: 20px 65px;
    width: 49%;
    box-shadow: 0 3px 6px rgb(0 0 0 / 13%);
    border: 1px solid #cbcbcb;
    box-sizing: border-box;
    background-color: #fff;
    border-radius: 5px;
}
 .customer-support__block .u-title {
    color: #3d7a9b;
    font-family: "Roboto Slab",Raleway,sans-serif;
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 15px;
    display: block;
}
 .customer-support__block p {
    color: #484848;
    font-size: 16px;
    font-weight: 400;
    line-height: 21px;
    margin: 0;
}
 .customer-support__block .u-cta {
    width: 215px;
    margin-top: 16px;
    height: 40px;
    border-radius: 6px;
    font-size: 16px;
    color: #fff;
    font-weight: 400;
    background-color: #3d7a9b;
    text-decoration: none;
    display: inline-block;
    padding: 0 27px;
    line-height: 39px;
}
@media only screen and (max-width: 1024px){
.u-site-container {
    width: 90%;
}
}
@media only screen and (max-width: 768px){
 .customer-support__block {
    width: 100%;
    margin-bottom: 20px;
}
}
@media only screen and (max-width: 768px){
 .customer-support__block .u-title {
    font-size: 20px;
}
}
@media only screen and (max-width: 640px){
 .customer-support__block .u-cta {
    padding: unset;
}
}
@media only screen and (max-width: 768px){
 .customer-support__block {
    width: 100%;
    margin-bottom: 20px;
}
}
@media only screen and (max-width: 768px){
 .customer-support__block .u-title {
    font-size: 20px;
}
}
/*content*/
.seo-content__title span {
    display: block;
    padding-top: 24px;
}
.seo-content__title hr {
    width: 60px;
    background-color: #3d7a9b;
    height: 3px;
    border: none;
    margin-top: 20px;
}
.seo-content__title {
    color: #0d244f;
    font-size: 24px;
    font-family: "Roboto Slab",Raleway,sans-serif;
    height: 100px;
    box-shadow: 10px 10px 18px rgb(203 203 203 / 46%);
    border: 1px solid #fff;
    border-top: unset;
    border-right: unset;
    border-left: unset;
    text-align: center;
}
/*@media (max-width: 1050px){
 {
    width: 70%;
    height: 70vw;
}
}*/
/*@media only screen and (max-width: 1300px){
#slider  {
    width: 35%;
  height: 25vw;
}}*/
@media only screen and (max-width: 480px){
#slider  {
    width: 62%!important;
    height: 51%!important;
}}
@media (min-width: 480px) and (max-width: 700px) {
    #slider {
        width: 62%!important;
    height: 42%!important;
    }

}
@media (min-width: 701px) and (max-width: 990px) {
    #slider {
    width: 62%!important;
    height: 30%!important;
    }

}
@media (min-width: 991px) and (max-width: 1024px) {
    #slider {
    width: 35%!important;
    height: 30vw!important;
    }

}
.bacgrd{
   background-color: white;
   height: 550px;
}
@media screen and (max-width: 400px) {
    .bacgrd {
        height:675px;
    }

}
@media (min-width: 481px) and (max-width: 480px) {
    .bacgrd {
        height:673px;
    }

}
@media (min-width: 401px) and (max-width: 700px) {
    .bacgrd {
        height:585px;
    }

}
@media (min-width: 701px) and (max-width: 1024px) {
    .bacgrd {
        height:630px;
    }

}
@media (min-width: 701px) and (max-width: 1024px){
.pricing-ribbon-bottom {
    margin-top: 35px;
}
}

@media (max-width: 400px){
.pricing-ribbon-bottom {
    margin-top: 40px;
}
}