Revision 33868
Added by Katerina Iatropoulou over 9 years ago
| responsive.css | ||
|---|---|---|
| 1 |
/* Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */
|
|
| 1 |
@import url(../../../css/responsive.css);
|
|
| 2 | 2 |
|
| 3 |
@import url(../warp/css/responsive.css); |
|
| 4 |
|
|
| 5 |
|
|
| 6 |
/* Breakpoints |
|
| 7 |
----------------------------------------------------------------------------------------------------*/ |
|
| 8 |
|
|
| 9 |
/* Only Desktop */ |
|
| 10 | 3 |
@media (min-device-width: 1025px) and (min-width: 960px) {
|
| 11 | 4 |
|
| 12 | 5 |
#block-header, |
| 13 |
.fixed-header #block-top-a {
|
|
| 6 |
.fixed-header #block-top-a, |
|
| 7 |
.fixed-header #block-top-c |
|
| 8 |
{
|
|
| 14 | 9 |
position: fixed; |
| 15 | 10 |
top: 0; |
| 16 | 11 |
width: 100%; |
| ... | ... | |
| 22 | 17 |
#block-header { z-index: 10; }
|
| 23 | 18 |
|
| 24 | 19 |
.fixed-header #block-top-a { z-index: 0; }
|
| 20 |
.fixed-header #block-top-c { z-index: 0; }
|
|
| 25 | 21 |
|
| 22 |
|
|
| 26 | 23 |
/* Margins */ |
| 24 |
#block-header + #block-top-c, |
|
| 27 | 25 |
#block-header + #block-top-a, |
| 28 |
#block-main { margin-top: 80px; }
|
|
| 26 |
#block-main { margin-top: 120px; }
|
|
| 29 | 27 |
|
| 30 | 28 |
.fixed-toolbar #block-top-a { margin-top: 36px; }
|
| 31 | 29 |
|
| 30 |
|
|
| 32 | 31 |
.fixed-toolbar #block-header + #block-top-a, |
| 33 |
.fixed-toolbar #block-header + #block-main { margin-top: 116px; }
|
|
| 32 |
.fixed-toolbar #block-header + #block-top-c, |
|
| 33 |
.fixed-toolbar #block-header + #block-main { margin-top: 151px; }
|
|
| 34 | 34 |
|
| 35 | 35 |
#block-top-a + #block-main { margin-top: 0; }
|
| 36 |
#block-top-c + #block-main { margin-top: 0; }
|
|
| 36 | 37 |
|
| 37 |
} |
|
| 38 |
|
|
| 39 |
/* No Desktop */ |
|
| 40 |
@media (max-width: 959px) {
|
|
| 41 |
|
|
| 42 |
#page.fixed-header #block-top-a { height: auto; }
|
|
| 43 |
|
|
| 44 |
#page.fixed-header #block-top-a, |
|
| 45 |
#page.fixed-header #block-main { margin-top: 0; }
|
|
| 46 |
|
|
| 47 |
#top-a, |
|
| 48 |
#block-main, |
|
| 49 |
#block-bottom, |
|
| 50 |
#block-footer { padding: 15px; }
|
|
| 51 |
|
|
| 52 |
#block-headerbar > .wrapper { padding: 0 15px; }
|
|
| 53 |
|
|
| 54 |
#block-toolbar { padding: 5px 15px; }
|
|
| 55 |
|
|
| 56 |
} |
|
| 57 |
|
|
| 58 |
/* No Touch Devices */ |
|
| 59 |
@media (max-device-width: 1024px) {
|
|
| 60 |
|
|
| 61 |
#page.fixed-header #block-top-a { height: auto; }
|
|
| 62 |
|
|
| 63 |
#page.fixed-header #block-top-a, |
|
| 64 |
#page.fixed-header #block-main { margin-top: 0; }
|
|
| 65 |
|
|
| 66 |
.featured-spotlight .overlay { background: none; }
|
|
| 67 |
|
|
| 68 |
} |
|
| 69 |
|
|
| 70 |
/* All except large Screens */ |
|
| 71 |
@media (max-width: 1220px) {
|
|
| 72 |
|
|
| 73 |
.wrapper.max-width80 {
|
|
| 74 |
max-width: 100%; |
|
| 75 |
padding-left: 10px; |
|
| 76 |
padding-right: 10px; |
|
| 77 |
} |
|
| 78 |
|
|
| 79 |
} |
|
| 80 |
|
|
| 81 |
/* Only Phones and Tablets (Portrait) */ |
|
| 82 |
@media (max-width: 959px) {
|
|
| 83 |
|
|
| 84 |
} |
|
| 85 |
|
|
| 86 |
/* Only Tablets (Portrait) */ |
|
| 87 |
@media (min-width: 768px) and (max-width: 959px) {
|
|
| 88 |
|
|
| 89 |
} |
|
| 90 |
|
|
| 91 |
/* Only Tablets (Portrait) and Phones (Landscape) */ |
|
| 92 |
@media (min-width: 480px) and (max-width: 959px) {
|
|
| 93 |
|
|
| 94 |
/* Layout */ |
|
| 95 |
#search { display: none; }
|
|
| 96 |
|
|
| 97 |
} |
|
| 98 |
|
|
| 99 |
/* Only Phones */ |
|
| 100 |
@media (max-width: 767px) {
|
|
| 101 |
|
|
| 102 |
/* Layout */ |
|
| 103 |
#block-toolbar, |
|
| 104 |
#headerbar, |
|
| 105 |
#menubar, |
|
| 106 |
#breadcrumbs, |
|
| 107 |
#logo { display: none; }
|
|
| 108 |
|
|
| 109 |
#block-headerbar > .wrapper { padding-bottom: 15px; }
|
|
| 110 |
|
|
| 111 |
.wrapper.max-width80 {
|
|
| 112 |
padding-left: 0; |
|
| 113 |
padding-right: 0; |
|
| 114 |
} |
|
| 115 |
|
|
| 116 |
#header-responsive .searchbox { margin: 0; }
|
|
| 117 |
|
|
| 118 |
.menu-responsive { margin-bottom: 5px; }
|
|
| 119 |
|
|
| 120 |
} |
|
| 121 |
|
|
| 122 |
/* Only Phones (Landscape) */ |
|
| 123 |
@media (min-width: 480px) and (max-width: 767px) {
|
|
| 124 |
|
|
| 125 |
} |
|
| 126 |
|
|
| 127 |
/* Only Phones (Portrait) */ |
|
| 128 |
@media (max-width: 479px) {
|
|
| 129 |
|
|
| 130 |
/* System */ |
|
| 131 |
#system .items .item, |
|
| 132 |
#system .items .item:first-child, |
|
| 133 |
#page #system .items.gridalicious .item:first-child {
|
|
| 134 |
margin-top: 12px; |
|
| 135 |
padding-top: 18px; |
|
| 136 |
border-top-width: 1px; |
|
| 137 |
} |
|
| 138 |
|
|
| 139 |
#system .items:first-child .item:first-child {
|
|
| 140 |
margin-top: 0; |
|
| 141 |
border-width: 0; |
|
| 142 |
} |
|
| 143 |
|
|
| 144 |
#system .items .leading .item { border-width: 0; }
|
|
| 145 |
|
|
| 146 |
#system .item > .links a { margin-right: 5px; }
|
|
| 147 |
|
|
| 148 | 38 |
} |
Also available in: Unified diff
latest template for openaire - synchronised with beta