@charset "UTF-8";
/*
Theme Name: Firma IT
Theme URI: https://github.com/elementor/hello-theme/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: NPC
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/
/********************* Atoms – Variables, Typography, Buttons, Body Copy Etc. *********************/
/****************************************

ATOMS
Table of Contents

Variables
Colors
Normalizer
Typography
Animation
Links
Buttons
Icon Lists
Accordians

*****************************************/
/*********************

Variables

*********************/
/*********************

GLOBAL COLORS
Used throughout the website

*********************/
html {
  font-size: 16px;
}

/*********************

NORMALIZER FOR ELEMENTOR
Remove some of Elementor's margin/padding classes

*********************/
/**** REMOVE SPACE BELOW TEXT ****/
.text-space-bottom-none, .elementor-element.elementor-widget-heading.text-space-bottom-none h1.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h2.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h3.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h4.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h5.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h6.elementor-heading-title, .elementor-element.elementor-widget-heading.text-space-bottom-none h6.elementor-heading-title, .text-space-bottom-none p {
  margin-bottom: 0;
}

p:last-child {
  margin-bottom: 16px;
}

p {
  margin-bottom: 1.44rem;
}

h1.entry-title {
  display: none;
}

.site-header {
  display: none;
}

p strong {
  color: #2E2E2E;
}

/*********************

TYPOGRAPHY

*********************/
.elementor-widget-heading h1 {
  margin-bottom: 24px;
}
@media (max-width: 767px) {
  .elementor-widget-heading h1 {
    margin-bottom: 8px;
  }
}
.elementor-widget-heading h2 {
  margin-bottom: 48px;
}
@media (max-width: 767px) {
  .elementor-widget-heading h2 {
    margin-bottom: 8px;
  }
}
.elementor-widget-heading h3 {
  margin-bottom: 8px;
}
.elementor-widget-heading h4 {
  margin-bottom: 8px;
}
.elementor-widget-heading h5 {
  margin-bottom: 8px;
}
.elementor-widget-heading h1 b, .elementor-widget-heading h2 b, .elementor-widget-heading h3 b, .elementor-widget-heading h4 b, .elementor-widget-heading h5 b, .elementor-widget-heading h6 b {
  font-weight: bold;
  color: #21ADE0;
}

pre {
  background: white;
  padding: 24px;
}

/*********************

Animation
Default animation properties

*********************/
li.elementor-icon-list-item .elementor-icon-list-icon, li.elementor-icon-list-item, .elementor-button-c-danger .elementor-button, .elementor-button-c-warning .elementor-button, .elementor-button-c-success .elementor-button, .elementor-button-c-info .elementor-button, .elementor-widget-button .elementor-button {
  transition: all 0.5s ease;
}

/*********************

LINKS

*********************/
/*********************

BUTTONS

*********************/
.elementor-button-c-info .elementor-button, .elementor-widget-button .elementor-button {
  background: transparent;
}
.elementor-button-c-info .elementor-button:hover, .elementor-widget-button .elementor-button:hover {
  background: #21ADE0;
}

.elementor-button-c-success .elementor-button {
  background: transparent;
}
.elementor-button-c-success .elementor-button span {
  color: white;
}
.elementor-button-c-success .elementor-button:hover {
  background: #21ADE0;
}

.elementor-button-c-warning .elementor-button {
  background: transparent;
}
.elementor-button-c-warning .elementor-button span {
  color: #000C2C;
}
.elementor-button-c-warning .elementor-button:hover {
  background: #21ADE0;
  color: white;
}

.elementor-button-c-danger .elementor-button {
  background: #000C2C;
}
.elementor-button-c-danger .elementor-button:hover {
  background: black;
}

/****************************************

Default Horizontal Bar

*****************************************/
hr {
  color: #cccccc;
  padding-top: 8px;
  padding-bottom: 8px;
}

/****************************************

ICON LISTS

*****************************************/
.elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child) {
  padding-bottom: inherit;
}

.elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child) {
  margin-top: inherit;
}

.elementor-inline-item {
  border: none !important;
}
.elementor-inline-item span.elementor-icon-list-text.elementor-post-info__item {
  border: none !important;
  padding: 16px;
}

li.elementor-icon-list-item {
  padding: 24px;
  display: flex;
  border-top: 0.5px solid #000000;
}
li.elementor-icon-list-item:first-child {
  border-top: none;
}
li.elementor-icon-list-item a:hover {
  color: #000C2C;
}
li.elementor-icon-list-item i {
  color: #21ADE0;
}
li.elementor-icon-list-item .elementor-icon-list-icon {
  padding: 16px;
  height: 100%;
  display: inline-block;
  text-align: center;
  align-self: center;
}
@media (max-width: 1139px) {
  li.elementor-icon-list-item .elementor-icon-list-icon {
    margin: -8px 0;
  }
}
@media (max-width: 767px) {
  li.elementor-icon-list-item .elementor-icon-list-icon {
    margin: 0px;
    padding: 16px;
  }
}
li.elementor-icon-list-item .elementor-icon-list-text {
  padding-left: 16px !important;
  padding-top: 16px;
  padding-bottom: 16px;
  border-left: 0.5px solid #000000;
  transition: ease all 0.5s;
}
li.elementor-icon-list-item:hover {
  transition: scale(1.1);
}
/****************************************

ACCORDION ELEMENTS

*****************************************/
.elementor-accordion-item {
  margin: 8px 0;
}
.elementor-accordion-item .elementor-tab-title {
  padding: 24px 15px;
}
.elementor-accordion-item .elementor-tab-title a {
  color: #000C2C;
}
.elementor-accordion-item .elementor-tab-title .elementor-accordion-icon {
  color: #000C2C;
}

/********************* Design Rangers Elementor Spacing *********************/
/****************************************

DEFAULT COLUMN PADDING
Column padding applied to Elementor.
Overrides 10px default padding.

*****************************************/
.section-pbxxl, .section-pbxl, .section-pbl, .section-pbm, .section-pbs, .section-pbn, .section-ptxxl, .section-ptxl, .section-ptl, .section-ptm, .section-pts, .section-ptn {
  padding-left: 24px;
  padding-right: 24px;
}

.section-default-pad {
  padding: 80px 24px;
}
@media (max-width: 1139px) {
  .section-default-pad {
    padding: 80px 24px;
  }
}
@media (max-width: 767px) {
  .section-default-pad {
    padding: 40px 24px;
  }
}

.elementor-column-gap-default > .elementor-column > .elementor-element-populated {
  padding: 24px;
}
@media (max-width: 1139px) {
  .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
    padding: 16px;
  }
}
@media (max-width: 767px) {
  .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
    padding: 24px 16px;
  }
}

/****************************************

SECTION PADDING – TOP
Used to change default spacing on sections.
Applied by using custom dropdown elements added to Elementor sections.

*****************************************/
.section-ptn {
  padding-top: 0px !important;
}

.section-pts {
  padding-top: 24px;
}
@media (max-width: 767px) {
  .section-pts {
    padding-top: 24px;
  }
}

.section-ptm {
  padding-top: 80px;
}
@media (max-width: 767px) {
  .section-ptm {
    padding-top: 24px;
  }
}

.section-ptl {
  padding-top: 96px;
}
@media (max-width: 767px) {
  .section-ptl {
    padding-top: 32px;
  }
}

.section-ptxl {
  padding-top: 136px;
}
@media (max-width: 767px) {
  .section-ptxl {
    padding-top: 32px;
  }
}

.section-ptxxl {
  padding-top: calc(122px + 12%);
}
@media (max-width: 767px) {
  .section-ptxxl {
    padding-top: 56px;
  }
}

.no-pad .elementor-widget-wrap.elementor-element-populated {
  padding: 0px !important;
}

/****************************************

SECTION PADDING – BOTTOM
Used to change default spacing on sections.
Applied by using custom dropdown elements added to Elementor sections.

*****************************************/
.section-pbn {
  padding-bottom: 0px !important;
}

.section-pbs {
  padding-bottom: 24px;
}
@media (max-width: 767px) {
  .section-pbs {
    padding-bottom: 24px;
  }
}

.section-pbm {
  padding-bottom: 80px;
}
@media (max-width: 767px) {
  .section-pbm {
    padding-bottom: 24px;
  }
}

.section-pbl {
  padding-bottom: 96px;
}
@media (max-width: 767px) {
  .section-pbl {
    padding-bottom: 32px;
  }
}

.section-pbxl {
  padding-bottom: 136px;
}
@media (max-width: 767px) {
  .section-pbxl {
    padding-bottom: 48px;
  }
}

.section-pbxxl {
  padding-bottom: calc(124px + 6%);
}
@media (max-width: 767px) {
  .section-pbxxl {
    padding-bottom: 48px;
  }
}

/****************************************

ELEMENTOR COLUMN GAPS

*****************************************/
.elementor-column-gap-narrow > .elementor-row > .elementor-column > .elementor-element-populated {
  padding: 16px;
}
@media (max-width: 767px) {
  .elementor-column-gap-narrow > .elementor-row > .elementor-column > .elementor-element-populated {
    padding: 16px 0px;
  }
}

.elementor-column-gap-extended > .elementor-row > .elementor-column > .elementor-element-populated {
  padding: 32px;
}
@media (max-width: 767px) {
  .elementor-column-gap-extended > .elementor-row > .elementor-column > .elementor-element-populated {
    padding: 24px 0px;
  }
}

.elementor-column-gap-wide > .elementor-row > .elementor-column > .elementor-element-populated {
  padding: 48px;
}
@media (max-width: 767px) {
  .elementor-column-gap-wide > .elementor-row > .elementor-column > .elementor-element-populated {
    padding: 24px 0px;
  }
}

.elementor-column-gap-widers > .elementor-row > .elementor-column > .elementor-element-populated {
  padding: 64px;
}
@media (max-width: 767px) {
  .elementor-column-gap-widers > .elementor-row > .elementor-column > .elementor-element-populated {
    padding: 24px 0px;
  }
}

.h1.entry-title {
  display: none;
}

/********************* Helper Classes *********************/
/****************************************

HELPER CLASSES

Table of Contents

Color
Type Manipulation
Margin Manipulation
Columns Cards
Card Wrap

*****************************************/
/****************************************

COLOR
Color Classes (see atom.scss to set colors)

*****************************************/
.lbc {
  background: rgba(0, 0, 0, 0.07);
}

.dbc {
  background: #000C2C;
}

.wht {
  color: white !important;
}
.wht .elementor-kit-53 h1, .wht h2, .wht h3, .wht h4, .wht h5, .wht h6 {
  color: white !important;
}

.primary {
  color: black;
}
.primary .elementor-kit-53 h1, .primary h2, .primary h3, .primary h4, .primary h5, .primary h6, .primary p {
  color: black;
}

.secondary {
  color: inherit;
}
.secondary .elementor-kit-53 h1, .secondary h2, .secondary h3, .secondary h4, .secondary h5, .secondary h6, .secondary p {
  color: inherit;
}

.blk {
  color: inherit;
}
.blk .elementor-kit-53 h1, .blk h2, .blk h3, .blk h4, .blk h5, .blk h6, .blk p {
  color: inherit;
}

/****************************************

Type Manipulation
classes for making text small, large
or more narrow

*****************************************/
/**** SMALLER BODY FONT ****/
.text-small, .text-small p {
  font-size: 0.72rem;
  line-height: auto;
}
@media (max-width: 767px) {
  .text-small, .text-small p {
    font-size: 0.54rem;
  }
}

/**** LARGER BODY FONT FOR INTRO TEXT ****/
.text-intro, .text-intro p {
  font-size: 0.99rem;
}
@media (max-width: 767px) {
  .text-intro, .text-intro p {
    font-size: 1.08rem;
  }
}

/**** NARROW TEXT FOR BETTER READABILITY ****/
.text-narrow {
  max-width: 800px;
}

/**** NARROW TEXT CENTERED ****/
.text-narrow-centered {
  max-width: 800px;
  margin: 0 auto;
}

.text-centered {
  text-align: center;
}

@media (max-width: 544px) {
  /**** SMALLER BODY FONT ****/
  .text-small, .text-small p {
    font-size: 13px;
  }

  /**** LARGER BODY FONT FOR INTRO TEXT ****/
  .text-intro, .text-intro p {
    font-size: 0.36rem;
  }
}
/****************************************

Margin Manipulation Classes
Classes to manuplation margins for headllines
mbn = Margin bottom none
mbxd = Margin bottom Extra Small
mbs = Margin bottom Extra Small
mbm = Margin bottom Extra Medium
mbl = Margin bottom Large
mbxl = Margin bottom Extra Large

*****************************************/
/**** Classes for Better Margin Control ****/
.mbn, .mbn.elementor-widget, .mbn.elementor-widget:not(:last-child), .mbn h1, .mbn h2, .mbn h3, .mbn h4, .mbn h5, .mbn h6, .mbn p {
  margin-bottom: 0 !important;
}

.mbxs, .mbxs.elementor-widget, .mbxs h1, .mbxs h2, .mbxs h3, .mbxs h4, .mbxs h5, .mbxs h6, .mbxs p {
  margin-bottom: 4px;
}

.mbs, .mbs.elementor-widget, .mbs h1, .mbs h2, .mbs h3, .mbs h4, .mbs h5, .mbs h6, .mbs p {
  margin-bottom: 8px;
}

.mbm, .mbm.elementor-widget, .mbm h1, .mbm h2, .mbm h3, .mbm h4, .mbm h5, .mbm h6, .mbm p {
  margin-bottom: 16px;
}

.mbl, .mbl.elementor-widget {
  margin-bottom: 24px;
}

.mbxl, .mbxl.elementor-widget {
  margin-bottom: 40px;
}

@media (max-width: 1139px) {
  .mbl, .mbl.elementor-widget {
    margin-bottom: 18px;
  }

  .mbxl, .mbxl.elementor-widget {
    margin-bottom: 20px;
  }
}
/****************************************

COLUMN – CUSTOM LEFT & RIGHT PADDING
Used to add extra left or right padding to a column.
Using clear, plain language when possible.

*****************************************/
@media (min-width: 1139px) {
  .extra-space-right .elementor-widget-wrap.elementor-element-populated {
    padding-right: calc(24px + 5%);
  }

  .extra-space-left .elementor-widget-wrap.elementor-element-populated {
    padding-left: calc(24px + 5%);
  }
}
/****************************************

COLUMN CARDS
Helper classes applied to Elementor columns to make them appear as cards.

*****************************************/
.elementor-row > .elementor-column.card > .elementor-element-populated {
  background: #fff;
  border: 1px solid #D2D1CC;
  border-radius: 10px;
}

.elementor-column-gap-default > .elementor-row > .elementor-column.card > .elementor-element-populated {
  margin: 24px;
  padding: 32px;
}
@media (max-width: 1139px) {
  .elementor-column-gap-default > .elementor-row > .elementor-column.card > .elementor-element-populated {
    margin: 16px;
    padding: 24px;
  }
}
@media (max-width: 767px) {
  .elementor-column-gap-default > .elementor-row > .elementor-column.card > .elementor-element-populated {
    margin: 24px 0;
    padding: 24px;
  }
}

.elementor-column-gap-narrow > .elementor-row > .elementor-column.card > .elementor-element-populated {
  margin: 8px;
  padding: 32px;
}
@media (max-width: 1139px) {
  .elementor-column-gap-narrow > .elementor-row > .elementor-column.card > .elementor-element-populated {
    margin: 8px;
    padding: 24px;
  }
}
@media (max-width: 767px) {
  .elementor-column-gap-narrow > .elementor-row > .elementor-column.card > .elementor-element-populated {
    margin: 8px 0;
    padding: 24px;
  }
}

.elementor-column-gap-default > .elementor-row > .elementor-column.card > .elementor-element-populated .elementor-widget-image, .elementor-column-gap-narrow > .elementor-row > .elementor-column.card > .elementor-element-populated .elementor-widget-image {
  margin: -16px -16px 24px -16px;
  width: calc(100% + 32px);
}

/****************************************

CARD WRAP
Allow new cards to wrap to the next row instead of adding additional columns to the same row.
*Note these are testing on the new version of Elementor and they no longer seem to be working

*****************************************/
.section-card-wrap {
  /**** Two column cards****/
  /**** Three column cards ****/
}
.section-card-wrap .elementor-container {
  flex-wrap: wrap;
}
.section-card-wrap .one-col {
  flex: 0 0 100%;
}
@media (max-width: 1139px) {
  .section-card-wrap .one-col {
    flex: 0 0 100%;
  }
}
.section-card-wrap .two-col {
  flex: 0 1 50%;
}
@media (max-width: 1139px) {
  .section-card-wrap .two-col {
    flex: 0 1 50%;
  }
}
@media (max-width: 767px) {
  .section-card-wrap .two-col {
    flex: 0 1 50%;
  }
}
@media (max-width: 767px) {
  .section-card-wrap .two-col.dont {
    flex: 0 0 50% !important;
  }
}
.section-card-wrap .three-col {
  flex: 0 1 33.333%;
}
@media (max-width: 1139px) {
  .section-card-wrap .three-col {
    flex: 0 1 33.333%;
  }
}
@media (max-width: 767px) {
  .section-card-wrap .two-col, .section-card-wrap .three-col {
    flex: 0 0 100%;
  }
}

/********************* Theme Specific Custom Styling *********************/
.grid {
  background-image: url("/wp-content/uploads/2020/10/Grid.png");
  background-repeat: repeat;
  background-position: top;
  background-size: 24px;
}

.elementor-widget-call-to-action h6 {
  font-size: 1rem;
  opacity: 0;
  transition: ease all 0.5s;
}
.elementor-widget-call-to-action .elementor-cta__description {
  font-size: 14px;
  opacity: 0;
  transition: ease all 0.5s;
}
.elementor-widget-call-to-action:hover h6, .elementor-widget-call-to-action:hover .elementor-cta__description {
  opacity: 1;
}

@media (max-width: 767px) {
  .responsiveMenu {
    position: fixed;
    bottom: 0px;
    background: #000C2C;
    width: 100%;
  }
}

.only-mobile {
  display: none;
}
@media (max-width: 1139px) {
  .only-mobile {
    display: block;
  }
}

li.hide-desktop.menu-item.menu-item-type-post_type.menu-item-object-page {
  display: none;
}
@media (max-width: 1139px) {
  li.hide-desktop.menu-item.menu-item-type-post_type.menu-item-object-page {
    display: block;
  }
}

.elementor-sticky--effects {
  background: #000C2C;
  transition: ease all 0.5s;
}