/********************************************************/ 
/*** Author : Cairns Web Design 
/*** URL :    www.cairnswebdesign.com.au  
/*** Client : www.macsappliances.com.au
/********************************************************/ 


/*-------------------------------------------------------
Colour Palatte 

    Blue - Menu    : #3b5391
    Blue - Light   : #6683bb
    Blue - Dark    : #080b5a
    Logo - Green   : #71a191
    Logo - Yellow  : #f5f503
    Logo - Grey    : #cad1e4
    Form Fields    : #f1f3f9
    Form Fields Border   : #e2e4e9
    Text           : #3b5391


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



/*-------------------------------------------------------
GLOBAL
------------------------------------------------------ */

html {
  font-size:90%;
  font-family:Verdana, Geneva, sans-serif;
}

body {
  margin:0;
  padding: 0;
}

a img {
  border: none;
}

a:link, a:visited {
  color: blue;
}

a:hover, a:active {
  color: red;
}

/*-------------------------------------------------------
CONTAINER
------------------------------------------------------ */

#container {
  width: 100%;
  padding: 0px;
  margin : 0 auto;
}


/*-------------------------------------------------------
HEADER
------------------------------------------------------ */

#header {

}

#header-inner {
  background: #3b5391;
  border-bottom: solid 4px #080b5a ;
  padding: 20px 0 20px 0;
}

/*-------------------------------------------------------
NAV
------------------------------------------------------ */

#nav {
  width:940px;
  margin: 0 auto;
} 

/*-------------------------------------------------------
NAV-MAIN (HORIZONTAL)
------------------------------------------------------ */

#nav-main {
  text-align:left;
/*  line-height:0px;*/
  letter-spacing: 1px;
  padding: 5px 0px 5px 0px;
  font-size: 80%;
}
  
#nav-main ul li {
  display:inline;
  padding-left: 10px;
  padding-right: 50px;
  border-left: 1px solid #6683bb;
}

#nav-main a:link, #nav-main a:visited {
  color: #6683bb;
  text-decoration:none;
}

#nav-main a:active, #nav-main a:hover {
  color: #FFF;
  text-decoration:none;
}

.menu-items {
  border-left: 1px solid #6683bb;
  padding: 0 20px 0 20px;
  float: left;
  font-size: 90%;
}

.menu-items a:link, .menu-items a:visited  {
  color: #6683bb;
  text-decoration: none;
  font-weight: normal;
  letter-spacing: 1px;
}

.menu-items a:active, .menu-items a:hover  {
  color: #fff;
}

.menu-captions {
  color: #6683bb;
  margin-top: 20px;
  letter-spacing: 1px;
  font-weight: normal;
}

/*-------------------------------------------------------
FOCUS
------------------------------------------------------ */

#focus {
  width: 940px;
  margin: 0 auto;
} 

.focus-border {
  border: 0px solid red;
}

/*-------------------------------------------------------
WRAPPER
------------------------------------------------------ */

#wrapper {
  width: 940px;
  margin: 30px auto;
} 


/*-------------------------------------------------------
TITLE
------------------------------------------------------ */

#title {
  background: #cad1e4;
  border-top: solid 2px #080b5a ;
}

#title-inner {
  width: 940px;
  margin: 0 auto;
  color: #3b5391;
  font-weight: bold;
  font-size: 70%;
  line-height: 30px;
}

/*-------------------------------------------------------
CONTENT
------------------------------------------------------ */

#content {
  width: 580px;
  background:#FFF;
  padding: 20px;
/*  border: 1px solid #343434;*/
/*  color:#3b5391;*/
  color:#080b5a;
  float:left;
  }
  
#content a:link, #content a:visited {
/*  color: #C7060B;*/
/*  color:#080b5a;*/
  text-decoration: underline;
}

#content a:active, #content a:hover {
/*  color: #C7060B;*/
  text-decoration: underline;
}

#content h1 {
  font-size: 120%;
  color: #3b5391;
  font-weight: bold;
  padding: 0 0 20px 0;
}

#content p {}

#content table td{
  padding:2px;
}


#content-full {
  width: 900px;
  background:#FFF;
  padding: 20px;
/*  border: 1px solid #343434;*/
/*  color:#666;*/
  float:left;
  }

/*-------------------------------------------------------
SIDEBAR
------------------------------------------------------ */

#sidebar {
  border: 1px solid #333;
  width: 280px;
  margin-left: 650px;
  padding: 20px;
}


/*-------------------------------------------------------
FOOTER
------------------------------------------------------ */

#footer {
  background: #3b5391;
}

#footer-inner {
  width: 940px;
  margin:0 auto;
}

#nav-footer {
  text-align:left;
  line-height:0px;
  letter-spacing: 1px;
  padding: 5px 0px 5px 0px;
  font-size: 70%;
}
  
#nav-footer ul li {
  display:inline;
  padding-left: 0px;
  padding-right: 10px;
}

#nav-footer a:link, #nav-footer a:visited {
  color: #6683bb;
  text-decoration:none;
}

#nav-footer a:active, #nav-footer a:hover {
  color: #FFF;
  text-decoration:none;
}



/*-------------------------------------------------------
AUTHOR
------------------------------------------------------ */

#author {
    font-size: 70%;
    text-align: right;
}

#author-inner {
  width: 940px;
  margin: 0 auto;
}

#author a {
  color: #3b5391;
  text-decoration: none;
}

#author a:hover {
  text-decoration: underline;
  color: #3b5391;
}

/*-------------------------------------------------------
ENQUIRY-FORM
------------------------------------------------------ */

#enquiryform {
  float: left;
  font-size: 90%;
  letter-spacing: 1px;
  width: 530px;
}


/*-------------------------------------------------------
CONTACT-DETAILS
------------------------------------------------------ */

#contact-details {
  float: left;
  width: 350px;
  text-align: right;
}

/*-------------------------------------------------------
CSS CLASSES
------------------------------------------------------ */

.clear {
  clear:both;
}

.center { 
  text-align: center;
}

.left {
  text-align: left;
}

.right {
  text-align: right;
}

.justify {
  text-align: justify;
}

img.float-left {
  float:left;
  margin:10px;
}

img.float-right {
  float:right;
  margin:10px;
}

.required {
  font-style: italic;
  color: #CCC;
  font-weight:normal;
  font-size:80%;
} 

.image-border {
  border: 1px solid #999;
}

.developers-comment {
  background: #000;
  border: 2px solid red;
  color: red;
  font-style: italic;
  padding: 5px;
}

.brands {
    margin:3px;
    width: 100px;
    float:left;
}

.brands-contact-list {
    margin:3px;
    width: 600px;
}

.brands-contact-list img{
    padding: 10px 20px 0 0;
        border: 0px solid red; /* testing only */
        vertical-align: middle;
}

.alphabet {
/*  border-bottom: 1px dashed #cad1e4;*/
/*  color: #cad1e4;*/
  border-bottom: 1px dashed #080b5a;
  color:#080b5a;
  font-weight: bold;
  margin: 50px 0 10px 0;
}


/*-------------------------------------------------------
FORMS
------------------------------------------------------ */

form {
  margin: 0 auto;
}

fieldset {
    border: 0px solid #e7c086;
    padding: .5em;
}

label {

  font-size:.9em;
  width: 10em;
  display:block;
  float:left;
  clear:left;
  text-align: right;
  margin: 10px 10px;
}

input[type="text"], textarea {
  margin: .5em 0;
  padding: 9px;
  border: solid 1px #dfe4f3;
  outline: 0;
  font: normal 13px/100% Verdana, Tahoma, sans-serif;
  width: 200px;
/*  background: #f1f3f9;*/
  background: #3b5391;
  color: #FFFFFF;
  display:block;
  float:left;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  }

textarea {
  width: 300px;
  max-width: 400px;
  height: 100px;
  line-height: 150%;
  }

input:hover, textarea:hover,
input:focus, textarea:focus {
/*  border-color: #999966;*/
  border-color: red;
  }

.required {
  color: red;
  font-size: 80%;
  margin: 10px 0 10px 10px;
  display:block;
  float: left;
}


.field { 
margin-bottom:7px;
position: relative;
}

.submit {
/*  background: #cad1e4;*/
  background: #3b5391;
  border: 0;
  clear:both;
  color: #FFF;
  display:block;
  float:left;
  font-size: 14px;
  padding: 9px 15px;
  width: auto;
  margin: 20px 0 0 200px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  }

.submit:hover {
  color:#080b5a;
  background:#71a191;
}

.reset {
/*  background: #cad1e4;*/
  background: #3b5391;
  border: 0;
  color: #FFFFFF;
  font-size: 14px;
  margin: 20px 0 0 20px;  
  padding: 9px 15px;
  width: auto;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  }

.reset:hover {
  color: #080b5a;
  background:#71a191;
}