@charset "UTF-8";

/* Global Content Formatting and Styles */
body {font-family:"Arial", cursive;font-size:1em;
margin-left:0px;
margin-top:0px;
}
.content {
    margin: 0px 10px 0px 10px;
}
article,footer
{
border:1px solid grey; margin:20px 5px ; padding:8px; max-width:800px;
-moz-border-radius:1em;	
-webkit-border-radius:1em;
border-radius:1em;
}

.toTop 
{
    display:block;
    text-align:right;
}



header{
	padding:10px 15px 0xp 5px;
	margin:10px 15px 0px 5px;
}

/* nav default settings*/
nav ul {margin:0; padding:0;}
nav ul li {display:inline; margin: 0px 0px 0px 0px;
    list-style: none;
}
nav a:hover {color: #EBC379;  background-color:#990000;}
.active{color: #EBC379; background-color:#990000;
}
/*End of default nav settings*/

img {
	max-width: 100%;
	height: auto;
	text-align: center;
}

.title {
	font-size: 2em;
	margin-top: 0px 0px;
	margin-left: 40px;
	color: #000000;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	height: auto;
	display: block;
}

.subTitle {
    font-size: .7em;
	margin-left: 70px;
	margin-bottom:10px;
	display: block;
}

.dateDisplay {
	font-size: .7em;
	font-style: italic;
	
}

/*Front Page CSS*/
.page-container {
    width: 800px;
}
.main-area{
    border:0px ; margin:5px; padding:8px;
    float: left;
    width: 66%;
    box-sizing: border-box;
      /*.inner {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translate(-50%, -50%);
  }
    */
}

.left-side {
    width: 30%;
    float: left;
    background-color: #ffdda1;
    border: solid 1px #e69c19;
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    padding: 8px;
    margin-top: 100px;
    box-sizing: border-box;   
     /* .inner {
    position: absolute;
    top: 50%;
    left: 50%;
    text-align: center;
    transform: translate(-50%, -50%);
  }
    */
}
.important {
    font-weight: 700;
}

.more-room {
    padding-top:  20px;
}

/*End Front Page CSS*/

/*Barbie A Sewing Page CSS*/
section{
    border:0px ; margin:5px; padding:8px;
}
/*End Barbie A Sewing Page CSS*/

/*Barbie Dresser Page CSS*/
.dresser {
    border:1px solid grey; margin:5px; padding:8px; max-width:800px;
    -moz-border-radius:1em;	
    -webkit-border-radius:1em;
    border-radius:1em;
}

figcaption {
    margin: 10px 10px 0px 10px;
}
/*End of Barbie Dresser CSS*/

/***************************************************************/

/*Screen smaller than 600 px - like iPhone*/
@media screen and (max-width:600px) {
	/*this removes border*/
/*=======this  is the buttons============*/
 
nav a {
	color: #990000;
	display: block;
    box-sizing: border-box;
	margin: 0px 10px 1px 10px;
	padding: 5px 9px 5px 20px;
	border: 1px solid #DFAA55;
	background: url(../images/mobile_link_arrow.png) no-repeat right center;
	-moz-border-radius: 12px;
	-webkit-border-radius: 12px;
	border-radius: 12px;
	background-color: #EBC379;
   
}
nav a.hover {color:#fff; background-color: rgba(255,255,255,.15);}


/*Front Page CSS*/
.page-container {
    width: 100%;
}
.main-area{
    border:0px ; margin:5px; padding:8px;
    float: left;
    width:100%;
    box-sizing: border-box;
}

.left-side {
    width: 100%;
    float: left;
    background-color: #ffdda1;
    border: solid 1px #e69c19;
    -moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
    padding: 8px;
    box-sizing: border-box;
    margin-top: 0px;
    
    
}
    header {
        	padding:10px 5px 0xp 5px;
	        margin:10px 5px 0px 5px;
    }
    .title {
        margin: 0px 0px 10px 10px;
        padding: 0px;
    }
    .subTitle {
        margin-left: 10px;
    }
    
    section{
     margin:0px 0px 0px 0px;    
     padding:0px 0px 0px 0px;
}

/*End Front Page CSS*/
}
/***************************************************************/

/*Screen Larger than 601px*/
@media screen and  (min-width:601px) {

	
	nav { 
        width:500px;
        margin-left:100px;
        margin-top:0px;
        margin-bottom:10px;
        display: block;
        position:absolute ;
        background-color: #E8CB83;
        font-size:1em;
        padding-top:3px;
        padding-bottom:3px;
    }
    
    nav a { margin: 12px 0px 10px 20px; 
        color: #990000;
    }
    
 
    }

/***************************************************************/
@media screen and (max-width:801px) {

    .title  {
        font-size: 1.5em;
    }

    
}
/***************************************************************/
/*Group is to clear all floats*/
.group:before,
.group:after {
    content: "";
    display: table;
}
.group:after {
    clear: both;
}
.group {
    zoom:1;
}