/*
* Skeleton V1.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 6/20/2012
*/

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */
	
	/****** #colors *******
	
	dark brown :#353535;
	orange : #f8833c;
	orange-button border : #d25509;
	

/* #Site Styles
================================================== */

p{margin-bottom:10px;margin-top:5px;}

a{text-decoration:none;color:#f8833c;}

input{
color:#888;
}

textarea{
overflow:auto;
}

a{
color:#ff8935;
}

p.dark{
font-weight:bold;
}

.align-left{float:left;}
.align-right{float:right;}
.align-center{text-align:center;}
.clear{clear:both;}

.border-line {
  background: none repeat scroll 0 0 #CCCCCC;
  display: block;
  height: 1px;
  width:100%;
}







/*************** border addding  classes ***************/


div>.border-right {
border-right:1px solid #ccc;
}

div>a.border-right {
border-right:1px solid #ccc;
}

div>img.border-right {
border-right:1px solid #ccc;
}



div>.border-bottom{
border-bottom:1px solid #ccc;
}

div>a.border-bottom{
border-bottom:1px solid #ccc;
}

div>img.border-bottom{
border-bottom:1px solid #ccc;
}


div>.border-top{
border-top:1px solid #ccc;
}

div>a.border-top{
border-top:1px solid #ccc;
}


div>img.border-top{
border-top:1px solid #ccc;
}

div>.border-left{
border-left:1px solid #ccc;
}

div>a.border-left{
border-left:1px solid #ccc;
}

div>img.border-left{
border-left:1px solid #ccc;
}


/********* images with border *********/

img.align-left{
padding:4px;
margin-right:10px;
}


img.align-right{
padding:4px;
margin-left:10px;
}


/***************************** Elements ****************************/

/******** Accordion style to (toggle)*************/


.toggle{
float:left;
width:100%;
}

.toggle h5{
background:#f5f5f5 url(../images/accordion.png) no-repeat 10px center;
padding:10px 0 10px 46px;
margin:0;
display:block;
float:left;
width:90%;
}

.toggle .pane {
padding-left:10px;
padding-top:5px;
float:left;
border-bottom:1px solid #ccc;
}


.toggle h5.current{
background:#f5f5f5 url(../images/accordion-a.png) no-repeat 10px center;
}


/************************** blockquotes **************************/

blockquote{
color:#777;
line-height:23px;
font-size:18px;
background:url(../images/blockquote.png) no-repeat 7px 15px ;
padding:20px 0 20px 40px;
border:0;
margin-bottom:40px;
margin-left:20px;
}

blockquote .profile{
float:right;
margin-top:20px;
width:230px;
}



/***** buttons **********/

.btn {
padding:10px;
float:left;
margin-right:10px;
border-radius:3px;
}

.btn.orange{
 background-color: #background-repeat: ff8935;;
 background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
 background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
 background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
 background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
 background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
 color:#fff;
}


.btn.green{
background-color:#9ce661;
border:1px solid #59a41d;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#9ce661), to(#72c92c)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #9ce661, #72c92c); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #9ce661, #72c92c); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #9ce661, #72c92c); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #9ce661, #72c92c); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
}

.btn.purple{
background-color:#cf6dfd;
border:1px solid #8827b6;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#cf6dfd), to(#8827b6)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #cf6dfd, #8827b6); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #cf6dfd, #8827b6); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #cf6dfd, #8827b6); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #cf6dfd, #8827b6); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;

}

.btn.red{
  background-color: #ff3e3e;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff3e3e), to(#f32626));
  background-image: -webkit-linear-gradient(top, #ff3e3e, #f32626);
  background-image:    -moz-linear-gradient(top, #ff3e3e, #f32626);
  background-image:      -o-linear-gradient(top, #ff3e3e, #f32626);
  background-image:         linear-gradient(to bottom, #ff3e3e, #f32626);
border:1px solid #b62727;
color:#fff;
}

.btn.brown{
  color:#fff;
  background-color: #b0876f;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#b0876f), to(#7b543d));
  background-image: -webkit-linear-gradient(top, #b0876f, #7b543d);
  background-image:    -moz-linear-gradient(top, #b0876f, #7b543d);
  background-image:      -o-linear-gradient(top, #b0876f, #7b543d);
  background-image:         linear-gradient(to bottom, #b0876f, #7b543d);
  border:1px solid #7b543d;
}

.btn.black{
  background-color: #6e6e6e;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#6e6e6e), to(#565656));
  background-image: -webkit-linear-gradient(top, #6e6e6e, #565656);
  background-image:    -moz-linear-gradient(top, #6e6e6e, #565656);
  background-image:      -o-linear-gradient(top, #6e6e6e, #565656);
  background-image:         linear-gradient(to bottom, #6e6e6e, #565656);
  color:#fff;
  border:1px solid #434343;
}




.dark-button{
padding:10px 25px;
background:#565656;
background:-moz-linear-gradient(top,#6e6e6e,#565656);
color:#fff;
border-radius:3px;
}

.dark-button:hover{
color:#fff;
}


.btn.medium{
padding:12px 15px 12px 15px;
font-size:13px;
}

.btn.large{
padding:13px 25px;
font-size:14px;
}

.btn.xlarge{
padding:15px 30px;
}

/**** .read is gray button *********/

.read{
background:#f6f6f6;
padding:8px 15px;
border:1px solid #c6c6c6;
color:#666;
font-size:12px;
border-radius:3px;
box-shadow: 0px 1px 1px #ccc;
}

.read:hover{
 background-color: #ff8935;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
 }
 
 
 /*********** hover effect Zoom + zoom with text ************/
 
a .zoom{
position:absolute;
background:#f8833c url(../images/zoom.png) no-repeat center center;
top:0;
left:0;
width:100%;
height:100%;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
opacity:0;
filter: alpha(opacity=0);
-moz-transition:all 0.5s;
-webkit-transition:all 0.5s;
-ms-transition:all 0.5s;
-o-transition:all 0.5s;
}


a .zoom:hover{
opacity:0.8;
filter: alpha(opacity=80);
}


div.zoom-text{
position:absolute;
background:#f8833c;
top:0;
left:0;
width:100%;
height:100%;
text-align:center;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
-webkit-box-sizing:border-box;
opacity:0;
filter: alpha(opacity=0);
-moz-transition:all 0.5s;
-ms-transition:all 0.5s;
-o-transition:all 0.5s;
-webkit-transition:all 0.5s;
}


div.zoom-text div{
margin-left:24%;
}

div.zoom-text:hover{
opacity:0.8;
filter: alpha(opacity=80);
}

div.zoom-text a{
display:inline;
background: transparent;
border:none;
}


.zoom-text h5,.zoom-text p, .zoom-text span{
color:#fff;
padding:10px;
}


/*************** Main ******************/

.main{
background:#fff;
margin-top:30px;
margin-bottom:30px;
-moz-box-shadow: 0 0 2px 1px #ccc;
-webkit-box-shadow: 0 0 2px 1px #ccc;
-ms-box-shadow: 0 0 2px 1px #ccc;
box-shadow: 0 0 2px 1px #ccc;
}



body{font-family: 'PT Sans', sans-serif;color:#888;line-height:18px;font-size:13px;}

h1,h2,h3,h4,h5,h6{
font-family: 'PT Sans', sans-serif;
margin:10px 0 5px 0;
}


/******************** tabs *********************/

.tabs {
float:left;
margin-bottom:0;
position:relative;
background:#f6f6f6;

}



.tabs li{
display:inline;
}

.tabs li a{
padding:10px;
color:#353535;
float:left;
border-right:1px solid #ccc;
}

.tabs li a.current{
background:#fff;
border-bottom:0;
position:relative;
z-index:999;
}

.tab-content{
float:left;
clear:both;
padding-left:20px;
padding-top:20px;
padding-right:20px;
padding-bottom:20px;
}

.tab-content img.border{
float:left;
padding:3px;
border:1px solid #ccc;
background:#fff;
margin-right:10px;
}



.home-tab{
border-right:1px solid #ccc;
}

.home-tab .tabs{
width:100%;
}

.home-tab .tabs:after{
content:"";
position:absolute;
bottom:1px;
width:100%;
height:1px ;
background:#ccc;
left:0;
z-index:888;
}


/*********** #header ******************/

header{
background:#353535;
float:left;
width:100%;
height:123px;
}


header .logo{
float:left;
margin-top:5%;
}

header nav{
float:right;
margin-top:5%;
position:relative;
}


header nav ul li a{
color:#aaa;
display:block;
border-radius:4px;
padding:10px;
}



header nav ul :last-child a{
border-right:none;
}




/********************* Service blocks ********************/

.service{
text-align:center;
background:url(../images/service-bg.jpg);
width:240px;
float:left;
border-bottom:1px solid #ccc;
position:relative;
z-index:9;
padding-top:20px;
min-height:180px;
height:auto;
-moz-transition:all 0.5s;
-webkit-transition:all 0.4s;
-o-transition:all 0.4s;
-ms-transition:all 0.4s;
transition: all 0.5s;
}


.service .grad{
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
z-index:-1;
background:#fa711d;
background: -webkit-gradient(linear, left top, left bottom, from(#fa711d), to(#ff9642)); /* Safari 4+, Chrome */
background: -webkit-linear-gradient(top, #fa711d, #ff9642); /* Chrome 10+, Safari 5.1+, iOS 5+ */
background:-moz-linear-gradient(top, #fa711d, #ff9642); /* Firefox 3.6-15 */
background:      -o-linear-gradient(top, #fa711d, #ff9642); /* Opera 11.10-12.00 */
background:         linear-gradient(to bottom, #fa711d, #ff9642); /* Firefox 16+, IE10, Opera 12.50+ */
-moz-transition:all 0.5s;
-webkit-transition:all 0.5s;
-o-transition:all 0.5s;
-ms-transition:all 0.5s;
transition: all 0.5s;
opacity:0;
filter: alpha(opacity=0);
}

.service:hover .grad {
cursor:pointer;
opacity:1;
filter: alpha(opacity =100);
}

.service p{
padding:0 10px 10px 10px;
margin-bottom:10px;
}

.service p,
.service h5{
-moz-transition:all 0.5s;
-webkit-transition:all 0.4s;
-o-transition:all 0.4s;
transition: all 0.5s;
}
.service:hover p,
.service:hover h5{
color:#fff;
}


.service .img{
margin:auto;
width:60px;
height:60px;
display:block;
background-position:center center;
margin-bottom:5px;
}

.service .img.leaf{
background:url(../images/leaf.png) no-repeat;
background-position:center center;
}

.service:hover .img.leaf{
background:url(../images/leaf-a.png) no-repeat;
background-position:center center;
}

.service .img.mouse{
background:url(../images/mouse.png) no-repeat;
background-position:center center;

}

.service:hover .img.mouse{
background:url(../images/mouse-a.png) no-repeat;
background-position:center center;
}

.service .img.iphone{
background:url(../images/iphone.png) no-repeat;
background-position:center center;

}

.service:hover .img.iphone{
background:url(../images/iphone-a.png) no-repeat;
background-position:center center;
}

.service .img.support{
background:url(../images/support.png) no-repeat;
background-position:center center;

}

.service:hover .img.support{
background:url(../images/support-a.png) no-repeat;
background-position:center center;
}

/********** home page two service *********/

.service-2{
width:200px;
float:left;
border-top:1px solid #ccc;
padding:20px;
}


.service-2 img{
float:left;
margin-top:16px;
margin-right:10px;
margin-bottom:12px;
}


/******************** Gallery  Home page **************/

.description{
width:225px;
float:left;
padding:20px 0 0 20px;
}

.latest-post .description{
width:220px;
}

.description p {
padding:0 15px 0 0;
}



.description.team{
padding:20px 0 0 20px;
width:220px;
}

.gallery{
float:left;
width:100%;
}

.gallery .read{
margin-top:10px
}

.image-box{
float:left;
height:auto;
background:#fff;
}
.image-box a{
display:block;
float:left;
border-width:0 0 0 1px;
border-style:solid;
border-color:#ccc;
padding:4px;
background:#fff;
}

.image-box a figure{
position:relative;
float:left;
}

.image-box img {
float:left;
}


div.image-box.text-hover a{
padding:0;
border:none;
}

div.image-box.text-hover figure{
border-width:0 0 0 1px;
border-style:solid;
border-color:#ccc;
padding:4px;
float:left;
}

div.image-box.text-hover figure .hover{
position:relative;
float:left;
}

div.text-hover .zoom-text div a{
margin-right:10px;
}

/***** social icons inf zoom-text effect ****/


.s-profile{
margin:auto;
text-align:center;
}
.s-profile li{
float:left;
margin:0;
margin:auto;
}


/********** signup form ************/

.name-input{
width:100%;
border:1px solid #ccc;
float:left;
border-radius:3px;
}

.name-input input{
width:129px;
padding:10px 5px;
height:100%;
float:left;
border-right:1px solid #ccc;
border-width:0 1px 0 0;
}

.name-input input.surname{
border-right:0;
}

.signup-box .email{
width:269px;
margin-top:10px;
float:left;
border:1px solid #ccc;
margin-bottom:10px;
padding:10px 5px;
}

.signup-box input[type="submit"]{
background:#f8833c;
border:1px solid #d25509;
padding:7px 17px;
width:auto;
text-shadow:0;
float:right;
color:#fff;
margin-top:15px;
margin-left:10px;
border-radius:3px;
}

/**************** pricing tabel ************/

.price-tabel{
float:left;
width:239px;
background:#f5f5f5;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
padding-bottom:20px;
}

.price-tabel.last{
border-right:0;
}

.price-tabel.advance h4.title{
  background-color: #f37016;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f37016), to(#ff7e2a)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #f37016, #ff7e2a); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #f37016, #ff7e2a); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #f37016, #ff7e2a); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #f37016, #ff7e2a); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
  border-bottom:1px solid #de5705;
}

.price-tabel h4.title{
padding:10px 0 10px 20px;
display:block;
border-bottom:1px solid #ccc;
background:#fff;
margin:0;
}


.price-tabel .price{
float:left;
border-bottom:1px solid #ccc;
background:#fff;
margin:0;
width:199px;
padding:20px;
position:relative;
}

.price-tabel.advance{
   border:1px solid #f37016;
   background:#fff;
   }

.price-tabel.advance .price{
  background-color: #f37016;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f37016), to(#ff7e2a)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #f37016, #ff7e2a); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #f37016, #ff7e2a); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #f37016, #ff7e2a); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #f37016, #ff7e2a); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
}

.price-tabel .read:hover,.price-tabel .read.active{
 background-color: #ff8935;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
}

.price-tabel .price a {
float:left;
font-size:30px;
}
.price-tabel.advance .price a {
color:#fff;
}


.price-tabel .price span{
float:left;
position:absolute;
bottom:15px;
margin-left:2%;
}


.price-tabel .detail{
float:left;
padding-left:20px;
}

.price-tabel .detail p{
margin-top:10px;
}
.price-tabel .detail p a{
color:#f37016;
}

.list{
margin-top:20px;
}

.ok{
background:url(../images/ok.png) no-repeat left center;
padding-left:20px;
}

.not {
background:url(../images/not.png) no-repeat left center;
padding-left:20px;
}



/**** Now all styling is done automatically with freetil jquery plugin 
google it if you don't know about it *****/


/*********************** Headline in home page ************************/

.headline {
  border-bottom: 1px solid #CCCCCC;
  border-top: 1px solid #CCCCCC;
  float: left;
  width: 100%;
  padding:25px 0;

}

.headline h5 {
float: left;
margin-left: 10px;
text-transform: uppercase;
}

.headline .btn{
margin-top:3px;
float:right;
}


/****** button of headling align-right ********/


.headline .dark-button{
margin-right:5px;
float:right;
margin-top:11px;
}

.headline .align-left{
width:84%;
}


.headline span{
float:left;
margin-left:10px;
}


/************ #latest post home page ***************/

.latest-post {
  border-bottom: 1px solid #CCCCCC;
  float: left;
  width: 100%;
}

.latest-post .read{
margin-top:10px;
}

.post-brick{
width:239px;
float:left;
border-left:1px solid #ccc;
position:relative;
}

.post-brick img {
border-bottom:1px solid #ccc;
-moz-box-sizing:border-box;
padding:5px 5px 5px 5px;
}

.post-brick p{
padding:0 20px;
margin-top:0;
}

 .post-brick h6{
margin-bottom:5px;
} 

.post-brick .detail{
float:left;
background:#f5f5f5;
width:238px;
border-top:1px solid #ccc;
margin-top:10px;
}

.post-brick .detail span {
  float: left;
  font-size: 11px;
  margin-left: 10px;
  padding: 5px 15px 5px 23px;
}

.detail span.date{
border-right:1px solid #ccc;
background:url(../images/cal.png) no-repeat left;
}

.detail span.author{
background:url(../images/author.png) no-repeat left;
}


/************* subscribe box ************/

.subscribe-box {
padding:14px 0;
}

.subscribe-box .align-left{
margin-left:10px;
}

.subscribe-box input{
float:left;
margin:0;
width:130px;
border-width:0 1px 0 0;
border-style:solid;
border-color:#ccc;
height:38px;
padding:0 0 0 10px;
}
.signup {
border:1px solid #ccc;
float:left;
margin-top:15px;
margin-left:90px;
}

.signup:last-child input{
border-right:none;
}

.subscribe-box input[type="submit"]{
background:#f8833c;
border:1px solid #d25509;
padding:1px 17px;
width:auto;
text-shadow:0;
color:#fff;
margin-top:15px;
margin-left:10px;
border-radius:2px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
-ms-border-radius:2px;
}

/************* Inner page styling *************/

.page-header{
float:left;
padding:15px;
width:930px;
border-bottom:1px solid #ccc;
}


/************* #about page *****************/

.about-us {
margin:0;
float:left;
border-bottom:1px solid #ccc;
}

.about-us p{
margin-right:10px;
}

.about-us img{
float:left;
margin-right:25px;

}

/****** verticle tabs ******/

.tabs.verticle{
float:left;
width:150px;
min-height:300px;
margin-right:30px;
border:0;
}

.tabs.verticle:after {
  background: none repeat scroll 0 0 #CCCCCC;
  bottom: 1px;
  content: "";
  height: 100%;
  position: absolute;
  left:99%;
  width: 1px;
  z-index: 888;
}


.tabs.verticle li{
display:block;
float:left;
width:150px;
margin-bottom:0;
}

.tabs.verticle li a{
border:0;
width:110px;
padding:15px 20px;
height:100%;
font-style:14px;
border-bottom:1px solid #ccc;
}


.tab-content.verticle{
float:none;
clear:none;
border-right:0;
width:auto;
}

/************* #footer *****************/

#footer {
  background:#353535;
  float: left;
  height: 235px;
  overflow: hidden;
  width: 100%;
}

#footer p{
color:#888;
margin-bottom:10px;
}

#footer h1,#footer h2,#footer h3,#footer h4,#footer h5,#footer h6{
color:#fff;
}

#footer .widget{
margin-top:20px;
}

#footer .widget .small-logo {
  float: left;
  margin-top: 15px;
  margin-bottom:5px;
}

#footer ul li{display:inline;}



.jta-tweet-list-item {
  float: left;
  height: 69px;
  overflow: hidden;
}


.flickritems li{
margin-right:5px;
margin-bottom:3px;
float:left;
}

.flickritems li a img {
  background: none repeat scroll 0 0 #FFFFFF;
  border: 1px solid #CCCCCC;
  height: 42px;
  padding: 2px;
  width: 42px;
}

/******** tooltip**********/

  /* tooltip styling. by default the element to be styled is .tooltip  */
  .tooltip {
    display:none;
    background:#F8833C;
    font-size:12px;
 
    padding:7px 10px 7px 10px ;
	float:left;
    color:#eee;
	opacity:0.9;
	filter: alpha(opacity=90);

  }
  
  
  /* social icons */
  
  #footer #social-icons {
  width:68px;
  }
  
  #social-icons li {
   display: block;
   float: left;
   margin-right: 5px;
	margin-bottom:7px;
	}
	
#social-icons li img {
float:left;
border-radius:3px;
}

	

	
/******************** # Blog page ********************/


.blog .page-header{
border-bottom:0;
}

.blog-section{
float:left;
width:622px;
border-right:1px solid #ccc;
}


.blog-post{
float:left;
border-top:1px solid #ccc;
}


.blog-post figure a {
float:left;
position:relative;
height:100%;

}

/************ Full width: means who take a complete row  of  Blog post area ******/


.blog-post figure.fullwidth{
float:left;
border-bottom:1px solid #ccc;
padding:5px;
background:#fff;
}

.blog-post figure.fullwidth img{
float:left;
}



.blog-post figure.align-left{
float:left;
border-bottom:1px solid #ccc;
padding:5px;
background:#fff;
}

.blog-post figure img.align-left{
border-left:none;
border-top:0;
border-right:1px solid #ccc;
padding:6px;
}



.blog-post section.full-width{
float:left;
width:73%;
margin-left:10px;
}

.blog-post section.right{
margin-right:10px;
}

.blog-post iframe{
float:left;
width:500px;
height:221px;
}


/********** postinfo section , like time, comment ,date and so on section **********/

.post-info{
float:left;
border-right:1px solid #ccc;
margin:0;
width:120px;
}


.ie8 .post-info{
width:120px;
}


.post-info li{
display:block;
text-align:center;
}


.ie8 .post-info li{
display:inline-block;
float:left;
}


.post-info li a{
float:left;
padding:50px 0 30px 0;
width:120px;
background:#f5f5f5;
color:#999;
border-bottom:1px solid #ccc;
}

.post-info:last-child a{
border:0;
}

.post-info li a.author{
background:#f5f5f5 url(../images/blog-author.png) no-repeat center 20px;
}

.post-info li a.date{
background:#f5f5f5 url(../images/clock.png) no-repeat center 20px;
}

.post-info li a.comment{
background:#f5f5f5 url(../images/comment.png) no-repeat center 20px;
}

.post-info li a.tag{
background:#f5f5f5 url(../images/comment-blog.png) no-repeat center 20px;
border:0;
}


/******* Blog style 2 post info small ***********/

.inner .post-info{
margin-right:10px;
}

.inner .blog-post figure img{
margin-left:-10px;
}


.inner .blog-post figure.fullwidth{
border-bottom:0;
position:relative;
}

.inner .blog-post figure.fullwidth:after{
content:"";
width:502px;
bottom:0;
height:1px;
background:#ccc;
left:-10px;
position:absolute;
}


.inner .blog-post figure a .zoom {
  left: -9px;
  width: 102%;
}


.inner .blog-post section.full-width{
float:none;
width:95%;
margin-left:12px;
}


.blog-2>.blog-post iframe {
  float: left;
  height: 230px;
  width: 621px;
}
.blog-2>.blog-post section.full-width {
  float: left;
  margin-left:15px;
  margin-top:10px;
  width:93%;
  margin-bottom:20px;
}


.blog-2>.blog-post figure img{
border:0;
width:612px;
}

.inner .post-info .tag{
border-bottom:1px solid #ccc;
}

.post-info.small{
float:left;
border:0;
margin:0;
width:100%;
background:#f5f5f5;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
}

.post-info.small li{
display:inline;
}


.post-info.small li a{
float:left;
padding:7px 15px 7px 25px;
color:#999;
font-size:12px;
border-right:1px solid #ccc;
margin-left:10px;
border-bottom:0;
text-align:left;
width:auto;
}


 
.post-info.small li a.author{
background: url(../images/blogauthor.png) no-repeat left;
}

.post-info.small li a.date{
background: url(../images/clock-s.png) no-repeat left;
}

.post-info.small li a.comment{
background: url(../images/comment-s.png) no-repeat left ;
}

.post-info.small li a.tag{
background: url(../images/tag-s.png) no-repeat left ;
width:227px;
border-right:0;
}


/********* Blog page pagination **********/

.pagination{
float:left;
border-top:1px solid #ccc;
border-right:1px solid #ccc;
width:100%;
padding:30px 0;
}

.pagination a{
padding:5px 7px;
background:#f5f5f5;
border:1px solid #ccc;
color:#999;
}

.pagination a:hover{
 background-color: #ff8935;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
  
  }
.pagination .align-left{
margin-left:10px;
}
.pagination .align-right{
margin-right:10px;
}


/************* Sidebar **********/

#sidebar{
float:left;
background:#f6f6f6;
width:337px;
border-top:1px solid #ccc;
}

#sidebar .widget{
border-bottom:1px dotted #ccc;
padding:10px 10px 10px 15px;
width:93%;
float:left;
}


/********** search widgets **********/

/******** Search ******/

#sidebar .widget.search{
padding-bottom:15px;
}

.search input{
width:227px;
padding:8px;
background:#fff;
border:1px solid #ccc;
float:left;
margin-right:10px;
color:#888;
font-size:12px;
}

.search input[type='submit']
{
border:0;
text-indent:-9999px;
background:url(../images/search-btn.jpg) no-repeat;
width:37px;
height:32px;
}

/******** tabs ********/

.sidebar-tabs{
border-bottom:0;
padding-top:20px;
}

.sidebar-tabs .tabs li a{
border:1px solid #ccc;
margin-right:10px;
}

.sidebar-tabs .tabs li a.current{
background-color: #ff8935;
background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
color:#fff;
}

/********** tabs content ***********/

.side-container{
clear:both;
float:left;
width:100%;
}

.side-container ul {
float:left;
margin-top:10px;
width:100%;
}

.side-container ul li{
margin-bottom:10px;
margin-top:12px;
width:100%;
float:left;
}


.side-container li img{
float:left;
margin-right:10px;
padding:5px;
border:1px solid #ccc;
background:#fff;
}

.side-container .detail h6{
margin-top:0;
}

.side-container li span{
margin-top:10px;
}

.side-container li .date{
background:url(../images/small-clock.png) no-repeat left center;
padding-left:18px;
margin-right:10px;
border:0;
color:#999;
}
.side-container li .comment{
background:url(../images/small-comment.png) no-repeat left center;
padding-left:18px;
margin-right:10px;
border:0;
color:#999;
}


/****** tags *********/

.widget.tags h5,.widget.archive h5,.accord h5{
margin-bottom:15px;
}
.widget.tags a{
padding:7px 10px; 
color:#999;
border:1px solid #ccc;
text-align:center;
float:left;
margin-right:10px;
margin-bottom:10px;
}

.widget.tags a:hover{
 background-color: #ff8935;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
  }
  

/******* archive ********/
  
  .widget.archive ul li{
  padding:10px;
  border-top:1px solid #ccc;
  margin:0;
  }
  
  .widget.archive li a{
  color:#888;
  }
  
  .widget.archive ul li:hover{
   background-color: #ff8935;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ff8935), to(#fa711d)); /* Safari 4+, Chrome */
  background-image: -webkit-linear-gradient(top, #ff8935, #fa711d); /* Chrome 10+, Safari 5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #ff8935, #fa711d); /* Firefox 3.6-15 */
  background-image:      -o-linear-gradient(top, #ff8935, #fa711d); /* Opera 11.10-12.00 */
  background-image:         linear-gradient(to bottom, #ff8935, #fa711d); /* Firefox 16+, IE10, Opera 12.50+ */
  color:#fff;
  }
  
 
  .widget.archive ul li:hover a{
  color:#fff;
  }
  
  
  
  
/********** accordion sidebar *******/

.accordion{
  height:250px;
  float:left;
  }
  
  .widget .accordion h5{
  margin-bottom:10px;
  background:url(../images/accordion.png) no-repeat left center;
  float:left;
  width:100%;
  height:26px;
  padding-left:36px;
  }
  
  .widget .accordion .pane{
  height:135px;
  }
  
   .widget .accordion .pane p{
   float:left;
   }
   
  .widget .accordion h5.current{
    background:url(../images/accordion-a.png) no-repeat left center;
  }
  
  

/************** comment area *************/

.comment-area{
float:left;
width:100%;
}

.comment-area .head{
float:left;
margin-left:20px;
padding:15px 0;
}

.comment-box{
float:left;
padding-left:100px;
padding-top:20px;
padding-bottom:10px;
position:relative;
border-bottom:1px solid #ccc;
}


.comment-box h6{
float:left;
}
.comment-box  a{
float:right;
position:absolute;
right:6%;
}


.comment-box img{
padding:4px;
background:#fff;
border:1px solid #ccc;
margin-top:10px;
margin-right:10px;
margin-bottom:20px;
position:absolute;
left:4%
}


.comment-box.reply{
background:#f5f5f5;
padding-left:20%;
float:left;
padding-bottom:0;
}

.comment-box.reply .reply {
border-top:1px solid #ccc;
border-left:1px solid #ccc;
border-bottom:0;
padding-bottom:0;
}

.comment-box.reply img{
left:8%
}

.comment-box.reply .reply img{
left:6%
}

.comment-box.reply .reply .reply img{
left:4%
}.comment-box.reply .reply .reply .reply img{
left:2%
}


/**************** comment form *************/

.comment-form{
float:left;
}

.comment-form .detail{
float:left;
margin-left:20px;
}

.comment-form form{
float:left;
margin-left:20px;
}

.comment-form form input{
width:270px;
border:1px solid #ccc;
padding:9px 10px;
color:#888;

}

.comment-form form textarea{
float:left;
width:578px;
height:100px;
border:1px solid #ccc;
margin-top:10px;
}

.comment-form form .read{
float:right;
width:130px;
margin-right:20px;
}


/* #Portfolio
================================================== */

#filter{
float:right;
}
#filter a{
padding:10px;
float:left;
color:#353535;
background:#f5f5f5;
margin-right:10px;
}

#filter a:hover,#filter a.current{
background:#fa711d;
color:#fff;
background: -webkit-gradient(linear, left top, left bottom, from(#fa711d), to(#ff9642)); /* Safari 4+, Chrome */
background: -webkit-linear-gradient(top, #fa711d, #ff9642); /* Chrome 10+, Safari 5.1+, iOS 5+ */
background:-moz-linear-gradient(top, #fa711d, #ff9642); /* Firefox 3.6-15 */
background:      -o-linear-gradient(top, #fa711d, #ff9642); /* Opera 11.10-12.00 */
background:         linear-gradient(to bottom, #fa711d, #ff9642);
}


.portfolio{
float:left;
clear:both;
margin:0;
width:100%;
}

.portfolio li {
margin:0;
display:inline;
}

.portfolio li a{
float:left;
}

.portfolio li a{
margin:0;
padding:5px;
background:#fff;
border-width:0 1px 1px 0;
border-style:solid;
border-color:#ccc;
}

.portfolio.port2 li a {
padding:4px;
}

.portfolio li a figure {
float:left;
position:relative;

}
.portfolio li a figure img{
float:left;
}


/*************Contact page  Map *********/

#map {
  border-bottom: 1px solid #DDDDDD;
  height: 400px;
padding:5px;
  padding: 3px;
  width:952px;
}

#map_canvas {
  height: 400px;
  width: 100%;
}

.contact-detail{
border-right:1px solid #ccc;
padding-top:5px;
}

.contact-form{
border-right:1px solid #ccc;
padding-top:5px;
}

.social-footer {
border-top:1px solid #ccc;
}

.info-block{
padding-top:5px;
}

/*********** Contact form **************/

.contact-form input{
width:200px;
padding:7px;
border:1px solid #ccc;
color:#888;
height:100%;
}

.contact-form textarea{
border:1px solid #ccc;
width:425px;
height:130px;
margin-top:20px;
}

.contact-form .read{
width:120px;
margin-right:25px;

}


#mail_success{
display:none;
}

#mail_fail{
display:none;
}

/******** social icons in footer ******/


.social-footer{
float:left;
width:100%;
}

.social-footer h5{
float:left;
margin-top:24px;
margin-left:10px;

}

.social-footer ul {
float:right;
margin-top:20px;
margin-right:10px;
}
.social-footer ul li {
display:inline;
margin-right:5px;
}




/************ Elements ************/