﻿/*MasterPage*/

/*General Settings*/
body
{
    width: 742px;
}
body, select, textarea { font: 12px Calibri, Verdana; }
a, a:visited { text-decoration:none; color:#8a1e04; }
a:hover, a:active { text-decoration:underline; }
h1 { font-size: 36px; color: #000; }
h2 { font-size: 15px; color: #000; }
p { font-size: 14px; color: #000; }
.enhanceText {color: #74646e; }/*special header text*/


/*Structure*/
.container{width: 100%; }


#header {  border:0px red solid; background: url("images/TopBar.PNG") repeat-x 0 bottom; height: 72px; width: 100%; margin-bottom: 0px;border-top: 5px solid #C8BFC4;}
#header .logo {background: url("images/Family Logo for iCarol.png") no-repeat; float: left; height: 72px; width: 742px;} 

#topbar
{
    background-color: #C8BFC4;
    position: relative;
    width: 100%;
    height: 49px;
    color: #333333;
    font-size: 14px;
    font-weight: bold;
    background: -moz-linear-gradient(top,  #fff0ad 100%, #fff0ad 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(100%,#fff0ad), color-stop(100%,#fff0ad)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #fff0ad 100%,#fff0ad 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #fff0ad 100%,#fff0ad 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #fff0ad 100%,#fff0ad 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #fff0ad 100%,#fff0ad 100%); /* W3C */
    
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcca65', endColorstr='#fff0ad',GradientType=0 ); /* IE6-9 */
}

#topbar a {font-weight:bold; color: #8a1e04;}

#footer { background: url("images/Footer.jpg") repeat-x; height: 72px; width: 100%; margin-top: 0px; border:0px red solid;}
#footer .left {float: left;}
#footer .right{float: right;}

#contentContainer
{
    border: 0px solid red;
    position: relative;
    background-color: #575e64;
    overflow: hidden;
    width: 100%;
    top: 0px;
    left: 0px;
}

#leftPanel {
    border: 0px solid red;
    background-color: #fff;
    float: left;
    width: 495px;
    padding-bottom: 100%; /*padding-bottom, margin-bottom ensure that both left/right panels are the same height*/
    margin-bottom: -100%;
    color: #111;  
}


#leftPanel textarea,  #leftPanel input[type="text"], #leftPanel input[type="password"]
{     
    color: inherit;
    padding: 3px;
    box-shadow: inset 1px 1px 2px #ddd8dc;
    border: 1px solid #C8BFC4;
    border-radius: 4px;
    background-color: #fff; 
}

    #leftPanel select {box-shadow: inset 1px 1px 2px #ddd8dc; border: 1px solid #C8BFC4; color: inherit;}
    #leftPanel select:enabled {background-color: #fff;}
    #leftPanel select:disabled{background-color: #ccc;}

.submit-button
{
    height: 24px;
    border: 1px solid #d0d0d0; color: #212121;
    border-radius: 5px;
    background-color: #f0f0f0;
    font-family: Calibri;
    font-size: 12px; 
} 

#rightPanel
{
    border: 0px solid red;
    background-color: #fff0ad;
    float: left;
    width: 247px;
    padding-bottom: 100%; /*padding-bottom, margin-bottom ensure that both left/right panels are the same height*/
    margin-bottom: -100%;
    margin-left: 0px;
    color: #74646e;  /*font color for text*/
}

    #rightPanel .enhanceText
    { 
       font-size: 15px;  /*Already Registered? text*/
    }


    #rightPanel p.separator {
        height: 0;
        width: 100%;
        border: 0;
        line-height: 0px;
        border-top: 1px solid #484f54;
        border-bottom: 1px solid #687078;
    }


    #rightPanel textarea,  #rightPanel input[type="text"], #rightPanel input[type="password"] {
      color: #f0f0f0;
      border-style: solid;
      border-width: 1px;
      border-color: rgb( 49, 52, 55 );
      border-radius: 5px;
      background-color: #7d97b1;
      box-shadow: inset 0 2px 3px rgba(0,0,0,0.2); 
      padding: 3px;
      height: 20px; 
    }

     #rightPanel select {box-shadow: inset 0 2px 3px rgba(0,0,0,0.2); border: 1px solid  rgb( 49, 52, 55 ); color: inherit; }
     #rightPanel select:enabled{ background-color: #41464b; color:#FFF;}
     #rightPanel select:disabled{ background-color: #ccc}

    /*#rightPanel input[type="submit"]
    {
     height: 24px;
     border: 1px solid #d0d0d0; color: #212121;
     border-radius: 5px;
     background-color: #f0f0f0; 
    }*/

/*Custom Dropdown List*/
    .custom-ddl select
    {
        height:26px;
        padding: 3px;
        border-radius: 4px;

        -moz-appearance:none;/* Firefox */
        -webkit-appearance:none /* this is required for Webkit browsers - Safari/Chrome */;
        display:inline-block;
        /* outline: none;  remove Chrome outline for active controls */        
    }

    .custom-ddl { position:relative; display: inline-block;}

    .custom-ddl:after {
        content:'';
        width: 23px;
        height: 26px;
        position: absolute;
        display: inline-block;
        top: 0px;
        right: 0px;
        background: url(images/formelements-select.png) no-repeat right center;
        pointer-events: none;/*Prevents: click actions from doing anything, the default cursor pointer from displaying, 
                    CSS hover and active state triggering, JavaScript click events from firing*/
    }

    .no-pointerevents .custom-ddl:after/*Alternative styling for browsers that do not support pointer-events*/
    {
        content: none;
    }

/*iCarolMessagingStyle.css*/

.status {
  font-family: Sans-serif;
  font-size: 8pt;
  color: #000000;
  background-color: #fef19a;
  font-weight: bold;
  position: fixed;
  bottom: 18px;
  right: 10px;
}

.modalBackground {
    background-color: #eee;
    filter:alpha(opacity=70);
    opacity:0.7;
}
.modalPopup {
    background-color: #fff0ad;
    border-width:3px;
    border-style:solid;
    border-color:Gray;
    padding:3px;
    width:250px;
}

.HdrStyle 
{
	font-weight: bold;
	font-family: Arial;
	border: solid 1px #000;/*#A5CFE9;*/
	font-size: 11px;
	color: #4B7A98;
	background: #D5EBF9;
	filter: alpha(opacity=85);
	opacity: 0.85;
}

.BdyStyle{
    border-bottom: solid 1px #000; /*#A5CFE9;*/
    border-left: solid 1px #000; /*#A5CFE9;*/
    border-right: solid 1px #000; /*#A5CFE9;*/
    font-family: Arial;
	font-size: 11px;
	color: #1B4966;
	background: #FFFFFF;
	filter: alpha(opacity=85);
	opacity: 0.85;
}
