/**
 * @brief MrDonerStyle Theme handheld format styles
 * @details Plugin / Theme Styles
 * @author JB Lebrun
 * @version 1.0.3
 * @date Creation: Sep 2022
 * @date Modification: Nov 2022
 * @copyright 2022 Ideogram Design
 */

.hiddenOnMobile {display:none !important;}
img.halfWidth {max-width:100%;}

/* media popup */
.mediaPopupBkgd {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; display:block;}
.cookieAgreementMessage.minimised {display:none;}

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

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

/* parts */
.MrDonerButton {min-width: 80px; margin-bottom:12px;}
.MrDonerButton2 {min-width: 80px; margin-bottom:12px;}

/* header */
#pageHeader .demoMessage {font-size:11px;}
#pageHeader .headBar {height:80px;}
#pageHeader .headBar .logo {width:80px; height:80px; background-size:95% auto; margin: 12px 0 0 20px;}
#pageHeader .headBar .sites {display:none;}

#pageHeader .headBar .myCaddy {width:80px; height:80px; margin-top:0px; border-right:solid 1px black;}
#pageHeader .headBar .myMenu {display:block; float:right; background:url(../img/custom/menu.png) 50% 50% no-repeat #FFCD00; width:80px; height:80px; margin-top:0px; border-left:solid 1px black;}

#pageHeader .headBar .menu {display:none;}
#pageHeader .headBar .account {width:80px; height:80px; 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 {margin-left:0; width:auto; padding: 20px 12px 0 20px;}
#pageHeader .subBar .caddy {width:100%; margin-bottom:15px; box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25);}
#pageHeader .subBar .caddy .total {text-align:right;}
#pageHeader .subBar .caddy .finaliseButton {padding:8px 12px; margin: 0 20px 0 auto;}
#pageHeader .subBar .caddy .articles {padding: 8px 8px 4px;}
#pageHeader .subBar .caddy .articles .article {padding:0;}

/* footer */
#pageFooter .box {padding:20px 20px 0;}
#pageFooter .box .schedules {display:block; width:100%; padding-bottom: 20px;}
#pageFooter .box .socialNetworks {display:block; width:100%;}

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

/* home */
.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%; vertical-align:top;}
.homePortal .articles .article:last-child {display:none;}

.homePortal .guestbook .messages {display:block; width:100%;}
.homePortal .guestbook .buttonBox {display:block; width:100%; text-align:center; padding-top:12px;}

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

/* menu */
#MobileMenu {width:100%; display:none; background:#FFCD00; margin-bottom:16px; box-shadow: 0 6px 6px 0px rgba(0,0,0,0.25); padding-bottom:20px;}
#MobileMenu .menuHeader {display:block; padding: 0 16px; background:#FFCD00; text-transform: uppercase; font-size: 4px;}
#MobileMenu .family {color:black; padding:12px 20px 0; font-size:18px; display:block; text-transform:uppercase;}
#MobileMenu .family:first-of-type {background:none;}
#MobileMenu .family:last-of-type {padding:12px 20px;}
#MobileMenu .family:hover {}
#MobileMenu .family.selected {font-family: 'OpenSansBold', sans-serif;}
#MobileMenu .family.hasSubMenu {}

#MobileMenu .subMenu {margin-left:30px;}
#MobileMenu .subMenu.off {display:none;}
#MobileMenu .subMenu.on {display:block;}
#MobileMenu .subMenu .category {display:block; padding:0; text-transform:uppercase; font-size:16px; color:black; transition: all 0.3s;}
#MobileMenu .subMenu .category:hover {}
#MobileMenu .subMenu .category.selected {font-family: 'OpenSansBold', sans-serif;}

#MobileMenu .page {display:inline-block; color:black; padding:6px 20px; text-transform:uppercase; font-size:16px; border:solid 1px black; margin:12px 20px 0; }
#MobileMenu .page:first-child {}
#MobileMenu .page:hover {color:white; border:solid 1px white;}
#MobileMenu .page.selected {color:white; font-family: 'OpenSansBold', sans-serif;}

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

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

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

.shop .articles .article {margin:2px;}
.shop .articles .article .title {font-size:13px;}
.shop .articles .article .priceBar {width:90%;}
.shop .articles .article .priceBar .orderButton {display:block; float:left;}
.shop .articles .article .priceBar .price {display:block; margin-left:40px; padding-left:0; padding-right:0; width:100%; text-align:left;}
.shop .articles .article .priceBar .price::after {display:none;}

/* shop - categorie list *
.shop .categories {margin-left:0px; text-align:center; background-size:auto 60vw;}
.shop .categories .categoryButton {height:60vw;}
.shop .categories .categoryButton .picture {height: 45vw;}
.shop .categories .categoryButton .button {height: 15vw; padding-top:10px;}
*/
.shop .categories {margin-left:0px; text-align:center;}
.shop .categories .categoryButton {width:100%;}

/* shop - article */
.shop .articleSingle {margin-left:20px;}

.shop .articleSingle .actions {text-align:center;}
.shop .articleSingle .actions .priceBox {width:244px; margin: 0 10px; float:none;}
.shop .articleSingle .actions .priceBox .price {width:60px; padding-left:0; color:#FFCD00;}
.shop .articleSingle .actions .priceBox .orderButton {width:168px; font-size:14px; background:none; padding-top:2px; padding-right:0;}

.shop .articleSingle .extra .block {width:100%; display:block; margin-bottom:15px;}
.shop .articleSingle .data {padding-right:20px; clear:both;}
.shop .articleSingle .data .picture img {width:150px; height:auto;}


/* shop - selection panel */
#SelectionPanel {padding:10px 20px; width:100%; max-width:100%; height:auto; overflow:hidden;}
#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 */
.mainContent.articles {padding:20px;}
.mainContent.articleDisplay {padding:20px;}
.mainContent.articleDisplay .content {padding-left:12px;}
#comments {margin-left:20px;}

/* guestbook */
.mainContent.guestbook {padding:20px;}

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