/*

CTC Separate Stylesheet

Updated: 2026-04-11 18:18:38

Theme Name: Divi-child-RPSLM-4-27-6-04112026-v4276

Theme URI: http://www.elegantthemes.com/gallery/divi/

Template: Divi

Author: Elegant Themes

Author URI: http://www.elegantthemes.com

Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.

Version: 4.27.6.1775945918

*/

/*-------------------------------------------------------------------------------------------

>>> TABLE OF CONTENTS:

---------------------------------------------------------------------------------------------

1.0	Standard

	 1.1 Footer Customize - Blank Page

	 1.2 Header Customization	 		

	 1.3 Awesome FontAwesome

	 1.4 Custom Button Styles

	 	 1.4.1 Limitless Custom Buttons

	 1.5 Change logo for fixed header

	 1.6 Footer Custimization

	 1.7 WP Star Rating (wp_star_rating)

	 1.8 Blurb Module Customization

	 1.9_1kpoker-portrait-optin-layout

			Notes: Email Optin Module ID

	 1.10 Menu Vertical

	 1.11 Menu Open Mobile Menu

	 1.12  

2.0	Blog / Post Custom layout

	2.1  - Blog Feature Image Default Size

	2.2  - Blog Placing the Feature Image to the left

	2.3  - Posts: Fullwidth Post Slider 

	2.7  - Blog Grid - Custom Layout	

	2.7B - Blog Grid - Custom Layout (NEW) 	

	2.8  - Blog Grid - Custom Layout (NEW)- Latest Articles

	2.9  - Custom Blog Grid - Latest Articles

	2.10 - Blog Recent Post - Sidebar

	2.11 - Blog Sidebar Sticky

	2.12 - Add Meta Text Icons To The Divi Blog Module

	2.13 - Highlight The Divi Blog Date Or Category On The Image

	2.14 - Highlight Post Date Or Category On The Image

	2.15 - Entire Divi Blog Module Posts Clickable	

3.0 Toolset DataGrid

	3.1 Datagrid

4.0 AdRotate

	4.1  -  AdRotate Resize 3Rows X 2Cols 125x125

	4.2  -  AdRotate dynamically populate the banner

	4.3  -  Advanced Ads dynamically populate the banner

	

/*--------------------------------------------------------------

	0.0 CSS Varables

--------------------------------------------------------------*/

:root {

	--dark-primary-color: 	 #7A2B81;

	--default-primary-color: #963690;

	--light-primary-color:	 #E0BFDD;

	--text-primary-color: 	 #FFFFFF;

	--accent-color: 		 #548B27;

	--primary-text-color: 	 #212121;

	--secondary-text-color:  #757575;

	--divider-color: 		 #BDBDBD;	

	--default-white-color: 	 #FAFAFA; 

}

/*	---------------------------------------------------------

		1.1 Footer Customize - Blank Page				

------------------------------------------------------------- */

	.ropaslim-footer-copyright {

		color: var(--light-primary-color) !important;

		font:inherit !important;

		font-size:12px !important;

		font-weight: 400 !important;

		}

/*	---------------------------------------------------------

		1.2 horizontal line before and after

------------------------------------------------------------- */

/*center the heading and lines*/

.ropaslim-heading-line-both h4 {

	display: flex;

	width: 100%;

	justify-content: center;

	align-items: center;

	text-align: center;

}

/*add and adjust the lines*/

.ropaslim-heading-line-both h4:before,

.ropaslim-heading-line-both h4:after {

	content: '';

	border-top: 2px solid;

	margin: 0 20px 0 0;

	flex: 0 0 20px;

	color: var(--accent-color) !important;;

}



/*add spacing between heading and lines*/

.ropaslim-heading-line-both h4:after {

	margin: 0 0 0 20px;

}

/* ****** Left align the heading and lines ***** */

.ropaslim-heading-line-left h4 {

	display: flex;

	width: 100%;

	justify-content: flex-start;

	align-items: center;

	text-align: center;

}

/*add and adjust the lines*/

.ropaslim-heading-line-left h4:before {

	content: '';

	border-top: 3px solid;

	margin: 0 0 0 0;

	flex: 0.03 0 20px !important;

	color: var(--accent-color);

}

/*add spacing between heading and line*/

.ropaslim-heading-line-left h4:before {

	margin: 0 10px 0 0;

}

/* ****** Right align the heading and lines ***** */

.ropaslim-heading-line-right h4 {

	display: flex;

	width: 100%;

	justify-content: center;

	align-items: center;

	text-align: center;

}

/*add and adjust the lines*/

.ropaslim-heading-line-right h4:after {

	content: '';

	border-top: 2px solid;

	margin: 0 20px 0 0;

	flex: 1 0 20px;

	color: var(--accent-color);

}

/*add spacing between heading and line*/

.ropaslim-heading-line-right h4:after {

	margin: 0 0 0 20px;

}



 /* --------------------------------------------------------------

  		1.6 Footer Custimization

 ------------------------------------------------------------ */	

		

  .rpsl-cta-footer{

		display: none !important;

   }

   

/*	---------------------------------------------------------

		1.8 Blurb Module Customization		

------------------------------------------------------------- */

/* Style Guide Blurb Module Style RSPL - Blurb 7

/*style the Divi Blurb link as a button*/

a.ropaslim-blurb-button {

	color: var(--primary-text-color);

	background: transparent;

	border-bottom: 1px solid var(--divider-color);

	padding-top: 0;

	padding-bottom: 0;	

	border-radius: none;

	text-transform: inherit;

	display: inline-block;

}

/*style the Divi Blurb link text as a button on hover*/

a.ropaslim-blurb-button:hover {

	background: transparent;

	color: var(--text-primary-color);

	/* border-bottom: 2px solid var(--text-primary-color); */

	cursor: pointer;

}

a.ropaslim-blurb-button:after {

	content: '';

	display: block;

	margin: auto;

	height: 3px;

	width: 0px;

	background: transparent;

	transition: width .5s ease, background-color .5s ease;

}

a.ropaslim-blurb-button:hover:after {

  width: 100%;

  background: var(--text-primary-color);

}



/* --------------------------------------------------------

	 1.10 Menu Vertical Layout

---------------------------------------------------------- */



/*remove default 11px padding on each side of list items*/



.ropaslim-vertical-menu .et-menu > li {

	padding-left: 0px;

	padding-right: 0px;

}





/*make the menu items fullwidth and add space between them*/



.ropaslim-vertical-menu .et_pb_menu__menu nav ul li {

	display: block;

	width: 100%;

	margin: 10px 0;

}





/*style the menu items*/



.ropaslim-vertical-menu .et_pb_menu__menu nav ul li a {

	padding: 20px!important;

	background: #742b81 !important;

	border-radius: 6px;

	border: 2px solid #742b81 !important;

	

}





/*style the menu items on hover*/



.ropaslim-vertical-menu .et_pb_menu__menu nav ul li a:hover {

	opacity: 1!important;

	color: #ffffff;

	background: #f2e5f1 !important;

	border-color: #f2e5f1 !important;

	

}





/*style the active menu item*/



.ropaslim-vertical-menu .et_pb_menu__menu nav ul li.current-menu-item a {

	opacity: 1!important;

	color: #ffffff;

	background: #00d263;

	border-color: #00d263;

	

}





/*style the arrow icon if there are submenus*/



.ropaslim-vertical-menu .et_pb_menu__menu .menu-item-has-children>a:first-child:after {

	content: "5" !important;

	/*change arrow icon for submenu*/

	padding: 20px;

	font-size: 24px;

}





/*style the arrow icon if there are submenus to submenus*/



.ropaslim-vertical-menu .et_pb_menu__menu .menu-item-has-children .menu-item-has-children>a:first-child:after {

	padding: 8px !important;

	right: 0px !important;

}





/*make the submenu align directly to the right of the menu item instead of below*/



.ropaslim-vertical-menu .et_pb_menu__menu nav ul li ul {

	top: 0!important;

}





/*align submenu to the right of menu link*/



.ropaslim-vertical-menu .et_pb_menu__menu nav li ul {

	left: 100%!important;

}





/*add an icon to the left of each menu item link*/



.ropaslim-vertical-menu ul li a:before {

	font-family: 'ETMODULES';

	content: '\24';

	text-align: center;

	vertical-align: middle;

	margin-right: 8px;

	margin-left: 0px;

	color: #9ccc5f;

	font-size: 1.3em;

	transition: all .75s ease;

}





/*style the menu items icon*/



.ropaslim-vertical-menu ul li a:hover:before {

	margin-left: 7px;

	color: #9ccc5f !important;

	transition: all .75s ease;

}





/*style the active menu item icon*/



.ropaslim-vertical-menu ul li.current-menu-item a:before {

	margin-left: 7px;

	color: #ffffff!important;

}



@media (m
ax-width: 980px) {
	/*open the mobile menu up and use on all devices*/
	.et-db #et-boc .et-l .ropaslim-vertical-menu .et_pb_menu__menu {
		display: flex;
	}
	/*hide the hamburger icon*/
	.et-db #et-boc .et-l .ropaslim-vertical-menu .et_mobile_nav_menu {
		display: none;
	}
}


/*	---------------------------------------------------------
		1.12 Link in Bio horizontal line before and after
------------------------------------------------------------- */
/*center the heading and lines*/
.ropaslim-heading-line-both-linkinbio h3,
.ropaslim-heading-line-both-linkinbio h4 {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	text-align: center;
}
/*add and adjust the lines*/
.ropaslim-heading-line-both-linkinbio h3:before,
.ropaslim-heading-line-both-linkinbio h3:after,
.ropaslim-heading-line-both-linkinbio h4:before,
.ropaslim-heading-line-both-linkinbio h4:after {
	content: '';
	border-top: 5px solid;
	margin: 0 20px 0 0;
	flex: 0 0 50px;
	color: var(--dark-primary-color) !important;
}

/*add spacing between heading and lines*/
.ropaslim-heading-line-both-linkinbio h3:after,
.ropaslim-heading-line-both-linkinbio h4:after {
	margin: 0 0 0 20px;
}
/* ****** Left align the heading and lines ***** */
.ropaslim-heading-line-left-linkinbio h4 {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	text-align: center;
}

/*add and adjust the lines*/
.ropaslim-heading-line-left-linkinbio h4:before {
	content: '';
	border-top: 3px solid;
	margin: 0 0 0 0;
	flex: 0.03 0 20px !important;
	color: var(--dark-primary-color) !important;
}
/*add spacing between heading and line*/
.ropaslim-heading-line-left-linkinbio h4:before {
	margin: 0 10px 0 0;
}
/* ****** Right align the heading and lines ***** */
.ropaslim-heading-line-right-linkinbio h4 {
	display: flex;
	width: 100%;
	justify-content: center;
	align-items: center;
	text-align: center;
}
/*add and adjust the lines*/
.ropaslim-heading-line-right-linkinbio h4:after {
	content: '';
	border-top: 2px solid;
	margin: 0 20px 0 0;
	flex: 1 0 20px;
	color: var(--accent-color);
}
/*add spacing between heading and line*/
.ropaslim-heading-line-right-linkinbio h4:after {
	margin: 0 0 0 20px;
}

/* -----------------------------------------------------
	2.2  - Blog Placing the Feature Image to the left
------------------------------------------------------- */
	/*set the image width*/
	.ropaslim-blog-sidebar-list .entry-featured-image-url {
		width: 100px;
		float: left;
		margin-bottom: 0!important;
	}
	/*set the text width*/
	.ropaslim-blog-sidebar-list .entry-title,
	.ropaslim-blog-sidebar-list .post-meta {
		width: calc(100% - 100px);
		float: left;
		padding-left: 20px;
	}
	/*make the image square*/
	.ropaslim-blog-sidebar-list .entry-featured-image-url {
		padding-top: 100px;
		display: block;
	}
	.ropaslim-blog-sidebar-list .entry-featured-image-url img {
		position: absolute;
		height: 100%;
		width: 100%;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		object-fit: cover;
	}
	/*adjust the spacing and add a border between the posts*/
	.ropaslim-blog-sidebar-list .et_pb_post:not(:last-child) {
		border-bottom: 1px solid #dddddd!important;
		padding-bottom: 20px;
		margin-bottom: 20px;
	}
/* -----------------------------------------------------------
	2.10 - Blog Recent Post - Sidebar
-------------------------------------------------------------- */
.ropaslim-blog-sidebar-list-v2 .et_pb_post {
    display: flex;
    align-items: flex-start;
	margin-bottom: 1px;
}
.ropaslim-blog-sidebar-list-v2 .entry-featured-image-url {
    flex: 0 0 75px; 
    margin-right: 20px; 
}
.ropaslim-blog-sidebar-list-v2 .title-meta-wrapper {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}
.ropaslim-blog-sidebar-list-v2 .post-meta {
    order: 1;
}
.ropaslim-blog-sidebar-list-v2 .entry-title {
    order: 2;
}
.ropaslim-blog-sidebar-list-v2 .entry-featured-image-url img {
    width: 75px;
    height: 75px;
    object-fit: cover;
}
/* -----------------------------------------------------------
	2.12 - Add Meta Text Icons To The Divi Blog Module
-------------------------------------------------------------- */
		/*add icon to blog author meta text*/
	
	.ropaslim-blog-meta-icons .post-meta .author a:before {
		content: "\e08a";
		font-family: ETMODULES;
		color: #0071fc;
		font-weight: bold;
		margin-right: 4px;
	}
	
	/*add icon to blog category meta text*/
	
	.ropaslim-blog-meta-icons .post-meta>a:before {
		content: "\e078";
		font-family: ETMODULES;
		color: #0071fc;
		font-weight: bold;
		margin-right: 4px;
	}
	
	/*add icon to blog published date meta text*/
	
	.ropaslim-blog-meta-icons .post-meta .published:before {
		content: "\e023";
		font-family: ETMODULES;
		color: #0071fc;
		font-weight: b
old;
		margin-right: 4px;
	}
/* ----------------------------------------------------------
	2.13 - Highlight The Divi Blog Date 
	Or Category On The Image
------------------------------------------------------------	
	/*position the blog posts to prepare for moving the meta*/
	.ropaslim-blog-separators article {
		position: relative;
	}
	
	/* *** Move And Highlight The Divi Blog Published Date Over Top The Featured Image *** */
	/*move the Divi Blog post meta published date up over the image*/
	.ropaslim-blog-separators .et_pb_blog_grid .et_pb_post .post-meta span.published {
		position: absolute;
		top: 0;
		left: 0;
		margin-bottom: 0;
		color: var(--light-primary-color);
		background: var(--dark-primary-color);
		padding: 6px 12px;
		margin: 15px;
		width: 64px;
		height: 61px;
		text-align: center;
		text-transform: uppercase;
		}
	
	/* *** Move And Highlight The Divi Blog Category Over Top The Featured Image * ***/
	/*move the Divi Blog post meta category up over the image*/
	.ropaslim-blog-separators .et_pb_blog_grid .et_pb_post .post-meta a:nth-child(3) {
		position: absolute;
		top: 0;
		left: 0;
		margin-bottom: 0;
		color: #ffffff!important;
		background: #0071fc!important;
		padding: 6px 12px;
		margin: 15px;
		border-radius: 50px;
	}
	
	
	.ropaslim-blog-separators .post-content> a:before {
		display: inline-block;  
		content: "\39";		
		font-family: ETMODULES;
		font-size: 16px;
		color: var(--primary-text-color);
		font-weight: bold;
		margin-right: 4px;
	
	}
	-blog-separators .post-content> a:hover{		
		color: var(--dark-primary-color);
	}
	
	
}
/* ---------------------------------------------------------------
	2.14 - Entire Divi Blog Module Posts Clickable
---------------------------------------------------------------- */
	/*add a neceassry position to the blog posts*/
	.ropaslim-entire-posts-clickable .et_pb_blog_grid .et_pb_post, .et_pb_posts .et_pb_post {
		position: relative;
	}
	
	/*make the title link spread over the entire post*/
	
	.ropaslim-entire-posts-clickable .et_pb_blog_grid .et_pb_post .entry-title a:after, .et_pb_posts .et_pb_post .entry-title a:after {
		position: absolute;
		display: block;
		content: "";
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
	}
	
	/*change the mouse cursor into a pointer*/
	
	.ropaslim-entire-posts-clickable .et_pb_blog_grid .et_pb_post:hover, .et_pb_posts .et_pb_post:hover {
		cursor: pointer;
	}
	
/* ---------------------------------------------------------------	
	2.15 - Highlight Post Date Or Category On The Image
---------------------------------------------------------------- */
	/*position the blog posts to prepare for moving the meta*/
	.ropaslim-post-separators {
		position: relative;
	}
	
	/* *** Move And Highlight The Divi Blog Published Date Over Top The Featured Image *** */
	/*move the Divi Blog post meta published date up over the image*/
	.ropaslim-post-separators .et_pb_title_meta_container span.published {
		position: absolute;
		top: -400px;
		left: 0;
		margin-bottom: 0;
		color: var(--light-primary-color);
		background: var(--dark-primary-color);
		padding: 6px 12px;
		margin: 15px;
		width: 61px;
		height: 61px;
		}
	.ropaslim-post-separators .et_pb_title_meta_container .author a:before{
			display: inline-block;  
			content: "\f007";		
			font-family: FontAwesome;
			font-size: 16px;
			color: var(--dark-primary-color);
			font-weight: bold;
			margin-right: 4px;
		
		}
	
	.ropaslim-post-separators .et_pb_title_meta_container .author a:after{
		background-color: #e9ecef;
	    display: inline-block;
	    content: "";
	    width: 1px;
	    height: 17px;
	    vertical-align: middle;
	    margin: 0 12px;
	}
	
	
	.ropaslim-post-separators .et_pb_title_meta_container a:before{
		display: inline-block;  
		content: "\f07b";		
		font-family: FontAwesome;
		font-size: 16px;
		color: var(--dark-primary-color);
		font-weight: bold;
		margin-right: 4px;
	
	}
	.ropaslim-post-separators .et_pb_title_meta_container a:after{
		background-color: #e9ecef;
	    display: inline-block;
	    content: "";
	    width: 1px;
	    height: 17px;
	    vertical-align: middle;
	    margin: 0 12px;
	}
	
	.ropaslim-post-separators .et_pb_title_meta_container .comments-number a:before{
		display: inline-block;  
		content: "\f075";		
		font-family: FontAwesome;
		font-size: 16px;
		color: var(--dark-primary-color);
		font-weight: bold;
		margin-right: 4px;
	
	}
/* ----------------------------------------------------------------
	4.2  -  AdRotate dynamically populate the banner
------------------------------------------------------------------ */
#adrotate_dynamically .banner {
    position: relative;
    width: 728px;
    height: 90px;
}
#adrotate_dynamically .banner-link {
    display: block;
    width: 100%;
    height: 100%;
    text-decoration: none;
    color: inherit; /* Ensure text inherits color */
}
#adrotate_dynamically .banner-image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures the image covers the entire area */
}
#adrotate_dynamically .banner-content {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center; /* Center the text horizontally */
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center content vertically */
    align-items: center;
}
#adrotate_dynamically .banner-content h1 {
    margin: 0;
    padding: 0;
    color: white; /* Example text color */
    font-size: 20px; /* Adjust as needed */
}
#adrotate_dynamically .banner-content p {
    color: white; /* Example text color */
    font-size: 14px; /* Adjust as needed */
}
#adrotate_dynamically .cta-button {
    padding: 5px 10px;
    background-color: #007bff;
    color: white;
    text-decoration: none;
    border-radius: 3px;
    font-size: 12px;
    margin-top: 5px;
    cursor: pointer;
}
	

/* ----------------------------------------------------------------
	4.3  -  Advanced Ads dynamically populate the banner
------------------------------------------------------------------ */
#advads_dynamically_728x90 .banner {
    width: 728px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 15px;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
    margin: auto; /* Center the banner */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    position: relative; /* Needed for absolute positioning of the overlay */
}

#advads_dynamically_728x90 .banner::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.7); /* Black overlay with 50% opacity */
    z-index: 1; /* Ensure it sits above the background image */
}
	
#advads_dynamically_728x90 .content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    color: white;
    flex-grow: 1;
    flex-basis: 60%; /* Allocate space for the content */
}

/* Make sure content and CTA are positioned above the overlay */
#advads_dynamically_728x90 .content, #advads_dynamically_728x90 .cta {
    position: relative;
    z-index: 2;
}

#advads_dynamically_728x90 .header {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 4px; /* Reduced space between header and body */
}

#advads_dynamically_728x90 .body {
    font-size: 14px; /* Updated font size */
    line-height: 1.4; /* New line height */
    /* The rest of your styles for .body */
    text-align: left; /* Adjust text alignment as needed */
}

#advads_dynamically_728x90 .cta {
    background-color: #6b2678; /* Updated background color */
    border-radius: 5px;
    padding: 10px 5px;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    height: 50px; /* Set a specific height for the button */
    flex-basis: 40%; /* Allocate space for the CTA button */
    transition: background-color 0.3s; /* Smooth transition for hover effect */
}

#advads_dynamically_728x90 .cta a {
    color: #F2E5F1; /* Updated text color */
    text-decoration: none;
    text-align: center;
    display: block;
    text-transform: capitalize; /* Capitalize the first letter of each word */
}

#advads_dynamically_728x90 .cta:hover {
    background-color: #963690; /* Color change on hover */
}


/* ----------------------------------------------------------------
	4.4  -  Advanced Ads dynamically populate the banner with the
		    image to the left of banner
------------------------------------------------------------------ */
/* Base styles */
.advads_imgleft_banner {
    max-width: 728px;
    height: 90px;
    display: flex;
    align-items: center;
    font-family: Arial, sans-serif;
    background: #501E66;
    margin: auto auto 20px auto; /* Center the banner horizontally and add margin at the bottom */
    box-sizing: border-box;
}

.advads_imgleft_banner .image-section {
    flex: 0 0 auto; /* Do not grow or shrink, auto for content size */
    padding: 10px; /* Padding around the image */
    display: flex;
    align-items: center;
    justify-content: center;
}

.advads_imgleft_banner .image-section img {
    max-height: 70px; /* Adjusted for padding */
    width: auto; /* Maintain aspect ratio */
}

.advads_imgleft_banner .content-and-cta {
    display: flex;
    flex-direction: row; /* Set direction to row for larger screens */
    flex-grow: 1; /* Take up the remaining space */
    justify-content:space-between;
    align-items: center; /* Center content vertically */
    padding: 0 10px; /* Padding on the sides */
}

.advads_imgleft_banner .content-section h1 {
    font-size: 18px;
    color: #FFF;
    margin: 0; /* Remove default margin */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.advads_imgleft_banner .content-section p {
    font-size: 15px;
    color: #FFF;
    margin: 2px 0; /* Space between title and paragraph */
    white-space: wrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.advads_imgleft_banner .cta-button a {
    background-color: #548b27;
    color: white;
    padding: 15px 20px; /* Increased padding for larger screens */
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
	white-space: nowrap;
}

.advads_imgleft_banner .cta-button a:hover {
    background-color: #9ccc5f;
}
	
/* ---------------------------------------------------------------
	99.0 Mobile @media
---------------------------------------------------------------- */
/*** Responsive Styles Large Desktop And Above ***/
@media all and (min-width: 1405px) {
}
 
/*** Responsive Styles Standard Desktop Only ***/
@media all and (min-width: 1100px) and (max-width: 1405px) {
 
 	/*	--------------------------------------------------------------
		1.2 #_1kpoker-portrait-optin-layout
	------------------------------------------------------------ */	
	
	#ropaslim-portrait-optin-layout.et_pb_newsletter .et_pb_newsletter_form .et_pb_contact_field_half {
		flex-basis: 100% !important;		
	}
	
	#ropaslim-portrait-optin-layout.et_pb_signup_0 {
	    width: 90%;
	}
	
   /* --------------------------------------------------------------
		Footer
   ------------------------------------------------------------ */	
		
  .rpsl-cta-footer{
		visibility: hidden;
   }
	
}
/*** Responsive Styles 1024px ***/
@media all and (min-width: 1024px) and (max-width: 1099px) {
	
  /* --------------------------------------------------------------
		Footer
   ------------------------------------------------------------ */	
   
	.rpsl-email-optin-footer{
      display: none !important;
    }
	
	.rpsl-cta-footer {
		display: block !important;
	}
	
}
 
/*** Responsive Styles Tablet And Below ***/
@media all and (max-width: 980px) {
 
	.rpsl-email-optin-footer {
      display: none !important;
    }
	
	.rpsl-cta-footer {
		display: block !important;
	}

	/* --------------------------------------------------------
	 	1.10 Menu Vertical Layout
	---------------------------------------------------------- */

	/*open the mobile menu up and use on all devices*/
	.et-db #et-boc .et-l .ropaslim-vertical-menu .et_pb_menu__menu {
		display: flex;
	}
	/*hide the hamburger icon*/
	.et-db #et-boc .et-l .ropaslim-vertical-menu .et_mobile_nav_menu {
		display: none;
	}
	
	/* --------------------------------------------------------
	 	1.11 Menu Open Mobile Menu
	---------------------------------------------------------- */
	.ropaslim-open-mobile-menu .et_pb_menu__menu {
		display: flex!important;
	}
	.ropaslim-open-mobile-menu .et_mobile_nav_menu {
		display: none!important;
	}
	
	/* ----------------------------------------------------------------
		1.12  -  
	------------------------------------------------------------------ */
	.ropaslim-heading-line-left-linkinbio h4 {
		text-align: left !important;
	}


}

 
@media (max-width: 768px) {


	/* ----------------------------------------------------------------
		4.3  -  Advanced Ads dynamically populate the banner
	------------------------------------------------------------------ */

    #advads_dynamically_728x90 .banner {
        width: 100%; /* Full width on smaller screens */
        height: auto; /* Allow height to adjust based on content */
        padding: 10px;
        flex-direction: column; /* Stack elements vertically */
        background-size: cover; /* Change to contain so the image fits within the banner */
    }

    #advads_dynamically_728x90 .content, #advads_dynamically_728x90 .cta {
        flex-basis: auto; /* Reset flex-basis for mobile */
    }

    #advads_dynamically_728x90 .header {
        font-size: 16px; /* Adjust font size for smaller screens */
        text-align: center; /* Center text for mobile */
    }

    #advads_dynamically_728x90 .body {
        font-size: 11px; /* Adjust body font size for mobile */
        text-align: center; /* Center text for mobile */
    }

    #advads_dynamically_728x90 .cta {
        width: 60%; /* Adjust CTA width */
        margin-top: 10px; /* Add space between content and CTA */
    }
	
	
	/* ----------------------------------------------------------------
		4.4  -  
	------------------------------------------------------------------ */	
    .advads_imgleft_banner {
        width: 100%; /* Full width on smaller screens */
        height: auto; /* Adjust height to content */
        flex-direction: column; /* Stack elements vertically */
        padding: 10px 0; /* Padding for smaller screens */
    }

    .advads_imgleft_banner .image-section {
        width: 100%; /* Full width for the image section */
        padding: 5px; /* Padding around the image section */
    }

    .advads_imgleft_banner .content-and-cta {
        width: 100%; /* Full width for the content and CTA */
        padding: 0; /* Remove padding */
        flex-direction: column; /* Stack content and CTA button vertically */
    }

    .advads_imgleft_banner .content-section,
    .advads_imgleft_banner .cta-button {
        width: 100%; /* Full width on smaller screens */
        padding: 5px; /* Padding for smaller screens */
    }

    .advads_imgleft_banner .content-section h1,
    .advads_imgleft_banner .content-section p {
        font-size: 14px; /* Adjust font size for smaller screens */
        white-space: normal; /* Allow text wrapping */
        overflow: visible; /* Let text show */
        text-overflow: clip; /* Remove ellipsis */
    }

    .advads_imgleft_banner .cta-button a {
        padding: 10px 16px; /* Reduced padding for smaller screens */
        font-size: 14px; /* Adjust CTA font size for smaller screens */
    }

}

/*** Responsive Styles Smartphone Only ***/
@media all and (max-width: 767px) {
 
}
 

/*** Responsive Styles Smartphone Portrait ***/
@media all and (max-width: 479px) {
 
}