* {margin:0; padding:0; }

html, body {height: 100%;}

body{ background:#FFF; font-family: 'Lucida Grande', 'Lucida Sans Unicode',sans-serif; font-size:13px; color:#434343;margin:0; }

h1, h2, h3, h4, h5, h6 {font-family:'Lucida Grande', 'Lucida Sans Unicode'; font-weight:normal;color:#000;}
h1  {font-family:"lucida sans",arial, sans-serif; font-size:25px; color:#FFF; letter-spacing:-1px; margin: 2px 0 0 15px; float:left; line-height:normal;}
h2 {font-size:32px; margin: 0 0 25px;  }
h2.small { font-size:22px; margin-bottom: 15px; }
h3 {font-size:14px; margin:0 0 10px; font-weight:bold;}
h4 {font-size:12px; margin:0 0 10px; font-weight:bold;}

input, textarea
{
	font-family:Tahoma;
	font-size:0.720em;
	line-height:1.46em;
	color:#034144;
	/*
    scrollbar-base-color:#ffca46;
    scrollbar-face-color:#242e38;
    scrollbar-highlight-color:#0075a6;
    scrollbar-shadow-color:#242e38;
    scrollbar-darkshadow-color:#242e38;
    scrollbar-3dlight-color:#242e38;
    scrollbar-arrow-color:#0075a6;
    */ 	
}

input, select { vertical-align:middle; font-weight:normal;}

.rowi {height:44px;}
.input {width:200px; height:20px; border:1px solid #d4dee1; background:#FFFFFF; padding:0 0 0 5px; font-size:1em;}
textarea {width:200px; height:210px; border:1px solid #d4dee1; background:#FFFFFF; padding:0 0 0 5px; overflow:auto; font-size:1em;}

p {line-height:18px; margin:0 0 15px 0; }
ul { margin:0px 0 25px 0px; padding:0 0 0 10px; }
ul li {  margin:0 15px 10px 0; list-style-type:none; }
ul li.current {}


a {color:#3084ca; text-decoration:none; font-weight:normal; }
a:hover { color: #78b9e7; }
img { border: none; }
.imgpad {padding: 3px 3px 3px 3px;}

/* custom classes */
.row {padding-top:3px; border-bottom:1px dotted #B2B2B2;}
.screenshot {margin-bottom:18px;}
.screenshot img { border: 3px solid #ccc; }

.icon-left { float:left; margin:0 10px 10px 0;}
.icon-right { float:right; margin:0 0 10px 10px;}

.quote { clear: left; margin: 10px 0 30px 30px; }
.quote blockquote { font-size: 16px; font-style: italic; font-family: Times, "Times New Roman", Serif; margin-bottom: 7px; color: #555; }
.quote img { float: left; margin-right: 25px; }
.quote p { text-align: right; color: #999; }
.box { background: #f2f2f2; padding: 15px; margin-bottom: 20px; border: 1px solid #ddd; }
.block { background:#efefef; border:1px solid #e5e5e5;padding: 7px 3px 7px 5px; margin-bottom: 30px; }
.block_bl { background:#c5effd; border:1px solid #3399ff; padding: 7px 3px 7px 5px; margin-bottom: 30px; }
.block_yl { background:#ffffcc; border:1px solid #ff9900; padding: 7px 3px 7px 5px; margin-bottom: 30px; }
.block_yl .title {color:#ff9900;font-weight:bold;}


.highlight-box { border:1px solid #e0bb3e; background:#fffcd7; margin: 0 0 25px 0; } /* yellow box on sign up */
.highlight-box h2 { margin: 0 0 10px 0;}
.highlight-box p { margin:0 0 5px 0 ; font-size:16px;}
.highlight-box p.notes { font-size:11px; }
.highlight-box-wrapper { padding:15px; }

.date { color: #4aa40d; font-weight: bold; }
.arrow-link { padding-left: 18px; background: url('../images/web/icons/arrow13.gif') center left no-repeat; }

/* typography related */
.important {color: #777; font-weight:bold; letter-spacing: -1px; padding-bottom:8px; clear:right;}
.light, .note, .hint { color: #777; }
.lighter { color: #ccc; }
.center {text-align:center; margin-left:auto; margin-right:auto;}
.big { font-size: 150%; }

.code { margin-bottom: 20px; background: #333; padding: 7px; }
.code-example { background:#fffbdf; border:1px solid #ffdeb7;  font-family:"Monoco","Lucida Console", sans-serif; margin-bottom:18px;}
.code-example .highlight { color:#59a322; font-weight:bold; }
.code-example em { color:#747474; font-weight:normal; font-style:normal; }
.code-example-wrapper { padding:15px;}

.code-tag { color: #069cc1; }
.code-liquid { color: #a0dde6; }
.code-liquid2 { color: #fff; }
.code-quot { color: #bedc77; }

.interview p { margin-bottom: 32px; }

/* the grid */
.col-0, .col-1, .col-2, .col-3, .col-6 {margin-right:35px; float:left;}

.col-0 {width:550px;}
.col-1 {width:255px;}

.col-2 {width:445px;}
.col-3 {width:205px;}
.col-4 {width:300px; margin-right:15px; float:left;}
.col-4-2 {width:325px; margin-right:15px; float:left;}

.col-5 {width:600px; float:left;}
.col-6 {width:350px;}
.col_wide {width:900px;}
.last {margin-right:0 !important;}

.margin-bottom {margin-bottom:10px; }


.l { text-align: left; }
.r { text-align: right; }
.left{float:left;}
.right{float:right;}
.clear {clear:both;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden; }

hr {color:#d9d9d9; background:#d9d9d9;border:0px; height:1px;margin-bottom:25px;clear:both;}
.screenshot {  margin-bottom:25px}
.rss {background:url(../images/web/icons/feed.gif) no-repeat 0 0; padding:2px 0 3px 31px; display:block;}

.title-big {font-family:'Tahoma'; font-size:36px; font-weight:bold; color:#ffffff;}
.title-big2 {font-family:'Tahoma'; font-size:16px; font-style:italic; color:#33ff00; margin-left:65px;}

.more {background:url(../images/web/icons/more_bg.gif) no-repeat 0 0; padding-left:21px; color:#000000; text-decoration:none;}
.more:hover {text-decoration:underline;}
/* ========== */
/* = Layout = */
/* ========== */

/* all content areas that are outside of grid but need to be centered with correct width */
.content { width:925px; margin: 0 auto; display: block; padding:0 20px; }
.content:after {content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}

#sitewrapper {min-height:100%; height:auto !important;height:100%;margin:0 auto -375px;/* neg val of footer height*/}

#header.twitter { background: #53a70f top left repeat-x; height: 260px; text-align: center; }

#container.homepage { background: #fff url('../images/web/backgrounds/bg-grey-top-white-bottom.gif') top left repeat-x; border-top: 1px solid #fff; padding: 30px 0 30px 0; }

#mainhead { height:41px; padding-top:13px; background: #212121 url('../images/web/backgrounds/bg-masthead.gif') top left repeat-x; } /* this contains the main nav */
#mainhead img.logo  { display:block; float:left; position: relative; bottom: 5px; }
#mainhead ul#nav-primary { float:right; margin:0; }
#mainhead ul#nav-primary li { float:left; list-style-type:none; margin:0 15px 0 0; height:27px; padding:8px 0 0 4px; background:none; }
#mainhead ul#nav-primary li a { padding:7px 8px 0px 6px; color:#ddd; text-decoration:none; font-weight:normal; font-size: 13px; outline:none; }
#mainhead ul#nav-primary li a:hover { color: #fff; text-decoration:none;}
#mainhead ul#nav-primary li a:active, #mainhead ul#nav-primary li a:focus { color:#FFF; } 
#mainhead ul#nav-primary li.current { background: url('../images/web/buttons/btn-currentpage-left.png') center left no-repeat; padding:1px 0 0 4px; line-height:12px; margin-top:2px;}
#mainhead ul#nav-primary li.current a { background:  url('../images/web/buttons/btn-currentpage-right.png') center right no-repeat; display:block; height:19px;}


#banner { height:35px; padding:25px 0 30px 0; background: #003C6E; }
#banner h1 { font-weight:bold; color: #fff;}

/* the contact info on the green banner */
#banner #contact-us {float:right; margin-top:5px;}
#banner #contact-us img { display:block; float:right;}
#banner #contact-us p { margin:0 0 5px 0;font-size:16px; color:#fff; font-family: "Helvetica Neue", sans-serif; font-weight: 200; margin:0 0 7px 0; text-align:right;}
#banner #contact-us a.contact {color: #33ff00; padding-left:65px;}
#banner #contact-us a.contact:hover { color: #fff;}
#content {padding:20px 0 0;}

#footer,#push { clear:both;/* .push must be the same height as .footer */ }
#push {height: 375px;}

#footer-wrapper { padding:20px 0 0 0; width:925px; margin:auto;}
#footer { background:#111 url('../images/web/background/bg-footer.gif') repeat-x; height: 375px; color: #666; border-top: 1px solid #444; font-size: 11.5px; }
#footer h3 { color: #fff; border-bottom: 1px solid #444; margin-bottom: 10px; padding:0 0 5px 0; font-size: 13px; font-weight:normal;}
#footer a { color: #777 }
#footer a:hover { color: #cdcdcd;  }
#footer ul { list-style-type: none; margin: 0 0 20px 0; padding: 0; }
#footer ul li { margin-bottom:5px; font-size:11.5px; background:none; padding:0; }
#footer ul li a { color:#999;  }
#footer ul li a:hover { color:#3084ca; }

#footer .content { margin-top:20px; }
#footer .copyright { margin-top:20px; }
#footer.homepage { height: 675px; }

#footer .contact-us img { margin-right:4px;}
#footer .contact-us li { margin-bottom:7px }
#footer .contact-us, #footer .contact-us a  { color: #cdcdcd; }
#footer .contact-us * { vertical-align: middle; }
#footer .contact-us a:hover { }
#footer  #copyright { text-align: center; font-size: 11px; color: #666; margin: 15px 0 10px 0; }

.feature { margin-bottom:18px ;}
.feature-box-top { background: url('../images/web/background/featurebox-top.gif') no-repeat; height:19px; clear:both; margin-top:15px;}
.feature-box-middle { background: url('../images/web/background/featurebox-middle.gif') repeat-y; padding:0 20px;font-size:12.5px; line-height:15px; }
.feature-box-middle p { margin:0; padding:0 0 18px 0;}
.feature-box-bottom { background: url('../images/web/background/featurebox-bottom.gif') no-repeat; height:19px; margin:0 0 25px 0 ;}

#feature-bar { background: #d2d2d2 url('../images/web/backgrounds/bg-grey.gif') top left repeat-x; height: 125px; padding-top: 6px; font-size: 12px; }
#features .feature { margin: 20px 0 0 0; }
#features .feature:hover { background: none; }

/* ================ */
/* =     INDEX    = */
/* ================ */
#header.homepage { background: #003C6E url('../images/web/backgrounds/header_bg.gif') no-repeat right; height:285px;}
#header.homepage h1 { margin:0; padding:0; float:none;}
#header.homepage .banner { margin:auto; width:925px; }
#header.homepage .left {width:250px; padding: 92px 0 0 0;}
#header.homepage .ht1 {padding: 40px 0 21px 0;}

/* banners */
#sidebar{ background: url('../images/web/backgrounds/bg-sidebar-feature.jpg') 35px 0px no-repeat; height:500px; padding: 15px 0 0 0; margin-top:-0px;}

#clients { background: #fff url('../images/web/backgrounds/bg-grey2.gif') top left repeat-x; padding:50px 0 50px 0; border-top: 1px solid #d5d5d5; }
#client-logos { margin: 0px 0 40px 0;}
#client-logos img { margin: 10px -5px 0 0;}
.client { clear: both; margin-bottom: 20px; font-size: 13px;}
.client p { color: #555; margin-bottom: 7px; }
.client img { float: left; margin-right: 10px; }
.client a { float: right; font-size: 11px; }
.client span { color: #999; font-size: 11px; }

#footer-news h3, #footer-twitter h3, #footer-contact h3 { padding: 5px 0 0 25px; height: 22px; }
#footer-news h3 { background: url('../images/web/icons/news-reader.gif') center left no-repeat; }

#footer-news a, #footer-twitter a { color: #78b9e7 !important; }
#footer-news a:hover, #footer-twitter a:hover { color: #3084ca !important; }

#footer-contact { font-size: 13.5px; }
#footer-contact h3 { background: url('../images/web/icons/mail.gif') center left no-repeat; }
#footer-contact p { padding: 2px 0 0 25px; height: 22px; color: #fff; margin-bottom: 10px; }

#footer-contact #footer-phone { background: url('../images/web/icons/phone.gif') center left no-repeat; color: #fff;}
#footer-contact #footer-email { background: url('../images/web/icons/email.gif') center left no-repeat; }

#footer-news li { border-bottom: 1px solid #111; border-top: 1px solid #333; margin: 0 !important; padding: 10px 0 !important; }
#footer-news li p { margin-bottom: 0; }
#footer-news ul li:first-child { border-top: none;}


/* ======= */
/* = 404 = */
/* ======= */
.missingpage {  width:535px; margin:auto; margin-top:50px; min-height: 300px;}
.missingpage .last { width:85px; }
.missingpage .super { vertical-align:super; font-size:14px; color:#aaa; margin-left: 5px; }
.missingpage .note { font-size:12px; color:#787878; margin-top:-10px; }

/* ======= */
/* = Unsupported Browser = */
/* ======= */
ul.alternative-browsers { margin: 0 0 15px 0; padding:0; }
ul.alternative-browsers li { margin:0 0 7px 0; padding:0 0 7px 0;border-bottom:1px solid #ececec; background:none; list-style-type:none; vertical-align:middle; }
ul.alternative-browsers li a img { vertical-align:middle; margin-right:10px;}

/* ============ */
/* = About Us = */
/* ============ */
#about-us {min-height:400px !important;}
#about-us .content {padding: 40px 0 40px 0;}

/* ============ */
/* = Servcies = */
/* ============ */
#services {min-height:400px !important;}
#services .content {padding: 40px 0 40px 0;}
#services .col-5 {padding: 15px 0 0 0;}
#services .technology img {padding: 10px;}
#services .feature-container{padding-top:25px;}
#services .feature-container .feature{float:left; width:280px;padding: 0 10px 0 0;}
#services .feature-container .feature .descr {font-size:12px;}
#services .feature-container .feature .descr p.title{color:#999;font-size:14px;font-weight:bold;}
#services .feature-container .feature .thumbnail {}
#services .feature-container .feature .thumbnail .small{margin: 0 0 10px 0;}


/* ============ */
/* = Portfolio = */
/* ============ */
#portfolio td {padding-right:5px; padding-top:5px; vertical-align:bottom; text-align:center; width:170px;}
#portfolio a {padding-top:10px;}
#portfolio .title {padding: 14px 0 25px 0;}
#portfolio .content {padding: 40px 0 40px 0;}
#portfolio .col-5 {padding: 15px 0 0 0;}

#menu ul li  {background: url('../images/web/icons/greybullet.gif') no-repeat top left; padding: 0 0 0 15px;}
/* ============ */
/* = Products = */
/* ============ */
#products {padding: 25px;}
#products .expandable {cursor:pointer;color:#d61719;width:600px;display:block;clear:both;padding-bottom:10px;}

/* ===================== */
/* = Website-Templates = */
/* ===================== */
#website-templates .content {padding: 40px 0 40px 0;}

/* ============ */
/* = News = */
/* ============ */
#news .AspNet-DetailsView-Data ul li {  margin:0 15px 10px 0; background: none; padding:0 0 0 15px; list-style-type:none; }
#news .expandable {cursor:pointer;color:#d61719;width:600px;display:block;clear:both;padding-bottom:10px;}


/* ============== */
/* = Contact Us = */
/* ============== */
#contact-us .padded {padding: 10px 0 10px 0;margin-left:45px;}

/* =================== */
/* = Update Progress = */
/* =================== */
#updProgress 
{
	z-index: 11000; left: 5px; position: absolute; bottom: 150px;
	border: Solid 1px #4682B4; background-color: #FFFAFA; vertical-align: middle; 
    text-align: left; width: 180px; height: 15px; padding: 5px 0px 8px 5px;
}
#updProgress span
{
	font-size: 0.8em;
	font-weight: bold; text-align: left; padding-left: 5px; margin-bottom: 10px;
}

/* =================== */
/* = Slider          = */
/* =================== */
#slider {
    width: 720px; /* important to be same as image width */
    height: 250px; /* important to be same as image height */
    position: relative; /* important */
	overflow: hidden; /* important */
	margin:0 auto ;
}

#slider #sliderContent {
    width: 720px; /* important to be same as image width or wider */
    position: absolute;
	top: 0;
	margin-left: 0;
}
#sliderContent .sliderImage {
    float: left;
    position: relative;
	display: none;
}
#sliderContent .sliderImage span {
    position: absolute;
	font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 10px 13px;
    width: 694px;
    background-color: #000;
    filter: alpha(opacity=70);
    opacity: 0.7;
    color: #fff;
    display: none;
}
#sliderContent .clear {
	clear: both;
}
#sliderContent .sliderImage span strong {
    font-size: 14px;
}
#sliderContent .left {
	top: 0;
    left: 0;
	width: 150px !important;
	height: 240px;
}
#sliderContent .right {
	right: 0;
	bottom: 0;
	width: 150px !important;
	height: 240px;
}
#sliderContent ul { list-style-type: none;}
#sliderContent ul li {background: none; padding:0px;}