@import url(//fonts.googleapis.com/css?family=Montserrat:400|Raleway:300,400,600|Inconsolata); #header #logo h3, #header #navbar ul, #header #navbar .panel-activation, #footer p { position: relative; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .button, .button-secondary { display: inline-block; padding: 7px 20px; } html, body { height: 100%; } body { background: white; color: #444444; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a { color: #1bb3e9; } a:hover { color: #0e6e90; } b, strong, label, th { font-weight: 600; } #container { min-height: 100%; position: relative; } .fullwidth #body { padding-left: 0; padding-right: 0; } #body { padding-top: 8rem; padding-bottom: 11rem; } .default-animation, #body, #header, #header #logo h3, .modular .showcase .button { -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease; } .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .blog-content-list, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer { padding-left: 7rem; padding-right: 7rem; } @media only all and (max-width: 59.938rem) { .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .blog-content-list, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer { padding-left: 4rem; padding-right: 4rem; } } @media only all and (max-width: 47.938rem) { .padding-horiz, .fullwidth #header, .fullwidth #breadcrumbs, .fullwidth .blog-header, .fullwidth .blog-content-item, .fullwidth .blog-content-list, .fullwidth ul.pagination, .fullwidth #body > .modular-row, #body, #header, #footer { padding-left: 1rem; padding-right: 1rem; } } .padding-vert { padding-top: 3rem; padding-bottom: 3rem; } #header { position: fixed; z-index: 10; width: 100%; height: 5rem; background-color: rgba(255, 255, 255, 0.9); box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15); } #header.scrolled { height: 3rem; background-color: rgba(255, 255, 255, 0.9) !important; box-shadow: 0 0.05rem 1rem rgba(0, 0, 0, 0.15) !important; } #header.scrolled #logo h3 { color: #444444 !important; font-size: 1.6rem !important; } #header.scrolled #logo a { color: #444444 !important; } #header.scrolled #navbar a { color: #1bb3e9 !important; } #header.scrolled #navbar a:before, #header.scrolled #navbar a:after { background-color: #1bb3e9 !important; } #header > .grid, #header #logo, #header #navbar { height: 100%; } #header #logo { float: left; } #header #logo h3 { font-size: 2rem; line-height: 2rem; margin: 0; text-transform: uppercase; } #header #logo h3 a { color: #444444; } #header #navbar { font-size: 0.9rem; } #header #navbar ul { display: inline-block; margin: 0; list-style: none; float: right; } #header #navbar ul li { float: left; position: relative; } #header #navbar ul li a { font-family: "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; display: inline-block; padding: 0.1rem 0.8rem; } #header #navbar ul li a:before, #header #navbar ul li a:after { content: ""; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background-color: #1bb3e9; visibility: hidden; -webkit-transform: scaleX(0); -moz-transform: scaleX(0); -ms-transform: scaleX(0); -o-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; transition: all 0.2s ease; } #header #navbar ul li a:hover:before { visibility: visible; -webkit-transform: scaleX(0.75); -moz-transform: scaleX(0.75); -ms-transform: scaleX(0.75); -o-transform: scaleX(0.75); transform: scaleX(0.75); } #header #navbar ul li.active a:after { top: 0; visibility: visible; -webkit-transform: scaleX(0.75); -moz-transform: scaleX(0.75); -ms-transform: scaleX(0.75); -o-transform: scaleX(0.75); transform: scaleX(0.75); } @media only all and (max-width: 59.938rem) { #header #navbar ul { display: none; } } #header #navbar .panel-activation { display: none; font-size: 2rem; cursor: pointer; float: right; } @media only all and (max-width: 59.938rem) { #header #navbar .panel-activation { display: inline-block; } } .header-image.fullwidth #body { padding-left: 0; padding-right: 0; } .header-image.fullwidth #body > .listing-row { padding-left: 7rem; padding-right: 7rem; } .header-image .listing-row:last-child { margin-bottom: 2rem; } .header-image #body > .blog-header { margin-top: -9.5rem; padding-top: 9rem; } .header-image #breadcrumbs { margin-top: 1rem; } .header-image #header { background-color: rgba(255, 255, 255, 0); box-shadow: none; } .header-image #header #logo h3, .header-image #header #logo a { color: white; } .header-image #header a, .header-image #header .menu-btn { color: white; } .header-image #header a:before, .header-image #header a:after { background-color: rgba(255, 255, 255, 0.7) !important; } #footer { position: absolute; background: #333; height: 6rem; right: 0; bottom: 0; left: 0; color: #999; text-align: center; } #footer a:hover { color: #fff; } #footer .totop { position: absolute; bottom: 5rem; text-align: center; left: 0; right: 0; } #footer .totop span { font-size: 1.7rem; line-height: 2.5rem; background: #333; width: 3rem; height: 2rem; border-radius: 3px; display: inline-block; text-align: top; } #footer p { margin: 0; } #footer p .fa { color: #fff; } body { font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight: 400; } h1, h2, h3, h4, h5, h6 { font-family: "Montserrat", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight: 400; text-rendering: optimizeLegibility; letter-spacing: -0px; } h1 { font-size: 3.2rem; } @media only all and (max-width: 47.938rem) { h1 { font-size: 2.5rem; line-height: 1.2; margin-bottom: 2.5rem; } } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { h2 { font-size: 2.1rem; } } @media only all and (max-width: 47.938rem) { h2 { font-size: 2rem; } } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { h3 { font-size: 1.7rem; } } @media only all and (max-width: 47.938rem) { h3 { font-size: 1.6rem; } } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { h4 { font-size: 1.35rem; } } @media only all and (max-width: 47.938rem) { h4 { font-size: 1.25rem; } } h1 { text-align: center; letter-spacing: -3px; } h2 { letter-spacing: -2px; } h3 { letter-spacing: -1px; } h1 + h2 { margin: -2rem 0 2rem 0; font-size: 2rem; line-height: 1; text-align: center; font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight: 300; } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { h1 + h2 { font-size: 1.6rem; } } @media only all and (max-width: 47.938rem) { h1 + h2 { font-size: 1.5rem; } } h2 + h3 { margin: 0.5rem 0 2rem 0; font-size: 2rem; line-height: 1; text-align: center; font-family: "Raleway", "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif; font-weight: 300; } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { h2 + h3 { font-size: 1.6rem; } } @media only all and (max-width: 47.938rem) { h2 + h3 { font-size: 1.5rem; } } blockquote { border-left: 10px solid #f0f2f4; } blockquote p { font-size: 1.1rem; color: #999; } blockquote cite { display: block; text-align: right; color: #666; font-size: 1.2rem; } blockquote > blockquote > blockquote { margin: 0; } blockquote > blockquote > blockquote p { padding: 15px; display: block; font-size: 1rem; margin-top: 0rem; margin-bottom: 0rem; } blockquote > blockquote > blockquote > p { margin-left: -71px; border-left: 10px solid #F0AD4E; background: #FCF8F2; color: #df8a13; } blockquote > blockquote > blockquote > blockquote > p { margin-left: -94px; border-left: 10px solid #D9534F; background: #FDF7F7; color: #b52b27; } blockquote > blockquote > blockquote > blockquote > blockquote > p { margin-left: -118px; border-left: 10px solid #5BC0DE; background: #F4F8FA; color: #28a1c5; } blockquote > blockquote > blockquote > blockquote > blockquote > blockquote > p { margin-left: -142px; border-left: 10px solid #5CB85C; background: #F1F9F1; color: #3d8b3d; } code, kbd, pre, samp { font-family: "Inconsolata", monospace; } code { background: #f9f2f4; color: #9c1d3d; } pre { padding: 2rem; background: #f6f6f6; border: 1px solid #dddddd; border-radius: 3px; } pre code { color: #237794; background: inherit; } hr { border-bottom: 4px solid #f0f2f4; } .page-title { margin-top: -25px; padding: 25px; float: left; clear: both; background: #1bb3e9; color: white; } fieldset { border: 1px solid #dddddd; } textarea, input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], input[type="color"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="time"], input[type="week"], select[multiple=multiple] { background-color: white; border: 1px solid #dddddd; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06); } textarea:hover, input[type="email"]:hover, input[type="number"]:hover, input[type="password"]:hover, input[type="search"]:hover, input[type="tel"]:hover, input[type="text"]:hover, input[type="url"]:hover, input[type="color"]:hover, input[type="date"]:hover, input[type="datetime"]:hover, input[type="datetime-local"]:hover, input[type="month"]:hover, input[type="time"]:hover, input[type="week"]:hover, select[multiple=multiple]:hover { border-color: #c4c4c4; } textarea:focus, input[type="email"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="text"]:focus, input[type="url"]:focus, input[type="color"]:focus, input[type="date"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, select[multiple=multiple]:focus { border-color: #1bb3e9; box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06), 0 0 5px rgba(21, 163, 214, 0.7); } .form-field .required { color: #F3443F; font-size: 3rem; line-height: 3rem; vertical-align: top; height: 1.5rem; display: inline-block; } form .buttons { text-align: center; } form input { font-weight: 400; } table { border: 1px solid #eaeaea; } th { background: #f7f7f7; padding: 0.5rem; } td { padding: 0.5rem; border: 1px solid #eaeaea; } .button { background: white; color: #1bb3e9; border: 1px solid #1bb3e9; border-radius: 3px; } .button:hover { background: #1bb3e9; color: white; } .button:active { box-shadow: 0 1px 0 #118ab5; } .button-secondary { background: white; color: #f6635e; border: 1px solid #f6635e; border-radius: 3px; } .button-secondary:hover { background: #f6635e; color: white; } .button-secondary:active { box-shadow: 0 1px 0 #f32b24; } .bullets { margin: 1.7rem 0; margin-left: -0.85rem; margin-right: -0.85rem; overflow: auto; } .bullet { float: left; padding: 0 0.85rem; } .two-column-bullet { width: 50%; } @media only all and (max-width: 47.938rem) { .two-column-bullet { width: 100%; } } .three-column-bullet { width: 33.33333%; } @media only all and (max-width: 47.938rem) { .three-column-bullet { width: 100%; } } .four-column-bullet { width: 25%; } @media only all and (max-width: 47.938rem) { .four-column-bullet { width: 100%; } } .bullet-icon { float: left; background: #1bb3e9; padding: 0.875rem; width: 3.5rem; height: 3.5rem; border-radius: 50%; color: white; font-size: 1.75rem; text-align: center; } .bullet-icon-1 { background: #1bb3e9; } .bullet-icon-2 { background: #1be9da; } .bullet-icon-3 { background: #d5e91b; } .bullet-content { margin-left: 4.55rem; } #panel { color: white; } #panel .navigation { list-style: none; padding: 0; } #panel .navigation li { padding: 0.5rem 1rem; border-bottom: 1px solid #404040; font-weight: 600; } #panel .navigation li.active { background: #fff; } #panel .navigation li.active a { color: #444444; } #panel .navigation li.active a:hover { color: #444444; } #panel .navigation li:last-child { border-bottom: 0; } #panel .navigation li a:hover { color: white; } /* Menu Appearance */ .pushy { position: fixed; width: 250px; height: 100%; top: 0; z-index: 9999; background: #333333; overflow: auto; -webkit-overflow-scrolling: touch; /* enables momentum scrolling in iOS overflow elements */ } /* Menu Movement */ .pushy-left { -webkit-transform: translate3d(-250px, 0, 0); -moz-transform: translate3d(-250px, 0, 0); -ms-transform: translate3d(-250px, 0, 0); -o-transform: translate3d(-250px, 0, 0); transform: translate3d(-250px, 0, 0); } .pushy-open { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .container-push, .push-push { -webkit-transform: translate3d(250px, 0, 0); -moz-transform: translate3d(250px, 0, 0); -ms-transform: translate3d(250px, 0, 0); -o-transform: translate3d(250px, 0, 0); transform: translate3d(250px, 0, 0); } /* Menu Transitions */ .pushy, #container, .push { -webkit-transition: -webkit-transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99); -moz-transition: -moz-transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99); transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99); /* improves performance issues on mobile*/ -webkit-perspective: 1000; } /* Site Overlay */ .site-overlay { display: none; } .pushy-active .site-overlay { display: block; position: fixed; top: 0; right: 0; bottom: 0; left: 250px; z-index: 9999; } .blog-header { padding-top: 2rem; padding-bottom: 2rem; } .blog-header.blog-header-image { background-size: cover; background-position: center; } .blog-header.blog-header-image h1, .blog-header.blog-header-image h2 { color: white; } .blog-header h1 { font-size: 4rem; margin-top: 0; } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { .blog-header h1 { font-size: 3rem; } } @media only all and (max-width: 47.938rem) { .blog-header h1 { font-size: 2.5rem; line-height: 1.2; margin-bottom: 2.5rem; } } .blog-header + .blog-content { padding-top: 3rem; } .list-item { border-bottom: 1px solid #eeeeee; margin-bottom: 3rem; } .list-item:last-child { border-bottom: 0; } .list-item .list-blog-header { position: relative; } .list-item .list-blog-header h4 { margin-bottom: 0.5rem; } .list-item .list-blog-header h4 a { color: #444444; } .list-item .list-blog-header h4 a:hover { color: #1bb3e9; } .list-item .list-blog-header img { display: block; margin-top: 1rem; border-radius: 3px; } .list-item .list-blog-date { float: right; text-align: center; } .list-item .list-blog-date span { display: block; font-size: 1.75rem; font-weight: 600; line-height: 110%; } .list-item .list-blog-date em { display: block; border-top: 1px solid #eeeeee; font-style: normal; text-transform: uppercase; } .blog-content-item .list-blog-padding > p:nth-child(2) { font-size: 1.2rem; } .tags a { display: inline-block; font-size: 0.8rem; border: 1px solid #1bb3e9; border-radius: 3px; padding: 0.1rem 0.4rem; margin-bottom: 0.2rem; text-transform: uppercase; } .archives { padding: 0; list-style: none; } .archives li { border-bottom: 1px solid #eeeeee; line-height: 2rem; } .archives li:last-child { border-bottom: 0; } .syndicate a { margin-bottom: 1rem; } div#breadcrumbs { padding-left: 0; } #sidebar { padding-left: 3rem; } @media only all and (max-width: 47.938rem) { #sidebar { padding-left: 0; } } #sidebar .sidebar-content { margin-bottom: 3rem; } #sidebar .sidebar-content h4 { margin-bottom: 1rem; } #sidebar .sidebar-content p, #sidebar .sidebar-content ul { margin-top: 1rem; } ul.pagination { margin: 0 0 3rem; text-align: left; } #error { text-align: center; display: flex; align-items: center; justify-content: center; height: 100%; padding-bottom: 6rem; } #error h1 { font-size: 5rem; } #error p { margin: 1rem 0; } .modular.header-image #body > .showcase { margin-top: -9.5rem; padding-top: 9rem; } .modular.header-image #header { background-color: rgba(255, 255, 255, 0); box-shadow: none; } .modular.header-image #header #logo h3 { color: white; } .modular.header-image #header #navbar a { color: white; } .modular .showcase { padding-top: 4rem; padding-bottom: 4rem; background-color: #666; background-size: cover; background-attachment: fixed; background-position: center; text-align: center; color: white; } .modular .showcase h1 { font-size: 4rem; margin-top: 0; } @media only all and (min-width: 48rem) and (max-width: 59.938rem) { .modular .showcase h1 { font-size: 3rem; } } @media only all and (max-width: 47.938rem) { .modular .showcase h1 { font-size: 2.5rem; line-height: 1.2; margin-bottom: 2.5rem; } } .modular .showcase .button { color: white; padding: 0.7rem 2rem; margin-top: 2rem; background: rgba(255, 255, 255, 0); border: 1px solid white; border-radius: 3px; box-shadow: none; font-size: 1.3rem; } .modular .showcase .button:hover { background: rgba(255, 255, 255, 0.2); } .modular .features { padding: 3rem 0; text-align: center; } .modular .features:after { content: ""; display: table; clear: both; } .modular .features h2 { margin: 0; line-height: 100%; } .modular .features p { margin: 1rem 0; font-size: 1.2rem; } @media only all and (max-width: 47.938rem) { .modular .features p { font-size: 1rem; } } .modular .features .feature-items { margin-top: 2rem; } .modular .features .feature { display: block; float: left; width: 25%; vertical-align: top; margin-top: 2rem; margin-bottom: 1rem; } @media only all and (max-width: 47.938rem) { .modular .features .feature { width: 100%; } } .modular .features .feature i.fa { font-size: 2rem; color: #1bb3e9; } .modular .features .feature h4 { margin: 0; font-size: 1.1rem; } .modular .features .feature p { display: inline-block; font-size: 1rem; margin: 0.2rem 0 1rem; } .modular .features.big { text-align: center; } .modular .features.big .feature { width: 50%; } .modular .features.big i.fa { font-size: 3rem; float: left; } .modular .features.big .feature-content { padding-right: 2rem; } .modular .features.big .feature-content.push { margin-left: 5rem; } .modular .features.big .feature-content h4 { font-size: 1.3rem; text-align: left; } .modular .features.big .feature-content p { padding: 0; text-align: left; } .callout { background: #f6f6f6; padding: 3rem 0.938rem; } .callout .align-left { float: left; margin-right: 2rem; } .callout .align-right { float: right; margin-left: 2rem; } .callout img { border-radius: 3px; } .modular .modular-row:last-child { margin-bottom: 2rem; } /*# sourceMappingURL=template.css.map */