#slide {
    height:200px;
    margin:0px auto;
    width:100%;
    padding:0px;
    background-size:100% auto;
    background-color:transparent; background-repeat:no-repeat;background-position:center center;
}
#main .right img {
    width:100%;
}

#gmap {
	min-height:400px;
        width:100%;
        margin:20px auto;
}

#map_canvas_container {position: relative;}
#map_canvas {position: absolute; top: 0; right: 0; bottom: 0; left: 0;}

.map_note { text-align:center; font-style:italic; margin-bottom:10px; } 


#view_picture {
    padding:10px 50px 50px 50px;
    width:100%;
    height:100%;
    display:table;
    background:black;
}

.extralink {
	margin-top:10px;
}

.extralink + #gmap {
	margin-top:10px;
}

.extralink a {
	display:table;
	padding:10px 5px;
	margin:0px auto;
	color:white;
	background:#0077BE;
	color:white;
	text-transform:uppercase;
	text-align:center;
	font:20px;
	width:auto;
	text-decoration:none;
	text-decoration:none;
	border:1px solid #ffffff;
}

.extralink a:hover {
		color:#0077BE;
		background:white;
	border:1px solid #0077BE;
}

#main .right .margin { position:relative; margin-top:-100px; display:table; z-index:50; width:100%; }

#main .right .white-border {
    border:30px solid rgba(255,255,255,0.85);
    margin:0px auto; display:table;
    width:100%;
    height:100%;
    position:absolute;
    z-index:10;
    top:0px;
    left:0px;
    right:0px;
    bottom:0px;
    margin:0px;
    padding:0px;
    display:table-cell;
    cursor:pointer;
}

#main .left .resume .content h2  {
    text-transform:uppercase;
    font:32px Geogrotesque-Thin,Helvetica,Sans-Serif;
    color:#585857;
    text-align: left;
    margin:30px auto;
    padding:0px;
}

#other_projects {
    margin-top:30px;
}

#other_projects_box {
    margin-top:30px;
}

#main .left .resume .content {
    text-align:justify;
}

#main .left .technicalbox {
   border-bottom:1px solid #585857;
   padding-bottom:15px;
   margin-bottom:30px;
}


#main .left .technicalbox h2 {
    border-top:1px solid #585857;
    width:100%;
    padding:20px 0px;
    text-align:center;
    color:#585857;
    text-transform:uppercase;
    font-size:24px;
    margin:30px auto 0px auto;
    cursor:pointer;
    background:transparent url(../img/BG-menu-icon-brown.png) no-repeat 50% 90%;
}

#main .left .technicalbox h2.rotate {
    background-image:url(../img/BG-menu-icon-brown-rotate.png);
}

#main .left .technicalbox .content {
    display:none;
    font-size:16px;
}

#main .left .technicalbox .content ul {
    list-style:none;
    margin:0px 0px 20px 0px;
    padding:0px;
}

#main #title_of_project {
    background:#7284aa;
    color:white;
    text-align:right;
    padding:40px 20px 20px 20px;
}

#main #title_of_project .img_title {
    margin:0px;
    padding:20px 0px 30px 0px;
    font:40px Geogrotesque-Thin,Helvetica,Sans-Serif;
    text-transform: uppercase;
}

#imagebox img {
    width:100%;
    max-width:100%;
    padding:0px;
}

.imageboxwrap {
    padding:2px 0px;
    margin:0px;
}

.aspect-ratio {
  margin:20px auto;
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 51%;
}

.aspect-ratio iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0; top: 0;
}



#imagebox .imglist { 
    padding:1px 0px; 
    overflow:auto;
    float:none;
    clear:both;
}

.imglist .imageboxwrap:nth-child(even) {
    padding-right:0px;
    padding-left:1px;   
    padding-bottom:0px;
}

.imglist .imageboxwrap:nth-child(odd) {
    padding-right:1px;
    padding-left:0px;
    padding-bottom:0px;
}

.cursor {
    cursor:pointer;
}


@media (max-width:720px) {
    #slide { display:none; }
    
    #main .left .resume .content h2 { text-align:left; }
    
    #main .right .white-border { border:0px; }
    
    #main .right .margin  {
        margin-top:0px !important;  
    }
    
    .breadcrumbs {
        top:auto;
        margin:0px;
        margin-top:10px;
        padding:0px 5px;
        position:relative;
    }
    
    #title_of_project {
        display:none;
    }
    
    #overlay .modalbox {
        top:100px;
    }
}