@import "tailwindcss/base";


@import "tailwindcss/components";
body {
@apply text-base text-black font-primary antialiased overflow-x-hidden;
}

.h1 {
@apply font-secondary leading-tight font-bold text-5xl;
}
.h2 {
@apply font-secondary leading-tight font-bold text-4xl;
}
.h3 {
@apply font-secondary leading-tight font-semibold text-3xl;
}
.h4 {
@apply font-secondary leading-tight font-semibold text-2xl;
}
.h5 {
@apply font-secondary leading-tight font-semibold text-xl;
}
.h6 {
@apply font-secondary leading-tight font-semibold text-lg;
}

.btn-primary {
@apply relative transition-all duration-300 inline-flex items-center justify-center text-white px-4 py-3 leading-none font-primary bg-primary border-2 rounded border-solid border-primary mr-2 mb-2 focus:outline-none;
}
.btn-primary:hover {
@apply bg-primary-700 border-primary-700;
}
.btn-primary:active {
@apply bg-primary-800 border-primary-800;
}
.btn-primary:focus {
@apply border-primary-800;
}

body {
    max-width: 100vw;
}

button:focus {
    outline: none;
}

ul:not([class]) {
    @apply list-disc list-inside;
}

ol:not([class]) {
    @apply list-decimal list-inside;
}

ul[class],
ol[class] {
    @apply list-none;
}

/** Images */
picture {
    @apply block align-middle;

    & > img {
        all: inherit;
    }

    /** Fix when img are replaced with picture */
    &:not([class*="wp-image"]) > img {
        @apply w-full h-full object-cover;
    }
}

/** Headings */
h1 {
    @apply h1;

    /* Desktop size */
    @screen lg {
        @apply text-5xl;
    }
}

.h1 {
    /* Desktop size */
    @screen lg {
        @apply text-5xl;
    }
}

h2 {
    @apply h2;

    /* Desktop size */
    @screen lg {
        @apply text-3xl;
    }
}

.h2 {
    /* Desktop size */
    @screen lg {
        @apply text-3xl;
    }
}

h3 {
    @apply h3;

    /* Desktop size */
    @screen lg {
        @apply text-2xl;
    }
}

.h3 {
    /* Desktop size */
    @screen lg {
        @apply text-2xl;
    }
}

h4 {
    @apply h4;
}

h5 {
    @apply h5;
}

h6 {
    @apply h6;
}

/* Inputs */
input[type="email"],
input[type="password"],
input[type="text"],
input[type="tel"],
input[type="number"],
select,
textarea,
.select2 > .selection > .select2-selection {
    @apply h-auto text-sm border border-tertiary-700 rounded p-3 !important;
}

/* Select2 - Fix margin */
.select2 > .selection > .select2-selection {
    @apply m-0 !important;
}

/* Select2 - Fix arrow position */
.select2 > .selection > .select2-selection > .select2-selection__arrow {
    top: 50%;
    right: 1%;
    transform: translateY(-50%);
}

/* Select2 - Fix clear icon position */
.select2 > .selection .select2-selection__clear {
    @apply px-2 py-0 !important;
    margin-right: calc(1% + 1em) !important;
}

/* Select2 - Fix select style */
.select2 > .selection > .select2-selection > .select2-selection__rendered {
    @apply p-0 !important;
    line-height: inherit !important;
}

/** Select2 - Dropdown - Option selected - Hover */
.select2-results > .select2-results__options > .select2-results__option--highlighted[aria-selected],
.select2-results > .select2-results__options > .select2-results__option--highlighted[data-selected] {
    /* @apply bg-secondary !important; */
}

/** WYSIWYG alignment styles */
.aligncenter {
    @apply mx-auto;
}

.alignleft {
    @apply mr-auto;
}

.alignright {
    @apply ml-auto;
}

/* Pagination */
.pagination {
    @apply flex items-center justify-center text-black w-full pt-6 border-t border-gray-500;

    .page-numbers {
        @apply px-1 mr-1;
    }

    /* Hover, current */
    .page-numbers.current,
    .prev:hover,
    .next:hover {
        @apply text-primary;
    }
}

/**
* Button basic styling
* (extend it to create your buttons)
*/
.btn-base {
    @apply relative inline-flex items-center justify-center text-sm text-black uppercase;
    @apply px-4 py-2 leading-none font-primary font-bold bg-gray-300 border-2 border-solid border-gray-300 mr-2 mb-2;

    &:hover {
        @apply bg-gray-700 border-gray-700;
    }
}

/** Icon Font Awesome - Left position */
.icon-left {
    &::before {
        content: "";
        display: inline-block;
        font-family: "Font Awesome 5 Pro";
        font-weight: 400;
        color: currentcolor;
        margin-right: 12px;
        text-align: center;
    }
}

/** Icon Font Awesome - Right position */
.icon-right {
    &::after {
        content: "";
        display: inline-block;
        font-family: "Font Awesome 5 Pro";
        font-weight: 400;
        color: currentcolor;
        margin-left: 12px;
        text-align: center;
    }
}

/** Blockquote */
blockquote{
    @apply border-l-4 border-secondary px-16 my-16 ml-6 text-primary text-2xl leading-9;
}

/** ----------------------------------
* Put your custom styles here below...
* ---------------------------------- */


/**
 * Theme Name: Pilo'Press - Starter Theme
 * Author: Pilot'in
 * Author URI: https://www.pilot-in.com/
 * Description: Starter Theme to use with Pilo'Press
 * Version: 0.1
 */

 html,
 body{
    scroll-behavior: smooth;
 }@import "tailwindcss/utilities";

.contact-simple-form-nemo {
  .acfe-form {
    .acf-field {
      .acf-label {
        label {
          @apply font-medium !important;
        }
      }
    }
    .acf-field-email {
      .acf-input {
        .acf-input-prepend {
          height: 46px;
          @apply flex items-center justify-center bg-white border-t border-l border-b border-r-0 pr-0;
        }
        .acf-input-wrap {
          input {
            @apply border-l-0 !important;
            &:focus {
              @apply outline-none;
            }
          }
        }
      }
    }
    .acf-checkbox-list {
      li {
        @apply text-base text-gray-600;
      }
    }
    input{
        &:focus{
            @apply outline-none;
        }
    }
  }
  .acf-form-submit {
    @apply flex items-center justify-center;
  }
}
#icons-horizontal-cards-nemo-18{
    .wrapper-icon{
        @apply border border-tertiary-600 rounded-md;
    }
}
#inscriptions{
    .wrapper-icon{
        .wrapper-icon-image{
            img{
                @apply rounded-b-none rounded-t-md;
            }
        }
        .wrapper-icon-desc{
            @apply bg-white rounded-b-md;
        }
    }
}.icons-small-icon-grid-marlin{
    i{
        &.fad{
            &::before{
                @apply text-primary-300 !important;
            }
            &::after{
                @apply text-primary opacity-100;
            }
        }
    }
}header{
    .custom-logo{
        width: 484px;
        height: 172px;
        @apply object-contain transition-all duration-300;
    }
    &.scroll-transparent{
        @apply sticky top-0 shadow z-10;
        @apply transition-all duration-300;
        .wrapper-main-transparent{
            @apply bg-white;
        }
    }
    &.scroll-color{
        @apply sticky top-0 shadow z-10;
        @apply transition-all duration-300;
        .custom-logo{
            @apply h-28;
        }
    }
}            .aligncenter {
            @apply mx-auto;
            }

            .alignleft {
            @apply mr-auto;
            }

            .alignright {
            @apply ml-auto;
            }