/**********************************************NAVIGATION WITH SEARCH***********************************************/
/*******************************************************************************************************************/
.navigation-clean-search {
    background: #fff;
    padding-top: .75rem;
    padding-bottom: .75rem;
    border-radius: 0;
    box-shadow: none;
    border: none;
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .navigation-clean-search {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
}

.navigation-clean-search .navbar-brand {
    font-weight: bold;
    font-family: Lora, serif;
    color: #4c4c4c;
    font-size: 18px !important;
}

.navigation-clean-search .navbar-brand:hover {

}

.navigation-clean-search .navbar-toggler {

}

.navigation-clean-search .navbar-toggler:hover, .navigation-clean-search .navbar-toggler:focus {
    background: none;
}

.navigation-clean-search .navbar-toggler {
    color: #4c4c4c;
}

.navigation-clean-search .navbar-collapse, .navigation-clean-search .form-inline {
    border-top-color: #ddd;
}

.navigation-clean-search .navbar-nav a.active, .navigation-clean-search .navbar-nav > .show > a {
    background: none;
    box-shadow: none;
}

.navigation-clean-search.navbar-light .navbar-nav a.active, .navigation-clean-search.navbar-light .navbar-nav a.active:focus, .navigation-clean-search.navbar-light .navbar-nav a.active:hover {
    color: #6f6f6f;
    box-shadow: none;
    background: none;

}

.navigation-clean-search.navbar .navbar-nav .nav-link {
    padding-left: 18px;
    padding-right: 18px;
}

.navigation-clean-search.navbar-light .navbar-nav .nav-link {
    color: #4c4c4c;
}

.navigation-clean-search.navbar-light .navbar-nav .nav-link:focus, .navigation-clean-search.navbar-light .navbar-nav .nav-link:hover {
    color: #37434d !important;
    background-color: transparent;
    text-decoration: underline;
}

.navigation-clean-search .action-button, .navigation-clean-button .action-button:active {
    border-radius: 20px;
    font-size: inherit;
    color: #fff !important;
    box-shadow: none;
    border: none;
    text-shadow: none;
    padding: 8px 20px;
    transition: background-color 0.25s;
}

.navigation-clean-search .action-button:hover, .navigation-clean-search .action-button:focus {

}

.navigation-clean-search .form-inline label {

}

.navigation-clean-search .form-inline .search-field {
    background: none;
    border: none;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    color: #ccc;
    box-shadow: none;
    color: inherit;
    transition: border-bottom-color 0.3s;
}

@media (max-width: 767px) {
    .navigation-clean-search .form-inline .search-field {
        display: inline-block;
        width: 80%;
    }
}

.navigation-clean-search .form-inline .search-field:focus {
    border-bottom: 1px solid #ccc;
}

/*****************************************END OF NAVIGATION WITH SEARCH*********************************************/
/*******************************************************************************************************************/
body {
    font-family: Nunito, sans-serif;
}

h2 {
    font-size: 28px;
    margin: 1rem 0;
    font-weight: 400;
    color: #4c4c4c;
    font-family: Lora, serif
}

h3 {
    font-size: 25px;
    margin: 1rem 0;
    font-weight: 400;
    color: #4c4c4c;
    font-family: Lora, serif
}

@media (max-width: 460px) {
    h2 {
        font-size: 25px;
    }

    h3 {
        font-size: 21px;
    }
}

#blog-sample-div {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.03), 0 6px 20px 0 rgba(0, 0, 0, 0.04);
}


#article {
    max-width: 1140px;
}

p {
    font-family: Nunito, sans-serif;
    color: #585858;
    font-size: 18px;
}


#menu-mobile {
    border: 0;
}

#menu-mobile-cont {
    z-index: 10;
    overflow: hidden;
    position: relative;
}

@media (max-width: 990px) {
    #navcol-1 {
        background-color: #ffffff;
        padding: 18px;
        margin: 12px 6px 6px 6px;
        box-shadow: 0px 0px 12px -3px rgba(0, 0, 0, 0.08);
    }
}


#blog-title {
    text-decoration: none;
    font-family: 'Lora', serif;
    font-size: 27px;
    font-weight: 500;
    color: #4c4c4c;
    letter-spacing: 0.03rem;
    line-height: 1.75rem;
}

@media (max-width: 768px) {
    #blog-title {
        font-size: 24px;
    }
}

#blog-title-h3 {
    margin: 0;
}

#blogs {
    margin-top: 40px;
}

@media (max-width: 576px) {
    #blogs {
        margin-bottom: 60px;
    }
}

#blog-para {
    margin-top: 5px;
    margin-bottom: 0;
    font-family: Nunito, sans-serif !important;
    font-size: 19px;
    font-weight: 400;
    color: #585858;
}

@media (max-width: 768px) {
    #blog-para {
        font-size: 18px;
    }
}


#headh1 {
    font-family: 'Lora', serif !important;
    font-weight: 500;
    font-size: 30px;
    color: #4c4c4c;
}

#headh1-cat {
    font-family: 'Lora', serif;
    font-weight: 500;
    font-size: 22px;
    color: #4c4c4c;
}

#cat-items {
    font-size: 20px;
    font-weight: 500;
}

#search-field {
    border-bottom: 1px solid #fcfcfc;
    color: #4c4c4c;
}

#cover2 {
    object-fit: cover;
    display: block;
    width: 100%;
    margin-top: 40px;
    margin-bottom: 40px;
    box-shadow: rgba(0, 0, 0, 0.05) 0px 4px 8px 0px, rgba(0, 0, 0, 0.04) 0px 6px 20px 0px;
}

#seemore {
    font-family: Nunito, sans-serif;
    font-size: 18px;
}

#seemore-arrow {
    margin-left: 5px;
    position: relative;
    top: 1px;
    font-size: 15px;
}

#cat-icon {
    position: relative;
    top: 5px;
    font-size: 16px;
    margin-right: 10px;
    margin-left: 0;
    padding-right: 0;
}

@media (max-width: 768px) {
    #cat-icon {
        font-size: 15px;
    }
}

#cat-section {
    margin-top: 103px;
    padding: 20px 22px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.03), 0 6px 20px 0 rgba(0, 0, 0, 0.04);
}

@media (max-width: 990px) {
    #cat-section {
        margin-left: -35px;
    }
}

@media (max-width: 768px) {
    #cat-section {
        padding-top: 20px;
        padding-bottom: 20px;
        padding-left: 20px;
        box-sizing: border-box;
        margin-left: -30px;
    }
}

@media (max-width: 460px) {
    #cat-section {
        margin-bottom: 25px;
    }
}

#search-ico {
    border-bottom: 1px solid white;
    color: #4c4c4c;
}

#demo-article {
    padding: 20px 20px;
}

@media (max-width: 768px) {
    #demo-article {
        padding: 14px 14px;
    }
}

@media (max-width: 576px) {
    #demo-article {
        padding: 20px 20px;
    }
}


@media (max-width: 768px) {
    #column-right {
        width: 100%;
    }
}


#main-row {
    margin-top: 40px;
}

@media (max-width: 990px) {
    #main-row {
        margin-top: 20px;
    }
}


#main-cont {
    min-height: 70vh;
}

@media (max-width: 768px) {
    #main-cont {
        margin: auto;
        max-width: 576px;
    }
}

@media (max-width: 576px) {
    #main-cont {
        padding: 25px;

    }
}


#cat-col {
    padding-left: 15px;
    margin-top: 15px;
}

@media (max-width: 990px) {
    #cat-col {
        margin-top: -80px;
    }
}

#logo {
    font-size: 50px;
}

@media (max-width: 768px) {
    #logo {
        font-size: 40px;
    }
}

#headh1-div {
    margin-top: 40px;
}

@media (max-width: 460px) {
    #headh1-div {
        margin-top: 35px;
    }
}

#blog-thumb-div {
    padding: 0 0;
}


#blog-thumbnail {
    object-fit: cover;
    height: 225px;
    width: auto;
}

@media (max-width: 768px) {
    #blog-thumbnail {
        height: 240px;
        width: auto;
    }
}

@media (max-width: 576px) {
    #blog-thumbnail {
        height: 200px;
        width: auto;
    }
}


#article-cont {
    padding-left: 20px;
    padding-right: 20px;
}

#article-info {
    max-width: 720px;
    margin: auto;
}

#article {
    max-width: 720px;
    margin: auto;
}

#article-para p {
    font-size: 21px;
    color: #585858;
    font-family: Nunito, sans-serif;
    letter-spacing: .04rem;
    line-height: 2rem;
    font-weight: 400;
    font-style: normal;
}

@media (max-width: 460px) {
    #article-para p {
        font-size: 18px;
    }
}

#article-para img {
    margin-bottom: 15px;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.04), 0 6px 20px 0 rgba(0, 0, 0, 0.04);
}

#article-para code {
    border-left: 5px solid #969696;
    padding: 15px;
    background-color: #f7f4f4;
    display: inline-block;
    min-height: 50px;
    width: 100%;
}


#article-title {
    font-size: 40px;
    margin-top: 80px;
    text-decoration: none;
    font-family: 'Lora', serif;
    font-weight: 500;
    color: #4c4c4c;
    letter-spacing: .3px;
    line-height: 2.75rem;
}

@media (max-width: 990px) {
    #article-title {
        margin-top: 60px;
    }
}


@media (max-width: 460px) {
    #article-title {
        font-size: 28px;
    }
}

#article-date {
    font-size: 18px;
    margin-top: 40px;
    margin-bottom: 10px;
    color: #4c4c4c;
    font-family: Nunito, sans-serif;
    font-weight: 400;
}

@media (max-width: 460px) {
    #article-date {
        font-size: 16px;
    }
}

#article-author {
    font-size: 18px;
    color: #4c4c4c;
    font-family: Nunito, sans-serif;
    font-weight: 400;
}

@media (max-width: 460px) {
    #article-author {
        font-size: 16px;
    }
}

#icon-span i {
    font-size: 16px;
}

@media (max-width: 460px) {
    #icon-span i {
        font-size: 15px;
    }
}


#pagi {
    font-size: 16px;
    margin-bottom: 10px;
    font-family: Lora, serif;
    margin-top: 40px;
"
}

#pagi li {
    font-family: Nunito, sans-serif;
    font-size: 16px;

}


#cover2-div {
    max-width: 1140px;
    height: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.04), 0 6px 20px 0 rgba(0, 0, 0, 0.04);
}

#tiny-div {
    max-width: 1140px;
    margin: auto;
}


#cat-litem-ink {
    font-family: Nunito, sans-serif;
    color: #585858;
    font-size: 18px;
}


.blogpost-article p {
    font-size: 20px;

}

@media (max-width: 768px) {
    .blogpost-article p {
        font-size: 18px;
    }
}


.blogpost-article img {
    max-width: 720px;
    height: auto;
}

@media (max-width: 992px) {
    .blogpost-article img {
        max-width: 690px;
    }
}

@media (max-width: 768px) {
    .blogpost-article img {
        max-width: 510px;
    }
}

@media (max-width: 576px) {
    .blogpost-article img {
        max-width: 440px;
    }
}

@media (max-width: 460px) {
    .blogpost-article img {
        width: 100%;
    }
}


.cats {
    margin-top: 15px;
    margin-left: 8px;
    padding-left: 10px;
}


.pointer {
    cursor: pointer;
}

#disqus_thread {
    margin-top: 40px;
}


/*-------------------------site update from site4.0-------------------*/


#nav-links {
    margin-left: 0 !important;
}


#nav-bar {
    height: 60px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .15);
}

#brand-nb {
    font-size: 40px;
    font-weight: 400;
    letter-spacing: .1rem;
}


#search-bar {
    border-bottom: 1px solid #4c4c4c;
    margin-right: 0;
    color: #4c4c4c;
    transform: scale(0.7);
}

@media (max-width: 990px) {
    #search-bar {
        transform: scale(0.85);
        margin-bottom: 10px;
    }
}

#search-bar i {
    font-size: 20px;
}


#first-block {
    margin-top: 15vh;
}


#social-icon {
    margin: 0;
    color: #4c4c4c;
    font-size: 20px;
}

#social-icon-link {
    margin-right: 25px;
}


#h1-intro {
    margin-bottom: 40px;
    margin-left: 2px;
    font-family: 'Nunito Sans', sans-serif;
    font-size: 20px;
    color: #585858;
}

#h2-quote {
    font-family: Lora, serif;
    margin-bottom: 15px;
    font-size: 40px;
    line-height: 55px;
    color: #4c4c4c;
}

@media (max-width: 768px) {
    #h2-quote {
        font-size: 30px;
        line-height: 2.5rem;
    }
}

#soft-eng-bold {
    font-weight: 900;
}


@media (max-width: 576px) {
    #dash {
        width: 85px;
    }
}

#about-cont {
    margin-top: 15vh;
    margin-bottom: 40px;
}


#about-heading {
    line-height: 1.2;
    font-weight: 500;
}

@media (max-width: 576px) {
    #about-heading {
        font-size: 28px;
        line-height: 2.5rem;
    }

}

#underline {
    text-decoration: none;
    border-bottom: 2px solid #4c4c4c;
}

#about-desc {
    margin-top: 40px;
    margin-bottom: 35px;
    font-size: 20px;
    font-weight: 500;
    line-height: 1.8rem;

}

@media (max-width: 576px) {
    #about-desc {
        font-size: 18px;

    }

}

#email-me-button {
    padding: 12px 25px;
    font-size: 15px;
    letter-spacing: 1px;

}

#email-icon {
    margin-right: 12px;
}


#footer {
    min-height: 60px;
    box-shadow: 0 0 4px 0 rgba(0, 0, 0, .15);
    margin-top: 90px;
    margin-bottom: 0;
    padding: 20px 0;

}

#footer-tag {
    font-family: 'Nunito Sans', sans-serif;
    color: #4c4c4c;
    font-size: 16px;
    margin: 0;
}

#footer-icons {
    align-content: center;
}

#footer-icon-link {
    margin-right: 25px;
}

@media (max-width: 576px) {
    #footer-icons {
        margin-bottom: 20px;
    }

    #footer-icon-link {
        margin: 0 13px;
    }
}

#icons {
    margin-top: 40px;
    margin-left: 2px;
}


#jobs-cont {
    padding-right: 0;
    padding-left: 0;
}

#jobs {
    font-family: 'Nunito Sans', sans-serif;
    font-size: 16px;
    color: rgb(0, 0, 0);
    font-weight: 600;
    line-height: 1rem;
    margin-left: 2px;
    margin-bottom: 8px;
    margin-top: 0;
}

#jobs-link {
    color: rgb(0, 0, 0);
    text-decoration: none;
}

#jobs-link:hover {
    text-decoration: underline;
}

#project-words {
    margin-top: 15vh;
    margin-bottom: 0;
    padding-left: 0;
}


#project-title {
    text-decoration: none;
    font-family: 'Lora', serif;
    font-size: 27px;
    font-weight: 500;
    color: #4c4c4c;
    letter-spacing: 0.03rem;
    line-height: 1.75rem;
    margin-bottom: 20px;
}

#project-para {
    font-size: 18px;
    font-weight: 500;
    margin-bottom: 0;
}

#project-showcase {
    margin-bottom: 40px;
}

#project-image-div {
    padding: 20px 20px 20px 16px;

}

#project-image-row {

}

#project-video {
    object-fit: cover;
    height: 250px;
    width: auto;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.03), 0 6px 20px 0 rgba(0, 0, 0, 0.04);
}

@media (max-width: 1200px) {
    #project-image-row {

    }

    #project-video {
        height: 200px;
    }
}

@media (max-width: 990px) {
    #project-image-row {
        margin-bottom: 0;
    }

    #project-image-div {

    }

    #project-video {
        height: 250px;

    }
}

@media (max-width: 768px) {
    #project-image-row {
        margin-bottom: 0;
    }

    #project-image-div {
        margin-bottom: 40px;
    }

    #project-video {

    }
}

@media (max-width: 576px) {
    #project-image-div {
        margin-bottom: 0;
    }

    #project-video {
        height: 220px;
    }
}

@media (max-width: 460px) {
    #project-image-div {
        margin-bottom: 0;
    }

    #project-video {
        height: 200px;

    }
}

@media (max-width: 400px) {
    #project-image-div {
        margin-bottom: 0;
    }

    #project-video {
        height: 180px;
        width: 100%;

    }
}

code {
    margin-top: 15px;
    margin-bottom: 15px;
}

/**********************DASHBOARD*****************************/
.dashboard {
    margin-bottom: 10px;
    margin-right: 20px;
}

#dash-cover {
    object-fit: cover;
    max-height: 250px;
    width: auto;
    margin-bottom: 20px;
}