﻿/* = Theme
----------------------------------------------------------------------------------------------------------------- */
body {
    color: #222;
}

/* = Typography
-------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #333;
}

a {
    color: #00AACB;
}

a:hover {
    color: #00AACB;
}

hr {
    border-top: 1px solid #ccc;
}

.highlight {
    color: #00AACB;
}

.marked {
    color: #fff;
    background: #00AACB;
}

.meta {
    color: #666;
}

blockquote:before {
    color: #00AACB;
}

blockquote p span:before {
    color: #00AACB;
}

#mainContent p>a:not(.btn),
#mainContent .passwordReset {
    color: #00AACB;
}

#mainContent p>a:not(.btn):hover,
#mainContent .passwordReset:hover {
    text-decoration: underline;
}

/* = Buttons
--------------------------- */
.btn {
    color: #00242c;
    border: 1px solid #00AACB;
    background: #00AACB;
}

.btnImpact {
    background: #fff;
    color: #00AACB;
}

.btn:hover {
    background: #fff;
    border-color: #00242c;
    color: #00242c;
}

.btnAccent {
    border-color: #d5721c;
    background: #d5721c;
}

.coCCBtn,
.coChequeBtn,
.coPaypalBtn {
    background: #fff;
}

.coCCBtn:hover,
.coChequeBtn:hover,
.coPaypalBtn:hover {
    background: #00AACB;
    border-color: #00AACB;
}

.coCCBtn .btn,
.coChequeBtn .btn,
.coPaypalBtn .btn {
    background: none;
}

.coCCBtn:before {
    color: #00AACB;
}

.coChequeBtn:before {
    color: #00AACB;
}

.coCCBtn:hover:before,
.coChequeBtn:hover:before {
    color: #fff;
}

.hamburger span {
    background: #00AACB;
}

.hamburger span::before,
.hamburger span::after {
    background-color: #00AACB;
}

/* = Lists
-------------------------- */
.paging ul li a {
    color: #fff;
    background: #00AACB;
}

.paging ul li a:hover {
    background: #454545;
}

.paging ul li a.on {
    background: #080808;
}

/* = Tables
-------------------------- */
th {
    border: 1px solid #888;
    background: #888;
}

.rowItemStandout td {
    background: #a1c897;
}

/* = Screen Messages
-------------------------- */
.msgImp {
    color: #fff;
    background: #8ec3d9;
}

.msgImp a {
    color: #fff;
}

.msgError {
    color: #fff;
    background: #e84d54;
}

.msgSuccess {
    color: #fff;
    background: #a1c897;
}

.msgSuccess h3 {
    color: #fff;
}

.msgSuccess a {
    color: #fff;
}

.msgAssist {
    background-color: #fff0bc;
}

/* = Tabs
--------------------------- */
.tabs ul li a {
    color: #222;
}

.tabs ul li a:hover {
    color: #666;
}

.tabs ul li a.on {
    color: #00AACB;
}

.tabs ul li a:hover:after {
    background: #666;
}

.tabs ul li a:after {
    background: #fff;
}

.tabs ul li a.on:after,
.tabs ul li a.on:hover:after {
    background: #00AACB;
}

.tabs .dropdownPrompt {
    background: #f7f7f7;
    border: 1px solid #ddd;
    color: #000;
}

.tabs .dropdownPrompt:after {
    border-color: #444 transparent transparent transparent;
}

.tabs .dropdown.showOptions {
    border: 1px solid #ddd;
}

.tabs .dropdown.showOptions li a:hover {
    color: #00AACB;
}

.tabs .dropdown.showOptions a.on,
.tabs .dropdown.showOptions a.on:hover {
    background-color: #00AACB;
    color: #fff;
}

/* = Accordion
--------------------------- */
.accordion>h3 {
    color: #00AACB;
    border: 1px solid #00AACB;
}

.accordion>h3:hover {
    background: #f3f3f3;
    border: 1px solid #00AACB;
}

.accordion>h3.on {
    color: #fff;
    background: #00AACB;
}

/* = Forms
----------------------------*/
.select:after {
    border-color: #444 transparent transparent transparent;
}

.formList label:before,
.checkbox:before,
.check:before {
    border: 1px solid #ddd;
}

.radList label.checked:after,
.formListRadio label.checked:after {
    background: #00AACB;
}

.checkList label.checked:after,
.formList:not(.radList):not(.formListRadio) label.checked:after,
.checkbox.checked:after,
.check.checked:after {
    border: solid #00AACB;
    border-width: 0 2px 2px 0;
}

/* = Framework > Header items
------------------------------- */
/*Replace logo, and change height to match exact logo height*/
.logo>a {
    background: url(/_img/logo_tun.jpg) no-repeat 0 50%;
    background-size: contain;
    height: 160px;
}

.miniBasket .item:before {
    color: #00AACB;
}

.miniBasket .btn {
    color: #00AACB;
    border-color: #00AACB;
    background: none;
}

.miniBasket .btn:before {
    background: #00AACB;
}

.miniBasket .btn:hover,
.miniBasket .btn:focus,
.miniBasket .btn:active {
    color: #fff;
    border-color: #00AACB;
}

.no-csstransforms3d .miniBasket .btn:hover,
.no-csstransforms3d .miniBasket .btn:focus,
.no-csstransforms3d .miniBasket .btn:active {
    background: #00AACB;
    border-color: #00AACB;
}

@media screen and (max-width: 800px) {
    .logo a {
        background-position: 50% 50%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 620px) {
    .basket-geo-wrap .miniBasket {
        background: #f6f6f6;
    }
}

@media screen and (max-width: 600px) {
    .basket-geo-wrap {
        display: none;
    }
    .miniBasket {
        margin-left: 0;
        margin-right: 52px;
    }
}

/* = Footer
----------------------------- */
#footer {
    border-top: 1px solid #00AACB;
}

#footer .footerMenu ul li {
    margin-right: 8px;
}

#footer .footerMenu ul li::after {
    display: none;
}

@media screen and (max-width: 750px) {
    #footer .footerMenu ul li {
        margin-right: 0;
    }
}

/* = Popup message
---------------------------- */
#popup .ClosePopup {
    background: #00AACB;
}

#popup .ClosePopup:hover {
    background: #00242c;
}

/* = Menu
---------------------------- */
#nav {
    background: #f7f7f7;
}

#nav ul li.liOn a {
    background: #00AACB;
    color: #00242c;
}

#nav ul li a:hover {
    background: #00AACB;
    color: #00242c;
}

.geoSelectMobile {
    display: none;
}

@media screen and (max-width: 600px) {
    .main-nav-wrap {
        background: #00AACB;
    }

    #nav {
        background: none;
    }

    #nav ul li {
        border-bottom: 1px solid #00242c;
    }

    #nav ul li a {
        color: #00242c;
    }

    .shopHotline {
        background: #f7f7f7;
        color: #00AACB;
    }

    .geoSelectMobile {
        display: block;
        padding: 0 36px;
    }

    .geoSelectMobile .geoSwitcher>span {
        display: block;
        margin-bottom: 6px;
    }
}

@media screen and (max-width: 340px) {
    #nav {
        background: none;
    }
}

/* =  Menu > submenu
-------------------------------- */
#subNav {
    background: #00AACB;
}

#subNav ul li a {
    color: #00242c;
}

.submenuTrigger {
    color: #00242c;
    background: #00AACB;
}

.submenuTrigger .hamburger span {
    background: #fff;
}

.submenuTrigger .hamburger span:before,
.submenuTrigger .hamburger span:after {
    background-color: #fff;
}

.submenuTrigger .hamburger.is-active span {
    background: none;
}

@media screen and (max-width: 800px) {
    #subNav {
        background: #d5e6e6;
    }

    #subNav ul li a {
        color: #00AACB;
    }
}

/* = Product list
--------------------------------*/
.productList ul li .price {
    color: #00AACB;
}

/* = Checkout proccess
----------------------------------------------------------------------------------------------------------------- */
.checkoutProgress li a {
    background: #d8eaea;
    color: #00AACB;
}

.checkoutProgress li a:after {
    border-color: transparent transparent transparent #d8eaea;
}

.checkoutProgress li a:hover:after {
    border-color: transparent transparent transparent #00AACB;
}

.checkoutProgress li a.btnDisabled:hover {
    background: #d8eaea;
    color: #00AACB;
}

.checkoutProgress li a.btnDisabled:hover:after {
    border-color: transparent transparent transparent #d8eaea;
}

.checkoutProgress .progressActive a,
.checkoutProgress .progressComplete a {
    background: #00AACB;
    color: #fff;
}

.checkoutProgress .progressActive a:after,
.checkoutProgress .progressComplete a:after {
    border-color: transparent transparent transparent #00AACB;
}

.checkoutProgress .progressActive a:hover:after,
.checkoutProgress .progressComplete a:hover:after {
    border-color: transparent transparent transparent #00AACB;
}

@media screen and (max-width: 900px) {
    .checkoutProgress .progressActive:first-child a:after {
        border-color: #00AACB;
    }

    .checkoutProgress li.progressComplete:first-child a:after,
    .checkoutProgress li.progressComplete:first-child a:hover:after {
        border-color: transparent #00AACB transparent transparent;
    }
}

/* = Cookie
----------------------------------------------------------------------------------------------------------------- */
.cookie {
    color: #fff;
}

.cookie .container {
    background: #444;
}

.cookie p a {
    color: #fff;
}