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

/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */
/* =======================================
SECTION 1 
========================================= */
/* header and logo*/
#header{display:block;width:100%;min-height:129px;background:url(../images/header.png) left top repeat-x #0f0217;}
#main_header{background:url(../images/header-container.png) top left no-repeat;min-height:129px}
#logo{display:block;margin-top:20px}
#logo a{display:block;width:307px;height:84px;text-indent:-999999px;background:url(../images/logoScalera.png) center left no-repeat}

/* responsive navigation */
#responsive_menu{display:none;}

/* =======================================
SECTION 2 
========================================= */
/* general */
.section2{background:url(../images/home-bg.jpg) left top repeat-x}
.section2 .container{border-bottom:1px solid #d7d7d7; padding:40px 0;}

.heading{margin-bottom:10px}
.heading p{margin:-5px 0 0}
.heading:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden}

#last_content{border-bottom:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}
/* next 2 lines are for better testimonial layout */
#last_content2{border-bottom:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;padding-top:0px}
#last_content3{border-bottom:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;padding-top:0px;padding-bottom:40px 0}

.detail{background-position:center -250px}
.detail .container{-moz-box-shadow:0;-webkit-box-shadow:0;padding:10px 0}

#main_title{border-bottom:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;padding:10px 0}
#main_title h1{margin:0;padding:0}
#main_title p{margin:-10px 0 0;padding:0}
#main_content{background:#FFF;border:1px solid #e7e7e7;margin-bottom:20px; padding:10px 0 0 0;}

.work-img a img,#blog_content img,#main_content img{width:95%;display:block;background:url(../images/frame.jpg) left top repeat #FFF;border:1px solid #ebebeb;box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-moz-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-webkit-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);margin-bottom:10px;padding:2%; behavior:url(stylesheets/PIE.htc) ;}

.flex-container,#testimonials blockquote{margin-top:20px}
.heading h4,.sidebar_listing li{margin:0}

/* ---------- HOME PAGE ----------------- */

/* slider */
#slider{border-bottom:1px solid #d7d7d7;box-shadow:0 1px 0 #FFF;padding:0}
.slider-shadow{display:block;width:100%;padding:0}
.slider-shadow img{width:100%}

/* welcome message */
#welcome_section{padding:10px 0 0}
#welcome_section h3{ margin-bottom:0;margin-top:10px}
#welcome_section p{margin-top:0}
#welcome_section a.big{font-size:16px;margin-top:10px;padding:10px 0}

/* what we do 1 */
.number{float:left;background:#493253;width:40px;height:32px;border-radius:20px; -moz-border-radius:20px; -webkit-border-radius:20px; -o-border-radius:20px; text-align:center;padding-top:8px;color:#FFF;font-size:30px;margin-right:5px;font-family:'Terminal Dosis', sans-serif; behavior:url(stylesheets/PIE.htc) ;}

/* our works */
.work-img a{display:block;width:100%}
.work-img a:hover{background:none}

/* sidebar */
#latest_news{margin:0 0 10px; overflow:hidden;}
#latest_news li{height:100%;display:block}
#latest_news li img,#team li img{display:block;width:80px;max-height:100%;max-width:100%;float:left;background:url(../images/frame.jpg) left top repeat #FFF;border:1px solid #ebebeb;box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-moz-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-webkit-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);margin-right:15px;padding:5px;behavior:url(stylesheets/PIE.htc) ;}

/* ----------- ABOUT PAGE ----------------*/
#team{margin-top:10px}
#team li{width:220px;float:left;display:block;height:70px}
hr.dotted{border:dotted #ddd;clear:both;height:0;border-width:1px 0 0;margin:10px 0 30px}
#blog_content ul{list-style:disc}
blockquote.small_quote p{font-size:14px}

/* --------- BLOG DETAIL PAGE -------------*/
#blog_content{background:#FFF;border:1px solid #e7e7e7;margin-bottom:20px;padding:20px; margin-left:0;}
#blog_page{border-bottom:none;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none}
#blog_content .heading{margin-bottom:10px;border-bottom:1px solid #f1f1f1;padding:0}
.blog-info-detail{font-size:12px;text-align:left;margin:0 0 20px}
.comment_form{display:block;border-top:1px solid #ebebeb;margin:10px 0;padding:10px 0}
.comments{display:block;border-top:1px solid #ebebeb;margin:10px 0;padding:30px 0 10px}
.comment_listing li{list-style:none;border-bottom:1px dotted #ebebeb;clear:both;margin:20px 0;padding:20px 0}
.comment_date{font-size:12px;margin-top:-5px}
.the_comment{margin:10px 0 0}
.align-right{display:block;float:right;max-width:50%;margin-left:10px}
.align-left{display:block;float:left;max-width:50%;margin-right:10px}
.tags{display:block;padding-top:10px;border-top:1px solid #ebebeb;margin:20px 0 10px}
.tags-text{display:block;width:50px;float:left;padding-top:6px}

/* ---------- BLOG HOME PAGE -------------*/
.list_blog{padding-bottom:10px;border-bottom:1px dotted #CCC;margin-bottom:30px}
.blog-info{font-size:12px;text-align:right;margin-top:14px;}
.paging{display:block;font-size:11px}
.paging a{display:block;float:left;margin-right:2px;text-decoration:none;color:#999;border:1px solid #F0F0F0;padding:5px 10px}
.paging a:hover{background:#F0F0F0;border:1px solid #EBEBEB}
.paging a.prev_next{border:1px solid #FFF}
.paging a.prev_next:hover{border:1px solid #EBEBEB}
.paging a.active_page,.paging a.active_page:hover{color:#FFF}

/* --------- PORTFOLIO PAGE --------------*/
#portfolio-filter a.current{background:#eee;border:1px solid #e0e0e0}
#portfolio-list{padding:20px 0}
.filter_text{padding:5px 0}
.filter_button a{display:block;float:left;background:#f8f8f8;border:1px solid #eee;-moz-border-radius:3px;border-radius:3px;-webkit-border-radius:3px; -o-border-radius:3px;margin-right:3px;color:#707070;padding:5px 10px;behavior:url(stylesheets/PIE.htc) ;}
.filter_button a:hover{text-decoration:none;background:#eee;border:1px solid #e0e0e0}
.four-columns .columns{min-height:240px;max-height:300px}
.three-columns .column{height:300px}
.two-columns .columns{height:400px}

/* --------- CONTACT PAGE ---------------- */
#contact-detail{padding:0}

/* ----------- SIDEBAR ----------------*/
#sidebar{padding:50px 18px 0 18px}
.sidebar_content{display:block;clear:both;margin:10px 0 20px}
/* search form */
input.input_text_search{display:block;width:84%;background:#f9f9f9 url(../images/search.png) right center no-repeat;border:1px solid #e9e9e9;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px; -o-border-radius:5px;padding:10px;behavior:url(stylesheets/PIE.htc) ;}
/* listing sidebar navigation */
.sidebar_listing{display:block;margin:5px 0 20px}
.sidebar_listing li a{display:block;font-size:12px;border-bottom:1px solid #ececec;box-shadow:0 1px 0 0 #FFF; -moz-box-shadow:0 1px 0 0 #FFF; -webkit-box-shadow:0 1px 0 0 #FFF; background:url(../images/list.png) left center no-repeat;margin:0;padding:10px 0 10px 20px;behavior:url(stylesheets/PIE.htc) ;}
/*divider*/
hr.sidebar_divider{border:dotted #ddd;clear:both;height:0;border-width:1px 0 0;margin:10px 0}
/*flickr photos*/
.flickr_photos{clear:both;margin:10px 0 20px}
.flickr_photos a{display:block;width:55px;height:55px;float:left;margin:0}
.flickr_photos a img{width:95%;display:block;height:100%;background:url(../images/frame.jpg) left top repeat #FFF;border:1px solid #ebebeb;box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-moz-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);-webkit-box-shadow:1px 1px 0 0 rgba(0,0,0,.1);margin-bottom:10px;padding:2%;behavior:url(stylesheets/PIE.htc) ;}
/* listing on sidebar tabs */
.list-news{display:block;list-style:disc;font-size:11px;margin-left:20px} 
.list-news a{font-size:12px;display:block}
/* blog tags */
.blog_tags a,.tags-list a{float:left; font-size:11px;background:#252525;color:#FFF;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-o-border-radius:5px;margin:2px;padding:5px 10px;behavior:url(stylesheets/PIE.htc) ;}
/* ads */
.ads,.blog_tags{display:block;margin:10px 0 20px}
.ads a{display:block;float:left;padding:0; width:100%;  max-width:220px}
.ads a img{	width:100%;; }
.ads2 a{display:block;float:left;padding:2%; width:46%; max-width:100px; }
.ads2 a img{ width:100%; }

/* =======================================
SECTION 3
========================================= */
#footer{display:block;background:#2b1334;box-shadow:inset 0 1px 0 0 #421d4f;-moz-box-shadow:inset 0 1px 0 0 #421d4f;-webkit-box-shadow:inset 0 1px 0 0 #421d4f;border-top:1px solid #140818;color:#979197;text-shadow:0 1px rgba(0,0,0,.75);padding:20px 0;behavior:url(stylesheets/PIE.htc) ;}
#footer a,#footer h3{color:#FFF}
.option{font-size:11px}

/* =======================================
SECTION 4 
========================================= */
/* copyright and sharing */
#copyright{background:#140619;color:#979197;text-shadow:0 1px rgba(0,0,0,.75);padding:20px 0 0}
.sharing a{display:block; float:right; width:23px;height:24px;text-indent:0; px;margin-left:3px;}
.sharing a.facebook{background:url(../images/social/facebook2.png) center top no-repeat}
.sharing a.facebook:hover{background:url(../images/social/facebook2.png) center bottom no-repeat}
.sharing a.google{background:url(../images/social/google2.png) center top no-repeat}
.sharing a.google:hover{background:url(../images/social/google2.png) center bottom no-repeat}
.sharing a.youtube{background:url(../images/social/youtube2.png) center top no-repeat}
.sharing a.youtube:hover{background:url(../images/social/youtube2.png) center bottom no-repeat}
.sharing a.twitter{background:url(../images/social/twitter2.png) center top no-repeat}
.sharing a.twitter:hover{background:url(../images/social/twitter2.png) center bottom no-repeat}
.sharing a.rss{background:url(../images/social/rss2.png) center top no-repeat}
.sharing a.rss:hover{background:url(../images/social/rss2.png) center bottom no-repeat}


/* ----------------------------------------------------
COLOR OPTION
------------------------------------------------------- */

/* purple */
.paging a.active_page,.paging a.active_page:hover{background:#3f2a48}
#copyright{background:#140619;color:#979197}
#footer{ background:#2b1334;box-shadow:inset 0 1px 0 0 #421d4f;-moz-box-shadow:inset 0 1px 0 0 #421d4f;-webkit-box-shadow:inset 0 1px 0 0 #421d4f;border-top:1px solid #140818;color:#979197;behavior:url(stylesheets/PIE.htc) ;}
#header{background:url(../images/header.png) left top repeat-x #0f0217}
#main_header{background:url(../images/header-container.png) top left no-repeat;}
.number{background:#493253}
/* superfish */
.sf-menu li a.active{ background:url(../images/nav.png) center center repeat-x; }
.sf-menu li ul{ background:#12001a; border:1px solid #100019; }
.sf-menu li ul li{ border-top:1px solid #1e0d25; border-bottom:1px solid #0a000e; }
.sf-menu li ul li:hover{ background:#380442; }


/* ================================================== */

/* #Media Queries
================================================== */

	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		.section2{ background-position:left -80px; }
		.section2.detail{background-position:center -260px}
		h4{ font-size:18px;	}
		h3{ font-size:22px; }
		h2{ font-size:30px; }
		#welcome_section a.big{ font-size:14px; padding:10px 0; margin-top:20px; }
		.section2{ background-position:left -80px; }
		#sidebar{padding:50px 10px 0 10px}
	}
	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		.section2{ background-position:left -80px; }
		.section2.detail{background-position:center -260px}
		h4{ font-size:18px;	}
		h3{ font-size:22px; }
		h2{ font-size:30px; }
		#welcome_section a.big{ font-size:14px; padding:10px 0; margin-top:20px; }
		.section2{ background-position:left -80px; }
		#sidebar{padding:50px 10px 0 10px}
	}
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 640px) and (max-width: 767px) {
		#header{background:url(../images/header-container.png) top left no-repeat , url(../images/header.png) left top repeat-x #0f0217}
		#main_header{background:none;}
		#logo{margin-top:5px;}
		.sf-menu{display:none;}
		.chosen{display:block;}
		.section2{ background-position:left -180px; }
		.section2.detail{background-position:center -260px}
		.flex-caption{display:none;}
		.sharing{text-align:left;}
		.sharing a{float:left;}
		.blog-info{ text-align:left; }
		#welcome_section a.big{font-size:16px;margin-top:0;padding:10px 0}
		#responsive_menu{display:block;}
		#main_content{padding:10px;}
		#main_content{padding:10px;}
		#blog_page{ display:block; padding:10px; background:#FFF; border:1px solid #e7e7e7;}
		#blog_content{border:none; background:none; padding:0;}
	}
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 639px) {
		#header{background:url(../images/header-container.png) top left no-repeat , url(../images/header.png) left top repeat-x #0f0217}
		#main_header{background:none;}
		#logo{margin-top:5px;}
		.sf-menu{display:none;}
		.chosen{display:block;}
		.section2{ background-position:left -180px; }
		.section2.detail{background-position:center -260px}
		.flex-caption{display:none;}
		.sharing{text-align:left;}
		.sharing a{float:left;}
		.blog-info{ text-align:left; }
		#welcome_section a.big{font-size:16px;margin-top:0;padding:10px 0}
		#responsive_menu{display:block;}
		#main_content{padding:10px;}
		#blog_page{ display:block; padding:10px; background:#FFF; border:1px solid #e7e7e7;}
		#blog_content{border:none; background:none; padding:0;}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		#header{background:url(../images/header-container.png) top left no-repeat #0f0217}
		.section2{ background-position:left -240px; }
		.section2.detail{background-position:center -260px}
		#main_content .columns, .main_content .column{ margin-left:0; margin-right:0;}
		#responsive_menu{display:block;}
		#main_header{background:none;}
		#logo{margin-top:5px;}
		.sf-menu{display:none;}
		.flex-caption{display:none;}
		.sharing{text-align:left;}
		.sharing a{float:left;}
		.blog-info{ text-align:left; }
		#welcome_section a.big{font-size:16px;margin-top:0;padding:10px 0}
		#main_content{padding:10px;}
		#blog_page{ display:block; padding:10px; background:#FFF; border:1px solid #e7e7e7;}
		#blog_content{border:none; background:none; padding:0;}
	}


/* #Font-Face
================================================== */
/* 	This is the proper syntax for an @font-face file
		Just create a "fonts" folder at the root,
		copy your FontName into code below and remove
		comment brackets */

/*	@font-face {
	    font-family: 'FontName';
	    src: url('../fonts/FontName.eot');
	    src: url('../fonts/FontName.eot?iefix') format('eot'),
	         url('../fonts/FontName.woff') format('woff'),
	         url('../fonts/FontName.ttf') format('truetype'),
	         url('../fonts/FontName.svg#webfontZam02nTh') format('svg');
	    font-weight: normal;
	    font-style: normal; }
*/