/* -------------------------------------------------------------------------------

    0.  CSS Reset & Clearfix
    1.  Document Setup
    2.  Header
    3.  Navigation
    4.  Welcome Section
    5.  About Section
    6.  Portfolio Section
    7.  Contact Section
    8.  Footer
    9.  Media Queries

---------------------------------------------------------------------------------- */


/* ------------------------------------------------------------------------------- */
/*  0.  Reset & Clearfix (http://meyerweb.com/eric/tools/css/reset/)
/* ------------------------------------------------------------------------------- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,and,address,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,textarea,select{background:transparent;border:0;font-size:100%;margin:0;outline:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}del{text-decoration:line-through}hr{background:transparent;border:0;clear:both;color:transparent;height:1px;margin:0;padding:0}mark{background-color:#ffffb3;font-style:italic}input,select{vertical-align:middle}ins{background-color:red;color:white;text-decoration:none}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}

.clear{clear:both;display:block;height:0;overflow:hidden;visibility:hidden;width:0}.clearfix:after{clear:both;content:' ';display:block;font-size:0;height:0;line-height:0;visibility:hidden;width:0}* html .clearfix,:first-child+html .clearfix{zoom:1}


/* ------------------------------------------------------------------------------- */
/*  1.  Document Setup
/* ------------------------------------------------------------------------------- */

    body {
        margin: 0px;
        padding: 0px;
        background: url(../images/bg_03.png) top left repeat-x, url(../images/bg_01.jpg) top left repeat;
        font: 14px/1.5 'Muli', sans-serif;
        color: #676867;/*this is the body text*/
        text-shadow: 0 2px 1px rgba(255, 255, 255, 0.3);
        -webkit-font-smoothing: antialiased;
        -webkit-text-size-adjust: 100%;
    }
	@font-face {
    font-family: 'times_sans_serifregular';
    src: url('timess__-webfont.eot');
    src: url('timess__-webfont.eot?#iefix') format('embedded-opentype'),
         url('timess__-webfont.woff') format('woff'),
         url('timess__-webfont.ttf') format('truetype'),
         url('timess__-webfont.svg#times_sans_serifregular') format('svg');
    font-weight: normal;
    font-style: normal;

}
    /*  IE Styles  --------------------------------*/
        .ie8 body {
            background: url(../images/bg_01.jpg); top left repeat;
        }

    #container {
        width: 940px;
        margin: 50px auto 50px;
    }
    #content {
		text-align:center;
        background: url(../images/bg_05.png) bottom left repeat-x, url(../images/bg_02.jpg) top left repeat;
        -webkit-border-radius: 10px;
           -moz-border-radius: 10px;
                border-radius: 10px;
        -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
           -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
    }
    /*  IE Styles  --------------------------------*/
        .ie8 #content {
            background: url(../images/bg_02.jpg); top left repeat;
            -moz-border-radius: 5px;
                 border-radius: 5px;
            -moz-box-shadow: 0px 3px 13px #000;
                 box-shadow: 0px 3px 13px #000;
                   behavior: url(js/radius-shadow.htc);
        }

    a, a > * { 
        color:#2D756C;/*This is the Header color */
        text-decoration: none; 
        -webkit-transition: background-color .2s linear, color .2s linear;
           -moz-transition: background-color .2s linear, color .2s linear;
             -o-transition: background-color .2s linear, color .2s linear;
            -ms-transition: background-color .2s linear, color .2s linear;
                transition: background-color .2s linear, color .2s linear;
    }
    a:hover, a > *:hover {
        color:#686867;
    }
	.breadcrumbs{width:auto; height:60px;padding-bottom:30px;}
    .submit {
        font-size: 15px;
		font-family: 'Muli', sans-serif;
        font-weight: bold;
        color: #686867;
        text-shadow: none;
        cursor: pointer;
        padding: 11px;
        background: -moz-linear-gradient(top, rgba(45,117,108, 0.35) 0%, rgba(45,117,108, 0.65) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(45,117,108, 0.35)), color-stop(100%, rgba(45,117,108, 0.65)));
        background: -webkit-linear-gradient(top,  rgba(45,117,108, 0.35) 0%, rgba(45,117,108, 0.65) 100%);
        background: -o-linear-gradient(top, rgba(45,117,108, 0.35) 0%, rgba(45,117,108, 0.65) 100%);
        background: -ms-linear-gradient(top, rgba(45,117,108, 0.35) 0%, rgba(45,117,108, 0.65) 100%);
        background: linear-gradient(top, rgba(45,117,108, 0.35) 0%, rgba(45,117,108, 0.65) 100%);
        border: none;
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
        -webkit-transition: background-color .2s linear;
           -moz-transition: background-color .2s linear;
             -o-transition: background-color .2s linear;
            -ms-transition: background-color .2s linear;
                transition: background-color .2s linear;
    }
    /*  IE Styles  --------------------------------*/
        .ie9 .submit {
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzUzN2JjNiIgc3RvcC1vcGFjaXR5PSIwLjY1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMzE3NGMiIHN0b3Atb3BhY2l0eT0iMC42NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        }
        .ie8 .submit {
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6537bc6', endColorstr='#a603174c',GradientType=0 );
        }

    input, textarea {
        font: 14px/1.5 
		font-family: 'Muli', sans-serif;
        color: #422a03;
        padding: 6px 10px;
        background-color: #fff;
        border: 1px solid #d4c9b3;
        border-top: 1px solid #a89884;
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(255, 255, 255, 0.5);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(255, 255, 255, 0.5);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.15), 0 1px 2px rgba(255, 255, 255, 0.5);
        -webkit-transition: box-shadow .2s linear;
           -moz-transition: box-shadow .2s linear;
             -o-transition: box-shadow .2s linear;
            -ms-transition: box-shadow .2s linear;
                transition: box-shadow .2s linear;
    }

    h1 {
        font-size: 48px;
		font-family: 'times_sans_serifregular';
    }
	 h2 {font-size: 14px;
		font-family: 'Muli', sans-serif;
        line-height: 24px;
    }
    h3 {
        font-size: 24px;
		font-family: 'times_sans_serifregular';
        line-height: 40px;
        color: #676867;/*this is the subheader color*/
    }

    h4 {
        font-size: 13px;
		font-family: 'Muli', sans-serif;
    }
    h5 {
		font-size: 24px;
		font-family: 'times_sans_serifregular';
        line-height: 40px;
        color: #2D756C;/*this is the green Logo color*/
		}
	
	h6{}
	h7{}
	
    .separator {
        width: 100%;
        height: 15px;
        background: url(../images/separator_01.png) center no-repeat;
        position: relative;
		margin-top:40px;
    }


/* ------------------------------------------------------------------------------- */
/*  2.  Header
/* ------------------------------------------------------------------------------- */
    .header {
        height: 100px;
        margin-bottom: 20px;
        overflow: hidden;
        text-align: center;
		
    }
    #logo h2 {
        color:#676867;/* this is the logo Psychology in BJ*/
        line-height: 15px;
    }

/* ------------------------------------------------------------------------------- */
/*  3.  Navigation
/* ------------------------------------------------------------------------------- */

	
	
    .navigation {
        height:123px;
        background: url(../images/bg_nav.png) bottom left no-repeat;
        position: relative;
        text-align: center;
    }
    .tabs {
        margin-top: 12px;
        display: inline-block;
    }
    .tabs li {
        float: left;
        margin: 0 2px;
    }
    .tabs li > a {
        width: 106px;
        height: 26px;
        padding-top: 45px;
        display: block;
        font-size: 15px;
		font-family: 'Muli', sans-serif;
        font-weight: 600;
        color: #676867;/*This is the nav text color*/
        text-decoration: none;
    }
    .tabs li a:hover {
        background-color: rgba(45, 117, 108, 0.15);
        -webkit-border-radius: 5px;/*webkit gradient is for safari*/
           -moz-border-radius: 5px;
                border-radius: 5px;
        -webkit-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
           -moz-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
                box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
    }
    .tabs li.active {
        background: -moz-linear-gradient(top, rgba(45, 117, 108, 0.15) 0%, rgba(103, 104, 103, 0.30) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(45, 117, 108, 0.25)), color-stop(100%, rgba(45, 117, 108, 0.45)));
        background: -webkit-linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.25) 100%);
        background: -o-linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: -ms-linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
        -webkit-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
           -moz-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
                box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
    }
    /*  IE Styles  --------------------------------*/
        .ie9 .tabs li.active {
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RhYTk2OCIgc3RvcC1vcGFjaXR5PSIwLjQ1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YTQ2MDkiIHN0b3Atb3BhY2l0eT0iMC40NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        }
        .ie8 .tabs li.active {
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2D756C', endColorstr='#676867',GradientType=0 );
        }

    .tab-welcome {
        background: url(../images/tab_icons.png) 0 0;
    }
    .tab-about {
        background: url(../images/tab_icons.png) -106px 0;
    }
    .tab-portfolio {
        background: url(../images/tab_icons.png) -212px 0;
    }
    .tab-contact {
        background: url(../images/tab_icons.png) -318px 0;
    }
    .tabs .active .tab-welcome {
        background: url(../images/tab_icons.png) 0 -69px;
    }
    .tabs .active .tab-about {
        background: url(../images/tab_icons.png) -106px -69px;
    }
    .tabs .active .tab-portfolio {
        background: url(../images/tab_icons.png) -212px -69px;
    }
    .tabs .active .tab-contact {
        background: url(../images/tab_icons.png) -318px -69px;
    }


/* ------------------------------------------------------------------------------- */
/*  4.  Welcome Section
/* ------------------------------------------------------------------------------- */

    #welcome {
        overflow: hidden;
		
	
    }
	
	#dBird{
		width:80px;
		height:69px;
		float:right;
		display:inline-block;
		background: url(../images/logo_80x69.png) bottom left no-repeat;
		margin:-20px 210px 0px 0px;
		z-index:100;
	
		}
		
    .slider-wrapper {
        width: 830px;
        margin: 30px 40px 20px;
        padding: 15px;
        background-color: #fff;
        display: inline-block;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
                box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
    }

	.welcomeQuote{
		 width:700px;
		 height:auto;
		 float:left;
		 margin: 30px 0px 20px 100px;
		 padding: 10px;
		 display: inline-block;
		 text-align: center;
		 border: solid 1px #ccc;
		}
		

			
	.aboutQuote{
		 width:598px;
		 margin: 30px 0px 20px 0px;
		 padding: 10px 0px 15px 0px;
		 display: inline-block;
		 text-align: center;
		 border: solid 1px #ccc;
		 }
		
	#dColumn1{
		width:360px;
		height:auto;
		margin: 10px 50px 30px 90px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		
	}
	#dColumn2{		
		width:360px;
		height:auto;
		margin: 10px 0px 30px 0px;
		padding: 40px 0px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn3{
		width:360px;
		height:auto;
		margin: 10px 50px 30px 90px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn4{
		width:360px;
		height:auto;
		margin: 10px 0px 30px 0px;
		padding: 0px 0px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn5{
		width:360px;
		height:auto;
		margin: 10px 40px 40px 90px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn6{
		width:360px;
		height:auto;
		margin: 10px 0px 60px 0px;
		padding: 0px 0px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
/* ------------------------------------------------------------------------------- */
/*  5.  About Section
/* ------------------------------------------------------------------------------- */

    #about {
        overflow: hidden;
		
        
    }
    .about-header {
        width: 100%;
        margin-top: 10px;
        text-align: center;
    }


    /*  Resume  --------------------------------*/

    .resume-wrapper {
        width: 100%;
        margin-top: 25px;
        text-align: center;
    }
    .resume {
        width: 600px;
        display: inline-block;
    }
	
	.quoteWrapAboutSpecial{
			display:inline-block;
			width:450px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
		.quoteWrapExpSpecial{
			display:inline-block;
			width:360px;
			height:auto;
			float: right;
			overflow:hidden;
	}
     .photo {
        width: 140px;
        height: 140px;
        margin-top: 5px;
        float: left;
        border: 10px solid #FFF;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5);
    }


    .personal-info {
        width: 415px;
        margin: 4px 0 0 20px;
        text-align: left;
        float: left;
    }
    .personal-info li {
        margin-bottom: 14px;
        overflow: hidden;
    }
    .personal-info li label {
        font-weight: bold;
        float: left;      
    }
    .personal-info li span {
        width: 280px;
        float: right;
    }
    .personal-info li p {
        margin: 10px 0 10px;
        line-height: 24px;
    }


    /*  Experience  --------------------------------*/


    .experience {
        width: 500px;
		height:auto;
        margin: 20px 18px 0px 70px;
		padding-bottom:40px;
        float: left;
		text-align: left;
		
    }
	  .skillful{ 
	  	width: 548px;
		height:auto;
        margin: 20px 0px 0px 40px;
		padding-bottom:40px;
        float: left;
		text-align: left;
        }
		
    .experience h3, .skills h3  {
        font-size: 18px;
        line-height: 60px;
    }
    .experience li {
        margin-bottom: 15px;
    }
    .experience ul li:last-child {
        margin-bottom: 20px;
    }



	
	
  /* Revolving Quotes */
		blockquote {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 250px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}
			
		blockquotes {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 250px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}

.quote_wrap {
			display:inline-block;
			width: 280px;
			height: 220px;
			float: right;
			margin:40px 40px 0px 0px;
			text-align:left;
			overflow: hidden;
			z-index:80;
	}
	.quote_wrap2 {
			display:inline-block;
			width: 280px;
			height: 580px;
			float: right;
			margin-right: 40px;
			margin-top: 20px;
			margin-bottom: 10px;
			text-align:left;
			overflow: hidden;
			z-index:80;
	}

	.traits_wrap{
			width:150px;
			height: auto;
			position: relative;
			float:left;
			margin:0px 80px 30px 30px;
			overflow: hidden;
			z-index:1000;
	}
	
	
	   .traits  {
		   width:120px;
		   height:30px;
			float: left;
			text-align:left;
			display:block;
			
    }
	


cite{
	font: normal 20px 'times_sans_serifregular';
	color:#2D756C;
	padding: 0 0;
	float:right;
	}
	
cites{
	font: normal 20px 'times_sans_serifregular';
	color:#2D756C;
	padding: 0 0;
	float:left;
	}
	


  



/* Pull Quote */
.pullleft, .pullright { 
	float: right; 
	font-size: 15px; 
	font-style: italic; 
	color: #fff; 
	width: 33%; 
	margin: 20px 0px 15px 20px; 
	padding: 20px; 
	border-left: 5px solid #222; 
	}
.pullleft { float: left; margin-left: 0px; margin-right: 10px; }


/* Rounded Box Quote */

.box_quote{ float:left; width:100%; }
.comment{background: url(style/images/quote.png) no-repeat 15px 15px;
	padding:20px;
	background-color:#1b1b1b;
	margin-bottom:15px;
	font-size:14px;text-indent:40px;
	line-height:25px;
	color:#a4a4a4;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	}

/*Special quotes with quotemarks*/
.openQuote{
	width:50px;
	height:auto;
	display:inline-block;
	float:left;
	margin-right:10px;
	margin-bottom:15px;

	}
.closeQuote{
	width:50px;
	height:auto;
	display:inline-block;
	float:right;
	margin-left:10px;
	margin-bottom:15px;	
	}
	
	.openQuote2{
	width:50px;
	height:auto;
	display:inline-block;
	float:left;
	margin-right:10px;
	margin-bottom:65px;

	}
.closeQuote2{
	width:50px;
	height:auto;
	display:inline-block;
	float:right;
	margin-left:10px;
	margin-bottom:35px;	
	}

/* ------------------------------------------------------------------------------- */
/*  6.  Portfolio Section
/* ------------------------------------------------------------------------------- */

		
    #portfolio {
        padding: 0px 0px 20px 0px;
        overflow: hidden;
        
    }
	
    /*  Filter  --------------------------------*/

    #portfolio-filter {
        margin: 35px 0 25px;
        overflow: hidden;
        display: inline-block;
    }
    #portfolio-filter li {
        margin: 2px;
        float: left;
    }
    #portfolio-filter li a {
        padding: 4px 12px;
        font-size: 13px;
        font-weight: 600;
        color: #676867;
        text-decoration: none;
        -webkit-border-radius: 20px;
           -moz-border-radius: 20px;
                border-radius: 20px;
    }
    #portfolio-filter li a.current {
        background: -moz-linear-gradient(top, rgba(45, 117, 108, 0.25) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(45, 117, 108 0.25)), color-stop(100%, rgba(45, 117, 108, 0.45)));
        background: -webkit-linear-gradient(top, rgba(45, 117, 108 0.25) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: -o-linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: -ms-linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        background: linear-gradient(top, rgba(45, 117, 108, 0.45) 0%, rgba(45, 117, 108, 0.45) 100%);
        -webkit-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
           -moz-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
                box-shadow: 0 1px 3px rgba(103, 104, 103, 0.8) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
    }
    /*  IE Styles  --------------------------------*/
        .ie9 #portfolio-filter li a.current {
            background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2RhYTk2OCIgc3RvcC1vcGFjaXR5PSIwLjQ1Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YTQ2MDkiIHN0b3Atb3BhY2l0eT0iMC40NSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
        }
        .ie8 #portfolio-filter li a.current {
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#73daa968', endColorstr='#737a4609',GradientType=0 );
        }

    #portfolio-filter li a:hover {
        background-color: rgba(45, 117, 108, 0.15);
        -webkit-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4)) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
           -moz-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4)) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
                box-shadow: 0 1px 3px rgba(103, 104, 103, 0.4)) inset, 0 1px 1px rgba(255, 255, 255, 0.35);
    }


    /*  Portfolio Items  --------------------------------*/
    
    #portfolio-feed {
        width: 450px;
        display: inline-block;
        text-align: center;
    }
	
    #portfolio-feed li {
        width: 140px;
        height: 140px;
        margin: 15px 14px 50px 50px;/*set each testimony text margin here*/
		padding: 10px 10px 10px 10px;
        text-align: centre;
        float: left;
       
    }
    #portfolio-feed img {
        width: 140px;
        height: 140px;
        margin-top: 10px;
    }
	
		
    #portfolio-feed li h2 {
        margin-top: 26px;
        font-weight: 800;
        font: normal 16px 'times_sans_serifregular';
        line-height: 10px;
        color: #676867
    }
    #portfolio-feed li .tags {
        color: #676867;
		font: normal 13px 'times_sans_serifregular';
		margin-bottom:20px;
    }


    /*  Adipoli Plugin  --------------------------------*/
    
    .adipoli-wrapper {
        margin: auto;
        position: relative;
        display: inline-block;
    }
    .adipoli-wrapper > img {
        position: absolute;
        z-index: 1;
    }
    .adipoli-before {
        margin-top: 10px;
        position: absolute;
        z-index: 5;
    }
    .adipoli-after {
        margin-top: 0px;
        position: absolute;
        z-index: 10;
    }
    .adipoli-slice {
        margin-top: 10px;
        display: block;
        position: absolute;
        z-index: 15;
        height: 100%;
    }
    .adipoli-box {
        display: block;
        position: absolute;
        z-index: 15;
    }


    /*  Isotope Plugin  --------------------------------*/

    .isotope-item {
	
        z-index: 2;
    }
    .isotope-hidden.isotope-item {
        pointer-events: none;
        z-index: 1;
    }
    .isotope, .isotope .isotope-item {/* change duration value to whatever you like */
        -webkit-transition-duration: 0.8s;
           -moz-transition-duration: 0.8s;
                transition-duration: 0.8s;
    }
    .isotope {
        -webkit-transition-property: height, width;
           -moz-transition-property: height, width;
                transition-property: height, width;
    }
    .isotope .isotope-item {
        -webkit-transition-property: -webkit-transform, opacity;
           -moz-transition-property:    -moz-transform, opacity;
            -ms-transition-property:     -ms-transform, opacity;
             -o-transition-property:         top, left, opacity;
                transition-property:         transform, opacity;
    }


/* ------------------------------------------------------------------------------- */
/*  7.  Contact Section
/* ------------------------------------------------------------------------------- */

    #contact {
        overflow: hidden;
		
    }


    /*  Google Map  --------------------------------*/
	#map-wrap1{
		width: 230px;
        height: 230px;
        margin: 20px;
		float:right;
        background-color: #fff;
        display: inline-block;
		border:solid 10px #FFF;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
		}
	#map-wrap2{
		width: 230px;
        height: 230px;
        margin: 20px;
		float:left;
        background-color: #fff;
        display: inline-block;
		border:solid 10px #FFF;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
		}
		
		.mapPage1{
		width: 230px;
        height: 230px;
        margin: 15px;
       }
	
    .map-wrapper {
        width: 860px;
        height: 300px;
        margin: 28px 0 0 0px;
        background-color: #fff;
        display: inline-block;
		border: solid 10px #FFF;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    }
    #map {
        width: 830px;
        height: 270px;
        margin: 15px;
    }


    /*  Contact Info  --------------------------------*/

    .contact-header {
        width: 600px;
        margin: 35px 170px 0;
        text-align: center;
    }
    .contact-header p {
        margin-top: 20px;
        color: #676867;
    }
    .contact-info {
        width: 370px;
        margin: 44px 0 0 70px;
		text-align:left;
        float: left;
    }
	    .contact-info li {
        margin-bottom: 14px;
        overflow: hidden;
    }
    .contact-info li label {
        font-weight: bold;
        float: left;      
    }
    .contact-info li span {
        width: 280px;
        float: right;
    }
    .contact-info ul {
        float: left;
    }
    .contact-info ul li {
        margin-bottom: 10px;
        overflow: hidden;
    }
	    .contact-info li p {
        margin: 10px 0 10px;
        line-height: 24px;
    }





    /*  Contact Form  --------------------------------*/

    #contactform {
        width: 430px;
        margin: 40px 0 0 0px;
        float: left;
    }
    #contactform ul li {
        margin-bottom: 20px;
    }
    #contactform input {
        width: 300px;
    }
    #contactform textarea {
        width: 320px;
    }
    #contactform input:focus, #contactform textarea:focus {
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5), 0 0 6px rgba(103, 104, 103, 0.9);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5), 0 0 6px rgba(103, 104, 103, 0.9);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset, 0 -1px 1px rgba(0, 0, 0, 0.2), 0 1px 2px rgba(255, 255, 255, 0.5), 0 0 6px rgba(103, 104, 103, 0.9);
    }
    #contactform .submit {
        width: 320px;
    }
    #contactform .submit:hover {
        background-color: rgba(45, 117, 108, 0.4);
    }
    #contactform .submit:active {
        -webkit-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
           -moz-box-shadow: 0 2px 6px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
                box-shadow: 0 2px 6px rgba(0, 0, 0, 0.8) inset, 0 -1px 0px rgba(0, 0, 0, 0.13), 0 1px 0px rgba(255, 255, 255, 0.25);
    }
    #contactform .flabel {
        font-weight: bold;
		font-family: 'Muli', sans-serif;
        color: #676867;
        margin: 7px 9px;
        position: absolute;
        text-shadow: none;
    }
    .success {
        width: 300px;
        margin-bottom: 20px;
        padding: 10px;
        background-color: rgba(45, 117, 108, 0.6);
        text-align: center;
        font-weight: bold;
        color: #676867;
        text-shadow: none;
        -webkit-border-radius: 5px;
           -moz-border-radius: 5px;
                border-radius: 5px;
    }
    #contactform .error {
        margin-top: 3px;
        color: #2D756C;
        font-weight: bold;
        display: block;
    }


/* ------------------------------------------------------------------------------- */
/*  8.  Footer
/* ------------------------------------------------------------------------------- */
    
    .footer {
        margin-top: 30px;
        text-align: center;
    }
	

		
	.links h4{
		width:100%;
		height:auto;
		position:relative;
		float:left;
		text-align:left;
		margin: 0px 20px 10px 20px;
		}


    /*  Social Links  --------------------------------*/

    .social-links {
        text-align: center;
        display: inline-block;
    }
    .social-links li {
        float: left;
        margin: 0 3px;
    }
    .social-links li > a {
        display: inline;
        margin: 2;
        padding: 0;
        background-color: rgba(45, 117, 108, 0.1);
        -webkit-border-radius: 20px;
           -moz-border-radius: 20px;
                border-radius: 20px;
        -webkit-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.6) inset, 0 2px 1px rgba(255, 255, 255, 0.35);
           -moz-box-shadow: 0 1px 3px rgba(103, 104, 103, 0.6) inset, 0 2px 1px rgba(255, 255, 255, 0.35);
                box-shadow: 0 1px 3px rgba(103, 104, 103, 0.6) inset, 0 2px 1px rgba(255, 255, 255, 0.35);
    }
    .social-links li > a:hover {
        background-color: rgba(45, 117, 108, 0.25);
    }
    .social-twitter {
        width: 26px;
        height: 26px;
        background: url('../images/social_icons.png') no-repeat 0px 0px;
        float: left;
    }
    .social-facebook {
        width: 26px;
        height: 26px;
        background: url('../images/social_icons.png') no-repeat -32px 0px;
        float: left;
    }
    .social-linkedin {
        width: 26px;
        height: 26px;
        background: url('../images/social_icons.png') no-repeat -64px 0px;
        float: left;
    }
    .social-google {
        width: 26px;
        height: 26px;
        background: url('../images/social_icons.png') no-repeat -96px 0px;
        float: left;
    }
    .social-dribbble {
        width: 26px;
        height: 26px;
        background: url('../images/social_icons.png') no-repeat -128px 0px;
        float: left;
    }
    .copyright {
        margin-top: 10px;
        color: #676867;
    }



/* ------------------------------------------------------------------------------- */
/*  9.  Media Queries
/* ------------------------------------------------------------------------------- */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {
    
    /*--Document Setup--*/
        #container {
            width: 716px;
        }

    /*--Navigation--*/
        .navigation {
            background: url(../images/bg_nav_768.png) bottom left no-repeat;
        }

    /*--Welcome Section--*/
        .slider-wrapper {
            width: 606px;
            margin: 10px 40px 10px;
            }
        .flex-caption {
            top: 20px !important;
            left:5px !important;
        }
		
		.welcomeQuote{
		 width:570px;
		 margin: 28px 20px 20px 60px;
		 padding: 10px;
		 display: inline-block;
		 text-align: center;
		 border: solid 1px #ccc;
		}

    /*--About Section--*/
       .aboutQuote{
		 width:550px;
		 margin: 30px 0px 10px 0px;
		 padding: 10px 0px 15px 0px;
		 display: inline-block;
		 text-align: center;
		 border: solid 1px #ccc;
		 }
		
	#dColumn1{
		width:295px;
		height:auto;
		margin: 10px 30px 20px 60px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		
	}
	#dColumn2{		
		width:295px;
		height:auto;
		margin: 10px 0px 20px 0px;
		padding: 40px 0px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn3{
		width:295px;
		height:auto;
		margin: 10px 30px 30px 60px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn4{
		width:285px;
		height:auto;
		margin: 10px 0px 30px 0px;
		padding: 0px 10px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn5{
		width:295px;
		height:auto;
		margin: 10px 30px 30px 50px;/* Top Right Bottom Left*/
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	#dColumn6{
		width:295px;
		height:auto;
		margin: 10px 0px 60px 0px;
		padding: 0px 0px 0px 0px;
		display: inline-block;
		float:left;
		text-align:left;
		}
		
	    .experience {
            width: 350px;
			margin: 30px 30px 0px 60px;
			padding-bottom:0px;
        }
		
		.skillful{
			width: 350px;
			margin: 30px 50px 0px 60px;
			padding-bottom:0px;
        }
		
	.quoteWrapAboutSpecial{
			display:inline-block;
			width:380px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
		.quoteWrapExpSpecial{
			display:inline-block;
			width:370px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
	
		/*Special quotes with quotemarks*/
		.openQuote{
			width:50px;
			height:auto;
			display:inline-block;
			float:left;
			margin-right:20px;
			margin-bottom:50px;
		
			}
		.closeQuote{
			width:50px;
			height:auto;
			display:inline-block;
			float:right;
			margin-left:20px;
			margin-bottom:50px;
		}
 /* Revolving Quotes */
		blockquote {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}
			
		blockquotes {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}

.quote_wrap {
			width: 200px;
			height: 250px;
			float: right;
			margin:90px 40px 0px 0px;
			text-align:left;
			overflow: hidden;
	}
.quote_wrap2{
			width: 200px;
			height: 730px;
			float: right;
			margin:30px 40px 50px 0px;
			text-align:left;
			overflow: hidden;
	}
	.traits_wrap{
			width:150px;
			height: auto;
			position: relative;
			float:left;
			margin:0px 40px 20px 50px;
			overflow: hidden;
			z-index:1000;
	}
	
	   .traits  {
		   width:120px;
		   height:30px;
			float: left;
			text-align:left;
			display:block;
			
    }
	
cite{
	font: normal 18px 'times_sans_serifregular';
	color:#2D756C;
	padding: 0 0; 
	}

  /*  Skills  --------------------------------*/
    


    /*--Portfolio Section--*/
        #portfolio-feed {
            width: 450px;
        }
        #portfolio-feed li {
            margin: 0 10px 60px 5px;
        }

    /*--Contact Section--*/
        .map-wrapper {
            width: 636px;
        }
        #map {
            width: 606px;
        }
        .contact-header {
            margin: 35px 58px 0;
        }
        .contact-info {
            width: 330px;
			margin-left:55px;
        }
        #contactform {
            width: 280px;
            margin-left: 10px;
			margin-top:80px;
        }
		
		#contactform .flabel {
        display:none;
    }
        #contactform input {
            width: 250px;
        }
        #contactform textarea {
            width: 264px;
        }
        #contactform .submit {
            width: 264px;
        }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {

    /*--Document Setup--*/
        #container {
            width: 470px;
            margin-top: 40px;
        }

    /*--Header--*/
        .header {
            height: 80px;
			line-height:60px;
        }
       
    /*--Navigation--*/
        .navigation {
            background: url(../images/bg_nav_480.png) bottom left no-repeat;
        }

    /*--Welcome Section--*/
        .slider-wrapper {
            width: 400px;
            margin: 10px 25px 10px 25px;
            padding: 10px;
        }
        .flex-caption {
            top: 15px !important;
            left: 5px !important;
			
        }
	.welcomeQuote{
		 width:380px;
		 margin:10px 35px 10px 35px;/*T R B L*/
		 padding: 10px;

		}
		

		
	#dColumn1{
		width:380px;
		height:auto;
		margin: 10px 0px 15px 50px;/* Top Right Bottom Left*/
		
		
	}
	#dColumn2{		
		width:380px;
		height:auto;
		margin: 10px 0px 20px 50px;
		padding: 0px 0px 0px 0px;
		
		}
		
	#dColumn3{
		width:380px;
		height:auto;
		margin: 10px 0px 15px 50px;/* Top Right Bottom Left*/
		
		}
		
	#dColumn4{
		width:380px;
		height:auto;
		margin: 10px 0px 20px 50px;
		padding: 0px 0px 0px 0px;
		
		}
		
	#dColumn5{
		width:380px;
		height:auto;
		margin: 10px 0px 50px -20px;/* Top Right Bottom Left*/
		
		}
		
	#dColumn6{
		width:380px;
		height:auto;
		margin: 10px 0px 60px 110px;
		padding: 0px 0px 0px 0px;
		
		}
    /*--About Section--*/
	
	.aboutQuote{
		 width:370px;
		 margin: 30px 0px 10px 0px;
		 padding: 10px 0px 15px 0px;
		
		 }
        
	.resume {
            width: 380px;
            text-align: center;
			
        }
		
        .resume .photo {
            float: none;
            margin-bottom: 20px;
            display: inline-block;
        }
        .personal-info {
			width:365px;
            margin-left: 20px;
            float: none;
            display: inline-block;
			
        }
        .experience {
            width: 370px;
			margin-left: 50px;
			
        }
		
		.skillful{
			 width: 390px;
			 display:block;
			 position:absolute;
			 top:315px;
			 clear:right;
			 }
			 
			.quoteWrapAboutSpecial{
			display:inline-block;
			width:380px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
		.quoteWrapExpSpecial{
			display:inline-block;
			width:370px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
	
		/*Special quotes with quotemarks*/
		.openQuote{
			width:50px;
			height:auto;
			display:inline-block;
			float:left;
			margin-right:10px;
			margin-bottom:80px;
		
			}
		.closeQuote{
			width:50px;
			height:auto;
			display:inline-block;
			float:right;
			margin-left:10px;
			margin-bottom:90px;
		}
		
		.openQuote2{
			width:50px;
			height:auto;
			display:inline-block;
			float:left;
			margin-right:10px;
			margin-bottom:95px;
		
			}
			
		.closeQuote2{
			width:50px;
			height:auto;
			display:inline-block;
			float:right;
			margin-left:10px;
			margin-bottom:100px;
			}
  /* Revolving Quotes */
		blockquote {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}
			
		blockquotes {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}
		
	.welcomeQuote2{
		 width:100px;
		 float:left;
		 text-align:left;
		 list-style:none;
		 display:inline-block;
		 border:solid 1px #CCC;
		 margin:0px 35px 10px 35px;/*T R B L*/
		 padding: 10px 0 30px 30px;

		}

	
.quote_wrap {
			width: 200px;
			height:290px;
			float: right;
			margin-right: 40px;
			margin-top:0px;
			margin-bottom:20px;
			text-align:left;
			overflow: hidden;
	}
	
.quote_wrap2 {
			position:relative;
			width: 360px;
			height:1100px;
			top:580px;
			float: left;
			margin: 10px 0px 30px 50px;
			text-align:left;
			overflow: hidden;
			z-index:80;
	}

.traits_wrap{
			width:150px;
			height: auto;
			position:relative;
			float:left;
			margin:0px 0px 20px 50px;
			overflow: hidden;
			z-index:1000;
	}
	
	   .traits  {
		   width:120px;
		   height:30px;
			float: left;
			text-align:left;
			display:block;
			
    }
	
cite{
	text-align:left;
	font: normal 18px 'times_sans_serifregular';
	padding: 0 0; 
	}
	
	

		
    /*--Portfolio Section--*/
        #portfolio {
            padding: 0 21px;
            text-align: center;
        }
        #portfolio-filter li {
            float: none;
            display: inline-block;
        }
        #portfolio-feed {
            width: 450px;
        }
        #portfolio-feed li {
            margin: 0 5px 50px 5px;
        }

    /*--Contact Section--*/
	
		#map-wrap1{
		width: 230px;
        height: 230px;
        margin: 0px;
		float:right;
      
		}
	#map-wrap2{
		width: 230px;
        height: 230px;
        margin: 0px;
		float:left;
		}
  
        .contact-header {
            width: 390px;
            margin: 20px 40px 0;
        }
        .separator {
            background: url(../images/separator_02.png) center no-repeat;
        }
        .contact-info {
            width: 390px;
            margin-top: 35px;
        }
        #contactform {
            width: 390px;
            margin-top: 30px;
            margin-left: 40px;
        }
        #contactform textarea {
            width: 370px;
        }
}




/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {

    /*--Document Setup--*/
        #container {
            width: 300px;
            margin-top: 30px;
        }

    /*--Header--*/
        .header {
            height: 65px;
        }
        #logo h1 {
            font-size: 34px;
        }
        #logo h2 {
            font-size: 13px;
        }

    /*--Navigation--*/
        .navigation {
            background: url(../images/bg_nav_320.png) bottom left no-repeat;
        }
        .tabs li > a {
            width: 65px;
            font-size: 10px;
        }
        .tab-welcome {
            background: url(../images/tab_icons.png) -20px 0px;
        }
        .tab-about {
            background: url(../images/tab_icons.png) -126px 0;
        }
        .tab-portfolio {
            background: url(../images/tab_icons.png) -231px 0;
        }
        .tab-contact {
            background: url(../images/tab_icons.png) -338px 0;
        }
        .tabs .active .tab-welcome {
            background: url(../images/tab_icons.png) -20px -69px;
        }
        .tabs .active .tab-about {
            background: url(../images/tab_icons.png) -126px -69px;
        }
        .tabs .active .tab-portfolio {
            background: url(../images/tab_icons.png) -231px -69px;
        }
        .tabs .active .tab-contact {
            background: url(../images/tab_icons.png) -338px -69px;
        }

    /*--Welcome Section--*/
        .slider-wrapper {
            width: 230px;
            margin: 15px 25px 20px;
            padding: 10px;
        }
        .flex-caption {
            display: none;
        }
				
		
	.welcomeQuote{
		 width:210px;
		 margin:10px 35px 10px 35px;/*T R B L*/
		 padding: 10px;
		 text-align:left;

		}
		

		
	#dColumn1{
		width:210px;
		height:auto;
		margin: 10px 0px 15px 40px;/* Top Right Bottom Left*/
		
		
	}
	#dColumn2{		
		width:210px;
		height:auto;
		margin: 10px 0px 20px 40px;
		padding: 0px 0px 0px 0px;
		
		}
		
	#dColumn3{
		width:210px;
		height:auto;
		margin: 10px 0px 15px 40px;/* Top Right Bottom Left*/
		
		}
		
	#dColumn4{
		width:210px;
		height:auto;
		margin: 10px 0px 20px 40px;
		padding: 0px 0px 0px 0px;
		
		}
		
	#dColumn5{
		width:210px;
		height:auto;
		margin: 10px 0px 30px 65px;/* Top Right Bottom Left*/
		
		}
		
	#dColumn6{
		width:210px;
		height:auto;
		margin: 10px 0px 50px 25px;
		padding: 0px 0px 0px 0px;
		
		}
        .ribbon {
            display: none;
        }

        .separator {
            width: 100%;
            height: 15px;
            background: url(../images/separator_02.png) center no-repeat;
        }

    /*--About Section--*/
	
		
	.aboutQuote{
		 width:190px;
		 margin: 20px 0px 10px 0px;
		 padding: 10px 10px 15px 10px;
		
		 }
        .resume {
            width: 210px;
            text-align: center;
        }
        .resume .photo {
            float: none;
            margin-bottom: 20px;
            display: inline-block;
        }

		
		 .personal-info {
            width: 210px;
            margin-left: 0;
            float: left;
        }
        .personal-info li {
            margin-bottom: 15px;
        }
        .personal-info li h4 {
            line-height: 18px;  
        }
        .personal-info li span {
			width: 210px;
            float: left;
        }
        .personal-info li p {
            margin: 0;
            line-height: 24px;
        }


        .experience {
            width: 220px;
            margin: 15px 0 0 40px;
			padding-bottom:0px;
        }
		
		.quoteWrapAboutSpecial{
			display:inline-block;
			width:270px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}
		.quoteWrapExpSpecial{
			display:inline-block;
			width:270px;
			height:auto;
			float: inherit;
			margin-top:20px;
			overflow:hidden;
	}	
 
		
		.skillful{
			 width: 230px;
			 display:block;
			 position:absolute;
			 top:305px;
			 clear:right;
			 margin-bottom:20px;
			 }
			 

  /* Revolving Quotes */
		blockquote {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}
			
		blockquotes {
			font-family: 'Muli', sans-serif;
			text-align: left;
			float: left;
			width: 190px; /* required */
			margin-bottom: 20px;
			font-size: 15px; line-height: 1.6em; 
			
		}

.quote_wrap {
			width: 210px;
			height:240px;
			float: right;
			margin-left:40px;
			margin-top:0px;
			margin-bottom: 20px;
			text-align:left;
			overflow: hidden;
	}
	
.quote_wrap2 {
			width: 210px;
			height:1100px;
			position:relative;
			display:inline-block;
			top:1200px;
			float: left;
			margin: 30px 0px 30px 50px;
			text-align:left;
			z-index:80;
	}
	.traits_wrap{
			width:150px;
			height: auto;
			position: relative;
			float:left;
			margin-left:90px;
			margin-bottom:40px;
			display:inline-block;
			overflow: hidden;
			z-index:1000;
	}
	
	   .traits  {
		   width:120px;
		   height:30px;
			float: left;
			text-align:left;
			display:block;
			
    }
	/*Special quotes with quotemarks*/
		.openQuote{
			display:none;
			}
		.closeQuote{
			display:none;
		}
		
		.openQuote2{
			display:none;
			}
			
		.closeQuote2{
			display:none;
			}

cite{
	font: normal 16px 'times_sans_serifregular';
	color:#2D756C;
	padding: 0 0; 
	text-align:center;
	}


		
    /*--Portfolio Section--*/
		#portfolio {
			height:2000px;
			
		}
	
        #portfolio-filter{
            margin: 25px 0 20px;
        }
        #portfolio-filter li {
            float: none;
            display: inline-block;
        }
        #portfolio-feed {
            width: 300px;
        }
        #portfolio-feed li {
            margin-left: 28px;
        }

    /*--Contact Section--*/

		 /*  Google Map  --------------------------------*/
	#map-wrap1{
		width: 230px;
        height: 230px;
        margin: 0px;
		float:right;
      
		}
	#map-wrap2{
		width: 230px;
        height: 230px;
        margin: 0px;
		float:left;
		}
		
		.mapPage1{
		width: 230px;
        height: 230px;
        margin: 15px;
       }
	
    .map-wrapper {
        width: 860px;
        height: 300px;
        margin: 28px 0 0 0px;
        background-color: #fff;
        display: inline-block;
		border: solid 10px #FFF;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
           -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
                box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    }
    #map {
        width: 830px;
        height: 270px;
        margin: 15px;
    }


        .contact-header {
            width: 250px;
            margin: 20px 25px 0;
        }
        .contact-info {
            width: 230px;
            margin: 30px 25px 0;
        }
        #contactform {
            width: 230px;
            margin: 30px 25px 0;
        }
        #contactform input, #contactform textarea {
            width: 230px;
        }
        #contactform .submit {
            width: 230px;
			margin-left:10px;
        }
        .success {
        width: 230px;
        
		}
}