@charset "UTF-8";


/*=======================================================
  4.30. Backgrounds
========================================================*/


.u-zigzag-top {
    position: relative;
    background: #f7f7f7;
    z-index: 1;
}

.u-zigzag-top::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(-225deg, #f7f7f7 10px, transparent 0) 0 10px, -webkit-linear-gradient(-315deg, #f7f7f7 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}

.u-zigzag-bottom {
    position: relative;
    background: #f7f7f7;
    z-index: 1;
}

.u-zigzag-bottom::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(225deg, #f7f7f7 10px, transparent 0) 0 10px, -webkit-linear-gradient(315deg, #f7f7f7 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}

.u-zigzag-top-white {
    position: relative;
    background: #fff;
    z-index: 1;
}

.u-zigzag-top-white::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(-225deg, #fff 10px, transparent 0) 0 10px, -webkit-linear-gradient(-315deg, #fff 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}

.u-zigzag-top-primary {
    position: relative;
    background: #111111;
    z-index: 1;
}

.u-zigzag-top-primary::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(-225deg, #111111 10px, transparent 0) 0 10px, -webkit-linear-gradient(-315deg, #111111 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}

.u-zigzag-top-black {
    position: relative;
    background: #000;
    z-index: 1;
}

.u-zigzag-top-black::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(-225deg, #000 10px, transparent 0) 0 10px, -webkit-linear-gradient(-315deg, #000 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}

.u-zigzag-top-gray-dark-v1 {
    position: relative;
    background: #111;
    z-index: 1;
}

.u-zigzag-top-gray-dark-v1::before {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    display: block;
    height: 20px;
    background: -webkit-linear-gradient(-225deg, #111 10px, transparent 0) 0 10px, -webkit-linear-gradient(-315deg, #111 10px, transparent 0) 0 10px;
    background-position: top left;
    background-repeat: repeat-x;
    background-size: 20px 20px;
}


/*=======================================================
  4.63. Border Colors
========================================================*/


.g-bg-white {
    background-color: #fff !important;
}



/*=======================================================
  5. Borders
========================================================*/

.g-brd-bottom {
    border-bottom: solid 1px transparent !important;
}

@media (min-width: 576px) {
   
    .g-brd-bottom--sm {
        border-bottom: solid 1px transparent !important;
    }

   
}

@media (min-width: 768px) {
    

    .g-brd-bottom--md {
        border-bottom: solid 1px transparent !important;
    }

  
}

@media (min-width: 992px) {
   

    .g-brd-bottom--lg {
        border-bottom: solid 1px transparent !important;
    }

   
}


.g-brd-bottom-none {
    border-bottom: none !important;
}


@media (min-width: 576px) {
    
    .g-brd-bottom-none--sm {
        border-bottom: none !important;
    }

  
}

@media (min-width: 768px) {
   

    .g-brd-bottom-none--md {
        border-bottom: none !important;
    }

    
}

@media (min-width: 992px) {
   
    .g-brd-bottom-none--lg {
        border-bottom: none !important;
    }

    
}

@media (min-width: 1200px) {
   

    .g-brd-bottom-none--xl {
        border-bottom: none !important;
    }

   
}


.g-brd-bottom--dotted {
    border-bottom: dotted 1px transparent;
}


@media (min-width: 576px) {
    
    .g-brd-bottom--dotted--sm {
        border-bottom: dotted 1px transparent;
    }

   
}

@media (min-width: 768px) {
   

    .g-brd-bottom--dotted--md {
        border-bottom: dotted 1px transparent;
    }

    
}


.g-brd-3 {
    border-width: 3px !important;
}

.g-brd-3--before::before {
    border-width: 3px !important;
}

.g-brd-3--before--active.active::before {
    border-width: 3px !important;
}

.g-brd-top-3 {
    border-top-width: 3px !important;
}


@media (min-width: 768px) {
    
    .g-brd-3--md {
        border-width: 3px !important;
    }

}




.g-brd-black {
    border-color: #000 !important;
}

.g-brd-black--hover:hover, .g-brd-black--active.active {
    border-color: #000 !important;
}

*:hover > .g-brd-black--hover-parent {
    border-color: #000 !important;
}

.g-brd-gray-dark-v5 {
    border-color: #999 !important;
}

.g-brd-gray-dark-v5--hover:hover, .g-brd-gray-dark-v5--active.active {
    border-color: #999 !important;
}

*:hover > .g-brd-gray-dark-v5--hover-parent {
    border-color: #999 !important;
}


.g-brd-black-top {
    border-top-color: #000 !important;
}

.g-brd-black-bottom {
    border-bottom-color: #000 !important;
}



/*=======================================================
  7.  Typography
========================================================*/


.g-font-size-35 {
    font-size: 2.5rem !important;
}

@media (min-width: 768px) {
   

    .g-font-size-35--md {
        font-size: 2.5rem !important;
    }

   
}

@media (min-width: 992px) {
   
    .g-font-size-35--lg {
        font-size: 2.5rem !important;
    }

    
}

.g-font-weight-700 {
    font-weight: 700 !important;
}

.g-font-weight-800 {
    font-weight: 800 !important;
}

.g-font-weight-900 {
    font-weight: 900 !important;
}

@media (min-width: 768px) {
    

    .g-font-weight-700--md {
        font-weight: 700 !important;
    }

   
}

.g-color-black {
    color: #000 !important;
}

.g-color-black--hover:hover {
    color: #000 !important;
}

.g-parent:hover .g-color-black--parent-hover {
    color: #000 !important;
}

.g-color-black--active.active {
    color: #000 !important;
}


.g-color-white {
    color: #fff !important;
}

.g-color-white--opened-menu:not(.collapsed) {
    color: #fff !important;
}

.u-block-hover:hover .g-color-white--hover, .g-color-white--hover:hover {
    color: #fff !important;
}

.g-parent:hover .g-color-white--parent-hover {
    color: #fff !important;
}

.g-color-white--active.active {
    color: #fff !important;
}

.active .g-color-white--parent-active {
    color: #fff !important;
}

.g-color-white--child * {
    color: #fff !important;
}


.g-color-gray-dark-v5--hover:hover {
    color: #999 !important;
}

.g-parent:hover .g-color-gray-dark-v5--parent-hover {
    color: #999 !important;
}

/*=======================================================
  23. Margin Spaces - XS
========================================================*/

@media (min-width: 0) {
    
    .g-mb-30 {
        margin-bottom: 2.14286rem !important;
    }

}

/*=======================================================
  24. Margin Spaces - SM
========================================================*/

@media (min-width: 576px) {
    
    .g-mb-30--sm {
        margin-bottom: 2.14286rem !important;
    }

    
}

/*=======================================================
  25. Margin Spaces - MD
========================================================*/

@media (min-width: 768px) {
   
    .g-mb-30--md {
        margin-bottom: 2.14286rem !important;
    }

    .g-mb-35--md {
        margin-bottom: 2.5rem !important;
    }

}

/*=======================================================
  26. Margin Spaces - LG
========================================================*/

@media (min-width: 992px) {
   
    .g-mb-30--lg {
        margin-bottom: 2.14286rem !important;
    }

   
}

/*=======================================================
  27. Margin Spaces - XL
========================================================*/

@media (min-width: 1200px) {
   

    .g-mb-30--xl {
        margin-bottom: 2.14286rem !important;
    }

   
}

/*=======================================================
  28. Minus Margins
========================================================*/

/*=======================================================
  31. Padding Spaces - XS
========================================================*/

@media (min-width: 0) {
    
    .g-pa-20 {
        padding: 1.42857rem !important;
    }

    
  

    .g-px-20 {
        padding-left: 1.42857rem !important;
        padding-right: 1.42857rem !important;
    }
    .g-py-15 {
        padding-top: 1.07143rem !important;
        padding-bottom: 1.07143rem !important;
    }

   
    .g-py-20 {
        padding-top: 1.42857rem !important;
        padding-bottom: 1.42857rem !important;
    }

    .g-py-25 {
        padding-top: 1.78571rem !important;
        padding-bottom: 1.78571rem !important;
    }

   
}

/*=======================================================
  32. Padding Spaces - SM
========================================================*/

@media (min-width: 576px) {
   
    .g-pa-20--sm {
        padding: 1.42857rem !important;
    }

   
    .g-px-20--sm {
        padding-left: 1.42857rem !important;
        padding-right: 1.42857rem !important;
    }


    .g-py-15--sm {
        padding-top: 1.07143rem !important;
        padding-bottom: 1.07143rem !important;
    }

  

    .g-py-20--sm {
        padding-top: 1.42857rem !important;
        padding-bottom: 1.42857rem !important;
    }

    .g-py-25--sm {
        padding-top: 1.78571rem !important;
        padding-bottom: 1.78571rem !important;
    }

   
}

/*=======================================================
  33. Padding Spaces - MD
========================================================*/

@media (min-width: 768px) {
   

    .g-pa-20--md {
        padding: 1.42857rem !important;
    }

    
    .g-px-20--md {
        padding-left: 1.42857rem !important;
        padding-right: 1.42857rem !important;
    }

    

    .g-py-15--md {
        padding-top: 1.07143rem !important;
        padding-bottom: 1.07143rem !important;
    }

   
    .g-py-20--md {
        padding-top: 1.42857rem !important;
        padding-bottom: 1.42857rem !important;
    }

    .g-py-25--md {
        padding-top: 1.78571rem !important;
        padding-bottom: 1.78571rem !important;
    }

  
}

/*=======================================================
  34. Padding Spaces - LG
========================================================*/

@media (min-width: 992px) {
    

    .g-pa-20--lg {
        padding: 1.42857rem !important;
    }

    .g-px-20--lg {
        padding-left: 1.42857rem !important;
        padding-right: 1.42857rem !important;
    }

   

    .g-py-15--lg {
        padding-top: 1.07143rem !important;
        padding-bottom: 1.07143rem !important;
    }

   
   
    .g-py-20--lg {
        padding-top: 1.42857rem !important;
        padding-bottom: 1.42857rem !important;
    }

    .g-py-25--lg {
        padding-top: 1.78571rem !important;
        padding-bottom: 1.78571rem !important;
    }

   
}

/*=======================================================
  35. Padding Spaces - XL
========================================================*/

@media (min-width: 1200px) {
  
    .g-pa-20--xl {
        padding: 1.42857rem !important;
    }

  

   

    .g-px-20--xl {
        padding-left: 1.42857rem !important;
        padding-right: 1.42857rem !important;
    }

   
    .g-py-15--xl {
        padding-top: 1.07143rem !important;
        padding-bottom: 1.07143rem !important;
    }

   

    .g-py-20--xl {
        padding-top: 1.42857rem !important;
        padding-bottom: 1.42857rem !important;
    }

    .g-py-25--xl {
        padding-top: 1.78571rem !important;
        padding-bottom: 1.78571rem !important;
    }

   
}