#advert-content {
    background : url('../image/background_digitalislogo_small.png');
    background-repeat : no-repeat;
    background-position : right 50px;
    background-color : #fff;
    border-radius : 20px;
    box-shadow : 0px 0px 4px #888;

    overflow : hidden;
    margin : 0px auto;
}

#advert-next,
#advert-prev {
    width : 50px;
    height : 400px;
}

#advert-next {
    background-color : #2b2b2b;
    float : right;
    border-top-right-radius : 20px;
    border-bottom-right-radius : 20px;
    opacity : 0.0;
}
#advert-prev {
    background-color : #2b2b2b;
    float : left;
    border-top-left-radius : 20px;
    border-bottom-left-radius : 20px;
    opacity : 0.0;
}

#advert-prev,
#advert-next {
    -webkit-transition: opacity 0.5s;
       -moz-transition: opacity 0.5s;
         -o-transition: opacity 0.5s;
            transition: opacity 0.5s;
}

#advert-prev:hover,
#advert-next:hover {
    opacity : 0.1;
}


#advert-nav-wrapper {
    padding : 5px 0px;
}

.advert-tab {
    background-color : white;
    float : left;
    width : 16px;
    height : 16px;
    border-radius : 8px;
    text-align : center;
    margin-left : 10px;
    box-shadow : 0px 0px 4px #888;
    margin-top : 2px;
    
    cursor : pointer;
    transition : all 2s;
}



#advert-content section {
    background-image : none;
    padding : 0px;
    margin : 10px;
    width : 300px;
    border-radius : 0px;
    box-shadow : 0px 0px 0px #fff;
    overflow : hidden;
}

#advert-content section h2,
#advert-content section p {
    padding : 0px;
    margin : 0px;
    color : #888;
    font-weight : normal;
}


#advert-content section h2 {
    font-size : 2em;
}
#advert-content section p {
    font-size : 1.3em;
    line-height : 1.5;
    margin-top : 10px;
}

#advert-content #advert-text-one,
#advert-content #advert-text-two,
#advert-content #advert-text-three,
#advert-content #advert-text-four,
#advert-content #iphone1,
#advert-content #iphone2,
#advert-content #iphone3,
#advert-content #iphone4 {
    -webkit-transition: all 2s;
       -moz-transition: all 2s;
         -o-transition: all 2s;
            transition: all 2s;

}

.phase1 #ad1,
.phase2 #ad2,
.phase3 #ad3,
.phase4 #ad4 {
    background-color : #bbb;
}


.phase1 #phone_screen_1 {
    background-image : url('../image/ad/yourtoast_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase1 #phone_screen_2 {
    background-image : url('../image/ad/animalpack_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase1 #phone_screen_3 {
    background-image : url('../image/ad/badgervsbeaver_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase1 #phone_screen_4 {
    background-image : url('../image/ad/monsterseggs_scr1.jpeg');
    background-repeat : no-repeat;
}


.phase2 #phone_screen_1 {
    background-image : url('../image/ad/yourtoast_scr2.png');
    background-repeat : no-repeat;
}
.phase2 #phone_screen_2 {
    background-image : url('../image/ad/animalpack_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase2 #phone_screen_3 {
    background-image : url('../image/ad/badgervsbeaver_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase2 #phone_screen_4 {
    background-image : url('../image/ad/monsterseggs_scr1.jpeg');
    background-repeat : no-repeat;
}


.phase3 #phone_screen_1 {
    background-image : url('../image/ad/yourtoast_scr2.png');
    background-repeat : no-repeat;
}
.phase3 #phone_screen_2 {
    background-image : url('../image/ad/animalpack_scr1.jpeg');
    background-repeat : no-repeat;
}
.phase3 #phone_screen_3 {
    background-image : url('../image/ad/badgervsbeaver_scr3a.png');
    background-repeat : no-repeat;
}
.phase3 #phone_screen_4 {
    background-image : url('../image/ad/badgervsbeaver_scr3b.png');
    background-repeat : no-repeat;
}


.phase4 #phone_screen_1 {
    background-image : url('../image/ad/yourtoast_scr2.png');
    background-repeat : no-repeat;
}
.phase4 #phone_screen_2 {
    background-image : url('../image/ad/bufc.png');
    background-repeat : no-repeat;
}
.phase4 #phone_screen_3 {
    background-image : url('../image/ad/badgervsbeaver_scr3a.png');
    background-repeat : no-repeat;
}
.phase4 #phone_screen_4 {
    background-image : url('../image/ad/badgervsbeaver_scr3b.png');
    background-repeat : no-repeat;
}




/* support css */
#advert-content div {
    display : none;
}
#advert-content #advert-text-one,
#advert-content #advert-text-two,
#advert-content #advert-text-three,
#advert-content #advert-text-four {
    -webkit-transition: none;
       -moz-transition: none;
         -o-transition: none;
            transition: none;
    display: none;
}

.js.borderradius.boxshadow.opacity.cssanimations.cssgradients.csstransforms.csstransitions #advert-content div {
    display: block;
}
.js.borderradius.boxshadow.opacity.cssanimations.cssgradients.csstransforms.csstransitions #advert-content #advert-text-one,
.js.borderradius.boxshadow.opacity.cssanimations.cssgradients.csstransforms.csstransitions #advert-content #advert-text-two,
.js.borderradius.boxshadow.opacity.cssanimations.cssgradients.csstransforms.csstransitions #advert-content #advert-text-three,
.js.borderradius.boxshadow.opacity.cssanimations.cssgradients.csstransforms.csstransitions #advert-content #advert-text-four {
    -webkit-transition: all 2s;
       -moz-transition: all 2s;
         -o-transition: all 2s;
            transition: all 2s;
    display: block;

}

div#advert-prev,
div#advert-next {
    display : block;
}