/*****************************************************************************/
/*
/* File: vt_form.css
/* Description: css for the Vtiger lead form layout in The Open Learning 
/* Center's Joomla! 1.5 series template. The template itself is known as 
/* tolc-1.5.
/* Author: Alan Lord, alan.lord@theopenlearningcentre.com
/* Date Created: 18/12/2008
/* Revision: $Rev::                  $:
/* Date Modified: $Date::            $:
/* Copyright: GPL v3: http://www.gnu.org/copyleft/gpl.html
/*
/*****************************************************************************/

/*****************************************************************************/
/* Some aspects of this work were derived from ideas in other works by:
/* Barry North of Compass Designs (http://www.compassdesigns.net/), from the
/* Joomla Template Tutorial Series and other articles.
/* Stu Nicholls of CSS Play (http://www.cssplay.co.uk/), for the menu bar 
/* image idea and many other CSS tips and techniques. 
/* The Colour Palette is based on a design called Rich Choice Lighten by
/* DESIGNJUNKEE. The Original palette available here:
/* http://www.colourlovers.com/palette/2937/Rich_choice_lighten
/*
/* tolc-1.5, colour palette	
/* Just-Off White:    #F4F2F2	
/* Light Grey:        #E3E3E3
/* Darker Grey:       #888888
/* Light Turquoise:   #B9DFE4
/* Turquoise:         #50A4B1
/* TOLC Red:          #D40000
/*****************************************************************************/

* {
  margin:0;
  padding:0;
}

body {
  font-size:76%;
  font-family:Arial, "Liberation Sans", Verdana, Helvetica, sans-serif;
  line-height:1.3;
}

/*Container of pre-form content such as address etc */
div#address_block {
  margin:1.5em 0 0.5em 0;
  padding:0;
  float:left;
}

#vt_form img#tolc_hat {
	float:right;
}

div#address_block img, div#other_block img {
  float:left;
  padding-right:0.5em;
}

div#address_block p {
  margin-left:2em;
}

div#other_block {
  margin:1.5em 0 0.5em 8em;
  padding:0;
  float:left;
  width:20em;
}

div#other_block p {
  padding:0;
  margin:0 0 0.5em 0;
}

/* Form container layout and background images */
.frm_box {
  clear:both;
  position:relative;
  height:400px;
  min-width:550px;
  max-width:650px;
  width:650px;
  overflow:hidden;
  margin-left:20px;
}

.frm_box .imgl {
  position:absolute;
  background-image: url("../images/box_l_15x400.png");
  background-repeat:no-repeat;
  width:15px;
  height:400px;
}

.frm_box .imgm {
  background-image: url("../images/box_mid_5x400.png");
  height:400px;
  background-repeat:repeat-x;
}

.frm_box .imgr {
  position:relative;
  top:-400px;
  background-image: url("../images/box_r_15x400.png");
  background-repeat:no-repeat;
  width:15px;
  height:400px;
  float:right;
}

/* Form elements */

.frm_inside {
  position:relative;
  top:-390px;
  left:10px;
  height:375px;
  padding-right:12px;
  overflow:hidden;
}

/* A nasty hack for IE to make the fieldset fill the container. */
.frm_box #height-bar {
  float:left;
  width:0px;
  height:355px;
}

/* Only for Mozilla/Firefox type browsers */
.frm_box fieldset {
  -moz-border-radius: .4em;
}

.frm_box fieldset legend {
  font-size:1.1em;
  font-weight:bold;
  color:#000;
  margin:0 0.5em;
  padding:0 0.2em;
}

.frm_box div.row {
  padding-top:8px;!important
  width:1%;
}

.frm_box div.buttons {
  position:absolute;
  left:5px;
  bottom:8px;!important
  width:1%;
}

.frm_box .notes {
  float:right;
  width:175px;
  height:auto;
  margin:8px 5px 10px 10px;
  padding:5px;
  border:1px solid #666666;
  background-color:#B9DFE4;
  color:#666666;
  font-size:1em;
}

.frm_box .notes h4 {
  padding:3px 0 3px 0;
  border-width:0 0 1px 0;
  border-style:solid;
  border-color:#666666;
  font-size:1.2em;
}

.frm_box .notes p {
  padding-top:0.5em;
}

.frm_box label {
  display:block;
  float:left;
  width:100px;
  text-align:right;
  padding-top:3px;
  padding-right:5px;
}

.frm_box .formw {
  margin-left:10px;
  width:235px;
  text-align:left;
}

.frm_box .sub {
  margin-left:20px;
  width:326px;
}

.frm_box .sub legend {
  font-size:1em;
  font-weight:normal;
}

.frm_box .sub input {
  margin:5px 0px 0px 5px;
  padding:0px 5px 0px 0px;
}

.frm_box .sub span {
  margin-left:0.5em;
  padding-right:0.5em;
  line-height:2.5em;
  vertical-align:11%;
}

.frm_box textarea {
  width:290px;
  height:70px;
}

form div.optional label {
  font-weight: normal;
}

form div.required label {
  font-weight: bold;
}

form textarea.expanding {
  overflow: auto;
  overflow-x: auto;
  overflow-y: visible;
}

div.optional label:before {
  content: '';
}

div.required label:before {
  content: '* ';
  color:#d40000;
}