/*
            Got7 Merchandie main webpage 
            Filename: style.css

            Author: Natrasha Binte Muhammad Zaky 
            Date: 17th May 2017
            Online shopping for got7 merchandise 
*/

/* reset styles */
html {
   font-size: 12px;
}
a, article, body, div, footer, header, h1, h3, h2,h4, nav, p, figure {
   border: 0;
   padding: 0;
   margin: 0;
}

/* body */
body {
   max-width: 100%;
   background-color:blue;
   font-family: 'PT Sans Narrow', sans-serif;
   margin: auto;
   background: linear-gradient(#7eccec, white) no-repeat;
}
.container {
   position: center;
   background-color: skyblue;
}
h2 {
   font-size: 30px;
   line-height: 1.6em;
   display: inline-block;
   margin: 1em 2em;
}
a:link {
  color:black;
}
a:visited{
  color: #000;
}
nav {
  text-align: center;
  font-size: 20px;
  font-family: 'PT Sans Narrow', sans-serif;
}
/* header section */
h1 { 
   font-family: 'PT Sans Narrow', sans-serif;
   color: white;
   background-color: darkblue;
   font-size: 4em;
   text-align: center;
   margin: 0;
}

/* main content */
article p {
  font-family: 'PT Sans Narrow', sans-serif;
  font-size: 2em;
  text-align: center;
  background-color: #87ceeb;
  color: black  
}
article div{
    overflow: auto;    

}
 article figure {
   text-align: center;
}
article h4{
  font-family: 'PT Sans Narrow', sans-serif;
  font-size: 20px;
  color:#000;
  font-style: bold;
}

td.item {
  text-align: auto;
  font-size: 20px;
  font-family: 'PT Sans Narrow', sans-serif;
  color:white;
  font-style: bold;
}
table.center{
  margin: 2em auto;
}
h3 {
   color: white;
   background-color: darkblue;
   margin: 0;
   font-size: 1.8em;
   font-family:'PT Sans Narrow', sans-serif;
   text-align: center;
}

/* site navigation bar */
nav.sitenavigation {
   color:black;
   text-align: center;
}
nav.sitenavigation p {
  display: inline-block;
  margin: 2em;
  font-size: 1.5em;
} 
nav.pagenavigation{
  text-align: center;
  color: #000;
  background-color: #87ceeb;
}
nav.pagenavigation p{
  display: inline-block;
  text-align: center;
  font-size: 25px;
  font-family: 'PT Sans Narrow', sans-serif;
}
/*form styles*/
form{
  padding:35px; 
  width: auto;
}
/*fieldset styles*/
.contactinfo input, .orderform , textarea{
  border: 1px solid #000;
  padding: 0.2em;
  font-size: 1em;
}

select{
  margin-bottom: 0.6em;
}
.contactinfo input{
  position: absolute;
  left: 5em;
}

#nameinput, #emailinput {
  width: 25em;
}
.orderform{
  width: 40em;
}
#submit {
  border: none;
  padding: 0.4em 0.6em;
  background-color: #87ceeb;
  font-size: 1.25em;
  border-radius: 10px;
}
/*label styles*/
label{
  font-size: 1em;
  line-height: 1.6em;
}

.contactinfo label{
  display: block;
  position: relative;
  margin: 0.8em 0;  
}
.payment label{
  margin: 1.6em;
}
.Location label{
  margin: 1.6em;
}
fieldset{
  margin-bottom: 0.8em;
}
fieldset fieldset{
  margin-top: 1em;
  padding: 0.8em;
  border: 1px solid grey;
}
legend{
  font-size: 1.25em;
}
.contactinfo legend,
.orderform legend,
.payment legend,
.location legend {
  margin-left: -0.1em;
  font-weight: bold;
}
/* footer section */
footer {     
  padding: 0.5em;
}
p {
  margin: 0em;
  text-align: right;
  color:white;
  background-color: #000;
  padding: 0.5em; 
  font-size: 15px;
}

/* print styles */
@media print {
   body, h1, article, footer {
      color: rgb(0,0,0);
      background: rgb(255,255,255);
   }