/***** Grid ************************************************************************************************ *****************************************************************************************************************/ .frag-box,.grid,.col{display:block;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.frag-clearfix,.grid{*zoom:1}.frag-clearfix:before,.grid:before,.frag-clearfix:after,.grid:after{display:table;content:''}.frag-clearfix:after,.grid:after{clear:both}.grid{width:auto;max-width:1200px;*width:980px;}.grid .grid{*width:auto}.grid .grid .col{*width:auto;*float:none}.col{float:left;}[dir=rtl] .col{float:right}.col-degutter{padding-left:0;padding-right:0;*padding-left:20px;*padding-right:20px}.dsk-1{width:8.33333%;*width:41px}.dsk-2{width:16.66667%;*width:122px}.dsk-3{width:25%;*width:203px}.dsk-4{width:33.33333%;*width:284px}.dsk-5{width:41.66667%;*width:365px}.dsk-6{width:50%;*width:446px}.dsk-7{width:58.33333%;*width:527px}.dsk-8{width:66.66667%;*width:608px}.dsk-9{width:75%;*width:689px}.dsk-10{width:83.33333%;*width:770px}.dsk-11{width:91.66667%;*width:851px}.dsk-12{width:100%;*width:932px}.dsk-hide{display:none}.dsk-show{display:block}.dsk-clear{clear:left}[dir=rtl] .dsk-clear{clear:right}.dsk-unclear{clear:none}.oldie-clear{display:none;*display:block;*clear:both}@media all and (max-width:1320px){.grid.wrapper {padding:0 50px;}.tab-1{width:8.33333%}.tab-2{width:16.66667%}.tab-3{width:25%}.tab-4{width:33.33333%}.tab-5{width:41.66667%}.tab-6{width:50%}.tab-7{width:58.33333%}.tab-8{width:66.66667%}.tab-9{width:75%}.tab-10{width:83.33333%}.tab-11{width:91.66667%}.tab-12{width:100%}.tab-hide{display:none}.tab-show{display:block}.tab-clear{clear:left}[dir=rtl] .tab-clear{clear:right}.tab-unclear{clear:none}.dsk-clear {clear:none}}@media all and (max-width: 767px){.grid {padding:0 20px!important}.mob-1{width:8.33333%}.mob-2{width:16.66667%}.mob-3{width:25%}.mob-4{width:33.33333%}.mob-5{width:41.66667%}.mob-6{width:50%}.mob-7{width:58.33333%}.mob-8{width:66.66667%}.mob-9{width:75%}.mob-10{width:83.33333%}.mob-11{width:91.66667%}.mob-12{width:100%}.mob-hide{display:none}.mob-show{display:block}.mob-clear{clear:left}[dir=rtl] .mob-clear{clear:right}.mob-unclear{clear:none}.tab-clear{clear:none}} /***** Reset ************************************************************************************************ *****************************************************************************************************************/ a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}table{border-collapse:collapse;border-spacing:0;}*{box-sizing: border-box}a{text-decoration:none} strong {font-weight:600} * {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:0; margin:0 } /*** Colour Pallete Red #ed1c29 Blue #1f285b Green #68bc45 Black #000 White #FFF ****/ /***** Style ************************************************************************************************ *****************************************************************************************************************/ html {background:#ed1c29} body {background:#FFF; font-size:16px; color:#000; font-weight:500; font-family: 'Rokkitt', serif; padding-top:20px} @media all and (max-width: 900px){ body {padding-top:0} } .wrapper {margin:0 auto} .grid.slim {max-width:980px} /*** Random ***/ hr {border-top:1px solid #e8e8e8; margin:5px 0} .clearer {clear:both} .label {padding-right:5px;} .content {padding-top:25px} .content p {color:#1f285b} .wordpress-post-view .content ul li, .wordpress-post-view .content ol li {color:#1f285b; line-height: 1.2; list-style: disc outside; margin-left: 20px } p.required, .required em, .validation-advice {font-size:11px; color:#900; padding:10px 5px 10px 0} .note {font-size:11px; font-style:italic; color:#999} .nobr {white-space: nowrap !important;} .v-fix {float:left; padding-right:10px} address {line-height:1.5; padding:10px 0} small {font-size:11px} .no-display {display:none} .separator {padding:0 10px} /*** Links ***/ a {color:#42A5F5 ;} a:hover {color:#1565C0} /*** Paragraph ***/ p {padding:0; line-height:1.2} /*** Headings ***/ h1,h2,h3,h4,h5,h6 {font-family: 'Roboto', sans-serif; } h1 {font-size:26px; letter-spacing:0; font-weight:600} h2 {font-size:22px; padding-bottom:10px; font-weight:600} h3 {font-size:18px; padding-bottom:10px} h4 {font-size:14px; font-weight:500} h5 {font-size:14px; font-weight:500} h6 {font-size:12px; font-weight:500} /*** Buttons ***/ .button {cursor: pointer; border: none; text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); color: #fff; font-size: 14px; padding:5px 15px; display: inline-block; border-radius: 5px; background: #1f285b; text-transform:uppercase; webkit-transition: background-color 0.5s ease;;-moz-transition: background-color 0.5s ease;-ms-transition: background-color 0.5s ease; -o-transition: background-color 0.5s ease; transition: background-color 0.5s ease; } .button:hover {background-color: #3375c2; text-decoration: none;} .btn-remove {float:right; font-size:10px; padding-left:10px} .btn-remove:before {font-family: 'FontAwesome'; padding-right:5px; content: "\f00d"; font-size:12px; color:#CCCCCC} .btn-edit {float:right; font-size:10px} .btn-edit:before {font-family: 'FontAwesome'; padding-right:5px; content: "\f040"; font-size:12px; color:#CCCCCC} .link-edit {float:right; font-size:10px; position:absolute; top:0; right:0} .link-edit:before {font-family: 'FontAwesome'; padding-right:5px; content: "\f040"; font-size:12px; color:#CCCCCC} .btn-cart {background:#ed1c29; padding:10px 25px} .btn-cart:hover {background:#ca131f} .buttons-set {padding:10px 0; overflow:hidden} .buttons-set a {line-height:26px; padding-right:10px} .buttons-set button.button {float:right; margin-left:10px} @media all and (max-width: 900px){ .buttons-set {text-align:center} .buttons-set button.button {float:none; margin-left:0} .button {width:90%; margin-top:10px} } /*** Forms ***/ input, textarea, select {font-size: 14px; font-weight:500; padding:4px 10px; border: 1px solid #d8d8d8; color:#707070; font-family: "proxima-nova-soft", helvetica, sans-serif; background:#fff; border-radius:5px} input, select {height: 32px; border-radius:3px} input[type="radio"], input[type="checkbox"] {height:auto} input[type="password"] {font-family:arial, sans-serif; font-size:24px} input.qty {width:50px!important; height:38px} textarea {width:100%} .form-list .input-box {padding-top:5px} .form-list li {overflow:hidden; padding:5px 0} .form-list .field {float:left; width:50%;} .form-list .fields .field:first-child {padding-right:10px} .form-list .wide {overflow:hidden} .form-list input.input-text, .form-list select, .form-list textarea {width:100%} .legend {padding:10px 0; font-size:16px} @media all and (max-width: 640px){ .form-list .input-box {width:100%} .form-list .field { width:100%} } /*** Messages ***/ .messages {padding-bottom:10px} .success-msg {color: #3c763d; background-color: #dff0d8; padding:10px; margin-top:10px; border: 1px solid #d6e9c6;} .error-msg {color:#a94442; background-color:#f2dede; padding:10px; margin-top:10px; border: 1px solid #ebccd1;} .notice-msg {color:#8a6d3b; background-color:#fcf8e3; padding:10px; margin-top:10px; border: 1px solid #faebcc;} /*** Control Box ***/ .control {clear:both; overflow:hidden; padding:10px} .control .input-box, .control label, .control input {float:left; padding:0} .control label {padding-left:10px} /*** Align & Float ***/ .a-right {text-align:right!important} .a-left {text-align:left!important} .a-center {text-align:center!important} .f-left {float:left} .f-right {float:right} .v-middle {vertical-align: middle;} /*** Ordered List ***/ ol li {padding-bottom:8px;} /*** Description List ***/ dt {font-weight:bold; padding:10px 0} dd {padding-bottom:20px} dd.last {padding-bottom:0} dd ol li {color:#999} dd ol li a {color:#555} /*** STD ***/ .std {line-height:1; padding:10px 0} .std p {padding-bottom:10px} /*** Tables ***/ table {width:100%; border:1px solid #e8e8e8; font-size:16px; background:#fff} table .even {background:#fbfbfb} table thead th {font-weight: 500; border-right: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; padding:8px; white-space: nowrap; vertical-align: middle; background:#fbf9fa; text-align:left} table td {padding:10px; border-bottom: 1px solid #e8e8e8; border-right: 1px solid #e8e8e8; vertical-align: top; text-align: left; font-weight: normal;} table tr.last td {border-bottom:0!important} table tfoot tr {background:#fbf9fa; border-top:1px solid #e8e8e8} table .product-image img {width:auto} table h2 {font-size:1em} @media all and (max-width: 900px){ table .product-name {font-size:12px;} .data-table, .data-table thead, .data-table tbody, .data-table th, .data-table td, .data-table tr, .data-table tfoot { display: block; } .data-table thead tr { position: absolute;top: -9999px;left: -9999px;} .data-table tr { border: 1px solid #e8e8e8; } .data-table td { border: none; position: relative;text-align:center; padding:5px 0} .data-table tfoot td {overflow:hidden; width:100%} .data-table .btn-remove {float:none} .data-table .a-right {text-align:center!important} } /*** Back Link ***/ .back-link {float:left; line-height:1; padding:0; padding-right:10px} /*** Skip Links ***/ .skip-content { display: none;} .skip-content.skip-active {display: block;} /*** SP Methods ***/ .sp-methods dd {padding-top:10px} /*** Block ***/ .block-title {cursor:pointer; padding:10px 0} .block-content {background:#f2f2f2; padding:10px} .block-content dt {border-bottom:1px dotted #000; margin-bottom:10px} .block-subtitle {font-weight:bold; padding-bottom:15px} .block .actions {padding:10px 0 10px 0; text-align:right; font-weight:bold; border-bottom:1px solid #e8e8e8; margin-bottom:10px } .block-layered-nav .block-subtitle, .block-layered-nav .block-title {display:none} .block-layered-nav dt, .block-account .block-title {border: none; text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); color: #fff; font-weight: 500; padding: 15px; border-top-left-radius:3px; border-top-right-radius:3px; background-color: #2f6db6; background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%); background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%); background-image: -ms-linear-gradient(top, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .1); -webkit-transition: background-color ease .3s; -moz-transition: background-color ease .3s; transition: background-color ease .3s; font-size:16px} .block-layered-nav dd, .block-account .block-content {white-space: nowrap; overflow:hidden; padding:20px; border:1px solid #D8D8D8; border-top:none; border-bottom-left-radius:3px; border-bottom-right-radius:3px; background:#fbf9fa; margin-bottom:20px} .block-account .block-content {padding:0} .block-content ul li {padding:5px 0; border-bottom:1px solid #e8e8e8} .block-content ul li.last {border-bottom:none} .block-content p.product-name {display:inline-block} @media all and (max-width: 900px){ .block-title:after {position:absolute; right:20px; font-family: 'FontAwesome'; content: "\f078";} .block-content {display:none} } /*** Box ***/ .box {border:1px solid #e8e8e8; padding:10px; background:#fbf9fa; margin-bottom:10px; overflow:hidden} .box-title, .box-head {overflow:hidden} .box a {} .box-head h2 {float:left;} .box-title h3 {float:left; padding:0} .box h4 {padding-top:10px} .box-head a {float:right; line-height:32px} .box-title a {float:right; line-height:18px} /*** Sidebar ***/ .sidebar {padding-right:20px; margin-right:20px; border-right:1px solid #D8D8D8} .sidebar.right {padding-right:0px; padding-left:20px; margin-left:20px; border-right:none; border-left:1px solid #D8D8D8} .sidebar .block {margin-bottom:10px;} @media all and (max-width: 900px){ .sidebar {padding:0 10px; margin:0} } /*** Slider ***/ .flexslider .wrapper {position:relative} .flexslider .image {position:absolute; left:0; top:0; height:auto; width:100%} .flexslider h2 {font-size:72px; color:#fff; text-shadow:#000000 1px 1px 1px; padding-top:352px; padding-left:36px; font-weight:900} /*why is this in css wtffffff*/ .flexslider .firstslide {background:url(../images/slider/warm_glow_slide.jpg) no-repeat; background-size:cover;} /*.flexslider .firstslide {background:url(../images/slider/warm_glow_slide_v2.jpg) no-repeat; background-size:cover;}*/ .flexslider .slide-1 {background:url(../images/slider/slide-1.jpg) no-repeat; background-size:cover;} .flexslider .slide-2 {background:url(../images/slider/slide-2.jpg) no-repeat; background-size:cover;} .flexslider .slide-3 {background:url(../images/slider/slide-3.jpg) no-repeat; background-size:cover;} .flexslider .slide-4 {background:url(../images/slider/slide-4.png) no-repeat; background-size:cover;} .flexslider li a {position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 9999} .flexslider .slides > li {height:1000px; position: relative} .flexslider .slides > li:after {content: ""; width:100%; bottom:0; height: 300px;left:0; display: block; position: absolute; z-index: 3; background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 ); } .flexslider .promo-img {position:absolute; bottom: 50px; right:50px; z-index: 4; font-family: 'Roboto', sans-serif;} .flexslider .promo-img img {max-width:220px; float: left} .flexslider .promo-img span {float:left; display: block; color: white; font-size:26px; font-weight: 600; position: absolute; bottom: 0; right: 312px; width: 390px;} .flexslider h2 {padding-top:250px} @media screen and (max-width:1799px) { .flexslider .slides > li {height:900px;} .flexslider h2 {padding-top:419px; font-size:50px} } @media screen and (max-width: 1200px) { .flexslider .slides > li {height:800px;} .flexslider h2 {padding-top:320px;} } @media screen and (max-width: 784px) { .flexslider .slides > li {height:400px; background-size:100% auto} .flexslider h2 {padding-top:50px; padding-bottom:50px; font-size:24px; padding-left: 20px} .flexslider .promo-img {right:20px;} .flexslider .promo-img img {max-width:150px;} .flexslider .promo-img span {font-size:18px; font-weight: 600; position: absolute; bottom: -30px; left: -135px; max-width: 390px;} .flexslider .slide-4 .promo-img, .flexslider .slide-4 .promo-img img {max-width:150px} } @media screen and (max-width: 640px) { .flexslider .slides > li {height:400px; background-size:auto 100%; background-position:center} } @media screen and (max-width: 860px) { .flex-direction-nav .flex-prev { opacity: 1; left: 10px; } .flex-direction-nav .flex-next { opacity: 1; right: 10px; } } /*** Main Navigation Menu ***/ .menu {background:#ed1c29; border-top:1px dotted #FFF; text-align:center; text-transform:uppercase; position:relative} .menu > ul > li {display:inline-block; padding-top:20px; padding-right:20px} .menu li a {font-size:22px; font-weight:normal; color:#FFF; padding: 7px 10px 10px 10px; display:block} .menu li a.active, .menu li a:hover {color:#ed1c29; background:#FFF} @media screen and (max-width: 1100px) { .menu > ul > li {padding-right:12px} .menu li a {font-size:20px;} } /*** Second Level ***/ .menu ul > li> ul {display:none; position:absolute; background:#ed1c29; width:auto; font-weight:normal; z-index:99999} .menu ul >li:hover > ul {display:block; padding:20px} .menu ul>li ul a {display:block;} /*** Mobile Menu ***/ .menu-link {display:none} .menu-link {font-size:24px; cursor:pointer; position:absolute; top:5px; left:10px; color:#FFF; display:block; line-height:32px} .menu-link:before {content: "\f0c9"; font-family:'FontAwesome'; padding-right:10px; font-size:32px} .slideout-menu { position: fixed; top: 0; left: -250px; width: 250px; height: 100%; background: #1f285b; z-index: 100; } .slideout-menu h3 { position: relative; padding: 12px 10px; color: #fff; font-size: 1.2em; font-weight: 400; } .slideout-menu .slideout-menu-toggle { position: absolute; top: 7px; right: 10px; display: inline-block; padding: 6px 9px 5px; font-weight: bold; line-height: 1; background: #171e44; color: #fff; text-decoration: none; vertical-align: top; } .slideout-menu .slideout-menu-toggle:hover { color: #fff; } .slideout-menu ul { list-style: none; } .slideout-menu ul li { border-bottom: 1px dotted #fff; } .slideout-menu ul li a { position: relative; display: block; padding: 10px; color: #fff; text-decoration: none; font-size:16px; } .slideout-menu ul li a:hover { background: #1167a8; color: #fff; } .slideout-menu ul li a i { position: absolute; top: 15px; right: 10px; opacity: .5; } .slideout-menu ul li ul li {border-bottom:none; padding-left:25px;} .slideout-menu ul li ul li a:before {content:"- "} @media all and (max-width: 900px){ .menu {display:none} .menu-link {display:block} } @media all and (max-width: 768px){ .mobile-links {display:block; position:absolute; top:10px; left:10px} .mobile-links li {float:left; padding-right:10px} .mobile-links .account:before {font-family: 'FontAwesome'; content:"\f007"; font-size:32px; color:#6A727C} .mobile-links .logout:before {font-family: 'FontAwesome'; content:"\f08b"; font-size:32px; color:#6A727C} .mobile-links .basket:before {font-family: 'FontAwesome'; content:"\f291"; font-size:32px; color:#6A727C; display: inline-block} .mobile-links .basket {position:relative} .mobile-links .basket .price {position:absolute; font-size:15px; font-weight:600; top:12px; left:36px; color:#6A727C;} } /*** Breadcrumbs ***/ .breadcrumbs {overflow:hidden; height:50px; line-height:50px; font-size:15px; border-bottom:1px dotted #ed1c29;} .breadcrumbs a {color:#555} .breadcrumbs span {padding:0 10px; position:relative; font-weight:bold;} .breadcrumbs span: {} .breadcrumbs strong {color:#1f285b; font-weight:500} .breadcrumbs ul li {float:left;} @media all and (max-width: 900px){ .breadcrumbs {padding:0 10px} } /*** Pager ***/ .pager {text-align:center; overflow:hidden; color:#707070;} .pager .amount {float:left; margin:0;line-height:32px} .pager .amount strong {font-weight:400} .pager .limiter {float:right} .pager .limiter label {vertical-align: middle;} .pager .limiter select {padding: 0;margin: 0; vertical-align: middle; padding:0 3px; margin:0 5px} .pager .pages {margin:0 140px; padding:3px 0 0 0; font-size:14px} .pager .pages strong {font-weight:500} .pager .pages ol {display:inline} .pager .pages li {display:inline; padding:0 5px} .toolbar select {padding:0} @media all and (max-width: 900px){ .limiter, .amount, .pager .pages strong, .sorter {display:none} .pager {padding:5px 10px} .pager .pages {margin:0; padding:0} .pager .pages li {padding:0; margin:0; background:#fff; border:1px solid #d8d8d8; display:inline-block} .pager .pages li.current {padding:10px} .pager .pages li a {display:block; padding:10px} } /*** Sorter ***/ .sorter {text-align:center; overflow:hidden; color:#707070} .sorter .view-mode {float:left;} .sorter .view-as {margin-left:20px;display:inline-block; font-size: 14px; font-weight:500; padding:0 10px; border: 1px solid #d8d8d8; color:#707070; background: rgba(254,254,254,1); background: -moz-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(246,246,246,1) 47%, rgba(245,245,245,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(254,254,254,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(245,245,245,1))); background: -webkit-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(246,246,246,1) 47%, rgba(245,245,245,1) 100%); background: -o-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(246,246,246,1) 47%, rgba(245,245,245,1) 100%); background: -ms-linear-gradient(top, rgba(254,254,254,1) 0%, rgba(246,246,246,1) 47%, rgba(245,245,245,1) 100%); background: linear-gradient(to bottom, rgba(254,254,254,1) 0%, rgba(246,246,246,1) 47%, rgba(245,245,245,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fefefe', endColorstr='#f5f5f5', GradientType=0 ); border-radius:3px;} .sorter .view-as a {color:#707070} .sorter .grid-view {background: url(../images/icons/grid.png) no-repeat left; display:inline-block; background-size:14px 14px; padding:10px 10px 10px 20px; border-right:1px solid #d8d8d8; margin-right:10px} .sorter .list-view {background: url(../images/icons/list.png) no-repeat left; display:inline-block; background-size:14px 14px; padding:10px 0 10px 20px} .sorter .sort-by {float:right} .sorter .sort-by label {vertical-align: middle;} .sorter .sort-by select {padding: 0 3px ;margin: 0 5px; vertical-align: middle;} .toolbar-bottom .pager {border-bottom:none; margin:0; padding:0} .toolbar-bottom .sorter {display:none} /*** Prices ***/ .old-price {display:inline; padding:0} .special-price .price {color:#4589da; } .special-price .price-label {display:none} .minimal-price-link {display:block} .price-label {display:none} .price-box {color:#808080; font-size:24px; float:left} .price-box .price-excluding-tax {display:block} .price-box .price-including-tax {display:block} .price-box .price {color:#ed1c29} .price-box .price-including-tax .price {font-weight:700} /*** Tier Prices ***/ .tier-prices {border:1px solid #e8e8e8; padding:10px; margin:10px 0; background:#fbf9fa} .tier-price {padding:5px 0} .tier-price .price {font-weight:bold} /*** Add to Links ***/ .add-to-links {overflow:hidden; padding-top:20px; color:#686868} .add-to-links li {float:left; padding-right:20px;} .add-to-links a {color:#686868} .add-to-links .separator {display:none} .add-to-links .link-wishlist:before {font-family: 'FontAwesome'; content: "\f004"; padding-right:5px} /*** Availability ***/ .stockinfo {float:right; font-size:24px; color:#808080} .availability.in-stock:before {font-family: 'FontAwesome'; content: "\f00c"; padding-right:5px; color:#68bc45 } .availability.out-of-stock:before {font-family: 'FontAwesome'; content: "\f00d"; padding-right:5px; color:#ed1c29} /*** Box Collateral ***/ .box-collateral {padding:10px 0} /*** Upsell ***/ .upsell {overflow:hidden; border-top: 1px dotted #ed1c29;margin-top: 25px; padding-top: 25px;} /*** Carousel ***/ .carousel .control {left:35%; font-size:48px; line-height:0; color:#F2F2F2} .carousel.vert .control.prev:before {font-family: 'FontAwesome'; content: "\f077";} .carousel.vert .control.next:before {font-family: 'FontAwesome'; content: "\f078";} .carousel .thumbnail {width:100%} .carousel .cycle-slide {border:1px solid #e8e8e8; margin:5px 0;} /*** Lightbox **/ .mfp-title {color:#555!important; padding:10px} .mfp-image-holder .mfp-content {width:80%; background:white;} .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {color:#555!important; right:10px!important} .mfp-figure figure {background:white!important} .mfp-counter {color:#555!important; right:10px!important} /*** Social Sharing ***/ .social {border-bottom: 1px dotted #ed1c29; padding-bottom: 20px; margin-bottom: 20px;} .social .share-label,.addthis_sharing_toolbox {float:left;} .social .share-label {line-height:32px; padding-right:20px} .social-links > a {height:26px; width:26px; text-indent:-99999px; display:inline-block; margin-left:5px} .social-links .twitter {background:url(../images/icons/twitter.png) no-repeat; background-size:26px 26px;} .social-links .facebook {background:url(../images/icons/facebook.png) no-repeat; background-size:26px 26px;} .social-links .pinterest {background:url(../images/icons/pinterest.png) no-repeat; background-size:26px 26px;} .social-links .google {background:url(../images/icons/google.png) no-repeat; background-size:26px 26px;} .social-links .youtube {background:url(../images/icons/youtube.png) no-repeat; background-size:26px 26px;} @media all and (max-width:1160px){ .social {width:100%} } /*** Reviews ***/ #srka-product-review-list .options {background:#FFF; padding:0;} #srka-product-review-list .srka-rating-code { } #srka-product-review-list .srka-rating-code .label { min-width: 100px; display: block; float: left; color: #333; font-weight:bold } #srka-product-review-list .srka-rating-code .options {} #srka-product-review-list .srka-rating-code .options li { display: block; float: left; margin-top: 2px; } #srka-product-review-list .srka-rating-code .options li .option { display: block; width: 14px; height: 13px; background: url(../images/bkg_rating.gif) center top no-repeat; text-indent: -9999em; } #srka-product-review-list .srka-rating-code .options li .option.selected { background-position: center bottom; } /*** Item Options ***/ .item-options dt {font-weight: bold; font-style: italic; } .item-options dd {padding-left: 10px; margin: 0 0 6px; } /*** Column Set ***/ .col2-set {clear:both; overflow:hidden} .col2-set .content {} .col-1 {float:left; width:50%; padding-right:20px} .col-2 {float:left; width:50%; padding-left:20px} @media all and (max-width: 900px){ .col-1, .col-2 {width:100%; padding:0 10px;} .col-2 {padding-top:10px} } /*** Header ***/ .header {padding:0; position:relative; background: linear-gradient(to top, #ed1c29 50%, #FFF 50%); text-align:center;} .header .wrapper {position:relative;} .header .logo {display:inline-block; max-width:300px; border:16px solid #ed1c29; border-radius:14px; background: #ed1c29; } .header .logo img {width:100%} @media all and (max-width: 1100px){ .header .logo {max-width:350px} } @media all and (max-width: 900px){ .header {background: #ed1c29; padding-top:50px;} .header:before {border-top:1px dotted #FFF; content:""; width:100%; position:absolute; top:45px; display:block} } /*** Top Links ***/ .toplinks {color:#808080; position:absolute; right:30px; top:0; font-size:20px; font-weight:bold; max-width:200px} .toplinks a {color:#808080; display:inline-block; text-align:left; padding-bottom:5px;} .toplinks .price {color:#000} .toplinks a.button {text-align:center; background:#808080; color:#FFF; padding:5px 15px; font-size:18px; text-transform:none; display: block} .toplinks a.button:hover {background:#707070} .toplinks .basket .icon {background:url(../images/icons/basket.png) no-repeat; background-size:100%; font-size:14px; font-weight:bold; color:#FFF; height:27px; width:22px; text-align:center; display:inline-block; padding-top:9px} @media all and (max-width: 1100px){ .toplinks {top:10px;} } @media all and (max-width: 900px){ .toplinks {top:-45px; right:10px} .toplinks .mob-hide {display:none!important} .toplinks a {display:inline-block} .toplinks a.account {font-size:0px; position:absolute; top:2px; right:40px;} .toplinks a.account:before {content: "\f007"; font-family:'FontAwesome'; font-size:32px; color:#FFF;} .toplinks .basket {position:absolute; right:0; top:2px} .toplinks .basket .icon {height:32px; width:26px; color:#808080; background:url(../images/icons/basket-white.png) no-repeat; background-size:100%; font-size:18px; padding-top:10px} } /*** Warning ***/ .warning {border-top:1px dotted #ed1c29; margin-top:25px; padding-top:25px; text-align:center; font-weight:bold; font-size:18px; } .warning p {color:#000; padding:0} /*** Footer ***/ footer {overflow:hidden; margin-top:30px; font-size:14px; padding:25px 0; background:#ed1c29} footer .socialmedia {text-align:center; padding-bottom:35px; border-bottom:1px dotted #FFF; margin-bottom:35px; font-size:28px} footer .socialmedia h4 {font-size:28px; font-weight:600; padding-bottom:20px; color:#FFF} footer .socialmedia a {padding-left:20px; display:inline-block; font-size:28px} footer a {color:#FFF; font-size:18px} footer a:hover {color:#FFF; text-decoration:underline} footer ul li {padding-bottom:10px} footer .legal {border-top:1px dotted #FFF; padding-top:35px; font-size:18px; color:#FFF; margin-top:25px} @media all and (max-width: 900px){ footer .col {padding-bottom:20px} } @media all and (max-width: 640px){ footer .socialmedia {font-size:20px} footer .socialmedia h4 {font-size:20px;} footer .socialmedia a {font-size:20px} } /*** Page ***/ .page-title {color:#242424; letter-spacing:-1px; font-weight:bold} .page-title.title-buttons {overflow:hidden; padding-bottom:20px} .page-title.title-buttons h1 {float:left} .page-title.title-buttons .checkout-types, .page-title.title-buttons .button, .page-title.title-buttons a, .page-title.title-buttons span {float:right} @media all and (max-width: 900px){ .page-title {margin:10px; } .page-title h1 {font-size:18px} .page-title.title-buttons h1, .page-title.title-buttons .checkout-types, .page-title.title-buttons .button, .page-title.title-buttons a, .page-title.title-buttons span {float:none; text-align:center;} .page-title.title-buttons h1 {margin-bottom:5px;} } /*** Category ***/ @media all and (max-width: 900px){ .category-products {padding:0 10px} } /*** Products List ***/ .products-list {padding:20px 10px} .products-list .item {padding:20px; margin:0 10px 20px; border:1px solid #c6c7c6;} .products-list .product-name {font-size:18px; min-height:28px; font-weight:500; padding:10px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .products-list .product-name a:hover {text-decoration:underline} .products-list .seperator {display:none} .products-list .price-label {display:none} .products-list .actions {text-align:right; padding-top:5px;} .products-list .product-image {display:block; text-align:center} .products-list .product-image img {max-width:75%} .products-list .desc {padding:10px 0; clear:both} .products-list .f-fix {margin-top:30px} .products-list .add-to-links li {width:50%; padding:10px 0} .products-list .price-box {padding-bottom:20px} .products-list.list > li {text-align:left; padding:0 10px; border-bottom:1px solid #e8e8e8} .products-list.list .product-shop {padding-left:20px} .products-list.list .btn-cart {width:auto; float:left} .products-list.list .product-name {font-size:18px} .products-list.list .price-box {float:left; padding:0 20px 0 0; font-size:16px; line-height:36px} .products-list.list .add-to-links li {width:auto; padding:10px} .upsell.products-list {padding:20px 0} /*** Featured Products ***/ .featured {border-top:1px dotted #ed1c29; padding-top:25px; margin-top:25px } .featured .products-list {padding:0} @media all and (max-width: 900px){ .featured .products-list {padding:0 10px} } /*** Latest News ***/ .latest-news {border-top:1px dotted #ed1c29; padding-top:25px; margin-top:25px } .latest-news .article {padding-right:20px; padding-bottom: 20px} .latest-news img {max-width:100%} .latest-news .actions {text-align:right} .latest-news .col.padded {padding:0 10px;} .latest-news .col-1, .latest-news .col-3, .latest-news .col-5 {clear:both} @media all and (max-width: 900px){ .latest-news .actions {text-align:center; padding-bottom:20px} .latest-news .featured-image {text-align: center} } /*** Products View ***/ .product-view .details { overflow:hidden} .product-view .details .right {padding-left:50px;} .product-view .product-name {padding-bottom:20px;} .product-view .product-name h1 {font-size:28px; color:#1f285b; padding-bottom:10px} .product-view .product-name span {font-size:28px; font-weight:normal; color:#1f285b;} .product-view h2 {padding-bottom:10px} .product-view input, .product-view select {width:100%; max-width:260px} .product-view .product-options {padding:10px 0} .product-view .short-description { padding:20px 0;} .product-view .addproduct {clear:both; overflow:hidden} .product-view .callout .item {padding-bottom:12px; font-size:18px} .product-view .carousel {text-align:center} .product-view .pricing {border-bottom:1px dotted #ed1c29; padding-bottom:20px; margin-bottom:20px} .product-view .product-img-box .product-image {border:1px solid #1f285b} .product-view .add-to-box {padding:20px 0} .product-view .add-to-box label, .product-view .add-to-cart label {display:none} @media all and (max-width: 900px){ .product-view {padding:0 10px} .product-view .right {padding-left:0} .product-view .upsell {margin-top:10px} } @media all and (max-width: 767px){ .product-view .details .right {padding-left:0; padding-top:20px} } /*** Products Image ***/ .product-image img {width:100%} .product-gallery {height:480px!important} @media all and (max-width: 1160px) { .product-gallery {height:320px!important} } @media all and (max-width: 900px){ .product-gallery {height:240px!important} } /*** Reviews ***/ .box-reviews .date {display:block} .box-reviews dd {border-bottom:1px solid #dedad9} .box-reviews .form-add {margin-top:10px} .rating-box {width: 69px; height: 13px; font-size: 0; line-height: 0; background: url(../images/bkg_rating.gif) 0 0 repeat-x; text-indent: -999em; overflow: hidden; float: left; margin-right:10px} .rating-box .rating {float: left; height: 13px; background: url(../images/bkg_rating.gif) 0 100% repeat-x; } /*** Cart ***/ .cart {padding-top:12px} .cart > form {background:#FFF; border:1px solid #e8e8e8; padding:10px; font-size:12px} .cart .discount, .cart .shipping, .cart .crosssell {} .cart-table .btn-continue {float:left} .cart-table .btn-update, .cart-table .btn-empty {float:right} .cart-table .btn-update {margin-left:10px} .cart-collaterals .col2-set {padding-top:10px; overflow:hidden; width:70%; float:left} .totals {width:30%; float:left; padding-left:10px; padding-top:10px;} .totals table {width:100%; background:#FFF; border:1px solid #e8e8e8; padding:10px; font-size:14px; margin-bottom:10px} .totals .checkout-types li {padding-bottom:10px; text-align:center} .totals .btn-checkout {width:100%; padding:10px; font-size:14px} .totals table tfoot {font-size:18px} .cart-cell {position:relative; padding-top:30px; min-width:150px} .cart-cell .price-label {display:none} .cart-cell .btn-cart {padding:5px} .cart-cell .add-to-cart-alt {text-align:center} .cart-cell input.qty {margin:5px 0; height:25px; width:35px!important;} @media all and (max-width: 900px){ .cart {padding:12px 10px 0 10px} .cart-collaterals .col2-set {display:none} .totals {width:100%; padding-left:0} .cart-table .btn-continue, .cart-table .btn-update, .cart-table .btn-empty {float:none; margin:0 0 5px 0; width:95%} .cart-table td:nth-of-type(4):before { content: "Unit Price - Ex. VAT"; } .cart-table td:nth-of-type(5):before { content: "Unit Price - Incl. VAT"; } .cart-table td:nth-of-type(7):before { content: "Subtotal - Ex. VAT"; } .cart-table td:nth-of-type(8):before { content: "Subtotal - Incl. VAT"; } } /*** Checkout ***/ .checkout {padding-top:10px} .order-review table tfoot tr.last {font-size:18px} .opc {position:relative; background:#FFF; font-size:14px; margin-bottom:10px; border-bottom:1px solid #e8e8e8; margin-top: 20px} .opc li.section { border:1px solid #e8e8e8; border-bottom:0; overflow:hidden; padding-bottom:0; margin-left: 0; list-style: none; line-height: 1 } .opc .buttons-set.disabled button.button { display:none; } .opc .buttons-set .please-wait { height:30px; line-height:30px; float:right; padding:0 10px } .opc .buttons-set .please-wait img {width:auto; height:100%} .opc .step-title { background-color:#fbf9fa; padding:5px; text-align:right; overflow:hidden } .opc .step-title .number { float:left; line-height:22px; margin-right:5px; background: #f2f2f2; border: 1px solid #e8e8e8; padding:2px 10px; margin: 0 5px 0 0; font-weight:bold; color:#cdcdcd; border-radius:5px } .opc .step-title h2 { float:left; padding-bottom:0; font-size:16px ; line-height:28px; color:#cdcdcd} .opc .step-title a { display:none; float:right; } .opc .allow .step-title { cursor:pointer; background:#f2f2f2 } .opc .allow .step-title h2 {color:#555} .opc .allow .step-title .number {color:#fff; background:#1f285b} .opc .active {} .opc .active .step-title { background-color:#1f285b; cursor:default; } .opc .active .step-title .number {background:#fff; color:#1f285b} .opc .active .step-title h2 {color:#FFF} .opc .step { border-top:1px solid #e8e8e8; padding:10px; position:relative; } .opc .step .tool-tip { left:30%; top:30%!important; position:absolute; background:#fff; padding:10px; border:2px solid #e8e8e8} .opc .step .tool-tip .btn-close {padding-bottom:10px; text-align:right} .opc .order-review {} .opc .order-review .authentication {} .opc .order-review .warning-message {} .opc .ul {list-style: disc outside; padding-left: 18px;} .opc h4 {padding-top:10px} .opc .btn-checkout {padding:15px 50px; font-size:16px} .cvv-what-is-this {padding:10px 0; display:block} .multiple-checkout { position:relative; } .multiple-checkout .tool-tip { top:50%; margin-top:-120px; right:10px; } .multiple-checkout .grand-total { font-size:1.5em; text-align:right; } .multiple-checkout .grand-total big {} .multiple-checkout .grand-total .price {} /*** CMS ***/ .cms p, .cms ul {padding-bottom:10px} .cms h2 {padding-top:10px} .cms ul li {padding-bottom:5px; line-height:1.5} .cms ul li:before {font-family: 'Elusive-Icons'; padding-right:5px; content: "\f12f";} /*** Contact us ***/ #contactForm .legend {display:none} /*** Account ***/ .account-login, .account-create {padding-top:12px} .account-create form {} .account-create .legend {display:none} .block-account {padding:0; margin-top:10px} .block-account .block-title {padding:12px; margin:0} .block-account ul li {padding:10px} .block-account ul li.last {padding:10px} .account .page-title {margin-top:10px} .box-account {overflow:hidden; padding:10px 0;} .my-account .col-1 {padding-right:10px} .addresses-list h2 {font-size:16px; padding-bottom:0} .addresses-list h3 {font-size:14px; padding-bottom:0} .addresses-list .item {border:1px solid #e8e8e8; padding:10px; margin:10px 0; background:#fbf9fa} @media all and (max-width: 900px){ .my-account {margin:0 10px} .my-account .col-1, .my-account .col-2 {padding:0} .account-create form {margin:0 10px} .block-reorder {display:none} .block-account {margin-top:20px} } /*** Downloads ***/ .download-item {padding:5px} /*** WordPress ***/ .post-view, .post-list .item, .note-msg {} .post-view .featured-image img {max-width:500px; width:100%} .featured-image {border:none!important} .featured-image img {max-width:100%} .blog-desc {display:none} .post-entry p {margin-bottom:0!important} .post-list li.item .post-list-item {border-bottom:1px dotted #ed1c29; padding-bottom:20px; padding-top:20px} .wordpress-term-view .page-title h1 {text-transform:uppercase;} /* Cookies Policy ***/ #cookie-policy { border:2px solid #1f285b; background: #ed1c29; display:block; padding:10px; border-radius:12px; height:200px; position: fixed; bottom:0; right: 0; width:270px; margin:20px; z-index: 9999999 } #cookie-policy h3 { cursor: pointer; color:#ffffff; padding:10px; font-size:16px; border-radius:12px 12px 0 0; margin:0px; position:relative; background: url(../images/close-icon.png) no-repeat 95% center #ed1c29; } #cookie-policy p { background:#ffffff; padding:15px; display:inline-block; line-height: 18px; font-family: 'Roboto', sans-serif; font-size: 14px} #cookie-policy p a { color:#ed1c29; } /** Contact Page ***/ .contact-form {padding-right:40px;} .contact-address p {padding-bottom: 10px;} #map { width: 100%; height: 400px; background-color: grey; margin-bottom: 20px; } /*** World Pay ***/ #payment_form_worldpay_cc {display:none}