/* ===================================
    Crafto - Freelancer
====================================== */
/* font */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap');
/* variable */
:root {     
    --base-color: #c2001c;
    --light-medium-gray:#e9e9e9;
    --primary-font: 'Inter', sans-serif;
    --alt-font: 'Inter', sans-serif;
    --dark-gray: #1d1d1b;
}
body { font-size: 17px; line-height: 24px; color:var(--dark-gray); }
section { padding-top: 90px; padding-bottom: 90px; }
/* bg sliding line */
.bg-sliding-line { background-image: linear-gradient(135deg, transparent 45%, #9c2531 45%, #9c2531 55%, transparent 0); background-size: 5px 5px; }
/* header */
.header-push-button .push-button { height: 8px; }
header .navbar-brand img { max-height: 48px; }
.header-push-button .push-button span:first-child { width: 15px; margin-right: 0; }
.show-menu .header-push-button .push-button span:nth-child(1) { width: 15px; top: 0; }
.show-menu .header-push-button .push-button span:nth-child(2) { top: 6px; -webkit-transform: rotate(0deg); transform: rotate(0deg); }
.hamburger-logo img { max-height: 48px; }
.hamburger-nav { width: 100% !important; }
.menu-item-list .nav-link { font-size: 45px; line-height: 40px; }
.menu-logo { position:absolute; top:25px; left:60px; }
.header-social-icon-hamburger-menu { display:none; }


/* font size */
.fs-335 { font-size: 20.938rem; line-height: 18.75rem; }
/* margin */
.mt-minus-40px { margin-top: -40px; }
/* top left right bottom */
.top-20 { top: 20%; }
.top-35 { top: 35%; }
.gutter-medium { margin-left: -7px; margin-right: -7px; }
.portfolio-transform .portfolio-box .caption { padding: 20px 20px 10px; }
.progress-bar-style-01 .progress .progress-bar-percent:after { border-top-color: #000; }
/* bg gradient color */
.bg-gradient-top-very-light-gray { background-image:linear-gradient(to top, #ffffff, #ffffff, #fcfafa, #fcfafa, #f7f7f7); }
/* text shadow large */
.text-shadow-large { text-shadow: 0 20px 60px rgb(0, 0, 0, 0.15); }
.outside-box-bottom-2 { margin-bottom: -2vw; }

/* menu hamburger */
.header-push-button .push-button span { width: 50px; }
.header-push-button .push-button span:nth-child(2) { top: 10px; }
.header-push-button .push-button span:first-child { width: 50px; }
.header-push-button .push-button { height: 12px; }
.header-push-button .push-button { width: 50px; }
.fs-13 { font-size: 13px !important; }
.fs-12 { font-size: 12px !important; }
.fs-11 { font-size: 11px !important; }
.fs-10 { font-size: 10px !important; }
.menu-item-list .nav-link { font-size: 70px; line-height: 75px; font-weight:bold; }
.menu-list-wrapper { height: calc(100vh - 15px); }
.push-menu .close-menu { height: 68px; width: 68px; }

.mb-100px { margin-bottom: 100px; }
.mt-100px { margin-top: 100px; }
.pb-100px { padding-bottom: 100px; }
.pt-100px { padding-top: 100px; }

.modal-dialog.custom-modal { max-width: 50vw; height: auto; }
.modal-content.custom-modal-content { height: 100%; background-color: #1d1d1b; color: white; overflow-y: auto; text-align:left; }
.portfolio-wrapper { margin-top: 30px; }
.btn-close-custom { top: 20px; right: 20px; z-index: 1055; background: transparent; border: none; padding: 10px; cursor: pointer; }

.bg-gradient-very-light-gray { background-image: linear-gradient(to bottom, #808080, #737373, #646464, #292929, #000); }
.modal-content p { margin-bottom: 10px; }

@media only screen and (max-width: 1700px) {
    .hamburger-nav { width: 35%; }
}

@media only screen and (max-width: 1600px) {
    .fs-335 { font-size: 15.625rem; line-height: 15.625rem; }
    .left-img { width: 300px; }
}

@media only screen and (max-width: 1399px) {
    .left-img { width: 250px; }
    .hamburger-nav { width: 40%; }
    .fs-335 { font-size: 12.5rem; line-height: 12.5rem; }
    .modal-dialog.custom-modal { max-width: 70vw; height: auto; }
}

@media only screen and (max-width: 1199px) {
    .fs-335 { font-size: 10.625rem; line-height: 10.625rem; }
    .menu-item-list .nav-link { font-size: 50px; line-height: 50px; }
    .menu-list-wrapper { height: calc(100vh - 100px); padding: 20px 0; }
}

@media only screen and (max-width: 991px) {
    section { padding-top: 75px; padding-bottom: 75px; }
    .menu-item-list .nav-link { padding: 0 20px 0 0; }
    .header-icon .default-logo { display:none !important; }
    .header-icon .header-social { visibility: visible !important; opacity: 1 !important; width: auto !important; display: inline !important; }
    .icon-extra-large { font-size: 40px; }
    .modal-dialog.custom-modal { max-width: 80vw; height: auto; }
}

@media only screen and (max-width: 767px) {
    .fs-335 { font-size:6.25rem; line-height: 6.25rem; }
    section { padding-top: 50px; padding-bottom: 50px; }
    .sm-mt-150px { margin-top: 150px !important; }
}

@media only screen and (max-width: 576px) {
    .navbar-brand a { display:none !important; }
    .hamburger-menu { padding-left:45px; }
    .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl { padding-right: 50px; padding-left: 50px; }
    h2, .h2 { font-size: 2.5rem; line-height: 2.75rem; }
    .header-social-icon-hamburger-menu { display:block; }
    .menu-item-list .nav-link { font-size: 30px !important; line-height: 30px !important; }
    .modal-dialog.custom-modal { max-width: 80vw !important; margin: auto; }
}