/* Copyright 2011, AppBurst */

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

/* #Site Styles
================================================== */
/* =======================================
SECTION 1 
========================================= */
/* header and logo*/
#ultra-top-nav{display:block;min-height:24px;background-color:#1A1A1A;}
#top-nav{padding-top:4px;text-align:right; font-size:11px; color:white}
#top-nav a, #top-nav a:visited, #top-nav a:active {font-size:11px; color:#999}
#top-nav a:hover {text-decoration:underline;}
#top-nav .sharing a {float:right;}
#header{display:block;width:100%;min-height:126px;background:url(../images/header-black.png) left top repeat-x #171717}
#main_header{background:url(../images/header-container-black.png) top left no-repeat;min-height:126px}
#logo{display:block; margin-top:10px}
#logo a{display:block;width:320px;}
#logo img { max-width:100%; box-sizing:border-box; }
 /*text-indent:-999999px; background:url(../images/appburst_logo.png) center left no-repeat;} */
#branding-text {margin-top:44px; font-size:14px;display:block;color:#DDD;margin-left: 30px;}
#main-menu-overlay{background-color:rgba(0,255,0,0.1)}
#main-menu{list-style:none outside;float:left;margin:0}
#main-menu li{float:left;position:relative;line-height:18px;margin-bottom:0px; background-color:rgba(0,0,0,.25);  border-right:1px solid; border-top:1px solid; border-bottom:1px solid; border-color:#000;}
#main-menu li:first-child{border-left:1px solid; border-color:#000;}
#main-menu li a {display: block; padding: 6px 30px 6px 30px; text-decoration: none; color: white; font-size: 14px; /* text-shadow: 0 1px 0 black;*/}
#main-menu li:hover { background-color:rgba(0,0,0,.5)}
/* responsive navigation */
#responsive_menu{display:none;}
#flag {
	position: absolute;
	top: 1px;
	right: 292px;"
}

/* =======================================
SECTION 2 
========================================= */
/* general */
.section2{background:url(../images/home-bg.jpg) left -2px 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}

.detail{background-position:center -295px}
.detail .container{-moz-box-shadow:0;-webkit-box-shadow:0;padding:30px 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{
        max-width: 95%;
        height: auto;
        margin: 0 auto 10px auto;
        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); */
        padding: 2%;
        behavior: url(/Themes/AppBurst/Styles/PIE.htc);
}
#blog_content img,#main_content img{  
	border-radius: 6px;
}
.work-img a img.nobox,#blog_content img.nobox,#main_content img.nobox { padding: 8px; background: none; border: none; box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none;}

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

/* ---------- VIDEO STYLE ----------------- */
.video-container {
	position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/* ---------- 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;overflow: hidden;}
#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}

/* what we do 1 */
.number{float:left;background:#181818 ;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(/Themes/AppBurst/Styles/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(/Themes/AppBurst/Styles/PIE.htc) ;}

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

/* --------- BLOG DETAIL PAGE -------------*/
#blog_content{/*background:url(../images/diamond-bg.png);*/ background-color:#FFF;border:1px solid #e7e7e7;margin-bottom:20px;padding:20px; margin-left:0;overflow: hidden;}
#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_content aside {
	background: #F5E5B5;
    padding: 15px 15px;
    width: auto;
    height: auto;
	margin-bottom: 10px;
	display:block;
}
#blog_content aside p {
	font-size: 1.2em;
    margin-bottom: 0px;
    font-style: italic;
}
#blog_content aside.center p {
	text-align: center;
}
.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;overflow: hidden;}

.blog-info{font-size:11px;text-align:left;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}

#blog_content ul.pager { margin-left: 0; list-style: none; }


/* --------- PORTFOLIO PAGE --------------*/
#app-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(/Themes/AppBurst/Styles/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 0 18px 0}
.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(/Themes/AppBurst/Styles/PIE.htc) ;}
/* listing sidebar navigation */
.sidebar_listing{display:block;margin:5px 0 20px}
.sidebar_listing li.selected { background:url(../images/list2.png) right center no-repeat; }
.sidebar_listing li a{display:block;font-size:15px;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; margin:0;padding:10px 0 10px 10px;behavior:url(/Themes/AppBurst/Styles/PIE.htc);}
.sidebar_listing li a:hover, .sidebar_listing li.selected  a {text-decoration:none}

/*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(/Themes/AppBurst/Styles/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(/Themes/AppBurst/Styles/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%; }

/* ----------- APP PAGE ----------------*/
.app-features ul { margin-left:16px; }
.app-features { min-width: 145px; }
.app-features h2 { font-size:22px; }

/* =======================================
SECTION 3
========================================= */
#footer{
	/* display:block;background:url(../images/leather.png); */
	background-color:#333333;
	box-shadow:inset 0 1px 0 0 #4D4D4D;
	-moz-box-shadow:inset 0 1px 0 0 #4D4D4D;
	-webkit-box-shadow:inset 0 1px 0 0 #4D4D4D;
	border-top:1px solid #1A1A1A;color:#969696;
	text-shadow:0 1px rgba(0,0,0,.75);
	padding:20px 0;behavior:url(/Themes/AppBurst/Styles/PIE.htc) ;}
#footer a,#footer h3{color:#FFF;font-weight: bold;}
.option{font-size:11px}

/* =======================================
SECTION 4 
========================================= */
/* copyright and sharing */
#copyright{background-color:#1A1A1A;color:#9C9C9C;text-shadow:0 1px rgba(0,0,0,.75);padding:10px 0 10px 0}
#copyright span{color:#DDD; font-size:11px;}
#copyright .sharing a {float:right}
.sharing a{display:block; width:23px;height:24px;text-indent:0; px;margin-right:6px;}
.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
------------------------------------------------------- */


/* ================================================== */
/* #Media Queries
================================================== */
	
	/* Bigger or euqal to 960 */
	@media only screen and (min-width: 960px) {
		.flex-container { margin: 0; }
		.flex-caption ul { top: 33%; }

	}
	
	/* Smaller than standard 960 (devices and browsers) */
	@media only screen and (max-width: 959px) {
		.section2{ background-position:left -56px; }
		.section2.detail{background-position:center -260px}
		h4{ font-size:14px;	}
		h3{ font-size:18px; }
		h2{ font-size:30px; }

		#welcome_section a.big{ font-size:14px; padding:10px 0; margin-top:20px; }
		/*#sidebar{padding:50px 10px 0 10px}*/
		#main-menu li a { padding: 7px 22px 7px 22px; font-size:12px; }
	}
	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
		.section2{ background-position:left -56px; }
		.section2.detail{background-position:center -260px}
		h4{ font-size:14px;	}
		h3{ font-size:18px; }
		h2{ font-size:22px; font-weight: bold; }
		
		#welcome_section a.big{ font-size:14px; padding:10px 0; margin-top:20px; }
		/*#sidebar{padding:50px 10px 0 10px}*/
		#main-menu li a { padding: 7px 22px 7px 22px; font-size:12px; }
	}
	
	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 640px) and (max-width: 767px) {
		#main_header{background:none;}
		#logo{margin-top:5px;}
		.sf-menu{display:none;}
		.chosen{display:block;}
		.section2{ background-position:left -114px; }
		.section2.detail{background-position:center -260px}
		

		.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:none;}
		#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: 10px;}
		#main-menu li a { padding: 7px 18px 7px 18px; font-size:11px; }
		#branding-text {margin-top:0;font-size:12px;display:block;color:#DDD;}
		#sidebar{padding:0 0 18px 0}
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 639px) {
		#main_header{background:none;}
		#logo{margin-top:5px;}
		.sf-menu{display:none;}
		.chosen{display:block;}
		.section2{ background-position:left -184px; }
		.section2.detail{background-position:center -260px}

		.button.full-width { width:89% }

		.sharing { text-align:left; }
		.sharing a { float:left; }
		.blog-info { text-align:left; clear: left; }
		#welcome_section a.big { font-size:16px;margin-top:0;padding:10px 0 }
		#responsive_menu { display:none; }
		#main_content { padding:10px; border:none; }
		#blog_page { display:block; padding:10px; background:#FFF; border:1px solid #e7e7e7; }
		/* #blog_content{border:none; background:none; padding:0;} */
		#main-menu li a { padding: 7px 10px 7px 10px; font-size:10px; }
		#branding-text { margin-top:0;font-size:12px;display:block;color:#DDD; }
		#sidebar { padding:0 0 18px 0 }
		#blog_content { border:none; padding: 10px; }
		.work-img a img,#blog_content img,#main_content img {
			margin: 15px;
			float: left;
		}
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
		.section2{ background-position:left -231px; }
		.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;}
		#logo a { text-align:center;
			width:300px;
			max-width: 100%;
		}
		.sf-menu{display:none;}
		.sharing{text-align:left;}
		.sharing a{float:left;}
		.blog-info{ text-align:left; }
		#welcome_section a.big{font-size: 16px;display: block;width: 99%;padding: 10px 0;}
		.button.full-width { width: 100%; }
		#main_content{padding:10px;}
		#blog_page{ display:block; padding:10px; background:#FFF; border:1px solid #e7e7e7;}
		/* #blog_content{border:none; background:none; padding:0;} */
		/* #main-menu {display:none; } */
		#main-menu { padding-top: 10px; width: 100%; }
		#main-menu li { padding:5px 0; font-size:15px; display: block; float: left; text-align: center; }
		#branding-text {margin-top:0;font-size:9px;display:block;color:#DDD;}
		#sidebar{padding:0 0 18px 0}
		h1 { font-size: 35px; line-height: 40px; margin-bottom: 10px; }
		.work-img a img,#main_content img {
			max-width:95%;
			margin: auto 0;
			margin-right:0px;
			margin-bottom:10px;
	}
		#blog_content {
			padding:10px;
			border:none;
	}
		#blog_content img{
			max-width: 100% !important;
			margin: 0 auto !important;
			margin-bottom: 10px !important;
			float: none !important;
	}
		#flag {
			position: inherit;
			width: 18px;
			float: left;
	}

}
/* #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; }
*/