/* CSS Reset & normalize */
/*
 * EventOn Css Stylesheet using Bootstrap v3.1.1
 *
 * Copyright 2014 Falcon Creative Studio, Inc 
 *
 
	Most of the Styles here are override from boostrap. You can still use bootstraps default using bootsrap class.  Mostly we add unique extra class and customized bootstrap (which means you still able to access bootstrap's default styles).
	
	1. Global Styles.
	2. Common Styles used all over the template.
		2.1 Button (Primary Button, Secondary Button).
		2.2 Social Icon
		2.3  Parallax
	3. Header
		3.1 Main Nav
	4. Banner / Slider.
	5. About
	6. Our Skill
	   6.1 Chart
	7. Team   
	8. Portfolio(Isotope)
	9. Blog & Single Blog
		9.1 Pagination
		9.2 Comments
	10. Aside	
	11. Price Table	
	12. Clients
	13. Contact
	14. Footer

 */
/* CSS Reset & normalize */


/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html,
body {
  height: 100% ;
}

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}


/* ==========================================================================
   Author's custom styles
   ========================================================================== */
body{
	font-family:"Lato", sans-serif;
	background:#fff;	
	font-weight:300;
	font-size:16px;
	line-height:1.5;
	color:#999;
	background:#f2f2f2;
	text-align:left;
}
body :focus{
	outline: none;
}

*, *:before, *:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
} 
/**************************************************
	2. Common Styles used all over the template.
 **************************************************/
h1,h2,h3,h4,h5,h6{
	font-family:"Abril Fatface", Arial, sans-serif;
	color:#333;	
	margin:0px;
	margin-bottom:25px;
}

h2{
	font-size:60px;
	margin-bottom: 25px;
}
h3{
	font-size:50px;
}
h4{
	font-size:40px;
}
h5{
	font-size:30px;
}
h6{
	font-size:21px;
}

a{
	color:#44a0d4;
}
a:hover{
	color:#444;
	text-decoration:none;
}

ul{
	margin:0px;
	padding:0px;
}

.alignleft{
	float: left;
	margin-right: 30px;
}

.alignright{
	float: right;
	margin-left: 30px;
}

.aligncenter{
	float: none;
	width: auto;
	margin: 15px auto;
}
.center {
	text-align: center;
}




/**************************************************
	2.1 Button
 **************************************************/
.btn-pri, .btn-default, #commentform .form-submit #submit{
	background:#00b3f2;
	height:50px;
	padding:0 40px;
	display:inline-block;
	color:#fff;
	font-size:21px;
	line-height:50px;
	text-transform:capitalize;
	box-shadow: 0px 5px 0px #007dc4;
	border-radius: 3px;
	position:relative;
	margin-top: 30px;
}
#commentform .form-submit #submit{
	margin-top: 0;
}
.btn-default{
	padding: 0px 25px;
	font-weight:700;
	font-size:18px;
	overflow:inherit;
	background:#ececec;
	color:#484848;
	box-shadow: 0px 5px 0px #bfbfbf;
	border-radius: 3px;
}

.btn-default:hover{
	top:2px;
	box-shadow: 0px 3px 0px #bfbfbf;
}
.btn-pri:hover, #commentform .form-submit #submit:hover{
	color:#fff;
	top:2px;
	box-shadow: 0px 3px 0px #007dc4;
}
.btn-pri:active,.btn-default:active, #commentform .form-submit #submit:active {
	box-shadow: none;
	top: 6px;
}



/**************************************************
	2.2 Social Icon
 **************************************************/
.icon{
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	border-radius: 50%;
	font-size: 15px;
	background:#222;
	color:#fff;
}

.fa-pinterest,.social-round .fa-pinterest:hover{
	background:#eb5755;
	color:#fff;
}

.fa-twitter,.social-round .fa-twitter:hover{
	background:#44b0e7;
	color:#fff;
}

.fa-facebook,.social-round .fa-facebook:hover {
	background: #3B5999;
	color: #FFF;
}
.fa-google-plus,.social-round .fa-google-plus:hover {
	background: #C43525;
	color: #FFF;
}
.fa-flickr,.social-round .fa-flickr:hover {
	color: #FFF;
	background: #0871CB;
}
.fa-tumblr,.social-round .fa-tumblr:hover {
	background: #36465D;
	color: #FFF;
}

.fa-linkedin,.social-round .fa-linkedin:hover{
	background:#2085c7;
	color:#fff;
}

.fa-dribbble,.social-round .fa-dribbble:hover{
	background:#d97ca6;
	color:#fff;
}
.social-round {
	margin-top:15px;
}
.social-round .icon{
	width: 55px;
	height: 55px;
	line-height: 55px;
	font-size: 36px;
	background:#fff;
	color:#222;
	margin-right:10px;
}


/**************************************************
	2.3 Parallax
 **************************************************/
/* All Parallax Style*/
.parallax{
	padding: 60px 0px;
	text-align: center;
	overflow: hidden;
	background: url(../pic/prkna.jpg) repeat center top fixed;
	background-size: cover;
}

.parallax-bg{
    background:url(../img/parallax-bg.png) repeat center top fixed;
    background-size:cover;
}

.spacer{
	height: 150px;
}

.parallax h2{
	margin-bottom:10px;
	font-size: 54px;
	color: #fff;
}

.parallax p{
	font-size:21px;
	color:#fff;
}

.parallax .btn-pri{
	margin-top:20px;
}

/**************************************************
	3. Header
 **************************************************/

.main-header{
	background: rgba(8, 5, 2, 0.95);
	height: 70px;
	border-bottom: 1px solid #eaeaea;
	line-height: 70px;
}
#logo{
	background: url(../pic/logopruhl.png) no-repeat left top;
	display: block;
	float: left;
	text-indent: -999em;
	height: 50px;
	width: 149px;
	margin-top: 11px;
}


/**************************************************
	3.1 Main Nav
 **************************************************/
.main-nav{
	float:right;
}

.main-nav  li{
	float:left;
	margin-right:25px;
	list-style: none;
}

.main-nav  li:last-child{
	margin-right:0px;
}

.main-nav a{
	color:#ccc;
	text-transform:capitalize;
    font-weight:400;
}

/**************************************************
	4. Banner / Slider.
 **************************************************/

.boxedcontainer		{	max-width: 1170px; margin:auto; padding:0px 30px;}

/*********************************************
	-	SETTINGS FOR BANNER CONTAINERS	-
**********************************************/

.tp-banner-container{
	width:100%;
	position:relative;
	padding:0;
}

.tp-banner{
	width:100%;
	position:relative;
}

.tp-banner-fullscreen-container,.fullscreen-container {
		width:100%;
		position:relative;
		padding:0;
}

.tp-rightarrow.default,.tp-leftarrow.default{
    background:#000;
    text-align:center;
    font-family:"FontAwesome";
    line-height:40px;
     color:#fff;
     opacity:0.5;
}
.tp-rightarrow.default:hover,.tp-leftarrow.default:hover{
    opacity:1;
}
.tp-rightarrow.default:after{
    content:"\f105";
   
}
.tp-leftarrow.default:after{
    content:"\f104";
}

/**************************************************
	Sub Banner
 **************************************************/
.sub-banner h2{
	 font-size:70px;
}


/*section */
.section{
	padding:60px 0;
}

/**************************************************
	5. About
 **************************************************/
#about {
    background: rgb(255,255,255);
    background: -moz-linear-gradient(45deg,  rgba(255,255,255,1) 71%, rgba(255,255,255,1) 71%, rgba(239,239,239,1) 71%);
    background: -webkit-gradient(linear, left bottom, right top, color-stop(71%,rgba(255,255,255,1)), color-stop(71%,rgba(255,255,255,1)), color-stop(71%,rgba(239,239,239,1)));
    background: -webkit-linear-gradient(45deg,  rgba(255,255,255,1) 71%,rgba(255,255,255,1) 71%,rgba(239,239,239,1) 71%);
    background: -o-linear-gradient(45deg,  rgba(255,255,255,1) 71%,rgba(255,255,255,1) 71%,rgba(239,239,239,1) 71%);
    background: -ms-linear-gradient(45deg,  rgba(255,255,255,1) 71%,rgba(255,255,255,1) 71%,rgba(239,239,239,1) 71%);
    background: linear-gradient(45deg,  rgba(255,255,255,1) 71%,rgba(255,255,255,1) 71%,rgba(239,239,239,1) 71%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#efefef',GradientType=1 );
}

#about p{
    font-size:18px;
}
.white{
	background:#fff;
}

.about-img img{
	max-width:100%;
}

.about-content h2{
	margin-bottom:25px;
}
.about-content .btn-pri{
	margin-top:30px;
}



/**************************************************
	6. Our Skill
 **************************************************/

.ourskill{
	font-size:16px;
	text-align: center;
}
.ourskill h2{
	margin-bottom:50px;
}
.skills{
	text-align: center;
}
.skill h3{
	font-size:21px;
	margin-bottom:8px;
	text-transform:uppercase;
}
/**************************************************
	6.1 Chart
 **************************************************/
.chart {
  position: relative;
  display: inline-block;
  width: 200px;
  height: 200px;
  line-height: 209px;
  padding-left: 20px;
  font-size:45px;
  font-family:"Abril Fatface", Arial, sans-serif;
  color:#333;
  margin-bottom:30px;
}
.chart canvas {
  position: absolute;
  top: 0;
  left: 0;
}

.percent {
  display: inline-block;
  line-height: 110px;
  z-index: 2;
}
.percent:after {
  content: '%';
  margin-left: 0.1em;
  font-size: .8em;
}

.sub-content{
	margin-bottom:40px;
	font-size:21px;
}

/**************************************************
	7. Team
 **************************************************/

#team{
	background:#fff;
}
.member{
	text-align: center;
	font-size:14px;
}
.member .team-img{
	width:130px;
	margin:0px auto 20px;
}

.member .title{
	font-size:23px;
	text-transform:none;
	margin-bottom:5px;
}
.member  p{
    font-size: 16px;
    line-height: 1.7;
}
.member .job{
	color:#fb2c69;
	font-size:12px;
	text-transform: uppercase;
    margin-bottom:5px;
}

.member .team-img {
	-webkit-filter: grayscale(1);
	position:relative;
}

.member .team-img img{
	max-width:100%;
	border-radius: 500px;
}

.member .team-img:hover,.member .team-img:hover .social{
	-webkit-filter: grayscale(0);
	visibility:visible;
	cursor:pointer;
}


.member .social{
	position:absolute;
	top: -10px;
	left: 10px;
	visibility:hidden;
}

.member .social a{
	opacity: 0;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}
.member .social a:hover{
	color: #fff;
}
.member .team-img:hover .social a{
	opacity: 1;
	transition: opacity .5s ease-in-out;
   -moz-transition: opacity .5s ease-in-out;
   -webkit-transition: opacity .5s ease-in-out;
}

.member .social a:nth-child(1n){
	margin-left: 30px;
}

.member .social a:nth-child(2n){
	margin-left: 4px;
	margin-top: -12px;
}
.member .team-img:hover .social a:nth-child(2n){
	transition: opacity .8s ease-in-out;
   -moz-transition: opacity .8s ease-in-out;
   -webkit-transition: opacity .8s ease-in-out;
}

.member .social a:nth-child(3n){
	margin-left: -15px;
	margin-top: -2px;
}
.member .team-img:hover .social a:nth-child(3n){
	transition: opacity 1.1s ease-in-out;
   -moz-transition: opacity 1.1s ease-in-out;
   -webkit-transition: opacity 1.1s ease-in-out;
}

.member .social a:nth-child(4n){
	margin-left: -20px;
	margin-top: 3px;
}
.member .team-img:hover .social a:nth-child(4n){
	transition: opacity 1.4s ease-in-out;
   -moz-transition: opacity 1.4s ease-in-out;
   -webkit-transition: opacity 1.4s ease-in-out;
}

.member .social a:nth-child(5n) {
	margin-left: -15px;
	margin-top: 3px;
}
.member .team-img:hover .social a:nth-child(5n) {
	transition: opacity 1.7s ease-in-out;
   -moz-transition: opacity 1.7s ease-in-out;
   -webkit-transition: opacity 1.7s ease-in-out;
}

.member .social a:nth-child(6n) {
	margin-left: 3px;
	margin-top: -3px;
}
.member .team-img:hover .social a:nth-child(6n) {
	transition: opacity 2s ease-in-out;
   -moz-transition: opacity 2s ease-in-out;
   -webkit-transition: opacity 2s ease-in-out;
}

.member .social a:nth-child(7n) {
	margin-top: -13px;
	margin-left: 29px;
}
.member .team-img:hover .social a:nth-child(7n) {
	transition: opacity 2.3s ease-in-out;
   -moz-transition: opacity 2.3s ease-in-out;
   -webkit-transition: opacity 2.3s ease-in-out;
}

.member .social a:nth-child(8n) {
	margin-left: 57px;
	margin-top: -26px;
}
.member .team-img:hover .social a:nth-child(8n) {
	transition: opacity 2.6s ease-in-out;
   -moz-transition: opacity 2.6s ease-in-out;
   -webkit-transition: opacity 2.6s ease-in-out;
}

.member .social .icon{
	display:block;
}



/**************************************************
	8. Portfolio
 **************************************************/
/* nice scroll */
.nicescroll-rails{
	z-index: 99999 !important;
}

.portfolio-center .nicescroll-rails{
	left: auto !important;
	right: 0 !important;
}

/* Start: Recommended Isotope styles */

/**** Isotope Filtering ****/

.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/* End: Recommended Isotope styles */



/* disable CSS transitions for containers with infinite scrolling*/
.isotope.infinite-scrolling {
  -webkit-transition: none;
     -moz-transition: none;
      -ms-transition: none;
       -o-transition: none;
          transition: none;
}


/**** Isotope styles ****/

/* required for containers to inherit vertical size from window */
.options > .sorter {
	text-align: center;
}
.element {
  width: 292px;
  height: auto;
  margin-top:30px;
  float: left;
  overflow: hidden;
  position: relative;
}
.element.col-md-4 {
	width: 390px;
}
.element.col-md-6 {
	width: 585px;
}

.element img{
	max-width:100%;
}
.element h3{
	font-size:18px;
	margin-bottom:5px;
}
.element-content{
	padding:10px;
	background:#fff;
	text-align:left;
}
.element-content .date{
	margin:0px;
	color:#007dc4;
	font-size:12px;
}

/*element-Hover*/

.element-img{
	position:relative;
}
.element-hover{
	background:rgba(0, 0, 0, 0.7);
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	opacity: 0;
	transition: opacity .25s ease-in-out;
   -moz-transition: opacity .25s ease-in-out;
   -webkit-transition: opacity .25s ease-in-out;
}

.element-hover .element-icon{
	position: absolute;
	top: 50%;
	width: 63px;
	background: #1a171b;
	height: 63px;
	line-height: 61px;
	border-radius: 50%;
	border: 3px solid #fff;
	margin-top: -30px;
	margin-left: -30px;
	font-size: 21px;
	color:#fff;
	
}
.element-img:hover .element-hover{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
	transition: opacity .5s ease-in-out;
   -moz-transition: opacity .5s ease-in-out;
    -webkit-transition: opacity .5s ease-in-out;
	}
	
.element-img:hover .element-icon{
	opacity: 1;
}
/**** Example Options ****/
.isotope .collapse {
	display:block;
}
.options {
  margin-bottom: 10px;
  text-align: center;
}

.options h3 {
  margin-bottom: 0.2em;
  font-size: 15px;
}

.options h4 { 
  font-weight: bold;
}

.options ul {
  margin: 0;
  list-style: none;
  display:inline-block;
}

.options ul ul {
  margin-left: 1.5em;
}

.options li {
  float: left;
  margin-right:15px;
}
.options li:last-child{
	margin:0px;
}
.options li a {
  display: block;
  padding: 8px 15px;
  background-color:#fff;
  color: #00a6cf;
  font-size:16px;
  box-shadow: 0px 5px 0px #ccc;
  border-radius: 4px;
  position:relative;
}

.options li a:hover {
    background-color: #e6e6e6;
}


.options li a.selected {
  background-color: #e6e6e6;
  text-shadow: none;
  color: #00a6cf;
}

/* Combination filter options*/

.options .option-combo {
  display: inline-block;
  float: left;
  margin-right: 10px;
}

.options .option-combo ul {
  margin-right: 20px;
  display: inline-block;
}

.options .option-combo h2,
.options .option-combo h4 {
  line-height: 34px;
  margin-bottom: 0;
  margin-right: 5px;
  display: inline-block;
  vertical-align: top;
}

.portfolio, .blog, #team{
	text-align:center;
}

.portfolio h2, .blog h2{
	margin-bottom:15px;
}

/* Portfolio Item */
.overlay{
	opacity: 0.95;
	background: #1a171b;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1100;
}

body.no-scroll{
	overflow: hidden;
}

.portfolio-item{
	position: fixed !important;
	z-index: 1200;
	margin: 0 auto !important;
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	transform: scale(0.5);
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
	left: 0px !important;
	right: 0px !important;
	top: 10% !important;
	bottom: 10% !important;
	background: #FFF;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.75);
}

.portfolio-item.open {
	max-width: 870px;
	width: 90%;
	height: auto;
	overflow: hidden;
}
.portfolio-center {
	position: absolute;
	width: 100%;
}
.portfolio-item.animate{
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	transform: scale(1);
	-webkit-transition: all 0.2s ease;
	-moz-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
.portfolio-nav{
	position: absolute;
	left: 20px;
	top: 20px;
}
.portfolio-nav a{
	font-family: "fontAwesome";
	width: 30px;
	height: 30px;
	display: inline-block;
	margin-right: 5px;
	background: #333;
	background: rgba(0,0,0,0.45);
	border-radius: 50%;
	font-size: 14px;
	color: #fff;
	line-height: 30px;
}

.portfolio-img{
	float: left;
	width: 65%;
}
.portfolio-img img{
	max-width: 100%;
}

.portfolio-img.loading:after{
	content: 'Loading';
}
.portfolio-content-wrap{
	width: 34%;
	float: right;
	padding: 0 30px;
}
.portfolio-content-wrap .btn-pri{
    margin: 30px 0px 40px 0px;
    display: inline-block;
}
.portfolio-content{
	margin-top: 40px;
	text-align: left;
	font-size: 16px;
}

.portfolio-content li{
	list-style: none;
	font-size: 14px;
	margin-bottom: 2px;
}
.portfolio-content li strong{
	color: #1d1d1d;
}

.portfolio-content h3{
	font-size: 23px;
	margin-bottom: 15px;
}

.portfolio-sep{
	width: 48px;
	margin: 15px 0;
	height: 1px;
	background: #00b3f2;
}


/**************************************************
	9. Blog & Single Blog
 **************************************************/

.smallTitle{
	font-size: 40px;
	}

.blog .btn-pri{
	margin-top:40px;
}

.blog h3 a{
	font-size:21px;
	margin-bottom:15px;
	display:block;
	color:#444;
}

.blog h3 a:hover{
	color:#00b3f2;
}

.blog .date{
	font-size:12px;
	margin-bottom:10px;
	text-transform: uppercase;
}

.blog .link{
	margin:5px 0;
	display: inline-block;
	text-transform: capitalize;
}



.main-container{
	padding:80px 0;
}

.blog-post{
	margin-bottom:80px;
}

.blog-post:last-child{
	margin-bottom:0px;
}

.blog-post .category{
	float:left;
	text-align:right;
	width: 100%;
}

.blog-post .category a{
	color:#ababab;
}

.blog-post .category a:hover{
	color:#00b3f2;
}

.blog-post .category .date{
	padding-bottom:10px;
	border-bottom:2px solid #00b3f2;
}

.blog-post .category .date span{
  font-family:"Abril Fatface", Arial, sans-serif;
  font-size:60px;
  color:#333;
  display:block;
}
.blog-post .category .fa{
    margin-left:5px;
}

.single-post .blog-post-content{
	margin-bottom: 30px;
}

.blog-content{
	text-align: left;
	padding:40px;
	background:#fff;
}
.blog-content p{
		font-size:16px;
}


.blog-post-content h3 {
	font-size:21px;
	margin-bottom:20px;
}

.blog-post-content h3 a{
	color:#333;
}

.blog-post-content .btn-pri{
	margin: 15px 0px 7px 0;
	font-size:16px;
	padding:0px 25px;
}

.blog-post-img {
	text-align: left;
	
}
.blog-post-img img{
	max-width:100%;	
}

/**************************************************
	Single Blog Post
 **************************************************/
.single-post{
	margin-bottom:30px;	
}
.single-post.blog-post-content p{
	margin-bottom:25px;
}

.single-post.blog-post-content p:last-child{
	margin:0px;
}

.reply-form .btn-pri{
	font-size: 18px;
	padding: 0px 25px;
	border:none;
}

/**************************************************
	9.1 Pagination
 **************************************************/

.pagination{
	display: block;
	margin: -40px 0px 0px 155px;
	margin-left: 26%;
}
.pagination li{
	list-style:none;
	float:left;
}
.pagination li .page-numbers{
	width: 34px;
	height: 32px;
	display: inline-block;
	background: #fff;
	margin-right: 10px;
	line-height: 32px;
	color:#696969;
	box-shadow: 0px 5px 0px #ccc;
	border-radius: 4px;
	position:relative;
}

.pagination li .page-numbers.current, .pagination li .page-numbers.current:hover{
	background:#E6E6E6;
	cursor:default;
	color:#696969;
	box-shadow: 0px 5px 0px #ccc;
}

.pagination li .page-numbers:hover{
	background:#00b3f2;
	color: #fff;
	box-shadow: 0px 5px 0px #007DC4;
}

/**************************************************
	9.2 Comments
 **************************************************/

.comment-section,.reply-form{
	background:#fff;
	padding:40px;
	text-align:left;
	border-bottom:5px solid #f2f2f2;
}
.reply-form{
	border-bottom: none;
}

.comment-section h2,.comment-respond h3{
	font-size:28px;
	margin-bottom:30px;
}
.alert.alert-info{
	font-size: 12px;
}
.comment-section h2 span{
	color:#00b3f2;
}

.comment-section li{
	list-style:none;	
}

.comment-section{
	padding-bottom:0px;
}

.comment-section li .comment, .comment-section ul.children li .comment{
	margin-bottom: 40px;
	border-bottom: 1px solid #e0e0e0;
	padding-bottom: 40px;
}

.comment-section li:last-child .comment{
	margin-bottom: 40px;
	padding-bottom: 30px; 
   
}


.comment-section .author-img{
	float: left;
	margin-right: 20px;
	border: 1px solid #e0e0e0;
	width: 90px;
	height: 90px;
	border-radius: 50%;
	padding: 1px;
}

.comment-section .author-img img{
	border-radius: 50%;
}
.comment-section .author{
	color:#00b3f2;
	margin:0px;
	font-size:16px;
}
.comment-section .date{
	font-size:12px;
	text-transform:capitalize;
	margin-bottom:20px;
}

.comment-section .comment-content{
	overflow:hidden;
}

.comment-section .btn-default{
	margin-top:15px;
	text-transform: uppercase;
	font-size: 12px;
	padding: 0 20px;
	line-height: 38px;
	height: 36px;
	border-radius: 2px;
	color: #3c3c3c;
}
.comment-section .btn-default:hover{
	color: #3c3c3c;
}

.comment-section p{
	font-size:16px;
}

.comment-section .children{
	margin-left: 30px;
}

/*reply-form*/
.comment-respond input{
	background:#e9e9e9;
	border:none;
	height:40px;
	width:210px;
	padding:0px 10px;
	font-size: 15px;
}	

.comment-respond textarea{
	background:#e9e9e9;
	width:100%;
	max-width: 420px;
	border:none;
	padding:10px;
	font-size: 15px;
}

.comment-respond  p{
	margin-bottom:20px;
}
.comment-respond p:last-child{
	margin:0px;
}
.comment-respond  button{
	margin-top:10px;
	outline:none;
	border:0px;
}


/**************************************************
	10. Aside
 **************************************************/
aside{
	text-align:left;
	font-size: 14px;
}
aside .widgettitle,.screen-reader-text{
	font-family: "Abril Fatface", Arial, sans-serif;
	color: #333;
	font-size:24px;
	margin-bottom:25px;
	font-weight:normal;
}
.screen-reader-text{
	display:inherit;
}
aside .widget{
	margin-bottom:30px;
}
#searchform{
	margin-bottom:35px;
	max-width:300px;
}
aside .widget #s{
	width: 74%;
	float: left;
	border: 0;
	height: 35px;
	padding: 0px 10px;
	font-size: 14px;
	box-shadow: 0px 5px 0px rgba(0, 0, 0, 0.05);
}
#searchsubmit{
	float: left;
	height: 35px;
	line-height: 16px;
	 border: 0; 
	border-radius: 0;
	font-size: 14px;
	padding: 10px;
	margin-top: 0;
	width: 20%;
	text-align: center;
	outline:none;
}
aside .widget ul{
	list-style:none;
	padding-bottom:30px;
}

aside .widget .border{
	height:2px;
	width:100px;
	background:#00b3f2;
}

aside .widget a{
	font-size:14px;
	color:#ababab;
}
aside .widget li{
	margin-bottom:10px;
	font-size:14px;
}
aside .widget:last-child,aside .widget li:last-child{
	margin-bottom:0px;
	padding-bottom:0px;
	border:none;
}
.textwidget{
	margin-bottom:30px;
	font-size:16px;
}
.tagcloud a{
	font-size: 14px !important;
	background: #00b3f2;
	padding: 10px 15px;
	color: #fff !important;
	margin-right: 10px;
	display: inline-block;
	margin-bottom: 15px;
}
.tagcloud a:hover{
	color:#fff !important;
}
.tagcloud{
	margin-bottom:5px;
}
.widget_calendar #wp-calendar{
	width:100%;
	max-width:300px;
	margin-bottom:20px;
}
.widget_calendar th,.widget_calendar td{
	text-align:center;
}
.widget_calendar caption{
	margin-bottom:8px;
}
.widget_calendar #next{
	text-align:right;
	padding-top:10px;
}
.widget_calendar #prev{
	text-align:left;
	padding-top:10px;
}


/**************************************************
	11. Price Table
 **************************************************/
.price-table{
	text-align:center;
}

.price-table h2{
	margin-bottom:15px;
}

.price-table-container{
	padding-top:50px;
	text-align: center;
}

.price-plan{
	border:1px solid #c0c0c0;
}

.price-plan h3{
	font-size:36px;
	margin-bottom:3px;
	word-break: break-word;
}

.price-plan header{
	min-height: 110px;
	padding: 30px 10px;
}

.price-plan header p{
	font-size:12px;
	text-transform:uppercase;
	margin:0px;
}

.price-content{
	list-style:none;
	background:#fff;
	text-align:left;
}
.price-content li{
	border-top:1px solid #e4e4e4;
	padding:10px 40px; 
	font-size:16px;
}
.price-content li:last-child {
	border-bottom: 1px solid #E4E4E4;
}

.price-content .icon-right{
	margin-right:10px;
}

.price-content span{
	font-size:19px;
	color:#4f5253;
	margin-right:10px;
}

.price{
	font-family:"Abril Fatface", Arial, sans-serif;
	margin:0px;
	font-size:60px;
	line-height:1;
	color:#353535;
	margin-bottom:4px;
	padding-top: 30px;
	border-top: 1px solid #FFF;
}

.price .currency{
	font-size:30px;
	vertical-align:top;
	padding-top: 4px;
	display: inline-block;
}

.price .month{
	margin:7px 0 13px;
	font-size:12px;
	display: block;
	color: #999;
	text-transform: uppercase;
	font-weight: normal;

}
.price-plan .btn-pri{
	margin-bottom: 40px;
    margin-top: 20px;
}
.popular-plan{
	padding:13px 0;
	margin:0px;
	color:#fff;
	font-size:18px;
	text-shadow: 0px 2px 0px rgba(0, 0, 0, 0.25);
	text-transform:capitalize;
	background: #0080c9;
	background: -moz-linear-gradient(top,  #0080c9 0%, #00aeef 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0080c9), color-stop(100%,#00aeef));
	background: -webkit-linear-gradient(top,  #0080c9 0%,#00aeef 100%);
	background: -o-linear-gradient(top,  #0080c9 0%,#00aeef 100%);
	background: -ms-linear-gradient(top,  #0080c9 0%,#00aeef 100%);
	background: linear-gradient(to bottom,  #0080c9 0%,#00aeef 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0080c9', endColorstr='#00aeef',GradientType=0 );

}
.popular-plan p{
    margin-bottom:0px;
}
.bestPlan{
	margin-top:-20px;
}
.popular-plan .icon-star{
	color:#007ab1;
	text-shadow:none;
	margin-right:10px;
}

/**************************************************
	12. Clients
 **************************************************/
.clients {
	text-align:center;
}

.clients h2{
	margin-bottom:40px;
}

.clients-slide .clients-img{
	padding-top: 20px;
	padding-right: 77px;
	padding-left: 78px;
	padding-bottom: 20px;
	border-right: 1px solid #b3b3b3;
}

/**************************************************
	13. Contact
 **************************************************/
.contact{
	text-align:center;
}

.contact h2{
	margin-bottom:30px;
}
#contactform{
	text-align:left;
}
#contactform .error{
	color: #FF3737;
	font-size: 12px;
}
#contactform .success{
		color:#2EC464;
		font-size:14px;
}
#contactform .success p{
	margin-bottom:0px;
}
#contactform input{
	width:100%;
	border:0;
	height:43px;
	padding:0px 10px;
	background: #e9e9e9;
	font-size:14px;
}

#contactform textarea{
	width:100%;
	padding:10px;
	border:none;
	height: 188px;
	background: #e9e9e9;
	font-size:14px;
}

.grey #contactform textarea, .grey #contactform input{
	background: #fff;
}

#contactform .btn-pri{	
	float:right;
	outline:none;
	border:none;
	margin-top: 0;
}

#contactform p{
	margin-bottom:30px;
}

.contact-info{
	text-align:left;
	margin-top:25px;
}

.contact-info h3 {
	font-size: 21px;
	margin-bottom: 25px;
}

.contact-info li{
    margin-bottom: 10px;
    font-size: 14px;
    line-height: 1.7;
}

.fa-li{
	color:#333; 
    top:5px;
}


/**************************************************
	Map
 **************************************************/
.map{
	margin: 0px auto;
	width: 100%;
	height: 400px;
}


/**************************************************
	Footer
 **************************************************/

.main-footer{
	padding:10px 0; 
	text-align:center;
}

.main-footer p{
	margin:0px;
}


/*color*/
a,.main-nav li.active a,.main-nav a:hover,.blog-post-content h3 a:hover,aside .widget a:hover{
	color:#44a0d4;
}


/**************************************************
	Responsive
 **************************************************/


@media (max-width: 1199px) {
	.element.col-md-6 {
		width: 50%;
	}
	.element.col-md-4 {
		width: 33.33%;
	}
	.element.col-md-3 {
		width: 25%;
	}
}

@media (max-width: 1024px) {
	
	.blog .link{
		margin-top:5px;
	}
	
	.element-hover .element-icon{
		width: 50px;
		height: 50px;
		line-height: 50px;
		font-size: 14px;
		border: 2px solid;
		margin-left: -25px;
		margin-top: -25px;

	}
	
	.bx-viewport{
		width:86% !important;
		margin:0 auto;
		left:-4px;
	}
	.bx-wrapper .bx-prev {
		left:0;
	}
	
	.bx-wrapper .bx-next {
		right:0;
	
	}
	
	.clients-slide .clients-img{
			padding:10px 15px;
	}
	.price-content li{
		padding: 10px 15px;
	}
	.popular-plan .icon-star {
		margin-right: 6px;
	}
	.price-plan .btn-pri {
		padding: 0 15px;
	}

}

@media (max-width: 992px) {
	.container{
		max-width: 900px;
		width: 100%;
	}
	.skill.col-sm-6:nth-child(2n+1) {
		clear: both;
	}
	.member.col-sm-3:nth-child(4n+1) {
		clear: both;
	}
    .parallax {
        background-size: cover !important;
        background-position: center center !important;
        background-attachment: initial !important;
    }
	
}
@media (max-width: 767px) {

	body{
		padding-top: 0;
	}

	.container{
		max-width: 520px;
	}
	.main-header{
		position: relative;
		z-index: 499;
	}
	.main-nav.navbar-collapse {
		clear: both;
		width: 100%;
		background: #FFF;
		padding: 0;
		margin: 0;
		max-height: none;
		left: 0;
		padding-left: 15px;
		padding-right: 15px;
		position: absolute;
		top: 70px;
		text-align: left;
	}
	#menu-main-menu {
		max-width: 490px;
		margin-left: auto;
		margin-right: auto;
		width: 100%;
	}
    
    
	.main-nav li {
		float: none;
		margin-right: 0;
		line-height: 45px;
	}

	.bx-viewport{
		width:80% !important;
	}
	.blog-post .category{
		text-align: left;
	}
	.blog-content{
		padding: 20px;
	}
	
	.pagination{
		margin-left: 0;
		margin-bottom: 30px;
	}
	.price-plan h3{
		font-size:31px;
	}
	
	.price-content li{
		padding:10px 6%;
	}
	
	.parallax{
		height: auto !important;
	}
	.parallax h2{
		font-size: 1.8em;
	}
	.parallax .spacer{
		display: none;
	}

	.navbar-toggle, .navbar-toggle.collapsed{
		line-height: 1;
		box-shadow: 0px 4px 0px #ccc;
		border-radius:4px;
		margin: 15px 0;
		color: #ccc;
		position:relative;
		border:1px solid #eaeaea;
		outline:none;
		cursor:pointer;
	}
	.navbar-toggle{		
		box-shadow: none;
	}
	
	.portfolio .element.col-md-6, .element.col-md-6{
		width: 100%;
	}
	.portfolio .element.col-md-4, .portfolio .element.col-md-3, .element.col-md-4, .element.col-md-3 {
		width: 50%;
	}
	.isotope .collapse{
		display:block;
	}
	.bestPlan{
		margin-top: 0;
	}
	img{
		max-width: 100%;
		height: auto;
	}
	/*blog*/
	aside .widget{
		width:100%;
	}
	
	.options li {
		margin-right:0;
		float:none;
	}
	
	.options li a {
		box-shadow:none;
		border-radius:0;
		width:250px;
	}
	
	.options li a:hover{
		top:0px;
	}
	.isotope .collapse{
		display:none;
	}
	.isotope .navbar-toggle{
		margin: 0 auto;
		display: inline-block;
		float: none;
		width: 250px;
	}

	.price-table-container {
		padding-top:30px;
	}
	.price-container{
		margin-bottom:30px;
		text-align:center;
	}
	.price-container:last-child{
		margin:0px;
	}
	#contactform .btn-pri{
		float: left;
	}
}
@media (max-width: 670px) {
	.portfolio-content{
		width: 100%;
		margin-top: 30px;
	}
	.portfolio-img{
		
        width: 100%;
     
        height: 250px;
	}
    .portfolio-img img{
        max-height:100%;
     }
     .portfolio-content-wrap{
        width:100%;
        height:100% !important;
     }
     .portfolio-item.animate{
         overflow-y: scroll;
      }
}
@media (max-width: 540px) {
	.bx-viewport {
		width: 80% !important;
	}
	#contactform{
		margin-bottom:50px;
	}
	#contactform .btn-pri{
		float:left;
	}
	.portfolio .element.col-md-6, .element.col-md-6{
		width: 100%;
	}
	.portfolio .element.col-md-4, .portfolio .element.col-md-3, .element.col-md-4, .element.col-md-3 {
		width: 49.9%;
	}
	
}
@media (max-width: 480px) {
	.container{
		max-width: 300px;
	}	
	#menu-main-menu {
		max-width: 270px;
	}
	.portfolio .element.col-md-6, .element.col-md-6,.portfolio .element.col-md-4, .portfolio .element.col-md-3, .element.col-md-4, .element.col-md-3{
		width: 100%;
	} 
	
	.member{
		float:none;
		margin:0 auto 30px;
	}
	
	.member:last-child{
		margin-bottom:0px;
	}
	
	
	.bx-viewport {
		width: 70% !important;
	}
}
@media (max-width: 320px) {
	.bx-viewport {
		width: 50% !important;
	}
}
/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */

@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}