/* Theme Name: MacCallum Ross Theme URI: http://wordpress.org/ Author: MacCallum Ross Version: 1.0 */ * { margin: 0; padding: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; } audio:not([controls]) { display: none; } [hidden] { display: none; } html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; overflow-y: scroll; } html.has-modal { } html.has-modal body { } html.has-modal #layout { } html.has-modal #wrapper { } html, button, input, select, textarea { font-family: sans-serif; color: #000; } body { font: 62.5%/1.5 "Source Sans Pro", Arial, serif; background: #fff; color: #354653; font-weight: 300; min-width: 320px; } h1, h2, h3, h4, h5 { font-weight: normal; } ::-moz-selection { background: #333; color: #fff; text-shadow: none; } ::selection { background: #333; color: #fff; text-shadow: none; } a { color: #1e79c6; text-decoration: none; } a:hover, a:active, a:focus { } p, li, dd, dt, label, legend, td, th, caption, blockquote { font-size: 16px; line-height: 22px; } fieldset { border: 0; } legend { white-space: normal; } label { cursor: pointer; } img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; } .wp-image-logo { width:100% !important; height:auto !important; } svg:not(:root) { overflow: hidden; } /* Forms */ select, input, textarea { outline: 0; font: 16px/22px Arial, sans-serif; margin: 0; } form { margin: 0; } fieldset { border: 0; margin: 0; padding: 0; } a img { border: 0; } label { cursor: pointer; } legend { border: 0; padding: 0; white-space: normal; } button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; } button, input { line-height: normal; } button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; } button[disabled], input[disabled] { cursor: default; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } textarea { overflow: auto; vertical-align: top; resize: vertical; } table { text-align: left; border-collapse: collapse; border-spacing: 0; } td, th { vertical-align: top; text-align: left; } /* =LAYOUT -------------------------------------------------------------- */ #wrapper { width: 100%; overflow: hidden; position: relative; } #layout { position: relative; padding-top: 273px; z-index: 2; } .grid { width: 960px; margin: 0 auto; } header { position: absolute; top: 0; left: 0; width: 100%; z-index: 100; background: url(../images/css/header-bkg.png) no-repeat 50% 100%; } header .grid { position: relative; height: 273px; } header.fixed { position: fixed; } #content { padding: 0; position: relative; z-index: 2; } /* =HEADER -------------------------------------------------------------- */ #logo { position: absolute; top: 56px; left: 356px; background: url(../images/css/MacCallumRoss-logo.svg) no-repeat 0 0; } #logo a { display: block; } #logo, #logo a { width: 247px; height: 103px; overflow: hidden; } #logo a, body.home #logo { text-indent: -9999px; outline: 0; } /* NAVIGATION */ #navigation-container { position: absolute; bottom: 0; left: 0px; width: 100%; } #menu-header ul { list-style: none; padding: 13px 0 8px; text-align: center; } #menu-header li { display: inline-block; font: 13px/18px "Open Sans", Arial, sans-serif; margin: 0 17px; text-transform: uppercase; letter-spacing: 1px; } #menu-header li a { display: inline-block; color: #fff; padding: 10px 0; background: 0; } #menu-header li a:hover, #menu-header li.current a { color: #666; } header.fixed #logo, header.fixed #logo a { width: 207px; height: 27px; } header.fixed #logo { top: 13px; left: 0px; background: url(../images/css/MacCallumRoss-logo-h.svg) no-repeat 0 0; } header.fixed .grid { height: 59px; } header.fixed #navigation-container { left: auto; right: 0; width: 600px; overflow: hidden; } header.fixed #nav-contact { margin-right: 0; } #toggle-menu { display: none; } /* =ARTICLE STYLE */ .default-txt h2 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; color: #333; } .default-txt h3 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; color: #333; } .default-txt h4 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; color: #333; } .default-txt h5 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; color: #333; } .default-txt p, .default-txt ul, .default-txt dl, .default-txt ol { margin-bottom: 22px; } .default-txt p, .default-txt li, .default-txt dt, .default-txt dd { } .default-txt a { text-decoration: none; } .default-txt a:hover { text-decoration: underline; } .default-txt dt { font-weight: bold; } .default-txt ul { list-style: none; } .default-txt ul li { padding: 0 0 1px 10px; background: url(../images/css/li-dot.png) no-repeat 0 11px; } .default-txt ol { margin-left: 30px; list-style: decimal; } .default-txt ol li { margin-bottom: 5px; } .default-txt li ol { margin-top: 1em; margin-left: 15px; } .default-txt ul ol li { background: 0; padding-left: 0; } .default-txt table { margin: 0 auto 18px; border-collapse: separate; width: 100%; } .default-txt table thead th { border-bottom: 1px solid #c9c9c9; } .default-txt table th, .default-txt table td { padding: 5px 10px; } .default-txt table caption { padding: 0 10px 10px; font-weight: normal; text-align: center; font-weight: bold; } .default-txt thead th { font-weight: bold; } .default-txt tbody th, .default-txt tbody td { font-weight: normal; border-bottom: 1px solid #c9c9c9; } .default-txt tbody th { } .default-txt tbody th a { } .default-txt blockquote { padding: 8px 20px 1px 35px; min-height: 50px; height: auto !important; height: 50px; background: url(../images/css/quote.png) no-repeat 0 0; } .default-txt blockquote, .default-txt blockquote p { font-size: 16px; line-height: 30px; font-style: italic; } .default-txt strong { font-weight: bold; } .default-txt cite, .default-txt em, .default-txt i { font-style: italic; } .default-txt big { font-size: 131.25%; } .default-txt ins { background: #ffc; text-decoration: none; } .default-txt blockquote cite, .default-txt blockquote em, .default-txt blockquote i { font-style: normal; } .default-txt pre { background: #f7f7f7; color: #222; line-height: 18px; margin-bottom: 18px; padding: 1.5em; } .default-txt abbr, .default-txt acronym { border-bottom: 1px dotted #666; cursor: help; } .default-txt sup, .default-txt sub { height: 0; line-height: 1; position: relative; vertical-align: baseline; } .default-txt sup { bottom: 1ex; } .default-txt sub { top: .5ex; } .default-txt .gallery { padding: 0 0 18px; } .default-txt .gallery .gallery-item { float: left; margin-top: 0; text-align: center; width: 33%; } .default-txt .gallery img { margin: 0; border: 0 !important; } .default-txt .gallery .gallery-caption { color: #888; font-size: 12px; margin: 0 0 12px; } .default-txt .gallery dl { margin: 0; } .default-txt .gallery img { border: 1px solid #f1f1f1; } .default-txt .gallery br+br { display: none; } /* 17/25 */ .txt-17-25 p, .txt-17-25 li, .txt-17-25 dd, .txt-17-25 dt, .txt-17-25 td, .txt-17-25 th, .txt-17-25 caption { font-size: 17px; line-height: 25px; } .txt-17-25 p, .txt-17-25 ul, .txt-17-25 ol, .txt-17-25 table, .txt-17-25 dl { margin-bottom: 25px; } .txt-17-25 ul li { background-position: 0 13px; } .txt-17-25 blockquote, .txt-17-25 blockquote p { font-size: 17px; line-height: 25px; font-style: italic; } /* INTRO BKG */ #intro, #who-we-are { position: relative; z-index: 2; background: url(../images/css/blue-background.png) no-repeat 50% 100%; padding: 60px 0 93px; /*margin: 0 0 394px;*/ } #who-we-are {padding-top:0;} #intro .default-txt, #who-we-are .default-text { width: 630px; overflow: hidden; margin: 0 auto; text-align: center; } #intro .default-txt h2 { font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 22px 0 35px; margin: 0 0 45px; background: url(../images/css/heading-lines.png) no-repeat 50% 0; } #intro #down-arrow{ position: absolute; bottom: -36px; left: 50%; margin-left: -22px; } #who-we-are h2 { position:relative; top:-86px;font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 25px 0 26px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } .columns{display:flex;flex-direction:row;gap:5%;} .columns .col{flex:1;background:#fff;} .team-thumb img{display:inline-block;max-width:100% !important;margin:0 !important;} .team-text{font-size:17px;color:#354653;padding:30px;} #who-we-are .default-txt{ margin-top:-20px; padding-bottom:20px; } @media only screen and (max-width: 768px) { .columns{flex-direction:column;} #who-we-are-inner{ background:#e1f9fb; padding-top:40px; } } /* =IMAGES -------------------------------------------------------------- */ .default-txt img { max-width: 630px; height: auto; } .default-txt .attachment img { max-width: 630px; height: auto; } .default-txt .alignleft, .default-txt img.alignleft { clear: left; float: left; display: inline; margin: 0 15px 0 0; } .default-txt .alignright, .default-txt img.alignright { float: right; display: inline; margin: 10px 0 0 20px; } .default-txt .aligncenter, .default-txt img.aligncenter { clear: both; display: block; margin: 0 auto 20px; } .default-txt img.alignnone, .default-txt img.alignleft, .default-txt img.alignright, .default-txt img.aligncenter { margin-bottom: 5px; margin-top: 5px; background: #fff; } .default-txt img.alignleft, .default-txt img.alignright { } .default-txt .wp-caption { background: #f7fbe7; line-height: 18px; margin-bottom: 10px; padding: 10px 4px 4px; } .default-txt .wp-caption img { margin: 0 auto; display: block; } .default-txt .wp-caption p.wp-caption-text { color: #354653; font-size: 12px; line-height: 14px; margin: 8px 5px 5px !important; } .default-txt hr { background-color: #e7e7e7; border: 0; clear: both; height: 1px; margin-bottom: 18px; } body.home .alignright { padding: 20px 0 0; } /* =ARTICLE CONTAINER -------------------------------------------------------------- */ .layout-attachment #article-container { padding: 40px; } #back-to-article { padding: 0; } #article-container .date { color: #333; font-size: 12px; } #back-to-article { } #article-container .default-txt { } /* =ARTICLE ATTACHMENT -------------------------------------------------------------- */ .attachment-meta { font-size: 15px; line-height: 18px; padding: 5px 0 0; } .attachment-container {} .attachment-container .attachment {} .attachment-document {} .attachment-caption { } .attachment-caption p { margin: 0; } .attachment-description { font-style: italic; } .layout-attachment .attachment-img { max-width: 100%; } .attachment-file { font-weight: bold; font-size: 15px; line-height: 18px; padding-bottom: 10px; } /* FANCYBOX */ #fancybox-left span { left: 20px; } #fancybox-right span { left: auto; right: 20px; } /* CAPABILITIES */ #mask-2 #down-arrow { position: absolute; top:36px; left: 50%; margin-left: -22px; } #capabilities { position: relative; z-index: 3; margin: 0; } #capabilities h2 { font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 25px 0 26px; margin: 0; text-align: center; background: url(../images/css/blue-background.png) no-repeat 50% 0; } #capabilities-inner { background: url(../images/css/intro-bkg.png) no-repeat 50% 100%; padding: 0 0 100px; } #capabilities-description { padding: 40px 0 13px; width: 724px; overflow: hidden; margin: 0 auto; text-align: center; } #capabilities-list { position: relative; } #capabilities-nav {max-width:750px; margin:0 auto; padding: 45px 0 23px; list-style: none; background: url(../images/css/capabilities-nav.png) no-repeat 50% 0; position: relative; z-index: 2;text-align: center; } #capabilities-nav li { /*float: left;*/ font: italic 18px/24px "Open Sans", Arial, sans-serif; margin: 0; display:inline-block; } #capabilities-nav li:first-child { } #capabilities-nav li a { /*float: left;*/ display:inline-block; color: #1e79c6;/*padding: 0 0 26px;*/ } #capabilities-nav li a:hover, #capabilities-nav li.current a { color: #333; /*background: url(../images/css/capabilities-nav-selected.png) no-repeat 50% 100%;*/ } #capabilities-arrow { position: absolute; top: 80px; left: 110px; } #capabilities-slides { width: 960px; height: 203px; margin: 0 auto; position: relative; background: #fff; } #capabilities-slides-outer { height: 203px; width: 960px; background: #fff; } #capabilities-slides-inner { width: 690px; height: 203px; position: absolute; top: 0; left: 135px; overflow: hidden; } #capabilities-slides .slide { position: absolute; top: -9999px; left: -9999px; width: 690px; } #capabilities-slides .active-slide { top: 0; left: 0; } #capabilities-slides .default-content { } #capabilities-slides .default-txt { width: 690px; overflow: hidden; margin: 0 auto; padding: 40px 0 30px; position: relative; } #capabilities-slides .additional-content { width: 690px; } #capabilities-slides .additional-content-inner { position: absolute; top: -9999px; left: -9999px; width: 690px; } #capabilities-slides.loaded .additional-content-inner { position: static; display: none; top: 0; left: 0; } #capabilities-slides.expanded { } #capabilities-slides.expanded .additional-content { left: -135px; position: absolute; width: 690px; padding: 0 135px 35px; background: #fff; } #capabilities-slides.expanded .additional-content-inner { padding-bottom: 10px; display: block; } #capabilities-slides .read-more { width: 110px; margin: 0 auto; font: italic 18px/24px "Open Sans", Arial, sans-serif; } #capabilities-slides .read-more a { color: #1e79c6; display: block; background: url(../images/css/read-more-arrow.png) no-repeat 100% 7px; text-decoration: none; } #capabilities-slides .read-more a:hover { color: #333333; background-position: 100% -93px; } #capabilities-slides.expanded .read-more { width: 98px; } #capabilities-slides.expanded .read-more a { } /*#capabilities-slides.expanded #capabilities-slides-inner { overflow: visible; }*/ #capabilities-slides.expanded .default-txt { overflow: visible; } #capabilities-prev-next { position: absolute; top: 0; left: 0; width: 960px; list-style: none; } #capabilities-prev-next li { top: 90px; position: absolute; } #capabilities-prev-next li a { overflow: hidden; text-indent: -9999px; } #capabilities-prev-next li, #capabilities-prev-next a { width: 27px; height: 29px; display: block; overflow: hidden; } #capabilities-prev-next .prev { left: 65px; } #capabilities-prev-next .next { right: 65px; } #capabilities-prev-next .prev a { background: url(../images/css/arrow-prev.png) no-repeat 0 0; } #capabilities-prev-next .next a { background: url(../images/css/arrow-next.png) no-repeat 0 0; } #capabilities-prev-next li a:hover { background-position: 0 -50px !important; } #capabilities-mobile { display: none; } /* CASE STUDIES */ #case-studies { position: relative; z-index: 2; margin: 0; } #case-studies h2 { font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 25px 0 26px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #case-studies-inner { background: url(../images/css/blue-background.png) no-repeat 50% 100%; padding: 50px 0 105px; } #case-studies-nav { list-style: none; background: #e4f9fa; } #case-studies-nav li { float: left; height: 46px; padding: 0 0 0 1px; background: url(../images/css/services-tab-left.png) no-repeat 0 0; font: italic 18px/20px "Open Sans", Arial, sans-serif; color: #1e79c6; } #case-studies-nav li a { float: left; height: 31px; padding: 15px 33px 0 20px; background: url(../images/css/services-tab-right.png) no-repeat 100% 0; } #case-studies-nav li:first-child a { padding-left: 23px; } #case-studies-nav li.current { background: url(../images/css/services-tab-active.png) no-repeat 100% 0; } #case-studies-nav li.current a { background: 0; color: #333; } #case-studies-tabs { background: #fff; padding: 0; margin: 0 0 10px; } #case-studies-tabs .tab { position: absolute; top: -9999px; left: -9999px; width: 960px; } #case-studies-tabs .active-tab { position: static; } #case-studies-tabs .tab ul { list-style: none; padding: 37px 22px 35px; } #case-studies-tabs .tab li { width: 175px; height: 135px; float: left; background: #fff; margin: 0 0 10px 10px; position: relative; overflow: hidden; } #case-studies-tabs .tab li.cat-1 { background: #e4f9fa; } #case-studies-tabs .tab li.cat-2 { background: #f5fae1; } #case-studies-tabs .tab li.cat-3 { background: #fbead5; } #case-studies-tabs .tab li.cat-4 { background: #dcebf8; } #case-studies-tabs .tab .first-in-row { margin-left: 0; } #case-studies-tabs .tab h3 { font: italic 14px/20px "Open Sans", Arial, sans-serif; padding: 0 23px; position: relative; z-index: 1; } #case-studies-tabs .tab h3 a { color: #1e79c6; display: block; background: url(../images/css/service-arrow.png) no-repeat 50% 100%; text-align: center; padding: 0 0 31px; } #case-studies-tabs .tab h3 .arrow { display: none; } #case-studies-tabs .tab p { cursor: pointer; color: #fff; width: 175px; height: 135px; overflow: hidden; z-index: 2; position: absolute; top: -9999px; left: -9999px; font: italic 14px/20px "Open Sans", Arial, sans-serif; background: #4e5c68; } #case-studies-tabs .tab span { padding: 0 22px; display: block; text-align: center; } #case-studies-tabs .tab li.hover p { top: 0; left: 0; } /* CLIENTS */ #clients { position: relative; z-index: 3; margin: 0; } #clients h2 { font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 25px 0 26px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #clients-inner { background: url(../images/css/blue-background.png) no-repeat 50% 100%; padding: 0 0 100px; } #clients-description { padding: 40px 0 13px; width: 724px; overflow: hidden; margin: 0 auto; text-align: center; } #clients-list { position: relative; } #clients-nav { padding: 45px 0 0; list-style: none; background: url(../images/css/capabilities-nav.png) no-repeat 50% 0; position: relative; z-index: 2; } #clients-nav li { float: left; font: italic 18px/24px "Open Sans", Arial, sans-serif; margin: 0 0 0 50px; } #clients-nav li:first-child { } #clients-nav li a { float: left; color: #1e79c6; padding: 0 0 26px; } #clients-nav li a:hover, #clients-nav li.current a { color: #333; /*background: url(../images/css/capabilities-nav-selected.png) no-repeat 50% 100%;*/ } #clients-arrow { position: absolute; top: 80px; left: 110px; } #clients-slides { width: 960px; height: 203px; margin: 0 auto; position: relative; background: #fff; } #clients-slides-outer { height: 203px; width: 960px; background: #fff; } #clients-slides-inner { width: 690px; height: 203px; position: absolute; top: 0; left: 135px; overflow: hidden; } #clients-slides .slide { position: absolute; top: -9999px; left: -9999px; width: 690px; } #clients-slides .active-slide { top: 0; left: 0; } #clients-slides .default-content { } #clients-slides .default-txt { width: 690px; overflow: hidden; margin: 0 auto; padding: 40px 0 30px; position: relative; } #clients-slides .additional-content { width: 690px; } #clients-slides .additional-content-inner { position: absolute; top: -9999px; left: -9999px; width: 690px; } #clients-slides.loaded .additional-content-inner { position: static; display: none; top: 0; left: 0; } #clients-slides.expanded { } #clients-slides.expanded .additional-content { left: -135px; position: absolute; width: 690px; padding: 0 135px 35px; background: #fff; } #clients-slides.expanded .additional-content-inner { padding-bottom: 10px; display: block; } #clients-slides .read-more { width: 110px; margin: 0 auto; font: italic 18px/24px "Open Sans", Arial, sans-serif; } #clients-slides .read-more a { color: #1e79c6; display: block; background: url(../images/css/read-more-arrow.png) no-repeat 100% 7px; text-decoration: none; } #clients-slides .read-more a:hover { color: #333333; background-position: 100% -93px; } #clients-slides.expanded .read-more { width: 98px; } #clients-slides.expanded .read-more a { } /*#clients-slides.expanded #clients-slides-inner { overflow: visible; }*/ #clients-slides.expanded .default-txt { overflow: visible; } #clients-prev-next { position: absolute; top: 0; left: 0; width: 960px; list-style: none; } #clients-prev-next li { top: 90px; position: absolute; } #clients-prev-next li a { overflow: hidden; text-indent: -9999px; } #clients-prev-next li, #clients-prev-next a { width: 27px; height: 29px; display: block; overflow: hidden; } #clients-prev-next .prev { left: 65px; } #clients-prev-next .next { right: 65px; } #clients-prev-next .prev a { background: url(../images/css/arrow-prev.png) no-repeat 0 0; } #clients-prev-next .next a { background: url(../images/css/arrow-next.png) no-repeat 0 0; } #clients-prev-next li a:hover { background-position: 0 -50px !important; } #clients-mobile { display: none; } /* OVERLAY */ .overlay-container { position: absolute; top: 0; left: 0; z-index: 99999; width: 100%; background: url(../images/css/overlay-bkg.png); display: none; } .overlay-container-inner { width: 960px; margin: 0 auto; position: relative; } .overlay-close, .overlay-close a { display: block; width: 41px; height: 41px; overflow: hidden; } .overlay-close { position: absolute; text-transform: uppercase; top: -14px; right: -20px; z-index: 2; } .overlay-close a { display: block; overflow: hidden; text-indent: -9999px; background: url(../images/css/overlay-close.png) no-repeat 0 0; } .overlay-close a:hover { background-position: 0 -50px; } .overlay-content { background: #fff; box-shadow: 0 0 15px rgba(0,0,0,0.5); } .overlay-content-inner { min-height: 685px; height: auto !important; height: 685px; position: relative; padding: 0 0 37px; z-index: 1; } /*.browser-ie8 .overlay-content-inner { min-height: 645px; height: auto !important; height: 645px; }*/ .single-case-study .overlay-content-inner { padding-bottom: 0; } .loading .overlay-content-inner { background: url(../images/css/ajax-loader.gif) no-repeat 50% 50%; } .overlay-content .inner {} .overlay-content-article { padding: 0 0 7px; } #modal-article {} #modal-article h1 { background: #f5fae1; font: italic 30px/35px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 25px 0 27px; text-align: center; } #modal-article h1 span { display: block; width: 800px; margin: 0 auto; } #modal-article .default-txt { width: 800px; height: 520px; margin: 35px auto; } .single-case-study #modal-article .default-txt { padding-bottom: 10px; } #modal-controls { width: 195px; position: absolute; bottom: 35px; left: 50%; margin-left: -100px; list-style: none; } #modal-controls li { font: italic 18px/24px "Open Sans", Arial, sans-serif; } #modal-controls li a { color: #1e79c6; display: block; } #modal-controls .prev { float: left; } #modal-controls .next { float: right; } #modal-controls .prev a { padding-left: 29px; background: url(../images/css/modal-arrow-prev.png) no-repeat 0 7px; } #modal-controls .next a { padding-right: 25px; background: url(../images/css/modal-arrow-next.png) no-repeat 100% 7px; } #modal-controls .prev a:hover { color: #333; background-position: 0 -43px; } #modal-controls .next a:hover { color: #333; background-position: 100% -43px; } /* FOOTER */ footer { height: 278px; background: url(../images/css/footer-bkg.png) no-repeat 50% 100%; margin-top: -217px; position: relative; z-index: 3; } #footer-content { padding: 142px 0 0; background: url(../images/css/MacCallumRoss-logo.svg) no-repeat 50% 35px; position: relative; height: 136px; background-size:auto 90px; } #footer-content p { font-family: "Open Sans", Arial, sans-serif; color: #fff; letter-spacing: 1px; } #footer-content p a { color: #fff; } #footer-content p a:hover { color: #1e79c6; } #footer-content #email, #footer-content #contact-info { font-size: 13px; line-height: 24px; text-align: center; } #footer-content #copyright { position: absolute; bottom: 22px; left: -110px; font-size: 11px; line-height: 14px; color: #666; padding: 0; } #footer-content #development { position: absolute; bottom: 22px; right: -110px; font-size: 11px; line-height: 14px; color: #666; padding: 0; } #footer-content #development a { color: #666; } #footer-content #development a:hover { color: #1e79c6; } #site-content .post { position: absolute; top: -9999px; left: -9999px; } .photo-mask { clear: both; width: 100%; margin: 0; background-attachment: fixed; background-clip: border-box; background-origin: padding-box; background-position: 50% 0; background-repeat: no-repeat; /*background-size: 1906px auto;*/ /*background-size: cover;*/ background-size: container; position: relative; z-index: 1; } #mask-1 { margin: 0; position: absolute; top: -273px; left: 0; } #mask-2 { margin: -55px 0 -86px; } #mask-3 { margin: -45px 0 0; } #mask-4 { margin: -45px 0 0; } #mask-1 .photo-mask-inner { height: 1250px; } #mask-2 .photo-mask-inner { height: 434px; } #mask-3 .photo-mask-inner { height: 434px; } #mask-4 .photo-mask-inner { height: 580px; } #backgrounds { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; overflow: hidden; visibility: hidden; } #backgrounds div { position: absolute; left: 50%; width: 1300px; margin-left: -650px; overflow: hidden; } #backgrounds div div { position: relative; left: 0; top: 0; margin: 0; width: 1024px; } #backgrounds img { display: block; position: relative; } #backgrounds #bkg-1 div { height: 1200px; background: url(../images/interface/bkg-1-1024.jpg) no-repeat 50% 0; } #backgrounds #bkg-2 div { height: 1000px; background: url(../images/interface/bkg-2-1024.jpg) no-repeat 50% 0; } #backgrounds #bkg-3 div { height: 1000px; background: url(../images/interface/bkg-3-1024.jpg) no-repeat 50% 0; } #backgrounds #bkg-4 div { height: 1000px; background: url(../images/interface/bkg-1-1024.jpg) no-repeat 50% 0; } /* =SITE WIDE -------------------------------------------------------------- */ #capabilities-mobile h3:after, #clients-mobile h3:after, #case-studies-tabs .tab h3:after, #capabilities-nav li:after, #clients-nav li:after, #modal-controls:after, #case-studies-tabs .tab ul:after, #case-studies-nav:after, #capabilities-prev-next:after, #clients-prev-next:after, #capabilities-nav:after, #clietns-nav:after, .grid:after, .default-txt:after, #layout:after, header:after, #content-inner:after, #content:after, footer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; font-size: 0px; line-height: 0; overflow: hidden; } @media only screen and (max-height: 920px) { .overlay-content-inner { min-height: 605px; height: auto !important; height: 605px; } /*.browser-ie8 .overlay-content-inner { min-height: 565px; height: auto !important; height: 565px; }*/ #modal-article .default-txt { height: 440px; } } @media only screen and (max-height: 768px) { .overlay-content-inner { min-height: 505px; height: auto !important; height: 505px; } /*.browser-ie8 .overlay-content-inner { min-height: 465px; height: auto !important; height: 465px; }*/ #modal-article .default-txt { height: 336px; } } @media only screen and (max-width: 1044px) { body { } #backgrounds { visibility: hidden; } #backgrounds div { margin-left: -512px; } #mask-1 { background: 0 !important; } /* #mask-2 { background: 0 !important; } #mask-3 { background: 0 !important; } #mask-4 { background: 0 !important; }*/ #footer-content #copyright { left: 0px; } #footer-content #development { right: 0px; } } @media only screen and (max-width: 980px) { #capabilities-arrow{display:none;} .grid { width: 90%; } #logo { left: 250px; } #footer-content #copyright { left: 40px; } #footer-content #development { right: 40px; } header.fixed #navigation-container { width: 520px; } #menu-header li { margin: 0 10px; } header.fixed #menu-header li { margin: 0 8px; } #case-studies-tabs .tab { width: 748px; } #case-studies-tabs .tab ul { padding: 37px 16px 35px; } #layout #case-studies-tabs .tab li.first-in-row, #layout #case-studies-tabs .tab li { margin: 0 0 5px 5px; } #layout #case-studies-tabs .tab li.item-1 { margin-left: 0; } #layout #case-studies-tabs .tab li.item-5 { margin-left: 0; } #layout #case-studies-tabs .tab li.item-9 { margin-left: 0; } #layout #case-studies-tabs .tab li.item-13 { margin-left: 0; } #capabilities-description { width: 630px; } #clients-description { width: 630px; } #capabilities-slides { width: 748px; } #capabilities-slides-outer { width: 748px; } #capabilities-slides-inner { width: 478px; } #capabilities-slides .slide { width: 478px; } #capabilities-slides .default-txt { width: 478px; } #capabilities-slides .additional-content { width: 478px; } #capabilities-slides .additional-content-inner { width: 478px; } #capabilities-slides.expanded .additional-content { width: 478px; } #capabilities-prev-next { width: 738px; } #clients-slides { width: 100%; } #clients-slides-outer { width: 100%; } #clients-slides-inner { width: 80%; left:10% } #clients-slides .slide { width: 100%; } #clients-slides .default-txt { width: 100%; } #clients-slides .additional-content { width: 100%; } #clients-slides .additional-content-inner { width: 100%; } #clients-slides.expanded .additional-content { width: 478px; } #clients-prev-next { width: 100%; top:50%;margin-top:-15px; } #clients-prev-next .prev {left:15px; top:0 !important;} #clients-prev-next .next{right:15px; top:0 !important;} .overlay-container-inner { width: 738px; } #modal-article h1 span { width: 600px; } #modal-article .default-txt { width: 600px; } #capabilities-nav { /*background: url(../images/css/capabilities-nav-smaller.png) no-repeat 50% 0;*/ } #capabilities-nav li { font: italic 15px/20px "Open Sans", Arial, sans-serif; margin: 0; } #clients-nav { background: url(../images/css/capabilities-nav-smaller.png) no-repeat 50% 0; } #clients-nav li { font: italic 15px/20px "Open Sans", Arial, sans-serif; margin: 0 0 0 32px; } } @media only screen and (max-width: 767px) { body { background: #223342; } p, li, dd, dt, label, legend, td, th, caption, blockquote { font-size: 14px; line-height: 18px; } .grid { width: 90%; } #layout { padding-top: 158px; background-image:url(../images/interface/bkg-1-large.jpg); background-position:50%;} header { position: absolute !important; } header #logo, header #logo a { width: 159px; height: 21px; } header #logo { top: 18px; left: 0px; background: url(../images/css/MacCallumRoss-logo-h.svg) no-repeat 0 0; z-index:2;} header .grid { height: 59px; } header #navigation-container { width: 100%;padding:0;top: 0; left: 0; } header #nav-contact { margin-right: 0; } #menu-main-nav{ background:#223342; } #toggle-menu { display: block; text-transform: uppercase; font: 13px/18px "Open Sans", Arial, sans-serif; margin: 0; text-transform: uppercase; letter-spacing: 1px; } #toggle-menu a { color: #fff; width: 46px; overflow: hidden; margin: 0 0 0 auto; display: block; padding: 25px 0 16px; text-align: center; background: url(../images/css/toggle-menu.png) no-repeat 50% 47px; } #layout #menu-header ul { padding: 20px 20px 10px; margin: 0 -6%; text-align: left; display: none; } #layout #menu-header li { display: block; font: 13px/18px "Open Sans", Arial, sans-serif; margin: 0; text-transform: uppercase; letter-spacing: 1px; } #layout #menu-header li a { display: block; color: #fff; padding: 6px 0; background: 0; text-align: right; } #layout li#nav-home a { padding-top: 16px; } #layout li#nav-contact a { padding-bottom: 19px; } #layout #menu-header li a:hover/*, #layout #menu-header li.current a */ { color: #666; } #backgrounds { top: 59px; display:none;} #backgrounds div { position: absolute; left: 50%; width: 768px; margin-left: -384px; overflow: hidden; margin-top: -59px } #backgrounds img { display: block; position: relative; width: 100%; height: auto !important; } #backgrounds div div { width: 768px; } #backgrounds #bkg-1 { background: url(../images/interface/bkg-1-768.jpg) no-repeat 50% 0; } #backgrounds #bkg-2 { background: url(../images/interface/bkg-2-768.jpg) no-repeat 50% 0; } #backgrounds #bkg-3 { background: url(../images/interface/bkg-3-768.jpg) no-repeat 50% 0; } #backgrounds #bkg-4 { background: url(../images/interface/bkg-1-768.jpg) no-repeat 50% 0; } #layout .default-txt h2 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; } #layout .default-txt h3 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; } #layout .default-txt h4 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; } #layout .default-txt h5 { font: italic 18px/24px "Open Sans",Arial,sans-serif; margin: 0; } .default-txt p, .default-txt ul, .default-txt dl, .default-txt ol { margin-bottom: 18px; } .default-txt ul li { background-position: 0 9px; } /* INTRO BKG */ #intro { background: 0; padding: 65px 0 0; margin: 0 0 64px; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #intro .grid {} #intro-inner { background: url(../images/css/blue-background-mobile.png) no-repeat 50% 100%; padding: 30px 0 43px; } #intro .default-txt { width: 280px; text-align: left; } #intro .default-txt h2 { position: absolute; top: 0; left: 50%; width: 260px; margin: 0 0 0 -130px; font: italic 22px/26px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 6px 0; text-align: center; background: 0; } #intro #down-arrow { display: none; } #mask-2 { margin: -55px 0 -46px; } #mask-3 { margin: -45px 0 -60px; } #mask-4 { margin: -45px 0 40px; } #who-we-are .default-txt{ margin-top:0; } #who-we-are h2{ top:0; margin-top:-46px !important; } #clients-description p{ text-align:center; } /* CASE STUDIES */ #case-studies h2 { font: italic 22px/26px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 10px 0 10px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #case-studies-inner { background: url(../images/css/blue-background-mobile.png) no-repeat 50% 100%; padding: 37px 0 55px; } #case-studies-nav li { font: italic 14px/18px "Open Sans", Arial, sans-serif; height: 37px; padding: 0 0 0 1px; background: url(../images/css/services-tab-left.png) no-repeat 0 0; } #case-studies-nav li a { float: left; height: 25px; padding: 12px 27px 0 17px; background: url(../images/css/services-tab-right.png) no-repeat 100% 0; } #case-studies-nav li:first-child a { padding-right: 30px; } #case-studies-tabs { margin: 0 0 10px; } #case-studies-tabs .tab { width: 280px; } #case-studies-tabs .tab ul { padding: 32px 17px 10px; } #case-studies-tabs .tab li { width: auto; height: auto; float: none; background: non; margin: 0; position: relative; overflow: hidden; } #case-studies-tabs .tab li.cat-1, #case-studies-tabs .tab li.cat-2, #case-studies-tabs .tab li.cat-3, #case-studies-tabs .tab li.cat-4 { background: 0; } #case-studies-tabs .tab h3 { padding: 0; position: relative; z-index: 1; margin: 0 0 14px !important; } #case-studies-tabs .tab h3 a { float: left; display: inline; text-align: left; padding: 0; background: 0; } #case-studies-tabs .tab h3 .arrow { display: inline; padding-left: 2px; } #case-studies-tabs .tab p { display: none; } #case-studies-tabs li h3 a:hover { color: #333 !important; } /* CAPABILITIES */ #capabilities-list{ padding-top:30px; } #capabilities h2 { font: italic 22px/26px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 10px 0 10px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #capabilities-inner { padding: 0 0 50px; background: url(../images/css/blue-background-mobile.png) 50% 100%; } #capabilities-mobile {} #capabilities-mobile .section { } #capabilities-mobile h3 { font: italic 16px/24px "Open Sans", Arial, sans-serif; margin: 0 0 12px; float: none; } #capabilities-mobile h3 a { float: left; padding: 0 28px 0 0; background: url(../images/css/capabilities-arrow-next-mobile.png) no-repeat 100% 8px; } #capabilities-mobile h3 a:hover { color: #333; background-position: 100% -42px; } #capabilities-mobile .section .default-txt { display: none; } #capabilities-mobile .expanded .default-txt { display: block; } #capabilities-mobile .expanded h3 a { color: #333; float: none; display: block; padding: 0; background: url(../images/css/capabilities-close.png) no-repeat 100% 8px; } #capabilities-mobile .expanded h3 a:hover { background-position: 100% -42px; } #capabilities-description { width: 280px; text-align: left; padding: 30px 0 5px; } #capabilities-desktop { display: none; } #capabilities-mobile { display: block; } /* CLIENTS */ #clients h2, #who-we-are h2 { font: italic 22px/26px "Open Sans", Arial, sans-serif; color: #cf9312; padding: 10px 0 10px; margin: 0; text-align: center; background: url(../images/css/section-heading-bkg.png) no-repeat 50% 0; } #clients-inner { padding: 0 0 50px; background: url(../images/css/blue-background-mobile.png) 50% 100%; } #clients-mobile {} #clients-mobile .section { } #clients-mobile h3 { font: italic 16px/24px "Open Sans", Arial, sans-serif; margin: 0 0 12px; float: none; } #clients-mobile h3 a { float: left; padding: 0 28px 0 0; background: url(../images/css/capabilities-arrow-next-mobile.png) no-repeat 100% 8px; } #clients-mobile h3 a:hover { color: #333; background-position: 100% -42px; } #clients-mobile .section .default-txt { display: none; } #clients-mobile .expanded .default-txt { display: block; } #clients-mobile .expanded h3 a { color: #333; float: none; display: block; padding: 0; background: url(../images/css/capabilities-close.png) no-repeat 100% 8px; } #clients-mobile .expanded h3 a:hover { background-position: 100% -42px; } #clients-description { width: 280px; text-align: left; padding: 30px 0 5px; } /*#clients-desktop { display: none; } #clients-mobile { display: block; }*/ .overlay-container-inner { width: 300px; } .overlay-content-inner { min-height: 340px; height: auto !important; height: 340px; } /*.browser-ie8 .overlay-content-inner { min-height: 300px; height: auto !important; height: 300px; }*/ #modal-article .default-txt { height: 200px; } #modal-article h1 { font: italic 18px/22px "Open Sans", Arial, sans-serif; padding: 10px 0; text-align: center; } #modal-article h1 span { width: 270px; } #modal-article .default-txt { width: 270px; } #modal-controls li { font: italic 16px/22px "Open Sans", Arial, sans-serif; } #mask-1 .photo-mask-inner { height: 300px; } #mask-2 .photo-mask-inner { height: 175px; } #mask-3 .photo-mask-inner { height: 175px; } #mask-4 .photo-mask-inner { height: 300px; } footer { height: 240px; } #footer-content #copyright { left: 60px; } #footer-content #development { display: none; } #footer-content #contact-info span { } #footer-content { padding: 95px 0 0; background: url(../images/css/footer-logo-small.png) no-repeat 50% 25px; height: 144px; } }