.ccp-wrap {
font-size: 14px;
color: #555;
line-height: 23px;
}
.ccp-wrap strong { color: #111; font-weight: 600; }
.ccp-wrap hr {
border: none;
border-top: 1px solid #eee;
margin: 20px 0;
} .ccp-freshness-bar {
display: flex;
align-items: center;
gap: 8px;
font-size: 12px;
color: #777;
background: #f6fff6;
border: 1px solid #d4ecd4;
border-radius: 5px;
padding: 8px 12px;
margin-bottom: 14px;
flex-wrap: wrap;
}
.ccp-fresh-dot {
width: 8px;
height: 8px;
border-radius: 50%;
background: #22c441;
flex-shrink: 0;
animation: ccp-pulse 2.5s infinite;
}
@keyframes ccp-pulse {
0%,100% { opacity:1; } 50% { opacity:0.3; }
} .ccp-how-strip {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 10px;
margin: 14px 0;
}
.ccp-how-step {
display: flex;
align-items: flex-start;
gap: 10px;
background: #f9fafe;
border-radius: 6px;
padding: 12px;
}
.ccp-how-num {
display: flex;
align-items: center;
justify-content: center;
width: 24px;
height: 24px;
min-width: 24px;
border-radius: 50%;
background: #111;
color: #fff;
font-size: 12px;
font-weight: 700;
line-height: 1;
}
.ccp-how-text {
font-size: 12px;
color: #555;
line-height: 16px;
} .ccp-stat-strip {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 10px;
margin: 14px 0;
}
.ccp-stat-box {
background: #f9fafe;
border: 1px solid #eee;
border-radius: 6px;
padding: 12px 8px;
text-align: center;
}
.ccp-stat-num {
display: block;
font-size: 22px;
font-weight: 700;
color: #111;
line-height: 1.1;
}
.ccp-stat-lbl {
display: block;
font-size: 11px;
color: #999;
margin-top: 4px;
line-height: 14px;
} .ccp-note {
font-size: 12px !important;
color: #aaa !important;
margin: 4px 0 10px !important;
line-height: 18px !important;
} .ccp-jumpnav {
background: #f9fafe;
border: 1px solid #eee;
border-radius: 6px;
padding: 16px 18px;
margin: 0 0 20px;
}
.ccp-jumpnav-title {
font-size: 11px !important;
font-weight: normal !important;
letter-spacing: .18em;
text-transform: uppercase;
color: #bbb !important;
margin: 0 0 12px !important;
line-height: 14px !important;
}
.ccp-jumpnav-sections {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
gap: 14px;
}
.ccp-jumpnav-section h3 {
font-size: 12px !important;
font-weight: 600 !important;
color: #333 !important;
margin: 0 0 6px !important;
line-height: 16px !important;
}
.ccp-jumpnav-section ul {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
.ccp-jumpnav-section ul li {
margin: 0 0 3px !important;
padding: 0 !important;
line-height: 16px !important;
}
.ccp-jumpnav-section ul li a {
font-size: 12px !important;
color: #1679ed !important;
text-decoration: none !important;
line-height: 18px !important;
display: inline-flex;
align-items: center;
gap: 4px;
}
.ccp-jumpnav-section ul li a:hover {
text-decoration: underline !important;
}
.ccp-jumpnav-icon {
font-size: 11px;
line-height: 1;
} .ccp-section-h2 {
font-size: 18px !important;
font-weight: 700 !important;
color: #111 !important;
margin: 24px 0 4px !important;
line-height: 1.3 !important;
scroll-margin-top: 80px;
}
.ccp-section-sublabel {
font-size: 11px !important;
color: #bbb !important;
margin: 0 0 14px !important;
font-weight: normal !important;
letter-spacing: .15em;
text-transform: uppercase;
} .ccp-rows {
display: flex;
flex-direction: column;
gap: 0;
margin-bottom: 6px;
border: 1px solid #eee;
border-radius: 6px;
overflow: hidden;
}
.ccp-row {
display: grid;
grid-template-columns: 220px 1fr 180px;
gap: 0;
border-bottom: 1px solid #f3f4f6;
background: #fff;
scroll-margin-top: 80px;
transition: background 0.15s;
}
.ccp-row:last-child { border-bottom: none; }
.ccp-row:hover { background: #fafcff; } .ccp-row-cat {
padding: 16px 14px;
border-right: 1px solid #f3f4f6;
display: flex;
flex-direction: column;
justify-content: center;
background: #fafafa;
}
.ccp-row-cat h3 {
font-size: 13px !important;
font-weight: 600 !important;
color: #222 !important;
margin: 0 0 3px !important;
line-height: 18px !important;
}
.ccp-row-icon {
font-size: 16px;
margin-bottom: 4px;
display: block;
} .ccp-row-winner {
padding: 16px 16px;
display: flex;
flex-direction: column;
justify-content: center;
gap: 4px;
}
.ccp-row-carrier {
font-size: 15px !important;
font-weight: 700 !important;
color: #111 !important;
margin: 0 !important;
line-height: 1.2 !important;
}
.ccp-row-plan {
font-size: 12px !important;
color: #777 !important;
margin: 0 !important;
line-height: 16px !important;
}
.ccp-row-tags {
display: flex;
flex-wrap: wrap;
gap: 4px;
margin-top: 4px;
}
.ccp-row-why {
font-size: 11px !important;
color: #aaa !important;
margin: 4px 0 0 !important;
line-height: 15px !important;
} .ccp-row-price-col {
padding: 16px 14px;
border-left: 1px solid #f3f4f6;
display: flex;
flex-direction: column;
align-items: flex-end;
justify-content: center;
gap: 6px;
text-align: right;
}
.ccp-row-price {
font-size: 24px !important;
font-weight: 400 !important;
color: #111 !important;
margin: 0 !important;
line-height: 1 !important;
}
.ccp-row-price span {
font-size: 12px !important;
color: #aaa !important;
font-weight: 400 !important;
}
.ccp-row-price-note {
font-size: 10px !important;
color: #bbb !important;
margin: 0 !important;
line-height: 13px !important;
text-align: right;
}
.ccp-row-data {
font-size: 12px;
font-weight: 600;
color: #333;
} .ccp-badge {
display: inline-block;
font-size: 10px;
padding: 2px 6px;
border-radius: 4px;
font-weight: normal;
text-transform: uppercase;
letter-spacing: .04em;
white-space: nowrap;
}
.ccp-badge--rogers    { background:#ffe5e5; color:#9b2020; }
.ccp-badge--telus     { background:#e5f5e5; color:#1a7a1a; }
.ccp-badge--bell      { background:#e5eeff; color:#1a3d8a; }
.ccp-badge--freedom   { background:#fff3e0; color:#9b5000; }
.ccp-badge--sasktel   { background:#f3e5ff; color:#6a1a9a; }
.ccp-badge--videotron { background:#e5f9ff; color:#0a6080; }
.ccp-badge--eastlink  { background:#e5fff3; color:#0a6040; }
.ccp-badge--other     { background:#f0f0f0; color:#555; } .ccp-tag {
font-size: 10px;
background: #f3f4e5;
color: #666;
padding: 2px 6px;
border-radius: 4px;
white-space: nowrap;
} .ccp-row-no-winner {
font-size: 12px !important;
color: #ccc !important;
margin: 0 !important;
font-style: italic;
} a.ccp-btn {
display: inline-block;
font-size: 11px;
font-weight: normal;
padding: 6px 11px;
border-radius: 5px;
border: 1px solid #111;
color: #111;
cursor: pointer;
text-decoration: none;
white-space: nowrap;
}
a.ccp-btn:hover { background:#f9fefe; text-decoration:none; }
a.ccp-btn.primary { background:#1679ed; color:#fff; border:0; }
a.ccp-btn.primary:hover { background:#1e53ec; }
.ccp-cta-row {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin: 20px 0;
} .ccp-disclaimer {
border-top: 1px solid #eee;
padding-top: 14px;
margin-top: 10px;
}
.ccp-disclaimer p {
font-size: 11px !important;
color: #aaa !important;
line-height: 16px !important;
margin: 0 !important;
} @media (max-width: 600px) { .ccp-how-strip { grid-template-columns: 1fr; } .ccp-stat-strip { grid-template-columns: 1fr 1fr; } .ccp-jumpnav-sections { grid-template-columns: 1fr 1fr; } .ccp-row {
grid-template-columns: 1fr;
border-bottom: 2px solid #f3f4f6;
}
.ccp-row-cat {
background: #f9fafe;
border-right: none;
border-bottom: 1px solid #f3f4f6;
padding: 12px 14px 10px;
flex-direction: row;
align-items: center;
gap: 8px;
}
.ccp-row-cat h3 { margin: 0 !important; }
.ccp-row-icon { margin: 0; font-size: 14px; }
.ccp-row-winner { padding: 12px 14px; }
.ccp-row-price-col {
border-left: none;
border-top: 1px solid #f3f4f6;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px 14px;
text-align: left;
}
.ccp-row-price-note { text-align: left; }
.ccp-cta-row { flex-direction: column; }
.ccp-cta-row a.ccp-btn { text-align: center; }
} @media (min-width: 601px) and (max-width: 900px) {
.ccp-how-strip { grid-template-columns: 1fr; }
.ccp-stat-strip { grid-template-columns: repeat(2,1fr); }
.ccp-row {
grid-template-columns: 180px 1fr 160px;
}
} .ccp-row-price small {
font-size: 10px !important;
color: #bbb;
font-weight: normal;
display: block;
line-height: 12px;
margin-top: 2px;
} a.ccp-carrier-link {
color: #111 !important;
text-decoration: none !important;
border-bottom: 1px dotted #aaa;
}
a.ccp-carrier-link:hover {
color: #1679ed !important;
border-bottom-color: #1679ed;
text-decoration: none !important;
} .ccp-row-cat { gap: 0; }#comments { position: relative; margin-top: 30px; clear: both;  }
#comments .title_comments { font-size: 18px;line-height: 20px; color: #111111; padding-bottom: 25px; font-weight: bold; }
.commentlist { margin: 0 0 30px 0; list-style: none; clear: both; }
.commentlist li { margin: 0 0 25px 0; }
.commbox { background: none repeat scroll 0 0 #FFFFFF; border: 1px solid #ededed; box-shadow: 0 1px 1px #ededed; height: auto; max-width: 100%;  position: relative; }
.commentlist ul.children {  margin-left: 23px; padding-left: 23px; position: relative; margin-top: 23px; }
.commentlist ul.children .commbox:before { content: "\f176"; left: -24px; position: absolute; top: 50%; width: 25px; color:#C8C8C8; font-size:15px; }
.commentlist .comment-author img { width: 50px; height: 50px; float: left; margin-right: 20px; }
.commentlist .comment-author .fn { font-weight:bold; font-size: 15px; line-height:15px; text-transform: uppercase; display: block;  }
.commentlist .comment-author .fn a { margin: 0;color: #000; }
.commentlist .comment-author .fn .url:hover { color: #999; }
.commentlist .comment-author span.time { font-size: 12px; display:block;  text-decoration: none; margin: 6px 0 0 0; }
.commentlist .comment-author span.time a{color: #999999;}
.commentlist .comment-author a div.comment-link { font-size: 16px; margin-top: -3px; margin-left: -10px; }
.commentlist .comment-content { display: block; padding: 15px 20px; position: relative; overflow:auto;}
.commentlist .comment-content p { font-size: 14px;line-height: 22px; color: #111; margin: 0 0 12px 0; }
.commentlist .comment-content a, .subcategortes { word-break: break-word; }
.commentlist .comment-content small { color: #999; display: block; font-size: 12px; margin-top: 3px; }
.comment-reply-link, .comment-reply-login { font-size: 12px; float: right; color: #ccc }
.comment-reply-link:before, .comment-reply-login:before { content: "\f062 "; padding-right: 2px }
.comment-edit-link { float: right; font-size: 11px;margin-left: 8px; }
.comment-respond { padding: 30px 35px; margin-bottom: 30px; box-shadow: 0 1px 1px 0 rgba(0,0,0,.12); background: #f6f6f6 }
.comment-respond h3 { font-weight:bold; font-size: 19px; line-height:21px; text-transform: uppercase; margin: 0 0 25px 0; }
#cancel-comment-reply-link { border-bottom: 1px dotted #111; margin: 0 10px; text-decoration: none; font-size: 12px }
.comment-respond .usr_re input, .comment-respond .email_re input, .comment-respond .site_re input {    padding: 0 0 0 50px; width: 100%; font-size: 14px; margin-bottom: 20px; border-radius: 0px; height: 38px; border: 1px solid #cbd0d2; float: left; position: relative; }
.comment-respond textarea { width: 100%; margin-bottom: 20px; clear: both }
.comment-respond .usr_re, .comment-respond .email_re, .comment-respond .site_re{display: block; vertical-align: middle; position: relative; float: left; width: 32%; margin-right: 2%}
.comment-respond .end { margin-right: 0px !important; }
.comment-respond .usr_re:after, .comment-respond .email_re:after, .comment-respond .site_re:after{background: none #2f2f2f; position: absolute; left: 0; top: 0; color: #fff; width: 38px; height: 38px; text-align: center; line-height: 38px }
.comment-respond .usr_re:after {  content: "\f007"; }
.comment-respond .email_re:after { content: "\f0e0" }
.comment-respond .site_re:after { content: "\f0c3"}
.comment-respond p.form-submit{clear: both; margin-top: 15px}
#commentform #submit{ font-size: 16px; padding: 8px 14px;display: block  }
#disqus_thread { margin-top: 20px; }
p.comment-subscription-form { margin-top: 10px }
#comments_pagination {font-size: 18px;}
#comments_pagination a{ color: #111}
#comments_pagination span.page-numbers.current{background: #eee; padding: 3px 7px;}
#loadcomment-list .loadingcomment i{ font-size: 20px; color: #ff9800}
.comm_meta_wrap{margin: 0 0 0 70px}
.commentlist #user_reviews_in_comment {display: none;}
.ap_waiting{color: red; margin: 10px 0}
#rehub-comments-tabs .add_user_review_link{ float: right; padding: 5px 10px;margin: 5px 0 20px 20px;}
.commentlist .rh-user-rank-mc{font-size: 11px; padding: 2px 5px}
.commentlist  .rh_mycred-users-badges img{width: 20px;height: 20px;margin: 0 2.5px;border-radius: 0;}
@media screen and (max-width: 767px) {
.comment-respond .usr_re, .comment-respond .email_re, .comment-respond .site_re{ width: 100%; margin: 0}
.commentlist .comment-author a, .commentlist .comment-author time{ margin:0 0 10px 0; float:none; display:block}
a.comment-reply-link, a.comment-edit-link { text-align: right;}
.commentlist .comment-author a.comment-edit-link{ margin-bottom: 4px}
.commentlist .comment-author .fn, .commentlist .comment-author .fn a{ float:none}
.commentlist .comment-author img{ }
.commentlist ul.children{ margin-left:10px; padding-left: 0; border-left: none }
.commentlist ul.children .commbox:before { display: none;}
}