<?php

// Class For Custom Font #100

// Exit if direct access.
if (!defined ('ABSPATH')) exit;

class _CLASS_CUSTOM_FONT_N10 
{

public function custom_font_N10 ()
{
?>
<!DOCTYPE html>

<div class="section-all-accordion">
       <div class="accordion-icon" id="accordion_10">
           <img id="accordion_open_10" src="<?php echo FONT_FARSI_ASSETS_IMG_DIR . 'plus.png';?>" />
           <img id="accordion_close_10" src="<?php echo FONT_FARSI_ASSETS_IMG_DIR . 'negative.png';?>" />
       </div>
    <div class="section-accordion-title">
		<div class="custom-font-input-note">
		
			<input class="custom_font_note" type="text" id="custom_font_note_#10" name="custom_font_note_#10" value="<?php echo get_option('custom_font_note_#10');?>" placeholder="<?php echo esc_html__("Note 10" , 'font-farsi' );?>" />
			
			<span class="simptip-position-top simptip-warning" data-tooltip="<?php echo esc_html__("use note input text" , 'font-farsi' );?>">
			<span class="dashicons dashicons-warning color-effect"></span>
			
		</div>
    </div>
	
	<?php submit_button(); ?>
	
	
    <div class="section-accordion-content" id="accordion_content_10">
        <div class="accordion-content">
        <!--   Accordion content <br>
               Accordion content <br>
               Accordion content <br>
		<-->
<div id="custom-font">
<div class="custom_font_panel">
<div class="enable_custom_font">
<span class="simptip-position-left simptip-success" data-tooltip="<?php echo esc_html__("Enable Or Disable Note" , 'font-farsi' );?>">
<span class="dashicons dashicons-warning color-effect"></span>
 &nbsp;
</span>
<label for="custom_font_enable_#10"> 
<?php echo esc_html__("Enable", 'font-farsi'); ?>	
<input type="checkbox" id="custom_font_enable_#10" name="custom_font_enable_#10" value="Enable" <?php checked(get_option('custom_font_enable_#10'),'Enable',true) ;?>>
</label>
</div>
<br>
<div class="custom_font_tag_path_panel">
 <label for="custom_font_#10">
	<select id="custom_font_#10" name="custom_font_tag_name_#10">
		<optgroup label="A">
		<option value="a" <?php selected( get_option('custom_font_tag_name_#10'), 'a', true ); ?>>a</option>
		<option value="abbr" <?php selected( get_option('custom_font_tag_name_#10'), 'abbr', true ); ?>>abbr</option>
		<option value="address" <?php selected( get_option('custom_font_tag_name_#10'), 'address', true ); ?>>address</option>
		<option value="area" <?php selected( get_option('custom_font_tag_name_#10'), 'area', true ); ?>>area</option>
		<option value="article" <?php selected( get_option('custom_font_tag_name_#10'), 'article', true ); ?>>article</option>
		<option value="aside" <?php selected( get_option('custom_font_tag_name_#10'), 'aside', true ); ?>>aside</option>
		<option value="audio" <?php selected( get_option('custom_font_tag_name_#10'), 'audio', true ); ?>>audio</option>
		</optgroup>
		<optgroup label="B">
		<option value="b" <?php selected( get_option('custom_font_tag_name_#10'), 'b', true ); ?>>b</option>
		<option value="base" <?php selected( get_option('custom_font_tag_name_#10'), 'base', true ); ?>>base</option>
		<option value="bdi" <?php selected( get_option('custom_font_tag_name_#10'), 'bdi', true ); ?>>bdi</option>
		<option value="bdo" <?php selected( get_option('custom_font_tag_name_#10'), 'bdo', true ); ?>>bdo</option>
		<option value="big" <?php selected( get_option('custom_font_tag_name_#10'), 'big', true ); ?>>big</option>
		<option value="blockquote" <?php selected( get_option('custom_font_tag_name_#10'), 'blockquote', true ); ?>>blockquote</option>
		<option value="body" <?php selected( get_option('custom_font_tag_name_#10'), 'body', true ); ?>>body</option>
		<option value="button" <?php selected( get_option('custom_font_tag_name_#10'), 'button', true ); ?>>button</option>
		</optgroup>
		<optgroup label="C">
		<option value="canvas" <?php selected( get_option('custom_font_tag_name_#10'), 'canvas', true ); ?>>canvas</option>
		<option value="caption" <?php selected( get_option('custom_font_tag_name_#10'), 'caption', true ); ?>>caption</option>
		<option value="cite" <?php selected( get_option('custom_font_tag_name_#10'), 'cite', true ); ?>>cite</option>
		<option value="code" <?php selected( get_option('custom_font_tag_name_#10'), 'code', true ); ?>>code</option>
		<option value="col" <?php selected( get_option('custom_font_tag_name_#10'), 'col', true ); ?>>col</option>
		<option value="colgroup" <?php selected( get_option('custom_font_tag_name_#10'), 'colgroup', true ); ?>>colgroup</option>
		</optgroup>
		<optgroup label="D">
		<option value="data" <?php selected( get_option('custom_font_tag_name_#10'), 'data', true ); ?>>data</option>
		<option value="datalist" <?php selected( get_option('custom_font_tag_name_#10'), 'datalist', true ); ?>>datalist</option>
		<option value="dd" <?php selected( get_option('custom_font_tag_name_#10'), 'dd', true ); ?>>dd</option>
		<option value="del" <?php selected( get_option('custom_font_tag_name_#10'), 'del', true ); ?>>del</option>
		<option value="details" <?php selected( get_option('custom_font_tag_name_#10'), 'details', true ); ?>>details</option>
		<option value="dfn" <?php selected( get_option('custom_font_tag_name_#10'), 'dfn', true ); ?>>dfn</option>
		<option value="dialog" <?php selected( get_option('custom_font_tag_name_#10'), 'dialog', true ); ?>>dialog</option>
		<option value="div" <?php selected( get_option('custom_font_tag_name_#10'), 'div', true ); ?>>div</option>
		<option value="dl" <?php selected( get_option('custom_font_tag_name_#10'), 'dl', true ); ?>>dl</option>
		<option value="dt" <?php selected( get_option('custom_font_tag_name_#10'), 'dt', true ); ?>>dt</option>
		</optgroup>
		<optgroup label="E">
		<option value="em" <?php selected( get_option('custom_font_tag_name_#10'), 'em', true ); ?>>em</option>
		<option value="embed" <?php selected( get_option('custom_font_tag_name_#10'), 'embed', true ); ?>>embed</option>
		</optgroup>
		<optgroup label="F">
		<option value="fieldset" <?php selected( get_option('custom_font_tag_name_#10'), 'fieldset', true ); ?>>fieldset</option>
		<option value="figcaption" <?php selected( get_option('custom_font_tag_name_#10'), 'figcaption', true ); ?>>figcaption</option>
		<option value="figure" <?php selected( get_option('custom_font_tag_name_#10'), 'figure', true ); ?>>figure</option>
		<option value="footer" <?php selected( get_option('custom_font_tag_name_#10'), 'footer', true ); ?>>footer</option>
		<option value="form" <?php selected( get_option('custom_font_tag_name_#10'), 'form', true ); ?>>form</option>
		</optgroup>
		<optgroup label="H">
		<option value="h1" <?php selected( get_option('custom_font_tag_name_#10'), 'h1', true ); ?>>h1</option>
		<option value="h2" <?php selected( get_option('custom_font_tag_name_#10'), 'h2', true ); ?>>h2</option>
		<option value="h3" <?php selected( get_option('custom_font_tag_name_#10'), 'h3', true ); ?>>h3</option>
		<option value="h4" <?php selected( get_option('custom_font_tag_name_#10'), 'h4', true ); ?>>h4</option>
		<option value="h5" <?php selected( get_option('custom_font_tag_name_#10'), 'h5', true ); ?>>h5</option>
		<option value="h6" <?php selected( get_option('custom_font_tag_name_#10'), 'h6', true ); ?>>h6</option>
		<option value="head" <?php selected( get_option('custom_font_tag_name_#10'), 'head', true ); ?>>head</option>
		<option value="header" <?php selected( get_option('custom_font_tag_name_#10'), 'header', true ); ?>>header</option>
		<option value="html" <?php selected( get_option('custom_font_tag_name_#10'), 'html', true ); ?>>html</option>
		</optgroup>
		<optgroup label="I">
		<option value="i" <?php selected( get_option('custom_font_tag_name_#10'), 'i', true ); ?>>i</option>
		<option value="iframe" <?php selected( get_option('custom_font_tag_name_#10'), 'iframe', true ); ?>>iframe</option>
		<option value="img" <?php selected( get_option('custom_font_tag_name_#10'), 'img', true ); ?>>img</option>
		<option value="input" <?php selected( get_option('custom_font_tag_name_#10'), 'input', true ); ?>>input</option>
		<option value="ins" <?php selected( get_option('custom_font_tag_name_#10'), 'ins', true ); ?>>ins</option>
		</optgroup>
		<optgroup label="K">
		<option value="kbd" <?php selected( get_option('custom_font_tag_name_#10'), 'kbd', true ); ?>>kbd</option>
		</optgroup>
		<optgroup label="L">
		<option value="label" <?php selected( get_option('custom_font_tag_name_#10'), 'label', true ); ?>>label</option>
		<option value="legend" <?php selected( get_option('custom_font_tag_name_#10'), 'legend', true ); ?>>legend</option>
		<option value="li" <?php selected( get_option('custom_font_tag_name_#10'), 'li', true ); ?>>li</option>
		<option value="link" <?php selected( get_option('custom_font_tag_name_#10'), 'link', true ); ?>>link</option>
		</optgroup>
		<optgroup label="M">
		<option value="main" <?php selected( get_option('custom_font_tag_name_#10'), 'main', true ); ?>>main</option>
		<option value="map" <?php selected( get_option('custom_font_tag_name_#10'), 'map', true ); ?>>map</option>
		<option value="mark" <?php selected( get_option('custom_font_tag_name_#10'), 'mark', true ); ?>>mark</option>
		<option value="meta" <?php selected( get_option('custom_font_tag_name_#10'), 'meta', true ); ?>>meta</option>
		<option value="meter" <?php selected( get_option('custom_font_tag_name_#10'), 'meter', true ); ?>>meter</option>
		</optgroup>
		<optgroup label="N">
		<option value="nav" <?php selected( get_option('custom_font_tag_name_#10'), 'nav', true ); ?>>nav</option>
		<option value="noscript" <?php selected( get_option('custom_font_tag_name_#10'), 'noscript', true ); ?>>noscript</option>
		</optgroup>
		<optgroup label="O">
		<option value="object" <?php selected( get_option('custom_font_tag_name_#10'), 'object', true ); ?>>object</option>
		<option value="ol" <?php selected( get_option('custom_font_tag_name_#10'), 'ol', true ); ?>>ol</option>
		<option value="optgroup" <?php selected( get_option('custom_font_tag_name_#10'), 'optgroup', true ); ?>>optgroup</option>
		<option value="option" <?php selected( get_option('custom_font_tag_name_#10'), 'option', true ); ?>>option</option>
		<option value="output" <?php selected( get_option('custom_font_tag_name_#10'), 'output', true ); ?>>output</option>
		</optgroup>
		<optgroup label="P">
		<option value="p" <?php selected( get_option('custom_font_tag_name_#10'), 'p', true ); ?>>p</option>
		<option value="param" <?php selected( get_option('custom_font_tag_name_#10'), 'param', true ); ?>>param</option>
		<option value="picture" <?php selected( get_option('custom_font_tag_name_#10'), 'picture', true ); ?>>picture</option>
		<option value="pre" <?php selected( get_option('custom_font_tag_name_#10'), 'pre', true ); ?>>pre</option>
		<option value="progress" <?php selected( get_option('custom_font_tag_name_#10'), 'progress', true ); ?>>progress</option>
		</optgroup>
		<optgroup label="Q">
		<option value="q" <?php selected( get_option('custom_font_tag_name_#10'), 'q', true ); ?>>q</option>
		</optgroup>
		<optgroup label="R">
		<option value="rp" <?php selected( get_option('custom_font_tag_name_#10'), 'rp', true ); ?>>rp</option>
		<option value="rt" <?php selected( get_option('custom_font_tag_name_#10'), 'rt', true ); ?>>rt</option>
		<option value="ruby" <?php selected( get_option('custom_font_tag_name_#10'), 'ruby', true ); ?>>ruby</option>
		</optgroup>
		<optgroup label="S">
		<option value="s" <?php selected( get_option('custom_font_tag_name_#10'), 's', true ); ?>>s</option>
		<option value="samp" <?php selected( get_option('custom_font_tag_name_#10'), 'samp', true ); ?>>samp</option>
		<option value="script" <?php selected( get_option('custom_font_tag_name_#10'), 'script', true ); ?>>script</option>
		<option value="section" <?php selected( get_option('custom_font_tag_name_#10'), 'section', true ); ?>>section</option>
		<option value="select" <?php selected( get_option('custom_font_tag_name_#10'), 'select', true ); ?>>select</option>
		<option value="small" <?php selected( get_option('custom_font_tag_name_#10'), 'small', true ); ?>>small</option>
		<option value="source" <?php selected( get_option('custom_font_tag_name_#10'), 'source', true ); ?>>source</option>
		<option value="span" <?php selected( get_option('custom_font_tag_name_#10'), 'span', true ); ?>>span</option>
		<option value="strong" <?php selected( get_option('custom_font_tag_name_#10'), 'strong', true ); ?>>strong</option>
		<option value="style" <?php selected( get_option('custom_font_tag_name_#10'), 'style', true ); ?>>style</option>
		<option value="sub" <?php selected( get_option('custom_font_tag_name_#10'), 'sub', true ); ?>>sub</option>
		<option value="summary" <?php selected( get_option('custom_font_tag_name_#10'), 'summary', true ); ?>>summary</option>
		<option value="sup" <?php selected( get_option('custom_font_tag_name_#10'), 'sup', true ); ?>>sup</option>
		<option value="svg" <?php selected( get_option('custom_font_tag_name_#10'), 'svg', true ); ?>>svg</option>
		</optgroup>
		<optgroup label="T">
		<option value="table" <?php selected( get_option('custom_font_tag_name_#10'), 'table', true ); ?>>table</option>
		<option value="tbody" <?php selected( get_option('custom_font_tag_name_#10'), 'tbody', true ); ?>>tbody</option>
		<option value="td" <?php selected( get_option('custom_font_tag_name_#10'), 'td', true ); ?>>td</option>
		<option value="template" <?php selected( get_option('custom_font_tag_name_#10'), 'template', true ); ?>>template</option>
		<option value="textarea" <?php selected( get_option('custom_font_tag_name_#10'), 'textarea', true ); ?>>textarea</option>
		<option value="tfoot" <?php selected( get_option('custom_font_tag_name_#10'), 'tfoot', true ); ?>>tfoot</option>
		<option value="th" <?php selected( get_option('custom_font_tag_name_#10'), 'th', true ); ?>>th</option>
		<option value="thead" <?php selected( get_option('custom_font_tag_name_#10'), 'thead', true ); ?>>thead</option>
		<option value="time" <?php selected( get_option('custom_font_tag_name_#10'), 'time', true ); ?>>time</option>
		<option value="title" <?php selected( get_option('custom_font_tag_name_#10'), 'title', true ); ?>>title</option>
		<option value="tr" <?php selected( get_option('custom_font_tag_name_#10'), 'tr', true ); ?>>tr</option>
		<option value="track" <?php selected( get_option('custom_font_tag_name_#10'), 'track', true ); ?>>track</option>
		</optgroup>
		<optgroup label="U">
		<option value="u" <?php selected( get_option('custom_font_tag_name_#10'), 'u', true ); ?>>u</option>
		<option value="ul" <?php selected( get_option('custom_font_tag_name_#10'), 'ul', true ); ?>>ul</option>
		</optgroup>
		<optgroup label="V">
		<option value="var" <?php selected( get_option('custom_font_tag_name_#10'), 'var', true ); ?>>var</option>
		<option value="video" <?php selected( get_option('custom_font_tag_name_#10'), 'video', true ); ?>>video</option>
		</optgroup>
		<optgroup label="W">
		<option value="wbr" <?php selected( get_option('custom_font_tag_name_#10'), 'wbr', true ); ?>>wbr</option>
		</optgroup>
	</select>
</label>

  <input type="radio" id="custom_font_type_id_#10"  name="custom_font_type_#10" value="ID" <?php checked( get_option('custom_font_type_#10'), 'ID', true ); ?>>
  <label for="custom_font_type_id_#10">ID (#)</label>
  <input type="radio" id="custom_font_type_class_#10" name="custom_font_type_#10" value="Class" <?php checked( get_option('custom_font_type_#10'), 'Class', true ); ?>>
  <label for="custom_font_type_class_#10">Class (.)</label>

  <input class="custom_font_input_style" type="text" id="custom_font_path_#10" name="custom_font_path_#10" value="<?php echo get_option('custom_font_path_#10');?>" />
  
  </div>
  
  <hr />


<div class="section-element">
	 <label for="custom_font_ffamily_10">
		<select class="normal-select" id="custom_font_ffamily_10" name="custom_font_ffamily_#10">
			<optgroup label="Yekan">
				<option value="Yekan" <?php selected( get_option('custom_font_ffamily_#10'), 'Yekan', true ); ?>>Yekan</option>
			</optgroup>
			<optgroup label="System">
				<option value="Tahoma" <?php selected( get_option('custom_font_ffamily_#10'), 'Tahoma', true ); ?>>Tahoma</option>
				<option value="Arial" <?php selected( get_option('custom_font_ffamily_#10'), 'Arial', true ); ?>>Arial</option>
				<option value="Verdana" <?php selected( get_option('custom_font_ffamily_#10'), 'Verdana', true ); ?>>Verdana</option>
				</optgroup>
				<optgroup label="Roboto">
				<option value="Robotobold" <?php selected( get_option('custom_font_ffamily_#10'), 'Robotobold', true ); ?>>Robotobold</option>
				<option value="Robotolight" <?php selected( get_option('custom_font_ffamily_#10'), 'Robotolight', true ); ?>>Robotolight</option>
				<option value="Robotoregular" <?php selected( get_option('custom_font_ffamily_#10'), 'Robotoregular', true ); ?>>Robotoregular</option>
				</optgroup>
				<optgroup label="Vazir">
				<option value="Vazir" <?php selected( get_option('custom_font_ffamily_#10'), 'Vazir', true ); ?>>Vazir</option>
				<option value="VazirBold" <?php selected( get_option('custom_font_ffamily_#10'), 'VazirBold', true ); ?>>VazirBold</option>
				<option value="VazirLight" <?php selected( get_option('custom_font_ffamily_#10'), 'VazirLight', true ); ?>>VazirLight</option>
				<option value="VazirMedium" <?php selected( get_option('custom_font_ffamily_#10'), 'VazirMedium', true ); ?>>VazirMedium</option>
				<option value="VazirThin" <?php selected( get_option('custom_font_ffamily_#10'), 'VazirThin', true ); ?>>VazirThin</option>
				</optgroup>
				<optgroup label="Tanha">
				<option value="Tanha" <?php selected( get_option('custom_font_ffamily_#10'), 'Tanha', true ); ?>>Tanha</option>
				</optgroup>
				<optgroup label="Shabnam">
				<option value="Shabnam" <?php selected( get_option('custom_font_ffamily_#10'), 'Shabnam', true ); ?>>Shabnam</option>
				<option value="ShabnamBold" <?php selected( get_option('custom_font_ffamily_#10'), 'ShabnamBold', true ); ?>>ShabnamBold</option>
				<option value="ShabnamLight" <?php selected( get_option('custom_font_ffamily_#10'), 'ShabnamLight', true ); ?>>ShabnamLight</option>
				</optgroup>
				<optgroup label="Samim">
				<option value="Samim" <?php selected( get_option('custom_font_ffamily_#10'), 'Samim', true ); ?>>Samim</option>
				<option value="SamimBold" <?php selected( get_option('custom_font_ffamily_#10'), 'SamimBold', true ); ?>>SamimBold</option>
				</optgroup>
				<optgroup label="Sahel">
				<option value="Sahel" <?php selected( get_option('custom_font_ffamily_#10'), 'Sahel', true ); ?>>Sahel</option>
				<option value="SahelBlack" <?php selected( get_option('custom_font_ffamily_#10'), 'SahelBlack', true ); ?>>SahelBlack</option>
				<option value="SahelBold" <?php selected( get_option('custom_font_ffamily_#10'), 'SahelBold', true ); ?>>SahelBold</option>
				</optgroup>
				<optgroup label="Nahid">
				<option value="Nahid" <?php selected( get_option('custom_font_ffamily_#10'), 'Nahid', true ); ?>>Nahid</option>
			</optgroup>
				<optgroup label="B Family">
<option value="BArshia" <?php selected( get_option('custom_font_ffamily_#10'), 'BArshia', true ); ?>>BArshia</option>
	<option value="BAseman" <?php selected( get_option('custom_font_ffamily_#10'), 'BAseman', true ); ?>>BAseman</option>
	<option value="BAsemanItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BAsemanItalic', true ); ?>>BAsemanItalic</option>
	<option value="BBadkonak" <?php selected( get_option('custom_font_ffamily_#10'), 'BBadkonak', true ); ?>>BBadkonak</option>
	<option value="BBadr" <?php selected( get_option('custom_font_ffamily_#10'), 'BBadr', true ); ?>>BBadr</option>
	<option value="BBadrBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BBadrBold', true ); ?>>BBadrBold</option>
	<option value="BBaran" <?php selected( get_option('custom_font_ffamily_#10'), 'BBaran', true ); ?>>BBaran</option>
	<option value="BBaranItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BBaranItalic', true ); ?>>BBaranItalic</option>
	<option value="BBaranOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BBaranOutline', true ); ?>>BBaranOutline</option>
	<option value="BBaranOutlineItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BBaranOutlineItalic', true ); ?>>BBaranOutlineItalic</option>
	<option value="BBardiya" <?php selected( get_option('custom_font_ffamily_#10'), 'BBardiya', true ); ?>>BBardiya</option>
	<option value="BBardiyaBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BBardiyaBold', true ); ?>>BBardiyaBold</option>
	<option value="BCheshmeh" <?php selected( get_option('custom_font_ffamily_#10'), 'BCheshmeh', true ); ?>>BCheshmeh</option>
	<option value="BCheshmehBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BCheshmehBold', true ); ?>>BCheshmehBold</option>
	<option value="BChini" <?php selected( get_option('custom_font_ffamily_#10'), 'BChini', true ); ?>>BChini</option>
	<option value="BCompset" <?php selected( get_option('custom_font_ffamily_#10'), 'BCompset', true ); ?>>BCompset</option>
	<option value="BCompsetBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BCompsetBold', true ); ?>>BCompsetBold</option>
	<option value="BDavat" <?php selected( get_option('custom_font_ffamily_#10'), 'BDavat', true ); ?>>BDavat</option>
	<option value="BElham" <?php selected( get_option('custom_font_ffamily_#10'), 'BElham', true ); ?>>BElham</option>
	<option value="BElm" <?php selected( get_option('custom_font_ffamily_#10'), 'BElm', true ); ?>>BElm</option>
	<option value="BElmBorder" <?php selected( get_option('custom_font_ffamily_#10'), 'BElmBorder', true ); ?>>BElmBorder</option>
	<option value="BElmItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BElmItalic', true ); ?>>BElmItalic</option>
	<option value="BEsfehanBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BEsfehanBold', true ); ?>>BEsfehanBold</option>
	<option value="BFantezy" <?php selected( get_option('custom_font_ffamily_#10'), 'BFantezy', true ); ?>>BFantezy</option>
	<option value="BFarnaz" <?php selected( get_option('custom_font_ffamily_#10'), 'BFarnaz', true ); ?>>BFarnaz</option>
	<option value="BFerdosi" <?php selected( get_option('custom_font_ffamily_#10'), 'BFerdosi', true ); ?>>BFerdosi</option>
	<option value="BHaleh" <?php selected( get_option('custom_font_ffamily_#10'), 'BHaleh', true ); ?>>BHaleh</option>
	<option value="BHalehBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BHalehBold', true ); ?>>BHalehBold</option>
	<option value="BHamid" <?php selected( get_option('custom_font_ffamily_#10'), 'BHamid', true ); ?>>BHamid</option>
	<option value="BHelal" <?php selected( get_option('custom_font_ffamily_#10'), 'BHelal', true ); ?>>BHelal</option>
	<option value="BHoma" <?php selected( get_option('custom_font_ffamily_#10'), 'BHoma', true ); ?>>BHoma</option>
	<option value="BJadidBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BJadidBold', true ); ?>>BJadidBold</option>
	<option value="BJalal" <?php selected( get_option('custom_font_ffamily_#10'), 'BJalal', true ); ?>>BJalal</option>
	<option value="BJalalBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BJalalBold', true ); ?>>BJalalBold</option>
	<option value="BJohar" <?php selected( get_option('custom_font_ffamily_#10'), 'BJohar', true ); ?>>BJohar</option>
	<option value="BKaj" <?php selected( get_option('custom_font_ffamily_#10'), 'BKaj', true ); ?>>BKaj</option>
	<option value="BKamran" <?php selected( get_option('custom_font_ffamily_#10'), 'BKamran', true ); ?>>BKamran</option>
	<option value="BKamranBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BKamranBold', true ); ?>>BKamranBold</option>
	<option value="BKamranOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BKamranOutline', true ); ?>>BKamranOutline</option>
	<option value="BKarim" <?php selected( get_option('custom_font_ffamily_#10'), 'BKarim', true ); ?>>BKarim</option>
	<option value="BKarimBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BKarimBold', true ); ?>>BKarimBold</option>
	<option value="BKaveh" <?php selected( get_option('custom_font_ffamily_#10'), 'BKaveh', true ); ?>>BKaveh</option>
	<option value="BKidnap" <?php selected( get_option('custom_font_ffamily_#10'), 'BKidnap', true ); ?>>BKidnap</option>
	<option value="BKoodakBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BKoodakBold', true ); ?>>BKoodakBold</option>
	<option value="BKoodakOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BKoodakOutline', true ); ?>>BKoodakOutline</option>
	<option value="BKourosh" <?php selected( get_option('custom_font_ffamily_#10'), 'BKourosh', true ); ?>>BKourosh</option>
	<option value="BLotus" <?php selected( get_option('custom_font_ffamily_#10'), 'BLotus', true ); ?>>BLotus</option>
	<option value="BLotusBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BLotusBold', true ); ?>>BLotusBold</option>
	<option value="BMah" <?php selected( get_option('custom_font_ffamily_#10'), 'BMah', true ); ?>>BMah</option>
	<option value="BMahsa" <?php selected( get_option('custom_font_ffamily_#10'), 'BMahsa', true ); ?>>BMahsa</option>
	<option value="BMajidShadow" <?php selected( get_option('custom_font_ffamily_#10'), 'BMajidShadow', true ); ?>>BMajidShadow</option>
	<option value="BMashhad" <?php selected( get_option('custom_font_ffamily_#10'), 'BMashhad', true ); ?>>BMashhad</option>
	<option value="BMashhadBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BMashhadBold', true ); ?>>BMashhadBold</option>
	<option value="BMashhadBoldItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BMashhadBoldItalic', true ); ?>>BMashhadBoldItalic</option>
	<option value="BMashhadItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BMashhadItalic', true ); ?>>BMashhadItalic</option>
	<option value="BMasjed" <?php selected( get_option('custom_font_ffamily_#10'), 'BMasjed', true ); ?>>BMasjed</option>
	<option value="BMedad" <?php selected( get_option('custom_font_ffamily_#10'), 'BMedad', true ); ?>>BMedad</option>
	<option value="BMehrBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BMehrBold', true ); ?>>BMehrBold</option>
	<option value="BMitra" <?php selected( get_option('custom_font_ffamily_#10'), 'BMitra', true ); ?>>BMitra</option>
	<option value="BMitraBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BMitraBold', true ); ?>>BMitraBold</option>
	<option value="BMoj" <?php selected( get_option('custom_font_ffamily_#10'), 'BMoj', true ); ?>>BMoj</option>
	<option value="BMorvarid" <?php selected( get_option('custom_font_ffamily_#10'), 'BMorvarid', true ); ?>>BMorvarid</option>
	<option value="BNarenj" <?php selected( get_option('custom_font_ffamily_#10'), 'BNarenj', true ); ?>>BNarenj</option>
	<option value="BNarm" <?php selected( get_option('custom_font_ffamily_#10'), 'BNarm', true ); ?>>BNarm</option>
	<option value="BNasimBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BNasimBold', true ); ?>>BNasimBold</option>
	<option value="BNazanin" <?php selected( get_option('custom_font_ffamily_#10'), 'BNazanin', true ); ?>>BNazanin</option>
	<option value="BNazaninBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BNazaninBold', true ); ?>>BNazaninBold</option>
	<option value="BNazaninOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BNazaninOutline', true ); ?>>BNazaninOutline</option>
	<option value="BNikiBorder" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiBorder', true ); ?>>BNikiBorder</option>
	<option value="BNikiBorderItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiBorderItalic', true ); ?>>BNikiBorderItalic</option>
	<option value="BNikiOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiOutline', true ); ?>>BNikiOutline</option>
	<option value="BNikiOutlineItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiOutlineItalic', true ); ?>>BNikiOutlineItalic</option>
	<option value="BNikiShadow" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiShadow', true ); ?>>BNikiShadow</option>
	<option value="BNikiShadowItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikiShadowItalic', true ); ?>>BNikiShadowItalic</option>
	<option value="BNikoo" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikoo', true ); ?>>BNikoo</option>
	<option value="BNikooItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BNikooItalic', true ); ?>>BNikooItalic</option>
	<option value="BPaatch" <?php selected( get_option('custom_font_ffamily_#10'), 'BPaatch', true ); ?>>BPaatch</option>
	<option value="BPaatchBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BPaatchBold', true ); ?>>BPaatchBold</option>
	<option value="BRose" <?php selected( get_option('custom_font_ffamily_#10'), 'BRose', true ); ?>>BRose</option>
	<option value="BRoya" <?php selected( get_option('custom_font_ffamily_#10'), 'BRoya', true ); ?>>BRoya</option>
	<option value="BRoyaBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BRoyaBold', true ); ?>>BRoyaBold</option>
	<option value="BSahar" <?php selected( get_option('custom_font_ffamily_#10'), 'BSahar', true ); ?>>BSahar</option>
	<option value="BSahra" <?php selected( get_option('custom_font_ffamily_#10'), 'BSahra', true ); ?>>BSahra</option>
	<option value="BSara" <?php selected( get_option('custom_font_ffamily_#10'), 'BSara', true ); ?>>BSara</option>
	<option value="BSepideh" <?php selected( get_option('custom_font_ffamily_#10'), 'BSepideh', true ); ?>>BSepideh</option>
	<option value="BSepidehOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BSepidehOutline', true ); ?>>BSepidehOutline</option>
	<option value="BSetareh" <?php selected( get_option('custom_font_ffamily_#10'), 'BSetareh', true ); ?>>BSetareh</option>
	<option value="BSetarehBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BSetarehBold', true ); ?>>BSetarehBold</option>
	<option value="BShadi" <?php selected( get_option('custom_font_ffamily_#10'), 'BShadi', true ); ?>>BShadi</option>
	<option value="BShiraz" <?php selected( get_option('custom_font_ffamily_#10'), 'BShiraz', true ); ?>>BShiraz</option>
	<option value="BShirazItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BShirazItalic', true ); ?>>BShirazItalic</option>
	<option value="BSiavash" <?php selected( get_option('custom_font_ffamily_#10'), 'BSiavash', true ); ?>>BSiavash</option>
	<option value="BSinaBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BSinaBold', true ); ?>>BSinaBold</option>
	<option value="BSooreh" <?php selected( get_option('custom_font_ffamily_#10'), 'BSooreh', true ); ?>>BSooreh</option>
	<option value="BSoorehBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BSoorehBold', true ); ?>>BSoorehBold</option>
	<option value="BSorkhpust" <?php selected( get_option('custom_font_ffamily_#10'), 'BSorkhpust', true ); ?>>BSorkhpust</option>
	<option value="BTabassom" <?php selected( get_option('custom_font_ffamily_#10'), 'BTabassom', true ); ?>>BTabassom</option>
	<option value="BTanab" <?php selected( get_option('custom_font_ffamily_#10'), 'BTanab', true ); ?>>BTanab</option>
	<option value="BTawfigOutline" <?php selected( get_option('custom_font_ffamily_#10'), 'BTawfigOutline', true ); ?>>BTawfigOutline</option>
	<option value="BTehran" <?php selected( get_option('custom_font_ffamily_#10'), 'BTehran', true ); ?>>BTehran</option>
	<option value="BTehranItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BTehranItalic', true ); ?>>BTehranItalic</option>
	<option value="BTir" <?php selected( get_option('custom_font_ffamily_#10'), 'BTir', true ); ?>>BTir</option>
	<option value="BTitrBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BTitrBold', true ); ?>>BTitrBold</option>
	<option value="BTraffic" <?php selected( get_option('custom_font_ffamily_#10'), 'BTraffic', true ); ?>>BTraffic</option>
	<option value="BTrafficBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BTrafficBold', true ); ?>>BTrafficBold</option>
	<option value="BVahidBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BVahidBold', true ); ?>>BVahidBold</option>
	<option value="BVosta" <?php selected( get_option('custom_font_ffamily_#10'), 'BVosta', true ); ?>>BVosta</option>
	<option value="BVostaItalic" <?php selected( get_option('custom_font_ffamily_#10'), 'BVostaItalic', true ); ?>>BVostaItalic</option>
	<option value="BYagut" <?php selected( get_option('custom_font_ffamily_#10'), 'BYagut', true ); ?>>BYagut</option>
	<option value="BYagutBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BYagutBold', true ); ?>>BYagutBold</option>
	<option value="BYas" <?php selected( get_option('custom_font_ffamily_#10'), 'BYas', true ); ?>>BYas</option>
	<option value="BYasBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BYasBold', true ); ?>>BYasBold</option>
	<option value="BYekan" <?php selected( get_option('custom_font_ffamily_#10'), 'BYekan', true ); ?>>BYekan</option>
	<option value="BYekanBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BYekanBold', true ); ?>>BYekanBold</option>
	<option value="BZaman" <?php selected( get_option('custom_font_ffamily_#10'), 'BZaman', true ); ?>>BZaman</option>
	<option value="BZar" <?php selected( get_option('custom_font_ffamily_#10'), 'BZar', true ); ?>>BZar</option>
	<option value="BZarBold" <?php selected( get_option('custom_font_ffamily_#10'), 'BZarBold', true ); ?>>BZarBold</option>
	<option value="BZiba" <?php selected( get_option('custom_font_ffamily_#10'), 'BZiba', true ); ?>>BZiba</option>
	</optgroup>
		</select>
	</label>

	<input id="custom_font_fsize_10" title="Font Size" class="input-text" type="number" min="0" name="custom_font_fsize_#10" size="3" value=<?php echo get_option('custom_font_fsize_#10');?>>
	<select class="_font_unit" id="custom_font_fsize_unit_10" name="custom_font_fsize_unit_#10">
				<option value="px" <?php selected( get_option('custom_font_fsize_unit_#10'), 'px', true ); ?>>px</option>
				<option value="em" <?php selected( get_option('custom_font_fsize_unit_#10'), 'em', true ); ?>>em</option>
				<option value="rem" <?php selected( get_option('custom_font_fsize_unit_#10'), 'rem', true ); ?>>rem</option>
				<option value="in" <?php selected( get_option('custom_font_fsize_unit_#10'), 'in', true ); ?>>in</option>
				<option value="pt" <?php selected( get_option('custom_font_fsize_unit_#10'), 'pt', true ); ?>>pt</option>
	</select>

	<select class="normal-select-2" id="custom_font_fstyle_10" name="custom_font_fstyle_#10">
		<option value="normal" <?php selected( get_option('custom_font_fstyle_#10'), 'normal', true ); ;?>><?php echo esc_html__("Normal", 'font-farsi'); ?> </option>
		<option value="italic" <?php selected( get_option('custom_font_fstyle_#10'), 'italic', true ); ;?>> <?php echo esc_html__("Italic", 'font-farsi'); ?> </option>
	</select>

	<select class="normal-select-2" id="custom_font_fweight_10" name="custom_font_fweight_#10">
		<option value="400" <?php selected( get_option('custom_font_fweight_#10'), '400', true ); ;?>> 400 </option>
		<option value="500" <?php selected( get_option('custom_font_fweight_#10'), '500', true ); ;?>> 500 </option>
		<option value="600" <?php selected( get_option('custom_font_fweight_#10'), '600', true ); ;?>> 600 </option>
		<option value="700" <?php selected( get_option('custom_font_fweight_#10'), '700', true ); ;?>> 700 </option>
		<option value="800" <?php selected( get_option('custom_font_fweight_#10'), '800', true ); ;?>> 800 </option>
		<option value="900" <?php selected( get_option('custom_font_fweight_#10'), '900', true ); ;?>> 900 </option>		
	</select>
	<input class="jscolor jscolor-2" name="custom_font_fcolor_#10" id="custom_font_fcolor_10" value=<?php echo get_option('custom_font_fcolor_#10');?> />
</div>

		<div class="box-1 float_right">
		<label for="custom_font_fstretch_10">
			<?php echo esc_html__("Font Stretch", 'font-farsi'); ?>
		</label>
		<select class="normal-select-3" id="custom_font_fstretch_10" name="custom_font_fstretch_#10">
			<option value="ultra-condensed" <?php selected( get_option('custom_font_fstretch_#10'), 'ultra-condensed', true ); ;?>> ultra-condensed </option>
			<option value="condensed" <?php selected( get_option('custom_font_fstretch_#10'), 'condensed', true ); ;?>> condensed </option>
			<option value="normal" <?php selected( get_option('custom_font_fstretch_#10'), 'normal', true ); ;?>> normal </option>
			<option value="expanded" <?php selected( get_option('custom_font_fstretch_#10'), 'expanded', true ); ;?>> expanded </option>
			<option value="extra-expanded" <?php selected( get_option('custom_font_fstretch_#10'), 'extra-expanded', true ); ;?>> extra-expanded </option>
			<option value="ultra-expanded" <?php selected( get_option('custom_font_fstretch_#10'), 'ultra-expanded', true ); ;?>> ultra-expanded </option>		
	</select>

		<br />
		<label for="custom_font_fline_height_10">
			<?php echo esc_html__("Line Height", 'font-farsi'); ?>
		</label>
		<input type="number" min="0" class="input-text size_120 margin-1" name="custom_font_fline_height_#10" id="custom_font_fline_height_10" value="<?php echo get_option('custom_font_fline_height_#10') ;?>"> % 
		</div>
		<div class="box-1 float_left">
		<label for="custom_font_fletter_spacing_10">
			<?php echo esc_html__("Letter Spacing", 'font-farsi'); ?>
		</label>
		<input class="input-text size_120 margin-1" type="number" name="custom_font_fletter_spacing_#10" id="custom_font_fletter_spacing_10" value="<?php echo get_option('custom_font_fletter_spacing_#10') ;?>"> PX
		<br />
		<label for="custom_font_fword_spacing_10">
			<?php echo esc_html__("Word Spacing", 'font-farsi'); ?>
		</label>
		<input class="input-text size_120 margin-1" type="number" name="custom_font_fword_spacing_#10" id="custom_font_fword_spacing_10" value="<?php echo get_option('custom_font_fword_spacing_#10') ;?>"> PX
		</div>
		
				<!--  START CODE  -->

<div class="ff-style-main">
    <div class="ff-style-view" id="style_view_c10"> <?php echo esc_html__("Style", 'font-farsi'); ?> </div>
        <div class="ff-style-panel" id="style_view_panel_c10">

            <div class="ff-style-panel-child" id="">
				<!-- Border Section -->
                 <div class="ff-style-title" id="ff-style-title-border_c10"><?php echo esc_html__("Border", 'font-farsi'); ?></div>
                  <div class="ff-style-panel-view" id="ff-style-panel-border_c10">
                    <p class="notice notice-info ff-style-panel-view-p">
                        <?php echo esc_html__("set border settings", 'font-farsi'); ?>
                    </p>
					<!-- Top -->
                    <fieldset>
                        <legend>
                            <?php echo esc_html__("Up", 'font-farsi'); ?>
                        </legend>
                        <input id="font_10_border_top_color" name="custom_font_f_style_border_top_color_#10" value="<?php echo get_option('custom_font_f_style_border_top_color_#10');?>" type="text" />
                        <select name="custom_font_f_style_border_top_style_#10" id="custom_font_f_style_border_top_style_10">
                      <option value="solid" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'solid', true );?>>solid</option>
                      <option value="dotted" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'dotted', true );?>>dotted</option>
                      <option value="dashed" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'dashed', true );?>>dashed</option>
                      <option value="double" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'double', true );?>>double</option>
                      <option value="groove" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'groove', true );?>>groove</option>
                      <option value="ridge" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'ridge', true );?>>ridge</option>
                      <option value="inset" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'inset', true );?>>inset</option>
                      <option value="outset" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'outset', true );?>>outset</option>
                      <option value="none" <?php selected( get_option('custom_font_f_style_border_top_style_#10'), 'none', true );?>>none</option>
                    </select>
                        <input class="custom_font_f_style_border_top_width_1" type="number" min="0" max="1000" class="numinput" onkeypress="return isNumberKey(event)" name="custom_font_f_style_border_top_width_#10" id="txtChar" value="<?php echo  get_option('custom_font_f_style_border_top_width_#10');?>" /><br>
                    </fieldset>
					<!-- Bottom -->
                    <fieldset>
                        <legend>
                            <?php echo esc_html__("Down", 'font-farsi'); ?>
                        </legend>
                        <input id="font_10_border_bottom_color" name="custom_font_f_style_border_bottom_color_#10" value="<?php echo get_option('custom_font_f_style_border_bottom_color_#10');?>" type="text" />
                        <select name="custom_font_f_style_border_bottom_style_#10" id="custom_font_f_style_border_bottom_style_10">
                      <option value="solid" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'solid', true );?>>solid</option>
                      <option value="dotted" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'dotted', true );?>>dotted</option>
                      <option value="dashed" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'dashed', true );?>>dashed</option>
                      <option value="double" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'double', true );?>>double</option>
                      <option value="groove" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'groove', true );?>>groove</option>
                      <option value="ridge" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'ridge', true );?>>ridge</option>
                      <option value="inset" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'inset', true );?>>inset</option>
                      <option value="outset" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'outset', true );?>>outset</option>
                      <option value="none" <?php selected( get_option('custom_font_f_style_border_bottom_style_#10'), 'none', true );?>>none</option>
                    </select>
                        <input class="custom_font_f_style_border_bottom_width_10" type="number" min="0" max="1000" class="numinput" onkeypress="return isNumberKey(event)" id="txtChar" name="custom_font_f_style_border_bottom_width_#10" value="<?php echo  get_option('custom_font_f_style_border_bottom_width_#10');?>" /><br>
                    </fieldset>
					<!-- Right -->
                    <fieldset>
                        <legend>
                            <?php echo esc_html__("Right", 'font-farsi'); ?>
                        </legend>
                        <input id="font_10_border_right_color" type="text" name="custom_font_f_style_border_right_color_#10" value="<?php echo get_option('custom_font_f_style_border_right_color_#10');?>" />
                        <select name="custom_font_f_style_border_right_style_#10" id="custom_font_f_style_border_right_style_10">
                      <option value="solid" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'solid', true );?>>solid</option>
                      <option value="dotted" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'dotted', true );?>>dotted</option>
                      <option value="dashed" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'dashed', true );?>>dashed</option>
                      <option value="double" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'double', true );?>>double</option>
                      <option value="groove" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'groove', true );?>>groove</option>
                      <option value="ridge" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'ridge', true );?>>ridge</option>
                      <option value="inset" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'inset', true );?>>inset</option>
                      <option value="outset" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'outset', true );?>>outset</option>
                      <option value="none" <?php selected( get_option('custom_font_f_style_border_right_style_#10'), 'none', true );?>>none</option>
                    </select>
                        <input class="custom_font_f_style_border_right_width_10" type="number" min="0" max="1000" class="numinput" onkeypress="return isNumberKey(event)" name="custom_font_f_style_border_right_width_#10" value="<?php echo  get_option('custom_font_f_style_border_right_width_#10');?>" /><br>
                    </fieldset>
					<!-- Left -->
                    <fieldset>
                        <legend>
                            <?php echo esc_html__("Left", 'font-farsi'); ?>
                        </legend>
                        <input id="font_10_border_left_color" type="text" name="custom_font_f_style_border_left_color_#10" value="<?php echo get_option('custom_font_f_style_border_left_color_#10');?>"/>
                        <select name="custom_font_f_style_border_left_style_#10" id="custom_font_f_style_border_left_style_10">
                      <option value="solid" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'solid', true );?>>solid</option>
                      <option value="dotted" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'dotted', true );?>>dotted</option>
                      <option value="dashed" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'dashed', true );?>>dashed</option>
                      <option value="double" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'double', true );?>>double</option>
                      <option value="groove" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'groove', true );?>>groove</option>
                      <option value="ridge" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'ridge', true );?>>ridge</option>
                      <option value="inset" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'inset', true );?>>inset</option>
                      <option value="outset" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'outset', true );?>>outset</option>
                      <option value="none" <?php selected( get_option('custom_font_f_style_border_left_style_#10'), 'none', true );?>>none</option>
                    </select>
                        <input class="custom_font_f_style_border_left_width_10" type="number" min="0" max="1000" class="numinput" onkeypress="return isNumberKey(event)" name="custom_font_f_style_border_left_width_#10" value="<?php echo  get_option('custom_font_f_style_border_left_width_#10');?>" /><br>
                    </fieldset>
                    <br>
                    <fieldset>
                        <legend><?php echo esc_html__("Border Radius", 'font-farsi'); ?></legend>
                        <div class="ff-style-border-radius">
							<!-- Border Radius Section -->
                             <input type="range" min="0" max="100" value="<?php echo  get_option('custom_font_f_style_border_radius_value_#10');?>" class="slider" id="custom_font_f_style_border_radius_range_10">
                             <select name="custom_font_f_style_border_radius_value_unit_#10" id="custom_font_f_style_border_radius_value_unit_10">
                                 <option value="%" <?php selected( get_option('custom_font_f_style_border_radius_value_unit_#10'), '%', true );?>>%</option>
                                 <option value="px" <?php selected( get_option('custom_font_f_style_border_radius_value_unit_#10'), 'px', true );?>>px</option>
                             </select>
                             <input name="custom_font_f_style_border_radius_value_#10" type="text" id="custom_font_f_style_border_radius_value_10" value="<?php echo  get_option('custom_font_f_style_border_radius_value_#10');?>" ></input><span><?php echo esc_html__("Value: ", 'font-farsi'); ?></span>
                        </div>
                    </fieldset>
                </div>
             </div>

            <div class="ff-style-panel-child">
					<!-- Padding Section -->
                 <div class="ff-style-title" id="ff-style-title-padding_c10"><?php echo esc_html__("Padding", 'font-farsi'); ?> </div>
                <div class="ff-style-panel-view" id="ff-style-panel-padding_c10">
                         <p class="notice notice-info ff-style-panel-view-p">
                            <?php echo esc_html__("units in px.", 'font-farsi'); ?>
                        </p>
                    <div class="ff-style-panel-view-display">
					<!-- Top -->
                     <label for="custom_font_f_style_padding_top_10"><?php echo esc_html__("Up", 'font-farsi'); ?></label>
					 <input id="custom_font_f_style_padding_top_10" name="custom_font_f_style_padding_top_#10" value="<?php echo get_option('custom_font_f_style_padding_top_#10');?>" type="text" class="numinput" /> <br>
                     <!-- Bottom -->
					 <label for="custom_font_f_style_padding_bottom_10"><?php echo esc_html__("Down", 'font-farsi'); ?></label>
					 <input id="custom_font_f_style_padding_bottom_10" name="custom_font_f_style_padding_bottom_#10" value="<?php echo get_option('custom_font_f_style_padding_bottom_#10');?>" type="text" onkeypress="return isNumberKey(event)" /> <br>
                     <!-- Right -->
					 <label for="custom_font_f_style_padding_right_10"><?php echo esc_html__("Right", 'font-farsi'); ?></label>
					 <input id="custom_font_f_style_padding_right_10" name="custom_font_f_style_padding_right_#10" value="<?php echo get_option('custom_font_f_style_padding_right_#10');?>" type="text" onkeypress="return isNumberKey(event)" /> <br>
                     <!-- Left -->
					 <label for="custom_font_f_style_padding_left_10"><?php echo esc_html__("Left", 'font-farsi'); ?></label>
					 <input id="custom_font_f_style_padding_left_10" name="custom_font_f_style_padding_left_#10" value="<?php echo get_option('custom_font_f_style_padding_left_#10');?>" type="text" onkeypress="return isNumberKey(event)" /> <br>
                     </div>
                </div>
             </div>

            <div class="ff-style-panel-child">
				<!-- Margin Section -->
                 <div class="ff-style-title" id="ff-style-title-margin_c10"><?php echo esc_html__("Margin", 'font-farsi'); ?></div>
                 <div class="ff-style-panel-view" id="ff-style-panel-margin_c10">
                    <p class="notice notice-info ff-style-panel-view-p">
                            <?php echo esc_html__("units in px.", 'font-farsi'); ?>
                        </p>
                    <div class="ff-style-panel-view-display">
						 <!-- Top -->
						 <label for="custom_font_f_style_margin_top_10"><?php echo esc_html__("Up", 'font-farsi'); ?></label>
						 <input id="custom_font_f_style_margin_top_10" class="numinput" type="text" name="custom_font_f_style_margin_top_#10" value="<?php echo get_option('custom_font_f_style_margin_top_#10');?>" /><br>
						 <!-- Bottom -->
						 <label for="custom_font_f_style_margin_bottom_10"><?php echo esc_html__("Down", 'font-farsi'); ?></label>
						 <input id="custom_font_f_style_margin_bottom_10" class="numinput" type="text" name="custom_font_f_style_margin_bottom_#10" value="<?php echo get_option('custom_font_f_style_margin_bottom_#10');?>" /><br>
						 <!-- Right -->
						 <label for="custom_font_f_style_margin_right_10"><?php echo esc_html__("Right", 'font-farsi'); ?></label>
						 <input id="custom_font_f_style_margin_right_10" class="numinput" type="text" name="custom_font_f_style_margin_right_#10" value="<?php echo get_option('custom_font_f_style_margin_right_#10');?>"/><br>
						 <!-- Left -->
						 <label for="custom_font_f_style_margin_left_10"><?php echo esc_html__("Left", 'font-farsi'); ?></label>
						 <input id="custom_font_f_style_margin_left_10" class="numinput" type="text" name="custom_font_f_style_margin_left_#10" value="<?php echo get_option('custom_font_f_style_margin_left_#10');?>"/><br>
                    </div>
                </div>
             </div>
        </div>

         <div class="ff-style-panel" id="style_view_panel_c10">
		 <!-- Background Section -->
                <div class="ff-style-panel-child">
                 <div class="ff-style-title" id="ff-style-title-background_c10"><?php echo esc_html__("Background", 'font-farsi'); ?></div>
                  <div class="ff-style-panel-view" id="ff-style-panel-background_c10">
                    <p class="notice notice-info ff-style-panel-view-p">
                            <?php echo esc_html__("Select Background Color", 'font-farsi'); ?>
                        </p>
                        <div class="ff-style-panel-view-display">
                             <input type="text" id="custom_font_f_style_background_color_10" name="custom_font_f_style_background_color_#10" value="<?php echo get_option('custom_font_f_style_background_color_#10');?>"/>
                  </div>
                </div>
             </div>

            <div class="ff-style-panel-child">
			<!-- Text Align Section -->
                 <div class="ff-style-title" id="ff-style-title-textalign_c10"><?php echo esc_html__("Text Align", 'font-farsi'); ?></div>
                <div class="ff-style-panel-view" id="ff-style-panel-textalign_c10">
                     <p class="notice notice-info ff-style-panel-view-p">
					 <?php echo esc_html__("Text Align", 'font-farsi'); ?></p>
                     <div class="ff-style-panel-view-display">
                         <select class="ff-style-select" name="custom_font_f_style_textalign_#10" id="custom_font_f_style_textalign_10">
                             <option value="right" <?php selected( get_option('custom_font_f_style_textalign_#10'), 'right', true );?>><?php echo esc_html__("Right", 'font-farsi'); ?></option>
                             <option value="center" <?php selected( get_option('custom_font_f_style_textalign_#10'), 'center', true );?>><?php echo esc_html__("Center", 'font-farsi'); ?></option>
                             <option value="left" <?php selected( get_option('custom_font_f_style_textalign_#10'), 'left', true );?>><?php echo esc_html__("Left", 'font-farsi'); ?></option>
                             <option value="justify" <?php selected( get_option('custom_font_f_style_textalign_#10'), 'justify', true );?>><?php echo esc_html__("Justify", 'font-farsi'); ?></option>
                         </select>
                     </div>
                </div>
             </div>
         </div>
		 
</div>
<!-- END STYLE -->
		
		<div class="preview">
			<span id="custom_font_10_preview" class="span-effect-1" 
			 style="
				display:block !important;
			 	font-family: <?php echo get_option('custom_font_ffamily_#10');?>;
			 	font-size:  <?php echo get_option('custom_font_fsize_#10') . get_option('custom_font_fsize_unit_#10') ;?>;
			 	font-style: <?php echo get_option('custom_font_fstyle_#10');?>;
			 	font-weight: <?php echo get_option('custom_font_fweight_#10');?>;
			 	font-stretch: <?php echo get_option('custom_font_fstretch_#10');?>;
			 	line-height: <?php echo get_option('custom_font_fline_height_#10') . '%';?>;
			 	letter-spacing: <?php echo get_option('custom_font_fletter_spacing_#10') . 'px' ;?>;
			 	word-spacing:<?php echo get_option('custom_font_fword_spacing_#10') . 'px';?>;
			 	color: #<?php echo get_option('custom_font_fcolor_#10'); ?>;
				margin-top:<?php echo get_option('custom_font_f_style_margin_top_#10');?>px;
				margin-bottom:<?php echo get_option('custom_font_f_style_margin_bottom_#10');?>px;
				margin-right:<?php echo get_option('custom_font_f_style_margin_right_#10');?>px;
				margin-left:<?php echo get_option('custom_font_f_style_margin_left_#10');?>px;
				padding-top:<?php echo get_option('custom_font_f_style_padding_top_#10');?>px;
				padding-bottom:<?php echo get_option('custom_font_f_style_padding_bottom_#10');?>px;
				padding-right:<?php echo get_option('custom_font_f_style_padding_right_#10');?>px;
				padding-left:<?php echo get_option('custom_font_f_style_padding_left_#10');?>px;
				border-top:<?php echo get_option('custom_font_f_style_border_top_width_#10') . 'px ' .get_option('custom_font_f_style_border_top_style_#10') .' '. get_option('custom_font_f_style_border_top_color_#10');?>;
				border-bottom:<?php echo get_option('custom_font_f_style_border_bottom_width_#10') . 'px ' .get_option('custom_font_f_style_border_bottom_style_#10') .' '. get_option('custom_font_f_style_border_bottom_color_#10');?>;
				border-right:<?php echo get_option('custom_font_f_style_border_right_width_#10') . 'px ' .get_option('custom_font_f_style_border_right_style_#10') .' '. get_option('custom_font_f_style_border_right_color_#10');?>;
				border-left:<?php echo get_option('custom_font_f_style_border_left_width_#10') . 'px ' .get_option('custom_font_f_style_border_left_style_#10') .' '. get_option('custom_font_f_style_border_left_color_#10');?>;
				border-radius:<?php echo get_option('custom_font_f_style_border_radius_value_#10') . get_option('custom_font_f_style_border_radius_value_unit_#10');?>;
				background-color:<?php echo get_option('custom_font_f_style_background_color_#10');?>;
				text-align: <?php echo get_option('custom_font_f_style_textalign_#10');?>;
			      ">
				<?php echo esc_html__("This Is Font Settings Preview", 'font-farsi'); ?>
			</span>
		</div>




</div>
</div>

<!-- End Accordion -->
		</div>
    </div>
</div>

<?php
}
}
?>