/*html{ background: url('../img/bg.svg') no-repeat; background-size: 100% 120%; background-position:fixed;}*/
body{ font:.75em Verdana, Geneva, sans-serif; background: url('../img/colourfull-line.jpg') no-repeat top; margin:0; padding:0; outline:none;}
.innerCon{ width: 90%; margin:0 auto;}
h1{ font: bold 16px arial; margin: 0;}
h2{ font: bold 12px arial; color: #333;}
p,section{ font-size: 11px;}
.error {
    color: #FF0000;
    float: left;
    font-size: 13px;
    position: relative;
}
.lft{ float: left;}
.rht{ float: right;}
.center{ text-align: center;}

.colHeader{ padding: 10px; background: #5CB85C url("../img/header_bg.jpg") repeat-x; color: #5CB85C; font-size: 12px; font-weight: bold;}
.header1,.header2,.header3,.header4{ margin: 0; padding: 5px;}
.header1{ font-size: 20px;}
.header2{ font-size: 16px;}
.header3{ font-size: 14px;}
.header4{ font-size: 12px;}

.col70{ width: 70%; }
.col30{ width: 30%;  border-left: 0; min-height: 500px; margin-bottom: 10px;}
.padding10{ padding: 10px; font-size: 11px;}
.rhtSection{ padding: 10px; height: 500px; padding-top: 0;}

.panel{ border: 1px solid #acd28d;}
.dialogHeader{ margin: 0; padding: 5px; background: #5CB85C; color: #fff; font-size: 11px;}
.devider{ border-bottom: 1px dashed #ccc; margin: 10px 0; padding: 2px; }

.table1{ width: 100%;}
.table1 tbody tr{ border-bottom: 1px solid #f2f2f2;}
.table1 tbody tr th{ width: 35%;}

.table-com{ width: 100%; border-bottom: 3px solid #ccc;}
.table-com tr{ border-bottom: 1px solid #ccc;}
.table-com tr th:first-child{ text-align: left;  border-left: 1px solid #ccc;}
.table-com tr th,.table-com tr td{ text-align: center; font-weight: bold; font-size: 11px; font-family: arial; padding: 5px; border-right: 1px solid #ccc;}
.table-com tr th.module{ background: #f3f3f3;}
.table-com tr th.sub-module{ background: #fff; color: #018F43; padding-left: 20px;}
.table-com .table-header th{ text-transform: uppercase; color: #fff; }
.table-com .table-header th:nth-child(2){ background: #88C136; border-right: 0; border-left:1px solid #88C136;}
.table-com .table-header th:nth-child(3){ background: #FF9400; border-right: 0;}
.table-com .table-header th:nth-child(4){ background: #00ACE2; border-right: 0;}
.table-com .table-header th:nth-child(5){ background: #FE81AB;}

.box{ width: 48.5%; float: left; margin-right: 10px; }
.box:last-child{ margin-right: 0;}
.box .boxHeader,.box .boxFooter{  padding: 5px; font:bold 12px arial;}
.box .boxHeader{ }
.box .boxBody{ height: 270px; }
.box .boxFooter{}

.hr{
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0));
    border: 0 none;
    height: 1px;
    margin: 22px 0;
}

.btn{background: linear-gradient(to bottom, #71E271 0%, #6AC56A 50%, #5CB85C 51%, #71E271 100%) repeat scroll 0 0 rgba(0, 0, 0, 0); }
.color-line{background: url('../img/colourfull-line.jpg') no-repeat top; height: 4px;}
.list-group .list-group-item{ font-size: 11px;}
a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus
a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus{background: linear-gradient(to bottom, #71E271 0%, #6AC56A 50%, #5CB85C 51%, #71E271 100%) repeat scroll 0 0 rgba(0, 0, 0, 0); border: 1px solid #6DD26D;}
/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {

}
/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) { }
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) { }
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) { }

#hlSiteWrapper{ padding-top: 3px;}

#topHeader .innerCon #headerCon{ padding: 5px 0;}
#topHeader .innerCon #headerCon img{ width: 120px;}

#hlSiteWrapper #topMenu .innerCon{ height: 60px; }
.disease-img{ float: left; width: 100px; height: 80px; margin: 0 15px 15px 0; border: 1px solid #666; border-radius: 3px; }
.disease-img:hover{ border: 1px solid #5CB85C;}

#hlSiteWrapper #banner{ margin: 5px 0; }
#hlSiteWrapper #banner .innerCon{ }
#hlSiteWrapper #banner .innerCon #banner_slider{ height: 250px; border: 1px solid #ccc; border-radius: 3px;}
#hlSiteWrapper #banner .innerCon .header1,#hlSiteWrapper #banner .innerCon .header2{ border-bottom: 1px solid #cfbf3a; margin: 0 0 10px 0; color: #5DBA5D; text-shadow:  0 1px 0px #fff; }
#hlSiteWrapper #banner .innerCon .col30{ min-height: 250px;  padding: 0 10px;}
#hlSiteWrapper #banner .innerCon .col30 .bannerBox{ background: #f2e579; height: 251px; text-align: center; border: 1px solid #cfbf3a; margin-bottom: 7px; border-radius: 3px;}


#makeAppointment{ background: #6CCE6C; background-position: 0 4px; border-top: 1px solid #e3e3e3; height: 41px;}
#searchCon{ padding: 5px 0; text-align: center; position: relative; z-index: 99;}
#searchCon input[type=text],#searchCon  select{ padding: 5px; font-size: 14px; width: 18%; border: 1px solid #ccc; border-radius: 3px; }
#doctorSearch select,#searchCon  select{ color: #777; background: url("images/ui-bg_glass_75_e6e6e6_1x400.png") repeat-x scroll 50% 50% #E6E6E6; width: 254px;}
#doctorSearch{ padding: 10px 0; background: rgba(110,215,110,.3); border-bottom: 1px solid #6BCD6B;}
#doctorSearch select{
    border: 1px solid #6BCD6B;
    border-radius: 5px;
    font-size: 11px;
    padding: 7px;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{ padding: 10px; width: 240px;}
.ui-widget .ui-widget{ font-size: 1.5em; border: 1px solid #6BCD6B;}
.custom-combobox {
    position: relative;
    display: inline-block;
    float: left;
}
.custom-combobox-toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    padding: 0;
    /* support: IE7 */
    *height: 1.7em;
    *top: 0.1em;
}
.custom-combobox-input {
    margin: 0;
    padding: 0.3em;
}
.inputSearch, .gender,#btnSearchDoctor{
    float: left;
    margin-right: 20px;
}
.gender{ width: 300px;}
.inputSearch .custom-combobox{
    width: 25%;
}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button{ padding: 7px;}
.inputSearch .custom-combobox input{float:left; }
.inputSearch .custom-combobox a{right: -185px;}

#featuredCon{ padding: 10px 0;}
.featuredBox{ width: 22.5%; float: left; margin: 0 20px 0 0; font-family: arial; border-bottom: 2px solid #5FBE5F; background: #fff; border-radius: 3px;}
.featuredBox:hover{ text-decoration: none;}
.featuredBox .boxBody{ line-height: 80px; text-align: center; }
.featuredBox .boxFooter{ line-height: 30px; text-align: center; display: block; font-size: 14px; font-weight: bold; color: #5FBE5F; transition: color .2s linear;}
.featuredBox:hover .boxFooter{ color: red; text-shadow: none; background-color: #e3e3e3;}

#docSearchResult{ margin-top: 20px;}
.content-left{ border:1px solid #6BCB6B;}
.doctorsInfo {
    padding: 5px;
    float: left; 
    width: 100%;
    border-bottom: 1px solid #ccc;
    margin: 0 0 20px 0;
    font-size: 11px;
}
.doctorsInfo:last-child{ border-bottom: 0;}
.docInfo{float: left; width: 50%;}
.docInfo h4{padding: 0; margin: 0; color: #5CB85C;}
.docInfo p{font-size: 11px; margin-bottom: 5px;}
.docInfo p.qualification{padding: 5px 0; font-size: 16px; color: #39B3D7;}
.docImg{float: left; margin: 0 10px 0 0 }
.docImg img{
    border: 1px solid #CCCCCC;
    padding: 4px;
}
.docInfo .siteLabel{ font-size: 11px; margin: 0px 10px 0 0; background: #e3e3e3; border-radius: 3px; border: 1px solid #ccc; padding: 3px;}
.linkBtn{float: right; width: 30%; text-align: center; position: relative; top: 20px; }
.linkBtn button{margin: 0px;}

#book_appointment_modal{ }
#book_appointment_modal .logo{ width: 100px; height: 100px;}
#book_appointment_modal .logo img{ width: 100px; margin: 0 10px 10px 0;}
#book_appointment_modal .orgDetails h1{ margin: 0;}
#book_appointment_modal .orgDetails div, #book_appointment_modal .orgDetails h1{ margin-left: 110px; }
#book_appointment_modal .modal_header{ padding: 10px; background: #5CB85C; color: #fff; margin: 0;}
#book_appointment_modal .modal_con{ border-bottom: 1px solid #ccc; padding: 10px;}

#doctor_slots{ margin-top: 30px;}
#doctor_slots .col70,#doctor_slots .col30{ height: 420px; overflow-y: auto;}
#doctor_slots .col70{ font-size: 11px; }
#doctor_slots .col30{ border: 0;}

#doctor_slots .col30 #docProfilePic{
    border: 1px solid #5CB85C;
    background: #83fe83; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #83fe83 0%, #5cb85c 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#83fe83), color-stop(100%,#5cb85c)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #83fe83 0%,#5cb85c 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #83fe83 0%,#5cb85c 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #83fe83 0%,#5cb85c 100%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #83fe83 0%,#5cb85c 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#83fe83', endColorstr='#5cb85c',GradientType=1 ); /* IE6-8 fallback on horizontal gradient */


}
#doctor_slots .col30 #docProfilePic img{ width: 100px; float: left; margin: 0 10px 10px 0;}
#doctor_slots .col30 #docProfilePic h1{ margin: 0; color: #fff;}
#doctor_slots .col30 #docProfilePic h2{ color: yellow; margin: 0; font-size: 16px; font-weight: bold;}
.calendar{ border: 0; font-size: 11px;}

.placeholder{ background: #fff; border: 1px solid #ccc; border-radius: 3px; padding: 10px; font-size: 11px; margin-top: 10px;}

#symptom_checker{ margin-top: 20px;}
#symptom_checker .col20, #symptom_checker .col60{height:450px;}
#symptom_checker .col20{ border: 1px solid #ccc; background: #e3e3e3;}
#symptom_checker .col20:first-child{ padding: 5px;}
#symptom_checker .col20:nth-child(2){ background: #f2f2f2; border-left: 0; width: 30%;}
#symptom_checker .col60{ overflow: auto; border: 1px solid #ccc; border-left: 0; width: 47%;}
#symptom_checker .col20:nth-child(2) #symptom-header{ padding: 3px 7px; font-size:12px; border-bottom: 1px solid #ccc;}
#symptom_checker .col20 .symptom-list,#symptom_checker .col60 .condition-list{ width: 100%; cursor: pointer;  font-size: 11px; padding: 5px;}
#symptom_checker .col20 .symptom-list h1,#symptom_checker .col60 #conditions h1{ padding: 10px 5px; border-bottom: 1px solid #ccc;}
#symptom_checker .col20 .form-control{ border-radius: 0px; border: 0; border-bottom: 1px solid #ccc; }
#symptom_checker .col20 #symptom{  overflow: auto; height: 380px;}
#symptom_checker .col20 .symptom-list a{ color: #333; display: block;}

#lftPan{ width: 60%; float: left; padding: 0 10px; border-right: 1px solid #e3e3e3;}
#rhtPan{ margin: 0 0 0 61%;}
#searchCondition{ padding: 5px 3px; border-bottom: 1px solid #e3e3e3;}
#conList{ max-height: 700px; overflow-y: auto; font-size: 11px;}

#rhtPan .rhtPanBox{min-height: 100px; max-height: 200px; overflow: auto; padding: 5px; margin-top: 10px; border-bottom: 1px solid #e3e3e3;}
#rhtPan .rhtPanBox h2{ margin: 0; padding: 0 0 10px 0;}
#rhtPan .rhtPanBox .list .glyphicon{ color: green;}
#rhtPan .rhtPanBox .list .glyphicon-remove{ color: red;}
#rhtPan .rhtPanBox .list{ color: #444;}

#siteFooter{ background: #fff; position: relative;  }
#siteFooter .innerCon{ height: 40px; border-top: 1px solid #ccc; font-size: 11px; padding: 10px 0;}

/*-------------------------------------------------------------------------------------------------------------*/

.container {
    width: 200px;
    height: 400px;
    position: relative;
    -webkit-perspective: 800px;
    -moz-perspective: 800px;
    -o-perspective: 800px;
    perspective: 800px;
}

#card {
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transition: -webkit-transform 1s;
    -moz-transition: -moz-transform 1s;
    -o-transition: -o-transform 1s;
    transition: transform 1s;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transform-origin: right center;
    -moz-transform-origin: right center;
    -o-transform-origin: right center;
    transform-origin: right center;

}

#card.flipped {
    -webkit-transform: translateX( -100% ) rotateY( -180deg );
    -moz-transform: translateX( -100% ) rotateY( -180deg );
    -o-transform: translateX( -100% ) rotateY( -180deg );
    transform: translateX( -100% ) rotateY( -180deg );
}

#card figure {
    display: block;
    height: 100%;
    width: 100%;
    line-height: 260px;
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: 140px;
    position: absolute;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
}
#card .back {
    -webkit-transform: rotateY( 180deg );
    -moz-transform: rotateY( 180deg );
    -o-transform: rotateY( 180deg );
    transform: rotateY( 180deg );
}


/*------------------*/
.example {
    -webkit-transition: all 0s ease-out;
    -moz-transition: all 0s ease-out;
    -o-transition: all 0s ease-out;
    -ms-transition: all 0s ease-out;
    transition: all 0s ease-out;
    line-height: 35px;
    display: block;
    font-family: Arial, "Helvetica", sans-serif;
    font-size: 14px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    text-shadow: 0px -1px 0px rgba(0,0,0,0.4);
    padding: 0px 20px 0;
    margin: 10px auto;
    left: 30px;
    position: relative;
    cursor: pointer;
    border: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
}

.facebook {
    border-left: solid 1px #2E4476;
    background: #3B5999;

    -webkit-box-shadow: 0px 5px 0px 0px #2E4476;
    box-shadow: 0px 5px 0px 0px #2E4476;
}

.twitter {
    border-left: solid 1px #269BD0;
    background: #46C1F6;

    -webkit-box-shadow: 0px 5px 0px 0px #269BD0;
    box-shadow: 0px 5px 0px 0px #269BD0;
}

.pinterest {
    border-left: solid 1px #C02B21;
    background: #DE463B;

    -webkit-box-shadow: 0px 5px 0px 0px #C02B21;
    box-shadow: 0px 5px 0px 0px #C02B21;
}

.yahoo {
    border-left: solid 1px #813781;
    background: #A948A9;

    -webkit-box-shadow: 0px 5px 0px 0px #813781;
    box-shadow: 0px 5px 0px 0px #813781;
}

.example:active {
    top: 3px;
}

.facebook:active {
    -webkit-box-shadow: 0px 2px 0px 0px #2E4476;
    box-shadow: 0px 2px 0px 0px #2E4476;
}

.twitter:active {
    -webkit-box-shadow: 0px 2px 0px 0px #269BD0;
    box-shadow: 0px 2px 0px 0px #269BD0;
}

.pinterest:active {
    -webkit-box-shadow: 0px 2px 0px 0px #C02B21;
    box-shadow: 0px 2px 0px 0px #C02B21;
}

.yahoo:active {
    -webkit-box-shadow: 0px 2px 0px 0px #813781;
    box-shadow: 0px 2px 0px 0px #813781;
}
.example:hover{ color: #e3e3e3; text-shadow: none; text-decoration: none;}
.example:before {
    content: "\f00c";
    width: 35px;
    height: 35px;
    display: block;
    position: absolute;
    padding-top: 10px;
    line-height: 20px;
    top: 0px;
    margin-left: -54px;
    font-size: 16px;
    font-family: FontAwesome;
    font-weight: bold;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.facebook:before {
    border-right: solid 1px #2E4476;
    background: #3B5999;

    -webkit-box-shadow: 0px 5px 0px 0px #2E4476;
    box-shadow: 0px 5px 0px 0px #2E4476;
}

.twitter:before {
    border-right: solid 1px #269BD0;
    background: #46C1F6;

    -webkit-box-shadow: 0px 5px 0px 0px #269BD0;
    box-shadow: 0px 5px 0px 0px #269BD0;
}

.pinterest:before {
    border-right: solid 1px #C02B21;
    background: #DE463B;

    -webkit-box-shadow: 0px 5px 0px 0px #C02B21;
    box-shadow: 0px 5px 0px 0px #C02B21;
}

.yahoo:before {
    border-right: solid 1px #813781;
    background: #A948A9;

    -webkit-box-shadow: 0px 5px 0px 0px #813781;
    box-shadow: 0px 5px 0px 0px #813781;
}

.example:active:before {
    top: -3px;
}

.facebook:active:before {
    -webkit-box-shadow: 0px 5px 0px 0px #2E4476, 6px 4px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 0px 0px #2E4476, 6px 4px 2px rgba(0,0,0,0.3);
}

.twitter:active:before {
    -webkit-box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 0px 0px #269BD0, 6px 4px 2px rgba(0,0,0,0.3);
}

.pinterest:active:before {
    -webkit-box-shadow: 0px 5px 0px 0px #C02B21, 6px 4px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 0px 0px #C02B21, 6px 4px 2px rgba(0,0,0,0.3);
}

.yahoo:active:before {
    -webkit-box-shadow: 0px 5px 0px 0px #813781, 6px 4px 2px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 0px 0px #813781, 6px 4px 2px rgba(0,0,0,0.3);
}


/*----------------------*/
.service {
    margin-bottom: 80px;
    float: left;
    margin: 10px !important;
    position: relative;
    width: 30%;
}

.service-icon {
    background: none repeat scroll 0 0 #D73300;
    border-radius: 50px;
    display: inline-block;
    float: left;
    height: 36px;
    margin-top: -9px;
    text-align: center;
    width: 36px;
}

.service-description {

}
.service-description h4 {
    border-bottom: 1px solid #5CB95C;
    color: #46C1F6;
    margin: 0;
    padding-bottom: 3px;
}

.service-description p {
    color: #666;
    margin: 19px 0 13px;
    padding-right: 10px;
}

.service ol,.service ul {
    background: #F1F1F1;
    height: 233px;
    list-style: none outside none;
    margin: 0;
    padding: 0 5px;
}
.service li {
    border-bottom: 1px dotted #CCCCCC;
    display: block;
    padding: 7px 0;
    font-size: 11px;
}
.service li :before{ content: "\f005"; font-family:FontAwesome; margin-right: 10px; color: #5FBE5F;}
.service li a{color: #269BD0; display: block;}

.media_img{
    float: left;
    margin-right: 5px;
}