﻿/*buttons*/
a.NextButtonOP
{
    background: transparent url(Images/OnlinePlanningImages/Buttons/volgende.png);
    background-repeat: no-repeat;
    width: 213px;
    height: 62px;
}

a.VerstuurButtonOP
{
    background: transparent url(Images/OnlinePlanningImages/Buttons/verstuur.png);
    background-repeat: no-repeat;
    width: 213px;
    height: 62px;
}

a.BackButtonOP
{
    background: transparent url(Images/OnlinePlanningImages/Buttons/Vorige.png);
    background-repeat: no-repeat;
    width: 213px;
    height: 62px;
}

a.CalendarBack
{
    background: transparent url(Images/OnlinePlanningImages/Buttons/calendarLeft.png);
    background-repeat: no-repeat;
    width: 20px;
    height:19px;
}

a.CalendarNext
{
    background: transparent url(Images/OnlinePlanningImages/Buttons/calendarRight.png);
    background-repeat: no-repeat;
    width: 20px;
    height:19px;
}

/*end buttons*/

/*Step1 ToolTip*/
.ServicesCornerTopLeftOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelLeftTop.png);
    background-repeat: no-repeat;
    width: 7px;
    height: 7px;
}

.ServicesCornerBottomLeftOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelLeftBottom.png);
    background-repeat: no-repeat;
    width: 7px;
    height: 7px;
}

.ServicesBorderLeftOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelLeftBgd.png);
    background-repeat: repeat-y;
    width: 7px;
    height: 1px;
}

.ServicesCornerTopRightOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelRightTop.png);
    background-repeat: no-repeat;
    width: 7px;
    height: 7px;
}

.ServicesCornerBottomRightOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelRightBottom.png);
    background-repeat: no-repeat;
    width: 7px;
    height: 7px;
}

.ServicesBorderRightOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelRightBgd.png);
    background-repeat: repeat-y;
    width: 7px;
    height: 1px;
}

.ServicesBorderBottomOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelBottomBgd.png);
    background-repeat: repeat-x;
    width: 1px;
    height: 10px;
}

.ServicesBorderTopOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/panelTopBgd.png);
    background-repeat: repeat-x;
    width: 1px;
    height: 7px;
}

.ServicesCornerUpwardsOP
{
    background-image: url(Images/OnlinePlanningImages/ToolTipStep1/cornerUpwards.png);
    background-repeat: no-repeat;
    width: 53px;
    height: 28px;
}
/*End Step1 ToolTip*/

/*title*/

.txtOPSmallBold
{
    font-size: 12px;
    color: #663A8A;
    text-decoration: none;
    font-weight: bold;
}

.txtTitleOP
{
    font-size: 14px;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
}

.titleHugeOP
{
    font-size: 16px;
    color: #000000;
    text-decoration: none;
    font-weight: bold;
}

.titleHugeOPRed
{
    font-size: 16px;
    color: Red;
    text-decoration: none;
    font-weight: bold;
}

/*Separators*/
.depth1
{
    background-image: url(Images/OnlinePlanningImages/Separators/depth1.png);
    background-repeat: no-repeat;
    width: 265px;
    height: 6px;
}

.depth2
{
    background-image: url(Images/OnlinePlanningImages/Separators/depth2.png);
    background-repeat: no-repeat;
    width: 320px;
    height: 6px;
}

.dividerRight
{
    background-image: url(Images/OnlinePlanningImages/Separators/divider.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 9px;
    height: 291px;
}

.tyreVerticalLine
{
    background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/TyreDetails/HorizontalLine.jpg);
    background-repeat: repeat-y;
    background-position: center;
    width: 1px;
}

.tyreHr
{
	background-image: url(http://www.profileimages.nl/images/profiletyrecenter2010/images/TyreDetails/HorizontalLine.jpg);
	background-repeat: repeat-x; /*background-position: center;*/
	background-position: center;
	height: 1px;
	padding-top: 5px;
	padding-bottom: 5px;
}

/* tyre image*/
.tyresearchSmallOP
{
    background-image: url('Images/OnlinePlanningImages/tyre.png');
    background-repeat: no-repeat;
    width: 274px;
    height: 90px;
}

/*end Tyre image*/

/*

 White panel 

*/
.WhitePanel {
 position:relative;
 margin:0px auto;
 min-width:8em;
 max-width:970px; /* based on image dimensions - not quite consistent with drip styles yet */
 z-index:1;
 margin-left:6px; /* default, width of left corner */
 margin-bottom:0px; /* spacing under dialogLight */
}

.WhitePanel .contentShow,
.WhitePanel .t,
.WhitePanel .b,
.WhitePanel .b div {
 background:transparent url(http://www.profileimages.nl/images/profiletyrecenter2010/images/Panels/WhitePanel.png) no-repeat top right; 
}

.WhitePanel .contentShow {
 position:relative;
 zoom:1;
 _overflow-y:hidden;
 padding: 0px 6px 0px 0px;
}

.WhitePanel .t {
 /* top+left vertical slice */
 position:absolute;
 left:0px;
 top:0px;
 width:6px; /* top slice width */
 margin-left:-6px;
 height:100%;
 _height:1600px; /* arbitrary long height, IE 6 */
 background-position:top left;
}

.WhitePanel .b {
 /* bottom */
 position:relative;
 width:100%;
}

.WhitePanel .b,
.WhitePanel .b div {
 height:4px; /* height of bottom cap/shade */
 font-size:1px;
}

.WhitePanel .b {
 background-position:bottom right;
}

.WhitePanel .b div {
 position:relative;
 width:6px; /* bottom corner width */
 margin-left:-6px;
 background-position:bottom left;
}

.WhitePanel .hd,
.WhitePanel .bd,
.WhitePanel .ft {
 position:relative;
}

.WhitePanel .wrapper {
 /* extra content protector - preventing vertical overflow (past background) */
 position:static;
 max-height:1000px;
 overflow:auto; /* note that overflow:auto causes a rather annoying redraw "lag" in Firefox 2, and may degrade performance. Might be worth trying without if you aren't worried about height/overflow issues. */
}

.WhitePanel h1,
.WhitePanel p {
 margin:0px; /* margins will blow out backgrounds, leaving whitespace. */
 padding:0.5em 0px 0.5em 0px;
}

.WhitePanel h1 {
 padding-bottom:0px;
}

/*End WhitePanel*/




/*old*/
.contentTopOP
{
    height: 10px;
    background-image: url('Images/OnlinePlanning/topContentBackground.png');
    background-repeat: no-repeat;
}

.contentOP
{
    background-image: url('Images/OnlinePlanning/contentMiddleBackground.png');
    background-repeat: repeat-y;
}

.contentBottomOP
{
    height: 20px;
    background-image: url('Images/OnlinePlanning/bottomContentBackground.png');
    background-repeat: no-repeat;
}

.HorizontalLine
{
    background-image: url(      "Images/OnlinePlanning/lineDot.jpg" );
    background-repeat: repeat-x;
    background-position: center;
    height: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.VerticalLine
{
    background-image: url(      "Images/OnlinePlanning/lineDot.jpg" );
    background-repeat: repeat-y;
    background-position: center;
    height: 1px;
    padding-top: 5px;
    padding-bottom: 5px;
}

.OPTabSelected
{
    font-size: 17px;
    color: Black;
    padding-top: 0px;
    text-align: center;
    width: 210px;
    height: 42px;
    cursor: pointer;
    font-weight: bold;
    vertical-align: middle;
}

.OPTab
{
    font-size: 16px;
    color: #696969;
    width: 210px;
    height: 42px;
    text-align: center;
    cursor: pointer;
}

/* New appointment, Step3 - Calendar */
.MonthViewCalendarDaysTop
{
    width: 39px;
    font-size: 12px;
}
.MonthViewCalendarItem
{
    height: 39px;
    padding-bottom: 0px;
    border-right: solid 1px #E3E3E3 !important;
    border-bottom: solid 1px #E3E3E3 !important;
    width: 39px;
    font-weight: bold;
    text-align: center;
}

.MonthViewItemColorGreen
{
    height: 39px;
    padding-bottom: 0px;
    border-right: solid 1px #E3E3E3 !important;
    border-bottom: solid 1px #E3E3E3 !important;
    width: 39px;
    text-align: center;
    color: White;
    font-weight: bold;
    background-color: #ABC541;
    cursor: pointer;
}

.MonthViewItemColorRed
{
    height: 39px;
    padding-bottom: 0px;
    border-right: solid 1px #E3E3E3 !important;
    border-bottom: solid 1px #E3E3E3 !important;
    width: 39px;
    text-align: center;
    color: #626262;
    font-weight: bold;
    background-color: #ffffff;
}

.MonthViewItemCurrentDayColor
{
    height: 39px;
    padding-bottom: 0px;
    background-image: url('Images/OnlinePlanningImages/selected.png');
    border-right: solid 1px #663A8A !important;
    border-bottom: solid 1px #663A8A !important;
    background-repeat: no-repeat;
    background-position:center;
    width: 39px;
    text-align: center;
    color: #626262;
    font-weight: bold;
    background-color: #663A8A;
}

.MonthViewItemSelectedDayColor
{
    height: 39px;
    padding-bottom: 0px;
    border-right: solid 1px #E3E3E3 !important;
    border-bottom: solid 1px #E3E3E3 !important;
    width: 39px;
    text-align: center;
    color: White;
    font-weight: bold;
    background-color: #663A8A;
}

.MonthViewColorGreen
{
    background-color: #ABC541;
    color: #ABC541;
}

.MonthViewColorRed
{
    background-color: #ffffff;
    color: #663A8A;
}

DIV.PopUpPanelForTimeIntervals
{
    /*position: absolute;     top: 150px;     left: 250px;*/
    width: 63px; 
    background-color: #b6ce2e; 
    min-height:291px; 
    
   /* border-bottom: solid 1px #E3E3E3;       	Style="width: 250px; height: 250px;             background-color: #DDDDDD; position: absolute; top: 400px; left: 420px;" */
}
.PopUpPanelTimeIntervals
{
    /* padding-left: 10px;*/
    font-size:11px;
    height:15px;
    color:#ffffff;
    border-bottom: solid 1px #E3E3E3;
    cursor:pointer;
    color:White;
}

.PopUpPanelTimeIntervalsSelected
{
    width: 63px; 
    height:15px;
    background-color: #663A8A;     
    border-bottom: solid 1px #E3E3E3;   
    color:White;
}

.Step3ActiveTimeInterval
{

}
.Step3InactiveTimeInterval
{
    color: #999999;
}



.TableNoLines
{
    /*border-style: none !important;*/
    border-style: none;
    border-collapse: collapse;
}
.TableNoLines TD
{
    border-style: none;
    border-collapse: collapse;
}

.megaMenuTop
{
    height: 13px;
    width: 707px;
    background-image: url('Images/Menu/megaMenuTop.png');
    background-repeat: no-repeat;
}

.megaMenuContent
{
    height: 1px;
    width: 707px;
    background-image: url('Images/Menu/megaMenuContent.png');
    background-repeat: repeat-y;
}

.megaMenuBottom
{
    height: 16px;
    width: 707px;
    background-image: url('Images/Menu/megaMenuBottom.png');
    background-repeat: no-repeat;
}

.megaMenuBoder
{
    height: 1px;
    background-color: #A56800;
    background-repeat: repeat-x;
}

.SearchBackgroundLeft
{
    height: 33px;
    width: 8px;
    background-image: url('Images/Menu/SearchL.png');
    background-repeat: no-repeat;
}
.SearchBackground
{
    height: 33px;
    width: 1px;
    background-image: url('Images/Menu/Search.png');
    background-repeat: repeat-x;
}
.SearchBackgroundRight
{
    height: 33px;
    width: 8px;
    background-image: url('Images/Menu/SearchR.png');
    background-repeat: no-repeat;
}
/* END New appointment */

.txtLabelError
{
    font-size: 12px;
    color: red;
    text-decoration: none;
}

.PaddingBottom10
{
    padding-bottom:10px;
}
.PaddingTop5
{
    padding-top: 5px;
}

.PaddingTop10
{
    padding-top: 10px;
}
.PaddingLeft10
{
    padding-left: 10px;
}
.PaddingRight10
{
    padding-right:10px;
}
.PaddingTop15
{
    padding-top:15px;
}
.PaddingLeft20 
{
    padding-left:20;
}
.PaddingRight20
{
    padding-right:20px;
}
.btnMovLeft
{
    background-image: url('Images/Buttons/btnLeft.png');
    background-repeat: no-repeat;
    cursor:pointer;
    width:4px;
    height:33px;
}
.btnMovRight
{
    background-image: url('Images/Buttons/btnRight.png');
    background-repeat: no-repeat;
    cursor:pointer;
    width:6px;
    height:33px;
}
.btnMovBody
{
    background-image: url('Images/Buttons/btnBody.png');
    background-repeat: repeat-x;
    cursor:pointer;
    width:1px;
    height:33px;
    text-align:center;
    text-transform:uppercase;
    color:White;
    font-size:12px;
    padding:0px 20px 0 px 20px;
    
}
.commentTop
{
    background-image: url('Images/Panels/commentsTop.png');
    background-repeat: no-repeat;
    width:642px;
    height:12px;
}

.commentBottom
{
     background-image: url('Images/Panels/commentsBottom.png');
    background-repeat: no-repeat;
    width:642px;
    height:12px;
}

.commentBody
{
    background-image: url('Images/Panels/commentsBody.png');
    background-repeat: repeat-y;
    width:642px;
    height:1px;
}
.noUnderline
{
    text-decoration:none;
}
.dopImagesBody
{
    height:130px;
    width:2px;
    background-image: url('Images/Panels/dienstBody.png');
    background-repeat: repeat-x;
}
.dopImagesLeft
{
    height:130px;
    width:6px;
    background-image: url('Images/Panels/dienstLeft.png');
    background-repeat:no-repeat;
}
.dopImagesRight
{
    height:130px;
    width:6px;
    background-image: url('Images/Panels/dienstRight.png');
    background-repeat: no-repeat;
}
.dopImagesBody85
{
    height:85px;
    width:2px;
    background-image: url('Images/Panels/dienstBody85.png');
    background-repeat: repeat-x;
}
.dopImagesLeft85
{
    height:85px;
    width:6px;
    background-image: url('Images/Panels/dienstLeft85.png');
    background-repeat:no-repeat;
}
.dopImagesRight85
{
    height:85px;
    width:6px;
    background-image: url('Images/Panels/dienstRight85.png');
    background-repeat: no-repeat;
}
.dividerleft /* fix divider arrov transparency issue */
{
    background-image: url(Images/OnlinePlanningImages/Separators/dividerleft.png);
    background-repeat: no-repeat;
    position: absolute;
    width: 9px;
    height: 291px;
}
.calendarBkgr /*calendar background*/
{
	vertical-align: top;
	height: 100%;
	background-color: #faf2ff;
}
.calendarHourBkgr /*hour background*/
{
    height: 100%; 
    background-color: #b6ce2e; 
    margin-left: 1px; 
    padding-top: 10px;
    width: 63px;
}

/*Date and time*/
.DateTimeDopLeftOP
{
    background-image:url(Images/OnlinePlanningImages/DateTime/tijdDopLeft.png);
    background-repeat:no-repeat;
    width:15px;
    height: 14px;
}

.DateTimeBgdOP
{
    background-image:url(Images/OnlinePlanningImages/DateTime/tijdBgd.png);
    background-repeat:repeat-x;
    height: 37px;
}

.DateTimeSeparatorOP
{
    background-image:url(Images/OnlinePlanningImages/DateTime/tijdBar.png);
    background-repeat:no-repeat;
    width:1px;
    height: 37px;
}

.DateTimeClockOP
{
    background-image:url(Images/OnlinePlanningImages/DateTime/tijdClock.png);
    background-repeat:no-repeat;
    width:15px;
    height: 16px;
}

.DateTimeDopRightOP
{
    background-image:url(Images/OnlinePlanningImages/DateTime/tijdDopRight.png);
    background-repeat:no-repeat;
    width:5px;
    height: 37px;
}
/*end DateTime*/

