:root {
  --main-blue: #15ADF3;
  --sec-blue: #0B3A5C;
}

nav {background: white;}
.header-wl {width:100%; background-color: #000; height:596px;

overflow:hidden;
   position: relative;
   }

   .faq-wl-two {width:unset!important;}

   .easy-bg-containernot b {font-weight: 600;}
   .logo-rm-wl {width:530px; height:auto; align-self: end; z-index:4;}
   .inner-wl-ct {width:var(--content-width); margin:auto; height: 100%; position: relative;
   display: grid; align-items: center; gap:42px;}

   .inner-wl-ct p { color: #FFF!important;
text-align: center;

font-family: "Open Sans";
font-size: 15px;
max-width:440px;
align-self: start;
font-style: normal;
font-weight: 400;
line-height: 1.8}
.agency .inner-wl-ct p  {max-width: 480px;}
/*
.tabs-onetab {width: var(--content-width); margin:auto;
height: 60px; margin-top:-60; display: grid; grid-template-columns: 1fr 1fr 1fr 1fr;
position: relative;
    z-index: 2;}*/
    .tabs-onetab {
    width: var(--content-width);
    /* padding-right: 83px;
   box-sizing: border-box;*/
    margin: auto;
    height: 60px;
    margin-top: -60px;
    display: grid;
    gap:4PX;
    gap:26px;
    grid-template-columns: 275px auto auto auto;
    grid-template-columns: auto auto auto auto 1fr;
    gap:26px;
    position: relative;
    z-index: 2;
    }
    .layer-for-tabs {
      opacity: 1;
background: #000;
filter: blur(70.699px);
height:120px; z-index:1;
left: 0;
bottom:-40px;
position: absolute;
width: 100%;

    }

.tabs-onetab div {
   padding-left:55px;
   padding-right:55px;

   white-space: pre-wrap;
 
display: flex;
justify-content: center;
align-items: center;
font-weight: 600;
line-height: 116%;
   border-radius: 10px 10px 0px 0px; 

}

.tabs-onetab div span {
   color: #a1a0a0;
   color: #696969;
   color: #a1a0a0;
   display: flex;
   position: relative;
leading-trim: both;
text-edge: cap;
position: relative;
font-size: 24px;
font-style: normal;
}

.tabs-onetab-content:after {content:"COMING SOON";
color: #FFF;
text-align: center;
leading-trim: both;
text-edge: cap;
font-family: "Open Sans";
font-size: 10px;
font-style: normal;
font-weight: 700;

background: #15ADF3;
padding:0px 10px;
position:absolute;
top:-24px;
right:0;}
.tabs-onetab div span span{
font-weight: 300;}

.tabs-onetab div:first-child {background: white;  color: #000;}
.tabs-onetab div:first-child span {color: #000;}
.tabs-onetab div:first-child span:after {display:none;}

.agency .tabs-onetab div:nth-of-type(2) {background: white;  color: #000;}
.agency .tabs-onetab div:nth-of-type(2) span {color: #000;}
.agency .tabs-onetab div:nth-of-type(2) span:after {display:none;}
.agency .tabs-onetab div:nth-of-type(1) {background: transparent; }
.agency .tabs-onetab div:first-child span {color: var(--light);}
/*
.agency .tabs-onetab div:nth-of-type(1):hover {background:white;}
.agency .tabs-onetab div:nth-of-type(1):hover span {color:black!important;}*/

   .space-wl {width:auto; height:100%; position:absolute; bottom:0; right:0;
   padding-left: 44%;   padding-left: 37%; padding-left: 34%;}

   .wl-h2 {
      color: #000;

text-align: center;

font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: normal;
    }

    .wl-simple {display: grid;
    width:100%;
    border-radius: 22px;
    margin-top:130px;
box-shadow: 0px 12px 62px 0px #DDE2ED;
grid-template-columns: 1fr 540px;
height: 716px;
    margin: auto;
    background: white;
margin-top:70px;  
overflow:hidden; 
}



    .wl-img-holder {width:540px; height:716px; }
    .wl-img-holder img {
      border-radius: 0px 22px 22px 0px;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
    .wl-h2.blue-h2 {

      color:var(--main-blue);
      font-weight: 600;
     

    }

    .firsfog {
      padding-bottom: 130px;
    margin-bottom: 80px;
    }

   .agency .wl-h2.blue-h2 {color:var(--sec-blue); font-weight: 700; text-align: center; padding-bottom:32px;}
   .nopad {padding-bottom:0!important;}

   .firsfog {background-position:50% -216px!important;}

    .howagency h2 {color:var(--sec-blue);}

    .easy-bg-container {
 
      background-size: 1920px;
      background-position: 50% -100px;

    }

   .more-text {margin-top:80px; padding:  60px 40px; background: rgba(245, 246, 248, .98);; border-radius: 7px;}
   .more-text h3 {        text-align: center;
    line-height: 1.36;     color: #15ADF3;
    font-size: 36px;
    margin-bottom:30px;
    font-weight: 700;}

    .inner-text {max-width:920px; margin: auto;}

    .inner-text h4 {
      font-size: 24px;
    font-weight: 600;
    margin-top: 46px;
    margin-bottom: 32px;
    color:var(--sec-blue);
    }

   

    .wl-section-container {
      
      background-size: 1916px;
 
      background-repeat: no-repeat;
      padding-bottom:67px; 
      background-position: 50% 14%;
      display: block;}

      .visible .wl-section-container {background-image: url(../img/fog-2.png);}

      .fog-back {
        background-size: 1916px;
   
        background-repeat: no-repeat;
     
        background-position: 50% 280px;
        display: block;}

        .visible .fog-back {background-image: url(../img/fog-2.png);}

   .visible .easy-bg-container {background-image: url("../img/step-bg.jpg");}

    .wl-easy {background: transparent;}


   

    .wl-easy p {
   
text-align: center;
font-size: 20px;
font-weight: 300;
line-height: 34px; 

    }

    .one-day-wl {
    font-size: 11px; margin-top:16px; display: block;
    }
    .wl-distance {padding-top:20px; padding-bottom:50px;
      max-width: 790px;
      margin: auto;}
     .agency .wl-distance {max-width:1190px; padding-top:0;}
       .nocover {transform: translateY(-100%); transition: all .6s ease;}
      .wl-cover {position: absolute; top:0; left:0; z-index:2; width:100%; height:auto;}
     .embed-container {  position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;  }
     .container-container {width:994px; margin:auto; cursor:pointer;}
  iframe {transform:scale(.6); transition: transform .4s ease;}
     .growUp iframe {transform:scale(1); }
     .p-circle {width:128px; height:128px; position: absolute; left: 50%; top:50%; pointer-events: none; 
     transform: translate(-50%, -50%); z-index:3; transition: transform .3s ease, opacity .01s linear;}
     .growUp .p-circle {opacity:0;}

     .container-container:hover .p-circle {transform: translate(-50%, -50%) scale(.7);
    }


      .wl-advantages {
         width:1024px;
         margin:auto;
         display: grid;
         grid-template-columns: auto auto auto;
         justify-content: space-between;
         padding-top:160px;
         padding-top:114px;
         margin-bottom:0px;
      }

      
    .wl-section {padding-bottom:160px;
      width:1300px;
      margin:auto;}

      .agency .wl-section.wl-ag {width: 1400px; padding-bottom:80px;}

      .arrowdown-container {padding-bottom:45px;}
      .arrowdown-container {position:relative;}
      .arrowdown-container:after {
        position: absolute;
        left: 50%;
        width: 100%;
        bottom:0;
        transform: translateX(-50%);
    font-size: 15px;
        content: "Click on the arrow to see every template!";
        z-index: 10000;
        opacity:.8;
    
        text-align: center;
      }

      .arrowdown-container.turn-text:after {
        content: "Click on the arrow to hide most templates!";
      }

      .circle-wl {width:80px; height:80px; border-radius: 50%; display: inline-block;
    background-color:#AEB3C1; display: flex; align-items: center; justify-content: center;}
    .active .circle-wl {background-color: #15ADF3;}
    .circle-wl { margin-left: 80px; margin-right: 40px;}
    .wl-num {color: #FFF;
   
        font-size: 48px;
      
        font-weight: 600;
        line-height: 1.16; }
        .three-simple {
            display: grid;
            background: white;
            grid-template-rows: 1fr 1fr 1fr;
            align-items: start;
            padding-top:60px;
            gap:15px;
            border-radius: 22px;
  
          }

          .agency .three-simple {
            align-items: center;
            padding-bottom:60px;
            gap:25px;
          }
         
          .three-simple-inner {
            cursor:pointer;
            display: grid;
            grid-template-columns: auto 1fr;
            margin-right: 70px;

          }

          .three-simple h3 {
            color: #B3B6BF;
font-size: 26px;

font-weight: 600;
line-height: 1.34; 
          }

    

          .wl .three-simple p {
            color: #B3B6BF;
            padding-top:20px;

font-size: 15px;

font-weight: 300;
line-height: 1.5;
          }

          .three-simple .active h3,.three-simple .active p {color:#000;}

          .myVid {height: 100%!important; }

          .lc-wl {width:100%; height:100%; 
            opacity:0;
            position: absolute; top:0; left:0; display: flex; justify-content: center;
          align-items: center;}

          .bl-spaceman {
            transition: all .3s ease-in-out;
          }
          .blue-lines {
            width:100%;
            height:192px;
            object-fit: cover;
            margin-bottom:60px;
          }

        .wl-img-holder {opacity:1;  position:relative;}
        .wl-img-holder-black {position:absolute; top:0; left:0; 
        width:100%; height:100%; background:black;z-index:1;     border-radius: 0px 22px 22px 0px;}
        .wl-img-holder img {z-index:3; position: relative;}

        .transitioning-src {
          transition: opacity 0.4s ease-out;
          -webkit-transition: opacity 0.4s ease-out;
          -moz-transition: opacity 0.4s ease-out;
          -ms-transition: opacity 0.4s ease-out;
          -o-transition: opacity 0.4s ease-out;
          opacity: 0;
      }

      

          .fade-in-simple {
    
                    animation: fade-in-simple .4s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
          }

          .fade-in-simple-two { animation: fade-in-simple .4s ease-out both;}



          @keyframes fade-in-simple {
            0% {
              opacity: 0;
            }
            100% {
              opacity: 1;
            }
          }
          
        
         
        .loader {
        position: absolute;
        
        
        
          z-index: 0;
          width: 40px;
          padding: 8px;
          aspect-ratio: 1;
          border-radius: 50%;
          background: #15ADF3;
          --_m: 
            conic-gradient(#0000 10%,#000),
            linear-gradient(#000 0 0) content-box;
          -webkit-mask: var(--_m);
                  mask: var(--_m);
          -webkit-mask-composite: source-out;
                  mask-composite: subtract;
          animation: l3 1s infinite linear;
        
        }
        @keyframes l3 {to{transform: rotate(1turn)}}
        
        .container:hover .lc-wl {
          transition: all .6s ease;
          transition-delay: .1s;
          opacity:1;
        }

        .price-box-wl {width:100%; display: grid; align-items: center;
          justify-content: center; text-align: center;
          grid-template-columns: 1fr;
          padding-top: 10px;
          padding-bottom: 24px;
          border-radius:12px;
        grid-template-rows: repeat(9, 64px)}

        .prices-wl {display: grid; grid-template-columns: auto 1fr 1fr 1fr 1fr; 
        gap:38px; width: 100%;}

        .price-2 {margin-bottom:30px; margin-top:150px;}
        .selection-wl {    width: var(--content-width);
          text-align: center;
      
          display: grid;
          justify-content: center;
          align-items: center;
          grid-gap: 26px;
          margin: auto;
          grid-template-columns: auto auto;
          margin-bottom:90px;}
        .btn-group button {
          font-size: 22px;

font-weight: 700;
transition: color .3s ease, background-color .3s ease;
          background-color: var(--main-blue); /* Green background */
          border: 1px solid white; /* Green border */
          color: white; /* White text */
          width: 64px;
          height: 61px;
          cursor: pointer; /* Pointer/hand icon */
          float: left; /* Float the buttons side by side */
        }

        .selection-wl p {font-size: 22px;}

        .btn-group button:focus {background:white!important; color:#000; outline: none !important;}

        .selected-wl-btn {background:white!important; color:#000!important; outline: none !important;}
        
        .btn-group button:not(:last-child) {
          border-right: none; /* Prevent double borders */
          

        }

        .btn-group button:first-child

      {border-radius: 12px 0 0 12px;}

      .btn-group button:last-child

      {border-radius: 0px 12px 12px 0px;}
        
        /* Clear floats (clearfix hack) */
        .btn-group:after {
          content: "";
          clear: both;
          display: table;
        }
        
        /* Add a background color on hover */
        .btn-group button:hover {
          background-color: var(--sec-blue);
        }

        .wlbox-0 {width: auto; min-width: 200px;}
        .wl-section.pri-wl {width:1292px;}
        .wl-section.pri-wl {padding:0!important;}
        .one-sentence-wl {margin:auto;width:1292px;
       /* display: flex; align-items: center;*/
       border-radius: 6px;
        margin-top:100px;
        margin-bottom:160px;
      justify-content: center; box-shadow: 0px 4px 4px 0px rgba(221, 226, 237, 0.25), 0px 3px 25px 0px #DDE2ED;
    }
      .one-sentence-wl p{
        font-size: 20px;
        padding-top:33px;
        padding-bottom: 33px;
        font-weight: 400;
        text-align: center;
      }

      .one-sentence-wl a {
        color:var(--main-blue); text-decoration: none;
        transition: color .3s ease-out;
      }
      .one-sentence-wl a:hover {color:#95989e; }

        .prices-wl h4 {font-size: 26px; color:white;
          font-weight: 700;}
          .wlbox-1 h4  {color:black;}
          .wlbox-2 {background-color: var(--main-blue);}
          .wlbox-3 {background-color: var(--sec-blue);}
          .wlbox-4 {background-color: var(--sec-blue);
        background-size: cover;}

        .visible .wlbox-4 {
          background-image: url('../img/wl-space.jpg');
      }

        .price-box-wl .price {
          color: #fff;
font-size: 20px;
font-weight: 700;
        }

        .price-box-wl.wlbox-1 .price {color:#000;}

        
        .price-box-wl.wlbox-1 .domain, .price-box-wl.wlbox-1 .av-wl {color:#000;}
        .price-box-wl .domain, .price-box-wl .av-wl {
          color: #fff;
font-size: 20px;
font-weight: 400;
        }
        .price-box-wl img
        {display: block;
        margin: auto;}


        .wlbox-0 p {
     
font-size: 17px;
text-align: right;
justify-self: end;
font-weight: 300;
line-height: 1.4;

        }
        

        .price-wl-button {
          display: flex;
width: 154px;
height: 42px;
padding: 10px;
margin: auto;
font-size: 20px;
font-weight: 700;
border-radius: 5px;
background: white;
color: #000;
margin: auto;
text-decoration: none;
justify-content: center;
align-items: center;
padding: 0;
height: 42px;
transition: all 0.4s ease-out;

        }

        .price-wl-button:hover {box-shadow: inset 0 100px 0 0 rgba(18, 37, 56, 1) !important;
    color: #fff;}
  

    .wlbox-2 .price-wl-button:hover, .wlbox-4 .price-wl-button:hover {box-shadow: inset 0 100px 0 0#0B3A5C !important;
      color: #fff;}

    .wlbox-3 .price-wl-button:hover, .wlbox-4 .price-wl-button:hover {box-shadow: inset 0 100px 0 0 #15ADF3 !important;
      color: #fff;}


        .price-box-wl.wlbox-1 .price-wl-button {background: #15ADF3;
          color: white;}

          .wlbox-1 {border: 1px solid rgba(0, 0, 0, .6);
          box-sizing:border-box;}

         
          .accordionWrapper .close {
            opacity: 1 !important;
            text-shadow: none !important;
        }

        .accordionItem {
            display: block;
            width: 100%;
            box-sizing: border-box;
        }

        .close .accordionItemContent {
            height: 0px;
            transition: height 1s ease-out;
            -webkit-transform: scaleY(0) rotate(0.01deg);
            -o-transform: scaleY(0) rotate(0.01deg);
            -ms-transform: scaleY(0) rotate(0.01deg);
            transform: scaleY(0) rotate(0.01deg);
            display: block;
        }
        .accordionItemContent p
{        font-size: 20px;
  line-height:1.6;
        font-weight: 300;
}

.agency .accordionItemContent p {text-align: left; padding-bottom:0;}

.accordionItem.open { 
  border-radius: 7px;
  box-shadow: 0px 4px 4px 0px rgba(221, 226, 237, 0.25), 0px 3px 25px 0px #DDE2ED;
  transition: box-shadow .4s ease;
  transition: box-shadow .3s ease-out;}
        .open .accordionItemContent {
            position: relative;
      
            padding-bottom: 36px;
            padding-left:90px;
            padding-right:90px;
          
            border-bottom-left-radius: 7px;
            border-bottom-right-radius: 7px;

        
           
            border: none;
            background: #fff;
            width: 100%;
            margin: 0px 0px 0px 0px;
            display: block;
            -webkit-transform: scaleY(1) rotate(0.01deg);
            -o-transform: scaleY(1) rotate(0.01deg);
            -ms-transform: scaleY(1) rotate(0.01deg);
            transform: scaleY(1)
         
                rotate(0.01deg);
            transform-origin: top;
         
           /* transition: transform 0.4s ease;*/
            box-sizing: border-box;
   
        }

        .close .accordionItemHeading {
     
          background-position: 50% 0%;
          background-repeat: no-repeat;
          background-size: 1160px 960px;
          color: white;
}

.faq-wl-two .close .accordionItemHeading {
  background-size: 1160px 614px;
}

.visible .close .accordionItemHeading  {background-image: url(../img/faqback-o.jpg);}



        .accordionItemHeading {
            cursor: pointer;
            margin: 0px 0px 0px 0px;
            position: relative;
            padding: 26px;
            padding-left: 90px;
            padding-right: 40px;

            color: #000;
            font-size: 24px;
    
            width: 100%;
            /* transition: transform .4s ease; */
   
            border-radius: 7px;
            box-sizing: border-box;
    
            font-weight: 600;
        }

        .accordionItemHeading h4 {
            color: #122538 !important;
            opacity: 1 !important;
        }

        .accordionItemContent {
            overflow: hidden;
        }

        .open .accordionItemHeading {
            margin: 0px;
            transform:
                /*scale(1.03)*/
                rotate(0.01deg);
            
            border-top-left-radius: 7px;
            border-top-right-radius: 7px;
           
            border-bottom-right-radius: 0px;
            border-bottom-left-radius: 0px;
            background-color: white;
            color: #000;
        }

        .accordionWrapper {
            display: grid;
            grid-template-columns: 1fr;
            grid-gap:16px;
        }


        .accordionWrapper i {
   
            width: 0; 
            height: 0; 
            padding:0;
            border-top: 18px solid transparent;
            border-bottom: 18px solid transparent;
            position: absolute; 
            top:50%;
            transform: translateY(-50%);
            left: 38px;
            
            border-left: 18px solid var(--main-blue);
            transition: transform .3s ease;
        }

        
        .accordionWrapper .open i {
          transform: rotate(90deg) translateX(calc(-50% - 7px));
          border-left: 18px solid black;
        
      }

      .faq-wl {max-width:1160px; width:var(--content-width); margin:auto; margin-bottom:120px;}
      .faqpic {width:482px; height:auto; display: block; margin: auto; margin-bottom:100px;} 
      .packege-1-intro
      {width:var(--content-width);margin:auto; margin-top:70px; max-width: 1124px;}
      .packege-1-intro p {max-width: 829px; font-size:18px; font-weight: 300; line-height: 32px;}
      .agency .packege-1-intro p {max-width: 1120px;} 
      .packege-1-intro h2 {color: #0B3A5C;
font-weight: 700;
margin-bottom:20px;
        font-size: 48px;}

        .packege-1-intro h2 span {
          color: #15ADF3;
          font-size: 36px;
font-weight: 700;
display: block;
line-height: 49px; 
        }

        .toggle-container {
          height:auto;
          overflow: visible;
          visibility: visible;
          pointer-events: auto;
       
     
        }
        .toggle-container:not(.active-wl) {
          height:0;
          overflow: hidden;
          visibility: hidden;
          pointer-events: none;
        }
        .arrowdown-container {width: 100%; height:auto; margin-top:26px; margin-bottom:26px;
          background-color: white; text-align: center;}

          .turn-around-wl {transform: rotate(180deg);}
          .js-toggle-svg:hover {transform: scale(1.2); }
          .js-toggle-svg.turn-around-wl:hover {transform: scale(1.2) rotate(180deg); }

          .js-toggle-svg { transition: transform .3s ease; cursor: pointer;}
          

        .arrowdown-container img {margin:auto; display: block;;}

        .main-features {
          max-width: 1160px;
          width: var(--content-width);
          margin: auto;
         display: grid;
       
          grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
         grid-gap:16px;
      
      
      }

      .main-features div {
       grid-column: span 2; 
        background: white;
        text-align: center;
        padding:22px;
        padding-top:28px;
        padding-bottom: 30px;
     border-radius: 6px;
     transition: opacity .3s ease;

     }

  

     .main-features div:nth-child(1) {grid-column: 1 / span 2;}
     .main-features div:nth-child(2) { grid-column: 3 / span 2;}
     .main-features div:nth-child(3) {grid-column: 5 / span 2;}
     .main-features div:nth-child(4) {grid-row: 2 / 2; grid-column: 2 / span 2;}
     .main-features div:nth-child(5) {grid-row: 2 / 2; grid-column: 4 / span 2;}
     .main-features div span {
      height:50px; 
      align-items: center;
      justify-content: center;
          display: flex;
      margin-bottom:12px;
     }
        .soeasy {grid-column: 2 / span 2;}
        .main-features img {
          height:auto;

        }

        .gam {width: 45px;}
        .prog {width: 49px;}
        .iabc {width:60px ;}
        .eistall {width:43px;}
        .fclass {width:43px;}
 
        .main-features h5 {font-size:26px;line-height:1.16; font-weight: 700; margin-bottom:18px;}
        .main-features p {font-size:15px;line-height:1.6; font-weight: 400;}
      .main-features-container {
        width:100%;
        padding-top:100px;
        padding-bottom: 170px;
       
        background-size: cover;
   

      }

      .visible .main-features-container { background-image: url(../img/services-cards-bg-o.jpg);}

      @media (pointer: fine) and (min-width: 1080px) { 
        .main-features-container { background-attachment: fixed;} 
       }
       @media (min-width: 1080px) { 
        .main-features-container { background-attachment: fixed;} 
       }
      .wl-h2.features-h2 {color:white; margin-bottom: 80px;}
   @media only screen and (max-width: 1890px) {
    .packege-1-intro h2 {
      margin-bottom: 14px;
      font-size: 42px;
  }

  .price-2 {margin-top:120px;}

  .fog-back {

 
    background-position: 50% 240px;}

  .blue-lines {margin-bottom:40px;}
  .wl-section-container {
    padding-bottom: 0;
    background-image: none;
  }

  .visible .wl-section-container { background-image: none;
  }
  .main-features div {padding: 26px;}
  .wl-h2.features-h2 {margin-bottom:50px;}
  .main-features-container {padding-bottom: 160px;padding-top: 120px;}
  .packege-1-intro h2 span {
    font-size: 32px;
    line-height: 1.36;
}
    .wl-advantages {margin-bottom: 0;}
    .agency .three-simple {gap:15px}

    .faqpic {width: 25.104vw; width:clamp(430px, 25.104vw, 482px);}
    .blue-lines {height:176px;}

    .wl-simple {margin-top:55px;}
 
      .container-container {width:894px;}
      .wl-section {padding-bottom:120px; }
      .wl-section.wl-easy {padding-bottom:143px; }
      .wl-advantages {padding-top:120px;}
      .tabs-onetab {
 
         grid-template-columns: auto auto auto auto 1fr;
         gap:26px;
         padding-right: 0;
         box-sizing: content-box;
      }
      .tabs-onetab div {
      padding-left: 2.604vw;
    padding-right: 2.604vw;

      }

      .wl-h2 {font-size:42px; padding-bottom:10px;}
      .wl-easy p {font-size: 19px; line-height: 32px; padding-bottom:43px;}
  .header-wl {

  min-height:520px;
  max-height: 560px;
  height: calc(100vh - 140px);
  }
  .inner-wl-ct p {padding-bottom:30px;}
  .logo-rm-wl {width:440px; height:auto;}

  .easy-bg-container {background-position: 50% -200px;}
  .p-circle {width:112px; height:112px;}
}
@media only screen and (max-width: 1499px) {
.wlbox-0 {max-width:220px;}
.agency .wl-section.wl-ag {width: 1300px; padding-bottom:60px;} 


}

@media only screen and (max-width: 1469px) {

  .one-sentence-wl p {font-size: 1.44vw;}
  
  }

@media only screen and (max-width: 1439px) {


  .faqpic {width: 25.104vw; width:clamp(420px, 25.104vw, 482px);  margin-bottom:80px;}

  .container-container {width: 848px;}
  .easy-bg-container {
    background-position: 50% -240px;
}

  .wl-section.pri-wl, .one-sentence-wl {
    width:calc(100% - 160px);
 
  }

  .prices-wl {    grid-template-columns: auto 1fr 1fr 1fr 1fr;}

  .wlbox-0 {justify-self: end; max-width: 201px;}

  .wl-simple {
    grid-template-columns: 1fr 420px;
  }
  .wl-img-holder {width: 420px;}
  .wl-section {width: var(--content-width);}
  .agency .wl-section.wl-ag {width: var(--content-width);} 
  .wl-num {font-size:38px;}

  .three-simple h3 {font-size:24px; line-height:1.28;}

  .circle-wl {margin-left: 40px; margin-right:30px; width: 64px; height:64px;margin-top:-6px;}

   .space-wl {
padding-left:40%;
right: unset;
}
.tabs-onetab div {
      padding-left: 2.804vw;
    padding-right: 2.804vw;

      }
}

@media only screen and (max-width: 1299px) {
  .accordionItemHeading {font-size:22px;}
  .accordionItemContent p {font-size:19px;}
  .one-sentence-wl p {
    font-size: 1.43vw;
}
  .wl-simple {
    grid-template-columns: 1fr 380px;
  }

  .wl-section.pri-wl, .one-sentence-wl { width: calc(100% - 136px);}
 
  .prices-wl {gap:32px;}
  .prices-wl h4 {font-size:24px;}
  .price-wl-button {
    font-size: 16px;
    width: 117px;}
  .price-wl-button {font-size:18px; width:152px;}
  .wl-img-holder {width: 380px;}
  .space-wl {
    padding-left:38%;}
}
@media only screen and (max-width: 1199px) {
  .main-features h5 {font-size: 24px;}
  .main-features div {padding-left:22px; padding-right:22px;}
 
  .faqpic {width: 390px; margin-bottom:60px;}
  .three-simple {padding-top:50px;}
  .one-sentence-wl p {font-size:16px; padding-left:20px; padding-right: 20px;}


.space-wl {
padding-left: 38%;}


.prices-wl h4 {
  font-size: 23px;
}
.price-box-wl .price, .price-box-wl .domain {
  font-size:18px;
}
.price-box-wl img {width: 37px;}
.prices-wl h4 {
  font-size: 21px;
}

.price-box-wl .domain, .price-box-wl .av-wl {font-size:18px;}

.wlbox-0 {
  min-width:unset;
  max-width: 190px;
}

.prices-wl {
  gap: 28px;
}

.price-box-wl {
  grid-template-rows: repeat(9, 56px);
}
.price-box-wl img {
  width: 35px;
}

.wl-section.pri-wl, .one-sentence-wl {width:calc(100% - 98px);}

.price-wl-button {
  font-size: 16px;
  width: 132px;
}


.wlbox-0 p {font-size:16px;}

}

@media only screen and (max-width: 1080px) {

  .selection-wl p {
    font-size: 20px;
}

.btn-group button {font-size:20px;    width: 58px;
  height: 55px;}

  .selection-wl {margin-bottom: 80px;}



  .prices-wl {
    gap: 24px;
  }

  .price-wl-button {
   
    width: 120px;
  }

  .three-simple-inner {margin-right: 40px;
    ;}

    .circle-wl {
      width:50px; height:50px;
      margin-left: 30px;
      margin-right: 20px;
      margin-top: 2px;
  }
    .wl-num {font-size:33px;}
    .three-simple h3 {font-size:21px;}
   .tabs-onetab div span span {
padding-right: 5px;}}



       
.mob-only {display:none;}

        @media only screen and (max-width: 999px) {
          .more-text h3 {font-size:28px; line-height: 1.2;}
          .agency .three-simple {grid-template-rows: auto; gap:48px; padding-bottom:40px;}
          .main-features h5 {font-size:22px;}
          .main-features div {grid-column: unset!important; grid-row:unset!important;}
          .main-features div.i-abc {    grid-column: span 2 !important;
            width: calc(50% - 50px);
            margin: auto;}
          .main-features {grid-template-columns: 1fr 1fr;}
          .js-toggle-svg {width:46px; height:46px;}
          .packege-1-intro h2 {
            font-size:32px;
            margin-bottom:0;
          }
          .packege-1-intro p {
            font-size: 17px;
        line-height: 1.6;
    
          }
          
            .packege-1-intro h2 span {
                font-size: 24px;}
          .faqpic {width: 360px;  margin-bottom:50px;}
          .btn-group {margin: auto;}
          .accordionItemHeading {font-size:17px; line-height:1.2;}
          .accordionItemContent p {font-size:17px;}
          .accordionWrapper i {border-top: 16px solid transparent;
            border-bottom: 16px solid transparent;
            border-left: 16px solid var(--main-blue);
          left:25px;
          }

          
.open .accordionItemContent {
  padding-left: 59px;
  padding-right: 59px;
}
          .accordionItemHeading {padding-left:59px;}
            .accordionWrapper .open i {
         
              border-left: 16px solid black;
          }

          .selection-wl p {
            font-size: 18px;
        }
        .selection-wl {grid-gap:20px;}
        
   
          .prices-wl {
            gap: 34px;
        }
        .prices-wl h4 {font-size:22px;}
        .prices-wl {margin-left:6%; margin-right: 6%;}
          .wl-section.pri-wl {overflow-x:scroll;}
          .wl-section.pri-wl {width: 100%;}
          .one-sentence-wl {width:var(--content-width);}
          .prices-wl {scroll-snap-type: x mandatory;
            overflow-x: scroll;
            overflow-y: hidden;
            scroll-snap-stop: always;
            width: 1100px;}
          .wl-img-holder {display:none;}
          .wl-simple {grid-template-columns: 1fr; height:auto; gap:26px; padding-bottom:40px;}
          .circle-wl {margin-right: 30px; margin-left: 40px;}
         .easy-bg-container {background-image: none;}
         .three-simple {gap:30px;}
         
.wl-h2 {font-size: 32px;}
.container-container {width:100%; margin: auto;}
.wl-easy p {font-size:17px; line-height:1.6;}
         .tabs-onetab div span {font-size:18px;}
         .tabs-onetab {grid-template-columns: auto auto auto auto;}
    .logo-rm-wl {
      width: 320px;
      height: auto;
      padding-top: 50px;
      text-align: center;
      padding-bottom: 30px;
    }
    .space-wl {
      width: 600px;
  
      height: auto;
      right: -120px;}
      .inner-wl-ct p {
        padding-bottom: 30px;
    }
    .inner-wl-ct p {margin:auto;}
    .inner-wl-ct {display: block; text-align: center;}
    .header-wl {
        height: 590px;
     
    }
    .three-simple h3, .wl .three-simple p {
      color: #000;}
      .circle-wl {
        background-color: #15ADF3;
    }

    .three-simple-inner {pointer-events: none!important;}
    .selection-wl {grid-template-columns: 1fr; justify-content: center;}
    .mob-only {display:block;}
}


@media (pointer: fine) and (max-width: 880px) { 
  .tabs-onetab {height:74px; margin-top:-74px;} 
 }

@media only screen and (max-width: 880px) {
   .tabs-onetab{
    
padding-left: 10%;
grid-template-columns: 200px 220px 200px 200px;
scroll-snap-type: x mandatory;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-stop: always;}


  .tabs-onetab div span {font-size:20px;}
  .tabs-onetab-content:after {top:-22px;}
  .circle-wl {margin-right: 30px; margin-left: 30px;}
  .three-simple-inner {margin-right: 30px; position: relative;}
  .three-simple {gap:40px;}
  .wl .three-simple p {font-size:16px; color:#000;}
  .one-day-wl {font-size:12px;}
  .circle-wl {
    background-color: #15ADF3;
}
.three-simple h3 {
  color: #000;}
  .magic-number-wl {padding-top:14px;}

  .blue-lines {
    height: 138px;
}
}
@media only screen and (max-width:720px) {

.btn-group {margin: auto;}
.agency .tabs-onetab div:nth-of-type(2) { order:-1;}
}

.mob-lines {display:none!important;}

@media only screen and (max-width:680px) {
  .main-features div.i-abc {display:none!important;}
  .main-features {grid-template-columns: 1fr;}
}

@media only screen and (max-width:560px) {
  .more-text h3 {font-size:26px;}
  .inner-text h4 {font-size:20px;}
  .mob-lines {display:block!important;}
  .pc-lines {display:none;}
  .packege-1-intro p {font-size: 16px;
        font-weight: 400;
        line-height: 1.6;
    }
    .packege-1-intro h2 {font-size:26px;}
    .packege-1-intro h2 span {font-size:20px;}

  .faqpic {width: 80%; 
    max-width:310px;
  margin:auto;
  padding-top:10px;
  margin-bottom: 40px;
}

  .accordionItemHeading {
    padding-left: 54px;
    padding-right: 20px;
} 

.accordionWrapper i {
  border-top: 14px solid transparent;
  border-bottom: 14px solid transparent;
  border-left: 14px solid var(--main-blue);
  left: 20px;
}

.accordionWrapper .open i {
  border-left: 14px solid black;
  top:24px;
  transform: rotate(90deg) translateX(0);
}
.open .accordionItemContent p {font-size:16px; font-weight:400; line-height:1.5;}
.open .accordionItemContent {padding-left:20px; padding-right:20px; }
  .btn-group button {
    font-size: 18px;
    width: 58px;
    height: 48px;
}

.selection-wl {
  margin-bottom: 70px;
}
.selection-wl p {
  font-size: 16px;
}
  .blue-lines {
    height: 36vw;
}

.one-sentence-wl {margin-top:70px; margin-bottom:70px;}

.wlbox-0 p  {font-weight:400;}

.wlbox-0 {

  max-width: 157px;
}

.price-2 {
  margin-bottom: 22px;}

.prices-wl {
  gap: 28px;
}

.magic-number-wl h3 {
  margin-top: -12px;
  padding-bottom: 20px;
}
.wl-section.wl-easy {padding-bottom:90px;}
.wlbox-0 p {font-size: 15px;}
.price-2 {margin-top:90px;}
.wl-h2 {
  font-size: 26px;
}
  .three-simple-inner {grid-template-columns: 1fr; margin-left:5%; margin-right:5%;}
  .three-simple h3 {padding-left:68px; font-size:4.533vw; font-size: clamp(16px, 4.533vw, 21px);}
  .one-sentence-wl {border-radius:14px;}
  .circle-wl {margin:0; position: absolute; top:-2px;}
  .agency .circle-wl {top:2px;}
  .agency .three-simple {
    gap: 52px;
    padding-bottom: 26px;
}
  .wl .three-simple p {font-size:16px; color:#000f27; padding-top:26px; font-weight:400; }

   .wl-easy p {font-size:16px; font-weight:400; line-height:1.6;}
   .p-circle {width:96px; height:90px; transform: translate(-50% -58%);}
   .wl-easy p {padding-bottom:38px;}
   /* .logo-rm-wl {
      width: 290px;
      height: auto;
      padding-top: 50px;
      text-align: center;
      padding-bottom: 30px;
    }
    .space-wl {
      width: 477px;
      height: auto;
      right: -110px;}
      .inner-wl-ct p {
        padding-bottom: 30px;
    }
    .inner-wl-ct p {margin:auto;}
    .inner-wl-ct {display: block; text-align: center;}*/

    .inner-wl-ct p {line-height: 1.6;}

    .logo-rm-wl {
 
        padding-top: 48px;
     
        padding-bottom: 24px;
    }

    .tabs-onetab{


grid-template-columns: 200px 220px 200px 200px;
scroll-snap-type: x mandatory;
  overflow-x: scroll;
  overflow-y: hidden;
  scroll-snap-stop: always;}
    .logo-rm-wl {
      width: 290px;}
    .header-wl {
        height: 540px;
    }

    .agency .header-wl {height:560px;}
    .space-wl {
      right: -120px;
      width: 529px;}

   .tabs-onetab div span {font-size:18px;}
   .tabs-onetab div {height: 44px;
      margin-top: 16px;
      padding-left: 6%;}
      .agency .tabs-onetab div {
        margin-top: 17px;
      }

      .agency .magic-number-wl p {padding-top:10px!important;}
   
   }
   @media only screen and (max-width: 470px) {
   .agency .circle-wl {top:10px;}}

   @media only screen and (max-width: 380px) {
    .blue-lines {
        height: 36vw;
    }
}
@media only screen and (max-width:375px) {
.agency .circle-wl {top:6px;}}

   @media only screen and (max-width:350px) {
      .space-wl {width:477px; }}

  
   
      .wl-advantages div {display:grid; grid-template-columns: auto auto; align-items: center;}
      .wl p {  color: #000;}
      .wl-advantages p {
       
font-weight: 300;
font-size: 24px;

line-height: 1.16;
      }

      .agency .wl-advantages p {line-height: 1.24;}
      .wl-works {width:52px; height: 48px; margin-left: 10px;}
      .agency .wl-works {margin-left: 14px;}
      .wl-advantages p span {font-weight: 700;}

   /* .agency .wl-advantages p  {position:relative;}
      .open-programmatic {
        position: absolute;
        font-weight: 300!important;
        top: -10px; font-size: 12px;
    }*/

      @media only screen and (max-width: 1300px) { .wl-advantages {
         width:980px;}}

         @media only screen and (max-width: 1180px) { .wl-advantages {
            width:880px;}}

            
         @media only screen and (max-width: 999px) {
          .wl-simple {margin-top:35px;}
          .wl-advantages p {
           font-size: 18px;}
           .wl-works {width:36px; height: auto;}
           .wl-advantages {
            width:650px;}
            .scroll-direction {
              top:unset!important;
              bottom:0;}
           }

           @media only screen and (max-width: 860px) {
           .wl-advantages {
        width: var(--content-width);
        padding-top:60px;
    }
    .wl-advantages div {

    justify-content: center;
}
.wl-advantages div br {display: none;}
.wl-advantages {grid-template-columns: auto; 
   gap: 30px;
   justify-content: center;}
   .wl-works, .agency .wl-works {width:32px; height: auto;  margin-left: 12px;}
     
   .wl-section {padding-bottom:60px;}
    }

    @media only screen and (max-width: 560px) {
    .wl-advantages p{
      font-size:17px;
    }

    .agency .wl-advantages div { grid-template-columns: 1fr 52px;}

    .wl-works, .agency .wl-works {margin-left: 19px;}
    .wl-advantages {
      gap: 17px;
    }}




    .cover {
      position: absolute;
      z-index: 2;
      background-size: cover;
      width: 100%;
      height: auto;
      object-fit: cover;
      left: 0;
      top: 0;
    }
    .container {
      position: relative;
      margin: auto;
      cursor: pointer;
      aspect-ratio: 3 / 2;
    }

    
    .card-outer {
      position: relative;
    }
 
    @supports not (aspect-ratio: 3 / 2) {
      .container::before {
        float: left;
        padding-top: calc(50% + 30px);
        content: "";
      }
      .container::after {
        display: block;
        content: "";
        clear: both;
      }
    }
    .container {
      border-radius: 6px;
    }
    .container:hover {
      transform: scale(1.8) translateY(-20px);
      transform: scale(1.7) translateY(-30px);
      transform: scale(1.54) translateY(-20px);
      transform: scale(1.62) translateY(-24px);
     
      transform: scale(1.6) translateY(-26px);
      transform: scale(1.54) translateY(-20px);
      z-index: 3;
      box-shadow: 0 29px 60px 0 rgba(54, 57, 73, 0.2);
      transition: transform 0.38s ease;
      overflow: hidden;
    }
    .container {
      margin-top: 30px;
      margin-top: 26px;
      width: calc(100% - 20px);
      width: calc(100% - 60px);
    }
    .myVid {
      width: 100%;
      height: auto;
    }
    .container:hover .cover {
      opacity: 0;
      pointer-events: none;
      z-index: -1;
    }
    video {
      position: absolute;
      z-index: 1;
      left: 0;
      top: 0;
    }
    .every-card {
      max-width: 1124px;
      display: grid;
      width: var(--content-width);
      margin: auto;
      padding-top: 45px;
      grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
      grid-gap: 45px;
      min-width: 1114px;
    }

    .every-card.active-wl {
      padding-bottom: 60px;
    }
    .card-outer {
      width: 100%;
      padding-bottom: 90px;
      padding-bottom: 104px;
      padding-bottom: 94px;
      background: white;
      border-radius: 3px;
      box-shadow: 0px -9px 16px 0 rgba(222, 233, 239, 0.8),
        0 6px 16px 0 rgba(222, 233, 239, 1);
    }
    .card-outer h2 {
      font-size: 17px;
      font-size:24px;
     
  margin-top:31px;
  margin-top:21px;
      font-weight: 700;
      padding-bottom: 0;
      text-align: center;
      width: 100%;
      padding-left: 18px;
      padding-right: 18px;
      color: #000;
 line-height:1.16;
      text-transform: capitalize;
      width: calc(100% - 36px);
      /*white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;*/
    margin-bottom:24px;
    }

    .card-outer p {
      font-size: 15px;
line-height: 1.25;
padding-bottom: 4px;
font-weight: 400;
max-width: 82%;
text-align: center;
margin: auto;

    }

    .card-outer p span {font-weight: 700;}

    .scroll-direction {position:absolute; top:0;}

    #toggle-4 .exclude-showcase {display: none;}

    .toggle-container {position: relative;} 


    .every-card {position: relative;}

    .button-keeper-formats {
      width: calc(100% - 90px);
      margin: auto;
      display: grid;
      grid-template-columns: 1fr;

      left: 45px;
      bottom: 30px;
      bottom: 36px;
      position: absolute;
    }
    .button-keeper-formats a {
      display: block;
     
      display: flex;
      justify-content: center;
      text-decoration: none;
      font-size: 15px;
      font-style: normal;
      font-weight: 700;
      align-items: center;
      height: 36px;
      border-radius: 6px;
      background: #15ADF3;
      color: #fff;
      transition: all 0.4s ease-out;
    }

    .button-keeper-formats a:hover {
      box-shadow: inset 0 100px 0 0 rgba(18, 37, 56, 1) !important;
      color: #fff;
    }
 
    @media only screen and (max-width: 1890px) {
      .card-outer h2 {
   
        font-size:23px;
    }
    .button-keeper-formats {
      width: calc(100% - 100px);
    left:50px;
    }
  }

    @media only screen and (max-width: 1229.9px) {
      .every-card {
        min-width: unset;
      }
    }
    @media only screen and (max-width: 1194px) {
    
      .every-card {
        grid-template-columns: repeat(auto-fit, minmax(238px, 1fr));
      }
      .container:hover {
        transform: scale(1.6) translateY(-20px);
      }
    }

    @media only screen and (max-width: 999px) {
      .every-card {
      /*  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));*/
        grid-gap:26px;
      }
      .every-card {padding-top:26px;}
      .card-outer h2 {font-size:20px;}
    }

    
    @media only screen and (max-width: 910px) {
    
      .container:hover {
        transform: scale(1.6) translateY(-20px);
      }
      .button-keeper-formats {
        width: 84%;
        left: 8%;
      }
      @supports not (aspect-ratio: 3 / 2) {
        .container::before {
          padding-top: calc(50% + 44px);
        }
      }
    }
    .mobile-added-box {display:none;}
    @media only screen and (max-width: 875px) {
    
      .every-card {
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        grid-gap: 30px;
        padding-top: 30px;
       
      }
     
    .mobile-added-box {display:block;}
    .will-go-mobile {display:none;}
    }

    @media only screen and (max-width: 700px) { .every-card {
      grid-template-columns: repeat(auto-fit, minmax(212px, 1fr));
    }}
  
    @media only screen and (max-width: 560px) {
      .nopad {margin-top:40px!important;}
      .firsfog .price-2 {margin-top:80px;}
      .firsfog {
        padding-bottom: 91px;
        margin-bottom: 80px;
    }
      .more-text {padding:0; background: none;}
      .faq-wl-two {margin-bottom:70px;}
      .main-features h5 {font-size:21px; margin-bottom:15px;}
      .wl p, .three-simple .active h3, .three-simple .active p,.wl-h2 {
        color: #000f27;
    }

    .otwo {order:3;} .othree {order:2;} 

    .wl-advantages div {
      justify-content: start;
  }

  .mobile-added-box {display:none;}
  .will-go-mobile {display: block;}
    
      .every-card {
        width:unset;
        grid-template-columns: 1fr;
        max-width: 430px;
        margin: auto;
      }
      .container:hover {
        transform: scale(1.28) translateY(-16px);
      }
      .button-keeper-formats {
        width: 90%;
        left: 5%;
        bottom: 26px;
      }
    
      .card-outer h2 {
        bottom: 80px;
      }
      .container {
        margin-top: 26px;
      }
      @supports not (aspect-ratio: 3 / 2) {
        .container::before {
          padding-top: calc(50% + 60px);
          content: "";
        }
      }
    }
    .support {
      margin-bottom: -3px;
      display: flex;
      justify-content: center;
      align-items: center;
      background-image: url(src/assets/img/space.jpg);
      width: 100%;
      height: 558px;
      background-size: cover;
    }
    .support-inner {
      max-width: 980px;
      width: 78%;
    }
    .inner-support-white {
      border-radius: 21px;
      background: white;
    }
    .inner-support-white {
      color: #000;
    }
    .support-inner p {
      font-size: 18px;
      line-height: 1.4;
      padding-top: 20px;
      padding-bottom: 20px;
      padding-left: 26px;
      padding-right: 26px;
      font-family: "Source Sans Pro Regular";
    }
    .support-h {
      font-family: "Source Sans Pro Bold";
      font-size: 36px;
      padding-left: 26px;
      padding-right: 26px;
      color: white;
    }
    p.top-white-p {
      font-size: 19px;
      color: white;
      padding-bottom: 0;
      font-family: "Source Sans Pro Light";
      margin-bottom: 30px;
    }
    .top-white-p a {
      text-decoration: none;
      transition: text-shadow 0.3s ease;
      font-family: "Source Sans Pro Bold";
    }
    .top-white-p a:hover {
      color: #fff;
      text-shadow: 0.3px 0 0 #fff;
      text-decoration: underline;
      text-decoration-color: rgba(255, 255, 255, 0.6);
      text-underline-offset: 2px;
    }
    @media only screen and (max-width: 490px) {
    
      .every-card {max-width:380px; }
      .support-inner {
        width: 88%;
      }
      .support-inner p {
        font-size: 16px;
        padding-left: 5%;
        padding-right: 5%;
      }
      .support-h {
        font-size: 32px;
        padding-left: 5%;
        padding-right: 5%;
      }
      p.top-white-p {
        font-size: 16px;
        padding-left: 5%;
        padding-right: 5%;
      }
    }

    @media only screen and (max-width: 480px) {
      .every-card {width:var(--content-width);}
    }

    @media only screen and (max-width: 358px) {
        .card-outer {
            width: 300px;
        }
    }

    @media only screen and (max-width: 300px) {
        .card-outer {
            width: 270px;
        }
    }