/**
 * @brief UPOSBasicDesign Theme handheld format styles
 * @details Plugin / Theme Styles
 * @author JB Lebrun
 * @version 1.0.2
 * @date Creation: Nov 2020
 * @date Modification: Dec 2022
 * @copyright 2020 - 2022 Ideogram Design
 */
.hiddenOnMobile {display:none !important;}
img.halfWidth {max-width:100%;}

/* media popup */
.mediaPopupBkgd {background:white; opacity:1;}
.mediaPopup {height:auto !important; position:fixed !important; top:0 !important; bottom:0 !important; left:0 !important; overflow-y:auto; border-radius:0; max-width:100%; box-sizing: content-box;}
.mediaPopup div {max-width:100%;}
.mediaPopup div object {max-width:100%;}

/* cookie agreement message */
.cookieAgreementMessage {max-width:100%; left:0; right:0;}

/* social networks */
.SNSP.follow {top:auto !important; bottom:0 !important; width:auto !important;}

/* editor */
* {font-size: 14px;}

.eTitle1 {font-size:20px;}
.eTitle2 {font-size:18px;}
.eTitle3 {font-size:16px;}
.eTitle4 {font-size:16px;}

.eContent3 {font-size:16px;}

/* parts */
.UPOSBasicButton {min-width: 80px;}
.UPOSBasicButton2 {min-width: 80px;}

/* header */
#pageHeader .demoMessage {font-size:11px;}
#pageHeader .headBar {height:70px;}
#pageHeader .headBar .logo {width:120px; height:120px; background-size:100% 100%;}
#pageHeader .headBar .sites {display:none;}

#pageHeader .headBar .myCaddy {width:70px; height:70px; margin-top:0px;}
#pageHeader .headBar .myMenu {display:block; float:right; background:url(../img/custom/menu.png) 50% 50% no-repeat #e3a944; width:70px; height:70px; margin-top:0px;}

#pageHeader .headBar .menu {display:none;}
#pageHeader .headBar .account {width:70px; height:70px; margin-top:0px;}
#pageHeader .headBar .account img {width:auto; max-width:100%; position:static;}

#pageHeader .subBar .mobileSiteSelector {display:block; text-align:right; padding:10px;}
#pageHeader .subBar .title {display:block; margin:0px; width:auto; padding: 10px 12px 0; text-align:right;}
#pageHeader .subBar .caddy {width:100%; margin-bottom:15px; box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25);}
#pageHeader .subBar .caddy .finaliseButton {padding:8px 12px;}

/* Mobile menu */
#MobileMenu {width:100%; float:none; display:none; background:white; margin-bottom:16px; box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25);}
#MobileMenu .menuHeader {display:none;}

/* Mobile menu : shop top level */
#MobileMenu .family {display:block; padding:12px 20px 2px; font-size:18px; color:#444444; text-transform:uppercase; text-align:right; transition: all 0.3s;}
#MobileMenu .family:hover {color:#e3a944;}
#MobileMenu .family.selected {color:#e3a944;}

/* Mobile menu : shop L2 menus */
#MobileMenu .subMenu {padding:0 20px; text-align:right;}
#MobileMenu .subMenu .category {display:block; font-size:14px;}

/* Mobile menu : shop L3 menus */
#MobileMenu .subfamilies {margin:0 20px 0 0;}
#MobileMenu .subfamilies .subfamily {display:block; text-align:right; border-right:solid 4px #888888; color:#444444 !important; font-size:15px; padding-right:4px;}
#MobileMenu .subfamilies .subfamily + .subfamily {margin-top:2px;}
#MobileMenu .subfamilies .subfamily:hover {border-right:solid 4px #e3a944; color:#e3a944;}
#MobileMenu .subfamilies .subfamily.selected {border-right:solid 4px #e3a944; color:#e3a944; font-weight:bold;}

#MobileMenu .categories {margin:0 0 12px 0; border-right:solid 1px #e3a944;}
#MobileMenu .categories .category {display:block; text-align:right; font-size:14px; padding-right:7px; color:#444444 !important;}
#MobileMenu .categories .category:hover {color:#e3a944;}
#MobileMenu .categories .category.selected {color:#e3a944; font-weight:bold;}

/* Mobile menu : extra pages */
#MobileMenu .page {display:block; padding:12px 20px; background:#e3a944; text-align:right; font-size:14px; color:white !important;}

/* footer */
#pageFooter .menu {display:block; width:100%;}
#pageFooter .designers {display:block; width:100%;}

/* content */
.mainContent.htmlContent {padding:20px;}

/* form */
.formHalfLine {width:100%;}

/* home */
.homePortal .banners .banner a {width:100%; display:block; overflow:hidden;}
.homePortal .banners .banner a img {width:95%; max-width:950%; display:block; overflow:hidden; text-align:right; margin:0 auto;}

.homePortal .freeContent .mainContent{padding:20px;}

.homePortal .shopButton .content {display:block; width:100%; padding: 10px 20px;}
.homePortal .shopButton .content * {text-align:left;}
.homePortal .shopButton .button {display:block; width:100%; padding: 20px 0 10px;}

.homePortal .articles .article {display: block; width: 100%; margin-top:20px;}
.homePortal .articles .article .footer {height:42px;}
.homePortal .articles .article .footer .UPOSBasicButton {float:none; margin-right:8px;}

.homePortal .guestbook .messages {display:block; width:100%;}
.homePortal .guestbook .buttonBox {display:block; width:100%;}

.homePortal .survey .column {width:100%;}

/* shop */
.shop {margin: 0 auto;}

/* shop - families */
.shop .families {width:100%; float:none; display:none; background:#efefef; margin-bottom:16px; box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25);}
.shop .families .menuHeader {display:block; padding: 10px 16px; background:#e3a944; text-transform: uppercase; font-size: 18px;}
.shop .families .family {padding:12px 20px; font-size:18px; border-bottom:solid 1px #dfdfdf;}

/* shop - articles */
.shop .articles {margin-left:0px; text-align:center;}
.shop .articles .article.col2 {width: 80% !important;}
.shop .articles .article.col3 {width: 80% !important;}

/* shop - articles thumb list */
.shop .articles.text {padding-left:20px;}
.shop .articles.text .article {display:block; text-align:center; border-bottom:none; padding:0 0 8px;}
.shop .articles.text .article .title {text-align:center; display:block;}
.shop .articles.text .article .priceBar {}


.shop .articleSingle {margin-left:20px;}
.shop .articleSingle .actions .priceBox {width:244px; margin-left: 10px; background:#e3a944;}
.shop .articleSingle .actions .priceBox .price {width:60px; color:white; padding-left:0;}
.shop .articleSingle .actions .priceBox .orderButton {width:168px; background:none; padding-right:0;}

.shop .articleSingle .extra .block {width:100%; display:block; margin-bottom:15px;}

/* shop - selection panel */
#SelectionPanel {padding:10px 20px; width:100%; height:auto; overflow:none; background:white;}
#SelectionPanel .articles.last {border:none !important;}
#SelectionPanel .articles .article {display:block; width:100%;}

/* order */
.order {font-size:0; padding:10px;}
.order .paymentDemo .creditcard {display:block; margin:0 0 20px;}

/* articles */
.articles .article .date {width:55px;}
.articles .article .content {margin-left: 75px; padding-left: 16px;}

/* accounts */
.accountViewer {padding: 20px 50px;}

/* ratings */
.articleSingle .ratings .rating {display:block; width:96%; margin:0 0 4%;}