/* Fonts */
@import url('https://fonts.googleapis.com/css2?family=Proza+Libre:wght@400;500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap');

/* Body styles */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Lato', sans-serif;
    text-align: justify;
    font-weight: 300;
    color: rgb(41, 39, 39);
    background-color: rgba(255, 255, 255, 0.719);
}

h1,h2,h3 {
    font-family: 'Proza Libre', sans-serif;
    color: #708dc0;
    font-weight: 500;
}

h4,h5 {
    font-family: 'Proza Libre', sans-serif;
    color: #92abd6;
    font-weight: 400;
}

h2 {
    text-align: center;
    font-size: 3em;
}

h3 {
    text-align: center;
    font-size: 2.5em !important;
}

.main-content {
    min-height: 100vh;
    margin-bottom: -57px;
}

.main-content:after {
    content: "";
    display: block;
    height: 57px;
}

.btn-primary {
    background-color: #f5bf4b;
    outline: none !important;
    border-radius: 25px;
    border: none !important;
    font-weight: 400 !important;
    box-shadow: none !important;
}

.btn-primary:hover,.btn-primary:active,.btn-primary:focus {
    background-color: #ee739a;
    box-shadow: -2px 3px 5px 0px rgba(69,114,184,0.51) !important;
    -webkit-box-shadow: -2px 3px 5px 0px rgba(69,114,184,0.51) !important;
    -moz-box-shadow: -2px 3px 5px 0px rgba(69,114,184,0.51) !important;
}


/* Website Preloader */
.pre-loader {
    background-color: #fafdff;
    position: fixed;
    height: 100%;
    z-index: 99999;
    width: 100%;
    left: 0;
    top: 0;
}

.preloader-svg {
    position: relative;
    display: block;
    width: 258px;
    height: 258px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.tree {
    fill: #e7810d;
}

.circle-mask {
    transform-origin: 50% 90%;
    animation: scale 5s infinite ease-out;
}

@keyframes scale {

    0%,
    100% {
        transform: scale(0.0);
    }

    7%,
    90% {
        transform: scale(0.4);
    }

    50% {
        transform: scale(1);
    }
}


/* Scrollbar */
::-webkit-scrollbar {
    width: 15px;
    background-color: rgba(255, 255, 255, 0.719);
  }
  ::-webkit-scrollbar-track {
    background-color: rgba(255, 255, 255, 0.719);
    box-shadow: inset 0 0 5px rgb(194, 194, 223);
    border-radius: 10px;
  }
  ::-webkit-scrollbar-thumb {
    background: #3fe24dde;
    height: 5px;
    border-radius: 10px;
  }
  ::-webkit-scrollbar-thumb:hover {
    background: #819dceee;
  }
  
  ::-webkit-scrollbar-thumb:active {
    background: #486699f1;
  }


/* Navbar */
.navbar-nav {
    margin-left: auto;
}

.nav-link {
    color: #2ecc3b !important;
    margin: auto 1rem;
    font-weight: 400;
}

.nav-link:hover,.nav-link:focus,.nav-link:active,.nav-link-active {
    color: #22b42f !important;
}

.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}

.navbar-collapse {
    margin-left: 115px;
}

.nav-brand {
    margin-left: 3%;
}

.nav-brand-img {
    width: 190px;
    position: absolute;
}

@media only screen and (max-width: 800px) {
    .nav-item {
        margin-top: 1%;
    }

    .nav-brand-img {
        width: 150px;
    }
}


/* Scroll to top arrow */
#return-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: #92a3c5e8;
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
    left: 16px;
    top: 13px;
    font-size: 19px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

#return-to-top:hover {
    background: #92a3c5;
}

#return-to-top:hover i {
    top: 5px;
}


/* Top content responsive */
.top-con {
    margin-top: 9%;
}

@media screen and (max-width: 1200px)
{
    .top-con {
        margin-top: 17%;
    }
}

@media screen and (max-width: 600px)
{
    .top-con {
        margin-top: 40%;
    }
}


/* Top text content */
.top-text-con {
    margin-top: 3%;
}


/* Some fa icons */
.fa-wrench,.fa-pencil {
    color: rgb(133, 128, 128);
}


/* Other text content */
.other-con {
    margin-top: 8%;
}

.mail-link {
    color: #ee739a;
    padding-top: 5%;
    display: flex;
    margin: auto;
}

.fa-envelope-o {
    font-size: 30px;
    margin-left: 2%;
}

.mail-link:hover,.mail-link:active,.mail-link:focus {
    color: #fdca5d;
}


/* Contact Form */
input,textarea,.form-control {
    background-color: #acfc2c96 !important;
    border-radius: 25px;
    border-width: 1px;
    border-color: rgb(245, 158, 118) !important;
    box-shadow: none;
}

textarea {
    border-radius: 35px !important;
    padding: 15px !important;
}

input:hover,textarea:hover,.form-control:hover {
    border-width: 2px;
    background-color: #acfc2cb0 !important;
}

input:focus,textarea:focus.form-control:focus,input:active,textarea:active,.form-control:active {
    background-color: #acfc2cb0 !important;
    box-shadow: rgba(245, 158, 118, 0.781) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
}

textarea:focus, 
textarea.form-control:focus, 
input.form-control:focus, 
input[type=text]:focus, 
input[type=password]:focus, 
input[type=email]:focus, 
input[type=number]:focus, 
[type=text].form-control:focus, 
[type=password].form-control:focus, 
[type=email].form-control:focus, 
[type=tel].form-control:focus, 
[contenteditable].form-control:focus {
    background-color: #acfc2cb0 !important;
    box-shadow: rgba(245, 158, 118, 0.781) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
    outline: none !important;
}

textarea {
    resize: none;
}

label {
    margin-top: 2%;
    font-weight: 400;
    margin-left: 1%;
    color: rgba(57, 119, 155, 0.884);
}

.contact-btn {
    float: right;
    margin-top: 2%;
}

@media only screen and (max-width: 600px)
{
    input,textarea,.form-control {
        width: 290px;
    }
}

@media only screen and (max-width: 768px)
{
    .contact-h {
        margin-top: 7%;
    }
}

@media only screen and (max-width: 600px)
{
    #contact_form {
        margin-top: 9%;
    }
}



/* Summary Section */
.social-svg {
    fill: #fdca5d;
    margin-left: 3%;
    margin-top: 3%;
}

.social-svg:nth-child(0)
{
    margin-left: 0;
}

.social-svg:hover,.social-svg:active,.social-svg:focus {
    fill: #f28bac;
}

.social-con {
    text-decoration: none !important;
}

@media only screen and (max-width: 600px)
{
    .social-svg {
        margin-top: 6%;
    }

    .social-con {
        margin-top: 7%;        
    }
}



/* Footer */
footer {
    margin-top: 5%;
    height: 57px;
    background-color: #92a3c5e8;
}



/* 404 Page */
img.error_img {
    margin: auto;
    display: flex;
    width: 420px;
    margin-top: 3%;
    align-items: center;
    justify-content: center;
}

.floating {  
    animation-name: floating;
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;
}

@keyframes floating {
    from { transform: translate(0,  0px); }
    65%  { transform: translate(0, 15px); }
    to   { transform: translate(0, -0px); }    
}

@media only screen and (max-width: 550px) 
{
    .error_img {
        width: 250px !important;
    }
}



/* Homepage */
.homepage-img {
    width: 400px;
}

.skill-tag {
    background-color: #fdca5d;
    float: left;
    color: #fff;
    border-radius: 25px;
    padding: 7px 10px;
    font-weight: 700;
    text-align: center;
    margin: 6px;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px, rgba(0, 0, 0, 0.23) 0px 2px 4px;
}

.skill-tag-big {
    background-color: #f5bf4b;
    float: left;
    color: #fff;
    border-radius: 25px;
    padding: 9px 12px;
    text-align: center;
    font-weight: 400;
    margin: 5px 8px;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px, rgba(0, 0, 0, 0.23) 0px 2px 4px;
}

.soft_skill-tag {
    background-color: #f28bac;
    float: left;
    color: #fff;
    border-radius: 25px;
    padding: 7px 10px;
    font-weight: 700;
    text-align: center;
    margin: 6px;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px, rgba(0, 0, 0, 0.23) 0px 2px 4px;
}

.soft_skill-tag-big {
    background-color: #ee739a;
    float: left;
    color: #fff;
    border-radius: 25px;
    padding: 9px 12px;
    font-weight: 400;
    text-align: center;
    margin: 5px 8px;
    white-space: nowrap;
    overflow: hidden;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 2px 4px, rgba(0, 0, 0, 0.23) 0px 2px 4px;
}

.fa-star:nth-child(1) {
    margin-left: 11px;
}

.resume-btn {
    text-align: center;
    margin: auto;
    display: flex;
    width: 260px;
    padding: 1.3% 2%;
    justify-content: center;
    background-color: #ee739a;
    border-radius: 15px;
}

.resume-btn:hover,.resume-btn:active,.resume-btn:focus {
    background-color: #708dc0;
}

@media only screen and (max-width: 1200px)
{
    .homepage-img {
        width: 300px;
    }
}



/* Projects Page */
blockquote{
    margin: 0 10px;
    quotes: "\201C""\201D""\2018""\2019";
    padding: 7px 20px;
    font-style: italic;
}

blockquote:before {
    content: open-quote;
    line-height: 0;
    font-weight: 400;
    left: -10px;
    position: relative;
    top: 20px;
    color: #f28bac;
    font-size: 4em;
}

.project-img {
    height: 300px;
}

.cstm-height-card .card-img-top {
    height: 200px;
    object-fit: cover;
    border-radius: 7px;
    border-color: #708dc0;
}

.pro-card {
    border-radius: 7px;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
    margin-top: 4%;
}

.pro-card:hover,.pro-card:active,.pro-card:focus {
    box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.pro-card-body {
    background-color: #ffe4c470;
}

.demo-btn {
    border-radius: 5px !important;
    float: left;
}

.code-btn {
    border-radius: 5px !important;
    float: right;
    background-color: #ee739a !important;
}

.code-btn:hover,.code-btn:active,.code-btn:focus {
    background-color: #fdca5d !important;
}

@media only screen and (max-width: 768px)
{
    .project-img {
        height: 200px;
    }
}



/* Education Page */
.edu-img {
    width: 350px;
    float: right;
    margin-left: 2%;
}

.edu-card {
    background-color: #CBFCBA;
    padding: 2% 1%;
    margin-top: 3%;
    border-radius: 7px;
}

.edu-card-img {
    max-width: 250px;
    border: 2px dotted #000;    
}

.owl-carousel {
    width: 1280px;
    margin: 50px auto;
    min-height: 200px;
    box-sizing: border-box;
    position: relative;
}
    
.owl-carousel {
    overflow: hidden;
    width: 195px;
    flex-shrink: 0;
    height: 322px;
    padding-right: 15px;
    
}
  
.owl-carousel .info {
    background-color: #566d94;
    padding-top: 10px;
    padding-bottom: 15px;
    text-align: center;
    border-radius: 0 0 1rem 1rem;
}

.owl-carousel .info {
    overflow: auto;
}

.owl-carousel .info p {
    color: #dfe4def5;
    font-weight: 700;
}
  
.owl-carousel .info a {
    color: #dfe4def5;
    text-decoration: none;
    font-weight: 500;
}
  
.owl-carousel .info a:visited,.owl-carousel .info a:hover,.owl-carousel .info a:active,.owl-carousel .info a:focus {
    color: #25ff00;
    font-weight: 900;
}
  
.owl-carousel {
    width: 100%;
    height: 100%;  
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    border-radius: 1rem;
}
  
.sc-home-img {
    width: 100%;
    height: 100%;  
    border: 2px solid #fff;
    object-fit: cover;
    border-radius: 1rem 1rem 0 0;
}

.owl-carousel .item {
    border-color: #000000;
    border-width: 2px;
    padding-left: 18px;
}
  
.carousel-wrap h3 {
    font-size: 2rem;
    color: #132743;
    padding-top: 5%;
    font-weight: 900;
    padding-left: 5.5%;
}
   
.nav-btn {
    font-size: 50px;
    font-weight: 700;
    cursor: pointer;
    pointer-events: none;
    color: #29df54;
    margin-top: 30% !important;
    padding-top: 80px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
    transform: translateY(-50%);
}
  
.nav-btn .prev-slide {
    text-decoration: none;
}
  
.nav-btn:active, .nav-btn:hover, .nav-btn:focus {
    text-decoration: none;
    color: #1fb943;
    font-weight: 900;
    border: none;
    border-color: #ffffff;
    background-color: #ffffff;
}
  
.owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev {
    cursor: pointer;
    background: #ffffff;
}
 
@media screen and (max-width: 1024px) {
    .owl-carousel {
      width: 85%;
    }
}
  
@media only screen and (max-width: 768px)
{
    .edu-img {
        width: 310px;
        margin: auto !important;
        align-items: center !important;
        justify-content: center !important;
        display: flex !important;
        float: none !important;
    }

    .edu-card-img {
        align-items: center !important;
        margin: auto !important;
        justify-content: center !important;
        display: flex !important;
        float: none !important;
        margin-bottom: 8% !important;
    }

    .edu-card {
        padding: 5%;
        margin: 7% 3% !important;
    }

    .top-head {
        margin-top: 10% !important;
    }

    .owl-carousel {
        width: 80%;
    }
}



/* Experience Page */
.work-card {
    background-color: #f9d8bd;
    padding: 2% 1%;
    margin-top: 3%;
    border-radius: 7px;
}

@media only screen and (max-width: 768px)
{
    .work-card {
        padding: 5%;
        margin: 7% 3% !important;
    }
}


/* Achievements Page */
.achievement-img {
    width: 280px;
}

.achievement-ul {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

.achievement-ul li {
    max-width: 480px;
    list-style-type: none !important;
}

.achievement-ul li::before {
    font-family: FontAwesome;
    content: "\f184";
    margin-right: 8px;
    color: #fdca5d !important;
    font-size: 18px;
}

.interview-ul li {
    list-style-type: none !important;
}

.interview-ul li::before {
    font-family: FontAwesome;
    content: "\f184";
    margin-right: 8px;
    color: #57f364db !important;
    font-size: 18px;
}

.publication-ul li {
    display: inline;  
    list-style-type: none !important;
}

.publication-ul li::before {
    font-family: FontAwesome;
    content: "\f184";
    margin-right: 14px;
    color: #f28bac !important;
    font-size: 18px;
}

.publication-ul a {
    margin-left: 15px;
}

@media only screen and (max-width: 768px)
{
    .achievement-ul {
        -webkit-column-count: 1;
        -moz-column-count: 1;
        column-count: 1;
    }
}


/* Blog Page */
.blog-btn {
    background-color: #2453aa !important;
}

.blog-btn:hover,.blog-btn:focus,.blog-btn:active {
    background-color: #113880 !important;
}

.blog-card {
    background-color: #f5b939;
}

.blog-card h5 {
    color: #2961c9;
}

.fa-calendar {
    margin-right: 2%;
    font-size: 21px;
}



/* Prevent horizontal scroll */
html {
    overflow-x: hidden;
}