/*
* Based on Skeleton by Dave Gamache (www.getskeleton.com)
*/


/* Table of Contents */

/* 

    Base 960 Grid
    Tablet (Portrait)
    Mobile (Portrait)
    Mobile (Landscape)
    Clearing 
	
*/



/* Base 960 Grid */
#content	           { margin: 0 auto; position:relative; z-index: 2;}
.boxed #content	   { margin: 30px auto; margin-top: 0; width: 990px; -moz-box-shadow: 0 0 5px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3); box-shadow: 0 0 5px rgba(0,0,0,0.3);}
.container               { position: relative; width: 960px; margin: 0 auto; }
#body-bar .container { width: 960px; }
#header .container { width: 920px; }
.column, .columns         { float: left; display: inline; margin-left: 30px; position:relative; }
.row                           { position:relative; margin-bottom: 20px; clear:both; }

/* Nested Column Classes */
body .column.alpha, body .columns.alpha, body div .first       { margin-left: 0; clear: left;}

/* Base Grid */
.container .one.column                      	{ width: 52.5px  }
.container .two.columns                     	{ width: 135px; }
.container .three.columns                   { width: 217.5px; }
.container .four.columns                    	{ width: 300px; }
.container .five.columns                    	{ width: 382.5px; }
.container .six.columns                     	{ width: 465px; }
.container .seven.columns                   { width: 547.5px; }
.container .eight.columns                   { width: 630px; }
.container .nine.columns                    	{ width: 712.5px; }
.container .ten.columns                     	{ width: 795px; }
.container .eleven.columns                 { width: 877.5px; }
.container .twelve.columns                 { width: 960px; margin-left:0}


/* Offsets */
#body .offset-by-one                   { padding-left: 80px;  }
#body .offset-by-two                   { padding-left: 160px; }
#body .offset-by-three               { padding-left: 240px; }
#body .offset-by-four                 { padding-left: 320px; }
#body .offset-by-five                 { padding-left: 400px; }
#body .offset-by-six                   { padding-left: 480px; }
#body .offset-by-seven               { padding-left: 560px; }
#body .offset-by-eight               { padding-left: 620px; }
#body .offset-by-nine                 { padding-left: 700px; }
#body .offset-by-ten                   { padding-left: 780px; }
#body .offset-by-eleven             { padding-left: 860px; }

.partners-title { padding: 10px; background: #12a4b3 url(../images/pattern.png); padding-left: 30px;	padding-top: 16px; padding-bottom: 16px;}

.partners .partners_images { float: left; }


#container-blog-two-col div.one_half { overflow: hidden; margin-left: 20px; width: 295px; float: left; position: relative; margin-bottom: 60px; }
 
#template-blog-masonry #container-blog-two-col { width: 630px; position: relative; left: -20px; }


#container-blog-full div.one_half { overflow: hidden; margin-left: 20px; width: 455px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }

#container-blog-full div.one_third{ overflow: hidden; margin-left: 20px; width: 296px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
 
#template-blog-masonry #container-blog-full { width: 950px; position: relative; left: -20px; }


#container-blog-two-col .one_half .blog-image {	width: 295px; height: 94px; }

#container-blog-full .one_half .blog-image { width: 455px; height: 141px; }

#container-blog-full .one_third .blog-image {	width: 295px; height: 94px; }

#portfolio .one_fourth	{	overflow: hidden; margin-left: 0; width: 211px; height: auto; float:left; position:relative; padding-bottom: 0; }

#portfolio .one_third	{	overflow: hidden; margin-left: 0; width: 295px; height: auto; float:left; position:relative; padding-bottom: 0; }

#portfolio .one_half	{	overflow: hidden; margin-left: 0; width: 460px; height: auto; float:left; position:relative; padding-bottom: 0; }





/* Tablet (Portrait) */

/* Note: Design for a width of 768px, Gutter: 30px, column: 34px */
@media only screen and (min-width: 768px) and (max-width: 1024px) {

































































































































































}


/*  Mobile (Portrait) */

/* Note: Design for a width of 320px */

@media only screen and (max-width: 419px) {
	.boxed #content  { width: 318px;  }
	.container { width: 320px; }

	#body-bar .container { width: 320px; }
	#main-content #container { width: 320px; }
	#page-title .container { width: 320px; }
	#header .container { width: 320px; }

	#slideshow_big .container { width: 320px; }

	.columns, .column { margin: 0; }

	.container .one.column,
	.container .two.columns,
	.container .three.columns,
	.container .four.columns,
	.container .five.columns,
	.container .six.columns,
	.container .seven.columns,
	.container .eight.columns,
	.container .nine.columns,
	.container .ten.columns,
	.container .eleven.columns,
	.container .twelve.columns,
	#body .one_fifth,			
	#body .one_fourth,		
	#body .one_third,			
	#body .two_fifth,			
	#body .one_half,			
	#body .three_fifth,		
	#body .two_third,			
	#body .three_fourth,		
	#body .four_fifth { margin-left: 0; margin-bottom: 20px; width: 320px; }

	#body-bar .container .one.column,
    #body-bar .container .two.columns,
    #body-bar .container .two.columns,
    #body-bar .container .three.columns,
    #body-bar .container .four.columns,
    #body-bar .container .five.columns,
    #body-bar .container .six.columns,
    #body-bar .container .seven.columns,
    #body-bar .container .eight.columns,
    #body-bar .container .nine.columns,
    #body-bar .container .ten.columns,
    #body-bar .container .eleven.columns,
    #body-bar .container .twelve.columns,
	#body #body-bar .full,	
    #body #body-bar .one_fifth,			
	#body #body-bar .one_fourth,		
	#body #body-bar .one_third,			
	#body #body-bar .two_fifth,			
	#body #body-bar .one_half,			
	#body #body-bar .three_fifth,		
	#body #body-bar .two_third,			
	#body #body-bar .three_fourth,		
	#body #body-bar .four_fifth { width: 320px; margin-left: 0; margin-bottom: 20px; }

	.social_bookmarks { float: left; margin-top: 0; }

	/* Offsets */
	#body .offset-by-one,
	#body .offset-by-two,
	#body .offset-by-three,
	#body .offset-by-four,
	#body .offset-by-five,
	#body .offset-by-six,
	#body .offset-by-seven,
	#body .offset-by-eight,
	#body .offset-by-nine,
	#body .offset-by-ten,
	#body .offset-by-eleven{ padding-left: 0; }
	
	.partners div {	text-align: center;	}
	
	.partners-title { padding: 10px; background: #12a4b3 url(../images/pattern.png); padding-left: 30px; margin-right: 20px;	padding-top: 16px; padding-bottom: 16px;}
	
	.partner-arrow { margin-right: 20px; }
	
	.top-info {float: left;}
	
	.top-info span {margin-left: 0; margin-right: 20px;}
	
	.partners .partners_images { float: none; }
	
	.contactform textarea { max-width: 298px; }

	.input-textarea, .comment_input  { max-width: 218px; }
	
	.widget { width: 260px; }
	
	#search_field_block { width: 160px; }
	
	#template-blog-masonry div .one_third { overflow: hidden; margin-left: 0; padding-right: 0; width: 300px; float: left; position: relative; margin-bottom: 20px; }
	
	
	#container-blog-two-col div.one_half { overflow: hidden; margin-left: 0; width: 300px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
 
	#template-blog-masonry #container-blog-two-col { width: 300px; float: left; left: 0; }
	
	
	#container-blog-full div.one_half { overflow: hidden; margin-left: 0; width: 300px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
	
	#container-blog-full div.one_third { overflow: hidden; margin-left: 0; width: 300px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
 
	#template-blog-masonry #container-blog-full { width: 300px; float: left; left: 0; }
	
	
	.post-v2 { width: 320px; }
	
	.post-meta { width: 320px; }
	
	.post-v2 .post-content { width: 320px; float: left; }
	
	
	.post-page-content { width: 320px; }
	
	.post-page-content .post-content { width: 320px; float: left; }
	
	.post-comments { width: 320px; float: left; }
	
	
	.project-page-content { width: 320px; }
	
	.project-page-content .post-content { width: 320px; float: left; }
	
	
	#comments { width: 320px; }
	
	.comments { width: 320px; }
	
	.comment_here { width: 320px; }
	
	.comment_here .contactform textarea{ width: 298px; }
	
	
	#price-table .pack { width: 100%; }



	#portfolio .one_fourth	{ width: 100%; height: auto; float:left; }

	#portfolio .one_third	{ width: 100%; height: auto; float:left; }

	#portfolio .one_half	{ width: 100%; height: auto; float:left; }


	.project-title-content, .one_third .project-title-content, .one_half .project-title-content { margin-top: 141px;	width: 240px; }

	.project-title-content .project-title-bg, .one_third .project-title-content .project-title-bg, .one_half .project-title-content .project-title-bg { width: 240px; }


	#container-blog-two-col .one_half .blog-image {	width: 240px; height: 76px; }

	#container-blog-full .one_half .blog-image { width: 240px; height: 76px; }

	#container-blog-full .one_third .blog-image {	width: 240px; height: 76px; }

	#body #slogan .container .full, #body #slogan .container { width: 300px; }


	#error404 {	width: 320px; }	


	.body { width: 320px; }


	.twitter-block { width: 310px; }


	.one_fourth img {
		width: 320px;
		height: 178px;
	}

	.one_third img {
		width: 320px;
		height: 178px;
	}

	.one_half img {
		width: 320px;
		height: 178px;
	}


	#banner .body { height: 210px; }

	.container_wrap { margin-top: 100px; }

	#banner nav { margin-top: 30px; }

	.mobileMenu { right: 0; position: relative; margin-top: -30px; }

	#logo, { width: 360px; }

	#social-icons { margin-top: -145px; }

	#footer { height: 65px; }

	#toTop { bottom: 66px; }

	.team-image img { width: 100%; height: auto; }

	.alingright .sidebar_left { margin-right: 0; }


	/* FlexSlider */
	.body-slider { display: none; }

	.flexslider { margin-top: -270px; }

	.flexslider .slides li img { width: 100%;	height: 420px; }

	.flexslider .slides li { width: 100%;	height: 420px; }

	.flexslider .slides img { min-height: 420px; min-width: 1024px; }

	.flex-direction-nav li a { top: 70%; };


}


/* Mobile (Landscape) */

/* Note: Design for a width of 480px */

@media only screen and (min-width: 420px) and (max-width: 768px) {
	.boxed #content   { width: 478px;  }
	.container { width: 420px; }
	
	#body-bar .container { width: 420px; }
	#main-content #container { width: 420px; }
	#page-title .container { width: 420px; }
	#header .container { width: 420px; }

	#slideshow_big .container { width: 420px; }

    .columns, .column { margin: 0; }

    .container .one.column,
    .container .two.columns,
    .container .three.columns,
    .container .four.columns,
    .container .five.columns,
    .container .six.columns,
    .container .seven.columns,
    .container .eight.columns,
    .container .nine.columns,
    .container .ten.columns,
    .container .eleven.columns,
    .container .twelve.columns,
	#body .full,	
    #body .one_fifth,			
	#body .one_fourth,		
	#body .one_third,			
	#body .two_fifth,			
	#body .one_half,			
	#body .three_fifth,		
	#body .two_third,			
	#body .three_fourth,		
	#body .four_fifth { width: 420px; margin-left: 0; margin-bottom: 20px; }

	#body-bar .container .one.column,
    #body-bar .container .two.columns,
    #body-bar .container .two.columns,
    #body-bar .container .three.columns,
    #body-bar .container .four.columns,
    #body-bar .container .five.columns,
    #body-bar .container .six.columns,
    #body-bar .container .seven.columns,
    #body-bar .container .eight.columns,
    #body-bar .container .nine.columns,
    #body-bar .container .ten.columns,
    #body-bar .container .eleven.columns,
    #body-bar .container .twelve.columns,
	#body #body-bar .full,	
    #body #body-bar .one_fifth,			
	#body #body-bar .one_fourth,		
	#body #body-bar .one_third,			
	#body #body-bar .two_fifth,			
	#body #body-bar .one_half,			
	#body #body-bar .three_fifth,		
	#body #body-bar .two_third,			
	#body #body-bar .three_fourth,		
	#body #body-bar .four_fifth { width: 420px; margin-left: 0; margin-bottom: 20px; }

	.social_bookmarks { float: left; margin-top: 0; }
													   
    .partners div {	text-align: center;	} 

	.partners-title { padding: 10px; background: #12a4b3 url(../images/pattern.png); padding-left: 30px; margin-right: 20px;	padding-top: 16px; padding-bottom: 16px;}
	
	.partner-arrow { margin-right: 20px; }
	
	.top-info {float: left;}
	
	.top-info span {margin-left: 0; margin-right: 20px;}
	
	.partners .partners_images { float: none; }
	
	.contactform textarea { max-width: 398px; }
	
	.widget { width: 360px; }
	
	#search_field_block { width: 280px; }
	
	#template-blog-masonry div .one_third { overflow: hidden; margin-left: 0; padding-right: 0; width: 420px; float: left; position: relative; margin-bottom: 20px; }
	
	
	#container-blog-two-col div.one_half { overflow: hidden; margin-left: 0; width: 420px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
 
	#template-blog-masonry #container-blog-two-col { width: 420px; float: left; left: 0; }
	
	
	#container-blog-full div.one_half { overflow: hidden; margin-left: 0; width: 420px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
	
	#container-blog-full div.one_third { overflow: hidden; margin-left: 0; width: 420px; float: left; position: relative; margin-bottom: 60px; padding-right: 0; }
 
	#template-blog-masonry #container-blog-full { width: 420px; float: left; left: 0; }
	
	
	.post-v2 { width: 420px; }
	
	.post-meta { width: 420px; }
	
	.post-v2 .post-content { width: 420px; float: left; }
	
	
	.post-page-content { width: 420px; }
	
	.post-page-content .post-content { width: 420px; float: left; }
	
	.post-comments { width: 420px; float: left; }
	
	
	.project-page-content { width: 420px; }
	
	.project-page-content .post-content { width: 420px; float: left; }
	
	
	#comments { width: 420px; }
	
	.comments { width: 420px; }
	
	.comment_here { width: 420px; }
	
	.comment_here .contactform textarea{ width: 398px; }
	
	
	#price-table .pack { width: 100%; }



	#portfolio .one_fourth	{ width: 100%; height: auto; float:left; }

	#portfolio .one_third	{ width: 100%; height: auto; float:left; }

	#portfolio .one_half	{ width: 100%; height: auto; float:left; }


	.project-title-content, .one_third .project-title-content, .one_half .project-title-content { margin-top: 224px;	width: 360px; }

	.project-title-content .project-title-bg, .one_third .project-title-content .project-title-bg, .one_half .project-title-content .project-title-bg { width: 360px; }


	#container-blog-two-col .one_half .blog-image {	width: 360px; height: 111px; }

	#container-blog-full .one_half .blog-image {	width: 360px; height: 111px; }

	#container-blog-full .one_third .blog-image {	width: 360px; height: 111px }

	#body #slogan .container .full, #body #slogan .container { width: 420px; }


	#error404 {	width: 360px; }	


	.body { width: 420px; }


	.twitter-block { width: 410px; }


	.one_fourth img {
		width: 420px;
		height: 233px;
	}

	.one_third img {
		width: 420px;
		height: 233px;
	}

	.one_half img {
		width: 420px;
		height: 233px;
	}



	.team-image img { width: 100%; height: auto; }

	.alingright .sidebar_left { margin-right: 0; }

	#banner .body { height: 210px; }

	.container_wrap { margin-top: 100px; }

	#banner nav { margin-top: 30px; }

	.mobileMenu { right: 20%; position: relative; margin-top: -30px; }

	#logo, { width: 360px; }

	#social-icons { margin-top: -145px; }

	#footer { height: 65px; }

	#toTop { bottom: 66px; }

	.team-image img { width: 100%; height: auto; }

	.alingright .sidebar_left { margin-right: 0; }


	/* FlexSlider */
	.body-slider { display: none; }

	.flexslider { margin-top: -270px; }

	.flexslider .slides li img { width: 100%;	height: 420px; }

	.flexslider .slides li { width: 100%;	height: 420px; }

	.flexslider .slides img { min-height: 420px; min-width: 1024px; }
}


/* Clearing */

/* Self Clearing Goodness */
.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
    content: '\0020';
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0; 
}
.row:after,
.clearfix:after {
    clear: both; 
}
.row,
.clearfix {
    zoom: 1; 
}

/* You can also use a <br class="clear" /> to clear columns */
.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
}


/* Columns for better content separation */

div .full       			       {	overflow: hidden; margin-left: 0; width:100%; float:left;	position:relative; margin-bottom: 30px; }
div .one_fifth			{	overflow: hidden; margin-left: 4%; width:16.8%; float:left;	position:relative; margin-bottom: 30px; }
div .one_fourth			{	overflow: hidden; margin-right: 2.5%; width:22%;  float:left; 	position:relative; margin-bottom: 30px; }
div .one_third			{	overflow: hidden; margin-left: 5%; width:30%; float:left; position:relative; margin-bottom: 30px; }
div .two_fifth			{	overflow: hidden; margin-left: 4%; width:38.5%; float:left;	position:relative; margin-bottom: 30px; }
div .one_half			{	overflow: hidden; margin-left: 4%; width:48%; float:left; 	position:relative; margin-bottom: 30px; }
div .three_fifth		        {	overflow: hidden; margin-left: 4%; width:57%; float:left; 	position:relative; margin-bottom: 30px; }
div .two_third			{	overflow: hidden; margin-left: 5%; width:65%; float:left; position:relative; margin-bottom: 30px; } 
div .three_fourth		{	overflow: hidden; margin-left: 4%; width:74%; float:left; 	position:relative; margin-bottom: 30px; }
div .four_fifth			{	overflow: hidden; margin-left: 4%; width:79%; float:left; 	position:relative; margin-bottom: 30px; }
.msie7 .one_fourth		{ 	width:21.5%;  	}
.msie7 div, .msie7 li	        {	zoom:1; 		}
