*{transition: all 0.5s ease-in-out; -moz-box-sizing: border-box; -o-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
.break-all{word-break: break-all}
.img-responsive{margin: auto}

.main-bg{background-color:#141E46}
.main-color{color:#141E46}

.bold{font-weight: bold} /**/ .bolder{font-weight: bolder}
.width-100{width: 100%} /**/ .height-100{height: 100%} /**/ .w-h-100{width: 100%; height: 100%} /**/ .m-width{max-width: 100%} /**/ .m-height{max-height: 100%} /**/ .m-width-height{max-width: 100%; max-height: 100%}
.relative{position: relative} /**/ .absolute{position: absolute} /**/ .block{display: block} /**/ .inline{display: inline} /**/ .in-block{display: inline-block} /**/ .flex{display: flex} /**/ .content-center{justify-content: center} /**/ .content-around{justify-content: space-around} /**/ .content-between{justify-content: space-between} /**/ .items-center{align-items: center} /**/ .items-bottom{align-items: flex-end} /**/ .flex-wrap{flex-wrap: wrap} /**/ .flex-center {display: flex; justify-content: center; align-items: center} /**/ .flex-between{display: flex; justify-content: space-between; align-items: center} /**/ .flex-around {display: flex; justify-content: space-around; align-items: center} /**/ .none{display: none }
.margin-auto{margin: auto}/**/.margin-10{margin: 10px auto} /**/ .margin-20{margin: 20px auto} /**/ .margin-50{margin: 50px auto} /**/ .margin-t-10{margin-top: 10px} /**/ .margin-t-20{margin-top: 20px} /**/ .margin-t-50{margin-top: 50px} /**/  /**/ .margin-b-10{margin-bottom: 10px} /**/ .margin-b-20{margin-bottom: 20px} /**/ .margin-b-50{margin-bottom: 50px} /**/ .padding-5{padding: 5px 0;} .padding-10{padding: 10px 0} /**/ .padding-20{padding: 20px 0} /**/ .padding-50{padding: 50px 0}
.border-radius-10{border: 1px solid #ccc; border-radius: 10px;}
.border-radius-15{border: 1px solid #ccc; border-radius: 15px;}
.border-radius-20{border: 1px solid #ccc; border-radius: 20px;}
.border-radius-50{border: 1px solid #ccc; border-radius: 50%;}

#scroll-up{width: 50px; height: 50px; position: fixed; right: 15px; bottom: 15px; cursor: pointer; z-index: 99} /**/ #scroll-up .icon{width:100%; height:100%; background-color: #3DDEED; color: #fff}
.loading-container{background-color: #222; position: fixed; perspective: 600px; z-index: 99999; width: 100%; height: 100%} /**/ .shape{width: 100px; height: 100px; border: 1px solid #000; transform: rotateZ(45deg)} /**/ .shape span{width: 50%; height: 50%; backface-visibility: hidden; background-color: #59bec0} /**/ .shape span:first-child {animation: Shape_Flip_1 2s infinite ease-in-out alternate} /**/ .shape span:nth-child(3){animation: Shape_Flip_2 2s .6s infinite ease-in-out alternate} /**/ .shape span:last-child  {animation: Shape_Flip_3 2s 1.1s infinite ease-in-out alternate} /**/ .shape span:nth-child(2){animation: Shape_Flip_4 2s 1.6s infinite ease-in-out alternate} /**/ @keyframes Shape_Flip_1{0%  {transform: rotateX(0deg); transform-origin: center} 100%{transform: rotateX(180deg); transform-origin: bottom}} /**/ @keyframes Shape_Flip_2{0%  {transform: rotateY(0deg); transform-origin: center} 100%{transform: rotateY(180deg); transform-origin: right}} /**/ @keyframes Shape_Flip_3{0%  {transform: rotateX(0deg); transform-origin: center} 100%{transform: rotateX(180deg); transform-origin: top}} /**/ @keyframes Shape_Flip_4{0%  {transform: rotateY(0deg); transform-origin: center} 100%{transform: rotateY(180deg); transform-origin: left}}

/*main-navbar*/
.main-navbar{margin-bottom: 0}
.main-navbar .search-box{margin: 5px 0;}
.main-navbar .search-box .input-container .form-control{padding: 9px 0px 0 14px;}
.main-navbar .search-box .search-button{background-color: transparent; padding: 12px; position: absolute; top: 0; right: 0%;}

.main-navbar  .notification_button{display: inline-block; margin: 10px 5px;}
.main-navbar  .media .media-body{margin: 10px 2px;}
.main-navbar .dropdown-menu.notify-drop {min-width: 330px;min-height: 360px; max-height: 400px; right: 0!important; left: auto !important; background-color: #fff;}
.main-navbar .dropdown-menu.notify-drop .notify-drop-title {border-bottom: 1px solid #e2e2e2; padding: 5px 15px 10px 15px; }
.main-navbar .dropdown-menu.notify-drop .drop-content {min-height: 280px; max-height: 280px; overflow-y: scroll; }
.main-navbar .dropdown-menu.notify-drop .drop-content::-webkit-scrollbar-track {background-color: #F5F5F5;}
.main-navbar .dropdown-menu.notify-drop .drop-content::-webkit-scrollbar{width: 8px; background-color: #F5F5F5; }
.main-navbar .dropdown-menu.notify-drop .drop-content::-webkit-scrollbar-thumb {background-color: #ccc; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li {border-bottom: 1px solid #e2e2e2; padding: 10px 0px 5px 0px; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li:nth-child(2n+0) {background-color: #fafafa;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li:after {content: ""; clear: both; display: block; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li:hover {background-color: #fcfcfc;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li:last-child {border-bottom: none;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li .notify-img {float: left; display: inline-block; width: 45px; height: 45px; margin: 0px 0px 8px 0px;}
.main-navbar .dropdown-menu.notify-drop .allRead {margin-right: 7px;}
.main-navbar .dropdown-menu.notify-drop .rIcon {float: right; color: #999; }
.main-navbar .dropdown-menu.notify-drop .rIcon:hover {color: #333;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li a {font-size: 12px; font-weight: normal; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li {font-weight: bold; font-size: 11px; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li hr {margin: 5px 0; width: 70%; border-color: #e2e2e2;}
.main-navbar .dropdown-menu.notify-drop .drop-content .pd-l0 {padding-left: 0;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li p {font-size: 11px; color: #666; font-weight: normal; margin: 3px 0;}
.main-navbar .dropdown-menu.notify-drop .drop-content > li p.time {font-size: 10px; font-weight: 600; top: -6px; margin: 8px 0px 0px 0px; padding: 0px 3px; border: 1px solid #e2e2e2; position: relative; background-image: linear-gradient(#fff,#f2f2f2); display: inline-block; border-radius: 2px; color: #B97745; }
.main-navbar .dropdown-menu.notify-drop .drop-content > li p.time:hover {background-image: linear-gradient(#fff,#fff);}
.main-navbar .dropdown-menu.notify-drop .notify-drop-footer {border-top: 1px solid #e2e2e2; bottom: 0; position: relative; padding: 8px 15px; }
.main-navbar .dropdown-menu.notify-drop .notify-drop-footer a {color: #777; text-decoration: none;}
.main-navbar .dropdown-menu.notify-drop .notify-drop-footer a:hover {color: #333;}
/*main-navbar*/

input[type=text]:focus, input[type=password]:focus, input[type=email]:focus, [type=email].form-control:focus, [contenteditable].form-control:focus {outline: none; box-shadow: inset 0 -1px 0 #ddd;}
.input-container{position: relative}
.input-container .form-control{padding: 10px 0 7px 30px}
.input-container select.form-control{padding: 15px 25px 0 0}
.input-container label, .input-container i{font-size: 1.3em; position: absolute; z-index: 1}
.input-container label{margin: 0; padding: 0; font-size: 1em; top: 0px; left: 6px; opacity: 0.8}
.input-container i{top: 21px; left: 4px}
.input-container i.fa-eye, .input-container i.fa-eye-slash{top:15px; left: 88%; cursor: pointer}
.input-container .asterisk{color: #f00; font-weight: 900; font-size: 1em}

.input-container-2 .form-control{padding-left: 35px; background: transparent; border: none; outline: none; border: 1px solid #3DDEED; min-height: 50px}

textarea{resize: none}
.select2-container{width: 100% !important}
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple{padding: 22px; background: transparent; border: none; outline: none; border: 1px solid #3DDEED; }
.select2-container--default .select2-selection--multiple{padding: 5px 0 0 25px}
.select2-container--default .select2-selection--single .select2-selection__arrow b{border-color: #3DDEED transparent transparent transparent;}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border-color: transparent transparent #3DDEED transparent;}
.select2-container .select2-selection--single .select2-selection__rendered{margin-top: -13px; padding-left: 15px;}

.image-preview-input input[type=file]{position: absolute; top: 0; right: 0; padding: 11px 0; width: 100%; cursor: pointer; opacity: 0}

.hovereffect {position: relative;  margin: 0}
.hovereffect .overlay {position: absolute; top: 0; left: 0; background-color: rgba(75,75,75,0.5); -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out}
.hovereffect:hover .overlay {background-color: rgba(117,198,201,0.5)}
.hovereffect h4 {position: absolute; bottom: 10px; right: 0; margin: 0; padding: 10px; background: #4CAF50; color: #fff; -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out}
.hovereffect:hover h4 {bottom: 70%; padding: 8px 28px; background: rgba(0, 0, 0, 0.6); z-index:1}
.hovereffect .holder{position: absolute; width: 100%; height: 100%; transform: scale(0.9)}
.hovereffect .info {position: absolute; top: 0; right: 0; font-weight: bolder; font-size: 1.5em; border: 1px solid #fff; opacity: 0; filter: alpha(opacity=0); -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out}
.hovereffect:hover .holder .info {color: #fff; opacity: 1; filter: alpha(opacity=100); -webkit-transform: scale(1);  -ms-transform: scale(1); transform: scale(1)}
.hovereffect .holder .info:hover {box-shadow: 0 0 5px #fff}

.hovereffect-2 .overlay {-webkit-transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81); transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81)}
.hovereffect-2:hover .overlay {background-color: rgba(0, 0, 0, 0.1)}
.hovereffect-2 h4 {bottom: 5%; text-align: center; font-weight: bolder; -webkit-transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81); transition: all 0.4s  cubic-bezier(0.88,-0.99, 0, 1.81)}
.hovereffect-2 .holder .info {font-size: 1.1em; border: 1px solid #fff;  padding: 10px}
.hovereffect-2 .holder .info span{display: inline-block; padding: 5px; font-size: 1.1em; color: #fff}