/* ============================================================================= Site Styles ========================================================================== */ body { #slider { background: url('../images/Waves.png'), linear-gradient(#ADB3D4 0%, #DFDFE6 100%); border-bottom: 0.200em solid #21283C; padding: 4.000em 0; background-size: cover; background-repeat: no-repeat; h1 { font-size: 4.750em; font-weight: 700; color: #384567; margin-bottom: 0; text-transform: uppercase; } h2 { margin-top: 0; font-weight: 200; font-size: 3.250em; color: #FFFFFF; text-transform: uppercase; line-height: 0.908em; } a { &.button { margin-top: 0; font-weight: 700; font-size: 1.500em; color: #FFFFFF; text-transform: uppercase; line-height: 1.500em; background-color: #9BA8CC; } } } // slider #product { hr { clear: both; width: 100%; border: 0; border-bottom: 2px solid #21283C; margin: 3em 0; } h3 { font-size: 2.500em; text-transform: uppercase; color: #9BA8CC; line-height: 1em; font-weight: 200; margin: 0; &::first-line { font-weight: 700; color: #384567; } } .downloads { p { font-size: 1.500em; line-height: 2em; font-weight: 200; margin: 0; } a { font-weight: 200; text-decoration: none; color: #384567; &.flag { width: 1.8em; height: 1.2em; overflow: hidden; border-radius: 0.4em; baseline-shift: -5em; position: relative; display: inline-block; background-repeat: no-repeat; background-size: cover; background-position: center center; top: 0.2em; &.EN { background-image: url('../images/flags/EN.png'); } &.IT { background-image: url('../images/flags/IT.png'); } } } } p { font-size: 1em; line-height: 1.350em; color: #21283C; } ul { margin: 0; list-style-image: url('../images/CheckSign.png'); padding-left: 1.350em; li { font-size: 1em; color: #21283C; padding-left: 0.750em; margin-bottom: 0.750em; } } } //content } // body /* ============================================================================= From 1200 to 970 ========================================================================== */ @media only screen and (max-width: 1195px) and (min-width: 970px) { body { } // body } /* ============================================================================= From 970 to 600 ========================================================================== */ @media only screen and (max-width: 969px) and (min-width: 600px) { body { } // body } /* ============================================================================= From 600 to 480 ========================================================================== */ @media only screen and (max-width: 600px) and (min-width: 480px) { body { } // body } /* ============================================================================= Less than 480px ========================================================================== */ @media only screen and (max-width: 479px) { body { } // body }