/* ------------------------------------------------
   The Whisky Exchange
   Designed and Built by The Whisky Exchange
   All Rights Reserved

   Account CSS file 

   Content:
   Title
   Subtitle
   Inline Text Styles
   Notes
   Navigation
   Notifications
   Login Page
   ------------------------------------------------ */
/* ------------------------------------------------
   Structure
   ------------------------------------------------ */
#tweAccount {
   padding-bottom: 30px;
}
/* ------------------------------------------------
   Title
   ------------------------------------------------ */
#tweAccount .title {
   margin: 20px 0;
}
#tweAccount .title .title-text {
   padding: 0 10px;
   font-family: 'Fjalla One','Lato',arial,sans-serif;
   font-weight: 400;
   font-size: 2.5em;
   text-transform: uppercase;
   text-align: center;
   letter-spacing: 1px;
   color: #5f1d07;
}
@media (min-width: 660px) {
   #tweAccount .title .title-text {
      text-align: left;
   }
}
/* ------------------------------------------------
   Subtitle
   ------------------------------------------------ */
#tweAccount .subtitle {
   margin: 30px 0 10px;
}
#tweAccount .subtitle .subtitle-text {
   margin-bottom: 5px;
   font-family: 'Fjalla One','Lato',arial,sans-serif;
   font-weight: 400;
   font-size: 2em;
   text-transform: uppercase;
   letter-spacing: 1px;
   color: #5f1d07;
}
@media (min-width: 660px) {
   #tweAccount .subtitle .subtitle-text {
      text-align: left;
   }
}
/* Subtitle Text */
#tweAccount .subtitle-subtext {
   display: block;
   font-size: 1.1em;
}
@media (min-width: 660px) {
   #tweAccount .subtitle-subtext {
      font-size: 1.3em;
   }
}
/* ------------------------------------------------
   Inline Text Styles
   ------------------------------------------------ */
#tweAccount .text-brown {
   color: #5f1d07;
}
#tweAccount .text-purple {
   color: #6d004d;
}
#tweAccount .text-green {
   color: #56d64e;
}
#tweAccount .text-blue {
   color: #3a5ba2;
}
#tweAccount .text-red {
   color: #960000;
}
#tweAccount .text-grey {
   color: #666;
}
#tweAccount .text-orange {
   color: #ff7010;
}
#tweAccount .text-bold {
   font-weight: 700;
}
#tweAccount .text-italic {
   font-style: italic;
}
/* ------------------------------------------------
   Notes
   ------------------------------------------------ */
#tweAccount .notes-list {
   display: block;
}
#tweAccount .notes-list .note {
   margin-bottom: 10px;
   font-size: 0.8em;
}
#tweAccount .notes-list .note:last-of-type {
   margin-bottom: 0;
}
/* ------------------------------------------------
   Navigation
   ------------------------------------------------ */
/* Container */
#tweAccount .account-navigation {
   position: relative;
   height: 90px;
   background: #f6f6f6;
   font-size: 1.1em;
}
#tweAccount .account-navigation .navigation-line {
   display: block;
   position: absolute;
   width: 100%;
   height: 2px;
   top: 25px;
   left: 0;
   background: #666;
}
@media (min-width: 450px) {
   #tweAccount .account-navigation .navigation-line {
      top: 35px;
   }
}
/* Layout */
#tweAccount .account-navigation .navigation-list {
   display: block;
   float: left;
   width: 100%;
}
#tweAccount .account-navigation .navigation-list .navigation-item {
   display: block;
   float: left;
   width: 25%;
   padding: 0 10px;
}
/* Navigation Items*/
#tweAccount .account-navigation .navigation-link {
   display: block;
   width: 100%;
   font-family: 'Fjalla One','Lato',arial,sans-serif;
   text-transform: uppercase;
   text-align: center;
   color: #666;
}
#tweAccount .account-navigation .navigation-link.stage-active {
   color: #ff7010;
}
#tweAccount .account-navigation a.navigation-link:hover {
   color: #ff7010;
}
#tweAccount .account-navigation .navigation-link .icon {
   display: block;
   margin-top: 5px;
}
#tweAccount .account-navigation .navigation-link .text {
   display: block;
   margin-top: 3px;
   font-size: 0.8em;
   letter-spacing: 1px;
}
@media (min-width: 450px) {
   #tweAccount .account-navigation .navigation-link .icon {
      margin-top: 15px;
   }   
}
@media (min-width: 660px) {
   #tweAccount .account-navigation .navigation-link .text {
      font-size: 1em;
      letter-spacing: normal;
   }
}
/* ------------------------------------------------
   Notifications
   ------------------------------------------------ */
/* Structure */
#tweAccount .notifications {
   margin-top: 20px;
   font-size: 1.1em;
}
#tweAccount .notifications .container {
   padding: 0 10px;
}
/* Layout */
#tweAccount .notifications .notification-list,
#tweAccount .notifications .notification-item {
   float: left;
   width: 100%;
}
#tweAccount .notifications .notification-item {
   display: table;
   table-layout: fixed;
   padding: 10px 10px 10px 0;
   background: #efece3;
   margin-bottom: 10px;
}
#tweAccount .notifications .notification-item:last-of-type {
   margin-bottom: 0;
}
#tweAccount .notifications .notification-item .notification-icon {
   display: table-cell;
   width: 50px;
   vertical-align: middle;
   text-align: center;
   font-size: 1.5em;
   color: #5f1d07;
}
#tweAccount .notifications .notification-item .notification-content {
   display: table-cell;
   vertical-align: middle;
}
/* Content */
#tweAccount .notifications .notification-item .notification-title {
   display: block;
   margin-bottom: 5px;
   font-weight: 700;
   color: #5f1d07;
}
#tweAccount .notifications .notification-item .notification-text {
   display: block;
}
#tweAccount .notifications .notification-item .notification-text .link {
   color: #6d004d;
   text-decoration: underline;
}
/* ------------------------------------------------
   Login Page
   ------------------------------------------------ */
/* Container */
#tweAccount .account-login .col {
   float: right;
}
/* New Account Content */
#tweAccount .account-new .account-new-content {
   border-top: 1px solid #d2d2d2;
   padding-top: 10px;
}
#tweAccount .account-new .account-new-button {
   text-align: center;
   border-top: 1px solid #d2d2d2;
   padding: 20px 0;
}
/* ------------------------------------------------
   Account Content
   ------------------------------------------------ */
#tweAccount .account-content {
   
}