html { 

	overflow-y:scroll;
	
}



body {
	
	background-color: #f0efea;
	font-family: Helvetica, Arial, Geneva, sans-serif;
	font-weight: normal;
	
}

#header, #main, #footer {
	
	width: 800px;
	margin: 0 auto;
	padding-left: 75px;
	padding-right: 125px;
	
}

#header {
	
	padding-top: 25px;
	overflow: hidden;

}

#header-wrapper {
	width: 100%;
	margin: 0 auto;
	background-color: #ffffff;
	overflow: hidden;
}

#dropyx-logo {
	
	background-image: url(../images/dropyx-logo-small.png);
	width: 99px;
	height: 29px;
	text-indent: -500em;
	float: left;
	display: block;
}

/* @group Top Links */

/*
*	Top Links Menu Setup - Image Rollover
*/
ul.top-menu {
	list-style: none;
	padding: 0px;
	float: right;
	margin-top: 5px;
	display:inline;
	}

.displace {
	position: absolute;
	left: -5000px;
	}

ul.top-menu li {
	float: left;
	overflow:hidden;
	}

ul.top-menu li a {
	display: block;
	height: 13px;
	background: url(../images/top-links.png);
	overflow:hidden;
	}

/*
*	Normal Links
*/
ul.top-menu li.hello a {
	background-position: 0 0;
	width: 39px;
	}
	
ul.top-menu li.our-process a {
	background-position: -39px 0;
	width: 85px;
	}
	
ul.top-menu li.the-work a {
	background-position: -124px 0;
	width: 70px;
	}
	
ul.top-menu li.contact a {
	background-position: -194px 0;
	width: 46px;
	}

/*
*	Hover Links
*/
ul.top-menu li.hello a:hover {
	background-position: 0 -14px;
	}
	
ul.top-menu li.our-process a:hover {
	background-position: -39px -14px;
	}	

ul.top-menu li.the-work a:hover {
	background-position: -124px -14px;
	}
ul.top-menu li.contact a:hover {
	background-position: -194px -14px;
	}

/*
*	Selected/Active Links
*/
ul.top-menu li.hello a.selected {
	background-position: 0 -14px;
	}
ul.top-menu li.our-process a.selected {
	background-position: -39px -14px;
	}
ul.top-menu li.the-work a.selected {
	background-position: -124px -14px;
	}
	
ul.top-menu li.contact a.selected {
	background-position: -194px -14px;
	}

/* @end */



/* @group text-top-menu */

/*
*	text-top-menu Menu Setup - Non-Image Rollover
*/
ul.text-top-menu {
	list-style: none;
	padding: 0px;
	float: right;
	margin-top: 5px;
	display:inline;
	color: #73726b;
	}

ul.text-top-menu li {
	float: left;
	overflow:hidden;
	font: 13px Helvetica, "Helvetica Neue", Arial, Geneva, sans-serif;
	}

ul.text-top-menu li a {
	display: block;
	float: right;
	overflow:hidden;
	color: #73726b;
	text-decoration: none;
	}
ul.text-top-menu li a:hover,
ul.text-top-menu li a.selected {
	text-decoration: none;
	border-bottom: 1px solid #73726b;
	color: #fa6261;
	}


/* @end */

/* @group css buttons */

.clear { /* generic container (i.e. div) for floating buttons */
    overflow: hidden;
    width: 100%;
}

a.hoverbutton {
    background: transparent url(../images/button-background-end.png) no-repeat scroll top right;
    color: #fff;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 19px;
    margin-right: 8px;
    padding-right: 6px; /* sliding doors padding */
    text-decoration: none;
}

a.hoverbutton span {
    background: transparent url(../images/button-background-big.png) no-repeat;
    display: block;
    line-height: 13px;
    padding: 3px 0 3px 7px;
} 

a.hoverbutton:hover {
    background-position: bottom right;
    color: #000;
    outline: none; /* hide dotted outline in Firefox */
}

a.hoverbutton:hover span {
    background-position: bottom left;
    padding: 3px 0 3px 7px; /* push text down 1px */
    color: #ffffff;
} 

/* @end */



#big-text-index {
	
	margin-top: 44px;
	text-indent: -500em;
	
}

#small-text-header {
	
	margin: 40px 0 55px 0;
	width: 515px;
	
}

#small-text-header p {
	
	color: #fa6261;
	font-size: 16px;
	line-height: 18px;
	margin-bottom: 18px;
}

#small-text-header p a {
	text-decoration: underline;
	color: #73726b;
}

#small-text-header p a:hover {
	text-decoration: none;
	color: #73726b;
}

.clear-both {	
	clear: both;	
}


#footer {
	background-color: #f0efea;
}


#main {
	color: #747a6b;
	padding-top: 35px;

	overflow: auto;
}

#footer {
	clear: both;
	margin-top: 133px;
	
}

.main-rightpadding {
	
	margin-right: 25px;
	display: inline;
	
}

#left-main {
	float: left;
	width: 250px;
	min-width: 250px;
	max-width: 250px;
	display:inline;
	margin-right: 25px;
	
}

#left-main h2 {
	font-size: 24px;
	line-height: 24px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-decoration: none;
	letter-spacing: -1px;
	color: #585d4b;
	padding-bottom: 4px;
	border-bottom: 1px solid #cdccc7;
	margin-bottom: 25px;
}

#left-main p {
	font-size: 12px;
	font-weight: normal;
	color: #747a6b;
	margin-bottom: 10px;
}

#left-content-container-homepage {
	height: 228px;
	min-height: 228px;
	max-height: 228px;
	overflow: hidden;
}

#left-main h3 {
	
	border-bottom:1px solid #FA6261;
	color:#747A6B;
	display:inline-block;
	font-size:12px;
	line-height:13px;
	margin-bottom:15px;
	
}

#left-main p.portfolio-para {
	margin-bottom:25px;
}

#left-main img {
	margin: 0 auto;	
}


.left-contactus {
	clear: both;
	padding-top: 14px;
	border-top: 1px solid #cdccc7;
}

.left-portfolio-contactus {
	clear: both;
	padding-top: 14px;
}

#right-main {
	
	float: left;
	width: 525px;
	min-width: 525px;
	max-width: 525px;
	display:inline;
	
}

#right-main h2 {
	font-size: 24px;
	line-height: 24px;
	font-weight: normal;
	font-style: normal;
	font-variant: normal;
	text-decoration: none;
	letter-spacing: -1px;
	color: #585d4b;
	padding-bottom: 4px;
	border-bottom: 1px solid #cdccc7;
	margin-bottom: 25px;
}

#right-main .showcase-nav-span {
	
	float: right;
	display: inline;
	
}

#right-main .showcase-nav-smalltext {
	
	font-size:13px;
	font-weight: normal;
	letter-spacing: 0.25px;
	
}

#right-main h2 span a {
	cursor:pointer;
	cursor:hand;
}

#footer {
	clear: both;
	overflow: auto;
	padding-bottom: 35px;
}

#left-footer {
	float: left;
	width: 250px;
	min-width: 250px;
	max-width: 250px;
	display:inline;
	margin-right: 25px;
	border-top: 1px solid #cdccc7;
	padding-top: 11px;
	
}

#left-footer p {
	font-size: 12px;
	color: #bdbfb6;

}

#right-footer {
	float: left;
	width: 525px;
	min-width: 525px;
	max-width: 525px;
	display:inline;
	border-top: 1px solid #cdccc7;
	padding-top: 7px;
}

#footer-links, .footer-language-selection, .alternate-footer-language-selection  {
	font-size: 12px;
	line-height: 12px;
	color: #747a6b;
}

.footer-language-selection {
	display: block;
	float: left;
	width: 100px;
	padding: 4px 0px 2px 0px;
	border-bottom: 1px solid #cdccc7;
	background: url(../images/footer-down-arrow.png) no-repeat 2px 5px;
	text-indent: 15px;
	text-decoration: none;
}

.footer-language-selection:hover {
	text-decoration: none;
	background: #cdccc7 url(../images/footer-down-arrow-hover.png) no-repeat 2px 5px;
	
}

.alternate-footer-language-selection {
	display: block;
	float: left;
	width: 100px;
	padding: 4px 0px 2px 0px;
	text-indent: 15px;
	text-decoration: none;
	
}

.alternate-footer-language-selection:hover {
	text-decoration: none;
	background: #cdccc7;
}

#footer-links {
	margin-top: 3px;
	float:right;
	width: 275px;
	text-align: right;
}

#footer-links a, a:hover {
	color: #747a6b;
	text-decoration: none;
}

#footer-links a {
	text-decoration: none;
}

#footer-links a:hover {
	text-decoration: underline;
}


.showcase-nav-smalltext a {
	color: #585D4B;
	text-decoration: none;	
	
}

.showcase-nav-smalltext a:hover {
	
	text-decoration: underline;	
	
}

.showcase {
	float: left;
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	color: #585d4b;
	font-size: 13px;
	margin-bottom: 32px;
}

.showcase-container {
	clear: both;
	overflow: auto;
}

.showcase-level {
	overflow: auto;
}

.showcase-image {
	width: 244px;
	max-width: 244px;
	min-width: 244px;
	height: 169px;
	background-color: white;
	padding-top: 5px;
	padding-left: 6px;
	margin-bottom: 15px;
}

.showcase-image img {
	width: 238px;
	height: 164px;
}
.showcase-field{
	clear: both;
	float: left;
	width: 40px;
}
.showcase-entry-name, .showcase-entry-url {
	float: left;
}

.showcase-entry-url {
	border-bottom: 1px solid #585d4b;
}

.showcase-entry-url a {
	color: #fa6261;
	text-decoration: none;
}
.showcase-entry-url a:hover {
	color: #fa6261;
	text-decoration: none;
}
.showcase-readmore {
	clear: both;
	margin-top: 12px;
	padding-top: 14px;
	border-top: 1px solid #cdccc7;
}

#process-left{
	
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: left;
	display: inline;
	margin-right: 25px;
}

#process-left p {
	color: #747a6b;
	font-size: 12px;
	margin-bottom: 15px;
	line-height: 13px;
	
}

#process-left p span {
	font-weight: bold;	
}

#process-right{
	
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: right;
}

#process-right h3 {
	display: inline-block;
	color: #747a6b;
	font-size: 12px;
	line-height: 11px;
	border-bottom: 1px solid #fa6261;
	margin-bottom: 4px;
}

#process-right p {
	color: #747a6b;
	font-size: 11px;
	margin-bottom: 10px;
	line-height: 13px;
	
}

#process-right p span {
	font-weight: bold;	
}

#contact-upper {
	overflow: auto;
	border-bottom: 1px solid #CDCCC7;
}

#contact-upper-left {
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: left;
	display: inline;
	margin-right: 25px;
}

#company-name, .contact-title, .contact-detail {
	font-size: 22px;
	font-weight: normal;
	letter-spacing: -1px;
	
}


#company-name {
	color: #fa6261;
	font-size: 22px;
	margin-bottom: 25px;
}

.contact-title  {
	display: inline-block;
	color: #585d4b;
	border-bottom: 1px solid #fa6261;
	line-height: 16px;
	margin-bottom: 5px;
	
}

.mac.webkit .contact-title  {
	display: inline-block;
	color: #585d4b;
	border-bottom: 1px solid #fa6261;
	line-height: 20px;
	margin-bottom: 5px;
	
}

.contact-detail {
	color: #73726b;
	margin-bottom: 5px;
	
}

#contact-upper-right {
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: right;
}

.contact-small-text {
	font-size: 12px;
	color: #747a6b;
	margin-bottom: 47px;
}

.impress-small-text {
	font-size: 12px;
	color: #747a6b;
	margin-bottom: 27px;
	
}

.contact-clearance {
	
	margin-bottom: 30px;
	
}
#contact-lower {
	overflow: hidden;
}

#contact-lower-left {
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: left;
	display: inline;
	margin-right: 25px;
}
#contact-lower-right {
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: right;
}

.spacer{clear:both; height:1px;}
/* ----------- My Form ----------- */
.myform{
	
	clear: both;
	margin-top: 25px;
	
	
}

/* ----------- stylized ----------- */

#contact-lower label {
	font-size: 11px;
	color: #747a6b;
	display:block;
	font-weight:normal;
	text-align:left;
	margin-bottom: 5px;
}
#contact-lower .small {
	color:#666666;
	display:block;
	font-size:11px;
	font-weight:normal;
	text-align:right;
	width:140px;
}
#contact-lower input {
	
	font-size:12px;
	padding:4px 2px;
	border:none;
	width: 250px;
	margin:0px 0 10px 0px;
}

#contact-lower input.submit-button {
	width: 75px;
	height: 19px;
	margin:8px 0 0 0;
	padding: 0px;
}

#contact-lower textarea {
	
	font-size:12px;
	padding:4px 2px;
	border:none;
	width: 250px;
	height: 113px;
	margin:0px 0 20px 0px;
}
#contact-lower button {
	
	background:#666666 url(../images/submit-button.png) no-repeat;
	width: 79px;
	height: 19px;
	clear:both;
	text-indent: -500em;
	}
	
#contact-error {
	
	font-size: 12px;
	color: #fa6261;
	margin-bottom: 20px;

	
}

#contact-error ul {
	list-style-type: disc;
	margin-top: 5px;
	list-style-image: none;
	list-style-position: outside;
	color: #fa6261;
}

#contact-error ul li {
	color: #fa6261;
	text-indent: 10px;
	margin-top: 5px;
	
}

#portfolio-page-text, #portfolio-pages, #portfolio-arrows {
	color: #747a6b;
	float: left;
	display: inline;
	font-size: 13px;
	margin-bottom: 20px;
	font-weight: bold;
}

#portfolio-page-text {
	margin-right: 25px;
	
}

#portfolio-pages {
	
	margin-right: 15px;
	
}

#portfolio-arrows a {
	color: #747a6b;
	text-decoration: none;
	cursor:pointer;
	cursor:hand;
	
}

#portfolio-arrows a:hover {
	color: #747a6b;
	text-decoration: underline;
	cursor:pointer;
	cursor:hand;	
	
}

#portfolio-navigation, #portfolio-individual-controls {
	
	font-size: 13px;
	color: #747a6b;
	font-weight: bold;
	margin-top: 3px;
	float: left;
	
}

#portfolio-navigation a, #portfolio-individual-controls a {
	color: #747a6b;
	text-decoration: none;
}

#portfolio-navigation a:hover, #portfolio-individual-controls a:hover {
	text-decoration: underline;
	cursor:pointer;
	cursor:hand;	
}

#portfolio-individual-controls {
	clear: both;
	margin-bottom: 20px;
}

#portfolio-image-number {
	color: #fa6261;
}

#portfolio-slideshow {
	clear: both;
	background: #ffffff;
	width: 515px;
	max-width: 515px;
	min-width: 515px;
	margin-bottom: 45px;
	overflow: hidden;
	border: 5px solid #ffffff;
}

#portfolio-slideshow img {
	display: none;
}

#portfolio-details {
	clear: both;
	width: 515px;
	max-width: 515px;
	min-width: 515px;	
}

#portfolio-details p {
	
	color: #747a6b;
	font-size: 12px;
	margin-bottom: 15px;
	line-height: 13px;
	
}

#portfolio-details h3 {
	
	display: inline-block;
	color: #747a6b;
	font-size: 12px;
	line-height: 11px;
	border-bottom: 1px solid #fa6261;
	margin-bottom: 4px;
	
}

#portfolio-left {
	
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: left;
	display: inline;
	margin-right: 25px;
}

#process-right{
	
	width: 250px;
	max-width: 250px;
	min-width: 250px;
	float: right;
}
