/*

Product: Grow CRM

Contact: support@growcrm.io

File: scss

*/

/*Theme Colors*/

/*bootstrap Color*/

/*Light colors*/

/*Normal Color*/

/*Extra Variable*/

/*modals*/

/* ---------------------------------------------

* Main Theme Colors

*-----------------------------------------------*/

/******************* 

Global Styles 

*******************/

* {

  outline: none; }



body {

  background: #fff;

  font-family: "Montserrat", sans-serif;

  margin: 0;

  overflow-x: hidden;

  color: #67757c;

  font-weight: 300;

  font-size: 14px; }



html {

  position: relative;

  min-height: 100%;

  background: #ffffff;

  -webkit-font-smoothing: antialiased;

  -moz-osx-font-smoothing: grayscale; }



a {

  color: #20aee3; }



a:hover,

a:focus {

  text-decoration: none; }



a.link {

  color: #455a64; }

  a.link:hover, a.link:focus {

    color: #20aee3; }



.img-responsive {

  width: 100%;

  height: auto;

  display: inline-block; }



.img-rounded {

  border-radius: 4px; }



html body .mdi:before,

html body .mdi-set {

  line-height: initial; }



/*******************

Headings

*******************/

h1,

h2,

h3,

h4,

h5,

h6 {

  color: #455a64;

  font-family: "Montserrat", sans-serif;

  font-weight: 400; }



h1 {

  line-height: 40px;

  font-size: 36px; }



h2 {

  line-height: 36px;

  font-size: 24px; }



h3 {

  line-height: 30px;

  font-size: 21px; }



h4 {

  line-height: 22px;

  font-size: 18px; }



h5 {

  line-height: 18px;

  font-size: 16px;

  font-weight: 400; }



h6 {

  line-height: 16px;

  font-size: 14px;

  font-weight: 500; }



.display-5 {

  font-size: 3rem; }



.display-6 {

  font-size: 36px; }



.box {

  border-radius: 4px;

  padding: 10px; }



html body .dl {

  display: inline-block; }

html body .db {

  display: block; }



.no-wrap td,

.no-wrap th {

  white-space: nowrap; }



/*******************

Blockquote

*******************/

html body blockquote {

  border-left: 5px solid #20aee3;

  border: 1px solid rgba(120, 130, 140, 0.13);

  padding: 15px; }



.clear,

.clear-both {

  clear: both; }



ol li {

  margin: 5px 0; }



/*******************

Paddings

*******************/

html body .p-0 {

  padding: 0px !important; }

html body .p-5 {

  padding: 5px !important; }

html body .p-10 {

  padding: 10px !important; }

html body .p-15 {

  padding: 15px !important; }

html body .p-20 {

  padding: 20px !important; }

html body .p-25 {

  padding: 25px !important; }

html body .p-30 {

  padding: 30px !important; }

html body .p-40 {

  padding: 40px !important; }

html body .p-l-0 {

  padding-left: 0px !important; }

html body .p-l-1 {

  padding-left: 1px !important; }

html body .p-l-2 {

  padding-left: 2px !important; }

html body .p-l-3 {

  padding-left: 3px !important; }

html body .p-l-4 {

  padding-left: 4px !important; }

html body .p-l-5 {

  padding-left: 5px !important; }

html body .p-l-6 {

  padding-left: 6px !important; }

html body .p-l-7 {

  padding-left: 7px !important; }

html body .p-l-8 {

  padding-left: 8px !important; }

html body .p-l-9 {

  padding-left: 9px !important; }

html body .p-l-10 {

  padding-left: 10px !important; }

html body .p-l-15 {

  padding-left: 15px !important; }

html body .p-l-20 {

  padding-left: 20px !important; }

html body .p-l-25 {

  padding-left: 25px !important; }

html body .p-r-0 {

  padding-right: 0px !important; }

html body .p-r-1 {

  padding-right: 1px !important; }

html body .p-r-2 {

  padding-right: 2px !important; }

html body .p-r-3 {

  padding-right: 3px !important; }

html body .p-r-4 {

  padding-right: 4px !important; }

html body .p-r-5 {

  padding-right: 5px !important; }

html body .p-r-6 {

  padding-right: 6px !important; }

html body .p-r-7 {

  padding-right: 7px !important; }

html body .p-r-8 {

  padding-right: 8px !important; }

html body .p-r-9 {

  padding-right: 9px !important; }

html body .p-r-10 {

  padding-right: 10px !important; }

html body .p-r-15 {

  padding-right: 15px !important; }

html body .p-r-20 {

  padding-right: 20px !important; }

html body .p-r-25 {

  padding-right: 25px !important; }

html body .p-r-30 {

  padding-right: 30px !important; }

html body .p-r-40 {

  padding-right: 40px !important; }

html body .p-r-50 {

  padding-right: 50px !important; }

html body .p-r-60 {

  padding-right: 60px !important; }

html body .p-r-70 {

  padding-right: 70px !important; }

html body .p-r-80 {

  padding-right: 80px !important; }

html body .p-r-90 {

  padding-right: 90px !important; }

html body .p-r-100 {

  padding-right: 100px !important; }

html body .p-t-0 {

  padding-top: 0px !important; }

html body .p-t-1 {

  padding-top: 1px !important; }

html body .p-t-2 {

  padding-top: 2px !important; }

html body .p-t-3 {

  padding-top: 3px !important; }

html body .p-t-4 {

  padding-top: 4px !important; }

html body .p-t-5 {

  padding-top: 5px !important; }

html body .p-t-6 {

  padding-top: 6px !important; }

html body .p-t-7 {

  padding-top: 7px !important; }

html body .p-t-8 {

  padding-top: 8px !important; }

html body .p-t-9 {

  padding-top: 9px !important; }

html body .p-t-10 {

  padding-top: 10px !important; }

html body .p-t-15 {

  padding-top: 15px !important; }

html body .p-t-20 {

  padding-top: 20px !important; }

html body .p-t-25 {

  padding-top: 25px !important; }

html body .p-t-30 {

  padding-top: 30px !important; }

html body .p-t-35 {

  padding-top: 35px !important; }

html body .p-t-40 {

  padding-top: 40px !important; }

html body .p-t-45 {

  padding-top: 45px !important; }

html body .p-t-50 {

  padding-top: 50px !important; }

html body .p-t-55 {

  padding-top: 55px !important; }

html body .p-t-60 {

  padding-top: 60px !important; }

html body .p-t-70 {

  padding-top: 70px !important; }

html body .p-t-80 {

  padding-top: 80px !important; }

html body .p-t-90 {

  padding-top: 90px !important; }

html body .p-t-100 {

  padding-top: 100px !important; }

html body .p-b-0 {

  padding-bottom: 0px !important; }

html body .p-b-1 {

  padding-bottom: 1px !important; }

html body .p-b-2 {

  padding-bottom: 2px !important; }

html body .p-b-3 {

  padding-bottom: 3px !important; }

html body .p-b-4 {

  padding-bottom: 4px !important; }

html body .p-b-5 {

  padding-bottom: 5px !important; }

html body .p-b-6 {

  padding-bottom: 6px !important; }

html body .p-b-7 {

  padding-bottom: 7px !important; }

html body .p-b-8 {

  padding-bottom: 8px !important; }

html body .p-b-9 {

  padding-bottom: 9px !important; }

html body .p-b-10 {

  padding-bottom: 10px !important; }

html body .p-b-15 {

  padding-bottom: 15px !important; }

html body .p-b-20 {

  padding-bottom: 20px !important; }

html body .p-b-25 {

  padding-bottom: 25px !important; }

html body .p-b-30 {

  padding-bottom: 30px !important; }

html body .p-b-35 {

  padding-bottom: 35px !important; }

html body .p-b-40 {

  padding-bottom: 40px !important; }

html body .p-b-45 {

  padding-bottom: 45px !important; }

html body .p-b-50 {

  padding-bottom: 50px !important; }

html body .p-b-55 {

  padding-bottom: 55px !important; }

html body .p-b-60 {

  padding-bottom: 60px !important; }

html body .p-b-70 {

  padding-bottom: 70px !important; }

html body .p-b-80 {

  padding-bottom: 80px !important; }

html body .p-b-90 {

  padding-bottom: 90px !important; }

html body .p-b-100 {

  padding-bottom: 100px !important; }

html body .w-0 {

  width: 0%; }

html body .w-1 {

  width: 1%; }

html body .w-2 {

  width: 2%; }

html body .w-3 {

  width: 3%; }

html body .w-4 {

  width: 4%; }

html body .w-5 {

  width: 5%; }

html body .w-6 {

  width: 6%; }

html body .w-7 {

  width: 7%; }

html body .w-8 {

  width: 8%; }

html body .w-9 {

  width: 9%; }

html body .w-10 {

  width: 10%; }

html body .w-11 {

  width: 11%; }

html body .w-12 {

  width: 12%; }

html body .w-13 {

  width: 13%; }

html body .w-14 {

  width: 14%; }

html body .w-15 {

  width: 15%; }

html body .w-16 {

  width: 16%; }

html body .w-17 {

  width: 17%; }

html body .w-18 {

  width: 18%; }

html body .w-19 {

  width: 19%; }

html body .w-20 {

  width: 20%; }

html body .w-21 {

  width: 21%; }

html body .w-22 {

  width: 22%; }

html body .w-23 {

  width: 23%; }

html body .w-24 {

  width: 24%; }

html body .w-25 {

  width: 25%; }

html body .w-26 {

  width: 26%; }

html body .w-27 {

  width: 27%; }

html body .w-28 {

  width: 28%; }

html body .w-29 {

  width: 29%; }

html body .w-30 {

  width: 30%; }

html body .w-31 {

  width: 31%; }

html body .w-32 {

  width: 32%; }

html body .w-33 {

  width: 33%; }

html body .w-34 {

  width: 34%; }

html body .w-35 {

  width: 35%; }

html body .w-36 {

  width: 36%; }

html body .w-37 {

  width: 37%; }

html body .w-38 {

  width: 38%; }

html body .w-39 {

  width: 39%; }

html body .w-40 {

  width: 40%; }

html body .w-41 {

  width: 41%; }

html body .w-42 {

  width: 42%; }

html body .w-43 {

  width: 43%; }

html body .w-44 {

  width: 44%; }

html body .w-45 {

  width: 45%; }

html body .w-46 {

  width: 46%; }

html body .w-47 {

  width: 47%; }

html body .w-48 {

  width: 48%; }

html body .w-49 {

  width: 49%; }

html body .w-50 {

  width: 50%; }

html body .w-51 {

  width: 51%; }

html body .w-52 {

  width: 52%; }

html body .w-53 {

  width: 53%; }

html body .w-54 {

  width: 54%; }

html body .w-55 {

  width: 55%; }

html body .w-56 {

  width: 56%; }

html body .w-57 {

  width: 57%; }

html body .w-58 {

  width: 58%; }

html body .w-59 {

  width: 59%; }

html body .w-60 {

  width: 60%; }

html body .w-61 {

  width: 61%; }

html body .w-62 {

  width: 62%; }

html body .w-63 {

  width: 63%; }

html body .w-64 {

  width: 64%; }

html body .w-65 {

  width: 65%; }

html body .w-66 {

  width: 66%; }

html body .w-67 {

  width: 67%; }

html body .w-68 {

  width: 68%; }

html body .w-69 {

  width: 69%; }

html body .w-70 {

  width: 70%; }

html body .w-71 {

  width: 71%; }

html body .w-72 {

  width: 72%; }

html body .w-73 {

  width: 73%; }

html body .w-74 {

  width: 74%; }

html body .w-75 {

  width: 75%; }

html body .w-76 {

  width: 76%; }

html body .w-77 {

  width: 77%; }

html body .w-78 {

  width: 78%; }

html body .w-79 {

  width: 79%; }

html body .w-80 {

  width: 80%; }

html body .w-81 {

  width: 81%; }

html body .w-82 {

  width: 82%; }

html body .w-83 {

  width: 83%; }

html body .w-84 {

  width: 84%; }

html body .w-85 {

  width: 85%; }

html body .w-86 {

  width: 86%; }

html body .w-87 {

  width: 87%; }

html body .w-88 {

  width: 88%; }

html body .w-89 {

  width: 89%; }

html body .w-90 {

  width: 90%; }

html body .w-91 {

  width: 91%; }

html body .w-92 {

  width: 92%; }

html body .w-93 {

  width: 93%; }

html body .w-94 {

  width: 94%; }

html body .w-95 {

  width: 95%; }

html body .w-96 {

  width: 96%; }

html body .w-97 {

  width: 97%; }

html body .w-98 {

  width: 98%; }

html body .w-99 {

  width: 99%; }

html body .w-100 {

  width: 100%; }

html body .h-px-0 {

  height: 0px; }

html body .h-px-1 {

  height: 1px; }

html body .h-px-2 {

  height: 2px; }

html body .h-px-3 {

  height: 3px; }

html body .h-px-4 {

  height: 4px; }

html body .h-px-5 {

  height: 5px; }

html body .h-px-6 {

  height: 6px; }

html body .h-px-7 {

  height: 7px; }

html body .h-px-8 {

  height: 8px; }

html body .h-px-9 {

  height: 9px; }

html body .h-px-10 {

  height: 10px; }

html body .h-px-11 {

  height: 11px; }

html body .h-px-12 {

  height: 12px; }

html body .h-px-13 {

  height: 13px; }

html body .h-px-14 {

  height: 14px; }

html body .h-px-15 {

  height: 15px; }

html body .h-px-16 {

  height: 16px; }

html body .h-px-17 {

  height: 17px; }

html body .h-px-18 {

  height: 18px; }

html body .h-px-19 {

  height: 19px; }

html body .h-px-20 {

  height: 20px; }

html body .h-px-21 {

  height: 21px; }

html body .h-px-22 {

  height: 22px; }

html body .h-px-23 {

  height: 23px; }

html body .h-px-24 {

  height: 24px; }

html body .h-px-25 {

  height: 25px; }

html body .h-px-26 {

  height: 26px; }

html body .h-px-27 {

  height: 27px; }

html body .h-px-28 {

  height: 28px; }

html body .h-px-29 {

  height: 29px; }

html body .h-px-30 {

  height: 30px; }

html body .h-px-31 {

  height: 31px; }

html body .h-px-32 {

  height: 32px; }

html body .h-px-33 {

  height: 33px; }

html body .h-px-34 {

  height: 34px; }

html body .h-px-35 {

  height: 35px; }

html body .h-px-36 {

  height: 36px; }

html body .h-px-37 {

  height: 37px; }

html body .h-px-38 {

  height: 38px; }

html body .h-px-39 {

  height: 39px; }

html body .h-px-40 {

  height: 40px; }

html body .h-px-41 {

  height: 41px; }

html body .h-px-42 {

  height: 42px; }

html body .h-px-43 {

  height: 43px; }

html body .h-px-44 {

  height: 44px; }

html body .h-px-45 {

  height: 45px; }

html body .h-px-46 {

  height: 46px; }

html body .h-px-47 {

  height: 47px; }

html body .h-px-48 {

  height: 48px; }

html body .h-px-49 {

  height: 49px; }

html body .h-px-50 {

  height: 50px; }

html body .h-px-51 {

  height: 51px; }

html body .h-px-52 {

  height: 52px; }

html body .h-px-53 {

  height: 53px; }

html body .h-px-54 {

  height: 54px; }

html body .h-px-55 {

  height: 55px; }

html body .h-px-56 {

  height: 56px; }

html body .h-px-57 {

  height: 57px; }

html body .h-px-58 {

  height: 58px; }

html body .h-px-59 {

  height: 59px; }

html body .h-px-60 {

  height: 60px; }

html body .h-px-61 {

  height: 61px; }

html body .h-px-62 {

  height: 62px; }

html body .h-px-63 {

  height: 63px; }

html body .h-px-64 {

  height: 64px; }

html body .h-px-65 {

  height: 65px; }

html body .h-px-66 {

  height: 66px; }

html body .h-px-67 {

  height: 67px; }

html body .h-px-68 {

  height: 68px; }

html body .h-px-69 {

  height: 69px; }

html body .h-px-70 {

  height: 70px; }

html body .h-px-71 {

  height: 71px; }

html body .h-px-72 {

  height: 72px; }

html body .h-px-73 {

  height: 73px; }

html body .h-px-74 {

  height: 74px; }

html body .h-px-75 {

  height: 75px; }

html body .h-px-76 {

  height: 76px; }

html body .h-px-77 {

  height: 77px; }

html body .h-px-78 {

  height: 78px; }

html body .h-px-79 {

  height: 79px; }

html body .h-px-80 {

  height: 80px; }

html body .h-px-81 {

  height: 81px; }

html body .h-px-82 {

  height: 82px; }

html body .h-px-83 {

  height: 83px; }

html body .h-px-84 {

  height: 84px; }

html body .h-px-85 {

  height: 85px; }

html body .h-px-86 {

  height: 86px; }

html body .h-px-87 {

  height: 87px; }

html body .h-px-88 {

  height: 88px; }

html body .h-px-89 {

  height: 89px; }

html body .h-px-90 {

  height: 90px; }

html body .h-px-91 {

  height: 91px; }

html body .h-px-92 {

  height: 92px; }

html body .h-px-93 {

  height: 93px; }

html body .h-px-94 {

  height: 94px; }

html body .h-px-95 {

  height: 95px; }

html body .h-px-96 {

  height: 96px; }

html body .h-px-97 {

  height: 97px; }

html body .h-px-98 {

  height: 98px; }

html body .h-px-99 {

  height: 99px; }

html body .h-px-100 {

  height: 100px; }

html body .h-px-150 {

  height: 150px; }

html body .min-w-200 {

  min-width: 200px; }

html body .min-h-100 {

  min-height: 100px; }

html body .min-h-150 {

  min-height: 150px; }

html body .min-h-200 {

  min-height: 200px; }

html body .min-h-250 {

  min-height: 250px; }

html body .min-h-300 {

  min-height: 300px; }

html body .min-h-400 {

  min-height: 400px; }

html body .w-px-1 {

  width: 1px; }

html body .w-px-3 {

  width: 3px; }

html body .w-px-5 {

  width: 5px; }

html body .w-px-7 {

  width: 7px; }

html body .w-px-9 {

  width: 9px; }

html body .w-px-11 {

  width: 11px; }

html body .w-px-13 {

  width: 13px; }

html body .w-px-15 {

  width: 15px; }

html body .w-px-17 {

  width: 17px; }

html body .w-px-19 {

  width: 19px; }

html body .w-px-21 {

  width: 21px; }

html body .w-px-23 {

  width: 23px; }

html body .w-px-25 {

  width: 25px; }

html body .w-px-27 {

  width: 27px; }

html body .w-px-29 {

  width: 29px; }

html body .w-px-30 {

  width: 30px; }

html body .w-px-31 {

  width: 31px; }

html body .w-px-31 {

  width: 31px; }

html body .w-px-33 {

  width: 33px; }

html body .w-px-35 {

  width: 35px; }

html body .w-px-37 {

  width: 37px; }

html body .w-px-39 {

  width: 39px; }

html body .w-px-41 {

  width: 41px; }

html body .w-px-43 {

  width: 43px; }

html body .w-px-45 {

  width: 45px; }

html body .w-px-47 {

  width: 47px; }

html body .w-px-49 {

  width: 49px; }

html body .w-px-51 {

  width: 51px; }

html body .w-px-53 {

  width: 53px; }

html body .w-px-55 {

  width: 55px; }

html body .w-px-57 {

  width: 57px; }

html body .w-px-59 {

  width: 59px; }

html body .w-px-61 {

  width: 61px; }

html body .w-px-63 {

  width: 63px; }

html body .w-px-65 {

  width: 65px; }

html body .w-px-67 {

  width: 67px; }

html body .w-px-69 {

  width: 69px; }

html body .w-px-71 {

  width: 71px; }

html body .w-px-73 {

  width: 73px; }

html body .w-px-75 {

  width: 75px; }

html body .w-px-77 {

  width: 77px; }

html body .w-px-79 {

  width: 79px; }

html body .w-px-80 {

  width: 80px; }

html body .w-px-81 {

  width: 81px; }

html body .w-px-83 {

  width: 83px; }

html body .w-px-85 {

  width: 85px; }

html body .w-px-87 {

  width: 87px; }

html body .w-px-89 {

  width: 89px; }

html body .w-px-91 {

  width: 91px; }

html body .w-px-93 {

  width: 93px; }

html body .w-px-95 {

  width: 95px; }

html body .w-px-97 {

  width: 97px; }

html body .w-px-99 {

  width: 99px; }

html body .w-px-150 {

  width: 150px; }

html body .w-px-200 {

  width: 200px; }

html body .w-px-250 {

  width: 250px; }

html body .w-px-300 {

  width: 300px; }



/*******************

Margin

*******************/

html body .m-0 {

  margin: 0px !important; }

html body .m-5 {

  margin: 5px !important; }

html body .m-10 {

  margin: 10px !important; }

html body .m-15 {

  margin: 15px !important; }

html body .m-20 {

  margin: 20px !important; }

html body .m-25 {

  margin: 25px !important; }

html body .m-30 {

  margin: 30px !important; }

html body .m-r-0 {

  margin-right: 0px !important; }

html body .m-r-1 {

  margin-right: 1px !important; }

html body .m-r-2 {

  margin-right: 2px !important; }

html body .m-r-3 {

  margin-right: 3px !important; }

html body .m-r-4 {

  margin-right: 4px !important; }

html body .m-r-5 {

  margin-right: 5px !important; }

html body .m-r-6 {

  margin-right: 6px !important; }

html body .m-r-7 {

  margin-right: 7px !important; }

html body .m-r-8 {

  margin-right: 8px !important; }

html body .m-r-9 {

  margin-right: 9px !important; }

html body .m-r-10 {

  margin-right: 10px !important; }

html body .m-r-11 {

  margin-right: 11px !important; }

html body .m-r-12 {

  margin-right: 12px !important; }

html body .m-r-13 {

  margin-right: 13px !important; }

html body .m-r-14 {

  margin-right: 14px !important; }

html body .m-r-15 {

  margin-right: 15px !important; }

html body .m-r-16 {

  margin-right: 16px !important; }

html body .m-r-17 {

  margin-right: 17px !important; }

html body .m-r-18 {

  margin-right: 18px !important; }

html body .m-r-19 {

  margin-right: 19px !important; }

html body .m-r-20 {

  margin-right: 20px !important; }

html body .m-r-21 {

  margin-right: 21px !important; }

html body .m-r-22 {

  margin-right: 22px !important; }

html body .m-r-23 {

  margin-right: 23px !important; }

html body .m-r-24 {

  margin-right: 24px !important; }

html body .m-r-25 {

  margin-right: 25px !important; }

html body .m-r-26 {

  margin-right: 26px !important; }

html body .m-r-27 {

  margin-right: 27px !important; }

html body .m-r-28 {

  margin-right: 28px !important; }

html body .m-r-29 {

  margin-right: 29px !important; }

html body .m-r-30 {

  margin-right: 30px !important; }

html body .m-r-31 {

  margin-right: 31px !important; }

html body .m-r-32 {

  margin-right: 32px !important; }

html body .m-r-33 {

  margin-right: 33px !important; }

html body .m-r-34 {

  margin-right: 34px !important; }

html body .m-r-35 {

  margin-right: 35px !important; }

html body .m-r-36 {

  margin-right: 36px !important; }

html body .m-r-37 {

  margin-right: 37px !important; }

html body .m-r-38 {

  margin-right: 38px !important; }

html body .m-r-39 {

  margin-right: 39px !important; }

html body .m-r-40 {

  margin-right: 40px !important; }

html body .m-r-41 {

  margin-right: 41px !important; }

html body .m-r-42 {

  margin-right: 42px !important; }

html body .m-r-43 {

  margin-right: 43px !important; }

html body .m-r-44 {

  margin-right: 44px !important; }

html body .m-r-45 {

  margin-right: 45px !important; }

html body .m-r-46 {

  margin-right: 46px !important; }

html body .m-r-47 {

  margin-right: 47px !important; }

html body .m-r-48 {

  margin-right: 48px !important; }

html body .m-r-49 {

  margin-right: 49px !important; }

html body .m-r-50 {

  margin-right: 50px !important; }

html body .m-l-0 {

  margin-left: 0px !important; }

html body .m-l-1 {

  margin-left: 1px !important; }

html body .m-l-2 {

  margin-left: 2px !important; }

html body .m-l-3 {

  margin-left: 3px !important; }

html body .m-l-4 {

  margin-left: 4px !important; }

html body .m-l-5 {

  margin-left: 5px !important; }

html body .m-l-6 {

  margin-left: 6px !important; }

html body .m-l-7 {

  margin-left: 7px !important; }

html body .m-l-8 {

  margin-left: 8px !important; }

html body .m-l-9 {

  margin-left: 9px !important; }

html body .m-l-10 {

  margin-left: 10px !important; }

html body .m-l-11 {

  margin-left: 11px !important; }

html body .m-l-12 {

  margin-left: 12px !important; }

html body .m-l-13 {

  margin-left: 13px !important; }

html body .m-l-14 {

  margin-left: 14px !important; }

html body .m-l-15 {

  margin-left: 15px !important; }

html body .m-l-16 {

  margin-left: 16px !important; }

html body .m-l-17 {

  margin-left: 17px !important; }

html body .m-l-18 {

  margin-left: 18px !important; }

html body .m-l-19 {

  margin-left: 19px !important; }

html body .m-l-20 {

  margin-left: 20px !important; }

html body .m-l-21 {

  margin-left: 21px !important; }

html body .m-l-22 {

  margin-left: 22px !important; }

html body .m-l-23 {

  margin-left: 23px !important; }

html body .m-l-24 {

  margin-left: 24px !important; }

html body .m-l-25 {

  margin-left: 25px !important; }

html body .m-l-26 {

  margin-left: 26px !important; }

html body .m-l-27 {

  margin-left: 27px !important; }

html body .m-l-28 {

  margin-left: 28px !important; }

html body .m-l-29 {

  margin-left: 29px !important; }

html body .m-l-30 {

  margin-left: 30px !important; }

html body .m-l-31 {

  margin-left: 31px !important; }

html body .m-l-32 {

  margin-left: 32px !important; }

html body .m-l-33 {

  margin-left: 33px !important; }

html body .m-l-34 {

  margin-left: 34px !important; }

html body .m-l-35 {

  margin-left: 35px !important; }

html body .m-l-36 {

  margin-left: 36px !important; }

html body .m-l-37 {

  margin-left: 37px !important; }

html body .m-l-38 {

  margin-left: 38px !important; }

html body .m-l-39 {

  margin-left: 39px !important; }

html body .m-l-40 {

  margin-left: 40px !important; }

html body .m-l-41 {

  margin-left: 41px !important; }

html body .m-l-42 {

  margin-left: 42px !important; }

html body .m-l-43 {

  margin-left: 43px !important; }

html body .m-l-44 {

  margin-left: 44px !important; }

html body .m-l-45 {

  margin-left: 45px !important; }

html body .m-l-46 {

  margin-left: 46px !important; }

html body .m-l-47 {

  margin-left: 47px !important; }

html body .m-l-48 {

  margin-left: 48px !important; }

html body .m-l-49 {

  margin-left: 49px !important; }

html body .m-l-50 {

  margin-left: 50px !important; }

html body .m-t-0 {

  margin-top: 0px !important; }

html body .m-t-1 {

  margin-top: 1px !important; }

html body .m-t-2 {

  margin-top: 2px !important; }

html body .m-t-3 {

  margin-top: 3px !important; }

html body .m-t-4 {

  margin-top: 4px !important; }

html body .m-t-5 {

  margin-top: 5px !important; }

html body .m-t-6 {

  margin-top: 6px !important; }

html body .m-t-7 {

  margin-top: 7px !important; }

html body .m-t-8 {

  margin-top: 8px !important; }

html body .m-t-9 {

  margin-top: 9px !important; }

html body .m-t-10 {

  margin-top: 10px !important; }

html body .m-t-11 {

  margin-top: 11px !important; }

html body .m-t-12 {

  margin-top: 12px !important; }

html body .m-t-13 {

  margin-top: 13px !important; }

html body .m-t-14 {

  margin-top: 14px !important; }

html body .m-t-15 {

  margin-top: 15px !important; }

html body .m-t-16 {

  margin-top: 16px !important; }

html body .m-t-17 {

  margin-top: 17px !important; }

html body .m-t-18 {

  margin-top: 18px !important; }

html body .m-t-19 {

  margin-top: 19px !important; }

html body .m-t-20 {

  margin-top: 20px !important; }

html body .m-t-21 {

  margin-top: 21px !important; }

html body .m-t-22 {

  margin-top: 22px !important; }

html body .m-t-23 {

  margin-top: 23px !important; }

html body .m-t-24 {

  margin-top: 24px !important; }

html body .m-t-25 {

  margin-top: 25px !important; }

html body .m-t-26 {

  margin-top: 26px !important; }

html body .m-t-27 {

  margin-top: 27px !important; }

html body .m-t-28 {

  margin-top: 28px !important; }

html body .m-t-29 {

  margin-top: 29px !important; }

html body .m-t-30 {

  margin-top: 30px !important; }

html body .m-t-31 {

  margin-top: 31px !important; }

html body .m-t-32 {

  margin-top: 32px !important; }

html body .m-t-33 {

  margin-top: 33px !important; }

html body .m-t-34 {

  margin-top: 34px !important; }

html body .m-t-35 {

  margin-top: 35px !important; }

html body .m-t-36 {

  margin-top: 36px !important; }

html body .m-t-37 {

  margin-top: 37px !important; }

html body .m-t-38 {

  margin-top: 38px !important; }

html body .m-t-39 {

  margin-top: 39px !important; }

html body .m-t-40 {

  margin-top: 40px !important; }

html body .m-t-41 {

  margin-top: 41px !important; }

html body .m-t-42 {

  margin-top: 42px !important; }

html body .m-t-43 {

  margin-top: 43px !important; }

html body .m-t-44 {

  margin-top: 44px !important; }

html body .m-t-45 {

  margin-top: 45px !important; }

html body .m-t-46 {

  margin-top: 46px !important; }

html body .m-t-47 {

  margin-top: 47px !important; }

html body .m-t-48 {

  margin-top: 48px !important; }

html body .m-t-49 {

  margin-top: 49px !important; }

html body .m-t-50 {

  margin-top: 50px !important; }

html body .m-b-0 {

  margin-bottom: 0px !important; }

html body .m-b-1 {

  margin-bottom: 1px !important; }

html body .m-b-2 {

  margin-bottom: 2px !important; }

html body .m-b-3 {

  margin-bottom: 3px !important; }

html body .m-b-4 {

  margin-bottom: 4px !important; }

html body .m-b-5 {

  margin-bottom: 5px !important; }

html body .m-b-6 {

  margin-bottom: 6px !important; }

html body .m-b-7 {

  margin-bottom: 7px !important; }

html body .m-b-8 {

  margin-bottom: 8px !important; }

html body .m-b-9 {

  margin-bottom: 9px !important; }

html body .m-b-10 {

  margin-bottom: 10px !important; }

html body .m-b-11 {

  margin-bottom: 11px !important; }

html body .m-b-12 {

  margin-bottom: 12px !important; }

html body .m-b-13 {

  margin-bottom: 13px !important; }

html body .m-b-14 {

  margin-bottom: 14px !important; }

html body .m-b-15 {

  margin-bottom: 15px !important; }

html body .m-b-16 {

  margin-bottom: 16px !important; }

html body .m-b-17 {

  margin-bottom: 17px !important; }

html body .m-b-18 {

  margin-bottom: 18px !important; }

html body .m-b-19 {

  margin-bottom: 19px !important; }

html body .m-b-20 {

  margin-bottom: 20px !important; }

html body .m-b-21 {

  margin-bottom: 21px !important; }

html body .m-b-22 {

  margin-bottom: 22px !important; }

html body .m-b-23 {

  margin-bottom: 23px !important; }

html body .m-b-24 {

  margin-bottom: 24px !important; }

html body .m-b-25 {

  margin-bottom: 25px !important; }

html body .m-b-26 {

  margin-bottom: 26px !important; }

html body .m-b-27 {

  margin-bottom: 27px !important; }

html body .m-b-28 {

  margin-bottom: 28px !important; }

html body .m-b-29 {

  margin-bottom: 29px !important; }

html body .m-b-30 {

  margin-bottom: 30px !important; }

html body .m-b-31 {

  margin-bottom: 31px !important; }

html body .m-b-32 {

  margin-bottom: 32px !important; }

html body .m-b-33 {

  margin-bottom: 33px !important; }

html body .m-b-34 {

  margin-bottom: 34px !important; }

html body .m-b-35 {

  margin-bottom: 35px !important; }

html body .m-b-36 {

  margin-bottom: 36px !important; }

html body .m-b-37 {

  margin-bottom: 37px !important; }

html body .m-b-38 {

  margin-bottom: 38px !important; }

html body .m-b-39 {

  margin-bottom: 39px !important; }

html body .m-b-40 {

  margin-bottom: 40px !important; }

html body .m-b-41 {

  margin-bottom: 41px !important; }

html body .m-b-42 {

  margin-bottom: 42px !important; }

html body .m-b-43 {

  margin-bottom: 43px !important; }

html body .m-b-44 {

  margin-bottom: 44px !important; }

html body .m-b-45 {

  margin-bottom: 45px !important; }

html body .m-b-46 {

  margin-bottom: 46px !important; }

html body .m-b-47 {

  margin-bottom: 47px !important; }

html body .m-b-48 {

  margin-bottom: 48px !important; }

html body .m-b-49 {

  margin-bottom: 49px !important; }

html body .m-b-50 {

  margin-bottom: 50px !important; }

html body .m-b--20 {

  margin-bottom: -20px !important; }



/*******************

font-size

*******************/

.font-size-inherit {

  font-size: inherit; }



.font-color-inherit {

  color: inherit; }



.font-5 {

  font-size: 5px !important; }



.font-6 {

  font-size: 6px !important; }



.font-7 {

  font-size: 7px !important; }



.font-8 {

  font-size: 8px !important; }



.font-9 {

  font-size: 9px !important; }



.font-10 {

  font-size: 10px; }



.font-11 {

  font-size: 11px; }



.font-12 {

  font-size: 12px; }



.font-13 {

  font-size: 13px; }



.font-14 {

  font-size: 14px; }



.font-15 {

  font-size: 15px; }



.font-16 {

  font-size: 16px; }



.font-17 {

  font-size: 17px; }



.font-18 {

  font-size: 18px; }



.font-19 {

  font-size: 19px; }



.font-20 {

  font-size: 20px; }



.font-21 {

  font-size: 21px; }



.font-22 {

  font-size: 22px; }



.font-23 {

  font-size: 23px; }



.font-24 {

  font-size: 24px; }



.font-26 {

  font-size: 25px; }



.font-26 {

  font-size: 26px; }



.font-27 {

  font-size: 27px; }



.font-28 {

  font-size: 28px; }



.font-29 {

  font-size: 29px; }



.font-30 {

  font-size: 30px; }



/**-------------------------------------------------------

* text decoration

* -------------------------------------------------------*/

.text-underlined {

  text-decoration: underline; }



/**-------------------------------------------------------

* dispay utilities

* -------------------------------------------------------*/

html body .display-table-row-group {

  display: table-row-group; }

html body .display-flex {

  display: -ms-flexbox !important;

  display: flex !important; }

html body .display-inline {

  display: inline !important; }

html body .display-inline-block {

  display: inline-block !important; }

html body .display-block {

  display: block !important; }



/**-------------------------------------------------------

* text utilities

* -------------------------------------------------------*/

html body .text-capitalize {

  text-transform: capitalize; }



/*******************

vertical alignment

*******************/

html body .vt {

  vertical-align: top !important; }

html body .vm {

  vertical-align: middle !important; }

html body .vb {

  vertical-align: bottom !important; }



/*******************

Opacity

*******************/

.op-5 {

  opacity: 0.5; }



.op-3 {

  opacity: 0.3; }



.cursor-pointer,

pointer-cursor {

  cursor: pointer; }



/*******************

font weight

*******************/

html body .font-bold {

  font-weight: 700; }

html body .font-normal {

  font-weight: normal; }

html body .font-light {

  font-weight: 300; }

html body .font-medium {

  font-weight: 500; }

html body .font-weight-200 {

  font-weight: 200; }

html body .font-weight-300 {

  font-weight: 300; }

html body .font-weight-400 {

  font-weight: 400; }

html body .font-weight-500 {

  font-weight: 500; }

html body .font-weight-600 {

  font-weight: 600; }

html body .font-weight-200 {

  font-weight: 200; }

html body .font-16 {

  font-size: 16px; }

html body .font-12 {

  font-size: 12px; }

html body .font-14 {

  font-size: 14px; }

html body .font-10 {

  font-size: 10px; }

html body .font-18 {

  font-size: 18px; }

html body .font-20 {

  font-size: 20px; }



/*******************

Border

*******************/

html body .b-0 {

  border: none !important; }

html body .b-r {

  border-right: 1px solid rgba(120, 130, 140, 0.13); }

html body .b-l {

  border-left: 1px solid rgba(120, 130, 140, 0.13); }

html body .b-b {

  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }

html body .b-t {

  border-top: 1px solid rgba(120, 130, 140, 0.13); }

html body .b-all {

  border: 1px solid rgba(120, 130, 140, 0.13) !important; }



/*******************

Thumb size

*******************/

.thumb-sm {

  height: 32px;

  width: 32px; }



.thumb-md {

  height: 48px;

  width: 48px; }



.thumb-lg {

  height: 88px;

  width: 88px; }



.hide {

  display: none; }



.img-circle {

  border-radius: 100%; }



.radius {

  border-radius: 4px; }



/*******************

Text Colors

*******************/

.text-white {

  color: #ffffff !important; }



.text-danger {

  color: #ff5c6c !important; }



.text-muted {

  color: #bcc3d3 !important; }



.text-warning {

  color: #ff9041 !important; }



.text-success {

  color: #24d2b5 !important; }



.text-info {

  color: #20aee3 !important; }



.text-inverse {

  color: #2f3d4a !important; }



html body .text-blue {

  color: #02bec9; }

html body .text-purple {

  color: #7460ee; }

html body .text-primary {

  color: #6772e5 !important; }

html body .text-megna {

  color: #56c0d8; }

html body .text-dark {

  color: #67757c; }

html body .text-themecolor {

  color: #20aee3; }

html body .text-brown {

  color: #795548; }

html body .text-green {

  color: #4caf50; }

html body .text-lime {

  color: #cddc39; }



html body .bg-default {

  background-color: #cccccc; }

html body .bg-megna {

  background-color: #56c0d8; }

html body .bg-theme {

  background-color: #20aee3; }

html body .bg-inverse {

  background-color: #2f3d4a; }

html body .bg-purple {

  background-color: #7460ee; }

html body .bg-light-part {

  background-color: rgba(0, 0, 0, 0.02); }

html body .bg-light-primary {

  background-color: #f1effd; }

html body .bg-light-success {

  background-color: #e8fdeb; }

html body .bg-light-info {

  background-color: #cfecfe; }

html body .bg-light-extra {

  background-color: #ebf3f5; }

html body .bg-light-warning {

  background-color: #fff8ec; }

html body .bg-light-danger {

  background-color: #f9e7eb; }

html body .bg-light-inverse {

  background-color: #f6f6f6; }

html body .bg-light {

  background-color: #e9edf2; }

html body .bg-white {

  background-color: #ffffff; }

html body .bg-brown {

  background-color: #795548; }

html body .bg-light-brown {

  background-color: #8d6e63; }

html body .bg-green {

  background-color: #4caf50; }

html body .bg-light-green {

  background-color: #66bb6a; }

html body .bg-lime {

  background-color: #cddc39; }

html body .bg-light-lime {

  background-color: #d4e157; }



/*******************

Rounds

*******************/

.round {

  line-height: 48px;

  color: #ffffff;

  width: 50px;

  height: 50px;

  display: inline-block;

  font-weight: 400;

  text-align: center;

  border-radius: 100%;

  background: #20aee3; }

  .round img {

    border-radius: 100%; }



.round-lg {

  line-height: 65px;

  width: 60px;

  height: 60px;

  font-size: 30px; }



.round.round-info {

  background: #20aee3; }



.round.round-warning {

  background: #ff9041; }



.round.round-danger {

  background: #ff5c6c; }



.round.round-success {

  background: #24d2b5; }



.round.round-primary {

  background: #6772e5; }



/*******************

Labels

*******************/

.label {

  padding: 3px 10px;

  line-height: 13px;

  color: #ffffff;

  font-weight: 400;

  border-radius: 4px;

  font-size: 75%; }



.label-rounded {

  border-radius: 60px; }



.label-custom {

  background-color: #56c0d8; }



.label-success {

  background-color: #24d2b5; }



.label-outline-success {

  background-color: initial;

  border: solid 1px #24d2b5;

  color: #24d2b5;

  padding: 2px 10px; }



.label-info {

  background-color: #20aee3; }



.label-outline-info {

  background-color: initial;

  border: solid 1px #20aee3;

  color: #20aee3;

  padding: 2px 10px; }



.label-outline-info {

  background-color: initial;

  border: solid 1px #20aee3;

  color: #20aee3;

  padding: 2px 10px; }



.label-warning {

  background-color: #ff9041; }



.label-outline-warning {

  background-color: initial;

  border: solid 1px #ff9041;

  color: #ff9041;

  padding: 2px 10px; }



.label-danger {

  background-color: #ff5c6c; }



.label-outline-danger {

  background-color: initial;

  border: solid 1px #ff5c6c;

  color: #ff5c6c;

  padding: 2px 10px; }



.label-megna {

  background-color: #56c0d8; }



.label-outline-gray {

  background-color: #e9edf2;

  border: solid 1px #e9edf2;

  color: #464545;

  padding: 2px 10px; }



.label-primary {

  background-color: #6772e5; }



.label-outline-primary {

  background-color: initial;

  border: solid 1px #6772e5;

  color: #6772e5;

  padding: 2px 10px; }



.label-purple {

  background-color: #7460ee; }



.label-outline-purple {

  background-color: initial;

  border: solid 1px #7460ee;

  color: #7460ee;

  padding: 2px 10px; }



.label-red {

  background-color: #fb3a3a; }



.label-brown {

  background-color: #795548; }



.label-outline-brown {

  background-color: initial;

  border: solid 1px #795548;

  color: #795548;

  padding: 2px 10px; }



.label-green {

  background-color: #4caf50; }



.label-outline-green {

  background-color: initial;

  border: solid 1px #4caf50;

  color: #4caf50;

  padding: 2px 10px; }



.label-lime {

  background-color: #cddc39; }



.label-outline-lime {

  background-color: initial;

  border: solid 1px #cddc39;

  color: #cddc39;

  padding: 2px 10px; }



.label-outline-red {

  background-color: initial;

  border: solid 1px #fb3a3a;

  color: #fb3a3a;

  padding: 2px 10px; }



.label-inverse {

  background-color: #2f3d4a; }



.label-outline-inverse {

  background-color: initial;

  border: solid 1px #2f3d4a;

  color: #2f3d4a;

  padding: 2px 10px; }



.label-default {

  background-color: #e9edf2;

  color: #5d5d5d; }



.label-outline-light {

  background-color: initial;

  border: solid 1px #e9edf2;

  color: #e9edf2;

  padding: 2px 10px; }



.label-white {

  background-color: #ffffff; }



.label-light-success {

  background-color: #e8fdeb;

  color: #24d2b5; }



.label-light-info {

  background-color: #cfecfe;

  color: #20aee3; }



.label-light-warning {

  background-color: #fff8ec;

  color: #ff9041; }



.label-light-danger {

  background-color: #f9e7eb;

  color: #ff5c6c; }



.label-light-megna {

  background-color: #e0f2f4;

  color: #56c0d8; }



.label-light-primary {

  background-color: #f1effd;

  color: #6772e5; }



.label-light-inverse {

  background-color: #f6f6f6;

  color: #2f3d4a; }



/*******************

 Badge

******************/

.badge {

  font-weight: 400; }



.badge-xs {

  font-size: 9px; }



.badge-xs,

.badge-sm {

  -webkit-transform: translate(0, -2px);

  -ms-transform: translate(0, -2px);

  -o-transform: translate(0, -2px);

  transform: translate(0, -2px); }



.badge-success {

  background-color: #24d2b5; }



.badge-info {

  background-color: #20aee3; }



.badge-primary {

  background-color: #6772e5; }



.badge-warning {

  background-color: #ff9041;

  color: #ffffff; }



.badge-danger {

  background-color: #ff5c6c; }



.badge-purple {

  background-color: #7460ee; }



.badge-red {

  background-color: #fb3a3a; }



.badge-brown {

  background-color: #795548; }



.badge-green {

  background-color: #4caf50; }



.badge-lime {

  background-color: #cddc39; }



.badge-inverse {

  background-color: #2f3d4a; }



/*******************

List-style-none

******************/

ul.list-style-none {

  margin: 0px;

  padding: 0px; }

  ul.list-style-none li {

    list-style: none; }

    ul.list-style-none li a {

      color: #67757c;

      padding: 8px 0px;

      display: block;

      text-decoration: none; }

      ul.list-style-none li a:hover {

        color: #20aee3; }



/*******************

dropdown-item

******************/

.dropdown-item {

  padding: 8px 1rem;

  color: #67757c; }



/*******************

Layouts

******************/

.card-no-border .card {

  border: 0px;

  border-radius: 0px;

  box-shadow: none; }



.card-no-border .shadow-none {

  box-shadow: none; }



.card-outline-danger,

.card-outline-info,

.card-outline-warning,

.card-outline-success,

.card-outline-primary {

  background: #ffffff; }



.card-fullscreen {

  position: fixed;

  top: 0px;

  left: 0px;

  width: 100%;

  height: 100%;

  z-index: 9999;

  overflow: auto; }



/*******************/

/*single column*/

/*******************/

.single-column .left-sidebar {

  display: none; }

.single-column .page-wrapper {

  margin-left: 0px; }



.fix-width {

  width: 100%;

  max-width: 1170px;

  margin: 0 auto; }



/* used mainly for invoice line items*/

.text-wrap-new-lines {

  white-space: pre-line; }



/*******************

 Our income

*******************/

.o-income .c3 line, .o-income .c3 path {

  stroke: rgba(120, 130, 140, 0.13); }



/*******************

 income of the year

*******************/

.income-o-year .c3 line, .income-o-year .c3 path {

  stroke: rgba(120, 130, 140, 0.13); }



.band .c3 path {

  stroke: #6772e5; }



/*******************

ribbons page

******************/

.ribbon-wrapper,

.ribbon-wrapper-reverse,

.ribbon-wrapper-bottom,

.ribbon-wrapper-right-bottom {

  position: relative;

  padding: 50px 15px 15px 15px; }



.ribbon-vwrapper {

  padding: 15px 15px 15px 50px;

  position: relative; }



.ribbon-overflow {

  overflow: hidden; }



.ribbon-vwrapper-reverse {

  padding: 15px 50px 15px 15px; }



.ribbon-wrapper-bottom {

  padding: 15px 15px 50px 50px; }



.ribbon-wrapper-right-bottom {

  padding: 15px 50px 50px 15px; }



.ribbon-content {

  margin-bottom: 0px; }



.ribbon {

  padding: 0 20px;

  height: 30px;

  line-height: 30px;

  clear: left;

  position: absolute;

  top: 12px;

  left: -2px;

  color: #ffffff; }



.ribbon-bookmark:before {

  position: absolute;

  top: 0;

  left: 100%;

  display: block;

  width: 0;

  height: 0;

  content: '';

  border: 15px solid #263238;

  border-right: 10px solid transparent; }



.ribbon-right {

  left: auto;

  right: -2px; }



.ribbon-bookmark.ribbon-right:before {

  right: 100%;

  left: auto;

  border-right: 15px solid #263238;

  border-left: 10px solid transparent; }



.ribbon-vertical-l,

.ribbon-vertical-r {

  clear: none;

  padding: 0 5px;

  height: 70px;

  width: 30px;

  line-height: 70px;

  text-align: center;

  left: 12px;

  top: -2px; }



.ribbon-vertical-r {

  left: auto;

  right: 12px; }



.ribbon-bookmark.ribbon-vertical-l:before,

.ribbon-bookmark.ribbon-vertical-r:before {

  top: 100%;

  left: 0;

  margin-top: -14px;

  border-right: 15px solid #263238;

  border-bottom: 10px solid transparent; }



.ribbon-badge {

  top: 15px;

  overflow: hidden;

  left: -90px;

  width: 100%;

  text-align: center;

  -webkit-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  -o-transform: rotate(-45deg);

  transform: rotate(-45deg); }



.ribbon-badge.ribbon-right {

  left: auto;

  right: -90px;

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg); }



.ribbon-badge.ribbon-bottom {

  top: auto;

  bottom: 15px;

  -webkit-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg); }



.ribbon-badge.ribbon-right.ribbon-bottom {

  -webkit-transform: rotate(-45deg);

  -ms-transform: rotate(-45deg);

  -o-transform: rotate(-45deg);

  transform: rotate(-45deg); }



.ribbon-corner {

  top: 0;

  left: 0;

  background-color: transparent !important;

  padding: 6px 0 0 10px; }



.ribbon-corner i {

  position: relative; }



.ribbon-corner:before {

  position: absolute;

  top: 0;

  left: 0;

  width: 0;

  height: 0;

  content: '';

  border: 30px solid transparent;

  border-top-color: #20aee3;

  border-left-color: #20aee3; }



.ribbon-corner.ribbon-right:before {

  right: 0;

  left: auto;

  border-right-color: #526069;

  border-left-color: transparent; }



.ribbon-corner.ribbon-right {

  right: 0;

  left: auto;

  padding: 6px 10px 0 0; }



.ribbon-corner.ribbon-bottom:before {

  top: auto;

  bottom: 0;

  border-top-color: transparent;

  border-bottom-color: #526069; }



.ribbon-corner.ribbon-bottom {

  bottom: 0;

  top: auto;

  padding: 0 10px 6px 10px; }



.ribbon-custom {

  background: #20aee3; }



.ribbon-bookmark.ribbon-right.ribbon-custom:before {

  border-right-color: #20aee3;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-custom:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-custom:before {

  border-right-color: #20aee3;

  border-bottom-color: transparent; }



.ribbon-primary {

  background: #6772e5; }



.ribbon-bookmark.ribbon-primary:before {

  border-color: #6772e5;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-primary:before {

  border-right-color: #6772e5;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-primary:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-primary:before {

  border-right-color: #6772e5;

  border-bottom-color: transparent; }



.ribbon-primary.ribbon-corner:before {

  border-top-color: #6772e5;

  border-left-color: #6772e5; }



.ribbon-primary.ribbon-corner.ribbon-right:before {

  border-right-color: #6772e5;

  border-left-color: transparent; }



.ribbon-primary.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #6772e5; }



.ribbon-success {

  background: #24d2b5; }



.ribbon-bookmark.ribbon-success:before {

  border-color: #24d2b5;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-success:before {

  border-right-color: #24d2b5;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-success:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-success:before {

  border-right-color: #24d2b5;

  border-bottom-color: transparent; }



.ribbon-success.ribbon-corner:before {

  border-top-color: #24d2b5;

  border-left-color: #24d2b5; }



.ribbon-success.ribbon-corner.ribbon-right:before {

  border-right-color: #24d2b5;

  border-left-color: transparent; }



.ribbon-success.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #24d2b5; }



.ribbon-info {

  background: #20aee3; }



.ribbon-bookmark.ribbon-info:before {

  border-color: #20aee3;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-info:before {

  border-right-color: #20aee3;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-info:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-info:before {

  border-right-color: #20aee3;

  border-bottom-color: transparent; }



.ribbon-info.ribbon-corner:before {

  border-top-color: #20aee3;

  border-left-color: #20aee3; }



.ribbon-info.ribbon-corner.ribbon-right:before {

  border-right-color: #20aee3;

  border-left-color: transparent; }



.ribbon-info.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #20aee3; }



.ribbon-warning {

  background: #ff9041; }



.ribbon-bookmark.ribbon-warning:before {

  border-color: #ff9041;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-warning:before {

  border-right-color: #ff9041;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-warning:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-warning:before {

  border-right-color: #ff9041;

  border-bottom-color: transparent; }



.ribbon-warning.ribbon-corner:before {

  border-top-color: #ff9041;

  border-left-color: #ff9041; }



.ribbon-warning.ribbon-corner.ribbon-right:before {

  border-right-color: #ff9041;

  border-left-color: transparent; }



.ribbon-warning.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #ff9041; }



.ribbon-danger {

  background: #ff5c6c; }



.ribbon-bookmark.ribbon-danger:before {

  border-color: #ff5c6c;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-danger:before {

  border-right-color: #ff5c6c;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-danger:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-danger:before {

  border-right-color: #ff5c6c;

  border-bottom-color: transparent; }



.ribbon-danger.ribbon-corner:before {

  border-top-color: #ff5c6c;

  border-left-color: #ff5c6c; }



.ribbon-danger.ribbon-corner.ribbon-right:before {

  border-right-color: #ff5c6c;

  border-left-color: transparent; }



.ribbon-danger.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #ff5c6c; }



.ribbon-default {

  background: #263238; }



.ribbon-bookmark.ribbon-default:before {

  border-color: #263238;

  border-right-color: transparent; }



.ribbon-bookmark.ribbon-right.ribbon-default:before {

  border-right-color: #263238;

  border-left-color: transparent; }



.ribbon-bookmark.ribbon-vertical-l.ribbon-default:before,

.ribbon-bookmark.ribbon-vertical-r.ribbon-default:before {

  border-right-color: #263238;

  border-bottom-color: transparent; }



.ribbon-default.ribbon-corner:before {

  border-top-color: #263238;

  border-left-color: #263238; }



.ribbon-default.ribbon-corner.ribbon-right:before {

  border-right-color: #263238;

  border-left-color: transparent; }



.ribbon-default.ribbon-corner.ribbon-bottom:before {

  border-top-color: transparent;

  border-bottom-color: #263238; }



/*

Contact: support@growcrm.io

*/

/*******************

Main sidebar

******************/

.left-sidebar {

  position: absolute;

  width: 200px;

  height: 100%;

  top: 0px;

  z-index: 20;

  padding-top: 70px;

  background: #fff;

  border-right: 1px solid rgba(120, 130, 140, 0.13); }



.fix-sidebar .left-sidebar {

  position: fixed; }



.fix-sidebar .logo-large {

  display: inline-block;

  max-width: 185px; }

.fix-sidebar .logo-small {

  display: none; }

.fix-sidebar.mini-sidebar .logo-large {

  display: none; }

.fix-sidebar.mini-sidebar .logo-small {

  display: inline-block;

  max-width: 50px; }



/*******************

use profile section

******************/

.sidebar-nav .user-profile > a img {

  width: 30px;

  border-radius: 100%;

  margin-right: 10px; }

.sidebar-nav .user-profile > ul {

  padding-left: 40px; }



/*******************

sidebar navigation

******************/

.scroll-sidebar {

  height: 100%; }

  .scroll-sidebar.ps .ps__scrollbar-y-rail {

    left: 2px;

    right: auto;

    background: none;

    width: 6px;

    /* If using `left`, there shouldn't be a `right`. */ }



.collapse.in {

  display: block; }



.sidebar-nav {

  background: #fff;

  padding: 2px 0 0 0px; }

  .sidebar-nav ul {

    margin: 0px;

    padding: 0px; }

    .sidebar-nav ul li {

      list-style: none; }

      .sidebar-nav ul li a {

        color: #8d97ad;

        padding: 12px 35px 10px 15px;

        display: block;

        font-size: 14px;

        font-weight: 300; }

        .sidebar-nav ul li a.active, .sidebar-nav ul li a:hover {

          color: #20aee3; }

          .sidebar-nav ul li a.active i, .sidebar-nav ul li a:hover i {

            color: #20aee3; }

        .sidebar-nav ul li a.active {

          font-weight: 500;

          color: #263238; }

      .sidebar-nav ul li ul {

        padding-left: 50px; }

        .sidebar-nav ul li ul li a {

          padding: 7px 35px 7px 15px; }

        .sidebar-nav ul li ul ul {

          padding-left: 15px; }

      .sidebar-nav ul li.nav-small-cap {

        font-size: 12px;

        margin-bottom: 0px;

        padding: 30px 14px 14px 0px;

        color: #bcc3d3;

        font-weight: 500; }

      .sidebar-nav ul li.nav-devider {

        height: 1px;

        background: rgba(120, 130, 140, 0.13);

        display: block;

        margin: 15px 0; }

  .sidebar-nav > ul > li > a {

    border-left: 3px solid transparent; }

    .sidebar-nav > ul > li > a i {

      width: 35px;

      font-size: 21px;

      display: inline-block;

      vertical-align: middle;

      color: #787f91; }

      .sidebar-nav > ul > li > a i .hide-menu {

        display: inline-block;

        vertical-align: middle; }

    .sidebar-nav > ul > li > a .label {

      float: right;

      margin-top: 2px; }

    .sidebar-nav > ul > li > a.active {

      font-weight: 400;

      background: #242933;

      color: #20aee3;

      border-left: 3px solid #20aee3; }

  .sidebar-nav > ul > li {

    margin-bottom: 7px;

    margin-top: 7px; }

    .sidebar-nav > ul > li.active > a {

      color: #20aee3;

      font-weight: 500; }

      .sidebar-nav > ul > li.active > a i {

        color: #20aee3; }

  .sidebar-nav .waves-effect {

    transition: none;

    -webkit-transition: none;

    -o-transition: none; }



.sidebar-nav .has-arrow {

  position: relative; }

  .sidebar-nav .has-arrow::after {

    position: absolute;

    content: '';

    width: 7px;

    height: 7px;

    border-width: 1px 0 0 1px;

    border-style: solid;

    border-color: #8d97ad;

    right: 20px;

    -webkit-transform: rotate(135deg) translate(0, -50%);

    -ms-transform: rotate(135deg) translate(0, -50%);

    -o-transform: rotate(135deg) translate(0, -50%);

    transform: rotate(135deg) translate(0, -50%);

    -webkit-transform-origin: top;

    -ms-transform-origin: top;

    -o-transform-origin: top;

    transform-origin: top;

    top: 45%;

    -webkit-transition: all .3s ease-out;

    -o-transition: all .3s ease-out;

    transition: all .3s ease-out; }



.sidebar-nav .active > .has-arrow::after,

.sidebar-nav li > .has-arrow.active::after,

.sidebar-nav .has-arrow[aria-expanded="true"]::after {

  -webkit-transform: rotate(-135deg) translate(0, -50%);

  -ms-transform: rotate(-135deg) translate(0, -50%);

  -o-transform: rotate(-135deg) translate(0, -50%);

  top: 42%;

  width: 7px;

  transform: rotate(-135deg) translate(0, -50%); }



/****************

When click on sidebar toggler and also for tablet

*****************/

@media (min-width: 768px) {

  .mini-sidebar .sidebar-nav #sidebarnav li {

    position: relative; }



  .mini-sidebar .sidebar-nav #sidebarnav > li > ul {

    position: absolute;

    left: 75px;

    top: 46px;

    width: 220px;

    padding-bottom: 10px;

    z-index: 1001;

    background: #edf0f5;

    display: none;

    padding-left: 1px; }

    .mini-sidebar .sidebar-nav #sidebarnav > li > ul.position-top {

      top: initial;

      bottom: 46px; }



  .mini-sidebar .user-profile .profile-img {

    width: 45px; }

    .mini-sidebar .user-profile .profile-img .setpos {

      top: -35px; }



  .mini-sidebar.fix-sidebar .left-sidebar {

    position: fixed; }



  .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul {

    height: auto !important;

    overflow: auto; }



  .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul,

  .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul.collapse {

    display: block; }



  .mini-sidebar .sidebar-nav #sidebarnav > li > a.has-arrow:after {

    display: none; }



  .mini-sidebar .left-sidebar {

    width: 75px; }

  .mini-sidebar .sidebar-nav #sidebarnav .user-profile > a {

    padding: 12px 20px; }

  .mini-sidebar .scroll-sidebar {

    padding-bottom: 0px;

    position: absolute; }

  .mini-sidebar .hide-menu,

  .mini-sidebar .nav-small-cap,

  .mini-sidebar .sidebar-footer,

  .mini-sidebar .user-profile .profile-text,

  .mini-sidebar > .label {

    display: none; }

  .mini-sidebar .nav-devider {

    width: 70px; }

  .mini-sidebar .sidebar-nav {

    background: transparent; }

  .mini-sidebar .sidebar-nav #sidebarnav > li > a {

    padding: 12px 22px;

    width: 75px; }

  .mini-sidebar .sidenav-menu-item .logo a {

    padding: 12px 22px;

    width: 75px; }

  .mini-sidebar .sidebar-nav #sidebarnav > li.has-submenu:hover > a {

    width: 295px; }

    .mini-sidebar .sidebar-nav #sidebarnav > li.has-submenu:hover > a .hide-menu {

      display: inline; }

    .mini-sidebar .sidebar-nav #sidebarnav > li.has-submenu:hover > a .label {

      display: none; }

  .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a {

    background: #edf0f5; } }

@media (max-width: 767px) {

  .mini-sidebar .left-sidebar {

    position: fixed; }

  .mini-sidebar .left-sidebar,

  .mini-sidebar .sidebar-footer {

    left: -260px; }

  .mini-sidebar.show-sidebar .left-sidebar,

  .mini-sidebar.show-sidebar .sidebar-footer {

    left: 0px !important; } }

/*============================================================== 

 For all pages 

 ============================================================== */

#main-wrapper {

  width: 100%;

  overflow: hidden; }



.boxed #main-wrapper {

  width: 100%;

  max-width: 1300px;

  margin: 0 auto;

  box-shadow: 0 0 60px rgba(0, 0, 0, 0.1); }

  .boxed #main-wrapper .sidebar-footer {

    position: absolute; }

  .boxed #main-wrapper .topbar {

    max-width: 1300px; }

  .boxed #main-wrapper .footer {

    display: none; }



.page-wrapper {

  background: #f6f9fa;

  padding-bottom: 60px;

  position: relative; }



.container-fluid {

  padding: 25px 25px; }



.card {

  margin-bottom: 30px; }

  .card .card-subtitle {

    font-weight: 300;

    margin-bottom: 15px;

    color: #bcc3d3; }

  .card .card-title {

    position: relative;

    font-weight: 400; }



/*******************

 Topbar

*******************/

.fix-header .topbar {

  position: fixed;

  width: 100%;

  margin-left: 75px; }

.fix-header .page-wrapper {

  padding-top: 70px; }

.fix-header .right-side-panel {

  top: 70px;

  height: calc(100% - 70px); }



.topbar {

  position: relative;

  z-index: 50; }

  .topbar .navbar-collapse {

    padding: 0px;

    border-bottom: 1px solid rgba(120, 130, 140, 0.13); }

  .topbar .top-navbar {

    min-height: 70px;

    padding: 0px; }

    .topbar .top-navbar .dropdown-toggle::after {

      display: none; }

    .topbar .top-navbar .navbar-header {

      line-height: 72px;

      padding-left: 10px;

      border-right: 1px solid rgba(120, 130, 140, 0.13);

      border-bottom: 1px solid rgba(120, 130, 140, 0.13);

      margin-top: -1px; }

      .topbar .top-navbar .navbar-header .navbar-brand {

        margin-right: 0px;

        padding-bottom: 0px;

        padding-top: 0px; }

        .topbar .top-navbar .navbar-header .navbar-brand .light-logo {

          display: none; }

        .topbar .top-navbar .navbar-header .navbar-brand b {

          line-height: 70px;

          display: inline-block; }

    .topbar .top-navbar .navbar-nav > .nav-item > .nav-link {

      padding-left: 12px;

      padding-right: 12px;

      font-size: 20px;

      line-height: 54px; }

    .topbar .top-navbar .navbar-nav > .nav-item > span {

      line-height: 65px;

      font-size: 24px;

      font-weight: 500;

      color: #ffffff;

      padding: 0 10px; }

    .topbar .top-navbar .navbar-nav > .nav-item.show {

      background: rgba(0, 0, 0, 0.05); }

  .topbar .u-pro {

    margin-left: 10px; }

  .topbar .profile-pic {

    white-space: nowrap;

    padding-left: 15px;

    border-left: 1px solid rgba(120, 130, 140, 0.13); }

    .topbar .profile-pic img {

      width: 30px;

      height: 30px;

      border-radius: 100%; }

    .topbar .profile-pic span {

      font-size: 14px;

      white-space: nowrap; }

  .topbar .dropdown-menu {

    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

    -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

    -moz-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

    border-color: rgba(120, 130, 140, 0.13); }

    .topbar .dropdown-menu .dropdown-item {

      padding: 7px 1.5rem; }

      .topbar .dropdown-menu .dropdown-item.dropdown-item-iconed {

        padding-left: 19px;

        min-width: 200px;

        font-size: 15px; }

        .topbar .dropdown-menu .dropdown-item.dropdown-item-iconed i {

          padding-right: 10px; }

  .topbar ul.dropdown-user {

    padding: 0px;

    min-width: 270px; }

    .topbar ul.dropdown-user li {

      list-style: none;

      padding: 0px;

      margin: 0px; }

      .topbar ul.dropdown-user li.divider {

        height: 1px;

        margin: 9px 0;

        overflow: hidden;

        background-color: rgba(120, 130, 140, 0.13); }

      .topbar ul.dropdown-user li .dw-user-box {

        padding: 10px 15px; }

        .topbar ul.dropdown-user li .dw-user-box .u-img {

          width: 70px;

          height: 70px;

          display: inline-block;

          vertical-align: top; }

          .topbar ul.dropdown-user li .dw-user-box .u-img img {

            width: 70px;

            height: 70px;

            border-radius: 5px; }

        .topbar ul.dropdown-user li .dw-user-box .u-text {

          display: inline-block;

          padding-left: 10px; }

          .topbar ul.dropdown-user li .dw-user-box .u-text h4 {

            margin: 0px;

            font-size: 15px; }

          .topbar ul.dropdown-user li .dw-user-box .u-text p {

            margin-bottom: 2px;

            font-size: 12px; }

          .topbar ul.dropdown-user li .dw-user-box .u-text .btn {

            color: #ffffff;

            padding: 5px 10px;

            display: inline-block; }

            .topbar ul.dropdown-user li .dw-user-box .u-text .btn:hover {

              background: #e6294b; }

      .topbar ul.dropdown-user li a {

        padding: 9px 15px;

        display: block;

        color: #67757c; }

        .topbar ul.dropdown-user li a:hover {

          background: #e9edf2;

          color: #20aee3;

          text-decoration: none; }



.search-box .app-search {

  position: absolute;

  margin: 0px;

  display: block;

  z-index: 110;

  width: 100%;

  top: -1px;

  box-shadow: 2px 0px 10px rgba(0, 0, 0, 0.2);

  display: none;

  left: 0px; }

  .search-box .app-search input {

    width: 100.5%;

    padding: 25px 40px 25px 20px;

    border-radius: 0px;

    font-size: 17px;

    transition: 0.5s ease-in; }

    .search-box .app-search input:focus {

      border-color: #ffffff; }

  .search-box .app-search .srh-btn {

    position: absolute;

    top: 23px;

    cursor: pointer;

    background: #ffffff;

    width: 15px;

    height: 15px;

    right: 20px;

    font-size: 14px; }



.mini-sidebar .top-navbar .navbar-header {

  width: 75px;

  text-align: center;

  flex-shrink: 0;

  padding-left: 0px;

  border-bottom: 1px solid rgba(120, 130, 140, 0.13);

  margin-top: -1px; }



.logo-center .top-navbar .navbar-header {

  position: absolute;

  left: 0;

  right: 0;

  margin: 0 auto; }



/*******************

Notify

*******************/

.notify {

  position: relative;

  top: -28px;

  right: -7px; }

  .notify .heartbit {

    position: absolute;

    top: -22px;

    right: -1px;

    height: 25px;

    width: 25px;

    z-index: 10;

    border: 5px solid #ff5c6c;

    border-radius: 70px;

    -moz-animation: heartbit 1s ease-out;

    -moz-animation-iteration-count: infinite;

    -o-animation: heartbit 1s ease-out;

    -o-animation-iteration-count: infinite;

    -webkit-animation: heartbit 1s ease-out;

    -webkit-animation-iteration-count: infinite;

    animation-iteration-count: infinite; }

  .notify .point {

    width: 6px;

    height: 6px;

    -webkit-border-radius: 30px;

    -moz-border-radius: 30px;

    border-radius: 30px;

    background-color: #ff5c6c;

    position: absolute;

    right: 9px;

    top: -12px; }



@-moz-keyframes heartbit {

  0% {

    -moz-transform: scale(0);

    opacity: 0.0; }

  25% {

    -moz-transform: scale(0.1);

    opacity: 0.1; }

  50% {

    -moz-transform: scale(0.5);

    opacity: 0.3; }

  75% {

    -moz-transform: scale(0.8);

    opacity: 0.5; }

  100% {

    -moz-transform: scale(1);

    opacity: 0.0; } }

@-webkit-keyframes heartbit {

  0% {

    -webkit-transform: scale(0);

    opacity: 0.0; }

  25% {

    -webkit-transform: scale(0.1);

    opacity: 0.1; }

  50% {

    -webkit-transform: scale(0.5);

    opacity: 0.3; }

  75% {

    -webkit-transform: scale(0.8);

    opacity: 0.5; }

  100% {

    -webkit-transform: scale(1);

    opacity: 0.0; } }

/*******************

 Horizontal-navabar

*******************/

.hdr-nav-bar .navbar {

  background: #ffffff;

  border-top: 1px solid rgba(120, 130, 140, 0.13);

  padding: 0 15px; }

  .hdr-nav-bar .navbar .navbar-nav > li {

    padding: 0 10px; }

    .hdr-nav-bar .navbar .navbar-nav > li > a {

      padding: 25px 5px;

      transition: 0.2s ease-in;

      border-bottom: 2px solid transparent; }

    .hdr-nav-bar .navbar .navbar-nav > li.active > a, .hdr-nav-bar .navbar .navbar-nav > li:hover > a,

    .hdr-nav-bar .navbar .navbar-nav > li > a:focus {

      border-color: #20aee3; }

  .hdr-nav-bar .navbar .navbar-nav .dropdown-toggle:after {

    display: none; }

  .hdr-nav-bar .navbar .navbar-brand {

    padding: 20px 5px; }

  .hdr-nav-bar .navbar .navbar-toggler {

    border: 0px;

    cursor: pointer; }

  .hdr-nav-bar .navbar .custom-select {

    border-radius: 60px;

    font-size: 14px;

    padding: .375rem 40px .375rem 18px; }

  .hdr-nav-bar .navbar .call-to-act {

    padding: 15px 0; }



/*******************

 Breadcrumb and page title

*******************/

.page-titles {

  background: #f6f9fa;

  margin-bottom: 20px;

  padding: 0px; }

  .page-titles h3 {

    margin-bottom: 0px;

    margin-top: 0px; }

  .page-titles .breadcrumb {

    padding: 0px;

    margin-bottom: 0px;

    background: transparent;

    font-size: 12px; }

    .page-titles .breadcrumb li {

      margin-top: 5px;

      margin-bottom: 5px; }

      .page-titles .breadcrumb li a {

        color: #67757c; }

    .page-titles .breadcrumb .breadcrumb-item + .breadcrumb-item::before {

      content: "\e649";

      font-family: themify;

      color: #a6b7bf;

      font-size: 11px; }

    .page-titles .breadcrumb .breadcrumb-item.active {

      color: #263238;

      font-weight: 500; }



.p-relative {

  position: relative; }



.lstick {

  width: 2px;

  background: #20aee3;

  height: 30px;

  margin-left: -20px;

  margin-right: 18px;

  display: inline-block;

  vertical-align: middle; }



/*******************

 Right side toggle

*******************/

@-webkit-keyframes rotate {

  from {

    -webkit-transform: rotate(0deg); }

  to {

    -webkit-transform: rotate(360deg); } }

@-moz-keyframes rotate {

  from {

    -moz-transform: rotate(0deg); }

  to {

    -moz-transform: rotate(360deg); } }

@keyframes rotate {

  from {

    transform: rotate(0deg); }

  to {

    transform: rotate(360deg); } }

.right-side-toggle {

  position: relative; }



.right-side-toggle i {

  -webkit-transition-property: -webkit-transform;

  -webkit-transition-duration: 1s;

  -moz-transition-property: -moz-transform;

  -moz-transition-duration: 1s;

  transition-property: transform;

  transition-duration: 1s;

  -webkit-animation-name: rotate;

  -webkit-animation-duration: 2s;

  -webkit-animation-iteration-count: infinite;

  -webkit-animation-timing-function: linear;

  -moz-animation-name: rotate;

  -moz-animation-duration: 2s;

  -moz-animation-iteration-count: infinite;

  -moz-animation-timing-function: linear;

  animation-name: rotate;

  animation-duration: 2s;

  animation-iteration-count: infinite;

  animation-timing-function: linear;

  position: absolute;

  top: 18px;

  left: 18px; }



.right-sidebar {

  position: fixed;

  right: -240px;

  width: 240px;

  display: none;

  z-index: 55;

  background: #ffffff;

  top: 0px;

  padding-bottom: 20px;

  height: 100%;

  box-shadow: 5px 1px 40px rgba(0, 0, 0, 0.1);

  transition: all 0.3s ease; }

  .right-sidebar .rpanel-title {

    display: block;

    padding: 24px 20px 25px 20px;

    color: #ffffff;

    text-transform: capitalize;

    font-size: 17px;

    background: #20aee3;

    font-weight: 200; }

    .right-sidebar .rpanel-title span {

      float: right;

      cursor: pointer;

      font-size: 11px; }

      .right-sidebar .rpanel-title span:hover {

        color: #ffffff; }

    .right-sidebar .rpanel-title i {

      vertical-align: middle;

      font-size: 22px;

      padding-right: 6px; }

      .right-sidebar .rpanel-title i.ti-close {

        font-size: 14px; }

  .right-sidebar .r-panel-body {

    padding: 20px;

    overflow: hidden;

    max-height: 100%; }

    .right-sidebar .r-panel-body ul {

      margin: 0px;

      padding: 0px; }

      .right-sidebar .r-panel-body ul li {

        list-style: none;

        padding: 5px 0; }



.shw-rside {

  right: 0px;

  width: 320px;

  display: block; }



.chatonline img {

  margin-right: 10px;

  float: left;

  width: 30px; }

.chatonline li a {

  padding: 13px 0;

  float: left;

  width: 100%; }

  .chatonline li a span {

    color: #67757c; }

    .chatonline li a span small {

      display: block;

      font-size: 10px; }



/*******************

 Right side toggle

*******************/

ul#themecolors {

  display: block; }

  ul#themecolors li {

    display: inline-block; }

    ul#themecolors li:first-child {

      display: block; }

    ul#themecolors li a {

      width: 50px;

      height: 50px;

      display: inline-block;

      margin: 5px;

      color: transparent;

      position: relative; }

      ul#themecolors li a.working:before {

        content: "\f00c";

        font-family: "FontAwesome";

        font-size: 18px;

        line-height: 50px;

        width: 50px;

        height: 50px;

        position: absolute;

        top: 0;

        left: 0;

        color: #ffffff;

        text-align: center; }



.default-theme {

  background: #bcc3d3; }



.green-theme {

  background: #24d2b5; }



.yellow-theme {

  background: #ff9041; }



.red-theme {

  background: #ff5c6c; }



.blue-theme {

  background: #20aee3; }



.purple-theme {

  background: #7460ee; }



.megna-theme {

  background: #56c0d8; }



.default-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #bcc3d3 23%, #bcc3d3 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #bcc3d3 23%, #bcc3d3 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #bcc3d3 23%, #bcc3d3 99%); }



.green-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #24d2b5 23%, #24d2b5 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #00c292 23%, #24d2b5 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #24d2b5 23%, #24d2b5 99%); }



.yellow-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%); }



.blue-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #20aee3 23%, #20aee3 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #20aee3 23%, #20aee3 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #20aee3 23%, #20aee3 99%); }



.purple-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #7460ee 23%, #7460ee 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #7460ee 23%, #7460ee 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #7460ee 23%, #7460ee 99%); }



.megna-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #56c0d8 23%, #56c0d8 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #56c0d8 23%, #56c0d8 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #56c0d8 23%, #56c0d8 99%); }



.red-dark-theme {

  background: #263238;

  /* Old browsers */

  background: -moz-linear-gradient(left, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%);

  /* FF3.6-15 */

  background: -webkit-linear-gradient(left, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%);

  /* Chrome10-25,Safari5.1-6 */

  background: linear-gradient(to right, #263238 0%, #263238 23%, #ff5c6c 23%, #ff5c6c 99%); }



/*******************

 Footer

*******************/

.footer {

  bottom: 0;

  color: #67757c;

  left: 0px;

  padding: 17px 15px;

  position: absolute;

  right: 0;

  border-top: 1px solid rgba(120, 130, 140, 0.13);

  background: #ffffff; }



/*******************

 scrollbar

*******************/

.slimScrollBar {

  z-index: 10 !important; }



/*******************

Megamenu

******************/

.mega-dropdown {

  position: static;

  width: 100%; }

  .mega-dropdown .dropdown-menu {

    width: 100%;

    padding: 30px;

    margin-top: 0px; }

  .mega-dropdown ul {

    padding: 0px; }

    .mega-dropdown ul li {

      list-style: none; }

  .mega-dropdown .carousel-item .container {

    padding: 0px; }

  .mega-dropdown .nav-accordion .card {

    margin-bottom: 1px; }

  .mega-dropdown .nav-accordion .card-header {

    background: #ffffff; }

    .mega-dropdown .nav-accordion .card-header h5 {

      margin: 0px; }

      .mega-dropdown .nav-accordion .card-header h5 a {

        text-decoration: none;

        color: #67757c; }



/*******************

Wave Effects

*******************/

.waves-effect {

  position: relative;

  cursor: pointer;

  display: inline-block;

  overflow: hidden;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  -webkit-tap-highlight-color: transparent;

  vertical-align: middle;

  z-index: 1;

  -webkit-transition: all 0.1s ease-out;

  -moz-transition: all 0.1s ease-out;

  -o-transition: all 0.1s ease-out;

  -ms-transition: all 0.1s ease-out;

  transition: all 0.1s ease-out; }

  .waves-effect .waves-ripple {

    position: absolute;

    border-radius: 50%;

    width: 20px;

    height: 20px;

    margin-top: -10px;

    margin-left: -10px;

    opacity: 0;

    background: rgba(0, 0, 0, 0.2);

    -webkit-transition: all 0.7s ease-out;

    -moz-transition: all 0.7s ease-out;

    -o-transition: all 0.7s ease-out;

    -ms-transition: all 0.7s ease-out;

    transition: all 0.7s ease-out;

    -webkit-transition-property: -webkit-transform, opacity;

    -moz-transition-property: -moz-transform, opacity;

    -o-transition-property: -o-transform, opacity;

    transition-property: transform, opacity;

    -webkit-transform: scale(0);

    -moz-transform: scale(0);

    -ms-transform: scale(0);

    -o-transform: scale(0);

    transform: scale(0);

    pointer-events: none; }



.waves-effect.waves-light .waves-ripple {

  background-color: rgba(255, 255, 255, 0.45); }



.waves-effect.waves-red .waves-ripple {

  background-color: rgba(244, 67, 54, 0.7); }



.waves-effect.waves-yellow .waves-ripple {

  background-color: rgba(255, 235, 59, 0.7); }



.waves-effect.waves-orange .waves-ripple {

  background-color: rgba(255, 152, 0, 0.7); }



.waves-effect.waves-purple .waves-ripple {

  background-color: rgba(156, 39, 176, 0.7); }



.waves-effect.waves-green .waves-ripple {

  background-color: rgba(76, 175, 80, 0.7); }



.waves-effect.waves-teal .waves-ripple {

  background-color: rgba(0, 150, 136, 0.7); }



html body .waves-notransition {

  -webkit-transition: none;

  -moz-transition: none;

  -o-transition: none;

  -ms-transition: none;

  transition: none; }



.waves-circle {

  -webkit-transform: translateZ(0);

  -moz-transform: translateZ(0);

  -ms-transform: translateZ(0);

  -o-transform: translateZ(0);

  transform: translateZ(0);

  text-align: center;

  width: 2.5em;

  height: 2.5em;

  line-height: 2.5em;

  border-radius: 50%;

  -webkit-mask-image: none; }



.waves-input-wrapper {

  border-radius: 0.2em;

  vertical-align: bottom; }

  .waves-input-wrapper .waves-button-input {

    position: relative;

    top: 0;

    left: 0;

    z-index: 1; }



.waves-block {

  display: block; }



/*******************

List inline

*******************/

ul.list-inline li {

  display: inline-block;

  padding: 0 8px; }



/*******************

Table td vertical middle

*******************/

.vm.table td,

.vm.table th {

  vertical-align: middle; }



.no-th-brd.table th {

  border: 0px; }



.table.no-border tbody td {

  border: 0px; }



/*******************

Other comon js for all pages

*******************/

.calendar-events {

  padding: 8px 10px;

  border: 1px solid #ffffff;

  cursor: move; }

  .calendar-events:hover {

    border: 1px dashed rgba(120, 130, 140, 0.13); }

  .calendar-events i {

    margin-right: 8px; }



.table-responsive {

  display: block;

  width: 100%;

  overflow-x: auto;

  -ms-overflow-style: -ms-autohiding-scrollbar; }



.single-column .left-sidebar {

  display: none; }

.single-column .page-wrapper {

  margin-left: 0px !important; }



.profile-tab li a.nav-link,

.customtab li a.nav-link {

  border: 0px;

  padding: 15px 20px;

  color: #67757c; }

  .profile-tab li a.nav-link.active,

  .customtab li a.nav-link.active {

    border-bottom: 2px solid #20aee3;

    color: #20aee3; }

  .profile-tab li a.nav-link:hover,

  .customtab li a.nav-link:hover {

    color: #20aee3; }



html body .jqstooltip,

html body .flotTip {

  width: auto !important;

  height: auto !important;

  background: #263238;

  color: #ffffff;

  padding: 5px 10px; }



body .jqstooltip {

  border-color: transparent;

  border-radius: 60px; }



/*******************

Notification page Jquery toaster

******************/

.jq-icon-info {

  background-color: #20aee3;

  color: #ffffff; }



.jq-icon-success {

  background-color: #24d2b5;

  color: #ffffff; }



.jq-icon-error {

  background-color: #ff5c6c;

  color: #ffffff; }



.jq-icon-warning {

  background-color: #ff9041;

  color: #ffffff; }



/*******************

c3 chart global

******************/

.c3 text {

  fill-opacity: 0.5; }



.no-shrink {

  flex-shrink: 0; }



.up-img {

  background-size: cover;

  background-position: center center;

  min-height: 340px; }



/*******************

Pagination

*******************/

.pagination > li:first-child > a,

.pagination > li:first-child > span {

  border-bottom-left-radius: 4px;

  border-top-left-radius: 4px; }



.pagination > li:last-child > a,

.pagination > li:last-child > span {

  border-bottom-right-radius: 4px;

  border-top-right-radius: 4px; }



.pagination > li > a,

.pagination > li > span {

  color: #263238; }



.pagination > li > a:hover,

.pagination > li > span:hover,

.pagination > li > a:focus,

.pagination > li > span:focus {

  background-color: #e9edf2; }



.pagination-split li {

  margin-left: 5px;

  display: inline-block; }



.pagination-split li:first-child {

  margin-left: 0; }



.pagination-split li a {

  -moz-border-radius: 4px;

  -webkit-border-radius: 4px;

  border-radius: 4px; }



.pagination > .active > a,

.pagination > .active > span,

.pagination > .active > a:hover,

.pagination > .active > span:hover,

.pagination > .active > a:focus,

.pagination > .active > span:focus {

  background-color: #20aee3;

  border-color: #20aee3; }



.pager li > a,

.pager li > span {

  -moz-border-radius: 4px;

  -webkit-border-radius: 4px;

  border-radius: 4px;

  color: #263238; }



/*******************

Pagination

******************/

.pagination-circle li.active a {

  background: #24d2b5; }

.pagination-circle li a {

  width: 40px;

  height: 40px;

  background: #e9edf2;

  border: 0px;

  text-align: center;

  border-radius: 100%; }

  .pagination-circle li a:first-child, .pagination-circle li a:last-child {

    border-radius: 100%; }

  .pagination-circle li a:hover {

    background: #24d2b5;

    color: #ffffff; }

.pagination-circle li.disabled a {

  background: #e9edf2;

  color: rgba(120, 130, 140, 0.13); }



/*******************

Buttons

******************/

.btn {

  padding: 7px 12px;

  cursor: pointer;

  font-size: 0.9rem;

  position: relative; }

  .btn:hover {

    opacity: 0.8; }

  .btn:focus {

    box-shadow: none; }



.btn-group label {

  color: #ffffff !important;

  margin-bottom: 0px; }

  .btn-group label.btn-secondary {

    color: #67757c !important; }



.btn-lg {

  padding: 5px;

  font-size: 16px;

  font-weight: 500; }



.btn-md {

  padding: 12px 55px;

  font-size: 16px; }



.btn-circle {

  border-radius: 100%;

  width: 40px;

  height: 40px;

  padding: 10px; }



.btn-circle.btn-sm {

  width: 22px;

  height: 22px;

  padding: 3px;

  font-size: 11px; }



.btn-circle.btn-lg {

  width: 50px;

  height: 50px;

  padding: 14px 15px;

  font-size: 18px;

  line-height: 23px; }



.btn-circle.btn-xl {

  width: 70px;

  height: 70px;

  padding: 14px 15px;

  font-size: 24px; }



.btn-sm {

  padding: .25rem .5rem;

  font-size: 12px; }



.btn-xs {

  padding: .25rem .5rem;

  font-size: 10px; }



.btn-group-sm {

  padding: 6px 10px; }



.button-list button,

.button-list a {

  margin: 5px 12px 5px 0; }



.btn-outline {

  color: inherit;

  background-color: transparent;

  transition: all .5s; }



.btn-rounded {

  border-radius: 60px;

  padding: 7px 18px; }

  .btn-rounded.btn-lg {

    padding: .75rem 1.5rem; }

  .btn-rounded.btn-sm {

    padding: .25rem .5rem;

    font-size: 12px; }

  .btn-rounded.btn-xs {

    padding: .25rem .5rem;

    font-size: 10px; }

  .btn-rounded.btn-md {

    padding: 12px 35px;

    font-size: 16px; }



.btn-secondary,

.btn-secondary.disabled {

  transition: 0.2s ease-in;

  background-color: #ffffff;

  color: #67757c;

  border-color: #cccccc; }

  .btn-secondary:hover,

  .btn-secondary.disabled:hover {

    color: #ffffff !important; }

  .btn-secondary.active, .btn-secondary:active, .btn-secondary:focus,

  .btn-secondary.disabled.active,

  .btn-secondary.disabled:active,

  .btn-secondary.disabled:focus {

    background-color: #ffffff;

    color: #67757c !important;

    border-color: #cccccc; }



.btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled:active {

  color: #67757c !important;

  background-color: #ffffff;

  border-color: #cccccc;

  cursor: default; }



.btn-primary,

.btn-primary.disabled {

  background: #6772e5;

  border: 1px solid #6772e5;

  transition: 0.2s ease-in; }

  .btn-primary:hover,

  .btn-primary.disabled:hover {

    background: #6772e5;

    box-shadow: 0 14px 26px -12px rgba(116, 96, 238, 0.42), 0 4px 23px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(116, 96, 238, 0.2);

    border: 1px solid #6772e5; }

  .btn-primary.active, .btn-primary:active, .btn-primary:focus,

  .btn-primary.disabled.active,

  .btn-primary.disabled:active,

  .btn-primary.disabled:focus {

    background: #6352ce;

    border-color: transparent; }



.btn-themecolor,

.btn-themecolor.disabled {

  background: #20aee3;

  color: #ffffff;

  border: 1px solid #20aee3; }

  .btn-themecolor:hover,

  .btn-themecolor.disabled:hover {

    background: #20aee3;

    opacity: 0.7;

    border: 1px solid #20aee3; }

  .btn-themecolor.active, .btn-themecolor:active, .btn-themecolor:focus,

  .btn-themecolor.disabled.active,

  .btn-themecolor.disabled:active,

  .btn-themecolor.disabled:focus {

    background: #1d96c3; }



.btn-success,

.btn-success.disabled {

  background: #24d2b5;

  border: 1px solid #24d2b5;

  transition: 0.2s ease-in; }

  .btn-success:hover,

  .btn-success.disabled:hover {

    background: #24d2b5;

    border: 1px solid #24d2b5; }

  .btn-success.active, .btn-success:active, .btn-success:focus,

  .btn-success.disabled.active,

  .btn-success.disabled:active,

  .btn-success.disabled:focus {

    background: #04b381;

    border-color: transparent; }



.btn-info,

.btn-info.disabled {

  background: #20aee3;

  border: 1px solid #20aee3;

  transition: 0.2s ease-in; }

  .btn-info:hover,

  .btn-info.disabled:hover {

    background: #20aee3;

    border: 1px solid #20aee3; }

  .btn-info.active, .btn-info:active, .btn-info:focus,

  .btn-info.disabled.active,

  .btn-info.disabled:active,

  .btn-info.disabled:focus {

    background: #1d96c3;

    border-color: transparent; }



.btn-warning,

.btn-warning.disabled {

  background: #ff9041;

  color: #ffffff;

  border: 1px solid #ff9041;

  transition: 0.2s ease-in; }

  .btn-warning:hover,

  .btn-warning.disabled:hover {

    background: #ff9041;

    color: #ffffff;

    border: 1px solid #ff9041; }

  .btn-warning.active, .btn-warning:active, .btn-warning:focus,

  .btn-warning.disabled.active,

  .btn-warning.disabled:active,

  .btn-warning.disabled:focus {

    background: #e9ab2e;

    color: #ffffff;

    border-color: transparent; }



.btn-danger,

.btn-danger.disabled {

  background: #ff5c6c;

  border: 1px solid #ff5c6c;

  transition: 0.2s ease-in; }

  .btn-danger:hover,

  .btn-danger.disabled:hover {

    background: #ff5c6c;

    border: 1px solid #ff5c6c; }

  .btn-danger.active, .btn-danger:active, .btn-danger:focus,

  .btn-danger.disabled.active,

  .btn-danger.disabled:active,

  .btn-danger.disabled:focus {

    background: #e6294b;

    border-color: transparent; }



.btn-inverse,

.btn-inverse.disabled {

  background: #2f3d4a;

  border: 1px solid #2f3d4a;

  color: #ffffff; }

  .btn-inverse:hover,

  .btn-inverse.disabled:hover {

    background: #2f3d4a;

    opacity: 0.7;

    color: #ffffff;

    border: 1px solid #2f3d4a; }

  .btn-inverse.active, .btn-inverse:active, .btn-inverse:focus,

  .btn-inverse.disabled.active,

  .btn-inverse.disabled:active,

  .btn-inverse.disabled:focus {

    background: #232a37;

    color: #ffffff; }



.btn-red,

.btn-red.disabled {

  background: #fb3a3a;

  border: 1px solid #fb3a3a;

  color: #ffffff; }

  .btn-red:hover,

  .btn-red.disabled:hover {

    opacity: 0.7;

    border: 1px solid #fb3a3a;

    background: #fb3a3a; }

  .btn-red.active, .btn-red:active, .btn-red:focus,

  .btn-red.disabled.active,

  .btn-red.disabled:active,

  .btn-red.disabled:focus {

    background: #e6294b; }



.btn-outline-secondary {

  background-color: #ffffff;

  transition: 0.2s ease-in;

  border-color: #cccccc; }



.btn-outline-primary {

  color: #6772e5;

  background-color: #ffffff;

  border-color: #6772e5;

  transition: 0.2s ease-in; }

  .btn-outline-primary:hover, .btn-outline-primary:focus, .btn-outline-primary.focus {

    background: #6772e5;

    color: #ffffff;

    border-color: #6772e5; }

  .btn-outline-primary.active, .btn-outline-primary:active, .btn-outline-primary:focus {

    background-color: #6352ce;

    border-color: #6352ce; }



.btn-outline-success {

  color: #24d2b5;

  background-color: transparent;

  border-color: #24d2b5;

  transition: 0.2s ease-in; }

  .btn-outline-success:hover, .btn-outline-success:focus, .btn-outline-success.focus {

    background: #24d2b5;

    border-color: #24d2b5;

    color: #ffffff; }

  .btn-outline-success.active, .btn-outline-success:active, .btn-outline-success:focus {

    background-color: #04b381;

    border-color: #04b381; }



.btn-outline-info {

  color: #20aee3;

  background-color: transparent;

  border-color: #20aee3;

  transition: 0.2s ease-in; }

  .btn-outline-info:hover, .btn-outline-info:focus, .btn-outline-info.focus {

    background: #20aee3;

    border-color: #20aee3;

    color: #ffffff; }

  .btn-outline-info.active, .btn-outline-info:active, .btn-outline-info:focus {

    background-color: #1d96c3;

    border-color: #1d96c3; }



.btn-outline-warning {

  color: #ff9041;

  background-color: transparent;

  border-color: #ff9041;

  transition: 0.2s ease-in; }

  .btn-outline-warning:hover, .btn-outline-warning:focus, .btn-outline-warning.focus {

    background: #ff9041;

    border-color: #ff9041;

    color: #ffffff; }

  .btn-outline-warning.active, .btn-outline-warning:active, .btn-outline-warning:focus {

    background-color: #e9ab2e;

    border-color: #e9ab2e; }



.btn-outline-danger {

  color: #ff5c6c;

  background-color: transparent;

  border-color: #ff5c6c;

  transition: 0.2s ease-in; }

  .btn-outline-danger:hover, .btn-outline-danger:focus, .btn-outline-danger.focus {

    background: #ff5c6c;

    border-color: #ff5c6c;

    color: #ffffff; }

  .btn-outline-danger.active, .btn-outline-danger:active, .btn-outline-danger:focus {

    background-color: #e6294b; }



.btn-outline-red {

  color: #fb3a3a;

  background-color: transparent;

  border-color: #fb3a3a; }

  .btn-outline-red:hover, .btn-outline-red:focus, .btn-outline-red.focus {

    background: #fb3a3a;

    border-color: #fb3a3a;

    color: #ffffff; }

  .btn-outline-red.active, .btn-outline-red:active, .btn-outline-red:focus {

    background-color: #d61f1f; }



.btn-outline-brown {

  background-color: #ffffff;

  transition: 0.2s ease-in;

  border-color: #795548; }



.btn-outline-lime {

  background-color: #ffffff;

  transition: 0.2s ease-in;

  border-color: #cddc39; }



.btn-outline-green {

  background-color: #ffffff;

  transition: 0.2s ease-in;

  border-color: #4caf50; }



.btn-outline-inverse {

  color: #2f3d4a;

  background-color: transparent;

  border-color: #2f3d4a; }

  .btn-outline-inverse:hover, .btn-outline-inverse:focus, .btn-outline-inverse.focus {

    background: #2f3d4a;

    border-color: #2f3d4a;

    color: #ffffff; }



.btn-green,

.btn-green.btn {

  background: #4caf50;

  border: 1px solid #4caf50;

  color: #ffffff; }

  .btn-green:hover,

  .btn-green.btn:hover {

    opacity: 0.7;

    border: 1px solid #4caf50;

    background: #4caf50; }

  .btn-green.active, .btn-green:active, .btn-green:focus,

  .btn-green.btn.active,

  .btn-green.btn:active,

  .btn-green.btn:focus {

    background: #1b5e20; }



.btn-brown,

.btn-brown.btn {

  background: #795548;

  border: 1px solid #795548;

  color: #ffffff; }

  .btn-brown:hover,

  .btn-brown.btn:hover {

    opacity: 0.7;

    border: 1px solid #795548;

    background: #795548; }

  .btn-brown.active, .btn-brown:active, .btn-brown:focus,

  .btn-brown.btn.active,

  .btn-brown.btn:active,

  .btn-brown.btn:focus {

    background: #3e2723; }



.btn-lime,

.btn-lime.disabled {

  background: #cddc39;

  border: 1px solid #cddc39;

  color: #ffffff; }

  .btn-lime:hover,

  .btn-lime.disabled:hover {

    opacity: 0.7;

    border: 1px solid #cddc39;

    background: #cddc39; }

  .btn-lime.active, .btn-lime:active, .btn-lime:focus,

  .btn-lime.disabled.active,

  .btn-lime.disabled:active,

  .btn-lime.disabled:focus {

    background: #827717; }



.btn-outline-brown {

  color: #3e2723;

  background-color: transparent;

  border-color: #795548; }

  .btn-outline-brown:hover, .btn-outline-brown:focus, .btn-outline-brown.focus {

    background: #795548;

    border-color: #795548;

    color: #ffffff; }

  .btn-outline-brown.active, .btn-outline-brown:active, .btn-outline-brown:focus {

    background-color: #3e2723; }



.btn-outline-green {

  color: #4caf50;

  background-color: transparent;

  border-color: #4caf50; }

  .btn-outline-green:hover, .btn-outline-green:focus, .btn-outline-green.focus {

    background: #4caf50;

    border-color: #4caf50;

    color: #ffffff; }

  .btn-outline-green.active, .btn-outline-green:active, .btn-outline-green:focus {

    background-color: #1b5e20; }



.btn-outline-lime {

  color: #cddc39;

  background-color: transparent;

  border-color: #cddc39; }

  .btn-outline-lime:hover, .btn-outline-lime:focus, .btn-outline-lime.focus {

    background: #cddc39;

    border-color: #cddc39;

    color: #ffffff; }

  .btn-outline-lime.active, .btn-outline-lime:active, .btn-outline-lime:focus {

    background-color: #827717; }



.btn-primary.active.focus,

.btn-primary.active:focus,

.btn-primary.active:hover,

.btn-primary.focus:active,

.btn-primary:active:focus,

.btn-primary:active:hover,

.open > .dropdown-toggle.btn-primary.focus,

.open > .dropdown-toggle.btn-primary:focus,

.open > .dropdown-toggle.btn-primary:hover,

.btn-primary.focus,

.btn-primary:focus,

.show > .btn-primary.dropdown-toggle {

  background-color: #6352ce;

  border: 1px solid #6352ce; }



.btn-success.active.focus,

.btn-success.active:focus,

.btn-success.active:hover,

.btn-success.focus:active,

.btn-success:active:focus,

.btn-success:active:hover,

.open > .dropdown-toggle.btn-success.focus,

.open > .dropdown-toggle.btn-success:focus,

.open > .dropdown-toggle.btn-success:hover,

.btn-success.focus,

.btn-success:focus,

.show > .btn-success.dropdown-toggle {

  background-color: #04b381;

  border: 1px solid #04b381; }



.btn-info.active.focus,

.btn-info.active:focus,

.btn-info.active:hover,

.btn-info.focus:active,

.btn-info:active:focus,

.btn-info:active:hover,

.open > .dropdown-toggle.btn-info.focus,

.open > .dropdown-toggle.btn-info:focus,

.open > .dropdown-toggle.btn-info:hover,

.btn-info.focus,

.btn-info:focus,

.show > .btn-info.dropdown-toggle {

  background-color: #1d96c3;

  border: 1px solid #1d96c3; }



.btn-warning.active.focus,

.btn-warning.active:focus,

.btn-warning.active:hover,

.btn-warning.focus:active,

.btn-warning:active:focus,

.btn-warning:active:hover,

.open > .dropdown-toggle.btn-warning.focus,

.open > .dropdown-toggle.btn-warning:focus,

.open > .dropdown-toggle.btn-warning:hover,

.btn-warning.focus,

.btn-warning:focus,

.show > .btn-warning.dropdown-toggle {

  background-color: #e9ab2e;

  border: 1px solid #e9ab2e; }



.btn-danger.active.focus,

.btn-danger.active:focus,

.btn-danger.active:hover,

.btn-danger.focus:active,

.btn-danger:active:focus,

.btn-danger:active:hover,

.open > .dropdown-toggle.btn-danger.focus,

.open > .dropdown-toggle.btn-danger:focus,

.open > .dropdown-toggle.btn-danger:hover,

.btn-danger.focus,

.btn-danger:focus,

.show > .btn-danger.dropdown-toggle {

  background-color: #e6294b;

  border: 1px solid #e6294b; }



.btn-inverse:hover,

.btn-inverse:focus,

.btn-inverse:active,

.btn-inverse.active,

.btn-inverse.focus,

.btn-inverse:active,

.btn-inverse:focus,

.btn-inverse:hover,

.open > .dropdown-toggle.btn-inverse {

  background-color: #232a37;

  border: 1px solid #232a37; }



.btn-secondary.active.focus,

.btn-secondary.active:focus,

.btn-secondary.active:hover,

.btn-secondary.focus:active,

.btn-secondary:active:focus,

.btn-secondary:active:hover,

.open > .dropdown-toggle.btn-secondary.focus,

.open > .dropdown-toggle.btn-secondary:focus,

.open > .dropdown-toggle.btn-secondary:hover,

.btn-secondary.focus,

.btn-secondary:focus,

.show > .btn-secondary.dropdown-toggle {

  color: #ffffff; }



.btn-red:hover,

.btn-red:focus,

.btn-red:active,

.btn-red.active,

.btn-red.focus,

.btn-red:active,

.btn-red:focus,

.btn-red:hover,

.open > .dropdown-toggle.btn-red {

  background-color: #d61f1f;

  border: 1px solid #d61f1f;

  color: #ffffff; }



.btn-brown.active.focus,

.btn-brown.active:focus,

.btn-brown.active:hover,

.btn-brown.focus:active,

.btn-brown:active:focus,

.btn-brown:active:hover,

.open > .dropdown-toggle.btn-brown.focus,

.open > .dropdown-toggle.btn-brown:focus,

.open > .dropdown-toggle.btn-brown:hover,

.btn-brown.focus,

.btn-brown:focus,

.show > .btn-brown.dropdown-toggle {

  background-color: #3e2723;

  border: 1px solid #3e2723; }



.btn-green.active.focus,

.btn-green.active:focus,

.btn-green.active:hover,

.btn-green.focus:active,

.btn-green:active:focus,

.btn-green:active:hover,

.open > .dropdown-toggle.btn-green.focus,

.open > .dropdown-toggle.btn-green:focus,

.open > .dropdown-toggle.btn-green:hover,

.btn-green.focus,

.btn-green:focus,

.show > .btn-green.dropdown-toggle {

  background-color: #1b5e20;

  border: 1px solid #1b5e20; }



.btn-lime.active.focus,

.btn-lime.active:focus,

.btn-lime.active:hover,

.btn-lime.focus:active,

.btn-lime:active:focus,

.btn-lime:active:hover,

.open > .dropdown-toggle.btn-lime.focus,

.open > .dropdown-toggle.btn-lime:focus,

.open > .dropdown-toggle.btn-lime:hover,

.btn-lime.focus,

.btn-lime:focus,

.show > .btn-lime.dropdown-toggle {

  background-color: #827717;

  border: 1px solid #827717; }



.button-box .btn {

  margin: 0 8px 8px 0px; }



.btn-label {

  background: rgba(0, 0, 0, 0.05);

  display: inline-block;

  margin: -6px 12px -6px -14px;

  padding: 7px 15px; }



.btn-facebook {

  color: #ffffff;

  background-color: #3b5998; }

  .btn-facebook:hover {

    color: #ffffff; }



.btn-twitter {

  color: #ffffff;

  background-color: #55acee; }

  .btn-twitter:hover {

    color: #ffffff; }



.btn-linkedin {

  color: #ffffff;

  background-color: #007bb6; }

  .btn-linkedin:hover {

    color: #ffffff; }



.btn-dribbble {

  color: #ffffff;

  background-color: #ea4c89; }

  .btn-dribbble:hover {

    color: #ffffff; }



.btn-googleplus {

  color: #ffffff;

  background-color: #dd4b39; }

  .btn-googleplus:hover {

    color: #ffffff; }



.btn-instagram {

  color: #ffffff;

  background-color: #3f729b; }



.btn-pinterest {

  color: #ffffff;

  background-color: #cb2027; }



.btn-dropbox {

  color: #ffffff;

  background-color: #007ee5; }



.btn-flickr {

  color: #ffffff;

  background-color: #ff0084; }



.btn-tumblr {

  color: #ffffff;

  background-color: #32506d; }



.btn-skype {

  color: #ffffff;

  background-color: #00aff0; }



.btn-youtube {

  color: #ffffff;

  background-color: #bb0000; }



.btn-github {

  color: #ffffff;

  background-color: #171515; }



/*============================================================== 

 Buttons page

 ============================================================== */

.button-group .btn {

  margin-bottom: 5px;

  margin-right: 5px; }



.no-button-group .btn {

  margin-bottom: 5px;

  margin-right: 0px; }



.btn .text-active {

  display: none; }

.btn.active .text-active {

  display: inline-block; }

.btn.active .text {

  display: none; }



/*extra padded buttons*/

.btn-extra-padding {

  padding-left: 25px;

  padding-right: 25px; }



/*******************

Custom-select

******************/

/*******************

textarea

******************/

textarea {

  resize: none; }



/*******************

Form-control

******************/

.form-control {

  color: #67757c;

  min-height: 38px;

  display: initial;

  font-size: 0.9rem; }



.form-control-sm {

  min-height: 20px; }



.form-control:disabled,

.form-control[readonly] {

  opacity: 0.7; }



.custom-control-input:focus ~ .custom-control-indicator {

  box-shadow: none; }



.custom-control-input:checked ~ .custom-control-indicator {

  background-color: #24d2b5; }



form label {

  font-weight: 400; }



.form-group {

  margin-bottom: 25px; }

  .form-group.form-group-checkbox {

    margin-bottom: 15px; }



.form-horizontal label {

  margin-bottom: 0px; }



.form-control-static {

  padding-top: 0px; }



.form-bordered .form-group {

  border-bottom: 1px solid rgba(120, 130, 140, 0.13);

  padding-bottom: 20px; }



/*******************

Form Dropzone

******************/

.dropzone {

  border: 1px dashed #b1b8bb; }

  .dropzone .dz-message {

    padding: 5% 0;

    margin: 0px; }



/*******************

Form Pickers

******************/

.asColorPicker-dropdown {

  max-width: 260px; }



.asColorPicker-trigger {

  position: absolute;

  top: 0;

  right: -35px;

  height: 38px;

  width: 37px;

  border: 0; }



.asColorPicker-clear {

  display: none;

  position: absolute;

  top: 5px;

  right: 10px;

  text-decoration: none; }



table th {

  font-weight: 400; }



.daterangepicker td.active,

.daterangepicker td.active:hover {

  background-color: #20aee3; }



.datepicker table tr td.today,

.datepicker table tr td.today.disabled,

.datepicker table tr td.today.disabled:hover,

.datepicker table tr td.today:hover {

  background: #20aee3;

  color: #ffffff; }



.datepicker td,

.datepicker th {

  padding: 5px 10px; }



/*******************

Form summernote

******************/

.note-popover,

.note-icon-caret {

  display: none; }



.note-editor.note-frame {

  border: 1px solid #b1b8bb; }

  .note-editor.note-frame .panel-heading {

    padding: 6px 10px 10px;

    border-bottom: 1px solid rgba(120, 130, 140, 0.13); }



.label {

  display: inline-block; }



/*============================================================== 

Form addons page

============================================================== */

/*Bootstrap select*/

.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {

  width: 100%; }



.bootstrap-select .dropdown-menu li a {

  display: block;

  padding: 7px 20px;

  clear: both;

  font-weight: normal;

  line-height: 1.42857143;

  color: #67757c;

  white-space: nowrap; }

  .bootstrap-select .dropdown-menu li a:hover, .bootstrap-select .dropdown-menu li a:focus {

    color: #20aee3;

    background: #e9edf2; }

.bootstrap-select .show > .dropdown-menu {

  display: block; }



.bootstrap-touchspin .input-group-btn-vertical > .btn {

  padding: 9px 10px; }



.select2-container--default .select2-selection--single {

  border-color: #b1b8bb;

  height: 38px; }

  .select2-container--default .select2-selection--single .select2-selection__rendered {

    line-height: 38px; }

  .select2-container--default .select2-selection--single .select2-selection__arrow {

    height: 33px; }

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {

  float: right;

  color: #ffffff;

  margin-right: 0px;

  margin-left: 4px; }

.select2-container--default .select2-selection--multiple .select2-selection__choice {

  background: #20aee3;

  color: #ffffff;

  border-color: #20aee3; }



.input-form .btn {

  padding: 8px 12px; }



/*============================================================== 

Form Material page

 ============================================================== */

/*Material inputs*/

.form-material .form-group {

  overflow: hidden; }



.form-material .form-control {

  background-color: rgba(0, 0, 0, 0);

  background-position: center bottom, center calc(100% - 2px);

  background-repeat: no-repeat;

  background-size: 0 2px, 100% 1px;

  padding: 0;

  transition: background 0s ease-out 0s; }



.form-material .form-control,

.form-material .form-control.focus,

.form-material .form-control:focus {

  background-image: linear-gradient(#20aee3, #20aee3), linear-gradient(#e9edf2, #e9edf2);

  border: 0 none;

  border-radius: 0;

  box-shadow: none;

  float: none;

  padding: 0px 8px; }



.form-material .form-control.focus,

.form-material .form-control:focus {

  background-size: 100% 2px, 100% 1px;

  outline: 0 none;

  transition-duration: 0.3s; }



.form-control-line .form-group {

  overflow: hidden; }



.form-control-line .form-control {

  border: 0px;

  border-radius: 0px;

  padding-left: 0px;

  border-bottom: 1px solid #f6f9ff; }

  .form-control-line .form-control:focus {

    border-bottom: 1px solid #20aee3; }



/*******************

Form validation error 

******************/

.error .help-block {

  color: #fb3a3a; }



/*******************

File Upload 

******************/

.fileupload {

  overflow: hidden;

  position: relative; }

  .fileupload input.upload {

    cursor: pointer;

    filter: alpha(opacity=0);

    font-size: 20px;

    margin: 0;

    opacity: 0;

    padding: 0;

    position: absolute;

    right: 0;

    top: 0; }



/*******************

This is for the checkbox radio button and switch 

******************/

/* Radio Buttons

   ========================================================================== */

[type="radio"]:not(:checked),

[type="radio"]:checked {

  position: absolute;

  left: -9999px;

  opacity: 0; }



[type="radio"]:not(:checked) + label,

[type="radio"]:checked + label {

  position: relative;

  padding-left: 35px;

  cursor: pointer;

  display: inline-block;

  height: 25px;

  line-height: 25px;

  font-size: 1rem;

  transition: .28s ease;

  /* webkit (konqueror) browsers */

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none; }



[type="radio"] + label:before,

[type="radio"] + label:after {

  content: '';

  position: absolute;

  left: 0;

  top: 0;

  margin: 4px;

  width: 16px;

  height: 16px;

  z-index: 0;

  transition: .28s ease; }



/* Unchecked styles */

[type="radio"]:not(:checked) + label:before,

[type="radio"]:not(:checked) + label:after,

[type="radio"]:checked + label:before,

[type="radio"]:checked + label:after,

[type="radio"].with-gap:checked + label:before,

[type="radio"].with-gap:checked + label:after {

  border-radius: 50%; }



[type="radio"]:not(:checked) + label:before,

[type="radio"]:not(:checked) + label:after {

  border: 1px solid #b1b8bb; }



[type="radio"]:not(:checked) + label:after {

  z-index: -1;

  -webkit-transform: scale(0);

  transform: scale(0); }



/* Checked styles */

[type="radio"]:checked + label:before {

  border: 2px solid transparent;

  animation: ripple 0.2s linear forwards; }



[type="radio"]:checked + label:after,

[type="radio"].with-gap:checked + label:before,

[type="radio"].with-gap:checked + label:after {

  border: 2px solid #26a69a; }



[type="radio"]:checked + label:after,

[type="radio"].with-gap:checked + label:after {

  background-color: #20aee3;

  z-index: 0; }



[type="radio"]:checked + label:after {

  -webkit-transform: scale(1.02);

  transform: scale(1.02); }



/* Radio With gap */

[type="radio"].with-gap:checked + label:after {

  -webkit-transform: scale(0.5);

  transform: scale(0.5); }



/* Focused styles */

[type="radio"].tabbed:focus + label:before {

  box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);

  animation: ripple 0.2s linear forwards; }



/* Disabled Radio With gap */

[type="radio"].with-gap:disabled:checked + label:before {

  border: 2px solid rgba(0, 0, 0, 0.26);

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap:disabled:checked + label:after {

  border: none;

  background-color: rgba(0, 0, 0, 0.26); }



/* Disabled style */

[type="radio"]:disabled:not(:checked) + label:before,

[type="radio"]:disabled:checked + label:before {

  background-color: transparent;

  border-color: rgba(0, 0, 0, 0.26);

  animation: ripple 0.2s linear forwards; }



[type="radio"]:disabled + label {

  color: rgba(0, 0, 0, 0.26); }



[type="radio"]:disabled:not(:checked) + label:before {

  border-color: rgba(0, 0, 0, 0.26); }



[type="radio"]:disabled:checked + label:after {

  background-color: rgba(0, 0, 0, 0.26);

  border-color: #BDBDBD; }



/* Checkboxes

   ========================================================================== */

/* CUSTOM CSS CHECKBOXES */

form p {

  margin-bottom: 10px;

  text-align: left; }



form p:last-child {

  margin-bottom: 0; }



/* Remove default checkbox */

[type="checkbox"]:not(:checked),

[type="checkbox"]:checked {

  position: absolute;

  left: -9999px;

  opacity: 0; }



[type="checkbox"] {

  /* checkbox aspect */ }



[type="checkbox"] + label {

  position: relative;

  padding-left: 35px;

  cursor: pointer;

  display: inline-block;

  height: 25px;

  line-height: 25px;

  font-size: 14px;

  -webkit-user-select: none;

  /* webkit (safari, chrome) browsers */

  -moz-user-select: none;

  /* mozilla browsers */

  -khtml-user-select: none;

  /* webkit (konqueror) browsers */

  -ms-user-select: none;

  /* IE10+ */ }



[type="checkbox"] + label:before,

[type="checkbox"]:not(.filled-in) + label:after {

  content: '';

  position: absolute;

  top: 0;

  left: 0;

  width: 18px;

  height: 18px;

  z-index: 0;

  border: 1px solid #b1b8bb;

  border-radius: 1px;

  margin-top: 2px;

  transition: .2s; }



[type="checkbox"]:not(.filled-in) + label:after {

  border: 0;

  -webkit-transform: scale(0);

  transform: scale(0); }



[type="checkbox"]:not(:checked):disabled + label:before {

  border: none;

  background-color: rgba(0, 0, 0, 0.26); }



[type="checkbox"].tabbed:focus + label:after {

  -webkit-transform: scale(1);

  transform: scale(1);

  border: 0;

  border-radius: 50%;

  box-shadow: 0 0 0 10px rgba(0, 0, 0, 0.1);

  background-color: rgba(0, 0, 0, 0.1); }



[type="checkbox"]:checked + label:before {

  top: -4px;

  left: -5px;

  width: 12px;

  height: 22px;

  border-top: 2px solid transparent;

  border-left: 2px solid transparent;

  border-right: 2px solid #20aee3;

  border-bottom: 2px solid #20aee3;

  -webkit-transform: rotate(40deg);

  transform: rotate(40deg);

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

  -webkit-transform-origin: 100% 100%;

  transform-origin: 100% 100%; }



[type="checkbox"]:checked:disabled + label:before {

  border-right: 2px solid rgba(0, 0, 0, 0.26);

  border-bottom: 2px solid rgba(0, 0, 0, 0.26); }



/* Indeterminate checkbox */

[type="checkbox"]:indeterminate + label:before {

  top: -11px;

  left: -12px;

  width: 10px;

  height: 22px;

  border-top: none;

  border-left: none;

  border-right: 2px solid #20aee3;

  border-bottom: none;

  -webkit-transform: rotate(90deg);

  transform: rotate(90deg);

  -webkit-backface-visibility: hidden;

  backface-visibility: hidden;

  -webkit-transform-origin: 100% 100%;

  transform-origin: 100% 100%; }



[type="checkbox"]:indeterminate:disabled + label:before {

  border-right: 2px solid rgba(0, 0, 0, 0.26);

  background-color: transparent; }



[type="checkbox"].filled-in + label:after {

  border-radius: 2px; }



[type="checkbox"].filled-in + label:before,

[type="checkbox"].filled-in + label:after {

  content: '';

  left: 0;

  position: absolute;

  /* .1s delay is for check animation */

  transition: border .25s, background-color .25s, width .20s .1s, height .20s .1s, top .20s .1s, left .20s .1s;

  z-index: 1; }



[type="checkbox"].filled-in:not(:checked) + label:before {

  width: 0;

  height: 0;

  border: 3px solid transparent;

  left: 6px;

  top: 10px;

  -webkit-transform: rotateZ(37deg);

  transform: rotateZ(37deg);

  -webkit-transform-origin: 20% 40%;

  transform-origin: 100% 100%; }



[type="checkbox"].filled-in:not(:checked) + label:after {

  height: 20px;

  width: 20px;

  background-color: transparent;

  border: 1px solid #b1b8bb;

  top: 0px;

  z-index: 0; }



[type="checkbox"].filled-in:checked + label:before {

  top: 0;

  left: 1px;

  width: 8px;

  height: 13px;

  border-top: 2px solid transparent;

  border-left: 2px solid transparent;

  border-right: 2px solid #fff;

  border-bottom: 2px solid #fff;

  -webkit-transform: rotateZ(37deg);

  transform: rotateZ(37deg);

  -webkit-transform-origin: 100% 100%;

  transform-origin: 100% 100%; }



[type="checkbox"].filled-in:checked + label:after {

  top: 0;

  width: 20px;

  height: 20px;

  border: 2px solid #20aee3;

  background-color: #20aee3;

  z-index: 0; }



[type="checkbox"].filled-in.tabbed:focus + label:after {

  border-radius: 2px;

  border-color: #5a5a5a;

  background-color: rgba(0, 0, 0, 0.1); }



[type="checkbox"].filled-in.tabbed:checked:focus + label:after {

  border-radius: 2px;

  background-color: #20aee3;

  border-color: #20aee3; }



[type="checkbox"].filled-in:disabled:not(:checked) + label:before {

  background-color: transparent;

  border: 2px solid transparent; }



[type="checkbox"].filled-in:disabled:not(:checked) + label:after {

  border-color: #ced4da;

  background-color: #e9ecef; }



[type="checkbox"].filled-in:disabled:checked + label:before {

  background-color: transparent; }



[type="checkbox"].filled-in:disabled:checked + label:after {

  background-color: #e9ecef !important;

  border-color: #BDBDBD !important; }



[type="checkbox"].filled-in:disabled:checked + label:before {

  border-right: 2px solid #BDBDBD !important;

  border-bottom: 2px solid #BDBDBD !important; }



/* Switch

   ========================================================================== */

.switch,

.switch * {

  -webkit-user-select: none;

  -moz-user-select: none;

  -khtml-user-select: none;

  -ms-user-select: none; }



.switch label {

  cursor: pointer; }



.switch label input[type=checkbox] {

  opacity: 0;

  width: 0;

  height: 0; }



.switch label input[type=checkbox]:checked + .lever {

  background-color: #24d2b5; }



.switch label input[type=checkbox]:checked + .lever:after {

  background-color: #20aee3;

  left: 21px; }



.switch label .lever {

  content: "";

  display: inline-block;

  position: relative;

  width: 40px;

  height: 19px;

  background-color: #c7c7c7;

  border-radius: 15px;

  margin-right: 10px;

  transition: background 0.3s ease;

  vertical-align: middle;

  margin: 0 16px; }



.switch label .lever:after {

  content: "";

  position: absolute;

  display: inline-block;

  width: 17px;

  height: 17px;

  background-color: #F1F1F1;

  border-radius: 21px;

  /* box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4); */

  left: 2px;

  top: 1px;

  transition: left 0.3s ease, background .3s ease, box-shadow 0.1s ease; }



input[type=checkbox]:checked:not(:disabled) ~ .lever:active::after,

input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::after {

  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 166, 154, 0.1); }



input[type=checkbox]:not(:disabled) ~ .lever:active:after,

input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::after {

  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.08); }



.switch input[type=checkbox][disabled] + .lever {

  cursor: default; }



.switch label input[type=checkbox][disabled] + .lever:after,

.switch label input[type=checkbox][disabled]:checked + .lever:after {

  background-color: #BDBDBD; }



.scale-up {

  -webkit-transition: all 0.3s ease;

  transition: all 0.3s ease;

  -webkit-transform: scale(0);

  transform: scale(0);

  display: inline-block;

  transform-origin: right 0px; }



.scale-up-left {

  -webkit-transition: all 0.3s ease;

  transition: all 0.3s ease;

  -webkit-transform: scale(0);

  transform: scale(0);

  display: inline-block;

  transform-origin: left 0px; }



.show > .scale-up {

  transform: scale(1);

  transform-origin: right 0px; }



.show > .scale-up-left {

  transform: scale(1);

  transform-origin: left 0px; }



/*panels*/

.card {

  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);

  border-radius: 4px; }



.well, pre {

  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); }



.page-titles .justify-content-end:last-child .d-flex {

  margin-right: 10px; }



.btn-circle.right-side-toggle {

  position: fixed;

  bottom: 20px;

  right: 20px;

  padding: 25px;

  z-index: 10; }



/*Radio button*/

@keyframes ripple {

  0% {

    box-shadow: 0px 0px 0px 1px transparent; }

  50% {

    box-shadow: 0px 0px 0px 15px rgba(0, 0, 0, 0.1); }

  100% {

    box-shadow: 0px 0px 0px 15px transparent; } }

/*Floating label*/

/*Bootstrap Select*/

.bootstrap-select.btn-group .dropdown-menu {

  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1); }



.demo-checkbox label, .demo-radio-button label {

  min-width: 200px;

  margin-bottom: 20px; }



.demo-swtich .demo-switch-title, .demo-swtich .switch {

  width: 150px;

  margin-bottom: 10px;

  display: inline-block; }



[type="checkbox"] + label {

  padding-left: 26px;

  height: 25px;

  line-height: 21px;

  font-weight: normal; }

[type="checkbox"]:checked + label:before {

  top: -4px;

  left: -2px;

  width: 11px;

  height: 19px; }

[type="checkbox"]:checked.chk-col-red + label:before {

  border-right: 2px solid #fb3a3a;

  border-bottom: 2px solid #fb3a3a; }

[type="checkbox"]:checked.chk-col-pink + label:before {

  border-right: 2px solid #E91E63;

  border-bottom: 2px solid #E91E63; }

[type="checkbox"]:checked.chk-col-purple + label:before {

  border-right: 2px solid #7460ee;

  border-bottom: 2px solid #7460ee; }

[type="checkbox"]:checked.chk-col-deep-purple + label:before {

  border-right: 2px solid #673AB7;

  border-bottom: 2px solid #673AB7; }

[type="checkbox"]:checked.chk-col-indigo + label:before {

  border-right: 2px solid #3F51B5;

  border-bottom: 2px solid #3F51B5; }

[type="checkbox"]:checked.chk-col-blue + label:before {

  border-right: 2px solid #02bec9;

  border-bottom: 2px solid #02bec9; }

[type="checkbox"]:checked.chk-col-light-blue + label:before {

  border-right: 2px solid #03A9F4;

  border-bottom: 2px solid #03A9F4; }

[type="checkbox"]:checked.chk-col-cyan + label:before {

  border-right: 2px solid #00BCD4;

  border-bottom: 2px solid #00BCD4; }

[type="checkbox"]:checked.chk-col-teal + label:before {

  border-right: 2px solid #009688;

  border-bottom: 2px solid #009688; }

[type="checkbox"]:checked.chk-col-green + label:before {

  border-right: 2px solid #26c6da;

  border-bottom: 2px solid #26c6da; }

[type="checkbox"]:checked.chk-col-light-green + label:before {

  border-right: 2px solid #8BC34A;

  border-bottom: 2px solid #8BC34A; }

[type="checkbox"]:checked.chk-col-lime + label:before {

  border-right: 2px solid #CDDC39;

  border-bottom: 2px solid #CDDC39; }

[type="checkbox"]:checked.chk-col-yellow + label:before {

  border-right: 2px solid #ffe821;

  border-bottom: 2px solid #ffe821; }

[type="checkbox"]:checked.chk-col-amber + label:before {

  border-right: 2px solid #FFC107;

  border-bottom: 2px solid #FFC107; }

[type="checkbox"]:checked.chk-col-orange + label:before {

  border-right: 2px solid #FF9800;

  border-bottom: 2px solid #FF9800; }

[type="checkbox"]:checked.chk-col-deep-orange + label:before {

  border-right: 2px solid #FF5722;

  border-bottom: 2px solid #FF5722; }

[type="checkbox"]:checked.chk-col-brown + label:before {

  border-right: 2px solid #795548;

  border-bottom: 2px solid #795548; }

[type="checkbox"]:checked.chk-col-grey + label:before {

  border-right: 2px solid #9E9E9E;

  border-bottom: 2px solid #9E9E9E; }

[type="checkbox"]:checked.chk-col-blue-grey + label:before {

  border-right: 2px solid #607D8B;

  border-bottom: 2px solid #607D8B; }

[type="checkbox"]:checked.chk-col-black + label:before {

  border-right: 2px solid #000000;

  border-bottom: 2px solid #000000; }

[type="checkbox"]:checked.chk-col-white + label:before {

  border-right: 2px solid #ffffff;

  border-bottom: 2px solid #ffffff; }



[type="checkbox"].filled-in:checked + label:after {

  top: 0;

  width: 20px;

  height: 20px;

  border: 2px solid #26a69a;

  background-color: #26a69a;

  z-index: 0; }

[type="checkbox"].filled-in:checked + label:before {

  border-right: 2px solid #ffffff !important;

  border-bottom: 2px solid #ffffff !important; }

[type="checkbox"].filled-in:checked.chk-col-red + label:after {

  border: 1px solid #fb3a3a;

  background-color: #fb3a3a; }

[type="checkbox"].filled-in:checked.chk-col-pink + label:after {

  border: 1px solid #E91E63;

  background-color: #E91E63; }

[type="checkbox"].filled-in:checked.chk-col-purple + label:after {

  border: 1px solid #7460ee;

  background-color: #7460ee; }

[type="checkbox"].filled-in:checked.chk-col-deep-purple + label:after {

  border: 1px solid #673AB7;

  background-color: #673AB7; }

[type="checkbox"].filled-in:checked.chk-col-indigo + label:after {

  border: 1px solid #3F51B5;

  background-color: #3F51B5; }

[type="checkbox"].filled-in:checked.chk-col-blue + label:after {

  border: 1px solid #02bec9;

  background-color: #02bec9; }

[type="checkbox"].filled-in:checked.chk-col-light-blue + label:after {

  border: 1px solid #03A9F4;

  background-color: #03A9F4; }

[type="checkbox"].filled-in:checked.chk-col-cyan + label:after {

  border: 1px solid #00BCD4;

  background-color: #00BCD4; }

[type="checkbox"].filled-in:checked.chk-col-teal + label:after {

  border: 1px solid #009688;

  background-color: #009688; }

[type="checkbox"].filled-in:checked.chk-col-green + label:after {

  border: 1px solid #26c6da;

  background-color: #26c6da; }

[type="checkbox"].filled-in:checked.chk-col-light-green + label:after {

  border: 1px solid #8BC34A;

  background-color: #8BC34A; }

[type="checkbox"].filled-in:checked.chk-col-lime + label:after {

  border: 1px solid #CDDC39;

  background-color: #CDDC39; }

[type="checkbox"].filled-in:checked.chk-col-yellow + label:after {

  border: 1px solid #ffe821;

  background-color: #ffe821; }

[type="checkbox"].filled-in:checked.chk-col-amber + label:after {

  border: 1px solid #FFC107;

  background-color: #FFC107; }

[type="checkbox"].filled-in:checked.chk-col-orange + label:after {

  border: 1px solid #FF9800;

  background-color: #FF9800; }

[type="checkbox"].filled-in:checked.chk-col-deep-orange + label:after {

  border: 1px solid #FF5722;

  background-color: #FF5722; }

[type="checkbox"].filled-in:checked.chk-col-brown + label:after {

  border: 1px solid #795548;

  background-color: #795548; }

[type="checkbox"].filled-in:checked.chk-col-grey + label:after {

  border: 1px solid #9E9E9E;

  background-color: #9E9E9E; }

[type="checkbox"].filled-in:checked.chk-col-blue-grey + label:after {

  border: 1px solid #607D8B;

  background-color: #607D8B; }

[type="checkbox"].filled-in:checked.chk-col-black + label:after {

  border: 1px solid #000000;

  background-color: #000000; }

[type="checkbox"].filled-in:checked.chk-col-white + label:after {

  border: 1px solid #ffffff;

  background-color: #ffffff; }



[type="radio"]:not(:checked) + label {

  padding-left: 26px;

  height: 25px;

  line-height: 25px;

  font-weight: normal; }

[type="radio"]:checked + label {

  padding-left: 26px;

  height: 25px;

  line-height: 25px;

  font-weight: normal; }



[type="radio"].radio-col-red:checked + label:after {

  background-color: #fb3a3a;

  border-color: #fb3a3a;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-pink:checked + label:after {

  background-color: #E91E63;

  border-color: #E91E63;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-purple:checked + label:after {

  background-color: #7460ee;

  border-color: #7460ee;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-deep-purple:checked + label:after {

  background-color: #673AB7;

  border-color: #673AB7;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-indigo:checked + label:after {

  background-color: #3F51B5;

  border-color: #3F51B5;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-blue:checked + label:after {

  background-color: #02bec9;

  border-color: #02bec9;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-light-blue:checked + label:after {

  background-color: #03A9F4;

  border-color: #03A9F4;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-cyan:checked + label:after {

  background-color: #00BCD4;

  border-color: #00BCD4;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-teal:checked + label:after {

  background-color: #009688;

  border-color: #009688;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-green:checked + label:after {

  background-color: #26c6da;

  border-color: #26c6da;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-light-green:checked + label:after {

  background-color: #8BC34A;

  border-color: #8BC34A;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-lime:checked + label:after {

  background-color: #CDDC39;

  border-color: #CDDC39;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-yellow:checked + label:after {

  background-color: #ffe821;

  border-color: #ffe821;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-amber:checked + label:after {

  background-color: #FFC107;

  border-color: #FFC107;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-orange:checked + label:after {

  background-color: #FF9800;

  border-color: #FF9800;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-deep-orange:checked + label:after {

  background-color: #FF5722;

  border-color: #FF5722;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-brown:checked + label:after {

  background-color: #795548;

  border-color: #795548;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-grey:checked + label:after {

  background-color: #9E9E9E;

  border-color: #9E9E9E;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-blue-grey:checked + label:after {

  background-color: #607D8B;

  border-color: #607D8B;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-black:checked + label:after {

  background-color: #000000;

  border-color: #000000;

  animation: ripple 0.2s linear forwards; }



[type="radio"].radio-col-white:checked + label:after {

  background-color: #ffffff;

  border-color: #ffffff;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-red:checked + label:before {

  border: 2px solid #fb3a3a;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-red:checked + label:after {

  background-color: #fb3a3a;

  border: 2px solid #fb3a3a;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-pink:checked + label:before {

  border: 2px solid #E91E63;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-pink:checked + label:after {

  background-color: #E91E63;

  border: 2px solid #E91E63;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-purple:checked + label:before {

  border: 2px solid #7460ee;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-purple:checked + label:after {

  background-color: #7460ee;

  border: 2px solid #7460ee;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-deep-purple:checked + label:before {

  border: 2px solid #673AB7;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-deep-purple:checked + label:after {

  background-color: #673AB7;

  border: 2px solid #673AB7;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-indigo:checked + label:before {

  border: 2px solid #3F51B5;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-indigo:checked + label:after {

  background-color: #3F51B5;

  border: 2px solid #3F51B5;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-blue:checked + label:before {

  border: 2px solid #02bec9;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-blue:checked + label:after {

  background-color: #02bec9;

  border: 2px solid #02bec9;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-light-blue:checked + label:before {

  border: 2px solid #03A9F4;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-light-blue:checked + label:after {

  background-color: #03A9F4;

  border: 2px solid #03A9F4;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-cyan:checked + label:before {

  border: 2px solid #00BCD4;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-cyan:checked + label:after {

  background-color: #00BCD4;

  border: 2px solid #00BCD4;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-teal:checked + label:before {

  border: 2px solid #009688;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-teal:checked + label:after {

  background-color: #009688;

  border: 2px solid #009688;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-green:checked + label:before {

  border: 2px solid #26c6da;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-green:checked + label:after {

  background-color: #26c6da;

  border: 2px solid #26c6da;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-light-green:checked + label:before {

  border: 2px solid #8BC34A;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-light-green:checked + label:after {

  background-color: #8BC34A;

  border: 2px solid #8BC34A;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-lime:checked + label:before {

  border: 2px solid #CDDC39;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-lime:checked + label:after {

  background-color: #CDDC39;

  border: 2px solid #CDDC39;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-yellow:checked + label:before {

  border: 2px solid #ffe821;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-yellow:checked + label:after {

  background-color: #ffe821;

  border: 2px solid #ffe821;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-amber:checked + label:before {

  border: 2px solid #FFC107;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-amber:checked + label:after {

  background-color: #FFC107;

  border: 2px solid #FFC107;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-orange:checked + label:before {

  border: 2px solid #FF9800;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-orange:checked + label:after {

  background-color: #FF9800;

  border: 2px solid #FF9800;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-deep-orange:checked + label:before {

  border: 2px solid #FF5722;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-deep-orange:checked + label:after {

  background-color: #FF5722;

  border: 2px solid #FF5722;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-brown:checked + label:before {

  border: 2px solid #795548;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-brown:checked + label:after {

  background-color: #795548;

  border: 2px solid #795548;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-grey:checked + label:before {

  border: 2px solid #9E9E9E;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-grey:checked + label:after {

  background-color: #9E9E9E;

  border: 2px solid #9E9E9E;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-blue-grey:checked + label:before {

  border: 2px solid #607D8B;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-blue-grey:checked + label:after {

  background-color: #607D8B;

  border: 2px solid #607D8B;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-black:checked + label:before {

  border: 2px solid #000000;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-black:checked + label:after {

  background-color: #000000;

  border: 2px solid #000000;

  animation: ripple 0.2s linear forwards; }



[type="radio"].with-gap.radio-col-white:checked + label:before {

  border: 2px solid #ffffff;

  animation: ripple 0.2s linear forwards; }

[type="radio"].with-gap.radio-col-white:checked + label:after {

  background-color: #ffffff;

  border: 2px solid #ffffff;

  animation: ripple 0.2s linear forwards; }



.switch label {

  font-weight: normal;

  font-size: 13px; }

  .switch label .lever {

    margin: 0 14px; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-red:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(251, 58, 58, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-red {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-red:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-pink:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(233, 30, 99, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-pink {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-pink:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-purple:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(116, 96, 238, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-purple {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-purple:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-deep-purple:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(103, 58, 183, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-deep-purple {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-deep-purple:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-indigo:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(63, 81, 181, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-indigo {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-indigo:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-blue:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(2, 190, 201, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-blue {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-blue:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-light-blue:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(3, 169, 244, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-light-blue {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-light-blue:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-cyan:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 188, 212, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-cyan {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-cyan:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-teal:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 150, 136, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-teal {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-teal:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-green:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(38, 198, 218, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-green {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-green:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-light-green:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(139, 195, 74, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-light-green {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-light-green:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-lime:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(205, 220, 57, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-lime {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-lime:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-yellow:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 232, 33, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-yellow {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-yellow:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-amber:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 193, 7, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-amber {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-amber:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-orange:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 152, 0, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-orange {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-orange:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-deep-orange:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 87, 34, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-deep-orange {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-deep-orange:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-brown:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(121, 85, 72, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-brown {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-brown:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-grey:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(158, 158, 158, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-grey {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-grey:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-blue-grey:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(96, 125, 139, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-blue-grey {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-blue-grey:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-black:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(0, 0, 0, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-black {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-black:after {

      background-color: #fff; }

  .switch label input[type=checkbox]:checked:not(:disabled) ~ .lever.switch-col-white:active:after {

    box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(255, 255, 255, 0.1); }

  .switch label input[type=checkbox]:checked + .lever.switch-col-white {

    background-color: #24d2b5; }

    .switch label input[type=checkbox]:checked + .lever.switch-col-white:after {

      background-color: #fff; }



/*Form Validation*/

.help-block ul {

  padding: 0px;

  margin: 0px; }

  .help-block ul li {

    list-style: none; }



.error .form-control {

  border-color: #ff5c6c; }



.validate .form-control {

  border-color: #24d2b5; }



/*others*/

.input-group-addon {

  background-color: #f5f5f5; }



/*******************

Table Cell

*******************/

.table-box {

  display: table;

  width: 100%; }



.table.no-border tbody td {

  border: 0px; }



.cell {

  display: table-cell;

  vertical-align: middle; }



.table td,

.table th {

  border-color: #efeeee; }



.table thead th,

.table th {

  font-weight: 500; }



.table-hover tbody tr:hover {

  background: rgba(0, 0, 0, 0.02); }



.nowrap {

  white-space: nowrap; }



.lite-padding td {

  padding: 5px; }



.v-middle td,

.v-middle th {

  vertical-align: middle; }



/*******************

Table-Layout

******************/

.table thead th,

.table th {

  border: 0px; }



.color-table.primary-table thead th {

  background-color: #6772e5;

  color: #ffffff; }



.table-striped tbody tr:nth-of-type(odd) {

  background: #e9edf2; }



.color-table.success-table thead th {

  background-color: #24d2b5;

  color: #ffffff; }



.color-table.info-table thead th {

  background-color: #20aee3;

  color: #ffffff; }



.color-table.warning-table thead th {

  background-color: #ff9041;

  color: #ffffff; }



.color-table.danger-table thead th {

  background-color: #ff5c6c;

  color: #ffffff; }



.color-table.inverse-table thead th {

  background-color: #2f3d4a;

  color: #ffffff; }



.color-table.dark-table thead th {

  background-color: #263238;

  color: #ffffff; }



.color-table.red-table thead th {

  background-color: #fb3a3a;

  color: #ffffff; }



.color-table.purple-table thead th {

  background-color: #7460ee;

  color: #ffffff; }



.color-table.muted-table thead th {

  background-color: #bcc3d3;

  color: #ffffff; }



.color-bordered-table.primary-bordered-table {

  border: 2px solid #6772e5; }

  .color-bordered-table.primary-bordered-table thead th {

    background-color: #6772e5;

    color: #ffffff; }



.color-bordered-table.success-bordered-table {

  border: 2px solid #24d2b5; }

  .color-bordered-table.success-bordered-table thead th {

    background-color: #24d2b5;

    color: #ffffff; }



.color-bordered-table.info-bordered-table {

  border: 2px solid #20aee3; }

  .color-bordered-table.info-bordered-table thead th {

    background-color: #20aee3;

    color: #ffffff; }



.color-bordered-table.warning-bordered-table {

  border: 2px solid #ff9041; }

  .color-bordered-table.warning-bordered-table thead th {

    background-color: #ff9041;

    color: #ffffff; }



.color-bordered-table.danger-bordered-table {

  border: 2px solid #ff5c6c; }

  .color-bordered-table.danger-bordered-table thead th {

    background-color: #ff5c6c;

    color: #ffffff; }



.color-bordered-table.inverse-bordered-table {

  border: 2px solid #2f3d4a; }

  .color-bordered-table.inverse-bordered-table thead th {

    background-color: #2f3d4a;

    color: #ffffff; }



.color-bordered-table.dark-bordered-table {

  border: 2px solid #263238; }

  .color-bordered-table.dark-bordered-table thead th {

    background-color: #263238;

    color: #ffffff; }



.color-bordered-table.red-bordered-table {

  border: 2px solid #fb3a3a; }

  .color-bordered-table.red-bordered-table thead th {

    background-color: #fb3a3a;

    color: #ffffff; }



.color-bordered-table.purple-bordered-table {

  border: 2px solid #7460ee; }

  .color-bordered-table.purple-bordered-table thead th {

    background-color: #7460ee;

    color: #ffffff; }



.color-bordered-table.muted-bordered-table {

  border: 2px solid #bcc3d3; }

  .color-bordered-table.muted-bordered-table thead th {

    background-color: #bcc3d3;

    color: #ffffff; }



.full-color-table.full-primary-table {

  background-color: #f1effd; }

  .full-color-table.full-primary-table thead th {

    background-color: #6772e5;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-primary-table tbody td {

    border: 0; }

  .full-color-table.full-primary-table tr:hover {

    background-color: #6772e5;

    color: #ffffff; }



.full-color-table.full-success-table {

  background-color: #e8fdeb; }

  .full-color-table.full-success-table thead th {

    background-color: #24d2b5;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-success-table tbody td {

    border: 0; }

  .full-color-table.full-success-table tr:hover {

    background-color: #24d2b5;

    color: #ffffff; }



.full-color-table.full-info-table {

  background-color: #cfecfe; }

  .full-color-table.full-info-table thead th {

    background-color: #20aee3;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-info-table tbody td {

    border: 0; }

  .full-color-table.full-info-table tr:hover {

    background-color: #20aee3;

    color: #ffffff; }



.full-color-table.full-warning-table {

  background-color: #fff8ec; }

  .full-color-table.full-warning-table thead th {

    background-color: #ff9041;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-warning-table tbody td {

    border: 0; }

  .full-color-table.full-warning-table tr:hover {

    background-color: #ff9041;

    color: #ffffff; }



.full-color-table.full-danger-table {

  background-color: #f9e7eb; }

  .full-color-table.full-danger-table thead th {

    background-color: #ff5c6c;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-danger-table tbody td {

    border: 0; }

  .full-color-table.full-danger-table tr:hover {

    background-color: #ff5c6c;

    color: #ffffff; }



.full-color-table.full-inverse-table {

  background-color: #f6f6f6; }

  .full-color-table.full-inverse-table thead th {

    background-color: #2f3d4a;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-inverse-table tbody td {

    border: 0; }

  .full-color-table.full-inverse-table tr:hover {

    background-color: #2f3d4a;

    color: #ffffff; }



.full-color-table.full-dark-table {

  background-color: rgba(43, 43, 43, 0.8); }

  .full-color-table.full-dark-table thead th {

    background-color: #263238;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-dark-table tbody td {

    border: 0;

    color: #ffffff; }

  .full-color-table.full-dark-table tr:hover {

    background-color: #263238;

    color: #ffffff; }



.full-color-table.full-red-table {

  background-color: #f9e7eb; }

  .full-color-table.full-red-table thead th {

    background-color: #fb3a3a;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-red-table tbody td {

    border: 0; }

  .full-color-table.full-red-table tr:hover {

    background-color: #fb3a3a;

    color: #ffffff; }



.full-color-table.full-purple-table {

  background-color: #f1effd; }

  .full-color-table.full-purple-table thead th {

    background-color: #7460ee;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-purple-table tbody td {

    border: 0; }

  .full-color-table.full-purple-table tr:hover {

    background-color: #7460ee;

    color: #ffffff; }



.full-color-table.full-muted-table {

  background-color: rgba(152, 166, 173, 0.2); }

  .full-color-table.full-muted-table thead th {

    background-color: #bcc3d3;

    border: 0;

    color: #ffffff; }

  .full-color-table.full-muted-table tbody td {

    border: 0; }

  .full-color-table.full-muted-table tr:hover {

    background-color: #bcc3d3;

    color: #ffffff; }



/*******************

Table-Data Table

******************/

.dataTables_wrapper {

  padding-top: 10px; }



.dt-buttons {

  display: inline-block;

  padding-top: 5px;

  margin-bottom: 15px; }

  .dt-buttons .dt-button {

    padding: 5px 15px;

    border-radius: 4px;

    background: #20aee3;

    color: #ffffff;

    margin-right: 3px; }

    .dt-buttons .dt-button:hover {

      background: #2f3d4a; }



.dataTables_info,

.dataTables_length {

  display: inline-block; }



.dataTables_length {

  margin-top: 10px; }

  .dataTables_length select {

    border: 0;

    background-image: linear-gradient(#20aee3, #20aee3), linear-gradient(#b1b8bb, #b1b8bb);

    background-size: 0 2px, 100% 1px;

    background-repeat: no-repeat;

    background-position: center bottom, center calc(100% - 1px);

    background-color: transparent;

    transition: background 0s ease-out;

    padding-bottom: 5px; }

    .dataTables_length select:focus {

      outline: none;

      background-image: linear-gradient(#20aee3, #20aee3), linear-gradient(#b1b8bb, #b1b8bb);

      background-size: 100% 2px, 100% 1px;

      box-shadow: none;

      transition-duration: 0.3s; }



.dataTables_filter {

  float: right;

  margin-top: 10px; }

  .dataTables_filter input {

    border: 0;

    background-image: linear-gradient(#20aee3, #20aee3), linear-gradient(#b1b8bb, #b1b8bb);

    background-size: 0 2px, 100% 1px;

    background-repeat: no-repeat;

    background-position: center bottom, center calc(100% - 1px);

    background-color: transparent;

    transition: background 0s ease-out;

    float: none;

    box-shadow: none;

    border-radius: 0;

    margin-left: 10px; }

    .dataTables_filter input:focus {

      outline: none;

      background-image: linear-gradient(#20aee3, #20aee3), linear-gradient(#b1b8bb, #b1b8bb);

      background-size: 100% 2px, 100% 1px;

      box-shadow: none;

      transition-duration: 0.3s; }



table.dataTable thead .sorting,

table.dataTable thead .sorting_asc,

table.dataTable thead .sorting_desc,

table.dataTable thead .sorting_asc_disabled,

table.dataTable thead .sorting_desc_disabled {

  background: transparent; }



table.dataTable thead .sorting_asc:after {

  content: "\f0de";

  margin-left: 10px;

  font-family: fontawesome;

  cursor: pointer; }



table.dataTable thead .sorting_desc:after {

  content: "\f0dd";

  margin-left: 10px;

  font-family: fontawesome;

  cursor: pointer; }



table.dataTable thead .sorting:after {

  content: "\f0dc";

  margin-left: 10px;

  font-family: fontawesome !important;

  cursor: pointer;

  color: rgba(50, 50, 50, 0.5); }



.dataTables_wrapper .dataTables_paginate {

  float: right;

  text-align: right;

  padding-top: 0.25em; }



.dataTables_wrapper .dataTables_paginate .paginate_button {

  box-sizing: border-box;

  display: inline-block;

  min-width: 1.5em;

  padding: 0.5em 1em;

  text-align: center;

  text-decoration: none;

  cursor: pointer;

  color: #67757c;

  border: 1px solid #ddd; }



.dataTables_wrapper .dataTables_paginate .paginate_button.current,

.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {

  color: #ffffff !important;

  border: 1px solid #20aee3;

  background-color: #20aee3; }



.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,

.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {

  cursor: default;

  color: #67757c;

  border: 1px solid #ddd;

  background: transparent;

  box-shadow: none; }



.dataTables_wrapper .dataTables_paginate .paginate_button:hover {

  color: white;

  border: 1px solid #20aee3;

  background-color: #20aee3; }



.dataTables_wrapper .dataTables_paginate .paginate_button:active {

  outline: none;

  background-color: #67757c; }



.dataTables_wrapper .dataTables_paginate .ellipsis {

  padding: 0 1em; }



/*******************

Table- responsive

******************/

.tablesaw-bar .btn-group label {

  color: #67757c !important; }



/*******************

Table- editable table

******************/

.dt-bootstrap {

  display: block; }



.paging_simple_numbers .pagination .paginate_button {

  padding: 0px;

  background: #ffffff; }

  .paging_simple_numbers .pagination .paginate_button:hover {

    background: #ffffff; }

  .paging_simple_numbers .pagination .paginate_button a {

    padding: 3px 10px;

    border: 0px; }

  .paging_simple_numbers .pagination .paginate_button.active a, .paging_simple_numbers .pagination .paginate_button:hover a {

    background: #20aee3;

    color: #ffffff; }



.stylish-table tbody tr {

  border-left: 3px solid transparent; }

  .stylish-table tbody tr:hover, .stylish-table tbody tr.active {

    border-color: #20aee3; }



/*******************

Table-Jsgrid table

******************/

.jsgrid-pager-page a,

.jsgrid-pager-current-page,

.jsgrid-pager-nav-button a {

  -webkit-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  min-width: 1.5em;

  padding: 0.5em 1em;

  text-align: center;

  text-decoration: none;

  cursor: pointer;

  color: #67757c;

  border: 1px solid #ddd; }



.jsgrid-pager-page a:hover,

.jsgrid-pager-nav-button a:hover {

  background-color: #20aee3;

  color: #ffffff; }



.jsgrid-pager-current-page {

  background-color: #20aee3;

  color: #ffffff; }



.jsgrid-pager-page,

.jsgrid-pager-nav-button {

  padding: 0; }



.jsgrid-pager-page.jsgrid-pager-current-page {

  padding: 0.5em 1em !important; }



/* perfect-scrollbar v0.7.1 */

.ps {

  -ms-touch-action: auto;

  touch-action: auto;

  overflow: hidden !important;

  -ms-overflow-style: none; }



@supports (-ms-overflow-style: none) {

  .ps {

    overflow: auto !important; } }

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {

  .ps {

    overflow: auto !important; } }

.ps.ps--active-x > .ps__scrollbar-x-rail,

.ps.ps--active-y > .ps__scrollbar-y-rail {

  display: block;

  background-color: transparent; }



.ps.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail {

  background-color: #eee;

  opacity: 0.9; }



.ps.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail > .ps__scrollbar-y {

  background-color: transparent;

  width: 8px; }



.ps > .ps__scrollbar-x-rail {

  display: none;

  position: absolute;

  /* please don't change 'position' */

  opacity: 0;

  bottom: 0px;

  /* there must be 'bottom' for ps__scrollbar-x-rail */

  height: 6px; }



.ps > .ps__scrollbar-x-rail > .ps__scrollbar-x {

  position: absolute;

  /* please don't change 'position' */

  background-color: rgba(255, 255, 255, 0.2);

  -webkit-border-radius: 6px;

  -moz-border-radius: 6px;

  border-radius: 6px;

  bottom: 2px;

  /* there must be 'bottom' for ps__scrollbar-x */

  height: 6px; }



.ps > .ps__scrollbar-x-rail:hover > .ps__scrollbar-x,

.ps > .ps__scrollbar-x-rail:active > .ps__scrollbar-x {

  height: 6px; }



.ps > .ps__scrollbar-y-rail {

  display: none;

  position: absolute;

  /* please don't change 'position' */

  opacity: 0;

  right: 0;

  /* there must be 'right' for ps__scrollbar-y-rail */

  width: 6px; }



.ps > .ps__scrollbar-y-rail > .ps__scrollbar-y {

  position: absolute;

  /* please don't change 'position' */

  background-color: rgba(0, 0, 0, 0.2);

  -webkit-border-radius: 6px;

  -moz-border-radius: 6px;

  border-radius: 6px;

  right: 2px;

  /* there must be 'right' for ps__scrollbar-y */

  width: 6px; }



.ps > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y,

.ps > .ps__scrollbar-y-rail:active > .ps__scrollbar-y {

  width: 6px; }



.ps:hover.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail {

  background-color: rgba(0, 0, 0, 0.2);

  opacity: 0.9; }



.ps:hover.ps--in-scrolling.ps--x > .ps__scrollbar-x-rail > .ps__scrollbar-x {

  background-color: rgba(0, 0, 0, 0.2);

  height: 6px; }



.ps:hover.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail > .ps__scrollbar-y {

  background-color: rgba(0, 0, 0, 0.2);

  width: 6px; }



.ps:hover > .ps__scrollbar-x-rail,

.ps:hover > .ps__scrollbar-y-rail {

  opacity: 0.6; }



.ps:hover > .ps__scrollbar-x-rail:hover > .ps__scrollbar-x {

  background-color: rgba(0, 0, 0, 0.2); }



.ps:hover > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y {

  background-color: rgba(0, 0, 0, 0.2); }



#slimtest3.ps .ps__scrollbar-y-rail {

  left: 3px;

  right: auto; }



#slimtest4.ps > .ps__scrollbar-y-rail > .ps__scrollbar-y {

  background-color: #20aee3; }



#slimtest4.ps:hover.ps--in-scrolling.ps--y > .ps__scrollbar-y-rail > .ps__scrollbar-y {

  background-color: #20aee3; }



#slimtest4.ps:hover > .ps__scrollbar-y-rail:hover > .ps__scrollbar-y {

  background-color: #20aee3; }



/*******************

Login register and recover password Page

******************/

.login-register {

  background-size: cover;

  background-repeat: no-repeat;

  background-position: center center;

  height: 100%;

  width: 100%;

  padding: 10% 0;

  position: fixed; }



.login-box {

  width: 430px;

  margin: 0 auto; }

  .login-box .footer {

    width: 100%;

    left: 0px;

    right: 0px; }

  .login-box .social {

    display: block;

    margin-bottom: 30px; }



#recoverform {

  display: none; }



.login-sidebar {

  padding: 0px;

  position: relative;

  margin-top: 0px; }

  .login-sidebar .login-box.card {

    border-radius: 0px; }



/*******************

/*User mail widgets*/

/*******************/

.topbar .top-navbar .mailbox {

  width: 300px; }

  .topbar .top-navbar .mailbox ul {

    padding: 0px; }

    .topbar .top-navbar .mailbox ul li {

      list-style: none; }



.mailbox ul li .drop-title {

  font-weight: 500;

  padding: 11px 20px 15px;

  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }

.mailbox ul li .nav-link {

  border-top: 1px solid rgba(120, 130, 140, 0.13);

  padding-top: 15px; }

.mailbox .message-center {

  height: 317px;

  overflow: auto;

  position: relative; }

  .mailbox .message-center a {

    border-bottom: 1px solid rgba(120, 130, 140, 0.13);

    display: block;

    text-decoration: none;

    padding: 9px 15px; }

    .mailbox .message-center a:hover {

      background: #e9edf2; }

    .mailbox .message-center a div {

      white-space: normal; }

    .mailbox .message-center a .user-img {

      width: 40px;

      position: relative;

      display: inline-block;

      margin: 0 10px 15px 0; }

      .mailbox .message-center a .user-img img {

        width: 100%; }

      .mailbox .message-center a .user-img .profile-status {

        border: 2px solid #ffffff;

        border-radius: 50%;

        display: inline-block;

        height: 10px;

        left: 30px;

        position: absolute;

        top: 1px;

        width: 10px; }

      .mailbox .message-center a .user-img .online {

        background: #24d2b5; }

      .mailbox .message-center a .user-img .busy {

        background: #ff5c6c; }

      .mailbox .message-center a .user-img .away {

        background: #ff9041; }

      .mailbox .message-center a .user-img .offline {

        background: #ff9041; }

    .mailbox .message-center a .mail-contnet {

      display: inline-block;

      width: 75%;

      padding-left: 10px;

      vertical-align: middle; }

      .mailbox .message-center a .mail-contnet h5 {

        margin: 5px 0px 0; }

      .mailbox .message-center a .mail-contnet .mail-desc,

      .mailbox .message-center a .mail-contnet .time {

        font-size: 12px;

        display: block;

        margin: 1px 0;

        text-overflow: ellipsis;

        overflow: hidden;

        color: #67757c;

        white-space: nowrap; }



/*******************/

/*Weather*/

/*******************/

.city-weather-days {

  margin: 0px; }

  .city-weather-days li {

    text-align: center;

    padding: 15px 0; }

    .city-weather-days li span {

      display: block;

      padding: 10px 0 0;

      color: #bcc3d3; }

    .city-weather-days li i {

      display: block;

      font-size: 20px;

      color: #20aee3; }

    .city-weather-days li h3 {

      font-weight: 300;

      margin-top: 5px; }



/*Weather small*/

.weather-small h1 {

  line-height: 30px; }

.weather-small sup {

  font-size: 60%; }



/*******************/

/*Comment widgets*/

/*******************/

.comment-widgets {

  position: relative;

  margin-bottom: 25px; }

  .comment-widgets .comment-row {

    border-bottom: 1px solid transparent;

    padding: 15px; }

    .comment-widgets .comment-row:last-child {

      border-bottom: 0px; }

    .comment-widgets .comment-row:hover, .comment-widgets .comment-row.active {

      /*background: $bglight;*/ }

    .comment-widgets .comment-row.no-hover:hover, .comment-widgets .comment-row.no-hover.active {

      background: initial; }

  .comment-widgets .x-attachements {

    padding-top: 20px;

    border-top: solid 1px #d9d9d9;

    margin: 0px 20px;

    padding-bottom: 10px; }



.comment-text {

  padding: 15px 15px 15px 20px;

  width: 80%; }

  .comment-text:hover .comment-footer .action-icons, .comment-text.active .comment-footer .action-icons {

    visibility: visible; }

  .comment-text p {

    width: 100%; }



.comment-footer .action-icons {

  visibility: hidden;

  font-size: 16px; }

  .comment-footer .action-icons a {

    padding-left: 7px;

    vertical-align: middle;

    color: #bcc3d3; }

    .comment-footer .action-icons a:hover, .comment-footer .action-icons a.active {

      color: #20aee3; }

    .comment-footer .action-icons a.danger:hover, .comment-footer .action-icons a.danger.active {

      color: #ff5c6c; }



/*******************/

/*To do widgets*/

/*******************/

.todo-list li {

  border: 0px;

  margin-bottom: 0px;

  padding: 20px 15px 15px 0px; }

  .todo-list li .checkbox {

    width: 100%; }

    .todo-list li .checkbox label {

      font-weight: 400;

      padding-left: 30px;

      width: 100%; }

      .todo-list li .checkbox label span:first-child {

        width: 80%;

        display: inline-block;

        line-height: 25px; }

  .todo-list li:last-child {

    border-bottom: 0px; }

  .todo-list li .assignedto {

    padding: 0px 0 0 30px;

    margin: 0px; }

    .todo-list li .assignedto li {

      list-style: none;

      padding: 0px;

      display: inline-block;

      border: 0px;

      margin-right: 2px; }

      .todo-list li .assignedto li img {

        width: 30px;

        border-radius: 100%; }

  .todo-list li .item-date {

    padding-left: 30px;

    font-size: 12px;

    margin-top: 5px;

    display: inline-block; }



.list-task .task-done span {

  text-decoration: line-through; }



/*******************/

/*Chat widget*/

/*******************/

.chat-list {

  margin: 0px;

  padding: 0px; }

  .chat-list li {

    list-style: none;

    margin-top: 30px; }

    .chat-list li .chat-img {

      display: inline-block;

      width: 45px;

      vertical-align: top; }

      .chat-list li .chat-img img {

        width: 45px;

        border-radius: 100%; }

    .chat-list li .chat-content {

      width: calc(100% - 140px);

      display: inline-block;

      padding-left: 15px; }

      .chat-list li .chat-content h5 {

        color: #bcc3d3; }

      .chat-list li .chat-content .box {

        display: inline-block;

        margin-bottom: 10px;

        color: #263238; }

    .chat-list li .chat-time {

      display: inline-block;

      text-align: right;

      width: 80px;

      font-size: 13px;

      color: #bcc3d3; }

    .chat-list li.odd .chat-content {

      text-align: right;

      width: calc(100% - 90px); }

    .chat-list li.odd .box {

      clear: both; }

    .chat-list li.odd + .odd {

      margin-top: 0px; }

    .chat-list li.reverse {

      text-align: right; }

      .chat-list li.reverse .chat-time {

        text-align: left; }

      .chat-list li.reverse .chat-content {

        padding-left: 0px;

        padding-right: 15px; }



/*******************/

/*Chat widget*/

/*******************/

.message-box ul li .drop-title {

  font-weight: 500;

  padding: 11px 20px 15px;

  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }

.message-box ul li .nav-link {

  border-top: 1px solid rgba(120, 130, 140, 0.13);

  padding-top: 15px; }

.message-box .message-widget {

  position: relative; }

  .message-box .message-widget a {

    border-bottom: 1px solid rgba(120, 130, 140, 0.13);

    display: block;

    text-decoration: none;

    padding: 9px 15px; }

    .message-box .message-widget a:hover {

      background: #e9edf2; }

    .message-box .message-widget a:last-child {

      border-bottom: 0px; }

    .message-box .message-widget a div {

      white-space: normal; }

    .message-box .message-widget a .user-img {

      width: 45px;

      position: relative;

      display: inline-block;

      margin: 0 10px 15px 0; }

      .message-box .message-widget a .user-img img {

        width: 100%; }

      .message-box .message-widget a .user-img .profile-status {

        border: 2px solid #ffffff;

        border-radius: 50%;

        display: inline-block;

        height: 10px;

        left: 33px;

        position: absolute;

        top: -1px;

        width: 10px; }

      .message-box .message-widget a .user-img .online {

        background: #24d2b5; }

      .message-box .message-widget a .user-img .busy {

        background: #ff5c6c; }

      .message-box .message-widget a .user-img .away {

        background: #ff9041; }

      .message-box .message-widget a .user-img .offline {

        background: #ff9041; }

    .message-box .message-widget a .mail-contnet {

      display: inline-block;

      width: 70%;

      vertical-align: middle; }

      .message-box .message-widget a .mail-contnet h5 {

        margin: 5px 0px 0; }

      .message-box .message-widget a .mail-contnet .mail-desc,

      .message-box .message-widget a .mail-contnet .time {

        font-size: 12px;

        display: block;

        margin: 1px 0;

        text-overflow: ellipsis;

        overflow: hidden;

        color: #67757c;

        white-space: nowrap; }



/*******************/

/*Calendar widget*/

/*******************/

.calendar {

  float: left;

  margin-bottom: 0px; }



.fc-view {

  margin-top: 30px; }



.none-border .modal-footer {

  border-top: none; }



.fc-toolbar {

  margin-bottom: 5px;

  margin-top: 15px; }

  .fc-toolbar h2 {

    font-size: 18px;

    font-weight: 500;

    line-height: 30px;

    text-transform: uppercase; }



.fc-day {

  background: #ffffff; }



.fc-toolbar .fc-state-active,

.fc-toolbar .ui-state-active,

.fc-toolbar button:focus,

.fc-toolbar button:hover,

.fc-toolbar .ui-state-hover {

  z-index: 0; }



.fc-widget-header {

  border: 0px !important; }



.fc-widget-content {

  border-color: rgba(120, 130, 140, 0.13) !important; }



.fc th.fc-widget-header {

  color: #67757c;

  font-size: 13px;

  font-weight: 300;

  line-height: 20px;

  padding: 7px 0px;

  text-transform: uppercase; }

.fc th.fc-sun,

.fc th.fc-tue,

.fc th.fc-thu,

.fc th.fc-sat {

  background: #f2f7f8; }

.fc th.fc-mon,

.fc th.fc-wed,

.fc th.fc-fri {

  background: #f2f7f8; }



.fc-view {

  margin-top: 0px; }



.fc-toolbar {

  margin: 0px;

  padding: 24px 0px; }



.fc-button {

  background: #ffffff;

  border: 1px solid rgba(120, 130, 140, 0.13);

  color: #67757c;

  text-transform: capitalize; }

  .fc-button:hover {

    background: #e9edf2;

    opacity: 0.8; }



.fc-text-arrow {

  font-family: inherit;

  font-size: 16px; }



.fc-state-hover {

  background: #F5F5F5; }



.fc-unthemed .fc-today {

  border: 1px solid #ff5c6c;

  background: #e9edf2 !important; }



.fc-state-highlight {

  background: #f0f0f0; }



.fc-cell-overlay {

  background: #f0f0f0; }



.fc-unthemed .fc-today {

  background: #ffffff; }



.fc-event {

  border-radius: 0px;

  border: none;

  cursor: move;

  color: #ffffff !important;

  font-size: 13px;

  margin: 1px -1px 0 -1px;

  padding: 5px 5px;

  text-align: center;

  background: #20aee3; }



.calendar-event {

  cursor: move;

  margin: 10px 5px 0 0;

  padding: 6px 10px;

  display: inline-block;

  color: #ffffff;

  min-width: 140px;

  text-align: center;

  background: #20aee3; }

  .calendar-event a {

    float: right;

    opacity: 0.6;

    font-size: 10px;

    margin: 4px 0 0 10px;

    color: #ffffff; }



.fc-basic-view td.fc-week-number span {

  padding-right: 5px; }

.fc-basic-view .fc-day-number {

  padding: 10px 15px;

  display: inline-block; }



/*******************/

/*Steam line widget*/

/*******************/

.steamline {

  position: relative;

  border-left: 1px solid rgba(120, 130, 140, 0.13);

  margin-left: 20px; }

  .steamline .sl-left {

    float: left;

    margin-left: -20px;

    z-index: 1;

    width: 40px;

    line-height: 40px;

    text-align: center;

    height: 40px;

    border-radius: 100%;

    color: #ffffff;

    margin-right: 15px; }

    .steamline .sl-left img {

      max-width: 40px; }



.steamline .sl-right {

  padding-left: 50px; }

  .steamline .sl-right .desc,

  .steamline .sl-right .inline-photos {

    margin-bottom: 30px; }



.steamline .sl-item {

  border-bottom: 1px solid rgba(120, 130, 140, 0.13);

  margin: 20px 0; }



.sl-date {

  font-size: 10px;

  color: #bcc3d3; }



.time-item {

  border-color: rgba(120, 130, 140, 0.13);

  padding-bottom: 1px;

  position: relative; }

  .time-item:before {

    content: " ";

    display: table; }

  .time-item:after {

    background-color: #ffffff;

    border-color: rgba(120, 130, 140, 0.13);

    border-radius: 10px;

    border-style: solid;

    border-width: 2px;

    bottom: 0;

    content: '';

    height: 14px;

    left: 0;

    margin-left: -8px;

    position: absolute;

    top: 5px;

    width: 14px; }



.time-item-item:after {

  content: " ";

  display: table; }



.item-info {

  margin-bottom: 15px;

  margin-left: 15px; }

  .item-info p {

    margin-bottom: 10px !important; }



/*******************/

/*Feed widget*/

/*******************/

.feeds {

  margin: 0px;

  padding: 0px; }

  .feeds li {

    list-style: none;

    padding: 10px;

    display: block; }

    .feeds li:hover {

      background: rgba(0, 0, 0, 0.02); }

    .feeds li > div {

      width: 40px;

      height: 40px;

      margin-right: 5px;

      display: inline-block;

      text-align: center;

      vertical-align: middle;

      border-radius: 100%; }

      .feeds li > div i {

        line-height: 40px; }

    .feeds li span {

      float: right;

      width: auto;

      font-size: 12px; }



/*******************/

/*Vertical carousel*/

/*******************/

.vert .carousel-item-next.carousel-item-left,

.vert .carousel-item-prev.carousel-item-right {

  -webkit-transform: translate3d(0, 0, 0);

  transform: translate3d(0, 0, 0); }



.vert .carousel-item-next,

.vert .active.carousel-item-right {

  -webkit-transform: translate3d(0, 100%, 0);

  transform: translate3d(0, 100% 0); }



.vert .carousel-item-prev,

.vert .active.carousel-item-left {

  -webkit-transform: translate3d(0, -100%, 0);

  transform: translate3d(0, -100%, 0); }



/*******************/

/*social-widgets*/

/*******************/

.social-widget .soc-header {

  padding: 15px;

  text-align: center;

  font-size: 36px;

  color: #fff; }

  .social-widget .soc-header.box-facebook {

    background: #3b5998; }

  .social-widget .soc-header.box-twitter {

    background: #00aced; }

  .social-widget .soc-header.box-google {

    background: #f86c6b; }

  .social-widget .soc-header.box-linkedin {

    background: #4875b4; }

.social-widget .soc-content {

  display: flex;

  text-align: center; }

  .social-widget .soc-content div {

    padding: 10px; }

    .social-widget .soc-content div h3 {

      margin-bottom: 0px; }



/*******************/

/*social-profile-first*/

/*******************/

.social-profile-first {

  text-align: center;

  padding-top: 22%;

  margin-bottom: 96px; }

  .social-profile-first.bg-over {

    background: rgba(56, 83, 161, 0.7); }

  .social-profile-first .middle {

    vertical-align: middle; }



/*******************/

/*profile timeline widget*/

/*******************/

.profiletimeline {

  position: relative;

  padding-left: 40px;

  margin-right: 10px;

  border-left: 1px solid rgba(120, 130, 140, 0.13);

  margin-left: 30px; }

  .profiletimeline .sl-left {

    float: left;

    margin-left: -60px;

    z-index: 1;

    margin-right: 15px; }

    .profiletimeline .sl-left img {

      max-width: 40px; }



.profiletimeline .sl-item {

  margin-top: 8px;

  margin-bottom: 30px; }



.profiletimeline .sl-date {

  font-size: 12px;

  color: #bcc3d3; }



.profiletimeline .time-item {

  border-color: rgba(120, 130, 140, 0.13);

  padding-bottom: 1px;

  position: relative; }

  .profiletimeline .time-item:before {

    content: " ";

    display: table; }

  .profiletimeline .time-item:after {

    background-color: #ffffff;

    border-color: rgba(120, 130, 140, 0.13);

    border-radius: 10px;

    border-style: solid;

    border-width: 2px;

    bottom: 0;

    content: '';

    height: 14px;

    left: 0;

    margin-left: -8px;

    position: absolute;

    top: 5px;

    width: 14px; }



.profiletimeline .time-item-item:after {

  content: " ";

  display: table; }



.profiletimeline .item-info {

  margin-bottom: 15px;

  margin-left: 15px; }

  .profiletimeline .item-info p {

    margin-bottom: 10px !important; }



/*little-profile*/

.little-profile .pro-img {

  margin-bottom: 20px; }

  .little-profile .pro-img img {

    width: 128px;

    height: 128px;

    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2);

    border-radius: 100%; }

.little-profile .soc-pro a {

  color: #bcc3d3; }

  .little-profile .soc-pro a:hover {

    color: #263238; }



/*******************

/*States row*/

/*******************/

.stats-row {

  margin-bottom: 20px; }

  .stats-row .stat-item {

    display: inline-block;

    padding-right: 15px; }

    .stats-row .stat-item + .stat-item {

      padding-left: 15px;

      border-left: 1px solid rgba(120, 130, 140, 0.13); }



/*******************/

/*Guage chart*/

/*******************/

.gaugejs-box {

  position: relative;

  margin: 0 auto; }



.gaugejs-box canvas.gaugejs {

  width: 100% !important;

  height: auto !important; }



/*******************/

/*country-state*/

/*******************/

.country-state {

  list-style: none;

  margin: 0;

  padding: 0 0 0 10px; }

  .country-state li {

    margin-top: 30px;

    margin-bottom: 10px; }

  .country-state h2 {

    margin-bottom: 0px;

    font-weight: 400; }



/*contact widgets*/

.contact-box {

  position: relative; }

  .contact-box .add-ct-btn {

    position: absolute;

    right: 4px;

    top: -46px; }

  .contact-box .contact-widget > a {

    padding: 15px 10px; }

    .contact-box .contact-widget > a .user-img {

      margin-bottom: 0px !important; }



/*Blog widgets*/

.blog-widget {

  margin-top: 30px; }

  .blog-widget .blog-image img {

    border-radius: 4px;

    margin-top: -45px;

    margin-bottom: 20px;

    box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); }



/*******************/

/*Msg box*/

/*******************/

.msg-item {

  margin-bottom: 20px; }



.msg-body {

  background: #ffffff;

  padding: 15px;

  font-size: 14px;

  position: relative; }

  .msg-body .dwn-aro {

    width: 0;

    position: absolute;

    bottom: -8px;

    height: 0;

    left: 10px;

    border-left: 8px solid transparent;

    border-right: 8px solid transparent;

    border-top: 8px solid #ffffff; }



.m-pic img {

  width: 40px;

  border-radius: 100%; }



/*******************/

/*Activity widgets*/

/*******************/

.activity-box .date-devider {

  border-top: 2px solid rgba(120, 130, 140, 0.13);

  position: relative; }

  .activity-box .date-devider span {

    background: #e9edf2;

    padding: 5px 15px;

    border-radius: 60px;

    font-size: 14px;

    top: -15px;

    position: relative;

    margin-left: 20px; }

.activity-box .activity-item {

  display: flex;

  margin-bottom: 30px; }

  .activity-box .activity-item .image-list > a {

    margin-left: -15px;

    position: relative;

    vertical-align: middle; }

    .activity-box .activity-item .image-list > a:first-child, .activity-box .activity-item .image-list > a:last-child {

      margin-left: 0px; }

    .activity-box .activity-item .image-list > a:hover {

      z-index: 10; }

      .activity-box .activity-item .image-list > a:hover img {

        box-shadow: 0 2px 15px rgba(0, 0, 0, 0.2); }



/*============================================================== 

widget-chart-page product review

 ============================================================== */

.product-review {

  margin: 0px;

  padding: 25px; }

  .product-review li {

    display: block;

    padding: 20px 0;

    list-style: none; }

    .product-review li .font,

    .product-review li span {

      display: inline-block;

      margin-left: 10px; }



.social-profile {

  text-align: center;

  background: rgba(7, 10, 43, 0.8); }



.profile-tab li a.nav-link, .customtab li a.nav-link {

  border: 0px;

  padding: 15px 20px;

  color: #67757c; }

  .profile-tab li a.nav-link.active, .customtab li a.nav-link.active {

    border-bottom: 2px solid #20aee3;

    color: #20aee3; }

  .profile-tab li a.nav-link:hover, .customtab li a.nav-link:hover {

    color: #20aee3; }



@media (min-width: 1600px) {

  .col-xlg-1, .col-xlg-10, .col-xlg-11, .col-xlg-12, .col-xlg-2, .col-xlg-3, .col-xlg-4, .col-xlg-5, .col-xlg-6, .col-xlg-7, .col-xlg-8, .col-xlg-9 {

    float: left; }



  .col-xlg-12 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 100%;

    -ms-flex: 0 0 100%;

    flex: 0 0 100%;

    max-width: 100%; }



  .col-xlg-11 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 91.66666667%;

    -ms-flex: 0 0 91.66666667%;

    flex: 0 0 91.66666667%;

    max-width: 91.66666667%; }



  .col-xlg-10 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 83.33333333%;

    -ms-flex: 0 0 83.33333333%;

    flex: 0 0 83.33333333%;

    max-width: 83.33333333%; }



  .col-xlg-9 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 75%;

    -ms-flex: 0 0 75%;

    flex: 0 0 75%;

    max-width: 75%; }



  .col-xlg-8 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 66.66666667%;

    -ms-flex: 0 0 66.66666667%;

    flex: 0 0 66.66666667%;

    max-width: 66.66666667%; }



  .col-xlg-7 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 58.33333333%;

    -ms-flex: 0 0 58.33333333%;

    flex: 0 0 58.33333333%;

    max-width: 58.33333333%; }



  .col-xlg-6 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 50%;

    -ms-flex: 0 0 50%;

    flex: 0 0 50%;

    max-width: 50%; }



  .col-xlg-5 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 41.66666667%;

    -ms-flex: 0 0 41.66666667%;

    flex: 0 0 41.66666667%;

    max-width: 41.66666667%; }



  .col-xlg-4 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 33.33333333%;

    -ms-flex: 0 0 33.33333333%;

    flex: 0 0 33.33333333%;

    max-width: 33.33333333%; }



  .col-xlg-3 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 25%;

    -ms-flex: 0 0 25%;

    flex: 0 0 25%;

    max-width: 25%; }



  .col-xlg-2 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 16.66666667%;

    -ms-flex: 0 0 16.66666667%;

    flex: 0 0 16.66666667%;

    max-width: 16.66666667%; }



  .col-xlg-1 {

    -webkit-box-flex: 0;

    -webkit-flex: 0 0 8.33333333%;

    -ms-flex: 0 0 8.33333333%;

    flex: 0 0 8.33333333%;

    max-width: 8.33333333%; }



  .col-xlg-pull-12 {

    right: 100%; }



  .col-xlg-pull-11 {

    right: 91.66666667%; }



  .col-xlg-pull-10 {

    right: 83.33333333%; }



  .col-xlg-pull-9 {

    right: 75%; }



  .col-xlg-pull-8 {

    right: 66.66666667%; }



  .col-xlg-pull-7 {

    right: 58.33333333%; }



  .col-xlg-pull-6 {

    right: 50%; }



  .col-xlg-pull-5 {

    right: 41.66666667%; }



  .col-xlg-pull-4 {

    right: 33.33333333%; }



  .col-xlg-pull-3 {

    right: 25%; }



  .col-xlg-pull-2 {

    right: 16.66666667%; }



  .col-xlg-pull-1 {

    right: 8.33333333%; }



  .col-xlg-pull-0 {

    right: auto; }



  .col-xlg-push-12 {

    left: 100%; }



  .col-xlg-push-11 {

    left: 91.66666667%; }



  .col-xlg-push-10 {

    left: 83.33333333%; }



  .col-xlg-push-9 {

    left: 75%; }



  .col-xlg-push-8 {

    left: 66.66666667%; }



  .col-xlg-push-7 {

    left: 58.33333333%; }



  .col-xlg-push-6 {

    left: 50%; }



  .col-xlg-push-5 {

    left: 41.66666667%; }



  .col-xlg-push-4 {

    left: 33.33333333%; }



  .col-xlg-push-3 {

    left: 25%; }



  .col-xlg-push-2 {

    left: 16.66666667%; }



  .col-xlg-push-1 {

    left: 8.33333333%; }



  .col-xlg-push-0 {

    left: auto; }



  .offset-xlg-12 {

    margin-left: 100%; }



  .offset-xlg-11 {

    margin-left: 91.66666667%; }



  .offset-xlg-10 {

    margin-left: 83.33333333%; }



  .offset-xlg-9 {

    margin-left: 75%; }



  .offset-xlg-8 {

    margin-left: 66.66666667%; }



  .offset-xlg-7 {

    margin-left: 58.33333333%; }



  .offset-xlg-6 {

    margin-left: 50%; }



  .offset-xlg-5 {

    margin-left: 41.66666667%; }



  .offset-xlg-4 {

    margin-left: 33.33333333%; }



  .offset-xlg-3 {

    margin-left: 25%; }



  .offset-xlg-2 {

    margin-left: 16.66666667%; }



  .offset-xlg-1 {

    margin-left: 8.33333333%; }



  .offset-xlg-0 {

    margin-left: 0; } }

.col-xlg-1, .col-xlg-10, .col-xlg-11, .col-xlg-12, .col-xlg-2, .col-xlg-3, .col-xlg-4, .col-xlg-5, .col-xlg-6, .col-xlg-7, .col-xlg-8, .col-xlg-9 {

  position: relative;

  min-height: 1px;

  padding-right: 15px;

  padding-left: 15px; }



/*-------------------*/

/*Bootstrap 4 hack*/

/*-------------------*/

.bootstrap-touchspin .input-group-btn {

  align-items: normal; }



.form-control-danger, .form-control-success, .form-control-warning {

  padding-right: 2.25rem;

  background-repeat: no-repeat;

  background-position: center right .5625rem;

  -webkit-background-size: 1.125rem 1.125rem;

  background-size: 1.125rem 1.125rem; }



.has-success .col-form-label, .has-success .custom-control, .has-success .form-check-label, .has-success .form-control-feedback, .has-success .form-control-label {

  color: #24d2b5; }



.has-success .form-control-success {

  background-image: url(../../images/icon/success.png); }



.has-success .form-control {

  border-color: #24d2b5; }



.has-warning .col-form-label, .has-warning .custom-control, .has-warning .form-check-label, .has-warning .form-control-feedback, .has-warning .form-control-label {

  color: #ff9041; }



.has-warning .form-control-warning {

  background-image: url(../../images/icon/warning.png); }



.has-warning .form-control {

  border-color: #ff9041; }



.has-danger .col-form-label, .has-danger .custom-control, .has-danger .form-check-label, .has-danger .form-control-feedback, .has-danger .form-control-label {

  color: #ff5c6c; }



.has-danger .form-control-danger {

  background-image: url(../../images/icon/danger.svg); }



.has-danger .form-control {

  border-color: #ff5c6c; }



.input-group-addon [type="radio"]:not(:checked),

.input-group-addon [type="radio"]:checked,

.input-group-addon [type="checkbox"]:not(:checked),

.input-group-addon [type="checkbox"]:checked {

  position: initial;

  opacity: 1; }



.invisible {

  visibility: hidden !important; }



.hidden-xs-up {

  display: none !important; }



@media (max-width: 575px) {

  .hidden-xs-down {

    display: none !important; } }

@media (min-width: 576px) {

  .hidden-sm-up {

    display: none !important; } }

@media (max-width: 767px) {

  .hidden-sm-down {

    display: none !important; } }

@media (min-width: 768px) {

  .hidden-md-up {

    display: none !important; } }

@media (max-width: 991px) {

  .hidden-md-down {

    display: none !important; } }

@media (min-width: 992px) {

  .hidden-lg-up {

    display: none !important; } }

@media (max-width: 1199px) {

  .hidden-lg-down {

    display: none !important; } }

@media (min-width: 1200px) {

  .hidden-xl-up {

    display: none !important; } }

.hidden-xl-down {

  display: none !important; }



.card-inverse .card-blockquote, .card-inverse .card-footer, .card-inverse .card-header, .card-inverse .card-title {

  color: #ffffff; }



/*============================================================== 

 For Laptop & above all (1650px) 

 ============================================================== */

@media (min-width: 1650px) {

  .widget-app-columns {

    column-count: 3; }



  .website-visitor {

    height: 445px; }



  .auto-height {

    max-height: 315px; } }

@media (max-width: 1600px) {

  .website-visitor {

    height: 333px; }



  .auto-height {

    min-height: 240px; } }

/*============================================================== 

 For Laptop & above all (1370px) 

 ============================================================== */

@media (max-width: 1370px) {

  .widget-app-columns {

    column-count: 2; }



  .website-visitor {

    height: 353px; }



  .auto-height {

    min-height: 186px; } }

/*-- ============================================================== 

 Small Desktop & above all (1024px) 

 ============================================================== */

@media (min-width: 1024px) {

  .page-wrapper {

    margin-left: 210px; } }

@media (max-width: 1023px) {

  .page-wrapper {

    margin-left: 70px;

    transition: 0.2s ease-in; }



  .widget-app-columns {

    column-count: 1; }



  .inbox-center a {

    width: 200px; }



  .hdr-nav-bar .navbar .navbar-nav > li a {

    padding: 12px 15px;

    border-bottom: 0px solid transparent;

    border-left: 2px solid transparent; }

  .hdr-nav-bar .navbar .navbar-nav > li:hover a {

    padding: 12px 20px; }

  .hdr-nav-bar .call-to-act .custom-select {

    margin-bottom: 10px; }



  .d-flex {

    display: block !important; }

    .d-flex.no-block {

      display: flex !important; }



  /* nextloop */

  .logged-out body .login-background {

    display: none !important; } }

/*-- ============================================================== 

 Ipad & above all(768px) 

 ============================================================== */

@media (min-width: 768px) {

  .navbar-header {

    width: 200px;

    flex-shrink: 0; }

    .navbar-header .navbar-brand {

      padding-top: 0px; }



  /*This is for the breeadcrumd*/

  .page-titles .breadcrumb {

    text-transform: uppercase; }



  .card-group .card:first-child,

  .card-group .card:not(:first-child):not(:last-child) {

    border-right: 1px solid rgba(0, 0, 0, 0.03); }



  .material-icon-list-demo .icons div {

    width: 33%;

    padding: 15px;

    display: inline-block;

    line-height: 40px; }



  .mini-sidebar .page-wrapper {

    margin-left: 75px; }



  .flex-wrap {

    flex-wrap: nowrap !important;

    -webkit-flex-wrap: nowrap !important; } }

/*-- ============================================================== 

 Phone and below ipad(767px) 

 ============================================================== */

@media (max-width: 767px) {

  .container-fluid {

    padding: 25px 15px 25px 15px; }



  /*Header*/

  .topbar {

    position: fixed;

    width: 100%; }

    .topbar .top-navbar {

      -webkit-box-orient: horizontal;

      -webkit-box-direction: normal;

      flex-direction: row;

      flex-wrap: nowrap;

      -webkit-align-items: center; }

      .topbar .top-navbar .navbar-header {

        border-bottom: 0px; }

      .topbar .top-navbar .navbar-collapse {

        display: flex;

        width: 100%; }

      .topbar .top-navbar .navbar-nav {

        flex-direction: row; }

        .topbar .top-navbar .navbar-nav > .nav-item.show {

          position: static; }

          .topbar .top-navbar .navbar-nav > .nav-item.show .dropdown-menu {

            width: 100%;

            margin-top: 0px; }

        .topbar .top-navbar .navbar-nav > .nav-item > .nav-link {

          padding-left: .50rem;

          padding-right: .50rem; }

        .topbar .top-navbar .navbar-nav .dropdown-menu {

          position: absolute; }



  .mega-dropdown .dropdown-menu {

    height: 480px;

    overflow: auto; }



  /*Sidebar and wrapper*/

  .mini-sidebar .page-wrapper {

    margin-left: 0px;

    padding-top: 70px; }



  .comment-text .comment-footer .action-icons {

    display: block;

    padding: 10px 0; }



  .vtabs .tabs-vertical {

    width: auto; }



  /*Footer*/

  .material-icon-list-demo .icons div {

    width: 100%; }



  .error-page .footer {

    position: fixed;

    bottom: 0px;

    z-index: 10; }



  .error-box {

    position: relative;

    padding-bottom: 60px; }



  .error-body {

    padding-top: 10%; }

    .error-body h1 {

      font-size: 100px;

      font-weight: 600;

      line-height: 100px; }



  .login-register {

    position: relative;

    overflow: hidden; }



  .login-box {

    width: 90%; }



  .login-sidebar {

    padding: 10% 0; }

    .login-sidebar .login-box {

      position: relative; }



  /*This is for chat page*/

  .chat-main-box .chat-left-aside {

    left: -250px;

    position: absolute;

    transition: 0.5s ease-in;

    background: #ffffff; }

    .chat-main-box .chat-left-aside.open-pnl {

      left: 0px; }

    .chat-main-box .chat-left-aside .open-panel {

      display: block; }



  .chat-main-box .chat-right-aside {

    width: 100%; }



  /*Timeline*/

  ul.timeline:before {

    left: 40px; }



  ul.timeline > li > .timeline-panel {

    width: calc(100% - 90px); }



  ul.timeline > li > .timeline-badge {

    top: 16px;

    left: 15px;

    margin-left: 0; }



  ul.timeline > li > .timeline-panel {

    float: right; }



  ul.timeline > li > .timeline-panel:before {

    right: auto;

    left: -15px;

    border-right-width: 15px;

    border-left-width: 0; }



  ul.timeline > li > .timeline-panel:after {

    right: auto;

    left: -14px;

    border-right-width: 14px;

    border-left-width: 0; }



  /*Contact app page*/

  .left-aside {

    width: 100%;

    position: relative;

    border: 0px; }



  .right-aside {

    margin-left: 0px; }



  .flex-wrap {

    flex-wrap: wrap !important;

    -webkit-flex-wrap: wrap !important; }



  .chat-list li .chat-content {

    width: calc(100% - 80px); }



  /*Calendar*/

  .fc-toolbar .fc-left,

  .fc-toolbar .fc-right,

  .fc-toolbar .fc-center {

    float: none;

    display: block;

    text-align: center;

    margin-top: 10px;

    overflow: hidden; } }

/*-- ============================================================== 

 Nextloop - Reverse - max-width: 1199px

 ============================================================== */

@media (max-width: 1199px) {

  #project-details-panel {

    display: block !important;

    width: 100%; }

    #project-details-panel .last-line,

    #project-details-panel #project_progress_hidden {

      display: block !important;

      width: 100%; }

      #project-details-panel .last-line .project_progress_hidden_text,

      #project-details-panel #project_progress_hidden .project_progress_hidden_text {

        font-size: 20px; }

    #project-details-panel #project_progress_container {

      display: none; }



  #client-details-panel {

    display: block !important;

    width: 100%; }

    #client-details-panel .profile_header {

      display: none; }



  #client-profile-tab {

    display: inherit; } }

/*============================================================== 

 Nextloop - Settings

 ============================================================== */

@media (max-width: 1023px) {

  .settings .left-sidebar {

    display: none; }

  .settings .page-wrapper {

    margin-left: 0px; }

  .settings .topbar {

    margin-left: 0px !important; }

  .settings .navbar-top-right {

    margin-right: 0px !important; }

  .settings .settings-hamburger-menu {

    display: block; }

  .settings .toggle-left-menu {

    display: block;

    margin-top: 74px; } }

/*-- ============================================================== 

 Small Desktop & above all (1024px) 

 ============================================================== */

@media (max-width: 400px) {

  /* nextloop */

  .login-box {

    width: 300px !important; }



  #header-search {

    width: 100px !important; }



  .btn-add-circle {

    border-radius: 5px !important;

    height: 35px !important;

    width: 35px !important;

    padding: 2px !important;

    font-size: 14px !important; }



  #list-page-actions {

    padding-top: 10px !important; }



  #settings-exit-text {

    display: none !important; }



  #settings-exit-button {

    font-size: 20px; } }

/* ----------------------------------------------------------

 * PRELOADER

 * now shows only in middle section, and on normal window

 * 74px from to in order to show top nav

 * --------------------------------------------------------*/

.preloader {

  top: 74px; }



.loader {

  top: 45%;

  left: calc(50% - 0px); }



.mini-sidebar .loader {

  top: 44%;

  left: calc(50% - 45px); }



.logged-out .loader {

  top: 44%;

  left: 45%; }



/* ----------------------------------------------------------

 * UTILITIES

 * --------------------------------------------------------*/

.clearfix::after {

  content: "";

  clear: both;

  display: table; }



.ucwords {

  text-transform: capitalize; }



.pull-right {

  float: right; }

  .pull-right:after {

    content: "";

    display: block;

    clear: both; }



.pull-left {

  float: left; }

  .pull-left:after {

    content: "";

    display: block;

    clear: both; }



/* ----------------------------------------------------------

 * LOADING MAIN TEMPLATE

 * used for main wrapper/template loading annimation

 * --------------------------------------------------------*/

.loader-loading {

  position: relative; }

  .loader-loading:after {

    content: " ";

    background-image: url(/public/images/loading.gif);

    display: inline-block;

    width: 120px;

    height: 40px;

    background-position: center;

    background-repeat: no-repeat;

    vertical-align: middle; }



/* ----------------------------------------------------------

 * LOADING PLACEHOLDER

 * [annimation source] https://loading.io/

 * acts like inline-block content. Usefull as a place holder

 * for actual content that will follow (e,e via ajax)

 * nicely positioned in content's place

 * --------------------------------------------------------*/

.loading-placeholder {

  position: relative; }

  .loading-placeholder:after {

    content: " ";

    background-image: url(/public/images/loading-small.gif);

    display: inline-block;

    width: 60px;

    height: 25px;

    background-position: center;

    background-repeat: no-repeat;

    vertical-align: middle; }



/* ----------------------------------------------------------

 * LOADING - STANDARD

 * floats in the middle of the specified container

 * --------------------------------------------------------*/

.loading {

  position: relative; }

  .loading:after {

    content: " ";

    background-image: url(/public/images/loading.gif);

    display: inline-block;

    width: 80px;

    height: 25px;

    background-position: center;

    background-repeat: no-repeat;

    vertical-align: middle;

    position: absolute;

    left: calc(50% - 80px); }



.loading-before {

  position: relative; }

  .loading-before:before {

    content: " ";

    background-image: url(/public/images/loading.gif);

    display: inline-block;

    width: 80px;

    height: 25px;

    background-position: center;

    background-repeat: no-repeat;

    vertical-align: middle;

    position: absolute;

    left: 0%; }



.loading-tabs {

  position: relative; }

  .loading-tabs:before {

    content: " ";

    background-image: url(/public/images/loading.gif);

    display: inline-block;

    width: 80px;

    height: 25px;

    background-position: center;

    background-repeat: no-repeat;

    vertical-align: middle;

    position: absolute;

    left: 45%; }



.js-card-settings-button.loading:after,

.js-card-settings-button-static.loading:after {

  height: 15px;

  width: 60px;

  left: calc(50% - 40px);

  background-size: 50px; }



/* ----------------------------------------------------------

 * LOADING ICON ON BUTTONS

 * (source) https://loading.io/css/

 * --------------------------------------------------------*/

.logo-small {

  max-width: 50px;

  max-height: 45px; }



.logo-large {

  max-width: 50px;

  max-height: 45px; }



/* ----------------------------------------------------------

 * LOADING ICON ON BUTTONS

 * (source) https://loading.io/css/

 * --------------------------------------------------------*/

.button-loading-annimation:after {

  content: " ";

  display: inline-block;

  width: 18px;

  height: 18px;

  border-radius: 50%;

  border: 2px solid #fff;

  border-color: #fff transparent #fff transparent;

  animation: button-loading-annimation 1.2s linear infinite;

  position: absolute;

  right: 8px; }



.btn-xs.button-loading-annimation:after {

  top: 3px; }



@keyframes button-loading-annimation {

  0% {

    transform: rotate(0deg); }

  100% {

    transform: rotate(360deg); } }

.loggedin .preloader {

  background-color: #f6f9fa; }



/* ----------------------------------------------------------

 * GENERAL

 * --------------------------------------------------------*/

body.loggedin {

  background-color: #f6f9fa; }



strong {

  font-weight: 600; }



.avatar {

  width: 35px;

  height: 35px; }



.avatar-small {

  width: 30px;

  height: 30px; }



.user-avatar-container {

  display: inline-block;

  position: relative; }

  .user-avatar-container .online-status {

    position: absolute;

    width: 8px;

    height: 8px;

    border-radius: 50%;

    top: 0px;

    right: 0px; }



.avatar-xsmall {

  width: 30px;

  height: 30px; }



.header-search {

  max-width: 200px;

  display: inline-block;

  vertical-align: middle;

  position: relative; }

  .header-search input {

    background-color: transparent;

    height: 37px;

    min-height: 37px;

    vertical-align: bottom;

    font-size: 13px;

    padding-left: 35px; }

  .header-search i {

    position: absolute;

    font-size: 18px;

    left: 12px;

    top: 8px; }



.page-wrapper-overlay {

  position: absolute;

  background: #000000;

  width: 100%;

  top: 0;

  bottom: 0;

  z-index: 2;

  opacity: 0.1; }



.line {

  border-top: solid 1px;

  border-color: rgba(120, 130, 140, 0.13);

  height: 27px;

  margin-top: 5px; }



.tooltip .tooltip-inner {

  background-color: #474b58;

  opacity: 1; }

.tooltip .arrow::before {

  border-top-color: #474b58 !important; }



.wordwrap,

.word-wrap {

  white-space: normal;

  white-space: -moz-normal;

  white-space: -o-normal;

  word-wrap: break-word; }



.dropdown-menu {

  border-radius: 3px;

  -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;

  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;

  border-color: transparent !important; }



.dropdown-menu-small {

  padding: 5px 0px; }

  .dropdown-menu-small .dropdown-item {

    padding: 8px 10px;

    color: #67757c;

    font-size: 13px; }



a.underlined:hover {

  text-decoration: underline !important;

  color: #20aee3; }



.cursor-pointer {

  cursor: pointer; }



.box-shadow {

  -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;

  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important; }



/* ----------------------------------------------------------

 * MAIN NAVIGATION

 * --------------------------------------------------------*/

.fix-header .topbar {

  margin-left: 0px; }

.fix-header .left-sidebar {

  padding-top: 70px; }

  .fix-header .left-sidebar .logo a {

    padding-left: 11px; }

.fix-header .top-navbar .navbar-top-right {

  margin-right: 0px; }



#sidebarnav {

  padding-top: 8px;

  padding-bottom: 100px; }



.mini-sidebar.fix-header .topbar {

  margin-left: 0px; }

.mini-sidebar.fix-header .top-navbar .navbar-top-right {

  margin-right: 0px; }

.mini-sidebar .left-sidebar .logo a {

  padding-left: 10px !important; }



@media (max-width: 767px) {

  .mini-sidebar.fix-header .topbar {

    margin-left: 0px; }

  .mini-sidebar.fix-header .top-navbar .navbar-top-right {

    margin-right: 0px; } }

/* ----------------------------------------------------------

 * TEXT FONT COLORS & MORE

 * --------------------------------------------------------*/

.text-danger {

  color: #ff5c6c !important; }



.text-success {

  color: #24d2b5 !important; }



.text-warning {

  color: #ff9041 !important; }



.text-primary {

  color: #6772e5 !important; }



.text-info {

  color: #20aee3 !important; }



.text-lime {

  color: #cddc39 !important; }



.text-brown {

  color: #795548 !important; }



.text-default {

  color: #67757c !important; }



.text-muted {

  color: #bcc3d3 !important; }



.text-inverse {

  color: #2f3d4a !important; }



.text-secondary {

  color: #cccccc !important; }



.text-themecolor {

  color: #20aee3 !important; }



.text-themecontrast {

  color: #ff5c6c !important; }



.text-muted {

  color: #bcc3d3 !important; }



.muted {

  opacity: 0.3; }



.text-dark {

  color: #263238 !important; }



.text-default {

  color: #67757c !important; }



.text-disabled {

  color: #c0c8cc !important; }



.text-bold {

  font-weight: 500; }



/*******************

Background Colors

*******************/

.bg-primary {

  background-color: #6772e5 !important; }



.bg-success {

  background-color: #24d2b5 !important; }



.bg-info {

  background-color: #20aee3 !important; }



.bg-warning {

  background-color: #ff9041 !important; }



.bg-danger {

  background-color: #ff5c6c !important; }



.bg-themecolor {

  background-color: #20aee3 !important; }



.bg-brown {

  background-color: #795548 !important; }



.bg-lime {

  background-color: #cddc39 !important; }



.bg-themecontrast {

  background-color: #ff5c6c !important; }



/* ----------------------------------------------------------

 * FONT COLORS

 * --------------------------------------------------------*/

.border-danger {

  border-color: #ff5c6c !important; }



.border-success {

  border-color: #24d2b5 !important; }



.border-warning {

  border-color: #ff9041 !important; }



.border-primary {

  border-color: #6772e5 !important; }



.border-info {

  border-color: #20aee3 !important; }



.border-inverse {

  border-color: #2f3d4a !important; }



.border-secondary {

  border-color: #cccccc !important; }



.border-themecolor {

  border-color: #20aee3 !important; }



.border-themecontrast {

  border-color: #ff5c6c !important; }



.border-purple {

  border-color: #7460ee !important; }



.border-green {

  border-color: #4caf50 !important; }



.border-default {

  border-color: #67757c !important; }



.border-lime {

  border-color: #cddc39 !important; }



.border-brown {

  border-color: #795548 !important; }



/* ----------------------------------------------------------

 * BUTTONS & LABELS

 * --------------------------------------------------------*/

.btn:disabled {

  cursor: default; }



.label-sm {

  font-size: 8px !important;

  padding: 0px 5px !important; }



.label-lg {

  font-size: 16px !important;

  padding: 8px 15px !important;

  font-weight: 400 !important; }



.label-xl {

  font-size: 18px !important;

  padding: 10px 20px !important;

  font-weight: 400 !important; }



.btn-extra-padding {

  padding-right: 35px;

  padding-left: 35px; }



/* ----------------------------------------------------------

 * ALERTS - INFORMATION

 * --------------------------------------------------------*/

.alert-info span {

  color: #20aee3; }



.alert-warning span {

  color: #ff9041; }



.alert-danger span {

  color: #ff5c6c; }



/*******************

/*Top bar

*******************/

.topbar {

  background: #ffffff; }

  .topbar .navbar-header {

    background: #ffffff; }

  .topbar .top-navbar .navbar-header .navbar-brand .light-logo {

    display: none;

    color: rgba(0, 0, 0, 0.7); }

  .topbar .navbar-light .navbar-nav .nav-item > a.nav-link {

    color: rgba(0, 0, 0, 0.7) !important; }

    .topbar .navbar-light .navbar-nav .nav-item > a.nav-link:hover, .topbar .navbar-light .navbar-nav .nav-item > a.nav-link:focus {

      color: black !important; }



/*******************

/*General Elements

*******************/

a.link:hover, a.link:focus {

  color: #20aee3 !important; }



.bg-theme {

  background-color: #20aee3 !important; }



.pagination > .active > a,

.pagination > .active > span,

.pagination > .active > a:hover,

.pagination > .active > span:hover,

.pagination > .active > a:focus,

.pagination > .active > span:focus {

  background-color: #20aee3;

  border-color: #20aee3; }



.right-sidebar .rpanel-title {

  background: #20aee3; }



.stylish-table tbody tr:hover, .stylish-table tbody tr.active {

  border-left: 4px solid #20aee3; }



.text-themecolor {

  color: #20aee3 !important; }



.profile-tab li a.nav-link.active,

.customtab li a.nav-link.active {

  border-bottom: 2px solid #20aee3;

  color: #20aee3; }

.profile-tab li a.nav-link:hover,

.customtab li a.nav-link:hover {

  color: #20aee3; }



/*******************

/*Buttons

*******************/

.btn-themecolor,

.btn-themecolor.disabled {

  background: #20aee3;

  color: #ffffff;

  border: 1px solid #20aee3; }

  .btn-themecolor:hover,

  .btn-themecolor.disabled:hover {

    background: #20aee3;

    opacity: 0.7;

    border: 1px solid #20aee3; }

  .btn-themecolor.active, .btn-themecolor:focus,

  .btn-themecolor.disabled.active,

  .btn-themecolor.disabled:focus {

    background: #1d96c3; }



.btn-icon {

  padding-left: 15px; }

  .btn-icon i {

    padding-right: 5px; }



/* source: https://gradientbuttons.colorion.co/ */

.btn-grad {

  background-image: linear-gradient(to right, #FF512F 0%, #DD2476 51%, #FF512F 100%); }

  .btn-grad:hover {

    background-position: right center; }

  .btn-grad.rounded {

    border-radius: 50%; }



/* ----------------------------------------------------------

 * left sidebar

 * --------------------------------------------------------*/

.label-themecolor {

  background: #20aee3; }



.sidebar-nav > ul > li.active > a {

  color: #20aee3;

  border-color: #20aee3; }

  .sidebar-nav > ul > li.active > a i {

    color: #20aee3; }



.sidebar-nav ul li a.active, .sidebar-nav ul li a:hover {

  color: #20aee3; }

  .sidebar-nav ul li a.active i, .sidebar-nav ul li a:hover i {

    color: #20aee3; }



.sidebar-nav > ul > li > a i {

  color: #787f91; }



#main-sidenav {

  height: 100%;

  padding-right: 10px; }



/* ----------------------------------------------------------

 * right side panel

 * --------------------------------------------------------*/

.right-sidebar .filter-block {

  padding: 4px 0px 6px 0px;

  margin-bottom: 8px; }

  .right-sidebar .filter-block .title {

    font-size: 13px;

    padding-bottom: 2px; }

  .right-sidebar .filter-block .fields {

    padding-bottom: 4px; }

    .right-sidebar .filter-block .fields .row {

      margin-left: -7px;

      margin-right: -7px; }

    .right-sidebar .filter-block .fields *[class^='col-'] {

      padding-left: 7px;

      padding-right: 7px; }

.right-sidebar .buttons-block {

  text-align: center;

  padding-top: 20px;

  padding-bottom: 20px; }



/**-------------------------------------------------------

* forms

* -------------------------------------------------------*/

.form-control-xs {

  font-size: 12px !important;

  min-height: 25px !important;

  padding: 6px 5px; }



.form-control-sm {

  font-size: 13px !important;

  min-height: 31px !important; }



.input-group-addon {

  font-size: 13px !important;

  min-height: 31px !important;

  padding: 5px 10px;

  border: 1px solid #ced4da;

  border-right: none;

  border-top-left-radius: 4px;

  border-bottom-left-radius: 4px; }



.input-group-sm .input-group-addon {

  font-size: 13px !important;

  min-height: 31px !important;

  padding: 5px 10px;

  border: 1px solid #ced4da;

  border-right: none;

  border-top-left-radius: 4px;

  border-bottom-left-radius: 4px;

  height: calc(1.5em + .5rem + 2px); }

.input-group-sm .form-control {

  font-size: 13px !important;

  padding: .25rem .5rem;

  min-height: 31px !important; }



.control-label.required {

  font-weight: 600; }



.form-control:focus {

  box-shadow: none; }



/**-------------------------------------------------------

* js validation - form field error colors

* -------------------------------------------------------*/

.form-control.error {

  border-color: #ff5c6c !important; }



textarea.error {

  border-color: #ff5c6c !important; }



.select2-container.error {

  border: solid 1px #ff5c6c !important;

  outline: none;

  border-radius: 3px; }



.form-material .form-control.error {

  background-image: linear-gradient(#ff5c6c, #ff5c6c), linear-gradient(#ff5c6c, #ff5c6c); }

  .form-material .form-control.error:focus {

    background-image: linear-gradient(#ff5c6c, #ff5c6c), linear-gradient(#ff5c6c, #ff5c6c); }



/*noty message list items*/

.i-am-new {

  width: 350px !important; }

  .i-am-new li:first-child {

    width: 100% !important; }



.noty_type_warning li {

  display: list-item;

  list-style: circle;

  list-style-position: inside; }



/**-------------------------------------------------------

* action buttons

* -------------------------------------------------------*/

.btn-page-actions {

  background-color: transparent;

  border: solid 1px #d1d4d5;

  font-size: 18px;

  padding: 10px;

  padding-bottom: 4px;

  color: #848788;

  padding-top: 9px;

  margin-left: 2px; }

  .btn-page-actions:hover {

    color: #000000; }



/**-------------------------------------------------------

* bootstrap styled buttons

* -------------------------------------------------------*/

.bootstrap-select .btn {

  background-color: #fff;

  border: solid 1px #d9d9d9;

  color: #67757c !important;

  font-size: 0.9rem;

  padding-top: 10px;

  padding-bottom: 10px;

  padding-left: 16px; }

.bootstrap-select.form-sm .btn {

  font-size: 13px;

  padding-top: 5px;

  padding-bottom: 6px;

  padding-left: 9px; }

.bootstrap-select .dropdown-menu {

  font-size: 14px; }

  .bootstrap-select .dropdown-menu ul li {

    padding: 0px 0px; }

    .bootstrap-select .dropdown-menu ul li:hover {

      color: initial; }

    .bootstrap-select .dropdown-menu ul li a:hover, .bootstrap-select .dropdown-menu ul li a:focus {

      color: #848484;

      background: #f1f1f1; }



/**-------------------------------------------------------

* list tables

* -------------------------------------------------------*/

.list-table-wrapper {

  min-height: 250px; }



.sorting-icons {

  font-size: 10px;

  padding-left: 3px; }



/**-------------------------------------------------------

* list tables

* -------------------------------------------------------*/

.stats-wrapper {

  margin-bottom: 30px; }



/**-------------------------------------------------------

* action icons for list tables

* -------------------------------------------------------*/

.list-table-action {

  font-size: 22px;

  cursor: pointer; }

  .list-table-action .dropdown-menu {

    padding: 6px; }

    .list-table-action .dropdown-menu a {

      font-size: 14px;

      padding: 7px 13px; }

      .list-table-action .dropdown-menu a i {

        padding-right: 2px; }

  .list-table-action .btn {

    width: 25px;

    border-color: transparent;

    font-size: 18px;

    height: 28px;

    background-color: transparent; }

    .list-table-action .btn:hover, .list-table-action .btn:active, .list-table-action .btn:visited, .list-table-action .btn:focus {

      background: transparent;

      border-color: transparent; }

  .list-table-action .btn-action-danger {

    width: initial;

    border-color: #ff5c6c;

    font-size: 12px;

    height: initial;

    background-color: #ff5c6c;

    padding: 2px 20px;

    vertical-align: middle;

    margin-top: 5px; }

    .list-table-action .btn-action-danger:hover, .list-table-action .btn-action-danger:active, .list-table-action .btn-action-danger:visited, .list-table-action .btn-action-danger:focus {

      background: #ff5c6c;

      border-color: #ff5c6c; }

  .list-table-action .btn-outline-secondary:hover, .list-table-action .btn-outline-secondary:active, .list-table-action .btn-outline-secondary:visited, .list-table-action .btn-outline-secondary:focus {

    color: #adadad; }

  .list-table-action .btn-outline-primary:hover, .list-table-action .btn-outline-primary:active, .list-table-action .btn-outline-primary:visited, .list-table-action .btn-outline-primary:focus {

    color: #6352ce; }

  .list-table-action .btn-outline-danger:hover, .list-table-action .btn-outline-danger:active, .list-table-action .btn-outline-danger:visited, .list-table-action .btn-outline-danger:focus {

    color: #e6294b; }

  .list-table-action .btn-outline-success:hover, .list-table-action .btn-outline-success:active, .list-table-action .btn-outline-success:visited, .list-table-action .btn-outline-success:focus {

    color: #04b381; }

  .list-table-action .btn-outline-info:hover, .list-table-action .btn-outline-info:active, .list-table-action .btn-outline-info:visited, .list-table-action .btn-outline-info:focus {

    color: #1d96c3; }

  .list-table-action .btn-outline-warning:hover, .list-table-action .btn-outline-warning:active, .list-table-action .btn-outline-warning:visited, .list-table-action .btn-outline-warning:focus {

    color: #e9ab2e; }



.list-actions-button {

  border: 0px;

  padding: 4px 8px 1px 8px;

  font-size: 22px;

  background-color: #ebf2f5 !important;

  color: #a6b5bd !important;

  height: 37px; }

  .list-actions-button:hover {

    background-color: #e2e9ec !important;

    color: #a6b5bd !important; }

  .list-actions-button.active {

    background-color: #e4f1ff !important;

    color: #20aee3 !important; }



.list-actions-search {

  border: 0px;

  background-color: #ebf2f5 !important;

  color: #818686 !important; }



/**-------------------------------------------------------

* tinymce editor

* -------------------------------------------------------*/

.mce-tinymce .mce-panel {

  background-color: transparent; }

.mce-tinymce .mce-btn button,

.mce-tinymce button {

  background-color: transparent;

  opacity: 1 !important;

  border: none !important; }

.mce-tinymce .mce-toolbar .mce-btn i {

  color: #67757c !important; }

  .mce-tinymce .mce-toolbar .mce-btn i.mce-i-fullscreen {

    font-size: 12px !important; }



.mce-dropzone {

  border: 2px dashed #b1b8bb !important;

  padding: 5px !important;

  min-height: 100px !important;

  background: white !important;

  text-align: center !important; }



.mce-browsebutton input {

  display: none; }



/*transparent version*/

.tinymce-transparent .mce-panel {

  background: transparent; }

  .tinymce-transparent .mce-panel .mce-toolbar .mce-btn {

    background: transparent; }



/**-------------------------------------------------------

* modal windows

* -------------------------------------------------------*/

.modal .modal-content {

  border-radius: 4px;

  background-color: #fbfcfd;

  color: #4d5a67; }

  .modal .modal-content .x-extra-close-icon {

    position: absolute;

    right: 10px;

    top: 10px;

    cursor: pointer;

    z-index: 1000;

    font-size: 18px;

    color: #4c4c4c; }

.modal .modal-dialog {

  margin-top: 30px;

  margin-bottom: 150px; }

  .modal .modal-dialog .modal-header {

    min-height: 58px;

    border-bottom: none; }

    .modal .modal-dialog .modal-header button.close {

      position: absolute;

      right: 20px;

      top: 20px;

      text-shadow: none;

      background-color: transparent;

      padding: 8px;

      font-size: 18px;

      border-radius: 50%;

      border: none; }

      .modal .modal-dialog .modal-header button.close:hover, .modal .modal-dialog .modal-header button.close:active, .modal .modal-dialog .modal-header button.close:visited, .modal .modal-dialog .modal-header button.close:focus {

        border: none;

        outline: none; }

    .modal .modal-dialog .modal-header .modal-title {

      color: #20aee3; }

  .modal .modal-dialog .modal-body {

    padding-left: 30px;

    padding-right: 30px;

    padding-top: 30px; }

    .modal .modal-dialog .modal-body .spacer {

      padding: 10px 0px;

      margin-bottom: 20px;

      font-weight: 500; }

      .modal .modal-dialog .modal-body .spacer .title {

        font-weight: 500; }

    .modal .modal-dialog .modal-body .splash-image {

      text-align: center;

      padding-bottom: 20px; }

      .modal .modal-dialog .modal-body .splash-image img {

        width: 200px; }

    .modal .modal-dialog .modal-body .splash-text {

      font-size: 14px;

      text-align: center;

      padding-bottom: 10px;

      font-weight: 500; }

    .modal .modal-dialog .modal-body .splash-subtext {

      font-size: 14px;

      text-align: center;

      background-color: #ededf4;

      padding: 7px;

      margin-bottom: 20px;

      border-radius: 4px; }

    .modal .modal-dialog .modal-body .line {

      border-top: solid 1px;

      border-color: rgba(120, 130, 140, 0.13);

      height: 27px;

      margin-top: 5px; }

    .modal .modal-dialog .modal-body .highlighted-panel {

      padding: 20px;

      background-color: #f7f7f7;

      margin-bottom: 20px; }

    .modal .modal-dialog .modal-body .modal-meta-data {

      margin-top: -20px;

      padding-bottom: 20px;

      text-align: right; }

      .modal .modal-dialog .modal-body .modal-meta-data small {

        display: block; }

    .modal .modal-dialog .modal-body .form-control {

      border-color: #e4e8ec; }

    .modal .modal-dialog .modal-body .mce-panel {

      background-color: #fbfcfd; }

    .modal .modal-dialog .modal-body .mce-btn button {

      background-color: #fbfcfd;

      opacity: 1 !important; }

  .modal .modal-dialog .modal-footer {

    border-radius: inherit;

    border-top-left-radius: 0px;

    border-top-right-radius: 0px;

    border-top: none;

    padding-bottom: 15px; }



.modal .modal-dialog {

  transition: -webkit-transform .3s ease-out;

  transition: transform .3s ease-out;

  transition: transform .3s ease-out, -webkit-transform .3s ease-out;

  -webkit-transform: translate(0, -25%);

  transform: translate(0, -25%); }



@media (min-width: 992px) {

  .modal-sm {

    max-width: 450px; }



  .modal-lg {

    max-width: 650px; }



  .modal-xl {

    max-width: 800px; }



  .modal-xxl {

    max-width: 900px; } }

@media (min-width: 1200px) {

  .modal-xxl {

    max-width: 1100px; } }

/**-------------------------------------------------------

* close icons/buttons on modals

* -------------------------------------------------------*/

.close {

  cursor: pointer;

  opacity: 1; }



/**-------------------------------------------------------

* tags

* -------------------------------------------------------*/

.tag {

  padding: 3px 10px;

  line-height: 13px;

  color: #455a64;

  font-weight: 400;

  border-radius: 60px;

  font-size: 75%;

  background-color: #dddddd;

  display: inline-block; }



/**-------------------------------------------------------

* tag like labels with icons

* -------------------------------------------------------*/

.label-with-icon {

  padding: 2px 10px;

  line-height: 13px;

  color: #455a64;

  font-weight: 400;

  border-radius: 60px;

  font-size: 75%;

  background-color: #dddddd;

  display: inline-block; }

  .label-with-iconi {

    font-size: 14px;

    display: inline-block;

    vertical-align: middle; }



.popover-body .tag {

  display: inline-block;

  margin-right: 6px;

  margin-bottom: 4px; }



.table .tag {

  padding: 3px 8px 3px 8px;

  font-size: 11px; }

  .table .tag.more {

    padding: 3px 6px 2px 6px;

    cursor: pointer; }

    .table .tag.more i {

      font-size: 14px;

      vertical-align: middle; }

.table .actions {

  font-size: 13px; }



/**-------------------------------------------------------

* visibiltiy css

* -------------------------------------------------------*/

.hidden {

  display: none; }



.hidden-forced {

  display: none !important; }



.visible {

  display: block; }



.visible-table {

  display: table; }



.visible-inline {

  display: inline; }



.visible-inline-block {

  display: inline-block; }



/**-------------------------------------------------------

* settings

* -------------------------------------------------------*/

.left-sidebar #main-scroll-sidebar .sidenav-menu-item .hide-menu {

  vertical-align: middle; }



/**-------------------------------------------------------

* tables

* -------------------------------------------------------*/

.table td {

  vertical-align: middle; }

.table .actions_column {

  padding-top: 3px; }

.table .list-checkboxes label {

  visibility: visible;

  height: 20px;

  margin-bottom: 0px;

  font-size: inherit;

  color: inherit;

  padding-left: 29px; }

  .table .list-checkboxes label:before {

    width: 7px !important;

    top: -1px !important; }

  .table .list-checkboxes label:after {

    height: 18px !important;

    width: 18px !important; }

.table .list-checkboxes.only label {

  margin: 0px;

  padding-left: 18px !important;

  vertical-align: middle; }

  .table .list-checkboxes.only label:before {

    width: 7px !important;

    top: -1px !important; }

  .table .list-checkboxes.only label:after {

    height: 18px !important;

    width: 18px !important; }

.table .checkitem label {

  padding-left: 0px; }

.table th {

  border-top: 0px; }

  .table th.checkitem, .table th.list-checkbox-wrapper {

    width: 30px;

    padding: 0px;

    vertical-align: middle;

    padding-top: 7px; }

.table td.checkitem {

  padding: 0px;

  padding-top: 7px; }

.table .table-icons {

  font-size: 22px;

  vertical-align: middle;

  display: inline-block;

  margin-bottom: -8px; }



/**-------------------------------------------------------

* atoload

* -------------------------------------------------------*/

.autoload {

  padding-top: 15px;

  text-align: center; }

  .autoload .btn {

    display: inline;

    padding-left: 40px;

    padding-right: 40px; }



/**-------------------------------------------------------

* form and elements

* -------------------------------------------------------*/

.input-group-addon {

  font-size: 0.9rem; }



/**-------------------------------------------------------

* dropzone - fileupload

* -------------------------------------------------------*/

.dropzone {

  border: 2px dashed #b1b8bb;

  padding: 5px; }

  .dropzone .dz-message i {

    font-size: 40px;

    color: #c9cfd2; }

  .dropzone .dz-message span {

    display: block; }

  .dropzone .dz-preview .dz-progress {

    height: 8px;

    border-radius: 4px;

    top: 40%;

    width: 82px; }

  .dropzone .dz-preview .dz-details,

  .dropzone .dz-preview .dz-image {

    border-radius: 5px;

    width: 100px;

    height: 75px;

    background-color: #f3f3f3; }

    .dropzone .dz-preview .dz-details .dz-size,

    .dropzone .dz-preview .dz-image .dz-size {

      font-size: 13px;

      margin-bottom: 4px; }

  .dropzone .dz-preview .dz-remove {

    font-size: 8px;

    text-align: center;

    display: block;

    cursor: pointer;

    border: none;

    position: absolute;

    top: -12px;

    right: -12px;

    background: #d4cfcf;

    padding: 4px 7px;

    border-radius: 50%;

    z-index: 20;

    color: #fff;

    border: solid 2px #fff; }

    .dropzone .dz-preview .dz-remove:hover {

      text-decoration: none; }



/**-------------------------------------------------------

* popovers

* -------------------------------------------------------*/

.popover {

  -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);

  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);

  border-color: transparent; }

  .popover .popover-body {

    color: #67757c; }

    .popover .popover-body .title {

      text-align: center;

      display: block;

      padding-bottom: 5px; }



/**-------------------------------------------------------

* login signup forgot password

* -------------------------------------------------------*/

.login-images {

  height: 100%;

  width: 100%;

  object-fit: contain; }



/**-------------------------------------------------------

* top nav bar

* -------------------------------------------------------*/

.topbar {

  background: #ffffff; }



/**-------------------------------------------------------

* cards

* -------------------------------------------------------*/

.card {

  background-color: #fbfcfd;

  color: #5b676d; }

  .card [type="checkbox"].filled-in:not(:checked) + label:after {

    border: 1px solid #aab0b3; }

  .card.count-0 {

    background: transparent; }



.card-body {

  padding-left: 25px;

  padding-right: 25px; }

  .card-body .title {

    padding-bottom: 30px; }

  .card-body .card-title.card-title-underlined {

    border-bottom: solid 1px #d9d9d9;

    padding-bottom: 5px; }



.card-embed-fix {

  margin-left: -20px;

  margin-right: -20px;

  margin-top: -20px; }



/**-------------------------------------------------------

* box shadow

* -------------------------------------------------------*/

.box-shadow {

  box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

  -webkit-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

  -moz-box-shadow: 0 3px 12px rgba(0, 0, 0, 0.05);

  border-color: rgba(120, 130, 140, 0.13); }



.box-shadow-minimum {

  -webkit-box-shadow: 0px 0px 13px 2px rgba(224, 221, 224, 0.56);

  -moz-box-shadow: 0px 0px 13px 2px rgba(224, 221, 224, 0.56);

  box-shadow: 0px 0px 13px 2px rgba(224, 221, 224, 0.56); }



/**-------------------------------------------------------

* page and tab notifications

* -------------------------------------------------------*/

.tab-notification {

  font-size: 30px;

  text-align: center;

  padding-top: 100px;

  font-weight: 100; }



.page-notification {

  padding-top: 50px;

  text-align: center; }

  .page-notification img {

    width: 180px; }

  .page-notification .title {

    font-size: 24px;

    font-weight: 400; }

  .page-notification .sub-title {

    font-size: 16px; }



.tab-body .page-notification,

.table-responsive .page-notification {

  padding-top: 60px; }

  .tab-body .page-notification img,

  .table-responsive .page-notification img {

    width: 130px; }

  .tab-body .page-notification .title,

  .table-responsive .page-notification .title {

    font-size: 20px;

    font-weight: 400;

    padding-bottom: 2px; }

  .tab-body .page-notification .sub-title,

  .table-responsive .page-notification .sub-title {

    font-size: 14px; }



.table-responsive .page-notification {

  padding-top: 20px;

  padding-bottom: 40px; }



.page-notification-imaged {

  text-align: center; }

  .page-notification-imaged img {

    width: 320px; }

  .page-notification-imaged .message {

    padding-top: 20px; }

  .page-notification-imaged .sub-message {

    padding-top: 0px; }



/**-------------------------------------------------------

* tab body embedded content

* -------------------------------------------------------*/

.tab-body-embedded .table-stats-cards {

  margin-bottom: 30px;

  margin-top: 5px;

  display: none; }

  .tab-body-embedded .table-stats-cards .card {

    margin-bottom: 0px; }

    .tab-body-embedded .table-stats-cards .card .card-body {

      padding-top: 5px;

      padding-bottom: 5px; }



/**-------------------------------------------------------

* icon buttons

* -------------------------------------------------------*/

.btn-add-circle {

  visibility: visible;

  border-radius: 50%;

  height: 45px;

  font-size: 19px;

  padding-top: 11px;

  box-shadow: 0 3px 15px -2px rgba(37, 45, 51, 0.4);

  transition: all ease-in .15s;

  margin-left: 4px; }



.btn-icon-circle {

  visibility: visible;

  border-radius: 50%;

  height: 45px;

  font-size: 19px;

  padding-top: 11px;

  box-shadow: 0 3px 15px -2px rgba(37, 45, 51, 0.4);

  transition: all ease-in .15s;

  margin-left: 4px; }



.btn-rounded-icon {

  padding: 0px 10px !important;

  padding-left: 8px !important;

  padding-top: 1px !important; }

  .btn-rounded-icon i {

    font-size: 15px;

    vertical-align: middle; }

  .btn-rounded-icon span {

    vertical-align: middle; }



/**-------------------------------------------------------

* default categories, primary contacts etc

* -------------------------------------------------------*/

.btn-system-default-item {

  font-size: 15px !important;

  padding-top: 1px !important;

  background-color: #f5dd10 !important;

  border-color: #f5dd10 !important; }



/**-------------------------------------------------------

* nav tabs & drop downs

* -------------------------------------------------------*/

.nav-tabs .dropdown-menu {

  margin-top: 0px; }



.dropdown-item {

  font-weight: 200;

  font-size: 14px; }



.profile-tab .nav-link.active {

  background-color: transparent; }



/**-------------------------------------------------------

* form elements - list check boxes

* -------------------------------------------------------*/

.list-checkboxes.only label {

  margin: 0px;

  padding-left: 5px !important;

  vertical-align: middle; }

  .list-checkboxes.only label:before {

    width: 7px !important;

    top: -1px !important; }

  .list-checkboxes.only label:after {

    height: 18px !important;

    width: 18px !important; }



/**-------------------------------------------------------

* form elements - small custom check boxes

* -------------------------------------------------------*/

.custom-checkbox .custom-control-input:checked ~ .custom-control-indicator {

  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E"); }



.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-indicator {

  background-color: #007bff;

  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E"); }



.custom-checkbox .custom-control-indicator {

  position: absolute;

  top: .25rem;

  left: 0;

  display: block;

  width: 1rem;

  height: 1rem;

  pointer-events: none;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  background-color: #ddd;

  background-repeat: no-repeat;

  background-position: center center;

  background-size: 50% 50%;

  border-radius: 0px;

  border: solid 1px #d9d9d9;

  top: 2px;

  background-color: transparent; }



.custom-checkbox .custom-control-input:checked ~ .custom-control-indicator {

  background-size: 9px;

  background-repeat: no-repeat;

  background-position: center;

  border-color: #20aee3;

  background-color: #20aee3; }



/**-------------------------------------------------------

* form elements

* -------------------------------------------------------*/

.temp-modal-content {

  padding-top: 150px;

  padding-bottom: 150px; }



/**-------------------------------------------------------

* company profile & user profile

* -------------------------------------------------------*/

.profile_header {

  padding-top: 20px;

  text-align: center;

  border-bottom: solid 1px #e5e5e5;

  margin-bottom: 15px; }

  .profile_header.client {

    background-color: #e6eef1;

    border-bottom: 0px; }

  .profile_header.contact {

    background-color: #20aee3;

    border-bottom: 0px; }

  .profile_header.team {

    background-color: #20aee3;

    border-bottom: 0px; }

  .profile_header img {

    max-width: 200px;

    height: auto;

    max-height: 120px; }

  .profile_header.logo-text {

    font-size: 20px; }



/**-------------------------------------------------------

* ajax tables - common | team | client

* -------------------------------------------------------*/

.project .parent-page-actions {

  height: 58px; }



/**-------------------------------------------------------

* client & project tabs

* -------------------------------------------------------*/

.client .tab-body-embedded,

.project .tab-body-embedded {

  padding-top: 0px !important; }

  .client .tab-body-embedded .profiletimeline,

  .project .tab-body-embedded .profiletimeline {

    margin-top: 40px; }

  .client .tab-body-embedded .stats-wrapper,

  .project .tab-body-embedded .stats-wrapper {

    margin-top: 30px;

    margin-bottom: 10px; }

  .client .tab-body-embedded .checkbox-actions,

  .project .tab-body-embedded .checkbox-actions {

    margin-left: auto;

    margin-right: auto;

    max-width: 97%; }



/**-------------------------------------------------------

* label outline styles

* -------------------------------------------------------*/

.btn-outline-default-light {

  color: #868e96;

  background-color: transparent;

  border: solid 1px #cccccc; }



.btn-default {

  background-color: #efefef;

  border: solid 1px #efefef; }



/**-------------------------------------------------------

* label outline styles

* -------------------------------------------------------*/

.label {

  font-weight: 600;

  padding: 5px 10px; }



.label-outline-secondary {

  color: #cccccc;

  background-color: transparent;

  border-color: #cccccc; }



.label-outline-primary {

  color: #6772e5;

  background-color: transparent;

  border-color: #6772e5; }



.label-outline-success {

  color: #24d2b5;

  background-color: #edfaee;

  border-color: #edfaee; }



.label-outline-info {

  color: #20aee3;

  background-color: #e4f1ff;

  border-color: #e4f1ff; }



.label-outline-warning {

  color: #ff9041;

  background-color: #fff4e4;

  border-color: #fff4e4; }



.label-outline-danger {

  color: #ff5c6c;

  background-color: #fcebed;

  border-color: #fcebed; }



.label-outline-red {

  color: #ff5c6c;

  background-color: #fcebed;

  border-color: #fcebed; }



.label-outline-default {

  color: #a6b5bd;

  background-color: #f5f5f5;

  border: solid 1px;

  border-color: #f5f5f5; }



.label-outline-purple {

  color: #7460ee;

  background-color: #e9e9fd;

  border: solid 1px;

  border-color: #e9e9fd; }



.btn-more {

  padding: 4px 5px 0px 5px;

  line-height: 13px;

  font-weight: 400;

  font-size: 75%; }



/**-------------------------------------------------------

* right side filter panel

* -------------------------------------------------------*/

.right-sidebar .r-panel-body {

  overflow-y: auto !important;

  overscroll-behavior: auto;

  height: 100VH;

  padding-bottom: 120px; }



/**-------------------------------------------------------

* table edges

* -------------------------------------------------------*/

.td-checkbox {

  padding-top: 15px !important;

  vertical-align: middle !important;

  padding-left: 35px !important; }

  .td-checkbox label {

    padding: 0px;

    margin: 0px;

    vertical-align: middle; }



/**-------------------------------------------------------

* table edges

* -------------------------------------------------------*/

.table .td-edge {

  position: relative; }

  .table .td-edge .td-edge-border {

    position: absolute;

    width: 2px;

    height: 90%;

    left: 0px;

    top: 2px;

    bottom: 2px; }

  .table .td-edge .list-checkboxes {

    margin-left: 12px; }

  .table .td-edge .td-edge-label {

    padding-left: 25px; }

.table .th-edge .list-checkboxes {

  margin-left: 12px; }



/**-------------------------------------------------------

* textarea

* -------------------------------------------------------*/

textarea {

  border: 1px solid rgba(0, 0, 0, 0.15);

  border-radius: .2rem;

  padding: 10px;

  color: #67757c;

  font-size: 0.9rem; }



/**-------------------------------------------------------

* list pages -check box actions

* -------------------------------------------------------*/

.checkbox-actions {

  background-color: #fbfcfd;

  padding-top: 8px;

  padding-bottom: 8px;

  margin-bottom: 10px; }

  .checkbox-actions .x-buttons button {

    font-size: 12px;

    height: 26px;

    padding: 4px 14px; }

    .checkbox-actions .x-buttons button i {

      display: inline-block;

      margin-right: 2px; }

  .checkbox-actions .x-notice {

    min-height: 58px;

    font-size: 16px;

    padding-left: 10px;

    padding-top: 34px; }



.project .checkbox-actions .x-notice,

.client .checkbox-actions .x-notice,

.lead .checkbox-actions .x-notice {

  font-size: 16px;

  padding-left: 0px;

  min-height: 53px;

  padding-top: 28px; }



/**-------------------------------------------------------

* jconfirm

* -------------------------------------------------------*/

.jconfirm .jconfirm-box .jconfirm-title {

  color: #868e96 !important;

  font-weight: 500 !important; }

.jconfirm .jconfirm-box .jconfirm-content {

  margin-top: 10px !important; }

  .jconfirm .jconfirm-box .jconfirm-content .x-details {

    font-size: 18px;

    min-height: 60px; }

.jconfirm .jconfirm-box.jconfirm-type-red {

  border-top: solid 6px #ff5c6c; }

.jconfirm .jconfirm-box.jconfirm-type-blues {

  border-top: solid 6px #20aee3; }

.jconfirm .jconfirm-box .jconfirm-buttons button {

  font-weight: initial !important;

  padding: 8px 20px !important;

  font-size: 15px !important;

  border: solid 1px !important;

  text-transform: none !important; }

  .jconfirm .jconfirm-box .jconfirm-buttons button.btn-outline-danger:hover {

    border: solid 1px #ff5c6c !important; }

  .jconfirm .jconfirm-box .jconfirm-buttons button.btn-outline-secondary:hover {

    border: solid 1px #868e96 !important; }



/**-------------------------------------------------------

* error handling

* -------------------------------------------------------*/

.permision-denied {

  padding-top: 40px;

  text-align: center; }

  .permision-denied img {

    width: 320px; }

  .permision-denied .x-message {

    padding-top: 30px; }



/**-------------------------------------------------------

* payment details

* -------------------------------------------------------*/

.payment-details td:first-child {

  width: 230px;

  background-color: #f7f7f7;

  font-weight: 400; }



/**-------------------------------------------------------

* attachements

* width: 120px

* height: 90px

* aspect: 4:3

* -------------------------------------------------------*/

.file-attachment {

  margin-bottom: 16px;

  display: flex; }

  .file-attachment .x-image {

    height: 60px;

    width: 80px;

    border-radius: 5px;

    background-size: contain;

    background-repeat: no-repeat;

    background-position: center;

    background-color: #e8edef;

    font-size: 18px;

    font-weight: 600;

    text-transform: uppercase;

    text-align: center;

    line-height: 60px; }

  .file-attachment .x-details {

    margin-left: 15px;

    font-size: 13px;

    padding-top: 0px; }

    .file-attachment .x-details .x-name {

      font-weight: 500;

      font-size: 14px; }



.delete-attachments .x-delete {

  display: block !important; }

.delete-attachments .x-actions {

  display: none !important; }



/**-------------------------------------------------------

* ticket

* -------------------------------------------------------*/

.ticket-panel {

  min-height: 300px; }

  .ticket-panel .x-top-header {

    font-size: 17px;

    padding: 14px;

    border-bottom: solid 1px #d9d9d9;

    padding-bottom: 10px;

    font-weight: 400;

    text-transform: capitalize;

    background-color: #e8eef1; }

    .ticket-panel .x-top-header h3 {

      margin-bottom: 0px; }

  .ticket-panel .x-body {

    padding: 14px 18px; }

    .ticket-panel .x-body .form-group {

      margin-bottom: 15px; }



.ticket-compose .mce-tinymce {

  width: 99.6% !important; }



.ticket .x-message .x-body {

  padding-top: 30px;

  min-height: 100px;

  padding-bottom: 40px; }

  .ticket .x-message .x-body .action-icons {

    font-size: 18px; }

    .ticket .x-message .x-body .action-icons a {

      padding-left: 7px;

      vertical-align: middle;

      color: #bcc3d3; }

      .ticket .x-message .x-body .action-icons a:hover, .ticket .x-message .x-body .action-icons a.active {

        color: #20aee3; }

      .ticket .x-message .x-body .action-icons a.danger:hover, .ticket .x-message .x-body .action-icons a.danger.active {

        color: #ff5c6c; }

.ticket .x-message .x-attachements {

  padding-top: 20px;

  border-top: solid 1px #d9d9d9; }

.ticket .comment-widgets {

  background-color: #fbfcfd; }



.ticket-panel .x-list {

  border-bottom: solid 1px #f1f1f1;

  margin-bottom: 10px;

  padding: 8px 0px; }

  .ticket-panel .x-list .x-name {

    font-size: 12px;

    text-transform: uppercase;

    font-weight: 500;

    line-height: 1.4; }

  .ticket-panel .x-list .x-details {

    font-size: 12px; }



/**-------------------------------------------------------

* overlays

* -------------------------------------------------------*/

.overlay:before {

  content: " ";

  z-index: 10;

  display: block;

  position: absolute;

  height: 100%;

  top: 0;

  left: 0;

  right: 0;

  background: rgba(70, 70, 70, 0.1); }



/**-------------------------------------------------------

* thumbs

* -------------------------------------------------------*/

.lists-table-thumb {

  height: 45px;

  width: 60px;

  border-radius: 5px;

  background-size: contain;

  background-repeat: no-repeat;

  background-position: center;

  background-color: #e8edef;

  font-size: 15px;

  font-weight: 600;

  text-transform: uppercase;

  text-align: center;

  line-height: 45px;

  color: #ff5c6c; }



.preview-image-thumb {

  width: 100%;

  height: 100%;

  display: block;

  color: inherit; }

  .preview-image-thumb:hover, .preview-image-thumb:visited, .preview-image-thumb:focus {

    color: inherit; }



/**-------------------------------------------------------

* file upload a single image

* -------------------------------------------------------*/

#fileupload_single_image .dz-preview {

  background: transparent;

  min-height: auto; }

#fileupload_single_image .dz-image {

  width: auto;

  background-color: transparent;

  height: auto; }

  #fileupload_single_image .dz-image img {

    max-width: 350px; }



/**-------------------------------------------------------

* settings

* -------------------------------------------------------*/

.settings .settings-menu .sidebar-nav ul li ul {

  padding-left: 15px; }

.settings .settings-menu .sidebar-nav ul li a {

  padding-top: 7px;

  padding-bottom: 6px; }

.settings .left-sidebar {

  padding-top: 70px;

  z-index: 20;

  background-color: #2d4356; }

  .settings .left-sidebar .sidebar-nav {

    background: #2d4356; }

  .settings .left-sidebar .sidebar-nav {

    height: 100%;

    padding-right: 10px;

    padding-top: 20px; }

    .settings .left-sidebar .sidebar-nav ul li a.active {

      color: #20aee3;

      background-color: transparent; }

  .settings .left-sidebar .exit-panel {

    margin-top: 0px;

    margin-bottom: 30px;

    border-bottom: solid 2px #20aee3; }

    .settings .left-sidebar .exit-panel a {

      padding-top: 24px !important;

      padding-bottom: 25px !important;

      vertical-align: middle; }

    .settings .left-sidebar .exit-panel i {

      margin-top: -4px;

      width: initial;

      padding-right: 10px;

      padding-left: 10px; }

  .settings .left-sidebar .sidenav-menu-item ul li a.active {

    color: #20aee3; }

.settings .navbar-header {

  background-color: #2d4356;

  font-size: 18px;

  padding-left: 20px;

  width: 200px;

  border-bottom: solid 2px;

  height: 73px;

  border-color: #20aee3; }



/**-------------------------------------------------------

* updates

* -------------------------------------------------------*/

.updates-card {

  text-align: center; }

  .updates-card img {

    width: 150px; }



/**-------------------------------------------------------

* upload avatar

* -------------------------------------------------------*/

#fileupload_avatar .dz-preview.dz-image-preview {

  border-radius: 50%; }

#fileupload_avatar .dz-image {

  height: 100px;

  width: 100px;

  border-radius: 50%; }

  #fileupload_avatar .dz-image img {

    height: 100px;

    width: 100px;

    border-radius: 50%; }

#fileupload_avatar .dz-details {

  display: none; }



/**-------------------------------------------------------

* knowledgebase

* -------------------------------------------------------*/

.kb-category {

  border-radius: 4px !important; }

  .kb-category .card-body {

    text-align: center;

    min-height: 255px; }

    .kb-category .card-body .kb-category-icon span {

      display: inline-block;

      font-size: 30px;

      border-radius: 50%;

      background-color: #e8f6ff;

      padding: 15px;

      width: 70px;

      height: 70px;

      color: #20aee3;

      margin-bottom: 18px; }

    .kb-category .card-body .btn {

      padding-right: 25px;

      padding-left: 25px; }

    .kb-category .card-body .card-text {

      font-size: 13px;

      min-height: 38px; }

    .kb-category .card-body .kb-hover-icons .btn {

      padding-right: initial;

      padding-left: initial; }

    .kb-category .card-body .kb-hover-icons.x-team {

      position: absolute;

      left: 20px;

      top: 10px;

      padding-top: 2px;

      padding-bottom: 2px; }

      .kb-category .card-body .kb-hover-icons.x-team i {

        font-size: 14px;

        display: inline-block;

        vertical-align: middle; }

    .kb-category .card-body .kb-hover-icons.x-edit {

      position: absolute;

      right: 20px;

      top: 10px; }

    .kb-category .card-body .kb-hover-icons.x-delete {

      position: absolute;

      right: 50px;

      top: 10px; }

    .kb-category .card-body .kb-hover-icons.x-default-category {

      position: absolute;

      right: 50px;

      top: 10px; }



#knowledgebase-search-field .input-group {

  width: 90%;

  margin-left: auto;

  margin-right: auto;

  margin-bottom: 50px;

  max-width: 750px;

  margin-top: 1px; }

  #knowledgebase-search-field .input-group input {

    border: none;

    padding-left: 25px; }

#knowledgebase-search-field .input-group-btn .btn {

  padding: 10px 22px; }



/**-------------------------------------------------------

* icons selector overlay

* -------------------------------------------------------*/

.icons-selector-overlay .preview {

  padding-top: 15px;

  padding-bottom: 15px;

  font-size: 24px;

  text-align: center; }

  .icons-selector-overlay .preview:hover, .icons-selector-overlay .preview.active {

    cursor: pointer;

    background-color: #e8f6ff;

    color: #20aee3; }



/**-------------------------------------------------------

* knowledgebase

* -------------------------------------------------------*/

.knowledgebase tdbody td {

  padding-top: 20px; }

.knowledgebase tdbody tr:first-child td {

  border-top: 0px; }

.knowledgebase tdbody tr:last-child td {

  border-bottom: solid 1px #d9d9d9; }



.knowledgebase-sidepanel .x-section {

  padding-bottom: 20px; }

.knowledgebase-sidepanel h4 {

  border-bottom: solid 2px #b2b2b2;

  margin-bottom: 15px;

  padding-bottom: 4px; }

.knowledgebase-sidepanel ul {

  padding: 0px; }

  .knowledgebase-sidepanel ul li {

    list-style: none;

    display: block;

    border-bottom: solid 1px #d9d9d9;

    margin-bottom: 6px; }

    .knowledgebase-sidepanel ul li a {

      display: inline-block;

      width: 100%;

      padding: 5px 0px; }

.knowledgebase-sidepanel img {

  width: 150px;

  margin-bottom: 20px; }

.knowledgebase-sidepanel .x-support {

  text-align: center; }



/**-------------------------------------------------------

* receipt

* -------------------------------------------------------*/

.receipt tr td:first-child {

  font-weight: 500;

  width: 170px; }



/**-------------------------------------------------------

* receipt

* -------------------------------------------------------*/

.actions-modal .modal-dialog {

  max-width: 500px; }

  .actions-modal .modal-dialog .modal-content .modal-body {

    padding-top: 20px; }



/**-------------------------------------------------------

* tasks

* -------------------------------------------------------*/

#tasks-list-table .task-completed .x-strike-through {

  text-decoration: line-through; }

#tasks-list-table .x-timer-time {

  font-weight: 500;

  vertical-align: middle;

  display: inline-block;

  min-width: 55px;

  background-color: whitesmoke;

  padding: 2px 6px;

  border-radius: 2px; }

#tasks-list-table .x-timer-button {

  vertical-align: middle;

  font-size: 20px;

  cursor: pointer; }

  #tasks-list-table .x-timer-button.timer-start-button {

    color: #bcc3d3; }

  #tasks-list-table .x-timer-button.timer-stop-button {

    color: #ff5c6c; }



/**-------------------------------------------------------

* tasks

* -------------------------------------------------------*/

.comments .post-comment {

  padding: 15px;

  padding-left: 23px; }

  .comments .post-comment .x-message-field {

    width: 100%;

    padding-left: 40px;

    position: relative; }

    .comments .post-comment .x-message-field textarea {

      width: 100%;

      padding: 12px;

      padding-right: 80px;

      padding-bottom: 18px; }

  .comments .post-comment .x-submit-button {

    position: absolute;

    right: 15px;

    bottom: 12px; }

  .comments .post-comment .x-close-button {

    position: absolute;

    right: 10px;

    top: 40px;

    color: #dddddd; }

.comments .page-notification {

  padding-top: 0px; }

.comments .comment-widgets .comment-row {

  padding-bottom: 15px; }

.comments .comment-text {

  padding-bottom: 0px;

  padding-top: 10px; }

  .comments .comment-text .x-name {

    font-weight: 500; }



/**-------------------------------------------------------

* hover action buttons

* -------------------------------------------------------*/

.js-hover-actions .btn-outline-secondary {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-secondary:hover, .js-hover-actions .btn-outline-secondary:active, .js-hover-actions .btn-outline-secondary:visited, .js-hover-actions .btn-outline-secondary:focus {

    color: #cccccc;

    border-color: transparent !important;

    background-color: transparent !important; }

.js-hover-actions .btn-outline-primary {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-primary:hover, .js-hover-actions .btn-outline-primary:active, .js-hover-actions .btn-outline-primary:visited, .js-hover-actions .btn-outline-primary:focus {

    color: #6772e5;

    border-color: transparent !important;

    background-color: transparent !important; }

.js-hover-actions .btn-outline-danger {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-danger:hover, .js-hover-actions .btn-outline-danger:active, .js-hover-actions .btn-outline-danger:visited, .js-hover-actions .btn-outline-danger:focus {

    color: #ff5c6c !important;

    border-color: transparent !important;

    background-color: transparent !important; }

.js-hover-actions .btn-outline-success {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-success:hover, .js-hover-actions .btn-outline-success:active, .js-hover-actions .btn-outline-success:visited, .js-hover-actions .btn-outline-success:focus {

    color: #24d2b5;

    border-color: transparent !important;

    background-color: transparent !important; }

.js-hover-actions .btn-outline-info {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-info:hover, .js-hover-actions .btn-outline-info:active, .js-hover-actions .btn-outline-info:visited, .js-hover-actions .btn-outline-info:focus {

    color: #20aee3;

    border-color: transparent !important;

    background-color: transparent !important; }

.js-hover-actions .btn-outline-warning {

  color: #bcc3d3 !important; }

  .js-hover-actions .btn-outline-warning:hover, .js-hover-actions .btn-outline-warning:active, .js-hover-actions .btn-outline-warning:visited, .js-hover-actions .btn-outline-warning:focus {

    color: #ff9041;

    border-color: transparent !important;

    background-color: transparent !important; }



/**-------------------------------------------------------

* progress bar

* -------------------------------------------------------*/

.progress-bar {

  opacity: 0.6; }



.progress {

  display: -ms-flexbox;

  display: flex;

  height: auto;

  overflow: hidden;

  line-height: 0;

  font-size: .75rem;

  background-color: #e9ecef;

  border-radius: .25rem; }



.progress-bar {

  display: -ms-flexbox;

  display: flex;

  -ms-flex-direction: column;

  flex-direction: column;

  -ms-flex-pack: center;

  justify-content: center;

  overflow: hidden;

  color: #fff;

  text-align: center;

  white-space: nowrap;

  background-color: #007bff;

  transition: width .6s ease; }



/**-------------------------------------------------------

* progress bar

* -------------------------------------------------------*/

.switch label input[type=checkbox]:checked + .lever.switch-col-light-blue {

  background-color: #74e2cf; }



/**-------------------------------------------------------

* task/lead CARD MODAL

* -------------------------------------------------------*/

@media (min-width: 992px) {

  .card-modal .col-lg-8 {

    -ms-flex: 0 0 70%;

    flex: 0 0 70%;

    max-width: 70%; }

  .card-modal .col-lg-4 {

    -ms-flex: 0 0 30%;

    flex: 0 0 30%;

    max-width: 30%; } }

.card-modal .modal-dialog {

  max-width: 868px !important; }

.card-modal .modal-content {

  padding: 0px;

  margin: 0px; }

.card-modal .modal-body {

  padding: 0px !important;

  margin-left: 0px;

  margin-right: 0px; }

  .card-modal .modal-body .form-group {

    margin-bottom: 20px; }

.card-modal .card-left-panel {

  margin: 0px;

  padding: 25px;

  padding-top: 15px;

  background-color: #fbfcfd;

  border-top-left-radius: 5px;

  border-bottom-left-radius: 5px; }

.card-modal .card-right-panel {

  margin: 0px;

  padding-top: 20px;

  padding-left: 20px;

  padding-right: 20px;

  background-color: #f6f7f9;

  border-top-right-radius: 5px;

  border-bottom-right-radius: 5px; }

  .card-modal .card-right-panel .x-section {

    margin-bottom: 30px; }

    .card-modal .card-right-panel .x-section.x-timer {

      margin-bottom: 20px;

      margin-top: -6px;

      text-align: center; }

  .card-modal .card-right-panel .x-element {

    min-height: 31px;

    border-color: #e4e8ec;

    padding: 5px;

    background-color: #e4e8ec;

    border-radius: 3px;

    font-size: 13px;

    margin-bottom: 10px;

    color: #3e4852;

    word-wrap: break-word; }

    .card-modal .card-right-panel .x-element.x-action {

      cursor: pointer; }

    .card-modal .card-right-panel .x-element.x-customer {

      text-align: center;

      color: white;

      font-weight: 500;

      background-color: #24d2b5; }

    .card-modal .card-right-panel .x-element .x-highlight {

      color: #052c54;

      font-weight: 500; }

      .card-modal .card-right-panel .x-element .x-highlight.x-editable {

        text-decoration: dotted;

        text-decoration-line: underline;

        cursor: pointer;

        display: inline-block;

        min-width: 70px; }

    .card-modal .card-right-panel .x-element i {

      font-size: 16px;

      vertical-align: middle;

      margin-bottom: -3px;

      display: inline-block;

      padding-right: 3px; }

    .card-modal .card-right-panel .x-element span {

      vertical-align: middle; }

    .card-modal .card-right-panel .x-element .table-sm {

      font-size: 12px; }

  .card-modal .card-right-panel .x-assigned-user {

    border-radius: 50%; }

    .card-modal .card-right-panel .x-assigned-user .avatar-xsmall {

      max-width: 30px;

      cursor: pointer; }

  .card-modal .card-right-panel .x-assign-new {

    border: dashed 1px #67757c;

    cursor: pointer;

    width: 30px;

    display: inline-block;

    text-align: center;

    font-size: 18px;

    vertical-align: middle;

    padding-top: 1px; }

  .card-modal .card-right-panel .x-timer-time {

    font-weight: 500;

    vertical-align: middle;

    display: inline-block;

    font-size: 24px; }

  .card-modal .card-right-panel .x-timer-button {

    vertical-align: middle;

    font-size: 24px;

    cursor: pointer; }

    .card-modal .card-right-panel .x-timer-button.timer-start-button {

      color: #bcc3d3; }

    .card-modal .card-right-panel .x-timer-button.timer-stop-button {

      color: #ff5c6c; }

  .card-modal .card-right-panel .x-form-section label {

    font-size: 13px;

    font-weight: 500;

    padding-bottom: 3px; }

  .card-modal .card-right-panel .x-form-section .form-group {

    margin-bottom: 12px; }

  .card-modal .card-right-panel .x-form-section .x-no-custom-fields {

    padding-top: 10px;

    font-weight: 200;

    text-align: center; }

.card-modal .card-left-panel .x-content {

  padding-left: 20px;

  padding-bottom: 1px; }

.card-modal .card-left-panel .x-action a {

  color: #67757c;

  text-decoration: underline;

  font-size: 10px;

  padding-left: 20px; }

.card-modal .card-left-panel .x-heading {

  font-size: 15px;

  border-bottom: solid 1px #e6e6e6;

  margin-bottom: 15px;

  font-weight: 500; }

  .card-modal .card-left-panel .x-heading i {

    padding-right: 4px;

    font-size: 20px;

    vertical-align: middle; }

.card-modal .card-left-panel .card-title {

  font-size: 20px;

  font-weight: 500; }

.card-modal .card-left-panel .card-title-edit .form-control {

  font-size: 18px !important;

  font-weight: 400;

  padding-left: 0px;

  color: #3c4448; }

.card-modal .card-left-panel .card-description {

  padding-bottom: 60px;

  padding-top: 10px; }

.card-modal .card-left-panel .card-checklist {

  padding-bottom: 55px; }

  .card-modal .card-left-panel .card-checklist .x-heading {

    border: none;

    margin-bottom: 3px; }

  .card-modal .card-left-panel .card-checklist .progress {

    margin-bottom: 15px; }

  .card-modal .card-left-panel .card-checklist .checklist-item {

    margin-bottom: 3px;

    padding: 3px;

    padding-left: 4px;

    position: relative;

    padding-right: 12px; }

    .card-modal .card-left-panel .card-checklist .checklist-item:hover {

      background-color: #efefef; }

    .card-modal .card-left-panel .card-checklist .checklist-item .checklist-label {

      display: inline; }

    .card-modal .card-left-panel .card-checklist .checklist-item .checklist-text {

      display: inline-block;

      position: relative;

      vertical-align: middle;

      padding-left: 5px;

      cursor: pointer; }

    .card-modal .card-left-panel .card-checklist .checklist-item .x-action-delete {

      position: absolute;

      right: 0px; }

  .card-modal .card-left-panel .card-checklist .copied-checklist-text {

    padding-left: 25px; }

.card-modal .card-left-panel .card-attachments {

  padding-bottom: 55px; }

  .card-modal .card-left-panel .card-attachments .x-name {

    font-size: 13px;

    font-weight: normal; }

  .card-modal .card-left-panel .card-attachments .x-meta {

    font-weight: 600; }

.card-modal .card-left-panel .card-comments {

  padding-bottom: 30px; }

  .card-modal .card-left-panel .card-comments .comment-row {

    font-size: 13px;

    background-color: #edeff1;

    margin-bottom: 10px;

    border-radius: 5px; }

    .card-modal .card-left-panel .card-comments .comment-row .comment-avatar img {

      width: 30px;

      height: 30px; }

    .card-modal .card-left-panel .card-comments .comment-row .comment-text {

      padding-left: 5px;

      padding-top: 5px;

      padding-bottom: 5px; }

      .card-modal .card-left-panel .card-comments .comment-row .comment-text .x-name {

        font-weight: 600; }

.card-modal .card-left-panel .dropzone {

  margin-left: 20px;

  margin-top: 20px; }

.card-modal .close {

  position: absolute;

  top: 10px;

  right: 10px;

  z-index: 100;

  font-size: 18px; }



/**-------------------------------------------------------

* rich text formatting

* make teat areas that have been created by tinmce to look

* as similar as possible to what users see in the text editor

* -------------------------------------------------------*/

.rich-text-formatting p {

  margin-bottom: 10px; }

.rich-text-formatting strong {

  font-weight: 600; }

.rich-text-formatting ol,

.rich-text-formatting li {

  margin: 2px 0px; }



/**-------------------------------------------------------

* card modal popovers

* -------------------------------------------------------*/

.card-popover {

  border: solid 1px #b6babd;

  width: 320px;

  border-radius: 0px;

  -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);

  box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2);

  border-color: transparent; }

  .card-popover .popover-close {

    position: absolute;

    right: 11px;

    top: 8px;

    cursor: pointer; }

  .card-popover .popover-header {

    background-color: transparent;

    margin-left: 8px;

    margin-right: 8px;

    font-size: 15px; }

  .card-popover .popover-body ul {

    padding: 0px;

    margin-left: -14px;

    margin-right: -14px; }

    .card-popover .popover-body ul li {

      list-style: none;

      padding: 5px 20px;

      cursor: pointer; }

      .card-popover .popover-body ul li:hover {

        background-color: #edeff1; }

  .card-popover .popover-body .custom-checkbox .custom-control-indicator {

    margin-top: 1px;

    width: 20px;

    height: 20px;

    border-radius: 3px; }

  .card-popover .popover-body .custom-checkbox .custom-control-description {

    padding-left: 6px; }



/**-------------------------------------------------------

* main menu scroll bars

* -------------------------------------------------------*/

.left-sidebar .ps__rail-x,

.left-sidebar .ps__rail-y {

  background-color: transparent !important; }



.mini-sidebar .left-sidebar .ps__thumb-y {

  display: none; }

.mini-sidebar .left-sidebar .ps__rail-y {

  right: 0 !important;

  left: initial !important; }



/**-------------------------------------------------------

* kanban board

* -------------------------------------------------------*/

.kanban .page-wrapper {

  padding-bottom: 10px; }

  .kanban .page-wrapper .container-fluid {

    padding-top: 94px;

    padding-bottom: 0px; }

.kanban .page-wrapper {

  padding-top: 0px; }

.kanban #projects-tab-single-screen .card {

  background-color: transparent;

  margin-bottom: 5px; }

.kanban .kanban-wrapper {

  height: 100%; }

  .kanban .kanban-wrapper .ps__rail-x,

  .kanban .kanban-wrapper .ps__rail-y {

    opacity: 0.4; }

  .kanban .kanban-wrapper .ps__thumb-y {

    width: 7px; }

  .kanban .kanban-wrapper .boards {

    position: relative;

    white-space: nowrap;

    display: block;

    height: calc(100vh - 95px);

    padding-bottom: 16px;

    overflow-x: auto;

    overflow-y: hidden; }

    .kanban .kanban-wrapper .boards .board {

      display: inline-flex;

      flex-direction: column;

      width: 280px;

      height: 100%;

      vertical-align: top;

      margin-right: 20px; }

      .kanban .kanban-wrapper .boards .board:last-child {

        margin-right: 0px; }

      .kanban .kanban-wrapper .boards .board .ps__rail-y {

        right: 2px !important; }

        .kanban .kanban-wrapper .boards .board .ps__rail-y:hover > .ps__thumb-y,

        .kanban .kanban-wrapper .boards .board .ps__rail-y .ps__rail-y:focus > .ps__thumb-y,

        .kanban .kanban-wrapper .boards .board .ps__rail-y .ps__rail-y.ps--clicking .ps__thumb-y {

          width: 7px; }

      .kanban .kanban-wrapper .boards .board .board-body {

        padding: 10px;

        padding-top: 12px;

        background-color: #ebf2f5;

        height: 100%;

        border-radius: 5px;

        border-top: 2px #67757c solid;

        overflow: hidden;

        padding-left: 0px;

        padding-right: 0px; }

        .kanban .kanban-wrapper .boards .board .board-body .board-heading {

          padding-bottom: 20px;

          font-size: 14px;

          font-weight: 500;

          padding-right: 6px;

          padding-left: 14px; }

          .kanban .kanban-wrapper .boards .board .board-body .board-heading .x-action-icons {

            font-size: 19px;

            margin-top: -4px; }

        .kanban .kanban-wrapper .boards .board .board-body .content {

          height: 100%;

          position: relative;

          overflow: auto;

          width: 100%;

          padding-left: 13px;

          padding-right: 15px;

          padding-bottom: 150px; }

        .kanban .kanban-wrapper .boards .board .board-body .autoload {

          padding-top: 10px;

          padding-bottom: 80px; }

          .kanban .kanban-wrapper .boards .board .board-body .autoload .btn {

            background-color: #ebf2f5; }

            .kanban .kanban-wrapper .boards .board .board-body .autoload .btn:hover {

              color: #6f7982 !important;

              background-color: #f4fafd;

              border-color: #b2bac1; }



/* kanban card*/

.kanban-card {

  background-color: #fbfcfd;

  padding: 10px;

  min-height: 60px;

  -webkit-box-shadow: 0px 0px 4px -1px #b3b1b3;

  -moz-box-shadow: 0px 0px 4px -1px #b3b1b3;

  box-shadow: 0px 0px 4px -1px #b3b1b3;

  border-radius: 3px;

  margin-bottom: 12px;

  font-size: 14px;

  font-weight: 500;

  cursor: pointer; }

  .kanban-card .x-title {

    padding-right: 10px;

    position: relative; }

    .kanban-card .x-title .x-action-button {

      position: absolute;

      right: -5px;

      top: -2px;

      font-size: 16px;

      cursor: pointer; }

  .kanban-card .x-meta {

    padding-top: 7px; }

    .kanban-card .x-meta span {

      font-size: 11px;

      color: #bcc3d3;

      display: block; }

    .kanban-card .x-meta strong {

      font-weight: normal;

      color: #87949a;

      font-weight: 500; }

  .kanban-card .x-footer {

    min-height: 32px; }

    .kanban-card .x-footer .x-icons {

      padding-top: 8px; }

      .kanban-card .x-footer .x-icons .x-icon {

        position: relative;

        font-size: 16px;

        padding-right: 2px; }

      .kanban-card .x-footer .x-icons .x-notification {

        display: inline-block;

        width: 4px;

        height: 4px;

        background-color: red;

        border-radius: 50%;

        position: absolute;

        top: 4px;

        right: 2px; }

    .kanban-card .x-footer .x-assigned {

      text-align: right; }

      .kanban-card .x-footer .x-assigned img {

        margin-left: -12px; }

  .kanban-card .label {

    padding: 2px 8px;

    margin-bottom: 6px; }



/* kanban board - embedded inside project page*/

.project.kanban .boards {

  height: calc(100vh - 150px); }

.project.kanban .page-titles {

  margin-bottom: 5px; }

.project.kanban .profile-tab li a.nav-link,

.project.kanban .customtab li a.nav-link {

  padding-bottom: 10px; }

.project.kanban .list-pages-crumbs {

  margin-bottom: 10px; }



/* kanban board - scroll bars */

div.kanban-content,

div.boards {

  /* Track */

  /* Handle */

  /* Handle on hover */ }

  div.kanban-content::-webkit-scrollbar,

  div.boards::-webkit-scrollbar {

    width: 9px;

    margin-right: 3px; }

  div.kanban-content::-webkit-scrollbar-track,

  div.boards::-webkit-scrollbar-track {

    background: #f1f1f1; }

  div.kanban-content::-webkit-scrollbar-thumb,

  div.boards::-webkit-scrollbar-thumb {

    background: #d7d7d7; }

  div.kanban-content::-webkit-scrollbar-thumb:hover,

  div.boards::-webkit-scrollbar-thumb:hover {

    background: #c1c1c1; }



div.boards::-webkit-scrollbar {

  height: 12px;

  margin-right: 3px; }



/**-------------------------------------------------------

* events

* -------------------------------------------------------*/

.topnav-events-container {

  min-height: 300px;

  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }



.top-nav-events {

  width: 375px !important; }

  .top-nav-events #topnav-events-container {

    padding: 10px; }



.top-nav-no-evenets {

  text-align: center;

  padding-top: 30px;

  font-size: 18px; }

  .top-nav-no-evenets img {

    width: 200px;

    padding-bottom: 20px; }



.topevent {

  padding: 10px;

  border-bottom: 1px solid rgba(120, 130, 140, 0.13); }

  .topevent .x-content {

    width: 100%;

    padding-left: 10px;

    font-size: 14px;

    color: #67757c;

    padding-bottom: 20px; }

    .topevent .x-content a {

      display: inline !important;

      padding: 0px !important;

      text-decoration: none !important;

      border-bottom: 0px !important; }

      .topevent .x-content a:hover {

        background: transparent !important;

        border-bottom: 0px !important; }

    .topevent .x-content .x-name {

      font-size: 15px;

      font-weight: 500; }

      .topevent .x-content .x-name label {

        margin-bottom: 0px;

        height: 16px; }

    .topevent .x-content .x-title {

      font-size: 14px; }

    .topevent .x-content .x-ref-title {

      font-size: 12px;

      font-weight: 400; }

    .topevent .x-content .x-description {

      font-size: 13px;

      background-color: #fbfcfd;

      padding: 6px;

      padding-left: 0px;

      padding-top: 0px; }

      .topevent .x-content .x-description p:first-child,

      .topevent .x-content .x-description p:last-child {

        margin-bottom: 0px; }

      .topevent .x-content .x-description strong {

        font-weight: 500; }

      .topevent .x-content .x-description ul li {

        visibility: visible;

        list-style-type: disc !important;

        list-style-position: inside !important;

        padding-left: 30px; }

    .topevent .x-content .x-time {

      font-size: 11px;

      font-weight: normal; }



/* ----------------------------------------------------------

 * TIMELINE

 * --------------------------------------------------------*/

.timeline {

  visibility: visible; }

  .timeline .x-meta {

    visibility: visible; }

    .timeline .x-meta a.link {

      color: #20aee3;

      font-weight: 400;

      font-size: 14px; }

  .timeline .x-title {

    font-size: 13px; }

  .timeline .x-description {

    padding: 8px;

    background-color: #f6f9fa;

    border-radius: 3px;

    margin-top: 5px; }

  .timeline .x-reference {

    visibility: visible;

    font-weight: 500; }



.project-timeline {

  position: relative;

  min-height: 884px; }



/* ----------------------------------------------------------

 * LOGIN

 * --------------------------------------------------------*/

.login.signin {

  background-image: url("/public/images/login-register.jpg"); }

.login.signup {

  background-image: url("/public/images/login-register.jpg"); }

.login.forgotpassword {

  background-image: url("/public/images/login-register.jpg"); }



.relogin {

  visibility: visible; }

  .relogin .splash-image {

    visibility: visible; }

    .relogin .splash-image img {

      visibility: visible; }

  .relogin .splash-text {

    visibility: visible; }



.logged-out {

  height: 100%; }

  .logged-out .preloader {

    top: 0px !important; }

  .logged-out body {

    background: transparent;

    min-height: 100vh;

    display: flex;

    flex-direction: column;

    background-color: #F9FAFC;

    position: relative; }

    .logged-out body #main-wrapper {

      padding-top: 30px;

      padding-bottom: 20px;

      overflow: visible; }

      .logged-out body #main-wrapper #wrapper {

        height: 100%; }

      .logged-out body #main-wrapper .login-logo {

        padding-bottom: 20px; }

      .logged-out body #main-wrapper .login-box {

        width: 400px;

        margin-left: auto;

        margin-right: auto;

        background-color: #fff;

        padding: 30px;

        z-index: 4;

        position: relative;

        box-shadow: rgba(0, 0, 0, 0.1) 0 0 10px;

        -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 0 10px;

        -moz-box-shadow: rgba(0, 0, 0, 0.1) 0 0 10px;

        border-radius: 3px; }

    .logged-out body .login-background {

      top: 0;

      left: 0;

      z-index: 2;

      height: 100%;

      width: 100%;

      overflow: hidden;

      position: fixed; }

      .logged-out body .login-background .x-left {

        position: absolute;

        bottom: -38px;

        left: 0;

        z-index: 2;

        width: 30%; }

        .logged-out body .login-background .x-left img {

          width: 100%; }

      .logged-out body .login-background .x-right {

        position: absolute;

        bottom: 10px;

        right: 0;

        z-index: -200;

        max-width: 35%; }

        .logged-out body .login-background .x-right img {

          width: 100%; }



/**-------------------------------------------------------

* ticket

* -------------------------------------------------------*/

.side-panel {

  min-height: 300px; }

  .side-panel .x-top-header {

    font-size: 17px;

    padding: 14px;

    border-bottom: solid 1px #d9d9d9;

    padding-bottom: 10px;

    font-weight: 400;

    text-transform: capitalize;

    background-color: #e8eef1; }

    .side-panel .x-top-header h3 {

      margin-bottom: 0px; }

  .side-panel .x-body {

    padding: 14px 18px;

    background-color: #fbfcfd; }

    .side-panel .x-body .form-group {

      margin-bottom: 15px; }



/**-------------------------------------------------------

* invoice

* -------------------------------------------------------*/

.invoice .invoice-wrapper,

.estimate .invoice-wrapper {

  max-width: 1000px;

  margin-left: auto;

  margin-right: auto;

  background-color: #fefefe;

  padding-left: 45px;

  padding-right: 45px;

  padding-top: 40px;

  padding-bottom: 40px; }

  .invoice .invoice-wrapper .x-company-name,

  .estimate .invoice-wrapper .x-company-name {

    font-weight: 500; }

  .invoice .invoice-wrapper .invoice-dates table tr td:first-child,

  .estimate .invoice-wrapper .invoice-dates table tr td:first-child {

    font-weight: 500; }

  .invoice .invoice-wrapper .invoice-dates table tr td:nth-child(2),

  .estimate .invoice-wrapper .invoice-dates table tr td:nth-child(2) {

    padding-left: 25px; }

    .invoice .invoice-wrapper .invoice-dates table tr td:nth-child(2) span,

    .estimate .invoice-wrapper .invoice-dates table tr td:nth-child(2) span {

      padding-left: 8px; }

  .invoice .invoice-wrapper .invoice-dues table tr td:first-child,

  .estimate .invoice-wrapper .invoice-dues table tr td:first-child {

    font-weight: 500; }

  .invoice .invoice-wrapper .invoice-dues table tr td:nth-child(2),

  .estimate .invoice-wrapper .invoice-dues table tr td:nth-child(2) {

    padding-left: 25px; }

    .invoice .invoice-wrapper .invoice-dues table tr td:nth-child(2) span,

    .estimate .invoice-wrapper .invoice-dues table tr td:nth-child(2) span {

      padding-left: 8px; }

      .invoice .invoice-wrapper .invoice-dues table tr td:nth-child(2) span .label,

      .estimate .invoice-wrapper .invoice-dues table tr td:nth-child(2) span .label {

        padding-left: 17px;

        padding-right: 17px;

        font-size: 13px;

        font-weight: 500;

        letter-spacing: 1px; }

  .invoice .invoice-wrapper .invoice-table-wrapper,

  .estimate .invoice-wrapper .invoice-table-wrapper {

    min-height: 240px; }

    .invoice .invoice-wrapper .invoice-table-wrapper.editing,

    .estimate .invoice-wrapper .invoice-table-wrapper.editing {

      min-height: 100px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th {

      border-bottom: solid 1px #e4e4e4; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-action,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-action {

        width: 15px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-description,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-description {

        min-width: 350px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-quantity,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-quantity {

        width: 130px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-unit,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-unit {

        width: 130px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-tax,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-tax {

        width: auto;

        min-width: 100px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-total,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table th.x-total {

        width: auto;

        min-width: 100px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table td,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table td {

      vertical-align: top; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-action,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-action {

        padding: 0px; }

        .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-action button,

        .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-action button {

          margin-left: -4px; }

      .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-description,

      .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table td.x-description {

        padding-right: 15px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-description,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-description {

      width: auto;

      min-width: 350px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-quantity,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-quantity {

      width: 130px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-unit,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-unit {

      width: 130px; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-tax,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-tax {

      width: auto; }

    .invoice .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-total,

    .estimate .invoice-wrapper .invoice-table-wrapper .invoice-table.editing th.x-total {

      width: auto; }

  .invoice .invoice-wrapper .invoice-item-actions,

  .estimate .invoice-wrapper .invoice-item-actions {

    padding-left: 37px;

    padding-bottom: 40px;

    padding-top: 15px; }

    .invoice .invoice-wrapper .invoice-item-actions .btn,

    .estimate .invoice-wrapper .invoice-item-actions .btn {

      margin-right: 6px; }

      .invoice .invoice-wrapper .invoice-item-actions .btn:hover, .invoice .invoice-wrapper .invoice-item-actions .btn:active, .invoice .invoice-wrapper .invoice-item-actions .btn:focus,

      .estimate .invoice-wrapper .invoice-item-actions .btn:hover,

      .estimate .invoice-wrapper .invoice-item-actions .btn:active,

      .estimate .invoice-wrapper .invoice-item-actions .btn:focus {

        background-color: #ff5f6f !important;

        color: #ffffff !important;

        border-color: #ff5f6f !important; }

        .invoice .invoice-wrapper .invoice-item-actions .btn:hover i, .invoice .invoice-wrapper .invoice-item-actions .btn:active i, .invoice .invoice-wrapper .invoice-item-actions .btn:focus i,

        .estimate .invoice-wrapper .invoice-item-actions .btn:hover i,

        .estimate .invoice-wrapper .invoice-item-actions .btn:active i,

        .estimate .invoice-wrapper .invoice-item-actions .btn:focus i {

          color: #ffffff !important; }

  .invoice .invoice-wrapper .invoice-total-table,

  .estimate .invoice-wrapper .invoice-total-table {

    font-size: 16px; }

    .invoice .invoice-wrapper .invoice-total-table tr td,

    .estimate .invoice-wrapper .invoice-total-table tr td {

      padding-bottom: 3px;

      padding-top: 3px; }

      .invoice .invoice-wrapper .invoice-total-table tr td:nth-child(1),

      .estimate .invoice-wrapper .invoice-total-table tr td:nth-child(1) {

        font-weight: 400; }

      .invoice .invoice-wrapper .invoice-total-table tr td:nth-child(2),

      .estimate .invoice-wrapper .invoice-total-table tr td:nth-child(2) {

        min-width: 110px;

        padding-left: 15px; }

      .invoice .invoice-wrapper .invoice-total-table tr td .x-small,

      .estimate .invoice-wrapper .invoice-total-table tr td .x-small {

        font-size: 12px; }

    .invoice .invoice-wrapper .invoice-total-table tr#billing-sums-total-container td,

    .estimate .invoice-wrapper .invoice-total-table tr#billing-sums-total-container td {

      font-size: 20px;

      font-weight: 500 !important;

      border-top: solid 1px #e4e4e4; }

  .invoice .invoice-wrapper .invoice-pay,

  .estimate .invoice-wrapper .invoice-pay {

    text-align: left; }

    .invoice .invoice-wrapper .invoice-pay .x-title,

    .estimate .invoice-wrapper .invoice-pay .x-title {

      font-size: 18px;

      font-weight: 600;

      padding-bottom: 8px; }

    .invoice .invoice-wrapper .invoice-pay .x-options,

    .estimate .invoice-wrapper .invoice-pay .x-options {

      padding-bottom: 8px; }

    .invoice .invoice-wrapper .invoice-pay .gateway-bank-details,

    .estimate .invoice-wrapper .invoice-pay .gateway-bank-details {

      background-color: #f6f9fa;

      padding-left: 20px;

      padding-right: 20px;

      border-radius: 6px; }

.invoice .modal-body #payments-table-wrapper,

.estimate .modal-body #payments-table-wrapper {

  margin-top: -30px;

  margin-bottom: 0px; }



/**-------------------------------------------------------

* items modal on invoice page

* -------------------------------------------------------*/

#itemsModal #items-table-wrapper {

  margin-bottom: 0px; }

  #itemsModal #items-table-wrapper .items_col_title,

  #itemsModal #items-table-wrapper .items_col_description {

    width: 240px;

    max-width: 240px;

    white-space: normal; }



.invoice-billing-footer {

  min-height: 53px; }



/**-------------------------------------------------------

* infomation alerts

* -------------------------------------------------------*/

.alert-info {

  border-left: solid 4px #bee5eb;

  background-color: #fff;

  border-radius: 4px; }



.alert-danger {

  border-left: solid 4px #f5c6cb;

  background-color: #fff;

  border-radius: 4px; }



.alert-success {

  border-left: solid 4px #c3e6cb;

  background-color: #fff;

  border-radius: 4px; }



.alert-warning {

  border-left: solid 4px #ffeeba;

  background-color: #fff;

  border-radius: 4px; }



/**-------------------------------------------------------

* inline fixes

* -------------------------------------------------------*/

/* ----------------------------------------------------------

 * fixing inline stylig

 * --------------------------------------------------------*/

#reloginModalBody {

  min-height: 200px; }



#fx-line-item-hrs {

  width: 50px;

  font-size: 12px !important; }



#fx-line-item-min {

  width: 50px;

  font-size: 12px !important; }



#fx-estimate-date-lang,

#fx-estimate-date-lang,

#fx-payments-date-lang {

  height: 35px; }



#expensesModalBody,

#timebillingModalBody,

#taxesModalBody,

#itemsModalBody {

  min-height: 200px; }



#x-client-dynamic-card {

  min-height: 300px; }



#fx-client-left-panel-invoices {

  width: 55%; }



#fx-client-misc-topnave-files {

  position: absolute;

  transform: translate3d(0px, 39px, 0px);

  top: 0px;

  left: 0px;

  will-change: transform; }



#fx-client-misc-topnave-billing {

  position: absolute;

  transform: translate3d(0px, 39px, 0px);

  top: 0px;

  left: 0px;

  will-change: transform; }



.file-upload-box {

  background-color: #f7f7f7; }



#fx-settings-roles-th-1 {

  text-align: center;

  border: solid 1px #f3f1f1;

  min-width: 200px; }



#fx-expenses-td-money {

  font-size: 18px;

  background-color: #f7f6f6; }



#fx-expenses-td-amount {

  background-color: #f7f6f6; }



#fx-top-nav-mark-read {

  margin-top: -3px;

  padding-left: 4px; }



#fx-expenses-files-attached {

  list-style: none;

  display: inline-block;

  padding-bottom: 8px; }



.projects_col_progress {

  width: 120px; }



#actionsModalBody {

  min-height: 120px;

  padding-bottom: 40px; }



#leadsWidget {

  height: 260px;

  width: 100%; }



.fx-info-tool-tip {

  display: inline-flex;

  align-items: center;

  height: 100%;

  padding-left: 10px; }



#fx-topnav-dropdown {

  position: absolute;

  transform: translate3d(0px, 39px, 0px);

  top: 0px;

  left: 0px;

  will-change: transform; }



#fx-settings-cronjob-instructions {

  font-weight: 500;

  margin-bottom: 20px;

  background-color: #ebf1f3;

  padding: 8px; }



#fx-settings-email-templates-side {

  background-color: #f6f9fa;

  padding: 20px;

  margin-top: 32px;

  height: 100%; }



#fx-settings-emailtemplates-dropdown {

  display: block;

  padding-top: 20px;

  width: 300px;

  text-align: left; }



#fx-settings-kb-icon-wrapper {

  background-color: #f3f3f3;

  padding: 5px;

  font-size: 30px;

  text-align: center;

  cursor: pointer; }



.settings-leads-modal-color-select {

  display: inline-block;

  width: 140px;

  border-radius: 12px;

  height: 19px;

  margin-top: 2px; }



#fx-settimgs-leads-status {

  display: inline-block;

  width: 70px;

  border-radius: 12px;

  height: 19px;

  margin-top: 2px; }



.fx-settings-logo-card {

  background-color: #fbfcfd; }



.fx-fake-login {

  overflow: hidden;

  max-width: 0px;

  max-height: 0px; }



.fx-kaban-sorting-dropdown {

  min-width: 180px; }



.fx-kaban-sorting-dropdown-container {

  padding-left: 15px;

  border-bottom: solid 1px #eeeff0;

  font-size: 14px;

  font-weight: 500;

  color: #7d7d7d;

  padding-bottom: 4px; }



#fx-page-actions-add-button {

  display: inline-block;

  -webkit-appearance: initial; }



/**-------------------------------------------------------

* setup

* -------------------------------------------------------*/

.setup-prechecks {

  background-color: #f1f0ff !important; }

  .setup-prechecks .x-wrapper {

    width: 700px;

    margin-left: auto;

    margin-right: auto; }



.setup {

  background-color: #f1f0ff !important; }

  .setup #main-wrapper {

    padding-top: 0px !important; }

  .setup .setup-welcome .x-image {

    text-align: center;

    padding-top: 70px;

    padding-bottom: 10px; }

    .setup .setup-welcome .x-image img {

      width: 200px; }

  .setup .setup-welcome .x-title {

    text-align: center; }

  .setup .setup-welcome .x-subtitle {

    text-align: center;

    padding-bottom: 40px; }

  .setup .setup-welcome .x-button {

    width: 300px;

    margin-left: auto;

    margin-right: auto; }

  .setup .setup-header .x-logo {

    text-align: center;

    padding-bottom: 15px; }

  .setup .setup-header .x-title {

    text-align: center;

    font-size: 22px;

    font-weight: 500; }

  .setup .setup-wrapper {

    width: 900px;

    margin-top: 20px;

    margin-left: auto;

    margin-right: auto;

    background-color: #fff;

    padding: 30px 50px;

    border-radius: 5px;

    min-height: 400px;

    -webkit-box-shadow: 0px 3px 5px 2px #cacbcc;

    -moz-box-shadow: 0px 3px 5px 2px #cacbcc;

    box-shadow: 0px 3px 5px 2px #cacbcc;

    margin-bottom: 40px;

    padding-bottom: 40px; }

    .setup .setup-wrapper .setup-progress .steps {

      padding-right: 0px; }

      .setup .setup-wrapper .setup-progress .steps .x-step {

        font-size: 15px;

        width: 30px;

        height: 30px;

        border-radius: 50%;

        line-height: 30px;

        font-weight: 600;

        text-align: center;

        float: left;

        border: solid 1px #ddddde;

        color: #ddddde; }

        .setup .setup-wrapper .setup-progress .steps .x-step.active-running {

          background-color: #fff;

          border-color: #20aee3;

          color: #20aee3; }

        .setup .setup-wrapper .setup-progress .steps .x-step.active-passed {

          background-color: #20aee3;

          border-color: #20aee3;

          color: #fff; }

        .setup .setup-wrapper .setup-progress .steps .x-step.active-failed {

          background-color: #ff5c6c;

          border-color: #ff5c6c;

          color: #fff; }

      .setup .setup-wrapper .setup-progress .steps .x-line {

        margin-top: 11px;

        border-top: solid 1px #ddddde;

        float: left;

        width: calc(100% - 40px);

        margin-left: 10px;

        font-size: 12px; }

    .setup .setup-wrapper .setup-content table td {

      font-size: 13px;

      padding-top: 9px;

      padding-bottom: 9px; }

    .setup .setup-wrapper .setup-inner-steps {

      padding-top: 50px; }

    .setup .setup-wrapper .setup-requirements .x-td-checks {

      width: 100px;

      text-align: center; }

      .setup .setup-wrapper .setup-requirements .x-td-checks .x-checks {

        display: inline-block;

        border-radius: 50%;

        text-align: center;

        font-size: 18px; }

        .setup .setup-wrapper .setup-requirements .x-td-checks .x-checks.x-check-passed {

          border-color: #20aee3;

          color: #20aee3; }

        .setup .setup-wrapper .setup-requirements .x-td-checks .x-checks.x-check-failed {

          border-color: #ff5c6c;

          color: #ff5c6c; }



/*******************

 Charts Income vs Expenses

*******************/

.incomeexpenses {

  position: relative;

  height: 250px; }

  .incomeexpenses .ct-series-a .ct-area {

    fill: #24d2b5;

    opacity: 0.5; }

  .incomeexpenses .ct-series-a .ct-line,

  .incomeexpenses .ct-series-a .ct-point {

    stroke: #24d2b5;

    stroke-width: 2px; }

  .incomeexpenses .ct-series-b .ct-area {

    fill: #20aee3;

    fill-opacity: 0.2; }

  .incomeexpenses .ct-series-b .ct-line,

  .incomeexpenses .ct-series-b .ct-point {

    stroke: #20aee3;

    stroke-width: 2px; }

  .incomeexpenses .ct-series-a .ct-point,

  .incomeexpenses .ct-series-b .ct-point {

    stroke-width: 6px; }



/* ----------------------------------------------------------

 * RESPONSIVENESS - LEFT MAIN MENU

 * --------------------------------------------------------*/

.dashboard-projects-admin {

  height: auto;

  padding-bottom: 20px; }

  .dashboard-projects-admin a {

    padding: 15px !important; }

    .dashboard-projects-admin a .btn-circle {

      padding-left: 3px !important;

      padding-right: 3px !important;

      font-weight: 600 !important; }

    .dashboard-projects-admin a:hover {

      background-color: transparent; }



.dashboard-events {

  height: 400px;

  padding-left: 60px;

  z-index: 0;

  margin-left: 10px;

  border: 0px; }



.dashboard-projects {

  height: 400px; }



/* ----------------------------------------------------------

 * LEFT MENU TOOLTIPS

 * --------------------------------------------------------*/

.mini-sidebar .menu-tooltips {

  opacity: 1 !important; }

  .mini-sidebar .menu-tooltips .tooltip-inner {

    background-color: #ffff;

    -webkit-box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;

    box-shadow: 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12), 0 5px 5px -3px rgba(0, 0, 0, 0.2) !important;

    color: #8d97ad;

    font-size: 12px;

    padding: 8px 20px; }

  .mini-sidebar .menu-tooltips .arrow:before {

    content: "";

    position: absolute;

    width: 15px;

    height: 15px;

    background: #fff;

    border-radius: 3px;

    transform: rotate(43deg) skewY(5deg);

    top: -2px;

    z-index: 1;

    left: 0px;

    border: 0px !important;

    opacity: 1; }



/* ----------------------------------------------------------

 * RESPONSIVENESS - LEFT MAIN MENU

 * --------------------------------------------------------*/

@media (max-width: 767px) {

  .sidenav-menu-item {

    border-bottom: 1px solid rgba(120, 130, 140, 0.13); }



  .settings .left-sidebar {

    padding-top: 0px; }

  .settings .top-navbar .navbar-header {

    background-color: white;

    border-bottom: 0px; }

    .settings .top-navbar .navbar-header .exit-panel {

      height: 73px; }

      .settings .top-navbar .navbar-header .exit-panel a {

        font-size: 14px;

        font-weight: 500; } }

/* ----------------------------------------------------------

 * BLINKING TEXT

 * --------------------------------------------------------*/

.panel-label {

  font-size: 13px;

  font-weight: 500;

  color: #838894 !important; }



/* ----------------------------------------------------------

 * BLINKING TEXT

 * --------------------------------------------------------*/

.timer-running {

  color: #ff5c6c; }

  .timer-running .timer-deliminator {

    animation: blinkingTimer 1.2s infinite; }



@keyframes blinkingTimer {

  0% {

    color: #ff5c6c; }

  49% {

    color: #ff5c6c; }

  60% {

    color: transparent; }

  99% {

    color: transparent; }

  100% {

    color: #ff5c6c; } }

.fade:not(.show) {

  opacity: 0;

  display: none; }



/* ----------------------------------------------------------

 * editor on project details page

 * --------------------------------------------------------*/

#project-details-container .mce-tinymce {

  margin-top: 20px; }



/* ----------------------------------------------------------

 * general splash messae

 * --------------------------------------------------------*/

.splash-message .splash-image {

  text-align: center;

  padding-bottom: 20px; }

  .splash-message .splash-image img {

    width: 150px; }

.splash-message .splash-text {

  font-size: 18px;

  text-align: center;

  padding-bottom: 10px;

  font-weight: 400;

  padding-left: 15px; }

.splash-message .splash-subtext {

  font-size: 13px;

  text-align: center;

  padding-bottom: 10px;

  font-weight: 400;

  padding-left: 15px; }



/* ----------------------------------------------------------

 * envato remove iframe button

 * --------------------------------------------------------*/

.envato-demo-iframe-buttom {

  position: absolute;

  left: 43%;

  top: 0px;

  background-color: #f84355;

  color: white;

  padding: 3px 15px;

  border-bottom-left-radius: 15px;

  border-bottom-right-radius: 15px;

  font-size: 12px;

  font-weight: 400;

  cursor: pointer; }



/* ----------------------------------------------------------

 * languagedrop drop down

 * --------------------------------------------------------*/

.language {

  width: 350px; }



/* ----------------------------------------------------------

 * subscriptions

 * --------------------------------------------------------*/

.subscription-summary .subscription-header {

  background-color: #e6eef1;

  padding: 10px 10px;

  text-align: center; }

  .subscription-summary .subscription-header .x-plan {

    font-size: 24px; }

  .subscription-summary .subscription-header .x-cycle {

    font-size: 15px;

    font-weight: 500; }

.subscription-summary .subscription-body {

  padding: 14px 18px; }

  .subscription-summary .subscription-body .x-each-item {

    border-bottom: solid 1px #f1f1f1;

    margin-bottom: 10px;

    padding: 8px 0px; }

    .subscription-summary .subscription-body .x-each-item .x-title {

      text-align: left; }

    .subscription-summary .subscription-body .x-each-item .x-content {

      text-align: left; }



.subscription-details .subscription-payments .x-heading {

  margin-bottom: 20px;

  font-size: 20px;

  font-weight: 400; }

.subscription-details .subscription-history {

  background-color: #fbfcfd;

  margin-bottom: 14px;

  font-size: 14px; }

  .subscription-details .subscription-history td {

    border: 0px; }

  .subscription-details .subscription-history i {

    font-size: 16px;

    vertical-align: middle; }

  .subscription-details .subscription-history span {

    vertical-align: middle; }

  .subscription-details .subscription-history .list-table-action {

    font-size: initial;

    margin-top: -2px; }

    .subscription-details .subscription-history .list-table-action .subscription-invoice-button {

      padding-top: 0px; }

      .subscription-details .subscription-history .list-table-action .subscription-invoice-button i {

        font-size: 18px; }



.subscription-pay-now {

  text-align: center; }

  .subscription-pay-now .x-splash img {

    width: 180px; }

  .subscription-pay-now .x-plan {

    font-size: 26px;

    font-weight: 400;

    padding-top: 10px; }

  .subscription-pay-now .x-price {

    font-size: 20px;

    padding-top: 10px;

    padding-bottom: 20px; }

  .subscription-pay-now .x-cards img {

    width: 200px;

    padding-top: 30px; }



.subscription-alert {

  text-align: center;

  background-color: #fcebed;

  padding: 20px 30px;

  border-radius: 5px;

  margin-bottom: 30px;

  margin-bottom: 30px; }

  .subscription-alert .x-title {

    font-size: 20px;

    padding-bottom: 12px; }



@media (max-width: 767px) {

  .subscription-history {

    padding-left: 25px !important;

    padding-right: 25px !important; }

    .subscription-history .x-item {

      padding-bottom: 6px; } }

.custom-fields-panel-edit .x-element .x-each {

  padding: 4px; }

  .custom-fields-panel-edit .x-element .x-each .x-title {

    font-size: 11px; }

  .custom-fields-panel-edit .x-element .x-each .x-content {

    font-size: 13px; }



/*# sourceMappingURL=style.css.map */

