File: D:/HostingSpaces/SBogers10/tops.komma.pro/wwwroot/public/css/screen.css
html {
width: 100%;
height: 100%;
}
body {
position: relative;
overflow-y: scroll;
margin: 0;
min-width: 1000px;
width: 100%;
min-height: 100%;
color: #555F68;
font-size: 13px;
font-family: 'Proxima N W02 Reg', sans-serif;
line-height: 1.538461538;
letter-spacing: .02em;
-webkit-overflow-scrolling: touch;
}
a {
text-decoration: none;
color: #387CE3;
}
h1 {
margin: 0 0 .5em 0;
color: #387CE3;
font-size: 1.615384615em;
font-weight: normal;
}
h2 {
margin: 1.733333333em 0 .866666667em 0;
color: #387CE3;
font-size: 1.153846154em;
font-weight: normal;
font-family: 'Proxima N W02 Smbd', sans-serif;
}
img {
border: none;
}
strong {
color: #454F56;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-weight: normal;
}
figure {
position: relative;
margin: 0;
width: 100%;
height: 100%;
}
p a {
text-decoration: underline;
}
/* Global Classes */
.clear {
display: block;
clear: both;
}
.sprite {
background: url('../images/structure/tops_sprite.png');
}
::selection {
background: #387CE3;
color: #fff;
}
::-moz-selection {
background: #387CE3;
color: #fff;
}
/* Structure */
#scroller {
position: relative;
top: 0;
left: 0;
width: 100%;
}
#wrapper {
position: fixed;
top: 60px;
left: 0;
min-width: 1000px;
width: 100%;
}
#main {
position: absolute;
top: 0;
left: 0;
width: 100%;
min-height: 100%;
}
#content_area {
position: relative;
z-index: 10;
margin: 0 auto;
width: 980px;
-webkit-transition: width 300ms;
transition: width 300ms;
}
#content_area .shadow.vertical {
position: absolute;
z-index: 200;
top: 0;
right: 0;
width: 10px;
height: 100%;
background: url('../images/structure/sdw_left_o20_w10.png') repeat-y;
}
.mobile {
display: none;
}
/* Header */
header.main {
position: fixed;
top: 0;
left: 0;
z-index: 150;
min-width: 1000px;
width: 100%;
height: 60px;
background: #387CE3;
}
header.main .shadow {
position: absolute;
left: 0;
z-index: 100;
bottom: -10px;
width: 100%;
height: 10px;
background: url('../images/structure/sdw_down_o20_h10.png') repeat-x;
}
header.main .lang_holder {
position: absolute;
right: 30px;
top: 50%;
margin-top: -9px;
}
header.main .lang_holder ul {
margin: 0;
padding: 0;
list-style: none;
}
header.main .lang_holder li {
display: block;
float: left;
opacity: 0.5;
filter: alpha(opacity=50);
}
header.main .lang_holder li a {
display: block;
color: #fff;
padding-left: 3px;
width: 21px;
height: 16px;
border-bottom: 2px solid #fff;
}
header.main .lang_holder .active {
opacity: 1;
filter: alpha(opacity=100);
}
#logo_holder {
float: left;
width: 183px;
height: 100%;
border-right: 1px solid #6398E6;
-webkit-transition: background 200ms;
transition: background 200ms;
}
#logo_holder a {
display: block;
padding: 14px 30px 14px 20px;
width: 133px;
height: 32px;
}
#logo_holder a:hover {
background: #1F58DF;
}
#logo {
display: block;
width: 133px;
height: 32px;
}
#logo img {
height: 100%;
}
/* Main Menu */
nav.main ul {
display: block;
float: left;
margin: 0;
padding: 0;
list-style: none;
}
nav.main li {
float: left;
height: 60px;
border-right: 1px solid #6398E6;
line-height: 60px;
}
nav.main a {
display: block;
padding: 0 30px;
height: 60px;
color: #fff;
font-size: .923076923em;
font-family: 'Proxima N W02 Smbd', sans-serif;
text-transform: uppercase;
letter-spacing: .04em;
-webkit-transition: background 200ms;
transition: background 200ms;
}
nav.main .active a {
background: #fff;
color: #387CE3;
}
nav.main li:not(.active):hover a {
background: #1F58DF;
}
/* Aside Call to action */
#aside_cta {
position: fixed;
top: 120px;
right: 0;
width: 40px;
z-index: 1000;
}
#aside_cta ul,
#home #slider_nav {
position: relative;
margin: 0;
padding: 0;
width: 300px;
list-style: none;
}
#aside_cta li,
#home #slider_nav li {
position: relative;
left: 0;
padding: 0;
margin-bottom: 2px;
width: 100%;
height: 40px;
white-space: nowrap;
-webkit-transition: left 300ms;
transition: left 300ms;
}
#aside_cta li a {
display: inline-block;
background: #fff;
width: auto;
height: 40px;
-webkit-transition: background 300ms;
transition: background 300ms;
}
#aside_cta li .text {
display: inline;
float: left;
padding-right: 40px;
color: #fff;
line-height: 42px;
font-family: 'Proxima N W02 Smbd', sans-serif;
}
#aside_cta li .icon {
display: block;
position: relative;
float: left;
width: 40px;
height: 40px;
}
#aside_cta li .icon span {
display: block;
position: absolute;
top: 50%;
left: 50%;
background: url('../images/structure/tops_sprite.png');
}
#aside_cta li .icon .up {
position: relative;
-webkit-transition: opacity 300ms;
transition: opacity 300ms;
}
#aside_cta li .icon .hover {
z-index: 5;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 300ms;
transition: opacity 300ms;
}
#aside_cta li .phone span {
margin: -8px 0 0 -3px;
width: 7px;
height: 16px;
}
#aside_cta li .phone .up {
background-position: -220px -10px;
}
#aside_cta li .phone .hover {
background-position: -220px -30px;
}
#aside_cta li .mail span {
margin: -6px 0 0 -8px;
width: 17px;
height: 13px;
}
#aside_cta li .mail .up {
background-position: -240px -10px;
}
#aside_cta li .mail .hover {
background-position: -240px -30px;
}
#aside_cta li .offer span {
margin: -9px 0 0 -6px;
width: 15px;
height: 18px;
}
#aside_cta li .offer .up {
background-position: -270px -10px;
}
#aside_cta li .offer .hover {
background-position: -270px -30px;
}
#aside_cta li:hover a {
background: #387CE3;
}
#aside_cta li:hover .icon .hover {
opacity: 1;
filter: alpha(opacity=100);
}
#aside_cta li:hover .icon .up {
opacity: 0;
filter: alpha(opacity=0);
}
#home #slider_nav {
position: fixed;
top: 320px;
right: 0;
width: 40px;
z-index: 1000;
-webkit-transition: opacity 300ms;
transition: opacity 300ms;
}
#home #slider_nav li span {
display: block;
width: 40px;
height: 40px;
background: #fff;
color: #387CE3;
font-family: 'Proxima N W02 Smbd', sans-serif;
text-align: center;
line-height: 40px;
-webkit-transition: all 300ms;
transition: all 300ms;
}
#home #slider_nav li.active span {
color: #FF8600;
}
#home #slider_nav:not(.disabled) li:not(.active) span:hover {
background: #387CE3;
color: #fff;
cursor: pointer;
}
#home #slider_nav.disabled {
opacity: 0.5;
filter: alpha(opacity=50);
}
/* Footer */
footer {
position: fixed;
bottom: 0;
left: 0;
z-index: 150;
overflow: hidden;
min-width: 1000px;
width: 100%;
height: 2.307692308em;
}
footer .inner {
position: absolute;
bottom: 0;
width: 100%;
height: 21em;
background: #387CE3;
}
footer .shadow {
position: absolute;
left: 0;
top: 0;
z-index: 100;
width: 100%;
height: 10px;
background: url('../images/structure/sdw_down_o20_h10.png') repeat-x;
}
footer .copyright,
footer .komma {
position: absolute;
bottom: 6px;
color: #C4D8F6;
font-size: .846153846em;
text-transform: uppercase;
}
footer .copyright {
left: 20px;
}
footer .komma {
right: 20px;
color: #fff;
opacity: 0.7;
filter: alpha(opacity=70);
-webkit-transition: opacity 300ms;
transition: opacity 300ms;
}
footer .komma .logo {
display: inline-block;
position: relative;
top: 2px;
margin-right: 4px;
width: 12px;
height: 12px;
background: url('../images/structure/tops_sprite.png');
background-position: -270px -110px;
}
footer .komma:hover {
opacity: 1;
filter: alpha(opacity=100);
}
footer .content {
margin: 0 auto;
width: 780px;
color: #C4D8F6;
}
footer .content .col {
display: block;
float: left;
margin: 0;
padding: 0;
width: 195px;
list-style: none;
}
footer .content .col.three {
width: 585px;
}
footer .content .col.four {
width: 780px;
}
footer .content .col.title {
margin: 20px 0 10px 0;
border-bottom: 1px solid #6398E6;
color: #fff;
font-size: .846153846em;
font-family: 'Proxima N W02 Smbd', sans-serif;
text-transform: uppercase;
}
footer .content a {
color: #C4D8F6;
-webkit-transition: color 200ms;
transition: color 200ms;
}
footer .content a:hover {
color: #fff;
}
.footer_btn {
display: block;
position: fixed;
bottom: 19px;
left: 50%;
overflow: hidden;
z-index: 2000;
margin-left: -11px;
width: 22px;
height: 22px;
cursor: pointer;
}
.footer_btn .arrow {
display: block;
position: absolute;
top: 50%;
left: 50%;
margin: -4px 0 0 -5.5px;
z-index: 10;
width: 10px;
height: 6px;
background: url('../images/structure/tops_sprite.png');
background-position: -279px -88px;
-webkit-transition: top 300ms;
transition: top 300ms;
}
.footer_btn .arrow.hover {
top: 150%;
}
.footer_btn .bg {
display: block;
position: absolute;
top: 0;
left: 0;
width: 22px;
height: 22px;
background: url('../images/structure/tops_sprite.png');
background-position: -189px -10px;
-webkit-transition: opacity 300ms;
transition: opacity 300ms;
}
.footer_btn .bg.hover {
opacity: 0;
filter: alpha(opacity=0);
z-index: 5;
background: url('../images/structure/tops_sprite.png');
background-position: -250px -150px;
}
.footer_btn:hover .arrow {
top: -50%;
}
.footer_btn:hover .arrow.hover {
top: 50%;
}
.footer_btn:hover .bg {
opacity: 0;
filter: alpha(opacity=0);
}
.footer_btn:hover .bg.hover {
opacity: 1;
filter: alpha(opacity=100);
}
/* Backgrounds */
#ambiance {
position: fixed;
top: 60px;
left: 0;
z-index: 100;
overflow: hidden;
height: 100%;
-webkit-transition: left 300ms;
transition: left 300ms;
}
#ambiance img {
position: absolute;
top: 0;
left: 50%;
height: 100%;
}
#ambiance .shadow {
position: absolute;
z-index: 100;
top: 0;
right: 0;
width: 10px;
height: 100%;
background: url('../images/structure/sdw_left_o20_w10.png') repeat-y;
}
#pattern {
position: fixed;
top: 60px;
right: 0;
height: 100%;
background: url('../images/structure/pattern.jpg');
-webkit-transition: right 300ms;
transition: right 300ms;
}
/* Submenu */
#submenu {
position: absolute;
top: 0;
left: -110px;
width: 220px;
min-height: 100%;
background: #387CE3;
color: #fff;
-webkit-transition: left 300ms;
transition: left 300ms;
opacity: 0;
filter: alpha(opacity=0);
}
#submenu .head_title {
display: block;
padding-left: 40px;
width: 180px;
height: 59px;
border-bottom: 1px solid #76A5E8;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: 1.153846154em;
line-height: 60px;
}
#submenu ul {
margin: 0;
padding: 0;
list-style: none;
}
#submenu ul li {
position: relative;
overflow: hidden;
border-bottom: 1px solid #4F8BE3;
-webkit-transition: background 300ms;
transition: background 300ms;
}
#submenu ul li .title {
display: block;
position: relative;
padding-left: 40px;
width: 180px;
height: 39px;
color: #fff;
font-family: 'Proxima N W02 Smbd', sans-serif;
line-height: 42px;
-webkit-transition: color 300ms;
transition: color 300ms;
}
#submenu ul li .shadow {
display: block;
position: absolute;
bottom: -10px;
left: 0;
width: 100%;
height: 10px;
background: url('../images/structure/sdw_down_o7_h10.png') repeat-x;
}
#submenu ul li ul {
display: none;
margin: 10px 0 20px 0;
padding: 0;
list-style: none;
}
#submenu ul li ul li {
border: none;
}
#submenu ul li ul li a {
display: block;
padding-left: 45px;
height: 30px;
color: #555F68;
line-height: 30px;
}
#submenu ul li ul li a:hover {
color: #387CE3;
}
#submenu ul li ul li.active a {
color: #387CE3;
font-family: 'Proxima N W02 Smbd', sans-serif;
}
#submenu ul li.active {
background: #F5F8FE;
}
#submenu ul li.active ul {
display: block;
}
#submenu ul li.active .title {
background: #fff;
color: #387CE3;
}
#submenu ul li:not(.active):hover {
background: #fff;
}
#submenu ul li:not(.active):hover .title {
color: #387CE3;
}
#submenu ul li:hover ul li:hover {
background: none;
}
/* Open Submenu */
.open_submenu #content_area {
width: 1200px;
}
.open_submenu #submenu {
left: 0;
opacity: 1;
filter: alpha(opacity=100);
}
.open_submenu #content {
margin-left: 220px;
}
.open_submenu #ambiance {
left: -110px;
}
.open_submenu #pattern {
right: -110px;
}
/* Content */
#content {
position: relative;
z-index: 10;
float: left;
width: 600px;
min-height: 100%;
background: #fff;
-webkit-transition: margin-left 300ms;
transition: margin-left 300ms;
}
#content .shadow.vertical {
position: absolute;
z-index: 10;
top: 0;
left: -10px;
width: 10px;
height: 100%;
background: url('../images/structure/sdw_left_o20_w10.png') repeat-y;
}
.breadcrumb {
margin-bottom: 30px;
padding-left: 100px;
width: 500px;
height: 4.538461538em;
border-bottom: 1px solid #DDDFE1;
line-height: 4.538461538;
white-space: nowrap;
}
.breadcrumb .logo {
display: inline-block;
width: 16px;
height: 10px;
background: url('../images/structure/tops_sprite.png');
background-position: -250px -110px;
}
.breadcrumb a {
color: #858585;
font-size: 10px;
text-transform: uppercase;
}
.breadcrumb .active {
color: #666;
font-family: 'Proxima N W02 Smbd', sans-serif;
}
.mobile_submenu {
display: none;
font-size: .846153846em;
padding-bottom: 15px;
border-bottom: 1px solid #DDDFE1;
}
.mobile_submenu ul {
display: inline;
margin: 0;
padding: 0;
list-style: none;
float: left;
}
.mobile_submenu li {
display: inline;
float: left;
margin-right: 10px;
}
.mobile_submenu .main {
font-weight: 600;
}
.mobile_submenu .active a {
color: #387CE3;
}
.mobile_submenu a {
color: #858585;
}
.mobile_submenu a:hover {
color: #387CE3;
}
#content_area article {
padding: 0 100px;
}
article h1 {
float: left;
width: 200px;
}
article h1.wide {
width: 100%;
}
article .intro {
font-family: 'Proxima N W02 Smbd', sans-serif;
}
article .btn {
float: right;
margin-bottom: 10px;
}
article .btn.left {
float: left;
}
ul.table {
float: left;
margin: 0;
padding: 0;
list-style: none;
border-top: 1px solid #DDDFE1;
}
ul.table li {
float: left;
padding: 10px 0;
border-bottom: 1px solid #DDDFE1;
}
ul.table li .prop {
display: block;
float: left;
width: 200px;
color: #387CE3;
font-size: 0.8em;
text-transform: uppercase;
}
ul.table li .value {
display: block;
float: left;
width: 200px;
font-size: 0.9em;
}
table.data_table {
width: 100%;
padding: 0;
margin: 30px 0 0 0;
font-size: 0.9em;
table-layout: fixed;
}
table.data_table tbody,
table.data_table tr {
width: 100%;
}
table.data_table tbody,
table.data_table tr,
table.data_table td {
margin: 0;
padding: 0;
box-sizing: border-box;
-moz-box-sizing: border-box;
vertical-align: top;
}
table.data_table tr.heading {
margin-bottom: 10px;
border-bottom: 1px solid #DDDFE1;
font-family: 'Proxima N W02 Smbd', sans-serif;
color: #387CE3;
}
table.data_table.equal_six td {
width: 16%;
}
form .input_holder {
position: relative;
float: left;
margin-bottom: 10px;
width: 100%;
height: auto;
}
form .input_holder label {
display: block;
position: relative;
top: 10px;
left: 0;
float: left;
margin-bottom: 0;
width: 30%;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: 0.9em;
line-height: 1;
outline: none;
}
form .input_holder input {
position: relative;
z-index: 5;
padding: 0 10px;
width: 70%;
height: 30px;
border: 1px solid #E0E6EC;
background: #fff;
color: #555F68;
font-family: 'Proxima N W02 Reg', sans-serif;
font-size: 13px;
line-height: 30px;
outline: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
form .input_holder textarea {
position: relative;
z-index: 5;
padding: 10px;
width: 70%;
height: 130px;
border: 1px solid #E0E6EC;
background: #fff;
color: #555F68;
font-family: 'Proxima N W02 Reg', sans-serif;
font-size: 13px;
outline: none;
box-sizing: border-box;
-moz-box-sizing: border-box;
resize: none;
}
form .input_holder .placeholder {
position: absolute;
top: 1px;
left: 33%;
z-index: 15;
color: #C2C5C6;
line-height: 30px;
}
form .input_holder .error {
position: absolute;
top: -15px;
left: 0;
display: block;
float: left;
margin-left: 30%;
width: 70%;
color: #F2303F;
font-size: 0.9em;
}
form .input_holder.focus input,
form .input_holder.focus textarea {
border: 1px solid #387CE3;
}
form .input_holder.focus .placeholder {
color: #9BA0AE;
}
form .input_holder.textarea_holder {
height: 150px;
}
form .input_holder.error {
margin-top: 15px;
}
form .input_holder.error input,
form .input_holder.error textarea {
border: 1px solid #F2303F;
}
form .input_holder.birthday {
display: none;
}
/* Filter dashboard */
.filters_holder {
padding: 0 100px;
border-top: 1px solid #DDDFE1;
}
.filters_holder h2 {
margin-bottom: 30px;
}
ul.filters {
position: relative;
float: left;
margin: 0 ;
padding: 0;
list-style: none;
}
ul.filters li {
position: relative;
overflow: hidden;
float: left;
margin-bottom: 20px;
margin-right: 40px;
width: 180px;
cursor: pointer;
}
ul.filters li figure {
position: relative;
overflow: hidden;
width: 180px;
height: 180px;
}
ul.filters li figure img {
position: relative;
width: 100%;
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
-webkit-transition: transform 200ms;
transition: transform 200ms;
}
ul.filters li .title {
margin-top: 10px;
color: #999FA4;
height: 20px;
width: 180px;
text-align: center;
}
ul.filters li .arrow {
position: absolute;
top: 50%;
left: 50%;
margin: -11px 0 0 -11px;
width: 22px;
height: 22px;
}
ul.filters li .arrow .bg {
background-position: -160px -10px;
width: 22px;
height: 22px;
-webkit-transition: opacity 200ms;
transition: opacity 200ms;
}
ul.filters li .arrow .bg_hover {
position: absolute;
top: 0;
left: 0;
z-index: 10;
width: 22px;
height: 22px;
background-position: -250px -150px;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: opacity 200ms;
transition: opacity 200ms;
}
ul.filters li .arrow .icon {
position: absolute;
top: 50%;
left: 50%;
z-index: 15;
margin: -5px 0 0 -3px;
width: 7px;
height: 11px;
background-position: -269px -129px;
-webkit-transition: left 200ms;
transition: left 200ms;
}
ul.filters li .arrow .icon_hover {
position: absolute;
top: 50%;
left: -50%;
z-index: 15;
margin: -5px 0 0 -3px;
width: 7px;
height: 11px;
background-position: -259px -129px;
-webkit-transition: left 200ms;
transition: left 200ms;
}
ul.filters li span {
display: block;
background: url('../images/structure/tops_sprite.png');
overflow: hidden;
}
ul.filters li:nth-child(2n) {
margin-right: 0;
}
ul.filters li:hover .arrow .bg {
opacity: 0;
filter: alpha(opacity=0);
}
ul.filters li:hover .arrow .bg_hover {
opacity: 1;
filter: alpha(opacity=100);
}
ul.filters li:hover .arrow .icon {
left: 150%;
}
ul.filters li:hover .arrow .icon_hover {
left: 50%;
}
ul.filters li:hover figure img {
-webkit-transform: scale(1.03);
-moz-transform: scale(1.03);
-ms-transform: scale(1.03);
-o-transform: scale(1.03);
transform: scale(1.03);
}
/* Button */
#content_area .btn,
#home .btn {
display: inline-block;
position: relative;
overflow: hidden;
height: 30px;
border-radius: 4px;
line-height: 32px;
}
#content_area .btn span,
#home .btn span {
display: block;
}
#content_area .btn .up,
#home .btn .up,
#content_area .btn .hover,
#home .btn .hover {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#content_area .btn .up,
#home .btn .up {
z-index: 1;
background: #FF8600;
}
#content_area .btn .hover,
#home .btn .hover {
z-index: 2;
background: #39E271;
top: -30px;
-webkit-transition: top 200ms;
transition: top 200ms;
}
#content_area .btn .arrow,
#home .btn .arrow {
display: inline-block;
position: relative;
top: 1px;
left: 0;
z-index: 5;
margin: 0 10px 0 -10px;
width: 13px;
height: 10px;
background: url('../images/structure/tops_sprite.png');
background-position: -190px -40px;
}
#content_area .btn .label,
#home .btn .label {
display: inline;
position: relative;
z-index: 5;
padding: 0 15px;
color: #fff;
font-size: 12px;
font-family: 'Proxima N W02 Smbd', sans-serif;
text-transform: uppercase;
letter-spacing: .04em;
white-space: nowrap;
}
#content_area .btn .label .arrow,
#home .btn .label .arrow {
position: relative;
top: 1px;
left: 0;
z-index: 5;
margin: 0 0 0 10px;
}
#content_area .btn input,
#home .btn input {
display: inline;
position: relative;
z-index: 5;
padding: 0 15px;
color: #fff;
border: none;
background: transparent;
font-size: 12px;
font-family: 'Proxima N W02 Smbd', sans-serif;
text-transform: uppercase;
letter-spacing: .04em;
white-space: nowrap;
cursor: pointer;
}
#content_area .btn:hover .hover,
#home .btn:hover .hover {
top: 0;
}
article .call_to_action {
display: block;
margin: 2.307692308em 0;
}
article .call_to_action .text {
float: left;
width: 200px;
color: #387CE3;
font-size: 1.538461538em;
line-height: 1.4;
}
/* Call Us */
.call_us {
margin-top: 60px;
padding: 40px 100px;
width: 400px;
border-top: 1px solid #DDDFE1;
}
.call_us .person {
float: left;
width: 180px;
}
.call_us .person img {
display: block;
position: relative;
top: -10px;
left: -10px;
float: left;
}
.call_us .person .info {
float: left;
margin-top: -10px;
padding: 0 0 10px 0;
width: 180px;
font-size: 1em;
font-weight: 600;
line-height: 1.2;
text-align: center;
}
.call_us .person .function {
color: #555F68;
font-size: .909090909em;
font-weight: 400;
}
.call_us .phone {
float: left;
margin-right: 40px;
width: 180px;
color: #387CE3;
font-size: 1.4em;
line-height: 1.4;
}
.call_us .phone .streamer {
display: block;
color: #555F68;
margin-bottom: 20px;
}
.call_us .phone strong.blue {
color: #387CE3;
}
.call_us .phone strong {
white-space: nowrap;
}
.call_us .phone a:not(.btn) {
text-decoration: underline;
}
.call_us .phone .btn {
margin-top: 20px;
}
#uses .call_us {
border-top: none;
margin-top: 0;
}
/* Sidebar */
#sidebar {
position: relative;
float: left;
width: 380px;
min-height: 100%;
background: #F5F3EF;
}
#sidebar .shadow.vertical {
position: absolute;
z-index: 100;
top: 0;
width: 10px;
height: 100%;
left: 0;
background: url('../images/structure/sdw_right_o20_w10.png') repeat-y;
}
#sidebar .call_to_action {
width: 100%;
height: 4.538461538em;
}
#sidebar .call_to_action .text {
display: block;
float: left;
padding: 15px 0 0 20px;
width: 50%;
height: 60px;
background: #387CE3;
color: #fff;
font-size: 1.153846154em;
line-height: 1.1;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
#sidebar .call_to_action .phone {
display: block;
float: left;
padding: 3px 0 0 20px;
width: 50%;
height: 60px;
background: #fff;
color: #FF8600;
line-height: 3.75;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: 1.230769231em;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
#sidebar .call_to_action .phone .icon {
display: inline-block;
position: relative;
top: 2px;
left: 0;
margin-right: 10px;
width: 7px;
height: 16px;
background: url('../images/structure/tops_sprite.png');
background-position: -250px -60px;
}
#sidebar #slider {
position: relative;
z-index: 150;
width: 380px;
height: 253px;
}
#sidebar #slider .images {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
list-style: none;
}
#sidebar #slider .images li {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
width: 100%;
height: 100%;
-webkit-transition: left 600ms;
transition: left 600ms;
}
#sidebar #slider .images li img {
position: absolute;
top: 50%;
left: 50%;
}
#sidebar #slider .images .new {
left: 100%;
}
#sidebar #slider .images .show {
left: 0;
}
#sidebar #slider .images .hide {
left: -100%;
}
#sidebar #slider_nav {
position: absolute;
top: 50%;
left: 0;
overflow: hidden;
margin: -20px 0 0 0;
padding: 0;
width: 100%;
height: 40px;
list-style: none;
-webkit-transition: opacity 600ms;
transition: opacity 600ms;
}
#sidebar #slider_nav .nav_btn {
position: absolute;
width: 40px;
height: 40px;
background: #fff;
cursor: pointer;
}
#sidebar #slider_nav .nav_btn .icon {
display: block;
position: absolute;
top: 50%;
left: 50%;
margin-left: -2px;
margin-top: -5px;
width: 4px;
height: 10px;
}
#sidebar #slider_nav.disabled {
opacity: 0.5;
filter: alpha(opacity=50);
}
#sidebar #next {
right: -40px;
-webkit-transition: right 200ms;
transition: right 200ms;
}
#sidebar #next .icon {
background: url('../images/structure/tops_sprite.png');
background-position: -250px -90px;
}
#sidebar #prev {
left: -40px;
-webkit-transition: left 200ms;
transition: left 200ms;
}
#sidebar #prev .icon {
background: url('../images/structure/tops_sprite.png');
background-position: -250px -130px;
}
#sidebar #slider:hover #next {
right: 0;
}
#sidebar #slider:hover #prev {
left: 0;
}
#sidebar span#phone_en {
font-size: 1em;
}
.go_to {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.go_to li {
width: 100%;
}
.go_to ul {
display: block;
margin: 0;
padding: 0;
list-style: none;
}
.go_to ul li {
display: block;
position: relative;
width: 100%;
height: 60px;
line-height: 60px;
background: #F7F7F7;
-webkit-transition: background 200ms;
transition: background 200ms;
}
.go_to ul li a {
display: block;
padding-left: 90px;
width: 290px;
height: 60px;
color: #666;
-webkit-transition: color 200ms;
transition: color 200ms;
}
.go_to ul li figure {
position: absolute;
top: 0;
left: 0;
z-index: 10;
width: 60px;
height: 60px;
}
.go_to ul li figure img {
width: 100%;
}
.go_to ul li .shadow {
display: block;
position: absolute;
left: 0;
z-index: 100;
bottom: -10px;
width: 100%;
height: 10px;
background: url('../images/structure/sdw_down_o7_h10.png') repeat-x;
}
.go_to ul li:hover {
background: #fff;
}
.go_to ul li:hover a {
color: #387CE3;
}
.go_to .title {
display: block;
padding-left: 20px;
width: 100%;
height: 40px;
background: #387CE3;
color: #fff;
font-size: 1.076923077em;
font-family: 'Proxima N W02 Smbd', sans-serif;
line-height: 40px;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
.go_to .title .shadow {
display: block;
position: absolute;
left: 0;
z-index: 100;
bottom: -10px;
width: 100%;
height: 10px;
background: url('../images/structure/sdw_down_o10_h10.png') repeat-x;
}
.go_to .certificate {
background: #74A2E6;
}
.go_to .certificate .icon {
display: block;
position: absolute;
top: 50%;
left: 50%;
margin: -11px 0 0 -8px;
width: 15px;
height: 22px;
background: url('../images/structure/tops_sprite.png');
background-position: -270px -60px;
}
.go_to .arrow {
display: block;
position: absolute;
top: 50%;
right: 20px;
margin-top: -5px;
width: 13px;
height: 10px;
background: url('../images/structure/tops_sprite.png');
background-position: -171px -40px;
}
.sitemap {
padding: 0 0 0 20px;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: 1.2em;
list-style: none;
}
.sitemap ul {
padding: 0;
font-family: 'Proxima N W02 Reg', sans-serif;
font-size: 1em;
}
.sitemap ul ul {
padding: 0 0 0 20px;
font-size: .9em;
list-style: disc;
}
.sitemap ul ul ul {
font-style: italic;
list-style: circle;
}
.quote_holder {
display: block;
margin: 30px 0;
color: #387CE3;
font-size: 1.1em;
}
.quote_holder strong {
color: #387CE3;
}
/* Home */
#home #cta {
display: block;
position: fixed;
bottom: 30px;
left: 0;
z-index: 1000;
margin: 0;
padding: 0;
min-width: 1000px;
width: 100%;
height: 240px;
list-style: none;
background: #fff;
}
#home #cta li {
display: block;
position: relative;
float: left;
width: 25%;
height: 100%;
}
#home #cta li a {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#home #cta li a:hover .btn .hover {
top: 0;
}
#home #cta li a:hover .title {
color: #39E271;
}
#home #cta .shadow {
display: block;
position: absolute;
top: 0;
right: -10px;
width: 10px;
height: 100%;
background: url('../images/structure/sdw_right_o20_w10.png') repeat-y;
}
#home #cta .title {
display: block;
margin: 40px;
color: #387CE3;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: 1.5em;
line-height: 1.428571429;
-webkit-transition: color 200ms;
transition: color 200ms;
}
#home #cta .offer .title {
color: #FF8600;
}
#home .offer .btn .up {
background: #FF8600;
}
#home .btn {
position: absolute;
bottom: 40px;
left: 40px;
}
#home .btn .up {
background: #387CE3;
}
#home #slider {
position: absolute;
top: 0;
left: 0;
overflow: hidden;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
list-style: none;
opacity: 0;
filter: alpha(opacity=0);
}
#home #slider li {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
#home #slider li figure {
position: absolute;
top: 100%;
left: 0;
z-index: 1;
margin: 0;
height: 100%;
width: 100%;
overflow: hidden;
-webkit-transition: top 750ms ease-in-out;
transition: top 750ms ease-in-out;
}
#home #slider li img {
position: absolute;
top: 0;
left: 50%;
width: 100%;
}
#home #slider li.new .text {
left: -500px;
}
#home #slider li.new figure {
top: -100%;
}
#home #slider li.show .text {
left: 120px;
}
#home #slider li.show figure {
top: 0;
}
#home #slider li.hide .text {
top: -500px;
}
#home #slider li.hide figure {
top: 100%;
}
#home #slider blockquote {
margin: 0;
background: none;
color: #387CE3;
font-size: 2.307692308em;
}
#home #slider blockquote .name {
display: block;
margin-top: 10px;
font-size: .555555556em;
font-weight: 600;
line-height: 1.2;
}
#home #slider blockquote .function {
display: block;
margin-bottom: -10px;
font-size: .444444444em;
line-height: 1.2;
}
#home #slider .text {
position: absolute;
top: 60px;
left: 120px;
z-index: 10;
width: 400px;
-webkit-transition: all 750ms ease-out;
transition: all 750ms ease-out;
}
#home #slider .btn {
position: relative;
bottom: auto;
left: auto;
margin-top: 30px;
}
#home .story {
position: relative;
z-index: 100;
margin: 300px 0 60px 120px;
width: 400px;
}
@media screen and (min-width: 1600px) {
#content {
width: 600px;
}
#content_area article {
padding: 0 100px;
width: 400px;
}
.call_us {
padding: 40px 100px;
width: 400px;
}
.breadcrumb {
padding: 0 100px;
width: 400px;
}
.filters_holder {
padding: 0 100px;
width: 400px;
}
/* Smaller sidebar */
#sidebar {
width: 480px;
}
.go_to .title {
padding-left: 20px;
}
.go_to ul li a {
padding-left: 90px;
width: 390px;
}
#sidebar #slider {
width: 480px;
height: 320px;
}
#content_area {
width: 1080px;
}
.open_submenu #content_area {
width: 1300px;
}
}
@media screen and (max-width: 1600px) {
nav.main a {
padding: 0 20px;
}
}
@media screen and (max-width: 1400px) {
nav.main a {
padding: 0 15px;
letter-spacing: 0;
}
#home #cta .title {
font-size: 1.3em;
}
}
@media screen and (max-width: 1250px) {
/* Alternative header */
header.main {
height: 80px;
}
#logo_holder a {
padding: 24px 30px 24px 20px;
}
#logo_holder a:hover {
background: transparent;
color: #fff;
}
nav.main ul {
margin-top: 15px;
}
nav.main li {
float: left;
margin: 0 0 10px 20px;
width: 150px;
height: 19px;
border-bottom: 1px solid #6398E6;
border-right: none;
line-height: 20px;
}
nav.main li:nth-child(5) {
clear: left;
}
nav.main a {
padding: 0;
height: 20px;
color: #C4D8F6;
letter-spacing: 0;
}
nav.main .active a {
background: none;
color: #fff;
border-bottom: 1px solid #fff;
}
nav.main li:not(.active):hover a {
background: transparent;
color: #fff;
}
#installation a {
font-size: .9em;
white-space: nowrap;
}
#wrapper,
#ambiance,
#pattern {
top: 80px;
}
/* Smaller content */
#content {
width: 500px;
}
#content_area article {
padding: 0 50px;
width: 400px;
}
.call_us {
padding: 40px 50px;
width: 400px;
}
.breadcrumb {
padding: 0 50px;
width: 400px;
}
.filters_holder {
padding: 0 50px;
width: 400px;
}
#content_area {
width: 880px;
}
.open_submenu #content_area {
width: 1100px;
}
/* Smaller submenu */
.open_submenu #content {
margin-left: 180px;
}
.open_submenu #ambiance {
left: -90px;
}
.open_submenu #pattern {
right: -90px;
}
#submenu {
left: -90px;
width: 180px;
}
#submenu .head_title {
padding-left: 15px;
width: 165px;
}
#submenu ul li .title {
padding-left: 15px;
width: 165px;
}
#submenu ul li ul li a {
padding-left: 15px;
}
/* Smaller sidebar */
/* Smaller sidebar */
#sidebar {
width: 280px;
}
.go_to .title {
padding-left: 20px;
}
.go_to ul li a {
padding-left: 90px;
width: 190px;
}
#sidebar #slider {
width: 280px;
height: 186.66666667px;
}
#sidebar .call_to_action .text {
padding: 15px 0 0 10px;
font-size: 1em;
}
#sidebar .call_to_action .phone {
padding: 3px 0 0 7px;
font-size: 1.076923077em;
}
#sidebar span#phone_en {
font-size: 0.8em;
}
/* Smaller content area */
#content_area {
width: 780px;
}
.open_submenu #content_area {
width: 960px;
}
/* Home */
#home #cta {
height: 200px;
}
#home .btn {
left: 20px;
bottom: 20px;
}
#home #cta .title {
margin: 20px;
}
#home .story {
margin: 300px 0 60px 40px;
}
#home #slider li.show .text {
left: 40px;
}
}
/* < 1000 */
@media screen and (max-width: 1000px) {
header.main {
display: none;
}
#wrapper,
#ambiance,
#pattern {
top: 60px;
}
body,
#wrapper {
min-width: 0;
}
#ambiance,
#pattern,
#submenu {
display: none;
}
#content_area {
margin: 0;
width: 100%;
}
.open_submenu #content_area {
margin: 0;
width: 100%;
}
.open_submenu #content {
margin-left: 0;
}
.mobile_submenu {
display: block;
}
#content {
width: 100%;
}
#content_area article {
padding: 0 -150%;
width: 400px;
}
.call_us {
padding: 40px -150%;
width: 400px;
}
.breadcrumb {
padding: 0 -150%;
width: 400px;
}
.filters_holder {
padding: 0 -150%;
width: 400px;
}
#content {
width: auto;
}
#content_area article {
margin: 0 auto;
padding: 0;
width: 400px;
}
.call_us {
margin: 0 auto 30px;
padding: 40px 0;
width: 400px;
}
.breadcrumb {
margin: 0 auto 30px auto;
padding: 0;
width: 400px;
}
.mobile_submenu {
margin: 15px auto 30px;
padding-left: 0;
width: 400px;
}
.filters_holder {
margin: 0 auto 30px auto;
padding: 0;
width: 400px;
}
/* Smaller sidebar */
#sidebar {
width: 300px;
}
.go_to .title {
padding-left: 20px;
}
.go_to ul li a {
padding-left: 90px;
width: 210px;
}
#sidebar #slider {
width: 300px;
height: 200px;
}
#home #slider {
position: relative;
overflow: hidden;
height: 320px;
}
#home #slider_nav {
position: fixed;
top: 120px;
}
#home .story {
position: relative;
width: 60%;
margin: 0 auto;
padding: 30px 0;
}
#home #cta {
position: relative;
bottom: 0;
z-index: 1;
margin: 0 20%;
min-width: 0;
width: 60%;
height: auto;
}
#home #cta li {
display: block;
position: relative;
float: none;
margin-bottom: 30px;
width: 100%;
height: auto;
border-bottom: 1px solid #F5F3EF;
}
#home #cta li a {
position: relative;
}
#home #cta .shadow {
display: none;
}
#home #cta .title {
position: relative;
margin: 0 0 20px;
padding-right: 30px;
}
#home #cta .btn {
position: relative;
left: 0;
bottom: 0;
margin-bottom: 20px;
}
footer {
min-width: 0;
}
footer .content {
width: 90%;
}
footer .content .col {
width: 25%;
font-size: .846153846em;
}
footer .content .col.three {
width: 75%;
}
.mobile {
display: block;
position: fixed;
top: 0;
left: 0;
z-index: 10000;
width: 100%;
}
.mobile header {
position: relative;
width: 100%;
height: 60px;
background: #387CE3;
}
.mobile .mobile_btn {
position: relative;
width: 60px;
height: 100%;
cursor: pointer;
}
.mobile .mobile_btn .icon {
display: block;
position: absolute;
top: 50%;
left: 50%;
background: url('/public/images/structure/mobile_sprite.png');
}
.mobile .mobile_btn.nav {
float: left;
border-right: 1px solid #6398E6;
}
.mobile .mobile_btn.nav .icon {
margin: -7px 0 0 -9px;
width: 18px;
height: 15px;
background-position: -10px -40px;
}
.mobile .mobile_btn.nav:hover:not(.selected) {
background: #fff;
}
.mobile .mobile_btn.nav:hover:not(.selected) .icon {
background-position: -10px -10px;
}
.mobile .mobile_btn.contact {
float: right;
border-left: 1px solid #6398E6;
}
.mobile .mobile_btn.contact .icon {
margin: -10px 0 0 -10px;
width: 20px;
height: 20px;
background-position: -70px -40px;
}
.mobile .mobile_btn.contact:hover:not(.selected) {
background: #fff;
}
.mobile .mobile_btn.contact:hover:not(.selected) .icon {
background-position: -70px -10px;
}
.mobile .mobile_btn.selected {
background: #fff;
}
.mobile .mobile_btn.selected .icon {
background-position: -40px -10px;
margin-top: -6px;
}
.mobile .mobile_btn.selected .icon:hover .icon {
background-position: -40px -10px;
margin-top: -6px;
}
.mobile .logo {
display: block;
position: absolute;
top: 50%;
left: 50%;
margin: -15px 0 0 -65px;
width: 133px;
height: 34px;
background: url('../images/structure/tops_sprite.png') -10px -10px;
}
.mobile .mb_content {
position: relative;
overflow-y: scroll;
}
.mobile .mb_content nav {
position: relative;
overflow: hidden;
height: 0;
}
.mobile .mb_content nav ul {
display: block;
margin: 0;
padding: 0;
width: 100%;
background: #F7F8F9;
}
.mobile .mb_content nav ul li {
display: block;
position: relative;
width: 100%;
}
.mobile .mb_content nav ul li .title {
display: block;
position: relative;
padding: 0 0 0 60px;
width: 100%;
height: 59px;
border-bottom: 1px solid #DFE5E9;
color: #575766;
font-size: 1.142857143em;
line-height: 60px;
box-sizing: border-box;
-moz-box-sizing: border-box;
cursor: pointer;
}
.mobile .mb_content nav ul li .title:hover {
background: #fff;
}
.mobile .mb_content nav ul li .title .dd_arrow {
display: block;
position: absolute;
left: 30px;
top: 50%;
margin: -2px 0 0 -5px;
width: 10px;
height: 6px;
background: url('/public/images/structure/mobile_sprite.png') -100px -10px;
}
.mobile .mb_content nav ul li.selected .title {
color: #387CE3;
}
.mobile .mb_content nav ul li.selected .title .dd_arrow {
background-position: -100px -24px;
}
.mobile .mb_content nav ul li.mb_dropdown {
display: block;
}
.mobile .mb_content nav ul li.mb_dropdown ul {
display: block;
position: relative;
overflow: hidden;
padding: 0;
height: 0;
}
.mobile .mb_content nav ul li.mb_dropdown ul li .title {
padding-left: 90px;
background: #fff;
color: #9999A2;
font-family: 'Proxima N W02 Smbd', sans-serif;
}
.mobile .mb_content nav ul li.mb_dropdown ul li .title .dd_arrow {
left: 65px;
background-position: -100px -10px;
}
.mobile .mb_content nav ul li.mb_dropdown ul li .title:hover {
background: #FBFBFC;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.selected .title {
color: #387CE3;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.selected .title .dd_arrow {
background-position: -100px -24px;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.mb_dropdown {
display: block;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.mb_dropdown ul {
display: block;
position: relative;
overflow: hidden;
padding: 0;
height: 0;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.mb_dropdown ul li .title {
padding-left: 120px;
height: 39px;
border-bottom: 1px solid #fff;
background: #EAEAEA;
color: #575765;
font-family: 'Proxima N W02 Reg', sans-serif;
line-height: 40px;
}
.mobile .mb_content nav ul li.mb_dropdown ul li.mb_dropdown ul li .title:hover {
background: #F7F8F9;
}
.mobile .mb_content #mobile_contact {
position: relative;
overflow: hidden;
height: 0;
background: #fff;
font-size: 1.142857143em;
}
.mobile .mb_content #mobile_contact .inner {
padding: 30px;
box-sizing: border-box;
-moz-box-sizing: border-box;
}
.mobile .mb_content #mobile_contact .inner .title {
display: block;
margin-bottom: 1em;
color: #387CE3;
font-size: 1.375em;
}
.mobile .mb_content #mobile_contact .inner .data_title {
display: inline-block;
width: 60px;
color: #387CE3;
font-family: 'Proxima N W02 Smbd', sans-serif;
font-size: .875em;
text-transform: uppercase;
}
.mobile .blur {
display: none;
position: fixed;
top: 0;
left: 0;
z-index: -1;
width: 100%;
background: #387CE3;
opacity: 0;
filter: alpha(opacity=0);
}
.mobile.phone .mb_content nav ul li .title:hover {
background: none;
}
.mobile.phone .mb_content nav ul li.mb_dropdown ul li .title:hover {
background: #fff;
}
.mobile.phone .mb_content nav ul li.mb_dropdown ul li.mb_dropdown ul li .title:hover {
background: #EAEAEA !important;
}
/* High Density */
}
@media screen and (max-width: 1000px) and only screen and (-webkit-min-device-pixel-ratio: 1.5), screen and (max-width: 1000px) and only screen and (min--moz-device-pixel-ratio: 1.5), screen and (max-width: 1000px) and only screen and (-o-min-device-pixel-ratio: 3/2), screen and (max-width: 1000px) and only screen and (min-device-pixel-ratio: 1.5) {
.mobile .logo {
background: url('../images/structure/tops_sprite_2x.png') -10px -10px;
background-size: 600px 360px;
}
.mobile header .mobile_btn .icon,
.mobile .mobile_btn.selected .icon {
background: url('/public/images/structure/mobile_sprite_2x.png');
background-size: 150px 70px;
}
}
/* < 750 */
@media screen and (max-width: 750px) {
#wrapper {
position: relative;
top: 0;
margin-top: 60px;
}
#content {
width: 100%;
}
#content_area article {
padding: 0 -150%;
width: 400px;
}
.call_us {
padding: 40px -150%;
width: 400px;
}
.breadcrumb {
padding: 0 -150%;
width: 400px;
}
.filters_holder {
padding: 0 -150%;
width: 400px;
}
/* Smaller sidebar */
#sidebar {
width: 100%;
}
.go_to .title {
padding-left: 20px;
}
.go_to ul li a {
padding-left: 90px;
width: 10%;
}
#sidebar #slider {
width: 100%;
height: 66.66666667%;
}
#main {
position: relative;
}
#scroller {
position: relative;
}
#wrapper {
position: relative;
}
.footer_btn {
display: none;
}
footer {
position: relative;
bottom: 0;
left: 0;
z-index: 150;
width: 100%;
height: 21em;
}
footer .inner {
position: relative;
bottom: 0;
width: 100%;
height: 21em;
background: #387CE3;
padding-bottom: 40px;
}
#home footer {
position: relative;
margin: 0;
}
#sidebar .call_to_action {
display: none;
}
#aside_cta {
display: none;
}
#home #slider {
height: 240px;
}
#home #slider .text {
top: 40px;
}
#home .story {
width: 80%;
}
#home #cta {
margin: 0 10%;
width: 80%;
}
.breadcrumb {
padding-top: 15px !important;
padding-bottom: 15px !important;
white-space: normal;
line-height: 1.2;
height: auto;
}
#content_area .btn,
#home .btn {
float: none;
}
#content_area .btn.left,
#home .btn.left {
float: none;
}
.call_us .phone {
margin-bottom: 30px;
}
.fake_padding {
display: none;
}
footer {
height: auto;
}
footer .inner {
height: auto;
}
}
/* < 500 */
@media screen and (max-width: 500px) {
#content {
width: 320px;
}
#content_area article {
padding: 0 10px;
width: 300px;
}
.call_us {
padding: 40px 10px;
width: 300px;
}
.breadcrumb {
padding: 0 10px;
width: 300px;
}
.filters_holder {
padding: 0 10px;
width: 300px;
}
footer .inner {
height: auto;
}
footer .content {
padding: 30px 0;
}
footer .content .col {
padding: .6em 0;
width: 100%;
font-size: 1em;
}
footer .content .col.title {
display: none;
}
footer .copyright,
footer .komma {
display: block;
position: relative;
top: 0;
left: 0;
margin-left: 5%;
}
footer .komma {
padding-bottom: 40px;
}
#home #slider {
height: 180px;
}
#home #slider blockquote {
font-size: 1.5em;
line-height: 1.2;
}
#home #slider blockquote .name {
font-size: .7em;
}
#home #slider blockquote .function {
font-size: .7em;
}
#home #slider_nav {
display: none;
}
}
@media screen and (max-height: 1035px) and (min-width: 1000px) {
#home #cta {
position: relative;
z-index: 1;
bottom: 0;
}
#home #cta li {
display: block;
position: relative;
float: left;
width: 25%;
height: 100%;
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
#scroller {
position: relative;
top: 0;
left: 0;
}
#wrapper {
position: relative;
top: 0;
left: 0;
}
#main {
position: relative;
top: 0;
left: 0;
}
.footer_btn {
display: none;
}
footer {
position: relative;
bottom: 0;
left: 0;
z-index: 150;
min-width: 0;
width: 100%;
height: auto;
}
footer .inner {
position: relative;
bottom: 0;
width: 100%;
height: auto;
background: #387CE3;
}
#home footer {
position: relative;
margin: 0;
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
body {
padding-top: 80px;
}
#home {
padding-bottom: 50px;
}
#pattern {
right: 0;
}
.open_submenu #pattern {
right: 0;
}
}
/* High Density */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (min-device-pixel-ratio: 1.5) {
.sprite {
background: url('../images/structure/tops_sprite_2x.png');
background-size: 600px 360px;
}
}
/* IPAD FIX */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
#home #slider {
margin-top: -480px;
}
#home .story {
margin-top: 480px;
}
}