/*
Theme Name: Rida Vcard | Personal Portfolio/Resume HTML5 Template
Author: Aazztech
Author URI: http://aazztech.com
Version: 1.0.0
*/

/*****************************************
    		TABLE OF CONTENTS
******************************************
-------------------------------
	GENERAL STYLES
-------------------------------
======> RESET CSS
======> TYPOGRAPHY
======> HELPER CLASSES
======> BUTTON STYLE
======> TEXT TRANSFORM
======> SECTION PADDING
======> PROGRESSBAR CSS
======> SECTION TITLE

-------------------------------
		SECTIONS
-------------------------------
======> 1. SIDEBAR AREA CSS
======> 2. MAIN CONTENT AREA CSS
======> 2. HOME AREA CSS
======> 2. ABOUT AREA CSS
           ---SKILL AREA CSS
           ---TESTIMONIAL WRAPPER
======> 5. RESUME AREA
======> 5. SERVICE AREA
		   ---COUNTER UP AREA
		   ---WORKING PROCESS
======> 5. PORTFOLIO AREA
======> 5. BLOG AREA
======> 5. CONTACT AREA


-------------------------------
			PAGES
-------------------------------
======> 1. SINGLE BLOG PAGE
======> 1. SINGLE PORTFOLIO PAGE
*/


/* RESET CSS */
	html{
		position: relative;
		height: 100%;
		width: 100%;
	}
	body{
		font-family: 'Montserrat', sans-serif;;
		position: relative;
		height: 100%;
		width: 100%;
		font-weight: 300;
		overflow-x: hidden;
		color: #5a5a5a;
	}
	ul{
		padding: 0;
		margin: 0;
	}
	li{
		list-style: none;
	}
	a:hover,a:focus{
		text-decoration: none;
	}
	a:focus{
		outline: 0;
	}
	input[type=date],
	input[type=datetime-local],
	input[type=email],
	input[type=number],
	input[type=password],
	input[type=search-md],
	input[type=search],
	input[type=tel],
	input[type=text],
	input[type=time],
	input[type=url],
	textarea.md-textarea {
		box-sizing: border-box;
	}
	input:focus,
	textarea:focus,
	button:focus,
	.btn:focus,
	button:active,
	.btn:active{
		outline: 0;
	}
	input{
		line-height: 50px;
		width: 100%;
		padding: 0 20px;
		border: 1px solid #eaeaea;
	}
	textarea{
		padding: 20px;
		width: 100%;
		border: 1px solid #eaeaea;
	}


/* TYPOGRAPHY */
	p,
	a{
	    color: #676767;
	}
	p{
		font-size: 14px;
		line-height: 26px;
	}
	h1,
	h2,
	h3,
	h4,
	h5,
	h6{
		margin: 0;
		font-weight: 400;
		padding: 0;
		color: #333;
	}

/* HELPER CLASSES */
	.no-padding{
		padding: 0;
	}
	.no-margin{
		margin: 0;
	}
	.padding-left0{
		padding-left: 0;
	}
	.ltr{
		text-align: right;
	}
	.rtl{
		text-align: left;
	}
    .br_0{
        border-right: none!important;
    }
    .bt1{
        border-top: 1px solid #e4e4e4;
    }
	.v_middle{
		display: inline-block;
		vertical-align: middle;
		margin-right: -3px;
		float: none;
	}
	.pr_0{
		padding-right: 0;
	}
	.pl_0{
		padding-left: 0;
	}
	.visible_md{
		display: none;
	}
	.visible_sm{
		display: none;
	}

/* BUTTON STYLE */
	.btn{
		line-height: 50px;
		border: 2px solid #35373e;
		border-radius: 0;
		color: #35373e;
		font-size: 12px;
		transition: 0.3s;
		font-weight: 400;
	}
	.btn:hover{
		border-color: #362cb1;
		color: #362cb1;
	}

/* TEXT TRANSFORM */
	.main_menu	ul li a,
	.home .hero_content h1,
	.home .hero_content p,
	.btn,
	.section_title,
	.single_skill .labels p,
	.resume_are_title p,
	.timeline_title h4,
	.service_title,
	.count p,
	.process_title,
	.filter_area ul li,
	.blog_content h4,
	.blog_title h3,
	.comment_area .area_title,
	.widget_title{
		text-transform: uppercase;
	}

/* SECTION PADDING */
	.section_padding{
		padding-top: 15px;
		padding-bottom: 130px;
	}

/* PROGRESSBAR CSS */
	.progress{
		height: 3px;
		box-shadow: 0 0 0;
		background: #e0e0e0;
		overflow: visible;
		margin-bottom: 0;
	}
	.progress-bar{
		background: #35373e;
		transition: 0.3s;
		position: relative;
	}
	.progress-bar .percent_indicator {
	    position: absolute;
	    width: 14px;
	    height: 1px;
	    background: #35373e;
	    top: -17px;
	    right: 0;
	    z-index: 1;
	    transform: translateX(48%);
	}
	.progress-bar .percent_indicator:before,
	.progress-bar .percent_indicator:after{
		content: "";
		position: absolute;
		height: 100%;
		width: 100%;
		background: #35373e;
	}
	.progress-bar .percent_indicator:before {
	    transform: rotate(-59deg);
	    right: -3px;
	    top: 5.5px;
	}
	.progress-bar .percent_indicator:after {
	    transform: rotate(-122deg);
	    left: -4px;
	    top: 6px;
	}
	.single_skill{
		margin-bottom: 40px;
	}
	.single_skill .labels p{
		margin-right: 5px;
	}
	.single_skill .labels p,
	.single_skill .labels span{
		display: inline-block;
		color: #35373e;
		font-weight: 400;
	}
	.single_skill .labels p:after{
		content: "-";
		position: relative;
		right: -5px;
	}


/* SECTION TITLE */
	.section_title {
		text-align: center;
		border-bottom: 1px solid #e1e1e1;
		padding-bottom: 27px;
		position: relative;
		margin-bottom: 75px;
	}
	.section_title:before{
		position: absolute;
		content: "";
		height: 12px;
		width: 12px;
		background: #362cb1;
		border-radius: 50%;
		bottom: 0;
		transform: translateY(50%);
	}
	.section_title h2 {
	    font-size: 24px;
	    color: #000;
	    font-weight: 400;
	    line-height: 48px;
	}
	p.sub_title {
	    font-weight: 300;
	    font-size: 16px;
	    color: #a8a8a8;
		margin: 0;
	}


/*--------------------
SIDEBAR AREA CSS
----------------------*/
	aside.nav_sidebar{
		width: 160px;
		background: #372db4;
	}
	.site{
		height: 100%;
	}
	.toggle_icon {
		text-align: center;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.toggle_icon span {
		font-size: 26px;
		color: #8f86f9;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
		cursor: pointer;
	}
	.toggle_icon span:hover,
	.nav_sidebar.shrinked .toggle_icon span{
		color: #fff;
	}
	aside.nav_sidebar{
		height: 100%;
		position: fixed;
		left: 0;
		display: inline-block;
        z-index: 999;
		top: 0;
		bottom: 0;
		box-shadow: 5px 0 30px rgba(0,0,0,0.2);
		overflow-y: auto;
	}
	aside.nav_sidebar.shrinked{
		width: 100px;
	}
	aside.nav_sidebar.shrinked ~ .main_content{
		left: 100px;
	}
	aside.nav_sidebar.shrinked .main_menu > ul >li{
		text-align: center;
	}
	aside.nav_sidebar.shrinked  .main_menu	>ul >li span{
		padding: 0;
	}
	aside.nav_sidebar.shrinked .main_menu > ul >li:before{
		display: none;
	}
	.header_top p{
		color: #2a2a2a;
		font-size: 18px;
		font-weight: 400;
		text-align: center;
		background: #fff;
		margin: 0;
		padding-bottom: 9px;
	}
	aside.shrinked .header_top p{
		display: none;
	}
	aside.shrinked .head_img_wrap{
		padding: 8px 5px;
	}
	 .head_img_wrap{
		padding: 20px 20px 14px;
		background: #fff;
	}
	.head_img_wrap img{
		width: 100%;
		border-radius: 50%;
	}
	.menu_toggler{
		display: none;
	}
	/* main menu */
	/*.main_menu{*/
		/*text-align: center;*/
	/*}*/
	.main_menu	ul li + li{
		border-top: 1px solid #493fc8;
	}
	.main_menu	>ul >li span {
		font-size: 28px;
		padding-right: 35px;
		display: inline-block;
		padding-left: 7px;
	}
	.nav_sidebar.shrinked .main_menu > ul > li p {
		/* display: none; */
		position: absolute;
		transform: rotate(-90deg);
		width: 100%;
		left: -37px;
		z-index: -1;
		opacity: 0.3;
	}
	aside.nav_sidebar.shrinked .main_menu > ul >li.active p{
		opacity: 1;
	}
	.main_menu	>ul >li p{
		display: inline-block;
		margin: 0;
		font-size: 12px;
		font-weight: 400;
		vertical-align: 6px;
	}
	.main_menu	>ul >li >a {
	    color: #fff;
	    font-size: 12px;
	    font-weight: 400;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
		padding-top: 30px;
		padding-bottom: 29px;
	}
	.main_menu	ul li a {
		display: block;
	}
	.main_menu	>ul >li a,
	.main_menu	>ul >li span,
	.main_menu	>ul >li p{
		color: #b5b0f7;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}
	.main_menu	ul li.active a span,
	.main_menu	ul li.active a p{
		color: #fff;
	}
	.main_menu > ul >li{
		position: relative;
	}
	.main_menu > ul >li:before {
		position: absolute;
		content: '';
		border-left: 60px solid #493fc8;
		border-top: 45px solid transparent;
		border-bottom: 45px solid transparent;
		z-index: -1;
	}
	.social {
		text-align: center;
		padding: 5px;
		width: 100%;
		background: #493fc8;
		border-radius: 22px;
		margin-bottom: 20px;
		margin-top: 20px;
	}
	.social ul li+li{
		border:0;
	}
	.social ul li{
		display: inline-block;
		border-top: 0;
	}
	.social ul li > a{
		padding: 0 5px;
	}
	.social ul li > a>span{
		font-size: 14px;
		line-height: 24px;
		color: #b5b0f7;
	}




/* V-CARD STYLE SINGLE SECTION CSS */
	.single_page{
		position: absolute;
		height: 100%;
		width: 100%;
		left: 0;
		right: 0;
		top: 0;
		overflow: auto;
		z-index: -1;
		visibility: hidden;
	}
	.single_page.active{
		visibility: visible;
		z-index: 1;
	}

	section.single_page:not(#home){
		background: #fff;
	}
/*--------------------
MAIN CONTENT AREA CSS
----------------------*/
	.main_content{
		position: fixed;
		left: 160px;
		width: auto;
		height: 100%;
		right: 0;
		top:0;
	}
/*------ MAIN CONTENT AREA END ------*/


/*--------------------
HOME AREA CSS
----------------------*/
	.home {
	    height: 100%;
	    width: auto;
		background-image: url(images/home_bg.jpg);
		background-size: cover;
		position: relative;
	}
	.home .hero_content {
	    text-align: center;
	    position: absolute;
	    width: 100%;
	    top: 50%;
	    transform: translateY(-50%);
	    z-index: 1;
	}
	.home .hero_content h1{
		color: #35373e;
		font-size: 202px;
		font-weight: 900;
		opacity: 0.10;
	}
	.home .hero_content p{
		margin: 0;
		color: #35373e;
		font-size: 50px;
		font-weight: 700;
	}

	/* video version css */
	.video_version .main_content {
	    z-index: 2;
	}
	.video_version .main_content .home,
	.slider_version .main_content .home{
		background-image: none;
		position: relative;
	}
	.video_version .main_content .home:before{
		position: absolute;
		content: "";
		height: 100%;
		width: 100%;
		background: rgba(73, 92, 95, 0.75);
	}
	.video_version .home .hero_content h1{
		color: #fff;
		opacity: 1;
		font-size: 180px;
	}
	.video_version .home .hero_content p{
		color: #eee;
		font-size: 45px;
	}

	/* video version */
	.camera_overlayer {
	    background: rgba(61, 66, 55, 0.70);
	}
	.slider_version .home .hero_content h1 {
	    color: #ffffff;
	    font-size: 180px;
	    opacity: 1;
	}
	.slider_version .home .hero_content p {
	    color: #ece9e9;
	    font-size: 45px;
	}
	.camera_next > span{
		position: relative;
	}
	.camera_prev > span:before{
		content: "\f104"
	}
	.camera_next > span:before{
		content: "\f105";
	}
	.camera_prev{}
	.camera_prev > span:before,
	.camera_next > span:before{
		position: absolute;
		font-family: fontawesome;
		line-height: 40px;
		width: 100%;
		top: 50%;
		font-size: 22px;
		color: #333;
		text-align: center;
		transform: translateY(-50%);
	}
/*------ HOME AREA END ------*/

/*--------------------
START ABOUT AREA CSS
----------------------*/
	.about_img img{
		width: 100%;
	}
	.about_info {
	    overflow: hidden;
	    border-bottom: 1px solid #e1e1e1;
	    padding-bottom: 40px;
	}
	.about_info ul{
		width: 50%;
		float: left;
	}
	.about_info ul li p{
		display: inline-block;
		color: #35373e;
		font-size: 14px;
		line-height: 36px;
		font-weight: 400;
		margin-right: 4px;
	}
	.about_info ul li span{

	}
	.about_info ul li p:after{
		content: ":";
	}
	.about_btn .btn {
	    width: 190px;
	    padding: 0;
	    margin-right: 24px;
	}
	.about_content{
		padding-top: 40px;
	}
	.about_content p{
		margin: 0;
	}
	.about_btn{
		padding-top: 32px;
	}


/*------ SKILL AREA CSS ------*/
	.skill_area{
		background: #f7f7f7;
	}
/*------ SKILL AREA END ------*/


/*----- TESTIMONIAL WRAPPER -----*/
	.testimonial_wrapper{
		text-align: center;
	}
	.testimonial_img {
	    padding-top: 34px;
	}
	.testimonial_img img{
		width: 80px;
		height: 80px;
		border-radius: 50%;
	}
	.client_info{
		padding-top: 12px;
	}
	.client_info p{
		margin: 0;
		font-size: 14px;
		font-weight: 400;
		color: #3e3e3e;
	}
	.client_info span{
		color: #3e3e3e;
	}
	.owl-carousel .owl-item img{
		display: inline-block;
		width: initial;
	}
	.slider_nav{
		text-align: center;
	}
	.slider_nav {
	    text-align: center;
	    margin-top: 47px;
	}
	.slider_nav span{
		display: inline-block;
		line-height: 34px;
		cursor: pointer;
		margin-right: 20px;
		width: 36px;
		color: #3e3e3e;
		border: 1px solid #e0e0e0;
	}
	.slider_nav span:last-child{
		margin: 0;
	}
/*------ TESTIMONIAL AREA END ------*/
/*--------------------
ABOUT AREA ENDS
----------------------*/


/*--------------------
RESUME AREA
----------------------*/
	.resume_are_title{
		background: #f3f3f3;
		padding: 10px 20px;
	}
	.resume_are_title span{
		font-size: 28px;
		line-height: 50px;
		margin-right: 17px;
		width: 50px;
		text-align: center;
		background: #ffffff;
		color: #372db4;
		border-radius: 50%;
	}
	.resume_are_title span,
	.resume_are_title p{
		display: inline-block;
		vertical-align: middle;
		margin-bottom: 0;
	}
	.resume_are_title p{
		color: #000;
		font-weight: 400;
		font-size: 18px;
	}
	.timeline{
		padding-top: 47px;
		position: relative;
	}
	.timeline:before {
	    content: "";
	    position: absolute;
	    height: calc(100% - 52px);
	    width: 1px;
	    background: #d1d1d1;
	    bottom: 0;
	    left: 8px;
	}
	.timeline li+li{
		margin-top: 57px;
	}

	.timeline li {
	    padding-left: 46px;
	    position: relative;
	}
	.timeline li:before {
	    content: "";
	    left: 0;
	    top: 4.5PX;
	    border-radius: 50%;
	    position: absolute;
	    height: 16px;
	    width: 16px;
	    background: #fff;
	    border: 2px solid #362cb2;
	}
	.time_period{
		padding-bottom: 6px;
	}
	.timeline_title{
		padding-bottom: 19px;
	}
	.timeline_title h4{
		font-size: 16px;
	}
	.clsider {
	    padding: 0 34px;
	}
	.clsider img{
		max-width: 100%;
	}
	.clients_area.section_padding {
		background: #f7f7f7;
	}

/*------ RESUME AREA END ------*/


/*--------------------
SERVICE AREA
----------------------*/
	.service_area.section_padding {
		padding-bottom: 57px;
	}
	.single_service .service_icon,
	.single_service .service_content{
		display: inline-block;
	}
	.single_service .service_icon{
		vertical-align: top;
	}
	.single_service .service_icon span{
		color: #35373e;
		font-size: 30px;
		line-height: 52px;
		width: 54px;
		border: 1px solid #35373e;
		text-align: center;
	}
	.single_service .service_content {
	    width: calc(100% - 58px);
	    padding-left: 21px;
	    padding-top: 18px;
	}
	.service_title{
		font-size: 16px;
		color: #000;
	}
	.service_content p{
		padding-top: 26px;
	}
	.single_service{
		padding-bottom: 60px;
	}
/*------ SERVICE AREA END ------*/



/*------ COUNTER UP AREA -------*/
	.counterup_area{
		background: #f7f7f7;
		padding: 96px 0;
	}
	.single_counter_wrapper:first-child{
		padding-left: 0;
	}
	.single_counter_wrapper:last-child{
		padding-right: 0;
	}
	.single_counter_wrapper {
	    display: inline-block;
	    text-align: center;
	    padding: 0 104px;
	}
	.count_icon span,
	.count_up{
		color: #35373e;
		font-size: 36px;
	}
	.count_up{
		padding-bottom: 10px;
		display: inline-block;
	}
	.count_icon span{
		line-height: 72px;
	}
	.count p{
		color: #5e5e5e;
	}
/*------ COUNTER UP AREA END ------*/

/*------- WORKING PROCESS AREA ----------*/
	.step{
		color: #d4d4d4;
		font-size: 36px;
		line-height: 72px;
	}
	.process_title{
		font-size: 16px;
		font-weight: 400;
		padding-bottom: 23px;
	}
	.single_working_process + .single_working_process{
		padding-top: 102px;
	}
	.working_process_circle {
	    position: relative;
	    width: 100%;
	    border: 1px solid #ebebeb;
	    border-radius: 50%;
	    text-align: center;
	    margin-top: 52px;
	    padding: 120px 0;
	}
	.dots{
		height: 12px;
		width: 12px;
		background: #362cb1;
		display: inline-block;
		position: absolute;
		border-radius: 50px;
	}
	.dots.top_left,
	.dots.bottom_left{
		left: 15px;
	}
	.dots.top_left,
	.dots.top_right{
		top: 42px;
	}

	.dots.bottom_left,
	.dots.bottom_right{
		bottom: 42px;
	}
	.dots.top_right,
	.dots.bottom_right{
		right: 15px;
	}
	.dots:before{
		position: absolute;
		content: "";
		height: calc(100% + 8px);
		width: calc(100% + 8px);
		top: -4px;
		left: -4px;
		border-radius: 50%;
		border: 1px solid #b8b3ed;
	}

	.working_process_circle:before{
		position: absolute;
		content: "";
		height: calc(100% + 56px);
		width: calc(100% + 56px);
		left: -28px;
		border-radius: 50%;
		top: -28px;
		z-index: -1;
		border: 1px solid #ebebeb;
	}
	.working_process_circle h1 {
	    font-size: 55px;
	    color: #eeeeee;
	    font-weight: 700;
	    line-height: 62px;
	}
/*------ WORKING PROCESS AREA END ------*/
/*-----------------------
SERVICES AREA ENDS HERE
-------------------------*/

/*--------------------
PORTFOLIO AREA
----------------------*/
	.filter_area ul li{
		display: inline-block;
		color: #7d7d7d;
		font-size: 12px;
		padding: 0 16px;
		line-height: 39px;
		cursor: pointer;
		border: 1px solid transparent;
	}
	.filter_area ul li.active {
		color: #000;
		border-color: #000;
		font-weight: 400;
	}
	.single_portfolio_item{
		margin-bottom: 30px;
	}
	.single_portfolio_item figure{
		position: relative;
	}
	.single_portfolio_item figure:before{
		height: 100%;
		width: 100%;
		content: '';
		position: absolute;
		opacity: 0;
		visibility: hidden;
		transition: 0.3s;
		background: rgba(255,255,255,0.90);
	}
	.filter_area{
		margin-bottom: 64px;
	}
	.single_portfolio_item:hover figcaption{
		opacity: 1;
		visibility: visible;
	}
	.single_portfolio_item:hover figure:before{
		opacity: 1;
		visibility: visible;
	}
	.single_portfolio_item figcaption{
		position: absolute;
		left: 50%;
		top: 50%;
		width: 100%;
		-webkit-transform: translate(-50%, -50%);
		text-align: center;
		-moz-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		-o-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
	}
	.single_portfolio_item figcaption p {
		text-transform: uppercase;
		margin: 0;
		visibility: hidden;
		opacity: 0;
		font-weight: 400;
		color: #000;
		transform: translateY(-20px);
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
	}
	.portfolio_img img {
		width: 100%;
	}
	.single_portfolio_item .classless span {
		line-height: 30px;
		width: 30px;
		position: relative;
		transition: 0.3s;
		text-align: center;
		color: #7d7d7d;
	}
	.single_portfolio_item .classless .icon + .icon{
		margin-left: 15px;
	}
	.single_portfolio_item .classless .icon{
		position: relative;
		display: inline-block;
	}
	.single_portfolio_item .classless .icon:hover span{
		color: #362cb1;
	}
	.single_portfolio_item .classless .icon:hover:before{
		border-color: #362cb1;
	}

	.single_portfolio_item .classless .icon:before {
		position: absolute;
		height: 100%;
		width: 100%;
		border-radius: 3px;
		border: 1px solid #333;
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		transform: rotate(45deg);
		content: '';
	}
	.single_portfolio_item:hover figcaption p{
		-webkit-transition-delay: 0.3s;
		-moz-transition-delay: 0.3s;
		-ms-transition-delay: 0.3s;
		-o-transition-delay: 0.3s;
		transition-delay: 0.3s;
	}
	.single_portfolio_item:hover .classless,
	.single_portfolio_item:hover figcaption p{
		-webkit-transform: translate(0);
		-moz-transform: translate(0);
		-ms-transform: translate(0);
		opacity: 1;
		visibility: visible;
		-o-transform: translate(0);
		transform: translate(0);
	}
	.classless{
		margin-top: 15px;
		-webkit-transition: 0.3s;
		-moz-transition: 0.3s;
		-ms-transition: 0.3s;
		-o-transition: 0.3s;
		transition: 0.3s;
		opacity: 0;
		visibility: visible;
		-webkit-transform: translateY(-20px);
		-moz-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		-o-transform: translateY(-20px);
		transform: translateY(-20px);
	}
	.classless .icon{
		cursor: pointer;
	}
/*--------------------
PORTFOLIO AREA END
----------------------*/


/*--------------------
BLOG AREA
----------------------*/
	.blog{
		background: #f6f6f6;
	}
	.single_blog {
	    background: #fff;
	    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
	    border-radius: 4px;
		margin-bottom: 30px;
	}
	.blog_content{
		padding: 27px 30px;
	}
	.blog_content a:hover h4{
		color: #362cb1;
	}
	.single_blog figure img{
		width: 100%;
	}
	h4.blog_title {
	    font-size: 15px;
	    transition: 0.3s;
		padding-bottom: 6px;
	}
	.blog_content a:hover h4{
		color: #362cb1;
	}
	.blog_content .date{
		padding-bottom: 5px;
	}
	.blog_content .date p{
		color: #7b7b7b;
		font-size: 12px;
	}
	.blog_content>p{
		color: #5a5a5a;
		margin-bottom: 25px;
	}
	.meta_data{
		padding-top: 20px;
		border-top: 1px solid #eaeaea;
	}
	.meta_data  li img,
	.meta_data  li span,
	.meta_data  li p{
		display: inline-block;
		margin: 0;
		vertical-align: middle;
	}
	.meta_data li img {
		margin-right: 8px;
		height: 30px;
		width: 23px;
	}
	.meta_data  li p{
		color: #2f2f2f;
		font-size: 13px;
	}
	.meta_data .auth{
		float: left;
	}
	.meta_data{
		overflow: hidden;
	}
	.meta_data .tag{
		float: right;
	}
/*--------------------
BLOG ARA END
----------------------*/

/*--------------------
CONTACT AREA
----------------------*/
.contact_txt {
	text-align: center;
	padding-bottom: 54px;
}
.contact_txt p{
	color: #4c4c4c;
}
.contact_form_wrapper textarea{
	height: 190px;
	margin-bottom: 30px;
}
.contact_form_wrapper input{
	margin-bottom: 30px;
}
.contact_form_wrapper button.btn{
	line-height: 50px;
	padding: 0 40px;
	background: transparent;
	font-weight: 400;
	font-size: 12px;
	color: #35373e;
}
.contact_form_wrapper button.btn:hover{
	color: #362cb1;
}
.contact_info .info_title {
	color: #000;
	font-weight: 400;
	padding-bottom: 14px;
	line-height: 26px;
}
.contact_info p{
	margin: 0;
}
.contact_info li+li{
	padding-top: 30px;
}
.contact_info li{
	border-bottom: 1px solid #eaeaea;
	padding-bottom: 30px;
}


/* Google map area */
#google_map{
	height: 518px;
	margin-top: 130px;
	width: 100%;
}
/*--------------------
CONTACT AREA END
----------------------*/


/*--------------------
SINGLE BLOG PAGE
----------------------*/
    /* SINGLE POST CONTENT */
	.post_wrapper {
		background: #fff;
		padding: 30px 30px 26px 30px;
	}
	section.single_post.single_page{
		background: #f6f6f6!important;
	}
	.blog_title{
		padding-bottom: 21px;
	}
	.blog_title span.post_date {
	    color: #7b7b7b;
	    font-size: 14px;
	}
	.blog_title h3 {
	    color: #000;
	    font-size: 30px;
	    padding-top: 11px;
	    font-weight: 400;
		padding-bottom: 15px;
	}
	.blog_title ul li{
		display: inline-block;
		margin-right: 31px;
	}
	.blog_title ul li span,
	.blog_title ul li p{
		display: inline-block;
		font-size: 12px;
	}
	.blog_title ul li .auth_img{
		display: inline-block;
		height: 30px;
		width: 30px;
		margin-right: 10px;
		background: #e6e6e6;
		text-align: center;
		border-radius: 50%;
	}
	.blog_title ul li span{
		color: #2f2f2f;
		font-size: 13px;
		line-height: 26px;
	}
	.comment_share {
	    overflow: hidden;
	    margin-top: 37px;
	    padding-top: 25px;
	    border-top: 1px solid #eaeaea;
	}
	.comment_share .com{
		float: left;
	}
	.comment_share .share{
		float: right;
	}
	.comment_share .share ul li{
		display: inline-block;
	}
	.comment_share .share ul li a{
		color: #c2c2c2;
		font-size: 14px;
		padding: 0 4px;
	}
	.comment_share .share ul li:last-child a{
		padding-left: 0;
	}
	.comment_share .share ul li:first-child a{
		padding-right: 0;
	}
	.blog_contents p {
	    margin-bottom: 27px;
	}
	blockquote{
		font-size: 18px;
		color: #7e7d7d;
	}
	.author_info{
		background: #fff;
		margin: 50px 0;
		padding: 23px 29px;
	}
	.admin_info p{
		margin: 0;
	}
	.author_info .admin_img {
	    display: inline-block;
	    vertical-align: middle;
	    height: 90px;
	    width: 90px;
	    text-align: center;
	    background: #f3f3f3;
		vertical-align: middle;
	    border-radius: 50%;
	}
	.author_info .admin_info {
	    display: inline-block;
	    width: calc(100% - 95px);
	    vertical-align: middle;
	    padding-left: 20px;
	}
	.admin_info h4{
		padding-bottom: 16px;
	}
	.admin_info ul li{
		display: inline-block;
	}
	.admin_info ul li a{
		font-size: 14px;
		color: #c2c2c2;
		padding: 0 8px;
	}
	.admin_info ul li:first-child a{
		padding-left: 0;
	}
	.admin_info ul li:last-child a {
	    padding-right: 0;
	}
	.admin_info ul{
		padding-top: 13px;
	}
	.comment_area {
	    padding-top: 40px;
	    background: #fff;
	    padding-left: 30px;
	    padding-right: 30px;
	}

	/* COMMENTS */
	.comments{
		margin-top: 50px;
	}
	.comment_title > h4 {
	  color: #0f1923;
	  font-size: 24px;
	}
	.comment_title > h4 .n_of_comment{
		color: #1cb9c8;
	}
	.comments .media {
	  border: 1px solid #f5f5f5;
	  padding: 35px 20px 25px;
		margin-bottom: 40px;
	}

	/* comment image css */
	.comments .media img.media-object {
	  border-radius: 50%;
	}
	.comments .media-left, .media > .pull-left {
	  padding-right: 28px;
	}

	/* comments content css */
	.comment_area .area_title{
		margin-bottom: 3px!important;
	}
	.media_top{
		overflow: hidden;
	}
	.media_top > span {
	  color: #8e8e8e;
	  font-size: 12px;
	  font-style: italic;
	  font-weight: 300;
	  line-height: 28px;
	}
	.comments .media-heading {
	  color: #0f1923;
	  font-weight: 500;
		margin: 0;
	}
	.reply {
	  color: #bababa;
	  font-size: 14px;
	  line-height: 28px;
	}
	.reply:hover{
		color: #2196f3;
	}
	.reply.visible-xs-m{
		display: none;
	}
	.comment_wrapper .heading_left > span{
		color: #676767;
		line-height: 14px;
		font-size: 14px;
	}
	.comment_wrapper .heading_left .media-heading {
	    font-family: 'Montserrat',sans-serif;
	    font-weight: 400;
	    line-height: 30px;
	    font-size: 14px;
	    color: #000;
	    text-transform: uppercase;
	}
	.comment_wrapper .heading_left a{
		display: block;
	}
	.comment_wrapper .media-body > p {
	  margin-top: 18px;
	}
	.reply_comments {
	  margin-left: 118px;
	}
	.media-list li .media {
	    padding-bottom: 40px;
	    border-bottom: 1px solid #eeeeee;
	    padding-top: 40px;
	}
	.comment_btn{
		padding: 0 38px;
		margin-top: 30px;
	}
	.comment_area_title,
	.comment_area .area_title {
	    padding-bottom: 13px;
		position: relative;
		margin-bottom: 43px;
	}
	.comment_area .area_title h4{
		font-size: 14px;
	}

	.comment_area_title:before,
	.comment_area .area_title:before {
		position: absolute;
		content: "";
		height: 2px;
		width: 50px;
		background: #bdbdbd;
		bottom: -1px;
	}
	.comment_area_title h5 {
	    font-size: 18px;
	    line-height: 25px;
	    color: #3a3a3a;
	    font-size: 14px;
	    text-transform: uppercase;
	    font-weight: 400;
	}
	.reply_form textarea{
		min-height: 133px;
	}

	/* comment form */
	.comment_area_wrapper {
	    background: #fff;
	    margin-top: 50px;
	    padding: 40px 30px;
	}
	.comment_area_wrapper input,
	.comment_area_wrapper textarea{
		outline: none;
		border: 1px solid #e7e7e7;
	}
	.reply_form input{
		width: 100%;
		line-height: 51px;
		padding: 0 20px;
		margin-bottom: 30px;
	}
	.reply_form textarea {
		width: 100%;
		height: 133px;
		padding-left: 20px;
		padding-top: 15px;
	}
	.comment_btn{
		background-color: transparent;
		font-weight: 400;
	}
	.blog_img img{
		width: 100%;
	}

	/*sideber*/
	.sidebar{
		background: #fff;
	}
	.widget{
		background: #fff;
		padding: 40px 30px;
	}
	.widget_title{
		color: #000;
		font-size: 14px;
		position: relative;
		padding-bottom: 15px;
		margin-bottom: 30px;
	}
	.widget_title:before{
		position: absolute;
		content: "";
		width: 50px;
		height: 2px;
		bottom: -1px;
		background: #bdbdbd;
	}
	.widget + .widget{
		border-top: 1px solid #eaeaea;
	}
	.widget.search .widget_title {
		margin-top: 11px;
	}

	/* blog search */
	.blog_search {
		position: relative;
	}
	.blog_search .blog_search_btn:focus{
		outline: none;
	}
	.blog_search .blog_search_btn span.fa{
		font-size: 16px;
		color: #8b8b8b;
	}
	.blog_search .blog_search_btn span.fa:hover{
		color: #362cb1;
	}

	.blog_search .blog_search_btn{
		position: absolute;
		right: 12px;
		top: 50%;
		background: none;
		border: 0;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
	}
	.blog_search input{
		line-height: 50px;
		width: 100%;
		padding:0 20px;
		border-color: #eaeaea;
	}

	/* Recent posts */
	.recent_posts_list li{
		padding: 20px 0;
	}
	.recent_posts_list li + li{
		border-top: 1px solid #eaeaea;
	}
	.recent_posts_list li .post_thumb,
	.recent_posts_list li .post_info{
		display: inline-block;
		vertical-align: middle;
	}
	.recent_posts_list li .post_thumb{
		width: 68px;
		height: 68px;
	}
	.recent_posts_list li .post_thumb img{
		width: 100%;
		height: 100%;
	}
	.recent_posts_list li .post_info .title{
		font-size: 13px;
		line-height: 22px;
		color: #35373e;
		transition: 0.3s;
		font-weight: 400;
	}
	.recent_posts_list li .post_info .title:hover{
		color: #362cb1;
	}
	.recent_posts_list li .post_info .meta span{
		color: #000000;

	}
	.recent_posts_list li .post_info .meta{
		font-size: 12px;
		color: #767676;
	}
	.recent_posts_list li .post_info p{
		margin: 0;
	}
	.recent_posts_list li .post_info {
		width: calc(100% - 74px);
		padding-left: 10px;
	}
	.recent_posts_list li:last-child{
		padding-bottom: 0;
	}
	.category_lists li a{
		font-size: 14px;
		color: #000;
		color: #545454;
		line-height: 34px;
	}
	.category_lists li span{
		font-size: 6px;
		color: #bfbfbf;
	}
	.category_lists li span,
	.category_lists li a{
		display: inline-block;
		vertical-align: middle;
	}
	.category_lists li a {
		margin-left: 12px;
		text-transform: capitalize;
	}

	/* tags */
	.widget.tags li{
		display: inline-block;
	}
	.widget.tags li a{
		line-height: 28px;
		padding: 0 17px;
		border: 1px solid #a5a5a5;
		display: inline-block;
		margin-bottom: 12px;
		margin-right: 6px;
		font-size: 10px;
		text-transform: uppercase;
		color: #5a5a5a;
	}
/*-------------------------
SINGLE BLOG PAGE END
---------------------------*/


/*--------------------
SINGLE PORTFOLIO PAGE
----------------------*/
	.single_page .single_page{

	}
	.project_infos {
		background: #f9f9f9;
		padding: 40px;
	}
	.single_work_page{
		background: #F6F6F6;
	}
	h4.project_title {
		margin-bottom: 40px;
		font-size: 22px;
	}
	.project_infos ul li{
		margin-bottom: 10px;
	}
	.project_infos ul li span,
	.project_infos ul li p{
		display: inline-block;
		margin: 0;
	}
	.project_infos ul.info_list li span {
		font-weight: 400;
		color: #35373e;
		min-width: 60px;
		position: relative;
	}
	.project_infos ul.info_list li span:after{
		content: ':';
		float: right;
	}
	.project_infos ul li p{
		margin-left: 15px;
	}
	.project_btn{
		line-height: 45px;
		background-color: transparent;
		color: #35373e;
		font-weight: 400;
		padding:0 20px;
		margin-top: 25px;
		font-size: 12px;
		transition: 0.3s;
		border: 2px solid #000000;
	}
	.project_btn:hover{
		color: #362cb1;
		border-color: #361cb1;
	}
	.project_social{
		margin-top: 23px;
	}
	.project_social ul li{
		display: inline-block;
	}
	.project_social p,
	.project_social ul,
	.project_social ul li{
		display: inline-block;
	}
	.project_social p{
		color: #000;
		font-weight: 400;
	}
	.project_social ul li a{
		color: #c2c2c2;
		font-size: 14px;
		padding: 0 7px;
		transition: 0.3s;
	}
	.project_social ul li a:hover{
		color: #362cb1;
	}
	.project_img_slide_wrapper {
		position: relative;
		margin-bottom: 45px;
	}
	.project_img_slide_wrapper .project_nav_left{
		left: 20px;
	}
	.project_img_slide_wrapper .project_nav_right{
		right: 20px;
	}
	.project_img_slide_wrapper .project_nav_left,
	.project_img_slide_wrapper .project_nav_right{
		position: absolute;
		z-index: 2;
		transition: 0.3s;
		line-height: 33px;
		text-align: center;
		width: 35px;
		border: 1px solid #ddd;
		cursor: pointer;
		color: #000;
		font-size: 18px;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-moz-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		-o-transform: translateY(-50%);
		transform: translateY(-50%);
		border-radius: 3px;
	}
	.project_img_slide_wrapper .project_nav_left:hover,
	.project_img_slide_wrapper .project_nav_right:hover{
		background: #fff;
	}
	.project_overview p{
		color: #6d6666;
	}

/*-------------------------
SINGLE PORTFOLIO PAGE ENDS
----------------------------*/
/* Footer js */
	.contact.single_page{
		padding-bottom: 0;
	}
	footer.footer{
		text-align: center;
		background: #fff;
		border-top: 1px solid #ededed;
	}
	footer p{
		margin: 0;
		font-size: 14px;
		color: #9f9f9f;
		padding: 30px 0;
	}



/* KEYFRAMES */
/* fadein up short */
	@-webkit-keyframes fadeInDownShort{
	    from{
	        -webkit-transform: translateY(-40px);
	        transform: translateY(-40px);
	        opacity: 0;
	        visibility: hidden;
	    }
	    to{
	        -webkit-transform: translateY(0px);
	        transform: translateY(0px);
	        opacity: 1;
	        visibility: visible;
	    }
	}
	@keyframes fadeInDownShort{
	    from{
	        -webkit-transform: translateY(-40px);
	        transform: translateY(-40px);
	        opacity: 0;
	        visibility: hidden;
	    }
	    to{
	        -webkit-transform: translateY(0px);
	        transform: translateY(0px);
	        opacity: 1;
	        visibility: visible;
	    }
	}
	.fadeInDownShort{
		animation-name: fadeInDownShort;
	}



/* fadein up short */
	@-webkit-keyframes fadeInUpShort{
	    from{
	        -webkit-transform: translateY(40px);
	        transform: translateY(40px);
	        opacity: 0;
	        visibility: hidden;
	    }
	    to{
	        -webkit-transform: translateY(0px);
	        transform: translateY(0px);
	        opacity: 1;
	        visibility: visible;
	    }
	}
	@keyframes fadeInUpShort{
	    from{
	        -webkit-transform: translateY(40px);
	        transform: translateY(40px);
	        opacity: 0;
	        visibility: hidden;
	    }
	    to{
	        -webkit-transform: translateY(0px);
	        transform: translateY(0px);
	        opacity: 1;
	        visibility: visible;
	    }
	}
	.fadeInUpShort{
		animation-name: fadeInUpShort;
	}

    /* KEYFRAMES */
    @-webkit-keyframes fadeInLeftShort{
        from{
            -webkit-transform: translateX(40px);
            transform: translateX(40px);
            opacity: 0;
            visibility: hidden;
        }
        to{
            -webkit-transform: translateX(0px);
            transform: translateX(0px);
            opacity: 1;
            visibility: visible;
        }
    }

    @keyframes fadeInLeftShort{
        from{
            -webkit-transform: translateX(40px);
            transform: translateX(40px);
            opacity: 0;
            visibility: hidden;
        }
        to{
            -webkit-transform: translateX(0px);
            transform: translateX(0px);
            opacity: 1;
            visibility: visible;
        }
    }
    .fadeInLeftShort{
        -webkit-animation-name: fadeInLeftShort;
        animation-name: fadeInLeftShort;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
    }

    /* fadeInRightShort */
    @-webkit-keyframes fadeInRightShort{
        from{
            -webkit-transform: translateX(-40px);
            transform: translateX(-40px);
            opacity: 0;
            visibility: hidden;
        }
        to{
            -webkit-transform: translateX(0px);
            transform: translateX(0px);
            opacity: 1;
            visibility: visible;
        }
    }

    @keyframes fadeInRightShort{
        from{
            -webkit-transform: translateX(-40px);
            transform: translateX(-40px);
            opacity: 0;
            visibility: hidden;
        }
        to{
            -webkit-transform: translateX(0px);
            transform: translateX(0px);
            opacity: 1;
            visibility: visible;
        }
    }
    .fadeInRightShort{
        -webkit-animation-name: fadeInRightShort;
        animation-name: fadeInRightShort;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
    }

    /* fadeFromRight */
    @-webkit-keyframes fadeFromRight{
        from{
            left: 40px;
            opacity: 0;
            visibility: hidden;
        }
        to{
            left: 0px;
            opacity: 1;
            visibility: visible;
        }
    }

    @keyframes fadeFromRight{
        from{
            left: 40px;
            opacity: 0;
            visibility: hidden;
        }
        to{
            left: 0px;
            opacity: 1;
            visibility: visible;
        }
    }
    .fadeFromRight{
        -webkit-animation-name: fadeFromRight;
        animation-name: fadeFromRight;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
    }

    /* fadeFromLeft */
    @-webkit-keyframes fadeFromLeft{
        from{
            right: 40px;
            opacity: 0;
            visibility: hidden;
        }
        to{
            right: 0px;
            opacity: 1;
            visibility: visible;
        }
    }

    @keyframes fadeFromLeft{
        from{
            right: 40px;
            opacity: 0;
            visibility: hidden;
        }
        to{
            right: 0px;
            opacity: 1;
            visibility: visible;
        }
    }
    .fadeFromLeft{
        -webkit-animation-name: fadeFromLeft;
        animation-name: fadeFromLeft;
        -webkit-animation-duration: 1s;
        animation-duration: 1s;
    }

	/*testkey*/
	@keyframes translateFromLeft {
		from{
			-webkit-transform: translateX(85%);
			-moz-transform: translateX(85%);
			-ms-transform: translateX(85%);
			-o-transform: translateX(85%);
			transform: translateX(85%);
		}
	}
	@-webkit-keyframes translateFromLeft {
		from{
			-webkit-transform: translateX(85%);
			-moz-transform: translateX(85%);
			-ms-transform: translateX(85%);
			-o-transform: translateX(85%);
			transform: translateX(85%);
		}
	}
	.translateFromLeft{
		animation-name: translateFromLeft;
		animation-duration: 1s;
	}

    /*testkey*/
    @keyframes translateFromRight {
        from{
            -webkit-transform: translateX(-80%);
            -moz-transform: translateX(-80%);
            -ms-transform: translateX(-80%);
            -o-transform: translateX(-80%);
            transform: translateX(-80%);
        }
    }
    @-webkit-keyframes translateFromRight {
        from{
            -webkit-transform: translateX(-80%);
            -moz-transform: translateX(-80%);
            -ms-transform: translateX(-80%);
            -o-transform: translateX(-80%);
            transform: translateX(-80%);
        }
    }
    .translateFromRight{
        animation-name: translateFromRight;
        animation-duration: 1s;
    }

    /*Potato */
    @keyframes translateToRight {
        from{
            -webkit-transform: translateX(0);
            -moz-transform: translateX(0);
            -ms-transform: translateX(0);
            -o-transform: translateX(0);
            transform: translateX(0);
        }
        to{
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
        }
    }
    @-webkit-keyframes translateToRight {
        from{
            -webkit-transform: translateX(0);
            -moz-transform: translateX(0);
            -ms-transform: translateX(0);
            -o-transform: translateX(0);
            transform: translateX(0);
        }
        to{
            -webkit-transform: translateX(100%);
            -moz-transform: translateX(100%);
            -ms-transform: translateX(100%);
            -o-transform: translateX(100%);
            transform: translateX(100%);
        }
    }
    .translateToRight{
        animation-name: translateToRight;
        animation-duration: 1s;
        visibility: visible;
        opacity: 1;
    }

    /*testkey*/
    @keyframes translateToLeft {
        from{
            -webkit-transform: translateX(0);
            -moz-transform: translateX(0);
            -ms-transform: translateX(0);
            -o-transform: translateX(0);
            transform: translateX(0);
        }
        to{
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            transform: translateX(-100%);
        }
    }
    @-webkit-keyframes translateToLeft {
        from{
            -webkit-transform: translateX(0);
            -moz-transform: translateX(0);
            -ms-transform: translateX(0);
            -o-transform: translateX(0);
            transform: translateX(0);
        }
        to{
            -webkit-transform: translateX(-100%);
            -moz-transform: translateX(-100%);
            -ms-transform: translateX(-100%);
            -o-transform: translateX(-100%);
            transform: translateX(-100%);
        }
    }

    .translateToLeft{
        animation-name: translateToLeft;
        animation-duration: 1s;
        visibility: visible;
        opacity:1;
    }


    /* CUSTOM SCROLLBAR STYLE */
    .single_page::-webkit-scrollbar-track
    {
        /*-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.10);*/
        background-color: #F5F5F5;
        visibility: hidden;
    }
    .single_page:hover::-webkit-scrollbar{
        visibility: visible;
    }
    .single_page::-webkit-scrollbar
    {
        width: 8px;
        background-color: #F5F5F5;
        visibility: hidden;
    }
    .single_page::-webkit-scrollbar-thumb
    {
        background-color: #999;
        visibility: hidden;
        border-radius: 8px;
    }
    .single_page:hover::-webkit-scrollbar-thumb{
        visibility: visible;
    }

	.nav_sidebar::-webkit-scrollbar-track{
		background-color: transparent;
	}
	.nav_sidebar::-webkit-scrollbar{
		width: 6px;
		background-color: transparent;
	}
	.nav_sidebar::-webkit-scrollbar-thumb{
		background-color: rgba(211,221,221,0.3);
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
	}

	.typed-cursor{
		opacity: 1;
		-webkit-animation: blink 0.7s infinite;
		-moz-animation: blink 0.7s infinite;
		animation: blink 0.7s infinite;
	}
	@keyframes blink{
		0% { opacity:1; }
		50% { opacity:0; }
		100% { opacity:1; }
	}
	@-webkit-keyframes blink{
		0% { opacity:1; }
		50% { opacity:0; }
		100% { opacity:1; }
	}
	@-moz-keyframes blink{
		0% { opacity:1; }
		50% { opacity:0; }
		100% { opacity:1; }
	}

	/* copyright removal css */