mb/*

@Author: Themezinho
@URL: http://www.themezinho.net
 
This file contains the styling for the actual theme, this
is the file you need to edit to change the look of the
theme.



// Table of contents //

	1. Body
		1.1 Tools Elements
		1.2 Spacing Elements
		1.3 Section Elements
		1.4 Link & Buttons 
		1.5 Titles
		1.6 Background Elements
		1.7 Overlay
		1.8 Loading
		
		
	2. Nav Bar
		2.1 Navbar Elements
		2.2 Navbar Brand
		2.3 Navbar Navbar Nav
		2.4 Navbar Toogle
		
		
	3. Sticky Nav
		3.1 Sticky Nav Elements
		
		
	4. Header
		4.1 Header Elements
		4.2 Header Splash 
		4.3 Header Thanks		
		
		
	5. Side Image Content
		5.1 Side Image Elements
		5.2 Side Image Background
		5.3 Side Content Element
	
		
	6. Icon Features
		6.1 Icon Feature Elements
		6.2 Icon Feature Spacing
		6.3 Icon Feature Icons
		
		
	7. Team Section
		7.1 Team Elements
		7.2 Team Team Members
		7.3 Team Member
		7.4 Team Info Box
		7.5 Team Button
		
		
	8. Services
		8.1 Services Elements
		8.2 Services Image
		8.3 Services List
		8.4 Services Icons
		
		
	9. About Us
		9.1 About Us Elements
		9.2 About Us Left Image
		9.3 About Us Skills
		9.4 About Us Progress
		
		
	10. Download
		10.1 Download Elements
		10.2 Download Features
		10.3 Download Text Sides
		10.4 Download Right Side
		10.5 Download Counter
		10.6 Download Button
		
		
	11. Video
		11.1 Video Elements
		11.2 Video Icon
		11.3 Video Modal Litebox
		
		
	12. Recent Works
		11.1 Recent Works Elements
		11.2 Recent Works Filter
		11.3 Recent Works Grids
		11.4 Recent Works Title Box
		11.5 Recent Works Thumbs
		
		
	13. Clients
		13.1 Client Elements
		13.2 Client Testimonials
		13.3 Client Logos
		
		
	14. Prices
		14.1 Prices Elements
		14.2 Prices Table Container
		14.3 Prices List
		
		
	15. Latest News
		15.1 Latest News Elements
		15.2 Latest News Box
		15.3 Latest News Thumb
		15.4 Latest News Info Box
		15.5 Latest News Icon
		
		
	16. Contact Infos
		16.1 Contact Infos Elements
		16.2 Contact Infos Icon
		
		
	17. Contact
		17.1 Contact Elements
		17.2 Contact Map
		17.3 Contact Form & Fields
		
	
	18. Contact Form
		18.1 Contact Form Elements
		
		
	19. Footer
		19.1 Footer Elements
		19.2 Footer Social Media
		19.3 Footer Creatian
		
	20. Customized Slider
		20.1 Slider Elements
		
		
	21. Responsive Fixes
		21.1 Media queries 
		

 
*/

@import url(http://fonts.googleapis.com/css?family=Raleway:400,300,600,800);


/* BODY */
*{ outline:none !important;}
body{ margin:0; padding:0; font-family: 'Raleway', sans-serif; font-size:15px; color:#27292c; -webkit-font-smoothing: antialiased;}
html, body {height: 100%}



/* TOOLS */
h1{font-family: 'Raleway', sans-serif;}
h2{font-family: 'Raleway', sans-serif;}
h3{font-family: 'Raleway', sans-serif;}
h4{font-family: 'Raleway', sans-serif;}
h5{font-family: 'Raleway', sans-serif;}

p{ margin-bottom:20px; line-height:24px;}
i{ font-size:50px;}



/* SPACING */
.no-margin{ margin:0 !important;}
.no-padding{ padding:0 !important;}



/* SECTIONS */
header, section, footer, nav { width:100%; float:left;}



/* LINKS BUTTONS */
a{ color:#27292c;}
a:hover{ color:#27292c; text-decoration:none;}
a{-moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease;}
.btn-crea{ display:inline-block; border:2px solid #00daff; padding:12px 30px; color:#27292c; font-weight:800}
.btn-crea:hover{ color:#27292c; padding:12px 40px; text-decoration:none;}



/* TITLES */
.main-title{ display:inline-block; font-size:50px; font-weight:800; margin-top:0;}
.sub-title{ color:#a1a3a4; letter-spacing:2px; margin-bottom:80px; line-height:22px; position:relative;}
.sub-title:after{content:''; width:40px; height:1px; background:#27292c; position:absolute; left:50%; margin-left:-20px; bottom:-30px;}



/* BACKGROUNDS */

.background-img1{ background-image:url(../images/hero1.jpg); background-size:cover; background-position:center;}
.background-img2{ background-image:url(../images/hero2.jpg); background-size:cover; background-position:center;}
.background-img3{ background-image:url(../images/hero3.jpg); background-size:cover; background-position:center;}


/* OVERLAY */
.background-overlay{ position:relative;}
.background-overlay:after{content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:#000; opacity:0.10;}
.background-overlay .container{ position:relative; z-index:2;}



/* LOADING */
.loading {width: 100% ;height: 100%; position: fixed; left: 0px; top: 0px; background: url('../images/loading.gif') center 364px no-repeat #f0f0f0; background-size:40px 40px; z-index:99999;}
.loading span{ width:100%; float:left; margin-top:400px; font-weight:600; text-align:center;}



/* NAVBAR */
.navbar{ position:fixed; z-index:999;background-color: rgba(0, 0, 0, 0.2);border-style: solid; border-bottom: 1px solid #fff; border-radius:0;}
.navbar-nav{ float:right;}
.navbar-brand{ height:auto; float:left; padding:0; margin-top:21px; margin-left:15px;}
.navbar-brand img{ height:35px;}
.navbar-nav>li:last-child{ margin-right:0; padding-right:0;}
.navbar-nav>li:last-child a{ margin-right:0; padding-right:0;}
.navbar-nav>li>a{ padding-top:26px; padding-bottom:26px; color:#eee; font-weight:800; font-size:13px; margin-left:20px;}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus{color:#00daff;}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover{ background:none; color:#00daff;}
.navbar-default .navbar-nav>.active>a:focus{ background:none; color:#fff;}
.navbar-default .navbar-toggle{ border:none; padding:7px 10px;}
.navbar-default .navbar-toggle i{ color:#fff; font-size:30px;}
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus{ background:none;}



/* STICKY NAV */
.affix{position:fixed;}
.affix:after{content:''; width:100%; height:73px; position:fixed; left:0; top:0; background:#27292c; opacity:0.90; z-index:3;}
.affix .container{ position:relative; z-index:5;}



/* HEADER */
header{ width:100%; height:880px; overflow:hidden;}
header.internal-pages{ height:500px;}
header h1{ margin-top:200px; font-size:80px; color:#fff; font-weight:800; background:url(../images/seperate-king-hat.png) bottom center no-repeat; padding-bottom:30px; margin-bottom:30px;}
header h1 em{ font-style:normal;}
header .splash{ width:100%; height:100%; background:url(../images/splash.png) no-repeat; position:absolute; left:0; top:0; z-index:1;}
header h5{ font-size:31px; color:#ccced1; padding:0 8%; letter-spacing:2px;}
header h5 em{ font-style:italic; font-weight:800; color:#fff;}
header .thanks{ width:120px; display:inline-block; margin-top:40px;}


/* HEADER VIDEO BG */
.video-bg{height:880px; position:relative;}
.video-bg .video-container{ width:100%; height:100%; max-height:880px; float:left; position:relative; overflow:hidden;}
.video-bg .video-bg-content{ width:100%;}
.video-bg .video-bg-content .error{ font-size:150px;}
.video-bg video{ position:absolute; min-width:100%; min-height:880px; float:left;}



/* SIDE IMAGE CONTENT */
.side-image-content{ background:#f3f3f3;}
.side-image-content .side-image{height:450px; background:url(../images/hero3.jpg) no-repeat; background-size:cover;}
.side-image-content .side-image a{ margin-top:180px; color:#fff; border:2px solid #00daff;}
.side-image-content .text-content{ width:100%; padding:40px;}
.side-image-content .text-content h3{ font-weight:800; margin-top:60px; margin-bottom:40px; letter-spacing:2px;}
.side-image-content .text-content p{ margin:25px 0; color:#78797a;}



/* ICON FEATURES */
.icon-features{ padding:100px 0;}
.icon-features i{ font-size:70px; }
.icon-features .spacing{ padding:20px 40px;}
.icon-features h3{ color:#27292c; font-size:22px; font-weight:800; background:url(../images/zigzag-bg.png) bottom center no-repeat; margin-bottom:20px; padding-bottom:30px; font-family: 'Raleway', sans-serif; }
.icon-features p{ margin-bottom:40px; color:#78797a; font-family: 'Raleway', sans-serif; }



/* TEAM SECTION */
.team{ padding:100px 0; text-align:center; background:#f3f3f3;}
.team .team-members{ width:100%; float:left;}
.team .team-members .member{ width:100%; max-height:444px; float:left; overflow:hidden; position:relative;}
.team .team-members .member *{-moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease;}
.team .team-members .member:hover .info-box{opacity:1;}
.team .team-members .member:hover .info-box h4{ margin-top:60px;}
.team .team-members .member:hover img{ width:110%; margin-left:-5%; }
.team .team-members .member img{ width:110%; float:left; margin-right:-5%;}
.team .team-members .member .info-box{ width:100%; height:100%; position:absolute; left:0; top:0; padding:20px; background:rgba(39,41,44,0.9); color:#fff; opacity:0;}
.team .team-members .member .info-box h4{ font-size:24px; font-weight:800; margin-top:20px;}
.team .team-members .member .info-box span{ font-family:times new roman; font-size:16px; font-style:italic; position:relative; margin-bottom:40px; display:block;}
.team .team-members .member .info-box span:after{content:''; width:40px; height:1px; background:#fff; position:absolute; left:50%; margin-left:-20px; bottom:-20px;}
.team .team-members .member .info-box i{font-size:60px;}
.team .team-members .member .info-box p{font-weight:300;}
.team .btn-crea{ margin-top:40px;}



/* SERVICES */
.services{padding:100px 0;}
.services i{ font-size:50px;}
.services h3{ font-weight:600; margin-bottom:20px;}
.services img{ margin-bottom:60px;}
.services ul{ width:100%; float:left; margin:0; padding:0;}
.services ul li{ width:100%; float:left; list-style:none; margin:4px 0; font-size:14px;}
.services ul li:before{content:''; width:6px; height:2px; float:left; background:#ccc; margin-top:10px; margin-right:10px;}




/* ABOUT US */
.about-us{background:#f3f3f3;}
.about-us .left-image{ width:100%; position:relative;}
.about-us .left-image img{  float:right;}
.about-us .col-md-6{ background:#fff; padding:0;}
.about-us .col-md-5{ padding-left:40px;}
.about-us h2{ font-size:40px; font-weight:800; margin-top:60px;}
.about-us h5{ font-size:19px; font-weight:300; color:#666; margin-bottom:40px;}
.about-us h5:before{content:''; width:130px; height:2px; background:#27292c; float:left; margin-top:10px; margin-right:10px;}
.about-us .skills{ width:100%; float:left;}
.about-us .skills h4{ float:left; font-weight:600;}
.about-us .skills .progress{  width:100%; height:2px; float:left; border-radius:0;}
.about-us .skills .progress .progress-bar{ width:0%; float:left; background:#00daff;}



/* DOWNLOAD */
.download{ padding:100px 0;}
.download .features{ width:100%; float:left; margin-bottom:30px;}
.download .features i{ width:70px;  font-size:50px; float:right; margin:10px 10px; padding:20px 10px; border-left:1px dotted #27292c;}
.download .features h4{ font-weight:800;}
.download .features p{ margin-top:20px;}
.download .features .iphone{ width:300px;}
.download .text-right{ padding-top:80px;}
.download .text-left{ padding-top:80px;}
.download .right-side{ width:100%; float:left;}
.download .right-side h4{ margin:0;}
.download .right-side h2{ margin:0; margin-bottom:20px; font-size:40px; font-weight:800;}
.download .right-side .odometer{ font-size:30px; font-weight:600;}
.download .right-side p{ margin-bottom:20;}
.download .right-side ul{ width:100%; float:left; margin-bottom:20px; padding:0;}
.download .right-side ul li{ width:100%; float:left; list-style:none; margin:4px 0; font-size:14px;}
.download .right-side ul li:before{content:''; width:6px; height:2px; float:left; background:#ccc; margin-top:10px; margin-right:10px;}
.download .right-side .app-logo{ width:auto; display:block;} 
.download .btn-crea{ margin-bottom:80px;}



/* VIDEO */
.video{ padding:100px 0;}
.video h2{ font-size:40px; color:#fff; font-weight:800;}
.video h5{ font-weight:600; font-size:18px; color:#fff; margin-bottom:60px;}
.video i{ width:80px; height:80px; display:inline-block; padding-top:2px; padding-left:10px; font-size:50px; border-radius:100px; border:3px solid #fff; color:#fff;}
#video{width:800px; display:none;}
#video video{ width:100%;}




/* RECENT WORKS */
.recent-works{ padding-top:100px;}
.recent-works .filter{ width:100%; float:left; text-align:center; margin:0; padding:0;}
.recent-works .filter li{ display:inline-block; list-style:none; margin:0 10px;}
.recent-works .filter li span{ width:20px; height:12px; float:left; border:1px solid #ccc; margin-top:3px; margin-right:8px;}
.recent-works .filter li a{ float:left; font-size:13px; font-weight:600;}
.recent-works .filter li a:hover{color:#27292c; text-decoration:none;}
.recent-works .filter li a:focus{color:#27292c; text-decoration:none;}
.recent-works .filter li a.current span{ position:relative;}
.recent-works .filter li a.current span:after{content:''; width:14px; height:6px; background:#00daff; position:absolute; left:2px; top:2px;}
.works-container{ float:left;}



/* CLIENTS */
.clients{ padding:100px 0;}
.clients .testimonials h3{ padding-bottom:40px; background:url(../images/zigzag-bg.png) bottom center no-repeat;}
.clients .logos{ display:inline-block;}
.clients .logos img{ width:100%; float:left;}



/* PRICES */
.prices{ padding:100px 0; background:#f3f3f3;}
.prices .price-table-container{ width:100%; float:left; background:#fff; padding:40px 0;}
.prices .price-table-container .type{ width:100%; float:left; font-size:20px; font-weight:800; letter-spacing:2px; margin-bottom:60px; position:relative;}
.prices .price-table-container .type:after{content:''; width:40px; height:2px; background:#27292c; position:absolute; left:50%; margin-left:-20px; bottom:-30px;}
.prices .price-table-container .price{ width:100%; float:left; margin-bottom:30px; padding-bottom:40px; background:url(../images/zigzag-bg.png) bottom center no-repeat; border-top:1px solid #f3f3f3;}
.prices .price-table-container .price b{ font-size:40px; margin-top:-30px;}
.prices .price-table-container ul{ width:100%; float:left; margin-bottom:40px; padding:0; list-style:none;}
.prices .price-table-container ul li{ width:100%; float:left; margin:14px 0;}



/* LATEST NEWS */
.latest-news { padding:100px 0;  background:url(../images/map2.jpg) center no-repeat #000000;}
.latest-news  .news-box{ width:100%; float:left; margin-bottom:40px;}
.latest-news  .news-box *{-moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease;}
.latest-news  .news-box .thumb{ width:100%; float:left; position:relative; overflow:hidden;}
.latest-news  .news-box .thumb img{ width:110%; float:left; margin-right:-5%;}
.latest-news  .news-box .thumb:hover .info-box{ opacity:1;}
.latest-news  .news-box .thumb:hover img{ width:110%; margin-left:-5%; }
.latest-news  .news-box .thumb .info-box{  width:100%; height:100%; position:absolute; left:0; top:0; padding:20px; background:rgba(39,41,44,0.9); color:#fff; opacity:0;}
.latest-news  .news-box .thumb .info-box .date{ width:100%; float:left; font-weight:600; font-size:20px; margin-bottom:30px;}
.latest-news  .news-box .thumb .info-box .posted{ width:100%; float:left; font-size:11px;}
.latest-news  .news-box .thumb .info-box  i{font-size:60px;}
.latest-news  .news-box h3{ width:100%; float:left; font-weight:600; line-height:24px; font-size:20px; margin-top:20px; position:relative;}
.latest-news  .news-box h3:after{content:''; width:40px; height:1px; background:#27292c; position:absolute; left:0; bottom:-20px;}




/* CONTACT INFOS */
.contact-info{ padding:100px 0;}
.contact-info i{ height:70px; line-height:70px; font-size:70px;}
.contact-info h3{ margin-top:40px; padding-top:40px; background:url(../images/zigzag-bg.png) top center no-repeat; font-size:20px; font-weight:700;}
.contact-info p{ margin-top:20px; margin-bottom:0;}




/* CONTACT */
.contact{ padding:0; background:#f3f3f3;}
.contact #map{width:100%; height:100%; float:left;}
.contact h4{ visibility: hidden; height:0; float:left; padding-left:40px;}
.contact form{ float:left; padding-top:10px; padding-left:40px;}
.contact form .form-group{ width:100%; max-width:400px; float:left; margin-bottom:10px;}
.contact form .form-group input[type="text"]{ width:100%; height:35px; float:left; border:none; border-bottom:2px solid #eee; background:#fff; padding:0 10px}
.contact form .form-group textarea{ width:100%; height:100px; float:left; border:none; border-bottom:2px solid #eee; background:#fff; padding:10px}
.contact form .form-group input[type="submit"]{ height:35px; background:#00bbea; color:#fff; padding:0 20px; border:none; font-weight:800;}




/* CONTACT FORM */
#success, #error {display:none; float:left; margin-left:40px;}
#success p, #error p {margin:0;float:left; font-size:13px; font-weight:600;}
#contact label{ width:100%; color:red; font-weight:400; font-size:13px;}
#error p {color:#c0392b;}	




/* FOOTER */
footer{ width:100%; float:left; background:#27292c; padding:20px 0; font-size:13px; font-weight:600; color:#fff;}
footer ul{ width:100%; float:left; margin:30px 0; padding:0;}
footer ul li{ list-style:none; margin:0; padding:0 16px; display:inline-block;}
footer ul li i{ color:#00daff; font-size:26px;}
footer .creation{ display:inline-block;}
footer .creation i{color:#e23d3d; font-size:14px;}




/* CUSTOMIZED SLIDER */
.bx-wrapper{ width:100%; float:left;}
.bx-wrapper .bx-viewport{ left:0; border:none; box-shadow:none;}
.bx-wrapper .bx-pager{ margin-bottom:-30px;}
.bx-wrapper .bx-pager.bx-default-pager a{ width:14px; height:14px; border-radius:14px; border:3px solid #ccc; background:#fff;}
.bx-wrapper .bx-pager.bx-default-pager a:hover{border:3px solid #27292c; background:#fff;}
.bx-wrapper .bx-pager.bx-default-pager a.active{ width:18px; height:18px; border-radius:18px; border:3px solid #00daff; background:#fff;}


.linkicon { width:500px;
	}
.linkicon a:hover {
   opacity: 0.6;
   
}

.link-feature {
	}
.link-feature a:hover {
	color:#0CF;
	font-size:16px;
}

.map-tel { width:100%; 
height:400px;}

.hide-show { display:none;}
.show-hide { display:block;}

/* Hide Services*/
.hideme {
    background-color: white;
	width:100%;
}	


#Flag { opacity:1.0;
}

#Flag:hover { opacity:0.6;
}

/* LATEST Threaths */
.latest-threats { padding:0px 0; background-color:#000000}
.latest-threats  .news-box{ width:100%; float:left; margin-bottom:40px;}
.latest-threats  .news-box *{-moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; -ms-transition: all 0.2s ease; transition: all 0.2s ease;}
.latest-threats  .news-box .thumb{ width:100%; float:left; position:relative; overflow:hidden;}
.latest-threats  .news-box .thumb img{ width:110%; float:left; margin-right:-5%;}
.latest-threats  .news-box .thumb:hover .info-box{ opacity:1;}
.latest-threats  .news-box .thumb:hover img{ width:110%; margin-left:-5%; }
.latest-threats  .news-box .thumb .info-box{  width:100%; height:100%; position:absolute; left:0; top:0; padding:20px; background:rgba(39,41,44,0.9); color:#fff; opacity:0;}
.latest-threats  .news-box .thumb .info-box .date{ width:100%; float:left; font-weight:600; font-size:20px; margin-bottom:30px;}
.latest-threats  .news-box .thumb .info-box .posted{ width:100%; float:left; font-size:11px;}
.latest-threats  .news-box .thumb .info-box  i{font-size:60px;}
.latest-threats  .news-box h3{ width:100%; float:left; font-weight:600; line-height:24px; font-size:20px; margin-top:20px; position:relative;}
.latest-threats  .news-box h3:after{content:''; width:40px; height:1px; background:#27292c; position:absolute; left:0; bottom:-20px;}

/* RESPONSIVE FIXES */

@media only screen and (max-width: 1170px), only screen and (max-device-width: 1170px) {
	
.download img{ width:100%;}

}

@media only screen and (max-width: 768px), only screen and (max-device-width: 768px) {
	
header h1{ font-size:60px;}
.premium-features .spacing{ padding:20px 25px;}
.services img{ width:100%;}
.about-us img{ width:100%; float:left; margin-bottom:30px;}
.team .team-members .member{ margin-bottom:30px;}
.grid li{ width:50%;}
.contact form{ padding-bottom:40px;}

.side-image-content .side-image{ display:none}
.hide-show { display:block;}
.show-hide { display:none;}
.map-tel { width:100%; 
height:300px;}


}

@media only screen and (max-width: 640px), only screen and (max-device-width: 640px) {
	
.navbar-collapse{ background:url(../images/dark-pattern.png); border:none; box-shadow:0 0 30px rgba(-255,-255,-255,0.3);}
.navbar-collapse .navbar-brand { margin-left:32px;}
.navbar-collapse .navbar-nav{ width:100%; float:left; margin-top:30px;}
.navbar-collapse .navbar-nav li{ width:100%; float:left;}
.navbar-collapse .navbar-nav li a{ padding-top:15px; padding-bottom:15px; color:#777;}
.navbar-collapse .navbar-nav li a:hover{ color:#fff; background:none;}

.navbar-collapse .social-media { width:100%; float:left; margin-top:40px; padding-left:30px;}
.navbar-collapse .social-media li{ float:left; margin-right:10px; list-style:none;}
.navbar-collapse .social-media li a{ float:left; color:#777;}
.navbar-collapse .social-media li a:hover{color:#fff;}
.navbar-collapse .social-media li i{ font-size:20px;}
.navbar-collapse .creation{ width:100%; float:left; color:#fff; font-weight:600; font-size:10px; margin-top:20px; padding-left:32px;}
.navbar-collapse .creation i{color:#e23d3d; font-size:14px;}

header{ height:660px;}
header h1{ margin-top:160px;}
header h1 *{font-size:28px !important;}
header h5{ font-size:20px;}
.main-title{ font-size:40px;}
.about-us h5:before{ width:40px;}
.grid li{ width:100%;}
.services ul{ margin-bottom:30px;}
.download .features{ text-align:left !important;}
.download .features i{ float:left; padding-left:0; border-left:0; border-right:1px dotted #27292c;}
.price-table-container{ margin-bottom:30px;}
.latest-news { background:url(../images/map3.jpg); background-size:cover; background-position:center; height:80%;}
.latest-news .news-box h3 { margin-bottom:40px;}
.contact form{ width:95%; float:left; padding-left:20px; padding-top:20px;}

.map-tel { width:100%; 
height:300px;}

.side-image-content .side-image{ display:none}
.hide-show { display:block;}
.show-hide { display:none;}