*, :after, :before { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box } *::selection { color: #ffffff; background-color: #1985a1; } *::-moz-selection { color: #ffffff; background-color: #1985a1; } body { margin: 0; padding: 0; background-color: #f2f2f2; background-image: url("./../../santacruz/img/overlay/bright-squares.png"); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } body, h1, h2, h3, h4, h5, h6, h2>a, h3>a, h4>a, h5>a, h6>a { font-family: 'Fira Sans', sans-serif; } #main-wrap { position: relative; min-height: 300px; } #maincontainer { background-color: #ffffff; padding: 0; } #sidebarleft, #content, #sidebarright { min-height: 1px; } #header { padding: 20px 0; background-color: #ffffff; background-image: url("./../../santacruz/img/overlay/bright-squares.png"); } #header.padding-top-0 { padding-top: 0; overflow: auto; } #header.padding-top-0 > div:first-child:not(.sqrallwaysfullwidth), #header.padding-top-0 > h2:first-child { padding-top: 20px; } #main { padding: 20px 0; background-image: url("./../../santacruz/img/overlay/bright-squares.png"); } #footer { padding: 20px 0; background-color: #ffffff; background-image: url("./../../santacruz/img/overlay/bright-squares.png"); } #main, #footer, .sqrcommon { box-shadow: inset 0 1px 0 0 rgba(0, 0, 0, 0.05), inset 0 0.1em 0.1em 0 rgba(0, 0, 0, 0.025); } .sqrtotop { text-align: right; } a.sqrtotop { display: inline-block; height: 30px; width: 30px; background: url(./../../santacruz/img/?f=uparrow15&c=007ea7) 0 0 no-repeat; background-size: 100% auto; } h1, h2, h3, h4, h5, h6, h2>a, h3>a, h4>a, h5>a, h6>a { font-family: 'Fira Sans', sans-serif;} @media screen and (min-width: 992px) { .sqrdesktopboxed .sqrpanoramicbackgroundboxed { padding-left: 20px; padding-right: 20px; } .sqrallwaysboxed, .sqrmobilefullwidth, .sqrdesktopboxed { box-sizing: border-box; padding-left: 20px; padding-right: 20px; max-width: 1600px; margin-left: auto; margin-right: auto; } .sqrallwaysboxed .sqrallwaysboxed, .sqrdesktopboxed .sqrdesktopboxed, .sqrmobilefullwidth .sqrallwaysboxed, .sqrdesktopboxed .sqrallwaysboxed, .sqrdesktopboxed .sqrmobilefullwidth, .sqrdesktopremovebox .sqrallwaysboxed, .sqrdesktopremovebox .sqrmobilefullwidth { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0; } .sqrmain2col>div { box-sizing: border-box; width: 48%; float: left; margin-right: 4%; } .sqrmain2col>div:last-child { margin-right: 0; } .sqrmain3col>div { box-sizing: border-box; width: 30.6666666666%; float: left; margin-right: 4%; } .sqrmain3col>div:last-child { margin-right: 0; } .sqrmain3collr>div { box-sizing: border-box; width: 50%; float: left; } .sqrmain3collr>div:first-child { width: 21%; margin-right: 4%; } .sqrmain3collr>div:last-child { width: 21%; margin-left: 4%; } .sqrmain2coll>div { box-sizing: border-box; width: 75%; float: left; } .sqrmain2coll>div:first-child { width: 21%; margin-right: 4%; } .sqrmain2colr>div { box-sizing: border-box; width: 75%; float: left; } .sqrmain2colr>div:last-child { width: 21%; margin-left: 4%; } .sqrmain3col:after, .sqrmain2col:after, .sqrmain3collr:after, .sqrmain2coll:after, .sqrmain2colr:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } .sqrallwaysfullwidth .sqrsuppressborders { border-left: 0 !important; border-right: 0 !important; } } @media screen and (max-width: 991px) { .sqrpanoramicbackground { padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important; } .sqrallwaysboxed, .sqrmobileboxed { box-sizing: border-box; padding-left: 20px; padding-right: 20px; } .sqrallwaysboxed>.sqrallwaysboxed, .sqrallwaysboxed>.nguiparagraphcontainer>.sqrallwaysboxed { padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0; } .sqrmobileboxedimportant { padding-left: 20px !important; padding-right: 20px !important; } .sqrmobilehidden { display: none; } .sqrallwaysfullwidth .sqrsuppressborders, .sqrmobilefullwidth .sqrsuppressborders { border-left: 0 !important; border-right: 0 !important; } } .sqpnavicon { width: 1.1em; height: 1.1em; display: inline-block; vertical-align: -0.18em; margin-right: 0.5em; border: 0; padding: 0; } .sqplinkicon { width: 1em; height: 1.1em; display: inline-block; vertical-align: -0.2em; margin-right: 0.2em; border: 0; padding: 0; } .sqrcommon { margin: 0; padding: 20px 0 0 0; } .sqrcommonnavhierarchical, .sqrcommonnav, .sqrfootertext { max-width: 1600px; margin: 0 auto; padding: 20px; box-sizing: border-box; } .sqrfootertext { color: #666666; } .sqrcommonnavhierarchical a, .sqrcommonnav a, .sqrfootertext a { text-decoration: none; color: #aaaaaa; transition: color 0.3s; text-decoration: none; font-weight: normal; } .sqrcommonnavhierarchical a:hover, .sqrcommonnav a:hover, .sqrfootertext a:hover { color: #00a8e8; text-decoration: none; font-weight: normal; } .sqrcommonnavhierarchical, .sqrcommonnav { display: block; list-style: none; } .sqrcommonnavhierarchical>li, .sqrcommonnav>li { display: block; box-sizing: border-box; list-style: none; padding: 0 0 5px 0; } .sqrcommonnavhierarchical>li>em { font-style: normal; color: #666666; } .sqrcommonnavhierarchical>li>ul { display: block; margin: 0; padding: 5px 0 15px 0; } .sqrcommonnavhierarchical>li>ul>li { list-style: none; margin: 0; padding: 0 0 2px 0; } .sqrcommonnavhierarchical:after, .sqrcommonnav:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } @media screen and (min-width: 992px) { .sqrcommonnavhierarchical>li { float: left; padding-right: 5%; } .sqrcommonnavhierarchical2col>li { width: 50%; } .sqrcommonnavhierarchical3col>li { width: 33.3333333%; } .sqrcommonnavhierarchical4col>li { width: 25%; } .sqrcommonnavhierarchical5col>li { width: 20%; } .sqrcommonnav>li { float: left; padding-right: 20px; } .sqrdesktophidden { display: none; } } .sqreyecatcher { background-color: #ffffff; position: relative; } .sqreyecatcher img, .sqreyecatcher video { display: block; width: 100%; height: auto; } .owl-dots { position: absolute; } .owl-dots { position: absolute; bottom: 20px; width: 100%; text-align: center; } .owl-dots .owl-dot { display: inline-block; cursor: pointer; float: none; } .owl-dots div span { width: 30px; height: 30px; display: block; float: left; background: url(./../../santacruz/img/?f=dothollow&c=ffffff) 0 0 no-repeat; background-size: 100% auto; z-index: 2; } .owl-dots div.active span { background-position: 0 -30px; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next { background: url(./../../santacruz/img/?f=nav15&c=ffffff) 0 0 no-repeat; } .owl-summary { color: #ffffff; bottom: 20px; left: 20px; } .owl-summary h3 { color: #ffffff; } /* Menu styles */ #main-wrap { margin: 0 0 0 270px; } @media screen and (max-width: 991px) { #main-wrap { margin: 0; } } #menu { font-family: 'Fira Sans', sans-serif; position: fixed; top: 0; left: 0; width: 270px; height: calc(100vh); background-color: #007ea7; box-shadow: 0 0 15px rgba(0, 0, 0, 0.5); z-index: 10; display: -moz-flex; display: -webkit-flex; display: -ms-flex; display: flex; -moz-flex-direction: column; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -moz-justify-content: space-between; -webkit-justify-content: space-between; -ms-justify-content: space-between; justify-content: space-between; } #menu .top { position: relative; -moz-flex-grow: 1; -webkit-flex-grow: 1; -ms-flex-grow: 1; flex-grow: 1; } #menu .bottom { -moz-flex-shrink: 0; -webkit-flex-shrink: 0; -ms-flex-shrink: 0; flex-shrink: 0; padding: 1em; } .menu__wrap { position: absolute; top: 50px; bottom: 0; overflow: hidden; width: 100%; } .menu__logo { text-align: center; padding: 10px 20px 0; } .sqrlogo { max-width: 100%; height: auto; } .menu__level { position: absolute; top: 0; left: 0; visibility: hidden; overflow: hidden; overflow-y: scroll; width: calc(100% + 50px); height: 100%; margin: 0; padding: 0; list-style-type: none; } .menu__level:focus { outline: none; } .menu__level--current { visibility: visible; } .menu__item { display: block; width: calc(100% - 50px); } .menu__link { position: relative; display: block; font-size: 15px; font-weight: 700; padding: 8px 30px 8px 20px; color: #dcdcdd; line-height: 1; text-decoration: none; outline: none; -webkit-transition: color 0.1s; transition: color 0.1s; } .menu__link .fa { line-height: 0.9; } .menu__link .sqpnavicon { width: 1em; height: 1em; vertical-align: baseline; margin-bottom: -0.15em; } .menu__link[data-submenu]::after { content: '\f141'; font-family: 'FontAwesome'; position: absolute; right: 0; top: 50%; margin-top: -7.5px; padding: 0 1em; height: 15px; color: #dcdcdd; } .menu__link:hover, .menu__link:focus, .menu__link[data-submenu]:hover::after, .menu__link[data-submenu]:focus::after { color: #ffffff; } .menu__link--current::before { font-family: FontAwesome; content: '\f111'; color: #ffffff; font-size: 8px; line-height: 18px; position: absolute; left: 0.8em; } #menu em.ngshopcartindicator { display: none; background: #; color: #; font-style: normal; padding: 4px 8px; border-radius: 5px; font-weight: normal; margin: -4px 0 -4px 0.5em; } #menu em.ngshopcartindicatoractive { display: inline-block; } [class^='animate-'], [class*=' animate-'] { visibility: visible; } .animate-outToRight .menu__item { -webkit-animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: outToRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes outToRight { to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } @keyframes outToRight { to { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } } .animate-outToLeft .menu__item { -webkit-animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: outToLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes outToLeft { to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } @keyframes outToLeft { to { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } } .animate-inFromLeft .menu__item { -webkit-animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: inFromLeft 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes inFromLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes inFromLeft { from { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .animate-inFromRight .menu__item { -webkit-animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); animation: inFromRight 0.6s both cubic-bezier(0.7, 0, 0.3, 1); } @-webkit-keyframes inFromRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes inFromRight { from { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } to { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .menu__breadcrumbs { font-size: 0.65em; line-height: 1.25em; position: relative; padding: 20px 20px 0 20px; } .menu__breadcrumbs a { font-weight: bold; display: inline-block; cursor: pointer; vertical-align: middle; letter-spacing: 1px; text-transform: uppercase; text-decoration: none; color: #003459; -webkit-transition: color 0.1s; transition: color 0.1s; } .menu__breadcrumbs a:last-child { pointer-events: none; } .menu__breadcrumbs a:hover, .menu__breadcrumbs a:focus { color: #ffffff; } .menu__breadcrumbs a:not(:last-child)::after { content: '\f178'; font-family: 'FontAwesome'; display: inline-block; padding: 0 0.5em; line-height: 0.65em; color: #dcdcdd; } .menu__breadcrumbs a:not(:last-child):hover::after, .menu__breadcrumbs a:not(:last-child):focus::after { color: #ffffff; } .menu__back { font-size: 1em; line-height: 1; position: absolute; top: 16.5px; right: 20px; z-index: 100; margin: 0; padding: 0; cursor: pointer; color: #ffffff; border: none; background: none; opacity: 1; -webkit-transition: all 0.3s; transition: all 0.3s; } .menu__back--hidden { pointer-events: none; opacity: 0; } .menu__back:hover, .menu__back:focus { color: #ffffff; outline: none; } /* Open and close buttons */ .action { position: absolute; display: block; margin: 0; padding: 0; cursor: pointer; border: none; background: none; } .action:hover, .action:focus, .action:active { outline: none; } .action::-moz-focus-inner { border:0; } .action:hover { color: #ffffff; } .action--open { font-size: 1em; font-family: 'Fira Sans', sans-serif; top: 1em; left: 1em; display: none; position: fixed; z-index: 5; color: #ffffff; padding: 0.5em 0.75em; border-radius: 4px; background-color: rgba(0,0,0,0.5); -webkit-transition: top 0.2s ease, background-color 0.2s ease; transition: top 0.2s ease, background-color 0.2s ease; } .action--open:hover { color: #ffffff; background-color: rgba(0,0,0,0.8); } .opfix.scrolled .action--open { top: 0.25em; } .action--close { font-size: 1.25em; top: 12.5px; right: 12.5px; display: none; color: #ffffff; } #nav { background-color: #f1f9f5; color: #666666; cursor: default; position: fixed; -moz-transition: background-color 0.2s ease, border-top-left-radius 0.2s ease, border-top-right-radius 0.2s ease, padding 0.2s ease; -webkit-transition: background-color 0.2s ease, border-top-left-radius 0.2s ease, border-top-right-radius 0.2s ease, padding 0.2s ease; -ms-transition: background-color 0.2s ease, border-top-left-radius 0.2s ease, border-top-right-radius 0.2s ease, padding 0.2s ease; transition: background-color 0.2s ease, border-top-left-radius 0.2s ease, border-top-right-radius 0.2s ease, padding 0.2s ease; box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.05), 0 0.5em 0.5em 0 rgba(0, 0, 0, 0.025); z-index: 2; width: calc(100% - 270px); } #nav ul { margin: 0 auto; padding: 0; list-style: none; } #nav a, #nav ul li a { text-decoration: none; color: inherit; } #nav ul li a { padding: 0 0.75em; border: 0; border-radius: 8px; box-shadow: inset 0 0 0 1px transparent; } #nav ul li a:hover { background-color: #f2f2f2; } #nav ul li.active a { background-color: #ffffff; box-shadow: none; } .scrolled #nav { top: 0; padding: 0.5em 1em; background-color: rgba(241, 249, 245, 0.95); border-top-left-radius: 0; border-top-right-radius: 0; } #nav .sqrnavshow, #nav .sqrnavhide, .sqrnavopen > a.sqrnavshow { display: none; text-align: right; } @media screen and (min-width: 992px) { #nav { padding: 1em; text-align: center; } #nav ul li { -moz-transition: margin 0.2s ease; -webkit-transition: margin 0.2s ease; -ms-transition: margin 0.2s ease; transition: margin 0.2s ease; display: inline-block; margin: 0 0.35em; padding: 0; vertical-align: middle; } #nav ul li a { -moz-transition: font-size 0.2s ease; -webkit-transition: font-size 0.2s ease; -ms-transition: font-size 0.2s ease; transition: font-size 0.2s ease; display: inline-block; height: 2.25em; line-height: 2.25em; } .scrolled #nav ul li { margin: 0 0.175em; } .scrolled #nav ul li a { font-size: 0.9em; } } @media screen and (max-width: 991px) { #nav { width: 100%; padding: 1.5em 1em; } .scrolled #nav { padding: 1em; } .opfix.scrolled .action--open { top: 0.5em; } #nav > a > i { padding-left: 0.5em; } #nav ul { text-align: right; } #nav .sqrnavshow, #nav.sqrnavopen > a.sqrnavhide, #nav.sqrnavopen > ul, #nav.sqrnavopen .sqrnav ul { display: block; } #nav ul { display: none; padding-top: 1em; } #nav ul li { padding: 0.5em; margin-bottom: 0.25em; } #nav ul li a { padding: 0.5em 1.25em; } #nav li.sqrnavmore>a { background: url(./../../santacruz/img/?f=moreright&c=666666) right center no-repeat; } #nav li.sqrnavopen>a { background-image: url(./../../santacruz/img/?f=moredown&c=666666); } #nav .sqrnavhide, #nav.sqrnavopen > a.sqrnavshow { display: none; } #nav .sqrnav ul { display: none; list-style: none; } } #socialicons { text-align: center; font-size: 1.25em; } #socialicons a { color: #003459; margin-left: .5em; -moz-transition: color 0.33s ease-in-out; -webkit-transition: color 0.33s ease-in-out; -ms-transition: color 0.33s ease-in-out; transition: color 0.33s ease-in-out; } #socialicons a:first-child { margin-left: 0; } #socialicons a:hover, #socialicons a:focus { color: #ffffff; } @media screen and (max-width: 991px) { .action--open, .action--close { display: block; } #menu { z-index: 1000; top: 0; width: 100%; height: 100vh; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); -webkit-transition: -webkit-transform 0.3s; transition: transform 0.3s; } #menu.menu--open { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } .animated { animation-duration: 1s; animation-fill-mode: both; } .animated.infinite { animation-iteration-count: infinite; } .animated.hinge { animation-duration: 2s; } .animated.flipOutX, .animated.flipOutY, .animated.bounceIn, .animated.bounceOut { animation-duration: .75s; } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .fadeIn { animation-name: fadeIn; } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { animation-name: fadeOut; } #socialicons { position: relative; } .search input { box-sizing: border-box; display: block; padding: 0; width: 100%; border: 0; padding: 6px 12px; margin: 0; font-size: 12px; line-height: 12px; background: #006b8e; border: 1px solid #006181; color: #dcdcdd; -webkit-appearance: none; -webkit-border-radius: 3px; border-radius: 3px; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .search input:focus { outline: none; background: #006181; border-color: #005874; } .search input::-webkit-input-placeholder { color: #c9c9ca; } .search input::-moz-placeholder { color: #c9c9ca; } .search input:-ms-input-placeholder { color: #c9c9ca; } .search input:-moz-placeholder { color: #c9c9ca; } .search { display: inline; } .search:hover { cursor: pointer } .search form { position: absolute; top: -2em; box-sizing: border-box; margin: 0; width: 100%; opacity: 0; visibility: hidden; -webkit-transition: all 0.2s ease; transition: all 0.2s ease; } .search-open form { opacity: 1; visibility: visible; } .btn-link, .btn-link.active, .btn-link:active, .btn-link[disabled], fieldset[disabled] .btn-link { background-color: transparent; border-color: transparent; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; outline: none; -ms-touch-action: manipulation; touch-action: manipulation; }