S2230503 Enterprise TRG

by dixalex

HTML

<table class="dcmTableFixed">
    <tbody>
        <tr>
            <td class="firstColumn firstRow"></td>
            <td class="tanHeader thickTop">Skype for Business Pay-as-You Go Domestic and International</td>
            <td class="tanHeader thickTop">Skype for Business Calling Plan 1: Domestic Inbound and Outbound Allowance, International PAYG</td>
            <td class="tanHeader thickTop">Skype for Business Calling Plan 2: "Unlimited" Domestic,
                <br>International Pay-as-You Go</td>
            <td class="tanHeader thickTop">Ring Central</td>
            <td class="tanHeader thickTop">Stay with my current Telephone provider</td>
            <td class="tanHeader noneColumn thickRight thickTop plansRightBorder">None of these</td>
        </tr>
        <tr>
            <td class="O365Brown" colspan="4">Office 365 Features (Must purchase Office 365 plan to utilize Skype for Business)</td>
            <td class="O365empty"></td>
            <td class="O365empty"></td>
            <td class="O365empty noneColumn thickRight hideShow">(+/-)</td>
        </tr>
        <tr>
            <td colspan="7" class="firstColumn telephonyOddHeader noneColumn thickRight">Telephony Features</td>
        </tr>
        <tr>
            <td class="firstColumn oddTeleFeatures">Telephony Integration</td>
            <td colspan="3" class="oddTeleFeatures">&#10003;</td>
            <td class="oddTeleFeatures">&#10003;</td>
            <td class="O365empty"></td>
            <td class="O365empty noneColumn thickRight"></td>
        </tr>
        <tr>
            <td class="firstColumn evenTeleFeatures">Available on Android, iOS, Mac, Windows, web client &amp; IP Phones</td>
            <td colspan="3" class="evenTeleFeatures">&#10003;</td>
            <td class="evenTeleFeatures">&#10003;</td>
            <td class="O365empty"></td>
            <td class="O365empty noneColumn thickRight"></td>
        </tr>
        <tr>
            <td class="firstColumn...

CSS

.styledRadio {
		    float: left;
		    clear: both;
		    margin: 0 3px 3px 0;
		    background-repeat: no-repeat;
		}
		
		.styledCheckbox {
		    float: left;
		    clear: both;
		    margin: 0 3px 3px 0;
		    background-repeat: no-repeat;
		}
		
		label {
		    line-height: 27px;
		    display: inline-block;
		    margin-bottom: 3px;
		}
		
		.mrQuestionText {
		    font-weight: normal;
		}
		
		table.dcmTableFixed {
		    border-collapse: collapse;
		    border-bottom: solid 2px #000;
		    border-top: none;
		    border-left: none;
		    border-right: none;
		    width: 950px;
		}
		
		table.dcmTableFixed td {
		    border: solid 1px #DDD;
		    font-family: arial;
		    font-size: .71em;
		    text-align: center;
		    padding: 2px;
		    min-width: 118px;
		}
		
		table.dcmTableFixed td.firstColumn {
		    color: #000;
		    border-left: solid 2px #000;
		    min-width: 255px;
		    text-align: left;
		    padding-left: 5px;
		}
		
		table.dcmTableFixed td.firstColumn.firstRow {
		    border: none;
		    border-top: none;
		    border-bottom: solid 2px #000;
		    border-right: solid 2px #000;
		}
		
		table.dcmTableFixed td.firstColumn.tanHeader {
		    border-left: solid 2px #000;
		}
		
		table.dcmTableFixed td.telephonyEven {
		    background-color: #FFFFFF;
		}
		
		table.dcmTableFixed td.telephonyOdd {
		    background-color: #e6e9ee;
		}
		
		table.dcmTableFixed td.telephonyOddHeader {
		    background-color: #9bc2e6;
		    font-weight: bold;
		    border-top: solid 2px #000;
		    border-right: solid 2px #000;
		    text-align: center !important;
		    border-bottom: none;
		    /*background-color: #cdc7a7;*/
		}
		
		table.dcmTableFixed td.telephonyPlansHeader {
		    background-color: #FABF8F;
		    font-weight: bold;
		    border-top: solid 2px #000;
		    border-right: solid 2px #000;
		    border-left: solid 2px #000;
		    border-bottom: solid 1px #000;
		    text-align: center !important;
		    /*background-color:...

JavaScript

$('.hideShow').each(function(i, el) {
    $(el).on('click', function(e) {
        var teleHide = $('.oddTeleFeatures, .evenTeleFeatures').closest('tr');
        $(teleHide).add($('.firstColumn.evenTeleFeatures').closest('tr')).toggle();
    });
});