/* Based on Eric Meyers Reset, with html 5 elements added
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/ */


html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, 
article, aside, dialog, figure, footer, header, 
hgroup, menu, nav, section, menu,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}


article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }



/*-------------
   Base Styles
---------------*/

body{ 
color:rgb(50,50,50); 
font:100%/1 Verdana, Geneva, Tahoma, sans-serif; 
border-top:5px solid #D4ECFC; 
background:url(https://s3.amazonaws.com/ocmd_mood/OC-Beach2LightBlue.jpg) top center no-repeat #C0E5FB; 
}

body { color:rgba(0,0,0,.8); }

img{ max-width:100%; }

a:link, a:visited{ color:#0B61A4; text-decoration:underline; }

a:hover, a:focus, a:visited:hover{ color:#66A3D2; cursor:pointer;}

p, figcaption, .simpleList li { font:.825em Verdana, Geneva, Tahoma, sans-serif; line-height:1.5; margin:0 0 .5em 0; }

h1{ font:1.2em "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; }

h2{ font:1.1em "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; }

h3{ font:1.1em "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; font-weight:bold; margin:10px 5px 3px 0; }

strong { font-weight: bold; }

hr { width:100%; border-top:1px solid white; border-bottom:1px solid rgba(0,0,0,.1); display:block; margin:30px 0; }

/*--- LAYOUT ---*/

.wrapper{
text-align:left;
width:960px;
margin:0 auto;
position:relative;
}

#wrapper2{}



header{
position:relative; 
width:960px; 
display:block; 
float:left; 
margin:0 0 10px 0;
}

header h1#logo{ 
position:relative; 
width:295px; 
height:50px; 
margin:0;
float:left; }

header h1#logo a{ display:block; text-indent:-9999px; width:295px; height:50px;  float:left;background:url(http://www.ocmdhotels.com/images/ocmdhotels/ocmdhotelsLogo2.png) no-repeat; }

header h1#logo a:hover, header h1#logo a:focus{ background:url(http://www.ocmdhotels.com/images/ocmdhotels/ocmdhotelsLogo2.png) 0 -50px no-repeat;; }

.utility { float:right;}

.utility ul { display:block; float:right; }

.utility li { float:left; font-size:.865em; }

.utility a { text-decoration:none; font-size:.875em; border-bottom:2px solid rgba(255,255,255,.2); padding:.5em 1em; float: left; }

.utility a:hover { border-color:#66A3D2; }

.logoIntro {  clear: right; float:left; padding:.5em 0 0; }

.intro h1 { font-size:1em;  }

.intro { color: #033E6B; text-indent:-9999px; height:.1em; overflow:hidden; }

.phone { float:right; width:30%; }

.res_checkIn { display:block; float:left; width:100%; }


#reservations{
width:250px;
float:right;
position:relative;
z-index:200;
margin:40px 100px 0 0;
background:#99bdcc;
background:rgba(149,188,209,.7);
padding:15px;
}

#reservations h1{ display:none; }

#reservations form{
position:relative;
width:220px;
font-size:12px;
background:#dceffc;
background:rgba(221,240,253,.8);
padding:15px;
}

#reservations form label{
font-size:12px;
display:block;
margin:5px 0 3px 0;
font-family:Verdana, Geneva, Tahoma, sans-serif;
float:none;
}


#reservations form select{
font-size:11px;
}



#reservations form .resForm3{
width:73px;
float:left;
margin:5px 0 15px 0;

}

.resForm3 input{
background:white;
text-align:center;
border:1px solid gray;
font-size:14px;

}

.resForm3 input:focus{
background:white;
border-color:#66A3D2;
}

#ui-datepicker-div{
	z-index:6;
}

form button{
display:block;
clear:left;
text-align: center;
border: 1px solid #FFF;
border: 1px solid rgba(255,255,255,.7);
-webkit-border-radius: .3em; 
-moz-border-radius: .3em;
border-radius: .3em;

color:#ffffff;
color:rgba(255,255,255,.7);
background:#0B61A4;
text-transform: uppercase;
letter-spacing: .1em;
padding:5px;
font-size:14px;
font-weight:bold;
}


form button:hover, form button:focus{
border: 1px solid transparent;
background-color:#A7C5D1; 
color:white;
}

form button:active{
margin-top:1px;}

#reservations h2, .phone h2{
color:#033E6B; margin:25px 0 0 0px; text-align:center;

}

#reservations h2 span.phoneNumber, .phone span.phoneNumber{
display:block;
font-size:24px;
letter-spacing:2px;
line-height:1.5;

}



/*----------------------
	HOTELS
-------------------------*/


#hotelPics, #hotelPics ul.feature{width:700px; height:300px; float:left; position:relative; }

#hotelPics ul.feature li{position:absolute; top:0; left:0; width:700px; height:300px; display:none;}

#hotelPics ul.feature li.current{display:block;}

.controlHolder{position:relative; width:700px; height:300px; float:left;}

ul.controls{position:absolute; z-index:10; top:245px; right:0px; }

ul.controls li{float:left; margin:4px 4px 0 0;}

ul.controls li a.selected{width:30px; height:30px; background:url(http://www.ocmdhotels.com/images/ocmdhotels/picSquares.png) no-repeat -22px 0px  transparent; }

ul.controls li a{display:block; width:25px; height:30px; background:url(http://www.ocmdhotels.com/images/ocmdhotels/picSquares.png) no-repeat 0 0px transparent;}

ul.controls li a:hover {background:url(http://www.ocmdhotels.com/images/ocmdhotels/picSquares.png) no-repeat -50px 0px transparent;}

ul.controls li a.selected:hover {width:30px; height:30px; background:url(http://www.ocmdhotels.com/images/ocmdhotels/picSquares.png) no-repeat -22px 0px  transparent;}

#previous{position:absolute; top:40%; left:0; background:rgba(0,0,0,.7); width:50px; height:50px; z-index:100;}

#next{position:absolute; top:40%; right:0; background:rgba(0,0,0,.7); width:50px; height:50px; z-index:100;}

#hotelPics img{
float:left; 
-moz-box-shadow:2px 2px 10px rgba(0, 0, 0, 0.3); 
-webkit-box-shadow:2px 2px 10px rgba(0, 0, 0, 0.3);
box-shadow:2px 2px 10px rgba(0, 0, 0, 0.3);
}

#hotelPics li div{ 
padding:5px 10px;  
width:680px; 
color:rgb(30,30,30); 
background:none; 
float:left; 
-webkit-transition: background .3s ease-in; 
-webkit-border-bottom-left-radius: 5px; 
-moz-border-radius-bottomleft: 5px;
border-bottom-left-radius: 5px;
}

#hotelPics li a, #hotelPics li a:hover { float:left; text-decoration:none; background:transparent;}


#hotelPics li div h2 { font-size:18px; font-weight:normal; float:left; }

#hotelPics li a:hover div h2, #hotelPics li a:focus div h2 { color:#66A3D2; }

#hotelPics li div p { margin:0; float:left;}

ul#hotelList { float:left; margin-top:10px; width:620px;}

ul#hotelList a, ul#hotelList a:visited { text-decoration:none; }

ul#hotelList li { float:left; clear:left; padding:20px 5px; width:620px; display:block; text-decoration:none; border-bottom:1px solid #A0BFD3; border-bottom:1px solid rgba(0,0,0,.1); }

ul#hotelList li:last-child { border-bottom:none; }

ul#hotelList li p { margin:3px 0;}

ul#hotelList li div { float:right; margin:5px 0; display:block; width:400px; }

ul#hotelList li img { float:left; width:200px; margin:5px;}

ul#hotelList li h2 a, #hotelPics h2 { font-weight:600; text-decoration:none;}

ul#hotelList li h2 a { display:block;}

ul.hotellinks { width:400px; float:left; }

ul#hotelList ul.hotellinks li { float:left; clear:none; padding:0; width:auto; clear:none; margin:10px 25px 0 0; border:none;  }

li.website a, p.website a, p.more a{ 
-moz-transition:background-color .5s linear;
-webkit-transition:background-color .5s linear;
transition:background-color .5s linear;
}

li.website a, p.website a, p.more a{  
font:16px "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; 
text-decoration:none;  
padding:4px 25px 6px 10px; 
background:url(http://www.ocmdhotels.com/images/ocmdhotels/1whiteArrow.png) no-repeat right 50% #3F92D2; 
-webkit-border-radius: .15em; 
-moz-border-radius: .15em;
border-radius: .12em;
color:white;
float:left;
}

ul.hotellinks li.website a:hover, ul.hotellinks li.website a:focus, p.website a:hover, p.website a:focus, p.more a:hover, p.more a:focus{   
background-color:#A7C5D1; 
color:white;
-moz-box-shadow:1px 1px 5px rgba(0,0,0,.5); 
-webkit-box-shadow:1px 1px 5px rgba(0,0,0,.5); 
box-shadow:1px 1px 5px rgba(0,0,0,.5);
}

p.website, p.more  { margin:10px 0; }

ul#hotelList li p.website {clear: both;
    float: left;
    margin: 10px;
}

* html ul#hotelList li p.website { width:7em; }

.phone{color:rgb(120,120,120); }

/* -- Map -- */

#map_canvas img, #pano img{ max-width:inherit; }

#map_canvas{width:630px; float:left;}

section.hotelInfo article {display:none; width:310px; float:right; margin-right:10px; }

#pano{width:310px; float:right; margin:0 10px 20px; }


/*----------------------
		MainNav
------------------------*/

#mainContent {float:left; 
	background:url(https://s3.amazonaws.com/ocmd_mood/white50.png) repeat transparent; 
 background:rgba(255,255,255,.5); width:960px; }

nav.main ul { float:left; padding-left:2px; border-bottom:1px solid #0B61A4; width:958px;  }

nav.main li { border:none; margin:2px 2px 0 0; float:left; }

nav.main li a, nav.main li a:link { text-decoration:none; font:18px "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; float:left; background:#9AC9EA; background:none; }

nav.main li a, nav.main li a:link, nav.main li a:visited, nav.main li a:hover, nav.main li a:focus { padding:5px 10px 5px 10px; margin:0;}

nav.main li a:hover, nav.main li a:focus  { background:#ABD6F2; background:rgba(102,163,210,.2); color:rgba(102,163,210,.9); }

nav.main li a.selected, nav.main li a.selected:hover { background:#0B61A4; color:#ABD6F2; padding:3px 10px 7px; margin:2px 2px 0 2px; -moz-box-shadow:rgba(20,20,50,.3) 2px -2px 10px; }

nav.main li a:active {  }


/*--------------------
	HOMEPAGE MAINCONTENT
----------------------*/


article { display:block; }

article h1 { font-size:18px; font-weight:bold;}

.rightSide { float:right; width:300px;}

.rightSide article { margin:15px 0; }

.rightSide article a img { float:right; margin:10px 0; border:5px solid transparent; }

.rightSide article a:hover img, aside article a:focus img { float:right; margin:10px 0; border:5px solid #66A3D2; }

.subscribe { margin:5px; float:left; background:#DEF1FD; background:rgba(255,255,255,.5); padding:10px; width:270px; }
.subscribe label, .subscribe input { font-size:14px; margin:0; float:left; clear:none;}
.subscribe input {margin-left:10px; background:white; border:1px solid gray;  }
.subscribe button{ margin:5px 0; float:left;}

form.withBorder { width:100%; position:relative; }

form.withBorder label, form.witBorder input { font:12px Verdana, Geneva, Tahoma, sans-serif; margin:10px 0; width:100%; }

form.withBorder input, form.withBorder textarea { background:white; border:1px solid gray; font-size:18px; margin:5px 0;  }


form.withBorder label span { font-weight:bold; font-size:10px; color:gray; margin-left:20px; }

.question { display:block; float:left; width:100%;  margin:20px 0; }

.question p { line-height:2;  margin:0; padding:10px 5px; font-weight:bold; }

form.withBorder .question label { clear:none; float:left; padding:5px; margin:0; position:relative;   }

form.withBorder  .question label input { float:left; margin:5px; width:auto; }



/*------------------------
			FORMs
------------------------*/
fieldset{
border:none;
text-align:left;
}

legend{
overflow:hidden;
text-indent:-9999px;
height:0;
}

label{
font:18px "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; 
line-height:1.5;
text-transform:capitalize;
margin-top:10px;
display:block;
float:left;
clear:left;
position:relative;
}


option{
background-color:white;
}

input:focus, textarea:focus{
background:#F1F9FE;
}

input, textarea{
border:none;
border-bottom:1px solid #66A3D2;
font:12px Verdana, Geneva, Tahoma, sans-serif; 
background:white;
display:block;
}



label.error { background:rgb(255,100,150); border:1px dotted rgb(50,20,50); margin:0; font-size:14px; color:black; font-style:normal;position:absolute; width:300px; left:105%; bottom:0; padding:5px 10px; -moz-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5); 
-webkit-box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5); box-shadow:2px 2px 5px rgba(0, 0, 0, 0.5); }

label.thankyou{font-style:italic; text-transform:lowercase; color:gray; margin:15px;}

div.hiddenFields{
       display:none;
}

/* Checkboxes */
#mlist, #brochure, #pinfo, #notify{
display:inline;
margin:15px 5px 10px 0px;
}

label[for*="mlist"], label[for*="brochure"], label[for*="pinfo"], label[for*="notify"] {
margin:15px 0;
}



/*-------------------------
		Hotel Numbers
--------------------------*/
#hotelNumbers{
margin:35px 5px;
background:url(http://www.ocmdhotels.com/images/ocmdhotels/ie/shim.png) repeat transparent;
background:rgba(37,86,123,.1);
padding:10px 0 20px 15px;
}

#hotelNumbers h2{
margin-top:15px;
font-size:18px;
}

#hotelNumbers p{
margin:1px 0;
line-height:1.45;
}



/*-- oc page --*/


#webCams { width:790px;  border-bottom:1px solid #A0BFD3; background:rgba(100,100,100,.1); float:right; margin:10px 5px; padding: 20px 0 20px 20px; }


/*-- events on main oc page --*/



/*-- all events --*/

.events { float:left; margin: 1em 0 1em 2%; width: 50%; }

.events li {  float:left; border-bottom:1px solid #A0BFD3; border-bottom:1px solid rgba(0,0,0,.1); padding-bottom:15px; margin-top:15px; width:100%; clear: left; }

.events li h1 { font-size:18px; margin:0; }

.events h2, .social h1 { color:#97B6C9; font-weight:bold; margin-top:20px; font-size:18px; }

.events_list ul li { width:630px; }

.eventList .event_details { float:right; margin:5px 0; display:block; width:400px; }

.events img { float:right; width:40%; margin:.3em 0 0 2%;}

.eventList h1 {  }

p.when{ color:#4B5A64; color:rgba(0,0,0,.6); font-size:12px; font-weight:bold; text-transform:uppercase; margin:5px 0 0;  }

aside p.when { font-size:10px; }

p.where { color:#4B5A64; color:rgba(0,0,0,.6); margin:0;  }

.what p {margin:5px 0;}


/* -- Event Page -- */

.events_one {  width:630px; float:left; margin:2em 5px 20px 20px;}

.events_one .what p { float:none; }

.events_one .simpleList, .events_one .simpleList li { float:left; clear:left; }

.event_details .simpleList li { margin-left:0;}

.event_details figure.medium img { margin-left:-20px;}

.social h1 { margin:20px 0 10px -10px; }

.social { clear:left; float:left; margin:10px; }

.social div { clear:left; float:left; }

.event_details h2 { float:none; }

/*-- event list --*/
.events_list { width:630px;}

.breadcrumb { float:left; background:url(http://www.ocmdhotels.com/images/ocmdhotels/ie/shim.png) repeat transparent; background:rgba(255,255,255,.5); width:96%; padding:2px 2%; }

.breadcrumb li{ float:left; padding:.6em .3em .5em 0; text-transform:capitalize; font-size:.865em; }

.simpleList { list-style:disc outside;}

.simpleList li { margin:5px 0 5px 10px;}

.clearMe { clear:both; }

ul.times { margin:.5em 0; }

ul.times li { margin: 0;
    padding: 0.3em 0;
    float:none; 
border:none;
font-size:.85em; }

/* things to do oc */
.thingsToDo_oc {  width:40%; float:right; margin:1em 1%; background:rgba(255,255,255,.3); padding:.4em 0; }

.thingsToDo_oc li { width:100%; float:left; }

.thingsToDo_oc h1 { color:#97B6C9; font-weight:bold; font-size:18px; margin:1em 0 0 .5em;}

.thingsToDo_oc img, .thingsToDo_list img { float:left; margin-right:5px;}

.thingsToDo_side ul, .thingsToDo_oc ul { float:left; }

.thingsToDo_side a, .thingsToDo_oc a{ display:block; text-decoration:none; padding:10px;}

.thingsToDo_side a:hover, #thingsToDo_side a:focus, .thingsToDo_oc a:hover, #thingsToDo_oc a:focus { background:#ABD6F2; background:rgba(102,163,210,.2);}

.thingsToDo a:hover h2, #thingsToDo a:hover p, #thingsToDo a:focus h2, #thingsToDo a:focus p { color:#66A3D2; } 

.thingsToDo_side p, .thingsToDo_oc p { margin:0; color:rgb(30,30,30); }

.thingsToDo_side { margin-top:10px; float:left; }

.thingsToDo_side li { font-size:.865em; }

/*-- things to do page --*/

.thingsToDo_list{ width:630px; margin: 30px 0px; float:left; }

.thingsToDo_list a{ padding:10px;  float:left; text-decoration:none;}

.thingsToDo_list a:hover, .thingsToDo_main a:focus { background:#ABD6F2; color:#66A3D2; }

.thingsToDo_list h1{font:18px "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; }

.thingsToDo_list p { color:rgb(50,50,50); }

.thingsToDo_list a:hover p, .thingsToDo_main a:focus p {color:#66A3D2; }

.thingsToDo_list li {  float:left; border-bottom:1px solid rgba(100,100,100,.1);   }


.thingsToDo_one article { margin: 1em 0 1em 2%;
    width: 65%; float:left; }

.thingsToDo_one h1 { font-size:24px; margin:10px 0;}

.thingsToDo_one p.first { font-size:18px; }

.thingsToDo_one h2, .thingsToDo h3{ font:18px "ff-dax-web-pro-1","ff-dax-web-pro-2", Verdana, Geneva, Tahoma, sans-serif; margin:20px 0 10px; }

.thingsToDo_one article h2 { font-size:24px;}

.thingsToDo_one p, .thingsToDo_one h1, .thingsToDo_one h2, .thingsToDo_one h3{ margin-left:10px;}

#oc aside { margin:2em 1% 0; padding-left:0px; border-left:1px solid #A0BFD3; border-left:1px solid rgba(0,0,0,.1); width:280px;  }

#oc h1.side, 
#oc h1.side a { font-weight:bold; color:#97B6C9; color:rgba(0,0,0,.2); text-decoration:none;}

#oc h1.side a:hover, .thingsToDo2 h1.side a:focus { color:#66A3D2;}

#oc aside h1{ font-size:18px; margin:0 0 0 10px; padding-top:10px;}

#oc aside ul#hotelList li a h2 {
    font-size: 18px;
    font-weight: 100;
    margin: 0 0 0 10px;
    color: rgb(30,30,30);
}

#oc ul#hotelList, #oc ul#hotelList li { width:270px; margin:0; padding:10px 0 20px 0; }

#oc ul#hotelList img { margin-left:10px;}

#oc ul#hotelList a p { float:left; margin-left:10px; color: rgb(30,30,30);}

.thingsToDo2 .what{ margin:0;}

.thingsToDo2 #thingsToDo { width:280px; border:none; margin:10px 0; border-top:1px solid rgba(0,0,0,.1); }

/* -- flickr --*/

#oc aside.flickr { float:left; width:100%; border:none;  }

aside.flickr li { border:none; float:left; margin:5px; }


/* -- figure --*/

.largeHeader { position:relative; display:block; width:959px; float:left; margin:0 0 10px 0;}

figure.largeHeader figcaption { position:absolute; bottom:10px; right:0; z-index:2; padding:10px 20px; 
background:url(https://s3.amazonaws.com/ocmd_mood/white70.png) repeat transparent; 
background:rgba(255,255,255,.7);}

figure.medium figcaption{ font-style:italic; }

.events_side li {float:left; }



/* -- Web Cam --*/

.webcam { 
	background: none;
    float: left;
    width: 100%;
    padding-bottom: 2em;
    }

.webcam h1, .webcam p { margin:20px; }

.camImage { 
	border: 3px solid #0B3954;
    border-radius: 2px 2px 2px 2px;
    box-shadow: 3px 4px 5px rgba(0, 0, 0, 0.3);
    float: left;
    margin: 1em 0 2em 2%;
    width: 625px;
    height: 410px;
    }

#ocInletCam img { float:left; }

#webcams iframe { border:none; background:transparent; visibility: hidden; display: none; }

.camControls {
	float: right;
    width: 29%;
    }
    
    
.camControls h2 { margin: 1em 0;}

.camControls ul { 
	float: left;
    margin: .5em 0;
    }

.camControls .locations {
	background: none repeat scroll 0 0 #0B61A4;
    border-radius: 0.2em;
    margin-right: 5%;
    padding: 0.5em;
    }

.camControls .directions {
	background: #0B3954;
    padding: 0.5em;
    border-radius: 0.2em;
    }


.camControls ul li{ list-style:none; margin: 0 0 0.5em; }

.camControls ul li a{ 
	border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    color: #BDE3FB;
    display: block;
    line-height: 2;
    padding: 0.2em 0.5em;
    text-decoration: none;
    }

.camControls ul li a:hover{ color:white; background:#033E6B; }


/*--- EMPLOYMENT ----*/

.jobOpenings{
width:500px;
}
.contentArea .jobOpenings p{
margin:0 0 15px 0;
line-height:1.2;
}
.jobOpenings p.postedDate{
margin:3px 0; }

.jobOpenings h4{
margin-top:5px;
font-size:1.2em;
}



/*--- leftCol 2/3 ---*/

.leftCol{
width:630px;
float:left;
}

.leftCol p.first{
font:18px Georgia, serif;
font-weight:normal;
font-style:italic;
line-height:1.6;
color:#8B9FAB;
margin:10px 0 20px;
}

.leftCol form { margin-left:5px; }

.leftCol { margin:30px 5px; width:630px;  }

.leftCol h2 { margin:10px 0 5px;}

.leftCol p, .leftCol h2, .leftCol h1 { margin-left:5px;}



/*--- about ---*/
.about .leftCol { margin:30px 5px; width:630px;  }

.about .leftCol h2, .about .leftCol .simpleList { margin:10px 0 5px 5px;}

.about .leftCol p,  .about .leftCol h1 { margin-left:5px;}

.about hr{ border:none; margin:0; }

blockquote{ 
margin:20px 0px; 
padding:10px 0;
color:#033E6B;
font-size:18px; 
line-height:1.5;
font-family:Palatino, Georgia, "Times New Roman", serif; 
display:block;
width:630px;
clear:both;
border-top:1px dotted rgba(0,0,0,.1);
border-bottom:1px dotted rgba(0,0,0,.1);
}

blockquote span{
font-style:normal;
text-transform:uppercase;
color:gray;
margin-left:10px;
font-size:smaller;
letter-spacing:.1em;
display:block;
}

.right { float:right; }

.left { float:left; }

.s150 { width:150px; }

.m310 { width:310px; }

.l630 { width:630px; }

.pic p{ color:gray; line-height:1.2; font-size:12px; }

.right { margin:5px 0 5px 5px; }

.left { margin:5px 5px 5px 0; }

/*-- oc home page --/

#oc{ background:#B9E1F4; margin-top:80px; height:500px; display:block; float:left; width:100%; text-align:left; }

#oc h1 {font-size:18px; margin:0 10px;}





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


.foot{	
width:100%;
margin:0 auto;
clear:both;
position:relative;
background:#A9CBE1;	
padding:20px 0;
margin-bottom:-24px;
}

.foot a{
text-decoration:none;
}

.foot li { margin:0; }

footer{ margin:10px; width:310px; float:left; }

footer p{margin:.3em 0;}

.hginfo{width:630px; float:left; margin-top:5px;}

.hginfo li{float:left; font-size:.865em;}

.hginfo li a{
background:url(http://ocmd_mood.s3.amazonaws.com/white50.png) repeat transparent;
background:rgba(255,255,255,.5); 
padding:5px;
margin:5px;
float:left;
}

.services{ max-width:620px; float:left; padding:5px; }

.services h1{font-size:18px; margin:1em 0 .2em;}


.services li a{ margin:.2em 0; padding:.2em 0; display:block; font-size:.865em;}

/*-------------
	SELF CLEARING FLOATS
---------------*/
.group:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

/*
------------
    Self Clearing Floats
------------
*/

/* IE6 */
* html .group {
	height:1%;
}

/* IE7 */
*:first-child+html .group{
	min-height: 1px;
}