.navbar-logo{
    padding-right: 18px;
}

header.light_header {
    z-index: 1000;
    position: sticky;
    top: 0; 
    height: 50px;
}

.search-body-custom{
    padding: 10px 30px 0px 30px;
}

.search-section .search-body-custom {
    background-color: white;
    -webkit-box-shadow: 1px 3px 20px 0px rgba(0, 0, 0, 0.1);
            box-shadow: 1px 3px 20px 0px rgba(0, 0, 0, 0.1);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative; 
}

input[type=number]::-webkit-inner-spin-button {
    opacity: 1
}

.badge-mute{
    background-color: #f9f9f9;
    color: black !important;
}
.badge-info{
    background-color: #99c9ff;
    color: black !important;
}

/* // timeline style */
.timeline {
    position: relative;
    padding-left: 4rem;
    margin: 0 0 0 30px;
    /* color: white; */

    .info {
        .timeline-body{
            border: 1px solid #99c9ff !important;
            &:before {
                border-left: 1px solid #99c9ff !important;
                border-bottom: 1px solid #99c9ff !important;
            }
        }
        .timeline-icon:hover,.timeline-body:hover,.timeline-body &:before:hover{
            background: #99c9ff!important;
            color:white!important;
        }
    }

    &:before {
        content: '';
        position: absolute;
        left: 0;
        top: 0;
        width: 4px;
        height: 100%;
        /* background: #27293d; */
        background: #f9f9f9;
    }

    .timeline-container {
        position: relative;
        margin-bottom: 2.5rem;;

        .timeline-icon {
            position: absolute;
            left: -100px;
            top: -5px;
            width: 80px;
            height: 75px;
            border-radius: 50%;
            text-align: center;
            font-size: smaller;
            /* background: #6c757d; */
            background: #f9f9f9;

            i, .timeline-icon-inner {
                position: absolute;
                left: 50%;
                top: 50%;
                transform: translate(-50%, -50%);
            }

            img {
                width: 100%;
                height: 100%;
                border-radius: 50%;
            }
        }

        .timeline-body {
            /* background: #27293d; */
            background: #f9f9f9;
            border-radius: 3px;
            padding: 20px 20px 15px;
            box-shadow: 1px 3px 9px rgba(0,0,0, .1);

            &:before {
                content: '';
                background: inherit;
                width: 20px;
                height: 20px;
                display: block;
                position: absolute;
                left: -10px;
                transform: rotate(45deg);
                border-radius: 0 0 0 2px;
            }

            .timeline-title {
                margin-bottom: 1.4rem;

                .badge {
                    background: #6c757d;
                    padding: 4px 8px;
                    border-radius: 3px;
                    font-size: 12px;
                    font-weight: bold;
                }
            }

            .timeline-subtitle {
                font-weight: 300;
                font-style: italic;
                opacity: .4;
                /* margin-top: 16px; */
                font-size: 11px;
            }
        }

        /* // Primary Timeline */
        &.primary {
            .badge,
            .timeline-icon {
                background: #0d6efd !important;
            }
        }

        /* // Info Timeline */
        &.info {
            .badge,
            .timeline-icon {
                /* background: #0dcaf0 !important; */
                background: #99c9ff;
            }
        }

        /* // Success Timeline */
        &.success {
            .badge,
            .timeline-icon {
                background: #198754 !important;
            }
        }

        /* // Warning Timeline */
        &.warning {
            .badge,
            .timeline-icon {
                background: #ffc107 !important;
            }
        }

        /* // Dnager Timeline */
        &.danger {
            .badge,
            .timeline-icon {
                background: #dc3545 !important;
            }
        }

    }
}


.author{
	font-family: inherit;
	padding: 3em;
	text-align: center;
	width: 100%;
		color: white;
 
	a:link,
	a:visited{
		color: white;
		&:hover{
			text-decoration: none;
		}
	}
	.btn-colorflip:link,
	.btn-colorflip:visited{
		margin-top: 1em;
		text-decoration: none;
		display: inline-block;
		font-family: inherit;
		font-weight: 100;
		color: white;
		text-align: center;
		vertical-align: middle;
		user-select: none;
		background-color: black;
		padding: 1.5em 2rem;
		border-radius: 1em;
		transition: .5s all;
		&:hover,
		&:focus,
		&:active{
			background-color: lighten(black, 10%);
		}
	}
}

/* btn colorflip ------ START */
  .btn-colorflip {
    border: none;
    width: 100%;
    height: 2.4em;
    border-radius: 0.5em;
    display: flex;
    /* justify-content: center; */
    align-items: center;
    gap: 32px;
    /* background: #1C1A1C; */
    background: white;
    border: 1px solid #99caff;
    cursor: pointer;
    transition: all 450ms ease-in-out;
    padding: 0px 20px;
  }
  
  .colorflip {
    fill: #AAAAAA;
    transition: all 800ms ease;
  }
  
  .text-colorflip {
    font-weight: 600;
    color: #AAAAAA;
    font-size: medium;
  }
  
  .btn-colorflip:hover {
    /* background: linear-gradient(0deg,#A47CF3,#683FEA);
    box-shadow: inset 0px 1px 0px 0px rgba(255, 255, 255, 0.4),
    inset 0px -4px 0px 0px rgba(0, 0, 0, 0.2),
    0px 0px 0px 4px rgba(255, 255, 255, 0.2),
    0px 0px 180px 0px #9917FF;
    transform: translateY(-2px); */
    background: linear-gradient(0deg,#99caff,#007cff);
    transform: translateX(-2px);
  }
  
  .btn-colorflip:hover .text-colorflip {
    color: white;
  }
  
  .btn-colorflip:hover .colorflip {
    fill: white;
    transform: scale(1.2);
  } 
/* btn colorflip -------- END */

.service-icon i{
    color: #99caff;
}
.underline-space, .nav-item-style:hover{
    display: inline;
    border-bottom: 3px solid #f9dd94;
}
.underline-sky{
    display: inline;
    border-bottom: 3px solid #B5D7FD;
}

