﻿/**,
*:before,
*:after {
    box-sizing: border-box;
    padding: 0;
    margin: 0;
}

body {*/
/*background-color: #f5f7ff;
    font-family: 'Poppins',sans-serif;
    color: #2c2c51;
    height: 100vh;
    width: 100vw;
    display: flex;
    align-items: center;
    justify-content: space-around;*/
/*}

.cardr {
    height: 150px;
    width: 200px;
    position: relative;
}

input[type="radio"] {
    -webkit-appearance: none;
    appearance: none;
    background-color: white;
    height: 100%;
    width: 100%;
    border-radius: 10px;
    position: absolute;
    box-shadow: 7px 7px 15px rgba(2,28,53,0.08);
    cursor: pointer;
    outline: none;
}

    input[type="radio"]:before {
        content: "";
        position: absolute;
        height: 22px;
        width: 22px;
        background-color: #f9fafd;
        border: 1px solid #e2e6f3;
        border-radius: 50%;
        top: 35px;
        right: 20px;
    }

    input[type="radio"]:after {
        content: "";
        position: absolute;
        height: 13px;
        width: 13px;
        background-color: transparent;
        border-radius: 50%;
        top: 39.5px;
        right: 24.5px;
    }

label {
    position: absolute;
    margin: 20px;
    cursor: pointer;
}

h5 {
    font-weight: 600;
    font-size: 18px;
    letter-spacing: 0.5px;
    margin: 15px 0 20px 0;
}

h2 {
    font-size: 28px;
}

span {
    font-weight: 400;
    font-size: 18px;
    color: #7b7b93;
}

input[type="radio"]:hover {
    transform: scale(1.05);
}

input[type="radio"]:checked {
    border: 3px solid #478bfb;
}

    input[type="radio"]:checked:after {
        background-color: #478bfb;
    }*/


input[type="radio"] {
    display: none;
}

.radio-label {
   /* position: relative;
    color: #4189e0;
    font-family: "Poppins", sans-serif;*/
    cursor: pointer;
    display: inline-flex;
   /* align-items: center; 
    border: 3px solid #4189e0;
    padding: 2em 2em;
    border-radius: 0.5em;*/
  

    width: 200px;
    height: 160px;
    display: inline-block;
    background: #fff;
    border-radius: 32px 0px 32px 0px;
    margin: 0 8px;
    font-size: 21px;
    color: #0c557f;
    font-weight: 700;
    padding: 51px 0px;
    transition: all linear 0.3s;

}

@media only screen and (max-width: 991px) {
.ins-sct{width:305px; height:314px; border-radius:20px; padding:19px 14px; margin:0 auto}
.ins-det a { margin:0 8px 18px; border-radius:8px;}
.radio-label { margin:0 8px 18px; border-radius:8px;}
.but-ar{margin-top:15px; padding:8px 0;}
}

/* ================= Tablet (Portrait) 768px - 959px ================= */
@media only screen and (max-width: 991px) {
.ins-sct{width:305px; height:314px; border-radius:20px; padding:19px 14px; margin:0 auto}
.ins-det a { margin:0 8px 18px; border-radius:8px;}
.radio-label { margin:0 8px 18px; border-radius:8px;}

.but-ar{margin-top:15px; padding:8px 0;}
}

/* ================= Mobile (Portrait) below 480px  ================= */
@media only screen and (max-width:479px) {
.bx-ar{width:155px; height:155px; border-radius:15px;}
.bx-ar p:nth-child(1){ width:80px; height:80px;}
.bx-ar p:nth-child(1) img{ width:65px; height:65px;}
.bx-ar p:nth-child(1) span img{ width:35px; height:35px;}
.bx-ar p:nth-child(2) a {font-size:15px;}
.ins-sct{width:320px; height:auto;}
.ins-det a{width:158px; margin:0 4px 10px 4px; padding: 51px 0px;}
.radio-label{width:158px; margin:0 4px 10px 4px; padding: 51px 0px;}

.but-ar a:nth-child(1){width:129px;}
.but-ar a:nth-child(2){width:129px;}
.input{width:38px; height:40px; margin:0 0px; font-size:15px; border-radius: 6px;}
.verf-but a{padding:9px 86px;}
.verf-but button{padding:9px 86px;}
}

.ins-det label:hover {
    background: #338abb;
    color: #fff;
} 

    .radio-label:before {
        content: "";
        /* height: 2em;
        width: 2em;
        border: 3px solid #4189e0;*/
        border-radius: 50%;
    }

input[type="radio"]:checked + label:before {
    /* height: 1em;
    width: 1em;
    border: 0.65em solid #ffffff;*/
    background-color: #4189e0;
}

input[type="radio"]:checked + label {
    /*background-color: #4189e0;
    color: #ffffff;*/

    background: #338abb;
    color: #fff;

    /*width: 200px;*/
    height: 160px;
    display: inline-block;
    /*border-radius: 32px 0px 32px 0px;
    margin: 0 8px;*/
    font-size: 21px;   
    font-weight: 700;
    padding: 51px 0px;
    transition: all linear 0.3s;
}

@media only screen and (max-width:1366px) {
    input[type="radio"]:checked + label {
        width: 200px;
        margin: 0 8px;
        border-radius: 32px 0px 32px 0px;
    }
}

@media only screen and (max-width:1279px) {
    input[type="radio"]:checked + label {
        width: 200px;
        margin: 0 8px;
        border-radius: 32px 0px 32px 0px;
    }
}

@media only screen and (max-width:1151px) {
    input[type="radio"]:checked + label {
        width: 200px;
        margin: 0 8px;
        border-radius: 32px 0px 32px 0px;
    }
}

@media only screen and (max-width: 991px) {
    input[type="radio"]:checked + label {
        width: 200px;
        margin: 0 8px;
        border-radius: 32px 0px 32px 0px;
    }
}
@media only screen and (max-width:479px) {
    input[type="radio"]:checked + label {
        width: 158px;
        margin: 0 4px 10px 4px;
        padding: 51px 0px;        
        border-radius: 8px;
    }
}


    .d-block {
        font-size: 18px;
        font-weight: 500;
    }