string(96) "https://api.templatemonster.com/products/v2/products/en?language=en&ids=374722&expand=properties"
string(16150) "[{"templateId":374722,"typeId":1,"typeName":"Website template","typeUrl":"website-templates","categoryId":213,"categoryName":"Landscape Design Templates","templateTitle":"Landscape Design Responsive Website Template","templatePreviewHtmlTitle":"Lariv - React js portfolio web template - TemplateMonster","templateDemoHtmlTitle":"Demo for Lariv - React js portfolio web template #374722","typeShortName":"Website","templatePreviewFBTitle":"<p>Introducing our <strong>Lariv React js Portfolio Template</strong>, a meticulously crafted solution that seamlessly blends innovation and aesthetics to elevate your online presence. Built with the powerful React JS library, this template ensures a lightning-fast, responsive, and dynamic portfolio experience.</p><p>Immerse your audience in the captivating world of your work with smooth animations that add a touch of sophistication to your portfolio. The inclusion of the Swiper slider brings a dynamic edge, allowing you to showcase your projects in a visually stunning and interactive manner. Elevate your portfolio further with the inclusion of a sleek dark mode, providing a modern and stylish alternative for users who prefer a darker aesthetic.</p><p>What sets our template apart is its commitment to user engagement. The dynamic contact form not only streamlines communication but also adds a personalized touch, making it easier for potential clients or collaborators to connect with you effortlessly.</p><p><strong>Key Features:</strong></p><ul><li>React JS Powered: Leverage the efficiency and flexibility of React JS for a high-performance portfolio website.</li><li>Immersive Animations: Captivate your audience with seamless and eye-catching animations that bring your portfolio to life.</li><li>Swiper Slider: Showcase your projects with flair using the Swiper slider, ensuring an engaging and interactive user experience.</li><li>Sleek Dark Mode: Stay on-trend with a stylish dark mode that adds a touch of elegance and modernity to your portfolio.</li><li>Dynamic Contact Form: Foster meaningful connections with a dynamic contact form that enhances user interaction and streamlines communication.</li></ul><p><strong>Key Highlights:</strong></p><ul><li>Responsive Design: Our React Portfolio Template is built with a mobile-first approach, ensuring a seamless and engaging experience across devices. Your portfolio will look stunning whether viewed on a desktop, tablet, or smartphone.</li><li>Versatile Showcase: The template provides a versatile showcase for your work, allowing you to present projects, case studies, and achievements with clarity and impact. Impress your audience with a professional and organized display of your skills and accomplishments.</li><li>Personalization Options: Tailor your portfolio to reflect your unique style with easy-to-use personalization options. Customize colors, fonts, and layouts effortlessly, ensuring that your portfolio aligns perfectly with your brand and personality.</li><li>Effortless Navigation: Enhance user experience with intuitive navigation. Your visitors can seamlessly explore your portfolio, gaining insights into your expertise and creativity without any hassle.</li><li>Optimized Performance: With a focus on performance optimization, our template ensures fast loading times, contributing to an overall positive user experience. Your portfolio will make an instant impact, keeping visitors engaged and interested.</li><li>SEO-Friendly: Boost your online visibility with our SEO-friendly React Portfolio Template. Implement best practices for search engine optimization and increase the discoverability of your portfolio by potential clients, employers, or collaborators.</li><li>Easy Integration: Seamlessly integrate your existing projects, blog, or social media feeds to create a holistic online presence. Our template provides easy integration options, allowing you to consolidate your digital footprint effortlessly.</li><li>Regular Updates: Stay ahead of the curve with our commitment to regular updates and improvements. As the digital landscape evolves, so will your portfolio, ensuring it remains contemporary and aligned with the latest design and technology trends.</li></ul><p>Unlock the full potential of your online portfolio with our React Template – where innovation, functionality, and style converge to create a memorable and impactful showcase of your skills and achievements. Elevate your digital presence today!</p><p>Crafted for professionals who seek a blend of functionality and aesthetics, our React Portfolio Template is your gateway to a visually stunning and highly responsive online presence. Unleash the power of React JS, showcase your work with flair, and make a lasting impression with this awesome portfolio solution.</p><h2>All Pages</h2><ul><li>Home Page</li><li>About Page</li><li>Service Page</li><li>Blog Page</li><li>Blog Details Page</li><li>Portfolio Page</li><li>Contact Page</li><li>404 Page</li></ul><h2>Template Features</h2><ul><li>Build on React latest</li><li>Build with Tailwind CSS’s latest</li><li>Using React Icons</li><li>Google font include</li><li>Fully Responsive Design</li><li>Clean Code</li><li>W3C Validated Code</li><li>Cross Browser Support</li><li>Well Documented</li><li>No console error</li></ul><p><strong>Note that, Demo images are only for preview and not included in the download package</strong></p>","templateFullTitle":"Lariv - React js portfolio web template","templatePreviewMetaDescription":"Introducing our Lariv React js Portfolio Template, a meticulously crafted solution that seamlessly blends innovation and aesthetics to elevate your online","templateDemoMetaDescription":"The live preview for this premium Lariv - React js portfolio web template Website Template (#374722) is created for you to get acquainted with the theme before buying it. View the pages, examine the images, press the buttons, explore the features.","specificTemplateNameListing":null,"specificTemplateNamePreview":null,"anchorTitle":"Lariv - React js portfolio web template","anchorFeature":"Responsive","isInvertOrder":true,"isRTL":true,"anchorType":"","templateUrl":"/website-templates/lariv-react-js-portfolio-web-template-374722.html","userRating":0,"designIndex":1,"authorUserId":"78165087","exclusive":"1","state":1,"price":20,"inserted_date":"2023-11-30","sent":0,"downloads":0,"search_words":"agency business clean corporate creative design minimal modern personal photographer photography portfolio responsive resume services tailwind react portfolio tailwind portfolio new react portfolio awesome portfolio","is_adult":0,"exc_price":2100,"sent_date":"2023-11-30 10:14:18","last_upload":"2023-11-30 10:15:24","package_id":295,"hasExclusivePrice":1,"screenshots":[{"id":3300334,"templ_id":374722,"filename":"374722-original.png","width":1600,"height":1000,"href":"","window_params":"","scr_type_id":334,"banner_url":"","banner_open_url":"","banner_open_window_params":"","wide":0},{"id":3300335,"templ_id":374722,"filename":"374722-big.png","width":1600,"height":1000,"href":"","window_params":"","scr_type_id":311,"banner_url":"","banner_open_url":"","banner_open_window_params":"","wide":0},{"id":3300336,"templ_id":374722,"filename":"374722-med.jpg","width":370,"height":370,"href":"","window_params":"","scr_type_id":312,"banner_url":"","banner_open_url":"","banner_open_window_params":"","wide":0},{"id":3300337,"templ_id":374722,"filename":"374722-m.jpg","width":145,"height":156,"href":"","window_params":"","scr_type_id":9,"banner_url":"","banner_open_url":"","banner_open_window_params":"","wide":0},{"id":3300338,"templ_id":374722,"filename":"374722-b.jpg","width":430,"height":269,"href":"","window_params":"","scr_type_id":57,"banner_url":"","banner_open_url":"","banner_open_window_params":"","wide":0}],"demoUrl":"/demo/374722.html","image":"https://s.tmimgcdn.com/scr/374700/lariv-react-js-portfolio-web-template_374722-original.png","searchHash":"3acdb337e942010988ebf18fa4a8d00c","previewHash":"9a050b9628384dc1fa0dfe9e7ef36d78","authorNickname":"themesoft69","lowLevelTopic":"Artist Portfolio Templates; Photographer Portfolio Templates; Landscape Design Templates; Web Design Templates; Designer Portfolio Templates","weightedRating":null,"annualSale":null,"monthlySales":null,"quarterlySales":null,"productBoost":0,"onSale":0,"finalPrice":20,"discountPercent":0,"discountAmount":0,"semiannualSales":0,"properties":{"features":["Premium","Responsive","Pro","Google map","Performance Optimization","Blog","Portfolio","HTML 5"],"styles":["Clean","Dark"],"isLastAdded":"1","popularity":"Zero Downloads","topic":["Art Templates","Artist Portfolio Templates","Photography Templates","Photographer Portfolio Templates","Landscape Design Templates","Exterior Design Templates","Web Design Templates","Design","Designer Portfolio Templates","Art & Culture","Design & Photography","Home & Family"],"isFree":"none","color":"black","showVariantForcibly":"b","exclusive":"1","alreadyPacked":"1","imagesIncluded":"No","tags":["agency","business","clean","corporate","creative","design","minimal","modern","personal","photographer","photography","portfolio","responsive","resume","services","tailwind","react portfolio","awesome portfolio","tailwind portfolio","new react portfolio"],"marketplaceMembership":"None","paidSupport":"Yes","webServerCompatibility":["Apache 2.4","Nginx 1.2x"],"generalSoftwareRequirements":["Code editing tool","ZIP unarchiver"],"authorUserId":"78165087","frameworks":"React.js v18.x","excerpt":"<p><strong>Lariv </strong>is a – Personal Portfolio React Template with predefined web elements that help you build your own site.</p>","nameOfTheTemplate":"Lariv - React js portfolio web template","shortDescription":"<p>Introducing our <strong>Lariv React js Portfolio Template</strong>, a meticulously crafted solution that seamlessly blends innovation and aesthetics to elevate your online presence. Built with the powerful React JS library, this template ensures a lightning-fast, responsive, and dynamic portfolio experience.</p><p>Immerse your audience in the captivating world of your work with smooth animations that add a touch of sophistication to your portfolio. The inclusion of the Swiper slider brings a dynamic edge, allowing you to showcase your projects in a visually stunning and interactive manner. Elevate your portfolio further with the inclusion of a sleek dark mode, providing a modern and stylish alternative for users who prefer a darker aesthetic.</p><p>What sets our template apart is its commitment to user engagement. The dynamic contact form not only streamlines communication but also adds a personalized touch, making it easier for potential clients or collaborators to connect with you effortlessly.</p><p><strong>Key Features:</strong></p><ul><li>React JS Powered: Leverage the efficiency and flexibility of React JS for a high-performance portfolio website.</li><li>Immersive Animations: Captivate your audience with seamless and eye-catching animations that bring your portfolio to life.</li><li>Swiper Slider: Showcase your projects with flair using the Swiper slider, ensuring an engaging and interactive user experience.</li><li>Sleek Dark Mode: Stay on-trend with a stylish dark mode that adds a touch of elegance and modernity to your portfolio.</li><li>Dynamic Contact Form: Foster meaningful connections with a dynamic contact form that enhances user interaction and streamlines communication.</li></ul><p><strong>Key Highlights:</strong></p><ul><li>Responsive Design: Our React Portfolio Template is built with a mobile-first approach, ensuring a seamless and engaging experience across devices. Your portfolio will look stunning whether viewed on a desktop, tablet, or smartphone.</li><li>Versatile Showcase: The template provides a versatile showcase for your work, allowing you to present projects, case studies, and achievements with clarity and impact. Impress your audience with a professional and organized display of your skills and accomplishments.</li><li>Personalization Options: Tailor your portfolio to reflect your unique style with easy-to-use personalization options. Customize colors, fonts, and layouts effortlessly, ensuring that your portfolio aligns perfectly with your brand and personality.</li><li>Effortless Navigation: Enhance user experience with intuitive navigation. Your visitors can seamlessly explore your portfolio, gaining insights into your expertise and creativity without any hassle.</li><li>Optimized Performance: With a focus on performance optimization, our template ensures fast loading times, contributing to an overall positive user experience. Your portfolio will make an instant impact, keeping visitors engaged and interested.</li><li>SEO-Friendly: Boost your online visibility with our SEO-friendly React Portfolio Template. Implement best practices for search engine optimization and increase the discoverability of your portfolio by potential clients, employers, or collaborators.</li><li>Easy Integration: Seamlessly integrate your existing projects, blog, or social media feeds to create a holistic online presence. Our template provides easy integration options, allowing you to consolidate your digital footprint effortlessly.</li><li>Regular Updates: Stay ahead of the curve with our commitment to regular updates and improvements. As the digital landscape evolves, so will your portfolio, ensuring it remains contemporary and aligned with the latest design and technology trends.</li></ul><p>Unlock the full potential of your online portfolio with our React Template – where innovation, functionality, and style converge to create a memorable and impactful showcase of your skills and achievements. Elevate your digital presence today!</p><p>Crafted for professionals who seek a blend of functionality and aesthetics, our React Portfolio Template is your gateway to a visually stunning and highly responsive online presence. Unleash the power of React JS, showcase your work with flair, and make a lasting impression with this awesome portfolio solution.</p><h2>All Pages</h2><ul><li>Home Page</li><li>About Page</li><li>Service Page</li><li>Blog Page</li><li>Blog Details Page</li><li>Portfolio Page</li><li>Contact Page</li><li>404 Page</li></ul><h2>Template Features</h2><ul><li>Build on React latest</li><li>Build with Tailwind CSS’s latest</li><li>Using React Icons</li><li>Google font include</li><li>Fully Responsive Design</li><li>Clean Code</li><li>W3C Validated Code</li><li>Cross Browser Support</li><li>Well Documented</li><li>No console error</li></ul><p><strong>Note that, Demo images are only for preview and not included in the download package</strong></p>","uniqueKeywords":"agency,business,clean,corporate,creative,design,minimal,modern,personal,photographer,photography,portfolio,responsive,resume,services,tailwind,react portfolio,tailwind portfolio,new react portfolio,awesome portfolio","advImage":"https://s3u.tmimgcdn.com/u78165087/c6af7a0dc704602447aa930f2f98cbd6.png","affiliateSells":"1","authorMainScreenshot":"https://s3u.tmimgcdn.com/u78165087/a23ab9bd03a35d3a85a824a18d6a33c6.png","imageKeyFeatures":"https://s3u.tmimgcdn.com/u78165087/d75067c197b899c6faae517ec8825ff4.png","livePreviewURL":"https://www.lariv.themesoft69.com/","metaDescription":"Introducing our Lariv React js Portfolio Template, a meticulously crafted solution that seamlessly blends innovation and aesthetics to elevate your online","saleSells":"1","templateSupportOptions":"[]","demoMetaDescription":"The live preview for this premium Lariv - React js portfolio web template Website Template (#374722) is created for you to get acquainted with the theme before buying it. View the pages, examine the images, press the buttons, explore the features.","customUrl":"/website-templates/lariv-react-js-portfolio-web-template-374722.html","productSize":"1689078","trendiness":"1","types":"HTML Website Templates","templateIcon":"icon-monster_dark","hELPURL":"/quick-start-guide/website-template/","followUpLetter":"website-template-offers","productFamily":"None","templateGroup":"HTML Templates","category":"Website templates"}}]"
array(17) {
  [0]=>
  string(15) "HTTP/1.1 200 OK"
  [1]=>
  string(20) "Server: nginx/1.22.0"
  [2]=>
  string(35) "Date: Mon, 29 Apr 2024 07:12:31 GMT"
  [3]=>
  string(45) "Content-Type: application/json; charset=UTF-8"
  [4]=>
  string(17) "Connection: close"
  [5]=>
  string(130) "Access-Control-Expose-Headers: X-Pagination-Current-Page, X-Pagination-Page-Count, X-Pagination-Per-Page, X-Pagination-Total-Count"
  [6]=>
  string(12) "Vary: Accept"
  [7]=>
  string(27) "X-Pagination-Total-Count: 1"
  [8]=>
  string(26) "X-Pagination-Page-Count: 1"
  [9]=>
  string(28) "X-Pagination-Current-Page: 1"
  [10]=>
  string(25) "X-Pagination-Per-Page: 20"
  [11]=>
  string(293) "Link: <http://products/api/v2/products/en?language=en&ids=374722&expand=properties&page=1>; rel=self, <http://products/api/v2/products/en?language=en&ids=374722&expand=properties&page=1>; rel=first, <http://products/api/v2/products/en?language=en&ids=374722&expand=properties&page=1>; rel=last"
  [12]=>
  string(38) "Expires: Mon, 29 Apr 2024 07:17:31 GMT"
  [13]=>
  string(26) "Cache-Control: max-age=300"
  [14]=>
  string(16) "Direct_API: true"
  [15]=>
  string(22) "X-Cache-Status: BYPASS"
  [16]=>
  string(24) "X-Up: 165.227.251.218:80"
}
https://www.lariv.themesoft69.com/<!DOCTYPE html>
<html lang="en">
<head>
    <title>#374722 Preview</title>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=11; IE=10; IE=9; IE=8;"/>
    <link rel="canonical" href="https://rms.templates.com/demo/374722.html">
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/normalize.css"/>
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/bootstrap.css"/>
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/styles.css"/>
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/demo.css"/>
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/jquery.fancybox.css" />
    <link rel="icon" type="image/png" href="/themes/theme-2018-v03-en/images/favicon.png"/>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script type="text/javascript" src="/themes/theme-2018-v03-en/js/jquery.form.js"></script>
    <script type="text/javascript" src="/themes/theme-2018-v03-en/js/jquery.validate.js"></script>
    <script type="text/javascript" src="/themes/theme-2018-v03-en/js/jquery.fancybox.js"></script>
    <script type="text/javascript" src="/themes/theme-2018-v03-en/js/demo-main.js"></script>
    <link rel="stylesheet" type="text/css" href="/themes/theme-2018-v03-en/css/fontello-embedded.css"/>
    <script charset="utf-8">
        //TODO: some strange value
        var min_height = 600;
        $(function () {
            resizeFrame();
        });
        function resizeFrame() {
            if (0 == 0
        )
            return false;
            var main_iframe = $('#preview');
            var height = $(window).height() - $('#preview-bar:visible').outerHeight();
            /* if ($.browser.opera)
                height += 5; */
            if (height < min_height)
                height = min_height;
            $('#preview').height(height);
            $('#iframelive').height(height);
            if ($(window).width() < 1400)
                $('#min-hide-this').hide();
            else
                $('#min-hide-this').show();
        }
        $(window).resize(function () {
            resizeFrame();
        }).load(function () {
            resizeFrame();
        });
        $(document).ready(function(){
            $('#close').click(function(e){
                e.preventDefault();
                $('#preview-bar').hide();
            });
        })
    </script>
    <script type="text/javascript">
        window.su = 'https://rms.templates.com/';
    </script>
    

    <script>
    $(function () {

    $('#frame_controls .device_item').click(function(){
            $(this).siblings().removeClass('device_current');
            $(this).addClass('device_current');
            var className = $(this).data('device');
            $('#showframe').attr('class', className);
            return false;
        });

    });
    </script>
    <style>
    /* Frame with demo-----  */

/* Desktop */
#showframe {
    width: 100%;
    margin: 0 auto;
    /*
    position: relative;
    z-index: 1;
    */
}
    #showframe .hide_wrap {
        overflow: hidden;
    }
    #showframe iframe {
        width: 100%;
        height: 100%;
        display:block;
        vertical-align: top;
    }

/* Tablet landscape */
#showframe.tab_land {
    margin-top: 30px;
    /*width: 1224px;*/
    width: 1200px;
    padding: 38px 103px 37px 85px;
    background: url(../images/tab_landscape.png) 0 0 no-repeat;
}
    #showframe.tab_land .hide_wrap {
        width: 1024px;
                height: 640px;
        -webkit-border-radius: 3px;
            -ms-border-radius: 3px;
                border-radius: 3px;
    }
    #showframe.tab_land .hide_wrap iframe {
        width: 1041px !important;
        height: 640px !important;
    }

/* Tablet portrait */
#showframe.tab_port {
    margin-top: 30px;
    /*width: 480px;*/
    width: 540px;
    padding: 65px 27px 78px 28px;
    background: url(../images/tab_portrait.png) 0 0 no-repeat;
}
    #showframe.tab_port .hide_wrap {
        width: 480px;
        height: 640px;
        -webkit-border-radius: 3px;
            -ms-border-radius: 3px;
                border-radius: 3px;
    }
    #showframe.tab_port .hide_wrap iframe {
    	width: 497px !important;
		height: 640px !important;
	}

/* Tablet mobile */
#showframe.mobile {
	margin-top: 30px;
	/*width: 320px;*/
	width: 360px;
	padding: 92px 19px 102px 19px;
	background: url(../images/mobile.png) 0 0 no-repeat;
}
	#showframe.mobile .hide_wrap {
		width: 320px;
		height: 520px;
		-webkit-border-radius: 3px;
			-ms-border-radius: 3px;
				border-radius: 3px;
	}
	#showframe.mobile .hide_wrap iframe {
		width: 337px !important;
		height: 520px !important;
	}
#frame_controls .device_tablet_landscape:before{
    transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);

}

/* Mobile landscape */
#showframe.mobile_land {
	margin-top: 30px;
	/*width: 1024px;*/
	width: 800px;
	padding: 15px 103px 37px 90px;
	background: url(../images/mobile_landscape.png) 0 0 no-repeat;
}
	#showframe.mobile_land .hide_wrap {
		width: 1024px;
				height: 640px;
		-webkit-border-radius: 3px;
			-ms-border-radius: 3px;
				border-radius: 3px;
	}
	#showframe.mobile_land .hide_wrap iframe {
		width: 520px !important;
		height: 320px !important;
	}
	#frame_controls .device_mobile_landscape:before{
    transform: rotate(-90deg);
        -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);

}

/*Device Styles start*/
#frame_controls {
	display: inline-block;
	vertical-align: top;
	height:100%;
	/*
	margin-left:10em;
	*/
}
	#frame_controls .device_item {
		display: inline-block;
		vertical-align: top;
		/*font-size: 1.5em;*/
		height: 54px;
		/*line-height: 54px;*/
		text-align:center;

		width: 54px;
		margin-left:2px;
		/*background-color: #233448;*/

		/*padding: 0 12px;*/
		color: #546171;
	}
	#frame_controls .device_item:hover {
		color: #fff;
		/*
		background-color: #15e27f;
		*/
	}
	#frame_controls .device_current {
		color: #fff;	/* #15e27f; */
		/*
		background-color: #15e27f;
		*/
	}
/*Device Styles End*/
	.pricer{
		max-width:100px!important;
		min-width:100px!important;
		}

    </style>
    <style>
	/*Advanced Styles*/
a {
	text-decoration: none;
	-webkit-transition: color .3s ease, background-color .3s ease;
	    -ms-transition: color .3s ease, background-color .3s ease;
	        transition: color .3s ease, background-color .3s ease;
}
body, a, a:visited, a:active {
	color: #fff;
}
a:active {
	outline: none;
}

[class*="icon-"]:before {
	margin:0;
	padding:0;
	line-height:inherit;
	vertical-align:baseline;
}


#header {
	background-color: #0a1d33;
	height: 54px;
	text-align: center;
	position: relative;
	z-index: 2;
}
#header:after {
	content:' ';
	display:block;
	width: 100%;
	height:0;
	clear:both;
}

#header .left_col {
	float: left;
	height: 54px;
}

	#logo {
		display: inline-block;
		vertical-align: top;
		text-align:center;
		/*margin-right: 1px;*/
	}
		#logo img {
			vertical-align: top;
			width: auto;
			height: 54px;
			max-height:100%;
		}

	#socials {
		display: inline-block;
		vertical-align: top;
		height:100%;
	}
		#socials .social_item {
			display: inline-block;
			vertical-align: top;
			font-size: 16px;
			width: 54px;
			height: 54px;
			line-height: 54px;
			text-align:center;
			/*
			margin-left:2px;
			background-color: #233448;
			*/
			border-right: 1px solid #2f3f51;
		}


	#theme_selector {
		display: inline-block;
		vertical-align: top;
		color: #dedfe0;
		position:relative;
		/*
		background-color: #233448;
		margin-left: 2px;
		*/
		border-right: 1px solid #2f3f51;
		text-align: left;
	}
		#theme_selector .current_theme {
			display: block;
			width: 390px;
			height: 54px;
			line-height: 54px;
			overflow:hidden;
			padding: 0 3em 0 2em;
			color: #dedfe0;
			-webkit-box-sizing: border-box;
				-ms-box-sizing: border-box;
					box-sizing: border-box;
		}
		#theme_selector .current_theme:hover {
			color: #fff;
		}
		#theme_selector .current_theme:after {
			content: '\e825';
			font-family: 'fontello';
			display:inline-block;
			vertical-align:top;
			line-height: 56px;
			font-size: 1.25em;
			position:absolute;
			z-index:1;
			right: 1.5em;
			top: 0;
			-webkit-transition: -webkit-transform 0.5s ease;
			-ms-transition: -ms-transform 0.5s ease;
			transition: transform 0.5s ease;
		}
		#theme_selector .current_theme:hover:after {
			color: #fff;
		}
		#theme_selector .theme_selector_opened:after {
			-webkit-transform: rotate(180deg);
			-ms-transform: rotate(180deg);
			transform: rotate(180deg);
		}
			#theme_selector .current_theme_name {
				width: 100%;
				overflow: hidden;
			}
		#theme_selector .related_themes {
			display: none;
			width: 390px;
			padding: 2em;
			-webkit-box-sizing: border-box;
				-ms-box-sizing: border-box;
					box-sizing: border-box;
			position: absolute;
			left: 0;
			top: 54px;
			background-color: #0a1d33;
		}
			#theme_selector .themes_list {
				list-style: none;
				padding: 0;
				margin: 0;
			}
			#theme_selector .themes_list li {
				position: relative;
				padding-left: 2em;
			}
			#theme_selector .themes_list li:before {
				content: " ";
				display: block;
				position: absolute;
				top: 11px;
				left: 0;
				width: 1em;
				height: 2px;
				background-color: #15e27f;
			}
			#theme_selector .themes_list li a {
				display:block;
				color: #dedfe0;
			}
			#theme_selector .themes_list li.active a,
			#theme_selector .themes_list li a:hover {
				color: #15e27f;
			}
			#theme_selector .themes_list li + li {
				margin-top: 0.5em;
			}
			#theme_selector .placeholder {
				width: 100%;
				margin-top: 1em;
			}
			#theme_selector .placeholder img {
				width: 100%;
				max-width:100%;
				height: auto;
				vertical-align: top;
			}

#frame_controls {
	display: inline-block;
	vertical-align: top;
	height:100%;
	/*
	margin-left:10em;
	*/
}
	#frame_controls .device_item {
		display: inline-block;
		vertical-align: top;
		font-size: 1.5em;
		height: 54px;
		line-height: 54px;
		text-align:center;
		/*
		width: 54px;
		margin-left:2px;
		background-color: #233448;
		*/
		padding: 0 12px;
		color: #546171;
	}
	#frame_controls .device_item:hover {
		color: #fff;
		/*
		background-color: #15e27f;
		*/
	}
	#frame_controls .device_current {
		color: #fff;	/* #15e27f; */
		/*
		background-color: #15e27f;
		*/
	}
	#frame_controls .device_tablet_landscape:before {
		-webkit-transform:rotate(-90deg);
			-ms-transform:rotate(-90deg);
				transform:rotate(-90deg);
	}


#header .right_col {
	float: right;
	display:inline-block;
	vertical-align: top;
	height: 54px;
}
	#header .right_col > a {
		display: inline-block;
		vertical-align:top;
		height: 54px;
		line-height:54px;
		text-align:center;
		padding: 0 3.4em;
		font-size: 10px;
		font-weight:bold;
		text-transform: uppercase;
		letter-spacing:1px;
		/*
		margin-left: 2px;
		background-color: #233448;
		*/
		border-left: 1px solid #2f3f51;
	}
	#header .right_col > a:hover {
		background-color: #ff1f00;
	}
	#header .right_col > a:before {
		margin-right: 0.5em;
		vertical-align: top;
		font-size:1.25em;
	}
	#header .right_col > a.docs {
		padding: 0 3.6em;
	}
	#header .right_col > a.purchase {
		color: #fff;
		background-color: #15e27f;
		padding: 0 4em;
		border-left: none;
	}
	#header .right_col > a.purchase:hover,
	#header .right_col > a.docs:hover {
		color: #0a1d33;
		background-color: #f7f7f7;
	}
	#header .right_col > a.closeframe {
		padding:0 !important;
		letter-spacing:0 !important;
		width: 54px;
		visibility: hidden;
	}
	#header .right_col > a.closeframe:hover {
		color: #15e27f;
		background-color: #0a1d33;
	}
	#header .right_col > a.closeframe:before {
		margin-right: 0;
	}


.openframe,
.basket {
	display: block;
	width: 54px;
	height: 54px;
	line-height:54px;
	background-color: #0a1d33;
	text-align:center;
	font-size: 14px;
	font-weight:bold;
	text-transform: uppercase;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 3;
	-webkit-transition: color 0.3s ease, background-color 0.3s ease;
	-ms-transition: color 0.3s ease, background-color 0.3s ease;
	transition: color 0.3s ease, background-color 0.3s ease;
}
.basket {
	background-color:#15e27f;
	z-index: 1;
	font-size: 18px;
}
.basket:hover {
	color: #0a1d33;
	background-color: #f7f7f7;
}
.openframe:before {
	content: '\e815';
	font-family: 'fontello';
	display: inline-block;
	width: 1em;
	height: 1em;
	line-height: 1em;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-webkit-transition: -webkit-transform 0.5s ease;
	-ms-transition: -ms-transform 0.5s ease;
	transition: transform 0.5s ease;
}
body.header_off .openframe:before {
	/*
	content: '\e829';
	*/
	-webkit-transform: rotate(90deg);
	-ms-transform: rotate(90deg);
	transform: rotate(90deg);
}
.openframe:hover {
	color: #15e27f;
	background-color: #0a1d33;
}


/* Frame with demo
-----------------------------  */

/* Desktop */
#showframe {
	width: 100%;
	margin: 0 auto;
	/*
	position: relative;
	z-index: 1;
	*/
}
	#showframe .hide_wrap {
		overflow: hidden;
	}
	#showframe iframe {
		width: 100%;
		height: 100%;
		display:block;
		vertical-align: top;
	}

/* Tablet landscape */
#showframe.tab_land {
	margin-top: 30px;
	width: 1224px;
	padding: 38px 103px 37px 85px;
	background: url(../images/tab_landscape.png) 0 0 no-repeat;
}
	#showframe.tab_land .hide_wrap {
		width: 1024px;
		height: 640px;
		-webkit-border-radius: 3px;
			-ms-border-radius: 3px;
				border-radius: 3px;
	}
	#showframe.tab_land .hide_wrap iframe {
		width: 1041px !important;
		height: 640px !important;
	}

/* Tablet portrait */
#showframe.tab_port {
	margin-top: 30px;
	width: 540px;
	padding: 65px 27px 78px 28px;
	background: url(../images/tab_portrait.png) 0 0 no-repeat;
}
	#showframe.tab_port .hide_wrap {
		width: 480px;
		height: 640px;
		-webkit-border-radius: 3px;
			-ms-border-radius: 3px;
				border-radius: 3px;
	}
	#showframe.tab_port .hide_wrap iframe {
		width: 497px !important;
		height: 640px !important;
	}

/* Tablet mobile */
#showframe.mobile {
	margin-top: 30px;
	width: 360px;
	padding: 92px 19px 102px 19px;
	background: url(../images/mobile.png) 0 0 no-repeat;
}
	#showframe.mobile .hide_wrap {
		width: 320px;
		height: 520px;
		-webkit-border-radius: 3px;
			-ms-border-radius: 3px;
				border-radius: 3px;
	}
	#showframe.mobile .hide_wrap iframe {
		width: 337px !important;
		height: 520px !important;
	}




@media (max-width: 1529px) {
	body {
		font-size:13px;
		line-height:20px;
	}
	#header,
	#header .left_col,
	#header .right_col,
	#logo img {
		height:42px;
	}
	#socials .social_item {
		font-size: 14px;
		width: 42px;
		height: 42px;
		line-height: 42px;
	}
	#theme_selector .current_theme {
		width: 300px;
		height: 42px;
		line-height: 42px;
		padding: 0 2em 0 1.5em;
	}
	#theme_selector .current_theme:after {
		line-height: 42px;
		right: 1em;
	}
	#theme_selector .related_themes {
		width: 300px;
		padding: 1.5em;
		top: 42px;
	}
	#frame_controls .device_item {
		height: 42px;
		line-height: 42px;
		padding: 0 10px;
	}
	#header .right_col > a {
		height: 42px;
		line-height:42px;
		padding: 0 2em !important;
	}
	#header .right_col > a.closeframe {
		width: 42px;
	}
	.openframe,
	.basket {
		width: 42px;
		height: 42px;
		line-height:42px;
		font-size: 12px;
	}
}
@media (max-width: 1199px) {
	#frame_controls {
		display:none;
	}
}
@media (max-width: 1023px) {
	#header .right_col > a.docs {
		display: none;
	}
}
@media (max-width: 959px) {
	#header .right_col > a.customization {
		display: none;
	}
}
@media (max-width: 767px) {
	#socials {
		display: none;
	}
	#theme_selector .current_theme {
		width: 270px;
		padding: 0 1.5em 0 1em;
	}
	#theme_selector .current_theme:after {
		right: 0.5em;
	}
	#theme_selector .related_themes {
		width: 270px;
		padding: 1em;
	}
	#header .right_col > a {
		font-size: 10px;
	}
}
@media (max-width: 639px) {
	#theme_selector .current_theme {
		display: none;
	}
}
@media (max-width: 479px) {
	body {
		font-size:12px;
		line-height:18px;
	}
	#header,
	#header .left_col,
	#header .right_col,
	#logo img {
		height:36px;
	}
	#socials .social_item {
		font-size: 14px;
		width: 36px;
		height: 36px;
		line-height: 36px;
	}
	#header .right_col > a {
		height: 36px;
		line-height:36px;
		font-size: 10px;
	}
	#header .right_col > a.purchase {
		letter-spacing:0;
	}
	#header .right_col > a.closeframe {
		width: 36px;
	}
	.openframe,
	.basket {
		width: 36px;
		height: 36px;
		line-height:36px;
	}
}
	</style>



</head>
<body id="fullscreen-preview">
    <div id="preview-bar">
        <ul id="bar-inner">
            <li class="tm-logo block">
                <a href="https://rms.templates.com/">
                    <img src="/themes/theme-2018-v03-en/images/Logo_white.png" alt="">
                </a>
            </li>
            <li class="block inner info">
                Website Templates #374722            </li>
            <!--responsivator HTML-->
            <li class="block inner info" id="frame_controls">
                <a href="#" class="icon-desktop device_item device_desktop device_current" data-width="100%" data-device="desktop"></a>
                <!--<a href="#" class="icon-tablet device_item device_tablet_landscape" data-width="960" data-device="tab_land"></a>-->
                <a href="#" class="icon-tablet device_item device_tablet_portrait" data-width="480" data-device="tab_port"></a>
                <a href="#" class="icon-mobile device_item device_mobile" data-width="320" data-device="mobile"></a>
                <!--<a href="#" class="icon-mobile device_item device_mobile_landscape" data-width="320" data-device="mobile_land"></a>-->
			</li>

                        <li class="block inner"><a href="https://www.templatehelp.com/preset/cart.php?act=add&amp;templ=374722&amp;pr_code=11111111" class="btn2">
            	Buy Now
            	                <span>
                    $18                <span>
                        </a></li>
                        <a href="#" id="close">Close</a>
        </ul>
    </div>
    <!--<div id="iframelive" class="no-responsive">-->
    <div id="showframe">

        <div id="preview-wrapper" class="hide_wrap">

                            <div class="technical-problems">
                    <p>Technical operations</p>
                    <p class="problems-message">Live demo of this template will be available within 5-6 hours.</p>
                    <p>
                        <a href="/website-templates-type">Go back to the template gallery</a>
                    </p>
                </div>
                    </div>
    </div>
</body>
</html>