@charset "utf-8";
/*
Theme Name: ComputerJazz
Description: Variable grid layout, easing effect on window resizing.
Version: 1.1.1
Author: ComputerJazz
Tags: silver, light, flexible-width, threaded-comments


Index:
  - Basic Elements
  - Basic Styling
  - Layout
  - Grid Items, Single Item and Comments
  - Navigation and Sidebar Widget
  - Form Elements

*/



/* ---------- Basic Elements ---------- */

body {
	background-color: #e6e6e6;
	margin: 0;
	padding: 0;
	color: #5f6062;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 1.45;
}


/* Generated by Font Squirrel (http://www.fontsquirrel.com) on September 12, 2012 */



@font-face {
    font-family: 'gotham_mediumregular';
    src: url('gotham-medium-webfont.eot');
    src: url('gotham-medium-webfont.eot?#iefix') format('embedded-opentype'),
         url('gotham-medium-webfont.woff') format('woff'),
         url('gotham-medium-webfont.ttf') format('truetype'),
         url('gotham-medium-webfont.svg#gotham_mediumregular') format('svg');
    font-weight: normal;
    font-style: normal;

}




@font-face {
    font-family: 'gotham_mediumitalic';
    src: url('gotham-mediumitalic-webfont.eot');
    src: url('gotham-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
         url('gotham-mediumitalic-webfont.woff') format('woff'),
         url('gotham-mediumitalic-webfont.ttf') format('truetype'),
         url('gotham-mediumitalic-webfont.svg#gotham_mediumitalic') format('svg');
    font-weight: normal;
    font-style: normal;

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

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

}



a {
	text-decoration: none;
	color: #5f6062;
	outline: none;
}
a:hover {
	color: #000000;
}
a img {
	border: none;
	
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 1em 0;
}
h1 {
	font-size: 28px;
	font-weight: normal;
}
h2,
h3,
h4,
h5,
h6 {
	font-size: 12px;
	margin-top: 2em;
	padding-left: 0px;
	
}

p{color: #5f6062}

blockquote {
	margin: 0;
	padding: 10px;
	border-left: 5px solid #e9e9e9;
	background-color: #f9f9f9;
	color: #5f6062;
}

pre {
	overflow: auto;
	margin: 0;
	padding: 10px;
	background-color: #f9f9f9;
	color: #5f6062;
}

fieldset {
	border: 1px solid #cccccc;
	padding: 10px;
}

table {
	margin: 1em 0;
	border: 1px solid #999999;
}
th, td {
	padding: 2px 4px;
	/*border: 1px solid #e9e9e9;*/
}
th {
	background-color: #d9d9d9;
	font-weight: normal;
}
td {
	background-color: #d9d9d9;
}

/* ---------- Basic Styling ---------- */

.aligncenter {

   margin-left: auto;
   margin-right: auto;
}

.alignright {
	float: right;
	margin: 0 0 2px 10px;
}

.alignleft {
	float: left;
	margin: 0 10px 2px 0;
}

img.centered {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

img.alignright {
	padding: 5px;
	display: inline;
}

img.alignleft {
	/* padding: 5px; */
	display: inline;
}

.caution {
	padding: 10px;
	color: #5f6062;
	text-align: center;
	background-color: #cc0000;
}
noscript .caution {
	margin: 0;
}

.wp-caption {
	width: 100%;
	border: 1px solid #e3e3e3;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-khtml-border-radius: 4px;
	-webkit-border-radius: 4px;
	background-color: #ffffff;
	text-align: center;
}
.wp-caption img {
	padding-top: 5px;
}

.wp-caption-text {
	margin: 5px 0;
	text-align: center;
	font-size: smaller;
	color: #5f6062;
}

code strong {
	color: #cc3366;
	font-weight: normal;
}


/* ---------- Layout ---------- */

#top-container {
	margin: 0 auto;
	padding: 5px;
	background: white;
}

#container {
	margin: 0 auto;
	padding: 0;
}

	#header {
		margin: 50px 0 50px 16px;
	}
	#header h1 {
		margin: 0;
		color: #5f6062;
	}
	#header h1 a{
		margin: 0;
		color: #5f6062;
	}
	#header p {
		margin: 0;
	}

	#grid-wrapper {
		margin: 0;
		padding: 0;
		padding-top: 1000px; /* Prevent flicker in grid area. Check header.php. */
	}
	
	
	#single-wrapper {
		margin:0px;
		padding:0px;
		width:973px; margin:0px; background:#ffffff; border-right:5px solid #d6d3d2; /* for single-page effect */
		
	}

#bottom-container {
	clear: both;
	width: 100%;
	margin: 0;
	padding: 30px 0 0;
}

	#footer-wrapper {
		background: none;
	}

	#footer {
		margin: 0 auto;
	}
	#footer p {
		margin: 0;
		padding: 10px;
	}
	
	
/* ---------- Grid Items, Single Item and Comments ---------- */

/* value = (width * n) + (15+15+5) * (n-1). 
 * ex.
 * width=200 : 200, 425, 650, 875
 * width=250 : 250, 525, 800, 1075
 * width=290 : 290, 615, 940, 1265
 */
div.x1 { width:  330px; }
div.x2 { width:  525px; }
div.x3 { width:  800px; }
div.x4 { width: 1075px; }
div.x6 { width: 310px; }

div.grid-item,
div.single-item {
	overflow: hidden;
	margin:0px 0px;
}
div.single-item{margin:0px 10px;}

div.grid-item h2.post-title,
div.single-item h2.post-title {
	margin:0px 0px 0px 0px;
	border-left: 0;
	font-weight: bold;
	font-size:14px;
}

div.single-item h2.post-title {
    padding-top: 8px;
}

div.grid-item div.grid-image {
	margin-bottom: 10px;
	float:left;
	margin-top:10px;
	font-family:Arial, Helvetica, sans-serif
}

div.grid-item div.wp-caption {
	display: none;
}

div.post-body p,
div.comment-body p {
clear:left;
	font-size: 13px;
	line-height:18px; 
	font-family:Arial, Helvetica, sans-serif;
	 color:#5f6062;
	
	
}

div.post-body p img,
div.post-body p object {
	max-width: 100%;
	padding: 0;
}

p.post-meta,
p.comment-meta {
	margin-bottom: 0;
	line-height:18px; font-family:Arial, Helvetica, sans-serif; color:#5f6062;
}

.comment-list .navigation {
	margin: 10px 0;
}
.comment-list .navigation a {
	margin-right: 10px;
}

.comment-list ol li {
	margin: 10px 0;
}

.comment-list ol li.trackback {
	padding: 5px;
	border: 1px solid #c4c4c4;
}

.comment-list ul.children {
	list-style: none;
}
.comment-list ul.children li {
	border-left: 5px solid #c4c4c4;
	padding-left: 5px;
}

.comment-list li.bypostauthor {
}
.comment-list li.bypostauthor cite.fn {
	text-decoration: underline;
}

.comment-list li.comment .reply {
	margin: 10px 0 20px;
}




/* ---------- Navigation and Sidebar Widget ---------- */

/* Pagination for grid items and paginated posts */
.pagination {
	margin: 50px 0 0;
	font-size: 12px;
	clear:both;
}
.pagination .current {
	color: #5f6062;
	font-weight: bold:
}
.pagination .next, 
.pagination .prev {
}

.pagination .page-numbers,
.pagination .current {
	margin: 0 10px 0 0;
	padding: 10px 15px;
	text-decoration: none;
	background: #d9d9d9;
}
/* page-numbers hover color */
a.page-numbers:hover {
	color: #333333;
	background-color: #eeeeee;
}
#post-pagination {
	margin: 1em 0;
	color: #c4c4c4;
}
#post-pagination .prefix {
	color: #eaeaea;
}

/* Sidebar 
 * In this theme, sidebar is a horizontal line.
 * Sidebar2 is a block on the bottom.
 * See also "Form Elements" section.
 */
#sidebar{
	list-style: none;
	list-style-type: none;
	margin: 50px 0 50px 16px;
	padding-left: 0;
}
#sidebar2 {
	list-style: none;
	list-style-type: none;
	margin: 50px 0;
	padding-left: 0;
}
#sidebar li {
	margin: 2px 0;
}
#sidebar li.widget h2.widgettitle {
	display: none;
}

#sidebar li.widget ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

#sidebar li.widget ul li {
	display: inline;
	padding-right: 5px;
}

li.current-cat {
	text-decoration: underline;
}

#sidebar2 li.widget {
	display: block;
	overflow: hidden;
	float: left;
	margin: 0 5px 5px 0;
	width: 320px;
	padding: 5px 0 0 0;
	border: 0;
}

#sidebar2 h2.widgettitle {
	margin-top: 0;
	padding: 5px 10px;
	color: #333333;
	background-color: #d9d9d9;
}

#sidebar2 li.widget div {
	padding: 0 10px;
	font-size: 12px;
}

#sidebar2 li.widget ul {
	margin: 0;
	padding: 0 10px;
	font-size: 12px;
}

#sidebar2 li.widget ul li {
	list-style: none;
}
#sidebar2 ul.children ul li {
	list-style: none;
}

#wp-calendar {
	margin: 1em 0;
	border: none;
}
#wp-calendar caption{
	text-align: left;
	margin: 2px 0 0 0;
	padding: 0;
}
#wp-calendar td {
	text-align: center;
}

/* ---------- Form Elements ---------- */

div.comment-form {
	margin: 0;
	padding: 0;
}

#commentform {
	margin: 0;
	padding: 0;
}
#commentform textarea {
	width: 99%;
	max-width: 640px;
}

/* for sidebar widget */

#searchform {
    width: 300px;
}
#searchform div {
	padding: 0;
	font-size: 12px;
}
#searchform label.screen-reader-text {
	display: none;
}
#searchsubmit {
	display: inline;
}

#s { /* #searchform input#s */
	width: 170px;
	margin: 0;
}
.post-title{ font-family:Arial, Helvetica, sans-serif; font-size:12px;}

/*======wrapper start============== */
#wrapper{width:990px; margin:0px auto; display:block;}
/*======header  start============== */
#header{ width:990px; margin:0px; background:url(images/header-bg.jpg) no-repeat left top #e6e6e6; height:156px; }
body.page-id-35 #header{ background:url(images/about-header-bg.jpg) no-repeat left top #e6e6e6;}
body.category-news #header{ background:url(images/news-header-bg.jpg) no-repeat left top #e6e6e6;}
body.category-work #header{ background:url(images/work-header-bg.jpg) no-repeat left top #e6e6e6;}
body.page-id-1495 #header{ background:url(images/contact-header-bg.jpg) no-repeat left top #e6e6e6;}
.logo{ float:right; margin:20px 0px 0px 0px;}
.nav{ float:left; background:#ffffff; margin:130px 0 0 120px;}
.nav ul{ margin:0px; padding:0px;}
.nav ul li{ float:left; display:inline; list-style:none;}
.nav ul li a{ font-family: 'gotham_mediumregular'; font-size:15px; color:#cccccc; padding:1px 9px; float:left;}
.nav ul li a:hover{ background:#c4122f; color:#ffffff;}
.nav ul li.current-menu-item a{background:#c4122f; color:#ffffff;}

/*======slider css  start============== */ 
.slider{ width:954px; float:left; margin:20px 0px 20px 10px; background:#ffffff; /* border-right:5px solid #d6d3d2; */ height:auto !important;}
/*======grey box css  start============== */
.clear{clear:both;}
#xyz{ float:left; margin:16px 10px 0px 0px; width:320px;}
.boxtop{ width:310px; height:10px; float:left;}
.boxbootem{height:10px; width:310px; float:left;}
.centerbox{width:272px; float:left; margin:0px 0px; background:#ffffff; border-right:6px solid #d6d3d2; padding:20px 20px 10px 20px;}
.centerbox p{ line-height:18px; font-family:Arial, Helvetica, sans-serif; font-size:10px; color:#5f6062;width:274px;}
.left .centerbox p span{ font-size:11px; width:310px; margin-top:10px; float:left;}
.left .centerbox h2{ float:left; margin:10px 20px;}
.left .centerbox h3{ margin:10px 10px 0px 20px; line-height:18px; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-weight:bold; color:#5f6062;}
.centerbox h4{ font-size:13px; font-style:normal; color:#5f6062; margin:0px 0px 10px 0px;}
.centerbox a.month{ font-size:11px; font-style:italic; color:#5f6062; margin:3px 0px 0px 0px; font-weight:normal; text-decoration:none; width:274px; float:left; line-height:12px;}
.centerbox .last{ font-family:Arial, Helvetica, sans-serif; font-size:11px; font-style:italic; color:#5f6062; margin:3px 0px 10px 0px; font-weight:normal; text-decoration:none; width:274px; float:left; padding-bottom:10px; border-bottom:1px solid #5f6062;}
.centerbox  .e-mail{ width:170px; height:20px; float:left; background:#e6e6e6; border-radius:3px; color:#5f6062; font-family:Arial, Helvetica, sans-serif; font-size:11px; border:none; padding-left:10px; padding-right:10px;  margin:3px 0px 10px 0px;}
/********************** red box*************/
.right{ float:right; width:310px; margin:0px 0px 0px 0px;}


 .box1{ width:271px; height:auto; float:left; margin:0px 0px; background:#d96578; border-right:7px solid #c4122f; border-left:0; padding: 20px 20px 10px 20px;}
 .box1 h1{ background:#f0c4cb; padding:2px 10px; width:228px; margin:0;}
 .box1 h1 a{ color:#c4122f; font-family: 'gotham_mediumregular'; font-size:16px; font-weight:normal; padding:0; margin:0;}
 .box0{ width:275px; height:auto; float:left; margin:0; background-color:#c4122f; /* border-left:5px solid #e28997; border-bottom:5px solid #e28997; */ 
background-image: url(images/red-box-border.jpg), url(images/red-box-border-left.jpg);
background-position: 0px 100%, left top;
background-repeat: no-repeat, repeat-y;
 }
 .box0 p{ font-family: 'gotham_mediumregular'; font-size:20px; color:#ffffff; text-align:center;  margin:0; padding:15px 0 20px 0; letter-spacing:-0.08em}
 
 /********************** green box*************/
.box3{ width:271px; float:left; background:#b3d780;  border-right:7px solid #8dc63f; margin:0px 0px; padding:20px;}
.box3 h1{ background:#e0eecb; padding:2px 10px; width:49px; margin:0px 0px 0px 0px;}
.box3 h1 a{ color:#8dc63f; font-family: 'gotham_mediumregular'; font-size:16px; font-weight:normal; padding:0; margin:0;}
.box000{ width:275px; float:left; margin:0px 0px 0px 0px; background:#ffffff; padding-bottom:0; }
.box000 h3{ color:#8dc63f; font-weight:bold; font-size:24px; margin:6px 10px 0 10px; width:20px; float:left; text-align:center; padding-bottom:0}
.box000 h3 span{ font-weight:normal; font-size: 14px; text-transform: uppercase;  text-align:center; margin-top:-10px; display:block}
.box000 p{ font-weight:normal; width:215px; float:right; margin:0 10px 0 0;}
.box000 h6{border-top:1px solid #6fae16; margin:13px 10px 0px 10px; width:256px; height:1px; float:left;}
.box000 h6:last-child{border-top:none;}
.box000 p strong a{ font-size: 13px;}
/********************** blue box*************/
.box2{ width:272px; float:left; margin:0px 0px; background:#94d1f2;  border-right:7px solid #52bdec; margin:0px 0px; padding:20px 20px 10px 20px;}
.box2 h1{ background:#d5ecfa; padding:2px 10px; width:154px; margin:0px 0px 0px 0px;}
.box2 h1 a{ color:#52bdec; font-family: 'gotham_mediumregular'; font-size:16px; font-weight:normal; padding:0; margin:0;}
.box00{ width:275px; float:left; margin:0px 0px 0px 0px; padding-bottom:5px; background:#ffffff; }
.box00 h2{ float:left; margin:10px 7px 10px 10px; width:auto;}
.box00 h4{ float:left; width:auto; margin:3px 5px 5px 0;}
.box00 p{ font-size:14px; color:#5f6062; font-weight:normal; width:205px; float:left; margin:0 0 0 10px;}
.box00 a.map{ float:left; color:#5f6062; font-weight:bold; text-decoration:underline; }
.box00 h3{ float:left; font-family:Arial, Helvetica, sans-serif; font-size:15px; font-weight:bold;  margin:14px 0 0 0px; width:215px;}
.box00 img{float:right}
/*======contact us css  start============== */ 
.contact{ width:946px; float:left; margin:0px 0px; background:#ffffff; /* border-right:5px solid #d6d3d2; */}
.boxtop-contact{ float:left; width:734px; height:10px;}
.boxbootem-contact{ float:none; height:10px; width:734px; margin-bottom:0px;}
.contact h2{ float:right; margin:20px 10px; width:475px;}
.contact h1{font-size:18px; color:#c4122f; font-weight:bold; line-height:16px; margin-left:0; margin-top:15px;}
.contact h3{font-size:13px; color:#505152; font-weight:bold; line-height:24px; margin:15px 0px 0px 0px;}
.contact p{font-weight:normal; width:315px; float:left; margin-left:0; margin-top:0;font-size: 13px;}
.contact .mail{ display: block; font-weight:bold; margin:16px 10px 0 0; text-decoration:underline; }
/*======news page css  start============== */
#news-page{float:left; width:660px; display:block;}
.news-page-top{ float:left; width:660px; height:5px;}
.news-page-center{ float:left; width:600px; padding:20px; display:block; background:#ffffff; border-right:3px solid #d6d3d2;}
.news-page-center p{ float:left; font-family:Arial, Helvetica, sans-serif; line-height:20px; font-size:12px; color:#5f6062;}
.news-page-bottom{ float:left; width:660px; height:5px;}
.centerbox-news{padding:20px 0px 0px 0px; background:none; border:none;  float:left;}
/*======work page css  start============== */
.work{ width:729px; float:left; margin:0px 0px; background:#ffffff; border-right:5px solid #d6d3d2; height:500px;}
.work-box{ float:right; margin:10px 10px; float:left; width:463px; height:200px; border:1px solid #c3c3c3; padding:5px; box-shadow: 2px 2px 1px #888888;}
.work-box h1{ float:left; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#4a4a4a; font-weight:bold; margin:10px 0px 0px 10px;}
.work-box p{ float:left; font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#4a4a4a; font-weight:normal; margin:5px 0px 0px 10px;}
.work-box h2{ float:right;}
.work-box h3{ font-family:Arial, Helvetica, sans-serif; float:left; margin:0px; float:right; font-size:11px; color:#4a4a4a; line-height:18px;}
.work-box h3 span{ color:#7a5c10;}
.work h1{ float:right; margin:10px 10px;}

.more-link{display: none}
div.box-orange {
float: left;
margin: 16px 0px 0px 0px;
width: 310px;
}
div.box-orange .centerbox1{width:272px; float:left; margin:0px 0px; background:#fecf71; border-right:7px solid #fdb813; padding: 20px;}
div.box-orange .centerbox1 .box5 p{ margin:10px 10px; line-height:18px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#5f6062;}
div.box-orange .centerbox1 h1{ background:#ffebc4; padding:2px 10px; width:183px; margin:0; color:#fdb303; font-family: 'gotham_mediumregular'; font-size:16px;}
div.box-orange .centerbox1 .box5{ width:275px; float:left; margin:0; background:#ffffff; }
.box5 ul{
	list-style:none;
	margin:0px;
	padding:0px;
}
.box5 li{
	list-style:none;
	margin:0px;
	padding:0px;
	color: #5F6062;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
	
}
body.category-work #xyz{
float: left;
margin: 16px 10px 0px 0px;
width: 310px;
}

/*====== Custom share button ============ */
.addthis_button{float:right}

div.grid-item,
div.single-item {
	overflow: hidden;
	margin: 0;
	border: 0;
}



/***************** NEW ********************/
body.archive .news-page-center p{
width: 100%;
}

body.single .single-item{
padding: 10px 20px;
} 

body.page .single-item{
padding: 10px 15px;
}

.cross-btn{
   display: block;
    float: right;
    height: 15px;
    position: relative;
    right: -11px;
    top: -6px;
    width: 15px;
}  

.cross-btn a img{
width: 15px;
height: 15px;
}

.icon1 a{
display: block;
float: left;
}

.icon1 a img{
display: block;
float: left;
}

.rss-link{
width: 60px !important;
}

.succes-subscribe{
float: right;
width: 125px;
margin: 3px 0 0 0;
color: #7cb72c;
display: none; 
}

body.search .post-body p{
width: 100%;
}

.search-form-bottom{
	float: right;
	margin: 0 0 0 10px;
	width: 255px;
	margin-top: -5px;
}


.search-form-bottom .input_search{
	 padding:4px; border:1px solid #999; font-size:11px;
	}
.search-form-bottom .btn_search{
	 padding:4px 8px; background-color:#C4122F;  font-size:11px; font-weight:bold; color:#fff; border:none; margin-left:-3px;
	}



				
/*-----------------------------------------------------------------------------------------------*/
/*                                         TOOLTIP STYLES                                        */
/*-----------------------------------------------------------------------------------------------*/

	.tTip { cursor: pointer; color: #4c4d4d;}
	.tip {color: #4c4d4d;}
	
		#cloud1 {top: 93px; left: 230px;}
		#cloud2 {top: 168px; left: 440px;}
		#cloud3 {top: 228px; left: 100px;}
		#cloud4 {top: 350px; left: 370px;}
		#cloud5 {top: 370px; left: 60px;}
.tip {
	width: 115px;
	padding: 8px 0;
	overflow: hidden;
	display: none;
	position: absolute;
	z-index: 500;
	background: url(images/tooltip-bg.png) no-repeat top;}
	
.tipMid { padding: 2px 0; text-align: center;}
.tipBtm { height: auto;} 

#wrapper-outer{
margin: 16px 0 0 0;
}

#flash{
z-index: 999 !important;
}



















