/****************** Font's declare ********************/

@font-face {
    font-family: 'Lato Bold';
    src: url('../fonts/Lato-Bol.ttf');
}
/****** General ******/

body {
    font-family: arial, sans-serif;
    font-size: 16px;
}
/* Link Styles */

a,
a:link,
a:visited {
    cursor: pointer;
    font-size: inherit;
    font-weight: normal;
    text-decoration: underline;
}
a:hover {
    text-decoration: none;
}
a:before,
a:after {
    font-size: 0.875em;
}
/****************** formbox.css ******************/

.formbox,
.externl_row {
    text-align: left;
}
label,
.label,
.labelMandatory,
.labelError,
.labelBG,
.Labelbg,
.labelbg {
    line-height: normal;
    text-align: left;
}
.areaform {
    text-align: left;
}
.RowHeader,
.errorBlock p {
    font-size: 0.875em;
    font-weight: bold;
    text-align: left;
}
.errorBlock h2,
.successBlock p {
    font-size: 1em;
    font-weight: normal;
    text-align: left;
    text-transform: uppercase;
}
/*------ Popup login box ----*/

#loginBoxx {
    text-align: center;
}
#loginBoxx #username:before,
#loginBoxx #password:before {
    line-height: 26px;
}
/*************************************** mcom.css ***************************************/

.headerpage {
    font-family: "Montserrat", sans-serif;
    font-size: 1.75em;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
}
.headerpage .headerpage {
    font-size: inherit;
}
.headercontent,
.Title,
.CTitle1 {
    font-weight: bold;
}
.headersection,
div:not(.areaform) > .headersection,
.LTitle1 {
    font-size: 1.125em;
    text-align: left;
    text-transform: uppercase;
}
.CTitle1 {
    text-align: center;
}
.Total,
.BoldText,
.SectionLabel,
.LeftLabel,
.LeftLabelBG,
.RightLabel,
.RightLabelBG {
    font-weight: bolder;
}
.LeftLabel,
.LeftLabelBG {
    text-align: left;
}
.RightLabel,
.RightLabelBG,
.RightText,
.Total {
    text-align: right;
}
.SectionLabel {
    text-align: left;
}
.recordfound,
.pagenumber {
    font-size: 0.875em;
}
/*************************************** mcomfundation.css ***************************************/
/*** Report - Filter Classes ***/

#queryContent,
.queryContent {
    text-align: center;
}
.fieldGroup {
    text-align: left;
}
/*** Report - Grid Classes ***/

table thead tr th {
    font-weight: bold;
    text-align: center;
    text-transform: capitalize;
}
table thead tr th.exportToExcelTh a .exportToExcelText {
    text-decoration: underline;
}
.reportContainer .reportTitle {
    font-size: 0.8em;
}
.reportRecordFound {
    text-align: left;
}
.reportTitle .paginationLink a,
.reportTitle .headerPagination1 .showAllLink {
    text-align: center;
    text-decoration: none;
}
.headerInfo1 {
    text-transform: capitalize;
}
/* Buttons */

table,
input,
select,
option,
textarea {
    font-size: 0.875em;
}
button.fieldButton,
button,
input[type=button],
input[type="submit"],
input[type="reset"],
.fakeButton {
    font-size: 0.875em;
    font-size: 0.875rem;
    font-weight: normal;
    text-transform: uppercase;
}
table table,
table input,
table select,
table option,
table textarea,
table button {
    font-size: inherit;
}
.fieldButtonDelete,
.fieldButtonDelete:hover {
    font-weight: bold;
    text-decoration: none !important;
}
button[onclick^="popUpCalendar3"],
button[onclick^="onClickCalendar"] {
    font-size: 0;
    line-height: 0;
}
.nav_buttons {
    text-align: right;
}
/****** Wrapper ******/

#wrapper {
    text-align: center;
}
/****** Content ******/

#content {
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: normal;
    white-space: normal;
}
/****** Header ******/

#hdrheader {
    text-align: left;
}
#header .image {
    line-height: 0;
}
#header .image,
#header .rightHead {
    vertical-align: middle;
}
#hdrinside {
    font-size: 0.875em;
    text-align: right;
}
.headerReference {
    vertical-align: middle;
}
.rightHead .topHead a.iconLogoff {
    font-size: 1.375em;
    line-height: normal;
    text-decoration: none;
}
.rightHead .topHead a.iconLogoff:before {
    content: "\f011";
}
.headerNotifications {
    line-height: normal;
}
.headerNotifications .headerCounter {
    font-size: 0.875em;
    line-height: 22px;
    text-align: center;
}
.rightHead .topHead {
    text-align: left;
}
/*------ User info ------*/
#hdrloginasuser .userInfoContent {
    line-height: normal;
    vertical-align: middle;
}
#hdrloginasuser .userInfoContent > span > span,
#hdrloginasuser .userInfoContent > span > strong {
    vertical-align: middle;
}
.rightHead .topHead a.iconLogoff {
    vertical-align: middle;
}
.rightHead .topHead > div,
.rightHead .topHead > span,
.rightHead .bottomHead > div,
.rightHead .bottomHead > span,
.rightHead .shortcutsShop > span,
.rightHead .shortcutsShop > button {
    display: inline-block;
    float: none;
    vertical-align: middle;
}
/****** Footer ******/

#footer {
    text-align: center;
}
#magicDotContainer {
    text-align: center;
}
#footer .copyright a {
    font-size: 0.7em;
    text-decoration: none;
}
/*************************/

#navigationTitle {
    text-align: center;
}
.navigationTitle.triangle li a {
    font-size: 13.5px !important;
}
/* Cart Container */

#cartEmptyOuterContainer p {
    font-size: 0.875em;
    line-height: 28px;
}
#cartReviewContainer,
#cartEmptyOuterContainer,
#basket {
    text-align: center;
}
#cart th {
    font-weight: bold;
}
.cartProductInfo {
    font-size: 0.875em;
}
.cartProductName,
.cartProductId,
.cartProductQty {
    text-align: center;
}
.cartProductPrice,
.cartProductTax {
    font-weight: bold;
}
.cartCheckoutBtn {
    text-align: center;
}
.cartContent .cartDeleteBtn + span {
    line-height: 25px;
    vertical-align: middle;
}

/*------ product pagination -------*/
.productPagination {
    text-align: center;
}
.productPagination a {
    font-size: 0.875em;
}
/* Basket */

#basket h2 {
    font-size: 1em;
    text-align: center;
}
#productInfoContainer {
    font-size: 0.875em;
    text-align: center;
}
#productPrice {
    font-weight: bold;
}
.productDetailBox {
    font-size: 0.875em;
    text-align: left;
}
.productDetailBox .productImage {
    text-align: center;
}
.productDetailBox .productDesc .itemText {
    font-weight: bold;
}
.productDetailBox .productDesc .itemPrice {
    font-style: italic;
}
/********************  Icons  **************************/

button.btnimg:before {
    content: "\f0c7";
    margin-right: 0.5em;
}
button[onclick^="popUpCalendar"]:before,
button[onclick^="onClickCalendar"]:before,
.iconCalendar:before {
    content: "\f073";
}
#calendar #spanLeft:before {
    content: "\f053";
}
#calendar #spanRight:before {
    content: "\f054";
}
#calendar #spanMonth:after,
#calendar #spanYear:after,
#calendar #spanTime:after {
    content: "\f078";
}
#calendar #spanTime:before {
    content: "\f017";
}
#calendar a[href*="hideCalendar"]:before {
    content: "\f00d";
    font-size: 1.25em;
}
.headerNotifications:before,
#sharingContainer:before {
    font-size: 1.625em;
}
#cartCounterContainer:before {
    content: "\f07a";
}
#sharingContainer:before {
    content: "\f1e0";
}
#chatCounterContainer:before {
    content: "\f086";
}
#loginBoxx #username:before {
    content: "\f007";
}
#loginBoxx #password:before {
    content: "\f084";
}
/* Buttons and Form elements */
button.share:before {
    content: "\f1e0";
    font-weight: normal;
    margin-right: 0.5em;
}
button.button_buy_small_add:before {
    content: "\f067";
    margin-right: 0.5em;
}
button.button_buy_small_delete:before {
    content: "\f068";
    margin-right: 0.5em;
}
.fakeButton {
    line-height: normal;
    vertical-align: middle;
}
table.cartContent tr.btnUpdate button:before {
    content: "\f021";
    margin-right: 0.5em;
}
.successBlock p:before {
    content: "\f058";
}
.errorBlock h2:before {
    content: "\f071";
}
a.editIcon:after {
    content: "\f040";
}
/*------- Calendar ------*/
#calendar a {
    cursor: pointer;
    font-weight: normal;
    text-decoration: none;
}

/*******************************************************
*****************  Media queries  **********************
********************************************************/
@media screen and (max-width: 1366px) {} @media screen and (max-width: 1024px) {
    /*--------- Header ----------*/

    #hdrlanguage select {
        font-size: 12px;
    }
}
@media screen and (max-width: 768px) {
    .tdTitle {
        font-weight: bold;
    }
    /*-------- Credit Card 2 ---------*/
    /* Muestra los encabezados
       a la izquierda y las filas
       a la izquierda con scroll */
       table.table_creditcard2 th {
        text-align: right;
    }
    table.table_creditcard2 td {
        text-align: left;
    }
    table.table_creditcard2 th,
    table.table_creditcard2 td {
        vertical-align: middle;
    }
    table.table_creditcard2 tbody {
        white-space: nowrap;
    }
    table.table_creditcard2 tbody tr {
        vertical-align: top;
    }
    table.table_creditcard2 td {
        text-align: left;
    }

    /*----- Behave  like a "row" -----*/

    table.responsive-table td {
        text-align: right!important;
    }
    table.responsive-table td input[type="text"] {
        float: right;
    }
    table.responsive-table tr.tr-total {
        font-weight: bolder!important;
    }
    table.responsive-table tr.tr-border-top {
        border: none!important;
    }
    table.responsive-table td input[type="text"] + a > img {
        min-height: 30px;
    }
    table.responsive-table td:before {
        font-weight: bold;
        text-align: left;
    }
    /*-------- Label the data -------*/

    table.responsive-table td.td-left {
        text-align: left!important;
    }
    table.responsive-table td.td-center {
        text-align: center!important;
    }
    table.responsive-table td:before {
        font-weight: bold;
        text-align: left;
        white-space: nowrap;
    }
}
@media screen and (max-width: 480px),
screen and (max-height: 500px) {
    body {
        font-size: 18px;
    }
    /**** Encabezado ****/
    /******* Header *******/
    /**** Primer Nivel *****/
    #header {
        text-align: center;
    }
    #header #imageLogoHeader {
        text-align: left;
    }
    #header #hdrheader {
        text-align: right;
    }
    /**** Segundo Nivel *****/

    .rightHead .topHead,
    .rightHead .bottomHead {
        text-align: left;
    }
    .bottomHead {
        text-align: left !important;
    }
    /**** Tercer Nivel *****/

    .topHead #hdrloginasuser,
    .topHead #hdrlanguage,
    #hdrlanguage select {
        font-size: 12px;
        padding: 0.2em 0;
        text-align: left;
    }
    #user-info {
        line-height: 25px!important;
    }
    /*---- Header shortcuts -----*/

    .topHead .iconLogoff.color2,
    .topHead .verticalDivision,
    .topHead #chatCounterContainer,
    .topHead #sharingContainer,
    .topHead #placeholder-div-hangout {
        text-align: center;
    }
    .headerNotifications .headerCounter {
        font-size: 0.6em;
        line-height: 17px;
        text-align: center;
    }
    .headerNotifications:before,
    .rightHead .topHead a.iconLogoff:before,
    .topHead .verticalDivision:before,
    .topHead #chatCounterContainer:before,
    .topHead #sharingContainer:before,
    .topHead #placeholder-div-hangout:before {
        font-size: 20px;
    }
    .bottomHead #shortcutsShop button {
        font-size: 9px;
        text-align: center;
    }
    /*-------  formbox -------*/
    #showAnchor,
    #hideAnchor,
    .headerInfo1 {
        text-indent: 0.5em;
    }

    /*------ Ship -------*/

    .eAuto.fa.fa-truck {
        font-size: 3em;
    }
    .headerpage > span {
        font-size: 26px;
    }
    table.responsive-table tr.tr-total {
        text-align: right !important;
    }

    /*-------- Nav buttons ---------*/
    .nav_buttons .fieldButton {
        font-size: 12px;
    }
    .row_nav_buttons .nav_buttons > a {
        font-size: 12px;
        font-weight: 700;
        text-align: center;
        text-decoration: none;
        text-transform: uppercase;
    }
}