/* Showcase Demo Styles
================================================== */

	/* Page Fonts */
	@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,700,800|Playfair+Display:400i,900i');
	/* Body Options */
	body{ font-family: 'Open Sans', sans-serif; font-weight: 400; letter-spacing: -0.5px; }

/* COLORS
================================================== */

	/* Colored */
	.colored, .colored-hover:hover{ color:#d29615 !important; }
	.bg-colored, .bg-colored-hover:hover{ background-color:#213669 !important; }
	.border-colored, .border-colored-hover:hover{ border-color:#213669 !important; }

	/* Colored1 */
	.colored1, .colored1-hover:hover{ color:#ffc955 !important; }
	.bg-colored1, .bg-colored1-hover:hover{ background-color:#313d63 !important; }
	.border-colored1, .border-colored1-hover:hover{ border-color:#ffc955 !important; }

	/* Colored2 */
	.colored2, .colored2-hover:hover{ color:#2e354a !important; }
	.bg-colored2, .bg-colored2-hover:hover{ background-color:#2e354a !important; }
	.border-colored2, .border-colored2-hover:hover{ border-color:#2e354a !important; }

	.bg-soft-colored:before{background-color:rgba(44,48,63,0.9);}

	::selection{ background-color:#2f3135; color:White; }

	/* Other Colors */
	.qdr-hover:before{background-color:#d29615;}
	.qdr-hover-5:before{background-color:#fff;}
	.qdr-hover:after{background-color:#222;}
	.qdr-hover-2-rotate:before{ background-color:#222; }

	.bg-gradient{
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#42403c+0,22211f+100&0.8+0,1+100 */
		background: -moz-linear-gradient(-45deg, rgba(66,64,60,1) 0%, rgba(34,33,31,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(-45deg, rgba(66,64,60,1) 0%,rgba(34,33,31,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(135deg, rgba(66,64,60,1) 0%,rgba(34,33,31,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc42403c', endColorstr='#22211f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
	.bg-gradient1{
		background: #327ffe;
		background: -moz-linear-gradient(90deg,  #9e792a 0%, #eaaa20 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(90deg,  #9e792a 0%,#eaaa20 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(90deg,  #9e792a 0%,#eaaa20 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	.bg-gradient2{
		background: #1c1c1c; /* Old browsers */
		background: -moz-linear-gradient(45deg,  #1c1c1c 0%, #2c2c2c 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(45deg,  #1c1c1c 0%,#2c2c2c 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to 45deg,  #1c1c1c 0%,#2c2c2c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	.bg-soft-gradient:before{
		opacity: 1;
		/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#42403c+0,22211f+100&0.8+0,1+100 */
		background: -moz-linear-gradient(-45deg, rgba(34,32,28,0.8) 0%, rgba(23,22,20,1) 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(-45deg, rgba(34,32,28,0.8) 0%,rgba(23,22,20,1) 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(135deg, rgba(34,32,28,0.8) 0%,rgba(23,22,20,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cc42403c', endColorstr='#22211f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
	}
	.bg-soft-gradient1:before{
		opacity: 0.90;
		background: #262320;
		background: -moz-linear-gradient(-45deg,  #42372d 0%, #262320 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(-45deg,  #42372d 0%,#262320 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to -45deg,  #42372d 0%,#262320 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}
	.bg-soft-gradient2:before{
		opacity: 0.9;
		background: #1b1b1c; /* Old browsers */
		background: -moz-linear-gradient(45deg,  #1b1b1c 0%, #2e2f32 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(45deg,  #1b1b1c 0%,#2e2f32 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to 45deg,  #1b1b1c 0%,#2e2f32 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}


    #navigation a:hover, #navigation li.active > a{
    	color: #fff !important;
    }


/* MODERN NAVIGATION */
	/* Navigation styles - You can see navigation hover and active colors in the content/showcase/css/style.css file. */
	#navigation.modern .columns ul li a,
	#navigation.modern .columns ul li button{ font-size:11px; font-weight: 600;}
	/* Mega menu and dropdown styles */
	#navigation.modern .columns ul.dropdown-menu.mega-menu li a{ font-family: 'Open Sans', sans-serif; color: #aaa; font-size: 12px; text-transform: capitalize; }
	#navigation.modern .columns ul.dropdown-menu li a{ font-family: 'Open Sans', sans-serif; color: #aaa; font-size: 13px; letter-spacing: 0; font-weight: 400; }
	/* Hovers */
	#navigation.modern .columns ul.dropdown-menu.mega-menu li a:hover{color:white;}
	#navigation.modern .columns ul.dropdown-menu li a:hover{ color:white; }


/* GLOBAL OPTIONS FOR SHOWCASE */

	/* Sections Fixed Option */
	.section{ position: relative; overflow: hidden; width: 100%; height: 100vh; }
	.section .section-texts{ position: relative; color:white; top:50%; padding:0 5%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); }
		/* Responsive Titles */
		@media only screen and (max-width: 641px){
			.section{ height: 80vh; }
		}
		@media only screen and (max-height: 420px){
			.section{ height: 100vh; }
		}
	/* Dark effect for sections - You can change the color and opacity */
	.darkvision{background-color:black; opacity: 0.4; width: 100%; height: 100%; position: absolute; left:0; top:0; z-index: 1;}
		@media only screen and (max-width: 991px){
			.section .showcase_container{ position: relative; height: 100vh; }
			.section .section-texts{ position: relative; }
			.darkvision{ display: none !important; }
		}

	/* Page Titles */
	.title{ font-size:42px; font-weight: 900; line-height: 47px; letter-spacing: -2.5px; margin:0; padding:0; text-shadow: 0px 1px 20px rgba(0,0,0,0.15) }
	.subtitle{ font-size:18px; padding:0; margin: 0 0 5px;}
	.title-strips-over.colored{ background-color: rgba(255,246,100,0.4); height: 2px; }
	.title-strips-over.colored:before{ background-color: rgba(255,246,100,1); }
		/* Responsive Titles */
		@media only screen and (max-width: 1200px){
			.title{font-size:38px; line-height: 42px; }
			.subtitle{ font-size:17px;}
		}
		@media only screen and (max-width: 900px){
			.title{font-size:28px; line-height: 33px; }
		}
		@media only screen and (max-width: 641px){
			.title{font-size:16px; line-height: 22px; letter-spacing: -0.9px; }
			.subtitle{ font-size:14px; margin-bottom:0; }
		}
		@media only screen and (max-width: 361px){
			.title{font-size:15px; line-height: 13px; }
			.subtitle{ margin-bottom:0; font-size: 14px; }
		}
	/* Title underline effect */
	.section .text-link>*{ position: relative; display: inline-block; vertical-align: middle; }
	.section .text-link>*:before{ width:0px; height: 1px; position: absolute; bottom:1px; left:0; content:''; background-color:#eee; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
	.section .text-link:hover>*:before{ width: 100%; }

/* Home */
	.home{ padding:165px 0 100px; height: auto !important; min-height: 80vh; position: relative; }
		@media only screen and (max-width: 641px){
			.home{ padding:85px 0 60px; min-height: none; }
		}
	.home:after{ position: absolute; content: ''; width: 100%; height: 100%; left:0; top:0; background-color:#fff; z-index: 1; }
	.home .bg-parallax{  z-index: -2; }
	.home .slick-slider{ height: auto !important; }
	.home .slick-list{ overflow: visible !important; }
	.home .slick-slider .slick-slide,
	.home .slick-slider .slick-clone{ margin:0 15px; overflow: visible; position: relative; opacity: .8; -webkit-transition: all 0.5s; -moz-transition: all 0.5s; transition: all 0.5s; }
	.home .slick-slider .slick-slide:hover{ opacity: 1; }
		/* Hide shadow effect for mobile */
		@media only screen and (max-width: 1025px){
			.home .slick-slider .slick-slide,
			.home .slick-slider .slick-clone{ margin:0 10px; opacity: 1 !important; }
		}
		@media only screen and (max-width: 481px){
			.home .slick-list{ padding: 0 10px !important; }
		}
	/* Slide Texts */
	.home .slick-slider .slide-texts{ position: absolute; top:0; padding: 20px 20px 35px; overflow: hidden; width: 100%; border-top-right-radius: 10px; border-top-left-radius: 10px; }
	.home .slick-slider .slide-texts *{ letter-spacing: -1px; position: relative; z-index: 1; }
	.home .hero-slider, .hero-slider .slide{ overflow: visible; }
	/* Shadow for texts */
	.home .slick-slider .slick-slide .slide-texts:after{ content:''; width: 100%; height: 100%; left:0; top:-68px; background-color:#000; position: absolute; filter: blur(37px); opacity: 0.8; z-index: 0; }
	/* Slide Buttons */
	.home .slick-slider .slide-buttons{ position: absolute; width: 100%; bottom:0; padding: 13px 20px; text-align: right; overflow: hidden; }
	.home .slick-slider .slide-buttons a{ display: inline-block; width: 50px; height: 50px; line-height: 53px; position: relative; text-align: center; font-size: 20px; background:white; border-radius: 100%; margin-left:5px; -webkit-transform: translateY(100px); -moz-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); -moz-transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.77, 0, 0.2, 1); }
	.home .slick-slider .slick-slide:hover .slide-buttons a{ -webkit-transform: translateY(0px); -moz-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); }
	.home .slick-slider .slick-slide .slide-buttons a.second{ -webkit-transition-delay: 0.1s; transition-delay: 0.1s; }
	.home .slick-slider .slide-buttons a:hover{ color:white; background:#d29615; }
	.home .slick-slider .slide-buttons a>i{ z-index: 1; position: relative; }
	.home .slick-slider .slide-buttons a:after{ z-index: 0; }
	/* Border Radius */
	.home .slick-slider .slick-slide,
	.home .slick-slider .slick-slide img{ border-radius: 14px !important;  }
	.slick-slide{ height: auto; }
	/* Next&Prev Arrows */
	.home .slick-arrow{ width: 45px; height: 100px; position: absolute; right: 50%; margin-right: -100px; top:100%; margin-top:50px; color:#565353; z-index: 5; padding: 0; background: transparent; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; }
	.home .slick-arrow span{ width: 0px; height: 1px; background: #aaa; position: absolute; display: block; left:20px; opacity: 0; visibility: hidden; -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); -moz-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); }
	.home .slick-arrow:before, .home .slick-arrow:after{ width: 18px; height: 1px; background: #aaa; content:''; position: absolute; left:10px; -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); -moz-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); }
	/* Next rotate options */
	.home .slick-arrow.slick-next:before{ margin-top:-6px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
	.home .slick-arrow.slick-next:after{ margin-top:6px; -ms-transform: rotate(-45deg); transform: rotate(-45deg); transform: rotate(-45deg); }
	/* Reverse - Previous settings */
	.home .slick-arrow.slick-prev{ left: 50%; margin-left: -100px; right: auto; margin-right: auto; }
	.home .slick-arrow.slick-prev span{ left: auto; right: 20px; }
	.home .slick-arrow.slick-prev:before, .home .slick-arrow.slick-prev:after{ left:auto; right:10px; }
	.home .slick-arrow.slick-prev:before{ margin-top:6px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
	.home .slick-arrow.slick-prev:after{ margin-top:-6px; -ms-transform: rotate(-45deg); transform: rotate(-45deg); transform: rotate(-45deg); }
	.home .slick-arrow:active{ -ms-transform: scale(0.9); -webkit-transform: scale(1.1); transform: scale(0.9); }
	/* Description to features */
	.home .home-description{ margin-top:187px;  }
		@media only screen and (max-width: 641px){
			.home .slick-arrow{ margin-top:10px; height: 60px; }
			.home .home-description{ margin-top:77px;  }
			.home .slick-slider .slick-slide:before{ filter: blur(0); display: none !important; }
		}
		/* Hover for desktops */
		@media only screen and (min-width: 641px){
			.home .slick-arrow:hover{ background-color:rgba(0,0,0,0.17); }
			.home .slick-arrow:hover span{ width: 50px; left:-15px; opacity: 1; visibility: visible; }
			.home .slick-arrow:hover:before, .home .slick-arrow:hover:after{ left:23px; }
			/* Hover to prev */
			.home .slick-arrow.slick-prev:hover span{ left:auto; right:-15px; }
			.home .slick-arrow.slick-prev:hover:before, .home .slick-arrow.slick-prev:hover:after{ left:auto; right:23px; }
			/* Texts to arrows when mouse over */
			.home .slick-arrow span:before{ position: absolute; content:'Next'; display: block; right:16px; top:-30px; opacity: 0; width:0px; white-space: nowrap; overflow: hidden; font-family: 'Playfair Display', serif; font-style: italic; font-size: 17px; -webkit-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); -moz-transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); transition: all 0.5s cubic-bezier(0.77, 0, 0.2, 1); }
			.home .slick-arrow.slick-prev span:before{ left:16px; right: auto; content:'Previous'; }
			/* to previous */
			.home .slick-arrow:hover span:before{ right:22px; width: 40px; opacity: 1; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; }
			.home .slick-arrow.slick-prev:hover span:before{ left:22px; width: 70px; }
		}

		/* Small Height Devices */
		@media only screen and (max-height: 960px){
			.home{ padding:55px 0 103px; min-height: none; }
			.home .slick-arrow{ margin-top:20px; }
			.home .home-description{ margin-top:130px; }
		}



/* Page Contents */
	.page-content{ padding:80px 0 77px; }


/* Contents for about, second section */
	.about .left-content,
	.about .right-contents{ height: 100vh; padding: 0; }
	.about .right-contents .content{ width: 100%; height: 100vh; padding: 90px 65px; overflow-x: hidden; overflow-y: auto; }
		@media only screen and (max-width: 1400px){
			.about .right-contents .content{ padding: 60px 25px; }
		}
		@media only screen and (max-width: 991px){
			.about, .about .showcase_container{ height: auto; min-height: 100vh; }
			.about .right-contents .content{ height: auto; }
			.about .right-contents{ height: auto; }
		}

	.skills-type-1{ padding: 30px 0; }
	.skills-type-1.progress-xl .item .progress{ background-color: transparent; }
	.skills-type-1.progress-xl .item .progress .progress-bar{ border-radius: 50px; overflow: hidden; }
	/* Gradient Progress Bars */
	.gradient-progress-bar {
	    background-image: -webkit-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
	    background-image: -o-linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
	    background-image: linear-gradient(45deg,rgba(255,255,255,1) 25%,transparent 25%,transparent 50%,rgba(255,255,255,1) 50%,rgba(255,255,255,1) 75%,transparent 75%,transparent);
	    -webkit-background-size: 22px 22px;
	    background-size: 22px 22px;
		position: relative;
		background-color:#aaa;
	}
	.gradient-progress-bar:before{
		position: absolute; left:0; top:0; bottom:0; right: 0; content: ''; opacity: 0.9;
		background: -moz-linear-gradient(90deg,  #9e792a 0%, #eaaa20 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(90deg,  #9e792a 0%,#eaaa20 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(90deg,  #9e792a 0%,#eaaa20 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	}

/* SHOWCASE WORKS */
	#works .cbp-caption-activeWrap{ background-color:#d29615; }
	#works .cbp-caption-activeWrap h2{ color:#fff; font-size:15px; font-weight: 900; margin:0; padding:0; }
	#works .cbp-caption-activeWrap p{ font-size:12px; font-weight: 900; margin:0; padding:0; color:#ddd; }
	#works .cbp-item:hover .cbp-caption-defaultWrap{ transform: scale(1.0);}
	/* filters */
	#works #filters.cbp-l-filters-text .cbp-filter-item{font-family:inherit !important; font-size:13px; font-weight: 900; margin-top:50px;}
	#works #filters.cbp-l-filters-text .cbp-filter-item-active.cbp-filter-item,
	#works #filters.cbp-l-filters-text .cbp-filter-item:hover{ color:#daa83c; }
		/* Visible Item texts on mobile */
		@media only screen and (max-width: 769px){
			#works .cbp-caption-activeWrap{ display: block; position: relative; opacity: 1; height: auto; background-color:#5d5047; }
			#works .cbp-caption-activeWrap p{ line-height: 12px; margin-top:4px; }
		}