/* CSS Document */
@import url("font-awesome.css");
.header{ display:none;}
.content {/*margin-top: 15px;*/ margin-top: 10px; margin-bottom: 6px; }
.contact-box {
    display: flex;
    padding:20px 0;
}
    .contact-box li, .contact-box li a, .contact-box li a:hover {
        font-size: 15px;
        color: black;
        margin-top: 22px;
        text-decoration: none;
        font-family: 'Roboto', sans-serif;
    }

    .contact-box li:first-child {
        margin-right: 20px;
    }

    .contact-box li:last-child {
        margin-left: 20px;
    }
.login-form {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    padding: 30px;
    box-shadow: 0px 3px 39px 11px rgba(28, 68, 135, 0.15);
    border: solid 1px #e3e5e9;
    border-radius: 0.25rem;
}
.container .login-form .row {
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 20px;
}
.login-form .input-field label, .login-form .input-field label.active {left:0;}
.login-form .input-field .prefix ~ input,
.login-form .input-field .prefix ~ label, .login-form .input-field .prefix ~ .validate ~ label {
    margin-left: 0rem;
    width: 92%;
    width: calc(100% - 0rem);
}
.login-form .validation_msg {padding-left:0 !important;}
.login-bg .box1.container {
    padding: 20px 20px 0px;
}
.aiflogin-img-sec {
    /*padding-top: 30px;*/
    /*width: 500px;*/
    height: 100%;
    padding-bottom:20px;
}
.login-bg {
    /*background: url(/ClarusAif/Images/banner-aifbg.jpg) no-repeat !important;*/
    /*background: url(/Images/banner-aifbg.jpg) no-repeat !important;*/
    background-color: #f2f3f8;
    padding-bottom: 0px;
    /*background-size: 100%;*/
    background-position: bottom;
    /*height:600px;*/
}
.login-bg .content{margin:0;}
.disc_text, .disc_text a {
    display: block;
    margin-top: 10px;
    font-family: 'Roboto', sans-serif;
    font-size: 12px;
    line-height: 1.5;
    color: rgba(0, 0, 0, 0.6);
    text-align: center;
}
.disc_text a:hover{color: rgba(0, 0, 0, 0.8);text-decoration:none;}
.send-otp-sec {
    position: absolute;
    width: auto;
    top: 20px;
    right: 15px;
}
input[type="submit"].send-otp {
    color: #666;
    border: 1px solid #666 !important;
    font-size: 12px;
    box-shadow: none;
    background: #fff;
    cursor: pointer;
    font-weight: 600;
    z-index: 99;
    padding: 4px 6px;
    height: 22px;
    text-transform: uppercase;
    line-height: normal;
    letter-spacing: 0;
    font-family: 'Roboto', sans-serif;
}
.otp-message {
    font-size: 12px;
    padding-left: 2px;
    padding-top: 5px;
    line-height: 16px;
    margin-bottom: 15px;
    color: #343a40;
    display: inline-block;
    margin-top: -5px;
    position: relative;
    font-family: 'Roboto', sans-serif;
}

.signup-tnc {
    color: rgba(0, 0, 0, 0.6);
    margin-bottom: 15px;
}
.aif-title {
    color:#0066B2;
    font-size: 35px;
    font-family: 'Roboto', sans-serif;
    margin-bottom: .5rem;
    margin-top: 0;
    line-height: 1.2;
    text-transform: uppercase;
}
.aif-dsc {
    font-size: 15px;
    color: #000000;
    text-align: justify;
}
.registration-form {width:84%; margin:0 auto; background:#fff; padding:30px 20px; border-top: 10px solid #0067ac;}
.mul-border {margin-top: 5px;}
.user-id, .user-pwd,.pin,.captcha,.dob,.mail,.comp,.gender,.question,.address,.phone,.country,.answer,.city,.key,.contact-person,.contact-number,.email {position:relative; color:#0067ac;}
    .user-id:before {
        font-family: 'Roboto' !important;
        position: relative;
        top: 1px;
        left: 18px;
        content: "\f007";
        font-size: 18px;
    }
.input_txt{border: none;  border-bottom: 1px solid #ccc;  width: 82%;  padding: 7px 31px; margin-bottom: 16px;margin-top: 10px;
margin-left: auto;	margin-right: auto;}
.forpwd_input_txt {
    border: none;
    border-bottom: 1px solid #ccc;
    width: 66%;
    padding: 7px 5px;
    margin-bottom: 5px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}
.reg_input_txt{border: none;  border-bottom: 1px solid #ccc;   width: 82%;  padding: 7px 28px; margin-top: 10px;
margin-left: auto;	margin-right: auto;}
.forpwd_dropdown_txt {
    width: 66%;
    padding: 7px 5px;
    margin-bottom: 5px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
    background-color: #f5f5f5;
	border: 1px solid #ccc;
}
.user-pwd:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f023";
    color: #0067ac;
    font-size: 18px;
}
.pin:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f09d";
    color: #852272;
    font-size: 18px;
}
.captcha:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f13e";
    color: #ccc;
    font-size: 20px;
}
.dob:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f133";
    color: #852272;
    font-size: 18px;
}
.mail:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f003";
    color: #852272;
    font-size: 18px;
}
.comp:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f0f7";
    color: #852272;
    font-size: 18px;
}
.gender:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 0px;
    left: 18px;
    content: "\f224";
    color: #852272;
    font-size: 18px;
}
.question:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 12px;
    left: 18px;
    content: "\f29c";
    color: #852272;
    font-size: 18px;
    float: left;
}
.address:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f015";
    color: #ccc;
    font-size: 20px;
}
.city:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f041";
    color: #ccc;
    font-size: 18px;
}
.circle-down-arrow {
    font-family: 'Roboto' !important;
    content: "\f13a";
    color: #ccc;
    font-size: 18px;
}
.key:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f084";
    color: #852272;
    font-size: 18px;
}
/*.phone:before{font-family: 'Roboto'; position: relative;top: 1px;left: 18px;content: "\f098";color:#ccc; font-size:17px;}*/
.country:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f279";
    color: #852272;
    font-size: 18px;
}
.answer:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f058";
    color: #852272;
    font-size: 18px;
}
.contact-person:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f007";
    color: #852272;
    font-size: 20px;
}
.contact-number:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f095";
    color: #852272;
    font-size: 22px;
}
.email:before {
    font-family: 'Roboto' !important;
    position: relative;
    top: 1px;
    left: 18px;
    content: "\f0e0";
    color: #852272;
    font-size: 18px;
}

.forgot{color: #039be5;text-decoration: none;font-size: 14px;float:left;}
.forgot-pw{color: #039be5;text-decoration: none;font-size: 14px;float:right;    margin-top: -10px;
    margin-bottom: 15px;}
input[type="submit"] {border: none !important; cursor:pointer;}
.butn {
    background-color: #0066B2;
    color: #fff;
    padding: 10px 20px;
    font-size: 18px;
    font-weight: 600;
    line-height: normal;
    font-family: 'Roboto', sans-serif;
    box-sizing: border-box;
    white-space: nowrap;
    text-decoration: none;
    text-transform: uppercase;
    border: 0;
    outline: 0;
    cursor: pointer;
    display: block;
    text-align: center;
    width: auto;
    border-radius: .25rem;
}
.butn_light_blue {
    background: #ed1c24;
    color: #fff;
    padding: 10px 20px;
    text-align: center;
    display: block;
    margin: 3px auto;
    font-size: 16px;
    border-style: none;
    margin-top: 165px;
    border-bottom: 4px solid #cccccc;
    cursor: pointer;
    margin-right: 10px;
}
.butn_dark_blue {
    background: #ed1c24;
    color: #fff;
    padding: 10px 52px;
    text-align: center;
    display: block;
    margin: 3px auto;
    font-size: 16px;
    border-style: none;
    border-bottom: 4px solid #cccccc;
    cursor: pointer;
}
.or{border-bottom: 1px solid #ccc; margin-bottom: 40px;}
.or, .reg {text-align: center;}
.or-bg {background: #fff;padding: 10px;margin-top: 10px; position: relative;top: 10px;}
.or-bg::before {content: "or";}
.reg a{color:#222; text-decoration:none;}
a.sin-up {
    background: #ed1c24;
    color: #fff;
    padding: 10px;
    border: 1px solid #0067ac;
    text-decoration: none;
    text-align: center;
    margin: 0 auto;
    display: block;
    max-width: 100px;
    margin-top: 5px;
}
.dst-head{color:#852272; text-align:center; }
.useful-links {width: 100%;margin: 0 auto;text-align: center;}
.useful-links ul li {list-style: none;display: inline-block;margin: 42px;margin-left: -20px;}
.useful-links ul li a {color: #222;text-decoration: none; font-weight: 500;}
.hidden-mob{display:none;}
.online-services ul li {list-style: none;}
.online-services a {color: #222;text-decoration: none;font-size: 13px;font-weight: 600;}
.online-services ul{float: left;}
.latestMf h3 {margin: 15px 15px 10px;}
.selectBox{margin-top:-27px;}
.pin-gen select{width:100% !important;}
.form-error{font-size: 12px;color: #f00; margin-top: -12px;display: block;}	
.shadow2{height:520px;}
.captcha-no{width:20%; text-align:center; margin:0 auto; display:block;}	
.mytextwithicon {position:relative;}  
.gen-container{display:inline-block; margin-top:5px;}  
.gen-container a{text-decoration:none; margin:0 auto; padding: 5px 10px;text-align: center;}
.mytextwithicon:before {font-family: 'Roboto';position: absolute;top: 0;left: 0px;content: "\f00c";color:#ccc; }
 #genereate{display:none;}
.forgot-form .butn{margin-top:75px;}

/*----- New Style Specifications (KARVY) Starts ------*/
.login-form-big { width:84%; margin:0 auto; background:#fff; padding:30px 20px; border-top: 10px solid #852272; }
.login-form-big-noborder { width:100%; margin:0 auto; background:#fff; padding:20px 20px; }
.login-form-big-noborder1 {
    width: 50%;
    margin: 0 auto;
    background: #fff;
    padding: 20px 20px;
    box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.35);
    border: 1px solid #ccc;
}
.portfolio-noborder {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    padding: 1px 20px;
}
.portfolio-noborder1 {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    padding: 1px 20px;
	margin-top:30px;
}
.portfolio_input_txt {
    border: none;
    border-bottom: 1px solid #ccc;
    width: 35%;
    padding: 7px 2px;
    margin-bottom: 5px;
    margin-top: 5px;
    margin-left: 12px;
    margin-right: auto;
}

.buttonsMn { width:100%;text-align:center; }
.button { display:inline-block; }


.mobile_footer_tap ul {
    display: none;
}
/*----- New Style Specifications (KARVY) Ends ------*/


@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait){ 
.header{ display:block !important; background:none; height:0;}
.shadow2 {display:none;}

}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape){
.header{ display:block !important;  background:none; height:0;}
.login-form, .login-form-big {width: 40%; float:right;}
    .aif-service-sec {
        width: 60%;
        float: left;
        position: relative;
        padding: 20px 40px 10px 0px;
    }
.useful-links {width:18%;float:right; margin-right: 20px;}
.useful-links ul li{margin:14px auto; text-align:center;}
.dst-head{display:none;}
/*.content {margin-top: 110px;}*/
.hidden-mob,.dist-head{display:block;}
.bord{float:left; margin-left: 20px;}
.dist-head { background: url(/Images/distrbt-bg.png); width: 116px; height: 600px; float: left;margin-top: -35px;display: block;
margin-right:40px;}
.invs-head {background: url(/Images/investor-bg.png);width:116px;height:600px; float: left; margin-top: -35px; display: block;	margin-right:40px;}
 
.online-services ul{float:none;}

}

@media only screen  and (min-width : 1224px)
{
.header{display:block !important;  background:none; height:0;}
.login-form {width: 40%;float:right; margin-bottom:20px;}
    .aif-service-sec {
        width: 60%;
        float: left;
        position: relative;
        padding: 5px 15px 5px 5px;
    }
    .login-form-big {
        width: 98%;
        float: right; /*min-height:490px;*/
    }
.registration-form {
    width: 88.5%;
    float: right;
    min-height: 559px;
}
.login-form-big {width: 100%;float:right;/*min-height:490px;*/}

.useful-links { width: 18%;	float:right; margin-right: 20px;}
.useful-links ul li{margin:14px auto; text-align:center;}
.dst-head{display:none;}
/*.content { margin-top: 110px;}*/
.hidden-mob,.dist-head{display:block;}
.bord{float:left; margin-left: 20px;}
.dist-head {background: url(/Images/distrbt-bg.png);width:116px;height:600px; float: left; margin-top: -35px; display: block;	margin-right:40px;}

.invs-head {background: url(/Images/investor-bg.png);width:116px;height:600px; float: left; margin-top: -35px; display: block;	margin-right:10px;}

.invs-reg-head{background: url(/Images/investor-bg.png);width:116px;height:600px; float: left; margin-top: -20px; display: block;}
.online-services ul{float:none;}

}
/* New Purchase Styles Start*/

.new_pur_input_txt{
	border: none;  
	border-bottom: 1px solid #ccc;   
	width: 50%;  
	padding: 7px 5px; 
	margin-bottom: 16px;
	margin-top: 10px;
	margin-left: auto;	
	margin-right: auto;
}
.butn_blue{
	margin-left:10px;
	background: #0067ac;
    color: #fff;
    padding: 10px 20px;
    text-align: center;
    font-size: 16px;
    border-style: none;
	border-bottom: 4px solid #cccccc;
}
.butn_pink{
	margin-left:10px;
	background: #852272;
    color: #fff;
    padding: 10px 20px;
    text-align: center;
    font-size: 16px;
    border-style: none;
	border-bottom: 4px solid #cccccc;
}
	
/* New Purchase Styles End*/

/* Associate Folio Styles start*/

.ass-folio-text{
	 width: 18%;
     display: inline-block; 
}
.ass-folio_input_txt{
	border: none;  
	border-bottom: 1px solid #ccc;   
	width: 50%;
	padding: 7px 5px; 
	margin-bottom: 16px;
	margin-top: 10px;
	margin-left: auto;	
	margin-right: auto;
}
/* Associate Folio Styles End*/

/* Transaction Status Styles Start*/
.trans_input_txt {
    border: none;
    border-bottom: 1px solid #ccc;
    width: 82%;
    padding: 7px 8px;
    margin-bottom: 16px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}
/* Transaction Status Styles End*/
@media screen and (max-width:767px) {
    .aif-service-sec {margin-top:15px;    }
    .aif-title { font-size: 36px;    }
    .aiflogin-img-sec img {width:100%;    }
    .pull-right.mob-tollfree {
        display: none;
    }
    .footer p {padding:15px;    }
    .footer ul:not(.browser-default).terms {border:0; width:100%; padding:0 15px;   }
    .mobile_footer_tap {
        max-width: 100%;
        margin: 0px auto;
        background-color: #fff;
        display: block;
        padding: 0;
        text-align: left;
    }

        .mobile_footer_tap ul {
            padding: 0;
            display: block !important;
        }

            .mobile_footer_tap ul li {
                display: block;
                padding: 10px 15px;
                font-size: 12px;
                color: #757575;
                border-bottom: 1px solid #e1e1e1;
                vertical-align: middle;
            }

    .tap_call_icon {
        background: url('../../Images/tap_call_icon.jpg') no-repeat center 0;
        display: inline-block;
        width: 24px;
        height: 24px;
        vertical-align: middle;
        background-size: 100%;
        margin-right: 5px;
    }

    .mobile_footer_tap ul li a {
        color: #000;
        margin:0;
    }

    .app-footer ul li a {
        text-transform: none;
        font-size: 12px;
    }

    .communication_detail_icon {
        background: url('../../Images/commu.png') no-repeat center center;
        width: 27px;
        height: 23px;
        display: inline-block;
        margin: 0 auto;
        vertical-align: middle;
    }

        .communication_detail_icon.mob {
            margin-right: 5px;
            opacity: .35;
        }
}
