body {
    overflow-x:hidden;
}

.site-wrapper {  
    min-height: 100%;
  min-width: 100%;
  background-color: #fff; /* Needs a background or else the nav will show through */
  position: relative;
  top: 0;
  bottom: 100%;
  left: 0;
  z-index: 1;
 }
.topwrapper { width:100%; overflow:hidden; }
#header-home { position:relative; z-index:100; overflow:hidden; }
.valuation-wrap { width:250px; margin-top:50px; }
.valuation-bkg-top { min-height:120px; position:relative; background-image:url(../images/valuation-bkg-top.png); background-repeat:no-repeat; background-size:250px auto; text-align:center; }
.valuation-bkg-mid { position:relative; background-image:url(../images/valuation-bkg-mid.png); background-repeat:repeat-y; background-size:250px auto; text-align:center; padding-bottom:6px; }
.valuation-bkg-btm { min-height:34px; position:relative; background-image:url(../images/valuation-bkg-btm.png); background-repeat:no-repeat; background-size:250px auto; text-align:center; }
.valuation-wrap h2 { padding:0; margin:0 0 20px 0; }

.valuation-wrap {
    width:250px;
    overflow:hidden;
    position:absolute;
    top:70px;
    left:300px;
    z-index:5000;
    -webkit-animation-name: valutaion-animation;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-timing-function: 0.5s;
    animation-name: valutaion-animation;
    animation-duration: 0.5s;
    animation-timing-function: linear;
}

.valuation-close {
    font-size:15px;
    font-weight:bold;
    float:right;
    width:26px;
    height:26px;
    line-height:26px;
    border-radius:13px;
    background-color:#851620;
    margin:10px 10px 0px 0px;
    color:#fff;
}
.valuation-close:hover {
    cursor:pointer;
}

@keyframes valutaion-animation {
    0%   {left:-250px;}
    25%  {left:-100px;}
    50%  {left:0px;}
    100% {left:300px;}
}

#toplinetext { 
    position:relative;    
    text-align:center;
    display:block;
    width:100%;
    line-height:30px;
    font-size:1.5rem;
    right:100%;
    opacity: 0;
    webkit-animation-name: toplinetext-animation;
    webkit-animation-duration: 0.5s;
    webkit-animation-timing-function: linear;
    webkit-animation-delay: 0.5s;        
    webkit-animation-fill-mode: forwards;
    animation-name: toplinetext-animation;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-delay: 0.5s;
    animation-fill-mode: forwards;
}

@keyframes toplinetext-animation {
    0%   {right:100%;opacity: 0;}
    25%  {right:75%;opacity: 0.25;}
    50%  {right:50%;opacity: 0.5;}
    100% {right:0;opacity: 1;}    
}

#bottomlinetext { 
    position:relative;    
    text-align:center;
    display:block;
    width:100%;
    line-height:30px;
    font-size:1.5rem;
    right:100%;
    opacity: 0;    
    webkit-animation-name: bottomlinetext-animation;
    webkit-animation-duration: 0.5s;
    webkit-animation-timing-function: linear;
    webkit-animation-delay: 1s;
    webkit-animation-fill-mode: forwards;    
    animation-name: bottomlinetext-animation;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-fill-mode: forwards;
}

@keyframes bottomlinetext-animation {
    0%   {right:100%;opacity: 0;}
    25%  {right:75%;opacity: 0.25;}
    50%  {right:50%;opacity: 0.5;}
    100% {right:0;opacity: 1;}    
}
.valuationclick {
    display:block;
    margin-left:auto;
    margin-right:auto;
}
.valuationclick img { 
    width:150px;
    height:auto;
    opacity: 0;
    webkit-animation-name: valuationclick-animation;
    webkit-animation-duration: 1s;
    webkit-animation-timing-function: linear;
    webkit-animation-delay: 1s;
    webkit-animation-fill-mode: forwards;    
    animation-name: valuationclick-animation;
    animation-duration: 1s;
    animation-timing-function: linear;
    animation-delay: 1s;
    animation-fill-mode: forwards;        
}

@keyframes valuationclick-animation {
    0%   {opacity: 0;}
    25%  {opacity: 0.25;}
    50%  {opacity: 0.5;}
    100% {opacity: 1;}
}

.valuation-wrap hr { width:120px; text-align:center; }

@media (max-width: 768px) {
    /*
    .valuation-wrap {
        left:100px;
    }

    @keyframes valutaion-animation {
        0%   {left:-250px;}
        25%  {left:-150px;}
        50%  {left:-50px;}
        100% {left:100px;}
    }
    */
    #topwrapper .valuation-wrap { display:none; }

}