$(document).ready(function(){
//        $('.call2action .button_left').click(function(){
//            c2a_index       = $('.call2action ol .active').index() + 1;
//            c2a_amount      = $('.call2action ol li').length;
//            
//            if (c2a_index == 1) {
//                $('.call2action ol li:nth-child(' + c2a_amount +')').click();
//            } else {
//                new_index = c2a_index - 1;
//                $('.call2action ol li:nth-child(' + new_index +')').click();
//            }
//                
//        });
//        
//        $('.call2action .button_right').click(function(){
//            c2a_index       = $('.call2action ol .active').index() + 1;
//            c2a_amount      = $('.call2action ol li').length;
//            
//            if (c2a_index == c2a_amount) {
//                $('.call2action ol li:nth-child(' + 1 +')').click();
//            } else {
//                new_index = c2a_index + 1;
//                $('.call2action ol li:nth-child(' + new_index +')').click();
//            }
//                
//        });
        
        
        $('.call2action ol li').click(function(){
            
            if (!$(this).hasClass('first') && !$(this).hasClass('last')) {
                border_width = $(this).width();
                
                $(this).removeAttr('style');
                
                $(this).css('border-left','1px solid #D6D6D6').css('border-right', '1px solid #D6D6D6;').css('width',border_width +'px');
                
                $(this).prev().attr('style', $(this).prev().attr('style') + ';border-right:none;');
                $(this).next().attr('style', $(this).next().attr('style') + ';border-left:none;');
                
//                $(this).css('width',border_width +'px');
            }else if( $(this).hasClass('first') ){
                border_width = $(this).css('width');
                $(this).css('border-right', '1px solid #D6D6D6').css('width',border_width +'px');
                $(this).next().attr('style', $(this).next().attr('style') + ';border-left:none;');
            } else if ( $(this).hasClass('last') ){
                border_width = $(this).css('width');
                $(this).prev().attr('style', $(this).prev().attr('style') + ';border-right:none;');
                $(this).css('border-left', '1px solid #D6D6D6').css('width',border_width +'px');
            } 
            
            $('.call2action .active').removeClass('active');
            $(this).addClass('active');
            index = $('.call2action ol li').index(this) + 1;
            tabname = 'tab' + index;
            $('.call2action > div').each(function(){
                $(this).addClass('invisible')
            });
            $('.'+tabname).removeClass('invisible');
            Cufon.refresh('.call2action ol li');
            
        });
        
        
        //Gather information to build the tabs
        amount_tabs = $('.call2action ol li').length;
        size        = $('.call2action').width() / amount_tabs;
        size        = Math.floor(size);
        //Calculate with the padding on the left side
        border_size = amount_tabs + 1;
        padding_size = 25;
        
        new_size    = size * amount_tabs;
        size        = size - border_size - padding_size;
        content_width= $('.call2action .content').width();
        
        //set the new size of the whole c2a
        $('.call2action').width(new_size);
        
        //set the size of the tab items on top
        $('.call2action ol li').attr('style','width:' + size +'px');
        
        //calculate the new size of the content field
        total = 0;
        $('.call2action ol li').each(function(){
           total = total + $(this).width();
        });
        total = total - 22 + (25 * amount_tabs);
        
        //set the new content size 
        $('.call2action .content').attr('style','width:' + total +'px');
        
        //check if the ol is big enough if not the add the difference to the last one
        check_total     = 0;
        $('.call2action ol li').each(function(){
           check_total = check_total + $(this).width() + 25;
        });
        
        check_total     = check_total + $('.call2action ol li').length + 1;
        check_content_width     = total + 27;
        
        
        if (check_total < check_content_width) {
            to_be_added = 0;
            test        = 0;
            to_be_added = check_content_width - check_total;
            test   = $('.call2action ol li:last').width() + to_be_added;
            $('.call2action ol li:last').attr('style','width:' + test +'px');
        }else if (check_total > check_content_width) {
            to_be_added = 0;
            test        = 0;
            to_be_added = check_total - check_content_width;
            test   = $('.call2action ol li:last').width() - to_be_added;
            $('.call2action ol li:last').attr('style','width:' + test +'px');
            
        }
        
        //calculate the new place for the right button
        right_button    = content_width - total - 29;
        $('.call2action .button_right').css('right', right_button +'px');
        
        $('.call2action .content').each(function(){
            margin_bottom = 0;
            $(this).children('.tab').removeClass('invisible');
            margin_bottom = $(this).children('.tab').first().height() - 135;
            if ($(this).hasClass('invisible')){
                $(this).children('.tab').addClass('invisilbe');
            }
            
//            alert($(this).children('.tab').height());
            if ( margin_bottom > 20 ) {
                $(this).children('.c2a_images').css('margin-bottom',margin_bottom);
            }
        })
        
//        link_width = 0
//        $('.call2action_link').each(function(){
//            $(this).children().each(function(){
//                link_width = link_width + $(this).width() + 4;
//            });
//            if (link_width < 250) {
//                link_width = 250;
//            }
//            $(this).width(link_width);
//        });
        
//        margin_right    = total - $('.call2action_link').width() - 205;
//        $('.call2action_link').attr('style', $('.call2action_link').attr('style') + 'margin-right:'+ margin_right + 'px');    
});