JavaScript not functioning as expected in ie11 but works fine in all other browsers

StackOverflow https://stackoverflow.com/questions/23432373

Question

i have a site that is functioning as expected in all browsers tested except ie11

there are links on the top and bottom of the page that scrolls the content left and right but it work sporadically in ie11. the problem is in the links at the top, clicking on "logo design" doesn't work properly. there is too many lines to post here but it is all in the fiddle http://jsfiddle.net/S5p58/1/

<!DOCTYPE HTML>    

<html>
    <head>
        <meta charset="utf-8">
        <title>
            Under Construction
        </title>
        <link rel="stylesheet" type="text/css" href="form.css">
        <meta name="author" content="Advanced Design And Solutions">
        <meta name="description" content="x">
        <meta name="keywords" content="x">
        <script type="text/javascript" src="script/script.js"></script>     
    </head>
    <body onload="assign_math();">
                    </div>
        <div id="container">
            <div class="shadow_test"></div>
            <div id="banner">
                <img class="title_logo" src="images/bnr.png" alt="">
                <!-- <a class="title_logo" href="index.php">
                    Advanced Design and Solutions
                </a> -->
                <div id="links">
                    <div onclick="to_wd();" class="banner_content on" id="link_1" href="">Web Design</div><div onclick="to_mm();" class="banner_content" id="link_2" href="">Marketing Material</div><div onclick="to_ld();" class="banner_content" id="link_3" href="">Logo Design</div><div onclick="to_bcd();" class="banner_content" id="link_4" href="">Business Card Design</div><span><img src="images/em_w.png"  class="email_icon" onclick="show_email();"></span>
                </div>              
                </div>   
                <div id="l_arrow" onclick="scroll_left();">
                        &laquo;
                    </div>
                    <div id="r_arrow" onclick="scroll_right();">
                        &raquo;
                    </div>
                <div id="hider">

                    <div id="body">
                        <div id="content_pane_1">
                            <div class="slide_image_holder"></div>
                            <h2>
                                Web Design
                            </h2>
                            <p>
                                A website is an important
                            </p>
                        </div>
                        <div id="content_pane_2">
                            <div class="slide_image_holder"></div>
                            <h2>
                                Marketing Materials
                            </h2>
                            <p>
                                We design marketing 
                            </p>
                        </div>
                        <div id="content_pane_3">
                            <div class="slide_image_holder"><img src="images/logo_bn.jpg" alt=""></div>
                            <h2>
                                Logo Design
                            </h2>
                            <p>
                                A logo is an integral part
                            </p>
                        </div>
                        <div id="content_pane_4">
                            <div class="slide_image_holder"><img src="images/bs_bn.jpg" alt=""></div>
                            <h2>
                                Business Card Design
                            </h2>
                            <p>
                                A business card is often 
                            </p>
                        </div>
                    </div>
                    <div id="dummy"></div><div id="dummy2"></div>
                </div>
                            <div id="footer">
                <div id="footer_topline"></div>
                <div onclick="to_wd();" class="footer_links" id="foot_1">Web Design</div><div onclick="to_mm();" class="footer_links" id="foot_2">Marketing Material Design</div><div onclick="to_ld();" class="footer_links" id="foot_3">Logo Design</div><div onclick="to_bcd();" class="footer_links" id="foot_4">Business Card Design</div ><div class="footer_links" href="index.php">&#169; Copyright <?php echo date("Y") ?></div>
            </div>
        </div>

    </body>
</html>


body, html {
padding:0;
margin:0;
min-height:100%;
height:100%;
font-family: sans-serif;
}
body {background-size:100%;}

#banner {
width: 910px;
height: 130px;
margin: 0 auto;
position: relative;
top: 80px;
}
#body {
min-height: 600px;
width: 4000px;
position: absolute;
z-index: -1;
}
.banner_content {
    display: inline-block;
}
#container {
    position: relative;
    background:grey;
    z-index: 0;
    min-height: 100%;
    background-size: 100%;
}
#content_pane_1 p, #content_pane_2 p, #content_pane_3 p, #content_pane_4 p {
    background: rgba(40, 40, 40, 0.3);
    box-shadow: 0px 0px 5px black;
}
.slide_image_holder {
    width: 900px;
    height: 300px;
    background: blue;
    box-shadow: 0px 0px 5px black;
    margin-top: 30px;
    margin-left: 5px;
}
.scroll_right {
    -webkit-animation: shift_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation:shift_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation:shift_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_right {
    0% {
        left:0px;
    }
    30% {
        left:10px;
    }
    60% {
        left:-975px;
    }
    100% {
        left:-955px;
    }
}
@-moz-keyframes shift_right {
    0% {left:0px;}
    30% {left:10px;}
    60% {left:-975px;}
    100% {left:-955px;}
}
@-o-keyframes shift_right {
    0% {left:0px;}
    30% {left:10px;}
    60% {left:-975px;}
    100% {left:-955px;}
}
@keyframes shift_right {
    0% {
        left:0px;
    }
    30% {
        left:10px;
    }
    60% {
        left:-975px;
    }
    100% {
        left:-955px;
    }
}
.scroll_right_-955 {
    -webkit-animation:shift_right_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation:shift_right_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation:shift_right_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_right_second {
    0% {
        left:-955px;
    }
    30% {
        left: -945px;
    }
    60% {
        left:-1930px;
    }
    100% {
        left:-1910px;
    }
}
@-moz-keyframes shift_right_second {
    0% {
        left:-955px;
    }
    30% {
        left: -945px;
    }
    60% {
        left:-1930px;
    }
    100% {
        left:-1910px;
    }
}
@-o-keyframes shift_right_second {
    0% {
        left:-955px;
    }
    30% {
        left: -945px;
    }
    60% {
        left:-1930px;
    }
    100% {
        left:-1910px;
    }
}
}
@keyframes shift_right_second {
    0% {
        left:-955px;
    }
    30% {
        left: -945px;
    }
    60% {
        left:-1930px;
    }
    100% {
        left:-1910px;
    }
}
.scroll_right_-1910 {
    -webkit-animation: shift_right_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: shift_right_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation: shift_right_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_right_third {
    0% {
        left:-1910px;
    }
    30% {
        left: -1900px;
    }
    60% {
        left:-2885px;
    }
    100% {
        left:-2865px;
    }
}
@-moz-keyframes shift_right_third {
    0% {
        left:-1910px;
    }
    30% {
        left: -1900px;
    }
    60% {
        left:-2885px;
    }
    100% {
        left:-2865px;
    }
}
@-o-keyframes shift_right_third {
    0% {
        left:-1910px;
    }
    30% {
        left: -1900px;
    }
    60% {
        left:-2885px;
    }
    100% {
        left:-2865px;
    }
}
@keyframes shift_right_third {
    0% {
        left:-1910px;
    }
    30% {
        left: -1900px;
    }
    60% {
        left:-2885px;
    }
    100% {
        left:-2865px;
    }
}
.scroll_right_-2865 {
    -webkit-animation: shift_right_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: shift_right_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
    animation: shift_right_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_right_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
@-moz-keyframes shift_right_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
@-o-keyframes shift_right_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
@keyframes shift_right_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
.scroll_left_0 {
    -webkit-animation: shift_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation:shift_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation:shift_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_left {
    0% {
        left:-955px;
    }
    30% {
        left:-965px;
    }
    60% {
        left:20px;
    }
    100% {
        left:0px;
    }
}
@-moz-keyframes shift_left {
    0% {
        left:-955px;
    }
    30% {
        left:-965px;
    }
    60% {
        left:20px;
    }
    100% {
        left:0px;
    }
}
@-o-keyframes shift_left {
    0% {
        left:-955px;
    }
    30% {
        left:-965px;
    }
    60% {
        left:20px;
    }
    100% {
        left:0px;
    }
}
@keyframes shift_left {
    0% {
        left:-955px;
    }
    30% {
        left:-965px;
    }
    60% {
        left:20px;
    }
    100% {
        left:0px;
    }
}
.scroll_left_-955 {
    -webkit-animation: shift_left_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: shift_left_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation: shift_left_second 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_left_second {
    0% {
        left:-1910px
    }
    30% {
        left:-1920px;
    }
    60% {
        left:-935px;
    }
    100% {
        left:-955px;
    }
}
@-moz-keyframes shift_left_second {
    0% {
        left:-1910px
    }
    30% {
        left:-1920px;
    }
    60% {
        left:-935px;
    }
    100% {
        left:-955px;
    }
}
@-o-keyframes shift_left_second {
    0% {
        left:-1910px
    }
    30% {
        left:-1920px;
    }
    60% {
        left:-935px;
    }
    100% {
        left:-955px;
    }
}
@keyframes shift_left_second {
    0% {
        left:-1910px
    }
    30% {
        left:-1920px;
    }
    60% {
        left:-935px;
    }
    100% {
        left:-955px;
    }
}
.scroll_left_-1910 {
    -webkit-animation: shift_left_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: shift_left_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation: shift_left_third 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_left_third {
    0% {
        left:-2865px;
    }
    30% {
        left:-2875px;
    }
    60% {
        left:-1890px;
    }
    100% {
        left:-1910px;
    }
}
@-moz-keyframes shift_left_third {
    0% {
        left:-2865px;
    }
    30% {
        left:-2875px;
    }
    60% {
        left:-1890px;
    }
    100% {
        left:-1910px;
    }
}
@-o-keyframes shift_left_third {
    0% {
        left:-2865px;
    }
    30% {
        left:-2875px;
    }
    60% {
        left:-1890px;
    }
    100% {
        left:-1910px;
    }
}
@keyframes shift_left_third {
    0% {
        left:-2865px;
    }
    30% {
        left:-2875px;
    }
    60% {
        left:-1890px;
    }
    100% {
        left:-1910px;
    }
}
.scroll_left_-0 {
    -webkit-animation: shift_left_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: shift_left_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
    animation: shift_left_end 0.5s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes shift_left_end {
    0% {
        left:0px;
    }
    50% {
        left: 20px;
    }
    100% {
        left:0px;
    }
}
@-moz-keyframes shift_left_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
@-o-keyframes shift_left_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
@keyframes shift_left_end {
    0% {
        left:-2865px;
    }
    50% {
        left: -2885px;
    }
    100% {
        left:-2865px;
    }
}
.footer_text_glow {
    -webkit-animation: glow 0.8s;
    -moz-animation: glow 0.8s;
    -o-animation: glow 0.8s;
    animation: glow 0.8s;
}
@-webkit-keyframes glow {
    0% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
    50% {
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.5);
        color: #7db9e8;
    }
    100% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
}
@-moz-keyframes glow {
    0% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
    50% {
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.5);
        color: #7db9e8;
    }
    100% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
}
@-o-keyframes glow {
    0% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
    50% {
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.5);
        color: #7db9e8;
    }
    100% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
}
@keyframes glow {
    0% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
    50% {
        text-shadow: 0px 0px 3px rgba(255, 255, 255, 0.5);
        color: #7db9e8;
    }
    100% {
        text-shadow: 0px 0px 0px rgba(255, 255, 255, 0.5);
        color: white;
    }
}
.wrap_left {
    -webkit-animation: wrap_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -moz-animation: wrap_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: wrap_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation: wrap_left 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes wrap_left {
    0% {
        left:0px;
        opacity: 1;
    }
    30% {
        left:10px;
    }
    50% {
        opacity: 0;
    }
    60% {
        left:-2885px;
        opacity: 0;
    }
    100% {
        left:-2865px;
        opacity: 1;
    }
}
@-moz-keyframes wrap_left {
    0% {
        left:0px;
        opacity: 1;
    }
    30% {
        left:10px;
    }
    50% {
        opacity: 0;
    }
    60% {
        left:-2885px;
        opacity: 0;
    }
    100% {
        left:-2865px;
        opacity: 1;
    }
}
@-o-keyframes wrap_left {
    0% {
        left:0px;
        opacity: 1;
    }
    30% {
        left:10px;
    }
    50% {
        opacity: 0;
    }
    60% {
        left:-2885px;
        opacity: 0;
    }
    100% {
        left:-2865px;
        opacity: 1;
    }
}
keyframes wrap_left {
    0% {
        left:0px;
        opacity: 1;
    }
    30% {
        left:10px;
    }
    50% {
        opacity: 0;
    }
    60% {
        left:-2885px;
        opacity: 0;
    }
    100% {
        left:-2865px;
        opacity: 1;
    }
}
.wrap_right {
    -webkit-animation: wrap_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -moz-animation: wrap_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    -o-animation: wrap_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
    animation: wrap_right 0.7s cubic-bezier(0, .68, .22, .99) forwards;
}
@-webkit-keyframes wrap_right {
    0% {
        left:-2865px;
        opacity: 1;
    }
    30% {
        left:-2855px;
    }
    50% {
        opacity: 0;
    }
    60% {
        left: 20px;
    }
    100% {
        left:0px;
        opacity: 1;
    }
}
#container:after {
content:"";
position: absolute;
width: 100%;
height: 100%;
background: url(images/pattern.png);
top: 0px;
opacity: .1;
z-index: -2;
background-size: 7px;

}
#container:before {
    content:"";
    position: absolute;
    width: 100%;
    height: 20px;
    top: 0px;
    border-bottom:1px dashed white;
    opacity: .5;
}

#content_pane_1, #content_pane_2, #content_pane_3, #content_pane_4 {
    width: 910px;
    min-height: 600px;
    /* background: orange; */
    position: relative;
    float: left;
    margin-left: 45px;
}
h2 {
    text-shadow: 1px 1px 2px black;
    padding-left: 20px;
    margin-top: 25px;
    margin-left: 10px;
}
#content_pane_1 h2, #content_pane_2 h2, #content_pane_3 h2, #content_pane_4 h2, #content_pane_1 p, #content_pane_2 p, #content_pane_3 p, #content_pane_4 p {
    color: white;
    font-family:"yi_baiti";
}
#content_pane_1 p, #content_pane_2 p, #content_pane_3 p, #content_pane_4 p {
    font-size: 20px;
    padding: 20px;
    margin-left: 5px;
    margin-right: 5px;
}
#hider {
    min-height: 600px;
    width: 1000px;
    position: absolute;
    margin-left: -500px;
    left: 50%;
    overflow: hidden;
    margin-top: 10px;
}
@media screen and (max-width: 1175px) {
    #l_arrow, #r_arrow {
        display: none;
    }
}
#l_arrow, #r_arrow {
    cursor: pointer;
    background-color: rgb(230, 230, 230);
    background: repeating-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 6%, rgba(255, 255, 255, 0.1) 7.5%), repeating-linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 4%, rgba(0, 0, 0, 0.03) 4.5%), repeating-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 1.2%, rgba(255, 255, 255, 0.15) 2.2%), linear-gradient(180deg, rgb(199, 199, 199) 0%, rgb(230, 230, 230) 47%, rgb(199, 199, 199) 53%, rgb(179, 179, 179)100%);
    text-shadow: rgba(102, 102, 102, 0.5) 0 -1px 0, rgba(255, 255, 255, 0.6) 0 2px 1px;
    box-shadow: inset rgb(38, 38, 38) 0 0px 0px 3px,
    /* border */
    inset rgba(38, 38, 38, 0.8) 0 -1px 5px 4px,
    /* soft SD */
    inset rgba(0, 0, 0, 0.25) 0 -1px 0px 7px,
    /* bottom SD */
    inset rgba(255, 255, 255, 0.7) 0 2px 1px 7px,
    /* top HL */
    rgba(0, 0, 0, 0.15) 0 -5px 6px 4px,
    /* outer SD */
    rgba(255, 255, 255, 0.2) 0 3px 4px 4px;
    width: 50px;
    height: 50px;
    position: absolute;
    line-height: 50px;
    text-align: center;
    color: rgba(40, 40, 40, 0.4);
    font-size: 30px;
    -moz-transition: color .1s;
    -webkit-transition: color .1s;
    -o-transition: color .1s;
    transition: all .1s;
    z-index: 1;
    border-radius: 0px;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    top: 390px;
}

#l_arrow {
    margin-left: -565px;
    left: 50%;
}
#l_arrow:after {
    content:"";
    position: absolute;
    height: 570px;
    width: 45px;
    left: 65px;
    top: -230px;
    box-shadow: 15px 0px 25px -25px rgb(0, 0, 0) inset, 34px 0px 30px -34px rgba(0, 0, 0, 0.32) inset, inset 5px 0px 3px -2px rgba(40, 40, 40, 0.5);
    border-bottom-right-radius: 100px 250px;
    border: 1px solid rgba(0, 0, 0, 0);
    border-left: 1px solid rgb(36, 36, 36);
    border-top-right-radius: 100px 250px;
}
#r_arrow {
    right: 50%;
    margin-right: -565px;
}
#r_arrow:after {
    content:"";
    position: absolute;
    height: 570px;
    width: 24px;
    right: 65px;
    top: -230px;
    box-shadow: inset -15px 0px 25px -25px rgba(0, 0, 0, 1), inset -34px 0px 30px -34px rgba(0, 0, 0, 0.75);
    border-top-left-radius: 120px 120px;
    border-bottom-left-radius: 120px 120px;
    border-right: 1px solid rgb(36, 36, 36);
}
.title_logo {
    position: absolute;
    top: -15px;
    left: 18px;
    width: 600px;
}
#links {
    width: 640px;
    color: white;
    font-size: 16px;
    position: relative;
    z-index: 1;
    left: 30px;
    top: 50px;
}
#links a, #links .banner_content {
    cursor: pointer;
    position: relative;
    text-decoration: none;
    margin-right: 20px;
    text-align: center;
    display: inline-table;
    transition: color 1s;
    -moz-transition: color .1s;
    -webkit-transition: color .1s;
    -o-transition: color .1s;
}
.banner_content {
    margin-right: 10px;
}
.banner_content:hover {
    color: #7db9e8;
}
.banner_content:after {
    box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    width: 90%;
    display: inline-block;
    height: 10px;
    position: absolute;
    top: 15px;
    left: 50%;
    margin-left: -45%;
}
.banner_content:before {
    width: 50%;
    height: 5px;
    background: gold;
    border-radius: 0px 0px 2px 2px;
    display: block;
    position: absolute;
    top: 26px;
    left: 50%;
    margin-left: -25%;
}
.on.banner_content:after, .on.banner_content:before {
    content:"";
}
.off.banner_content:before {
    -webkit-animation: tab_off 0.4s linear forwards;
    -moz-animation: tab_off 0.4s linear forwards;
    -o-animation: tab_off 0.4s linear forwards;
    animation: tab_off 0.4s linear forwards;
    content:"";
}
@-webkit-keyframes tab_off {
    0% {height: 5px;}
    20% {height: 5px;}
    30% {height: 8px;}
    40% {height: 8px;}
    55% {height: 0px;}
    100% {height: 0px;}
}
@-moz-keyframes tab_off {
    0% {
        height: 5px;
    }
    20% {
        height: 5px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 0px;
    }
    100% {
        height: 0px;
    }
}
@-o-keyframes tab_off {
    0% {
        height: 5px;
    }
    20% {
        height: 5px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 0px;
    }
    100% {
        height: 0px;
    }
}
@keyframes tab_off {
    0% {
        height: 5px;
    }
    20% {
        height: 5px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 0px;
    }
    100% {
        height: 0px;
    }
}
.off.banner_content:after {
    -webkit-animation: tab_off_shadow 0.45s linear forwards;
    -moz-animation: tab_off_shadow 0.45s linear forwards;
    -o-animation: tab_off_shadow 0.45s linear forwards;
    animation: tab_off_shadow 0.45s linear forwards;
    content:"";
}
@-webkit-keyframes tab_off_shadow {
    0% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    80% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    100% {
        box-shadow: 0px 0px 0px 0px rgba(40, 40, 40, .5);
    }
}
@-moz-keyframes tab_off_shadow {
    0% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    80% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    100% {
        box-shadow: 0px 0px 0px 0px rgba(40, 40, 40, .5);
    }
}
@-o-keyframes tab_off_shadow {
    0% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    80% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    100% {
        box-shadow: 0px 0px 0px 0px rgba(40, 40, 40, .5);
    }
}
@keyframes tab_off_shadow {
    0% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    80% {
        box-shadow: 0px 4px 7px -2px rgba(40, 40, 40, .5);
    }
    100% {
        box-shadow: 0px 0px 0px 0px rgba(40, 40, 40, .5);
    }
}
.on.tab_on.banner_content:before {
    -webkit-animation: tab_on 0.4s linear forwards;
    -moz-animation: tab_on 0.4s linear forwards;
    -o-animation: tab_on 0.4s linear forwards;
    animation: tab_on 0.4s linear forwards;
}
@-webkit-keyframes tab_on {
    0% {
        height: 0px;
    }
    20% {
        height: 0px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 5px;
    }
    100% {
        height: 5px;
    }
}
@-moz-keyframes tab_on {
    0% {
        height: 0px;
    }
    20% {
        height: 0px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 5px;
    }
    100% {
        height: 5px;
    }
}
@-o-keyframes tab_on {
    0% {
        height: 0px;
    }
    20% {
        height: 0px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 5px;
    }
    100% {
        height: 5px;
    }
}
@keyframes tab_on {
    0% {
        height: 0px;
    }
    20% {
        height: 0px;
    }
    30% {
        height: 8px;
    }
    40% {
        height: 8px;
    }
    55% {
        height: 5px;
    }
    100% {
        height: 5px;
    }
}    
 #footer {
    width: 1000px;
    height: 200px;
    margin: 0 auto;
    margin-top: 600px;
    position: relative;
}
#footer_topline {
    width: 850px;
    height: 5px;
    border-radius: 2px;
    background: white;
    margin: 0 auto;
    margin-bottom: 5px;
}
.footer_links:last-child {
    float: right;
    margin-right: 75px;
}
.footer_links {
    color: white;
    text-decoration: none;
    margin-left: 20px;
    font-family:"yi_baiti";
    float: left;
    font-size: 16px;
    cursor: pointer;
}
#foot_1 {
    margin-left: 75px;
}
Was it helpful?

Solution

There is an extra closing curly brace when defining ".scroll_right_-955" rule in CSS. Under "@-o-keyframes shift_right_second" animation rule.

@-o-keyframes shift_right_second {
    0% {
        left:-955px;
    }
    30% {
        left: -945px;
    }
    60% {
        left:-1930px;
    }
    100% {
        left:-1910px;
    }
}
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top