diff --git a/assets/dynamic_css/dynamic-directory.php b/assets/dynamic_css/dynamic-directory.php
new file mode 100644
index 00000000..31f12f1c
--- /dev/null
+++ b/assets/dynamic_css/dynamic-directory.php
@@ -0,0 +1,38 @@
+<?php
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( empty( $args['css_profile_card_bg'] ) && empty( $args['css_card_thickness'] ) &&
+	empty( $args['css_profile_card_text'] ) && empty( $args['css_card_bordercolor'] ) &&
+	empty( $args['css_img_bordercolor'] ) ) {
+	return;
+}
+?>
+<style>
+	<?php if ( ! empty( $args['css_profile_card_bg'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?> .um-member {
+			background: <?php echo esc_attr( $args['css_profile_card_bg'] ); ?>;
+		}
+	<?php } ?>
+	<?php if ( ! empty( $args['css_card_thickness'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?> .um-member {
+			border-width: <?php echo esc_attr( $args['css_card_thickness'] ); ?>;
+		}
+	<?php } ?>
+	<?php if ( ! empty( $args['css_profile_card_text'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?> .um-member-card * {
+			color: <?php echo esc_attr( $args['css_profile_card_text'] ); ?>;
+		}
+	<?php } ?>
+	<?php if ( ! empty( $args['css_card_bordercolor'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?> .um-member {
+			border-color: <?php echo esc_attr( $args['css_card_bordercolor'] ); ?>;
+		}
+	<?php } ?>
+	<?php if ( ! empty( $args['css_img_bordercolor'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?> .um-member-photo img {
+			border-color: <?php echo esc_attr( $args['css_img_bordercolor'] ); ?>;
+		}
+	<?php } ?>
+</style>
diff --git a/assets/dynamic_css/dynamic-global.php b/assets/dynamic_css/dynamic-global.php
new file mode 100644
index 00000000..641ebf62
--- /dev/null
+++ b/assets/dynamic_css/dynamic-global.php
@@ -0,0 +1,21 @@
+<?php
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( ! isset( $args['max_width'] ) && ! isset( $args['align'] ) ) {
+	return;
+}
+?>
+<style>
+	<?php if ( isset( $args['max_width'] ) && $args['max_width'] ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?>.um {
+			max-width: <?php echo esc_attr( $args['max_width'] ); ?>;
+		}
+	<?php } ?>
+	<?php if ( isset( $args['align'] ) && in_array( $args['align'], array( 'left', 'right' ), true ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?>.um {
+			margin-<?php echo esc_attr( $args['align'] ); ?>: 0px !important;
+		}
+	<?php } ?>
+</style>
diff --git a/assets/dynamic_css/dynamic-profile.php b/assets/dynamic_css/dynamic-profile.php
new file mode 100644
index 00000000..14803fd2
--- /dev/null
+++ b/assets/dynamic_css/dynamic-profile.php
@@ -0,0 +1,37 @@
+<?php
+if ( ! defined( 'ABSPATH' ) ) {
+	exit;
+}
+
+if ( ! isset( $args['photosize'] ) || 'original' === $args['photosize'] ) {
+	$args['photosize'] = um_get_metadefault( 'profile_photosize' ); // Cannot be more than metadefault value.
+}
+
+$args['photosize'] = absint( $args['photosize'] );
+
+$photosize_up = ( $args['photosize'] / 2 ) + 10;
+$meta_padding = ( $args['photosize'] + 60 ) . 'px';
+?>
+<style>
+	<?php if ( ! empty( $args['area_max_width'] ) ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?>.um .um-profile-body {
+			max-width: <?php echo esc_attr( $args['area_max_width'] ); ?>;
+		}
+	<?php } ?>
+	.um-<?php echo esc_attr( $args['form_id'] ); ?>.um .um-profile-photo a.um-profile-photo-img {
+		width: <?php echo esc_attr( $args['photosize'] ); ?>px;
+		height: <?php echo esc_attr( $args['photosize'] ); ?>px;
+	}
+	.um-<?php echo esc_attr( $args['form_id'] ); ?>.um .um-profile-photo a.um-profile-photo-img {
+		top: -<?php echo esc_attr( $photosize_up ); ?>px;
+	}
+	<?php if ( is_rtl() ) { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?>.um .um-profile-meta {
+			padding-right: <?php echo esc_attr( $meta_padding ); ?>;
+		}
+	<?php } else { ?>
+		.um-<?php echo esc_attr( $args['form_id'] ); ?>.um .um-profile-meta {
+			padding-left: <?php echo esc_attr( $meta_padding ); ?>;
+		}
+	<?php } ?>
+</style>
diff --git a/assets/dynamic_css/dynamic_directory.php b/assets/dynamic_css/dynamic_directory.php
deleted file mode 100644
index f1105145..00000000
--- a/assets/dynamic_css/dynamic_directory.php
+++ /dev/null
@@ -1,45 +0,0 @@
-<style type="text/css">
-<?php
-
-if ( isset( $css_profile_card_bg ) && ! empty( $css_profile_card_bg ) ) {
-
-print ".um-$form_id .um-member {
-	background: $css_profile_card_bg;
-}";
-
-}
-
-if ( isset( $css_card_thickness ) && ! empty(  $css_card_thickness  ) ) {
-
-print ".um-$form_id .um-member {
-	border-width: $css_card_thickness;
-}";
-
-}
-
-if ( isset( $css_profile_card_text ) && ! empty( $css_profile_card_text ) ) {
-
-print ".um-$form_id .um-member-card * {
-	color: $css_profile_card_text;
-}";
-
-}
-
-if ( isset( $css_card_bordercolor ) && ! empty( $css_card_bordercolor ) ) {
-
-print ".um-$form_id .um-member {
-	border-color: $css_card_bordercolor;
-}";
-
-}
-
-if ( isset( $css_img_bordercolor ) && ! empty( $css_img_bordercolor ) ) {
-
-print ".um-$form_id .um-member-photo img {
-	border-color: $css_img_bordercolor;
-}";
-
-}
-
-?>
-</style>
\ No newline at end of file
diff --git a/assets/dynamic_css/dynamic_global.php b/assets/dynamic_css/dynamic_global.php
deleted file mode 100644
index 2e867156..00000000
--- a/assets/dynamic_css/dynamic_global.php
+++ /dev/null
@@ -1,17 +0,0 @@
-<style type="text/css">
-<?php
-
-if ( isset( $max_width ) && $max_width ) {
-print ".um-$form_id.um {
-	max-width: {$max_width};
-}";
-}
-
-if ( isset( $align ) && in_array( $align, array( 'left', 'right' ) ) ) {
-print ".um-$form_id.um {
-	margin-$align: 0px !important;
-}";
-}
-
-?>
-</style>
diff --git a/assets/dynamic_css/dynamic_profile.php b/assets/dynamic_css/dynamic_profile.php
deleted file mode 100644
index ae7309d2..00000000
--- a/assets/dynamic_css/dynamic_profile.php
+++ /dev/null
@@ -1,49 +0,0 @@
-<?php if ( ! defined( 'ABSPATH' ) ) exit; ?>
-
-<style type="text/css">
-
-	<?php if ( ! $photosize || $photosize == 'original' ) {
-		//cannot be more than metadefault value
-		$photosize = um_get_metadefault( 'profile_photosize' );
-	}
-	$photosize = filter_var( $photosize, FILTER_SANITIZE_NUMBER_INT );
-
-	$photosize_up = ( $photosize / 2 ) + 10;
-	$meta_padding = ( $photosize + 60 ) . 'px';
-
-	if ( $area_max_width ) {
-		print "
-		.um-$form_id.um .um-profile-body {
-			max-width: $area_max_width;
-		}
-		";
-	}
-
-	print "
-	.um-$form_id.um .um-profile-photo a.um-profile-photo-img {
-		width: ".$photosize."px;
-		height: ".$photosize."px;
-	}
-	";
-
-	print "
-	.um-$form_id.um .um-profile-photo a.um-profile-photo-img {
-		top: -".$photosize_up."px;
-	}
-	";
-
-	if ( is_rtl() ) {
-		print "
-		.um-$form_id.um .um-profile-meta {
-			padding-right: $meta_padding;
-		}
-		";
-	} else {
-		print "
-		.um-$form_id.um .um-profile-meta {
-			padding-left: $meta_padding;
-		}
-		";
-	}
-	?>
-</style>
\ No newline at end of file
diff --git a/includes/core/class-shortcodes.php b/includes/core/class-shortcodes.php
index 06bd3b30..3b15dbeb 100644
--- a/includes/core/class-shortcodes.php
+++ b/includes/core/class-shortcodes.php
@@ -861,15 +861,20 @@ if ( ! class_exists( 'um\core\Shortcodes' ) ) {
 		 * @param $args
 		 * @return array
 		 */
-		function get_css_args( $args ) {
+		public function get_css_args( $args ) {
 			$arr = um_styling_defaults( $args['mode'] );
-			$arr = array_merge( $arr, array( 'form_id' => $args['form_id'], 'mode' => $args['mode'] ) );
+			$arr = array_merge(
+				$arr,
+				array(
+					'form_id' => $args['form_id'],
+					'mode'    => $args['mode'],
+				)
+			);
 			return $arr;
 		}
 
-
 		/**
-		 * Load dynamic css
+		 * Load dynamic CSS.
 		 *
 		 * @param array $args
 		 *
@@ -877,31 +882,31 @@ if ( ! class_exists( 'um\core\Shortcodes' ) ) {
 		 */
 		public function dynamic_css( $args = array() ) {
 			/**
-			 * Filters turn on for disable global dynamic CSS for fix the issue #306
+			 * Filters for disable global dynamic CSS. It's false by default, set it to true to disable.
 			 *
 			 * @since 2.0
 			 * @hook  um_disable_dynamic_global_css
 			 *
-			 * @param {bool}  $disable  Disable global CSS.
+			 * @param {bool} $disable Disable global CSS.
 			 *
-			 * @return {bool} $disable Disable global CSS.
+			 * @return {bool} Disable global CSS.
 			 *
-			 * @example <caption>Turn on for disable global dynamic CSS.</caption>
-			 * function my_disable_dynamic_global_css( $disable ) {
-			 *     // your code here
-			 *     return $disable;
-			 * }
-			 * add_filter( 'um_disable_dynamic_global_css', 'my_disable_dynamic_global_css', 10, 1 );
+			 * @example <caption>Turn off enqueue of global dynamic CSS.</caption>
+			 * add_filter( 'um_disable_dynamic_global_css', '__return_true' );
 			 */
 			$disable_css = apply_filters( 'um_disable_dynamic_global_css', false );
 			if ( $disable_css ) {
 				return '';
 			}
 
-			include_once um_path . 'assets/dynamic_css/dynamic_global.php';
+			if ( empty( $args['form_id'] ) ) {
+				return '';
+			}
 
-			if ( isset( $args['mode'] ) && in_array( $args['mode'], array( 'profile', 'directory' ), true ) ) {
-				$file = um_path . 'assets/dynamic_css/dynamic_' . $args['mode'] . '.php';
+			include_once UM_PATH . 'assets/dynamic_css/dynamic-global.php';
+
+			if ( array_key_exists( 'mode', $args ) && in_array( $args['mode'], array( 'profile', 'directory' ), true ) ) {
+				$file = UM_PATH . 'assets/dynamic_css/dynamic-' . $args['mode'] . '.php';
 
 				if ( file_exists( $file ) ) {
 					include_once $file;
@@ -911,14 +916,13 @@ if ( ! class_exists( 'um\core\Shortcodes' ) ) {
 			return '';
 		}
 
-
 		/**
 		 * Loads a template file
 		 *
 		 * @param $template
 		 * @param array $args
 		 */
-		function template_load( $template, $args = array() ) {
+		public function template_load( $template, $args = array() ) {
 			if ( is_array( $args ) ) {
 				$this->set_args = $args;
 			}