/* xs - SMARTPHONE PORTRAIT STYLES */ 
/*++++++++++new Class++++++++++ */
.masked-outer-shadow{
	    filter: drop-shadow(0px 14px 8px rgba(50, 50, 0, 0.5));
}
.svg-defs {
  position: absolute;
  width: 0;
  height: 0;
  }

.masked{
    clip-path: polygon(0 3%, 14% 4%, 32% 2%, 55% 2%, 68% 1%, 81% 2%, 100% 1%, 100% 98%, 80% 99%, 56% 97%, 34% 98%, 21% 97%, 0% 100%, 0 97%);

}


.hit-glas{
background: rgba(255, 255, 255, 0.44);
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(3.9px);
-webkit-backdrop-filter: blur(3.9px);
}

.hit-ship-move:before{
	 transform: translate(-50%, 0%) rotate(-3deg);
  animation: drive-ship 1s ease-out infinite;
	  animation-play-state: paused;
  animation-delay: calc(var(--scroll) * -1s);
  animation-iteration-count: 1;
  animation-fill-mode: both;
}
footer .footer-ship{
		 transform: rotate(-3deg);
  animation: logo-sailing 3s linear infinite alternate;
  animation-iteration-count: infinite;
  animation-fill-mode: both;
}
.overflow{
	overflow:hidden;
}

.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal.active{
  transform: translateY(0);
  opacity: 1;
}
/*++++++++++Generate-xxx-style++++++++++ */
article.post div.inside-article, .separate-containers .comments-area{
	background: rgba(255, 255, 255, 0.64);
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	background-image: none;
	 
}


/* body.page #page.site{
	   background-image: url('http://hanseimporttrade.de/wp-content/uploads/2023/06/hit-background-2c.png');
    background-attachment: fixed;
	background-repeat: repeat;
} */
.gb-button-hit-button-sec:hover .gb-icon, .gb-button-hit-button:hover .gb-icon{
	    z-index: 10;
	
}
.gb-button-hit-button {
  overflow: hidden;
  transition: 0.2s transform ease-in-out;
  will-change: transform;
  z-index: 0;
}
.comment-form>.form-submit{
	    text-align: right;
}
.comment-form>.form-submit .submit{
	    color: var(--accent-2);
    font-family: Zilla Slab, serif;
    font-size: 1.2em;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 15px 20px;
    border-style: solid;
    border-width: 3px;
    border-color: var(--accent-2);
    transition: all 0.5s ease;
	background:transparent;
}
.gb-button-hit-button::after, .gb-button-hit-button-sec::after, .comment-form>.form-submit .submit::after {
  background-color: var(--accent);
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-100%, 0) rotate(10deg);
  transform-origin: top left;
  transition: 0.2s transform ease-out;
  will-change: transform;
  z-index: -1;
}
.gb-button-text{
z-index:10;	
}
.gb-button-hit-button:hover::after, .gb-button-hit-button:focus::after, .gb-button-hit-button-sec:focus::after, .gb-button-hit-button-sec:hover::after, .comment-form>.form-submit .submit:hover:after, .comment-form>.form-submit .submit:focus:after {
  transform: translate(0, 0);
	z-index: 1;
}
.ninja-forms-field.gb-button-hit-button:hover::after, .ninja-forms-field.gb-button-hit-button:focus::after {
z-index:12431234;
}

.gb-button-hit-button:hover, .gb-button-hit-button:focus {
  color: var(--base-2);
  transform: scale(1.05);
  will-change: transform;
}
.hit-shadow, .gb-button-hit-button, .comment-form>.form-submit .submit{
	      box-shadow: 7px 8px 2px 0px rgba(11, 118, 189, 0.24),4px 4px 0px 0px rgba(11, 118, 189, 0.24),2px 2px 11px 2px rgba(11, 118, 189, 0.24), inset 0px 0px 4px 0px #DDB863;
        transition: all 0.3s cubic-bezier(0.42, 0.63, 0.76, 1.47);
}
    
.hit-shadow:hover, .gb-button-hit-button:hover, .hit-shadow:focus, .gb-button-hit-button:focus, .comment-form>.form-submit .submit:hover {
box-shadow: 10px 11px 5px -1px rgba(43, 133, 194, 0.24),7px 7px 3px -2px rgba(43, 133, 194, 0.24),5px 5px 14px 4px rgba(43, 133, 194, 0.24);

}


 .sticky-enabled nav.main-navigation.is_stuck {
	box-shadow: none;
}

.navigation-branding img, .site-logo.mobile-header-logo img{
	height:120px;
}

.main-navigation#sticky-navigation,  .navigation-stick, .main-navigation#sticky-navigation .menu-toggle{
	    background-image: none;
	 transition: 0.2s transform ease-out;
}


.main-navigation .menu-toggle{
	background-image: none;
}
nav .inside-navigation .menu-toggle{
	background: rgba(255, 255, 255, 0.44);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(3.9px);
	-webkit-backdrop-filter: blur(3.9px);
	border: 0;
	 border-radius: 0 0 5px 5px;
    padding: 0 10px;
}

.navigation-branding, .site-logo.mobile-header-logo {
    display: flex;
    align-items: center;
    order: 0;
    margin-right: 10px;
    background: rgba(255, 255, 255, 0.44);
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(3.9px);
    -webkit-backdrop-filter: blur(3.9px);
    border: 0;
    border-radius: 0 0 5px 5px;
    padding: 0 10px;
}
.main-navigation .inside-navigation{
	    align-items: inherit;
}
.main-navigation.has-branding .menu-toggle, .main-navigation.has-sticky-branding.navigation-stick .menu-toggle {
    padding: 0 18px;
    margin-right: 10px;
}
nav{
	transition: 0.2s all ease-out;
}

nav:after {
	content: " ";
    height: 55px;
    z-index: 0;
    top: 0px;
    right: 0px;
    position: absolute;
    display: block;
    width: 100%;
    padding: 0px;
    background-color: gradient;
    background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.016241299303944357) 60%, rgba(0,0,0,0.15011600928074247) 90%, rgba(0,0,0,0.2218097447795823) 100%);
    mix-blend-mode: darken;
	    pointer-events: none;
}
/*++++++++++Ninaj Forms++++++++++ */
.pum-theme-1344, .pum-theme-default-theme{
	background: rgb(239 239 239 / 44%);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(3.9px);
	-webkit-backdrop-filter: blur(3.9px);
}

.pum-theme-1344 .pum-container, .pum-theme-default-theme .pum-container{
	background-image: linear-gradient(115deg, rgba(11, 118, 189, 0.9) 10%, rgba(11, 118, 189, 0.61) 100%);
    transition: all 0.5s ease;
	background: var(--base);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(3.9px);
	-webkit-backdrop-filter: blur(3.9px);
}

div#pum_popup_title_1353 {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    position: relative;
    width: 100%;
    text-align: center;
    color: var(--accent);
    font-size: 2.5em;
    text-transform: uppercase;
    line-height: 1.5em;
    letter-spacing: 0.06em;
    margin-top: 30px;
    margin-bottom: 10px;
    text-shadow: var(--contrast-2) 1px 3px 0;
    font-weight: 500;
}



/***/

.hit-start-journey .nf-form-fields-required {
    display: none;
}

.hit-start-journey .nf-form-content.journey-element {
    display: flex;
    justify-content: center;
}

.hit-start-journey .nf-progress-container {
	background-color: var(--accent);opacity: 0.2;height: 20px;margin: 0 0 10px 0;border-radius: 5px;
}

table.nf-table-display, table.nf-table-display td{
	border:none;
}

.hit-start-journey .nf-progress {
    background-color: var(--accent-2);
    height: 100%;
    border-radius: 5px 0 0 5px;
    background-image: url('http://hanseimporttrade.de/wp-content/uploads/2023/06/hit-background-2c.png');
    background-attachment: fixed;
}



.hit-start-journey ul.nf-next-previous {
    display: flex;
    width: 100%;
    flex-wrap: nowrap;
    justify-content: space-between;
    top: 0;
    left: 0;
    text-align: right;
    height: 60px;
    z-index: 1;
    width: 100%;
    margin: 0 !important;
}

.nf-mp-body {
    z-index: 20;
    position: relative;
}

.hit-start-journey .nf-next-previous::after {
    display: none;
}





.nf-mp-footer {position: inherit; z-index: 1;}

.hit-start-journey li.nf-next-item, li.nf-previous-item {
    height: 100%;
	width:40%;
}

.hit-start-journey input.nf-next, .hit-start-journey input.nf-previous {
    height: 100%;
    width: 100%;
    font-size: 1.8em;
    border-style: solid;
    border-width: 3px;
    display: inline-flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: center;
    position: relative;
    color: var(--accent-2);
    border-color: var(--accent-2);
	background: transparent;
	box-shadow: 7px 8px 2px 0px rgba(11, 118, 189, 0.24), 4px 4px 0px 0px rgba(11, 118, 189, 0.24), 2px 2px 11px 2px rgba(11, 118, 189, 0.24), inset 0px 0px 4px 1px #DDB863;
    transition: all 0.3s cubic-bezier(0.42, 0.63, 0.76, 1.47);
}

.hit-start-journey input.nf-next:hover, .hit-start-journey input.nf-previous:hover, .hit-start-journey input.nf-next:focus, .hit-start-journey input.nf-previous:focus {
	color: var(--base-2);
    border-color: var(--accent);
	background: var(--accent);
	transform: translate(5px, 0px);
	box-shadow: 7px 8px 2px 0px rgba(11, 118, 189, 0.24), 4px 4px 0px 0px rgba(11, 118, 189, 0.24), 2px 2px 11px 2px rgba(11, 118, 189, 0.24), inset 0px 0px 0px 0px var(--accent);
}
.hit-start-journey input.nf-next:hover, .hit-start-journey input.nf-next:focus{
	 transform: translate(5px, 0px);
}

.hit-start-journey input.nf-previous:hover, .hit-start-journey input.nf-previous:focus{
	
	transform: translate(-5px, 0px);
}
.hit-start-journey .nf-form-layout {
    margin: 0 25px;
}

.hit-start-journey .nf-next-previous li.nf-next-item {
    float: right;
    position: relative;
    margin: 0 0 0 auto !important;
}

.hit-start-journey .field-wrap.textbox-wrap .nf-field-label, .hit-start-journey .field-wrap.email-wrap .nf-field-label{
	    margin-bottom: 2px;
}

.hit-start-journey .field-wrap label, .hit-start-journey .field-wrap label{
	    font-size: 0.9em;
}
.hit-start-journey .field-wrap.textbox-wrap input[type=text], .hit-start-journey .field-wrap.email-wrap input[type=email], input[type=text], textarea{
	-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
  border-bottom: 1px solid var(--accent);
		box-shadow: 0 0 5px transparent;
}
.hit-start-journey .field-wrap.textbox-wrap input[type=text]:focus, .hit-start-journey .field-wrap.email-wrap input[type=email]:focus, input[type=text]:focus, textarea:focus {
 box-shadow: 0 0 5px var(--accent);
  border: 1px solid var(--accent);
}

.nf-form-content .list-select-wrap .nf-field-element, .nf-form-content input:not([type=button]), .nf-form-content textarea{
		-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 3px;
  margin: 5px 1px 3px 0px;
	border-top:none;
	border-left:none;
  border-bottom: 1px solid var(--accent);
	border-right: none;
}
.nf-error.field-wrap .nf-field-element:after {
    background: white;
    color: red;
    font-family: FontAwesome;
    font-size: 1em;
    content: "\f12a";
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    height: 20px;
    width: 20px;
    line-height: 1.2em;
    text-align: center;
    transition: all .5s;
    border: 1px solid red;
    border-radius: 7px;
}
.nf-error .ninja-forms-field{
	border-bottom: 1px solid red !important;
}

.nf-error .nf-error-msg{
	font-size:0.8em;
}
@-moz-document url-prefix() {
  select {
    color: rgba(0,0,0,0);
    text-shadow: 0 0 0 #ffffff;
  }
}
select {  
	-webkit-transition: all 0.30s ease-in-out;
  	-moz-transition: all 2.30s ease-in-out;
  	-ms-transition: all 02.30s ease-in-out;
  	-o-transition: all 02.30s ease-in-out;
 	background: rgba(255, 255, 255, 0.44);
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(3.9px);
	-webkit-backdrop-filter: blur(3.9px);	
  border-radius:0px;
  border-bottom: 1px solid var(--accent);
  color: #ffffff;
  outline: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
	box-shadow: 0 0 5px transparent;
}
.list-wrap.listcountry-wrap .nf-field-element:after, .list-wrap.list-select-wrap .nf-field-element:after{
	pointer-events: none;
-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 2.30s ease-in-out;
  -ms-transition: all 02.30s ease-in-out;
  -o-transition: all 02.30s ease-in-out;
  width: 0; 
  height: 0; 
 border-top: 0.8em solid var(--accent);
  border-right: 0.8em solid transparent;
  border-left: 0.8em solid  transparent;
  position: absolute;
  right: 0;
  top: 0;
  content: " ";
	margin:20px;
	    z-index: 2;
}
.nf-form-content .list-select-wrap>div div:after{
	display:none;
}
.list-wrap .nf-field-element:focus:after {
 
  border-top: 1em solid var(--accent);
  border-right: 0.2em solid transparent;
  border-left: 0.2em solid transparent;
}
select:active, select:focus {
	 box-shadow: 0 0 5px var(--accent);
  border: 1px solid var(--accent);

}


.hit-start-journey .listradio-wrap .nf-field-element label:after{
	background: var(--contrast-2);
	width:3em;
	height: calc(100% + 12px);;
	border-radius:0px;
 left: -3.5em;
    top: 0;
	bottom:0;
	margin-top:-6px;
	border:none;
}
.hit-start-journey .listradio-wrap .nf-field-element label:before{
	background: var(--contrast-3);
	-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all .30s ease-in-out;
  -ms-transition: all .30s ease-in-out;
  -o-transition: all .30s ease-in-out;
	height: 2em;
    width: 2em;
    left: -3em;
    top: -4px;
	bottom:0;
	    z-index: 2;
border-radius: 50%;
    content: "";
    position: absolute;
}
.hit-start-journey .listradio-wrap .nf-field-element label.nf-checked-label:after{
	border:none;
}
.listradio-wrap .nf-field-element label.nf-checked-label:before
{
	-webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all .30s ease-in-out;
  -ms-transition: all .30s ease-in-out;
  -o-transition: all .30s ease-in-out;
	    background: var(--accent);
height: 2em;
    width: 2em;
    left: -3em;
    top: -4px;

}

.hit-start-journey .listradio-wrap .nf-field-element ul li:first-child label:after{
	border-radius:50% 50% 0 0 ;
}
.hit-start-journey .listradio-wrap .nf-field-element ul li:last-child label:after{
	border-radius:0 0 50% 50%;
}
.nf-form-content .listmultiselect-wrap select {
    overflow: auto;
}

.listradio-wrap .nf-field-element label {
    margin-left: 3em !important;
}

/* md - TABLET PORTRAIT STYLES */ 
@media (min-width: 768px) {
  nav .inside-navigation .menu-bar-items {
  	background: rgba(255, 255, 255, 0.44);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(3.9px);
  -webkit-backdrop-filter: blur(3.9px);
  	border: 0;
  	 border-radius: 0 0 5px 5px;
      padding: 0 10px;
  }
}

/* xl - DESKTOP STYLES */ 
@media (min-width: 1200px) {
  .gb-container-hit-section{
  	/*background: radial-gradient(circle, rgba(255,255,255,1) 76%, rgba(255,255,255,0) 100%);
  */}
  
  .hit-shadow, .gb-button-hit-button{
  	      box-shadow: 7px 8px 2px 0px rgba(11, 118, 189, 0.24),4px 4px 0px 0px rgba(11, 118, 189, 0.24),2px 2px 11px 2px rgba(11, 118, 189, 0.24), inset 0px 0px 4px 1px #DDB863;
          transition: all 0.3s cubic-bezier(0.42, 0.63, 0.76, 1.47);
  }
      
  .hit-shadow:hover, .gb-button-hit-button:hover, .hit-shadow:focus, .gb-button-hit-button:focus {
  box-shadow: 10px 11px 5px -1px rgba(43, 133, 194, 0.24),7px 7px 3px -2px rgba(43, 133, 194, 0.24),5px 5px 14px 4px rgba(43, 133, 194, 0.24);
  
  }
  
  
  .hit-glas{
  background: rgba(255, 255, 255, 0.44);
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(3.9px);
  -webkit-backdrop-filter: blur(3.9px);
  }
  
  .masked{
  clip-path: polygon(0 10%, 17% 3%, 42% 1%, 55% 3%, 68% 0, 81% 4%, 100% 1%, 100% 92%, 80% 97%, 56% 93%, 34% 98%, 21% 95%, 0% 100%, 0 77%);
  
  }
  
  
  #wave-1{
      height: 20px;
      width: calc(100% + 1.3px);
      position: relative;
      left: 50%;
      transform: translateX(-50%);
      min-width: 100%;
  }
}