/*   
Theme Name: Samadizajn 2015.
Theme URI: 
Description: Undefined
Author: Samadizajn
Author URI: http://www.samadizajn.com
Version: 1.0.0.
*/


/* ============== Table of Contents  ================== *//*
	

	1.0 - Defaults
	  - Sections
	  - Buttons
	  - Forms
	  - page contents
	  - backgrounds

	2.0 - Home Section | 1st section
	  - Navigation v1
	  - Navigation v2

	3.0 - Services section | 2nd section

	4.0 - Portfolio section | 3rd section
	  - Project Page

	5.0 - Other section | 4th section
	  - Google Map

	6.0 - Pop Up | Modal Box
	
	7.0 - Get a Quote
*/



/* 1.0 - Defaults */
	html { overflow-x: hidden; }
	body, html { font-family: 'Fira Sans', 'Maven Pro', Helvetica, sans-serif; }
	body { *overflow: hidden!important; }
	input { box-sizing: border-box; }
	p { font-size: 16px; opacity: 0.9; font-weight: 300; font-family: 'Fira Sans', 'Maven Pro', sans-serif; }

	body.popup_loaded, html.popup_loaded { overflow: hidden; *position: fixed; margin-right: 15px; }

	.verticalCenter {display: flex; flex-direction: row; align-items: center; justify-content: center; }

	.tranzited-200 {
		transition: all 200ms ease 0s;
		-moz-transition: all 200ms ease 0s;
		-webkit-transition: all 200ms ease 0s; }

	/* Sections & Grids */
		.section { position: relative; }
		.container { padding: 25px 10px; }

	/* Buttons */
		.btn-primary { color: #f18432; background-color: transparent; border-color: #f18432; }
		.btn-primary:hover {color: white; background-color: #f18432; border-color: transparent; }

		.btn-primary.blue { color: #6aa9ff; background-color: transparent; border-color: #6aa9ff; }
		.btn-primary.blue:hover { color: white; background-color: #6aa9ff; border-color: transparent; }


		.btn { border-radius: 3px; }

		.btn-default { color: #4e79bc; background-color: transparent; border-color: transparent; }
		.btn-default:hover { color: #4e79bc; border-color: #4e79bc; background-color: transparent; }

		@media (max-width: 1400px) {
			.btn-lg, .btn-group-lg > .btn {padding: 7px 12px; font-size: 16px; }
		}

	/* Forms */
		label.radio { margin-left: 20px; }
		.radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {*margin-left: 0px; }

		.project_needs label.radio { display: inline-block; padding-right: 20px; font-weight: normal; }
			@media (max-width: 700px) {
				.project_needs label.radio { display: block; font-weight: normal; }
			}

		textarea.form-control { height: 150px; }

	/* page contents */
		h1, .h1, h2, .h2, h3, .h3 { margin-top: 0px; }
		.section h2.title { padding: 15px 0; font-size: 45px; font-weight: bold; color: #595959; }

		.section-title { margin-bottom: 40px; margin-top: 40px; }
		.section-title h2 { font-size: 45px; font-weight: bold; color: #595959; }
		.section-title p.desc { font-size: 18px; }


		@media (max-width: 1400px) {
			.section-title { margin-bottom: 30px; }
			.section-title h2 { font-size: 28px; }
			.section-title p.desc { font-size: 16px; }
		}

		@media ( max-width: 1200px) {
			br.new_row { display: none; }
		}

		.parallax-window {
		    min-height: 400px;
		    /* background: transparent; */
		}

@font-face {
	font-family: 'samadizajn';
	src: url('assets/files/fontello/font/samadizajn.eot?85002985');
	src: url('assets/files/fontello/font/samadizajn.eot?85002985#iefix') format('embedded-opentype'),
	
	url('assets/files/fontello/font/samadizajn.woff?85002985') format('woff'),
	url('assets/files/fontello/font/samadizajn.ttf?85002985') format('truetype'),
	url('assets/files/fontello/font/samadizajn.svg?85002985#samadizajn') format('svg');
	
	font-weight: normal;
	font-style: normal;
}
			     
			     
.demo-icon {
	font-family: "samadizajn";
	font-style: normal;
	font-weight: normal;
	color: #ddd;
	speak: none;
			     
	display: inline-block;
	text-decoration: inherit;
	width: 1em;
	margin-right: .2em;
	text-align: center;
	/* opacity: .8; */
			     
	/* For safety - reset parent styles, that can break glyph codes*/
	font-variant: normal;
	text-transform: none;
	text-decoration: none;
			     
	/* fix buttons height, for twitter bootstrap */
	line-height: 1em;
			     
	/* Animation center compensation - margins should be symmetric */
	/* remove if not needed */
	margin-left: .2em;
			     
	/* You can be more comfortable with increased icons size */
	/* font-size: 120%; */
			     
	/* Font smoothing. That was taken from TWBS */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
			     
	/* Uncomment for 3D effect */
	/* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.cirilica-latinica { position: fixed; bottom: 0; width: auto; height: auto; background: transparent; z-index: 999; }
.cirilica-latinica > div { float: left; padding: 10px; color: #fff; cursor: pointer; opacity: 0.6; font-style: italic; }
.cirilica-latinica > div#latinica { display: none; }



/* 2.0 - Home Section | 1st section */
	.home_section {}

		#home { width: 100%; position: relative; overflow: hidden; z-index: 1; }
			.home_section video { position: absolute; top: -10px; left: -10px; right: -10px; width: 125%; z-index: -10; }

			.main-title {
				width: 100%; position: absolute; top: 45%; left: 50%;
				margin: 0; padding: 0; color: #fff;
				text-align: center;
				width: 700px; margin-left: -350px; }

			.main-title {
				text-transform: lowercase;
				font-size: 45px; letter-spacing: 2px;
				line-height: 1.3; text-shadow: 5px 5px rgba(0,0,0,0.10); }

			.main-title li { width: 400px; }

			@media only screen and (max-width : 768px) {
				.main-title  { font-size: 3em; }
			}	

	.home_logo { position: absolute; top: 25%; width: 100%; text-align: center; }
	.home_logo img { width: 220px; height: auto; }
	.home_slogan { position: absolute; bottom: 36%; width: 100%; text-align: center; color: #fff; text-shadow: 5px 5px rgba(0,0,0,0.10); }
	.home_slogan h1 { color: #fff; } .home_slogan h3 { color: #fff; } 

	.content { 
		position: relative; 
		*height: 100%;  }

		#canvas_effect { background-color: rgba(0, 0, 0, 0.19); }
		@media (max-width: 900px) {
			#canvas_effect { display: none; }
		}	

		#particles-js canvas{
		  display:block;
		  vertical-align:bottom;
		  background-color: rgba(0, 0, 0, 0.2);
		}

		/* ---- particles.js container ---- */
		#particles-js{
		  width: 100%;
		  height: 100vh;
		  background-color: rgba(0, 0, 0, 0.19);
		  background-image: url('');
		  background-size: cover;
		  background-position: 50% 50%;
		  background-repeat: no-repeat;
		}

		.mobile-home { display: none; }

		@media (max-width: 600px) { 
			#particles-js { display: none; } 
			.mobile-home {
				width: 100%; height: 100vh;
			    background-color: rgba(0, 0, 0, 0.19);
			    background-image: url('');
			    background-size: cover;
			    background-position: 50% 50%;
			    background-repeat: no-repeat;
			    display: block;}

			.home_slogan { position: absolute; top: auto; bottom: 32%; width: 100%; text-align: center; color: #fff; text-shadow: 5px 5px rgba(0,0,0,0.10); }
			.home_slogan h1 { color: #fff; font-size: 22px; } .home_slogan h3 { color: #fff; font-size: 20px; } 			    
		}



/* 3.0 - Services section | 2nd section */
	.services_section { position: relative; }

	.our_services { position: relative; }
	.our_services img { margin-bottom: 20px; height: 130px; width: auto; }
	.services_item { box-sizing: border-box; padding: 20px; }
	
	.service-icon { display: block; width: 100%; height: 75px; position: relative; text-align: center; margin-bottom: 20px; }
	.service-icon svg { height: 100%; position: relative; width: auto; }

	@media (max-width: 1400px) {
		.services_item h3 { font-size: 20px; }
		.services_item img { width: 100px; height: auto; }
	}	

	.our_statistics { background-color: rgba(0, 0, 0, 0.75); min-height: 325px !important; }
		.our_statistics h2.title { color: #fff; margin-bottom: 0; }
			.our_statistics h2.title span { color: #6aa9ff; }

		.our_statistics p.desc { 
			font-size: 18px; font-weight: 300; 
			font-style: italic; line-height: 1.3; 
			margin: 5px 0; color: #fff; }

	.statistics_item {  }
	.statistics_item .num { font-size: 70px; font-weight: 700; color: white; display: none;  }
	.statistics_item .title { font-size: 20px; font-weight: 700; color: #6aa9ff; }

	@media (min-height: 900px) {
		.services_section .our_services { padding: 4.6% 10px; }
	}

	@media (min-width: 900px) {
		.statistics_item .num { font-size: 60px; }
		.statistics_item .title { font-size: 20px; }
	}

	@media (max-width: 900px) {
		.statistics_item .num { font-size: 60px; }
		.statistics_item .title { font-size: 20px; }
		.our_statistics .row.statistics { margin-top: 36px; }
	}	

	@media (max-width: 700px) {
		.statistics_item .num { font-size: 40px; }
		.statistics_item .title { font-size: 16px; }
		.section h2.title { font-size: 35px; }
		.our_statistics .row.statistics { margin-top: 28px; }
	}	

	@media (max-width: 500px) {
		.statistics_item .num { font-size: 20px; }
		.statistics_item .title { font-size: 12px; }
		.our_statistics .row.statistics { margin-top: 20px; }
	}	

/* 4.0 - Portfolio section | 3rd section */
	.portfolio_wrap { padding: 0 !important; overflow: hidden; }
		.portfolio_wrap .left_side { 
			width: 50%; 
			position: absolute; left: 0; top: 0; 
			background-color: #ECECEC; z-index: 200; 
			font-family: 'Fira Sans', sans-serif;
			color: #000; }
		.portfolio_wrap .left_side.fixed { position: fixed; top: 0; left: 0; }
			.portfolio_wrap .left_side .center { text-align: center; }
				.portfolio_wrap .left_side .center h2.title { text-align: left; font-size: 30px; margin-bottom: 0; padding-bottom: 0; font-style: italic; }
				.portfolio_wrap .left_side .center p { text-align: left; font-size: 15px; font-style: italic; margin: 0 0 6px 0; padding-top: 0; }


		.portfolio_wrap .right_side { width: 75%; position: relative; left: 35%; }
			.portfolio_wrap .right_side .project { overflow: hidden; position: relative; left: 0; width: 100%; background-color: #000810; }
			.portfolio_wrap .right_side .project.mobile { display: none; }
			.portfolio_wrap .right_side .project.desktop { display: block; }

				.portfolio_wrap .right_side .project a { width: 100%; display: inline-block; overflow: hidden;  }
					.portfolio_wrap .right_side .project a img { width: auto; height: 100%; position: absolute; z-index: 0; top: 0; left: 0; opacity: 0.8; }
					.portfolio_wrap .right_side .project a img.tranzited {
							transition: all 5000ms ease 0.5s;
							-moz-transition: all 5000ms ease 0.5s;
							-webkit-transition: all 5000ms ease 0.5s;
							-webkit-transition-duration: 10s; /* Safari */
					    	transition-duration: 10s; }

						.portfolio_wrap .right_side .project a .center { 
							text-align: center; 
							background-color: rgba(0,0,0,0.10); 
							padding: 30px 40px; }

							.portfolio_wrap .right_side .project a .center h2 { 
								font-size: 22px; font-weight: 300; 
								text-align: center; color: #fff; text-decoration: none; }

							.portfolio_wrap .right_side .project a .center p { 
								font-size: 17px; font-weight: 300; 
								color: #fff; text-decoration: none; font-style: italic; }

							.portfolio_wrap .right_side .project a .center button {
								font-weight: 300; background-color: rgba(91, 192, 222, 0.22);
							}

	.center { position: absolute; top: 50%; left:50%; transform: translate(-50%,-50%); }
	.responsive-title { display: none; }

		@media (max-width: 900px) {
			.portfolio_wrap .right_side .project.mobile { display: block; }
			.portfolio_wrap .right_side .project.desktop { display: none; } 
			.portfolio_wrap .left_side { display: none; }
			.portfolio_wrap .right_side { width: 100%; left: 0; }
			.container.respo { display: inline-block; }
			.responsive-title { display: inline-block; font-size: 40px; text-align: center; width: 100%; padding: 15px; color: #fff; background-color: #313131; }
			.portfolio_wrap .right_side .project a img { left: -30%; }
			.portfolio_wrap .right_side .project a .center { width: 80%; }

			.portfolio_wrap .right_side .project a img.tranzited {
				transition: none;
				-moz-transition: none;
				-webkit-transition: none;
				-webkit-transition-duration: none;
				transition-duration: none; }
			}

		@media (max-width: 600px) { 
			.portfolio_wrap .right_side .project a img { left: -80%; }
		}


	.portfolio_items { position: relative; }
	.portfolio_item {  }
	.portfolio_item_wrap { position: relative; overflow: hidden; height: 320px; margin: 15px 0; }

	.portfolio_item .infos { 
		&display: none;
		position: absolute; width: 100%; 
		height: 100%; z-index: 4; box-sizing: border-box; padding: 40px; 
		top: -100%;
	}

	.portfolio_item .view {  }
	.portfolio_item .view img { width: 100%; height: auto; }

	.view {
	    width: 100%; height: 300px;
	    margin: 10px;
	    float: left; border: 10px solid #fff; overflow: hidden; 
	    position: relative; text-align: center;
	    box-shadow: 1px 1px 2px #e6e6e6;
	    cursor: default;
	}

	@media (max-width: 600px) {
		.view { height: 240px; }
	}


	.view .mask, .view .content { width: 100%; height: 100%; position: absolute; overflow: hidden; top: 0; left: 0 }

	.view img { display: block; position: relative }
	.view h2 { font-size: 20px; font-weight: bold; color: white; padding: 10px; text-transform: uppercase; text-align: center; margin-top: 20px; position: relative; }
	.view p { position: relative; opacity: 0;  bottom: -120px; color: #fff; padding: 0px 20px 20px; text-align: center; font-size: 14px; font-weight: lighter; } 


	/* animations */
		.portfolio-hover img { transition: all 0.5s linear; }
		.portfolio-hover .mask { opacity: 0; background-color: rgba(0,0,0, 0.7); transition: all 0.3s ease-in-out; }
		.portfolio-hover h2 { transform: translateY(-100px); opacity: 0; transition: all 0.2s ease-in-out; }
		.portfolio-hover p { transform: translateY(100px); opacity: 0; transition: all 0.2s linear; }
		.portfolio-hover a.info { transition: all 0.2s linear; transform: translateY(100px); }

		.portfolio-hover:hover img { transform: scale(1.4); }
		.portfolio-hover:hover .mask { opacity: 1; }
		.portfolio-hover:hover h2,
		.portfolio-hover:hover p,
		.portfolio-hover:hover a.info { opacity: 1; bottom: 0px; transform: translateY(0px); }
		.portfolio-hover:hover p { transition-delay: 0.1s; }




	/* Project Page */
		.project-wrap { position: relative; }
		.project-desc { position: relative; top: 0px; }
		.project-img img { width: 100%; height: auto; }





/* 5.0 - Other section | 4th section */
	
	/* Our Partners */
		.section_4 { background-color: #fff; z-index: 300; }
		.our_partners_wrap { padding: 50px 10px 60px;  }
			.our_partners_wrap .partners { width: 100%; height: auto; }





	/* Google Map */
		.google_map_wrap { position: relative; height: 376px; padding: 0; }
		.google_map { width: 100%; height: 100%; }
		.map_shadow { position: absolute; width: 100%; height: 10px; z-index: 2; }
		.map_shadow { background: url(assets/images/map-shadow.png) repeat-x top center; }
		.map_shadow.top { top: 0; }
		.map_shadow.bottom { bottom: 0; }

		.buble_text { font-size: 14px; width: 250px; text-align: left; }

	/* footer */
		.footer_wrap { position: relative; background-color: #313131; }
			.footer { padding-bottom: 15px; }
				.footer .copyright { color: #fff; font-size: 12px; }
					.footer ul.socialnet { display: inline-block; margin: 0; padding: 0; float: right; }
						.footer ul.socialnet li { display: inline-block; margin: 0 10px; }
							.footer ul.socialnet li:last-child { margin-right: 0; }
							.footer ul.socialnet li a { color: #fff; text-decoration: none; }
								.footer ul.socialnet li a:hover { color: #6aa9ff; }


/* 6.0 - Pop Up | Modal Box */
	.pop_up {
		display: none;
		position: fixed;
		width: 100%; height: 100%;
		top: 0px; right: -100%;
		z-index: 9999999;
		*background: url(assets/images/black_45.png) repeat;
	}

	.pop_up .container { box-sizing: border-box; width: auto; }

	.popup_mask { 
		position: absolute; 
		width: 100%; height: 100%;
		top: 0px; right: 0px;
		background: rgba(0,0,0,0.5);
	}

	.popup_container {
		position: absolute; 
		width: 95%; height: 100%;
		top: 0px; right: 0px;
		background: #fff;
	}


	/* Animations */

		/* opening */
		.opening_animation .popup_mask {-webkit-animation-duration: 0.6s!important; -webkit-animation-delay: 0s !important; }
		.opening_animation .popup_container {-webkit-animation-duration: 0.6s!important; -webkit-animation-delay: 0.3s !important; }
		.opening_animation .close_pop_up { -webkit-animation-duration: 0.9s!important; -webkit-animation-delay: 1.0s !important; }

		/* closing */
		.closing_animation .popup_mask { -webkit-animation-duration: 0.9s!important; -webkit-animation-delay: 1.0s !important; }
 		.closing_animation .popup_container { -webkit-animation-duration: 0.9s!important; -webkit-animation-delay: 0.8s !important; }
 		.closing_animation .close_pop_up { -webkit-animation-duration: 0.9s!important; -webkit-animation-delay: 0s !important; }


	.pop_up.active { right: 0px; display: block; }
	
	#popup-data { 
		width: 100%; height: 100%; 
		position: absolute; top: 0; 
		overflow: auto; box-sizing: border-box; 
		overflow: hidden; }
	
	.stop-scrolling { height: 100%; overflow: hidden; }
	
	.popup-shadow { 
		width: 15px; height: 100%; 
		position: absolute; left: -15px;
		z-index: 8888; opacity: 0.65;	
		background: url(assets/images/popup-shadow.png) repeat-y right center;
		background-size: 100%; }

	.close_pop_up { 
		width: auto; height: auto; 
		position: absolute; left: 20px; top: 20px; 
		z-index: 999; color: #494949;
		cursor: pointer; }

	.popup_loader { position: absolute; width: 100px; height: 100px; top: 50%; left: 50%; margin-top: -50px; margin-left: -50px; font-size: 65px; vertical-align: middle; text-align: center; z-index: 999999; }

	#fullpage.popup_active { position: absolute; left: -80%; overflow: none; }

	/* responsive */
		@media (max-width: 900px) {
			.popup_container { width: 90%; }
			.popup_container .container { padding: 0px; padding-top: 50px; }
			#popup-data { padding: 0; }
			.close_pop_up { left: 5px; top: 5px; }
		}




	.sasa { position: absolute!important; top 100px; }	

/* 7.0 - Get a Quote */

	.get_a_quote_wrap { background-color: #313131; color: #fff; padding: 26px 10px 40px 10px; }
		.get_a_quote_wrap h2.title { color: #fff; }
			.get_a_quote_wrap h2.title span { color: #6aa9ff; }
			.get_a_quote_wrap a.popup_btn { margin: 15px 0 0 0; }
				.get_a_quote_wrap p.desc span.blend { opacity: 0.8; font-size: 14px; font-style: italic; }
					.get_a_quote_wrap p.desc span.blend:hover { opacity: 1; }

	.contact-form {  }
	@media (max-width: 800px) {
		.contact-form .col-xs-6 { width: 100%; }	
	}
	@media (max-width: 550px) {
		.contact-form { padding-left: 20px; padding-right: 20px; }	
	}

	#qet_a_quote {  }	
	#qet_a_quote .container { position: relative; padding-left: 20%; padding-right: 20%; }	
	@media (max-width: 800px) {
		#qet_a_quote .container { padding-left: 20px; padding-right: 20px; }	
	}

	#qet_a_quote iframe { width: 100%; overflow: hidden!important; position: relative; border: none; outline: none; }

	.form {  }
	.form .errors { width: 100%; margin-bottom: 20px; background-color: red; box-sizing: border-box; padding: 20px; color: white; }
	.form .errors {  }
	.form .success { width: 100%; margin-bottom: 20px; background-color: green; box-sizing: border-box; padding: 20px; color: white; }

	.form-group { position: relative; margin-bottom: 25px; }
	.form-group .field-error { position: absolute; color: red; bottom: -20px; }


	.error input { border: 1px solid red; }



/* Scroll icon */ 
.scroll-icon { width: 100%; height: 32px; position: absolute; bottom: 4%; text-align: center; }
	.scroll-icon a { text-decoration: none; border: none; outline: none; display: inline-block; }