
:root{
    --factorBiggest: 1.4;
    --factorBig: 1.1;
    --factorNormal: 1;
    --factorTablet: .9;
    --factorCel: .65;
    --factorCelMini: .55;
    --factorCelMicro: .45;

    /* --text-hero-large:    3.3rem; */
    --text-hero-large:    3.3rem;
    --text-hero-mid:      2.5rem;
    --text-hero-small:    1.3rem;

    --text-header-large:    8rem;
    --text-header:          4rem;
    --text-subheader:       3rem;
    --text-larger:  2rem;
    --text-large:   1.3rem;
    --text-normal:  1rem;
    --text-small:   .9rem;
    --text-smaller: .8rem;

    /*colors AP*/
    --orange: #FE811B;
    --blue: #7ACFFB;
    --darkblue: #1F519C;
    --lightgrey: #E2E2F5;
    --pale: #F4E6C7;
    --darkgrey: #393e41;
    --grey: #c4c3c3;

}

body {
    overflow-x: hidden;
    margin:0px;
    display: block;
    font-family: Open Sans, Roboto, Poppins, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: black;
}

/* screen m p utils*/
.dyn-height-full {     height: 100vh; }
.dyn-height-third {     height: 20vh; }
.dyn-height-full-perc {     height: 100%; }

.dyn-margin-section         {   margin-top: 6rem;       margin-bottom: 6rem; }
.dyn-margin-section-bottom   {    margin-bottom: 6rem;      }
.dyn-padding-section        {   padding-top: 6rem;      padding-bottom: 6rem; }
.dyn-padding-section-top    {   padding-top: 6rem; }
/*CODE AP*/
.dyn-padding-section-contact    {   padding-top: 3rem;      padding-bottom: 3rem; }

.dyn-border-radius          {   border-radius: 3.5rem;   }
.dyn-border-radius-small    {   border-radius: 1.0rem;   }

.dyn-border-radius-hero     {
    border-top-left-radius: 3.5rem;     border-top-right-radius: 3.5rem;
    border-bottom-left-radius: 3.5rem;     border-bottom-right-radius: 0rem;
}

/* screen m p utils*/


/*BG utils*/
.dyn-bg-orange {        background-color: var(--orange); }
.dyn-bg-blue {          background-color: var(--blue); }
.dyn-bg-pale {          background-color: var(--pale); }
.dyn-bg-purple {        background-color: var(--purple); }
.dyn-bg-darkblue {        background-color: var(--darkblue); }
.dyn-bg-lightgrey {        background-color: var(--lightgrey); }
.dyn-bg-grey {        background-color: var(--grey); }
.dyn-bg-darkgrey {      background-color: var(--darkgrey) !important; }
/*END BG utils*/



/* + + + + + + + + + + + + +     text utils     + + + + + + + + + + + + + */
.dyn-text-bold-light {      font-weight: 500;}
.dyn-text-bold {            font-weight: 700;}

/*Colors AP*/
.dyn-orange {       color: var(--orange); }
.dyn-blue {         color: var(--blue); }
.dyn-darkblue {     color: var(--darkblue); }
.dyn-lightgrey {    color: var(--lightgrey); }
.dyn-pale {         color: var(--pale); }
.dyn-darkgrey {     color: var(--darkgrey); }
.dyn-grey {     color: var(--grey); }
.dyn-text-header-color { color: black}

.dyn-text-hero-large {          line-height: 1;     }
.dyn-text-hero-mid   {          line-height: 1;     }
.dyn-text-hero-small {          line-height: 1;     }

.dyn-text-header {          line-height: 1;     }
.dyn-text-subheader {       line-height: 1;     }
.dyn-text-larger {          line-height: 1;     }
.dyn-text-large {           line-height: 1;     }

.nav-link {
    position: relative;
    font-weight: 500;
    color: var(--darkgrey) !important;  text-shadow: white .5px .3px;
    padding:2px;     border-radius: 0;
    transition: .3s;
}
.nav-link:hover{
    background-color: rgba(255, 164, 4, .99);
    top:1px;
}

.dyn-link-contact {                                   line-height: 140%;  color:#ddf; text-decoration: none;}
.dyn-link-contact:hover { color:#ffffff }
.dyn-text-contact{
    font-weight: 400;       line-height: 1.1;   color:#ccc; color:#ddd;
    margin-top: .5rem;
}
.dyn-text-errormsg {
    font-weight: 400;       line-height: .9;    color:#ff8855;
    margin-top: .5rem;
    text-transform: uppercase;
}

/* + + + + + + + + + + + + +     END text utils     + + + + + + + + + + + + + */

.dyn-bg-top-orange {
    position: relative;
}
.dyn-bg-top-orange::before {
  position: absolute;
  content:"";

  background: var(--orange);
  top:0rem; height: 10rem;
  width: 100%;
  z-index: -1;
}


.dyn-prod-circle{
  position: relative;
}
.dyn-prod-circle::before{
  position: absolute;
  content: "";
  background-color: #FFC130;
  background-color: darkgray;
  border-radius: 50rem;
  top: -5rem; bottom: -5rem; left: 5rem; right: 5rem;
  z-index: -1;
}
.dyn-prod-circle-1{
  position: relative;
}
.dyn-prod-circle-1::before{
  position: absolute;
  content: "";
  background-color: #FFC130;
  background-color: darkgray;
  border-radius: 50rem;
  top: 5rem; bottom: 5rem; left: -5rem; right:- 5rem;
  top: 3rem; bottom: 3rem; left: -5rem; right: -5rem;
  z-index: -1;
}


.dyn-border-process{
  position: relative;
  padding:3rem;
  aborder: 2px solid #efefef;
  border-radius: 8rem;
}
.adyn-border-process::before{
  position: absolute;
  content:url('../imgs/icon_foodtruck_14.svg');
  border: 1px solid black;
  border-radius: 8rem;
  top: -2rem; width: 10rem; height: 5rem;
}
.dyn-border-proc-icons-org{
  background: white;
  position: absolute;
  top:-2rem; left: 3rem;
  width: 10rem; height: 5rem;
  border: 2px solid #FFC130;
  border-radius: 8rem;
}
.dyn-border-proc-icons{
  background: white;
  width: 10rem; height: 5rem;
  border: 2px solid #FFC130;
  border-radius: 8rem;
}


.dyn-freedom-quotes{
  position: relative;
}
.dyn-freedom-quotes::before{
  position: absolute;
  content: "";
  background:url(../imgs/left_quote.svg); background-repeat: no-repeat; background-position: center; background-size: 100%;
  top: -2rem; left:0rem; width: 5rem; height:10rem;
}
.dyn-freedom-quotes::after{
  position: absolute;
  content: "";
  background:url(../imgs/right_quote.svg); background-repeat: no-repeat; background-position: center; background-size: 100%;
  bottom: -2rem; right: 0rem; width: 5rem; height:10rem;
}

.dyn-btn-contact {
  background-color: black;
  color: white;
  transition-duration: 0.4s;
  border: 1px solid black;
  border-radius: 30px;
}
.dyn-btn-contact:hover {
  background-color: white;
  color: var(--orange);
  border: 2px solid #ffa400;
}

/* + + + + + + + + + + + + +     MediaQueries utils     + + + + + + + + + + + + + */

    .dyn-text-hero-large  {    font-size: calc( var(--text-hero-large) * var(--factorNormal) ); }
    .dyn-text-hero-mid  {    font-size: calc( var(--text-hero-mid) * var(--factorNormal) ); }
    .dyn-text-hero-small  {    font-size: calc( var(--text-hero-small) * var(--factorNormal) ); }

    .dyn-text-header-large {    font-size: calc( var(--text-header-large) * var(--factorNormal) ); }
    .dyn-text-header {          font-size: calc( var(--text-header) * var(--factorNormal) ); }
    .dyn-text-subheader {       font-size: calc( var(--text-subheader) * var(--factorNormal) ); }
    .dyn-text-larger {         font-size: calc( var(--text-larger) * var(--factorNormal) ); }
    .dyn-text-large {         font-size: calc( var(--text-large) * var(--factorNormal) ); }
    .dyn-text-normal {         font-size: calc( var(--text-normal) * var(--factorNormal) ); }
    .dyn-text-small {         font-size: calc( var(--text-small) * var(--factorNormal) ); }
    .dyn-text-smaller {         font-size: calc( var(--text-smaller) * var(--factorNormal) ); }

    .dyn-prods-icons{           height:9rem;    position:relative;  top:0rem;          }
    .dyn-servs-icons{           height:7rem;    position:relative;  top:0rem;          }
    .dyn-servs-icons-small{     height:5rem;    position:relative;  top:0rem;          }
    .dyn-delivery-bordertop{    border-top: 3px solid #00B1DA;}
    .dyn-pillars-icons{         height:8rem;              }
    .dyn-process-icons{         height:7rem;              }
    .dyn-contact-border{        border-left:1px #875CFF solid ; }
    .dyn-wa{                    width:65;   height:65;      }
    .dyn-wa-icon{               height:50px;    }


/* + + + + + + + + + + + + +     END MediaQueries utils     + + + + + + + + + + + + + */


* {
  margin: 0;
  /* padding: 0; */
  box-sizing: border-box;
}

/*CODE AP*/

.dyn-img-cover{
  background-image: url(/imgs/logoLetrasV2.jpeg);
  background-repeat: no-repeat;
  /* background-size: cover; */
  background-position: right;
  background-size: 75% 75%;
  /* margin: 0;
  padding: 0; */
}

.dyn-img-cover2{
  background-image: url(/imgs/LogoV2.jpeg);
  background-repeat: no-repeat;
  /* background-size: cover; */
  background-position: left;
  background-size: 70% 75%;
  margin: 0;
  padding: 0;
}