.diywrap { display: flex; justify-content:center; max-width: 770px;margin:auto; height:100%; 
border: 1px solid #000;}
#myog-container
{
	background-color: #fff;
	padding: 20px;
	border: 0px solid red;
	text-align:center;
	
}
#baby { margin-left: 22px;}

#fcard .myog-note
{ position: relative;
	font-family: Arial;
	color: #333;
	font-size: 14px;
	font-weight:500;
	margin-bottom:12px;
	text-align:center;
	width:200px;
}

 .myog-note
{
	font-family:Arial Narrow;
	color: #333333;
	font-size: 14px;
	font-weight:500;
	text-align:center;
	margin: 0px;
	padding: 8px 0 0 0;
	
}

.myog-handwritten
{   float:left;width:100%;
	color: #cc0000;
	font-size: 14px;
	font-weight: normal;
	font-family: 'fat_witchregular';
	padding-bottom: 8px;
	line-height:120%;
	margin-left: 30px;
}

#either
{
	font-family: Arial Narrow, Arial;
	color: #000;
	font-style:regular;
	font-size: 16px;
	line-height: 150%;
	font-weight:500;
	}
	
#wedid
{
	font-family: Arial;
	color: #333;
	font-size: 18px;
	font-style:italic;
	text-align:center;
	font-weight:400;
	}
#happen
{
	font-family: 'fat_witchregular';
	color: #000;
	font-size: 13px;
	text-align:center;
	font-weight:500;
	margin-bottom: 0px;
	}
#happennext
{
	font-family: Arial;
	color: #333;
	font-size: 10px;
	text-align:center;
	font-weight:500;
	line-height: 100%;
	}
#myog-options-product
{   color: #cc0000;
	padding-left: 5px;
	font-size: 13px;
	font-weight: normal;
	font-family: 'fat_witchregular';
}

#myog-products-container
{  
	padding-left: 16px;
	padding-right: 16px;
	tecxt
	
}

#myog-products-images
{
	padding-bottom: 8px;
	width: 33%;
}

.myog-products-option
{   margin-top: 8px;
	margin-left: auto;
	margin-right:auto;
	width: 240px;
	height: 170px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	
	
}


#myog-below-products-left
{
	float: left;
	width: 240px;
}

#myog-below-products-right
{
	float: right;
	text-align: right;
	width: 240px;
}

.myog-label
{
	font-family: Arial Narrow;
	font-size: 14px;
	line-height: 20px;
	font-weight: bold;
	color: #333;
}

.myog-ribbon-option
{
	display: inline-block;
	width: 18px;
	height: 18px;
	text-decoration: none;
	border: 1px solid #ffffff;
	margin-left: 8px;
}
.myog-ribbon-option-on
{
	display: inline-block;
	width: 18px;
	height: 18px;
	text-decoration: none;
	border: 1px solid #000000;
	margin-left: 8px;
}

#myog-options-container
{ display:flex; justify-content:center;
	position: relative;
	margin-left:20px;
	}
#giftbox
{ margin-top:12px; border: 2px solid #000;
background-color:#fff; max-width:300px;}
#fcard
{   float: left;
	width:44%;
	height:100%;
    text-align:center;
	padding-left:0%;
	font-family: Arial Narrow;
	font-size: 15px;
	line-height: 120%;
	font-weight: 500;
	color: #333;
	
}
#fcardr
{
	float: left;
	width:44%;
	height:100%;
    text-align:center;
     font-family: Arial Narrow;
	font-size: 15px;
	line-height: 120%;
	font-weight: 500;
	color: #333;
}


.myog-option
{   
    padding:0px 10px;
	float: left;
	width: 100px;
	height: 100px;
	margin: 0px auto;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	cursor: pointer;
	
}



.myog-layer
{   position: relative;
	display: block;
	text-align: center;
	width: 90%;
	padding:0 0 0 14px;
	
	
}

.myog-layer-box-large
{
	margin: 0px auto;
	width: 90px;
	height: 90px;
	cursor: pointer;
   background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}

.myog-layer-box-small
{
	margin: 0px auto;
	width: 72px;
	height: 72px;
	cursor: pointer;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
}
#myog-bottom { margin:auto;width:60%; border: 0px solid blue;}
#myog-bottom-title
{
	position: absolute;
	width: 160px;
	text-align: right;
	color: #333;
}

#myog-counts
{margin: auto;
	display: grid;
	width: 360px;
	padding-top: 6px;
	grid-template-columns: 40% 10% 40% 10%;
	grid-template-rows: 18px 18px 18px 18px;
	font-family: 'fat_witchregular';
	font-size: 10px;
	line-height: 18px;
	font-weight: 400;
	text-align: right;
	color: #000000;
}

#myog-saveselection
{
	text-align: center;
}

#myog-actions
{
	text-align: center;
	padding-top: 8px;
}

.myog-action-button
{
	display: inline-block;
	height: 36px;
	background-color: #d6d6d4;
	padding-left: 12px;
	padding-right: 12px;
	border: 3px solid #000000;
	font-family: Arial Narrow;
	font-size: 18px;
	line-height: 36px;
	font-weight: bold;
	color: #bd4b4d;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
.myog-action-button-save
{
	display: inline-block;
	height: 24px;
	background-color: #d6d6d4;
	padding-left: 12px;
	padding-right: 12px;
	border: 3px solid #000000;
	font-family: Arial Narrow;
	font-size: 16px;
	line-height: 26px;
	font-weight: bold;
	color: #bd4b4d;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}
h1  {color: #000000;
	font-size: 20px;
	font-weight: normal;
	font-family: 'fat_witchregular';
	padding-bottom: 8px;
	width:100%;
	}
.form-error
{
	display: none;
	margin-top: 10px;
	padding: 12px;
	color: #990000;
	text-align: center;
	border: 1px solid #990000;
	background-color: #ffcccc;
}

.myog-receipt
{
	background-color: #eeeeee;
	padding: 10px;
	text-align: center;
}

.myog-receipt-ribbon
{
}

.myog-receipt-layer
{
	margin: 0px auto;
	display: inline-block;
	padding: 5px;
}

.myog-receipt-layer-8
{
	display: grid;
	border: 1px solid #000000;
	background-color: #000000;
	column-gap: 1px;
	row-gap: 1px;
	grid-template-columns: 60px 60px;
	grid-template-rows: 60px 60px;
}
.myog-receipt-layer-8 div
{
	text-align: center;
	background-color: #cccccc;
	color: #ffffff;
	line-height: 60px;
}

.myog-receipt-layer-18
{
	display: grid;
	border: 1px solid #000000;
	background-color: #000000;
	column-gap: 1px;
	row-gap: 1px;
	grid-template-columns: 40px 40px 40px;
	grid-template-rows: 40px 40px 40px;
}
.myog-receipt-layer-18 div
{
	text-align: center;
	background-color: #999999;
	color: #ffffff;
	line-height: 30px;
}
#myog-quantity{ color:#333333; font-size: 14px;}

@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 568px) {
.diywrap { display: flex; justify-content:center; width:98%;margin:auto; height:100%; 
border: 1px solid #000;}
#diy-custom .main{width:100%; float:left; margin:0px; padding:0; border:0px solid #fff; background: #ccc; }
#fcard {width:50%;  float:left;margin:0px; font-family:Arial; font-size: 12px;}
#fcard .myog-note{margin:0px;}
#fcardr {width:50%;  float:left;margin:0px; font-family:Arial; font-size: 12px;}
#fcardr .myog-note{margin:0px;}
#myog-products-container {float:left; width:100%; margin:0px; padding:0px;}
.myog-handwritten {width:90%;margin:0px;padding:0px;}
.myog-products-option {width:170px; height:120px;margin:0px;padding:0px 0px;}
#happen {font-size:11px;}
#baby {padding:0px;margin:0px;}
.myog-option {width:48%;height:100px; padding:0px;}
.myog-layer-box-large {width:48%; height:70px; padding:0px;margin-left:0px; }
.myog-layer-box-small {width:28%; height: 80%; padding:24px 0px; }
#myog-bottom {width:100%; background-color: #eeeeee; border:1px solid #000;}
#myog-counts {width:100%; background-color: #eeeeee; margin:0px; padding:8px;}
#myog-bottom-title { background-color: #eeeeee;text-align: center;}
.myog-label {text-align: center; width:80%; background-color: #eeeeee;}
input { width:22px; height:22px; padding:0px;}
.desc {font:normal 200 0.95em/0.9em 'Doris', sans-serif; padding: 0px 6px;margin:2px 0; color:#545454;line-height: 1.2em;}
.add {font:normal 200 0.95em/0.8em 'Doris', sans-serif; padding: 0px 6px; color:#545454;line-height: 1.0em;}
.ycard {display:none;}
.xfcard {display: block; width:46%; background-color:#f0f1f2; height:500px;float:left;margin:6px; border:1px solid #333;}
}

/*  SHOP NAV */
   .dbox {margin:10px auto; width:66%;display:flex;background:#fff; justify-content: space-between; border:0px solid blue;}
   .navi {
 position:relative;
 width:100%;
 border: 0px solid green;
	margin: 0px;
	padding: 0px;
	display: flex;flex-direction:row;flex-wrap:wrap;justify-content: space-around; 
	
}
   .navi a {color:#eee; text-decoration:none;}
  #subshop {font:normal 400 0.8em/120% 'fat_witchregular', sans-serif; margin:3px;text-align: center;padding:10px 8px 4px 8px; border: 1px solid #333; background-color: #fff;color:#000; font-size: 0.8em; border: 1px solid #000;-webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;} 
#subshop a{color: #545454;}
#subshopSI a{ color:#000;}
#subshopSI:hover{background-color: #b3b8da;}   
#subshopSN {display:inline; 
font:normal 400 0.8em/120% 'Oswald', sans-serif;
  margin:3px;
  text-align:center;
  padding:4px 8px 4px 8px; 
 background-color: #f8f290;
 color:#000;
 border: 1px solid #000;
  -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;} 
#subshopSN a{ color:#000;}
#subshopSN:hover{background-color: #fff;} 
#subshopLO {display:inline; font:normal 400 0.8em/120% 'Oswald', sans-serif;
   margin:3px;
   text-align:center;
    padding:4px 8px 4px 8px; 
   background-color: #fff;
   color:#000;
   border: 1px solid #000;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;}
#subshopLO a{ color:#000;}
#subshopLO:hover{background-color: #b5d6ec;}  

#subshopHI {display:inline; font:normal 400 0.8em/120% 'Oswald', sans-serif;
   margin:3px;
  text-align:center;
  padding:4px 8px 4px 8px; 
  background-color: #fff;
  color:#000;
   border: 1px solid #000;
  -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;} 
#subshopHI a{ color:#000;}
#subshopHI:hover{background-color: #dfa3c3;} 

 #subshopAU {display:inline; font:normal 400 0.8em/120% 'Oswald', sans-serif;
   margin:3px;
  text-align:center;
   padding:4px 8px 4px 8px; 
   background-color: #fff;
   color:#000;
   border: 1px solid #000;
  -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;} 
#subshopAU a{ color:#000;}
#subshopAU:hover{background-color: #eab182;} 
#submenushop {flex-wrap;no-wrap;}
   /* SHOP NAV MEDIA QUERIES *//* MEDIA QUERIES *//* MEDIA QUERIES */
@media screen and (max-width: 700px) {
.dbox { display:flex; margin-top:0px ;background:#fff; width:100%; justify-content: space-around;}
.navi {width:90%;border:0px solid red;display: flex;flex-direction:row;flex-wrap: nowrap;justify-content: center; }
.navi {background-color:#ffffff;}

#subshop {font:normal 400 0.8em/120% 'fat_witchregular', sans-serif; margin:3px;text-align: center;padding:4px 2px; border: 1px solid #333; background-color: #fff;color:#000; font-size: 0.8em; border: 1px solid #000;-webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;} 
   #subshop a:link{color: #000;}

}

 /* OUR STORY MEDIA QUERIES *//* MEDIA QUERIES *//* MEDIA QUERIES */
@media screen and (max-width: 700px {   
   .column_info {display:none;}
}