@charset "UTF-8";
/* CSS Document */

body {
    background-image: url(images/background-black.png);
    background-position: left top;
    background-repeat: repeat-y;
    background-color: #000;
    color: #000;	
    font: 12px Verdana, arial;
    text-align: left;
    overflow: visible;
}

* {
    padding: 0;
    margin: 0;
}
/*---:[ global elements ]:---*/

a {
    color: #660000;
    text-decoration: underline;
}
a:visited {
    color: #660000;
    text-decoration: underline;
}
a:active {
    color: #000;
}
a:hover {
    color: #000;
    text-decoration: underline;
}
a img {
    border: none;
}
#wrapper11 {
    position: relative;
    width: 1060px;
    height: 535px;
    top: 50%;
    left: 50%;
    margin: 177px 1000px auto auto;
}
#wrapper {
    position: absolute;
    top: 50%;
    margin-top: -294px;
    left: 0%;
    margin-left: 30px;
    width: 1060px;
    height: 535px;
}
#wrapper_old {
    position: absolute;
    top: 50%;
    margin-top: -294px;
    left: 50%;
    margin-left: -656px;
    width: 1312px;
    height: 535px;
}
#leftnav {
    position: absolute;
    top: 60px;
    width: 126px;
    height: 475px;
    background-color: #656565;
}
#nav-home {
    position: absolute;
    top: 53px;
    width: 125px;
    height: 25px;
	margin-left:10px;
    /* background-image: url(images/btn-home.png); */
}
#nav-home >a{
	color:#fff;
	font-size:12px;
	text-decoration:none;
}
#nav-home>a:hover {
	color:#cc3333;
	font-size:12px;
	text-decoration:none;
    /* background-image: url(images/btn-home-on.png); */
}
#nav-profile {
    position: absolute;
    top: 129px;
    width: 125px;
    height: 25px;
	margin-left:10px;
    /* background-image: url(images/btn-profile.png); */
}
#nav-profile >a{
	color:#fff;
	font-size:12px;
	text-decoration:none;
}
#nav-profile>a:hover {
	color:#cc3333;
	font-size:12px;
	text-decoration:none;
    /* background-image: url(images/btn-home-on.png); */
}

#nav-portfolio {
    position: absolute;
    top: 205px;
    width: 125px;
    height: 25px;
	margin-left:10px;
    /* background-image: url(images/btn-current-work.png); */
}
#nav-portfolio >a{
	color:#fff;
	font-size:12px;
	text-decoration:none;
}
#nav-portfolio>a:hover {
	color:#cc3333;
	font-size:12px;
	text-decoration:none;
    /* background-image: url(images/btn-home-on.png); */
}
#nav-contact {
    position: absolute;
    top: 205px;
    width: 125px;
    height: 25px;
	margin-left:10px;
    /* background-image: url(images/btn-contact.png); */
}
#nav-contact >a{
	color:#fff;
	font-size:12px;
	text-decoration:none;
}
#nav-contact>a:hover {
	color:#cc3333;
	font-size:12px;
	text-decoration:none;
    /* background-image: url(images/btn-home-on.png); */
}
#nav-gray {
    position: absolute;
    top: 325px;
    width: 126px;
    height: 45px;
    background-color: #000;
}
#white-mid {
    position: absolute;
    top: 0px;
    left: 126px;
    width: 1px;
    height: 535px;
    background-color: #fff;
}
#middlenav {
    position: absolute;
    top: 0px;
    left: 127px;
    width: 173px;
    height: 535px;
    background-color: #cc3333;
}
#middlenav-gray {
    position: absolute;
    top: 0px;
    left: 127px;
    width: 173px;
    height: 535px;
    background-color: #a3a3a3;
}
#projectnav {
    position: absolute;
    top: 536px;
    left: 0;
    width: 173px;
    height: 26px;
    background-color: #000;
}
#logo {
    position: absolute;
    top: 0;
    left: -1px;
    width: 175px;
    height: 60px;
    background-image: url(images/dinar-logo-black.png);
}
#subnav-multi {
    position: absolute;
    top: 111px;
    left: 5px;
    width: 185px;
    height: 35px;
	
    /* background-image: url(images/subnav-multi.png); */
}

#subnav-multi > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-multi > a :hover {
	color:#000;
    /* background-image: url(images/subnav-multi-on.png); */
}
#subnav-residences {
    position: absolute;
    top: 188px;
    left: 5px;
    width: 185px;
    height: 15px;
	/* background-image: url(images/subnav-residences.png); */
}
#subnav-residences > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-residences > a :hover {
	color:#000;
    /* background-image: url(images/subnav-multi-on.png); */
}
#subnav-commercial {
    position: absolute;
    top: 264px;
    left: 5px;
    width: 185px;
    height: 35px;
    /* background-image: url(images/subnav-commercial.png); */
}
#subnav-commercial > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-commercial > a :hover {
	color:#000;
    /* background-image: url(images/subnav-multi-on.png); */
}
#subnav-transportation {
    position: absolute;
    top: 339px;
    left: 5px;
    width: 185px;
    height: 15px;
    /* background-image: url(images/subnav-transportation.png); */
}
#subnav-transportation > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-transportation > a :hover {
	color:#000;
    /* background-image: url(images/subnav-multi-on.png); */
}
#subnav-community {
    position: absolute;
    top: 465px;
    left: 5px;
    width: 185px;
    height: 35px;
    /* background-image: url(images/subnav-community.png); */
    /* background-repeat: no-repeat; */
}
#subnav-community > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-community > a :hover {
	color:#000;
    /* background-image: url(images/subnav-multi-on.png); */
}
#subnav-renderings {
    position: absolute;
    top: 405px;
    left: 0px;
    width: 123px;
    height: 35px;
	margin-left:10px;
    /* background-image: url(images/subnav-renderings.png); */
}
#subnav-renderings > a   {
	color:#fff;	
	text-decoration:none;
}

#subnav-renderings > a :hover {
	color:#cc3333;
    /* background-image: url(images/subnav-multi-on.png); */
}
#nav-prev {
    position: absolute;
    top: 0;
    left: 0;
    width: 45px;
    height: 26px;
    background-image: url(images/nav-prev.png);
}
#nav-prev:hover {
    background-image: url(images/nav-prev-on.png);
}
#nav-browse {
    position: absolute;
    top: 0;
    left: 45px;
    width: 83px;
    height: 26px;
    background-image: url(images/nav-browse.png);
}
#nav-browse:hover {
    background-image: url(images/nav-browse-on.png);
}
#nav-next {
    position: absolute;
    top: 0;
    left: 128px;
    width: 45px;
    height: 26px;
    background-image: url(images/nav-next.png);
}
#nav-next:hover {
    background-image: url(images/nav-next-on.png);
}
#content {
    position: absolute;
    top: 60px;
    left: 300px;
    width: 759px;
    height: 475px;
    background-color: #656565;
    background-image: url(images/content-bg.jpg);
    background-repeat: no-repeat;
}
#content1 {
    position: absolute;
    top: 60px;
    left: 300px;
    width: 1235px;
    height: 475px;
    background-color: #656565
}
#blackline1a {
    position: absolute;
    top: -50%;
    left: 0;
    width: 1px;
    height: 200%;
    background-color: #fff;
}
#blackline1 {
    position: absolute;
    top: 0;
    left: 95px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline2 {
    position: absolute;
    top: 0;
    left: 190px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline3 {
    position: absolute;
    top: 0;
    left: 285px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline4 {
    position: absolute;
    top: 0;
    left: 380px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline5 {
    position: absolute;
    top: 0;
    left: 475px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6 {
    position: absolute;
    top: 0;
    left: 572px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline61 {
    position: absolute;
    top: 0;
    left: 570px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6a {
    position: absolute;
    top: 0;
    left: 665px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6ac {
    position: absolute;
    top: 0;
    left: 762px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6ac1 {
    position: absolute;
    top: 0;
    left: 760px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6acc {
    position: absolute;
    top: 0;
    left: 85px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6acc1 {
    position: absolute;
    top: 0;
    left: 855px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6bcc1 {
    position: absolute;
    top: 0;
    left: 950px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6ccc1 {
    position: absolute;
    top: 0;
    left: 1045px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6dcc1 {
    position: absolute;
    top: 0;
    left: 1140px;
    width: 1px;
    height: 475px;
    background-color: #b3b3b3;
}
#blackline6b {
    position: absolute;
    top: 0;
    left: 1235px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline6b1 {
    position: absolute;
    top: 0;
    left: 950px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline6bb {
    position: absolute;
    top: 0;
    left: 1235px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline7 {
    position: absolute;
    top: 95px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline71 {
    position: absolute;
    top: 95px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline8 {
    position: absolute;
    top: 190px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline81 {
    position: absolute;
    top: 190px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline9 {
    position: absolute;
    top: 285px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline91 {
    position: absolute;
    top: 285px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline10 {
    position: absolute;
    top: 380px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline101 {
    position: absolute;
    top: 380px;
    left: 0;
    width: 1235px;
    height: 1px;
    background-color: #b3b3b3;
}
#blackline11 {
    position: absolute;
    top: 474px;
    left: 0;
    width: 950px;
    height: 1px;
    background-color: #fff;
}
#projectname {
    position: absolute;
    top: 450px;
    left: 0;
    left: 1px;
    width: 748px;
    height: 14px;
    background-color: #fff;
    opacity: 0.65;
    filter: alpha(opacity=65);
    padding: 5px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 10px;
    text-transform: uppercase;
}
#whiteline {
    position: absolute;
    top: 50%;
    margin-top: -235px;
    width: 117%;
    height: 1px;
    background-color: #fff;
}
#whiteline2 {
    position: absolute;
    top: 50%;
    margin-top: 241px;
    width: 117%;
    height: 1px;
    background-color: #fff;
}
#copyright {
    position: absolute;
    top: 536px;
    left: 0;
    width: 115px;
    height: 26px;
    background-color: #000;
    padding: 5px;
    font-size: 8px;
    color: #333;
}





#blackline_1 {
    position: absolute;
    top: 0;
    left: 757px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline_2 {
    position: absolute;
    top: 0;
    left: 1011px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline_3 {
    position: absolute;
    top: 0;
    left: 502px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}
#blackline_4 {
    position: absolute;
    top: 0;
    left: 249px;
    width: 1px;
    height: 475px;
    background-color: #fff;
}



@media screen and (min-width: 1025px) and (max-width: 1280px) {
    #whiteline {
    position: absolute;
    top: 50%;
    margin-top: -235px;
    width: 125%;
    height: 1px;
    background-color: #fff;
}
#whiteline2 {
    position: absolute;
    top: 50%;
    margin-top: 241px;
    width: 125%;
    height: 1px;
    background-color: #fff;
}
}









@media screen and (min-width: 360px) and (max-width: 414px) {
    #whiteline {
    position: absolute;
    top: 50%;
    margin-top: -235px;
    width: 500%;
    height: 1px;
    background-color: #fff;
}
#whiteline2 {
    position: absolute;
    top: 50%;
    margin-top: 241px;
    width: 500%;
    height: 1px;
    background-color: #fff;
}
}



@media screen and (min-width: 414px) and (max-width: 768px) {
    #whiteline {
    position: absolute;
    top: 50%;
    margin-top: -235px;
    width: 300%;
    height: 1px;
    background-color: #fff;
}
#whiteline2 {
    position: absolute;
    top: 50%;
    margin-top: 241px;
    width: 300%;
    height: 1px;
    background-color: #fff;
}
}



@media screen and (min-width: 768px) and (max-width: 1024px) {
    #whiteline {
    position: absolute;
    top: 50%;
    margin-top: -235px;
    width: 160%;
    height: 1px;
    background-color: #fff;
}
#whiteline2 {
    position: absolute;
    top: 50%;
    margin-top: 241px;
    width: 160%;
    height: 1px;
    background-color: #fff;
}
}