/* Designed by LoKiem */
@charset "UTF-8"; @import url("https://fonts.googleapis.com/css?family=Encode+Sans+Semi+Condensed"); html{ font-size: 15px; font-family: "Encode Sans Semi Condensed", sans-serif; scroll-behavior: smooth; background-color: #F2F2F2; } *, :after, :before{box-sizing:border-box} body{ margin: auto; padding: 0; color: #333333; overflow-x: hidden; } img{ width: auto; height: auto; margin: 0; max-width: 100%; padding: 0; vertical-align: middle; } .image-caption{ display: block; font-size: small; color: gray; padding: 2px 5px 15px 5px } .user-avatar{ border-radius: 50%; } .user-avatar>img{ border-radius: 50%; object-fit: cover; width: 50px; height: 50px; box-shadow: 0 0 1px #666; } a:link, a:visited, a:active{ color: #444444; text-decoration: none } a:hover{ color: #02A2DB; } .link,a{cursor: pointer} .primary-color{ color: #02A2DB !important; } .primary-actived{ color: #02A2DB !important; border-bottom: 1px solid #02A2DB !important; } .primary-bg{ color: #FFFFFF !important; background-color: #02A2DB !important } .primary-hover:hover{ background-color: #02ABE7 !important; color: #FFFFFF !important; } .primary-border{ border-bottom: 1px solid #02A2DB; } #header{ background: #02A2DB; color: #F4F2F2; height: 70px; line-height: 70px; position: fixed; width: 100%; z-index: 199708; top: 0; } .header-fixed{ height: 70px; } #header .logo{ max-height: 60px } .header-right{ max-width: 90%; }  .navbar>ul, .navbar li>ul{ list-style-type: none; padding: 0; margin: 0; } .navbar>ul>li{ position: relative; margin: 0 10px; cursor: pointer; } .navbar>ul>li:first-child{ margin: 0; } .navbar>ul>li:last-child{ margin-right: 0; } .navbar li>a, .navbar li>span{ display: inline-block; color: #F4F2F2; position: relative; word-wrap: break-word; white-space: nowrap; } .navbar li>a:hover, .navbar li>span:hover, .navbar li:hover span, .navbar-icon-actived{ color: #E0D8FF !important; } .navbar .line-run:after{ border-bottom: 1px solid #E0D8FF !important; } .navbar li>ul{ display: none; position: absolute; z-index: 97; top: 70px; line-height: normal; background: #02A2DB; box-shadow: 0 9px 20px 0 rgba(0,0,0,.1);; } .navbar li>ul a{ min-width: 200px; padding: 15px; } .navbar-arrow-icon:after{ content: "\f107"; font-family: FontAwesome; font-style: normal; line-height: normal; } #footer{ background-color: #02A2DB; color: #F4F2F2; overflow: hidden; border-top: 2px solid #02A2DB; padding: 15px; line-height: 1.5 } #footer a{ color: #F4F2F2; } #footer a:hover{ color: #F4F2F2 !important; } #main,.main{ display: block; margin: auto; }  .bd{border:1px solid transparent;} .bd-top{border-top:1px solid transparent;} .bd-bottom{border-bottom:1px solid transparent;} .bd-left{border-left:1px solid transparent;} .bd-right{border-right:1px solid transparent;} .line-run{position: relative} .line-run:after{ display: block; position: absolute; left: 0; right: 0; bottom: 0; width: 0; height: 1px; overflow: hidden; border-bottom: 1px solid #02A2DB; content: ""; transition: all .3s; margin: auto } .line-run:hover:after{width: 100%}  .section{ box-shadow: 0 2px 8px 0 rgba(0,0,0,.2); background-color: #FFFFFF; margin-bottom: 20px; overflow: hidden; } .section-body{ padding: 8px } .section>.heading, .heading-section{ padding: 8px; color: #02A2DB; border-bottom: 1px solid #02A2DB; font-size: 20px; background-color: #FFFFFF; } .heading, .heading-basic, .heading-block, .heading-line, .heading-sharp, .heading-simple{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; }  .heading-basic{ font-size: 25px; padding: 10px 0; color: #333333 }  .heading-simple{ font-size: 22px; padding: 15px; border-bottom: 1px solid #02A2DB; color: #02A2DB; background-color: white }  .heading-block{ font-size: 20px; padding: 8px; color: #FFFFFF; background-color: #02A2DB; }  .heading-line{ position: relative; color: #FFFFFF; } .heading-line>span:before{ content: ""; height: 2px; width: 100%; background: #02A2DB; bottom: 50%; z-index: -1; position: absolute; left:0 } .heading-line>span{ display: inline-block; border-radius: 20px; background: #02A2DB; margin: 0; padding: 8px; font-size: 20px; }  .heading-sharp{ border-bottom: 2px solid #02A2DB; position: relative; } .heading-sharp>span{ display: inline-block; padding: 0 18px; line-height: 50px; position: relative; color: #FFFFFF; background: #02A2DB; font-size: 20px; } .heading-sharp>span:before { border-right: 20px solid transparent; border-bottom: 50px solid #02A2DB; content: ""; display: inline-block; height: 0; position: absolute; right: -20px; top: 0; width: 0; }  select{cursor: pointer;} .form input, .form button, .form select, .form textarea, .form-mrg{ margin-bottom: 5px } .form-hover>.form-item:hover{ background-color: #E9FDFF !important } .input, select, textarea, input[type="text"]{ padding: 10px 12px; border-radius: 3px; font-size: 14px; transition: all .2s ease-in-out; border: 1px solid #DDDDDD; outline: none; vertical-align: middle; } textarea{border-radius: 3px !important;} .input-color{ position: relative; } .input-color span, .input-color i{ position: absolute; color: white; top: 50%; animation: colours 10s infinite; font-style: normal } .input-color span{ pointer-events: none; left: 50%; transform: translate(-50%,-50%); } @keyframes colours { 0% { color: black; } 100% { color: white; } } .input-color input[type="color"]{ min-width: 50px; min-height: 50px; border: 1px solid #DDDDDD; outline: none; vertical-align: middle; cursor: pointer; background: none } .input:focus, select:focus, textarea:focus, input[type="text"]:focus{ border: 1px solid #4AB9D9; box-shadow: 0 0 5px #4AB9D9; } .input-icon{ position: relative; font-size: 14px; } .input-icon>.fa{ position: absolute; top: 50%; left: 5px; pointer-events: none; transform: translate(0,-50%); color: gray; } .input-icon>.input{ width: 100%; padding-left: 25px; } .input-group .input{ border-radius: 3px 0 0 3px !important; border: 1px solid #DDDDDD; border-right: none } .input-group .btn{ border-radius: 0 3px 3px 0 !important; border: 1px solid #DDDDDD; border-left: none } .input-group .input:focus{ box-shadow: none } .input-error, .input-success{ position: relative; } .input-error:after, .input-success:after{ position: absolute; right: 5px; top: 50%; transform: translate(0,-50%); } .input-error input{ width: 100%; box-shadow: 0 0 5px red; } .input-error:after{ color:red; content: "\f00d"; font-family: FontAwesome; } .input-success input{ width: 100%; box-shadow: 0 0 5px green; } .input-success:after{ color:green; content: "\f00c"; font-family: FontAwesome; } .input-search>input{ width: 110px; box-sizing: border-box; background-color: #FFFFFF; border: 1px solid #D5D5D5; border-radius: 10em; padding-right: 25px; transition: all .5s; color: #919191 } .input-search>input:focus { width: 140px; border: 1px solid #3FC8DE; box-shadow: 0 0 5px #3FC8DE; } .input-search>input::placeholder{ color: #919191 } .input-search{ position: relative; display: inline-block; } .input-search>button{ position: absolute; color: #919191; top: 50%; right: 5px; transform: translate(0,-50%);; line-height: normal; outline: none; background: none; border: none; cursor: pointer; } .input-search-full{ padding: 10px 5px; margin: auto; display: block; } .input-search-full>input{ width: 100% !important; } .input-search-large>input{ width: 200px; } .input-search-large>input:focus { width: 230px; } .fa-icon{ min-width: 20px }  .btn, .btn-primary, .btn-danger, .btn-info, .btn-disabled{ padding: 10px 12px; border-radius: 3px; font-size: 14px; border: 1px solid transparent; outline: none; text-align: center; white-space: nowrap; vertical-align: middle; cursor: pointer; line-height: normal; display: inline-block; } .btn-primary{ background-color: #02A2DB; border-color: #02A2DB; color: #FFFFFF !important; } .btn-primary:hover{ background-color: #02ABE7 !important; border-color: #02ABE7 !important; } .btn-danger{ background-color: #D9534F; border-color: #D9534F; color: #FFFFFF !important; } .btn-danger:hover{ background-color: #F54943 !important; border-color: #F54943 !important; } .btn-info{ background-color: #3F5CD6; border-color: #3F5CD6; color: #FFFFFF !important; } .btn-info:hover{ background-color: #4362E5 !important; border-color: #4362E5 !important; } .btn-disabled{ background-color:#E1E1E1 !important; color: #979797 !important; cursor: not-allowed; } .input-disabled, input:read-only{ background-color: #E1E1E1; color: #979797; user-select: none; } input:read-only{ cursor: not-allowed; } input:read-only:focus{ box-shadow: none; } .input-disabled{ cursor: pointer !important; } input,button,select,textarea{ font-family: "Encode Sans Semi Condensed", sans-serif; }  .check{ display: inline-block; position: relative; padding: 2px 2px 2px 32px; cursor: pointer; user-select: none; font-size: 16px; height: 30px; line-height: 30px; } .check input, .switch input{display:none} .check s{ position: absolute; left: 0; top: 50%; height: 25px; width: 25px; background-color: #F8F6F6; border:1px solid #DDDDDD; transform: translate(0,-50%); } .check s:after{ content: ""; position: absolute; display: none; left: 42%; top: 10%; width: 6px; height:15px; border: solid #FFFFFF; border-width: 0 2px 2px 0; transform: rotate(45deg) } .check input:checked ~ s{ background-color: #02A2DB; border: 1px solid #02A2DB !important; } .check input:checked ~ s:after{display:block} .radio s{border-radius: 50%} .switch{ display: inline-block; position: relative; padding: 2px 2px 2px 65px; cursor: pointer; user-select: none; height: 35px; font-size: 16px; line-height: 35px; } .switch>s{ position: absolute; cursor: pointer; top: 50%; left:0; transform: translate(0,-50%); width: 60px; height: 30px; background-color: #DFDDDD; transition: 0.5s; border-radius: 34px; transition: .4s; } .switch>s:after{ position: absolute; content: ""; height: 23px; width: 23px; left: 15px; top:50%; right:1px; background-color: #FFFFFF; border-radius: 50%; transform: translate(-50%,-50%); transition: .4s; } .switch input:checked ~ s{ background-color: #02A2DB; } .switch input:checked ~ s:after{ left: calc(100% - 15px); }  .label-default, .label-primary, .label-success, .label-info, .label-warning, .label-danger{ padding: 2px 7px 2px 7px; font-size: 14px; border-radius: 14px; border: 1px solid transparent; display: inline; text-align: center; } .label-default{ color: white; background-color: #777; border-color: #777; }  .alert-primary, .alert-success, .alert-info, .alert-warning, .alert-danger{ padding: 9px; font-size: 14px; border: 1px solid transparent; word-wrap: break-word }  .panel{ font-size: 14px; border: 1px solid transparent; } .panel-list>.panel, .panel-last{ border-top: none; } .panel-list>.panel:first-child{ border-top: 1px solid transparent; } .panel.panel-no-border{ border-left: none !important; border-right: none !important; } .panel-default{ background-color: #F1F1F1; border-color: #E2E2E2 !important; color: #313131; }  .label-primary, .alert-primary, .panel-primary{ color: #FFFFFF; background-color: #02A2DB; border-color: #02A2DB !important; } .label-success, .alert-success, .panel-success{ color: #3C763D; background-color: #BBF2CF; border-color: #AFE2C1 !important; } .label-info, .alert-info, .panel-info{ color: #31708F; background-color: #C5EEFC; border-color: #B9DFED !important; } .label-warning, .alert-warning, .panel-warning{ color: #8A6D3B; background-color: #FAF2D1; border-color: #EDE5C6 !important; } .label-danger, .alert-danger, .panel-danger{ color: #A94442; background-color: #EBCCD1; border-color: #DEC1C5 !important; }  .panel>.heading{ padding: 9px; border: 1px solid transparent; position: relative; user-select: none; } .panel>.heading.link:after{ content: "\f054"; font-family: FontAwesome; position: absolute; right: 10px; top: 50%; transform: translate(0,-50%); } .panel>.heading.panel-actived:after{ content: "\f078"; } .panel-body{ background-color: #fff; padding: 9px; color: #333333 !important; }  .badge{ padding: 2px 7px 2px 7px; font-size: 14px; border-radius: 30px; border: 1px solid transparent; display: inline; text-align: center; background-color: #02A2DB; color: #FFFFFF; min-width: 25px; }  ul.list{ list-style-type: none; padding: 0 } .list>a{ position: relative; display: block; transition: .4s; color: #39B5C9 !important; border: 1px solid #F4F4F4; padding: 9px; margin-bottom: -1px; background-color: #FFFFFF; font-size: 16px; border-top: none; border-bottom: none; } .list>a:hover{ background-color: #DBF9FF !important; } .list>span, .list>li{ display: block; border: 1px solid #F4F4F4; padding: 9px; margin-bottom: -1px; background-color: #FFFFFF; font-size: 16px; position: relative } .list>span:last-child, .list>li:last-child, .list>a:last-child{ margin-bottom: 1px; } .list>.list-actived{ background-color: #DBF9FF; } .list:hover .list-actived{ background-color: #FFFFFF; } .list .badge{ position: absolute; top: 50%; right: 5px; transform: translate(0, -50%); } .menu, .menu-bg{ border-color: #E7E7E7; padding: 8px; background-color: #FFFFFF; font-size: 15px; word-wrap: break-word; } .menu-bg{ background-color: #F5F5F5 !important; }  .see-more{ display: inline-block; border: 1px solid #02A2DB; padding: 5px 15px 5px 15px; font-size: 16px; border-radius: 20px; color: #02A2DB !important; text-align: center; transition: .3s; } .see-more:hover{ background-color: #02ABE7; color: #FFFFFF !important; }  .table, .table-border, .table-border-top{ border-collapse: collapse; padding: 0; margin: 0 auto; } .table th{ padding: 8px; text-align: inherit; background-color: #A6DBE1 } .table td{ padding: 8px; } .table tr:nth-child(even) td{ background-color: #FFFFFF; } .table tr:nth-child(odd) td{ background-color: #FAFAFA; } .table-border th, .table-border td{ border: 1px solid #EDEDED; } .table-border-top tr{ border-top: 1px solid #EDEDED; } .table tr:hover td{ background-color: #DBF9FF; } .table th{ text-align: inherit; } .table tr.table-actived td{ background-color: #DBF9FF; }  .modal{ top:0; position:fixed; z-index:199709; width:100%; height:100%; overflow:auto; background-color:rgba(0,0,0,0.5); left:0; bottom:0; animation: fadein 0.2s; } .modal .modal-heading{ padding: 12px !important; font-size: 22px; color: #FFFFFF; background-color: #02A2DB; } .modal-body{ position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width: 95%; max-height: 100%; } .modal-content{ margin: 20px 0; background: white } .modal-close, .right-icon{ position: absolute; right: 10px; top: 50%; transform: translate(0,-50%); } .modal-close:after{ content: "\f00d"; font-family: FontAwesome; } .modal-close:hover{ opacity: .7 } @keyframes fadein{ from{ opacity:.1 } to{ opacity:1 } }  .paginate{ list-style-type: none; margin: 0; padding: 10px 0; } .paginate>a, .paginate>span{ display: inline-block; text-align: center; border: 1px solid #02A2DB; color: #02A2DB; padding: 7px; font-size: 14px; margin: 2px; min-width: 35px; background-color: #fff; border-radius: 25px; } .paginate>span, .paginate>a:hover{ background-color: #02A2DB; color: #FFFFFF; border: 1px solid #02A2DB; }  #loading>div{ top:0; left:0; padding-top:50px; position:fixed; z-index:199799; width:100%; height:100%; overflow:auto; background-color:#000; background-color:rgba(0,0,0,0.3); } #loading img{ position:absolute; top:0; left:0; right:0; bottom:0; margin:auto; }  .breadcrumb{ list-style-type: none; padding: 0; margin: 0; display: flex; flex-wrap: nowrap; } .breadcrumb a{ display: inline-block; padding: 15px 0 } .breadcrumb>li{ position: relative; } .breadcrumb>li:after{ content: "\f105"; font-family: FontAwesome; padding: 8px; } .breadcrumb>li:last-child:after{ display: none }  .fixed-button{ position: fixed; bottom: 30px; right: 20px; z-index: 97; } .fixed-button>a{ padding: 5px; display: inline-block; position: relative; border-radius:50%; color: #FFFFFF; width: 55px; height: 55px; background-color: #02A2DB; background-image: linear-gradient(45deg, #02A2DB 0%, #02BDFF 100%); opacity: 1; transition: opacity 0.3s ease-out; } .fixed-button>a:hover{ text-shadow: none; opacity: .7 } .fixed-button>a i, .fixed-button>a img{ position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); font-size: 30px; padding: 6px; } .fixed-button>a img{ border-radius: 50%; width: 55px; height: 55px; object-fit: cover; } .fixed-button>span{ display: inline-block; position: absolute; top: 0; right: -8px; background-color: #02A2DB; background-image: linear-gradient(45deg, #02BDFF 0%, #02A2DB 100%); color: #FFFFFF; border-radius: 50%; min-width: 20px; min-height: 20px; padding: 2px; text-align: center; font-size: 12px; z-index: 1421997 } .fixed-button>nav{ display: none; position: absolute; bottom: 20px; right: 60px; min-width: 180px; } .fixed-button>nav a{ display: block; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; margin-top: 1px; border-radius: 20px; background-color: #02A2DB; background-image: linear-gradient(45deg, #02BDFF 0%, #02A2DB 100%); color: #FFFFFF; padding: 8px 13px; } .fixed-button>nav a:hover{ background-image: linear-gradient(45deg, #02BDFF 30%, #02A2DB 100%); } .fixed-button>nav a sup{color: #FFFFFF;}  .tooltip{ position: relative; display: inline-block; } div.tooltip, section.tooltip{ display: block !important; } .tooltip-body{ font-size: 14px; visibility: hidden; background-color: #39B5C9; color: #FFFFFF; text-align: center; border-radius: 5px; padding: 7px 8px 7px 8px; position: absolute; z-index: 140297; display: inline-block; width: auto; white-space: nowrap; } .tooltip-left .tooltip-body{ top: 50%; right: calc(100% + 5px); transform: translate(0,-50%); } .tooltip-right .tooltip-body{ top: 50%; left: calc(100% + 5px); transform: translate(0,-50%); } .tooltip-bottom .tooltip-body{ top: calc(100% + 5px); left: 50%; transform: translate(-50%); } .tooltip-top .tooltip-body{ bottom: calc(100% + 5px); left: 50%; transform: translate(-50%); } .tooltip .tooltip-body::after{ content: ""; position: absolute; border-style: solid; border-width: 5px; } .tooltip-top .tooltip-body::after, .input-tooltip>span::after{ top: 100%; left: 50%; margin-left: -5px; border-color: #39B5C9 transparent transparent transparent; } .tooltip-bottom .tooltip-body::after{ bottom: 100%; left: 50%; margin-left: -5px; border-color: transparent transparent #39B5C9 transparent; } .tooltip-right .tooltip-body::after{ top: 50%; right: 100%; margin-top: -5px; border-color: transparent #39B5C9 transparent transparent; } .tooltip-left .tooltip-body::after{ top: 50%; left: 100%; margin-top: -5px; border-color: transparent transparent transparent #39B5C9; } .tooltip-hidden-arrow:after{ display: none !important } .tooltip:hover .tooltip-body{visibility: visible;} .tooltip .tooltip-body:hover{visibility: hidden !important;}  .quote{ border-left: 5px solid #02A2DB; padding: 8px; background-color: #EAEAEA; margin: 2px 0 2px 0; } .quote>span{ display: block; font-weight: bold } .quote>i{ display: block } .quote>i:before { content: "“"; padding-right:5px; } .quote>i:after { padding-left:5px; content: "”"; }  #popupAds .modal-body{ width: 90%; max-width: 900px; max-height: calc(100% - 50px); text-align: center } #popupAds .heading-block>i{ font-size: 25px; color: #FFFFFF; } #popupAds img, #popupAds video{ object-fit: cover; max-width: 100%; max-height: 100% } #popupAds .modal-body>.link{ color: #FFFFFF; font-size: 28px; position: absolute; top: -25px; right: -20px } #popupAds .modal-body>.link:hover{ color: #02ABE7; }  .posts-flex>div{ overflow: hidden; position: relative; } .posts-flex .flex{ position: absolute; top: 50%; transform: translate(0,-50%); width: 100%; } .posts-flex-text>span, .posts-flex .flex>a{ display: block; } .posts-flex .flex>a{ } .posts-flex .flex>a>img{ width: 100%; height: 100%; object-fit: cover; } .posts-flex-desc, .posts-flex-time{ text-align: justify; } .posts-flex-time{ margin-bottom: 3px } .posts-flex-text{ padding: 0 8px } .account-outer{ animation: none } .account-outer .modal-body{ max-width:420px; } .account-outer .modal-content{ border-radius: 3px; }  .progress-bar { height: 20px; background: #e9ecef; border:none; transition: all 0.3s ease; display:block; } .progress-bar::-webkit-progress-bar { background: #e9ecef; border:none } .progress-bar::-webkit-progress-value {  background: #02A2DB; border:none } .progress-bar::-moz-progress-bar {  background: #02A2DB; border:none } .progress-bar::-ms-fill {  background: #02A2DB; border:none }  .hidden{display:none} .text-inline{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .wall{border-bottom: 1px solid #02A2DB;} .hidden-printing{ visibility: hidden; } @media print { .hidden-printing{ visibility: visible !important; } } .red{color:red} .blue{color:blue} .skyblue{color:skyblue} .green{color:green} .gray{color:gray} .cyan{color:cyan} .hover-red:hover{background-color:red} .hover-blue:hover{background-color:blue} .hover-skyblue:hover{background-color:skyblue} .hover-green:hover{background-color:green} .hover-gray:hover{background-color:gray} .hover-cyan:hover{background-color:cyan} .left{text-align: left} .center{text-align: center} .right{text-align: right} .float-right{float: right} .block{display: block;} .pd-0{padding:0px !important} .pd-2{padding:2px} .pd-5{padding:5px} .pd-10{padding:10px} .pd-15{padding:15px} .pd-20{padding:20px} .bg{background-color:#fff} .rm-radius{border-radius: 0 !important} .radius{border-radius: 50% !important} .flex{ display: flex; flex-wrap: wrap; } .flex-nowrap{ display: flex; flex-wrap: nowrap; } .flex-nowrap>*{ flex-grow: 1 } .flex-middle{ align-items: center; } .flex-center{ justify-content: center; } .flex-margin{padding: 0 20px 0 0} .flex-margin:last-child{padding: 0 !important} .width-5{width:5%} .width-10{width:10%} .width-15{width:15%} .width-20{width:20%} .width-25{width:25%} .width-30{width:30%} .width-33{width:33%} .width-33x{width:33.33333%} .width-34{width:34%} .width-35{width:35%} .width-40{width:40%} .width-45{width:45%} .width-50{width:50%} .width-55{width:55%} .width-60{width:60%} .width-65{width:65%} .width-70{width:70%} .width-75{width:75%} .width-80{width:80%} .width-85{width:85%} .width-90{width:90%} .width-95{width:95%} .width-100{width:100%} .clearfix{clear:both} h1,h2,h3,h4,h5,h6{ margin: 0; font-weight: initial; } .spin-effect{ animation: spin 1s; } @keyframes spin{ 100% {transform:rotate(360deg);} } @keyframes rotate{ 100% {transform:rotateY(360deg);} }  @media(max-width: 767px){  .hidden-small{display: none !important;} .flex-medium{ display: block !important; } .flex-medium>*{ width: auto !important } .width-50-small{width:50% !important} .width-100-small{width:100% !important} } @media(min-width: 768px) and (max-width: 1023px){  .hidden-medium{display: none !important;} .width-50-medium{width:50% !important} .width-100-medium{width:100% !important} } @media(max-width: 1023px){  .hidden-small-medium{display: none !important;} .flex-large{ display: block !important; } .flex-large>*{ width: auto !important } .flex-margin{ padding:0 !important; } .medium-margin-bottom{ margin-bottom: 10px !important } #header>.header-body{ padding: 0 0 0 15px; } #header{ height: 60px; line-height: 60px; } .header-fixed{ height: 60px; } #header .logo{ max-height: 50px } .width-50-small-medium{width:50% !important} .width-100-small-medium{width:100% !important} .navbar{ display: none; position: fixed; z-index: 97; top: 60px; left: 0; right: 0; bottom: 0; width: 100%; padding-bottom: 20px; background: white !important;; ; } .navbar>ul{ overflow-y: auto; height: 100%; display: block !important; } .navbar>ul>li{ float: none; margin: 0 !important; line-height: normal; } .navbar li>a, .navbar li>span{ display: block; width: 100% !important; padding: 15px; position: relative; color: #444444 !important; border-bottom: 1px solid #F5F5F5; ; } .navbar li>a:hover, .navbar li>span:hover, .navbar li:hover span{ color: #02ABE7 !important; border-bottom: 1px solid #02ABE7; } .navbar .line-run:after{ display: none; } .navbar li>ul{ position: relative; top: 2px; background: white !important;; box-shadow: none; } .navbar li>ul a{ padding: 15px 15px 15px 35px; } .navbar-arrow-icon:after{ content: "\f105"; position: absolute; right: 8px; line-height: normal; } .navbar-item-opened .navbar-arrow-icon:after{ content: "\f107" !important; } .nav-icon-mobile>i{ padding: 10px; cursor: pointer; font-size: 25px; display: inline-block; vertical-align: middle; } #header .input-search{ display: none } #header .input-search>input:focus{ width: 180px } .breadcrumb-outer{ padding-left: 5px } } @media(min-width: 1024px){  .hidden-large{display: none !important;} .width-50-large{width:50% !important} .width-100-large{width:100% !important} }