﻿/********************************************
   AUTHOR:          http://www.ambitiouswebdesign.com 
   WEBSITE:     http://www.m2studioportraits.com/
   TEMPLATE NAME:  m2 Studio Portraits
   DATE:           Mar-25th-2009
 *******************************************/ 
 
/********************************************
   HTML ELEMENTS
********************************************/ 
 
* { margin: 0; padding: 0px; }

html, body { 
margin: 0;
padding: 0px;
height: 100%; 
background: #0a0a0a url('images/bg.jpg') no-repeat top center;
} 

.line { border: none; border-bottom: 1px solid #4e5b28; height: 0px; margin: 0 auto }
.clear { clear: both; }


/* ----------CART--------------------- */
font, table, tr, td { border: none; background-color: transparent;}
table, td, tr { border: none; font: 9pt "Lucida Sans Unicode", Tahoma, Verdana, Arial, sans-serif; color: #e1e1e1; }
td { line-height: 20px; }
table b { color: #e1e1e1; }
table a, tr a, td a, font a, .content table a {color: #e1e1e1; font: 9pt "Lucida Sans Unicode", Tahoma, Verdana, Arial, sans-serif; }
table a:hover, tr a:hover, td a:hover, font a:hover, .content table a:hover {color: #ee4591;}
table hr {border: none; border-bottom: 1px solid #e1e1e1; height: 0px;}
font img { border: 6px solid #e1e1e1; margin-right: 10px; }

/* ----------Centered Container Or the Layout--------------------- */
#container { 
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin: 0 auto -4em; /* make sure this matches in the body footer DIV */
width: 960px;
} 

/* --------------LABELS BUTTONS & FORMS-----------*/
label {
font: 16px Georgia, Serif;
text-transform:lowercase;
color: white;
}
 
#name, #name0, #name1, textarea {
width: 26em;
border: 1px solid #777;
font: 12px Georgia, Serif;
color: #fff;
padding: 8px;
margin-bottom: 20px;
background-color: #0a0a0a;
}
 
.button {
width: 6em;
font: 18px Georgia, Serif;
text-transform:lowercase;
color: #000;      
background: #fff;
padding: 6px;
border: 1px solid #fff;
}

/* --------------HEADER------------- */
#header { height: 132px;}

/* --------------LOGO IN HEADER *always use this*------------- */
.logolink, #swap { width: 205px; height: 105px;}
.logolink { background-image: url('/images/logo.gif'); background-repeat: no-repeat; float: left}
.logolink a { float: left;  }
 
#swap { background-image: url(/images/logo.gif); }
 
.rollover { display: block; } /* Allow setting widths and heights */
.rollover img { width: 100%; height: 100%; border: 0; } /* only set width and height once */
.rollover:hover { visibility: visible; /* for IE */ } /* sets any property for the :hover state */
.rollover:hover img { visibility: hidden; } /* 'rolls over' the image */

/* --------------TOPNAV------------- */
.suckertreemenu {
float: right;
width: 700px;
background-color: black;
margin-top: 25px;
}

.suckertreemenu ul{
margin: 0;
padding-left: 0px;
list-style-type: none;
letter-spacing: 0px;
}

/*Top level list items*/
.suckertreemenu ul li{
position: relative;
display: inline;
float: left;
padding: 16px 15px 16px 9px;
}

/*Top level menu link items style*/
.suckertreemenu ul li a{
display: inline;
font: 17px Cambria, serif;
text-transform: lowercase;
font-weight:lighter;
color: #fff;
text-decoration:none;
cursor: hand;
padding: 5px;
}

.suckertreemenu ul li a:hover { border-top: 5px solid #709fac}

/*1st sub level menu*/
.suckertreemenu ul li ul{
left: 0em;
position: absolute;
top: 0em; /* no need to change, as true value set by script */
display: inline;
visibility: hidden;
text-decoration: none;
width: 678px; /*width of sub menu levels*/
margin-left: -73px;
background-color: white;
padding: 10px;
}

/*Sub level menu list items (undo style from Top level List Items)*/
.suckertreemenu ul li ul li{
display: inline;
float: none;
padding-right: 4px;
padding-left: 4px;
}

/* Sub level menu links style */
.suckertreemenu ul li ul li a {
margin: 0px;
display: inline;
text-align: left;
font: bold 12px Georgia, serif;
text-transform: lowercase;
letter-spacing: -1px;
text-decoration: none;
padding: 5px;
width: 190px;
color: #000;
}

.suckertreemenu ul li ul li a:hover{
text-decoration:underline;
color: #000;
border: 0px;
}

* html p#iepara{ /*For a paragraph (if any) that immediately follows suckertree menu, add 1em top spacing between the two in IE*/
padding-top: 1em;
}
	
/* Holly Hack for IE \*/
* html .suckertreemenu ul li { float: left; height: 1%; }
* html .suckertreemenu ul li a { height: 1%; }
/* End */

/* --------------RTR------------- */
#rotator { background-color: black; padding: 9px}

/* --------------MAIN CONTENT, LEFT NAVIGATION----------------*/
#main {
min-height: 100%; 
height: auto !important; 
height: 100%; 
margin-bottom: 30px;
}

#main .homecontent {
padding: 0px;
margin: 0px;
margin-right: 0px;
min-height: 170px; /* Height of Background Img */
height: auto;
}


#main .content {
padding: 15px;
margin: 0px;
margin-left: 316px;
margin-right: 0px;
min-height: 500px; /* Height of Background Img */
height: auto;
background-color: #0a0a0a;
border: 1px solid #5d5d5d;
}

#main .sitepic { float: right; margin: 10px 0px 10px 10px; border: 5px solid #727272;}

#main h1 {
font: 32px Georgia, serif;
text-transform: lowercase;
letter-spacing: -1px;
text-decoration: none;
color: #f6f6f6;
font-weight:lighter;
padding-bottom: 18px;

}

#main p { font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif; color: #f6f6f6;}
#main .content a { color: white;}


/* --------------PAINTING IMAGES----------------*/


blockquote {
width: 100%;
}

blockquote img {
border: 1px solid white; margin-bottom: 70px;
}

blockquote input {
margin-bottom: 30px; 
}

/* --------------NAVLEFT----------------*/
#main .navleft {
float:left; 
width: 280px;
margin: 0px;
padding: 0px;
margin-left: 0px
}

.navleft .cat {
float: left;
width: 280px;
min-height: 260px;
margin: 0px;
padding: 0px;
clear:right;
background-color: #0a0a0a;
margin-right: 32px;
border: 1px solid #5d5d5d;
font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif;
color: #f6f6f6;
}

.navleft .cat img {  padding: 20px 30px 20px 13px;}


/* --------------MAIN THREE BLOCKS----------------*/
#threeblocks {
padding: 25px 10px 0px 0px;
font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif;
color: #f6f6f6;
height: 100%;
height: auto;
min-height: 100%;
width: 950px;
line-height: 18px;
}

#threeblocks ul, .navleft ul { margin-left: 18px;}
#threeblocks li, .navleft li  { display: block; list-style-type: none; padding-bottom: 20px;}
#threeblocks a, .navleft a { color: #9dc0ca; text-decoration: underline; }
#threeblocks a:hover, .navleft a:hover { text-decoration: underline;}

#threeblocks .head, .navleft .cat .head {
position: absolute;
margin-left: -27px;
}

#threeblocks .text, .navleft .cat .text { margin-top: 80px;}
#threeblocks p, .navleft .cat p { padding: 0px 10px 18px 18px; line-height: 20px;}
#threeblocks img {  padding: 20px 30px 20px 13px;}

#threeblocks .meetpic {
float: right;
padding: 0px;
margin: 0px 0px 20px 8px;
border: 1px solid #727272;
}

#threeblocks .blockone {
margin-left: 27px;
}

#threeblocks .block, .blockone {
float: left;
width: 270px;
min-height: 280px;
padding: 0px;
clear:right;
background-color: #0a0a0a;
border: 1px solid #5d5d5d;
margin-left: 50px;
}


/* --------------EVENTS LINKS------------- */
table tr td { padding: 0px 10px 0px 10px; }
.navleft td a, .text table a { font-weight: bold; font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif; padding: 5px 5px 5px 0px;}
.navleft td a:hover, #threeblocks a:hover { color: white;}


/* --------------MAILING LIST------------- */
.mailinglist { margin: 0px; padding: 0px;}
.mailinglist div { text-align: left;}
.mailinglist table { width: 100%}
.mailinglist input { border: 0px; padding: 6px;  font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif; color: black; }








/* --------------OTHER SITES------------- */

table font { color: #9dc0ca;  font: 10px "Lucida Sans", Helvetica, Arial, Sans-Serif; line-height: 20px}







/* --------------FOOTER------------- */
#footer, .push { 
clear: both;
width: 100%;
height: 4em; /* make sure this matches in the body container DIV */
bottom: 0;
left: 0;
margin: 0 auto; 
position: relative;
} 

#footer {
background-color: black;
height: auto;
}

#footer .content { 
width: 960px; 
margin: 0 auto; 
position: relative;
padding: 20px; 
height: 100px;
}

/* --------------FOOTER LINKS------------- */
#footer .holder { width: 650px;}
#footer .left { width: 200px;  padding: 10px 10px 10px 0px; float: left; border-right: 1px solid #747474;}

#footer p {
padding-left: 10px;
color: #9dc0ca;
font-family: “Lucida Sans”, sans-serif;
font-size: 12px;
line-height: 1.5em;
}

/* --------------FOOTER LINKS------------- */

#footer ul { width: 400px; 
padding: 10px 10px 10px 20px;
float: left;
margin: 30px 0px 0px 0px;
}

#footer .links ul { margin: 0px; padding: 0px;}
#footer .links li { display: inline; list-style-type: none;}

#footer .links li a, a.last {
color: #f6f6f6;
text-decoration: none;
border-right: 1px solid;
padding: 0px 14px 0px 14px;
font: 12px Lucida Sans, sans-serif;
}

#footer .links li a.last { border-right: 0px;} 
#footer .links li a:hover { text-decoration: underline; }


/* --------ASC LINKS--------- */
#footer .asc ul { margin: 0px; padding: 0px;}
#footer .asc li { display: block; list-style-type: none;}

#footer .asc li a {
color: #fff;
text-decoration: none;
padding: 0px 10px 0px 10px;
font: 10pt Arial, 'Trebuchet MS', Sans-Serif;
}


/* --------------FOOTER SEO LINKS------------- */
#footer .seo {
height: auto;
text-align: left;
min-height: 100px;
width: 750px;
font: 8pt 'century gothic', Sans-Serif;
}
 
#footer .seo a {
color: #6e4a2f;
text-decoration: none;
font: 8pt 'century gothic', Sans-Serif;
}

















