/******************************* Global *******************************/ html, body { font-size: 15px; height: 100%; } body { font-family: "Open Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif; background: #FFFFFF; margin: 0px; padding: 0px; color: #555555; text-rendering: optimizeLegibility; min-width: 320px; } /******************************* UI Overrides *******************************/ .ui.header { font-family: 'Source Sans Pro', "Helvetica Neue", "Helvetica", "Arial", sans-serif; } .ui.header, h1, h2 { font-weight: normal !important; } h1.ui.header { font-size: 3em; } h4.ui.header, h5.ui.header, .ui.icon.header { font-weight: bold !important; } .ui.button { font-weight: normal; text-decoration: none; } a { color: #009FDA; text-decoration: none; -webkit-transition: color 0.3s ease; transition: color 0.3s ease; } a:hover { color: #00BAFF; } p a { font-weight: bold; } /******************************* Global *******************************/ .menu .right.menu > .mobile.item { display: none; } .ui.page.grid.segment { padding-top: 3.5rem; padding-bottom: 3.5rem; } .masthead.segment { background-image: url(images/bg.jpg); -webkit-background-size: cover; background-size: cover; margin: 0em; padding-top: 4rem; overflow: hidden; -webkit-box-shadow: 0 -20px 10px 0 rgba(0, 0, 0, 0.1) inset !important; box-shadow: 0 -20px 10px 0 rgba(0, 0, 0, 0.1) inset !important; } .masthead.segment .column { position: relative; } .masthead.segment .information { margin: 3em 1em 1em 280px; } .masthead.segment .information p { max-width: 600px; margin: 0em 0px 2em 0em; font-size: 1.2em; } .masthead.segment h1.ui.header .sub { font-size: 0.7em; } .masthead.segment .image { position: absolute; left: 0%; bottom: -110px; } .overview .divided.grid .header + p { min-height: 100px; } .ui.shape .icon, .link.list .icon { margin: 0em; padding: 0em; } .ui.cube.shape .side { background-color: transparent; } /******************************* Responsive *******************************/ /* Mobile Only */ @media only screen and (max-width : 768px) { .ui.page.grid.segment { padding-top: 2rem; padding-bottom: 2rem; } .menu .right.menu > .item { display: none; } .menu .right.menu > .mobile.item { display: block; } h1.ui.header { font-size: 1.5em; } .masthead.segment { -webkit-background-size: auto; background-size: auto; } .masthead.segment .information { margin-left: 190px; } .masthead.segment .image { bottom: -65px; width: 150px; } .masthead.segment .button { font-size: 1rem; } .overview .divided.grid .header .icon { font-size: 1.5em; } .overview .divided.grid .header + p { min-height: 0px; } .masthead.segment .column { font-size: 0.7rem; } .masthead.segment .column p { display: none; } .selection.list .right.floated { display: none; } } @media only screen and (max-width : 1000px) { } .screenshot { background-size: cover; background-image: url('screenshot.png') !important; background-position: 0 -40px; margin: 0 !important; border-radius: 0 !important; } .page.segment { margin: 0 !important; } .background-image { position: fixed; left: 0; right: 0; z-index: 1; display: block; background-image: url('screenshot.png'); background-position: 0 -100px; width: 100%; height: 100%; -webkit-filter: blur(5px); -moz-filter: blur(5px); -o-filter: blur(5px); -ms-filter: blur(5px); filter: url(blur.svg#blur); } .content { position: fixed; left: 0; right: 0; z-index: 9999; margin-left: 20px; margin-right: 20px; } .ui.relaxed.segment { padding-top: 0 !important; }