/*=================================================================*/
/*FOR THE TOP HEADER/NAVIGATION BAR*/

/* Add a color to the active/current link */
.top_navigation a.active 
{
  background-color: yellow;
  color: black;
  /*color: rgba(0,0,0,0.5);*/
  /*opacity: 0.5;*/
}

/*dont change color when hover over the active tab*/
.top_navigation a.active:hover
{
  background-color: yellow;
}

/* Change the color of links on hover */
.top_navigation .dropdown:hover 
{
  background-color: gainsboro;
}


/*================================================================*/
/* FOR THE COVER */

/*adding background of the cover*/
.cover
{
  background-image: url("Images/Cover.jpg");
  width: 100%;
  height: 550px;
  color: white;
  background-size: cover;
}

/*for text on the cover*/
.heading
{
  width: 75%;
  height: auto;
  padding-top: 18%;
  text-align: center;
  /*border: 2px solid white;*/
}

h1
{
  font-size: 42pt;
  font-family: 'Charmonman', cursive;
  margin: 0;
}

h2
{
  font-size:22pt; 
  font-family: 'Charmonman', cursive;
  color: yellow;
}


/*=============================================================================*/
/*ABOUT US*/

#abt_us
{
  /*background-color: yellow;*/
  padding: 30px 70px;
  margin: 3%;
  border: 2px dotted grey;
  font-size: 1.2em;
}

#abt_us h3
{
  font-size: 1.3em;
  font-family: 'Charmonman', cursive;
}

/*==============================================================================*/
/*VIDEO*/

/*video container*/
#vidbg
{
  height: auto;
  background-image: url("Images/vidbg12.jpg");
  background-size: cover;
  /*filter: grayscale(50%);*/
  padding: 5%;
  padding-top: 2%;
  /*opacity: 0.8;*/
}

/*heading of video*/
#vidbg h3
{
  font-size: 3em;
  font-family: 'Katibeh', cursive;
  padding: 0;
}

/*styling the video*/
#vid
{
  /*opacity: 1.2;*/
  width: 70%;
  z-index: 1;
}

/*==============================================================================*/
/*PRODUCTS*/

#products
{
  background-color: beige;
  padding: 0;
  margin: 0;
  text-align: center;
  font-family: 'Charmonman', cursive;
  /*border: 1px solid black;*/
}

#products div .container
{
  width: 100%;
  height: auto;
  border: 1px solid black;
  margin: 0;
  padding-bottom: 20px;
} 

#products div h3
{
  font-size: 2.5em;
  margin: 20px 0px 10px 0px;
}

/*changing background of alternate product sections*/
.color
{
  background-color: ivory;
  border: 1px solid ivory;
}

/*determining the height of each section of images*/
.hoodies
{
  height: 500px;
  margin: 10px;
}

.jackets
{
  height: 700px;
  margin: 10px;
}

.tops
{
  height: 600px;
  margin: 10px;
}

.sweaters
{
  height: 800px;
  margin: 10px;
}

.dresses
{
  height: 500px;
  margin: 10px;
}

.formals
{
  height: 450px;
  margin: 10px;
}

/*styling the buttons*/
.button {
  padding: 5px 0px 15px 0px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 32px;
  margin: 10px 2px 30px 2px;
  width: 200px;
  border: 2px solid black;
  background-color: black;
  color: #ffff66;
  font-family: 'Katibeh', cursive;
  border-radius: 10px;
}

.button:hover 
{
  background-color: #ffff66; 
  color: black;
  border: 2px solid ivory;
  width:220px;
}

/*for some extra space in the end before footer*/
.extra
{
  height: 100px;
  background-color: beige;
  border: none;
}