/*
 Theme Name: ITA BASE
 Author: IT
 Description: Custom theme for Wordpress based on Bootstrap 5.3
 Version: 0.0.1
 */
@import url("https://fonts.googleapis.com/css?family=Montserrat");
@import url("https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;200;300;400;500;600;700&display=swap");
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");

/*------------------------------
 F *ADE IN EFFECT
 ------------------------------*/
@keyframes fadein {
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-moz-keyframes fadein { /* Firefox */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-webkit-keyframes fadein { /* Safari and Chrome */
    from {
        opacity:0;
    }
    to {
        opacity:1;
    }
}
@-o-keyframes fadein { /* Opera */
    from {
        opacity:0;
    }
    to {
        opacity: 1;
    }
}
/*------------------------------
 G *ENERAL
 ------------------------------*/

body {
    -webkit-font-smoothing: antialiased;
    background-color: #eee;
    font-family: 'Montserrat', sans-serif;
    font-size: 17px;
    line-height: 1.5;
    overflow-x: hidden;
    color:#555;
    animation: fadein 2s;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */
}
body a {
    outline: none !important;
}
a {
    color: #333;
}
a:hover {
    color: #444;
}
a:link { text-decoration: none; }

h1, h2, h3, h4, h5, .diplay-1, .diplay-2, .diplay-3, .diplay-4, .diplay-5, .diplay-6, legend {font-family: 'Josefin Sans', sans-serif;}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
}

.display-4 {font-size: 2.5rem;}

.text-primary {color:#333 !important}
.text-secondary {color:#ed6003 !important}
.bg-primary {color:#fff !important;background:#ed6003 !important}
.bg-secondary {background:#eee !important}
.bg-lightgray {background:#fafafa !important}
.text-orange {color: #ed6003;}
strong {color:#212529}

.rounded {border-radius: 25px!important;}
.square {border-radius: 0 !important;}
.pb-6, .py-6 {
    padding-bottom: 3.5rem!important;
}
.pt-6, .py-6 {
    padding-top: 3.5rem!important;
}
.display-lead {
    font-size: 3.5rem;
    font-weight: 300;
    line-height: 1.2;
}
.display-4 {
    font-size: 2.5rem;
}
.page-numbers {
    padding: 9px 9px;
    margin: 0 0 9px 0;
    display: inline-block;
}

.navbar {
    padding: 0;
}
img.logo {
    height: auto;
    max-width: 120px;
}

p#breadcrumbs {
    font-size: .7rem;
    padding: 9px 0 0 9px;
    margin-bottom: 9px;
}

#loginform label {
display: block;
margin-bottom: 0.5rem;
}
.bd-callout .btn:hover {
    color: #212529 !important;
}
.input {
    display: block;
    width: 100%;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: var(--bs-body-color);
    background-color: var(--bs-form-control-bg);
    background-clip: padding-box;
    border: var(--bs-border-width) solid var(--bs-border-color);
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.375rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.input:focus {
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    outline: 0;
    box-shadow: 0 0 0 0 rgb(0 123 255 / 25%);
}
/*------------------------------
 C *ALLOUTS
 ------------------------------*/

.bd-callout {
    padding: 1.25rem;
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    color: var(--bd-callout-color, inherit);
    background-color: var(--bd-callout-bg, var(--bs-gray-100));
    border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

.bd-callout-danger {
    --bd-callout-color: var(--bs-danger-text);
    --bd-callout-bg: var(--bs-danger-bg-subtle);
    --bd-callout-border: var(--bs-danger-border-subtle);
}

.bd-callout-info {
    --bd-callout-color: var(--bs-info-text);
    --bd-callout-bg: var(--bs-info-bg-subtle);
    --bd-callout-border: var(--bs-info-border-subtle);
}

.bd-callout-warning {
    --bd-callout-color: var(--bs-warning-text);
    --bd-callout-bg: var(--bs-warning-bg-subtle);
    --bd-callout-border: var(--bs-warning-border-subtle);
}

/*------------------------------
 G *TRANSLATE
 ------------------------------*/

.gtranslate_wrapper img {
    margin: 3px 6px !important;
}

/*------------------------------
 P *ROGRESSBAR
 ------------------------------*/
.prog.card{z-index: 0;border: none;border-radius: 0.5rem;position: relative}
#progressbar{overflow: hidden;color: lightgrey;padding:0;font-family: 'Josefin Sans', sans-serif;}
#progressbar .active{color: #000000}
#progressbar li{list-style-type: none;font-size: 12px;width: 33.3%;float: left;position: relative;text-align: center!important;}
#progressbar #account:before{font-family: "bootstrap-icons"; content: "\f4da";}
#progressbar #post_job:before{font-family: "bootstrap-icons"; content: "\f1d6";}
#progressbar #view_offers:before{font-family: "bootstrap-icons"; content: "\f1cb"}
#progressbar li:before{width: 50px;height: 50px;line-height: 45px;display: block;font-size: 18px;color: #ffffff;background: lightgray;border-radius: 50%;margin: 0 auto 10px auto;padding: 2px}
#progressbar li:after{content: '';width: 100%;height: 2px;background: lightgray;position: absolute;left: 0;top: 25px;z-index: -1}
#progressbar li.active:before, #progressbar li.active:after{background: #ed6003}

/* FIREFOX FIX OF UGLY SELECT BOXES */
@supports (-moz-appearance:none) {

    SELECT
    {
        -moz-appearance:none !important;
        background: #ffffff url('data:image/gif;base64,R0lGODlhBgAGAKEDAFVVVX9/f9TU1CgmNyH5BAEKAAMALAAAAAAGAAYAAAIODA4hCDKWxlhNvmCnGwUAOw==') right center no-repeat !important;
        background-position: calc(100% - 5px) center !important;
    }

}

/*------------------------------
 S *OCIAL BUTTONS
 ------------------------------*/

.social {
    display: inline;
    padding-left: 0;
}
.social > li {
    display: inline-block;
    height:27px;
}
.social>li>a {
    display: inline-block;
    height:50px;
    padding: 9px 7px 0 8px;
    width: 50px;
    border-radius: 50%;
}
.btn-fb:hover, .fb>a:hover {color:#3b5998; border:#3b5998 3px solid;background-color:#fff;}
.btn-gp:hover, .gp>a:hover {color:#d34836; border:#d34836 3px solid;background-color:#fff;}
.btn-tw:hover, .tw>a:hover {color:#4099FF; border:#4099FF 3px solid;background-color:#fff;}
.btn-fb, .fb>a {color:#fff; border:#3b5998 3px solid;background-color:#3b5998;}
.btn-gp, .gp>a {color:#fff; border:#d34836 3px solid;background-color:#d34836;}
.btn-tw, .tw>a {color:#fff; border:#4099FF 3px solid;background-color:#4099FF;}

/*------------------------------
 M *ODAL
 ------------------------------*/
.modal-content {
    border-radius: 0.9rem;
}
.modal-body .close {
    margin: -15px 0 9px 0;
    font-size: 45px;
    font-weight: 200;
}

/*------------------------------
 T *IMELINE
 ------------------------------*/
.timeline {
    border-left: 6px solid #ed6003;
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px;
    /*background: rgba(114, 124, 245, 0.09);*/
    margin: 0 auto;
    letter-spacing: 0.2px;
    position: relative;
    line-height: 1.4em;
    font-size: 1.03em;
    padding: 50px;
    list-style: none;
    text-align: left;
    max-width: 81%;
}

@media (max-width: 767px) {
    .timeline {
        max-width: 98%;
        padding: 25px;
    }
}

.timeline .event {
    /*border-bottom: 1px dashed #777;*/
    padding-bottom: 25px;
    margin-bottom: 25px;
    position: relative;
}

@media (max-width: 767px) {
    .timeline .event {
        padding-top: 30px;
    }
}

.timeline .event:last-of-type {
    padding-bottom: 0;
    margin-bottom: 0;
    border: none;
}

.timeline .event:before,
.timeline .event:after {
    position: absolute;
    display: block;
    top: 0;
}

.timeline .event:before {
    left: -207px;
    content: attr(data-date);
    text-align: right;
    font-weight: 100;
    font-size: 0.9em;
    min-width: 120px;
}

@media (max-width: 767px) {
    .timeline .event:before {
        left: 0px;
        text-align: left;
    }
}

.timeline .event:after {
    -webkit-box-shadow: 0 0 0 6px #ed6003;
    box-shadow: 0 0 0 6px #ed6003;
    left: -60.3px;
    background: #fff;
    border-radius: 50%;
    height: 15px;
    width: 15px;
    content: "";
    top: 5px;
}

@media (max-width: 767px) {
    .timeline .event:after {
        left: -31.8px;
    }
}

.rtl .timeline {
    border-left: 0;
    text-align: right;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px;
    border-right: 3px solid #ed6003;
}

.rtl .timeline .event::before {
    left: 0;
    right: -170px;
}

.rtl .timeline .event::after {
    left: 0;
    right: -55.8px;
}

/*------------------------------
 N *AVBAR
 ------------------------------*/
.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none;
}
.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}

.navbar-dark .navbar-toggler {
    border-color: transparent !important;
}

.navbar-dark .navbar-nav .nav-link {
    color: #fff;
}

ul.dropdown-menu li > ul.dropdown-menu{
    left: 100%;
    top: 0;
}

ul.dropdown-menu li:hover > ul.dropdown-menu, ul.dropdown-menu li:focus > ul.dropdown-menu{
    display: block
}

.nav-link {padding: .5rem 1rem !important;
    font-weight: 900;
    font-size: 12px;
    text-transform: uppercase;
}
.dropdown-menu {
    margin: 0;
    border: 1px solid #fff;
    border-radius: 0 !important;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}
a.dropdown-item {
    color: #777;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #777;
    text-decoration: none;
    background-color: #f8f9fa;
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: #2e4369;
}


/*------------------------------
 F *ORMS
 ------------------------------*/
.nav-link, .nav-link:focus, .nav-link:hover {
    color: inherit;
}
.btn-primary.focus, .btn-primary:focus {
    box-shadow: 0 0 0 0 rgba(38,143,255,.5);
}
button:focus {
    outline: none !important;
}

.btn, .button {
    display: inline-block;
    background-image: none;
    border: 0px solid transparent;
    font-weight: bold;
    text-align: center;
    text-transform: uppercase;
    font-size: 13px;
    padding: 15px 24px;
    line-height: 1.5;
    border-radius: 25px !important;
}
.btn-sm {
    padding: 8px 24px !important;
}
.btn-lead {
    border-radius: 25px !important;
}
.form-control:focus {
    color: #495057;
    background-color: #fff;
    border: 1px solid #ced4da;
    outline: 0;
    box-shadow: 0 0 0 0 rgba(0,123,255,.25);
}
.btn-primary, .button {
    color: #fff !important;
    background-color: #ed6003 !important;
    border-color: #ed6003 !important;
}
.btn-secondary {
    color: #ffffff;
    background-color: #555;
    border-color: transparent;
}
.btn-green {
    color: #fff;
    background-color: #67A684;
    border-color: #67A684;
}
.btn-orange {
    color: #fff;
    background-color: #E09F63;
    border-color: #E09F63;
}
.btn-red {
    color: #fff;
    background-color: #981D60;
    border-color: #981D60;
}
.btn-blue {
    color: #fff;
    background-color: #73ABB7;
    border-color: #73ABB7;
}
.btn-lg {
    padding: 15px 24px;
}
.btn:hover {
    opacity: 0.7;
    color: #fff !important
}

/*------------------------------
 F *OOTER
 ------------------------------*/

.footer-secondary {
    padding: 5rem 0 0;
    min-height: 11rem;
}
.footer-primary {
    padding: 18px 0 12px 0;
}
footer {
    background: #eee;
}

/*------------------------------
 M *EDIA QUERIES
 ------------------------------*/
@media screen and (max-width: 999px) { }
@media (min-width:961px) {}
@media (max-width:768px) {
    .brand_sm {
        display: block;
        margin-left:auto;
        margin-right:auto;
        padding-right:3rem;
    }
    img.logo_sm {
        display: block;
        max-width: 141px;
        margin: 0px;
    }
    header {display:none;}
    .logo {
        margin-left: 12px;
    }
    .woocommerce ul.products[class*=columns-] li.product, .woocommerce-page ul.products[class*=columns-] li.product {
        width: 100%;
    }
    .hover_cart_box {
        width: 100%;
    }
    .woocommerce ul.products li.product a img {
        border-radius: 0 !important;
    }
    nav.woocommerce-breadcrumb {
        display:none;
    }
    .woocommerce-pagination ul.page-numbers li, .woocommerce-page .woocommerce-pagination ul.page-numbers li {
        margin-bottom: 9px !important;
    }
    .loop.woocommerce {
        margin-top: -1rem !important;
    }
    .woocommerce-ordering select {
        width: 12rem;
    }
    .woocommerce .woocommerce-result-count {
        font-size: .9rem;
        padding-top:.4rem
    }
}
@media screen and (max-width: 680px) {
    .woocommerce .woocommerce-result-count {
        font-size: .7rem;
        padding-top:.6rem
    }
    .woocommerce-ordering select {
        width: 10rem;
    }
    .display-4 {
        font-size: 2rem;
    }
    .display-lead {
        font-size: 2.5rem;
    }
}
