Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- @-webkit-viewport { width: device-width; }
- @-moz-viewport { width: device-width; }
- @-ms-viewport { width: device-width; }
- @-o-viewport { width: device-width; }
- @-viewport { width: device-width; }
- *, .ipsApp input[type="search"] {
- -webkit-box-sizing: border-box;
- -moz-box-sizing: border-box;
- box-sizing: border-box;
- }
- html {
- min-height: 100%;
- position: relative;
- }
- body {
- font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
- font-size: 13px;
- line-height: 18px;
- color: {theme="text_color"};
- height: 100%;
- background-color: {theme="page_background"};
- background-image: url("https://i.imgur.com/GQf6AzS.jpg");
- background-repeat: no-repeat;
- background-attachment: fixed;
- }
- main {
- display: block;
- }
- .ipsLayout_noBackground {
- background: none;
- }
- body.ipsNoScroll {
- overflow: hidden;
- }
- a {
- color: {theme="link"};
- text-decoration: none;
- }
- a:hover {
- color: {theme="link_hover"};
- }
- a:active, a:focus, a:hover {
- outline: 0 !important;
- }
- img {
- vertical-align: middle;
- }
- .ipsApp fieldset {
- border: 0;
- }
- /* RTL flip FontAwesome arrows */
- html[dir="rtl"] i.fa[class$="-right"],
- html[dir="rtl"] i.fa[class$="-left"],
- html[dir="rtl"] i.fa[class$="-reply"],
- html[dir="rtl"] i.fa[class$="-forward"],
- html[dir="rtl"] i.fa[class$="-backward"] {
- {prefix="transform" value="scaleX(-1)"}
- filter: FlipH;
- -ms-filter: "FlipH";
- }
- /* HEADER & MAIN NAV */
- #elSiteTitle {
- color: #fff;
- font-size: 28px;
- line-height: 58px;
- text-decoration: none;
- font-weight: 300;
- -webkit-font-smoothing: antialiased;
- }
- #elLogo img {
- max-width: 100%;
- }
- #elMobileNav {
- background: {theme="main_nav"};
- }
- /*#ipsLayout_mainNav {
- margin: 0;
- padding: 0;
- }
- #ipsLayout_mainNav > li {
- display: inline-block;
- float: left;
- line-height: 46px;
- }*/
- #ipsLayout_header nav ul li.ipsHide,
- #ipsLayout_header #elMobileNav li.ipsHide {
- display: none;
- }
- #ipsLayout_mainNav > li > a {
- display: block;
- position: relative;
- font-size: 13px;
- color: #fff;
- text-decoration: none;
- padding: 0 20px;
- text-shadow: 0px -1px 0px rgba(0,0,0,0.4);
- }
- #ipsLayout_mainNav > li > a .ipsNotificationCount {
- top: -3px;
- }
- html[dir="ltr"] #ipsLayout_mainNav > li > a .ipsNotificationCount {
- right: -3px;
- }
- html[dir="rtl"] #ipsLayout_mainNav > li > a .ipsNotificationCount {
- left: -3px;
- }
- #ipsLayout_header nav a.ipsNavActive {
- color: #fff;
- text-shadow: 0px 1px 0px rgba(0,0,0,0.4);
- background: rgba(0,0,0,0.3);
- font-weight: bold;
- opacity: 1;
- }
- #ipsLayout_header nav a.ipsNavActive.ipsNavActive_menu {
- background: rgba(0,0,0,0.5);
- }
- #ipsLayout_header header {
- padding: 5px 0 130px 0;
- margin-bottom: -125px;
- }
- #ipsLayout_header header > .ipsLayout_container {
- min-height: 60px;
- }
- #ipsLayout_mainNav > li > a {
- opacity: 0.6;
- }
- #ipsLayout_mainNav > li > a:hover {
- opacity: 1;
- color: #fff;
- }
- #ipsLayout_mobileNav {
- display: none;
- }
- #elAjaxLoading {
- background: #323232;
- width: 150px;
- padding: 15px;
- color: #fff;
- position: fixed;
- bottom: 15px;
- border-radius: 4px;
- font-size: 16px;
- text-align: center;
- z-index: 15000;
- }
- html[dir="ltr"] #elAjaxLoading {
- left: 50%;
- margin-left: -75px;
- }
- html[dir="rtl"] #elAjaxLoading {
- right: 50%;
- margin-right: -75px;
- }
- html[dir="ltr"] #elAjaxLoading img {
- margin-right: 20px;
- }
- html[dir="rtl"] #elAjaxLoading img {
- margin-left: 20px;
- }
- /* SEARCH */
- #elSearch {
- border-radius: 20px;
- padding: 4px 10px 4px 10px;
- background: #fff;
- margin: 2px 0;
- height: 26px;
- width: 170px;
- position: relative;
- opacity: 0.4;
- {prefix="transition" value="0.1s all linear"}
- }
- html[dir="ltr"] #elSearch {
- margin-right: 5px;
- }
- html[dir="rtl"] #elSearch {
- margin-left: 5px;
- }
- /* Fix for webkit autocomplete */
- #elSearch input:-webkit-autofill {
- height: 26px !important;
- }
- .ipsApp_noTouch #elSearch:hover, #elSearch.cSearchExpanded {
- opacity: 1;
- }
- #elSearch.cSearchExpanded {
- width: 280px;
- }
- #elSearch button {
- position: absolute;
- top: 0;
- border: 0;
- background: transparent;
- font-size: 17px;
- width: 35px;
- line-height: 22px;
- }
- html[dir="ltr"] #elSearch button {
- right: 1px;
- }
- html[dir="rtl"] #elSearch button {
- left: 1px;
- }
- #elSearch input[type="search"] {
- padding: 0 0 0 2px;
- border: 0;
- background: transparent;
- box-shadow: none;
- font-size: 13px;
- position: absolute;
- top: 0px;
- width: 130px;
- line-height: 28px;
- height: 28px;
- }
- html[dir="ltr"] #elSearch input[type="search"] {
- right: 30px;
- }
- html[dir="rtl"] #elSearch input[type="search"] {
- left: 30px;
- }
- #elSearch #elSearchFilter {
- font-size: 11px;
- color: #5f5f5f;
- opacity: 1;
- max-width: 110px;
- white-space: nowrap;
- text-overflow: ellipsis;
- overflow: hidden;
- padding: 0 10px;
- text-align: center;
- position: absolute;
- top: 0px;
- line-height: 26px;
- background: #eeeeee;
- width: 110px;
- }
- html[dir="ltr"] #elSearch #elSearchFilter {
- left: 0px;
- border-radius: 20px 0 0 20px;
- border-right: 1px solid rgba(0,0,0,0.1);
- }
- html[dir="rtl"] #elSearch #elSearchFilter {
- right: 0px;
- border-radius: 0px 20px 20px 0px;
- border-left: 1px solid rgba(0,0,0,0.1);
- }
- #elSearch #elSearchFilter:hover {
- background: #f7f7f7;
- }
- /* USER NAVIGATION */
- #elUserNav {
- position: absolute;
- top: 10px;
- line-height: 36px;
- text-decoration: none;
- }
- #elUserNav .ipsType_medium {
- line-height: inherit;
- }
- html[dir="ltr"] #elUserNav{
- right: 20px;
- }
- html[dir="rtl"] #elUserNav{
- left: 20px;
- }
- #elUserNav.cSignedOut {
- line-height: 15px;
- }
- #elUserNav > li > a {
- color: #fff;
- font-size: 13px;
- vertical-align: middle;
- line-height: 1;
- }
- #elUserNav > li > a .fa,
- #elUserNav_mobile > li > a .fa {
- font-size: 20px;
- }
- #elUserNav > li > a .fa-caret-down,
- #elUserNav > li > a .fa-plus {
- font-size: 14px;
- }
- .cUserNav_icon a {
- display: block;
- position: relative; /* Needed for notification bubbles */
- text-shadow: 0px 1px 1px rgba(0,0,0,0.2);
- color: #fff;
- }
- .elUserNav_sep {
- border-right: 2px solid rgba(255,255,255,0.1);
- height: 36px;
- width: 0;
- display: block;
- }
- #cUserLink .ipsUserPhoto {
- padding: 0;
- }
- html[dir="ltr"] #cUserLink .ipsUserPhoto {
- margin-right: 5px;
- }
- html[dir="rtl"] #cUserLink .ipsUserPhoto {
- margin-left: 5px;
- }
- #cUserLink .ipsUserPhoto img {
- width: 26px;
- height: 26px;
- }
- #elUserNav_mobile {
- text-align: center;
- padding: 20px 0;
- }
- html[dir="ltr"] #cRegisterButton {
- margin-left: 20px;
- }
- html[dir="rtl"] #cRegisterButton {
- margin-right: 20px;
- }
- #elCart .ipsNotificationCount {
- left: 10px;
- right: auto;
- }
- /* FLASH MESSAGE */
- #elFlashMessage {
- background: rgba(0,0,0,0.9);
- color: #fff;
- position: fixed;
- width: 600px;
- font-size: 15px;
- border-radius: 4px;
- text-align: center;
- }
- #elFlashMessage:not( .ipsPad_half ) {
- padding: 15px;
- }
- html[dir="ltr"] #elFlashMessage {
- left: 50%;
- margin-left: -300px;
- }
- html[dir="rtl"] #elFlashMessage {
- right: 50%;
- margin-right: -300px;
- }
- #elFlashMessage.ipsFlashMsg_top {
- top: 20px;
- }
- #elFlashMessage.ipsFlashMsg_bottom {
- bottom: 20px;
- }
- #elFlashMessage [data-action='dismissFlashMessage'] {
- display: none;
- }
- #elFlashMessage.ipsFlashMsg_dismissable [data-action='dismissFlashMessage'] {
- display: block;
- position: absolute;
- top: -10px;
- right: -10px;
- border-radius: 30px;
- width: 30px;
- height: 30px;
- line-height: 30px;
- color: #fff;
- background: #000;
- font-family: arial, sans-serif;
- text-align: center;
- font-size: 20px;
- border: 0;
- }
- #elFlashMessage a {
- color: #fff;
- border-bottom: 1px solid rgba(255,255,255,0.6);
- }
- #elFlashMessage a:hover {
- color: #fff;
- }
- /* DRAWERS */
- .ipsModal.ipsDrawer_modal {
- background: rgba(30,30,30,0.4);
- overflow: hidden !important;
- }
- .ipsDrawer, .ipsDrawer_menu, .ipsDrawer_content {
- overflow: auto;
- }
- .ipsDrawer {
- position: fixed;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- }
- .ipsDrawer_menu {
- position: absolute;
- top: 0;
- bottom: 0;
- width: 280px;
- background: #11171c;
- box-shadow: 0px 0px 25px rgba(0,0,0,0.2);
- }
- html[dir="ltr"] .ipsDrawer_menu {
- right: 0;
- }
- html[dir="rtl"] .ipsDrawer_menu {
- left: 0;
- }
- .ipsDrawer_content {
- position: absolute;
- top: 0;
- left: 0;
- bottom: 0;
- right: 0;
- }
- .ipsDrawer_close {
- background: #11171c;
- width: 40px;
- height: 40px;
- border-radius: 40px;
- color: #fff;
- text-align: center;
- font-size: 24px;
- display: block;
- position: absolute;
- top: 5px;
- z-index: 2000;
- }
- html[dir="ltr"] .ipsDrawer_close {
- right: 285px;
- }
- html[dir="rtl"] .ipsDrawer_close {
- left: 285px;
- }
- .ipsDrawer_close > span {
- font-family: arial, sans-serif;
- line-height: 40px;
- }
- .ipsDrawer_list {
- width: 100%;
- position: relative;
- list-style: none;
- padding: 0 0 30px 0; /* Add extra padding at bottom to account for iOS issue */
- margin: 0;
- }
- .ipsDrawer_list > li > a:not( .ipsButton ),
- .ipsDrawer_list > li:not( .ipsDrawer_itemParent ) > a:not( .ipsButton ) {
- color: #fff;
- display: block;
- padding: 10px 15px;
- border-bottom: 1px solid #000;
- border-top: 1px solid rgba(255,255,255,0.05);
- }
- .ipsDrawer_list > li > a:active {
- background: #000;
- }
- .ipsDrawer_itemParent > .ipsDrawer_list > li > a:not( .ipsButton ) {
- padding: 10px 30px;
- }
- .ipsDrawer_section {
- color: rgba(255,255,255,0.4);
- font-size: 11px;
- padding: 15px 30px 5px;
- text-transform: uppercase;
- }
- .ipsDrawer_itemParent > h4 {
- font-weight: normal;
- color: #fff;
- padding: 10px 15px;
- position: relative;
- cursor: pointer;
- margin: 0;
- border-bottom: 1px solid #000;
- border-top: 1px solid rgba(255,255,255,0.05);
- }
- .ipsDrawer_itemParent > .ipsDrawer_list > .ipsDrawer_itemParent > h4 {
- padding: 10px 30px;
- }
- html[dir="ltr"] .ipsDrawer_itemParent > h4:after {
- content: "\f105";
- right: 14px;
- }
- html[dir="rtl"] .ipsDrawer_itemParent > h4:after {
- content: "\f104";
- left: 14px;
- }
- .ipsDrawer_itemParent > h4 > a {
- color: inherit;
- display: block;
- }
- .ipsDrawer_list .ipsDrawer_list {
- position: absolute;
- top: 0;
- }
- html[dir="ltr"] .ipsDrawer_list .ipsDrawer_list {
- left: 100%;
- }
- html[dir="rtl"] .ipsDrawer_list .ipsDrawer_list {
- right: 100%;
- }
- .ipsDrawer_list [data-action="back"] a {
- position: relative;
- background: #000;
- color: #a9a9a9;
- }
- html[dir="ltr"] .ipsDrawer_list [data-action="back"] a {
- padding-left: 30px;
- }
- html[dir="rtl"] .ipsDrawer_list [data-action="back"] a {
- padding-right: 30px;
- }
- html[dir="ltr"] .ipsDrawer_list [data-action="back"] a:before {
- content: "\f104";
- left: 14px;
- }
- html[dir="rtl"] .ipsDrawer_list [data-action="back"] a:before {
- content: "\f105";
- right: 14px;
- }
- .ipsDrawer_itemParent > h4:after,
- .ipsDrawer_list [data-action="back"] a:before {
- font-family: "FontAwesome";
- font-size: 20px;
- position: absolute;
- top: 50%;
- margin-top: -10px;
- }
- .ipsDrawer_listTitle {
- font-size: 14px;
- background: rgba(255,255,255,0.1);
- padding: 10px;
- color: #c8c8c8;
- margin-top: 10px;
- }
- /* HIGH RES IMAGES */
- @media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
- html[dir="ltr"] .ipsApp .ipsStepBar > .ipsStep > a,
- html[dir="ltr"] .ipsApp .ipsStepBar > .ipsStep > span {
- background-image: url( "{resource="wizard_step_large@2x.png" app="core" location="front"}" );
- }
- html[dir="rtl"] .ipsApp .ipsStepBar > .ipsStep > a,
- html[dir="rtl"] .ipsApp .ipsStepBar > .ipsStep > span {
- background-image: url( "{resource="wizard_step_large_rtl@2x.png" app="core" location="front"}" );
- }
- html[dir="ltr"] .ipsApp .ipsStepBar > .ipsStep + .ipsStep.ipsStep_active:after {
- background-image: url( "{resource="wizard_step_extra@2x.png" app="core" location="front"}" );
- }
- html[dir="rtl"] .ipsApp .ipsStepBar > .ipsStep + .ipsStep.ipsStep_active:after {
- background-image: url( "{resource="wizard_step_extra_rtl@2x.png" app="core" location="front"}" );
- }
- html[dir="ltr"] .ipsApp .ipsDataItem_subList {
- background-image: url( "{resource="subitem_stem@2x.png" app="core" location="front"}" );
- }
- html[dir="rtl"] .ipsApp .ipsDataItem_subList {
- background-image: url( "{resource="subitem_stem_rtl@2x.png" app="core" location="front"}" );
- }
- }
- /* Redirector */
- .ipsRedirect {
- text-align: center;
- }
- .ipsRedirect_loading {
- height: 100px;
- }
- .ipsRedirect_progress {
- margin-bottom: 20px;
- }
- .ipsRedirectMessage {
- margin: 50px;
- }
- .ipsRedirect_manualButton {
- margin-top: 20px;
- }
- /* Default responsive styles */
- /* DESKTOP/DEFAULT */
- .ipsResponsive_showDesktop,
- .ipsResponsive_showDesktop.ipsResponsive_inline {
- display: inline !important;
- }
- .ipsResponsive_showDesktop.ipsResponsive_inlineBlock {
- display: inline-block !important;
- }
- .ipsResponsive_showDesktop.ipsResponsive_block {
- display: block !important;
- }
- .ipsResponsive_showPhone.ipsResponsive_inline,
- .ipsResponsive_showPhone.ipsResponsive_inlineBlock,
- .ipsResponsive_showPhone.ipsResponsive_block,
- .ipsResponsive_showTablet.ipsResponsive_inline,
- .ipsResponsive_showTablet.ipsResponsive_inlineBlock,
- .ipsResponsive_showTablet.ipsResponsive_block,
- .ipsResponsive_hideDesktop.ipsResponsive_inline,
- .ipsResponsive_hideDesktop.ipsResponsive_inlineBlock,
- .ipsResponsive_hideDesktop.ipsResponsive_block {
- display: none !important;
- }
- #elNavLang_menu li button,
- #elNavTheme_menu li button {
- text-align: left;
- }
- #elLicenseKey {
- margin: 0;
- border-radius: 0;
- font-size: 14px;
- padding-right: 40px;
- }
- #elLicenseKey .ipsList_inline {
- margin-top: 15px;
- }
- #elLicenseKey [data-role="closeMessage"] {
- display: inline-block;
- background: rgba(0,0,0,0.6);
- width: 30px;
- height: 30px;
- border-radius: 30px;
- line-height: 28px;
- text-align: center;
- color: #fff;
- border-bottom: 0;
- font-size: 18px;
- position: absolute;
- right: 15px;
- top: 15px;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement