/* Add here all your css styles (customizations) */ /*Assessment main Countdown*/ /*Animation*/ html { scroll-behavior: smooth; } @-webkit-keyframes Expandit{ 0% { height: 75px; } 100% { height:500px; } } @-webkit-keyframes shirnkit{ 0% { height: 200px; } 100% { height: 75px; } } @-webkit-keyframes square-to-circle { 0% { border-radius:0 0 0 0; background:coral; left:0%; transform:rotate(0deg); } 100% { border-radius:50%; width:50px; height:50px; position: fixed; left:95%; border: 0px solid #ddd; margin-top: 0px; margin-left: 0px; top: 3px; transform:rotate(720deg); } } @-moz-keyframes Expandit{ 0% { height: 75px; } 100% { height:500px; } } @-moz-keyframes shirnkit{ 0% { height: 200px; } 100% { height: 75px; } } @-moz-keyframes square-to-circle { 0% { border-radius:0 0 0 0; background:coral; left:0%; transform:rotate(0deg); } 100% { border-radius:50%; width:50px; height:50px; position: fixed; left:95%; border: 1px solid #ddd; margin-top: 0px; margin-left: 0px; top: 3px; transform:rotate(720deg); } } /*Animation End*/ #totalCountdown, #totalCountdown span.countdown_row { overflow: hidden; } #totalCountdown span.countdown_row span { font-size: 10px; line-height: 18px; margin-right: 2px; text-align: center; display: inline-block; background-color:#fff; } #totalCountdown span.countdown_section { color:#d2322d; padding: 7px 14px; margin-bottom: 2px; /*background: url(../img/bg-white.png) repeat;*/ text-align: center; } #totalCountdown span.countdown_amount { font-size: 24px !important; font-weight: bold; padding: 2px; font-family: Arial !important; } /*Assessment main Countdown Ends*/ /*Assessment individal question coundown starts*/ #ques_timer, #ques_timer span.countdown_row { overflow: hidden; } #ques_timer span.countdown_row span { font-size: 10px; line-height: 12px; margin-right: 2px; text-align: center; display: inline-block; } #ques_timer span.countdown_section { color: #d2322d; padding: 5px 10px; margin-bottom: 2px; text-align: center; } #ques_timer span.countdown_amount { font-size: 20px !important; padding: 3px; font-weight: bold; font-family: Arial !important; } /*Assessment individal question coundown Ends*/ .padding-1{ padding-left:1px; padding-right:1px; padding-top:1px; padding-bottom:1px; } .btn-default:focus, .btn-default:active, .btn-default.active, .open .dropdown-toggle.btn-default{ background-image: none; background: #2ecc71; color: white; border-color: transparent; } .profile .date-formats{ background: #7D91D0 !important; } .no_row_line>thead>tr>th, .no_row_line>tbody>tr>th, .no_row_line>tfoot>tr>th, .no_row_line>thead>tr>td, .no_row_line>tbody>tr>td, .no_row_line>tfoot>tr>td { line-height: 1.428571429; vertical-align: top; border-top: 0px solid #ddd; border-top-width: 0px; border-top-style: solid; border-top-color: rgb(221, 221, 221); } .modal_ex-dialog { width: 90%; height: 100%; padding: 0; } .modal_ex-content, .modal_ex-body { height: 90%; border-radius: 0; } .font-14{ font-size: 14px; } .Avator{ width: 46px; height: 46px; /*border: 1px solid #ddd;*/ border-radius: 9% !important; } .cardlayout{ background: #FFFFFF; border: 0px solid transparent; border-radius: 2px !important; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.26); } .cardalert{ border: 0px solid transparent; border-radius: 0.5% !important; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); } .title-top-border{ border-top: 2px solid #1AD7BA; } .Main-color{ background: #4285F4; } .margin-right-5px{ margin-right: 5px; } .full-height{ height: 100%; } .textarea-share{ height: 95px; resize: none; width: 100%; border: 1px solid #B9BDC1; color: #797979; box-shadow: inset 0 2px 4px #BBB; -webkit-box-shadow: inset 0 2px 4px #BBB; -moz-box-shadow: inset 0 2px 4px #bbb; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 10px; } .topMinus30{ top:-30px !important; } /*-----------------------------------*/ /*----- Customising css styles -----*/ html, body { height: 100%; margin: 0px; /* font-family: segio rg !important; */ font-family: 'Manrope' !important; background-color: #ECEFF1; overflow: hidden; } @font-face { font-family: 'Manrope'; src: url(../font/Manrope-VariableFont_wght.ttf); } @font-face{ font-family: segio lt; src: url(/assets/font/SEGOEUIL.ttf); src: url(/assets/font/SEGOEUIL.eot); src: url(/assets/font/SEGOEUIL.woff); } @font-face{ font-family: segio rg; src: url(/assets/font/SEGOEUIRG.ttf); } @font-face{ font-family: segio bld; src: url(/assets/font/SEGOEUIB.ttf); } @font-face{ font-family: segio sl; src: url(/assets/font/1.ttf); } @font-face{ font-family: segio sb; src: url(/assets/font/SegoeUISemibold.ttf); } .header{ background-color: #3f51b5 !important; color: #FFFFFF; border-bottom: 0px !important; } .header .navbar-default .navbar-nav>.active>a, .header .navbar-default .navbar-nav>li>a:hover{ border-bottom: none !important; color: #CECECE !important; } .header .navbar-default .navbar-nav>li>a { padding: 9px 15px 9px 0px !important; margin-right: 25px !important; } /*--- top header logo left ----*/ .topbar{ display: none; } .header .navbar-brand{ top: 0 !important; } #logo-header{ width: 100% !important; height: auto !important; } .section{ padding-top: 50px !important; padding-bottom: 50px !important; } /*--- custom color styles ---*/ .no_bg{ background-color: transparent; } .bg_color_white{ background-color: #FFFFFF; } .bg_color_blue{ background-color: #3f51b5 !important; height: 100%; min-height: 100%; } .bg_color_lt_grey{ background-color: #EAEAEA !important; } .color_white{ color: white !important; } .color_blue{ color: #3f51b5 !important; } .color_skyblue{ color: #438eb9 !important; } .color_orange{ color: #FB8C00 !important; } .color_red{ color: #F44336 !important; } .fa-spin{ display: none !important; } /*------ custm button styles ------*/ .custm_btn_blue{ background-color: #3f51b5 !important; color: #FFFFFF !important; border-radius: 3px !important; font-size: 1.50rem !important; text-transform: uppercase; border-color: transparent !important; font-family: segio rg; } .custm_btn_grey{ background-color: #fafafa !important; border-radius: 3px !important; color: #90A4AE; text-transform: uppercase; border-color: #B0BEC5 !important; font-family: segio rg; } .custm_btn_orange{ background-color: #FB8C00 !important; color: #FFFFFF !important; border-radius: 3px !important; font-size: 1.50rem !important; text-transform: uppercase !important; border-color: transparent !important; } .custm_btn_orange:focus, .custm_btn_orange:hover, .custm_btn_orange:active, .custm_btn_orange.active, .custm_btn_orange.active:hover, .custm_btn_orange:active:hover{ background-color: #FB8C00 !important; border-color: transparent !important; outline: none !important; color: #FFFFFF !important; } .custm_btn_blue:focus, .custm_btn_blue:hover, .custm_btn_blue:active, .custm_btn_blue.active, .custm_btn_blue.active:hover, .custm_btn_blue:active:hover{ background-color: #3f51b5 !important; border-color: transparent !important; outline: none !important; color: #FFFFFF !important; } .custm_btn_outline_white{ background-color: transparent !important; color: #FFFFFF !important; outline: none !important; border: 1px solid silver !important; border-radius: 3px !important; padding: 0.50rem 1rem !important; } .custm_btn_outline_white:hover{ background-color: #FFFFFF !important; color: #000000 !important; } .custm_btn_outline_blue{ border: 1px solid #3f51b5; border-radius: 3px; padding: 0.50rem 1rem; outline: none; color: #3f51b5; } .custm_btn_outline_blue:hover, .custm_btn_outline_blue:focus, .custm_btn_outline_blue:active, .custm_btn_outline_blue.active{ border: 1px solid transparent; border-radius: 3px; padding: 0.50rem 1rem; outline: none; color: #FFFFFF !important; background-color: #3f51b5 !important; } /*----- Custom button class NEW -----*/ [class^="xs_btn_[disabled=disabled]"]:hover, [class*="xs_btn_"]:disabled:hover, [class^="sm_btn_[disabled=disabled]"]:hover, [class*="sm_btn_"]:disabled:hover, [class^="md_btn_[disabled=disabled]"]:hover, [class*="md_btn_"]:disabled:hover{ box-shadow: 0px 0px 0px 0px transparent; color: #FFFFFF; } [class^="xs_btn_"], [class*="xs_btn_"], [class^="xs_lbl_"], [class*="xs_lbl_"] { border-radius: 3px !important; padding: 2px 12px; font-size: 13px; line-height: 1.5; /* text-transform: capitalize !important; */ border: 1px solid; background-color: transparent; font-weight: normal; white-space: nowrap; vertical-align: baseline; z-index: 0 !important; margin: 2px 0; } [class^="xs_btn_"]:hover, [class*="xs_btn_"]:hover, [class^="xs_lbl_"]:hover, [class*="xs_lbl_"]:hover, [class^="xs_btn_"]:focus, [class*="xs_btn_"]:focus, [class^="xs_lbl_"]:focus, [class*="xs_lbl_"]:focus, [class^="xs_btn_"].active:focus, [class*="xs_btn_"].active:focus, [class^="xs_lbl_"].active:focus, [class*="xs_lbl_"].active:focus, [class^="xs_btn_"]:active:focus, [class*="xs_btn_"]:active:focus, [class^="xs_lbl_"]:active:focus, [class*="xs_lbl_"]:active:focus{ outline: none !important; outline-width: 0 !important; outline-style: none !important; outline-color: transparent !important; } .xs_btn_grey, .xs_btn_grey:hover, .xs_btn_grey:focus, .xs_btn_grey.active:hover, .xs_btn_grey:active:hover, .xs_btn_grey.active:focus, .xs_btn_grey:active:focus{ border-color: silver !important; color: #78909C !important; outline: none !important; outline-color: transparent; } .xs_btn_grey:hover, .xs_btn_grey:focus, .xs_btn_grey.active:hover, .xs_btn_grey:active:hover { box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: #90A4AE; outline-color: transparent; } .xs_btn_blue, .xs_btn_blue:hover, .xs_btn_blue:focus, .xs_btn_blue.active:hover, .xs_btn_blue:active:hover, .xs_btn_outline_blue:hover, .xs_btn_outline_blue:focus, .xs_btn_outline_blue.active:hover, .xs_btn_outline_blue:active:hover, .xs_btn_outline_blue.active:focus, .xs_btn_outline_blue:active:focus{ border-color: transparent !important; background-color: #3f51b5 !important; color: #FFFFFF !important; outline: none !important; font-weight: normal; outline-color: transparent; } .xs_btn_outline_blue{ background-color: transparent; color: #3f51b5 !important; border-color: #3f51b5; } .xs_btn_outline_blue >i { color: #3f51b5 !important; } .xs_btn_outline_blue:active >i, .xs_btn_outline_blue:hover >i, .xs_btn_outline_blue:focus >i{ color: #fff !important; } .xs_btn_blue:hover, .xs_btn_blue:focus, .xs_btn_blue.active:hover, .xs_btn_blue:active:hover, .xs_btn_blue.active:focus, .xs_btn_blue:active:focus { box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: #3f51b5; outline: none !important; outline-color: transparent; } .xs_btn_red{ background-color: #F44336 !important; border-color: transparent; color: #FFFFFF; font-weight: normal; } .xs_btn_outline_red{ border-color: #F44336; color: #F44336; font-weight: normal; } .xs_btn_red:hover, .xs_btn_red:focus, .xs_btn_red.active:hover, .xs_btn_red:active:hover, .xs_btn_red.active:focus, .xs_btn_red:active:focus { box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: #F44336; outline: none !important; color: #FFFFFF; outline-color: transparent; } .xs_btn_orange{ background-color: #FB8C00; color: #FFFFFF; outline: none; border-color: transparent; font-weight: normal; } .xs_btn_orange:hover, .xs_btn_orange:focus, .xs_btn_orange.active:hover, .xs_btn_orange:active:hover, .xs_btn_orange.active:focus, .xs_btn_orange:active:focus{ color: #FFFFFF; outline-color: transparent; } .xs_btn_outline_orange{ border-color: #FB8C00; color: #FB8C00 !important; } .xs_btn_outline_orange:hover, .xs_btn_outline_orange:focus, .xs_btn_outline_orange.active:hover, .xs_btn_outline_orange:active:hover, .xs_btn_outline_orange.active:focus, .xs_btn_outline_orange:active:focus { background-color: #FB8C00; box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: transparent; outline: none !important; color: #FFFFFF !important; outline-color: transparent; } .xs_btn_outline_orange:hover, .xs_btn_outline_orange:focus, .xs_btn_outline_orange.active:hover, .xs_btn_outline_orange:active:hover, .xs_btn_outline_orange.active:focus, .xs_btn_outline_orange:active:focus { background-color: #FB8C00; box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: transparent; outline: none !important; color: #FFFFFF; outline-color: transparent; } .xs_btn_outline_grey{ color: #78909C !important; border-color: #78909C !important; } .xs_btn_outline_grey:hover, .xs_btn_outline_grey:focus, .xs_btn_outline_grey.active:hover, .xs_btn_outline_grey:active:hover, .xs_btn_outline_grey.active:focus, .xs_btn_outline_grey:active:focus{ color: #FFFFFF; box-shadow: 0px 2px 2px 0px #9A9A9A; border-color: transparent; outline: none !important; outline-color: transparent; } /*------ custom button style end ------*/ /*------ custom label style ------*/ .xs_lbl_blue{ /* background-color: #3f51b5; color: #FFFFFF; border-color: transparent; */ color: #0D9BE1; background-color: #E2F3FB; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } .xs_lbl_grey{ background-color: silver; color: #EEEEEE; border-color: transparent; } .xs_lbl_red{ background-color: #F44336; color: #FFFFFF; border-color: transparent; } .xs_lbl_orange{ /* background-color: #FB8C00; color: #FFFFFF; border-color: transparent; */ color: #BF8012; background-color: #FDF3BF; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } .xs_lbl_outline_blue{ /* border-color: #3f51b5; color: #3f51b5; */ color: #469B1F; background-color: #E7FCBA; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } .xs_lbl_outline_grey{ /* border-color: silver; color: #78909C; */ color: #78909C; background-color: #eaeaea; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } .xs_lbl_outline_red{ /* border-color: #F44336; color: #F44336; */ color: #0D9BE1; background-color: #E2F3FB; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } .xs_lbl_outline_orange{ /* border-color: #FB8C00; color: #FB8C00; */ color: #BF8012; background-color: #FDF3BF; border-radius: 18px !important; font-weight: 600; font-size: 12px; border: none; padding: 4px 12px; } /*------ custom label style end ------*/ /*---- colors for title and description ----*/ .md_title{ color: #78909C; font-size: 13px; font-family: segio sb; position: relative; } .sm_title{ font-size: 13px; color: #78909C !important; } .title_txt{ color: #78909C; font-size: 15px; font-family: segio sb; } .lg_title{ font-family: segio sb; font-size: 16px; color:#0D9BE1; text-transform: uppercase; } .timing_text{ font-size: 12px; color: #B0BEC5; } /*--- borders ----*/ .border_btm{ border-bottom: 1px solid #EEEEEE; } .border_top{ border-top: 1px solid #EEEEEE; } .border{ border: 1px solid #EEEEEE; } /*--- fonts size and family ----*/ .font_8{ font-size: 8px !important; } .font_10{ font-size: 10px !important; } .font_11{ font-size: 11px !important; } .font_12{ font-size: 12px !important; } .font_13{ font-size: 13px !important; } .font_14{ font-size: 14px !important; } .font_15{ font-size: 15px !important; } .font_16{ font-size: 16px !important; } .font_17{ font-size: 17px !important; } .font_bold{ font-weight: bold; } .font_caps{ text-transform: uppercase !important; } .font_sb{ font-family: segio sb; } .font_rg{ font-family: segio rg; } .font_lt{ font-family: segio lt; } /*--- custom badge style ---*/ .badge{ border-radius: 2px; background-color: transparent; vertical-align: bottom; white-space: nowrap; } .badge_dot{ font-size: 14px !important; position: relative; top: 1px; } .badge_grey{ background-color: #EEEEEE; color: #78909C !important; } .badge_blue, .badge_orang> .badge_dot{ background-color: #3f51b5; color: #FFFFFF !important; } .badge_orange, .badge_orang> .badge_dot{ background-color: #FB8C00; color: #FFFFFF !important; } /*------ custom table style ------*/ .cstm_tbl{ width: 100%; } .cstm_tbl>thead, .cstm_tbl>tbody>tr{ border-bottom: 1px solid #E0E0E0; } .cstm_tbl>thead{ background-color: rgba(236, 239, 241, 0.5) !important; } .cstm_tbl>thead>tr>th{ /* font-family: segio sb; font-size: 13px; color: #78909C; */ } .cstm_tbl>tbody>tr>td{ /* font-size: 13px; color: #78909C; font-family: segio rg; */ } .cstm_tbl>thead>tr>th, .cstm_tbl>tbody>tr>td{ padding:10px 5px; } .cstm_tbl>tbody>tr:nth-last-child(1){ border-bottom: 0px solid transparent; } /*---- custm colors ----*/ .color_md_grey{ color: #9E9E9E !important; } .color_drk_grey{ color: #757575 !important; } .center{ text-align: center !important; text-align: -webkit-center !important; text-align: -moz-center !important; } .right{ text-align: right !important; text-align: -webkit-right !important; text-align: -moz-right !important; } .left{ text-align: left !important; text-align: -webkit-left !important; text-align: -moz-left !important; } .justify{ text-align: justify !important; text-align: -webkit-justify !important; text-align: -moz-justify !important; } a.fa:hover{ text-decoration: none !important; } /*---- Navigation menu and Navigation tab menu style ----*/ a:hover, a.active:hover, a:active:hover, a:focus{ text-decoration: none !important; outline: none !important; } a{ text-decoration: none; color: #78909C !important; } a.nav i { font-size: 17px; } .nav>li>a { padding: 10px 6px 5px 6px !important; } ul.suggestion-list{ padding: 3px 0; } ul.nav-tabs{ margin: 3px 0 15px 0 !important; } .nav-tabs>li{ margin-right: 3rem !important; position: relative; display: inline-block; float: inherit; } .nav-tabs>li>a{ color:#495973 !important; border: none !important; cursor: pointer !important; text-transform: uppercase; padding-bottom: 16px !important; } .nav-tabs>li>a:hover{ border-bottom: 0px solid transparent !important; color: #546e7a !important; background-color: transparent !important; } .nav-tabs>li.active>a, .nav-tabs>li:focus>a{ border-bottom: 3px solid #0D9BE1 !important; background-color: transparent !important; color: #091E42 !important; font-weight: 600; } span.notifctn_crcle{ width: 20px; height: 20px; background-color: #3f51b5; text-align: -webkit-center; border-radius: 50%; padding: 1px; font-size: 85% !Important; color: #ffffff; display: none; } h5.txt_center { position: relative !important; text-align: initial !important; } /*--- padding and margin styles ---*/ .no_padding{ padding: 0 !important; } .no_margin{ margin: 0 !important; } .no_shadow_colr{ box-shadow: 0 0 0 transparent, inset 0 0 0 transparent !important; border-color: #E0E0E0 !important; } .no_border{ border: 0px solid transparent !important; border-color: transparent !important; } .crsr_pointr{ cursor: pointer; } .v-align-middle{ vertical-align: middle !important; } .resp_img>img{ width: 100%; height: auto; } .trnsprnt, .trnsprnt:focus, .trnsprnt:hover, .trnsprnt.active:hover, .trnsprnt:active:hover .trnsprnt:active, .trnsprnt.active, .trnsprnt:active:focus, .trnsprnt.active:focus{ background-color: transparent; border: 0px solid transparent; outline: none; } .dflt_input{ border: 1px solid #D4D4D4; border-radius: 3px; background-color: transparent; background-image: none; outline: none; padding-left: 5px !important; padding-right: 5px !important; } .dflt_input_btm{ border: 0px solid transparent !important; border-bottom: 1px solid #CECECE !important; padding: 4px 5px !important; background-color: transparent; background-image: none; outline: none; } .dflt_input:focus, .dflt_input:hover, .dflt_input.active:hover .dflt_input:active:hover, .dflt_input:active:focus, .dflt_input.active:focus{ outline: none; border: 1px solid #D4D4D4; box-shadow: 0 0 0 transparent; } .pad_tp_2{ padding-top: 2px !important; } .pad_tp_3{ padding-top: 3px !important; } .pad_tp_5{ padding-top: 5px !important; } .pad_tp_8{ padding-top: 8px !important; } .pad_tp_10{ padding-top: 10px !important; } .pad_tp_15{ padding-top: 15px !important; } .pad_tp_20{ padding-top: 20px !important; } .pad_tp_50{ padding-top: 50px !important; } .pad_tp_btm_3{ padding-top: 3px !important; padding-bottom: 3px !important; } .pad_tp_btm_5{ padding-top: 5px !important; padding-bottom: 5px !important; } .pad_tp_btm_8{ padding-top: 8px !important; padding-bottom: 8px !important; } .pad_tp_btm_10{ padding-top: 10px !important; padding-bottom: 10px !important; } .pad_tp_btm_15{ padding-top: 15px !important; padding-bottom: 15px !important; } .pad_tp_btm_20{ padding-top: 20px !important; padding-bottom: 20px !important; } .pad_tp_btm_90{ padding-top: 90px !important; padding-bottom: 90px !important; } .pad_5{ padding: 5px !important; } .pad_10{ padding: 10px !important; } .pad_15{ padding: 15px !important; } .pad_25{ padding: 25px !important; } .pad_left_right_5{ padding-left: 5px !important; padding-right: 5px !important; } .pad_left_right_10{ padding-left: 10px !important; padding-right: 10px !important; } .pad_left_right_15{ padding-left: 15px !important; padding-right: 15px !important; } .pad_left_right_30{ padding-left: 30px !important; padding-right: 30px !important; } .pad_left_5{ padding-left: 5px !important; } .pad_left_7{ padding-left: 7px !important; } .pad_left_10{ padding-left: 10px !important; } .pad_left_15{ padding-left: 15px !important; } .pad_right_5{ padding-right: 5px !important; } .pad_right_10{ padding-right: 10px !important; } .pad_right_15{ padding-right: 15px !important; } .pad_btm_0{ padding-bottom:0px !important; } .pad_btm_3{ padding-bottom: 3px !important; } .pad_btm_5{ padding-bottom: 5px !important; } .pad_btm_10{ padding-bottom: 10px !important; } .pad_btm_15{ padding-bottom: 15px !important; } .pad_btm_20{ padding-bottom: 20px !important; } .pad_btm_25{ padding-bottom: 25px !important; } .pad_left_10{ padding-left: 10px !important; } .margin_tp_5{ margin-top: 5px !important; } .margin_tp_10{ margin-top: 10px !important; } .margin_tp_15{ margin-top: 15px !important; } .margin_tp_20{ margin-top: 15px !important; } .margin_top_20 { margin-top: 20px !important; } .margin_tp_70{ margin-top: 70px; } .margin_tp_110{ margin-top: 110px; } .margin_btm_5{ margin-bottom: 5px !important; } .margin_btm_10{ margin-bottom: 10px !important; } .margin_btm_15{ margin-bottom: 15px !important; } .margin_btm_20{ margin-bottom: 20px !important; } .margin_tp_btm_5{ margin-top: 5px !important; margin-bottom: 5px !important; } .margin_tp_btm_8{ margin-top: 8px !important; margin-bottom: 8px !important; } .margin_tp_btm_10{ margin-top: 10px !important; margin-bottom: 10px !important; } .margin_tp_btm_15{ margin-top: 15px !important; margin-bottom: 15px !important; } .margin_tp_btm_30{ margin-top: 30px !important; } .margin_right_2{ margin-right: 2px !important; } .margin_right_5{ margin-right: 5px !important; } .margin_right_10{ margin-right: 10px !important; } .margin_left_5{ margin-left: 5px !important; } .offest_margin_17{ margin: 0 17% !important; } /*--- min and max height for login and signup content ---*/ .min_max_height{ min-height: 620px !important; max-height: 750px !important; } .bg_cover{ background-image: url("/assets/img/mob_bg.png"); background-repeat: no-repeat; background-size: cover; background-color: transparent; background-position: 50% 100%; } /* Floating links for Title & Apple nd Android*/ .dwnld_links { position: absolute !important; top: 85% !important; } .dwnld_links > .fa{ font-size: 2.25rem !important; } a.fa.fa-apple{ padding-right: 10px !important; } a.fa.fa-android{ padding-left: 10px !important; } .dwnld_links2{ position: absolute !important; top: 9% !important; } /*---- input styles ------*/ .btn.active, .btn:active{ -webkit-box-shadow: inset 0 0 0 rgba(0,0,0,0) !important; box-shadow: inset 0 0 0 rgba(0,0,0,0) !important; } .btn-group-vertical>.btn, .btn-group>.btn{ float: none !important; } /*------ custom alerts ------*/ .alert-info { color: #3f51b5 !important; background-color: white !important; border: 1px solid #3f51b5 !important; border-radius: 2px !important; } .alert-warning, .alert_danger{ color: #FB8C00 !important; border-radius: 2px !important; background-color: white !important; border: 1px solid #FB8C00 !important; } /*---- toast errors ----*/ .toast-info:hover, .toast-warning:hover, .toast-danger:hover{ box-shadow: 0 0 0 transparent !important; } .toast-warning{ background-color: #FB8C00 !important; box-shadow: 0 0 0 transparent !important; } .toast-danger{ background-color: #F44336 !important; box-shadow: 0 0 0 transparent !important; } .toast-info{ background-color: #3f51b5 !important; box-shadow: 0 0 0 transparent !important; } /*----- input styles by custom ----*/ .abs label, label.pass_req{ position: absolute !important; transition: 0.2s ease-out !important; left: 0rem !important; top: 0 !important; font-weight: normal !important; font-size: 1.35rem !important; color: #9E9E9E !important; font-family: segio rg !important; letter-spacing: 0.025rem !important; } .abs label{ -webkit-transition: ease-out 0.25s !important; -moz-transition: ease-out 0.25s !important; transition: ease-out 0.25s !important; } .abs input, input.form-input{ border: 0px solid transparent !important; outline: none !important; background-color: transparent !important; width: 100% !important; padding: 7px 0 !important; } .ht{ height: 6.5rem !important; margin-bottom: 10px !important; } .abs{ position: absolute !important; bottom: 0 !important; } label.chck{ position: relative !important; top: -2px !important; left: 2px !important; } /*---- input design -----*/ .form-input:not([type]):focus:not([readonly])+label, .form-input[type=text]:focus:not([readonly])+label, .form-input[type=password]:focus:not([readonly])+label, .form-input[type=email]:focus:not([readonly])+label { color: #3f51b5 !important; font-size: 1.15rem !important; } .form-input[type=text]:focus, .form-input[type=password]:focus, .form-input[type=email]:focus, .form-input[type=url]:focus, .form-input[type=date]:focus, .form-input[type=time]:focus, .form-input[type=text]:valid, .form-input[type=password]:valid, .form-input[type=email]:valid, .form-input[type=url]:valid, .form-input[type=date]:valid, .form-input[type=time]:valid { border-bottom: 1px solid #3f51b5 !important; box-shadow: 0 1px 0 #3f51b5 !important; } .form-input[type=text]:focus ~ label, .form-input[type=password]:focus ~ label, .form-input[type=email]:focus ~ label, .form-input[type=url]:focus ~ label, .form-input[type=date]:focus ~ label, .form-input[type=time]:focus ~ label { -webkit-transform: translateY(-20px) !important; -moz-transform: translateY(-20px) !important; transform: translateY(-20px) !important; -webkit-transition: ease-in-out 0.25s !important; -moz-transition: ease-in-out 0.25s !important; transition: ease-in-out 0.25s !important; } input[type=Checkbox], input[type=Checkbox]:focus, input[type=Checkbox]:hover{ width: auto !important; outline: none !important; outline-color: transparent !important; outline-width: 0px !important; outline-offset: 0px !important; outline-style: none !important; box-shadow: 0 0 0 transparent !important; } .form-input.ng-pristine ~ label{ -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; transform: translateY(0) !important; } .form-input.ng-valid ~ label , .form-input.ng-dirty ~ label{ -webkit-transform: translateY(-20px) !important; -moz-transform: translateY(-20px) !important; transform: translateY(-20px) !important; color: #3f51b5 !important; font-size: 1.15rem !important; } .form-input.ng-dirty{ border-bottom: 2px solid #D32F2F !important; box-shadow: 0 0 0 !important; } .form-input.ng-pristine{ border-bottom: 1px solid #9E9E9E !important; box-shadow: 0px 0px 0px; } span.error{ color: #D32F2F !important; position: absolute !important; left: 0 !important; top: 103% !important; font-size: 1.15rem !important; } span.pwdReq{ top: 37% !important; } .hv_pwd{ padding-top: 15px !important; position: relative !important; } /*---- input styule design end -----*/ /*----- password request -----*/ input.pass_req{ padding-left: 25px !important; } label.pass_req{ left: 2.2rem !important; } .prev_input_icon{ position: absolute; top: 10px; margin: 0; padding: 0; font-size: 1.55rem; } /*---- Button design for PARENT and STUDENT ----*/ label.cstm_btn{ position: relative !important; padding: 0 !important; color: #757575 !important; } label.custm_btn_grey{ padding: 0.40rem 1.25rem !important; border-radius: 3px !important; border: 1px solid #BBBBBB !important; font-size: 1.2rem !important; margin: .50rem 0.95rem .50rem 0.95rem !important; text-transform: uppercase !important; } label.custm_btn_grey.typeactive.active { background-color: #3f51b5 !important; color: #FFFFFF !important; } .navbar-brand > img{ width: 100% !important; height: auto !important; transform: scale(0.7) !important; -webkit-transform: scale(0.7) !important; -moz-transform: scale(0.7) !important; } .navbar-brand{ height: auto !important; } /*----- Footer style ------*/ .footer{ background-color: #ECEFF1 !important; } address{ margin: 5px 0 !important; font-size: 1.25rem; color: #9E9E9E; } /*---- Forgot password styles -----*/ h3.frgt_title{ font-size: 1.6rem !important; } /*---- Authentication Error design ----*/ .error_content{ border: 1px solid #F44336 !important; background-color: transparent; color: #F44336 !important; border-radius: 3px; } .login-error { padding: 0px 13px 0px 13px !important; } .login_error_content { color: #D32F2F !important; background-color: #EAEAEA !important; box-shadow: 0px 0px 0px 1px #BDBDBD !important; } /*--- modal content border-radius ---*/ .modal-content{ border-radius: 3px !important; } /*----- group image styles ------*/ .hover_img{ background-color: transparent; padding: 10px; text-align: -webkit-center; position: relative; display: inline-block; z-index: 2; cursor: pointer; } .resp_grp_img{ height:125.25px; } .ih-item.circle.colored.effect10.top_to_bottom { margin: 0 0px !important; padding: 0px 0 0 0 !important; height: auto !important; } .ih-item.circle.effect10.top_to_bottom a:hover .img{ -webkit-transform: translateY(60px) scale(0.5); -moz-transform: translateY(60px) scale(0.5); -ms-transform: translateY(60px) scale(0.5); -o-transform: translateY(60px) scale(0.5); transform: translateY(60px) scale(0.5); } .ih-item.circle { width: 100% !important; display: inline-block !important; } .ih-item.circle .img { width: 100% !important; height: 100% !important; } .ih-item.circle.effect10.top_to_bottom .info h3 { padding: 20px 5px 0 5px !important; height: auto !important; border-bottom: 1px solid #FFFFFF; } .ih-item.circle .img:before{ box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.6), 0 1px 2px rgba(0, 0, 0, 0.3); } /*----- hide contents in large device ------*/ .show_logo{ display: none !important; background-color: #3f51b5 !important; } /*---- custom spinner for ------*/ /*.camu_spin{ position: relative; -webkit-animation: camu_spin infinite 0.5s; animation: camu_spin infinite 0.5s; } @-webkit-keyframes camu_spin { from {transform: rotate(0deg);} to {transform: rotate(360deg);} } @keyframes camu_spin { from {transform: rotate(0deg);} to {transform: rotate(360deg);} }*/ /*---- responsive styles ----*/ /*---- responsive group image ----*/ @media (max-width: 2000px){ .resp_grp_img{ height: 175.25px !important; } } @media (min-width: 992px) and (max-width: 1199px){ .resp_grp_img{ height: 142.766px !important; } .logo_left{ margin-left: -15px !important; } } @media (min-width: 768px) and (max-width: 991px){ .resp_grp_img{ height: 160px !important; } } @media (min-width: 600px) and (max-width: 767px){ .hover_img{ max-width: 35% !important; margin: 0 7% !important; } } /*---- navbar and offset for login page ----*/ @media (max-width: 999px){ .navbar-collapse{ border-top: 0px !important; box-shadow: inset 0 0 0 rgba(255,255,255,0) !important; } } @media (max-width: 991px){ .cstm-sm-offset{ margin: 5% 5% !important; } } @media (min-width: 992px){ .login_error_content { margin: 1% 23.5% !important; } .resp_hide_menu{ display: block !important; position: relative; } .logo_left{ margin-left: -17px; } } @media (min-width: 768px) and (max-width: 991px){ .resp_error{ width: 92% !important; margin: 0 5% !important; } .resp_hide_menu{ position: fixed; display: inline-block; top: 88px; left: 0; z-index: 1002; width: 30%; height: 100%; overflow-x:hidden; overflow-y:hidden; transition: all 0.3s linear; -webkit-transition: all 0.3s linear; box-shadow: -7px 35px 25px 4px #b4b4b4; } .resp_hide_menu.ng-hide{ transition: all 0.3s linear; -webkit-transition: all 0.3s linear; left: -25%; } .resp_hide_menu:hover{ overflow-y:auto !important; } .resp_hide_menu_inner{ background-color: #fafbfc; } .lm_nav_menu.left_menu>li>a>i, .lm_nav_menu.left_menu>li>a>span{ color:#495973; } /* .left_menu li:hover, .left_menu li.active:hover, .left_menu li:active:hover, .left_menu li:focus{ background-color: #757575 !important; } */ li.lm-active>a>span.ho, li.lm-active>a>i{ color: #0d9be1 !important; } .menu-left_scroll { overflow: auto !important; } } @media (max-width: 767px){ .resp_hide_menu{ position: relative; z-index: 0; background-color: transparent; width: auto; } .resp_container{ padding-top: 20px; } .resp_menu_btn{ display: block !important; } } @media (min-width: 320px) and (max-width: 991px){ .clickToggle{ display: block !important; } } @media (min-width: 320px) and (max-width: 700px){ .clickToggle{ font-size: 100% !important; } } /*--- responvie hide content for tablets ----*/ @media (max-width: 768px){ .resp_hide{ display: none !important; } .resp_show{ width: 80% !important; margin: 0 10% !important; padding-top: 0 !important; } .show_logo{ display: block !important; } .resp_error{ margin: 0% 13.5% !important; } } @media (max-width: 767px){ span.pwdReq{ top: 35% !important; } } @media (max-width: 600px){ .nav-tabs>li>a{ font-size: 1.2rem !important } } /*----------- login page height correction ------------*/ @media (min-width: 770px) and (max-width: 1198px){ .min_max_height{ min-height: 640px !important; } } /*---- Password request button style for small mobile devices --------*/ @media (min-width: 320px) and (max-width: 480px){ .resp_width{ width: 90% !important; margin: 0 5% !important; } .resp_button{ top: 8% !important; position: absolute !important; right: 0 !important; } } @media (max-width: 375px){ .resp_button{ top: 17% !important; position: absolute !important; right: 0 !important; } } @media (min-width: 320px) and (max-width: 490px){ .resp_check{ top: 15px !important; position: relative; } } /*------ Resposinve logout button style at header -----*/ @media (min-width: 320px) and (max-width: 767px){ .resp_logout{ display: block !important; position: fixed; top: 0; right: 25px; } .resp_logout>ul{ margin: 0; } .resp_logout>ul>li.open>span{ float: right; } .resp_logout>ul>li.open>ul.dropdown-menu{ top:45px; position: absolute; right: 0; padding: 0; box-shadow: 0px 3px 11px 3px #CFD8DC; } .resp_logout_dropdown{ background-color: #FFFFFF; } } /*---- Req Password for large scale devices --------*/ @media (min-width: 1024px){ .offest_margin_17{ margin: 0 30% !important; } } .navbar-default { background-color: #3f51b5 !important; border-color:transparent !important; border-radius: 0px; z-index: 6 !important; max-height: 52px; } /*----- back button and title at less than 768 -----*/ @media (max-width: 767px){ .resp_bck_btn{ width: 5%; float: left; display: inline-block; } .resp_title{ width: 95%; display: inline-block; } .resp_pd_tp_5{ padding-top: 5px !important; } .resp_menu_btn{ display: block !important; } .sm_resp_right{ text-align: right !important; text-align: -webkit-right !important; } .sm_resp_left{ text-align: left !important; text-align: -webkit-left !important; } .sm_resp_pad_tp_10{ padding-top:10px !important; } } /*------- group image section -------*/ @media (min-width: 768px) and (max-width: 991px){ .hover_img{ padding:30px; } } @media (min-width: 600px) and (max-width: 767px){ .hover_img{ padding:10px; } } /*------ logo image correction -------*/ @media (min-width: 1200px){ #logo-header{ margin-left: -15px; } } /*--- End of Customising Css Style ----*/ /*GENERAL UTILS*/ .break-word{ word-wrap:break-word !important; } /* centered columns styles */ .inline-block{ display: inline-block; } .pos-absolute{ position: absolute; } .ovrflow-y-auto{ overflow-y: auto; } /*GENERAL UTILS ENDS*/ /*BOOTSTRAP OVERRIDING CSS*/ .btn-primary.focus, .btn-primary:focus { color: #fff; background-color: #3f51b5; border-color: #122b40; } .btn-group-xs>.btn, .btn-xs { padding: 1px 5px; font-size: 12px; line-height: 1.5; border-radius: 1px; } .btn-primary.active, .btn-primary:active, .open>.dropdown-toggle.btn-primary { color: #fff; background-color: #6666CB; border-color: #D0D3D6; } .circles-wrp{ color: #0D9BE1 !important } /*BOOTSTRAP OVERRIDING CSS*/ .bg300_color{ color: #90a4ae; } .bg500_color{ color: #607D8B; } .bg400_color{ color: #78909c; } .orange500_color{ color:#Ff9800 !important; } .profile-active_status .custm_label_success { background-color: #E7FCBA !important; border-radius: 12px; color: #469B1F; font-weight: 600; /* padding: 4px 10px; */ } .profile-active_status .custm_label_wrng { background-color: #FEF1F3 !important; border-radius: 12px; color: #F24B6B; font-weight: 600; /* padding: 4px 10px; */ } .profile-active_status .custm_label_info { background-color: #ECF5FE !important; border-radius: 12px; color: #0D9BE1; font-weight: 600; /* padding: 4px 10px; */ } .profile-active_status .custm_label_ylow { background-color: #FDF3BF !important; border-radius: 12px; color: #BF8012; font-weight: 600; /* padding: 4px 10px; */ } .font_16_sb{ font-size: 16px; font-family: segio sb; } .font_14_sb{ font-size: 14px; font-family: segio sb; } .font_14_rg{ font-size: 14px; font-family: segio rg; } .font_12_sb{ font-size: 12px; font-family: segio sb; } .font_14_lt{ font-family: segio lt; } ul.nav-tabs{ margin: 3px 0 15px 0 !important; } .font_15_sb{ font-family: segio sb; font-size: 15px; } .batch_tag{ border-radius: 5%; vertical-align: bottom; white-space: nowrap; } .xs_hov_fill_blue:hover , .xs_hov_fill_blue.active, .xs_hov_fill_blue:active, .xs_hov_fill_blue:focus{ background-color: #0D9BE1 !important; border-color: transparent !important; color: #FFF !important; } .xs_hov_fill_red:hover{ background-color: #F44336 !important; border-color: transparent !important; color: #FFF !important; } .xs_hov_fill_orange:hover{ background-color: #FB8C00 !important; border-color: transparent !important; color: #FFF !important; } .xs_hov_fill_grey:hover{ color: #FFFFFF !important; background-color: #90A4AE; border-color: transparent !important; } /*------- responsive menu hide and show using js addclass ------*/ .show_hide_menu{ display: block !important; background-color: rgba(0, 0, 0, 0.75); position: absolute; color: #fff !important; z-index: 999; top: -18px; width: 25%; left: 0; } .hide_show_menu{ display: none !important; } /*---- ajax loader style -----*/ .loader{ width:100%; height:3px; background-color:#B0BEC5; position: fixed; top: 88px; z-index: 99; } .loader::after { width: 100%; height: 4px; content:''; display: block; margin: auto; position :relative; animation-name: load; animation-iteration-count: infinite; animation-direction: alternate-reverse; animation-duration: 2.5s; -webkit-animation-name: load; -webkit-animation-iteration-count: infinite; -webkit-animation-direction: alternate-reverse; -webkit-animation-duration: 2.5s; } @keyframes load { 0% { width:100%; background-color:#45c0fd; } 50% { width:0px; background-color:#0D9BE1; } 50.1% { width:0px; background-color:#45c0fd; } 100% { width:100%; background-color:#0D9BE1; } } @-webkit-keyframes load { 0% { width:100%; background-color:#45c0fd; } 50% { width:0px; background-color:#0D9BE1; } 50.1% { width:0px; background-color:#45c0fd; } 100% { width:100%; background-color:#0D9BE1; } } #slimScrlBar::-webkit-scrollbar { width: 6px; background-color: #F5F5F5; } #slimScrlBar::-webkit-scrollbar-thumb { cursor: pointer; border-radius: 2px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3); background-color: #BDBDBD; } .txt_no_wrap_and_hide{ text-overflow: ellipsis; overflow: hidden; white-space: nowrap; } .xs_btn_wgt_blue{ color: #FFFFFF; background-color: #3F51B5; font-weight: 600; font-size: 14px; padding: 2px 16px 2px 16px !important; border-right: 4px!important; } .xs_btn_blue_outline{ color: #3F51B5!important; background-color: transparent; font-weight: 600; font-size: 14px; padding: 2px 16px 2px 16px !important; background: #FFFFFF; border: 1px solid #3F51B5; box-sizing: border-box; border-radius: 4px!important; margin: 0px!important; } .preEnLstHd{ font-weight: 600; line-height: 150%; font-style: normal; } .fnt_sz_13{ font-size: 13px; } .fnt_sz_14{ font-size: 14px; } .fnt_sz_18{ font-size: 18px; } .fnt_wgt_600{ font-weight: 600; } .fnt_wgt_350{ font-weight: 350!important; } .txt_rght{ text-align: right; } .txt_left{ text-align: left; } .bor1px{ border: 1px solid #EEEEEE; } .col_1C1C28{ color: #1C1C28; } .col_555770{ color: #555770; } .pad_top_0{ padding-top: 0px!important; } .pad_left_8{ padding-left: 8px!important; } .pad_right_8{ padding-right: 8px!important; } .pad_bot_8{ padding-bottom: 8px!important; } .mar_left_right_8{ margin-left: 8px!important; margin-right: 8px!important; } .pad_top_12{ padding-top: 12px!important; } .pad_bot_12{ padding-bottom: 12px!important; } .pad_top_16{ padding-top: 16px!important; } .pad_bot_32{ padding-bottom: 32px!important; } .pad_left_right_8{ padding-left: 8px!important; padding-right: 8px!important; } .pad_top_bot_8{ padding-top: 8px!important; padding-bottom: 8px!important; } .pad_left_right_16{ padding-left: 16px!important; padding-right: 16px!important; } .pad_bot_16{ padding-bottom: 16px!important; } .pad_bot_24{ padding-bottom: 24px!important; } .pad_top_24{ padding-top: 24px!important; } .pad_left_24{ padding-left: 24px!important; } .pad_right_24{ padding-right: 24px!important; } .mar_top_4{ margin-top: 4px!important; } .mar_top_8{ margin-top: 8px!important; } .mar_top_16{ margin-top: 16px!important; } .mar_right_9{ margin-right: 9px; } .mar_left_16{ margin-left: 16px!important; } .mar_bot_16{ margin-bottom: 16px!important; } .mar_right_16{ margin-right: 16px!important; } .mar_top_45{ margin-top: 45px; } .fnt_wgt_nor{ font-weight: normal; } /* ------------------------------------------ Custom Online Application Form CSS - Start ----------------------------------------------- */ /* Form Buttons */ .online-application .form-primary-btn { background-color: #0D9BE1; border: 1px solid #0D9BE1; border-radius: 4px; color: #fff; cursor: pointer; font-size: 14px; height: 40px; margin-left: 5px; outline: none !important; padding: 8px 16px; } .online-application .form-primary-btn:hover { background-color: #0D9BE1; } .online-application .form-secondary-btn { background-color: #fff; border: 1px solid #9B9BAA; border-radius: 4px; color: #555770; cursor: pointer; font-size: 14px; height: 40px; margin-left: 5px; outline: none !important; padding: 8px 16px; } .online-application .form-secondary-btn:hover { background-color: #f7f7f7; color: #555770; } .online-application .form-tertiary-btn { background-color: transparent !important; border: none !important; color: #3F51B5; cursor: pointer; font-size: 14px; font-weight: 600; height: 40px; margin-right: 5px; outline: none !important; padding: 8px 16px; } .online-application .form-tertiary-btn:hover { color: #324192; } /* Custom-Input styles */ .online-application input[type=number], .mycamu-v1-style input[type=number] { border-radius: 4px !important; } .online-application input[type=checkbox], .mycamu-v1-style input[type=checkbox] { cursor: pointer; } .online-application input[type=text], .online-application input[type=number]:not(.ngPagerCurrent), .online-application input[type=search], .online-application input[type=email], .online-application select, .online-application .select2-selection, .mycamu-v1-style input[type=text], .mycamu-v1-style input[type=number]:not(.ngPagerCurrent), .mycamu-v1-style input[type=search], .mycamu-v1-style input[type=email], .mycamu-v1-style select, .mycamu-v1-style .select2-selection { background-color: #F7F9FC !important; border: 1px solid #C5CEE0 !important; border-radius: 4px !important; color: #222B45 !important; height: 40px !important; padding-left: 10px; transition: 0.3s ease; width: 100%; } .online-application select option, .mycamu-v1-style select option { color: #222B45 !important; } .online-application .select2-selection, .mycamu-v1-style .select2-selection { cursor: pointer; } .online-application textarea, .mycamu-v1-style textarea { background-color: #F7F9FC !important; border: 1px solid #C5CEE0 !important; border-radius: 4px !important; color: #222B45 !important; padding-left: 10px; min-height: 85px; max-width: 100%; transition: 0.3s ease; } .online-application .select2-selection__rendered, .mycamu-v1-style .select2-selection__rendered { color: #222B45 !important; font-size: 14px; line-height: 38px !important; padding: 0px !important; } .online-application select:invalid ~ .select2-container .select2-selection__rendered, .online-application select[value=""] ~ .select2-container .select2-selection__rendered, .mycamu-v1-style select:invalid ~ .select2-container .select2-selection__rendered, .mycamu-v1-style select[value=""] ~ .select2-container .select2-selection__rendered { color: #8F9BB3 !important; } .online-application .select2-selection__arrow, .mycamu-v1-style .select2-selection__arrow { color: #8F9BB3 !important; } .online-application input[type=text]:focus, .online-application input[type=number]:focus, .online-application input[type=search]:focus, .online-application input[type=email]:focus, .online-application select:focus, .online-application textarea:focus, .online-application .select2-selection:focus, .mycamu-v1-style input[type=text]:focus, .mycamu-v1-style input[type=number]:focus, .mycamu-v1-style input[type=search]:focus, .mycamu-v1-style input[type=email]:focus, .mycamu-v1-style select:focus, .mycamu-v1-style textarea:focus, .mycamu-v1-style .select2-selection:focus { outline-color: #3F51B5 !important; } .online-application input[type=text]::placeholder, .online-application input[type=number]::placeholder, .online-application input[type=search]::placeholder, .online-application input[type=email]::placeholder, .online-application select::placeholder, .online-application textarea::placeholder, .online-application select:invalid, .online-application select[value=""], .online-application select option[value=""], .online-application .select2-selection::placeholder, .mycamu-v1-style input[type=text]::placeholder, .mycamu-v1-style input[type=number]::placeholder, .mycamu-v1-style input[type=search]::placeholder, .mycamu-v1-style input[type=email]::placeholder, .mycamu-v1-style select::placeholder, .mycamu-v1-style textarea::placeholder, .mycamu-v1-style select:invalid, .mycamu-v1-style select[value=""], .mycamu-v1-style select option[value=""], .mycamu-v1-style .select2-selection::placeholder { color: #8F9BB3 !important; } .online-application input[type=text]:disabled, .online-application input[type=number]:disabled, .online-application input[type=search]:disabled, .online-application input[type=email]:disabled, .online-application select:disabled, .online-application textarea:disabled, .online-application input[type=text]:read-only, .online-application input[type=number]:read-only,.online-application input[type=search]:read-only,.online-application input[type=email]:read-only,.online-application textarea:read-only, .online-application .select2-selection:disabled, .online-application .select2-container--disabled .select2-selection, .mycamu-v1-style input[type=text]:disabled, .mycamu-v1-style input[type=number]:disabled, .mycamu-v1-style input[type=search]:disabled, .mycamu-v1-style input[type=email]:disabled, .mycamu-v1-style select:disabled, .mycamu-v1-style textarea:disabled, .mycamu-v1-style input[type=text]:read-only, .mycamu-v1-style input[type=number]:read-only,.mycamu-v1-style input[type=search]:read-only,.mycamu-v1-style input[type=email]:read-only,.mycamu-v1-style textarea:read-only, .mycamu-v1-style .select2-selection:disabled, .mycamu-v1-style .select2-container--disabled .select2-selection { background-color: #E4E9F2 !important; border: 1px solid transparent !important; color: #8F9BB3 !important; cursor: not-allowed !important; } /* Select2-Input style */ .online-application .select2-container, .mycamu-v1-style .select2-container { text-align: left !important; width: 100% !important; border-radius: 4px !important; } .online-application .select2-selection, .mycamu-v1-style .select2-selection { background-color: #fff; border: 1px solid #d5d5d5 !important; height: 40px !important; } .online-application .select2-selection__rendered, .mycamu-v1-style .select2-selection__rendered { color: #858585 !important; line-height: 33px !important; font-size: 14px !important; } .online-application .select2-search:after, .mycamu-v1-style .select2-search:after { position: absolute; top: 3%; left: 92%; } .online-application .select2-dropdown, .mycamu-v1-style .select2-dropdown { width: 25% !important; } .online-application .select2-container--default .select2-selection--single .select2-selection__arrow, .mycamu-v1-style .select2-container--default .select2-selection--single .select2-selection__arrow { height: 28px; } .online-application .select2-results ::-webkit-scrollbar, .mycamu-v1-style .select2-results ::-webkit-scrollbar { height: 4px; width: 6px; } .online-application .select2-results ::-webkit-scrollbar-track, .mycamu-v1-style .select2-results ::-webkit-scrollbar-track { background: #e0e0e0; border-radius: 10px; border: 3.5px solid white; background-clip: content-box; } .online-application .select2-results ::-webkit-scrollbar-thumb, .mycamu-v1-style .select2-results ::-webkit-scrollbar-thumb { background: #c0c0c0; border-radius: 10px; } .online-application .select2-results ::-webkit-scrollbar-thumb:hover, .mycamu-v1-style .select2-results ::-webkit-scrollbar-thumb:hover { background: #d0d0d0; } /*Radio button*/ .online-application input[type=radio] { position: relative; cursor: pointer; top: 3px; height: 16px; width: 16px; margin-right: 5px; -webkit-transition: .4s !important; transition: .4s !important; } .online-application input[type=radio]:disabled { border: none !important; cursor: not-allowed; } .online-application .cardlayout { border-radius: 0px !important; box-shadow: none !important; /* margin-bottom: 4%; */ } .online-application .card-head { color: #2E2E3D; font-size: 16px; font-weight: 600; padding: 12px 15px; text-transform: uppercase; } .online-application .card-initial { border: 1px solid #9B9BAA; border-radius: 4px; color: #2E2E3D; padding: 15px 25px; } /* back page arrow */ .online-application .backPage { border-radius: 50%; padding: 6px 7px 6px 6px; transition: 0.3s ease; } .online-application .backPage:hover { background-color: rgba(143, 155, 179, 0.16) !important; border-radius: 50% !important; cursor: pointer; } /* Icons */ .online-application .deleteIcon { color: #9B9BAA; cursor: pointer; font-size: 18px; } .online-application .deleteIcon:hover { color: #FF5722; } .online-application .form-group { margin-bottom: 30px; } .online-application .noPad { padding: 0%; } .online-application .padLeft5 { padding-left: 5px; } .online-application .padRight5 { padding-right: 5px; } .online-application .handCursor { cursor: pointer; } .online-application .vertAlignMiddle { vertical-align: middle !important; } .online-application label { font-weight: 400; } .online-application .fieldHead { font-weight: 600; } /* Side Form Nav */ .online-application #sideNav { border-right: 1px solid #EEEEEE; } .online-application #sideNav > .nav-tabs { border-bottom: 0; float: none; list-style: none; padding-left: 15px; } .online-application #sideNav > .nav-tabs > li { display: block; font-size: 14px; float: none; margin: 4px 0 !important; } .online-application #sideNav > .nav-tabs > li > a { color: #555770 !important; font-family: inherit; margin: 0; padding: 8px 8px 8px 16px !important; text-transform: none; } /* , .online-application #sideNav > .nav-tabs > li:hover:not(a[data-toggle="false"]) */ .online-application #sideNav > .nav-tabs > li:hover:not([disabled]) { background-color: #607D8B; border-radius: 4px; cursor: pointer; font-weight: 600; } .online-application #sideNav > .nav-tabs > li > a[data-toggle="false"] { color: #555770 !important; cursor: default; } .online-application #sideNav > .nav-tabs > li > a[data-toggle="false"]:hover{ color:#fff !important; } .online-application #sideNav > .nav-tabs > li.active > a, .nav-tabs > li:focus > a { background-color: #0D9BE1 !important; border: none !important; border-radius: 4px; color: #ffffff !important; font-weight: 600; } /* Appln form layout */ .online-application #applnForm { border-left: 1px solid #EEEEEE; } .online-application .tab-pane { padding: 0; } .online-application .formFooter { padding: 14px 15px 22px; border-top: 1px solid #EEEEEE; } .online-application .instruction ol li { line-height: 1.6; } .online-application .instrctnHdr { background-color: #E1E1E1; font-weight: 600; margin-left: -14px; margin-right: -14px; padding: 10px 14px; } .online-application .instrctnContent { height: 400px; overflow: auto; } .online-application .formHead { color: #091E42; font-weight: 600; margin: 20px 0 16px; } .online-application .subPanel { padding: 0 15px 3% 15px !important; } .online-application .table { border: 1px solid #EEEEEE; border-radius: 4px !important; } .online-application .table thead { background-color: #F5F7F8; } .online-application .table thead th { color: #555770; } .online-application .table > thead > tr > th { border: 0 !important; } .online-application .photoUpldView { border: 1px solid #EEEEEE; width: 100px; } .online-application .helpText { color: #555770; font-size: 13px !important; font-weight: 400 !important; padding-top: 6px; } .online-application .helpTextLabel { color: #555770; font-size: 13px !important; font-weight: 400 !important; padding-top: 2px; } .online-application .helpInfoIcon { color: #7c7c7c; cursor: pointer; padding-left: 6px; } .online-application .mandt, .mycamu-v1-style .mandt { color: red; } .online-application .fieldErr { color: red; font-size: 12px; } .online-application .alert-info { background-color: transparent !important; border-color: #eb5757; border-radius: 4px !important; color: #eb5757; } .online-application .alert-info i { color: #3f51b5; padding-right: 5px; } .online-application .alert-danger { background-color: transparent !important; border-color: #eb5757; border-radius: 4px !important; color: #eb5757; } .online-application .alert-danger i { color: #eb5757; padding-right: 5px; } @media (max-width: 760px) { .online-application #sideNav { display: none; } } .online-application .clickable-link { text-decoration: underline; color: #4051b5 !important; } .online-application .content-black { color: #333 !important; } .online-application .mrgn-top-btm-25 { margin-top: 25px; margin-bottom: 25px; } .online-application .margn-top-10 { margin-top: 10px; } .online-application .printInstLogo { width: 185px; height: 185px; object-fit: contain; padding: 4px; } .online-application .printInstDetails { align-items: center; display: flex; height: 60px; } /* Online application common print CSS */ @media print { /* removes page header & footers */ @page :footer { display: none } @page :header { display: none } /* @page { margin: 0; } */ /* removes page header & footers */ /* body { margin: 1.4cm; } */ /* sets margin bcoz of header & footers removed */ .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 { float: left; } .col-sm-12 { width: 100%; } .col-sm-11 { width: 91.66666666666666%; } .col-sm-10 { width: 83.33333333333334%; } .col-sm-9 { width: 75%; } .col-sm-8 { width: 66.66666666666666%; } .col-sm-7 { width: 58.333333333333336%; } .col-sm-6 { width: 50%; } .col-sm-5 { width: 41.66666666666667%; } .col-sm-4 { width: 33.33333333333333%; } .col-sm-3 { width: 25%; } .col-sm-2 { width: 16.666666666666664%; } .col-sm-1 { width: 8.333333333333332%; } .online-application input[type=text], .online-application input[type=number]:not(.ngPagerCurrent), .online-application input[type=search], .online-application input[type=email], .online-application select, .online-application .select2-selection { border: none !important; height: auto !important; white-space: normal; word-wrap: break-word !important; } .online-application .select2-selection__rendered { white-space: normal !important; word-wrap: break-word !important; } .online-application input[type=text]:disabled, .online-application input[type=number]:disabled, .online-application input[type=search]:disabled, .online-application input[type=email]:disabled, .online-application select:disabled, .online-application textarea:disabled, .online-application input:read-only, .online-application textarea:read-only, .online-application .select2-selection:disabled { color: #222B45 !important; opacity: 1 !important; } .online-application .cardlayout { margin-top: -40px; } .online-application .form-group { margin-bottom: 12px; } .online-application .formHead { color: #8F9BB3 !important; margin: 10px 0 12px; text-transform: uppercase; text-decoration: underline; } .online-application .subPanel { padding: 0 15px 10px 15px !important; } .online-application .fieldHead { color: #3b3b3b !important; margin-bottom: 0px !important; } .online-application #printInitialPage { border-bottom: 1px solid #EEEEEE; } /* .online-application custom-fields div[class*="subPanel"] { border-top: 1px solid #EEEEEE; } */ .online-application a[href]:after { content: none !important; } .online-application .select2-selection__arrow, .online-application .mandt, i.fa-info-circle, .online-application .addAttchmnts, .online-application input[type="radio"]:not(:checked), .online-application input[type="radio"]:not(:checked)~label, .online-application.hideOnPrint, .online-application .hideOnPrint, .online-application .helpText, .online-application section-instruction-link, .online-application .instruction, .online-application .fieldErr { display: none !important; } .online-application .hideInputBox { background: transparent !important; border: none !important; color: #222B45 !important; outline: none !important; padding-left: 0px !important; -moz-appearance: none !important; /* Firefox */ -webkit-appearance: none !important; /* Chrome and Safari */ appearance: none !important; } /* .online-application input[type=radio].hideInputBox { */ /* :not(input[type=radio]):not(input[type=checkbox]:checked) */ /* } */ } /* ------------------------------------------ Custom Online Application Form CSS - End ------------------------------------------------- */ /* primary button*/ .primary-btn { background-color: #3366FF !important; color: #ffffff!important; border: 1px solid #3366FF!important; border-radius: 4px !important; font-size: 14px !important; font-weight: bold !important; } /*Hover*/ .primary-btn:hover { background-color: #274BDB !important; color: #ffffff !important; } /* View as student */ .view-as-box{ text-align:center; background-color: #dc62ba; /* position: fixed; */ /* width: 100%; */ /* z-index: 5; top: 52px; */ /* height: 46px; */ padding: 12px; display: flex; align-items: center; justify-content: center; gap: 12px; } /* .view-as-border{ border: #dc62ba; border-style: solid; border-width: 3px; } */ .view-as-btn{ padding: 2px 8px; font-size: 16px; background-color: #FFF; } .view-as-btn:focus,.view-as-btn:active,.view-as-btn:hover { outline: none !important; outline: none !important; outline-offset: none !important; box-shadow:none !important; background-color: #EEEEEE; } /* View as student ends */ .sm_title_blue{ font-size: 14px; color: #091E42; } .bg-chip-grey{ color: black; background-color: #9e9e9e59; padding: 4px; border-radius: 3px !important; } /* box selection wrapper */ .box-selection-wrapper{ border-style: solid; border-color: #cacaca; border-width: 1px; border-radius: 4px; padding: 8px; margin: 8px; } .box-selection-wrapper span{ font-weight: bolder; } .box-selection-wrapper.box-selected{ border-color: #3f51b5; } /* Custom Form - Section & its fields */ .custom-form .form-section { background-color: #3f51b514; border-radius: 8px 8px 0px 0px; border-bottom: 2px solid #3F51B5; color: #3F51B5; font-size: 16px; font-weight: 600; margin-top: 25px; padding: 12px 15px; } .custom-form .form-field-card { background-color: #FFF; border-radius: 8px; margin-top: 8px; padding: 24px; } .custom-form .form-field-title { font-weight: 600; color: #2E2E3D; } .custom-form .form-field-caption { color: #555770; font-size: 12px; padding-bottom: 10px; } .custom-form .form-field-content { color: #2E2E3D; font-size: 13px; } .custom-form input[type=checkbox], .custom-form input[type=radio] { margin-right: 8px; position: relative; top: 2px; } .custom-form input[type=radio] label { font-weight: 500; } /* Chosen-library select(multi) related css */ .mycamu-v1-style .chosen-single, .mycamu-v1-style .chosen-choices { background: none; background-color: #F7F9FC !important; background-image: none; border: 1px solid #C5CEE0 !important; border-radius: 4px !important; box-shadow: none; color: #222B45 !important; min-height: 40px; height: auto !important; max-height: 125px; overflow-y: auto; padding: 6px 0 0 10px; transition: 0.3s ease; width: 100%; } .mycamu-v1-style .chosen-container-single .chosen-single div b { background: url(chosen-sprite.png) no-repeat 0 10px; } .mycamu-v1-style .chosen-container-active.chosen-with-drop .chosen-single { background-image: none; } .mycamu-v1-style .chosen-container input[type=text], .mycamu-v1-style .chosen-container input[type=number] { background: #fbfbfb !important; height: auto !important; } .mycamu-v1-style .chosen-container.chosen-container-single.chosen-disabled .chosen-single { background-color: #ced5df !important; color: #222B45 !important; } .mycamu-v1-style .chosen-container-single .chosen-single li.search-choice, .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-choice { background-color: #ced5df !important; background-image: none; background-clip: none; border: none; border-radius: 15px; box-shadow: none; color: #222B45 !important; margin-top: 7px; padding: 4px 20px 4px 10px; } .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-choice > span { display: inline-block; padding: 3px 6px 3px 6px; } .mycamu-v1-style .chosen-container-single .chosen-single li.search-choice .search-choice-close, .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-choice .search-choice-close { border-radius: 50% !important; color: #222B45 !important; font-size: 18px; padding: 7px; text-decoration: none; top: 8px; right: 5px; } .mycamu-v1-style .chosen-container-single .chosen-single li.search-choice .search-choice-close:hover, .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-choice .search-choice-close:hover { background-color: rgba(143, 155, 179, 0.16) !important; } .mycamu-v1-style .chosen-container .chosen-results li.highlighted, .mycamu-v1-style .chosen-container .chosen-results li:hover { background-color: #EDF1F7 !important; background-image: none !important; border-radius: 4px; color: #222B45 !important; } .mycamu-v1-style .chosen-container-single .chosen-drop .result-selected, .mycamu-v1-style .chosen-container-single .chosen-drop .result-selected:hover, .mycamu-v1-style .chosen-container-multi .chosen-drop .result-selected, .mycamu-v1-style .chosen-container-multi .chosen-drop .result-selected:hover { color: #C5CEE0 !important; } .mycamu-v1-style .chosen-container-single .chosen-single li.search-field input, .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-field input { color: #8F9BB3 !important; width: auto !important; } .mycamu-v1-style .chosen-container-single .chosen-single li.search-choice + li.search-field input, .mycamu-v1-style .chosen-container-multi .chosen-choices li.search-choice + li.search-field input { color: #222B45 !important; } .mycamu-v1-style .chosen-container .chosen-drop { background-color: #F7F9FC; background-image: none; border-radius: 4px !important; box-shadow: none; } .mycamu-v1-style .chosen-container .chosen-drop li { color: #222B45 !important; font-size: 13px; padding: 10px 8px; } .mycamu-v1-style .attachment { border: 1.8px dashed #C5CEE0; border-radius: 4px; color: #8F9BB3; height: 80px !important; padding: 28px 18px; text-align: center; } .cstmAttch .addAttchmnts, .mycamu-v1-style .addAttchmnts { border: 1px dashed #919191; border-radius: 4px; font-weight: 200; margin-top: 20px; padding: 8px 6px; font-size: 12px; } .cstmAttch .brwseFile, .mycamu-v1-style .brwseFile { background: none; color: #3f51b5 !important; text-decoration: underline; padding-left: 4px; cursor: pointer; } .cstmAttch .attchNameLbl, .mycamu-v1-style .attchNameLbl { margin-left: 0px !important; padding: 1px 10px 0 0 !important; font-size: 13px; font-weight: 200; text-transform: capitalize; } .cstmAttch .attchDownBtn, .mycamu-v1-style .attchDownBtn { background-color: #f2f2f2; border-radius: 15px; padding: 1px 6.2px; border: none; } .cstmAttch .attchDownIcon, .mycamu-v1-style .attchDownIcon { font-size: 10px; color: #666666; position: relative; top: -1px; } .cstmAttch .attchRmvBtn, .mycamu-v1-style .attchRmvBtn { border-radius: 15px; padding: 0px; background: none; border: none; margin-left: 5px; vertical-align: bottom; } .cstmAttch .attchRmvIcon, .mycamu-v1-style .attchRmvIcon { color: #eb5757; font-size: 22px; position: relative; top: -3px; } .cstmAttch .progress-bar { background-color: #3f51b5 !important; } /* Switch buttons .....start*/ .btn-switch-off { background-color: #F7F9FC !important; } /* ---button switch primary */ .btn-switch-primary { background-color: #3f51b5; border: 1px solid #90a4ae; border-radius: 4px; color: #ffffff; font-size: 13px; font-weight: 600; letter-spacing: 0.7px; margin-left: 5px; padding: 3px 8px; outline: none; } .btn-switch-primary:hover { background-color: #274BDB; color: #ffffff ; } /* ---button switch secondary */ .btn-switch-secondary { background-color: #3f51b5; border: 1px solid #90a4ae; border-radius: 4px; color: #222B45; font-size: 13px; font-weight: 600; letter-spacing: 0.7px; margin-left: 5px; padding: 3px 8px; outline: none; } .btn-switch-secondary:hover, .btn-switch-secondary:active { background-color: #F7F9FC !important; } /* Switch buttons .....end*/ /* Buttons */ /* ---primary */ .mycamu-v1-style .btn-v1-primary { background-color: #3F51B5; border: 1px solid #3F51B5; border-radius: 4px; color: #ffffff; font-size: 13px; font-weight: 600; letter-spacing: 0.7px; margin-left: 8px; padding: 8px 20px; outline: none; } .mycamu-v1-style .btn-v1-primary.small { margin-left: 5px; padding: 5px 8px; } .mycamu-v1-style .btn-v1-primary:hover { background-color: #324192 !important; color: #ffffff !important; } .mycamu-v1-style .btn-v1-primary[disabled] { background-color: #8F9BB3 !important; border-color: #8F9BB3 !important; color: #ffffff !important; cursor: not-allowed; } /* ---secondary */ .mycamu-v1-style .btn-v1-secondary { background-color: transparent !important; border: 1px solid #3F51B5; border-radius: 4px; color:#3F51B5; font-size: 13px; font-weight: 600; letter-spacing: 0.7px; margin-left: 8px; padding: 8px 20px; outline: none; } .mycamu-v1-style .btn-v1-secondary:hover, .mycamu-v1-style .btn-v1-secondary:active { background-color: #F7F9FC !important; } .mycamu-v1-style .btn-v1-secondary[disabled] { background-color: #8F9BB3 !important; border-color: #8F9BB3 !important; color: #ffffff !important; cursor: not-allowed; } /* ---ternary */ .mycamu-v1-style .btn-v1-ternary { background-color: transparent; border: none; font-size: 14px; font-weight: 600; color: #3F51B5 !important; letter-spacing: 0.7px; margin-left: 8px; outline: none; padding: 8px; } .mycamu-v1-style .btn-v1-ternary:hover:not(:disabled) { color: #324192 !important; } .mycamu-v1-style .btn-v1-ternary[disabled] { cursor: not-allowed; } .mycamu-v1-style .border_btm{ border-bottom: 1px solid #D9D9D9 !important; } /* Badge */ .mycamu-v1-style .badge { background-color: rgba(143, 155, 179, 0.16); border-radius: 4px; color: #7E8BA5; font-size: 13px; padding: 4px 8px; } .mycamu-v1-style .badge.badge-blue { background: rgba(51, 102, 255, 0.2); color: #3366FF; } .mycamu-v1-style .badge.badge-blue.bg-low { background: rgba(51, 102, 255, 0.08); color: #3366FF; } .mycamu-v1-style .badge.badge-green { background: rgba(33, 150, 83, 0.15); color: #219653; } .mycamu-v1-style .badge.badge-green.bg-low { background: rgba(33, 150, 83, 0.08); color: #219653; } .mycamu-v1-style .badge.badge-orange { background-color: rgba(242, 153, 74, 0.15); color: #F2994A; } .mycamu-v1-style .badge.badge-orange.bg-low { background-color: rgba(242, 153, 74, 0.08); color: #F2994A; } .mycamu-v1-style .badge.badge-red { background: rgba(235, 87, 87, 0.15); color: #EB5757; } .mycamu-v1-style .badge.badge-red.bg-low { background: rgba(235, 87, 87, 0.08); color: #EB5757; } .mycamu-v1-style .badge.badge-violet { background-color: rgba(155, 81, 224, 0.15); color: #9B51E0; } .mycamu-v1-style .badge.badge-violet.bg-low { background-color: rgba(155, 81, 224, 0.08); color: #9B51E0; } .mycamu-v1-style .circle-badge { background-color: rgba(143, 155, 179, 0.16); border-radius: 50%; color: #221B45; padding: 2px 7px; } /* color */ .mycamu-v1-style .color-secondary { color: #8F9BB3 !important; } .mycamu-v1-style .color-blue { color: #3366FF; } /* Switch buttons .....end*/ .linkBg{ background-color: white !important; border-radius: 4px !important; padding: 10px 8px; } /*Attachment model start*/ .blck_clr{ color: #4c4747 !important; } .color_grey { color: #8F9BB3 !important; } .custm_uplod{ height: 50px !important; width: 100% !important; border: 2px dashed #C5CEE0; border-radius: 4px; } .atchView { height: 155px; width: 85%; margin: 10px 0; overflow: auto; } .lightGray { color: #666666 !important; } .model-size{ width: 456px; margin-top: 150px; } .rmvOutlines, .rmvOutlines:active, .rmvOutlines:active { border: none !important; outline: none !important; } /*Attachment modal end*/ .border_radius_100 { border-radius: 100px !important; } /* ...................................new css Mycamu 3.0 ................... ........ */ /* .................container-box css........... */ /* .online-application_wrapper{ height: 100vh; overflow: auto; } */ @media print { html, body { overflow: unset; } } .container-box_view { padding: 0; background-color: #f4f5f7; height: calc(100vh - 88px); overflow: auto; } .new-tab_view { margin: 0 !important; padding: 0; } ul.nav-tabs { margin: 0 !important; padding: 0px 33px; background-color: #ffffff; border-bottom: solid 1px #ebedf0; } .tab-container_box { padding: 24px 40px; } /* ...................................... */ /* .............btn css................ */ .camu-btn_primary { background-color: #0D9BE1; border: 2px solid #0D9BE1; font-weight: 600 !important; font-size: 14px !important; padding: 8px 16px; border-radius: 30px !important; color: #ffffff; } .camu-btn_primary:hover { background-color: #1D98D4; } .camu-btn_primary:active { background-color: #1D98D4; border: 2px solid #006FAC; } .camu-btn_primary:focus, :active { outline: none !important; } .camu-btn_secondary { border: 2px solid #DFE1E5; border-radius: 30px; background: #F4F5F7; color: #091E42; font-weight: 600; font-size: 14px; padding: 8px 16px; } .camu-btn_secondary:hover { background-color: #EBEDF0; } .camu-btn_secondary:active { background-color: #EBEDF0; border: 2px solid rgba(9, 30, 66, 0.639216); ; } .camu-btn_secondary:focus, :active { outline: none !important; } .camu-btn_secondary--small { padding: 2px 16px; } .camu-btn_transparent { border: 2px solid transparent; border-radius: 30px; background-color: transparent; color: #0D9BE1; font-weight: 600; font-size: 14px; padding: 8px 16px; text-decoration: underline; } .camu-btn_transparent:hover { background-color: #E2F3FB; } .camu-btn_transparent:active { background-color: #E2F3FB; border: 2px solid #0D9BE1; } .camu-btn_transparent:focus, :active { outline: none !important; } .camu-btn_block{ width: 100%; } /* ............................. */ /* .......text area css............... */ .text-area_box { border: 2px solid #DFE1E5; border-radius: 4px; padding: 8px 12px; color: #091E42; font-size: 14px; outline: none; } /* ........................... */ /* ........multi-select-input css...... */ .btn-select_input { width: 100%; border: 2px solid #DFE1E5; border-radius: 4px !important; padding: 10px 12px 10px 12px !important; color: #7F8A9D; font-size: 14px; outline: none; background-color: #ffffff; } /* ................................. */ /* .............checkbox css............. */ .checkbox-view_primary[type=checkbox] { position: relative; cursor: pointer; } .checkbox-view_primary[type=checkbox]:before { content: ""; display: block; position: absolute; width: 18px; height: 18px; top: 0; left: 0; border: 2px solid #7F8A9D; border-radius: 4px; background-color: white; } .checkbox-view_primary[type=checkbox]:checked:before { background-color: #0D9BE1; border: 2px solid #0D9BE1; border-radius: 4px !important; } .checkbox-view_primary[type=checkbox]:checked:after { content: ""; display: block; width: 5px; height: 10px; border: solid white; border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 2px; left: 6px; } .check-box_label { color: #091E42; font-size: 14px; padding-left: 8px; font-weight: normal; } /* .................................... */ /* .............input css............... */ .input-list_primary { background: #FFFFFF; border: 2px solid #DFE1E5; border-radius: 4px; padding: 10px 12px; height: 100%; outline: none; } .input-list_primary:focus { border: 2px solid #0D9BE1; } .block_input { width: 100%; } .input-list_primary::placeholder { color: #7F8A9D; opacity: 1; /* Firefox */ } .input-list_primary:-ms-input-placeholder { /* Internet Explorer 10-11 */ color:#7F8A9D; } .input-list_primary::-ms-input-placeholder { /* Microsoft Edge */ color: #7F8A9D; } .input-list_primary:disabled { cursor: not-allowed; background-color: #e6e6e6; } /* .....................................*/ /* .................dropdown css................ */ .select-list_primary { background-color: #FFFFFF; border: 2px solid #DFE1E5; border-radius: 4px !important; padding: 10px 42px 10px 18px !important; color: #091E42; font-size: 14px; outline: none; -moz-appearance: none; /* Firefox */ -webkit-appearance: none; /* Safari and Chrome */ appearance: none; } .drop-down_arrow { background: url("data:image/svg+xml;utf8,") no-repeat; background-position: right 12px top 50%; background-color: #ffffff; } .block-dropdown { width: 100%; } .dropdown-border_view { border-radius: 40px !important; } .select-list_primary:disabled{ cursor: not-allowed; background-color: #e6e6e6; } /* ................................... */ /* ...............button dropdown css............ */ .custom-dropdown_primary { background: #FFFFFF; border: 2px solid #DFE1E5; border-radius: 36px; color: #091E42; font-weight: 600; font-size: 14px; padding: 6px 42px 6px 16px } .custom-dropdown_primary .caret { display: none; } .custom-dropdown_primary { background: url("data:image/svg+xml;utf8,") no-repeat; background-position: right 12px top 50%; background-color: #ffffff; } .custom-dropdown_view { right: 0; left: auto; box-shadow: 0px 0px 2px rgb(9 30 66 / 20%), 0px 2px 10px rgb(9 30 66 / 10%); border-radius: 8px; border: solid 1px #eaeaea; padding: 8px 0px; } .custom-dropdown_view li a { color: #091E42 !important; font-size: 14px; padding: 6px 14px; } /* ................................. */ /* ...................table css............. */ .camu-table_view { width: 100%; background-color: #ffffff; } .table-head_view { background-color: #E2F3FB; } .table-head_view tr th { padding: 12px 16px !important; font-weight: 600; font-size: 12px; color: #091E42 !important; text-transform: uppercase; } .table-cont_box tr td { padding: 12px 16px; font-weight: normal; font-size: 14px; color: #091E42 !important; } .table-cont_box tr { border-bottom: 1px solid #DFE1E5 !important; } .table-cont_box tr:last-child { border-bottom: none !important; } .table-td_right { text-align: right; } /* ...............common-alert css........ */ .common-alet_view { background-color: #F24B6B; padding: 16px; } .alert-label_cont { display: flex; align-items: center; justify-content: center; gap: 12px; } .label-alert_cont { font-size: 14px; margin: 0; color: #ffffff; font-weight: 600; } .alert-cont_label { display: flex; align-items: center; border-radius: 8px; padding: 12px 16px; gap: 12px; margin: 12px; } .alert-view_data { margin: 0; font-weight: 600; font-size: 16px; color: #091E42; } /* ....alert blue...... */ .alert-box_primary { background-color: #ECF5FE; border: 2px solid #0D9BE1; } /* ....alert red...... */ .alert-box_danger { background-color: #FEF1F3; border: 2px solid #F24B6B; } /* ....alert green...... */ .alert-box_success { background-color: #E7FCBA; border: 2px solid #469B1F; } /* ............................. */ /* ................animation css.......... */ .animation-cont_box { animation: fadein 0.5s; -moz-animation: fadein 0.5s; /* Firefox */ -webkit-animation: fadein 0.5s; /* Safari and Chrome */ -o-animation: fadein 0.5s; /* Opera */ } @keyframes fadein { from { opacity: 0; } to { opacity: 1; } } @-moz-keyframes fadein { /* Firefox */ from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes fadein { /* Safari and Chrome */ from { opacity: 0; } to { opacity: 1; } } @-o-keyframes fadein { /* Opera */ from { opacity: 0; } to { opacity: 1; } } /* @keyframes shrink { from { transform: scale(0); } to { transform: scale(1); } 0% { transform: scale(); } 50% { transform: scale(4); background-color: red; border-radius: 0px; } 100% { transform: scale(1); } } */ /* ................................ */ /* ..........search bar css............ */ .block-default_search{ position: relative; } .default-search_box{ background-color: #FFFFFF; border: 2px solid #DFE1E5; border-radius: 20px; color: #495973; padding: 8px 18px 8px 36px !important; font-size: 13px; } .default-search_box:focus{ border: 2px solid #0D9BE1; outline: none; } .block-search_view{ width: 100%; } .default-view_icon { position: absolute; left: 14px; top: 11px; font-size: 18px !important; color: #495973; } .default-search_box:focus .default-view_icon { color: #0D9BE1 !important; } /* .............common element css....... */ .cursor-custom_pointer{ cursor: pointer; } .btn-icon_right{ margin-right: 6px; } .container-block_view{ margin: 20px 40px; } .row-cont{ margin: 0; } .col-cont{ padding: 0; } .word-break_rule{ white-space: nowrap; } .text-align_center{ text-align: center; } .text-transform_label{ text-transform: lowercase; } .text-transform_label::first-letter{ text-transform: uppercase !important; } .block-view_span{ display: block; } .card-list_option{ padding: 8px 0px !important; } /* ...................... */ /* ........camu modal css............... */ .mycamu-modal_default { background-color: #FFFFFF; border-radius: 8px; overflow: hidden; } .modal-box_container { border-radius: 8px !important; } .mycamu-modal_small { max-width: 400px; } .mycamu-modal_block { width: 90%; } .modal-view_header { padding: 20px; position: relative; } .modal-close_btn { position: absolute; left: auto; top: 20px; right: 20px; z-index: 99999; height: 24px; cursor: pointer; } .modal-header_label { text-align: center; font-size: 16px; color: #222B45; font-weight: 600; margin: 0; } .modal-view_container { padding: 16px 24px; background-color: #F4F5F7; max-height: 70vh; overflow: auto; } .modal-cont_label { margin: 0; color: #222B45; font-size: 13px; } .modal-view_footer { border-top: 1px solid #EDF1F7; padding: 16px 20px; display: flex; justify-content: end; gap: 16px; } .list-cont_label{ margin: 0; color: #495973; padding-bottom: 4px; } .form-cont_list{ margin-bottom: 12px; } .text_center { text-align: center; } .alert-label_red{ color: #F24B6B; margin: 0; font-size: 13px; padding-top: 6px; } .alert-label_dark{ color: #495973; margin: 0; font-size: 13px; padding: 6px 8px 0; } .alert-label_red span{ position: relative; top: 2px; margin-right: 4px; } /* ...............icon space css........ */ .icon-right{ margin-right: 4px; } @media only screen and (min-width: 320px) and (max-width: 767px) { .nav-mobile_view{ display: block !important; } .navbar-camu_new{ padding: 20px 24px 12px !important; } .navbar-camu_new{ border-radius: 0 !important; } /* .navbar-name_label{ font-size: 14px !important; } */ .container-box_view { height: calc(100vh - 88px); padding-bottom: 88px; } .list-separate_line { border-left: none !important; padding-left: 0 !important; } .menu-list_inst{ margin: 0 0 10px !important; width: 100% !important; display: block !important; border: none !important; border-radius: 8px !important; } .header-detail_view { padding: 16px !important; gap: 12px !important; flex-wrap: wrap; } .header-view_label{ font-size: 16px !important; } .custom-dropdown_primary{ font-size: 13px !important; overflow: hidden; } .custom-dropdown_primary .textOverflowEllipsis{ /* max-width: 120px !important; */ max-width: 100% !important; } .select-list_primary{ font-size: 13px !important; width: 100%; } .camu-btn_secondary { font-size: 13px !important; padding: 8px 14px !important; } .camu-btn_primary{ font-size: 13px !important; padding: 8px 14px !important; } .camu-btn_transparent { font-size: 13px !important; padding:8px !important; } ul.nav-tabs{ padding: 0px 12px !important; } .nav-tabs>li{ margin-right: 16px !important; } .institution-grid_container{ padding: 12px !important; } .our-vision_cont{ padding: 8px !important; } .vision_head_label{ font-size: 14px !important; } .vision_cont_label{ font-size: 14px !important; } .alert-cont_label{ padding: 8px !important; } .view-cont_label { font-size: 12px !important; } .btn-list_view{ gap: 6px !important; } .hall-ticket_view{ padding: 8px !important; } /* .label-ticket_cont { font-size: 14px !important; } */ .alert-cont_label{ margin-top: 8px !important; gap: 6px !important; } .alert-cont_label svg{ width: 20px !important; height: 20px !important; flex-shrink: 0 !important; } .alert-view_data{ font-size: 14px !important; } .list-holiday_event{ padding: 8px !important; gap: 8px !important; } .holiday-label_cont{ font-size: 13px !important; } .holiday-date_cont{ font-size: 13px !important; } .xs_lbl_blue { font-size: 11px !important; } .xs_lbl_orange{ font-size: 11px !important; } .time-select-label { font-size: 16px !important; text-align: center !important; } .label-sub_name{ font-size: 13px !important; } .label-sub_details{ font-size: 13px !important; } .accordion-list_view{ font-size: 13px !important; padding: 8px !important; } .table-head_view tr th{ padding: 8px !important; white-space: nowrap; } .table-cont_box tr td{ font-size: 13px !important; padding: 8px !important; /* white-space: nowrap; */ -webkit-text-size-adjust: 100%; } .table-view_container{ width: 100% !important; overflow: auto !important; } .leave-date_list { padding: 8px !important; gap: 12px !important; } .to-date_info{ font-size: 13px !important; } .date-info_label{ font-size: 13px !important; } .approved-btn{ font-size: 13px !important; } .cancel-btn{ font-size: 13px !important; } .submitted-btn{ font-size: 13px !important; } .leave-container_view{ padding: 12px !important; } .leave-form_view{ width: 100% !important; } .grid-table_view{ width: 100% !important; overflow: auto !important; } .btn-switch-primary { font-size: 13px !important; /* padding: 10px 12px !important; */ background-color: #E2F3FB !important; border: 1px solid #DFE1E5 !important; color: #0D9BE1 !important; } .select-tab_btn{ font-size: 12px !important; } .info-view_label { font-size: 14px !important; } .new-portfolio_card{ margin-left: 0 !important; margin-top: 12px !important; } .header-portfolio_cont{ font-size: 14px !important; padding: 12px !important; } .portfolio-cont_list { padding: 12px !important; } .portfolio-list_view{ font-size: 12px !important; } .label-view_portfolio { font-size: 13px !important; -webkit-text-size-adjust: 100%; } .list-portfolio_view { padding: 10px 12px 0 !important; } .cstmIcon{ font-size: 20px !important; } .label-option_list{ font-size: 12px !important; width: 60% !important; } .pie-chart_box{ gap: 12px !important; padding: 8px !important; } .value-option_list { font-size: 12px !important; } .bill-container_view{ padding: 8px !important; } .paid-amount_cont{ font-size: 16px !important; } .transcript-card_layout{ padding: 8px !important; } .card-layout_list{ padding: 8px !important; } /* .value-transcript_label { font-size: 12px !important; } */ .sem-course_cont{ flex-wrap: wrap !important; justify-content: end !important; } .custom-view_btn{ width: auto !important; } .file-name_label{ white-space: nowrap !important; width: 90% !important; overflow: hidden !important; text-overflow: ellipsis !important; } .btn-dropdown_details { left: 0% !important; transform: translate(-50%, 0) !important; padding: 8px !important; min-width: 260px !important; right: 8px !important; } .stud-sub_list{ gap: 8px !important; padding: 4px 8px !important; margin: 6px 0 !important; } .assessment-details_view{ padding: 12px !important; gap: 12px !important; } .test-label_view{ font-size: 14px !important; } .assessment-exam_data{ flex-wrap: wrap; justify-content: end; } .app-year_label{ font-size: 14px !important; } .academic-year_print{ padding: 12px !important; gap: 12px !important; } .sub-detail_list { gap: 16px !important; flex-wrap: wrap !important; } .cont-list_grid { padding: 12px !important; } .service-header_view{ padding: 12px !important; } .service-progress_view { padding: 12px 0 !important; } .service-info_view { padding: 12px !important; } .feedback-sub_label{ font-size: 14px !important; } .form-details_container{ padding: 16px 0 0 !important; } .form-list_views{ width: 100% !important; } .container-block_view{ margin: 16px 16px 58px !important; } .view-arrear_container{ margin: 12px 0 0 0 !important ; } .enlistment-view_cont{ flex-wrap: wrap; } .term-list_modal{ width: 46% !important; border-right: none !important; } .sem-result_view{ padding: 12px 8px !important; } .view-term_label{ font-size: 14px !important; } .view-semester_label{ font-size: 13px !important; } .id-card_container{ width: 90% !important; } .view-details_mark{ padding: 0 !important; } .move-mobile_left{ margin-left: 0 !important; } .move-mobile_right{ margin-right: 0 !important; } .counselor-detail-container { padding: 12px 16px !important; } .user-counselor_view{ margin-left: 76px; } .profile-table_view{ width: 90vw !important; overflow: auto !important; margin: 0 auto; } .assignment-rating_header{ padding: 16px 8px 20px 8px !important; } .padding-right_view{ padding-left: 0 !important; } .enrolled-list_view{ padding: 8px !important; } .sem-value_label{ font-size: 18px !important; } .transcript-enroll_cont{ flex-wrap: wrap; } .announcement-view_block{ flex-wrap: wrap; } .announcement-view_btn{ margin-left: 42px; } .grid-admin_box{ flex-wrap: wrap; } .parent-view_report{ width: 100% !important; } .view-search_block{ width: 100% !important; } .user-email_link{ flex-wrap: wrap; } .user-email_btn{ margin-left: 42px; } .payment-error_container{ flex-wrap: wrap; } .profile-modal_header{ font-size: 16px !important; padding: 12px !important; } .start-more_btn{ padding: 8px 46px !important; margin-top: 12px; } .profile-cont_view { width: 90% !important; padding: 16px 12px !important; } .option-choose_view{ gap: 8px !important; } .agree-option_view{ margin-right: 8px !important; } .disagree-option_view { margin-left: 8px !important; } .agree-option_list{ width: 28px !important; height: 28px !important; } .choose-option_icon{ top: 1px !important; left: 4px !important; } .statement-label_view { font-size: 16px !important; padding-bottom: 16px !important; } .question-list_cont { padding: 12px 0 !important; } .test-course_container { width: 100% !important; } .modal-container_header_phase{ padding: 12px !important; } .check-password_modal{ flex-wrap: wrap; gap: 0 !important; } .save-format_password{ text-align: right; width: 100% !important; } .password-cont_gap{ margin-right: 38px !important; } .user-password_length{ width: 100% !important; } } /* Translate */ .trans_to_captilize{ text-transform: lowercase; } .trans_to_captilize::first-letter{ text-transform:capitalize !important; } .payment_rad{ display:flex; gap:15px; margin:10px 0px; } .pay_info-box{ color:#091E42; padding:15px ; } .pay_total{ align-self: center; float: left; } .pay_footer{ justify-content: space-between !important; } /* border radius */ .br-r-2{ border-radius: 2px !important; } .br-r-4{ border-radius: 4px !important; } .br-r-10{ border-radius: 10px !important; } .br-r-25{ border-radius: 25px !important; } @media (min-width: 768px) and (max-width: 1024px) { .view-arrear_container { margin: 12px 0 0 0 !important; } .grid-table_view { width: 100% !important; overflow: auto !important; } .table-head_view tr th { white-space: nowrap; } .table-cont_box tr td { white-space: nowrap; } .profile-table_view{ width: 72vw !important; overflow: auto !important; margin: 0 auto; } .grid-admin_box{ flex-wrap: wrap; } .view-search_block{ width: 80% !important; } .view-reset_box{ width: 48% !important; } .save-format_password{ text-align: right; width: 100% !important; } .check-password_modal{ flex-wrap: wrap !important; } } @media (min-width: 992px) { .mycamu-logo{ display: none; } } /* ......responcive table................ */ @media screen and (max-width: 768px) { .camu-table_view { border: 0; background-color: #F4F5F7; } .camu-table_view th { display: none; } .camu-table_view tr { border: 1px solid #dbdbdb; display: block; margin-bottom: 12px ; background-color: #ffffff; border-radius: 8px; } .camu-table_view td { border-bottom: 1px solid #ddd; display: block; text-align: right !important; } .camu-table_view td::before { /* * aria-label has no advantage, it won't be read inside a table content: attr(aria-label); */ content: attr(data-label); float: left; font-weight: 600; text-align: left; text-transform: uppercase; } .camu-table_view td:last-child { border-bottom: 0; } .mobile-view_td{ position: relative !important; display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px; } .table-head_view{ display: none !important; } .inner-table_view{ margin-top: -18px !important; border-radius: 0 !important; } .inner-cont_table{ margin-bottom:0 !important; border: solid 0px !important; } .table-sub_header{ text-align: left !important; margin: 12px 0 !important; } .more-view_option--icon{ padding: 3px 0; } .sub-category_table{ display: none !important; } }