
.container {width:100%; font-family:"Geneva"; padding-left:0; padding-right:0;}
.row {margin-left:0;margin-right:0;}

#head {position:fixed; top:0; left:0; right:0; z-index:99;}
#head #menuButton {position:absolute; left:0;}
#head .navBar {display:flex; flex-wrap:nowrap; justify-content:center; background-color:rgba(0,0,0,0.8); backdrop-filter:blur(10px); width:100%; font-size:14px; padding-left:0; z-index:99;}
#head .navBar .menuItem {display:inline-block; padding:9px 3%; border:0px dashed crimson;}
#head .navBar .menuItem {color:#F2F2F2; transition: color .15s ease-in-out;}
#head .navBar .menuItem:hover {color:#b9b9b9;}
#head .navBar .menuItem #logo {font-size:20px;}

#content {background-color:#FFF; color:#000; text-align:center;}
.tile {padding:40px; height:600px;}
.miniTile {padding:70px 122px;}

#foot {background-color:#F3F3F3; font-size:10px;}
#foot .fColumn {display:inline-block;}
#foot .footListContainer {cursor:pointer;}
#foot .footList {color:#575857; list-style:none; padding-left:0;}
#foot .footList li, #foot .footListContainer {padding: 2px 0px}
#foot #footToe {padding-bottom:100px;}
#foot #footToe > div {padding-left:0; padding-right:0; color:#6C6C6C;}

/* mobile (xs) */
@media screen and (max-width:767px) {
    #head .navBar .menuItem #logo {font-size:22px;}
	#head #shopBag {position:absolute; right:0px;}

	#content {padding-top:75px;}
	#tile0 #homepodPic {width:100%;}
	#tile1 #headText {font-size:50%;}
	.tile .name {font-weight:bold; font-size:31px;}
	.tile .slogan {font-size:18px;}
	/*.miniTile .name {font-weight:bold; font-size:31px;}
	.miniTile .slogan {font-size:18px;}*/

	#foot #footLists {padding-left:0;padding-right:0; padding-bottom:16px;}
	#foot .fColumn {width:100%;}
	#foot .footListContainer {border-bottom:1px solid #ddd; margin:0 16px; padding:12px 8px 12px 0; font-size:12px;}
	#foot .footListContainer .expandButton {color:#000; float:right; transition: transform .2s ease-in-out;}
	#foot .footListContainer .expandButton.expanded {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
	#foot .footList {display:none; padding-top:20px;padding-left:40px;}
}
/* desktop (lg,md), tablet (sm) */
@media screen and (min-width:768px) {
	#head .navBar {padding-top:2px;}

	#content {/*padding-top:125px;*/}
	#tile0 #homepodPic {width:50%;}
	#tile1 {padding-top:110px; position:relative;}
	#tile1 #headText {position:absolute; top:85px;left:50%; transform:translateX(-50%); z-index:10;}
	.tile .name {font-weight:bold; font-size:52px;}
	.tile .slogan {font-size:24px;}
	.miniTile .name {font-weight:bold; font-size:32px;}
	.miniTile .slogan {font-size:18px;}

	#foot {padding-top:32px}
	#foot #footLists, #foot #footToe {padding-bottom:32px;}
	#foot .fColumn {width:19%;}
	#foot .footListContainer .footListHeader {font-weight:bold;}
	#foot .footListContainer .expandButton {display:none;}
}
