#Weeklyvid
            {
                width:1200px;
                
                height:1300px;
                border:1px solid black;
                background-color:white;
                
            }
            
            
            
            #videoArea
            
            {
               
                 width:300px;
                height:300px;
                
                margin-top:50px;
               
                float:left;
                margin-left:213px;
             
            
            }   
            #pic
{
    width:910px;
    height:420px;
    margin-top:570px;
    margin-left:145px;
    
    
    
    
}
       h3
            {
                float:left;
                margin-left:25px;
                
                
            }
          
               
            #bottomwrapper
            {
                
              width: 1000px;
              height: 305px;
              margin-top: 30px;
              margin-left: 50PX;
              float:left;
              margin-left:70px;
                
            }
            
         .summarytitle
         {
             font-size:30px;
             font-family:Helvetica; 
            
         }
          
            
            
           #summary
            
            {
                
                font-size:23px;
                color:#000000;
                margin-left:50px;
                font-family:Helvetica;
                text-indent:50px;
           
               
                
                
            }
            
             ul {
  text-align: left;
  display: inline;
  margin: 0;
  padding: 15px 4px 17px 0;
  list-style: none;
}
ul li {
  font: bold 20px/18px sans-serif;   /* <- to change the menu text size */
  display: inline-block;
  margin-right: -4px;
  position: relative;
  padding: 15px 37px; /* <-to change the width of the menu */
  background: #ffd700;
  cursor: pointer;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  color: #000;
}
ul li:hover {
  background: #ffd700;
  color: #ffff00;
}
ul li ul {
  padding: 0;
  position: absolute;
  top: 48px;
  left: 0;
  width: 250px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  display: none;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}
ul li ul li { 
  background: #ffd700; 
  display: block; 
  color: #fff;
}
ul li ul li:hover { background: #1abc9c; }
ul li:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}
.home {
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
}
.contact {
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  
  
}
a:link {
    text-decoration: none;
    color:black;
}

a:visited {
    text-decoration: none;
    color:black;
}

a:hover {
    text-decoration: none;
    color:#ffff00;
}

a:active {
    text-decoration: none;
    color:black;
}

            #topwrapper
            {
            width:1200px;
            height:380px; /* original height is 300px */
            border:1px solid black; 
            }
            

            
            
            #centerwrapper
            {
            
            width:944px; /*original width is 600px */
            height:660px;
            float:left;
            border:1px solid black; 
            }
            #contentarea
            {
                width:1200px;
                height:600px;
                margin-left:auto;
                margin-right:auto;
                
            }
            .container {
  position: relative;
  width: 50%;
}

.image {
  display: block;
  width: 100%;
  height: auto;
}

.overlay {
  position: absolute;
  top: 780px;
  bottom: 0;
  left: 0;
  right: 0;
  height:135px;
  width: 225px;
  opacity: 0;
  transition: .5s ease;
  background-color:#A4A4A4;
}

.container:hover .overlay {
  opacity: 1;
}

.text {
  color: white;
  font-size: 15px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-color:white;
}
#weeks
{
    width:300px;
    height:150px;
    margin-left:50px;
    float:left;
    border:1px solid black;
    
}
 .container2 {
  position: relative;
  width: 50%;
}

.image2 {
  display: block;
  width: 100%;
  height: auto;
}

.overlay2 {
  position: absolute;
  top: 780px;
  bottom: 0;
  left: 0;
  right: 0;
  height:135px;
  width: 225px;
  opacity: 0;
  transition: .5s ease;
  background-color:#A4A4A4;
}

.container:hover .overlay {
  opacity: 1;
}

.text2 {
  color: white;
  font-size: 15px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  font-color:white;
}
#weeks2
{
    width:450px;
    height:450px;
    margin-left:100px;
    float:left
    
}

            /*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Jan 25, 2019, 5:10:20 PM
    Author     : okuts
*/