/*** Global Header *****/ a,a:hover{text-decoration: none;} #container-wrap{padding-top:0px} 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; } #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;} #header .logo{width: auto; padding-top:0; float:none; margin-right: 16px; margin-left: 0;} #search-form-header{margin-bottom: 0;} .globalheader .logo{width:97px; margin-right: 16px;} .search-wrapper .button1{min-width: 120px;} .btngroup.search-wrapper > .fctrl{margin-right: 0;} #main-navigation1,#main-navigation1 ul > li,#header .container{float: none; position:static} #main-navigation1{flex-grow: 1; display: flex; justify-content: center;} #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: 600; color:#111111; line-height: 16px; font-size: 16px;} #main-navigation1 > ul > li > a.dashboard-mnu{padding-top: 15px; padding-bottom: 15px;} #main-navigation1 > ul > li.parent > a{padding-right:19px; position:relative;} #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 #d7263d;} #main-navigation1 > ul > li.menu-item.parent:hover > a,#main-navigation1 > ul > li.menu-item.discuss-navigation > a span{color:#d7263d !important;} #main-navigation1 > ul > li.menu-item.discuss-navigation {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:#4a4548; border-right-color:#4a4548} #main-navigation1 > ul > li > a::after{content: ""; position: absolute; left:0; right:0; width: 0; bottom: 0px; height:2px; /* background: #d7263d; */ transition: width 0.25s; z-index: 2;} #main-navigation1 > ul > li:hover > a, #main-navigation1 > ul > li.active:hover > a{background: transparent; color: #4a4548;} #main-navigation1 > ul > li.parent:hover > a::before,#main-navigation1 > ul > li.parent > a.active::before{border-bottom-color: #d7263d; border-right-color: #d7263d;} #main-navigation1 > ul > li > a:hover{color: #4a4548; text-decoration: none;background: transparent;} #main-navigation1 > ul > li > a.active{color: #d7263d; 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: #000; line-height: 16px; padding: 4px 0; font-weight: normal; display: block;} .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{background: #fff;} .__search-page-box .inner-wrap{background: #F7F7F7; padding:20px; font-size: 16px;} .__search-page-box .inner-wrap li a{color:#4A4548; 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: #D7263D; border-bottom-color: #D7263D; 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} .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 {position: absolute; right: 8px; top: 50%; margin-top: -8px; z-index: 3; line-height: 0; width: 16px; height: 16px;} /* #searchid:checked + #header + .global-search .posfixed, #searchid:checked + #header + .global-search{display: block; position: fixed; left: 0; right: 0; top: 0; z-index: 1003;} #searchid:checked + #header + .global-search #search-result-lists{display: block;} #searchid:checked + #header + .global-search .posfixed{z-index: 1;} #searchid:checked + #header + .global-search::after{content: "";} */ #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 #search-result-lists{display: block;} #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 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; box-shadow: 0px 2px 4px 0px rgba(25, 23, 26, 0.10); position: relative; z-index: 1;} .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;} #search-filter{z-index: 1;} #searchid:checked + #header{box-shadow:none} #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;} .homepage-slider-block.slick-dotted.slick-slider{margin-bottom: 16px;} #header .btngroup > .fctrl + .fctrl.last{margin-left:0px;} ._searchCTA{display: none;} /*--- 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(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:4px; 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;} .global-search .form-control {border: none; padding-left: 30px;} #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); background: #fff; border-radius: 6px; margin: 0;} #notification-lists li{font-size: 12px; line-height: 16px; list-style-type: none;} #notification-lists header:before{right: 0;} #main-navigation1 .media {display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start;} #main-navigation1 .mr-2,#main-navigation1 .mx-2 {margin-right: 0.5rem !important;} #main-navigation1 .media-body {-ms-flex: 1; flex: 1;} #header .user-area{padding-top: 0; width: auto; float: none;} #main-navigation1 > ul > li .innermenu{display: none;} header#header .user-notifications{float: right; height: 32px; width: 22px; display: flex; justify-content: center; align-items: center; margin-left: 16px;} #header .user-area .avatar-pic{margin-left:0;} #header .user-area .notification-icon svg g{fill:#dadada} #header .user-area .notification-icon .number {display: block; width: 6px; height: 6px; border-radius: 5px; background: #0FC35D; position: absolute; left:auto; right: 0; top: 3px;} /*--- Search Result Lists --- */ ._tgmnav,.gmnav{display: none;} .widget.ad > a {display: block;} .global-search{height: 0; padding:0; transition: all 0.5s; border-top: none; width:100%; position: fixed; z-index: 4; border-right-color:transparent; top: 52px;} /* #header.attop + .global-search{width:100%; position: relative;} */ #global-search-form,.strip-on #global-search-form{width: auto;height: auto;background: transparent;float: none;margin-right: 0; position: relative; right: 0;} .strip-on #user_preferences_modal .modal-dialog,.strip-on #main-navigation1 .submemu> .row{margin-right:162px;} /**###### ICON ######**/ .sp-icon{width: 20px; height: 20px; background: url(https://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://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;} @media(min-width:767px) { ._searchCTA{display: inline-block; position: absolute; top: 50%; margin-top: -16px; right: 16px; z-index: 2; border-radius: 3px;} .global-search .ser-icon span{display: flex;} .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: 16px; width: 160px; left: 0%; margin-left: 0px;} .advice_title,.advice_content{overflow: hidden; height: 48px;} .advice_content{height: 151px;} .advice_content.leader{height: 181px;} .devzone{height: 415px;} .global-search .__search-filter-suggetion,.global-search .__search-suggetion-block{max-height: 550px;} } @media(max-width:359px){ /*.globalheader .navmenu{width: calc(100% - 119px);}*/ } @media (max-width:1200px) { #main-navigation1 > ul > li > a {padding-left: 4px; padding-right: 4px;} } .imgw35{width: 35px; height: 35px;} @media(max-width:1000px){ .gmnav{display: inline-flex;} #tgm-nav + #main-navigation1{left: 120%; position: fixed; height: 100%; background: #fff; right: 0; top:0; bottom: 0; z-index: 1; width: 100%; transition: all 0.5s; background: #fff; overflow: hidden; overflow-y: auto;} #main-navigation1 > ul > li.parent > a::before{content: none;} #main-navigation1 > ul > li .innermenu{display: block;} #tgm-nav + #main-navigation1 + ._tgmnav{position: fixed; z-index: 1;top: 66px; display: none;} #main-navigation1 > ul > li.parent > a{color: #2E4979; font-weight: 700;} #main-navigation1 .submutlink-list a{color: #000000; font-weight: 600;} .mnu-footer{background: #2E4979; padding: 10px 0; position: absolute; left: 0; right: 0; bottom: 0; align-items: center; justify-content: center;} #tgm-nav:checked + #main-navigation1 + ._tgmnav{display: block;} #tgm-nav:checked + #main-navigation1{left: 0; z-index: 3;} #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; width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); align-content: flex-start;} #main-navigation1 > ul > li.fullli{grid-column: span 2; width: 100%;} .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;} .d-none {display: none !important;} .globalheader { height: 48px;} #user-status-mob .details{margin-left: 0;} #global-search-form.active,#global-search-form 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 (min-width:992px) { /*#main-navigation1 > ul > li > a{padding-left: 4px; padding-right: 4px;} */ } @media (min-width:1200px) { } @media(max-width:767px){ .global-search .__search-filter-suggetion,.global-search .__search-suggetion-block{max-height: 350px;} #search-result-lists{top: 45px; box-shadow: none;} #global-search-form{overflow: visible;} .trending-search li a{margin: 4px;} #notification-lists{width: 300px;} .rcommed .slick-next{right:0} .rcommed .slick-prev{left:0} /*--- User Status --- */ ._tgmnav{display: block;} #user-status-mob {padding:16px; padding-bottom:1px; background: none;} #user-status-mob .image { float:left;} #user-status-mob .image img { width:50px; height:50px; border-radius:50%;} #user-status-mob .image a { padding:0;} #user-status-mob .details h6 { color:#8a858d; font-weight:normal; margin-bottom:1px;} #user-status-mob .details h6 a { color:#8a858d; padding:0;} #user-status-mob .details p { color:#8a858d; font-size:12px; margin-bottom:3px;} #user-status-mob .progress { background:#8a858d; width:150px; position:relative; overflow:visible;} #user-status-mob .progress, #user-status-mob .progress .progress-bar { height:6px; border-radius:0;} #user-status-mob .progress .value { font-weight:500; font-size:12px; position:absolute; left:157px; top:-5px; color:#fff; width:26px;} body{padding-top: 48px;} #notification-lists header:before{right: 50px;} } .img{max-width: 100%;} .fctrlimg{line-height:0;} .btn .fctrlimg path{transition:all 0.5s;} .btn:not(.light,.noeffect):hover .fctrlimg path{stroke:#fff;} .btn:not(.light,.noeffect):hover .fctrlimg.path path{fill:#fff;} .btn.light:hover .fctrlimg path{stroke:#fff;} .btn.light:hover .fctrlimg.path path{fill:#fff;} .success{color: #0FC35D;} .nowrap{white-space: nowrap;} .error,.error_msg{color: #ea4335;} .warning{color: #FEB95F;} input.form-control::placeholder,textarea.form-control::placeholder,.mutedcolor{color:#cccccc;} .error_msg,.font12{font-size: 12px;} .font14{font-size: 14px;} .nolistul{list-style-type:none; padding-left:0px; margin-bottom:0;} .plistul{padding-left:18px; margin-bottom:0;} .underline,.underline:hover{text-decoration: underline; text-underline-offset: 2px; text-decoration-thickness: 1px;} .lblcolor{color: #80868a;} .posrel .posoverlay,.posfixed{position:absolute;top: 0;left: 0;right: 0;bottom: 0;margin-bottom: 0;} .zindex{z-index:999;} .posrel{position:relative;} input.popupinput{position:absolute; top:0; left:0;display:none; z-index: -1;} .margincenter{margin: auto;} .wd100{width: 100%;} .hide,.nodisplay{display:none;} .cm-flex{display:flex;} .bg000op{background-color: rgba(0,0,0,0.5);} .bg000op8{background-color: rgba(0,0,0,0.8);} .bg000op1{background-color: rgba(0,0,0,1);} /**######## Spacing Styling ###################*/ .mrg4{margin-top: 4px;} .mrg8{margin-top: 8px;} .mrg12{margin-top: 12px;} .mrg16{margin-top: 16px;} .mrg24{margin-top: 24px;} .mrg40{margin-top: 40px;} .mrgb4{margin-bottom: 4px;} .mrgb8{margin-bottom: 8px;} .mrgb16{margin-bottom: 16px;} .mrgb24{margin-bottom: 24px;} .mrgb40{margin-bottom: 40px;} .pad8{padding-top: 8px;} .pad16{padding-top: 16px;} .pad24{padding-top: 24px;} .pad40{padding-top: 40px;} .btngroup4 > .fctrl{margin-right:4px;} .btngroup8 > .fctrl{margin-right:8px;} .btngroup12 > .fctrl{margin-right:12px;} .btngroup > .fctrl{margin-right:16px;} .btngroup24 > .fctrl{margin-right:24px;} .btngroup40 > .fctrl{margin-right:40px;} .btngroup4 > .fctrl:last-child,.btngroup8 > .fctrl:last-child,.btngroup > .fctrl:last-child,.btngroup24 > .fctrl:last-child,.btngroup40 > .fctrl:last-child,.btngroup > .fctrl:last-child{margin-right:0px;} @media (min-width:768px) { .login-signup-links.btngroup8.fctrl{margin-right: 0;} } /**######## ./Spacing Styling ###################*/ .error-msg,.success-msg {color: #f54b5e; display: block; font-size: 12px; position: relative; line-height: 18px; margin-top: 4px;} .success-msg,.successmsg{color:#26d974;} .errormsg{color: #f54b5e;} .warningmsg{color: #de8927;} .undelinelnk{text-decoration: underline;} .nomargin{margin-bottom:0;} .badge{border-radius: 3px; background: #e5e5e5; color:#fff; font-size: 12px; padding:8px;} .badge.error{background: #e95455;} .badge.success{background: #34a853;} /**######### Pre #######*/ pre { font-size:14px; color:#4a4548; 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;} pre.show-response{font-family:Arial, Helvetica, sans-serif;} /****** Error & Suceess Message Design **********/ .common-message-box{position: fixed; top: 75px; left:50%; transform: translate(-50%,0); z-index: 999; font-size: 14px; width:auto; line-height: 19px; color: #fff; display:none;} .common-message-box.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{z-index: 10; width: 100%; padding: 14px 24px 13px 16px; border-radius: 6px; top: 0; left: 0; background: #fff9e6; box-shadow: 0 1px 8px 0 rgba(89, 89, 89, 0.51); display: block; border: solid 2px #ffd23f; color:#de8927;} .message-inner-content {padding: 16px 18px; margin: 0;} .common-message-box .close-msg {margin-left: 16px; opacity: 1; font-size:20px;} .common-message-box .msg-icon{font-size: 22px; position: relative; color:inherit} .common-message-box .message-inner-content p {margin: 0; font-weight:bold;} .message-inner-content.error-msg {background: #ffe6e6; border-color: #ee4266; color:#e80000;} .message-inner-content.success-msg {border: solid 1px rgba(28, 158, 85, 0.4); background-color: #ccf7df; color:#1c9e55;} .success-msg .material-icons,.message-inner-content.success-msg .close-msg{color:#1c9e55} .msg-block .message-inner-content{position:static; border-top:solid 2px #ffd23f; margin-bottom:24px; margin-top:16px;} /*****########### Label Design #############*****/ .label.wrap{white-space:normal} .nw-lbl,label.nw-lbl{padding:4px 8px; font-size:10px; border-radius: 2px;display: inline-block; position:relative; top:-2px; line-height: 10px;} .nw-lbl.success{background-color: #ccf7df; color: #1c9e55; border: solid 1px rgba(28, 158, 85, 0.4);} .nw-lbl.new{background-color: #7ed7a5; color: #fff; border: solid 1px transparent;} .nw-lbl.default{background-color: #f2f2f2; color: #8a858d; border: solid 1px rgba(138, 133, 141, 0.4); } .nw-lbl.warning{background-color: #fef7e0; color: #f9ab00; border: solid 1px rgba(243, 169, 27, 0.4); } .nw-lbl.error{background-color: #ffd3d3; color: #e80000; border: solid 1px rgba(232, 0, 0, 0.4); } .nw-lbl.coding{background-color: #e6e6fc; color: #6565c7; border: solid 1px rgba(232, 0, 0, 0.4); } .nw-lbl.div{padding:12px 16px; display:block; text-transform:none; font-size:14px; font-weight:600; line-height: normal;} .nw-lbl.nw-pill{border-color: transparent;border-radius: 10px;padding: 1px 6px;font-weight: bold;padding-top: 2px;} .nw-lbl.gradient{border-radius: 12px;border: none;background-image: linear-gradient(251deg, #6565c7, #88498f 15%);color:#fff;font-size: 12px;line-height: 16px; padding:4px 14px;} .nw-lbl.nwlabel{line-height: 15px; border-radius: 10px;} /******#### Popup Center #####******/ .posrel .poscenter,.poscenter{transform: translate(-50%,-50%); position: absolute; top: 50%; left: 50%;} /************** vertical-align middle ************/ .logovalignlist{margin:0; padding:0; display:table;} .logovalignlist .list-cell{display:table-cell; vertical-align: middle; text-align: center;} .logovalignlist .list-cell img{vertical-align:middle;} /************* Using flex style ****************/ .ctrlcenter{display:flex; align-content:center;justify-content: center; align-self:center;align-items: center;} .ctrlcenter.text-right{justify-content: flex-end;} .ctrlcenter.text-left{justify-content: flex-start;} .ctrlcenter.space-between{justify-content:space-between;} .ctrlcenter.vtop{align-items: start;} /*.ctrlcenter svg{margin:auto;}*/ .vcenter{align-self: center;} /************* Using Table style ****************/ .cmp-tbl{display:table;} .cmp-tbl .cmp-cell{display:table-cell; vertical-align:middle;} /********** Custom DropDown Function CSS **********/ .\:cusdropdown{position:relative; font-size:14px;} .\:cusdropdown .dropdownlst{position:absolute; top:100%; width:200px;} .\:cusdropdown.r_side .dropdownlst{right: 0; z-index: 1;} .\:cusdropdown input[type="checkbox"] + .cusdropdown_ctrl + .dropdownlst, .\:cusdropdown .popupinput + .cusdropdown_ctrl + .dropdownlst + .posfixed {display:none;} .\:cusdropdown input[type="checkbox"]:checked + .cusdropdown_ctrl{z-index:99997;} .\:cusdropdown input[type="checkbox"]:checked + .cusdropdown_ctrl + .dropdownlst{display:block;z-index:99997;} .\:cusdropdown input[type="checkbox"]:checked + .cusdropdown_ctrl + .droparrow{margin-top:16px;} .\:cusdropdown input[type="checkbox"]:checked + .cusdropdown_ctrl + .droparrow:after{content: ""; position: absolute; top: -8px; right: 23px; width: 13px; height: 13px; border: solid 1px #dadada; transform: rotate(-45deg); border-bottom: none; border-left: none; background-color: #fff;} ul.droparrow li{position:relative; z-index:1;} ul.dropdownlst{border-radius: 3px; background-color: #ffffff; border: solid 1px #dadada; padding:0px; right:0; left:auto; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.18); list-style-type:none;} ul.dropdownlst li{margin-bottom:0; padding:0;} ul.dropdownlst li > a{padding:8px 12px; display:block;color:#4a4548; } ul.dropdownlst.arrow{top:44px;} ul.dropdownlst.arrow:before {content: ""; position: absolute; top: -12px; border-radius: 2px; width: 16px; height: 16px; background-color: #fff; transform: rotate(45deg); border: solid 1px transparent; border-top-color: rgba(0, 0, 0, 0.18); right: 4px; border-left-color: rgba(0, 0, 0, 0.18); transform-origin: top left; border-right: none; border-bottom: none;} ul.dropdownlst li + li{ border-top: solid 1px #e9e9e9;} /********** Modal Pupup CSS **********/ .\:modalwrap{position:fixed; top:0; left:0; bottom:0; right:0; display:none;z-index: 99998; font-size:14px;} .rightani{display:block; opacity:0; z-index:-1;} .\:modalwrap .\:modalclose{position: absolute;top: 8px;right: 10px;margin-right:0px; cursor:pointer;} .\:modalwrap:after{content:"";position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.8);} .\:modalwrap .\:modalwrap-content{width: 80%; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); background-color: #fff; z-index: 2; padding: 16px; border-radius: 6px; max-height: 80%; overflow: auto;} input.popupinput[type="checkbox"]:checked + .\:modalwrap{ display:block;} input.popupinput[type="checkbox"]:checked + .rightani{z-index:9991; opacity:1;} input.popupinput[type="checkbox"]:checked + .rightani .\:modalwrap-content{ right:0;} .rightani .\:modalwrap-content{width: 80%; position: absolute; top: 5%; right: -100%; background-color: #fff; z-index: 2; padding: 16px;border-radius: 6px; max-height: 90%; overflow: auto; transition: all 0.5s ease;transform: none; left: auto;} .headfootfix .modal-body{height:400px; overflow:auto;} .\:modalwrap .posoverlay{z-index:1;} .\:modalwrap .wd60{width:60%;} .\:modalwrap .wd40{width:40%;} .\:modalwrap .wd25{width:25%;} .\:popclose{position: absolute; right: 0; top: 8px;} /********** Custom Hide Show Function CSS **********/ .lblctrl{cursor:pointer; z-index:3; margin-bottom: 0;} label.nobold{font-weight:normal;} input.popupinput:checked + ._lbcactivelabel > ._hideshowlbl,input.popupinput + ._lbcactivelabel > ._hideshowlbl + ._hideshowlbl{display:none;} input.popupinput:checked + ._lbcactivelabel > ._hideshowlbl + ._hideshowlbl{display:inline-block;} input.popupinput + .hiddenctrl + .posfixed,input.popupinput + .hiddenctrl,input.popupinput + ._lbcactivelabel + .hiddenctrl{display:none;} input.popupinput:checked + .hiddenctrl,input.popupinput:checked + ._lbcactivelabel + .hiddenctrl{display:block;z-index:99997;} input.popupinput:checked + .hiddenctrl + .posfixed,.\:cusdropdown input[type="checkbox"]:checked + .cusdropdown_ctrl + .dropdownlst + .posfixed,.screenfixed,input.popupinput:checked + ._lbcactivelabel + .hiddenctrl + .posfixed{position:fixed; z-index:99996;display:block;} /***** Sliding Effect for Hide & Show ********/ input.popupinput + .hiddenctrl.slide,input.popupinput + ._lbcactivelabel + .hiddenctrl.slide{max-height: 0; transition:all 0.5s; overflow: hidden; overflow-y:auto; display:block} input.popupinput:checked + .hiddenctrl.slide,input.popupinput:checked + ._lbcactivelabel + .hiddenctrl.slide{max-height: 450px;} /********** Similar Height CSS **********/ .similar_heightwrap{float: left; overflow: hidden;} .similar_heightwrap .\:first-column{float: left; padding-bottom: 500px; margin-bottom: -500px;} .similar_heightwrap .\:second-column{float: left; padding-bottom: 500px; margin-bottom: -500px;} .vheight{height: 100%;} .problem-box .tooltip-inner {padding: 15px 18px; max-width: 258px;} /**####### TExt Arae fill content ##########**/ .fillsample-blk{position: relative;} .fillsample-blk > a{position: absolute; bottom: 8px; right:16px; color:#666; text-decoration: underline;} .fillsample-blk > a:hover{color:#333;} /****########## Form Control Style ###################***/ textarea.form-control{min-height: 100px;} .basicinput{padding:5px 12px; padding-bottom: 4px; background: #fff; border:solid 1px #e5e5e5; font-size: 14px ;} .form-control:focus{border-color:#999;} .custom-form-control,.form-control1{box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.07); padding: 12px 12px; border-radius: 3px; background: #ffffff; border:none; text-align: left; height:auto; font-size:14px;} .form-control2{padding: 12px 0px; border-radius: 0px; background: #ffffff; border:none; text-align: left; border-bottom: solid 1px #e5efe5;} .arrow-icon{transition: all 0.5s;} .custom-dropdown-wrap.show .arrow-icon,.custom-dropdown-wrap.show .action{transform: rotate(180deg);} /**###### Tag Style CSS #########**/ .iconwrap{position: relative;} .iconwrap > .form-control{padding-left:50px;} .iconwrap.right > .form-control{padding-left:15px; padding-right:50px;} .iconwrap > .form-control-icon{position: absolute; left: 9px; top:50%; margin-top: -16px; width:32px; height: 32px; color:#dadada;} .role-search + .dropdown-menu{width:100%;box-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.1);} .iconwrap.right > .form-control-icon{right:9px; left:auto;} .dropdown-menu{box-shadow: 0 9px 10px 0 rgba(0, 0, 0, 0.1); border-radius: 3px; border-color:#fff} .dropdown-menu .dropdown-item.active,.role-search + .dropdown-menu .dropdown-item:active,.role-search + .dropdown-menu .dropdown-item:hover{background-color: transparent; color: #333333;} .dropdown-menu .dropdown-item strong{color: #333333;} .dropdown-menu .dropdown-item{color: #666666; background-color: transparent; padding: 4px 16px; font-size:14px;} /**######## Select ##########*/ .select{position: relative; display:block;} .select select{ width:100%; border:0; font-family:'lato', Arial, Helvetica, sans-serif; background: #fff; padding:14px 12px; padding-bottom: 13px; font-size:14px; color:#999; position:relative; border-radius:3px; box-shadow:0 1px 2px 0 rgba(0, 0, 0, 0.07);} .select select .selected-option { color:#555;} .select:after{background: #fff url(dropdown-arr.png) no-repeat center;position: absolute;width:32px;top: 1px;content: "";right: 1px;text-align: center;bottom: 1px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; pointer-events: none;} .select select{ -webkit-appearance: none; -moz-appearance: none; text-indent: 1px; text-overflow: '';} .select select::-ms-expand{ display:none;} .select select:hover,.form-control1:hover,.custom-form-control:hover{box-shadow: 0 30px 30px 0 rgba(0, 0, 0, 0.1);} .select.disabled{border-color: #cccccc; opacity: 1; background: #cccccc;} .select.disabled:after,.footer-ticker.fafafa{background-color: #fafafa;} .select.disabled select{background: #fafafa; color: #333; padding:12px; padding-top:13px; border: solid 1px #ccc; pointer-events: none;} .select.default select{padding: 9px 12px; padding-bottom: 8px; border: solid 1px #e5e5e5; box-shadow: none;} .select.default.lh32 select{padding:5px 12px; padding-bottom: 4px;} ._search{position: relative; display:block;} ._search:after{background: #fff url(https://www.techgig.com/files/contest_upload_files/search-icon-180520.png) no-repeat center; position: absolute; width:32px; top: 1px; content: ""; left: 1px; text-align: center; bottom: 1px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; pointer-events: none;} ._search .chosen-container.chosen-container-single .chosen-single{padding-left:35px;} ._search .chosen-container .chosen-results li.highlighted{color:#4a4548; background: #fff;} ._search .chosen-container .chosen-results{max-height:150px;} /******** Custom Checkbox CSS ***************/ .checkbox-input {position:relative; display:block; padding-left:24px;} .checkbox-input input[type=checkbox],.checkbox-input input[type=radio]{display: none;} .checkbox-input i{-webkit-transition: border-color .28s ease; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; color: #cccccc; height: 16px; left: 0; top: 2px; transition: border-color .28s ease; width: 16px; z-index: 0; border: 1px solid; position: absolute;} .checkbox-input i:after,.checkbox-input i:before {height: 0; width: 2px; background: #ffffff; transform-origin: left top; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; content: ""; opacity: 0; position: absolute;} .checkbox-input i:before{transform: rotate(-138deg);} .checkbox-input i:after{transform: rotate(-45deg);} .checkbox-input input[type=checkbox]:checked + label i,.checkbox-input input[type=radio]:checked + label i{background-color: #d7263d; border-color:#d7263d;} .checkbox-input input[type=checkbox]:checked + label i:before,.checkbox-input input[type=radio]:checked + label i:before{height: 12px; opacity: 1; transition-delay: .28s; transition: height .28s ease; top: 12px; left: 6px;} .checkbox-input input[type=checkbox]:checked + label i:after,.checkbox-input input[type=radio]:checked + label i:after {-webkit-transition: height .28s ease; height: 6px; opacity: 1; transition: height .28s ease; top: 7px; left:1px; transform: rotate(-45deg);} .checkbox-input.checkbox-inline { display:inline-block; margin-left:0; margin-bottom:10px; margin-right:20px;} /*** #### Input 2 ######****/ .checkbox-input.checkbox2 i{border-radius: 50%; border-width: 2px;} .checkbox-input.checkbox2 input[type=checkbox]:checked + label i{background-color: #26d974; border-color: #26d974;} /*** #### Input 24 ######****/ .checkbox24{padding-left: 32px;} .checkbox24 i{border-radius: 50%; border-width: 2px; width:24px; height: 24px;} .checkbox24 label{margin-top: 4px;} .checkbox24 input[type=checkbox]:checked + label i,.checkbox24 input[type=radio]:checked + label i{background-color: #26d974; border-color: #26d974;} .checkbox24 input[type=checkbox]:checked + label i:before,.checkbox24 input[type=radio]:checked + label i:before{height: 13px; top: 16px; left: 9px;} .checkbox24 input[type=checkbox]:checked + label i:after,.checkbox24 input[type=radio]:checked + label i:after {height: 7px; top: 11px; left:3px;} /******** Custom Radio CSS ***************/ .radio-input{ position:relative; display:block; padding-left:26px;} .radio-input input[type=radio]{display: none;} .radio-input label,.checkbox-input label{margin-bottom: 0;} .radio-input.rh{padding-left:0; padding-right:22px;} .radio-input.radio-inline{ display:inline-block; margin-left:0; margin-right:16px;} .radio-input i{border-radius: 50%; color: #cccccc; height: 18px; left: 0; top: 1px; transition: all .28s ease; width: 18px; z-index: 0; border: 1px solid; position: absolute;} .radio-input input[type=radio]:checked + label i{background-color: #ffffff; border: 3px solid #d7263d;} .radio-input i:after{content:""; height:0; width: 0; border-radius: 50%; position: absolute; top: 50%; left: 50%; position: absolute; transform: translate(-50%,-50%);} .radio-input input[type=radio]:checked + label i:after{width:12px; height: 12px; border:solid 2px #fff; background-color: #d7263d; transition: border 0.28s;} /*** #### Input 2 ######****/ .radio-input.radio2 input[type=radio]:checked + label i{background-color: #ffffff; border: 3px solid #d7263d;} .radio-input.radio2 i:after{content:""; height:0; width: 0; border-radius: 50%; position: absolute; top: 50%; left: 50%; position: absolute; transform: translate(-50%,-50%);} .radio-input.radio2 input[type=radio]:checked + label i:after{width:12px; height: 12px; border:solid 2px #fff; background-color: #d7263d; transition: border 0.28s;} /******** Radio Switch CSS ***************/ .switch-component .switch {position: relative; display: inline-block; width: 34px; height: 14px; margin-bottom: 0;} .switch-component .switch input { opacity: 0; width: 0; height: 0;} .switch-component .slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color:#f1f3f4; -webkit-transition: .4s; transition: .4s;} .switch-component .slider:before {box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.24), 0 0 1px 0 rgba(0, 0, 0, 0.12); position: absolute; content: ""; height: 20px; width: 20px; left: 0px; bottom: -3px; background-color: #bdbdbd; -webkit-transition: .4s; transition: .4s;} .switch-component input:checked + .slider { background-color: rgba(38,217,116,0.5);} .switch-component input:focus + .slider { box-shadow: 0 0 1px #2196F3;} .switch-component input:checked + .slider:before {background: #26d974; -webkit-transform: translateX(15px); -ms-transform: translateX(15px); transform: translateX(15px);} .switch-component .slider.round {border-radius: 34px;} .switch-component .slider.round:before {border-radius: 50%;} /******** ./Radio Switch CSS ***************/ /*Checkbox coding */ /***######## Tab coding #############***/ .contest-setting-tab.nav-tabs .nav-item .nav-link.active{border-radius: 3px; box-shadow: 0 9px 10px 0 rgba(0, 0, 0, 0.1);background-color:#fff; color:#333;} .contest-setting-tab.nav-tabs .nav-item .nav-link:hover{color:#666;} .contest-setting-tab .nav-tabs .nav-item.show .nav-link{border-color: transparent;} .contest-setting-tab .nav-link{padding: 10px 15px; padding-bottom: 9px; border:transparent; border:none;color:#cccccc; font-size:14px; text-transform:uppercase;font-weight:bold; min-width: 120px; text-align: center;} .contest-setting-tab, .nav-tabs{border-bottom:none;} .tabs3.nav-tabs{position: relative; z-index: 3;} .tabs3.nav-tabs:after{content:""; position: absolute; left:0; right:0; bottom:0; border-bottom: solid 2px #f1f3f4;} .tabs3.nav-tabs .nav-link{border:none; color:#5f6367; position: relative; padding: 13px 16px; background-color:transparent; } .tabs3.nav-tabs .nav-link:hover,.tabs3.nav-tabs .nav-link.active{color:#19171a;} .tabs3.nav-tabs .nav-link.active{font-weight: 600;} .tabs3.nav-tabs .nav-link.active:after{position: absolute; content: ""; border-bottom: solid 2px #19171a; width: 100%; left: 0; bottom: 1px; z-index: 2;} /****###### Tabs Structure ##############***/ .tabs4 .nav-link{border-radius: 0; border:solid 1px #e5e5e5; color:#666;} .tabs4 .nav-link.active{color:#333} .tabs4 .nav-item + .nav-item .nav-link{border-left:none;} .tabwrap .tab-content{padding:16px 8px; border:solid 1px #e5e5e5;} /***######## Tab coding #############***/ /****########## Form Control Style ###################***/ /****########## Button Style ###################***/ /***************** Custom Browse button ********************/ .wrap-file_upload{position:relative; display:inline-block;} .wrap-file_upload .btn_colorlayer,.wrap-file_upload:hover .btn_colorlayer{position: absolute; left: 102%; padding-left: 8px; max-width: 120px; white-space: nowrap;text-overflow: ellipsis; overflow: hidden; color:#d7263d;top: 50%; margin-top: -8px; text-transform: none; pointer-events:none; } .wrap-file_upload input[type="file"]{opacity: 0; display: inline; position: absolute; left: 0; top: 0; width: 230px; bottom: 0;} .wrap-file_upload .btn_lbl{pointer-events: none;} /**$$$$$ Primary Button Style $$$$$$$$***/ .btn.disabled,a.btn[href="#"],a.btn[href=""],.disabled{opacity: 0.5;} .btn.disabled,a.btn[href="#"],a.btn[href=""],.disabled{pointer-events:none;cursor:default;} /*** **/ .btnicon{height: 32px; width: 32px; border-radius: 50%; box-shadow: none; background-color: #e95455; min-width: auto; padding: 4px 0; font-size: 14px; font-weight: normal; color: #fff;} .btnicon:hover{color:#fff;} /****########## Button Style ###################***/ .min160{min-width:160px;} /****########## Button width ###################***/ /*******######### Tag Listing #######****/ .tag-listing{margin: 0; padding:0; list-style-type: none; display: flex; flex-flow:row wrap; margin-left:-4px;} .tag-listing.text-center{justify-content: center;} .tag-listing li{margin-left: 4px; margin-right: 4px; margin-bottom: 8px;} .tag-listing li:first-child{margin-left: 0;} .tag-listing li a{border-radius: 16px; border: solid 1px #999999; color: #999999; padding:7px 16px; text-decoration: none; background-color: #fafafa; display: block; line-height: 1; opacity: 0.5;} .tag-listing li.selected a,.tag-listing li.selected a:hover{background: #333333; color:#fff; border-color:#333; opacity: 1;} .tag-listing li a:hover{color: #666666; border-color:#666; opacity: 1;} .tag-listing.disabled{pointer-events: none;} .tag-listing.disabled li a{opacity: 1;} .skilllisting.tag-listing{margin: 0; padding:0; list-style-type: none; display: flex; flex-flow:row wrap;} .skilllisting.tag-listing li{margin-bottom: 16px;} .skilllisting.tag-listing.nomargin li{margin-bottom: 0;} .skilllisting.tag-listing li a{background-color: #f2f2f2; opacity: 1; font-size: 10px; border-color: transparent; padding: 4px 10px; color: #666; text-transform: uppercase; font-weight: bold;} /************ Pure CSS ICONs *******************/ .\:icon{width:18px; height:18px; font-style:normal; display:inline-block;vertical-align: top; margin-right: 5px;} .\:checkbox{position:relative; border:solid 2px #dadada; border-radius:50%; width:24px; height:24px; } .\:checked,.input-boolen:checked + .\:checkbox{ background-color:#26d974; border-color:#0cc071;} .\:checked:after,.input-boolen:checked + .\:checkbox:after{content: ""; width: 13px; height: 7px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: left top; transform-origin: left top;-webkit-animation: checkAnimation .1s; animation: checkAnimation .1s; position: absolute; top: 50%; left: 50%; margin-left: -7px;} @-webkit-keyframes checkAnimation{ 0%{height:0;width:0} 50%{height:4px;width:0} to{height:4px;width:8px} } @keyframes checkAnimation{ 0%{height:0;width:0} 50%{height:4px;width:0} to{height:4px;width:8px} } .icon-toggle{width: 24px; height: 24px; display: inline-block; padding: 4px;} .icon-toggle i{width: 4px; height: 100%; display: block; margin: auto; position: relative;} .icon-toggle:after,.icon-toggle i:after, .icon-toggle i:before{content: "";width: 4px;background: #999;border-radius: 50%;height: 4px;display: block;margin: auto;margin-bottom: 2px;} .icon-toggle:after {margin-top: -4px;} label.close{opacity:1;} .icon-arr{width: 0px; border: solid 4px transparent; height: 0; font-size: 0; line-height: 0; display: inline-block;} .icon-arr.ileft{border-left-color:#d7263d;} .icon-arr.iright{border-right-color:#d7263d;} .icon-arr.itop{border-top-color:#d7263d;border-bottom: none;} .icon-arr.ibot{border-bottom-color:#d7263d;border-top: none;} .radio-chk{position:relative; width:16px; height:16px; display:inline-block; margin-right:8px; margin-bottom: -2px;} .nocircle-tick.radio-chk::before{content:none;} .nocircle-tick.radio-chk::after{border-left-color: #08d37a; border-bottom-color: #08d37a;width: 12px;} .radio-chk.border1:after{border-width:1px;} .radio-icon{border: solid 1px #dadada; border-radius: 50%; background-color: #fff; margin-bottom: -3px;} .radio-chk.radio-icon:before,.radio-chk.radio-icon:after{content:none;} .radio-chk:before,.radio-chk:after{content:""; position:absolute; width:16px; height:16px; left:0; top:2px;border: solid 1px transparent;} .radio-chk:before{border-radius:50%; background-color:#00d681;border-color:#12c772;} .radio-chk:after{height: 6px; width: 10px; border: solid 2px transparent; border-left-color: #fff; border-bottom-color: #fff; transform: rotate(-49deg); top: 5px; left: 3px; border-radius: 0;} .notverify .radio-chk:before,.radio-chk.unselected:before{background-color: #fff; border-color: #dadada;} .notverify .radio-chk:after,.radio-chk.unselected:after{border-left-color: #dadada; border-bottom-color: #dadada;} .vflip{transform:rotate(180deg)} .icon-cross{position:relative; width:16px; height:16px; transform: rotate(-45deg); display:inline-block;background-color: #ff0000;border-radius:50%;} .icon-cross.\:modalclose{width:24px; height: 24px;} .nocircle-cross.icon-cross{background:transparent;} .icon-cross:before,.icon-cross:after{content: ""; position: absolute; width: 2px; height: 20px; top: 3px; background-color: #fff; left: 7px;} .small.icon-cross:before,.small.icon-cross:after{height: 14px; top:1px;} .icon-cross:after{transform: rotate(-90deg);} .nocircle-cross.icon-cross:after,.nocircle-cross.icon-cross:before{background-color: #e80000;} .icon-cross.close-iocn{background-color:transparent;} .icon-cross.close-iocn:after,.icon-cross.close-iocn:before{background-color: #7a7f8a;} .icon-cross.btn-cross{background-color:transparent;} .icon-close:before, .icon-close:after{background-color:#adaaaa;} .icon-chevron-arr{display: inline-block; width:16px; height: 16px;} .icon-chevron-arr:after{content:""; width: 9px; border: solid 2px transparent; height: 9px; font-size: 0; line-height: 0; display: inline-block; position: relative; border-right: none; border-top: none; margin-bottom: 4px; transition: all 0.5s; border-bottom-color: #dadada; border-left-color: #dadada;transform-origin: left;} .icon-chevron-arr.down:after{transform: rotate(-45deg); margin-left:3px;margin-bottom: 3px;} .icon-chevron-arr.up:after{transform: rotate(135deg);margin-bottom:4px;margin-left: 4px;} /*########### 5 point stars ################*/ .icon-star {position: relative; display: block; color: red; width: 0px; height: 0px; border-right: 8px solid transparent; border-bottom: 5px solid red; border-left: 8px solid transparent; transform: rotate(30deg); transform-origin: left;} .icon-star:before {border-bottom: 7px solid red; border-left: 3px solid transparent; border-right: 3px solid transparent; position: absolute; height: 0; width: 0; top: -5px; left: -5px; display: block; content: ''; transform: rotate(-32deg);} .icon-star:after {position: absolute; content:""; display: block; color: red; width: 0px; height: 0px; border-right: 8px solid transparent; border-bottom: 5px solid red; border-left: 8px solid transparent; transform: rotate(-63deg); left: -8px;top: 0px;} .wraplength{position: relative;} .wraplength input{padding-right: 70px;} .wraplength .lnthcount{color:#9aa0a6; font-size: 14px; position: absolute; right:8px; font-weight: 500;} .wraplength.INPUT .lnthcount{top: 50%; transform: translateY(-50%);} .wraplength.TEXTAREA .lnthcount{bottom:8px;} .pageheader{padding-bottom: 14px; display:inline-block;} /******* Progress Bars ****************/ .progress-circle {font-size: 20px; position: relative; padding: 0; width: 64px; height: 64px; background-color: #F2E9E1; border-radius: 50%; line-height: 64px;} .progress-circle:after{border: none; position: absolute; top: 5px; left: 5px; text-align: center; display: block; border-radius: 50%; width: 54px; height: 54px; background-color: white; content: " ";} .progress-circle .value{position: absolute; line-height: 64px; width: 64px; text-align: center; display: block; color: #53777A; z-index: 2;} .left-half-clipper {border-radius: 50%; width: 64px; height: 64px; position: absolute; clip: rect(0, 64px, 64px, 32px); top:0; left:0} .value-bar {background-color: #0FC35D; border-color: #0FC35D;} .progress-circle.over50 .left-half-clipper {clip: rect(auto,auto,auto,auto);} .value-bar {position: absolute; clip: rect(0, 32px, 64px, 0); width: 64px; height: 64px; border-radius: 50%; border: 5px solid transparent; box-sizing: border-box;} .progress-circle.over50 .first50-bar {position: absolute; clip: rect(0, 64px, 64px, 32px); background-color: #0FC35D; border-radius: 50%; width: 64px; height: 64px;} .progress-circle:not(.over50) .first50-bar{ display: none; } /* Progress bar rotation position */ .progress-circle.p0 .value-bar { display: none; } .progress-circle.p1 .value-bar { transform: rotate(4deg); } .progress-circle.p2 .value-bar { transform: rotate(7deg); } .progress-circle.p3 .value-bar { transform: rotate(11deg); } .progress-circle.p4 .value-bar { transform: rotate(14deg); } .progress-circle.p5 .value-bar { transform: rotate(18deg); } .progress-circle.p6 .value-bar { transform: rotate(22deg); } .progress-circle.p7 .value-bar { transform: rotate(25deg); } .progress-circle.p8 .value-bar { transform: rotate(29deg); } .progress-circle.p9 .value-bar { transform: rotate(32deg); } .progress-circle.p10 .value-bar { transform: rotate(36deg); } .progress-circle.p11 .value-bar { transform: rotate(40deg); } .progress-circle.p12 .value-bar { transform: rotate(43deg); } .progress-circle.p13 .value-bar { transform: rotate(47deg); } .progress-circle.p14 .value-bar { transform: rotate(50deg); } .progress-circle.p15 .value-bar { transform: rotate(54deg); } .progress-circle.p16 .value-bar { transform: rotate(58deg); } .progress-circle.p17 .value-bar { transform: rotate(61deg); } .progress-circle.p18 .value-bar { transform: rotate(65deg); } .progress-circle.p19 .value-bar { transform: rotate(68deg); } .progress-circle.p20 .value-bar { transform: rotate(72deg); } .progress-circle.p21 .value-bar { transform: rotate(76deg); } .progress-circle.p22 .value-bar { transform: rotate(79deg); } .progress-circle.p23 .value-bar { transform: rotate(83deg); } .progress-circle.p24 .value-bar { transform: rotate(86deg); } .progress-circle.p25 .value-bar { transform: rotate(90deg); } .progress-circle.p26 .value-bar { transform: rotate(94deg); } .progress-circle.p27 .value-bar { transform: rotate(97deg); } .progress-circle.p28 .value-bar { transform: rotate(101deg); } .progress-circle.p29 .value-bar { transform: rotate(104deg); } .progress-circle.p30 .value-bar { transform: rotate(108deg); } .progress-circle.p31 .value-bar { transform: rotate(112deg); } .progress-circle.p32 .value-bar { transform: rotate(115deg); } .progress-circle.p33 .value-bar { transform: rotate(119deg); } .progress-circle.p34 .value-bar { transform: rotate(122deg); } .progress-circle.p35 .value-bar { transform: rotate(126deg); } .progress-circle.p36 .value-bar { transform: rotate(130deg); } .progress-circle.p37 .value-bar { transform: rotate(133deg); } .progress-circle.p38 .value-bar { transform: rotate(137deg); } .progress-circle.p39 .value-bar { transform: rotate(140deg); } .progress-circle.p40 .value-bar { transform: rotate(144deg); } .progress-circle.p41 .value-bar { transform: rotate(148deg); } .progress-circle.p42 .value-bar { transform: rotate(151deg); } .progress-circle.p43 .value-bar { transform: rotate(155deg); } .progress-circle.p44 .value-bar { transform: rotate(158deg); } .progress-circle.p45 .value-bar { transform: rotate(162deg); } .progress-circle.p46 .value-bar { transform: rotate(166deg); } .progress-circle.p47 .value-bar { transform: rotate(169deg); } .progress-circle.p48 .value-bar { transform: rotate(173deg); } .progress-circle.p49 .value-bar { transform: rotate(176deg); } .progress-circle.p50 .value-bar { transform: rotate(180deg); } .progress-circle.p51 .value-bar { transform: rotate(184deg); } .progress-circle.p52 .value-bar { transform: rotate(187deg); } .progress-circle.p53 .value-bar { transform: rotate(191deg); } .progress-circle.p54 .value-bar { transform: rotate(194deg); } .progress-circle.p55 .value-bar { transform: rotate(198deg); } .progress-circle.p56 .value-bar { transform: rotate(202deg); } .progress-circle.p57 .value-bar { transform: rotate(205deg); } .progress-circle.p58 .value-bar { transform: rotate(209deg); } .progress-circle.p59 .value-bar { transform: rotate(212deg); } .progress-circle.p60 .value-bar { transform: rotate(216deg); } .progress-circle.p61 .value-bar { transform: rotate(220deg); } .progress-circle.p62 .value-bar { transform: rotate(223deg); } .progress-circle.p63 .value-bar { transform: rotate(227deg); } .progress-circle.p64 .value-bar { transform: rotate(230deg); } .progress-circle.p65 .value-bar { transform: rotate(234deg); } .progress-circle.p66 .value-bar { transform: rotate(238deg); } .progress-circle.p67 .value-bar { transform: rotate(241deg); } .progress-circle.p68 .value-bar { transform: rotate(245deg); } .progress-circle.p69 .value-bar { transform: rotate(248deg); } .progress-circle.p70 .value-bar { transform: rotate(252deg); } .progress-circle.p71 .value-bar { transform: rotate(256deg); } .progress-circle.p72 .value-bar { transform: rotate(259deg); } .progress-circle.p73 .value-bar { transform: rotate(263deg); } .progress-circle.p74 .value-bar { transform: rotate(266deg); } .progress-circle.p75 .value-bar { transform: rotate(270deg); } .progress-circle.p76 .value-bar { transform: rotate(274deg); } .progress-circle.p77 .value-bar { transform: rotate(277deg); } .progress-circle.p78 .value-bar { transform: rotate(281deg); } .progress-circle.p79 .value-bar { transform: rotate(284deg); } .progress-circle.p80 .value-bar { transform: rotate(288deg); } .progress-circle.p81 .value-bar { transform: rotate(292deg); } .progress-circle.p82 .value-bar { transform: rotate(295deg); } .progress-circle.p83 .value-bar { transform: rotate(299deg); } .progress-circle.p84 .value-bar { transform: rotate(302deg); } .progress-circle.p85 .value-bar { transform: rotate(306deg); } .progress-circle.p86 .value-bar { transform: rotate(310deg); } .progress-circle.p87 .value-bar { transform: rotate(313deg); } .progress-circle.p88 .value-bar { transform: rotate(317deg); } .progress-circle.p89 .value-bar { transform: rotate(320deg); } .progress-circle.p90 .value-bar { transform: rotate(324deg); } .progress-circle.p91 .value-bar { transform: rotate(328deg); } .progress-circle.p92 .value-bar { transform: rotate(331deg); } .progress-circle.p93 .value-bar { transform: rotate(335deg); } .progress-circle.p94 .value-bar { transform: rotate(338deg); } .progress-circle.p95 .value-bar { transform: rotate(342deg); } .progress-circle.p96 .value-bar { transform: rotate(346deg); } .progress-circle.p97 .value-bar { transform: rotate(349deg); } .progress-circle.p98 .value-bar { transform: rotate(353deg); } .progress-circle.p99 .value-bar { transform: rotate(356deg); } .progress-circle.p100 .value-bar { transform: rotate(360deg); } /** ######### GDPR ##############***/ .gdpr-info{padding:10px 16px; background: #FFFFFF; box-shadow: 0px -3px 10px rgba(0, 0, 0, 0.1); color:#4A4548; line-height:20px; font-size:13px; position: fixed; bottom: -103%; transition:all 0.5s; width: 100%; z-index:10000;} .gdpr-info.open{bottom:0;} .gdpr-info.open.gclose{bottom:-103%;} .gdpr-info .underline{text-decoration:underline; color:#4A4548; font-weight: bold; text-underline-offset: 2px; text-decoration-thickness: 1px;} .gdpr-btn{background-color: #ffffff; color:#19171a;} /** ######### /GDPR ##############***/ .nointernetbar{background:#19171a;line-height:48px;position:fixed;bottom:0;left: 0;right: 0;color: #fff;z-index:10001} @media only screen and (min-width: 767px){ .mobile-dropdown-view .btn{display: none;} } @media only screen and (max-width: 767px){ .star-icon{left: 0; top: -37px; box-shadow: 0px -4px 2px 2px rgb(0 0 0 / 10%); border-top-right-radius: 6px; border-bottom-left-radius: 0;} .googlechamp{width: calc(100% - 32px); right: 8px !important; bottom: -130px; transition:bottom 0.5s;} /*--- Mobile-dropdown-view --- */ .mobile-dropdown-view { position:relative;} .mobile-dropdown-view .btn { width:100%; position:relative; padding-right:32px; text-align:left; height:40px; margin-bottom:16px; color:#4a4548; background:#fff; box-shadow:none; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.25); border:0; line-height:27px; overflow: hidden; text-overflow: ellipsis;} .fixed .mobile-dropdown-view .btn { margin-bottom:0;} .mobile-dropdown-view .btn:after {z-index:5;pointer-events:none;display:block;position:absolute;right: 8px;top: 50%;width: 10px;height: 10px;content:"";border-bottom: solid 1px #000;border-left: solid 1px #000;margin-top: -5px;transform: rotate(-45deg);transform-origin: left;} .tabs1 .tabs2 .mobile-dropdown-view .btn { box-shadow:none; border:1px solid #dadada;} .tabs1 .tabs2 .mobile-dropdown-view ul > li a { padding:12px;} .tabs1 .magic-line { display:none !important;} .mobile-dropdown-view ul,.mobile-dropdown-view ul.tabs3.nav-tabs { position:absolute; border:1px solid #dadada; z-index:15; top:0; box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.1); width:100%; display:none; max-height:210px; overflow:auto; border-radius:3px; background: #fff;} .mobile-dropdown-view ul li { float:none; display:block; width:100% !important; border:none !important; } .mobile-dropdown-view ul li.active { border:none;} .mobile-dropdown-view ul > li { width:100%; margin-bottom:0 !important;} .mobile-dropdown-view ul > li a, .tabs1 .mobile-dropdown-view ul > li a { display:block; padding:11px; line-height:14px; border:0; font-size:14px; color:#8a858d; text-align:left; white-space:nowrap; background:#fff; border:0 ;} .mobile-dropdown-view ul > li.active a:hover { background:#f2f2f2 !important; border:0;} .mobile-dropdown-view ul > li.active a, .mobile-dropdown-view ul > li a:hover, .tabs1 .mobile-dropdown-view ul > li.active a, .tabs1 .mobile-dropdown-view ul > li a:hover, .mobile-dropdown-view ul > li a:active, .mobile-dropdown-view ul > li.active a:hover { background:#f2f2f2 !important; border:0; font-weight:normal; color:#4a4548 !important;} .tabs3.nav-tabs .nav-link.active:after{border-color: transparent;} .\:modalwrap .\:modalwrap-content{width:80%} .ctrlcenter.mobileoptimize:not(.sm){display:block;} .mobileoptimize > .fctrl{margin-right: 0px; margin-top:8px;} }