#contentStart{
    max-width:100%;
    padding: 3%;
    margin-right: 2em;
    margin-top: 8em;
   background: #c69c6d;
}
article div.container {
   padding: 2%;
   background-color: white;
   overflow: auto;
   box-shadow: 0 0 8px #333;
}
article h2 {
   margin-bottom: 0.4em;
   font-family: "Playfair Display", Georgia, "Times New Roman", Times, serif;
   font-weight: 900;
   font-size: 1em;
}

/*field styles*/
.contactinfo input{
	border: 1px solid #ccc;
	padding:0.2em;
	font-size:0.5em;
}

/*label styles*/
label{
	font-size:1em;
}
.contactinfo label{
	display: block;
	position: relative;
	margin: 0.3em 0;
}
.topicinfo{
	height:15em;
	
}
.topicinfo label{
	margin-right: 10em;
	display:inline-block;
}
.additionalinfo label input{
	width:10em;
	height:3em;
}

@media screen and (min-width:480px), print{
    #contentStart{
        margin-right: 0;
        margin-left: 6em;
        margin-top: 8em;
        background: #c69c6d;
    }
    article h2{
        font-size: 1.4em;
    }
    
    
    
}
@media screen and (min-width:800px){
    #contentStart{
        margin-top: 2em;
        margin-left:25%;
       background: #c69c6d;
    }  
    article h2 {
       margin-bottom: 0.4em;
       font-family: "Playfair Display", Georgia, "Times New Roman", Times, serif;
       font-weight: 900;
       font-size: 2em;
    }

    /*field styles*/
    .contactinfo input{
        font-size:0.8em;
    }

    /*label styles*/
    label{
        font-size:1em;
    }
    .contactinfo label{
        margin: 0.3em 0;
    }
    .topicinfo label{
        margin-right: 10em;
        display:inline-block;
    }
    .additionalinfo label input{
        width:24em;
        height:3em;
    }
}
@media screen and (min-width:900px){
    #contentStart{
        margin-left: 35%;
    }
}