
html, body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: roboto;
    font-size: 14px;
    color: #898E95;
    line-height: 1.5;
  /*  background-color: #f5f5f5;
    background-image: url(../images/theme/flag1.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    background-size: 100% 100%;*/
}

.btn-sm { font-size:13px;padding:2px 8px; }


strong, .strong, label { font-weight:500; color: #1B2432; }
.black{ color:#1B2432;}
.red{ color:#ff0000!important;}
.blue{color:#4285f4;}

.no-padding { padding:0;}
.no-padding-top{ padding-top:0;}
.no-padding-bottom{ padding-bottom:0;}

.pad10{padding:10px;}
.pad-top-bottom10{padding-top:10px;padding-bottom:10px;}
.pad-left-right10{padding-left:10px;padding-right:10px;}
.pad-left10{padding-left:10px;}
.pad-right10{padding-right:10px;}
.pad-top10{padding-top:10px;}
.pad-bottom10{padding-bottom:10px;}

.pad15{padding:15px;}
.pad-top-bottom15{padding-top:15px;padding-bottom:15px;}
.pad-left-right15{padding-left:15px;padding-right:15px;}
.pad-left15{padding-left:15px;}
.pad-right15{padding-right:15px;}
.pad-top15{padding-top:15px;}
.pad-bottom15{padding-bottom:15px;}

.pad20{padding:20px;}
.pad-top-bottom20{padding-top:20px;padding-bottom:20px;}
.pad-left-right20{padding-left:20px;padding-right:20px;}
.pad-left20{padding-left:20px;}
.pad-right20{padding-right:20px;}
.pad-top20{padding-top:20px;}
.pad-bottom20{padding-bottom:20px;}

.pad25{padding:25px;}


.bdr{border: 1px solid #E1E2E4;}
.bdrtop{border-top: 1px solid #E1E2E4;}
.bdrbottom{border-bottom: 1px solid #E1E2E4;}
.bdrtopbottom{border-top: 1px solid #E1E2E4;border-bottom: 1px solid #E1E2E4;}

.marbtm0{ margin-bottom:0!important;}
.marbtm10{ margin-bottom:10px;}
.marbtm20{ margin-bottom:20px;}

.relative { position:relative;}


.text-capitalize {
    text-transform: capitalize;
}



::-webkit-scrollbar{
    width:8px; height: 8px;
}
::-webkit-scrollbar-track
{
    background-color: rgba(0, 0, 0, 0.25);
    border-left:1px solid #ccc;
}
::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.5);
}
::-webkit-scrollbar-thumb:hover{
  background-color: #008080;
}



fieldset {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid #e5e5e5;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
legend {
    font-weight: 600;
    color: #29166f;
    font-size: 100%;
    width: auto;
    padding: 0 10px;
    border: 0;
    margin: 0 0 0 15px;
}



/******************************************
            Menu
******************************************/
#header{
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 99;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.topmenu{ /*background: #009DDC;#FC7700*/ background:#138808;   display: flex; width:100%;}

#header .header-left{
    max-width:40%;
    flex:0 0 40%;
}
#header .header-center {
    text-align: center;
    margin: auto;

}
#header .header-center p {
    margin:0;
    color: white;
    font-weight: 600;
    font-size: 18px;
}
#header .header-right {
    max-width: 30%;
    flex: 0 0 30%;
}

.top-header{display:table;width: 100%;}

#header .header-right > ul{ margin:0; float: right;}
#header .header-right > ul > li{ list-style-type:none; float: left;}


#header .header-right > ul > li > a{ padding: 0px 10px; line-height: 40px; height: 40px; color:#fff;    display: block;}
#header .header-right > ul > li > a > i{ font-size: 18px; line-height: 44px;}
#header .header-right li > a .label{
    position: absolute;
    top: 5px; right: 4px;
    text-align: center;
    font-size: 9px;
    padding: 3px 4px;
    line-height: .9;
    border-radius: 100%;
}
#header .header-right li.dropdown img {
    width: 30px;
    height: 30px;
    border-radius: 30px;
    margin-right: 5px;
}
#header .header-right li.dropdown .profile-info {
    display: inline-block;
    vertical-align: middle;
    padding: 0 15px 0 0px;
    line-height: 15px;
    text-transform: capitalize;
}
#header .header-right li.dropdown > a.dropdown-arrow:after {
    content: "\f107";
    position: absolute;
    *margin-right: .3em;
    right: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    font-family: FontAwesome;
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit;
    -webkit-font-smoothing: antialiased;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#header .header-right li.dropdown.open > a.dropdown-arrow:after {
    top: 50%;
    -webkit-transform: rotate(180deg) translateY(50%);
    -ms-transform: rotate(180deg) translateY(50%);
    -o-transform: rotate(180deg) translateY(50%);
    transform: rotate(180deg) translateY(50%);
}

.dropdown-menu>li hr {
    margin: 5px 0;
}
.dropdown-menu>li>a i {
    margin-right: 8px;
}
.dropdown-menu {
    background: #fff;
    border: 1px solid #ccc;
    color: #000; margin-top:1px;
    border-radius: 0;
    -webkit-box-shadow: 0 2px 10px rgba(0,0,0,.2);
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
    -webkit-animation: slide-down 0.3s ease-out;
    -moz-animation: slide-down 0.3s ease-out;
    -ms-animation: slide-down 0.3s ease-out;
    -o-animation: slide-down 0.3s ease-out;
     animation: slide-down 0.3s ease-out;
}
.dropdown-menu.rightside {
    left: inherit;
    right: 0px;
}
/*.dropdown-menu.rightside:before
{
    content: "";
    border-bottom-color: #FBFBFB!important;
    border: 7px solid transparent;
    border-top: 0;
    position: absolute;
    right: 51px;
    top: -7px;
    z-index: 1;
}
.dropdown-menu.rightside:after
{
    content: "";
    border-bottom-color: #ddd!important;
    border: 9px solid transparent;
    border-top: 0;
    position: absolute;
    right: 49px;
    top: -9px;
}*/

#header .header-right .dropdown-menu>li>a { padding: 8px 20px; }

#header .header-right > ul > li:last-child{border-left: 1px solid #fff; margin-left: 10px;}
#header .header-right > ul > li:last-child a{padding-left: 15px; padding-right: 15px;}

.dropdown-menu.longwidth {
    width:280px;
}
.dropdown-menu.longwidth ul {
    list-style-type:none;
    padding:0;
}
.dropdown-menu.longwidth ul > li > a {
    padding:8px;
    display:block;
    border-bottom: 1px solid rgb(244, 244, 244);
}
.dropdown-menu.longwidth ul > li > a:hover{
    background-color:#f5f5f5;
    color:#1B2432;
}
.dropdown-menu.longwidth ul > li:last-child > a{
    border:0;
}

.dropdown-menu.longwidth li.header {
    padding: 7px 10px; text-align:center;
    border-bottom: 1px solid rgb(244, 244, 244);
}
.dropdown-menu.longwidth li.footer {
    text-align:center;
    border-top: 1px solid rgb(244, 244, 244);
}

div#overlay {
	display: none;
}

a#toggle 
{
    display: none;
    position: absolute;
    top: 12px; left: 8px;
    text-align: center;
    color: #ef8714;
    -webkit-transition: all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -ms-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}
a#toggle i {
	position: relative;
	top: 50%;
	-webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
	line-height: 35px;
}

.bar1, .bar2, .bar3 {
    width: 25px;
    height: 3px;
    background-color: #fff;
    -webkit-transition: all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -ms-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}
.bar2{ margin: 5px 0;}

.change .bar1 {
    -webkit-transform: rotate(-45deg) translate(-7px, 5px) ;
    transform: rotate(-45deg) translate(-7px, 5px) ;
}

.change .bar2 {opacity: 0;}

.change .bar3 {
    -webkit-transform: rotate(45deg) translate(-8px, -8px) ;
    transform: rotate(45deg) translate(-8px, -8px) ;
}

#menu
{
	-webkit-transition: all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -ms-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}
#menu a {}
#menu ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
    display: flex;
}
#menu > ul > li:nth-child(1){
    order:1;
}
#menu > ul > li:nth-child(2) {
    order: 2;
}
/*#menu > ul > li:nth-child(3) {
    order: 4;
}*/
#menu > ul > li:nth-child(4) {
    order: 3;
}
#menu > ul > li {
	float: left;
	position: relative;
	
}
#menu > ul > li > a {
    display: inline-block;
    padding: 10px 10px;
    text-decoration: none;
    color: #fff;
}
#menu > ul > li > a:hover{color: #fff;}
#menu > ul > li > a:before {
    /*background-color: rgba(255, 255, 255, 0.1);
    content: "";
    height: 100%;
    right: 0;
    position: absolute;
    top: 0;
    -webkit-transform: skew(-25deg);
    -moz-transform: skew(-25deg);
    -ms-transform: skew(-25deg);
    -o-transform: skew(-25deg);
    transform: skew(-25deg);
    width: 1px;*/
}
#menu > ul > li:hover:after{
	opacity: 1;
    width: 100%;
}
#menu > ul > li:after{
	content: "";
    position: absolute;
    width: 0%;
    -webkit-transform: translateX(-50%);
    -moz-transform:translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 3px;
    bottom: -0px;
    left: 50%;
    opacity: 0;
	background:#fff;
	-webkit-transition: all 300ms;
    -moz-transition: all 300ms;
    -ms-transition: all 300ms;
    -o-transition: all 300ms;
    transition: all 300ms;
	
}
#menu > ul > li > a > i, #menu > ul > li > ul > li > a > i {
	margin-left: 7px;
	-webkit-transition:all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -ms-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}
#menu ul li ul {
	display: block;
	position: absolute;
	top: 100%;
	left: 0px;
	min-width: 150px;
    max-width: 500px;
    z-index: 9999;
    text-align: left;
    white-space: nowrap;
	z-index:9999;
	text-align: left;
	box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
	visibility: hidden;
	opacity: 0;
	-webkit-transition:opacity 0.35s, -webkit-transform 0.35s;
    -moz-transition: opacity 0.35s, -webkit-transform 0.35s;
    -ms-transition: opacity 0.35s, -webkit-transform 0.35s;
    -o-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, -webkit-transform 0.35s;
	
	-webkit-transform: translate3d(0, -15px, 0);
    -moz-transform: translate3d(0, -15px, 0);
    -ms-transform: translate3d(0, -15px, 0);
    -o-transform: translate3d(0, -15px, 0);
    transform: translate3d(0, -15px, 0);
	
}

#menu ul li:hover>ul {
	display: block;
	visibility: visible;
	
	-webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
	opacity: 1;
}


#menu ul li ul ul{left: 100%; top: 0;}
#menu ul li ul li {
	display: block;
}
#menu ul li ul li a {
    display: block;
    padding: 7px 10px;
    text-decoration: none;
    background: #fff;
    color: #1B2432;
    border-bottom: 1px solid #eee;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
}
#menu ul li ul li a:hover {
	background-color: #f3f3f3;
}

#menu ul li:hover > a > i {
    -webkit-transform: rotateZ(180deg);
    -moz-transform: rotateZ(180deg);
    -ms-transform: rotateZ(180deg);
    -o-transform: rotateZ(180deg);
    transform: rotateZ(180deg);
}

@media screen and (max-width: 990px) {
    
    #menu {
	    position: fixed;
	    width: 250px;
	    height: 100%;
	    top: 0;
	    left: 0;
	    overflow: hidden;
	    overflow-y: auto;
	    background-color: #fff;
	    
        -webkit-transform: translateX(-250px);
        -moz-transform: translateX(-250px);
        -ms-transform: translateX(-250px);
        -o-transform: translateX(-250px);
        transform: translateX(-250px);
    }
    #menu ul {
	    text-align: left;
	    background-color: transparent;
    }
    #menu ul li {
	    display: block;
	    float: none;
    }
    #menu ul li a {
	    display: block;
	    color: #1B2432;
    }
    #menu ul li ul li a {
        padding-left: 25px;
    }
    #menu ul li ul li ul li a {
        padding-left: 40px;
    }
    #menu ul li a:hover{ background:#f3f3f3;color: #1B2432;}
    #menu > ul > li > a:before, #menu > ul > li:after{ display:none;}
    #menu ul li a > i {
	    float: right;
    }
    #menu ul li ul {
	    display: none;
	    position: static;
	    width: 100%;
	    white-space:inherit;
	    background-color: rgba(22,160,133, 0.2);
	    border:0;
	    box-shadow: none;
	    visibility:visible;
	    opacity: 10;
	    -webkit-transition: none;
        -moz-transition: none;
        -ms-transition: none;
        -o-transition: none;
	    transition: none;
	    -webkit-transform: inherit!important;
	    -moz-transform: inherit!important;
	    -ms-transform: inherit!important;
	    -o-transform: inherit!important;
	    transform: inherit!important;
    }
    
    #menu ul li:hover>ul {
	    visibility: visible;
	    -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
	    transform: none;
	    opacity: 10;
	    display: none;
    }
    #menu ul li:hover > a > i 
    {
        -webkit-transform: rotateZ(0);
        -moz-transform: rotateZ(0);
        -ms-transform: rotateZ(0);
        -o-transform: rotateZ(0);
	    transform: rotateZ(0);
    }
    #menu ul li.open > a {
	    background-color: #008080!important;
	    color:#fff;
    }
    #menu ul li.open > a > i 
    {
        -webkit-transform: rotateZ(-90deg);
        -moz-transform: rotateZ(-90deg);
        -ms-transform: rotateZ(-90deg);
        -o-transform: rotateZ(-90deg);
	    transform: rotateZ(-90deg);
    }
    #menu ul li.open > ul {
	    display: block;
    }
    div#overlay {
	    display: block;
	    visibility: hidden;
	    position: fixed;
	    left: 0;
	    top: 0;
	    width: 100%;
	    height: 100%;
	    background-color: rgba(0, 0, 0, 0.8);
	    z-index: 99;
	    opacity: 0;
	    
	    -webkit-transition: all ease-out 0.3s;
        -moz-transition: all ease-out 0.3s;
        -ms-transition: all ease-out 0.3s;
        -o-transition: all ease-out 0.3s;
	    transition: all ease-out 0.3s;
    }
    html.open-menu {
	    overflow: hidden;
    }
    html.open-menu div#overlay {
	    visibility: visible;
	    opacity: 1;
	    /*width: calc(-150%);
	    left: 250px;*/
    }
    html.open-menu a#toggle{
	    -webkit-transform: translateX(250px);
        -moz-transform: translateX(250px);
        -ms-transform: translateX(250px);
        -o-transform: translateX(250px);
	    transform: translateX(250px);
    }
    
    a#toggle {
	    display: block;
	    z-index: 1000;
    }
    /*html.open-menu a#toggle {
	    position: relative;
    }*/
    html.open-menu a#toggle .bar1, html.open-menu a#toggle .bar2, html.open-menu a#toggle .bar3
    {
         background-color:#fff;
    }
    html.open-menu #menu {
	    z-index: 999;
	    -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
	    transform: translateX(0);
    }
}
/******************************************
           // Menu
******************************************/



/******************************************
              Header
******************************************/

.patient-search { margin: 3px 10px 0 0; }
.patient-search p{ margin:0;}
.patient-search input[type=text]
{
    width: 200px;
    border: 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.patient-search input[type=text]:focus {
    /*width:300px;*/ padding-right:20px;
    background-color:#fff;
}
#OpenPatientSearch{
    position: fixed;
    left: 0;top: -100px;
    right: 0;
    z-index: 9999;
    width: 100%;
    padding-left: 50px;
    background: #fff;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);
    
    -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
    -moz-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
    -ms-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
    -o-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
    transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#OpenPatientSearch.Searchfixed {
    top: 0px;  
}
#OpenPatientSearch > a{
    position: absolute;
    left: 0;
    width: 50px;
    height: 40px;
    line-height: 40px;
    font-size: 120%;
    text-align: center;
    color: #008080;
    border-right: 1px solid #f5f5f5;
}
#OpenPatientSearch .form-control{
    border-radius: 0;
    height: 40px;
    border: 0;
    font-size: 105%;
    box-shadow: none;
}
.patient-details
{
    padding: 5px 275px 5px 5px;
    background-color:#fff;
    position:relative;
}

.patientphoto-name { float:left; width: 50%; }
.patientphoto-name img {
    border-radius: 50%;
    width: 40px;
    height: 40px;
    margin-right:10px;
    float:left;
}
.patientphoto-name .info{
    float:left;
}

.patientphoto-name .info strong + span{ padding-left:0;}
.patientphoto-name .info span{ position:relative; display:inline-block; padding: 0 5px 0 8px;}
.patientphoto-name .info span + span:before {
    background-color: #d6d6d6;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 1px;
}

.PrimaryProvider {
    clear:both;
    font-size: 95%;
}
.PrimaryProvider > span{ position:relative; display:inline-block; padding: 0 5px 0 8px;}
.PrimaryProvider > span + span:before {
    background-color: #d6d6d6;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 1px;
}

.AllergySurgeriesHabbits
{
    float:left;font-size:95%;
    margin: 0 15px;
    -webkit-width: calc(50% - 30px);
    -moz-width: calc(50% - 30px);
    -ms-width: calc(50% - 30px);
    -o-width: calc(50% - 30px);
    width: calc(50% - 30px);
}
.AllergySurgeriesHabbits>div{
    width:100%;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
}
.visitsec{  
    position:absolute;
    right:5px; top:3px;
    font-size: 95%;
}
/*.visitCount > span
{
    width: 18px; height: 18px; line-height: 18px;
    border-radius: 100%;
    margin: 0 2px; cursor:pointer;
    text-align: center;
    display: inline-block;
    position: relative;
    
}
.visitCount > span:hover {
    font-weight: 500;
    background-color:#fff; color:#f9704f;
    -webkit-box-shadow: 0 0 0 3px #f9704f;
    -moz-box-shadow: 0 0 0 3px #f9704f;
    box-shadow: 0 0 0 3px #f9704f;
}
.visitCount > span.VisitSelected {
    font-weight: 500;
    background-color:#f9704f; color:#fff;
    -webkit-box-shadow: 0 0 0 3px #f9704f;
    -moz-box-shadow: 0 0 0 3px #f9704f;
    box-shadow: 0 0 0 3px #f9704f;
}
.visitCount > span.fa{ font-size: 110%;}*/

.menu-section{ 
    border-top: 1px solid #e1e2e4;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.menu-section ul{ text-align:center; margin:0; padding: 0;}

.menu-section li{ display:inline-block; margin-left: -3px;}

.menu-section li a{ padding:7px 0; margin:0 7px; color:#898E95; display: block; position:relative;font-size: 95%;}

.menu-section li a:after{
    content: "";
    position: absolute;
    height: 0;
    bottom: 0;
    left: 0px;
    right: 0px;
    opacity: 0;
    z-index: 1;
    background: #138808;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.menu-section li a:hover:after, 
.menu-section li.active a:after{
	opacity: 1;
    height: 3px;
}
.menu-section li a:hover, 
.menu-section li.active a{ color:#1B2432; }


.menu-section li:last-child.rightsidebtn {
    float: right;
    background-color:#008080;
}
.menu-section li:last-child.rightsidebtn a{color:#fff;}
.menu-section li:last-child.rightsidebtn a:hover{color:#898E95;}

/******************************************
           // Header
******************************************/





/******************************************
           Common
******************************************/
.body-container
{
    padding: 20px 0;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.page-block {
    /*padding: 20px; margin-bottom: 20px;*/
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-border-radius: 2px;
   background-color: #fff;
    -moz-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    position:relative;
}

    /*.page-block:before
     {
        content:"";
        position:absolute;
        left:0px;
        right:0px;
        top:0px;
        bottom:0px;
        background:#fff;
        opacity:0.80;
    }*/

.pagehdr
{
    padding: 0 15px;
    margin: 0 0 12px;
    font-size: 140%;
    font-weight: 400;
    color: #1B2432;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    background-color: #fff;
    -moz-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    -webkit-box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
    box-shadow: 0 0 24px 0 rgba(0, 0, 0, 0.06), 0 1px 0 0 rgba(0, 0, 0, 0.02);
}
.pagehdr:before, .pagehdr:after{
    content:""; height:8px; width:100%; display: table;
}
.pagehdr .pull-right label{
    font-size:1rem;
    font-weight:400;
}
.page-title {
    margin: 0 0 20px;
    font-size: 180%;
    font-weight: 500;
    color: #1B2432;
}

.sec-title {
    font-size: 115%;
    font-weight: 400;
    color: #1B2432;
    margin: 0;
    border-bottom: 1px solid #E1E2E4;
    padding: 6px 15px;
    position: relative;
}
.sec-title span { display:inline-block;padding-top:5px; float:left;}

.sec-title .rgtbtns{float: right; position: relative; margin-top: -2px;}
.sec-title .rgtbtns a, .sec-title .rgtbtns .fileContainer{ margin-left:4px; float: left;}
.sec-title .rgtbtns a:first-child{ margin-left:0;}

.historyDetails{ padding:15px; max-height: 200px; overflow: auto;}
.historyDetails.autoheight{ max-height:inherit!important;}

#Prescription.historyDetails ul
{
    list-style-type:none;
    padding:15px 0 0; margin:0 0 25px;
    border: 1px solid #ddd;
    border-radius: 4px;
    overflow: hidden;
}

#Prescription.historyDetails li 
{
    font-size:105%;
    padding: 10px 15px;
    background-color: #fff;
    
}
#Prescription.historyDetails li .instruction
{
    display:block; font-size:85%; margin-top:2px;
}
#Prescription.historyDetails .Rx{
    width:35px; margin-left:10px;
}

.page-block .table-responsive .table:last-child{ margin-bottom:0;}

.hideshow
{
    position: relative;
    cursor:pointer;
}
.hideshow i
{
    font-weight: bold;
    position: relative;
    z-index: 1;
}
.hideshow.selected .angle-down
{
    color: #000;
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.hideshow.selected {
    border:0;
}

ul.rightAngle li
{
    text-decoration: none!important;
    padding: 2px 0;
    display: block;
}
ul.rightAngle li:before {
    font-family: fontawesome;
    content: "\f105";
    margin-right: 8px;
    font-size: 90%;
}

.ldvrdv .ldv{transition: all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;}
.ldvrdv .rdv 
{
    padding-left:0;
    transition: all .3s ease-in-out; -webkit-transition:all .3s ease-in-out;
}

.MaximizeDv {
    position:fixed;
    left: 15px; right: 15px;
    top:20px; bottom:20px;
    background: #fff;
    border-radius: 3px;
    z-index: 9999;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);

    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.MaximizeDv1 {
    -webkit-transform: scale(1)!important;
    -moz-transform: scale(1)!important;
    -ms-transform: scale(1)!important;
    -o-transform: scale(1)!important;
    transform: scale(1)!important;
}
.MaximizeDv #scrollbar {
    padding: 15px;
}
.MaximizeDv .rgtbtns {
    display:none;
    visibility: hidden;
}
.MaximizeDv .close{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 9;
}


.scroll-container
{
    position:relative;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column;
    /*height: calc(100vh - 150px);
    height: -moz-calc(100vh - 150px);
    height: -webkit-calc(100vh - 150px);*/
    width: 100%;
}

.scrollbar{overflow:auto;}

.scroll-without{
    /*display: -webkit-inline-box;
    display: -moz-inline-box;
    display: inline-box;
    display: -webkit-inline-flex;
    display: -moz-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;*/
    display:inline;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    flex-shrink: 0;
    -ms-flex-negative: 0;
}


.ultree {
    padding: 0;
    margin: 0;
    list-style-type:none;
}
.ultree ul{
    padding:0 0 0 20px;
    list-style-type:none;
}

.ultree .parent{
    position:relative;   
}
.ultree > .parent:after {
    content: "";
    -webkit-height: calc(100% + 15px);
    -moz-height: calc(100% + 15px);
    -ms-height: calc(100% + 15px);
    -o-height: calc(100% + 15px);
    height: calc(100% + 15px);
    width: 1px;
    background-color: #e5e5e5;
    position: absolute;
    left: 0px;
    top: 0px;
}
.ultree > .parent:first-child:after{
    top: -15px;
}
.ultree > .parent:last-child:after{
    bottom: -15px;
}


.ultree > .parent>span:first-child{
    display:inline-block;
    padding:5px 10px; margin-top:7px; margin-bottom:7px;
    color:#fff;
    background:#42a1a1;
    position:relative;
    border-radius:3px;
}
.ultree > .parent>span:first-child:before{
    width: 8px;
    height: 8px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: -4px;
    margin-top:-4px;
    border-radius: 50%;
    z-index: 1;
    background: #42a1a1;
    content: "";    
}

/*.ultree .parent .lvl1>a.icon-circle-btn{ display:none;}*/

.ultree > li > .ulinn > .parent + .parent > span:first-child {
    margin-top: 7px;
}

.ultree .child{ position:relative; padding: 2px 2px 2px 18px;}

.ultree .child:before {
    content: "\f068";
    font-family: fontawesome;
    color: #008080;
    position: absolute;
    left: 0;
    top: 7px;
    line-height: normal;
}
.ultree .child>span:first-child {
    font-weight:500;
    color:#008080;
}
.ultree .child img{ width: 18px; margin-left:7px; margin-right:3px;}

.ultree > li  > .ulinn  > .parent > span:first-child{
    display:inline-block;
    padding:5px 10px; margin-bottom:7px;
    color:#fff;
    background: #7fbfbf;
    position:relative;
    border-radius:3px;
}
.ultree > li  > .ulinn >.parent > span:first-child:before{
    width: 8px;
    height: 8px;
    display: inline-block;
    position: absolute;
    top: 50%;
    left: -4px;
    margin-top:-4px;
    border-radius: 50%;
    z-index: 1;
    background: #7fbfbf;
    content: "";
}

.ultree > li  > .ulinn >.parent > span:first-child:after {
    content: "";
    left: -19px;
    top: 15px;
    position: absolute;
    display: block;
    width: 21px;
    border-bottom: 1px solid #e5e5e5;
}




#OpenUpdatesbox{
    width: 50px; height: 50px; line-height: 50px;
    left: -50px; top: 50%; margin-top: -25px;
    position: absolute;
    background: #fff;
    text-align: center;
    border: 1px solid #ccc;
    border-right: 0;
    border-radius: 4px 0 0 4px;
}

.OpenUpdatesbox #Updatesbox{
    z-index: 1;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}
#Updatesbox{
    background: #fff;
    position: fixed;
    top:0;
    right: 0px;
    bottom: 0;
    z-index: 1;
    width: 300px;
    height:100%;
    font-family: inherit;
    border-radius: 2px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-transform: translateX(300px);
    -moz-transform: translateX(300px);
    -ms-transform: translateX(300px);
    -o-transform: translateX(300px);
    transform: translateX(300px);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.EMRrightSideOpenbtn{ display:none;}

/******************************************
          // Common
******************************************/

/******************************************
          // PMDetails
******************************************/
#DentalFinding .nav-tabs { border-bottom:none; }
#DentalFinding .tab-content table  tr td { border-left:1px solid #ddd; border-right:1px solid #ddd;border-bottom:1px solid #ddd; }
/******************************************
          // PMDetails
******************************************/
/******************************************
          // AllPatients
******************************************/

.act_btn .btn-xs { font-size:11px; }

/******************************************
          // AllPatients
******************************************/
/******************************************
       Notification Popup
******************************************/
.NotificationPopup{
    background:#fff;
    position:fixed;
    width:250px;
    right:0;
    bottom:20px;
    padding: 23px 25px 20px 15px;
    border-radius:2px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.3);
    -webkit-transform: translateX(250px);
    -moz-transform: translateX(250px);
    -ms-transform: translateX(250px);
    -o-transform: translateX(250px);
    transform: translateX(250px);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.NotificationPopup.OpenNotification{
    z-index: 9999;
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}
.NotificationPopup:before{
    content: "";
    display: block;
    height: 8px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    border-radius: 2px 2px 0 0;
    background-color: #3be8b0;
    background-image: -webkit-linear-gradient(left, #3be8b0, #02ceff);
    background-image: linear-gradient(to right, #3be8b0, #02ceff);
}
.CloseNotification{
    position: absolute;
    right: 10px; top: 23px;
    font-size: 120%;
    opacity: 0.7;
}
/******************************************
      // Notification Popup
******************************************/




/******************************************
           Form
******************************************/

.btn-container{margin-top:20px;}

.btn-md{padding: 9px 20px;}


a{ text-decoration:none!important; color: #898E95; cursor:pointer;
    -webkit-transition:all .35s;
    -moz-transition:all .35s;
    transition:all .35s;
}
a:hover{color:#138808;}

a.link{ color:#008080;cursor:pointer;}
a.link:hover{ text-decoration:underline!important;}

.btn-link
{
    cursor:pointer;
    color:#008080;
    border-bottom: 1px dotted #898E95;
}
.btn-link:hover
{
    color:#008080;cursor:pointer;
    border-bottom: 1px dotted #138808;
}
.btn {
    cursor: pointer;
    /* outline: none!important; */
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.btn i + span{
    margin-left:5px;
}

.btn-d
{
    background: #138808!important;
    border-color: #138808!important;
    color:#fff!important;
}

.btn-d:hover
{
    border-color: #138808;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
}

.btn-primary:hover {
    border-color:#285e8e;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #285e8e;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #285e8e;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #285e8e;
     color: #fff !important;
}
.btn-info:hover {
    border-color:#46b8da;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #46b8da;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #46b8da;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #46b8da;
    color: #fff !important;
}

.btn-success:hover {
    border-color: #398439;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #398439;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #398439;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #398439;
    color: #fff !important;
}

.btn-warning {
       background-color: #f3c022;
    border-color: #f3c022;
}

.btn-warning:hover{
    border-color:#daa60b;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #daa60b;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #daa60b;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #daa60b;
    color: #fff !important;
    background:#daa60b;
}

/*.btn-danger {
       background-color: #138808;
    border-color: #138808;
}

.btn-danger:hover {
    border-color:#138808;
    box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 1px #138808;
    color: #fff !important;
     background-color: #e66b00;
}*/

.icon-circle-btn:hover, .icon-circle-btn.active
{
    color:#026b6b;
    border:1px solid transparent!important;
    -webkit-box-shadow: 0 0 0 1px #026b6b;
    -moz-box-shadow: 0 0 0 1px #026b6b;
    box-shadow: 0 0 0 1px #026b6b;
}

.icon-circle-btn
{
    width: 22px;
    height: 22px;
    line-height: 21px;
    font-size: 12px;
    cursor: pointer;
    text-align: center;
    display: inline-block;
    text-decoration: none!important;
    border-radius: 50%;
    color: #B9BCC0;
    background-color: #fff;
    border: 1px solid #CDCFD2;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.icon-circle-btn.big{
    width: 30px; height: 30px;
    line-height: 30px;
}

.icon-circle-btn.small{
    width: 20px; height: 20px;
    line-height: 20px;
}


.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;
  will-change: opacity, transform;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
  transition: all .3s 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; 
}

.rupee {
    position:relative;
}

.rupee:before{
    content: "\f156";
    font-family: FontAwesome;
    font-weight: 500;
    margin-right: 5px;
}

.form-control {
    border: 1px solid #ddd;
    font-weight: normal;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    -ms-box-shadow: none;
    -o-box-shadow: none;
    box-shadow: none;
    height: 26px;
}
select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    background: #fff url(../images/caret-down.png) no-repeat 100% center;
    padding: 4px 23px 4px 10px;
    font-size:13px;
}
textarea.form-control { resize: none;}

 .search {
    background-image: url(../images/search.png)!important;
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 15px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -ms-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    text-indent: 18px;
    -webkit-transition: all 0.2s!important;
    -moz-transition: all 2s!important;
    transition: all 0.2s!important;
}

.search:focus {
    background-position: -20px center;
    text-indent: 0;
}

.searchbox {
    position: relative;
    display: block;
    /*overflow:hidden;*/
}
.form-inline .searchbox {
    display: inline-block;
    width: auto;
    vertical-align: middle;
}

.search + .fa-times-circle {
    position: absolute;
    top: 50%; right: 5px;
    margin-top:-8px;
    font-size: 12pt;
    line-height: normal;
    background: #fff;
    /*-webkit-transform: translateX(20px);
    -moz-transform: translateX(20px);
    -ms-transform: translateX(20px);
    -o-transform: translateX(20px);
    transform: translateX(20px);*/
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}


.tooltip { z-index: 9999;}

.tooltip.top .tooltip-arrow { border-top-color: #49505b;}
.tooltip.left .tooltip-arrow { border-left-color: #49505b;}
.tooltip.right .tooltip-arrow { border-right-color: #49505b;}
.tooltip.bottom .tooltip-arrow { border-bottom-color: #49505b;}
.tooltip-inner {
    max-width: 300px;
    padding: 5px 8px;
    font-weight: normal;
    background-color: #49505b;
}


.list-group-data{
    padding: 7px 7px 7px 57px;
    min-height:54px;
}
.list-group-data>.cbox{
    float: left;
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 50px;
    text-align: center;
    line-height: 56px;
    background: rgba(236, 238, 239, 0.38);
    border-right: 1px solid #ddd;
}

.list-group-item>.name{
    float:left;
}
.list-group-item>.name .addres
{
    display:block;
}

.list-group-item-hover:hover
{
    cursor:pointer;
    background:#f5f5f5;
    color:#1B2432;
}


.list-group-item-header {
    font-size: 120%;
    font-weight: 500;
    color: #1B2432; background: #eee;
    padding: 10px 15px;
    position: relative;
}



/******************************************
           Form
******************************************/




/******************************************
           Table
******************************************/

.table{ margin:0;background:#fff;}
.table>thead>tr>th {
    color: #333333;
    font-weight: 500;
    /*border-bottom: 1px solid #eceeef;*/
}
.table-bordered>tbody>tr>td, .table-bordered>tbody>tr>th, .table-bordered>tfoot>tr>td, .table-bordered>tfoot>tr>th, .table-bordered>thead>tr>td, .table-bordered>thead>tr>th {
    /*border: 1px solid #eceeef!important;*/
    
   /* border-left: none !important;
    border-right: none !important;*/
    border:1px solid #E7E7E9;
}

.table>tbody+tbody {
    border-top: 1px solid #ddd;
}

.text-top{ vertical-align:top;}

.text-middle{ vertical-align:middle!important;}

tree-dnd .table td{ vertical-align:middle!important;}

.table_bg thead tr  { /*background:#F9F9F9;*/ background: rgba(19, 136, 8, .4) }
.table_bg > tbody > tr:nth-child(even) {
    background: rgba(19, 136, 8, .1)
}
/*.table_bg thead tr th { text-align:center; }*/
.table_bg > thead > tr > td, .table_bg > thead > tr > th { border-bottom-width:0px; color:#fff; }
.table_bg > tbody > tr > td { padding:5px;color:#6D7987;font-size:13px; }
.table-bordered.table_bg { border:1px solid #E7E7E9; }


/******************************************
          // Table
******************************************/




/*****************************************
        TAB
*****************************************/

.tabs-left{
    border-bottom: none;
    height: 100%;
   /* border-right: 1px solid #ddd;*/
}
.tabs-left li{
  float: none;
  margin-bottom: 0px;
}
.tabs-left li.active>a,
.tabs-left li.active>a:hover,
.tabs-left li.active>a:focus {
    border-right-color: transparent;
    border: 0;
    color: #fff;
    background: #138808;
    border: 1px solid transparent;
    border-right: none;
}

.tabs-left li.active > a:before
{
    content: "";
    position: absolute;
    right: 0px;
    top: 8px;
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-right: 10px solid #fff;
}

.tabs-left li:first-child.active > a:hover,
.tabs-left li:first-child.active > a {
    border-radius: 0px 0 0 0;
}

.tabs-left li:last-child.active > a:hover,
.tabs-left li:last-child.active > a {
    border-radius: 0 0 0 0px;
}

/*.tabs-left li.active>a:after{
    content: '';
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -13px;
    border-left: 0;
    border-bottom: 13px solid transparent;
    border-top: 13px solid transparent;
    border-left: 10px solid #1a253a;
}*/

.tabs-left li>a {
    border-radius: 0;
    margin-right: 0;
    padding: 8px 10px;
    display: block;
    color: #000;
    font-weight: 400;
    cursor: pointer;
    position: relative;
   /* background: #CCCCCC; */
   background:#d9d9d9;
    margin-bottom: 5px;
    border: 1px solid transparent;
}

.tabs-left .nav-tabs { border:none; }

.tabs-left li > a:hover {    
     border: 1px solid transparent;
    color: #fff;
    background: #138808; }

/*.tabs-left li:first-child>a {border-top:0!important;}*/

.tabs-left-container .tab-content { min-height: 400px;}

.tabin-hdr{ display:none;}

.tabs-left-container {
    position:relative;
}
.tabs-left {
    width:240px;
    position:absolute;
    top:15px; left:15px;
}
.tabs-right{
    padding: 0 0 0 255px;
    transition: all ease-out 0.3s;
}


.ldv .leftTab .nav-tabs{
    margin: 10px 0 0;
    padding: 0 0 0 10px;
}
.ldv .leftTab .nav-tabs>li> a {
    color: #1B2432; font-weight:500;
    padding: 6px 10px;
    display: inline-block;
    text-decoration: none;
    cursor: pointer;
}
.ldv .leftTab .nav-tabs>li.active> a {
    color: #f9704f;
}

.ldv .leftTab .tab-content {
    padding:20px;
}

.ldv .leftTab .tab-content .withcheckbox .list-group-item  { padding: 5px 8px 5px 30px; cursor: pointer; position: relative;}
.ldv .leftTab .tab-content .withcheckbox .list-group-item:before{ position: absolute;left: 8px;top: 2px;  font-size: 20px;  color: #ccc;content: "\f096"; font-family:fontawesome;}
.ldv .leftTab .tab-content .withcheckbox .list-group-item.active:before{color: #009587;content: "\f046"; font-family:fontawesome;}
.ldv .leftTab .tab-content .withcheckbox .list-group-item:hover{ background-color: #f5f5f5;}
.ldv .leftTab .tab-content .withcheckbox .list-group-item.active{ color: #009587;background: #F0F9F8; border-color: #ddd;}





/*****************************************
        // TAB
*****************************************/



/***********************************
         Charting
***********************************/
.charting{  margin:0 auto; position:relative;}

.charting:before{
	background-color: #000;
	content: "";
	width: 2px;height: 100%;
	position: absolute;
	left: 50%;top: 0; bottom:0;
	margin-left:-1px;
}
.charting:after{
	background-color: #000;
	content: "";
	width: 100%; height: 2px;
	position: absolute;
	top: 50%; left: 0; right:0;
	margin-top:-1px;
}
.charting .UpperRight, .charting .UpperLeft, .charting .LowerRight, .charting .LowerLeft{
	width:50%; float:left;
	height: 200px; position:relative;
}
	
.charting .UpperRight .name,
.charting .UpperLeft .name,
.charting .LowerRight .name,
.charting .LowerLeft .name
{
	position:absolute;
	font-size: 25px;
	font-weight: 600;
    color: #008080;
}
	
.charting .UpperRight .name{top:15px; left:15px;}
	
.charting .UpperLeft .name{top:15px; right:15px;}
	
.charting .LowerRight .name{bottom:15px; left:15px;}
	
.charting .LowerLeft .name{bottom:15px; right:15px;}
	
.charting .UpperRight .Teeth-container{
	position:absolute;
	bottom:5px; right:5px;
	list-style-type:none;
	padding:0; margin:0;
	border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.charting .UpperLeft .Teeth-container{
	position:absolute;
	bottom:5px; left:5px;
	list-style-type:none;
	padding:0; margin:0;
	border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.charting .LowerRight .Teeth-container{
	position:absolute;
	top:5px; right:5px;
	list-style-type:none;
	padding:0; margin:0;
	border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.charting .LowerLeft .Teeth-container{
	position:absolute;
	top:5px; left:5px;
	list-style-type:none;
	padding:0; margin:0;
	border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.charting .UpperRight .Teeth-container > li, 
.charting .LowerRight .Teeth-container > li{ float:right; }
.charting .UpperLeft .Teeth-container > li, 
.charting .LowerLeft .Teeth-container > li{	float:left; }
.charting .Teeth-container > li >a{ display:block; position:relative;}
.charting .Teeth-container > li >a:hover{ }
.charting .Teeth-container > li >a:hover:before, 
.charting  a.selectedTeeth:before
{
	content:"";
	border: 2px solid #ff0000;
	position:absolute; left:0;right:0;top:0;bottom:0;
}
/***********************************
      // Charting
***********************************/




/***********************************
        modal left/right
***********************************/
 .modal.left .modal-dialog, 
 .modal.right .modal-dialog
{
    position: fixed;
    margin: auto;
    width: 600px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -moz-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}
.modal.left .modal-content, 
.modal.right .modal-content
{
    max-height: -moz-calc(100vh - 40px);
    max-height: -webkit-calc(100vh - 40px);
    max-height: -ms-calc(100vh - 40px);
    max-height: -o-calc(100vh - 40px);
    max-height: calc(100vh - 40px);
    height:100%;
}
.modal.right .modal-content 
{
    border-radius: 0;
    border: none;
    /*border-left: 8px solid #138808;*/
}
.modal.left .modal-content 
{
    border-radius: 0;
    border: none;
    /*border-right: 8px solid #008080;*/
}
.modal.left.fade .modal-dialog
{
    left: -320px;
    -webkit-transition: opacity 0.3s linear, left 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, left 0.3s ease-out;
    -o-transition: opacity 0.3s linear, left 0.3s ease-out;
    transition: opacity 0.3s linear, left 0.3s ease-out;
}
.modal.left.fade.in .modal-dialog
{
    left: 0;
    z-index: 9999;
}
.modal.right.fade .modal-dialog
{
    right: -320px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}
.modal.right.fade.in .modal-dialog
{
    right: 0;
    z-index: 9999;
}

.modal.left .modal-header, 
.modal.right .modal-header
{
    border-bottom-color: #eee;
    background-color: #138808;
    padding:10px 15px!important;
}

.modal.left .modal-header .modal-title, 
.modal.right .modal-header .modal-title  
{
    color:#fff;
    font-size: 120%;
    font-weight: 400; 
}

.modal.left .modal-header .close, 
.modal.right .modal-header .close {
    color: #fff;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=80);
    opacity: .8;
    margin: -2px 0 0;
}



.modal-header {
    padding: 10px 50px 10px 15px;
    border-bottom: 1px solid #E1E2E4;
    display: inline;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    flex-shrink: 0;
    -ms-flex-negative: 0;
}
.modal-header .close
{
    outline:none;
    /*margin-top: 5px;*/
    margin-right: -30px;
    font-size: 25px;
}
.modal-content
{
    border: 1px solid #898E95;
    background-color: #fff;
    border-radius: 3px 3px 3px 3px;
    -webkit-border-radius: 3px 3px 3px 3px;
    box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 2px 2px rgba(0,0,0,0.3);

    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: box;
    display: -webkit-flex;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    box-orient: vertical;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    flex-direction: column;
    -ms-flex-direction: column;
    max-height: -moz-calc(100vh - 60px); 
    max-height: -webkit-calc(100vh - 60px); 
    max-height: -ms-calc(100vh - 60px);
    max-height: -o-calc(100vh - 60px);
    max-height: calc(100vh - 60px); 
    width: 100%;
}

.modal-body 
{
    overflow:auto;
}
.modal-body label {
    color: #1B2432;
    vertical-align: bottom;
}
.modal-title {
    color: #1B2432;
    font-size: 150%;
    display:inline-block;
}
.modal-backdrop {
    background-color: #676D76;
}
.modal-backdrop.in {
    opacity: .7;
    filter: alpha(opacity=70);
}
.modal-footer{ 
    margin-top:0;
    display: inline;
    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    flex-shrink: 0;
    -ms-flex-negative: 0;
}
.modal-open {
    overflow: hidden!important;
}

.modal-body .tabinn-search {
    margin: 0 0 10px 0;
}
.modal-body .tabinn .active a {
    color: #1B2432;
    font-weight: 500;
}
.modal-body .tabinn li a 
{
    color:#333;
    padding: 4px 10px;
    display: inline-block;
    text-decoration: none; 
    cursor:pointer;
}
.modal-body .tab-content {
    border-top: 0!important;
    border: 1px solid #d4d4d1;
    padding: 20px 20px 0;
    text-align: justify;
}
.modal-body .tab-content .list-group-item:hover {
    background-color: #f5f5f5;
}
.modal-body .tab-content .list-group-item {
    padding: 5px 8px;
    cursor: pointer;
    position: relative;
}
.modal .modal-full {
    width: 100%;
    margin: 0 0 0 0;
}
.modal .modal-full .modal-content {
    height: 100vh;
    max-height: 100vh;
}
.modal .modal-full .modal-content .modal-body {
    height: 100%;
}
   
/***********************************
    //modal left/right
***********************************/ 

/*****************************************
			accordion
*****************************************/
.accordion.panel-group { margin-bottom:0;}
.accordion .panel-heading{ padding:0;/*background-color: #fff!important;*/}
.accordion .panel-heading a{padding: 7px 15px;display: block; text-decoration: none;color: #008080;font-size: 102%;  font-weight:500; position:relative;}
.accordion .panel-heading a:before{
    content: "\f107";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    font-size: 12pt;
    font-family: fontawesome;
    line-height: 20px;
    width: 20px;
    height: 20px;
    text-align: center;
    /*background: #008080;*/
    color: #008080;
    border-radius: 50px;
    transition: all ease-out 0.3s;
	-webkit-transition: all ease-out 0.1s;
}
.accordion .panel-heading a:not(.collapsed):before{content: "\f106";}
/*.accordion .panel-heading a:not(.collapsed){background: #008641; color:#fff;}*/
.accordion .panel-body{ padding:15px;}
/*****************************************
			//accordion
*****************************************/

/***********************************
    checkbox & Radio Button
***********************************/ 

@-webkit-keyframes icon-beat {
    0% {-webkit-transform: scale(2);-ms-transform: scale(2);transform: scale(2);}
    100% {-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
}

@keyframes  icon-beat 
{
    0% {-webkit-transform: scale(2);-ms-transform: scale(2);transform: scale(2);}
    100% {-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}
}

label.cbox i, label.radiobtn i {
    display: inline-block;
    position: relative;
    font-style: normal;
    color: #898E95;
    vertical-align: middle;
}
label.cbox, label.radiobtn{
    font-weight: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin:0;
    /*line-height: 0.5;*/
}
label.cbox:after{ content:""; display:inline-block; clear:both;}

label.radiobtn input[type="radio"],
label.cbox input[type="checkbox"] { display: none;}

label.radiobtn input[type="radio"] + i:before,
label.cbox input[type="checkbox"] + i:before {
    font-family: 'FontAwesome';
    font-size: 20px;
    margin: 0 1px;
    line-height : 1;
    display: inline-block;
}

label.radiobtn input[type="radio"]:checked + i,
label.cbox input[type="checkbox"]:checked + i {
  position: relative;
  -webkit-animation: icon-beat 0.1s ease;
  animation: icon-beat 0.1s ease;
}

label.cbox input[type="checkbox"] + i + span{ margin-left:7px;}

label.radiobtn input[type="radio"] + i + span{ margin-left:2px;}

label.radiobtn input[type="radio"]:checked + i + span,
label.cbox input[type="checkbox"]:checked + i + span {
  -webkit-transition: all 0.1s ease;
  transition: all 0.1s ease;
}

label.radiobtn input[type="radio"] + i:before { content: "\f10c"; }

label.radiobtn input[type="radio"]:checked + i:before { content: "\f192"; }

label.radiobtn input[type="radio"]:checked + i + span,
label.radiobtn input[type="radio"]:checked + i:before,
label.cbox input[type="checkbox"]:checked + i + span,
label.cbox input[type="checkbox"]:checked + i:before { color: #138808; }

label.cbox input[type="checkbox"] + i:before { content: "\f096"; }

label.cbox input[type="checkbox"]:checked + i:before { /*content: "\f046";*/ content: "\f14a"; }

/***********************************
    //checkbox & Radio Button
***********************************/ 

     
/***********************************
  Auto complete Textbox
***********************************/ 
.angucomplete-holder {
    position: relative;
    margin: 0;
    /*font: inherit;
    font-size: 100%;
    font-style: italic;*/
}

.angucomplete-dropdown {
    font: inherit;
    border-color: #ececec;
    border-width: 1px;
    border-style: solid;
    border-radius: 2px;
    width: 300px;
    padding: 6px;
    cursor: pointer;
    position: absolute;
    z-index: 9999;
    top: 100%;
    left: 0px;
    background-color: #fff;
    overflow-y: auto;
    max-height: 150px;
}

.angucomplete-searching {
    font: inherit;
    font-size: 85%;
    color: #999;
    letter-spacing: 1px;
}

.angucomplete-row {
    padding: 5px;
    margin-bottom: 4px;
    color: #000;
    clear: both;
}

.angucomplete-selected-row {
    background-color: #428bca;
    color: #fff;
}

.chighlight {
    font-weight: bold;
    color: #dc143c;
}

/***********************************
 // Auto complete Textbox
***********************************/

/*.treeactive {
background-color: aqua;
}*/    








/***********************************
    Slide UP DOWN LEFT RIGHT
***********************************/


@-webkit-keyframes slide-right {
  from {
    -webkit-transform: translate(-20px, 0);
    -ms-transform: translate(-20px, 0);
    -o-transform: translate(-20px, 0);
    transform: translate(-20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-moz-keyframes slide-right {
  from {
    -webkit-transform: translate(-20px, 0);
    -ms-transform: translate(-20px, 0);
    -o-transform: translate(-20px, 0);
    transform: translate(-20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-o-keyframes slide-right {
  from {
    -webkit-transform: translate(-20px, 0);
    -ms-transform: translate(-20px, 0);
    -o-transform: translate(-20px, 0);
    transform: translate(-20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-ms-keyframes slide-right {
  from {
    -webkit-transform: translate(-20px, 0);
    -ms-transform: translate(-20px, 0);
    -o-transform: translate(-20px, 0);
    transform: translate(-20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes slide-right {
  from {
    -webkit-transform: translate(-20px, 0);
    -ms-transform: translate(-20px, 0);
    -o-transform: translate(-20px, 0);
    transform: translate(-20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-left {
  from {
    -webkit-transform: translate(20px, 0);
    -ms-transform: translate(20px, 0);
    -o-transform: translate(20px, 0);
    transform: translate(20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-moz-keyframes slide-left {
  from {
    -webkit-transform: translate(20px, 0);
    -ms-transform: translate(20px, 0);
    -o-transform: translate(20px, 0);
    transform: translate(20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-o-keyframes slide-left {
  from {
    -webkit-transform: translate(20px, 0);
    -ms-transform: translate(20px, 0);
    -o-transform: translate(20px, 0);
    transform: translate(20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-ms-keyframes slide-left {
  from {
    -webkit-transform: translate(20px, 0);
    -ms-transform: translate(20px, 0);
    -o-transform: translate(20px, 0);
    transform: translate(20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes slide-left {
  from {
    -webkit-transform: translate(20px, 0);
    -ms-transform: translate(20px, 0);
    -o-transform: translate(20px, 0);
    transform: translate(20px, 0);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-down {
  from {
    -webkit-transform: translate(0, -20px);
    -ms-transform: translate(0, -20px);
    -o-transform: translate(0, -20px);
    transform: translate(0, -20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-moz-keyframes slide-down {
  from {
    -webkit-transform: translate(0, -20px);
    -ms-transform: translate(0, -20px);
    -o-transform: translate(0, -20px);
    transform: translate(0, -20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-o-keyframes slide-down {
  from {
    -webkit-transform: translate(0, -20px);
    -ms-transform: translate(0, -20px);
    -o-transform: translate(0, -20px);
    transform: translate(0, -20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-ms-keyframes slide-down {
  from {
    -webkit-transform: translate(0, -20px);
    -ms-transform: translate(0, -20px);
    -o-transform: translate(0, -20px);
    transform: translate(0, -20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes slide-down {
  from {
    -webkit-transform: translate(0, -20px);
    -ms-transform: translate(0, -20px);
    -o-transform: translate(0, -20px);
    transform: translate(0, -20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-up {
  from {
    -webkit-transform: translate(0, 20px);
    -ms-transform: translate(0, 20px);
    -o-transform: translate(0, 20px);
    transform: translate(0, 20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-moz-keyframes slide-up {
  from {
    -webkit-transform: translate(0, 20px);
    -ms-transform: translate(0, 20px);
    -o-transform: translate(0, 20px);
    transform: translate(0, 20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-o-keyframes slide-up {
  from {
    -webkit-transform: translate(0, 20px);
    -ms-transform: translate(0, 20px);
    -o-transform: translate(0, 20px);
    transform: translate(0, 20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@-ms-keyframes slide-up {
  from {
    -webkit-transform: translate(0, 20px);
    -ms-transform: translate(0, 20px);
    -o-transform: translate(0, 20px);
    transform: translate(0, 20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}
@keyframes slide-up {
  from {
    -webkit-transform: translate(0, 20px);
    -ms-transform: translate(0, 20px);
    -o-transform: translate(0, 20px);
    transform: translate(0, 20px);
    opacity: 0;
  }
  to {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    opacity: 1;
  }
}




/***********************************
   // Slide UP DOWN LEFT RIGHT
***********************************/


/***********************************
        nano scroll 
***********************************/
.nano
{
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.nano > .nano-content
{
    position: absolute;
    overflow: scroll;
    overflow-x: hidden;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}
.nano > .nano-content:focus
{
    outline: thin dotted;
}
.nano > .nano-content::-webkit-scrollbar, .nano > .nano-content::-moz-scrollbar
{
    visibility: hidden;
}
.has-scrollbar > .nano-content::-webkit-scrollbar, .has-scrollbar > .nano-content::-moz-scrollbar
{
    visibility: visible;
}
.nano > .nano-pane
{
    /*background: rgba(0,0,0,.25);*/
    position: absolute;
    width: 2px;
    right: 2px;
    top: 0;
    bottom: 0;
    visibility: hidden\9;
    opacity: .01;
    -webkit-transition: .2s;
    -moz-transition: .2s;
    -o-transition: .2s;
    transition: .2s;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.nano > .nano-pane > .nano-slider
{
    background: #444;
    background: rgba(0,0,0,.5);
    position: relative;
    margin: 0 -2px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
}
.nano:hover > .nano-pane, .nano-pane.active, .nano-pane.flashed
{
    visibility: visible\9;
    opacity: 0.99;
}
/***********************************
       // nano scroll 
***********************************/

@media (min-width: 1600px){
    .container-fluid {width: 90%;}
}
@media (min-width: 991px) {
    #showPatientDetails {display: none!important;}
    #showPatientSearch{ display:none!important}
}

@media (max-width: 990px) {
    html, body{ background-image: none;padding:0!important;}
    #header{position:relative;}
    #header .header-left{width: 100%;display: inherit;}
    #header .header-right{  width: 100%;}
    .angucomplete-dropdown {width: 100%;}


    .patientphoto-name {width:100%;}
    .AllergySurgeriesHabbits { 
        width:100%; display:none;
        margin: 5px 0 0 0;
        padding: 5px 15px 0;
        border-top: 1px solid #E1E2E4;
    }
    .historyDetails { max-height: none; display:none;}
    .charting{width:900px;}
    .charting .UpperRight, .charting .UpperLeft, .charting .LowerRight, .charting .LowerLeft { height: 120px;}

    .tabs-right .tab-content .hideshowAccordion {
        font-size: 120%;
        font-weight: 500;
        color: #1B2432;
        margin: 0 0 20px;
        padding: 10px 25px 10px 15px;
        position: relative;
        cursor:pointer;
        border-radius: 6px;
        background-color: #fff;
    }

    .tabs-right .tab-content .hideshowAccordion:after{
        content: "\f107";
        font-family:fontawesome;
        display: inline-block;
        position: absolute;
        right: 10px;
        -webkit-transition: all 0.3s ease-in-out;
        -moz-transition: all 0.3s ease-in-out;
        -ms-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }
    .tabs-right .tab-content .hideshowAccordion.selected:after{
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }
    .tabs-right .tab-content .hideshowAccordion.selected {
        margin:0;
        border-radius: 6px 6px 0 0;
        color: #fff;
        background-color: #008080;
    }
    .hideshow{}

    .hideshow.selected {
        margin:0;
        border-radius: 6px 6px 0 0;
        color: #fff;
        background-color: #008080;
    }
    .EMRrightSideOpenDV .EMRrightSideIN{ display:none;}

    .EMRrightSideOpenbtn{
        position: fixed;
        right: 15px;
        bottom: 15px;
        width: 50px;
        height: 50px;
        line-height: 50px;
        font-size: 20px;
        text-align: center;
        border-radius: 50%;
        padding: 0;
        display: block;
        border: 0;
        outline:0;
        color: #fff;
        background-color: #da2128;
    }
    .EMRrightSideOpenbtn:before{
        font-family:fontawesome;
        content: "\f112";  
        display:block;
        -moz-transform: scaleX(-1);
        -o-transform: scaleX(-1);
        -webkit-transform: scaleX(-1);
        transform: scaleX(-1);
        filter: FlipH;
        -ms-filter: "FlipH"; 
    }

    /*#EMRrightSideOpen{
        position: fixed;
         right: -100%; top: 0; bottom:0;
        z-index: 9999;
        width: 100%;
        background: #fff;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.16);
    
        -webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
        -moz-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
        -ms-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
        -o-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); 
        transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);
    
    }
    #EMRrightSideOpen.EMRrightSideOpen {
        right: 0px;
    }*/

}

@media (min-width: 768px) and (max-width: 990px) {
    .AllergySurgeriesHabbits { 
        -webkit-width:calc(100% + 275px);
        -moz-width:calc(100% + 275px);
        -ms-width:calc(100% + 275px);
        -o-width:calc(100% + 275px);
        width:calc(100% + 275px);
    }
}

@media (max-width: 767px) {
   .patient-details{ padding:5px; font-size:15px;}
   #ModalVisit .modal-body{ font-size:17px;}
   .visitCount > span { width: 25px; height: 25px; line-height: 25px;}
   .VisitDate{ margin:10px 0;}
   .OpenModalVisit{ display:inline!important;} 
   .modal.left .modal-dialog, .modal.right .modal-dialog {width: 100%;}
   .tabs-left-container {
        background: none;
        box-shadow: none;
        -webkit-box-shadow: none;
    }
   .tabs-left{ display:none;}
   .tabs-right .tab-content .tab-pane {
        padding: 0;
        display: none;
        opacity: 10;
        margin: 0 0 30px 0;
        /*border: 1px solid #ddd;box-shadow: 3px 3px 0 #f0f0f0;*/
        background: #fff;
        border-radius: 0 0 6px 6px;
        overflow: auto;
    }
   .tabs-right{ padding:0; }
   .floatnone-xs{ float:none!important; }
   
    
}

/*patient search by amol*/
    #ddlPatient {
            cursor: pointer;
            position: absolute;
            z-index: 9999;
            /*top: 100%;
        left: 0px;*/
            background-color: #fff;
            overflow-y: auto;
        
            max-height: 150px;
                font-size: 11px;
        }

            #ddlPatient ul {
                margin: 0;
                list-style-type: none;
                border: 1px solid #ececec;
                border-radius: 2px;
                width: 100%;
                padding: 6px;
            }

            #ddlPatient li {
                padding: 4px;
                border-top: 1px solid #ececec;
            }

                #ddlPatient li:first-child {
                    border-top: 0;
                }
/*********************************************** 
                    Print 
***********************************************/

.print-tab-header{position: fixed;left: 0;right: 0;top: 0;background: #fff;z-index: 1;}
.model-print{overflow: hidden!important;}
#model-print, #model-printrec {margin: 0 auto; height: 100%;}
#model-print .modal-content, #model-printrec .modal-content {height: 100%;}
#model-print .modal-body, #model-printrec .modal-body {height: 100%; padding:0;}
#model-print #iframeprint,  #model-printrec #iframeprinPrecription{ width:100%; height:100%; border:0;}
@media screen{.print-body{padding-top:60px; }}

/*********************************************** 
                    //Print 
***********************************************/

.fileContainer {
    overflow: hidden;
    position: relative;
        cursor: pointer;
}


.fileContainer [type=file] {
    cursor: inherit;
    display: block;
    font-size: 999px;
    filter: alpha(opacity=0);
    min-height: 100%;
    min-width: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
}


.DvDepartment {
    border: 2px solid #1d9473;
    padding: 10px 40px; 
    background: #dddddd;
    border-radius: 25px;
    cursor:pointer;
}
/*toggle button*/
 .switch {
            position: relative;
            display: inline-block;
            width: 60px;
            height: 34px;
        }

            .switch input {
                display: none;
            }

        .slider {
            position: absolute;
            cursor: pointer;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background-color: #ccc;
            -webkit-transition: .4s;
            transition: .4s;
        }

            .slider:before {
                position: absolute;
                content: "";
                height: 26px;
                width: 26px;
                left: 4px;
                bottom: 4px;
                background-color: white;
                -webkit-transition: .4s;
                transition: .4s;
            }

        input:checked + .slider {
            background-color: #2196F3;
        }

        input:focus + .slider {
            box-shadow: 0 0 1px #2196F3;
        }

        input:checked + .slider:before {
            -webkit-transform: translateX(26px);
            -ms-transform: translateX(26px);
            transform: translateX(26px);
        }

        /* Rounded sliders */
        .slider.round {
            border-radius: 34px;
        }

            .slider.round:before {
                border-radius: 50%;
            }

.files-block{ margin-bottom:25px;overflow: hidden;position: relative;}
.files-block .allfiles a
{
    line-height: 180px;
    height: 180px;
    overflow: hidden;
    display: block;
    text-align: center;
    font-size: 50pt;
    color:#1AAFD0;
    position:relative;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.files-block .allfiles a:hover:before, .files-block .allfiles a:hover span.fa {
    display:block;
}
.files-block .allfiles a span.fa{
    /*content: "\f019";
    font-family: fontawesome;*/
    font-size: 25pt;
    line-height: normal;
    display:none;
    padding: 15px;
    color: #000;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 50%; left: 50%;
    margin-top: -30px;
    margin-left: -30px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.files-block .allfiles a span.fa:hover{
    border-color: #FC636B;
    box-shadow: inset 0 0 transparent, 0 0 0 5px #FC636B;
    -moz-box-shadow: inset 0 0 transparent, 0 0 0 5px #FC636B;
    -webkit-box-shadow: inset 0 0 transparent, 0 0 0 5px #FC636B;
}
.files-block .allfiles a:before{
    content: "";
    background: rgba(0, 0, 0, 0.3);
    position: absolute;
    top: 0; bottom: 0; left: 0; right: 0; 
    display:none;
}

.files-block .allfiles a img {
    max-width:100%;
}



/***********************************
         Chair Side
***********************************/
.ChairSide{  margin:0 auto; position:relative;}
.ChairSide > .ChairSideInn{
    position:relative;
}
.ChairSide > .ChairSideInn:before{
	background-color: #000;
	content: "";
	width: 1px;height: 100%;
	position: absolute;
	left: 50%;top: -44px; bottom:0;
	margin-left:-1px;
}
.ChairSide > .ChairSideInn:after{
	background-color: #000;
	content: "";
	width: 100%; height: 1px;
	position: absolute;
	top: 50%; left: 0; right:0;
	margin-top:-1px;
}
.ChairSide .UpperRight, 
.ChairSide .UpperLeft, 
.ChairSide .LowerRight, 
.ChairSide .LowerLeft{
	width:50%; float:left;
	/*height: 230px;*/ height: 190px; position:relative;
}
	
.ChairSide .UpperRight .name,
.ChairSide .UpperLeft .name,
.ChairSide .LowerRight .name,
.ChairSide .LowerLeft .name
{
	position:absolute;
	font-size: 25px;
	font-weight: 600;
    color: #2196f3;
}
	
.ChairSide .UpperRight .name{top:5px; left:5px;}
	
.ChairSide .UpperLeft .name{top:5px; right:5px;}
	
.ChairSide .LowerRight .name{bottom:5px; left:5px;}
	
.ChairSide .LowerLeft .name{bottom:5px; right:5px;}

	

.ChairSide.boxteeth .Teeth-container > li > a{
    padding:0;
}
.ChairSide.boxteeth .UpperRight .Teeth-container, 
.ChairSide.boxteeth .UpperLeft .Teeth-container {
    border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.ChairSide.boxteeth .UpperRight .Teeth-container > li > a span, 
.ChairSide.boxteeth .UpperLeft .Teeth-container > li > a span {
    position: absolute;
    left: 0;
    right: 0;
    top: -30px;
}

.ChairSide.boxteeth .LowerRight .Teeth-container,
.ChairSide.boxteeth .LowerLeft .Teeth-container {
    border-right: 1px solid #bbb;
    border-bottom: 1px solid #bbb;
}
.ChairSide.boxteeth .LowerRight .Teeth-container > li > a span, 
.ChairSide.boxteeth .LowerLeft .Teeth-container > li > a span {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -30px;
}

.ChairSide .UpperRight .Teeth-container,
.ChairSide .UpperLeft .Teeth-container,
.ChairSide .LowerRight .Teeth-container,
.ChairSide .LowerLeft .Teeth-container{
	position:absolute;
	list-style-type:none;
	padding:0; margin:0;
    /*width: 80%;*/
}

.ChairSide .UpperRight .Teeth-container{
	bottom:10px; right:10px;
}
.ChairSide .UpperLeft .Teeth-container{
	bottom:10px; left:10px;
}
.ChairSide .LowerRight .Teeth-container{
	top:10px; right:10px;
}
.ChairSide .LowerLeft .Teeth-container{
	top:10px; left:10px;
}

.ChairSide .UpperRight .Teeth-container > li, 
.ChairSide .UpperLeft .Teeth-container > li{     
    /*height: 200px;*/
    display: table-cell;
    vertical-align: bottom;
}
.ChairSide .LowerRight .Teeth-container > li, 
.ChairSide .LowerLeft .Teeth-container > li{
    /*height: 200px;*/
    display: table-cell;
    vertical-align: top;
}

.ChairSide .Teeth-container > li > a{ padding: 5px; display:block; position:relative;}
                                   
.ChairSide .Teeth-container > li > a:hover{ color: #1B2432;}
                                   
.ChairSide .Teeth-container > li > a:hover:before, 
.ChairSide .Teeth-container > li > a.selectedTeeth:before
{
	content:"";
	border: 2px solid #ccc;
	position:absolute; left:0;right:0;top:0;bottom:0;
}

.ChairSide .Teeth-container > li > a.selectedFinding:before
{
	content:"";
	border: 2px solid #ff0000;
	position:absolute; left:0;right:0;top:0;bottom:0;
}
.ChairSide .Teeth-container > li > a.selectedTreatment:before
{
	content:"";
	border: 2px solid #008000;
	position:absolute; left:0;right:0;top:0;bottom:0;
}


.ChairSide .Teeth-container > li > a span{
    display: block;
    text-align: center;
    font-weight:500;
}
.ChairSide .UpperRight .Teeth-container > li > a span, 
.ChairSide .UpperLeft .Teeth-container > li > a span{     
    margin-top:5px;
    font-size: 80%;
}
.ChairSide .LowerRight .Teeth-container > li > a span,
.ChairSide .LowerLeft .Teeth-container > li > a span {
    margin-bottom:5px;
    font-size: 80%;
}

.ChairSide .Teeth-container > li > a img{ max-width:100%; max-height:100%;}

#Pedo.ChairSide .UpperRight .Teeth-container,
#Pedo.ChairSide .UpperLeft .Teeth-container,
#Pedo.ChairSide .LowerRight .Teeth-container,
#Pedo.ChairSide .LowerLeft .Teeth-container{
    /*width: 50%;*/
}

#Region.ChairSide { padding:30px 0;}

#Region.ChairSide table{ width:100%; position:relative;}
#Region.ChairSide table:before {
    background-color: #000;
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    left: 25%;
    top: 0;
    bottom: 0;
    margin-left: -1px;
}
#Region.ChairSide table:after {
    background-color: #000;
    content: "";
    width: 1px;
    height: 100%;
    position: absolute;
    left: 75%;
    top: 0;
    bottom: 0;
    margin-left: -1px;
}
#Region.ChairSide table td{
    text-align:center;
    width:25%;
}
#Region.ChairSide table input[type=button]{
    -webkit-transition: all ease-out 0.3s;
    -moz-transition: all ease-out 0.3s;
    -ms-transition: all ease-out 0.3s;
    -o-transition: all ease-out 0.3s;
    transition: all ease-out 0.3s;
}
#Region.ChairSide table input[type=button]:hover,
#Region.ChairSide table input[type=button].active{
    background-color:#ff0000;
    color:#fff;
    transform: scale(1.3);
}
    .popupdvUpper {

 
        background: #fff;
        text-align: left;
        padding: 15px;
        color: #000;
        z-index: 9999;
        position: absolute;
        top: -37px;
        -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.33);
        box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.33);
        border-radius: 5px;
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }
    .popupdvLower {
        width: 200px;
        height: 150px;
        background: #fff;
        text-align: left;
        padding: 15px;
        color: #000;
        z-index: 9999;
        position: absolute;
        top:50px;
        -webkit-box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.33);
        box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.33);
        border-radius: 5px;
        -webkit-transition: all 0.4s ease;
        transition: all 0.4s ease;
    }

/***********************************
      // Chair Side
***********************************/

/******************************************
           Preloader
******************************************/

#preloader {
    width: 100%;
    height: 100%;
    top: 0px;
    position: fixed;
    z-index: 99999;
}

#preloader:before{
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background: #fff;
    /*opacity: 0.5;*/
}
.circular {
  animation: rotate 2s linear infinite;
  height: 50px;
  transform-origin: center center;
  width: 50px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.path {
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  animation: dash 1.5s ease-in-out infinite, color 6s ease-in-out infinite;
  stroke-linecap: round;
}
@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px;
  }
}

@keyframes color {
  100%,
  0% {
    stroke: #d62d20;
  }
  40% {
    stroke: #0057e7;
  }
  66% {
    stroke: #008744;
  }
  80%,
  90% {
    stroke: #ffa700;
  }
}
/******************************************
           // Preloader
******************************************/


/*phase selection modal css start*/

.phase_selection_tree .noselect label {
    display: inline-block;
}
.phase_selection_tree .noselect span {
    margin-left: 5px;
}
.phase_selection_tree .hierarchy-header .input-group .input-group-addon {
    position: absolute;
    right: 0px;
    z-index: 999;
    text-align: center;
    background: #4C9EDD;
    top: 0;
    width: 35px;
    bottom: 0;
    line-height: 37px;
    border-radius: 0;
    border: 0;
    color: #fff;
    padding: 8px 0px 0px 0px;
}
.phase_selection_tree .hierarchy-header .input-group {
    width: 100%;
}
.phase_selection_tree .hierarchy-header .input-group input {
    border: 1px solid #e2e2e4;
    padding-right: 40px;
}
.phase_selection_tree .angular-ui-tree {
    background: #FAFAFA;
}
.phase_selection_tree .angular-ui-tree ol,
.phase_selection_tree ul {
    counter-reset: item;
    padding: 0;
    list-style-type: none;
}
.phase_selection_tree .angular-ui-tree ol li ol,
.transtree_selection {
    background: #FAFAFA;
}
/*.phase_selection_tree .angular-ui-tree ol li:before {
    content: counter(item) ". ";
    counter-increment: item;
    font-weight: 400;
    position: absolute;
    left: 8px;
    top: 0;
    font-size: 100%;
    color: #555555;
    bottom: 0;
    padding-top: 8px;
}*/

.phase_selection_tree .angular-ui-tree ol li,
.transtree_selection ul li {
    border-left: none;
    border-right: none;
    position: relative;
    color: #555555;
    padding: 0px;
}
.phase_selection_tree .angular-ui-tree ol li div {
    padding-left: 20px;
    padding-bottom: 5px;
    padding-top: 8px;
    border-bottom: 1px solid #e6e6e6;
    padding-right: 30px;
}
.transtree_selection ul li {
    border-bottom: 1px solid #e6e6e6;
}
.transtree_selection ul li div a {
    display: block;
    padding-left: 20px;
    padding-bottom: 5px;
    padding-top: 8px;
    color: #555555;
}
.transtree_selection ul li div a i {
    padding-right: 5px;
}
.transtree_selection ul li:hover {
    background: #F5F5F5;
}
.transtree_selection ul li:hover a {
    color: #1fb5ac;
}
.phase_selection_tree .angular-ui-tree ol li:hover,
.phase_selection_tree .angular-ui-tree ol li ol li:hover,
.phase_selection_tree .angular-ui-tree ol li ol li ol li:hover {
    background: #F5F5F5;
    color: #1A9EDD;
}
.phase_selection_tree .angular-ui-tree ol li:hover div,
.phase_selection_tree .angular-ui-tree ol li ol li:hover div,
.phase_selection_tree .angular-ui-tree ol li ol li ol li:hover div {} .phase_selection_tree .angular-ui-tree ol li:last-child {
    border-bottom: none;
}
.phase_selection_tree .angular-ui-tree ol li ol li div {
    padding-left: 56px;
}
.phase_selection_tree .angular-ui-tree ol li ol li:before {
    left: 32px;
}
.phase_selection_tree .angular-ui-tree ol li ol li ol li div {
    padding-left: 82px;
}
.phase_selection_tree .angular-ui-tree ol li ol li ol li:before {
    left: 57px;
}
.phase_selection_tree .angular-ui-tree ol li ol li ol li ol li div {
    padding-left: 105px;
}
.phase_selection_tree .angular-ui-tree ol li div a {
    color: #96969E;
    position: absolute;
    right: 5px;
    top: 12px;
}
.phase_selection_tree .angular-ui-tree ol li:hover div a {
    color: #1A9EDD;
}
.phase_selection_tree .angular-ui-tree ol li div span {
    margin-right: 5px;
}
.nodeActive {
    background: #e8f6fc !important;
    border-bottom: 1px solid #a4dbf4 !important;
}
.nodeActive:hover {
    color: #1A9EDD;
}

.phase_selection_tree ol {padding:0px;list-style-type:none;}

.phase_selection_tree ol li ol.displayed li div { padding:5px 10px 5px 30px; }

.phase_selection_tree ol li div { padding:5px 10px;background:#FAFAFA;border-bottom:1px solid #e6e6e6; }
.phase_selection_tree ol li div input { margin: 0px 5px 0px 0px;
    position: relative;
    top: 2px; }

/*phase selection modal css end*/




/***********************************
      Gallery
***********************************/
.Gallery a {
  display: block;
  text-align: center;
  overflow: hidden;
  margin: 10px 0; }
  .Gallery a:after {
    content: "+";
    font-size: 25px;
    z-index: 4;
    visibility: hidden;
    opacity: 0;
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    background: #fff;
    color: #000;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%) scale(0.5);
    -moz-transform: translate(-50%, -50%) scale(0.5);
    -o-transform: translate(-50%, -50%) scale(0.5);
    transform: translate(-50%, -50%) scale(0.5);
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    -webkit-border-radius: 100%;
    -moz-border-radius: 100%;
    border-radius: 100%;
    -webkit-box-shadow: 0 0 23px 3px rgba(1, 1, 1, 0.2);
    -moz-box-shadow: 0 0 23px 3px rgba(1, 1, 1, 0.2);
    box-shadow: 0 0 23px 3px rgba(1, 1, 1, 0.2); }
  .Gallery a img {
    max-width: 100%;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out; }
  .Gallery a:hover:after {
    visibility: visible;
    opacity: 1;
    -webkit-transform: translate(-50%, -50%) scale(1);
    -moz-transform: translate(-50%, -50%) scale(1);
    -o-transform: translate(-50%, -50%) scale(1);
    transform: translate(-50%, -50%) scale(1); }
  .Gallery a:hover img {
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -o-transform: scale(1.05);
    transform: scale(1.05); }

/***********************************
    // Gallery
***********************************/