/* Footer CSS */
.footer-container{
    display: grid;
    grid-template-rows: auto auto;
    
    
    
}
.fgrid{
    width: 85%;
    margin: auto;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 20px;
    color: rgb(184, 184, 184);
    align-items: center;
    font-size:14px;
}
.fcopy{
    font-size: 12px;
    padding: 10px;
}
.flinknone{
    text-decoration: none;
    color:  rgb(184, 184, 184);
}
/* Footer CSS ends*/

/* Link CSS */
li{
    list-style-type: none;
}
.linknone{
    text-decoration: none;
    color: black;
    padding: 5px;   
}
.linknone:hover{
    background-color: black;
    color: white;
    border-radius: 5px;
}
.b-linknone{
    text-decoration: underline;
    color: black;
    padding: 5px;
}
.b-linknone:hover{
    text-decoration: underline;
    color: black;
    font-weight: bold;
    padding: 5px;
}
.iconlink{
    color: black;

}

/* Link CSS ends */

/* Card container CSS */
.card-container{
    display: grid;
    padding: 0 40px 0 40px;
    grid-template-columns: 1fr 1fr;
}
.cardcostcontainer{
    display: grid;
    grid-template-rows: 1fr 1fr;
}
.cardmain{
    display: grid;
    grid-template-columns: 2fr 1fr;
}

.card{
    width: 90%;
    height: 125px;
    margin: auto;
    padding: 15px;
    display: grid;
    border: none;
    grid-template-columns: 2fr 1fr;
    box-shadow: rgba(222, 222, 222, 0.851) 3px 3px 4px,rgba(222, 222, 222, 0.851) -3px -3px 4px ;
}
.sponsorcard{
    width: 95%;
    height: auto;
    margin: auto;
    padding: 15px;
    display: grid;
    border: none;
    grid-template-columns: 1fr;
    box-shadow: rgba(222, 222, 222, 0.851) 3px 3px 4px,rgba(222, 222, 222, 0.851) -3px -3px 4px ;
}
.subtext{
    font-size: 12px;
}
.cardcostspan{
    font-size:30px;
    font-weight: bold;
}
.brandlogo{
    width: 100px;
    
}
.submenu{
    text-align: center;
    font-size: large;
    margin-top: 20px;
}
.blogcontainer{
    width: 80%;
    margin: auto;
}
/* Card container CSS ends */

/* Product card container CSS */
.productcard{
    width: 90%;
    margin: auto;
    padding: 15px;
    display: grid;
    border: none;
    grid-template-columns: 2fr 1fr;
    box-shadow: rgba(222, 222, 222, 0.851) 3px 3px 4px,rgba(222, 222, 222, 0.851) -3px -3px 4px ;
    overflow-wrap: break-word;
}
.pre{
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: medium;
    overflow-wrap: break-word;
}
.productcostbox{
    display: grid;
    grid-template-rows: 1fr 1fr;
}
.productcostcard1{
    display: grid;
    grid-template-rows: 1fr 2fr;
    border-left: 1px solid rgb(222,222,222);
    padding-left: 10px;
}
.productcostcard2{
    display: grid;
    grid-template-rows: 1fr 1fr;
    border-left: 1px solid rgb(222,222,222);
    padding-left: 10px;
}
.productcostaffiliate1{
    background-image: url("affilates/TelusCB.png");
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    display: grid;
    grid-template-rows: 1fr 1fr;
    border-left: 1px solid rgb(222,222,222);
    padding-left: 10px;  
}
.productcostaffiliate2{
    background-image: url("affilates/KoodoCB.png");
    background-position: center;
    background-size: cover;
    display: grid;
    grid-template-rows: 1fr 1fr;
    border-left: 1px solid rgb(222,222,222);
    padding-left: 10px;
    
}
.productcostspan{
    font-size:50px;
    font-weight: bold;
}

/* offer code */
.ofrcode{
    background-color: rgb(248, 245, 45);
    border-radius: 10px;
    animation-name: code;
    animation-duration: 1s;
    animation-iteration-count: 3;
}
@keyframes code {
    0% {background-color: rgb(248, 245, 45) ;}
    25% {background-color:  #ff3131 ;}
    50% {background-color: rgb(248, 245, 45) ;}
    100% {background-color:  #ff3131 ;}
}
/*  */

/* newsletter */
.newsletter{
    box-shadow: none;
    border: none;
    color: #f8f9fa;
}

/* Province Nav */
.province{
    padding: 4px;
    background-color: #f8f9fa;
    border: none;
}

/* contact us form */



/* blog welcome */
.blogwelcome{
    width: 100%;
    margin:auto;
}
.bloglistcard{
    width: 90%;
    height: 125px;
    margin: auto;
    padding: 15px;
    display: grid;
    border: none;
    grid-template-columns: 1fr 4fr;
    box-shadow: rgba(222, 222, 222, 0.851) 3px 3px 4px,rgba(222, 222, 222, 0.851) -3px -3px 4px ;
}
.bloglistcard:hover{
    background-color: rgb(250, 235, 235);
}

.ribbon {
    width: 60px;
    font-size: 14px;
    padding: 4px;
    text-align: center;
    border-radius: 25px;
    background-color: #ffd900;
    color: rgb(0, 0, 0);
  }
.bg-ribbon{
    background-image: linear-gradient(to right, rgb(167, 0, 0),black, black,  black, rgb(167, 0, 0));
    border: none;
    font-weight: bold;
}
.bg-ribbon:hover{
    background-image: linear-gradient(to right, red,black, black,  black, red);
    border: none;
}
.bloglink{
    margin-top: 10px;
    font-size: larger;
}


/* ERROR handler */
.urlalert {
    font-size: 70px;
}

.urlerror {
    width: 70%;
}
.searchcontainer{
    height: 70vh;
}



