﻿.whiteBox {
    background-color: white;
    border: 1px solid #aaacaf;
    padding: 10px;
    margin-top: 10px;
    -webkit-box-shadow: 4px 7px 22px -1px rgba(103,106,112,1);
    -moz-box-shadow: 4px 7px 22px -1px rgba(103,106,112,1);
    box-shadow: 4px 7px 22px -1px rgba(103,106,112,1);
}

.smsTip {
    width: 400px;
    background-color: white;
    font-size: 13px;
    font-family: Calibri;
    border: 1px solid #eae4e4;
}

    .smsTip td {
        padding: 5px;
    }
/*-------------- My Library -----------------------------*/
.blHead1 {
    background: #FC0;
    color: #f60;
    padding: 4px;
    text-align: center;
    margin: auto;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 14px;
}

.blHead2 {
    background: #faeb86;
    color: #f60;
    padding: 4px;
    text-align: center;
    margin: auto;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
}

* {
    margin: 0px;
    padding: 0px;
}

.header {
    height: 70px;
    background-color: #336699;
}

.container {
    width: 100%;
}

.left {
    float: left;
    width: 13.4%;
    vertical-align: top;
    height: 800px;
    border-right: 1px solid;
    border-right-style: solid;
    border-right-width: 1px;
    border-right-color: #E6E6E6;
}

.middle {
    width: 66.3%;
    float: left;
    vertical-align: top;
    background-color: #F9F9F9;
}

.right {
    float: right;
    width: 20%;
    vertical-align: top;
    border-left-style: solid;
    border-left-width: 1px;
    border-left-color: #E6E6E6;
}

.default {
    font-family: Calibri;
    font-size: 16px;
    color: #0099CC;
    width: 400px;
    border-radius: 10px;
    padding: 20px;
    border: 1px solid #0099CC;
}

.text {
    font-family: Calibri;
    font-size: 16px;
    color: #0099CC;
}

#top-user-menu {
    top: 5.5%;
    position: absolute;
    left: 70%;
}

#logo {
    font-size: 50px;
    font-weight: bold;
    letter-spacing: 2px;
    font-family: calibri;
    padding-left: 50px;
    color: White;
    float: left;
    width: 300px;
}

#bsr {
    font-family: Calibri;
    font-size: 12px;
    color: #DBDBDB;
    float: right;
    padding: 20px;
}

#middle-content {
    height: 800px;
    overflow: auto;
}

#innerRight {
    height: 800px;
    overflow: auto;
}

/*------------------ Chart Style ---------------------------------*/
.Chart {
    font-family: Arial;
    font-size: 8px !Important;
    background-color: transparent;
}

fieldSet {
    font-family: Arial;
    font-size: 12px;
    color: #6f6666;
    font-weight: normal;
    border: 1px solid #B6B4B4;
    border-radius: 5px;
    margin: 10px;
    padding: 10px;
}

legend {
    margin: 0 10px;
    padding: 0 5px;
}

/*--------------------- Gridview Style --------------------------*/
.rows {
    background-color: #E3EAEB;
    text-align: left;
    font-family: Calibri;
    font-size: 15px;
}

    .rows:Hover {
        background-color: yellow;
    }

.AlternateRows {
    background-color: White;
    text-align: left;
    font-family: Calibri;
    font-size: 15px;
}

    .AlternateRows:Hover {
        background-color: yellow;
    }

.GridHeader {
    text-align: center;
    background-color: #5A799C;
    font-weight: normal;
    font-family: Calibri;
    font-size: 14px;
    Border-Color: black;
    Border-Style: Solid;
    Border-Width: 1px;
    Color: White;
}

.GridAnchor {
    font-family: calibri;
    font-weight: bold;
    font-size: 14px;
    color: #0000FF;
    text-decoration: underline;
}

    .GridAnchor:hover {
        color: white;
        background-color: Maroon;
    }

.padRight5 {
    padding-right: 5px;
}

.padRight10 {
    padding-right: 10px;
}

.padBoth5 {
    padding-right: 5px;
    padding-left: 5px;
}
/*--------------------------------General Css--------------------*/
#PriceQuote {
    z-index: 1000000 !important;
    border: 10px solid #D7D7D7;
    padding: 10px;
    font-family: arial;
    font-size: 12px;
    background-color: #F9F9F9;
    width: 400px !important;
    height: 120px !important;
    top: 100px;
    left: 200px;
    border-radius: 10px;
    display: none;
    position: absolute;
    box-shadow: 0 0 15px #000;
}

#Search_Container {
    width: 100%;
    margin: auto;
}

#Search_MainImage {
    width: 350px;
    height: 300px;
    float: left;
    overflow: hidden;
    padding: 5px;
}

    #Search_MainImage img {
        width: 345px;
        height: 295px;
        border: 0px;
        text-decoration: none;
    }

#Search_Detail {
    width: 330px;
    height: 300px;
    float: right;
    overflow: hidden;
    padding: 5px;
}

#Search_icon {
    width: 350px;
    height: 65px;
    float: left;
    padding: 3px;
    overflow: auto;
    padding: 5px;
}

    #Search_icon img {
        width: 70px;
        height: 50px;
        border: 0px;
        text-decoration: none;
        margin: 5px;
        overflow: auto;
    }

#Specifications {
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    position: relative;
    margin-bottom: 70px;
}

#PriceQuote {
    z-index: 100;
    border: 10px solid #D7D7D7;
    padding: 10px;
    font-family: arial;
    background-color: #F9F9F9;
    width: 500px;
    height: 450px;
    top: 50px;
    left: 330px;
    border-radius: 10px;
    display: none;
    position: absolute;
    box-shadow: 0 0 15px #000;
}

#pqheading {
    margin: -9px;
    padding-left: 5px;
    background-color: Gray;
    height: 30px;
    padding-top: 5px;
    color: White;
    font: 20px Calibri Bold;
}

#cutbutton {
    float: right;
    margin-top: -40px;
    margin-right: -40px;
    cursor: pointer;
}

#newcars {
    padding: 10px;
    width: 700px;
    overflow: hidden;
    border: 1px solid gray;
    background-color: White;
}

#newcardetail {
    width: 100%;
}

    #newcardetail img {
        padding-bottom: 0px;
        margin-right: 5px;
        float: left;
        position: relative;
        height: 60px;
        width: 116px;
    }

#cart_image {
    width: 280px;
    overflow: auto;
}


.RequiredField {
    color: red;
    font-family: Calibri;
    margin-left: 1px;
}

.BoxHeading {
    font-family: arial;
    font-size: 13px;
    font-weight: bold;
    padding: 3px;
    color: #FFFFFF;
    background-color: #666666;
    text-align: left;
    margin-top: -15px;
    border-radius: 5px 5px 0 0;
    height: 20px;
}

.BlueHeading {
    font-family: arial;
    font-size: 13px;
    padding: 3px;
    color: #FFFFFF;
    background-color: #0099FF;
    text-align: center;
    height: 22px;
}

.plainBoxHeading {
    height: 25px !important;
    font-family: arial;
    font-size: 14px;
    font-weight: bold;
    color: #F7F7F7;
    background-color: #666666;
    text-align: center;
}

.MsgPanel {
    cursor: move;
    margin: -10px;
    height: 18px;
    border: 1px solid #000000;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 14px;
    font-weight: bold;
    padding: 3px;
    color: #FFFFFF;
    background-color: #4467B0;
    border-radius: 3px 3px 0px 0px;
}

.Button {
    text-decoration: none;
    background-image: url('../images/btnBg.png');
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin: 5px;
    border: 1px solid Gray;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 12px;
    font-weight: bold;
    padding: 3px;
    color: #000000;
    border-radius: 7px;
    cursor: pointer;
    background-color: #DAE7E1;
}

.grayButton {
    text-decoration: none;
    padding: 2px 8px !important;
    margin: 2px;
    border: 1px solid #a8cbe4;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 14px;
    color: black;
    background-color: #a8cbe4;
    background-image: linear-gradient(#a8cbe4,#71b2e1,#a8cbe4);
    border-radius: 3px;
    height: 24px;
    width: auto;
}

.BlueButton {
    text-decoration: none;
    padding: 2px 8px !important;
    margin: 2px;
    border: 1px solid #699ed5;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 14px;
    color: #F4F4F4;
    cursor: pointer;
    background-image: linear-gradient(#699ed5,#356BA2,#699ed5);
    border-radius: 3px;
    height: 26px;
    width: auto;
}

    .BlueButton:Hover {
        background-color: #3F7EBE;
        box-shadow: 0 0 10px #aaa;
    }

.grayButton:Hover {
    background-color: #bcd4e6;
    box-shadow: 0 0 5px #aaa;
}

.RedButton {
    text-decoration: none;
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin: 5px;
    border: 1px solid Maroon;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 14px;
    font-weight: bold;
    padding: 3px;
    color: White;
    cursor: pointer;
    background-color: Red;
    height: 30px;
}

.ResSearchButton {
    padding-left: 10px !important;
    padding-right: 10px !important;
    margin: 5px;
    border: 1px solid Maroon;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 12x;
    font-weight: bold;
    color: White;
    cursor: pointer;
    background-color: Red;
}

.PagingButton {
    padding: 0px 2px 0px 2px;
    border: 1px solid Maroon;
    text-align: center;
    vertical-align: middle;
    font-family: arial;
    font-size: 12px;
    font-weight: bold;
    color: White;
    cursor: pointer;
    background-color: Red;
}

.Button:Hover {
    background-color: #D5F7FF;
    box-shadow: 0 0 10px #aaa;
}

.input:hover {
    background-color: #FFDFDF;
}

.PlainHeading {
    font-family: arial;
    font-size: 14px;
    color: #FFFFFF;
    background: #3b5998;
    margin: -3px;
    padding: 5px;
    height: 20px;
    text-align: center;
}
/*.heading{font-family: arial;font-size: 16px;color: #FFFFFF;background:#0099CC; padding:3px; height:14px; text-align:center; letter-spacing:1px;}*/
.heading {
    height: 25px;
    width: auto;
    text-align: center;
    font-size: 22px;
    font-family: Calibri;
    background: #b2cfe2;
}

.GradientHeading {
    height: 25px;
    width: auto;
    text-align: center;
    font-size: 22px;
    font-family: Calibri;
    background-image: linear-gradient(#078eef,#c7e5f9);
}

.BlueText {
    font-family: calibri;
    font-size: 14px;
    color: #0066CC;
}

cutbutton {
    float: right;
    margin-top: -40px;
    margin-right: -40px;
    cursor: pointer;
}

#Enquiry {
    z-index: 100;
    border: 10px solid #D7D7D7;
    padding: 10px;
    font-family: arial;
    background-color: #F9F9F9;
    width: 500px;
    height: 450px;
    top: 50px;
    left: 330px;
    border-radius: 10px;
    display: none;
    position: absolute;
    box-shadow: 0 0 15px #000;
}

.input {
    border: 1px solid #C0C0C0;
    padding-left: 1px;
    margin: 2px;
    border-radius: 4px;
    outline: none;
    height: 25px;
    width: 250px;
}

.inputLabel{
    font-family:Calibri;
    font-size:14px; 
    text-align:right;
}

.watermarked {
    border: 1px solid #C0C0C0;
    background-color: #F0F8FF;
    color: gray;
    padding-left: 1px;
    margin: 2px;
    border-radius: 3px;
    outline: none;
}

.modalBackground {
    background-color: Gray;
    filter: alpha(opacity=70);
    opacity: 0.7;
}

.modalPopup {
    border: 4px solid #DFDFDF;
    background-color: #ffffdd;
    padding: 3px;
    width: 250px;
    font-size: 14px;
    border-radius: 8px;
}

    .modalPopup p {
        padding: 5px;
        font-size: 14px;
        text-align: center;
    }

.popupControl {
    background-color: White;
    position: absolute;
    visibility: hidden;
}

.ratingStar {
    font-size: 0pt;
    width: 13px;
    height: 12px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;
}

.filledRatingStar {
    background-image: url(../images/FilledStar.png);
}

.emptyRatingStar {
    background-image: url(../images/EmptyStar.png);
}

.savedRatingStar {
    background-image: url(../images/SavedStar.png);
}

h3 {
    font-size: 16px;
    height: 25px;
}

.clear {
    clear: both;
}

.clear5 {
    clear: both;
    height: 5px;
}

.clear10 {
    clear: both;
    height: 10px;
}

.clear15 {
    clear: both;
    height: 15px;
}

.clear20 {
    clear: both;
    height: 20px;
}

.clear25 {
    clear: both;
    height: 25px;
}

.clear30 {
    clear: both;
    height: 30px;
}

.anchor {
    color: White;
    font-family: Arial;
    font-size: 14px;
    text-decoration: none;
    font-weight: bold;
}

    .anchor:hover {
        color: #FFFF1A;
        text-decoration: underline;
    }

a img {
    border-style: none;
    border-color: inherit;
    border-width: medium;
}

/*-------------------------------End General Css----------------------*/

/************ PasswordStrength Related Styles ***********************/
.TextIndicator_TextBox1 {
    background-color: Gray;
    color: White;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
}

.BarIndicator_TextBox2_weak {
    color: Red;
    background-color: Red;
}

.BarIndicator_TextBox2_average {
    color: Blue;
    background-color: Blue;
}

.BarIndicator_TextBox2_good {
    color: Green;
    background-color: Green;
}

.BarBorder_TextBox2 {
    padding: 1px;
    width: 300px;
    height: 10px;
    vertical-align: middle;
}

.TextIndicator_TextBox3 {
    background-color: Blue;
    color: Yellow;
    font-size: small;
    font-variant: small-caps;
    padding: 1px;
}

.TextIndicator_TextBox3_Handle {
    width: 16px;
    height: 14px;
    background-image: url(images/Question.png);
    overflow: hidden;
    cursor: help;
}

.TextIndicator_TextBox1_Strength1 {
    background-color: Gray;
    color: White;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
    font-weight: bold;
}

.TextIndicator_TextBox1_Strength2 {
    background-color: Gray;
    color: Yellow;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
    font-weight: bold;
}

.TextIndicator_TextBox1_Strength3 {
    background-color: Gray;
    color: #FFCAAF;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
    font-weight: bold;
}

.TextIndicator_TextBox1_Strength4 {
    background-color: Gray;
    color: Aqua;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
    font-weight: bold;
}

.TextIndicator_TextBox1_Strength5 {
    background-color: Gray;
    color: #93FF9E;
    font-family: Arial;
    font-size: x-small;
    font-style: italic;
    padding: 1px;
    font-weight: bold;
}

.hoverStyle {
    padding: 5px;
    border: 1px solid #996633;
    background: #FFFF99;
    font-family: calibri;
    font-size: 17px;
    font-style: italic;
    color: #333333;
    width: 260px;
}

.dropdown {
    border: 1px;
    border-style: solid;
    border-color: Gray;
}

#SearchHeight {
    height: 50px;
    overflow: auto;
}

.ui-autocomplete {
    max-height: 380px;
    overflow-y: auto; /* prevent horizontal scrollbar */
    overflow-x: hidden;
}
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 100px;
}


/*---------------- calendar theme 1 ----------------------*/
.Calendar1 .ajax__calendar_container {
    border: 1px solid #646464;
    background-color: #0099CC;
    color: #FFFFFF;
    border-radius: 5px;
    font-size: 12px;
}

.Calendar1 .ajax__calendar_other .ajax__calendar_day, .Calendar1 .ajax__calendar_other .ajax__calendar_year {
    color: black;
}

.Calendar1 .ajax__calendar_hover .ajax__calendar_day, .Calendar1 .ajax__calendar_hover .ajax__calendar_month, .Calendar1 .ajax__calendar_hover .ajax__calendar_year {
    color: black;
}

.Calendar1 .ajax__calendar_active .ajax__calendar_day, .Calendar1 .ajax__calendar_active .ajax__calendar_month, .Calendar1 .ajax__calendar_active .ajax__calendar_year {
    color: black;
    font-weight: bold;
}
/*---------------- calendar theme 2 ----------------------*/
.Calendar2 .ajax__calendar_container {
    background-color: #FF9900;
    border: 1px solid #DEF1F4;
}

.Calendar2 .ajax__calendar_header {
    background-color: #DEF1F4;
    margin-bottom: 4px;
}

.Calendar2 .ajax__calendar_other .ajax__calendar_day, .Calendar2 .ajax__calendar_other .ajax__calendar_year {
    color: #fff;
}

.Calendar2 .ajax__calendar_title, .Calendar2 .ajax__calendar_next, .Calendar2 .ajax__calendar_prev {
    color: #004080;
    padding-top: 3px;
}

.Calendar2 .ajax__calendar_body {
    background-color: #DEF1F4;
    border: solid 1px #77D5F7;
}

.Calendar2 .ajax__calendar_dayname {
    text-align: center;
    font-weight: bold;
    margin-bottom: 4px;
    margin-top: 2px;
    color: #004080;
}

.Calendar2 .ajax__calendar_day {
    color: #004080;
    text-align: center;
}

.Calendar2 .ajax__calendar_hover .ajax__calendar_day, .Calendar2 .ajax__calendar_hover .ajax__calendar_month, .Calendar2 .ajax__calendar_hover .ajax__calendar_year,
.Calendar2 .ajax__calendar_active {
    color: #004080;
    font-weight: bold;
    background-color: #DEF1F4;
}

.Calendar2 .ajax__calendar_today {
    font-weight: bold;
}

.Calendar2 .ajax__calendar_hover .ajax__calendar_today, .Calendar2 .ajax__calendar_hover .ajax__calendar_title {
    color: #333333;
}
/*---------------- calendar theme 3----------------------*/
.Calendar3 {
    background-color: OrangeRed;
    color: Snow;
    border: solid 1px Orange;
}

    .Calendar3 .ajax__calendar_days {
        background-color: DarkOrange;
        color: White;
    }

    .Calendar3 .ajax__calendar_day {
        background-color: MediumSeaGreen;
        font-style: italic;
        font-family: Courier;
    }

    .Calendar3 .ajax__calendar_header {
        background-color: DeepPink;
    }

    .Calendar3 .ajax__calendar_other .ajax__calendar_day, .Calendar3 .ajax__calendar_other .ajax__calendar_year {
        color: black;
    }
/*---------------- calendar theme 4 ----------------------*/
.Calendar4 .ajax__calendar_container {
    background-color: #F9FFFA;
    border: 1px solid #B0DEE3;
    border-radius: 7px;
}

.Calendar4 .ajax__calendar_header {
    background-color: #00BBF9;
    border-radius: 3px;
    margin-bottom: 4px;
}

.Calendar4 .ajax__calendar_other .ajax__calendar_day, .Calendar4 .ajax__calendar_other .ajax__calendar_year {
    color: #00CCFF;
}

.Calendar4 .ajax__calendar_title, .Calendar4 .ajax__calendar_next, .Calendar4 .ajax__calendar_prev {
    color: #004080;
    padding-top: 3px;
}

.Calendar4 .ajax__calendar_body {
    background-color: #EAF7FF;
    border-radius: 3px;
}

.Calendar4 .ajax__calendar_dayname {
    text-align: center;
    font-weight: bold;
    margin-bottom: 4px;
    margin-top: 2px;
    color: #004080;
}

.Calendar4 .ajax__calendar_day {
    color: #004080;
    text-align: center;
}

.Calendar4 .ajax__calendar_hover .ajax__calendar_day, .Calendar4 .ajax__calendar_hover .ajax__calendar_month, .Calendar4 .ajax__calendar_hover .ajax__calendar_year, .Calendar4 .ajax__calendar_active {
    color: #004080;
    font-weight: bold;
    background-color: #00BBF9;
    border-radius: 5px;
}

.Calendar4 .ajax__calendar_today {
    font-weight: bold;
    background-color: #00BBF9;
    border-radius: 3px;
}

.Calendar4 .ajax__calendar_hover .ajax__calendar_today, .Calendar4 .ajax__calendar_hover .ajax__calendar_title {
    color: #333333;
}
/*--------------------------- MyCalendar --------------------*/
.MyCalendar .ajax__calendar_container {
    border: 1px solid #646464;
    background-color: lemonchiffon;
    color: red;
}

.MyCalendar .ajax__calendar_other .ajax__calendar_day, .MyCalendar .ajax__calendar_other .ajax__calendar_year {
    color: black;
}

.MyCalendar .ajax__calendar_hover .ajax__calendar_day, .MyCalendar .ajax__calendar_hover .ajax__calendar_month,
.MyCalendar .ajax__calendar_hover .ajax__calendar_year {
    color: black;
}

.MyCalendar .ajax__calendar_active .ajax__calendar_day, .MyCalendar .ajax__calendar_active .ajax__calendar_month,
.MyCalendar .ajax__calendar_active .ajax__calendar_year {
    color: black;
    font-weight: bold;
}

.modalDialog {
    position: fixed;
    font-family: Arial, Helvetica, sans-serif;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(0,0,0,0.8);
    z-index: 0;
    opacity: 0.5;
    -webkit-transition: opacity 400ms ease-in;
    -moz-transition: opacity 400ms ease-in;
    transition: opacity 400ms ease-in;
    pointer-events: painted;
}

.legend {
    font-family: Calibri;
    font-size: 18px;
}
