/* Author: Pixel Art Inc. Author URI: http://www.pixelartinc.com/ Author Email: info@pixelartinc.com */ /**************************************************************************** CSS RESET ****************************************************************************/ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline;} article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } ol, ul { list-style: none;} blockquote, q { quotes: none;} blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /**************************************************************************** FONTS ****************************************************************************/ @font-face { font-family: 'SourceSansProLight'; src: url('fonts/SourceSansPro-Light-webfont.eot'); src: url('fonts/SourceSansPro-Light-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/SourceSansPro-Light-webfont.woff') format('woff'), url('fonts/SourceSansPro-Light-webfont.ttf') format('truetype'), url('fonts/SourceSansPro-Light-webfont.svg#SourceSansProLight') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'SourceSansProRegular'; src: url('fonts/SourceSansPro-Regular-webfont.eot'); src: url('fonts/SourceSansPro-Regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/SourceSansPro-Regular-webfont.woff') format('woff'), url('fonts/SourceSansPro-Regular-webfont.ttf') format('truetype'), url('fonts/SourceSansPro-Regular-webfont.svg#SourceSansProRegular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'SourceSansProSemibold'; src: url('fonts/SourceSansPro-Semibold-webfont.eot'); src: url('fonts/SourceSansPro-Semibold-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/SourceSansPro-Semibold-webfont.woff') format('woff'), url('fonts/SourceSansPro-Semibold-webfont.ttf') format('truetype'), url('fonts/SourceSansPro-Semibold-webfont.svg#SourceSansProSemibold') format('svg'); font-weight: normal; font-style: normal; } /**************************************************************************** BASIC STYLES ****************************************************************************/ body{ background:#f5f5f5; min-width:320px; color:#000; font:14px Arial, Helvetica, sans-serif; } h1,h2,h3,h4,h5,h6{ font-weight:bold; } h1{ font-size:30px;} h2{ font-size:24px;} h3{ font-size:18px;} h4{ font-size:14px;} h5{ font-size:12px;} h6{ font-size:10px;} ::-moz-selection { background: #fe57a1; color: #fff; text-shadow: none; } ::selection { background: #fe57a1; color: #fff; text-shadow: none; } a:focus { outline: thin dotted; } a:hover, a:active { outline: 0; } .clearfix:before, .clearfix:after { content: ""; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } /**************************************************************************** HEADER ****************************************************************************/ .header-wrapper{background:url(images/headerbackground.jpg) center center no-repeat; width:100%; overflow:hidden; border-top:4px solid #f6ae2f;position:relative;} .header-work { background:url(images/work-header.png) no-repeat; } .services-wrapper { background: url(images/services-header.png) no-repeat; } .header-wrapper header{width:940px; margin:0 auto; position: relative; border-bottom: 1px solid rgba(51,127,136,0.5); height:170px; /*padding-top:51px; padding-bottom:42px;*/} .header-wrapper header .logo{ float:left; display: inline-block; line-height: 124px; margin-top: 5px; } .header-wrapper header .logo img { vertical-align: middle; } .header-wrapper header .main-nav{float:right; margin-right: 0; margin-top:130px;} .header-wrapper header .main-nav > li{ float: left; margin-left: 35px; position: relative; } .header-wrapper header .main-nav .current { color: #f6ae2f; } .header-wrapper header .main-nav li a {text-shadow:1px 1px 0px #000; font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color: #FFF; text-decoration: none; } .header-wrapper header .main-nav li a:hover{color:#fefc40;} .header-wrapper header .main-nav .sub-menu { position: absolute; top: 18px; left: -10px; display: none; z-index: 999999; padding-top: 10px; } .header-wrapper header .main-nav .sub-menu li a { color: #b6c2c9; width: 150px; line-height: 20px; background: rgba(7,22,32,0.5); padding: 10px 10px 6px 10px; display: block; } .header-wrapper header .main-nav .sub-menu li:hover a { color: #fff; } .header-wrapper header .main-nav .sub-menu li:first-child a { border-top-left-radius: 5px; border-top-right-radius: 5px; } .header-wrapper header .main-nav .sub-menu li:last-child a { border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; } .header-wrapper header #main-nav{display:none;} .header-wrapper header .purchase{font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background:url(images/button-p.jpg) repeat-x; transition-property:top;transition-duration: 0.5s;-moz-transition-property:top;-moz-transition-duration: 0.5s;-webkit-transition-property:top; -webkit-transition-duration: 0.5s;-o-transition-property:top;-o-transition-duration: 0.5s; border-radius: 25px; padding:0px 32px; line-height: 40px; text-align: center; text-decoration: none; color: #1b445e; display:inline-block; position:absolute; right: 2px; top:42px;} .header-wrapper header .purchase:hover{top:40px; color:#1b445e;} .header-wrapper .header-text{width:946px; margin:0 auto; padding:48px;} .header-wrapper .header-text h1{float:left; padding-top:12px; margin-right:73px;font:40px 'SourceSansProSemibold', Arial, Helvetica, sans-serif; color:#FFF;} .header-wrapper .header-text h1 span{font:40px 'SourceSansProLight', Arial, Helvetica, sans-serif; color:#FFF;} .header-wrapper .header-text p{width:600px; float:left; font:18px 'SourceSansProRegular', Arial, Helvetica, sans-serif;color:#f3f8ea;line-height:30px;} /**************************************************************************** SLIDER ****************************************************************************/ .slider{width:100%; height:352px; } .slider .slide { width: 100%; } .slider .slide > div { width: 960px; margin:0 auto; } .slider .slide-content{padding-top:66px; padding-left:8px;} .slider .slide-content > div { width: 350px; float: left; } .slider .slide-content h1{font:35px 'SourceSansProLight', Arial, Helvetica, sans-serif; color:#FFF; margin-bottom:14px;} .slider .slide-content h1 span{font:40px 'SourceSansProSemibold', Arial, Helvetica, sans-serif; color:#FFF; } .slider .slide-content p{font:20px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:30px; color:#FFF;margin-bottom:20px} .slider .slide-content .clearfix { width:555px; float:left; } .slider .slide-content img {float:right; margin-top: -40px;} .slide-option{position:absolute; bottom:29px;left:50%; margin-left:-480px; width:960px; text-align:center;z-index:9999;} .slide-option a{background:#355568; height:9px; width:10px;display:inline-block;-webkit-border-radius:100%;-moz-border-radius:100%;-o-border-radius:100%;border-radius:100%; font-size:0px;line-height:0px;text-indent:-9999px; margin-right:5px;} .slide-option a:hover, .slide-option a.activeSlide{background:#cfd6db;} /**************************************************************************** HOME FEATURE BOXES ****************************************************************************/ .feature-wrapper{width:100%;padding:25px 0px; background:url(images/feature-bg.png) repeat-x;overflow:hidden;border-top:4px solid #1b1f23;border-bottom:12px solid #f6ae2f;} .feature-wrapper .feature{width:940px; margin:0 auto; } .feature-wrapper .feature .customization{width:272px; float:left; margin-right:61px;} .feature-wrapper .feature >.customization:last-child{float:right; margin-right:11px; width:263px; padding-left:0px;} .feature-wrapper .feature .customization img{margin-right:18px; float:left;} .feature-wrapper .feature .customization h1{font:22px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#FFF; margin-bottom:27px;padding-top:5px;} .feature-wrapper .feature .customization h1 span{font:22px 'SourceSansProLight', Arial, Helvetica, sans-serif; color:#FFF;} .feature-wrapper .feature .customization p{text-shadow:1px 1px 0px #000;font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:24px; color:#a3a9b1;margin-bottom:5px;} .feature-wrapper .feature .customization a{font-size:14px;text-decoration:none; color:#FFF;background:url(images/anchore-angle.png) no-repeat right; padding-right:13px;} /**************************************************************************** HOME CONTENTS ****************************************************************************/ .contant{width:940px; margin:0 auto;padding-top:32px;padding-bottom:0; } .contant .mainarea { margin-bottom:0px; } .contant .mainarea #mainarea{width: 920px; float:left; } .contant .mainarea #mainarea h2{margin-bottom:24px;font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;} .contant .mainarea #mainarea .icon {margin-bottom:24px;font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif; height:120px; line-height: 85px;} .contant .mainarea #mainarea h2 span{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contant .mainarea #mainarea p{width:500px;margin-bottom:28px;font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:23px; color:#393939;} .contant .mainarea #mainarea p strong{font-weight:bold;} .contant .mainarea #mainarea a{position:relative; top:0px;font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background:url(images/pdf_icon.png) no-repeat; color: #0e6295; line-height: 40px; text-indent: 40px; text-align: left; text-decoration: underline; display:inline-block; } .contant .mainarea #mainarea a:hover{color:#04ddfb; } .contant .mainarea #mainarea img {float: right; margin-left: 30px; margin-right: -120px;} .contant .mainarea #mainarea #question {font:18px 'SourceSansProSemibold', Arial, Helvetica, sans-serif; color: #0e6295; line-height: 23px; margin-bottom: 5px;} .contant .mainarea #mainarea #answer {font:18px 'SourceSansProRegular', Arial, Helvetica, sans-serif; font-style: italic; color: #000; line-height: 23px; margin-bottom: 30px;} .contant .splitcolumn { float:left; width: 500px;} .contant .splitcolumn-templates { float:left; width: 650px;} .contant .splitcolumn .columnl{ float:left; width: 250px} .contant .splitcolumn-templates .columnl-templates { float:left; width: 350px} .contant .splitcolumn .columnl h1 {background:url(images/wdd.png) no-repeat;} .contant .splitcolumn .columnr{float:right;width:250px;} .contant .splitcolumn-templates .columnr-templates{float:right;width:300px;} .contant .splitcolumn .columnr h1 {background:url(images/cp.png) no-repeat;} .contant .recent-work { border-bottom:1px solid #CCC; margin-bottom:44px;} .contant .recent-work h1{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif; color:#393939; margin-bottom:33px;} .contant .recent-work h1 span{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contant .recent-work a {width:300px; height:233px;display:block;float:left; overflow: hidden; margin-right:18px;margin-bottom:43px;border-radius:2px; } .contant .recent-work a:last-child { margin-right: 0px; } .contant .about { margin-bottom:48px; } .contant .about #aboutus{width: 530px; float:left; } .contant .about #aboutus h2{margin-bottom:24px;font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;} .contant .about #aboutus h2 span{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contant .about #aboutus p{margin-bottom:28px;font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:26px; color:#393939;} .contant .about #aboutus p strong{font-weight:bold;} .contant .about #aboutus a{position:relative; top:0px;transition-property:top;transition-duration: 0.5s;-moz-transition-property: top;-moz-transition-duration: 0.5s;-webkit-transition-property: top; -webkit-transition-duration: 0.5s;-o-transition-property: top;-o-transition-duration: 0.5s;font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background: #f1621a;color: #FFF; border-radius: 25px; padding: 0px 32px; height:40px; line-height: 40px; text-align: center; text-decoration: none; display:inline-block; margin-right:17px; } .contant .about #aboutus a:hover{top:-2px; } .contant .quote-slider { width:335px; } .contant .quote-slider .slide .top{background:#FFF url(images/colums.png) no-repeat 300px 200px;border:1px solid #cfcfcf;border-top-left-radius:3px;border-top-right-radius:3px;height:177px; width:264px; border-bottom:0px; padding:35px; padding-bottom:0px;} .contant .quote-slider .slide .top blockquote{ padding-bottom:35px;font:13px 'SourceSansProRegular' Arial, Helvetica, sans-serif; line-height:23px; color:#808080;} .contant .quote-slider .slide .title {text-align:right;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;margin: 6px 2px 0px 0px;} .contant .quote-slider .slide .title strong{font:13px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;} .contant .quote-slider .slide .title a{text-decoration:none; color:#f1621a;} .contant .quote-slider .slide .bottom{ background:url(images/quotebottom-bg.png) no-repeat; width:340px; height:35px;margin-bottom: 13px;} .quote { width:335px; float:right; margin: 28px 3px 0px 0px; position: relative; } .quote .quote-option { position:absolute;right:0px;top:-30px;} .quote .quote-option a { margin-left:4px;font-size:0px;background:#dcdcdc; height:6px; width:6px; display:inline-block; border-radius:100%;} .quote .quote-option a:hover, .quote .quote-option a.activeSlide { background:#7b7b7b;} .quotemini { width:295px; float:right; margin: 28px 3px 0px 0px; position: relative; } .contant .quotemini-slider { width:295px; } .contant .quotemini-slider .slide .top{background:#FFF url(images/colums.png) no-repeat 300px 200px;border:1px solid #cfcfcf;border-top-left-radius:3px;border-top-right-radius:3px;height:80px; width:268px; border-bottom:0px; padding:15px; padding-bottom:0px;} .contant .quotemini-slider .slide .top blockquote{ padding-bottom:35px;font:15px 'SourceSansProRegular' Arial, Helvetica, sans-serif; line-height:23px; color:#808080;} .contant .quotemini-slider .slide .title {text-align:right;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;margin: 6px 2px 0px 0px;} .contant .quotemini-slider .slide .top strong{font:24px 'SourceSansProSemibold', Arial, Helvetica, sans-serif; color: #000;} .contant .quotemini-slider .slide .title a{text-decoration:none; color:#f1621a;} .contant .quotemini-slider .slide .bottom{ background:url(images/quotebottom-small.png) no-repeat; width:300px; height:31px;margin-bottom: 13px;} /**************************************************************************** SPECIAL OFFER ****************************************************************************/ .specialoffer{ background:url(images/special-banner-csr.png) no-repeat; width: 916px; height:120px; padding-left:22px; margin-bottom: 48px;} .specialoffer p{ float:left; color:#e9f3db;font: 24px 'SourceSansProLight', Arial, Helvetica, sans-serif; margin: 48px 0px 0px; } .specialoffer p span { color:#fff; font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif; margin-left: 20px; margin-right: 20px; } .specialoffer p span strong {font:42px; color: #1e5b7f; font-family: 'SourceSansProSemiBold', Arial, Helvetica, sans-serif; margin-left: 20px; } .specialoffer a.btn { margin: 42px 50px 0px 0px; float: right; } /**************************************************************************** BUTONS ****************************************************************************/ .light { font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background:url(images/button-p.jpg) repeat-x; position:relative; top:0px; transition-property:top;transition-duration: 0.5s;-moz-transition-property: top;-moz-transition-duration: 0.5s;-webkit-transition-property: top; -webkit-transition-duration: 0.5s;-o-transition-property: top;-o-transition-duration: 0.5s; border-radius: 25px; padding: 0px 32px; height:39px; line-height: 40px; text-align: center; text-decoration: none; color: #1b445e; display:inline-block; margin-right:13px; } .orange { font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background:#f1621a; position:relative; top:0px; transition-property:top;transition-duration: 0.5s;-moz-transition-property: top;-moz-transition-duration: 0.5s;-webkit-transition-property: top; -webkit-transition-duration: 0.5s;-o-transition-property: top;-o-transition-duration: 0.5s; border-radius: 25px; padding: 0px 32px; height:40px; line-height: 40px; text-align: center; text-decoration: none; color: #f6f6f6; display:inline-block; } .black { font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;background:url(images/button-b.jpg) repeat-x; position:relative; top:0px; transition-property:top;transition-duration: 0.5s;-moz-transition-property: top;-moz-transition-duration: 0.5s;-webkit-transition-property: top; -webkit-transition-duration: 0.5s;-o-transition-property: top;-o-transition-duration: 0.5s; border-radius: 25px; padding: 0px 32px; height:39px; line-height: 40px; text-align: center; text-decoration: none; color: #FFFFFF; display:inline-block; margin-right:13px; -webkit-box-shadow:0px 1px 1px 0px #101113; box-shadow:0px 1px 1px 0px #101113; border-top: 1px solid #6c7a8c; } .light:hover { top: -2px; } .orange:hover { top: -2px; } .black:hover { top: -2px; } /**************************************************************************** BOTTOM ****************************************************************************/ .bottom-wrapper{background:#fafbf9; width:100%; border-top:1px solid #cfcfcf;} .bottom-wrapper .bottom{width:940px; margin:0 auto;padding:53px 0px 60px;} .bottom-wrapper .bottom h3 { font:26px 'SourceSansProRegular', Arial, Helvetica, sans-serif; margin-bottom:28px; } .bottom-wrapper .bottom h3 span { font-sfamily: 'SourceSansProLight', Arial, Helvetica, sans-serif; } .bottom-wrapper .bottom .blog{width:270px;margin-right:59px; float:left;} .bottom-wrapper .bottom .blog h4{margin-bottom:6px;font:18px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;} .bottom-wrapper .bottom .blog .post-meta{margin-bottom:18px;font:14px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#979797;} .bottom-wrapper .bottom .blog p{margin-bottom:12px;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:23px;} .bottom-wrapper .bottom .blog a{background:url(images/angle.jpg) no-repeat right 2px;padding-right:12px; text-decoration:none; color:#f1621a;font:14px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;} .bottom-wrapper .bottom .tweets{width:274px;margin-right:55px; float:left;} .bottom-wrapper .bottom .tweets ul{background:#FFF; border:1px solid #cfcfcf; border-radius:3px;} .bottom-wrapper .bottom .tweets ul li{padding:20px;border-bottom:1px solid #cfcfcf;color:#5e5d5d;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:20px;} .bottom-wrapper .bottom .tweets ul li a{color:#f1621a;text-decoration:none;} .bottom-wrapper .bottom .tweets ul li a:hover{text-decoration:underline;} .bottom-wrapper .bottom .tweets ul li .tweet_time a{color:#909090;display:block;} .bottom-wrapper .bottom .news{width:274px;margin-right:55px; float:left;} .bottom-wrapper .bottom .news ul{background:#FFF; border:1px solid #cfcfcf; border-radius:3px;} .bottom-wrapper .bottom .news ul li{padding:20px;border-bottom:1px solid #cfcfcf;color:#5e5d5d;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:20px;} .bottom-wrapper .bottom .news ul li a{color:#f1621a;text-decoration:none;} .bottom-wrapper .bottom .news ul li a:hover{text-decoration:underline;} .bottom-wrapper .bottom .news ul li .tweet_time a{color:#909090;display:block;} .bottom-wrapper .bottom .touch{width:270px; float:right;} .bottom-wrapper .bottom .touch h3 { margin-bottom:17px;} .bottom-wrapper .bottom .touch p{margin-bottom:20px;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:23px;} .bottom-wrapper .bottom .touch ul{border-bottom:1px solid #e7e5dd; margin-bottom:17px;} .bottom-wrapper .bottom .touch ul li { line-height:16px; padding-left:25px; margin-bottom:12px; font-size:13px; } .bottom-wrapper .bottom .touch ul li a {color:#f1621a;text-decoration:none;} .bottom-wrapper .bottom .touch ul .phone{background:url(images/iphone.png) no-repeat left; } .bottom-wrapper .bottom .touch ul .mail{background:url(images/mail.png) no-repeat left;margin-bottom:9px;} .bottom-wrapper .bottom .touch ul .marker{background:url(images/marker.png) no-repeat left;margin-bottom:18px;} .bottom-wrapper .bottom .touch .social-nav a {display:inline-block; height:17px; width:20px; margin-right:5px;} .bottom-wrapper .bottom .touch .social-nav .tw{background:url(images/twitter.png) no-repeat;} .bottom-wrapper .bottom .touch .social-nav .fb{background:url(images/facebook.png) no-repeat;} .bottom-wrapper .bottom .touch .social-nav .vm{background:url(images/vimeo.png) no-repeat;} .bottom-wrapper .bottom .touch .social-nav .su{background:url(images/su.png) no-repeat;} .bottom-wrapper .bottom .touch .social-nav .li{background:url(images/linkedin.png) no-repeat;} .bottom-wrapper .bottom .touch .social-nav .bl{background:url(images/blogger.png) no-repeat;} /**************************************************************************** FOOTER ****************************************************************************/ .footer-wrapper{background:url(images/footer-bg.png) repeat-x; width:100%; overflow:hidden; height:185px;} .footer-wrapper footer{width:946px; margin:0 auto; padding-top:48px; text-shadow:2px 2px #000000;} .footer-wrapper footer .left { float: left; } .footer-wrapper footer .right { float: right; } .footer-wrapper footer ul li {margin-right:15px;display:inline;color:#d7dee8; font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .footer-wrapper footer a {text-decoration:none; color:#d7dee8;} .footer-wrapper footer p {color:#d7dee8; font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} /**************************************************************************** OUR TEAM ****************************************************************************/ .team-wrapper{width:100%; background:#fafafa; border-top:4px solid #e2e2e2;padding:49px 0px 62px;border-bottom:1px solid #e2e2e2;} .team-wrapper .our-team{width:946px; margin:0 auto;} .team-wrapper .our-team h1{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif; margin-bottom:30px;} .team-wrapper .our-team h1 span{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif; } .team-wrapper .our-team ul li{ float:left;border:1px solid #ededed;border-radius:3px;margin-right:30px;text-align:center;width:211px; } .team-wrapper .our-team ul li:last-child { margin-right:0px; } .team-wrapper .our-team ul li p{margin:26px 0px 5px;font:20px 'SourceSansProLight', Arial, Helvetica, sans-serif;} .team-wrapper .our-team ul li p strong{font:20px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .team-wrapper .our-team ul li span{margin-bottom:23px; display:inline-block;font:16px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#1e5b7f;} .team-wrapper .our-team ul li div{height:53px; background:#f2f3f4;line-height:53px; border-top:1px solid #dfdfdf;} .team-wrapper .our-team ul li div a {display:inline-block;width:20px;margin-right:15px;vertical-align:middle;} .team-wrapper .our-team ul li div .tw{background:url(images/twitter.png) no-repeat;width:21px;height:15px;} .team-wrapper .our-team ul li div .fb{background:url(images/facebook.png) no-repeat;width:16px;height:16px;} .team-wrapper .our-team ul li div .dd{background:url(images/dd.png) no-repeat;width:16px;height:16px; } .team-wrapper .our-team ul li div .mp{background:url(images/mp.png) no-repeat;width:17px;height:17px;} .team-wrapper .our-team ul li div .de{background:url(images/de.png) no-repeat;width:14px;height:14px; } .team-wrapper .our-team ul li div .ve{background:url(images/v.png) no-repeat;width:16px;height:16px;} .contant .who-we{width:470px; float:left; margin-right:30px; padding-top:8px;} .contant .who-we h1{font: 30px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#393939; margin-bottom:30px;} .contant .who-we h1 span{font-family: 'SourceSansProLight', Arial, Helvetica, sans-serif;} .contant .who-we p{font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:26px; color:#393939;margin-bottom:26px;} .contant .who-we p strong{font:15px 'SourceSansProSemibold', Arial, Helvetica, sans-serif; } .contant .who-we-image {margin-top:76px; margin-bottom:60px;width:440px;height:252px;float:right;} .contant .hiring{background:#fbfbf9; width:879px; height:82px; border:3px solid #ed6019; border-radius:3px;padding:0px 23px 0px 30px; margin: 3px 0px 60px;} .contant .hiring h4{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif; float:left; color:#424242; margin:27px 55px 0px 0px;} .contant .hiring h4 span{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contant .hiring p{font:20px 'SourceSansProRegular', Arial, Helvetica, sans-serif;color:#424242; float:left; margin: 33px 0px 0px; } .contant .hiring .orange { margin: 20px 0px 0px 0px; float: right; } .contant .we-do{width:250px; float:left; margin: 0px 102px 0px -2px;} .contant .we-do h1{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;color:#393939; margin-bottom:32px;} .contant .we-do h1 span{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#393939;} .contant .we-do ul .wdd{background:url(images/wdd.png) no-repeat left; font:16px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#393939;line-height:25px; padding-left:50px; margin-bottom:25px} .contant .we-do ul .cp{background:url(images/cp.png) no-repeat left;font:16px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#393939;line-height:25px; padding-left:50px; margin-bottom:25px } .contant .we-do ul .mb{background:url(images/mb.png) no-repeat left;font:16px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#393939;line-height:25px; padding-left:50px; margin-bottom:25px} .contant .clients{width:588px; float:right; margin-bottom:15px;} .contant .clients h1{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;color:#393939; margin-bottom:15px;} .contant .clients h1 span{font-family:'SourceSansProRegular', Arial, Helvetica, sans-serif;color:#393939;} .contant .clients .pager{text-align:right;} .contant .clients .pager a{font-size: 0px; background:#dcdcdc; height:6px; width:6px; display:inline-block; border-radius:100%; vertical-align:top; margin-left:4px;s} .contant .clients .pager a:hover, .contant .clients .pager a.activeSlide{background:#7b7b7b;} .contant .clients .top-comments{background: #fff url(images/colums.png) no-repeat 545px 101px;width:517px;min-height:69px; border:1px solid #cfcfcf; border-top-left-radius:3px;border-top-right-radius:3px;padding: 34px 34px 18px 34px;border-bottom:none;} .contant .clients .top-comments blockquote{font:14px 'SourceSansProRegular', Arial, Helvetica, sans-serif;color:#393939;line-height:23px;} .contant .clients .botom-comments{background:url(images/bottom-com.png) no-repeat;height:28px; width:587px; margin-bottom:13px;} .contant .clients p{text-align:right;font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contant .clients p strong{font:13px 'SourceSansProSemibold', Arial, Helvetica, sans-serif;} .contant .clients p a{text-decoration:none; color:#f1621a;} /**************************************************************************** OUR WORK ****************************************************************************/ #work .contant {margin:0 auto; padding:55px 0px; width:960px;} #work .protfolio {border-bottom:1px solid #cfcfcf; margin-bottom:45px;} #work .protfolio a { text-decoration:none; } #work .protfolio .my-selector { margin-bottom:41px; } #work .protfolio .my-selector a{text-decoration:none; margin-right:18px; color:#393939;font:18px 'SourceSansProLight', Arial, Helvetica, sans-serif; display:inline-block;} #work .protfolio .my-selector a:hover{color:#000;} #work .protfolio ul li{float:left; margin:0px 30px 30px 0px; height:210px;width:210px;position:relative;} #work .protfolio ul li a { display:block; width:211px;height:210px;position:absolute;top:0px;left:0px; background:url(images/overlay-bg.jpg);line-height:210px;text-align:center;color:#fff; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; } #work .protfolio .selection { margin:9px 0px 35px; text-align:center;} #work .protfolio .selection a{text-decoration:none; margin-right:18px; color:#393939;font:18px 'SourceSansProLight', Arial, Helvetica, sans-serif; display:inline-block;} #work .protfolio .selection a:hover{color:#000;} #work .quote { margin-right:24px; } #work .about { margin-bottom:6px; } /**************************************************************************** SERVICES ****************************************************************************/ .table-wrapper{width:100%; background:url(images/feature-bg.png) repeat;overflow:hidden;border-top:4px solid #1b1f23;border-bottom:12px solid #eb7126;} .pricetable{width:940px; margin:0 auto;} .pricetable h1, .pricetable-b h1 {font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;color:#393939; margin-bottom:30px;} .pricetable h1 span, .pricetable-b h1 span {font-family:'SourceSansProRegular', Arial, Helvetica, sans-serif;color:#393939;} .pricetable ul{width:285px; margin:60px 39px 64px 0px; border:1px solid #44484d; border-radius:5px; float:left;overflow:hidden; } .pricetable ul:hover{ border: 5px solid #b94e19; width: 277px; } .pricetable ul:last-child { margin-right: 0px; } .pricetable ul .first{background:#101215; text-align:center;color:#FFF;padding:34px 0px 27px; border-bottom:1px solid #353a40;} .pricetable ul .first h4{font:22px 'SourceSansProLight', Arial, Helvetica, sans-serif;} .pricetable ul .first span{font-family: 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .pricetable ul .second{background:#20242a; padding:12px 0px 7px; border-bottom:1px solid #353a40;text-align:center;color:#FFF;} .pricetable ul .second p{font:18px 'SourceSansProLight', Arial, Helvetica, sans-serif;margin:20px 0px 18px;} .pricetable ul .second p span{font-family:'SourceSansProRegular', Arial, Helvetica, sans-serif;} .pricetable ul .third{line-height:74px; text-align:center; background:#20242a;} .pricetable ul:hover .third { line-height:64px; } .table-wrapper-b{width:100%; overflow:hidden; border-top:4px solid #e2e2e2;} .pricetable-b{width:940px; margin:0 auto; padding-top:48px;} .pricetable-b ul{width:285px; margin:0px 39px 0px 0px; border:1px solid #e9e9e9; border-radius: 5px; float:left; overflow:hidden; } .pricetable-b ul:last-child { margin-right: 0px; } .pricetable-b ul .first{background:#f26b27; text-align:center;color:#FFF;padding:34px 0px 27px; border-bottom:1px solid #dfdfdf;} .pricetable-b ul .first h4{font:22px 'SourceSansProLight', Arial, Helvetica, sans-serif;} .pricetable-b ul .first span{font-family: 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .pricetable-b ul .second{background:#fff; padding:12px 0px 7px; border-bottom:1px solid #ececec; border-top:3px solid #ececec; text-align:center;color:#393939;} .pricetable-b ul .second p{font:18px 'SourceSansProLight', Arial, Helvetica, sans-serif;margin:20px 0px 18px;} .pricetable-b ul .second p span{font-family:'SourceSansProRegular', Arial, Helvetica, sans-serif;} .pricetable-b ul .third{line-height:74px; text-align:center; background:#edeeef;border-top: 3px solid #e7e7e7;} .contant .services{padding:12px 0px 25px;} .contant .services > div { width:445px;} .contant .services > div h1 {color:#393939; height:25px;display:inline-block;padding-left:55px;font:26px 'SourceSansProRegular', Arial, Helvetica, sans-serif;margin-bottom:40px;line-height:25px;} .contant .services > div p {font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif;line-height:26px;color:#393939;margin-bottom:17px;} .contant .services > div p strong {font-weight:bold;} .contant .services > div li {font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; font-weight: bold; color:#393939; padding-left:33px; margin-bottom:17px; background:url(images/dot.jpg) left 4px no-repeat;} .contant .services .web-dd{ float:left;} .contant .services .web-dd h1 {background:url(images/wdd.png) no-repeat;} .contant .services .copy-r{float:right;width:254px;} .contant .services .copy-r h1 {background:url(images/cp.png) no-repeat;} .services-text { padding: 0px 138px; margin: 0px 0px 50px; text-align: center; } .services-text h1 { font:40px 'SourceSansProLight', Arial, Helvetica, sans-serif; } .services-text span {font-family:'SourceSansProRegular', Arial, Helvetica, sans-serif;} /**************************************************************************** BLOG ****************************************************************************/ .container { width: 946px; margin: 0 auto; padding-bottom: 46px; } .container .contant { float:left; width:624px; margin-right:90px; padding-top: 56px;} .container .contant .post{margin-bottom:71px;} .container .contant .post-single { margin-bottom: 56px; } .container .contant .post h1{font:30px 'SourceSansProRegular', Arial, Helvetica, sans-serif; margin-bottom:13px; color:#0a0a0a;} .container .contant .post .post-meta{margin-bottom:38px; font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .container .contant .post .post-meta span{ border-right:1px solid #5a5a5a; margin-right:10px; padding-right: 10px;color:#5a5a5a;} .container .contant .post .post-meta a { text-decoration:none; color:#f1621a; } .container .contant .post .feature-image {display: block; margin-bottom:36px; line-height:0px;} .container .contant .post .feature-image img { width: 100%; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px;} .container .contant .post > p {font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#464646; line-height:26px; margin-bottom:27px;} .container .contant .post a { color:#f1621a; text-decoration:none; } .container .contant .post a:hover { text-decoration: underline; } .container .contant .post strong { font-weight: bold; } .container .contant .post em { font-style: italic; } .container .contant .post .read-more { text-decoration:none; font:14px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#f1621a; display:inline-block;} .container .contant .post .read-more:hover { text-decoration: underline; } .container .contant .post ul, .container .contant .post ol { margin: 0px 0px 27px 18px; } .container .contant .post li {font:15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:26px; margin: 0px 0px 15px; color:#464646; } .container .contant .post ul li { background:url(images/bulets.png) no-repeat left 10px; padding-left:32px;} .container .contant .post ol li { list-style:decimal inside; } .container .contant .pagination { font:18px 'SourceSansProLight', Arial, Helvetica, sans-serif; padding: 16px 0px 0px; } .container .contant .pagination a { color:#6a6a6a; margin-right:24px; text-decoration:none;} .container .contant .pagination a:hover { color:#0a0a0a; } .container .contant .pagination .p-n { float:right; } .container .contant .pagination .p-n a { margin-right: 16px; } /**************************************************************************** COMMENTS ****************************************************************************/ .comments{float:left;width:630px; margin-right:90px;border-top: 1px solid #e0e0e0; padding-top:65px;} .comments h1 { font:24px 'SourceSansProLight', Arial, Helvetica, sans-serif; margin-bottom:51px } .comments ul { margin: 0px 0px 76px; } .comments li { margin: 0px 0px 58px; } .comments .avatar { float:left; margin:0px 22px 0px 0px; width:69px; width: 55px; height: 55px; overflow: hidden; } .comments .com {width:547px;float:right;} .comments .com h1{color:#414141; font:18px 'SourceSansProRegular', Arial, Helvetica, sans-serif; margin-bottom:11px;} .comments .com h1 span{margin-left:24px; vertical-align:middle; font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#aaaaaa; } .comments .com p{margin-bottom:0px; font:14px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:22px; color:#414141;} #respond { margin: 0px 0px 10px; } #respond input[type="text"]{padding:10px 20px; height:27px; width:196px; border:1px solid #bbbbbb; margin: 0px 15px 20px 0px; } #respond textarea{resize:none; padding:20px; width:580px; height:80px; margin-bottom:24px;} #respond .orange { border: none; cursor: pointer; float: left; margin-right: 42px; } #respond > p{ font:13px 'SourceSansProRegular', Arial, Helvetica, sans-serif; line-height:44px; color:#8d8e8e;} /**************************************************************************** SIDEBAR ****************************************************************************/ .container .sidebar {float:right; width:225px; padding-top: 56px;} .sidebar .widget { margin: 0px 0px 40px; overflow: hidden; } .sidebar .widget h3 { font: 24px 'SourceSansProRegular', Arial, Helvetica, sans-serif; color:#0a0a0a; margin-bottom:30px;} .sidebar .widget ul li{background:url(images/dot.jpg) no-repeat left; padding-left:11px;font:15px 'SourceSansProLight', Arial, Helvetica, sans-serif;color:#828282;margin-bottom:21px;} .sidebar .widget ul li:last-child { margin-bottom: 13px; } .sidebar .widget ul li a{color:#828282;text-decoration:none;} .sidebar .widget ul li a:hover{color:#212121;} .sidebar .search-form { position: relative; } .sidebar .search-form input[type="text"]{ background:url(images/search-pic.png) no-repeat; border:none; padding: 14px 40px 15px 20px; line-height: 18px; width:160px; } .sidebar .search-form input.search-btn { border: none; background:url(images/zoomer.png) no-repeat; width: 17px; height: 17px; position: absolute; cursor: pointer; top: 16px; right: 20px; } .sidebar .flickr h3 { margin-bottom: 37px; } .sidebar .flickr a { height:69px; width:67px; float:left; display: block; margin:0px 6px 6px 0px; border:1px solid #e9e9e9; } .sidebar .flickr a img { width: 100%; height: 100%; } /********************************** CONTACT US **********************************/ .contact-form{border-bottom:1px solid #cfcfcf; margin-bottom:50px;} .contact-form h1{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;margin-bottom:30px;} .contact-form h1 span{ font-family: 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contact-form form input[type="text"]{padding:15px 22px; height:25px; line-height:25px; width:251px; border:1px solid #bbbbbb; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; margin: 0px 18px 20px 0px;} .contact-form form input[type="text"]:nth-child(3){margin-right:0px;} .contact-form form textarea{width:895px; height:146px; margin-bottom:22px; resize:none;padding:20px; } .contact-form form .submit-btn { border: none; float: right; cursor:pointer; padding:0px 40px; margin-bottom:35px; } .contact-info h1{font:30px 'SourceSansProLight', Arial, Helvetica, sans-serif;margin-bottom:30px;} .contact-info h1 span{ font-family: 'SourceSansProRegular', Arial, Helvetica, sans-serif;} .contact-info ul{margin-bottom:30px;} .contact-info ul li { display:inline; padding: 0px 24px 0px 26px; border-right:1px solid #cfcfcf; margin-right:20px; font: 15px 'SourceSansProRegular', Arial, Helvetica, sans-serif; } .contact-info ul .vanue{background:url(images/marker.png) no-repeat; } .contact-info ul .mobile{background:url(images/iphone.png) no-repeat; } .contact-info ul .email{background:url(images/mail.png) no-repeat 0px; border: 0px; } .contact-info ul li a {color:#f1621a;text-decoration:none;} #map_canvas { margin: 0px 0px 39px; width: 938px; height: 364px; border: 1px solid #bbbbbb; } /**** Isotope Filtering ****/ .isotope-item { z-index: 2; } .isotope-hidden.isotope-item { pointer-events: none; z-index: 1; } /**** Isotope CSS3 transitions ****/ .isotope, .isotope .isotope-item { -webkit-transition-duration: 0.8s; -moz-transition-duration: 0.8s; -ms-transition-duration: 0.8s; -o-transition-duration: 0.8s; transition-duration: 0.8s; } .isotope { -webkit-transition-property: height, width; -moz-transition-property: height, width; -ms-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width; } .isotope .isotope-item { -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; -ms-transition-property: -ms-transform, opacity; -o-transition-property: -o-transform, opacity; transition-property: transform, opacity; } /**** disabling Isotope CSS3 transitions ****/ .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition { -webkit-transition-duration: 0s; -moz-transition-duration: 0s; -ms-transition-duration: 0s; -o-transition-duration: 0s; transition-duration: 0s; }