/* 
	Author: Orqa Design
	Author URI: http://orqadesign.com/
	Version: 1.0
	License: For use by Orqa Design Only
 	*/

/** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */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; }/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1; }
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; }
@font-face { font-family: 'quicksandregular'; src: url('/fonts/quicksand-regular-webfont.eot'); src: url('/fonts/quicksand-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/quicksand-regular-webfont.woff') format('woff'), url('/fonts/quicksand-regular-webfont.ttf') format('truetype'), url('/fonts/quicksand-regular-webfont.svg#quicksandregular') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'quicksandlight'; src: url('/fonts/quicksand-light-webfont.eot'); src: url('/fonts/quicksand-light-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/quicksand-light-webfont.woff') format('woff'), url('/fonts/quicksand-light-webfont.ttf') format('truetype'), url('/fonts/quicksand-light-webfont.svg#quicksandlight') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'quicksandbold'; src: url('/fonts/quicksand-bold-webfont.eot'); src: url('/fonts/quicksand-bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/quicksand-bold-webfont.woff') format('woff'), url('/fonts/quicksand-bold-webfont.ttf') format('truetype'), url('/fonts/quicksand-bold-webfont.svg#quicksandbold') format('svg'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal; }
/*! *  Font Awesome 4.7.0 by @davegandy - http://fontawesome.io - @fontawesome *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License) */@font-face { font-family: 'FontAwesome'; src: url('../fonts/fontawesome-webfont.eot?v=4.7.0'); src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg'); font-weight: normal; font-style: normal }
.fa { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale }
.fa-circle:before { content: "\f111" }
/* Main Styles & Homepage */
html { overflow-x: hidden; }
body { line-height: 1.5; font-size: 100%; background-color: #f4f6f7; color: #3b3b3b; font-family: 'quicksandregular', sans-serif; }
body#home { color: #7f8084; }
h1 { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: 3px; color: #28426c; margin-top: 20px; margin-bottom: 50px; }
h1.opac { opacity: 0; height: 0; width: 0; }
h2 { font-size: 100px; color: #d2d6dc; margin-top: 50px; font-family: "quicksandlight", sans-serif; text-transform: lowercase; }
h3 { font-family: "quicksandregular", sans-serif; font-size: 28px; }
h4 { color: #aeb3ba; font-family: "quicksandbold", sans-serif; margin-bottom: 40px; font-size: 22px; margin-top: 100px; }
#home h2 { color: #aeb3ba; font-family: "quicksandbold", sans-serif; margin-bottom: 40px; font-size: 22px; margin-top: 100px; text-transform: uppercase; }
h5 { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; font-size: 14px; text-transform: uppercase; letter-spacing: 3px; color: #28426c; margin-top: 20px; margin-bottom: 30px; }
footer { color: #7f8084; }
a:link, a:visited { color: #28426c; text-decoration: none; }
a:hover { color: #219185; text-decoration: none; }
#page { height: 100%; position: relative; margin: 0 auto; background-color: #f4f6f7; overflow-x: hidden; overflow: hidden; }
a.button2:hover { color: #fff; }
.fontawesome { font-family: "FontAwesome"; }
.left { float: left; }
.right { float: right; }
strong, b { font-family: "quicksandbold", sans-serif; }
a, .logo img, .circles img, a.clientlogo, a img, input[type="submit"], .cycle-pager span { -moz-transition: opacity .5s ease-in-outt; -o-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out; transition: opacity .5s ease-in-out; opacity: 1; }
a:hover, .logo img:hover, .circles img:hover, a.clientlogo:hover, a img:hover, input[type="submit"]:hover, .cycle-pager span:hover { opacity: 0.5; }
/* Menu */
#menu-icon { display: none; text-align: center; z-index: 200; font-size: 20px; margin-top: -15px; border: solid 1px; padding: 2px 5px; border-radius: 5px; text-transform: uppercase; letter-spacing: 5px; }
.menu li { list-style: outside none none; display: inline-block; color: #c9ced5 !important; padding-left: 15px; padding-right: 15px; text-align: center; font-size: 20px; }
.menu li a { color: #28426c; }
.menu li a:active { color: #219185 }
.menu li a:hover { color: #219185; text-decoration: none; }
#about .fa-circle { color: #aeb3ba; font-size: 12px; padding-left: 10px; padding-right: 10px; }
/* Footer */
.prefooter, .copyrightcontact, .copyright { clear: both; }
.footerleft, .footermiddle, .footerright { width: 50%; float: left; }
.prefooter { width: 600px; margin: auto; padding-bottom: 50px; }
.copyrightcontact, .copyright { text-align: center; }
.copyrightcontact { font-size: 16px; color: #9E9FA4; line-height: 24px; margin-top: 140px; margin-bottom: 10px; }
.copyright { font-size: 12px; color: #9e9fa4; line-height: 24px; margin-bottom: 50px; }
.copyright a { color: #9e9fa4; }
.footerboxinner a { color: #7f8084; }
/* Header */
.logo { margin-left: auto; margin-right: auto; width: 520px; margin-top: 30px; margin-bottom: 30px; }
.curve { width: 130px; margin-left: auto; margin-right: auto; padding-top: 50px; padding-bottom: 50px; }
.curve.cadjust { padding-top: 100px; padding-bottom: 0px; }
.bigcurve { width: 130px; margin-left: auto; margin-right: auto; padding-top: 100px; padding-bottom: 100px; }
.circles { width: 100%; }
#container { text-align: center; width: 100%; }
#navigation { text-align: center; }
.menucircles { padding-left: 20px; padding-right: 20px; margin-bottom: -7px; }
/* HOMEPAGE CIRCLES   */
.circle-portolio1-rollover { display: block; width: 210px; height: 209px; background: url('/images/homepage/circle-portolio1-rollover.png') bottom; background-size: 210px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-portolio1-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-about-rollover { display: block; width: 146px; height: 144px; background: url('/images/homepage/circle-about-rollover.png') bottom; background-size: 146px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-about-rollover:hover { background-position: 0 0; opacity: 0.7; }
.circle-blog-rollover { display: block; width: 70px; height: 70px; background: url('/images/homepage/circle-blog-rollover.png') bottom; text-indent: -99999px; background-size: 70px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-blog-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-emailmarketing-rollover { display: block; width: 181px; height: 180px; background: url('/images/homepage/circle-emailmarketing-rollover.png') bottom; background-size: 181px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-emailmarketing-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-graphicdesign-rollover { display: block; width: 204px; height: 204px; background: url('/images/homepage/circle-graphicdesign-rollover.png') bottom; background-size: 204px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-graphicdesign-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-map-rollover { display: block; width: 207px; height: 205px; background: url('/images/homepage/circle-map-rollover.png') bottom; background-size: 207px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-map-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-portfolio3-rollover { display: block; width: 118px; height: 118px; background: url('/images/homepage/circle-portfolio3-rollover.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-portfolio3-rollover:hover { background-position: 0 0; opacity: 0.7; }
.circle-portolio2-rollover { display: block; width: 134px; height: 132px; background: url('/images/homepage/circle-portolio2-rollover.png') bottom; background-size: 134px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-portolio2-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-portolio4-rollover { display: block; width: 213px; height: 214px; background: url('/images/homepage/circle-portolio4-rollover.png') bottom; background-size: 213px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-portolio4-rollover:hover { background-position: 0 0; opacity: 0.7; }
.circle-portolio-rollover { display: block; width: 118px; height: 116px; background: url('/images/homepage/circle-portolio-rollover.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-portolio-rollover:hover { background-position: 0 0; opacity: 0.5; }
.circle-webdesign-rollover { display: block; width: 267px; height: 266px; background: url('/images/homepage/circle-webdesign-rollover.png') bottom; background-size: 267px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.circle-webdesign-rollover:hover { background-position: 0 0; opacity: 0.7; }
.left { float: left; }
.design-on { display: block; }
.design-off { display: none; }
.menu-main-menu-container { float: left; }
.wrapper { padding-left: 100px; padding-right: 100px; margin-left: auto; margin-right: auto; }
.c1 { width: 210px; margin-left: 202px; margin-top: 64px; }
.c2 { width: 118px; margin-left: 72px; margin-top: 56px; }
.c3 { width: 267px; margin-left: -22px; }
.c4 { width: 204px; margin-left: -91px; margin-top: 60px; }
.c5 { width: 118px; margin-left: -110px; margin-top: 144px; }
.c6 { margin-left: 230px; margin-top: -8px; }
.c7 { margin-left: 142px; margin-top: 120px; }
.c8 { margin-left: -67px; margin-top: -96px; }
.c9 { margin-left: -96px; margin-top: 0px; }
.c10 { margin-left: -162px; margin-top: -72px; }
.c11 { margin-left: -244px; margin-top: -32px; }
.circlewrapperbig { width: 23.5%; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-background-clip: padding-box !important; -webkit-background-clip: padding-box !important; background-clip: padding-box !important; margin-left: 2%; padding: 0 1.5%; }
.circlewrapper { width: 15%; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-background-clip: padding-box !important; -webkit-background-clip: padding-box !important; background-clip: padding-box !important; margin-left: 2%; padding: 0 1.5%; }
.circlewrapper2 { width: 15%; float: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -moz-background-clip: padding-box !important; -webkit-background-clip: padding-box !important; background-clip: padding-box !important; margin-left: 2%; padding: 0 1.5%; padding-top: 2%; }
.clear { margin-left: 0; clear: both; }
.quotetext { font-size: 24px; color: #63676a; line-height: 35px; text-align: center; }
.quotes { width: 700px; margin: auto; margin-top: 50px; }
.clientname { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; text-transform: uppercase; color: #a4a9b1; font-size: 14px; letter-spacing: 3px; margin-right: 60px; float: right; margin-top: 40px; }
.companyname { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; text-transform: uppercase; color: #a4a9b1; font-size: 14px; letter-spacing: 3px; float: left; margin-left: 60px; margin-top: 40px; }
.slideshow { width: 700px; height: 200px; margin: auto; }
.quote { position: absolute; top: 0px; left: 0px; display: none; z-index: 5; opacity: 0; width: 700px; min-height: 200px; }
.slogan { margin-top: 0px; margin-bottom: 20px; font-size: 20px; color: #8f9394; letter-spacing: -1px; text-align: center; }
.homeportfolio { height: 500px; }
#chart1 { width: 300px; height: 190px; margin-left: auto; margin-right: auto; padding-top: 20px; padding-bottom: 20px; text-align: left; }
#chart2 { width: 300px; height: 190px; margin-left: auto; margin-right: auto; padding-top: 30px; padding-bottom: 30px; text-align: left; }
#chart3 { width: 300px; height: 190px; margin-left: auto; margin-right: auto; padding-top: 20px; padding-bottom: 20px; text-align: left; }
.chart { float: left; width: 32%; }
/* .clientslider { height: 140px; overflow: hidden; margin-bottom: 100px; margin-left: auto; margin-right: auto; margin-top: 50px; } */
div.clientslider a { float: none; }
div.clientslider img { width: auto; height: auto; }
img.menucircles.slogfirst, img.menucircles.sloglast, .slo { display: inline-block; }
img.menucircles.slogfirst { padding-left: 0px; }
img.menucircles.sloglast { padding-right: 0px; }
#home .clientslider { padding-bottom: 100px; padding-top: 20px; }
/* FOOTER   */
.footerboxinner { width: 270px; margin-left: auto; margin-right: auto; }
.footerleft .footerboxinner, .footerright .footerboxinner { text-align: center; }
.footermiddle .footerboxinner { width: 290px; }
.footerleft h3 { color: #28426c; margin-bottom: 20px; }
.footermiddle h3 { font-size: 28px; margin-bottom: 20px; }
.footerright h3 { color: #219185; margin-bottom: 20px; }
.footerleft label { display: block; font-weight: bold; }
.mc-field-group { margin-top: 20px; }
input { width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; padding: 10px; border: 1px solid #a4a7a9; -webkit-border-radius: 10px; border-radius: 10px; color: #7f8084; font-family: "quicksandregular", sans-serif; }
input[type="email"] { }
input[type="submit"] { padding: 10px 30px; border: 0 none; cursor: pointer; text-transform: uppercase; font-size: 20px; color: #7f8084; color: #FFFFFF; font-family: "quicksandregular", sans-serif; }
.button { background: #4b5b76; }
input[type="text"] { }
.form-item { margin-bottom: 1px; margin-top: 10px; }
.textarea-wrapper textarea { display: block; margin: 0; width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
textarea { font-family: "quicksandregular", sans-serif; padding: 10px; border: 1px solid #a4a7a9; -webkit-border-radius: 10px; border-radius: 10px; width: 100%; box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; color: #7f8084; font-size: 14px; margin-bottom: 20px; }
.form-submit { background: #219185; font-family: "quicksandregular", sans-serif; }
.element-invisible { display: none; }
.footerleft p { margin-top: 10px; }
.bullet { margin-bottom: 7px; letter-spacing: -1px; text-align: center; }
.footermiddle .fa { color: #d3d5d4; font-size: 12px; margin-top: 3px; }
/* ABOUT PAGE   */
.text, .services { text-align: center; width: 820px; margin: auto; }
.services { margin-top: 50px; margin-bottom: 50px; }
.text { line-height: 40px; }
.aboutpage { padding-bottom: 80px; }
.clients h2 { margin-bottom: 20px; margin-top: 50px; }
a.clientlogo { padding-right: 40px; padding-left: 40px; }
.clients { margin-bottom: 80px; }
.abouttitle { font-size: 24px; color: #aeb3ba; text-transform: uppercase; }
.about-hosting-roll { margin-left: 110px; display: inline-block; width: 118px; height: 116px; background: url('/images/aboutpage/about-hosting-roll.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.about-hosting-roll:hover { background-position: 0 0; opacity: 0.5; }
.about-web-roll { display: inline-block; width: 118px; height: 116px; background: url('/images/aboutpage/about-web-roll.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.about-web-roll:hover { background-position: 0 0; opacity: 0.5; }
.about-email-roll { margin-right: 110px; display: inline-block; width: 118px; height: 116px; background: url('/images/aboutpage/about-email-roll.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.about-email-roll:hover { background-position: 0 0; opacity: 0.5; }
.about-design-roll { margin-right: 110px; display: inline-block; width: 118px; height: 116px; background: url('/images/aboutpage/about-design-roll.png') bottom; background-size: 118px; text-indent: -99999px; opacity: 1; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-outt; -webkit-transition: opacity .5s ease-in-out; -o-transition: opacity .5s ease-in-out; }
.about-design-roll:hover { background-position: 0 0; opacity: 0.5; }
.clientalllist { margin-left: auto; margin-right: auto; width: 1000px; text-align: center; }
.aboutclient { margin-left: auto; margin-right: auto; width: 1000px; text-align: center; padding-bottom: 40px; }
.divider3 { padding-top: 300px; padding-bottom: 40px; }
.mapimage img { width: 100%; width: 697px; height: 370px; }
/* DESIGN PAGE   */
.servicesdesign { width: 1000px; margin: auto; }
.designservice { width: calc(100% / 5); float: left; }
.designreveal { padding: 20px; text-align: justify; width: 100%; float: left; }
#design h4 { color: #28426c; margin-bottom: 80px; }
#design .designreveal h2 { font-family: "quicksandregular", sans-serif; margin-top: 0px; color: #d2d6dc; margin-bottom: 10px; font-size: 50px; }
#design .designreveal h3 { font-size: 14px; font-family: "quicksandbold", sans-serif; color: #28426c; }
#design .designreveal h4 { font-size: 20px; margin-bottom: 10px; letter-spacing: 1px; color: #AEB3BA; font-family: "quicksandregular", sans-serif; margin-top: 10px; }
#design .designreveal p { margin-top: 10px; margin-bottom: 30px; }
img.offer { margin-top: 40px; }
ul.designbullets { list-style: inherit; text-align: left; width: 270px; margin: 0 auto; font-size: 17px; padding-left: 0px; }
.offerbrand { width: 600px; margin: auto; text-align: left; }
.offerblock { float: left; width: 300px; margin-bottom: 50px; margin-top: 20px; text-align: left; }
a.design-toggle { cursor: pointer; }
/* WEB PAGE   */
#web h4 { color: #3b3b3b; margin-bottom: 20px; }
#web h4.skinny { font-size: 24px; font-family: "quicksandregular", sans-serif; margin-top: 20px; margin-bottom: 10px; }
img.webim { margin-top: 50px; }
.portfolio-webdesign { margin-bottom: 100px; }
/* EMAIL PAGE   */
#email h4 { color: #219185; margin-bottom: 20px; }
#email h2.thinner { color: #3b3b3b; margin-bottom: 10px; font-size: 24px; }
/* CONTACT PAGE   */
.contacthighlight, a.contacthighlight { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; font-size: 24px; color: #219185; }
a.contacthighlights { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; color: #219185; }
h2.move { margin-top: 70px; }
img.bripic { margin-top: 50px; margin-bottom: 50px; }
/* PORTFOLIO PAGE   */
.portfoliolinks a { font-family: 'quicksandbold', Verdana, Helvetica, sans-serif; font-size: 14px; text-transform: uppercase; color: #a9aeb6; }
.portfoliolinks { margin-bottom: 50px; line-height: 30px; }
.portfoliolinks a:hover { color: #219185; }
#portfolio h2 { margin-top: 40px; margin-bottom: 40px; }
.portfolioitem h2 { color: #aeb3ba; font-family: "quicksandbold", sans-serif; margin-bottom: 40px; font-size: 22px; margin-top: 100px; text-transform: uppercase; }
.contactsec h2 { color: #aeb3ba; font-family: "quicksandbold", sans-serif; margin-bottom: -20px; font-size: 22px; margin-top: 100px; text-transform: uppercase; }
.contactsec h2.thinner { margin-bottom: 10px; }
#webterms .text, #orqaterms .text { text-align: justify; }
a.button2 { background: #28426c; color: #fff; border-radius: 10px; padding: 10px; display: inline-block; margin-top: 20px; text-transform: uppercase; letter-spacing: 2px; font-size: 14px; }
.portfoliodescription { margin-top: 30px; font-size: 18px; }
.portfolioitems { width: 1280px; margin: auto; margin-top: 50px; }
.portfolioimage img { width: 100%!important; max-width: 100%!important; height: auto!important; max-height: auto!important; }
.portfolioitems h3 { font-size: 18px; margin-top: 20px; color: #7f8084; text-transform: uppercase; }
.portfolioitems h2 { margin-bottom: 20px; }
.cycle-pager span { font-size: 70px; color: #c9ced5; }
.cycle-pager span.cycle-pager-active { color: #28426c; }
.cycle-pager { margin-top: 20px; margin-bottom: 50px; }
.cycle-pager span:hover { cursor: pointer; }
.slick-slider { width: 1280px; margin: auto; }
#navigation.fixed { position: fixed; top: 0; float: left; width: 100%; background-color: #f4f6f7; margin-left: -100px; padding-top: 10px; padding-bottom: 10px; -webkit-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31); -moz-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31); box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31); z-index: 200; }
.design-off { display: none; }
.design-on { display: block; visibility: visible; opacity: 1; animation: fade 1s; }
 
.article-news h2 {
font-size: 38px;
  color: #8f9394;
  text-align: center;
  line-height: 40px;
  text-transform: initial; margin-top: 0px;}

  .article-news h3 {

  font-size: 26px; line-height: 26px;
  padding-top: 30px;
}

.article-news ul {
  margin: 1.75rem 0;
  padding-left: 1.4rem; list-style: disc; margin-top: 10px;
}

.article-news li {
  margin-bottom: 0.1rem;
  line-height: 1.65;
}

.article-news li:last-child {
  margin-bottom: 0;
}


#blog-article h1 {
  
  font-size: 22px; text-align: center;
 
  margin-bottom: 0px;
  margin-top: 80px;
}

.article-news {text-align: justify;
  width: 50%;
  margin: auto;}


 @keyframes fade { 0% {
 opacity: 0;
}
 100% {
 opacity: 1;
}
}
#chart1_text, #chart2_text, #chart3_text { font-weight: normal!important; }
.portfolioitems { padding-bottom: 20px; }

.newportitle {margin-bottom: 50px;
	font-size: 100px;
font-weight: 600;
letter-spacing: -3px;
line-height: 102px;
color: transparent;
-webkit-background-clip: text;
background-clip: text;
background-image: -webkit-linear-gradient(left, #8ed9ce, #28426c);
background-image: -moz-linear-gradient(left, #8ed9ce, #28426c);
background-image: -ms-linear-gradient(left, #8ed9ce, #28426c);
background-image: -o-linear-gradient(left, #8ed9ce, #28426c);
background-image: linear-gradient(to right, #219185, #0e3e8b);}

.article-news blockquote {
  margin: 2.5rem 0;
  padding: 2rem;
  background: #fafafa;
  border-left: 3px solid #999;
  font-style: italic;
  position: relative;
}

.article-news blockquote::before {
  content: "“";
  position: absolute;
  top: -10px;
  left: 10px;
  font-size: 3rem;
  color: #ccc;
  font-family: serif;
}

.article-news blockquote p {
  margin: 0;
  font-size: 1.1rem;
  color: #333;
}


#job h2 {
  font-size: 50px;
  color: #d2d6dc;
  margin-top: 50px;
  font-family: "quicksandlight", sans-serif;
  text-transform: initial;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  line-height: 60px;
  margin-top: 100px;
}

#job .text {
  line-height: 30px;
  text-align: justify; width: 920px;
}


#job h4 {
  text-align: left; width: 920px;
margin-left: auto; margin-right: auto;
}


#job .text ul {
  list-style: circle; margin-left: 30px; text-align: left;
}

#job .text ul li {padding-left: 10px; text-align: left;}

#testimonials h5 {margin-top: 0px;
  line-height: 20px;
  padding-top: 10px;}

i {font-style: italic;}

#terms-and-conditions-orqadesign .text, #terms .text{text-align: justify;}
#terms-and-conditions-orqadesign .text ol, #terms  .text ol{
  list-style: number;
} 
#terms-and-conditions-orqadesign .text ul, #terms .text ul{
  list-style: disc;
} 

#terms-and-conditions-orqadesign .text ul li, #terms .text ul li {padding-left: 20px;  margin-bottom: 10px;
  margin-left: 20px;}
  #terms-and-conditions-orqadesign .text ol li, #terms .text ol li {padding-left: 20px;
  margin-left: 20px; margin-bottom: 10px;}

.highlight {text-transform: uppercase;
  color: #a4a9b1;
  font-size: 14px;
  letter-spacing: 3px; padding-top: 30px;}
}



/* ------------------------- MEDIA QUERIES ------------------------------------ */
 @media only screen and (max-width:1880px) {
.portfoliobutton {width: 100%;}
}

/* ------------------------- MEDIA QUERIES ------------------------------------ */
 @media only screen and (max-width:1480px) {
#portfolio footer { margin-top: 100px; }
.portfolioitems { width: 100%; }
.slick-slider { width: 100%; margin: auto; }
div.clientslider img { width: 80%; }
.portfoliobutton {width: 100%;}
}
 @media only screen and (max-width:1300px) {
.c1 { margin-left: 50px; margin-top: 64px; }
.c2 { margin-left: 0px; margin-top: 56px; }
.c3 { margin-left: -22px; }
.c4 { margin-left: 0px; margin-top: 60px; }
.c5 { margin-left: 10px; margin-top: 180px; margin-bottom: -20px; }
.c6 { margin-left: 80px; margin-top: -8px; }
.c7 { margin-left: 70px; margin-top: 120px; }
.c8 { margin-left: -100px; margin-top: -86px; }
.c9 { margin-left: -46px; margin-top: 10px; }
.c10 { margin-left: -80px; margin-top: -75px; }
.c11 { margin-left: -150px; margin-top: -10px; }
#job h2 {width: 100%;}

.article-news { width: 70%;}
}
 @media only screen and (max-width:1200px) {
.servicesdesign { width: 800px; }
.designservice { width: calc(100% / 4); }
}
 @media only screen and (max-width:1180px) {
#chart1 { width: 290px; }
#chart2 { width: 240px; }
#chart3 { width: 280px; }
.portfoliodescription { height: 50px; }


#job h4, #job .text  {
width: 100%;
}

}
 @media only screen and (max-width:1040px) {
.slo { width: 450px; }
}
/* @media only screen and (max-width:1024px) {
#navigation {
position: fixed;
top: 0;
float: left;
width: 100%;
background-color: #f4f6f7;
margin-left: -100px;
padding-top: 10px;
padding-bottom: 10px;
-webkit-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31);
-moz-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31);
box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31); z-index:200; }

#navigation.fixed {
position: fixed;
top: 0;
float: left;
width: 100%;
background-color: #f4f6f7;
margin-left: -100px;
padding-top: 10px;
padding-bottom: 10px;
-webkit-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31);
-moz-box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31);
box-shadow: 0px 6px 15px -4px rgba(0,0,0,0.31); z-index:200; }
.logo {margin-top: 80px;}
#home #container {margin-top: -80px;}
 }
 */
 @media only screen and (max-width:1023px) {
.c11, .c10, .c8, .c7, .c1 { display: none; }
.c2 { margin: 0px; margin-top: 40px; }
.c3 { margin: 0px; margin-left: 20px; }
.c4 { margin: 0px; margin-left: 20px; }
.c5 { margin: 0px; margin-top: 200px; margin-left: -40px; margin-bottom: -20px; }
.c6 { margin: 0px; margin-left: 40px; margin-top: -30px; }
.c9 { margin: 0px; margin-left: 150px; margin-top: -50px; }
.circlewrapperbig, .circlewrapper, .circlewrapper2 { width: auto; margin-left: 0px; padding: 0px; text-align: center; }
.hide { display: none; }
.circles { width: 710px; margin: auto; }
.slick-slider { width: 550px; }
div.clientslider img { width: auto; }
}
 @media only screen and (max-width:980px) {
.wrapper { padding-left: 20px; padding-right: 20px; }
.form-submit { width: 270px; }
.text, .services { width: 620px; }
.about-design-roll { margin-right: 40px; }
.about-email-roll { margin-right: 40px; }
.about-hosting-roll { margin-left: 40px; }
#navigation.fixed, #navigation { margin-left: -20px; padding-bottom: 3px; }
}
 @media only screen and (max-width:840px) {
.servicesdesign { width: 600px; }
.designservice { width: calc(100% / 3); }
.chart { float: none; width: 100%; }
}
 @media only screen and (max-width:790px) {
.menu li { padding-left: 5px; padding-right: 5px; }
img.menucircles.first { float: left; display: block; }
img.menucircles.last { float: right; display: block; }
img.mapimage { width: 100%; height: auto; }
.portfolio .slideshow { height: 700px; }
.article-news { width: 100%;}
}
 @media only screen and (max-width:740px) {
.circles { width: 510px; }
.c5 { margin: 0px; margin-top: -50px; margin-left: 160px; }
.c4 { margin: 0px; margin-top: -40px; }
.c9 { margin: 0px; margin-left: 20px; margin-top: -80px; }
.c6 { margin: 0px; margin-left: 80px; margin-top: 30px; }
.quotes { width: 100%; }
.slideshow, .quote { width: auto!important; }
}
 @media only screen and (max-width:690px) {
.text, .services { width: auto; }
.about-design-roll, .about-email-roll, .about-hosting-roll { margin-left: 0px; margin-right: 0px; }
.portfolioitems .slideshow { height: 500px; }
section { width: 100%!important; height: auto!important; background-size: 100%!important; background-position: inherit!important; margin-top: 100px!important; }
}
 @media only screen and (max-width:640px) {
.menucircles { padding-left: 0; padding-right: 0; }
.form-submit { width: auto; }
.slo { width: auto; }
.servicesdesign { width: 400px; }
.designservice { width: calc(100% / 2); }
.offerblock { float: none; margin-left: auto; margin-right: auto; }
.offerbrand { width: auto; }
.slick-slider { width: 340px; }
.footerleft, .footermiddle, .footerright { width: 100%; }
.footerleft { padding-bottom: 40px; }
.prefooter { width: 100%; }
h2 { line-height: 80px; }

 #awards h2 {
    line-height: inherit;
  }
img.editorial {width: 100%!Important;}
}
 @media only screen and (max-width:590px) {
.logo, .logo img { width: 100%; height: auto; }
.portfolioitems .slideshow { height: 300px; }
.portfoliodescription { height: 80px; }
.newportitle {margin-bottom: 20px;
	font-size: 50px;}

.testimonial-item a {width: 100% !important;
  float: left;
}

.blank, :empty, :blank {
    display:none!important;
}

}
 @media only screen and (max-width:525px) {
#menu-icon { display: inline-block; margin-top: -13px; margin-left: 20px; }
.fixed #menu-icon { margin-left: 0px; }
#primary { display: none; }
#navigation:hover ul { display: block; }
ul#primary:focus { display: block; }
#navigation ul#primary li { list-style-type: none; display: inherit; float: none; margin-right: 0px; padding-left: 0px; padding-right: 0px; margin-right: -10px; width: 100px; text-align: left; margin: auto; }
ul#primary { z-index: 201; background: none repeat scroll 0 0 #219185; border: 0px; display: none; float: none; margin-top: 0px; padding-bottom: 10px; padding-top: 10px; position: absolute; right: 0; text-align: left; width: 100%; margin-top: 3px; text-align: center; cursor: pointer; }
img.menucircles.first, img.menucircles.last { display: none; }
ul li a { color: #ffffff; padding-left: 20px; padding-top: 0px; padding-bottom: 0px; font-size: 24px; }
.menu li a { color: #fff!important;  padding-left: 0px; line-height: 40px; font-size: 20px; }
.circlewrapperbig, .circlewrapper, .circlewrapper2 { float: none; }
.circles { text-align: center; }
.c2, .c3, .c4, .c5, .c6, .c9 { margin: 0px; display: inline-block; }
.circles { width: auto; }
.companyname, .clientname { margin-left: 0px; margin-right: 0px; float: none; }
.slideshow { height: 250px; }
.companyname { color: #7e7f83; margin-top: 0px; font-size: 16px; }
#navigation ul#primary li ::before { content: ""; font-family: 'FontAwesome'; font-size: 12px; margin-right: 20px; }
.services { width: 250px; }
a.clientlogo { padding-right: 10px; padding-left: 10px; }
.designservice img { width: 150px!important; height: auto!important; }
.servicesdesign { width: auto; }
#email img.offer { width: 100%!Important; height: auto!important; }
.menu li a:hover { color: #fff; }
#navigation.fixed { padding-bottom: 3px; }
.quote { min-height: 300px; }
.designreveal { width: auto; }
#design .designreveal h2 { text-align: left; line-height: 27px; padding-top: 20px; padding-bottom: 10px; }
.portfolioitems h3 { height: 50px; }

#primary br {display: none!Important;}

}
 @media only screen and (max-width:479px) {
.slick-slider { width: 150px; }
}
 @media only screen and (max-width:400px) {
.slideshow { height: 300px; }
.copyrightcontact { width: 280px; text-align: left; margin-left: auto; margin-right: auto; margin-bottom: 40px; line-height: 36px; font-size: 20px; }
.copyright { text-align: justify; }
a.clientlogo { padding-right: 0px; padding-left: 0px; }
.designservice img { width: 135px !important; height: auto!important; }
img.offer { width: 100%!Important; height: auto!important; }
a.clientlogo img { width: 100px; height: auto; }
.portfolioitems .slideshow { height: auto; }
#portfolio footer { margin-top: 20px; }
#portfolio .cycle-pager span { font-size: 70px; color: #c9ced5; display: block; float: left; height: 40px; }
.slick-slider { width: 100px; }
footer { margin-top: 50px; }
.text, .services { text-align: justify; font-size: 18px; line-height: 36px; }
.portfoliodescription { height: 120px; }
#web .text img, #email .text img { margin: auto; display: block; margin-bottom: 20px; }
#contact .text { text-align: center; }
h2 { line-height: 60px; font-size: 60px; }

#testimonials .text  {
    text-align: center;
}
#testimonials h2 {font-size: 46px;}
}
 @media only screen and (max-width:350px) {
.portfolioitems h3 { height: 80px; }
#job h2 {
  font-size: 34px; line-height: 40px;}
}
