.TimeLine
{
   background-color:rgba(0,0,0,0);
   max-width:800px;
   margin-left:auto;
   margin-right:auto;
    position:relative;
    overflow:hidden;
    display:block; 
}
 
.TimeLine .TimeLineItem
{ 
   top:auto;
   bottom:auto;
   right:auto;
   left:auto; 
   font-size:inherit;   
   overflow:visible;
   position:relative;

   float:left;
   width:50%; 
}

.EditingArea .TimeLine .TimeLineItem {
    border:1px dotted green;
}
 

.TimeLine  .TimeLineItem.Right
{
     top:80px;
}

.TimeLine .TimeLineItem.Right:last-child
{
    margin-bottom:80px;
}


.TimeLine  .TimeLineItem:last-child
{
}

.TimeLine   .TimeLineItem
{
    margin-left:0px;
    margin-right:0px;
    padding-top:10px;
}
 
.TimeLine  .TimeLineItem > div
{
    position:relative;
}

 

.TimeLine .TimeLineItem > DIV
{
     font-size:15px;  
    display:table;
    width:100%;
}

.TimeLine .TimeLineItem > DIV .PictureGroup
{
     display:table-cell;
    width:10px;
     text-align:center;
     vertical-align:top;
     padding-right:0px;
}



.TimeLine .TimeLineItem > DIV  .PictureContainer
{
    display:block;
    border-radius:50%;
    overflow:hidden;
    position:Relative;
    width:120px;
    height:120px;
}



.TimeLine .TimeLineItem > DIV .PictureContainer  > IMG.Portrait
{
      top:50%;
      left:0%;
      width:100%;
      height:auto;
      transform:translateY(-50%);
      -webkit-transform:translateY(-50%);
      position:absolute;
}

.TimeLine .TimeLineItem > DIV .PictureContainer  > IMG.Landscape
{
      top:0%;
      left:50%;
      width:auto;
      height:100%;
      transform:translateX(-50%);
      -webkit-transform:translateX(-50%);
      position:absolute;
}

.EditingArea .TimeLine .TimeLineItem > DIV .PictureContainer {
    border:1px dotted green;
}

.TimeLine .TimeLineItem > DIV .PictureContainer IMG
{
    position:absolute;
}

.TimeLine .TimeLineItem > DIV .PictureGroup.Left ,
.TimeLine .TimeLineItem > DIV .PictureGroup.Right 
{
      display:table-cell; 
      width:30%;
}

.TimeLine .TimeLineItem > DIV .PictureGroup.Left {
    padding-left:20px;
}

.TimeLine .TimeLineItem > DIV .PictureGroup.Right {
    padding-right:20px;
}

.TimeLine .TimeLineItem.Left > DIV .PictureGroup.Left
{
  display:none;
  width:0%;
} 


.TimeLine .TimeLineItem.Right > DIV .PictureGroup.Right
{
    display:none;
      width:0%;

} 
 


.TimeLine .TimeLineItem > DIV .PictureContainer IMG.Landscape
{
    width:auto!important;
    height:100%!important;
    left:50%;
    transform:translateX(-50%);
    -webkit-transform:translateX(-50%);
}


.TimeLine .TimeLineItem > DIV .PictureContainer IMG.Portrait
{
    width:100%!important;
    height:auto!important;
    top:50%;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
}

.TimeLine .TimeLineItem > DIV .DiscriptionContainer
{
     display:table-cell;
     vertical-align:top;
    min-height:150px;
   white-space:normal;
   text-align:left;
   width:70%;
}

.TimeLine .TimeLineItem.Left > DIV .DiscriptionContainer {
    padding-left:0px;
    padding-right:10px;
}

.TimeLine .TimeLineItem.Right > DIV .DiscriptionContainer {
    padding-left:10px;
    padding-right:0px;
}

.TimeLineItemName 
{
    display:inline-block;
    font-size:18px;
     line-height:22px;

   color:#333333;
     min-width:30px;
 }

.EditingArea .TimeLineItemName
{
    border:1px dotted green;
}

.TimeLineYear
{
    display:inline-block;
    color:#004c81;
    font-weight:bold;
    font-size:16px;
    min-width:30px;
    line-height:22px;

}

.EditingArea .TimeLineYear
{
    border:1px dotted green;
}

.TimeLineItemDescription
{
   color:#666666;
   font-size:14px;
   display:block;
   margin-top:4px;
   margin-bottom:10px;
 
}

.EditingArea .TimeLineItemDescription
{
    border:1px dotted green;
}


.TimeLine .TimeLineItem.Left .TimeLineItemDescription
{
    padding-right:10px;
}

 
 
.TimeLine .TimeLineItem .TimeLineItemCircle
{
    border-radius:10px;
     background-color:#004c81;
     position:absolute;
    top:50px;
    width:20px;
    height:20px;
    font-size:1px;
    z-index:10;
}

.TimeLine .TimeLineItem.Left  .TimeLineItemCircle
{
     right:-10px;
    top:50px;
}
 

.TimeLine .TimeLineItem.Right .TimeLineItemCircle
{
     left:-10px;
    top:50px;
}
 
 .TimeLine:after
{
     content :" "; 
    position:absolute;
    background-color:#666666;
   font-size:1px;
    display:block;
    top:0px;
    bottom:0px;
    padding-left:0px;
    left:50%;
    transform:translate(-50%);
    -webKit-transform:translate(-50%);
   width:4px;
    top:0%;
}

@media screen and (max-width:660px)
{

    .TimeLine 
    {
        padding-left:10px;
        padding-right:10px;
    }

     .TimeLine:after
     {
         display:none;
     }

    .TimeLine .VerticalBar {
        display:none;
    }

    .TimeLine .TimeLineItem 
    {
         display:block;
         float:none;
         width:100% !important;  
    }

    .TimeLine .TimeLineItem.Left .TimeLineItemDescription
    {
        padding-right:0px;
    }


    .TimeLine .TimeLineItem.Right
    {
        position:static;
        top:0%;
    }

    .TimeLine .TimeLineItem
    {
         position:static;
         top:0px; 
         float:none;
    }


    .TimeLine .TimeLineItem  > DIV
    {
        display:block;
    }

    .TimeLine .TimeLineItem > DIV  .PictureContainer
    {
        display:block;
        text-align:center;
        margin-left:auto;
        margin-right:auto;
    }

 
    .TimeLine .TimeLineItem > DIV .PictureGroup.Left  
    {
          display:block; 
          width:100%;
          padding-left:0px;
          text-align:center;
    } 

    .TimeLine .TimeLineItem.Left > DIV .PictureGroup.Left ,
    .TimeLine .TimeLineItem.Right > DIV .PictureGroup.Left
    {
          display:block; 
          width:100%;
    } 

    .TimeLine .TimeLineItem > DIV .PictureGroup.Right 
    {
          display:none;
    }
 

    .TimeLine .TimeLineItem > div .DiscriptionContainer
    {
         display:block;
         vertical-align:top;
        height:auto;
        padding-bottom:20px;
        padding-top:10px;
    }
 
    .TimeLine .TimeLineItem  .TimeLineItemCircle
    {
        display:none;
    }

} 



    .EditingArea.BreakPoint660  .TimeLine  ,
    .EditingArea.BreakPoint440  .TimeLine 
    {
        padding-left:10px;
        padding-right:10px;
    }

     .EditingArea.BreakPoint660 .TimeLine:after ,
     .EditingArea.BreakPoint440 .TimeLine:after
     {
         display:none;
     }

    .EditingArea.BreakPoint660 .TimeLine .VerticalBar ,
    .EditingArea.BreakPoint440 .TimeLine .VerticalBar 
    {
        display:none;
    }

    .EditingArea.BreakPoint660  .TimeLine .TimeLineItem ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem 
    {
         display:block;
         float:none;
         width:100% !important;  
    }

    .EditingArea.BreakPoint660  .TimeLine .TimeLineItem.Left .TimeLineItemDescription ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem.Left .TimeLineItemDescription 
    {
        padding-right:0px;
    }


    .EditingArea.BreakPoint660  .TimeLine .TimeLineItem.Right ,
    .EditingArea.BreakPoint440  .TimeLine .TimeLineItem.Right
    {
        position:static;
        top:0%;
    }

    .EditingArea.BreakPoint660  .TimeLine .TimeLineItem ,
    .EditingArea.BreakPoint440  .TimeLine .TimeLineItem
    {
         position:static;
         top:0px; 
         float:none;
    }


    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem  > DIV ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem  > DIV 
    {
        display:block;
    }

    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem > DIV  .PictureContainer ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem > DIV  .PictureContainer
    {
        display:block;
        text-align:center;
        margin-left:auto;
        margin-right:auto;
    }

 
    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem > DIV .PictureGroup.Left  ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem > DIV .PictureGroup.Left  
    {
          display:block; 
          width:100%;
          padding-left:0px;
          text-align:center;
    } 

    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem.Left > DIV .PictureGroup.Left ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem.Left > DIV .PictureGroup.Left ,
    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem.Right > DIV .PictureGroup.Left ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem.Right > DIV .PictureGroup.Left
    {
          display:block; 
    } 

    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem > DIV .PictureGroup.Right  ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem > DIV .PictureGroup.Right  
    {
          display:none;
    }
 

    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem > div .DiscriptionContainer ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem > div .DiscriptionContainer
    {
         display:block;
         vertical-align:top;
        height:auto;
        padding-bottom:20px;
        padding-top:10px;
    }
 
    .EditingArea.BreakPoint660 .TimeLine .TimeLineItem  .TimeLineItemCircle ,
    .EditingArea.BreakPoint440 .TimeLine .TimeLineItem  .TimeLineItemCircle
    {
        display:none;
    }