/*
Theme Name: Custom Framework
Theme URI: https://boostbydesign.com
Description:
Author: Boost by Design
Author URI: https://boostbydesign.com
Template: Total
Version: 4.7.1
*/

/**********
01 Fonts
02 Global colors
03 Header & Menu
04 UX Elements (buttons, accordions, etc.)
05 Slider/Hero
06 Design Elements
07 Gravity Forms
08 Sidebar
09 Blog
10 Footer
11 eCommerce
12 Media Queries
**********/

/*** 01 fonts ***/
html {font-size:62.5%;}

body, p, h5, h6 {
    font-family: "Barlow", sans-serif;
    font-weight: 400;
    color: #0a0a0a;
    font-size:2.2rem;
    line-height:2.6rem;
}

h1, h2, h3, h4 {
    font-family: "Plus Jakarta Sans", sans-serif;
    color: #232d36;
    z-index: 1;
    font-size: 4.8rem;
    font-weight: 600;
    position: relative;
}

h2 {
    font-size: 3.2rem;
}

h3 {
    font-size: 2.8rem;
}

h4 {
    font-size: 2rem;
}


.subtitle {
    font-size: 0.7em;
    font-weight: 600;
}

/*** 02 global colors ***/
.black {color: #1f271b;}
.blue, .blue p, .blue h4 {color: #232d36;}
.white, .white h1, .white h2, .white h3, .white h4, .white p {color: #f0eff4;}
.red, .red p, .red h2 {color: #7d1418;}
.dark-red {color: #5e0b15;}

.black-bg{background-color: #1f271b;}
.blue-bg {background-color: #0a2a76;}
.white-bg {background-color: #f0eff4;}
.red-bg {background-color: #7d1418;}
.dark-red-bg {color: #5e0b15;}

/*** 03 header & menu ***/
.link-inner {
    color: #5e0b15;
    font-weight: 400;
}

.wpex-icon svg {
    fill: rgb(20 20 20);
    font-size: 2em;
}

/*** 04 ux elements ***/
* { transition: all 0.25s ease; }

.white-btn, .theme-button.white-btn {
    background-color: #f0eff4;
    border-radius: 4px;
    color: #7d1418;
    font-size: 0.9em;
    font-family: "Barlow", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 36px;
}

.white-btn:hover, .theme-button.white-btn:hover {
    background-color: rgb(240 239 244 / 80%);
    color: #7d1418;
}

.red-btn {
    background-color: #7d1418;
    border-radius: 4px;
    color: #f0eff4;
    font-size: 0.9em;
    font-family: "Barlow", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 36px;
}

.red-btn:hover {
    background-color: rgb(125 20 24 / 80%);
}

.blue-btn, .theme-button {
    background-color: #0a2a76;
    border-radius: 4px;
    color: #f0eff4;
    font-size: 0.9em;
    font-family: "Barlow", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 36px;
}

.blue-btn:hover {
    background-color: rgb(10 42 118 / 80%);
}

.black-btn {
    background-color: #1f271b;
    border-radius: 4px;
    color: #f0eff4;
    font-size: 0.9em;
    font-family: "Barlow", sans-serif;
    font-weight: 600;
    text-transform: uppercase;
    padding: 12px 36px;
}

.black-btn:hover {
    background-color: rgb(31 39 27 / 80%);
}

/*** 05 slider/hero  ***/

/*** 06 design elements ***/
img {
    border-radius: 4px;    
}

.box-float {
    margin-inline-start: -100px;    
    /* margin-block-start: 20px; */
    padding: 20px 40px 60px 20px;
    border-radius: 4px;
    box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -webkit-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -moz-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    border-left: 20px solid #fff;
}

.box-float-right {
    margin-inline-end: -100px;    
    /* margin-block-end: 20px; */
    padding: 20px 40px 60px 20px;
    border-radius: 4px;
    box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -webkit-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -moz-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    border-right: 20px solid #fff;
}

.white-divider {
    height: 2px;
    width: 33%;
    margin-left: 0;
}

.service-text {
    padding: 20px 10px;
    border-radius: 0 0 4px 4px;
    /* border-radius: 20px; */
}

.text-icon h3 {
    font-size: 1em;
    font-weight: 400;
}

.markets .wpb_text_column {
    padding: 25px 15px;
    border-radius: 4px;
    /* min-height: 200px; */
    box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -webkit-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -moz-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
}

.markets img {
    box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -webkit-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -moz-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
}

.markets .wpb_text_column p {
    font-size: 0.8em;
}

.markets .wpb_text_column h4 {
    margin: 0;
}

hr.market-divider {
    width: 50%;
    margin: 15px 0;
    height: 2px;
}

hr.market-divider-blue {
    width: 50%;
    margin: 15px 0;
    height: 2px;
    background-color: #1f271b;
} 

.vcex-ib-caption.wpex-text-lg {
    font-size: 0.8em !important;
}

.vcex-image-banner
 {
    border-radius: 4px;
    margin-bottom: 5px;
    box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -webkit-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
    -moz-box-shadow: 0px 8px 22px -2px rgba(0,0,0,0.37);
}


.page-id-189 .vcex-ib-caption {
    min-height: 200px;
}


/*** 07 forms ***/
.gform_legacy_markup_wrapper label.gfield_label, .gform_legacy_markup_wrapper legend.gfield_label {
    font-weight: 500 !important;
}

#gform_submit_button_1 {
    background: #7d1418;
    padding: 10px 50px;
}

.text-radius {
    border-radius: 4px;
}
/*** 08 sidebar ***/

/*** 09 blog ***/
.vcex-blog-entry-title {
    font-size: 0.9em;
}

.vcex-blog-entry-date {
    font-size: 0.6em;
}

.vcex-blog-entry-details .theme-button {
    background: #7d1418;
    font-size: 0.7em;
}

.vcex-blog-entry-details .theme-button:hover {
    background: rgb(125 20 24 / 80%);
}

/*** 10 footer ***/
.copyright p {
    font-size: 0.7em;
    line-height: 0.9em;
}

.copyright a {
    color: #fff;
}

/*** 11 eCommerce ***/

/*** 12 media queries ***/

@media screen and (max-width: 1055px) {
  .box-float-right {
    margin-inline-end: 0;
  }
  
  .box-float {
    margin-inline-start: 0;
  }
}

@media screen and (max-width: 1055px) {
.link-inner {
    font-size: 0.8em;
}
}

@media screen and (max-width: 961px) {
.link-inner {
    font-size: 2em;
}
}
