@font-face{
	font-family: Roboto-regular;
    src: url("../font/Roboto-Regular.ttf");
}
@font-face{
	font-family: Roboto-Bold;
    src: url("../font/Roboto-Bold.ttf");
}
@font-face{
	font-family: Roboto-Light;
    src: url("../font/Roboto-Light.ttf");
}
@font-face{
	font-family: Roboto-Medium;
    src: url("../font/Roboto-Medium.ttf");
}

@font-face{
	font-family: Roboto-regular;
    src: url("../font/Roboto-Regular.ttf");
}
@font-face{
	font-family: RobotoSlab-Bold;
    src: url("../font/RobotoSlab-Bold.ttf");
}
@font-face{
	font-family: RobotoSlab-Light;
    src: url("../font/RobotoSlab-Light.ttf");
}
@font-face{
	font-family: RobotoSlab-Medium;
    src: url("../font/RobotoSlab-Medium.ttf");
}

body{
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	font-family: Roboto-regular;
}
p{
	color: #777;
	font-size: 16px;
	font-family: Roboto-regular;
}
ul{
	list-style-type: none;
	padding-left: 0px;
}
li{
	list-style-type: none;
	padding-left: 0px;
}
h1{
	font-size: 2.8rem;
	font-family: Roboto-Bold;
	
}
h2{
	font-size: 2.4rem;
}
h4{
	font-size:20px;
}
h5{
	font-size:18px;
}
a{
	color: #101010;
	font-size: 14px;
	text-decoration: none;
}
a:hover{
	text-decoration: none;
}
.container{
	max-width: 1200px;
}
.container-fluid{
	max-width: 1400px;
}
/*header*/
.header{
	width: 100%;
	background-color: #ffffff;
	 transition: box-shadow 0.3s ease-in-out;
}
.header.shadow {
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.header .navbar-brand img{
	max-width: 260px;
}
.header .nav-item .nav-link{
	color: #101010;
	text-transform: uppercase;
	font-size: 15px;
	letter-spacing: 2px;
	font-family: Roboto-regular;
	margin-left: 25px;
	position: relative;
}
.header .nav-item .nav-link::before {
    position: absolute;
    content: "";
    width: 30px;
    height: 1px;
    background-color: #777777;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    opacity: 0;
    transition: opacity 0.3s ease, bottom 0.3s ease;
}

.header .nav-item .nav-link:hover::before {
    bottom: 7px;
    opacity: 1;
}
.header .nav-item .nav-btn {
	background-color: #095685;
	color: #ffffff;
	padding: 8px 15px 8px 15px;
	border-radius: 0px;
	outline: none;
	border:none;
}
.banner-stripe{
	width: 100%;
	background-color: #5d5d5d;
	padding-top: 8px;
	padding-bottom: 8px;
}
.stripe_flex{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	column-gap: 15px;
}
.stripe_flex .stripe{
	display: flex;
	justify-content: flex-start;
	column-gap: 10px;
	align-items: center;
}
.stripe_flex .stripe strong{
	color: #ffffff;
	font-size: 20px;
}
.stripe_flex .stripe span{
	color: #ffffff;
	font-family: Roboto-regular;
	font-size: 15px;
}
.banner-area {
    width: 100%;
    position: relative;
    height: 80vh;
    background-image: 
        linear-gradient(91deg, 
            rgb(70, 70, 70) 0%, 
            rgba(183, 183, 183, 0.36) 76%, 
            rgba(255, 255, 255, 0) 96%, 
            rgba(255, 255, 255, 0.11) 100%, 
            rgba(255, 255, 255, 0) 100%),
        linear-gradient(
            rgba(66, 66, 66, 0.13), 
            rgba(66, 66, 66, 0.13)),
        url("../images/banner.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.banner-caption {
    position: absolute;
    top: 50%; /* Center vertically */
    left: 6%; /* Align text to the left edge of the container */
    transform: translateY(-50%); /* Adjust the vertical alignment */
    max-width: 800px; /* Set a width limit for the content */
    padding-left: 30px; /* Add padding to create spacing from the left edge */
}
.banner-caption h4{
	color: #ffffff;
	text-transform: uppercase;
	font-family: Roboto-Medium;
	letter-spacing: 2px;
	font-size: 22px;
}
.banner-caption h1{
	color: #ffffff;
	display:block;
	line-height: 55px;
	margin-top: 15px;
}
.banner-caption p{
	color: #ffffff;
	font-size: 18px;
	margin-top: 15px;
}
.banner-btn-area{
	margin-top: 20px;
}
.btn-solid{
	background-color: #095685;
	color: #ffffff!important;
	font-family: Roboto-Medium;
	text-transform: uppercase;
	letter-spacing: 2px;
	font-size: 15px;
	border-radius: 0px;
	padding: 12px 30px 12px 30px;
	transition: 0.5s;
	text-decoration: none!important;
}
.btn-solid i {
	margin-left: 35px;
}
.btn-solid:hover{
	margin-left: 5px;
	color: #ffffff;
}

/*services*/
.section-padding{
	padding-top: 50px;
	padding-bottom: 50px;
}
.section-title h2{
	font-family: Roboto-Medium;
	color: #777777;
}
.section-title span{
	color: #474747;
	font-family: Roboto-Bold;
}
/*services*/
.services_tiles{
	margin-top: 30px;
	transition: 0.5s;
	height: 420px;
}
.services_tiles:hover{
	-webkit-box-shadow: 0px 0px 37px 0px rgba(119,119,119,1);
-moz-box-shadow: 0px 0px 37px 0px rgba(119,119,119,1);
box-shadow: 0px 0px 37px 0px rgba(119,119,119,1);
}
.services_tiles .services_icon img{
	max-width: 55px;
    filter: invert(43%) sepia(100%) saturate(5000%) hue-rotate(180deg) brightness(90%) contrast(100%);
}
.services_details_content p{
	margin-top: 15px;
	font-size: 16px;
}

/*welcome*/
.welcome-bg{
	 width: 100%;
    position: relative;
    background-image: 
        linear-gradient(
            rgba(71, 71, 71, 0.93), 
            rgba(71, 71, 71, 0.93)),
        url(../images/Hamburger-Hafen-mit-Moewe.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding-top: 80px;
    padding-bottom: 80px;
}
.light-title h2{
	color: #ffffff;
}
.light-title h5{
	color: #095685;
	letter-spacing: 2px;
	font-family: Roboto-Regular;
}
.welcome_text{
	margin-top: 35px;
}
.welcome_text p{
	color: #ffffff;
	font-size: 16px;
}
.welcome_features li{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	column-gap: 10px;

}
.welcome_features li span{
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #095685;
	background-color: #ffffff;
	padding: 5px;
	font-size: 12px;
}
.welcome_features li  p{
	font-size: 16px;
	color: #ffffff;
}
.advisor-img img{
	max-width: 100%;
}
.advisor-text .advisor-title p{
	 color: #095685;
	 letter-spacing:2px;
	 font-size: 16px;
	 text-transform: uppercase;
}
.advisor-text .advisor-title h2{
	color: #474747;
}
.advisor-img img{
	filter: drop-shadow(0px 0px 4px #777777);
}
/*testimonials*/
.bg-gray{
	background-color: #f7f7f7;
}
.section-title .sub-title{
	color: #095685;
	 letter-spacing:2px;
	 font-size: 16px;
	 text-transform: uppercase;
}
.testimonials_tils{
	margin-top: 30px;
} 

.testimonials_tils .testimonials-user-img img{
  width: 85px;
  height: 85px;
  object-position: center;
  object-fit: cover;
  border-radius: 50%;
   border:1px solid #095685;
}
.testimonials_tils .author h5{
	color: #474747;
	letter-spacing: 2px;
	font-family: Roboto-Bold;
	font-size: 16px;
}
.testimonials_tils .author a{
	color: #095685;
	font-size: 16px;
	letter-spacing: 2px;
}
.testimonials_tils .author a,
.testimonials_tils .author h5{
	display: block;
	line-height: 20px;
}

/* Custom gap for g-7 */
.row.g-7 {
    --bs-gutter-x: 2rem; /* Adjust horizontal gap */
    --bs-gutter-y: 2.5rem; /* Adjust vertical gap */
}

/* Custom gap for g-8 */
.row.g-8 {
    --bs-gutter-x: 5.5rem; /* Adjust horizontal gap */
    --bs-gutter-y: 6rem; /* Adjust vertical gap */
}

.bg-dark-area{
	background-color: #525252;
}
.advise_tiles{
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	column-gap: 50px;
	position: relative;
	height: 180px;
	margin-bottom: 30px;
}
.advise_tiles::before{
	position: absolute;
	content: "";
	width: 1px;
	 top: 20px;
	 bottom: 20px;
	left: 100px;
	background-color: #d2d2d2;
}
.advise_tiles img{
	max-width: 50px;
	    filter: invert(43%) sepia(100%) saturate(5000%) hue-rotate(180deg) brightness(90%) contrast(100%);

}
.advise_tiles h4{
  color: #474747;
  letter-spacing: 2px;
  font-family: Roboto-Bold;
}
.advise_tiles p{
	margin-top: 20px;
	font-size: 16px;
}
.digital_img img{
	max-width: 100%;
	border-radius: 40px;
	filter: drop-shadow(-3px -3px 6px #777777);
}
.benefit-bg{
	 width: 100%;
    position: relative;
    background-image: 
        linear-gradient(
            rgba(71, 71, 71, 0.93), 
            rgba(71, 71, 71, 0.93)),
        url(../images/banner.jpg);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
    padding-top: 80px;
    padding-bottom: 80px;

}
.benefit-bg .section-title h2{
	display: block;
	line-height: 60px;
}
footer{
	width: 100%;
	background-color: #000000;

}
.footer_tiles .footer-header h4{
	 color: #777777;
	 text-transform: uppercase;
}
.footer-body ul {
	list-style-type: none;
	padding-left: 0px;
}
.footer-body ul li{
	display: block;
	line-height: 35px;
}
.footer-body ul li a{
	color: #ffffff;
	font-size: 14px;
	transition: 0.5s;
}
.footer-body ul li a:hover{
	color: #095685;
	font-weight: bold;
}

.footer_tiles ul li i{
	color: #095685;
	margin-right: 5px;
	font-size: 18px;
}
.footer_tiles ul li span{
	color: #ffffff;
}
.f-img img {
    max-width: 100px;
    filter: brightness(0) invert(1);
}
 .d-img img{
	max-width: 200px;
}
.bg-theme{
	background-color: #095685!important;
}
.about-content-area .advisor_content p{
  margin-top: 30px;
}
 .about_section_img img{
	width: 100%;
	height: 580px;
	 border-radius: 25px;
	object-fit: cover;
	object-position: center;
	filter: drop-shadow(0px 0px 9px #a8a8a8);
}
.team-member{
	margin-top: 50px;
}
.team-member img{
	width: 100%;
	filter: drop-shadow(0px 0px 9px #a8a8a8);
	border-radius: 25px;
}
.team-member .member-details h4,
.team-member .member-details span{
	display: block;
	line-height: 20px;
}
.team-member .member-details h4{
	font-family: Roboto-Bold;
	font-size: 22px;
}
.team-member .member-details span{
	color: #777777;
	font-size: 15px;
}
.member-details ul{
	list-style-type: none;
	padding-left: 0px;
}
.member-details ul li{
	margin-bottom: 10px;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	column-gap: 10px;
}
.member-details ul li span{
	width: 35px;
	height: 35px;
	border-radius: 50%;
	background-color: #095685;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 8px;
}
.member-details ul li span i{
	color: #ffffff;
	font-size: 15px;
}
.member-details ul li {
	color: #777777;
	font-size: 16px;
}
.inner_banner{
	width: 100%;
	padding-top: 100px;
	padding-bottom: 100px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	position: relative;
}
.blog_banner {  
    background-image:  
        linear-gradient(  
            rgba(9, 86, 133, 0.70),  
            rgba(9, 86, 133, 0.70)  
        ),  
        url(../images/Hamburger-Hafen-mit-Moewe.jpg);  
   
}
.inner-banner-title{
	text-align: center;
	position: relative;
}
.inner-banner-title h2{
	color: #ffffff;
}
.inner-banner-title h2,
.inner-banner-title p{
	display: block;
	line-height: 45px;

}
.inner-banner-title p{
	color: #ffffff;
	font-size: 18px;
}
.inner-banner-title::before{
	position: absolute;
	content: "";
	width: 150px;
	left: 0px;
	height: 1px;
	top: 45%;
	background-color: #ffffff;
}
.inner-banner-title::after{
	position: absolute;
	content: "";
	width: 150px;
	right: 0px;
	height: 1px;
	top: 45%;
	background-color: #ffffff;
}
.blog_tiles{
	margin-top: 30px;
}
.blog_tiles .date{
	color: #095685;
	font-size: 14px;
	font-family: Roboto-regular;
	letter-spacing: 2px;
}
.blog_tiles .blog-img{
	position: relative;
	margin-top: 20px;
	margin-bottom: 20px;
}
.blog_tiles .blog-img img{
	width: 100%;
	height: 250px;
	object-position: center;
	object-fit: cover;
}
.blog_tiles .blog-details h4{
	font-family: Roboto-bold;
	color: #000000;
}
.blog_tiles .blog-details p{
	overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
color: #777777;
margin-top: 20px;
}
.blog-btn a{
	color: #777777;
	font-size: 16px;
	outline: none;
	padding: 10px;
	border-top: 1px solid #095685;
	border-bottom: 1px solid #095685;
	font-family: Roboto-bold;
	color: #095685; 
}
.blog_tiles .blog-img span{
	background-color: rgba(0,0,0,0.7);
	position: absolute;
	bottom: 0px;
	left: 0px;
	padding: 5px;
	color: #ffffff;
	text-transform: uppercase;
	font-size: 12px;

	letter-spacing: 1px;
}
.contact-title {
	text-align: center;
}
.contact-title span{
	color: #095685;
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 2px;
}
.contact-title h2{
	color: #101010;
	margin-top: 20px;
}
.contact-title p{
	color: #777777;
	margin-top: 25px;
}
.contact_tiles{
	background-color: #f7f7f7;
	display: flex;
	justify-content: flex-start;
	column-gap: 30px;
	height: 130px;
	position: relative;
}
.contact_tiles .contact_details::before{
	content: "";
	position: absolute;
	left: -12px;
	width: 1.5px;
	height: 35px;
	background-color: #095685;
}
.contact_tiles img{
	max-width: 28px;
	margin-top: 2px;
}
.contact_tiles .contact_details{
	position: relative;
}
.contact_tiles .contact_details h4{
	font-family: Roboto-bold;
	color: #101010; 
}
.contact_tiles .contact_details p{
	color: #777777;
	font-size: 18px;
}
.contact-form input[type="text"],
.contact-form input[type="email"],
.contact-form textarea{
	width: 100%;
	outline: none;
	background-color: #ffffff;
	border-radius: 0px;
	padding: 10px;
	border:1px solid #d2d2d2;
}
.contact-form .form-group{
	margin-bottom: 15px;
}
.contact-form .form-group label{
	margin-bottom: 10px;
	font-family: Roboto-Medium;
	color: #777777;
}
.contact-form .form-group span{
	color: red;
}
.contact-form button{
	background-color: #d2d2d2;
	border:1px solid #777777;
	padding: 10px 20px 10px 20px;
	color: #777777;
	font-size: 18px;
	border-radius: 0px;
   font-family: Roboto-regular;
}
.note{
	display: flex;
	justify-content: flex-start;
	column-gap: 10px;
}
.note i{
	color: #095685;
	margin-top: 2px;
}
.note p{
	color: #777777;
	font-size: 13px;
	font-style: italic;
}
.blog-banner-header{
	background-color: rgba(255,255,255,0.9);
	padding: 20px;
}
.blog-banner-header h2{
	font-family: Roboto-bold;
	display: block;
	line-height: 50px;
}
.divider{
	border-top:1px solid #d2d2d2;
	border-bottom: 1px solid #d2d2d2;
	padding-top: 15px;
	padding-bottom: 15px;
}
.bredcum{
	list-style-type: none;
	padding-left: 0px;
	text-align: center;
}
.bredcum {
    list-style-type: none;
    padding-left: 0px;
    text-align: center;
}

.bredcum li {
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
    position: relative;
}

.bredcum li::after {
    content: " / ";
    color: #777777;
    margin-left: 10px;
}

.bredcum li:last-child::after {
    content: "";
}

.bredcum li a {
    color: #777777;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 14px;
}
.blog_details_tiles p{
	margin-top: 30px;
}
.blog_details_tiles img{
	width: 100%;
}
.dotted-list {
    list-style: none; /* Remove default bullets */
    padding-left: 0px;
}

.dotted-list li {
    position: relative;
    padding-left: 15px; /* Space for the dot */
    margin-bottom: 15px;
    color: #777777;
}

.dotted-list li::before {
    content: "•"; /* Unicode for bullet point */
    color: #777777; /* Customize dot color */
    font-size: 16px; /* Adjust dot size */
    position: absolute;
    left: 0;
    top: 0;
}
.blog_details_tiles a{
	color: #287acb;
	text-decoration: underline;
	font-weight: bold;
}
.author_details_box{
  border:1px solid #d2d2d2;
  padding: 15px;
}
.author_tiles h4{
	color: #777777;
	font-weight: bold;
	text-transform: uppercase;
	font-size: 15px;
	letter-spacing: 2px;
}
.author_tiles p{
	margin-top: 18px;
}
.author-img img{
	max-width: 100%;
}
.author-img{
	position: relative;
	margin-top: -50px;
}