/*
Title: Main CSS File
Theme Name: Ashoka
Author Name: GeeksLabs
Author URI: http://themeforest.net/user/geekslabs
Website: http://geekslabs.com

NOTE:
------
PLEASE DO NOT EDIT THIS CSS, IF YOU NEED USE "CUSTOM.CSS" FILE FOR WRITING YOUR CUSTOM CSS.
I WILL RELEASE FUTURE UPDATES SO IT WILL OVERWRITE THIS FILE IT'S BETTER USE "CUSTOM.CSS".

Table of Contents:
------------------

1. Basic Elements
2. Content
3. Logo 
4. Menu
5. Video background
6. About Section
7. Instagram Section
8. Clients Section
9. Separator Stats 
10. Team Section
11. Services Section
12. Separator Pramotion section
13. Portfolio Section
14. Testimonials Section
15. Pricing Option
16. Blog Post
17. Separator - LET'S TALK
18. Contact Form
19. Google Map
20. Footer Section
21. Social icons
22. Media Queries

----------------------------------*/
@charset "UTF-8";


/* 1.Basic Styling
-------------------------------------------------------------- */
html, body{
	overflow-x: hidden;
	-webkit-font-smoothing:antialiased;
}

body {
	font-family: "Merriweather",Helvetica,Arial,sans-serif;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.628571;
	color: #666666;
	background: #fff;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
}

a {
	outline: none;
	opacity: 0.9;
	-webkit-transition: background 0.3s false;
	-moz-transition: background 0.3s false false;
	-o-transition: background 0.3s false false;
	transition: background 0.3s;
}
a:hover,a:focus {    
	text-decoration: none;
	outline: none;
	opacity: 1;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Amsi Pro Narw Ultra', sans-serif;
	color: #FE0000;
	text-rendering: optimizelegibility;
	line-height: 1.2em;
}
h3 .sub-title-lg {
	font-family: 'Amsi Pro Narrow Regular', sans-serif;
	color: #FE0000;
	text-rendering: optimizelegibility;
	line-height: 1.2em;
}
.text-light{
	color: #fff;
}

p {
	font-family: "Amsi Pro Narrow Regular", Arial, sans-serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1.628571;
	color: #666666;
	text-rendering: optimizelegibility;
}
strong {
	font-weight: 800;
}
strong.colored {
	color: #029ece;
	font-weight: 800;
}
input[type=text],
input[type=url],
input[type=tel],
input[type=number],
input[type=email],
select,
textarea {
	font-family: "Amsi Pro Narrow Regular", Arial, sans-serif;
	-webkit-transition: all .1s ease-in-out;
	-moz-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;
}

.btn-yellow {
	color: #ffffff;
	background-color: #f5c023;
	border-color: #f5c023;
}

::selection {color:#fff;background-color: #029ece;}
::-moz-selection {color:#fff;background-color: #029ece;}

/* Pre Loader */
#pre-loader {
	position:fixed;
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	vertical-align: middle;
	background: #fff;
	z-index:99999;
}
.pre-loader-container {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	z-index: 3;
	text-align:center;
	background-color: #f5c023;
}
.back-logo {
	z-index:-1;
	color: #F4F4F4;
	position: absolute;
	top:40%;
	left:45%;
	font-size: 50px;
}

.loader {
  position: absolute;
  left: 50%;
  top: 70%;
  margin: -20px 0 0 -20px;
  background-color: white;
  border-radius: 50%;
  box-shadow: 0 0 0 6.66667px #141414;
  width: 40px;
  height: 40px;
}
.loader:before, .loader:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  display: block;
  margin: -21px 0 0 -21px;
  border-radius: 50%;
  z-index: 2;
  width: 42px;
  height: 42px;
}
.loader:before {
  background-color: #141414;
  -webkit-animation: expand 1.6s linear infinite both;
  -moz-animation: expand 1.6s linear infinite both;
  animation: expand 1.6s linear infinite both;
}
.loader:after {
  background-color: white;
  -webkit-animation: expand 1.6s linear 0.8s infinite both;
  -moz-animation: expand 1.6s linear 0.8s infinite both;
  animation: expand 1.6s linear 0.8s infinite both;
}

@-webkit-keyframes expand {
  0% {
	-webkit-transform: scale(0);
  }

  50% {
	-webkit-transform: scale(1);
  }

  100% {
	z-index: 1;
  }
}
@-moz-keyframes expand {
  0% {
	-moz-transform: scale(0);
  }

  50% {
	-moz-transform: scale(1);
  }

  100% {
	z-index: 1;
  }
}
@-o-keyframes expand {
  0% {
	-o-transform: scale(0);
  }

  50% {
	-o-transform: scale(1);
  }

  100% {
	z-index: 1;
  }
}
@keyframes expand {
  0% {
	transform: scale(0);
  }

  50% {
	transform: scale(1);
  }

  100% {
	z-index: 1;
  }
}

/*custom button*/

.btn {
	font-family: "Amsi Pro Narw Ultra", Arial, sans-serif;
	font-weight: 400;
	letter-spacing: 2px;
}
.btn-tr {
	background: transparent;
}
.btn-transparent{
	padding: 15px 40px;
	background: transparent;
	color: #fff !important;
	border-color: #fff;
	text-transform: uppercase;
	cursor: pointer;
	-webkit-transition: background 0.3s false;
	-moz-transition: background 0.3s false false;
	-o-transition: background 0.3s false false;
	transition: background 0.3s;
}
.btn-transparent:hover{
	background: rgba(255,255,255,0.3);
	border-color: #fff;
}
.btn-transparent-text-light{
	padding: 10px 20px;
	background: transparent;
	color: #333;
	border-color: #333;
	text-transform: uppercase;
	cursor: pointer;
	-webkit-transition: background 0.3s false;
	-moz-transition: background 0.3s false false;
	-o-transition: background 0.3s false false;
	transition: background 0.3s;
}
.btn-transparent-text-light:hover{
	background: rgba(0,0,0,0.6);
	border-color: #333;
	color: #fff;
}
.btn-video-wr{
	padding: 15px 40px;
	background: #029ece;
	color: #fff;
	border-color: #029ece;
	text-transform: uppercase;
	cursor: pointer;
	-webkit-transition: background 0.3s false;
	-moz-transition: background 0.3s false false;
	-o-transition: background 0.3s false false;
	transition: background 0.3s;
}
.btn-video-wr:hover{
	color: #fff;
}
.btn-default{
	background-color: transparent;
}

.btn-a {
	background: none;
	color: #fff;
	border: 1px solid #333;
	color: inherit;
	cursor: pointer;
	display: inline-block;
	outline: none;
	position: relative;
	text-transform: uppercase;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.btn-a:hover, .btn-a:active {
	color: #fff;
}
a.btn-a:hover, a.btn-a:active, a.btn-a:focus {
	color: #fff;
	text-decoration: none;
}


.btn-a:hover:after, .btn-a:active:after {
	width: 100%;
}

.btn-a:after {
	background: #333 !important;
	content: '';
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	width: 0%;
	z-index: -1;
}

/* 2. Content
-------------------------------------------------------------- */
.container {
	background: transparent;
}
.container-fluid {
	margin-right: auto;
	margin-left: auto;
	padding-left: 0;
	padding-right: 0;
	position: relative;
	clear: both;
}
/*image mask*/
.image-mask {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/patterns/image-mask.png) center center repeat;
	background-color: rgba(0,0,0,0.2);
	z-index: 2;
}

.section {
	padding-top: 100px;
}

.section-title {
	font-size: 4em;
	font-family: 'Amsi Pro Narw Ultra', sans-serif;
	font-weight: 800;
	padding: 30px 0 0 0;
	margin-bottom: 0px !important;
}
.section-title-border {
	padding: 5px 20px;
}
.section-info {
	padding: 0px 0px 80px 0px;
}
.section-info h3 {
	font-family: "Amsi Pro Narrow Regular",Arial,sans-serif;
	font-size: 2em;
	margin: 12px 0px;
	line-height: 36px;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
}
.section-info p {
	font-family: "Merriweather",Helvetica,Arial,sans-serif;
	font-size: 1.5em;
	font-weight: 400;
	max-width: 80rem;
	margin: 1em auto 0.25em auto;
	letter-spacing: 0;
	line-height: 1.5em;
	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.04);
}
.text-center {
	text-align: center;
}
/*hr*/
.hr {
	margin: 0;
	padding: 0;
	font-size: 0;
	text-align: center;
}
ul.hr li {
	display: inline-block;
}
ul.hr li.hr-line {
	width: 350px;
	height: 4px;
	margin-bottom: 6px;
	border-bottom: 1px solid #a9a9a9;
	border-top: 1px solid #a9a9a9;
}
ul.hr li.hr-icon {
	width: 10%;
	color: #a9a9a9;
	font-size: 28px;
	line-height: 1.5;
}
.circle-point {
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-ms-border-radius: 10px;
	border-radius: 10px;
	display: block;
	width: 12px;
	height: 12px;
	position: absolute;
	right: -7px;
	top: -7px;
	border: 1px solid #bfbfbf;
	background: #fff;
	z-index: 5;
}


/* 3. Logo
-------------------------------------------------------------- */
.logo-wrapper {
	position: fixed;
	z-index: 1000;
	left: 42%;
}
.logo {
	font-family: "Raleway",Arial,sans-serif;
	font-weight: 200;
	color: #fff;
	margin-top: 18px;
}
a .logo:hover {
	text-decoration: none;
}
.logo img {
	margin-top: -10px;
}

/* 4. Menu
-------------------------------------------------------------- */
.navbar {
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	z-index: 99999;
	background: rgb(234, 44, 9, 0.95);
}

.navmenu-open {
	position: fixed;
	z-index: 1000;
	top: 20px;
	right: 40px;
}
#trigger-navbar:hover {
	text-decoration: none;
}
#trigger-navbar span {
	padding: 2px;
	background: rgba(0,0,0,0.2);
	font-size: 3em;
	color: #FFF;
}

/* Overlay closing cross */
.navbar .navbar-close {     
	position: absolute;
	right: 40px;
	top: 10px;
	overflow: hidden;
	text-indent: 200%;
	font-size: 3em;
	color: #FFF;
	outline: none;
	z-index: 100;
}
.navbar .navbar-close:hover{
	text-decoration: none;
}
.navbar .nav-logo {
	top: 0px;
	position: relative;
	padding-top: 0px;
	text-align: center;
}
.navbar nav {   
	position: relative;
	top: 40%;
	text-align: center;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

.navbar ul {
	list-style: none;
	padding: 0;
	margin: 0 auto;
	display: inline-block;
	height: 100%;
	position: relative;
}

.navbar ul li {
	display: block;
	height: 20%;
	height: calc(100% / 5);
	min-height: 54px;
}

.navbar ul li a {
	font-family: "Raleway",Arial,sans-serif;
	font-weight: 800;
	display: block;
	text-transform: uppercase;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
}

.navbar ul li a .primary {    
	font-size: 35px;
	line-height: 22px;
	color: rgba(255,255,255,0.8);
	padding-top: 20px;
}
.navbar ul li a .secondary {
	font-size: 15px;
	visibility:hidden;
	color: rgba(255,255,255,0.6);
	margin-bottom: 5px;
	letter-spacing: 2px;
}
.navbar ul li a .primary, .navbar ul li a .secondary {
	display: block;
}
.navbar ul li a:hover,
.navbar ul li a:focus {
	color: #fff;
	text-decoration: none;
}

.navbar ul li a:hover .secondary{
	color: #fff;
	visibility: visible;
}
/* Effects */
.navbar-hugeinc {
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}

.navbar-hugeinc.open {
	opacity: 1;
	visibility: visible;
	-webkit-transition: opacity 0.5s;
	transition: opacity 0.5s;
}

.navbar-hugeinc nav {
	-webkit-perspective: 1200px;
	perspective: 1200px;
}

.navbar-hugeinc nav ul {
	opacity: 0.4;
	-webkit-transform: translateY(-25%) rotateX(35deg);
	transform: translateY(-25%) rotateX(35deg);
	-webkit-transition: -webkit-transform 0.5s, opacity 0.5s;
	transition: transform 0.5s, opacity 0.5s;
}

.navbar-hugeinc.open nav ul {
	opacity: 1;
	-webkit-transform: rotateX(0deg);
	transform: rotateX(0deg);
}

.navbar-hugeinc.close nav ul {
	-webkit-transform: translateY(25%) rotateX(-35deg);
	transform: translateY(25%) rotateX(-35deg);
}
.navbar footer .nav-footer {
	position: fixed;
	bottom: 20px;
	right: 20px;
	text-align: right;
}
.navbar footer .nav-footer ul {
	list-style: none;
}
.navbar footer .nav-footer ul li {
	display: inline-block;
	display: inline-block;
	min-height: 0px;
	padding-bottom: 10px;
}
.navbar footer .nav-footer ul li a span {
	text-decoration: none;
	background: rgba(255,255,255,0.6);
	border-radius: 50%;
	padding: 6px;
}
.navbar footer .nav-footer ul li a:hover span {
	color: #029ece;
	background-color: #fff;
	text-decoration: none;
	border-radius: 50%;
	padding: 6px;
}
.navbar footer .nav-footer-copy {
	font-size: 12px;
	color: #fff;
}


.navbar .heading-sep {
	width: 25px;
	height: 2px;
	margin: 2px auto !important;
	background: #ffffff;
}

/* 5. Video background
-------------------------------------------------------------- */




/*
.light-patterns #main-wrapper{
	background-image: url(../img/patterns/light/subtle_grunge.png);
}
#main-wrapper{
	background-image: url(../img/patterns/dots-dark.png);
}
*/
.light-patterns .home-text h3,.light-patterns .home-text h2,.light-patterns .home-carousel-caption p,.light-patterns .logo{
	/*color: #333;*/
	color: #FFF;
}
.light-patterns .home-carousel-caption hr{
	border-top: 4px double #333;
}


.light-simple .home-text h3,.light-simple .home-text h2,.light-simple .home-carousel-caption p,.light-simple .logo{
	color: #333;
}
.light-simple .home-carousel-caption hr{
	border-top: 4px double #333;
}

.dark-simple #main-wrapper{
	background-color: #333;
	background-image: none;
}

.dark-simple .home-text h3,.dark-simple .home-text h2,.dark-simple .home-carousel-caption p,.dark-simple .logo{
	color: #fff;
}
.dark-simple .home-carousel-caption hr{
	border-top: 4px double #fff;
}

.overly-mask{
	background: url(../img/patterns/overly-mask.png) center center repeat;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
	width: 100%;
	height: 100%;
}
.home-text{
	color: #fff;
	padding-left: 20px;
	position:relative;
	text-align: center;
	width: 100%;
	z-index:100;
}

.home-text h3{    
	font-family: "Raleway",Arial,sans-serif;
	font-size: 4em;
	letter-spacing: 2px;
	color: #fff;
	font-weight: 400;
	line-height: 1;
	text-transform: uppercase;
}
.home-text h2{
	font-family: "Raleway",Arial,sans-serif;
	font-size: 8em;
	letter-spacing: 2px;
	color: #fff;
	font-weight: 600;
	line-height: 1;
	text-transform: uppercase;
}
.home-carousel-caption p{
	font-family: "Raleway",Arial,sans-serif;
	width: 100%;
	font-size: 2em;
	color: #fff;
	letter-spacing: 2px;
	text-align:center;
	text-transform: uppercase;
}
.home-carousel-caption hr{
	border-top: 4px double #fff;
	margin: 0 auto;
	width: 40%;
}
#home-text-slider .owl-controls{
	display: none !important;
}

#home div.scroll
{
	position:absolute;
	bottom:15px;
	left:50%;
	z-index: 100;
	margin-left:-24.5px
}
#home div.scroll,.footer-text span {
	-webkit-animation: fadein 1s ease-in alternate infinite;
	-moz-animation: fadein 1s ease-in alternate infinite;
	animation: fadein 1s ease-in alternate infinite;
}

@-webkit-keyframes fadein
{
	0%
	{
		opacity:.3
	}
	100%,90%
	{
		opacity:1
	}
}

@-moz-keyframes fadein
{
	0%
	{
		opacity:.3
	}
	100%,90%
	{
		opacity:1
	}
}
@keyframes fadein
{
	0%
	{
		opacity:.3
	}
	100%,90%
	{
		opacity:1
	}
}
#home div.scroll span.scroll-down
{
	color:#FFF;
	display:block;
	font-size:42px;
	width:16px;
	height:30px;
	border:2px solid #FFF;
	position:relative;
	margin:0 auto 5px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	border-radius:10px
}
#home div.scroll span.scroll-down:before
{
	content:'';
	display:block;
	position:absolute;
	top:8px;
	width:2px;
	height:4px;
	background:#FFF;
	left:50%;
	margin-left:-1px;
	-webkit-border-radius:2px;
	-moz-border-radius:2px;
	border-radius:2px
}
#home div.scroll .scroll-text
{
	text-transform:uppercase;
	font-weight:400;
	font-size:12px;
	text-align:center;
	float:left;
	color:#FFF;
	letter-spacing:1px
}

/* 6. About Section
-------------------------------------------------------------- */

#about-listing .listing-wrapper{
	border-right: 1px dashed #bfbfbf;
}

.listing-wrapper-last{
	border: none;
}
.single-title{

	font-size: 2.2em;
	text-transform: uppercase;
	font-family: "Amsi Pro Narw Ultra",Arial,sans-serif;
	font-weight: 800;
	letter-spacing: 2px;
}
.post-list {
	position: relative;
	width: 100%;
	overflow: hidden;
	padding: 20px 40px;
	/*text-align: left;*/
}
.post-list:hover {
	background: rgba(240, 240, 240, 0.1);
	-webkit-transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out;
	-moz-transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out;
	-ms-transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out;
	-o-transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out;
	transition: color 0.2s ease-in-out, background 0.2s ease-in-out, border 0.2s ease-in-out;
}
/*.post-thinkers:before {
	content: "\e007";
	font-family: "ElegantIcons";
	font-size: 5.0em;
	position:absolute;
	bottom:0px;
	right:10px;
	color:#eeeeee;
}

.post-dremers:before {
	content: "\77";
	font-family: "ElegantIcons";
	font-size: 5.0em;
	position:absolute;
	bottom:0px;
	right:10px;
	color:#eeeeee;
}

.post-researchers:before {
	content: "\e029";
	font-family: "ElegantIcons";
	font-size: 5.0em;
	position:absolute;
	bottom:0px;
	right:10px;
	color:#eeeeee;
}
*/



.post-researchers:hover:before,.post-dremers:hover:before,.post-thinkers:hover:before {
	color:rgba(0,0,0,0.1);
}


/* 18. Contact Form
-------------------------------------------------------------- */
#comments {    
	height: 100px;
	margin-bottom: 25px;
	border-bottom: 1px solid #333;
	resize:none;
	background: transparent;

}
#contactform input[type=text]{
	padding-left: 20px;
	background: transparent;
}
#contactform input#email{
	width: 96%;
	background: transparent;
	margin-right:4%;
}
#contactform input#phone{
	width: 96%;
	background: transparent;
	margin-left:4%;
}
#contactform input[type=text]:focus,#contactform input#email:focus,#contactform input#phone:focus,#comments:focus{
	background-color: #fff;
}
.form-control {
	border: none;
}

/* 19. Google Map
-------------------------------------------------------------- */
#map {
	width: 100%;
	height: 350px;
	filter: grayscale(100%);
	filter: gray;
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	transition: all 0.2s linear;
}

#map:hover{
	filter: none;
	-webkit-filter: grayscale(0%);
}
/* 20. Footer Section
-------------------------------------------------------------- */
#footer{
	background-color: #FE0000;
	padding: 5px;
}
#footer .move-up{
	text-align: center;
	margin-top: 10px;
}
#footer .move-up a{
	color: #fff;
	font-size: 22px;
	text-decoration: none;
	border: 4px double #fff;
	padding: 2px;
	-webkit-transition: background 0.3s false;
	-moz-transition: background 0.3s false false;
	-o-transition: background 0.3s false false;
	transition: background 0.3s;
}
#footer .move-up a:hover{
	background: rgba(255,255,255,0.3);
	border-color: #fff;
}
.footer-logo h3{
	margin-top: 11px;
	margin-bottom: 11px;
	font-family: "Raleway",Arial,sans-serif;
}
.footer-text a{
	color: #fff;
}
.footer-logo,.footer-text{
	color: #fff;
	text-align: center;
	font-size: 12px;
}


/* 21. Social icons
-------------------------------------------------------------- */
.soc-item{
	padding: 10px;
}
.soc-item a{
	color: #fff;
	text-align: center;
	font-size: 3em;
	display: block;
	text-decoration: none;
}
.soc-item .count{
	color: #fff;
	text-align: center;
	font-size: 0.4em;
	display: block;
}
#social .facebook:hover,#social .twitter:hover,#social .linkedin:hover,#social .google:hover{
	opacity: 0.9;
}
#social .facebook{
	background: #3B5998;
	webkit-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	box-shadow: inset 0px 0px 0px 2px rgba(255, 255, 255, 0.40);
	border: 6px solid #3B5998;
}
#social .twitter{
	background: #55acee;
	webkit-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	box-shadow: inset 0px 0px 0px 2px rgba(255, 255, 255, 0.40);
	border: 6px solid #55acee;
}
#social .linkedin{
	background: #0976b4;
	webkit-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	box-shadow: inset 0px 0px 0px 2px rgba(255, 255, 255, 0.40);
	border: 6px solid #0976b4;
}
#social .google{
	background: #dd4b39;
	webkit-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	-moz-box-shadow: inset 0px 0px 0px 10px rgba(255, 255, 255, 0.40);
	box-shadow: inset 0px 0px 0px 2px rgba(255, 255, 255, 0.40);
	border: 6px solid #dd4b39;
}
 
/* 22. Media Queries
-------------------------------------------------------------- */

/* Menu Media Queries*/ 
@media screen and (max-height: 30.5em) {
	.navbar nav {
		height: 70%;
		font-size: 34px;
	}
	.navbar ul li {
		min-height: 34px;
		height: 15%;
	}
}

/* Portfolio Media Queries*/ 
@media screen and (max-width: 60em) {    
	.grid li {
		width: 33.3%;
	}
}
 
@media screen and (max-width: 35em) {
	.grid li {
		width: 50%;
	}
}
 
@media screen and (max-width: 24em) {
	.grid li {
		width: 100%;
	}
}


/* Media Queries for Standard Devices
 ---------------------------------------------*/
/* Large screens ----------- */
@media only screen and (min-width : 1824px) {
	.navbar ul li a .primary {
		font-size: 60px;
		line-height: 62px;
	}
}

/* iPads (portrait and landscape) ----------- */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {    

	h2{
		font-size: 24px;
	}
	h3{
		font-size: 22px;
	}
	p{
		font-size: 15px;
	}
	.navbar nav{
		font-size: 34px;
	}
	.navbar ul li a .primary {
		font-size: 30px;
		line-height: 18px;
		padding-top: 18px;
		padding-bottom: 5px;
	}
	.navbar ul li .secondary{
		color: #fff;
		font-size: 15px;
		display: block;
		visibility: hidden;
		line-height: 15px;
	}
	.navbar ul li a:hover .secondary{
		color: #fff;
		visibility: visible;
		font-size: 15px;
	}
	h2.section-title,h2.single-title,h2.work-title,.services-info h2{
		font-size: 2.5em;
	}
	.grid-gallery figcaption h3{
		font-size: 1em;
	}
	.home-text h2{
		font-size: 6em;
	}
	.instagram-caption{
		font-size: 14px;
	}
	.section-info h3{
		font-size: 20px;
		padding: 12px;
	}
	.service-list .service-title {
		font-size: 1.6em;
	}
	.section-info p{
		font-size: 18px;
		padding: 12px;
	}
	.btn-video-wr,.btn-transparent{
		padding: 12px 30px;
		font-size: 18px;
	}
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	h3{
		font-size: 18px;
	}
	p{
		font-size: 14px;
	}
	h1.logo {
		font-size: 30px;
	}
	.logo img {
		margin-top: -10px;
		width: 150px;
	}
	.navmenu-open,.navbar .navbar-close{
		top: 10px;
		right: 10px;
	}
	.navbar nav{
		font-size: 24px;
	}
	.home-text h2{
		font-size: 3em;
	}
	.home-text h3{
		font-size: 2.6em;
	}
	.home-carousel-caption p{
		font-size: 1.2em;
	}
	#testimonial blockquote{
		font-size: 1.2em;
	}
	.section-info h3{
		padding: 12px;
	}
	.section-info p{
		font-size: 16px;
		padding: 12px;
	}
	.service-list .service-title {
		font-size: 1.2em;
	}
	.btn-video-wr,.btn-transparent{
		padding: 8px 20px;
		font-size: 16px;
	}
	.navbar ul li a .primary {
		font-family: "Raleway",Arial,sans-serif;
		font-size: 22px;
		color: rgba(255,255,255,0.8);
		line-height: 22px;
		padding-top: 5px;
	}
	.navbar ul li a .secondary {
		font-size: 12px;
		color: rgba(255,255,255,0.6);
		letter-spacing: 2px;
	}
	.slideshow nav span.nav-prev,.slideshow nav span.nav-next{
		color: #333;
	}
	#work .work-carousel-caption{
		text-align: center;
		right: 0;
		padding: 20px;
	}
	#work .work-content, #work .work-list,#work .work-carousel-caption a{
		display: none;
	}
	#contactform{
		padding: 10px;
	}
	#contactform input#email{
		width: 100%;
		margin-right:0%;
	}
	#contactform input#phone{
		width: 100%;
		margin-left:0%;
	}

	#contactform #comments{
		margin: 0px 0px 10px 0px;
	}
	/*hide theme customizer in mobile*/
	#theme-customizer{
		display: none;
	}
}

/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
	h1.logo {
		font-size: 30px;
	}
	.logo img {
		margin-top: -10px;
		width: 80px;
	}
	.logo-wrapper {
		left: 38%;
	}
}