/*
Credit: http://www.templatemo.com
Modernized with Tailwind CSS and Dark Mode Support
*/

:root {
	--primary-color: #be123c;
	--primary-light: #e11d48;
	--primary-dark: #9f1239;
	--text-color: #374151;
	--bg-color: #f3f4f6;
	--card-bg: #ffffff;
}

.dark {
	--text-color: #e5e7eb;
	--bg-color: #111827;
	--card-bg: #1f2937;
}

body {
	margin: 0px;
	padding: 0px;
	color: var(--text-color);
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
	font-size: 14px;
	line-height: 1.6em;
	transition: background-color 0.3s ease, color 0.3s ease;
}

a, a:link, a:visited {
	color: var(--primary-color);
	text-decoration: none;
	transition: color 0.2s ease;
}
a:hover {
	color: var(--primary-light);
	text-decoration: underline;
}

p { margin: 0 0 10px 0; padding: 0; }
img { border: none; max-width: 100%; height: auto; }

h1, h2, h3, h4, h5, h6 {
	color: var(--text-color);
	font-weight: 600;
}
h1 { font-size: 2.5rem; margin: 0 0 30px 0; padding: 5px 0; }
h2 { font-size: 2rem; margin: 0 0 30px 0; color: var(--primary-color); }
h3 { font-size: 1.5rem; margin: 0 0 15px 0; padding: 0; }
h4 { font-size: 1.25rem; margin: 0 0 15px 0; padding: 0; }
h5 { font-size: 1.125rem; margin: 0 0 10px 0; padding: 0; }
h6 { font-size: 1rem; margin: 0 0 5px 0; padding: 0; }

.cleaner { clear: both; width: 100%; height: 0px; font-size: 0px;  }
.cleaner_h10 { clear: both; width:100%; height: 10px; }
.cleaner_h20 { clear: both; width:100%; height: 20px; }
.cleaner_h30 { clear: both; width:100%; height: 30px; }
.cleaner_h40 { clear: both; width:100%; height: 40px; }
.cleaner_h50 { clear: both; width:100%; height: 50px; }
.cleaner_h60 { clear: both; width:100%; height: 60px; }


.float_l { float: left; }
.float_r { float: right; }

.image_wrapper { display: inline-block; border: 1px solid #ccc; background: #fff; padding: 4px; margin-bottom: 10px; }
.image_fl { float: left; margin: 3px 15px 0 0; }
.image_fr { float: right; margin: 3px 0 0 15px; }

blockquote { font-style: italic; margin: 0 0 0 10px;}
cite { font-weight: bold; color:#333; }
cite span { color: #666; }
em { color: #000; }

.tmo_list { margin: 20px 0 20px 20px; padding: 0; list-style: none; float: left; }
.tmo_list li { background: transparent url(images/templatemo_list.png) no-repeat; margin:0 0 20px; padding: 0 0 0 20px; 	line-height: 1em; }
.tmo_list li a { color: #000; }
.tmo_list li a:hover { color: #ff4301; }

.btn_more a {
	float: right;
	display: block;
	font-weight: bold;
	color: #333;
	text-align: center;
}

.btn_more a span {
	font-size: 16px;
}

.btn_more a:hover {
	color: #cc0000;
	text-decoration: none;
}

.hr_divider {
	clear: both;
	padding-bottom: 40px;
	margin-bottom: 40px;
	background: url(css/images/templatemo_hr_divider.png) bottom repeat-x;	
}

#templatemo_wrapper {
	max-width: 1280px;
	padding: 20px;
	margin: 0 auto;
}

#templatemo_top {
	width: 100%;
	min-height: 40px;
	margin-bottom: 20px;
}

#social_box {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 0;
	padding: 0;
	list-style: none;
}
#social_box .social_box_icon {
	margin-right: 40px;
	cursor: default;
	display: block;
}
#social_box li {
	display: block;
	padding: 0;
	margin: 0;
}
#social_box li a {
	display: block;
	transition: opacity 0.2s ease;
}
#social_box li a:hover {
	opacity: 0.8;
}

#contact_form {  padding: 0; }
#contact_form form { margin: 0px; padding: 0px; }
#contact_form form .input_field { width: 380px; padding: 5px 0; background: #fff; border: 1px solid #dfdfdf; }
#contact_form form label { display: block; width: 100px; margin-right: 10px; font-size: 14px; }
#contact_form form textarea { width: 540px;  height: 160px;	background: #fff; 	border: 1px solid #dfdfdf; }

#contact_form form .submit_button { 
	color: #666;
	background: #FFF;
	border: 1px solid #CCC;
	padding: 8px 18px;
	font-weight: bold;
}

/* gallery */
#gallery_box {
		clear: both;
		margin-top: 30px;
	}
	#gallery_box ul { list-style: none; margin: 0; padding: 0; }
	#gallery_box ul li {
		float: left;
		display: block; 
		padding: 0;
		margin: 0;
		width: 240px;
		margin: 0 40px 25px 0;
	}
 
	#gallery_box ul img {
		width: 230px;
		height: 100px;
		padding: 4px;
		background: #fff;
		border: 1px solid #ccc;
		margin-bottom: 10px;
	}
	
	#gallery_box ul .more {
		color: #d20000;
		text-decoration: none;
	}
	
	#gallery_box ul .more span {
		font-size: 16px;
	}
	
/* end of gallery */

.col_w240 {
	float: left;
	width: 240px;
	margin-right: 60px;
}

.col_w540 {
	float: left;
	width: 540px;
	margin-right: 60px;
}

.last_col {
	margin-right: 0;
}

/* footer */
#templatemo_footer {
	max-width: 100%;
	font-size: 0.875rem;
	text-align: center;
	color: var(--text-color);
	padding: 30px 0 10px 0;
	transition: color 0.3s ease;
}

#templatemo_footer a {
	color: var(--primary-color);
	transition: color 0.2s ease;
}

#templatemo_footer a:hover {
	color: var(--primary-light);
}

/* Responsive design */
@media (max-width: 768px) {
	#templatemo_wrapper {
		padding: 10px;
	}

	#templatemo_top {
		flex-direction: column;
		align-items: flex-start;
	}

	.navigation {
		flex-direction: column;
		gap: 0.5rem;
	}

	#slider {
		border-radius: 0.5rem;
	}
}

/* Smooth transitions for dark mode */
* {
	transition-property: background-color, border-color, color;
	transition-duration: 0.3s;
	transition-timing-function: ease;
}

/* Keep text and images sharp */
img, svg {
	transition: none !important;
}

/* end of footer */