/* Minification failed. Returning unminified contents. (2899,67): run-time error CSS1034: Expected closing parenthesis, found '=' (2899,67): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (2912,67): run-time error CSS1034: Expected closing parenthesis, found '=' (2912,67): run-time error CSS1062: Expected semicolon or closing curly-brace, found '=' (4432,19): run-time error CSS1036: Expected expression, found ';' */ /*! normalize.css v1.1.3 | MIT License | git.io/normalize */ /* ========================================================================== HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary { display: block; } /** * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. */ audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. * Known issue: no IE 6 support. */ [hidden] { display: none; } /* ========================================================================== Base ========================================================================== */ /** * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using * `em` units. * 2. Prevent iOS text size adjust after orientation change, without disabling * user zoom. */ html { font-size: 100%; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Address `font-family` inconsistency between `textarea` and other form * elements. */ html, button, input, select, textarea { font-family: sans-serif; } /** * Address margins handled incorrectly in IE 6/7. */ body { margin: 0; } /* ========================================================================== Links ========================================================================== */ /** * Address `outline` inconsistency between Chrome and other browsers. */ a:focus { outline: thin dotted; } /** * Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover { outline: 0; } /* ========================================================================== Typography ========================================================================== */ /** * Address font sizes and margins set differently in IE 6/7. * Address font sizes within `section` and `article` in Firefox 4+, Safari 5, * and Chrome. */ h1 { font-size: 2em; margin: 0.67em 0; } h2 { font-size: 1.5em; margin: 0.83em 0; } h3 { font-size: 1.17em; margin: 1em 0; } h4 { font-size: 1em; margin: 1.33em 0; } h5 { font-size: 0.83em; margin: 1.67em 0; } h6 { font-size: 0.67em; margin: 2.33em 0; } /** * Address styling not present in IE 7/8/9, Safari 5, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. */ b, strong { font-weight: bold; } blockquote { margin: 1em 40px; } /** * Address styling not present in Safari 5 and Chrome. */ dfn { font-style: italic; } /** * Address differences between Firefox and other browsers. * Known issue: no IE 6/7 normalization. */ hr { -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Address styling not present in IE 6/7/8/9. */ mark { background: #ff0; color: #000; } /** * Address margins set differently in IE 6/7. */ p, pre { margin: 1em 0; } /** * Correct font family set oddly in IE 6, Safari 4/5, and Chrome. */ code, kbd, pre, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; } /** * Improve readability of pre-formatted text in all browsers. */ pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; } /** * Address CSS quotes not supported in IE 6/7. */ q { quotes: none; } /** * Address `quotes` property not supported in Safari 4. */ q:before, q:after { content: ''; content: none; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ========================================================================== Lists ========================================================================== */ /** * Address margins set differently in IE 6/7. */ dl, menu, ol, ul { margin: 1em 0; } dd { margin: 0 0 0 40px; } /** * Address paddings set differently in IE 6/7. */ menu, ol, ul { padding: 0 0 0 40px; } /** * Correct list images handled incorrectly in IE 7. */ nav ul, nav ol { list-style: none; list-style-image: none; } /* ========================================================================== Embedded content ========================================================================== */ /** * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3. * 2. Improve image quality when scaled in IE 7. */ img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ } /** * Correct overflow displayed oddly in IE 9. */ svg:not(:root) { overflow: hidden; } /* ========================================================================== Figures ========================================================================== */ /** * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11. */ figure { margin: 0; } /* ========================================================================== Forms ========================================================================== */ /** * Correct margin displayed oddly in IE 6/7. */ form { margin: 0; } /** * Define consistent border, margin, and padding. */ fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } /** * 1. Correct color not being inherited in IE 6/7/8/9. * 2. Correct text not wrapping in Firefox 3. * 3. Correct alignment displayed oddly in IE 6/7. */ legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ *margin-left: -7px; /* 3 */ } /** * 1. Correct font size not being inherited in all browsers. * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5, * and Chrome. * 3. Improve appearance and consistency in all browsers. */ button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ *vertical-align: middle; /* 3 */ } /** * Address Firefox 3+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ button, input { line-height: normal; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+. * Correct `select` style inheritance in Firefox 4+ and Opera. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. * 4. Remove inner spacing in IE 7 without affecting normal text inputs. * Known issue: inner spacing remains in IE 6. */ button, html input[type="button"], /* 1 */ input[type="reset"], input[type="submit"] { -webkit-appearance: button; /* 2 */ cursor: pointer; /* 3 */ *overflow: visible; /* 4 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * 1. Address box sizing set to content-box in IE 8/9. * 2. Remove excess padding in IE 8/9. * 3. Remove excess padding in IE 7. * Known issue: excess padding remains in IE 6. */ input[type="checkbox"], input[type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ *height: 13px; /* 3 */ *width: 13px; /* 3 */ } /** * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome * (include `-moz` to future-proof). */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /** * Remove inner padding and search cancel button in Safari 5 and Chrome * on OS X. */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * Remove inner padding and border in Firefox 3+. */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /** * 1. Remove default vertical scrollbar in IE 6/7/8/9. * 2. Improve readability and alignment in all browsers. */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ========================================================================== Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-collapse: collapse; border-spacing: 0; } /*! * Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */ /* FONT PATH * -------------------------- */ @font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.0.3'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.0.3') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.0.3') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.0.3') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; } .fa { display: inline-block; font-family: FontAwesome; font-style: normal; font-weight: normal; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* makes the font 33% larger relative to the icon container */ .fa-lg { font-size: 1.3333333333333333em; line-height: 0.75em; vertical-align: -15%; } .fa-2x { font-size: 2em; } .fa-3x { font-size: 3em; } .fa-4x { font-size: 4em; } .fa-5x { font-size: 5em; } .fa-fw { width: 1.2857142857142858em; text-align: center; } .fa-ul { padding-left: 0; margin-left: 2.142857142857143em; list-style-type: none; } .fa-ul > li { position: relative; } .fa-li { position: absolute; left: -2.142857142857143em; width: 2.142857142857143em; top: 0.14285714285714285em; text-align: center; } .fa-li.fa-lg { left: -1.8571428571428572em; } .fa-border { padding: .2em .25em .15em; border: solid 0.08em #eeeeee; border-radius: .1em; } .pull-right { float: right; } .pull-left { float: left; } .fa.pull-left { margin-right: .3em; } .fa.pull-right { margin-left: .3em; } .fa-spin { -webkit-animation: spin 2s infinite linear; -moz-animation: spin 2s infinite linear; -o-animation: spin 2s infinite linear; animation: spin 2s infinite linear; } @-moz-keyframes spin { 0% { -moz-transform: rotate(0deg); } 100% { -moz-transform: rotate(359deg); } } @-webkit-keyframes spin { 0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(359deg); } } @-o-keyframes spin { 0% { -o-transform: rotate(0deg); } 100% { -o-transform: rotate(359deg); } } @-ms-keyframes spin { 0% { -ms-transform: rotate(0deg); } 100% { -ms-transform: rotate(359deg); } } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(359deg); } } .fa-rotate-90 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); -ms-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); } .fa-rotate-180 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); } .fa-rotate-270 { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); -webkit-transform: rotate(270deg); -moz-transform: rotate(270deg); -ms-transform: rotate(270deg); -o-transform: rotate(270deg); transform: rotate(270deg); } .fa-flip-horizontal { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1); -webkit-transform: scale(-1, 1); -moz-transform: scale(-1, 1); -ms-transform: scale(-1, 1); -o-transform: scale(-1, 1); transform: scale(-1, 1); } .fa-flip-vertical { filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1); -webkit-transform: scale(1, -1); -moz-transform: scale(1, -1); -ms-transform: scale(1, -1); -o-transform: scale(1, -1); transform: scale(1, -1); } .fa-stack { position: relative; display: inline-block; width: 2em; height: 2em; line-height: 2em; vertical-align: middle; } .fa-stack-1x, .fa-stack-2x { position: absolute; left: 0; width: 100%; text-align: center; } .fa-stack-1x { line-height: inherit; } .fa-stack-2x { font-size: 2em; } .fa-inverse { color: #ffffff; } /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen readers do not read off random characters that represent icons */ .fa-glass:before { content: "\f000"; } .fa-music:before { content: "\f001"; } .fa-search:before { content: "\f002"; } .fa-envelope-o:before { content: "\f003"; } .fa-heart:before { content: "\f004"; } .fa-star:before { content: "\f005"; } .fa-star-o:before { content: "\f006"; } .fa-user:before { content: "\f007"; } .fa-film:before { content: "\f008"; } .fa-th-large:before { content: "\f009"; } .fa-th:before { content: "\f00a"; } .fa-th-list:before { content: "\f00b"; } .fa-check:before { content: "\f00c"; } .fa-times:before { content: "\f00d"; } .fa-search-plus:before { content: "\f00e"; } .fa-search-minus:before { content: "\f010"; } .fa-power-off:before { content: "\f011"; } .fa-signal:before { content: "\f012"; } .fa-gear:before, .fa-cog:before { content: "\f013"; } .fa-trash-o:before { content: "\f014"; } .fa-home:before { content: "\f015"; } .fa-file-o:before { content: "\f016"; } .fa-clock-o:before { content: "\f017"; } .fa-road:before { content: "\f018"; } .fa-download:before { content: "\f019"; } .fa-arrow-circle-o-down:before { content: "\f01a"; } .fa-arrow-circle-o-up:before { content: "\f01b"; } .fa-inbox:before { content: "\f01c"; } .fa-play-circle-o:before { content: "\f01d"; } .fa-rotate-right:before, .fa-repeat:before { content: "\f01e"; } .fa-refresh:before { content: "\f021"; } .fa-list-alt:before { content: "\f022"; } .fa-lock:before { content: "\f023"; } .fa-flag:before { content: "\f024"; } .fa-headphones:before { content: "\f025"; } .fa-volume-off:before { content: "\f026"; } .fa-volume-down:before { content: "\f027"; } .fa-volume-up:before { content: "\f028"; } .fa-qrcode:before { content: "\f029"; } .fa-barcode:before { content: "\f02a"; } .fa-tag:before { content: "\f02b"; } .fa-tags:before { content: "\f02c"; } .fa-book:before { content: "\f02d"; } .fa-bookmark:before { content: "\f02e"; } .fa-print:before { content: "\f02f"; } .fa-camera:before { content: "\f030"; } .fa-font:before { content: "\f031"; } .fa-bold:before { content: "\f032"; } .fa-italic:before { content: "\f033"; } .fa-text-height:before { content: "\f034"; } .fa-text-width:before { content: "\f035"; } .fa-align-left:before { content: "\f036"; } .fa-align-center:before { content: "\f037"; } .fa-align-right:before { content: "\f038"; } .fa-align-justify:before { content: "\f039"; } .fa-list:before { content: "\f03a"; } .fa-dedent:before, .fa-outdent:before { content: "\f03b"; } .fa-indent:before { content: "\f03c"; } .fa-video-camera:before { content: "\f03d"; } .fa-picture-o:before { content: "\f03e"; } .fa-pencil:before { content: "\f040"; } .fa-map-marker:before { content: "\f041"; } .fa-adjust:before { content: "\f042"; } .fa-tint:before { content: "\f043"; } .fa-edit:before, .fa-pencil-square-o:before { content: "\f044"; } .fa-share-square-o:before { content: "\f045"; } .fa-check-square-o:before { content: "\f046"; } .fa-arrows:before { content: "\f047"; } .fa-step-backward:before { content: "\f048"; } .fa-fast-backward:before { content: "\f049"; } .fa-backward:before { content: "\f04a"; } .fa-play:before { content: "\f04b"; } .fa-pause:before { content: "\f04c"; } .fa-stop:before { content: "\f04d"; } .fa-forward:before { content: "\f04e"; } .fa-fast-forward:before { content: "\f050"; } .fa-step-forward:before { content: "\f051"; } .fa-eject:before { content: "\f052"; } .fa-chevron-left:before { content: "\f053"; } .fa-chevron-right:before { content: "\f054"; } .fa-plus-circle:before { content: "\f055"; } .fa-minus-circle:before { content: "\f056"; } .fa-times-circle:before { content: "\f057"; } .fa-check-circle:before { content: "\f058"; } .fa-question-circle:before { content: "\f059"; } .fa-info-circle:before { content: "\f05a"; } .fa-crosshairs:before { content: "\f05b"; } .fa-times-circle-o:before { content: "\f05c"; } .fa-check-circle-o:before { content: "\f05d"; } .fa-ban:before { content: "\f05e"; } .fa-arrow-left:before { content: "\f060"; } .fa-arrow-right:before { content: "\f061"; } .fa-arrow-up:before { content: "\f062"; } .fa-arrow-down:before { content: "\f063"; } .fa-mail-forward:before, .fa-share:before { content: "\f064"; } .fa-expand:before { content: "\f065"; } .fa-compress:before { content: "\f066"; } .fa-plus:before { content: "\f067"; } .fa-minus:before { content: "\f068"; } .fa-asterisk:before { content: "\f069"; } .fa-exclamation-circle:before { content: "\f06a"; } .fa-gift:before { content: "\f06b"; } .fa-leaf:before { content: "\f06c"; } .fa-fire:before { content: "\f06d"; } .fa-eye:before { content: "\f06e"; } .fa-eye-slash:before { content: "\f070"; } .fa-warning:before, .fa-exclamation-triangle:before { content: "\f071"; } .fa-plane:before { content: "\f072"; } .fa-calendar:before { content: "\f073"; } .fa-random:before { content: "\f074"; } .fa-comment:before { content: "\f075"; } .fa-magnet:before { content: "\f076"; } .fa-chevron-up:before { content: "\f077"; } .fa-chevron-down:before { content: "\f078"; } .fa-retweet:before { content: "\f079"; } .fa-shopping-cart:before { content: "\f07a"; } .fa-folder:before { content: "\f07b"; } .fa-folder-open:before { content: "\f07c"; } .fa-arrows-v:before { content: "\f07d"; } .fa-arrows-h:before { content: "\f07e"; } .fa-bar-chart-o:before { content: "\f080"; } .fa-twitter-square:before { content: "\f081"; } .fa-facebook-square:before { content: "\f082"; } .fa-camera-retro:before { content: "\f083"; } .fa-key:before { content: "\f084"; } .fa-gears:before, .fa-cogs:before { content: "\f085"; } .fa-comments:before { content: "\f086"; } .fa-thumbs-o-up:before { content: "\f087"; } .fa-thumbs-o-down:before { content: "\f088"; } .fa-star-half:before { content: "\f089"; } .fa-heart-o:before { content: "\f08a"; } .fa-sign-out:before { content: "\f08b"; } .fa-linkedin-square:before { content: "\f08c"; } .fa-thumb-tack:before { content: "\f08d"; } .fa-external-link:before { content: "\f08e"; } .fa-sign-in:before { content: "\f090"; } .fa-trophy:before { content: "\f091"; } .fa-github-square:before { content: "\f092"; } .fa-upload:before { content: "\f093"; } .fa-lemon-o:before { content: "\f094"; } .fa-phone:before { content: "\f095"; } .fa-square-o:before { content: "\f096"; } .fa-bookmark-o:before { content: "\f097"; } .fa-phone-square:before { content: "\f098"; } .fa-twitter:before { content: "\f099"; } .fa-facebook:before { content: "\f09a"; } .fa-github:before { content: "\f09b"; } .fa-unlock:before { content: "\f09c"; } .fa-credit-card:before { content: "\f09d"; } .fa-rss:before { content: "\f09e"; } .fa-hdd-o:before { content: "\f0a0"; } .fa-bullhorn:before { content: "\f0a1"; } .fa-bell:before { content: "\f0f3"; } .fa-certificate:before { content: "\f0a3"; } .fa-hand-o-right:before { content: "\f0a4"; } .fa-hand-o-left:before { content: "\f0a5"; } .fa-hand-o-up:before { content: "\f0a6"; } .fa-hand-o-down:before { content: "\f0a7"; } .fa-arrow-circle-left:before { content: "\f0a8"; } .fa-arrow-circle-right:before { content: "\f0a9"; } .fa-arrow-circle-up:before { content: "\f0aa"; } .fa-arrow-circle-down:before { content: "\f0ab"; } .fa-globe:before { content: "\f0ac"; } .fa-wrench:before { content: "\f0ad"; } .fa-tasks:before { content: "\f0ae"; } .fa-filter:before { content: "\f0b0"; } .fa-briefcase:before { content: "\f0b1"; } .fa-arrows-alt:before { content: "\f0b2"; } .fa-group:before, .fa-users:before { content: "\f0c0"; } .fa-chain:before, .fa-link:before { content: "\f0c1"; } .fa-cloud:before { content: "\f0c2"; } .fa-flask:before { content: "\f0c3"; } .fa-cut:before, .fa-scissors:before { content: "\f0c4"; } .fa-copy:before, .fa-files-o:before { content: "\f0c5"; } .fa-paperclip:before { content: "\f0c6"; } .fa-save:before, .fa-floppy-o:before { content: "\f0c7"; } .fa-square:before { content: "\f0c8"; } .fa-bars:before { content: "\f0c9"; } .fa-list-ul:before { content: "\f0ca"; } .fa-list-ol:before { content: "\f0cb"; } .fa-strikethrough:before { content: "\f0cc"; } .fa-underline:before { content: "\f0cd"; } .fa-table:before { content: "\f0ce"; } .fa-magic:before { content: "\f0d0"; } .fa-truck:before { content: "\f0d1"; } .fa-pinterest:before { content: "\f0d2"; } .fa-pinterest-square:before { content: "\f0d3"; } .fa-google-plus-square:before { content: "\f0d4"; } .fa-google-plus:before { content: "\f0d5"; } .fa-money:before { content: "\f0d6"; } .fa-caret-down:before { content: "\f0d7"; } .fa-caret-up:before { content: "\f0d8"; } .fa-caret-left:before { content: "\f0d9"; } .fa-caret-right:before { content: "\f0da"; } .fa-columns:before { content: "\f0db"; } .fa-unsorted:before, .fa-sort:before { content: "\f0dc"; } .fa-sort-down:before, .fa-sort-asc:before { content: "\f0dd"; } .fa-sort-up:before, .fa-sort-desc:before { content: "\f0de"; } .fa-envelope:before { content: "\f0e0"; } .fa-linkedin:before { content: "\f0e1"; } .fa-rotate-left:before, .fa-undo:before { content: "\f0e2"; } .fa-legal:before, .fa-gavel:before { content: "\f0e3"; } .fa-dashboard:before, .fa-tachometer:before { content: "\f0e4"; } .fa-comment-o:before { content: "\f0e5"; } .fa-comments-o:before { content: "\f0e6"; } .fa-flash:before, .fa-bolt:before { content: "\f0e7"; } .fa-sitemap:before { content: "\f0e8"; } .fa-umbrella:before { content: "\f0e9"; } .fa-paste:before, .fa-clipboard:before { content: "\f0ea"; } .fa-lightbulb-o:before { content: "\f0eb"; } .fa-exchange:before { content: "\f0ec"; } .fa-cloud-download:before { content: "\f0ed"; } .fa-cloud-upload:before { content: "\f0ee"; } .fa-user-md:before { content: "\f0f0"; } .fa-stethoscope:before { content: "\f0f1"; } .fa-suitcase:before { content: "\f0f2"; } .fa-bell-o:before { content: "\f0a2"; } .fa-coffee:before { content: "\f0f4"; } .fa-cutlery:before { content: "\f0f5"; } .fa-file-text-o:before { content: "\f0f6"; } .fa-building-o:before { content: "\f0f7"; } .fa-hospital-o:before { content: "\f0f8"; } .fa-ambulance:before { content: "\f0f9"; } .fa-medkit:before { content: "\f0fa"; } .fa-fighter-jet:before { content: "\f0fb"; } .fa-beer:before { content: "\f0fc"; } .fa-h-square:before { content: "\f0fd"; } .fa-plus-square:before { content: "\f0fe"; } .fa-angle-double-left:before { content: "\f100"; } .fa-angle-double-right:before { content: "\f101"; } .fa-angle-double-up:before { content: "\f102"; } .fa-angle-double-down:before { content: "\f103"; } .fa-angle-left:before { content: "\f104"; } .fa-angle-right:before { content: "\f105"; } .fa-angle-up:before { content: "\f106"; } .fa-angle-down:before { content: "\f107"; } .fa-desktop:before { content: "\f108"; } .fa-laptop:before { content: "\f109"; } .fa-tablet:before { content: "\f10a"; } .fa-mobile-phone:before, .fa-mobile:before { content: "\f10b"; } .fa-circle-o:before { content: "\f10c"; } .fa-quote-left:before { content: "\f10d"; } .fa-quote-right:before { content: "\f10e"; } .fa-spinner:before { content: "\f110"; } .fa-circle:before { content: "\f111"; } .fa-mail-reply:before, .fa-reply:before { content: "\f112"; } .fa-github-alt:before { content: "\f113"; } .fa-folder-o:before { content: "\f114"; } .fa-folder-open-o:before { content: "\f115"; } .fa-smile-o:before { content: "\f118"; } .fa-frown-o:before { content: "\f119"; } .fa-meh-o:before { content: "\f11a"; } .fa-gamepad:before { content: "\f11b"; } .fa-keyboard-o:before { content: "\f11c"; } .fa-flag-o:before { content: "\f11d"; } .fa-flag-checkered:before { content: "\f11e"; } .fa-terminal:before { content: "\f120"; } .fa-code:before { content: "\f121"; } .fa-reply-all:before { content: "\f122"; } .fa-mail-reply-all:before { content: "\f122"; } .fa-star-half-empty:before, .fa-star-half-full:before, .fa-star-half-o:before { content: "\f123"; } .fa-location-arrow:before { content: "\f124"; } .fa-crop:before { content: "\f125"; } .fa-code-fork:before { content: "\f126"; } .fa-unlink:before, .fa-chain-broken:before { content: "\f127"; } .fa-question:before { content: "\f128"; } .fa-info:before { content: "\f129"; } .fa-exclamation:before { content: "\f12a"; } .fa-superscript:before { content: "\f12b"; } .fa-subscript:before { content: "\f12c"; } .fa-eraser:before { content: "\f12d"; } .fa-puzzle-piece:before { content: "\f12e"; } .fa-microphone:before { content: "\f130"; } .fa-microphone-slash:before { content: "\f131"; } .fa-shield:before { content: "\f132"; } .fa-calendar-o:before { content: "\f133"; } .fa-fire-extinguisher:before { content: "\f134"; } .fa-rocket:before { content: "\f135"; } .fa-maxcdn:before { content: "\f136"; } .fa-chevron-circle-left:before { content: "\f137"; } .fa-chevron-circle-right:before { content: "\f138"; } .fa-chevron-circle-up:before { content: "\f139"; } .fa-chevron-circle-down:before { content: "\f13a"; } .fa-html5:before { content: "\f13b"; } .fa-css3:before { content: "\f13c"; } .fa-anchor:before { content: "\f13d"; } .fa-unlock-alt:before { content: "\f13e"; } .fa-bullseye:before { content: "\f140"; } .fa-ellipsis-h:before { content: "\f141"; } .fa-ellipsis-v:before { content: "\f142"; } .fa-rss-square:before { content: "\f143"; } .fa-play-circle:before { content: "\f144"; } .fa-ticket:before { content: "\f145"; } .fa-minus-square:before { content: "\f146"; } .fa-minus-square-o:before { content: "\f147"; } .fa-level-up:before { content: "\f148"; } .fa-level-down:before { content: "\f149"; } .fa-check-square:before { content: "\f14a"; } .fa-pencil-square:before { content: "\f14b"; } .fa-external-link-square:before { content: "\f14c"; } .fa-share-square:before { content: "\f14d"; } .fa-compass:before { content: "\f14e"; } .fa-toggle-down:before, .fa-caret-square-o-down:before { content: "\f150"; } .fa-toggle-up:before, .fa-caret-square-o-up:before { content: "\f151"; } .fa-toggle-right:before, .fa-caret-square-o-right:before { content: "\f152"; } .fa-euro:before, .fa-eur:before { content: "\f153"; } .fa-gbp:before { content: "\f154"; } .fa-dollar:before, .fa-usd:before { content: "\f155"; } .fa-rupee:before, .fa-inr:before { content: "\f156"; } .fa-cny:before, .fa-rmb:before, .fa-yen:before, .fa-jpy:before { content: "\f157"; } .fa-ruble:before, .fa-rouble:before, .fa-rub:before { content: "\f158"; } .fa-won:before, .fa-krw:before { content: "\f159"; } .fa-bitcoin:before, .fa-btc:before { content: "\f15a"; } .fa-file:before { content: "\f15b"; } .fa-file-text:before { content: "\f15c"; } .fa-sort-alpha-asc:before { content: "\f15d"; } .fa-sort-alpha-desc:before { content: "\f15e"; } .fa-sort-amount-asc:before { content: "\f160"; } .fa-sort-amount-desc:before { content: "\f161"; } .fa-sort-numeric-asc:before { content: "\f162"; } .fa-sort-numeric-desc:before { content: "\f163"; } .fa-thumbs-up:before { content: "\f164"; } .fa-thumbs-down:before { content: "\f165"; } .fa-youtube-square:before { content: "\f166"; } .fa-youtube:before { content: "\f167"; } .fa-xing:before { content: "\f168"; } .fa-xing-square:before { content: "\f169"; } .fa-youtube-play:before { content: "\f16a"; } .fa-dropbox:before { content: "\f16b"; } .fa-stack-overflow:before { content: "\f16c"; } .fa-instagram:before { content: "\f16d"; } .fa-flickr:before { content: "\f16e"; } .fa-adn:before { content: "\f170"; } .fa-bitbucket:before { content: "\f171"; } .fa-bitbucket-square:before { content: "\f172"; } .fa-tumblr:before { content: "\f173"; } .fa-tumblr-square:before { content: "\f174"; } .fa-long-arrow-down:before { content: "\f175"; } .fa-long-arrow-up:before { content: "\f176"; } .fa-long-arrow-left:before { content: "\f177"; } .fa-long-arrow-right:before { content: "\f178"; } .fa-apple:before { content: "\f179"; } .fa-windows:before { content: "\f17a"; } .fa-android:before { content: "\f17b"; } .fa-linux:before { content: "\f17c"; } .fa-dribbble:before { content: "\f17d"; } .fa-skype:before { content: "\f17e"; } .fa-foursquare:before { content: "\f180"; } .fa-trello:before { content: "\f181"; } .fa-female:before { content: "\f182"; } .fa-male:before { content: "\f183"; } .fa-gittip:before { content: "\f184"; } .fa-sun-o:before { content: "\f185"; } .fa-moon-o:before { content: "\f186"; } .fa-archive:before { content: "\f187"; } .fa-bug:before { content: "\f188"; } .fa-vk:before { content: "\f189"; } .fa-weibo:before { content: "\f18a"; } .fa-renren:before { content: "\f18b"; } .fa-pagelines:before { content: "\f18c"; } .fa-stack-exchange:before { content: "\f18d"; } .fa-arrow-circle-o-right:before { content: "\f18e"; } .fa-arrow-circle-o-left:before { content: "\f190"; } .fa-toggle-left:before, .fa-caret-square-o-left:before { content: "\f191"; } .fa-dot-circle-o:before { content: "\f192"; } .fa-wheelchair:before { content: "\f193"; } .fa-vimeo-square:before { content: "\f194"; } .fa-turkish-lira:before, .fa-try:before { content: "\f195"; } .fa-plus-square-o:before { content: "\f196"; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; filter: alpha(opacity=80); } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #cccccc; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #cccccc; } .mfp-preloader a:hover { color: white; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; -webkit-box-shadow: none; box-shadow: none; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; filter: alpha(opacity=65); padding: 0 0 18px 10px; color: white; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: white; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #cccccc; font-size: 12px; line-height: 18px; } .mfp-arrow { position: absolute; opacity: 0.65; filter: alpha(opacity=65); margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; filter: alpha(opacity=100); } .mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after, .mfp-arrow .mfp-a { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before, .mfp-arrow .mfp-b { border-top-width: 21px; border-bottom-width: 21px; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after, .mfp-arrow-left .mfp-a { border-right: 17px solid white; margin-left: 31px; } .mfp-arrow-left:before, .mfp-arrow-left .mfp-b { margin-left: 25px; border-right: 27px solid #3f3f3f; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after, .mfp-arrow-right .mfp-a { border-left: 17px solid white; margin-left: 39px; } .mfp-arrow-right:before, .mfp-arrow-right .mfp-b { border-left: 27px solid #3f3f3f; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: black; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444444; } .mfp-figure small { color: #bdbdbd; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #f3f3f3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .mfp-ie7 .mfp-img { padding: 0; } .mfp-ie7 .mfp-bottom-bar { width: 600px; left: 50%; margin-left: -300px; margin-top: 5px; padding-bottom: 5px; } .mfp-ie7 .mfp-container { padding: 0; } .mfp-ie7 .mfp-content { padding-top: 44px; } .mfp-ie7 .mfp-close { top: 0; right: 0; padding-top: 0; } /* * Core Owl Carousel CSS File * v1.24 */ /* clearfix */ .owl-carousel .owl-wrapper:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } /* display none until init */ .owl-carousel{ display: none; position: relative; width: 100%; -ms-touch-action: pan-y; } .owl-carousel .owl-wrapper{ display: none; position: relative; -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper-outer{ overflow: hidden; position: relative; width: 100%; } .owl-carousel .owl-wrapper-outer.autoHeight{ -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .owl-carousel .owl-item{ float: left; } .owl-controls .owl-page, .owl-controls .owl-buttons div{ cursor: pointer; } .owl-controls { -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } /* mouse grab icon */ .grabbing { cursor:url(../img/grabbing.png) 8 8, move; } /* fix */ .owl-carousel .owl-wrapper, .owl-carousel .owl-item{ -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0,0,0); -moz-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); } /* CSS3 Transitions */ .owl-origin { -webkit-perspective: 1200px; -webkit-perspective-origin-x : 50%; -webkit-perspective-origin-y : 50%; -moz-perspective : 1200px; -moz-perspective-origin-x : 50%; -moz-perspective-origin-y : 50%; perspective : 1200px; } /* fade */ .owl-fade-out { z-index: 10; -webkit-animation: fadeOut .7s both ease; -moz-animation: fadeOut .7s both ease; animation: fadeOut .7s both ease; } .owl-fade-in { -webkit-animation: fadeIn .7s both ease; -moz-animation: fadeIn .7s both ease; animation: fadeIn .7s both ease; } /* backSlide */ .owl-backSlide-out { -webkit-animation: backSlideOut 1s both ease; -moz-animation: backSlideOut 1s both ease; animation: backSlideOut 1s both ease; } .owl-backSlide-in { -webkit-animation: backSlideIn 1s both ease; -moz-animation: backSlideIn 1s both ease; animation: backSlideIn 1s both ease; } /* goDown */ .owl-goDown-out { -webkit-animation: scaleToFade .7s ease both; -moz-animation: scaleToFade .7s ease both; animation: scaleToFade .7s ease both; } .owl-goDown-in { -webkit-animation: goDown .6s ease both; -moz-animation: goDown .6s ease both; animation: goDown .6s ease both; } /* scaleUp */ .owl-fadeUp-in { -webkit-animation: scaleUpFrom .5s ease both; -moz-animation: scaleUpFrom .5s ease both; animation: scaleUpFrom .5s ease both; } .owl-fadeUp-out { -webkit-animation: scaleUpTo .5s ease both; -moz-animation: scaleUpTo .5s ease both; animation: scaleUpTo .5s ease both; } /* Keyframes */ /*empty*/ @-webkit-keyframes empty { 0% {opacity: 1} } @-moz-keyframes empty { 0% {opacity: 1} } @keyframes empty { 0% {opacity: 1} } @-webkit-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-moz-keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @keyframes fadeIn { 0% { opacity:0; } 100% { opacity:1; } } @-webkit-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-moz-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-webkit-keyframes backSlideOut { 25% { opacity: .5; -webkit-transform: translateZ(-500px); } 75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } } @-moz-keyframes backSlideOut { 25% { opacity: .5; -moz-transform: translateZ(-500px); } 75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } } @keyframes backSlideOut { 25% { opacity: .5; transform: translateZ(-500px); } 75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } } @-webkit-keyframes backSlideIn { 0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -webkit-transform: translateZ(-500px); } 100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); } } @-moz-keyframes backSlideIn { 0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -moz-transform: translateZ(-500px); } 100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); } } @keyframes backSlideIn { 0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; transform: translateZ(-500px); } 100% { opacity: 1; transform: translateZ(0) translateX(0); } } @-webkit-keyframes scaleToFade { to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleToFade { to { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleToFade { to { opacity: 0; transform: scale(.8); } } @-webkit-keyframes goDown { from { -webkit-transform: translateY(-100%); } } @-moz-keyframes goDown { from { -moz-transform: translateY(-100%); } } @keyframes goDown { from { transform: translateY(-100%); } } @-webkit-keyframes scaleUpFrom { from { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpFrom { from { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpFrom { from { opacity: 0; transform: scale(1.5); } } @-webkit-keyframes scaleUpTo { to { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpTo { to { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpTo { to { opacity: 0; transform: scale(1.5); } } /* BASE STYLE GRID ANIMATION PRELOADER HEADER NAVIGATION INTRO ABOUT SERVICE SKILL CLIENTS WORKS PRICING QUOTES CONTACT MAP FOOTER EXTERNAL PAGE 404 PAGE PLUGIN STYLING: MAGNIFIC POPUP, OWL CAROUSEL MEDIA QUERIES */ /* ========================================================================== BASE STYLE ========================================================================== */ *, *:after, *:before{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body, html{ margin: 0; padding: 0; width: 100%; height: 100%; font-size: 100%; } body{ background:#fefefe; color:#333333; font-size: 1em; line-height: 1.6; font-weight:400; font-family: 'Open Sans', Arial, sans-serif; } a{ color: #000CAB; text-decoration: none; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; } a:hover, a:active { outline: 0; } a:hover{ color: #11CCB9; } h1, h2{ font-family: 'Open Sans', Arial, sans-serif; font-weight:normal; font-weight:600; } audio, canvas, img, video { vertical-align: middle; } img, object, embed{ max-width: 100%; height: auto; } img{ width: auto\9; height: auto; max-width: 100%; vertical-align: middle; border: 0; -ms-interpolation-mode: bicubic; } ::-webkit-input-placeholder{ /* WebKit browsers */ color: #a9a9a9; } :-moz-placeholder{ /* Mozilla Firefox 4 to 18 */ color: #a9a9a9; } ::-moz-placeholder{ /* Mozilla Firefox 19+ */ color: #a9a9a9; } :-ms-input-placeholder{ /* Internet Explorer 10+ */ color: #a9a9a9; } /* Section Color Scheme */ .white{ background: #ffffff; } .whitesmoke{ background: #f5f5f5; } .gainsboro{ background: #dcdcdc ; } .lightgray{ background: #d3d3d3; } .silver{ background: #c0c0c0 ; } .darkgray{ background: #a9a9a9; } .darken{ background: #1d1d1d; color: #ffffff; } .darken a{ color: #a9a9a9; } .darken a:hover{ color: #ffffff; } /* Section with SVG Separator */ .has-svg{ position: relative; padding-top: 100px; } /* Adjustment class for section with SVG Separator */ .pull { padding-top: 0; } .push { padding-top: 100px; } /**/ .social-cont{ float:right; margin-top:27px; padding-right:6px;} /* Section Title */ .section-title{ margin-bottom: 60px; text-align: center; max-width:780px; margin:auto; } .section-title h1{ position: relative; margin-top: 0; font-size:1.6em; } .section-title h1:after{ position: absolute; bottom: -10px; left: 50%; margin-left: -25px; width: 50px; height: 2px; background: rgb(191, 191, 191); background: rgba(191, 191, 191, 0.7); content: ""; } .section-title h3{ position: relative; text-align: center; color:#333; font-weight: 100; font-size: 1em; } /* SVG Separator */ .separator{ position: absolute; left: 0; bottom: -99px; z-index: 900; width: 100%; height: 100px; } .separator.separator-top{ top: -99px; bottom: auto; } /* SVG Separator Color Style */ .white .separator path{ fill: #ffffff; } .whitesmoke .separator path{ fill: #f5f5f5; } .gainsboro .separator path{ fill: #dcdcdc ; } .lightgray .separator path{ fill: #d3d3d3; } .silver .separator path{ fill: #c0c0c0 ; } .darkgray .separator path{ fill: #a9a9a9; } .darken .separator path{ fill: #1d1d1d; } /* h1 Logo Style */ .logo{ font-family: 'Open Sans', Arial, sans-serif; } .logo a{ color: #ffffff; background-position:center; background-repeat:no-repeat; background-size:78px 43px; background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px; } .logo a:before { content: ""; display: block; width: 0; height: 150%; } /* Text Alignment */ .text-center{ text-align: center; } .text-left{ text-align: left; } .text-right{ text-align: right; } /* Button Style */ .button { font-weight: 700; padding: 5px 10px; display: inline-block; background-color:#000DAB; color:#FFF; border-radius:4px; font-weight:400; font-size:0.7em; margin-top:7px; text-transform:uppercase; } /* Button Dark Style */ .button-dark { } .button-dark:hover{ background: #222222!important; color:#FFF; } /* Button Light Style */ .button-light { color: #ffffff!important; border: 2px solid #ffffff; } .button-light:hover{ color: #222222!important; background: #ffffff!important; } /* Animate CSS after page load */ .preload *{ -webkit-transition: none !important; -moz-transition: none !important; -ms-transition: none !important; -o-transition: none !important; transition: none !important; } /* Hide text for rotate-text */ .rotate-text{ display: none; } /* grayscale image */ .grayscalemap{ filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+, Firefox on Android */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ -webkit-backface-visibility: hidden; } .grayscalemap:hover { filter: url("data:image/svg+xml;utf8,#grayscale"); -webkit-filter: grayscale(0%); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .grayscale img{ filter: url("data:image/svg+xml;utf8,#grayscale"); /* Firefox 10+, Firefox on Android */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(100%); /* Chrome 19+, Safari 6+, Safari 6+ iOS */ -webkit-backface-visibility: hidden; } .grayscale:hover img{ filter: url("data:image/svg+xml;utf8,#grayscale"); -webkit-filter: grayscale(0%); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } /* Clearfix */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } .clearfix { *zoom: 1; /* For IE 6/7 only */ } /* ========================================================================== GRID ========================================================================== */ .container{ max-width: 1170px; padding: 60px 20px; margin: 0 auto; } .container:after, .row:after, .column:after{ content: ""; display: table; clear: both; } .row{ padding-bottom: 0; } .column{ display: block; float: left; margin-left: 2%; } .column:first-child{ margin-left: 0; } .full_width{ width: 100%; } .half{ width: 49.0%; } .one_third{ width: 32.0%; } .two_third{ width: 66.0%; } .one_fourth{ width: 23.5%; } .three_fourth{ width: 74.5%; } @media only screen and (min-width: 768px) and (max-width: 979px){ .one_fourth{ width: 49.0%; } .one_fourth:nth-child(2n+1){ margin-left: 0; } } @media only screen and (max-width : 767px){ .column{ width: 100%; margin-left: 0; } } /* ========================================================================== ANIMATION ========================================================================== */ /* Hide element before animation */ .transparent{ opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity = 0 ); filter: progid:DXImageTransform.Microsoft.Alpha(opacity = 0); filter: alpha(opacity = 0); -moz-opacity: 0; -khtml-opacity: 0; -webkit-transform: translateZ(0); -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; } /* Show element after animation */ .opaque{ opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha"(Opacity = 100 ); filter: progid:DXImageTransform.Microsoft.Alpha(opacity = 100); filter: alpha(opacity = 100); -moz-opacity: 1; -khtml-opacity: 1; -webkit-transform: translateZ(0); -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; } .animated{-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-ms-animation-fill-mode:both;-o-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;}.animated.hinge{-webkit-animation-duration:1s;-moz-animation-duration:1s;-ms-animation-duration:1s;-o-animation-duration:1s;animation-duration:1s;} @-webkit-keyframes flipInX{ 0%{ -webkit-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40%{ -webkit-transform: perspective(400px) rotateX(-10deg); } 70%{ -webkit-transform: perspective(400px) rotateX(10deg); } 100%{ -webkit-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-moz-keyframes flipInX{ 0%{ -moz-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40%{ -moz-transform: perspective(400px) rotateX(-10deg); } 70%{ -moz-transform: perspective(400px) rotateX(10deg); } 100%{ -moz-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @-o-keyframes flipInX{ 0%{ -o-transform: perspective(400px) rotateX(90deg); opacity: 0; } 40%{ -o-transform: perspective(400px) rotateX(-10deg); } 70%{ -o-transform: perspective(400px) rotateX(10deg); } 100%{ -o-transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX{ 0%{ transform: perspective(400px) rotateX(90deg); opacity: 0; } 40%{ transform: perspective(400px) rotateX(-10deg); } 70%{ transform: perspective(400px) rotateX(10deg); } 100%{ transform: perspective(400px) rotateX(0deg); opacity: 1; } } .flipInX{ -webkit-backface-visibility: visible !important; -webkit-animation-name: flipInX; -moz-backface-visibility: visible !important; -moz-animation-name: flipInX; -o-backface-visibility: visible !important; -o-animation-name: flipInX; backface-visibility: visible !important; animation-name: flipInX; } @-webkit-keyframes fadeIn{ 0%{opacity: 0;} 100%{opacity: 1;} } @-moz-keyframes fadeIn{ 0%{opacity: 0;} 100%{opacity: 1;} } @-o-keyframes fadeIn{ 0%{opacity: 0;} 100%{opacity: 1;} } @keyframes fadeIn{ 0%{opacity: 0;} 100%{opacity: 1;} } .fadeIn{ -webkit-animation-name: fadeIn; -moz-animation-name: fadeIn; -o-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInUp{ 0%{ opacity: 0; -webkit-transform: translateY(20px); } 100%{ opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInUp{ 0%{ opacity: 0; -moz-transform: translateY(20px); } 100%{ opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInUp{ 0%{ opacity: 0; -o-transform: translateY(20px); } 100%{ opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInUp{ 0%{ opacity: 0; transform: translateY(20px); } 100%{ opacity: 1; transform: translateY(0); } } .fadeInUp{ -webkit-animation-name: fadeInUp; -moz-animation-name: fadeInUp; -o-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInDown{ 0%{ opacity: 0; -webkit-transform: translateY(-20px); } 100%{ opacity: 1; -webkit-transform: translateY(0); } } @-moz-keyframes fadeInDown{ 0%{ opacity: 0; -moz-transform: translateY(-20px); } 100%{ opacity: 1; -moz-transform: translateY(0); } } @-o-keyframes fadeInDown{ 0%{ opacity: 0; -o-transform: translateY(-20px); } 100%{ opacity: 1; -o-transform: translateY(0); } } @keyframes fadeInDown{ 0%{ opacity: 0; transform: translateY(-20px); } 100%{ opacity: 1; transform: translateY(0); } } .fadeInDown{ -webkit-animation-name: fadeInDown; -moz-animation-name: fadeInDown; -o-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInLeft{ 0%{ opacity: 0; -webkit-transform: translateX(-20px); } 100%{ opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInLeft{ 0%{ opacity: 0; -moz-transform: translateX(-20px); } 100%{ opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInLeft{ 0%{ opacity: 0; -o-transform: translateX(-20px); } 100%{ opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInLeft{ 0%{ opacity: 0; transform: translateX(-20px); } 100%{ opacity: 1; transform: translateX(0); } } .fadeInLeft{ -webkit-animation-name: fadeInLeft; -moz-animation-name: fadeInLeft; -o-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInRight{ 0%{ opacity: 0; -webkit-transform: translateX(20px); } 100%{ opacity: 1; -webkit-transform: translateX(0); } } @-moz-keyframes fadeInRight{ 0%{ opacity: 0; -moz-transform: translateX(20px); } 100%{ opacity: 1; -moz-transform: translateX(0); } } @-o-keyframes fadeInRight{ 0%{ opacity: 0; -o-transform: translateX(20px); } 100%{ opacity: 1; -o-transform: translateX(0); } } @keyframes fadeInRight{ 0%{ opacity: 0; transform: translateX(20px); } 100%{ opacity: 1; transform: translateX(0); } } .fadeInRight{ -webkit-animation-name: fadeInRight; -moz-animation-name: fadeInRight; -o-animation-name: fadeInRight; animation-name: fadeInRight; } /* ========================================================================== PRELOADER ========================================================================== */ #preloader{ position: fixed; top:0; right:0; bottom:0; left:0; z-index:99999; /* makes sure it stays on top */ background-color:#fff; /* change if the mask should have another color then white */ } #status{ position:absolute; top:50%; /* centers the loading animation vertically one the screen */ left:50%; /* centers the loading animation horizontally one the screen */ margin:-100px 0 0 -100px; /* is width and height divided by two */ width:200px; height:200px; background-image:url(../img/AjaxLoader.gif); /* path to your loading animation */ background-position:center; background-repeat:no-repeat; background-size:32px 32px; } /**/ .mini-product{ color:#000CAB; margin-left:14px; margin-right:14px; display:inline-block; font-size:0.9em; font-weight:bold;} .mini-product p{ margin-top:0px;} /* ========================================================================== HEADER ========================================================================== */ #header{ width: 100%; height:120px; } /* Tint background image */ #header.tint{ } /* Fallback for IE */ .no-rgba .tint{ background:transparent; filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#50000000,endColorstr=#50000000); zoom: 1; } /* ========================================================================== HEADER: NAVIGATION ========================================================================== */ #header .nav-header{ position: fixed; top: 0; left: 0; z-index: 999; width: 100%; height: 120px; background-color:#FFF; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; -webkit-transform: translateZ(0); -webkit-transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; -webkit-perspective: 1000; } #header .nav-header .nav-inner{ margin: 0 auto; max-width: 1170px; } #header .nav-header h1, #nav-toggle, #header .nav-header .nav{ position: relative; display: inline-block; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; -webkit-transform: translateZ(0); } #header .nav-header h1, #nav-toggle, #header .nav-header .nav a{ color:#000CAB; line-height: 120px; } #nav-toggle, #header .nav-header .nav a{ outline: 0; } #header .nav-header .logo a{ height: 120px; } #header .nav-header h1{ float: left; margin: 0; padding-left: 20px; } #nav-toggle, #header .nav-header .nav{ float: left; padding-left: 28px; text-transform: uppercase; } #nav-toggle{ font-size: 1.66667em; padding: 35px; line-height:20px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; display: none; background-color:#00D6C5; float:right; } #nav-toggle.active{ background: #1d1d1d; } #nav-toggle img{ vertical-align: inherit; } #header .nav-header .nav a{ position: relative; margin: 0 0 0 20px; font-size:0.8em; } #header .nav-header .nav a.current, #header .nav-header .nav a:hover{ color: #00D3C5!important; } #header .nav-header .nav a.current:after{ position: absolute; top: -34px; left: 0; width: 100%; height: 5px; background: #00D3C5; content: ""; } #header .nav-header.blackout{ height: 90px; } #header .nav-header.blackout h1, #header .nav-header.blackout .nav a{ line-height: 81px; } #header .nav-header.blackout h1{ font-size: 2em; } #header .nav-header .logo a img{ margin-top:20px; } #header .nav-header.blackout .logo a{ height: 70px; } #header .nav-header.blackout .logo a img{ height:70px; margin-top:0px; width:auto;} /* ========================================================================== HEADER: INTRO ========================================================================== */ #header .intro-block{ width: 100%; height: 100%; display: table; color: #ffffff; } #header .intro-block .intro-text{ display: table-cell; vertical-align: middle; -webkit-transform:translate3d(0,0,0); } #header .intro-block .intro-text h1, #header .intro-block .intro-text h3{ text-transform: uppercase; margin: 0; } #header .intro-block .intro-text h1{ font-size:4em; line-height:1em; } #header .intro-block .intro-text .button{ margin-top: 40px; padding: 10px 15px; font-size: 1.17em; } /* Rotating Text */ #header .rotating{ display: inline-block; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s; transition: 0.5s; -webkit-transform: rotateX(0) rotateY(0) rotateZ(0); -moz-transform: rotateX(0) rotateY(0) rotateZ(0); -o-transform: rotateX(0) rotateY(0) rotateZ(0); transform: rotateX(0) rotateY(0) rotateZ(0); -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; -o-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform-origin-x: 50%; } #header .rotating.flip{ position: relative; } #header .rotating .front, #header .rotating .back{ top: 0; left: 0; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -o-backface-visibility: hidden; backface-visibility: hidden; } #header .rotating .front{ position: absolute; display: inline-block; -webkit-transform: translate3d(0,0,1px); -moz-transform: translate3d(0,0,1px); -ms-transform: translate3d(0,0,1px); -o-transform: translate3d(0,0,1px); transform: translate3d(0,0,1px); } #header .rotating.flip .front{ z-index: 1; } #header .rotating .back{ display: block; opacity: 0; } #header .rotating.flip .back{ z-index: 2; display: block; opacity: 1; -webkit-transform: rotateY(180deg) translate3d(0,0,0); -moz-transform: rotateY(180deg) translate3d(0,0,0); -ms-transform: rotateY(180deg) translate3d(0,0,0); -o-transform: rotateY(180deg) translate3d(0,0,0); transform: rotateY(180deg) translate3d(0,0,0); } #header .rotating.flip.up .back{ -webkit-transform: rotateX(180deg) translate3d(0,0,0); -moz-transform: rotateX(180deg) translate3d(0,0,0); -ms-transform: rotateX(180deg) translate3d(0,0,0); -o-transform: rotateX(180deg) translate3d(0,0,0); transform: rotateX(180deg) translate3d(0,0,0); } /* ========================================================================== ABOUT ========================================================================== */ #glass{ background:#00D6C5 url("../img/separator-grey.png") no-repeat top left; background-size:contain; padding-top:80px; color:#FFF; } #glass .service-block .service-body p{ font-size:0.9em; color:#FFF;} #glass .service-block .service-body h2{ margin-top: 0; color:#FFF; font-size:1.2em; } #glass .service-block .service-body .button{ background-color:#FFF; color:#00D6C5;} /* ========================================================================== ABOUT ========================================================================== */ #about .container{ padding: 30px 20px; } #about .section-title{ max-width:780px; margin:auto;} #about .team-grid .t-block .t-image{ -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; box-shadow: 0 0 0 5px #ffffff, 0 0 0 8px #dcdcdc; } #about .team-grid .t-block .t-position{ display: inline-block; margin: 0 auto 10px; padding: 10px; width: 100%; background: #a9a9a9; color: #fff; letter-spacing: 1px; } #about .team-grid .t-block .t-socials{ display: block; } #about .team-grid .t-block .t-socials a{ padding: 10px; } /* ========================================================================== SERVICE ========================================================================== */ #service .section-title{ margin-bottom:55px;} #service .section-title h3{ max-width: 780px; margin:auto; } #service .service-block{ max-width: 960px; margin: 0 auto 90px; } #service .service-block:last-child{ margin-bottom: 0; } #service .service-block .service-icon, #service .service-block .service-body{ position: relative; } #service .service-block:nth-child(odd) .service-icon{ left: 49.0%; } #service .service-block:nth-child(odd) .service-body{ left: -49.0%; } #service .service-block .service-body p{ font-size:0.9em;} #service .service-block .service-body h2{ margin-top: 0; color:#000CAB; font-size:1.2em; } #service {background:#F5F5F5 url("../img/separator-white.png") no-repeat top left; background-size:contain; padding-top:60px; } /* ========================================================================== SKILL ========================================================================== */ #skill .skill-grid .skill-block h3{ font-weight: 400; } #skill .skill-grid .skill-block .chart{ position: relative; width: 200px; height: 200px; margin: 0 auto; } #skill .skill-grid .skill-block .chart canvas{ position: absolute; top: 0; left: 0; } #skill .skill-grid .skill-block .chart span{ display: inline-block; color: #a9a9a9; font-size: 2em; font-weight: 700; line-height: 200px; } #skill .skill-grid .skill-block .chart span:after{ content: '%'; margin-left: 0.1em; font-size: .8em; } /* ========================================================================== CLIENTS ========================================================================== */ #clients .section-title{ margin-bottom:0px; } #clients { background:#F5F5F5 url("../img/separator-green.png") no-repeat top left; background-size:contain; padding-top:80px; } /* ========================================================================== WORKS ========================================================================== */ #works{ background:#1D1D1D url("../img/separator-black.png") no-repeat top left; background-size:contain; padding-top:80px; color:#FFF;} #works .section-title h3{ color:#BBBBBB;} #filters{ margin-bottom: 40px; } #filters ul{ display: inline-block; margin: 0; padding: 0; *display: inline; *zoom: 1; } #filters ul li{ display: inline; } #filters ul li span{ position: relative; float: left; padding: 4px 16px; color:#a9a9a9; text-decoration:none; line-height: 20px; cursor: pointer; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #filters ul li span:hover{ color:#ffffff; } #filters ul li span.active{ color:#26D6C5; } #portfolio-grid { } #portfolio-grid .portfolio-block{ display:none; float:left; overflow:hidden; width: 33.3333333%; } #portfolio-grid .portfolio-wrapper{ position: relative !important; overflow:hidden; background: #ffffff; cursor:pointer; } #portfolio-grid .portfolio-block a, #portfolio-grid .portfolio-block a:hover{ color: #222222; } #portfolio-grid .portfolio-block a:hover{ } #portfolio-grid .portfolio-block img{ max-width:100%; } #portfolio-grid .portfolio-block .portfolio-wrapper{ -webkit-backface-visibility: hidden; } #portfolio-grid .portfolio-block .label-block{ position: absolute; top:0; left:0; width: 100%; height: 100%; background: rgb(255, 255, 255); background: rgba(255, 255, 255, 0.952941); opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); -webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out; -ms-transition: opacity 0.2s ease-in-out; transition: opacity 0.2s ease-in-out; } #portfolio-grid .portfolio-block a:hover .label-block{ opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); } #portfolio-grid .portfolio-block .label-text{ display: table; width: 100%; height: 100%; } #portfolio-grid .portfolio-block .label-text-inner{ display: table-cell; padding: 0 1.66667rem; vertical-align: middle; } #portfolio-grid .portfolio-block .text-title{ margin:0; } #portfolio-grid .portfolio-block .text-category{ display: block; color: #333333; } /* ========================================================================== PRICING ========================================================================== */ #pricing .pricing-table .pricing-block .pricing-body{ background: #f5f5f5; max-width: 300px; margin: 0 auto; -webkit-backface-visibility: hidden; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -o-transition: all 0.2s; -ms-transition: all 0.2s; transition: all 0.2s; } #pricing .pricing-table .pricing-block .pricing-body:hover{ -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -o-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } /* IE8 */ .lt-ie9 #pricing .pricing-table .pricing-block .pricing-body:hover{ -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1.05, M12=0, M21=0, M22=1.05, SizingMethod='auto expand')"; margin-left: -10px; margin-top: -17px; } #pricing .pricing-table .pricing-block .pricing-body h2{ margin: 0; padding: 20px; } #pricing .pricing-table .pricing-block .pricing-head{ padding: 15px; color: #ffffff; background: #c0c0c0; } #pricing .pricing-table .pricing-block .price{ font-weight: 700; font-size: 4em; text-transform: uppercase; } #pricing .pricing-table .pricing-block .pricing-features ul{ text-align: left; padding: 0; margin: 0; } #pricing .pricing-table .pricing-block .pricing-features li{ padding: 20px; border-bottom: 1px solid #dcdcdc; list-style-type: none; } #pricing .pricing-table .pricing-block .pricing-features li:last-child{ border-bottom: none; } #pricing .pricing-table .pricing-block .pricing-footer .pricing-action{ display: inline-block; width: 100%; padding: 20px; background: #666; color: #fff; text-decoration: none; } #pricing .pricing-table .pricing-block .pricing-footer .pricing-action:hover{ display: inline-block; width: 100%; padding: 20px; background: #222222; color: #fff; text-decoration: none; } /* ========================================================================== Timeline ========================================================================== */ #timeline .tl-list { max-width: 900px; margin: 0 auto; padding: 0; list-style: none; position: relative; } /* The line */ #timeline .tl-list:before, #timeline .tl-list:after { content: ''; position: absolute; top: 0; bottom: 0; left: 20%; margin-left: -11px; width: 4px; background: rgba(0,0,0,0.1); } #timeline .tl-list:after { top: auto; bottom: -20px; left: 20%; margin-left: -11px; height: 20px; background: rgba(0,0,0,0.1); background: -moz-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(0,0,0,0.1)), color-stop(100%, rgba(0,0,0,0))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); } /* The date/time */ #timeline .tl-list > li { position: relative; } #timeline .tl-list > li .tl-time { display: block; width: 25%; padding-right: 100px; position: absolute; top: 50%; margin-top: -23px; } #timeline .tl-list > li .tl-time span { display: block; text-align: right; line-height: 3em; } /* Right content */ #timeline .tl-list > li .tl-label { margin: 0 0 20px 25%; padding: 20px; background: #ffffff; position: relative; border: 1px solid #dcdcdc; } #timeline .tl-list > li .tl-label h2{ margin: 0; font-family: Open Sans, Arial, sans-serif; font-weight: 400; } /* The triangle */ #timeline .tl-list > li .tl-label:after { right: 100%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-right-color: #dcdcdc; border-width: 10px; top: 50%; margin: -10px 0 0 -25px; } /* The icons */ #timeline .tl-list > li .tl-icon { width: 50px; height: 50px; font-size: 1.4em; line-height: 50px; -webkit-font-smoothing: antialiased; position: absolute; color: #f5f5f5; background: #666666; border-radius: 50%; text-align: center; left: 20%; top: 50%; margin: -25px 0 0 -35px; -webkit-transition: background 0.2s ease-in-out; -moz-transition: background 0.2s ease-in-out; -o-transition: background 0.2s ease-in-out; -ms-transition: background 0.2s ease-in-out; transition: background 0.2s ease-in-out; } #timeline .tl-list > li:hover .tl-icon{ background: #999999; } /* Load More Button */ #timeline .load-more{ margin-top: 20px; } /* ========================================================================== QUOTES ========================================================================== */ #quotes {background:#FFF url("../img/separator-grey-white.png") no-repeat top left; background-size:contain; padding-top:60px; } #quotes .container{ padding-bottom:20px;} #quotes .quote{ font-family:Georgia, "Times New Roman", Times, serif;} #quotes h2{ font-style:italic; font-weight:100; } #quotes h2{ margin-top: -32px; } #quotes .quote{ font-size: 5em; line-height: 1em; } /* ========================================================================== CONTACT ========================================================================== */ #contact{ background: transparent url("../img/background/contact.jpg") no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #contact .section-title h3{ color: white; } #contact form{ position: relative; margin: 0 auto; max-width: 620px; } #contact form input, #contact form textarea{ display: block; margin-bottom: 20px; padding: 10px; width: 100%; border: 2px solid #fff; background: rgb(64,64,64); background: rgba(64,64,64,0.1); color: #fff; font-family: Open Sans, Arial, sans-serif; } #contact form textarea{ min-height: 200px; resize: vertical; } #contact form input:focus, #contact form textarea:focus, #contact form label:active + input, #contact form label:active + textarea{ outline: none; border: 2px solid #fff; background: #fff; color: #666; } #contact form input.submit{ display: inline-block; margin-bottom: 0; padding: 10px; border: 2px solid #ffffff; background: rgb(64,64,64); background: rgba(64,64,64,0.1); color: #fff; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #contact form input.submit:hover{ background: #ffffff; color: #1d1d1d; } #contact .form-notification{ margin-top: 20px; } #contact .form-notification .success, #contact .form-notification .warning, #contact .form-notification .error{ padding: 10px; color: #ffffff; } #contact .form-notification .success{ text-align: center; background: #27ae60; } #contact .form-notification .warning{ text-align: center; background: #d35400; } #contact .form-notification .error{ background: #bf0000; list-style: none; } #address-block{ background: #1d1d1d; background: rgba(0, 0, 0, 0.6); } #address-block > address{ padding: 40px 0; font-weight:100; text-align: center; } /* ========================================================================== MAP ========================================================================== */ #map {width:100%;height:400px;color:#333;} #map img{ max-width: none !important; } /* ========================================================================== FOOTER ========================================================================== */ #footer{ background: #FFF; color: #777777; text-align: center; } #footer .social-cont{ float:none; margin:auto; padding-bottom:10px; display:none;} #footer-top{ background: #333333; } #footer-top .container, #footer-bottom .container{ padding: 10px 0px; font-size:0.7em; } #footer-top .socials{ padding: 0; margin: 0; list-style: none; } #footer-top .socials li{ display: inline-block; } #footer-top .socials li a{ display: inline-block; margin: 10px; width: 2em; height: 2em; border: 2px solid #ffffff; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; color: #ffffff; font-size: 2em; line-height: 2em; } #footer-top .socials li a:hover{ background: #ffffff; color: #1d1d1d; } /* ========================================================================== EXTERNAL PAGE ========================================================================== */ /* Header for Page */ #header.page{ text-align: center; height: 220px; background: #1d1d1d; } /* Post Container */ #post .container{ max-width: 900px; } #post .meta{ color: #999; } #post .section-title{ margin-bottom:2em;} /* Author Area */ #post .author { position: relative; max-width: 520px; margin: 80px auto 0; } #post .author:after{ position: absolute; top: -40px; left: 50%; margin-left: -25px; width: 50px; height: 2px; background: rgb(191, 191, 191); background: rgba(191, 191, 191, 0.7); content: ""; } #post .author .author-text { overflow: hidden; } #post .author img { float: left; margin: 4px 20px 20px 4px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #post .author h3, #post .author p { margin-top: 0; } #post .author h3 { margin-bottom: 0.5em; } #post .author .socials{ display: block; } #post .author .socials a{ padding: 10px; } /* Comments Area */ #comment .container { max-width: 620px; margin: 0 auto; } /* Comment List */ #comment .comment-list { margin: 0 0 40px 0; padding: 0; } #comment .comment-list li { margin: 0; padding: 0; list-style: none; overflow: hidden; clear: both; } #comment .comment-list ul { margin: 0 0 0 11%; /* relative value */ padding: 0; } #comment .comment-list .comment-block { overflow: hidden; margin-bottom: 1em; border-bottom: 1px solid #dcdcdc; } #comment .comment-list .comment-avatar img { float: left; margin: 0 20px 20px 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #comment .comment-list .comment-head, #comment .comment-list .comment-text{ margin-bottom: 1em; } #comment .comment-list .comment-head a{ font-weight: 700; } #comment .comment-list .comment-head .comment-date{ color: #999999; } /* Comment Form */ #comment form{ position: relative; margin: 0 auto 20px; } #comment form input, #comment form textarea{ display: block; margin-bottom: 20px; padding: 10px; width: 100%; border: 2px solid #dcdcdc; background: rgb(64,64,64); background: rgba(0,0,0,0.1); font-family: Open Sans, Arial, sans-serif; } #comment form textarea{ min-height: 200px; resize: vertical; } #comment form input:focus, #comment form textarea:focus, #comment form label:active + input, #comment form label:active + textarea{ outline: none; border: 2px solid #999999; color: #666666; } #comment form input.submit{ display: inline-block; margin-bottom: 0; padding: 10px; border: 2px solid #666666; background: #666666; color: #fff; text-transform: uppercase; letter-spacing: 1px; cursor: pointer; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; -ms-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } #comment form input.submit:hover{ border: 2px solid #222222; background: #222222; } /* ========================================================================== 404 PAGE ========================================================================== */ #four-oh-four{ width: 100%; height: 100%; display: table; color: #ffffff; background-color:; background: #222222 url("../img/background/contact.jpg") no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } #four-oh-four a{ color: #dfdfdf; } #four-oh-four a:hover{ color: #ffffff; } #four-oh-four .content-block { display: table-cell; vertical-align: middle; background-color: rgb(0,0,0); background-color: rgba(0,0,0,0.5); } #four-oh-four .content-block .content-text { max-width: 580px; margin: 0 auto; padding: 20px; color: white; text-align: center; } #four-oh-four .content-block .content-text h1 { font-size: 180px; line-height: 100%; margin: 0; } #four-oh-four .content-block .content-text h2 { margin-top: 0; font-size: 24px; text-transform: uppercase; } #four-oh-four .content-block .content-text .button{ margin-top: 1em; } /* ========================================================================== PLUGIN: MAGNIFIC POPUP, OWL CAROUSEL ========================================================================== */ /* Magnific Popup Zoom Style*/ .mfp-with-zoom .mfp-container, .mfp-with-zoom.mfp-bg { opacity: 0; -webkit-backface-visibility: hidden; /* ideally, transition speed should match zoom duration */ -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .mfp-with-zoom.mfp-ready .mfp-container { opacity: 1; } .mfp-with-zoom.mfp-ready.mfp-bg { opacity: 0.8; } .mfp-with-zoom.mfp-removing .mfp-container, .mfp-with-zoom.mfp-removing.mfp-bg { opacity: 0; } /* Owl Carousel Owl Theme */ .owl-theme .owl-controls{ margin-top: 10px; text-align: center; } /* Styling Next and Prev buttons */ .owl-theme .owl-controls .owl-buttons div{ color: #FFF; display: inline-block; zoom: 1; *display: inline; margin: 5px; padding: 3px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; background: #666666; filter: Alpha(Opacity=50); opacity: 0.5; } /* Clickable class fix problem with hover on touch devices */ /* Use it for non-touch hover action */ .owl-theme .owl-controls.clickable .owl-buttons div:hover{ filter: Alpha(Opacity=100); opacity: 1; text-decoration: none; } /* Styling Pagination*/ .owl-theme .owl-controls .owl-page{ display: inline-block; zoom: 1; *display: inline; } .owl-theme .owl-controls .owl-page span{ display: block; width: 12px; height: 12px; margin: 5px 7px; filter: Alpha(Opacity=50); opacity: 0.5; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; background: #666666; } .owl-theme .owl-controls .owl-page.active span, .owl-theme .owl-controls.clickable .owl-page:hover span{ filter: Alpha(Opacity=100); opacity: 1; } /* If PaginationNumbers is true */ .owl-theme .owl-controls .owl-page span.owl-numbers{ height: auto; width: auto; color: #FFF; padding: 2px 10px; font-size: 12px; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; } /* preloading images */ .owl-item.loading{ min-height: 150px; background: url(../img/AjaxLoader.gif); background-position:center; background-repeat:no-repeat; } .owl-carousel .owl-item{ text-align: center; } /* ========================================================================== MEDIA QUERIES ========================================================================== */ /* Portrait tablet to landscape and desktop */ @media only screen and (min-width: 768px) and (max-width: 979px){ #about .team-grid .t-block, #skill .skill-grid .skill-block, #pricing .pricing-table .pricing-block{ margin-bottom: 20px; } #about .team-grid .t-block .grayscale .t-image, #about .team-grid .t-block .t-position{ max-width: 300px; } } /* Landscape phone to portrait tablet */ @media only screen and (max-width: 767px){ .flex-caption{ display:block!important; color:#333!important; left:0!important; right:0!important; padding-left:4%!important; padding-right:4%!important; text-align:center!important; position:relative!important; } #footer .social-cont{ display:block;} .flex-direction-nav a.flex-next{ top:30%!important;} .flex-direction-nav a.flex-prev{ top:30%!important;} .logo img{ max-height:84px; width:auto; } .flex-control-nav{ position:relative!important; left:0!important; right:0!important; bottom:0!important;} .nav-header .social-cont{ display:none; } #header .nav-header, #header .nav-header.blackout{ height: 90px; } #header .nav-header .nav-inner{ width: 100%; } #nav-toggle, #header .nav-header h1, #header .nav-header.blackout h1{ } #header .nav-header .logo a, #header .nav-header.blackout .logo a{ height: 90px; } #header .nav-header .nav a, #header .nav-header.blackout .nav a{ line-height: 50px; } #nav-toggle{ display: block; } #header .nav-header .nav{ display: block; position: absolute; top: 90px; right: -767px; width: 100%; float:none; padding-right: 0; border-bottom: 10px solid rgba(0,0,0,0.952941); -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -o-transition: all 0.3s; -ms-transition: all 0.3s; transition: all 0.3s; } #header .nav-header.blackout h1.logo{ line-height:69px!important; } #header .nav-header .nav.open{ right: 0; padding-left:0px; } #header .nav-header .nav.open a{ color:#FFF; } #header .nav-header .nav a{ display: inline-block; width: 100%; margin: 0; padding-left: 20px; background: #1d1d1d; border-left: 4px solid transparent; } #header .nav-header .nav a:hover{ background: #191919; } #header .nav-header .nav a.current{ border-left: 4px solid #00D6C5; color:#FFF!important; background-color:#00D6C5; } #header .nav-header .nav a.current:after{ background: transparent; } #about .team-grid .t-block, #skill .skill-grid .skill-block, #pricing .pricing-table .pricing-block{ margin-bottom: 20px; } #about .team-grid .t-block .grayscale .t-image, #about .team-grid .t-block .t-position{ max-width: 300px; } #service .service-block:nth-child(odd) .service-icon, #service .service-block:nth-child(odd) .service-body{ left: 0; } #service .service-block .service-body{ text-align: center; } #service .service-block .service-body h2{ margin-top: 0.83em; } #service .service-block .service-body p{ text-align: left; } #portfolio-grid .portfolio-block{ width: 50%; } #timeline .tl-list:before, #timeline .tl-list:after { display: none; } #timeline .tl-list > li{ margin-top: 40px; } #timeline .tl-list > li:first-child{ margin-top: 0; } #timeline .tl-list > li .tl-time{ width: 100%; position: relative; padding-right: 0; background: #dcdcdc; } #timeline .tl-list > li .tl-time span { text-align: left; padding-left: 20px; line-height: 4.8em; border: 1px solid #dcdcdc; } #timeline .tl-list > li .tl-label { margin: 0; border-top: none; } #timeline .tl-list > li .tl-label:after { display: none; } #timeline .tl-list > li .tl-icon { position: relative; float: right; left: auto; margin: -65px 20px 0 0; } } /* Landscape phones and down */ @media only screen and (max-width: 480px) { #portfolio-grid{ max-width: 400px; margin: 0 auto; } #portfolio-grid .portfolio-block{ width: 100%; } #four-oh-four .content-block .content-text { max-width: 420px; } #four-oh-four .content-block .content-text h1 { font-size: 128px; } } /* Retina Display */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and ( min--moz-device-pixel-ratio: 2), only screen and ( -o-min-device-pixel-ratio: 2/1), only screen and ( min-device-pixel-ratio: 2), only screen and ( min-resolution: 192dpi), only screen and ( min-resolution: 2dppx) { .logo a{ background-image: url(../img/logo@2x.png); } #status{ background-image: url(../img/AjaxLoader@2x.gif); } } .white-popup { position: relative; background: #FFF; padding: 20px; width:auto; max-width: 1024px; margin: 20px auto; } /* * jQuery FlexSlider v2.2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Browser Resets *********************************/ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* Icon Fonts *********************************/ /* Font-face Icons */ @font-face { font-family: 'flexslider-icon'; src:url('../fonts/flexslider-icon.eot'); src:url('../fonts/flexslider-icon.eot?#iefix') format('embedded-opentype'), url('../fonts/flexslider-icon.woff') format('woff'), url('../fonts/flexslider-icon.ttf') format('truetype'), url('../fonts/flexslider-icon.svg#flexslider-icon') format('svg'); font-weight: normal; font-style: normal; } /* FlexSlider Necessary Styles *********************************/ .flexslider {margin: 0; padding: 0;} .flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img {width: 100%; display: block;} .flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .slides element */ .slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .slides {display: block;} * html .slides {height: 1%;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child {display: block;} /* FlexSlider Default Theme *********************************/ .flexslider { margin: 0 0 0px; background: #fff; border: 0px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1; } .flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; } .loading .flex-viewport { max-height: 300px; } .flexslider .slides { zoom: 1; } .carousel li { margin-right: 0px; } /* Direction Nav */ .flex-direction-nav {*height: 0;} .flex-direction-nav a { display: block; width: 48px; height: 45px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; background-color:#FFF; border-radius:6px; padding:4px; } .flex-direction-nav .flex-prev { left: -50px; } .flex-direction-nav .flex-next { right: -50px; text-align: center; } .flexslider:hover .flex-prev { opacity: 0.7; left: 10px; text-align:center; } .flexslider:hover .flex-next { opacity: 0.7; right: 10px; } .flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 1; } .flex-direction-nav .flex-disabled { opacity: 0!important; filter:alpha(opacity=0); cursor: default; } .flex-direction-nav a.flex-next { display:block; background: transparent url("../img/arrow-right.png") no-repeat 10px 0; width:40px; height:44px; overflow:hidden; text-indent:-1000px; } .flex-direction-nav a.flex-prev { display:block; background: transparent url("../img/arrow-left.png") no-repeat 10px 0; width:40px; height:44px; overflow:hidden; text-indent:-1000px; } /* Pause/Play */ .flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; } .flex-pauseplay a:before { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; } .flex-pauseplay a:hover { opacity: 1; } .flex-pauseplay a.flex-play:before { content: '\f003'; } /* Control Nav */ .flex-control-nav {width: 100%; position: absolute; bottom: 70px; text-align: center; z-index:20;} .flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .flex-control-paging li a {width: 11px; height: 11px; display: block; background:#FFF; cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); } .flex-control-paging li a:hover { background-color:#00D3C5; background: rgba(0,0,0,0.7); } .flex-control-paging li a.flex-active { background-color:#00D3C5; cursor: default; } .flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .flex-control-thumbs li {width: 25%; float: left; margin: 0;} .flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .flex-control-thumbs img:hover {opacity: 1;} .flex-control-thumbs .flex-active {opacity: 1; cursor: default;} .flex-caption{ width: auto; padding: 2%; position: absolute; left: 20%; right: 53%; top: 45%; color: #fff; text-align: left; font-size: 1.8em; line-height: 1.4em; font-weight: normal; font-weight: 100!important;} .flex-caption p{ margin-top:0em!important; margin-bottom:0.6em!important;} .flex-caption a{ background-color:#11CCB9; display:inline-block; width:auto; padding:5px 15px!important; border-radius:3px; color:#FFF; line-height:normal; font-size:0.6em;} @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px;} .flex-direction-nav .flex-next { opacity: 1; right: 10px;} }