#container{
	margin-left:auto;
	margin-right:auto;
}


/*------------fonts--------------*/

	@font-face {
		font-family: MyOpensansBold;
		src: url(../fonts/opensans-bold-webfont.eot);
		src: url(../fonts/opensans-bold-webfont.eot?#iefix) format('embedded-opentype'),
			 url(../fonts/opensans-bold-webfont.woff) format('woff'),
			 url(../fonts/opensans-bold-webfont.ttf) format('truetype'),
			 url(../fonts/opensans-bold-webfont.svg#MyOpensansBold) format('svg');
		font-weight: normal;
		font-style: normal;
	}
	

	@font-face {
		font-family: MyOpensansSemiBold;
		src: url(../fonts/opensans-semibold-webfont.eot);
		src: url(../fonts/opensans-semibold-webfont.eot?#iefix) format('embedded-opentype'),
			 url(../fonts/opensans-semibold-webfont.woff) format('woff'),
			 url(../fonts/opensans-semibold-webfont.ttf) format('truetype'),
			 url(../fonts/opensans-semibold-webfont.svg#MyOpensansSemiBold) format('svg');
		font-weight: normal;
		font-style: normal;
	}
	
	@font-face {
		font-family: MyOpensansLight;
		src: url(../fonts/opensans-light-webfont.eot);
		src: url(../fonts/opensans-light-webfont.eot?#iefix) format('embedded-opentype'),
			 url(../fonts/opensans-light-webfont.woff) format('woff'),
			 url(../fonts/opensans-light-webfont.ttf) format('truetype'),
			 url(../fonts/opensans-light-webfont.svg#MyOpensansLight) format('svg');
		font-weight: normal;
		font-style: normal;
	}
	
	
	
	@font-face {
		font-family: MyOpensansRegular;
		src: url(../fonts/opensans-regular-webfont.eot);
		src: url(../fonts/opensans-regular-webfont.eot?#iefix) format('embedded-opentype'),
			 url(../fonts/opensans-regular-webfont.woff) format('woff'),
			 url(../fonts/opensans-regular-webfont.ttf) format('truetype'),
			 url(../fonts/opensans-regular-webfont.svg#MyOpensansLight) format('svg');
		font-weight: normal;
		font-style: normal;
	}

.back{
    text-decoration: none;
    color:black;
/*    border: 1px solid black;*/
      letter-spacing: 2px;
    height:40px;
    text-transform: uppercase;
    width:75px;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    position: fixed;
    top:250px;
    left: -10px;
    font-family: MyOpensansSemiBold;
    /* Safari */
-webkit-transform: rotate(-90deg);

/* Firefox */
-moz-transform: rotate(-90deg);

/* IE */
-ms-transform: rotate(-90deg);

/* Opera */
-o-transform: rotate(-90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}


.next{
    text-decoration: none;
    color:black;
/*    border: 1px solid #000000; */
    height:40px;
    text-transform: uppercase;
    width:75px;
    letter-spacing: 2px;
    line-height: 40px;
    text-align: center;
    font-size: 12px;
    position: fixed;
    top:250px;
    right: -10px;
    font-family: MyOpensansSemiBold;
    /* Safari */
-webkit-transform: rotate(90deg);

/* Firefox */
-moz-transform: rotate(90deg);

/* IE */
-ms-transform: rotate(90deg);

/* Opera */
-o-transform: rotate(90deg);

/* Internet Explorer */
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}


/*------------END fonts--------------*/	

/*------------PACE LOADER--------------*/	

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace-inactive {
  display: none;
}

.pace .pace-progress {
  background: black;
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 100%;
  width: 100%;
  height: 8px;
}

/*------------END PACE LOADER--------------*/	



/*-------------------HOME NAV----------------
/////////////////////////////////////////////*/



.box p{
    text-align: center;
}

#p1{
   
    letter-spacing: 5px;
    font-family: MyOpensansSemiBold;
}


#p2{
    letter-spacing: 5px;
    font-family: MyOpensansRegular;
}


#p3{
   
    letter-spacing: 5px;
    font-style: italic;
    font-family: MyOpensansLight;
}

.homePage{
    margin-top: 50px;
}

	
.box, .box1{
    
/*    
    border: 2px solid #000000;*/
    display: block;
    padding:12px;
    padding:8px;
/*    padding:15px;*/
    width:100%;
    margin-left: auto;
    margin-right: auto;
/*  margin-bottom: 40px;*/
    margin-bottom: 32px;
    text-decoration: none;
    color:black;
/*
      -webkit-transition:  100ms ease-out 400ms;
    -moz-transition:100ms ease-out 400ms;
    -o-transition:  100ms ease-out 400ms;
    transition:100ms ease-out 400ms;
*/
    
    -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;

}

.box:hover{
/*    background-color:#fff799;*/
/*     background-color:#FFF8BA;*/
/*
    -webkit-transition:  100ms ease-out 400ms;
    -moz-transition:100ms ease-out 400ms;
    -o-transition:  100ms ease-out 400ms;
    transition:100ms ease-out 400ms;
*/
       -webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
    
}

#trigger{
    text-decoration: none;
    color:black;
    font-family: MyOpensansSemiBold;
}


/*-------------------END HOME NAV----------------*/

/*-------------------ABOUT NAV----------------
/////////////////////////////////////////////*/

.aboutPage{
    height:100%;
	width:100%;
	background-color:rgba(0,0,0,0);
	position:absolute;
	top:0px;
	left:0px;
	display:none;
}

#homePage{
	height:100%;
	width:100%;
	position:absolute;
	top:0px;
	left:0px;
}

/*-------------------END ABOUT NAV----------------*/

/*-------------------Projects----------------
/////////////////////////////////////////////*/
  
.proTitle{
    text-align: center;
    margin-top: 60px;
    margin-bottom: 30px;
}

   .secondTitle{
        text-align: center;
        font-family: MyOpensansSemiBold; 
        font-size: 13px;
       margin-bottom: 100px;
      margin-top: 100px;
        letter-spacing: 3px;
       clear: both;
       padding-top: 100px;
       
    }



 .processTitle{
        text-align: center;
        font-family: MyOpensansSemiBold; 
        font-size: 13px;
        margin-bottom: 50px;
        letter-spacing: 1px;
        clear: both;
     padding-top: 75px;
      
       
    }


   .colorTitle1{
        text-align: center;
        font-family: MyOpensansSemiBold; 
        font-size: 13px;
        letter-spacing: 3px;
       background-color: red;
     
    }

   .secondTitle2{
        text-align: center;
        font-family: MyOpensansSemiBold; 
        font-size: 13px;
        letter-spacing: 3px;
       margin-bottom: 100px;
       margin-top: 50px;
      
       
    }

.proInfo{

    width:400px;
    font-family: MyOpensansRegular;
    font-size: 12px;
    margin-left: auto;
    margin-right: auto;
    line-height: 25px;
    margin-bottom: 50px;
    
}


.poem{
    width:400px;
    font-family: MyOpensansRegular;
    font-size: 10px;
    margin-left: auto;
    margin-right: auto;
    line-height: 20px;
    margin-bottom: 50px;
    text-align: center; 
}



.titlePoem{
    font-family: MyOpensansSemiBold;
    font-size: 11px;
    letter-spacing: 1px;
}


.view{
        border: 2px solid black;
        margin-left: auto;
        margin-right: auto;
        margin-top: 50px;
        margin-bottom: 50px;
        display: block;
          -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
         text-align: center;
        font-family: MyOpensansSemiBold;
        text-transform: uppercase;
        text-decoration: none;
        color:black;
    
    }


/*-------------------END Projects----------------*/



/* MOBILE STYLES ////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (max-width: 767px){
	#container{
		width:87.5%; /* 280 pixels at a 320 pixel screen width (iPhone 3 / 4 / 5) */
	}
    
/*--------------------HOME PAGE ------------------------*/
/*//////////////////////////////////////////////////////*/
  
    .box, .box1{
    display: block;
    padding:5px;
    width:100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 25px;
/*    text-align: center;*/
    text-decoration: none;
    color:black;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
          opacity: 0;

}
    
    .box, .box1{
       text-align:left;
        line-height: 25px;
/*        width:85%;*/
        width:85%;
        margin-left: auto;
        margin-right: auto;   
        text-align: center;
    }
    
        
.mobileBreak1{
        display:none; 
    }

.homePage{
        margin-top: 100px;
    }
    
/*-----------------HOME PAGE LINKS--------------------*/

.heading{
    width:100vw;
    height:80px;
    position: fixed;
    top:0;    
    background-color: white;
}
   

h1 a{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    font-size: 12px;
    left:20px;
    top:16px;
    line-height: 18px;
    letter-spacing: .10px;
    text-decoration: none;
    opacity: 0;
    color: black;
  
}

#p1{
    font-size: 12px;
    letter-spacing: 3px;
}


#p2{
    font-size: 12px;
    letter-spacing: 3px;
   
}

#p3{
    font-size: 12px;
    letter-spacing: 3px;
    font-style: italic;
    display: none;
   
}
    
    
    .turnOff{
         display: none;
    }
    
    
    #mobilep2{
        font-size: 12px;
    letter-spacing: 3px;
        font-family: MyOpensansRegular; 
    }    
    
.slash{
        display: none;
    }
    
#trigger{
    text-decoration: none;
    color:black;
    letter-spacing: .25px;
    text-align: center;
    font-size: 12px;
    letter-spacing: 1px;
    position: fixed;
    top:16px;
    right:10px;
    font-family: MyOpensansSemiBold;
      opacity: 0;
}
    

  /*--------------------PROJECTS-----------------*/
  /*/////////////////////////////////////////////*/
 
  .pageName{
    font-family: MyOpensansSemiBold; 
    position: fixed;
    color:black;
    font-size: 13px;
    left:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
}  
  
.proTitle{
        text-align:center;
        margin-top: 95px;
        line-height: 25px;
        width:85%;
        margin-left: auto;
        margin-right: auto;  
    }   
    
.back{
    height:40px;
    letter-spacing: 2px;
    width:75px;
    line-height: 40px;
    text-align: center;
    font-size: 11px;
    top:250px;
    left: -22px;
 }
    
.next{
    height:40px; 
    width:75px;
    letter-spacing: 2px;
    line-height: 40px;
    font-size: 11px;
    position: fixed;
    top:250px;
    right: -22px;

}

    
       .one_vertcenterSmall{
      margin-bottom: 54px;
        display: block;
        width: 75%;
        margin-left: auto;
        margin-right: auto;
    }
    
   
     .one_vertPic, .one_rightSmall, .one_left, .one_right, .one_leftSmall {
    margin-bottom: 54px;
        display: block;
        width: 75%;
        margin-left: auto;
        margin-right: auto;
    }
    
    .one_horPic,  .one_horPicSmall {
        margin-bottom: 54px;
        display: block;
/*        width: 978px;*/
        width:93.75%; 
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
    }

    
    .proInfo{
    width:70%;
    font-size: 11px;
    line-height: 25px;
    margin-bottom: 50px;
    
}

.poem{
    width:75%;
    font-size: 10px;
    line-height: 20px;
    margin-bottom: 50px;
    text-align: center;
    
}
    
.view{
    width:50%;
    height:30px;
    font-size: 12px;
    line-height: 30px;
    }

    
/*-----------------END PROJECTS--------------------*/

/*-------------------footer----------------
/////////////////////////////////////////////*/

footer{
    padding-bottom: 8px;
    width: 100%;
    letter-spacing: .15px;
      opacity: 0;
}

footer p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}

.pageFooter{
    width: 100%;
    letter-spacing: .25px;
    margin-left: auto;
    margin-right:auto;
    padding-bottom: 15px;   
}
    
    .pageFooter p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}


/*-------------------END footer----------------*/
    

/*---------------ABOUT SECTION---------------*/
/*///////////////////////////////////////////*/
      
.aboutPage{
        width:100%;
        position: absolute;
        left: 0;
        right: 0;
        margin-right: auto;
        margin-left: auto;
    }
    
    #infoContain{
        width:73%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        position: relative;
    }
    
    
	.aboutInfo{
	color:black;
	letter-spacing:1px;
    font-size: 12px;
    font-family: MyOpensansSemiBold;
    line-height: 25px; 
    margin-top: 120px;
}
    
    .content{
        display: block;
        float:left;
        margin-top: 20px; 
    }

    .content a{
        display:block;    
        text-decoration: none;
        color:black;
        font-size: 11px;
        font-family: MyOpensansSemiBold;
        line-height: 35px; 
       
    }
    
        
#close{
     text-decoration: none;
    color:black;
    letter-spacing: .25px;
    text-align: center;
    font-size: 12px;
    letter-spacing: 1px;
    position: fixed;
    top:16px;
    right:10px;
    font-family: MyOpensansSemiBold;
}
  
/*---------------ABOUT SECTION---------------*/    
    
}


/* TABLET STYLES ////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (min-width: 768px) and (max-width: 1023px){
	#container{
		width:93.75%; /* 720 pixels at a 768 pixel screen width (iPads) */ 
	}

/*-----------------HOME PAGE--------------------*/
/*////////////////////////////////////////////////*/    

        
.homePage{
    margin-top: 100px;
}
   
    
.box, .box1{
    display: block;
    padding:8px;
    width:100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 24px;
    text-align: center;
    text-decoration: none;
    color:black;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
      opacity: 0;

}   
    
/*-----------------HOMEPAGE LINKS--------------------*/
    
h1 a{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    color:black;
    
    font-size: 13px;
    left:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
      opacity: 0;
}
    
.pageName{
    font-family: MyOpensansSemiBold; 
    position: fixed;
    color:black;
    font-size: 13px;
    left:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
}   


.mobileBreak{
          display:none; 
    }

      
.pro3{
    margin-top: 105px;
    }
    
    
#p1{
    font-size: 12px;
    letter-spacing: 5px;
    font-family: MyOpensansSemiBold;
   
}


#p2{
    font-size: 12px;
    letter-spacing: 5px;
    font-family: MyOpensansRegular;
}
    
    
    
 #mobilep2{
       display: none;
    }      

#p3{
    font-size: 12px;
    letter-spacing: 5px;
    font-style: italic;
    font-family: MyOpensansLight;
 
}



#trigger{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    color:black;
    font-size: 13px;
    right:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
      opacity: 0;
}

/*---------------END HOME PAGE LINKS----------------*/         


 
/*---------------END HOME PAGE----------------*/ 
    

/*------------------Project TWO----------------*/
/*/////////////////////////////////////////////*/
    
    
    
    
    
        .one_vertPic{
        margin-bottom: 54px;
        display: block;
        width: 50%;
        margin-left: auto;
        margin-right: auto;
       
    }
    
 

    
    .one_horPic{
        margin-bottom: 54px;
        display: block;
/*        width: 978px;*/
        width:93.75%; 
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
    }
    
    
    
    
       .one_horPicSmall{
        margin-bottom: 30px;
        display: block;
        width: 75%;
        margin-left: auto;
        margin-right: auto;
    }

    
    .together{
        width:75%;
        margin-left: auto;
        margin-right: auto;
        
    }
    
  .one_leftSmall{
        float:left;
        display: block;
/*        width:385px;*/
        width:48%;
       margin-right: 4%;
        margin-bottom: 30px;
    }
    
    .one_rightSmall{
        float: left;
        display: block;
/*        width:385px;*/
        width:48%;
         margin-bottom: 30px;
    }
    
     .one_vertcenterSmall{
        margin-bottom: 30px;
        display: block;
        width: 35%;
        margin-left: auto;
        margin-right: auto;
    }

    .bigTogether{
        width:93.75%;
        margin-left: auto;
        margin-right: auto;
    }
       .one_left{
        float:left;
        display: block;
/*        width:474px;*/
        width:48%;
        margin-right: 4%;
        margin-bottom: 30px;
    }
    
    .one_right{
        float: left;
        display: block;
       width:48%;
         margin-bottom: 30px;
    }                     
                        

    .view{
        width:100px;
        height:40px;
        border: 2px solid black;
        margin-left: auto;
        margin-right: auto;
        margin-top: 50px;
        margin-bottom: 50px;
        display: block;
         text-align: center;
        font-family: MyOpensansSemiBold;
        text-transform: uppercase;
        font-size: 12px;
        line-height: 40px;
        text-decoration: none;
        color:black;
    
    }
    
/*------------------END Project TWO----------------*/

   
    
/*---------------ABOUT SECTION---------------*/
    
    
.aboutPage{
        width:100%;
        position: absolute;
        left: 0;
        right: 0;
        margin-right: auto;
        margin-left: auto;
    }
    
    #infoContain{
        width:48%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        position: relative;
      
    }
    
    
	.aboutInfo{
	color:black;
	letter-spacing:1px;
    font-size: 12px;
    font-family: MyOpensansSemiBold;
    line-height: 25px; 
    margin-top: 105px;
          opacity: 0;
}
    
    .content{
        display: block;
        float:left;
        margin-top: 20px; 
    }

    .content a{
        display:block;    
        text-decoration: none;
        color:black;
        font-size: 12px;
        font-family: MyOpensansSemiBold;
        line-height: 35px; 
         opacity: 0;
    }

        
    
#close{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    color:black;
    font-size: 13px;
    right:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
}
  
/*---------------ABOUT SECTION---------------*/    
   
    
/*-------------------footer----------------
/////////////////////////////////////////////*/

footer{
    position: fixed;
    width: 100%;
    bottom:20px;
    letter-spacing: .15px;
    opacity: 0;
}

footer p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}

.pageFooter{
    width: 100%;
    letter-spacing: .25px;
    margin-left: auto;
    margin-right:auto;
    padding-bottom: 15px;   
}
    
    .pageFooter p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}

/*-------------------END footer----------------*/
    
}



/* DESKTOP STYLES //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media only screen and (min-width: 1024px){
	#container{
		width:978px;
/*		width:95.5%;*/
       }
 
    
/*-----------------HOME PAGE--------------------*/
/*////////////////////////////////////////////////*/    

     
    
/*-----------------HOMEPAGE LINKS--------------------*/

    
    h1{
       
        
    }
    
   h1 a{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    color:black;
    font-size: 14px;
/*    top:25px;*/
    top: 20px;
    left:20px;
    line-height: 26px;
       line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
        opacity: 0;
}
     
 .mobileBreak{
          display:none; 
    }

#p1{
    font-size: 13px;
    letter-spacing: 4px;
}


#p2{
    font-size: 13px;
    letter-spacing: 4px;
}
    
    
  #mobilep2{
       display: none;
    } 


#p3{
    font-size: 13px;
    letter-spacing: 4px;
    font-style: italic;
}
    
#trigger{
    font-size: 14px;
    position:fixed;
/*    height: 25px;*/
    right:18px;
/*    top:35px;*/
    top:20px;
    opacity: 0;
}
     
span.line_wrap {
    position:relative;
    display:block;
    width:65%;
    margin-left: auto;
    margin-right: auto;
	}
	
span.line {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:50%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrap:hover span.line {
	    width:100%;    
	}  
    
 
    
    /*------------------------------------------*/ 
    span.line_wrapTui {
	   	position:relative;
	    display:block;
        width:43%;
        margin-left: auto;
        margin-right: auto;
        
	}
	
span.lineTui {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapTui:hover span.lineTui {
	    width:102%;    
	}  
    
    /*------------------------------------------*/  
   
    span.line_wrapZine {
	   	position:relative;
	    display:block;
        width:52%;
        margin-left: auto;
        margin-right: auto;
        
	}
	
span.lineZine {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapZine:hover span.lineZine {
	    width:101%;    
	}  
    
    
/*------------------------------------------*/ 
    span.line_wrapNeenah{
	   	position:relative;
	    display:block;
        width:45%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.lineNeenah{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapNeenah:hover span.lineNeenah{
	    width:101%;    
	}  
    
/*------------------------------------------*/ 

/*------------------------------------------*/ 
    span.line_wrapWeb{
	   	position:relative;
	    display:block;
        width:42%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.lineWeb{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapWeb:hover span.lineWeb{
	    width:102%;    
	}  
    
/*------------------------------------------*/ 

/*------------------------------------------*/ 
    span.line_wrapJava{
	   	position:relative;
	    display:block;
        width:57%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.lineJava{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	   -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapJava:hover span.lineJava{
	    width:101%;    
	}  
    
/*------------------------------------------*/

/*------------------------------------------*/ 
    span.line_wrapVibes{
	   	position:relative;
	    display:block;
        width:40%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.lineVibes{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapVibes:hover span.lineVibes{
	    width:102%;    
	}  
    
/*------------------------------------------*/
/*------------------------------------------*/ 
    span.line_wrapPoster{
	   	position:relative;
	    display:block;
        width:51%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.linePoster{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	   -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapPoster:hover span.linePoster{
	    width:101%;    
	}  
    
/*------------------------------------------*/

/*------------------------------------------*/ 
    span.line_wrapMag{
	   	position:relative;
	    display:block;
        width:54%;
        margin-left: auto;
        margin-right: auto;
	}
	
span.lineMag{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	  -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapMag:hover span.lineMag{
	    width:101%;    
	}  
    
/*------------------------------------------*/

/*------------------------------------------*/ 
    span.line_wrapMed{
	   	position:relative;
	    display:block;
        width:44%;
        margin-left: auto;
        margin-right: auto;
	}
    
	
span.lineMed{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapMed:hover span.lineMed{
	    width:102%;    
	}  
    
/*------------------------------------------*/
    
/*------------------------------------------*/ 
    span.line_wrapGlass{
	   	position:relative;
	    display:block;
        width:47%;
        margin-left: auto;
        margin-right: auto;
	}
    
	
span.lineGlass{
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
	    border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapGlass:hover span.lineGlass{
	    width:102%;    
	}  
    
/*------------------------------------------*/
    
/*-----------------END HOMEPAGE LINKS--------------------*/
 
    .homePage{
    margin-top: 80px;
}
   
.box, .box1{
    display: block;
    padding:8px;
    width:98%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 25px;
    line-height: 15px;
    opacity: 0;
    
    text-align: center;
    text-decoration: none;
    color:black;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}    
    
     
    
    
/*-----------------END HOME PAGE--------------------*/
   

   
/*---------------ABOUT SECTION---------------*/
/*////////////////////////////////////////////////*/    
    
.aboutPage{
        width:100%;
        position: absolute;
        left: 0;
        right: 0;
        margin-right: auto;
        margin-left: auto;
    }
    
    #infoContain{
        width:30%;
        margin-left: auto;
        margin-right: auto;
        display: block;
        position: relative;
    }
    
.aboutInfo{
	color:black;
	letter-spacing:1px;
    font-size: 14px;
    font-family: MyOpensansSemiBold;
    line-height: 26px; 
/*    line-height: 35px; */
    margin-top: 105px;
/*    margin-top: 120px;*/
    margin-bottom: 50px;
    opacity: 0;
}
    
.content{
    display: block;
    float:left;
/*    margin-top: 35px; */
    margin-top: 20px;
}

.content a{
    display:block;    
    text-decoration: none;
    color:black;
    font-size: 14px;
    font-family: MyOpensansSemiBold;
/*    line-height: 45px; */
    line-height: 35px;
    opacity: 0;
 
}

        
#close{
    font-family: MyOpensansSemiBold; 
    position:fixed;
    color:black;
    font-size: 14px;
    right:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none; 
    
    font-size: 14px;
    position:fixed;
    height: 25px;
    right:18px;
    top:18px;
    
    
}
    
    
/*------------------------*/     
    
 /*---------SPAN ABOUT TEXT---------------*/ 
    
  span.line_wrap2 {
	   	position:relative;
	    display:block;
        width:40%;
	}
	
span.line2 {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
     border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width .6s ease-in;
         -moz-transition: width .6s ease-in;
         transition: width .6s ease-in;
	}
	span.line_wrap2:hover span.line2 {
	    width:100%;    
	}  
    
/*------------------------*/     
      span.line_wrapBe {
	   	position:relative;
	    display:block;
        width:100%;
	}
	
span.lineBe {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
     border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width .6s ease-in;
         -moz-transition: width .6s ease-in;
         transition: width .6s ease-in;
	}
	span.line_wrapBe:hover span.lineBe {
	    width:35%;    
	} 
/*------------------------*/ 
      span.line_wrapInsta {
	   	position:relative;
	    display:block;
        width:100%;
	}
	
span.lineInsta {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
        border-top: 2px solid black;
	    -webkit-transition: width .6s ease-in;
         -moz-transition: width .6s ease-in;
         transition: width .6s ease-in;
	}
	span.line_wrapInsta:hover span.lineInsta {
	    width:42%;    
	} 
/*------------------------*/     
    
span.line_wrapRes {
	   	position:relative;
	    display:block;
        width:100%;
	}
	
span.lineRes {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
     border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width 1s ease-in;
         -moz-transition: width 1s ease-in;
         transition: width 1s ease-in;
	}
	span.line_wrapRes:hover span.lineRes {
	    width:28%;    
	}

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

span.line_wrapPhone {
	   	position:relative;
	    display:block;
        width:100%;
	}
	
span.linePhone {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:49%;
	    width:0;
     border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width .9s ease-in;
         -moz-transition: width .9s ease-in;
         transition: width .9s ease-in;
	}
	span.line_wrapPhone:hover span.linePhone {
	    width:46%;    
	}
    
    
/*------------------------*/ 
    
span.line_wrapEmail {
	   	position:relative;
	    display:block;
        width:100%;
	}
	
span.lineEmail {
		display:inline-block;
	    position:absolute;
	    left:0;
	    top:50%;
	    width:0;
     border-top: 2px solid white;
      border-top: 2px solid black;
	    -webkit-transition: width .9s ease-in;
         -moz-transition: width .9s ease-in;
         transition: width .9s ease-in;
	}
	span.line_wrapEmail:hover span.lineEmail {
	    width:100%;    
	}
/*---------SPAN ABOUT TEXT---------------*/ 
  
/*---------------ABOUT SECTION---------------*/    

    
/*------------------PROJECT PAGES----------------*/ /*////////////////////////////////////////////////*/
       
   .proTitle{
    text-align: center;
    margin-top: 60px;
    margin-bottom: 40px;
} 
  
    
#processPage{
        margin-bottom: 80px;
    }    
    
.proInfo{
    letter-spacing: .5px;
    
}    
    
.pro3{
    margin-top: 105px;
    }
 
.pageName{
    font-family: MyOpensansSemiBold; 
    position: fixed;
    color:black;
    font-size: 14px;
    left:20px;
    top:20px;
    line-height: 22px;
    letter-spacing: .10px;
    text-decoration: none;
}     
   
    
    .one_vertPic{
        margin-bottom: 54px;
        display: block;
        width: 475px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .one_horPic{
        margin-bottom: 54px;
        display: block;
        width: 978px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
    }
    
       .one_horPicSmall{
        margin-bottom: 30px;
        display: block;
        width: 800px;
        margin-left: auto;
        margin-right: auto;
    }
    
       .one_horPicSquare{
        margin-bottom: 30px;
        display: block;
        width: 550px;
        margin-left: auto;
        margin-right: auto;
    }

    
      .one_vertcenterSmall{
        margin-bottom: 30px;
        display: block;
        width: 385px;
        margin-left: auto;
        margin-right: auto;
    }
    
    
    .one_left{
        float:left;
        display: block;
        width:474px;
        margin-right: 30px;
        margin-bottom: 30px;
    }
    
    .one_right{
        float: left;
        display: block;
        width:474px;
         margin-bottom: 30px;
   
    }
    
    .together{
        width:800px;
        margin-left: auto;
        margin-right: auto;
    
        
    }
    
    
       
    .color{
        width:800px;
        margin-left: auto;
        margin-right: auto;
        height: 500px;
    }
    
  #colorLeft{
        float:left;
        display: block;
        width:385px;
        margin-right: 30px;
        margin-bottom: 30px;
        background-color:#fdf2ec;
        height: 400px;
    }
    
    
      #colorRight{
        float:left;
        display: block;
        width:385px;
        margin-bottom: 30px;
        background-color:#cee9e2;
        height: 400px;
    }
      
    .colorP{
        padding-top:410px;
        text-align: center;
        font-family: MyOpensansSemiBold; 
        letter-spacing: 3px;
        font-size: 13px;
    }
    
    
    .thoughts{
        font-family: MyOpensansSemiBold; 
        letter-spacing: 1px;
        font-size: 10px;
        margin-bottom: 30px;
        margin-top: 50px;
        clear: both;
       text-align: center;
        
    }
    
  .one_leftSmall{
        float:left;
        display: block;
        width:385px;
        margin-right: 30px;
        margin-bottom: 30px;
      clear: both;
    }
    
    .one_rightSmall{
        float: left;
        display: block;
        width:385px;
         margin-bottom: 30px;
        
        
    }
    
    .fuckthis{
        width:100%;
        height:60px;
        background-color: white;
        clear: both;
    }
    
/*
    .space{
        padding-top:40px;
    
    }
*/

    .view{
        width:306px;
        height:50px;
        border: 2px solid black;
        margin-left: auto;
        margin-right: auto;
        margin-top: 50px;
        margin-bottom: 50px;
        display: block;
          -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
         text-align: center;
        font-family: MyOpensansSemiBold;
        text-transform: uppercase;
        font-size: 14px;
        line-height: 50px;
        text-decoration: none;
        color:black;    
    }
    
.view:hover{
        background-color: black;
        color:white;
        -webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
transition: all 0.4s ease-in-out;
    
    }
/*--------------------END PROJECT PAGES--------------------*/    
    
/*-------------------footer----------------
/////////////////////////////////////////////*/

footer{
    position: fixed;
    width: 100%;
/*   bottom:5px;*/
    bottom:20px;
    letter-spacing: .25px;
    left:0;
    right:0;
    margin: auto;
    opacity: 0;
}

footer p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}

    
.pageFooter{
    width: 100%;
    letter-spacing: .25px;
    margin-left: auto;
    margin-right:auto;
    padding-bottom: 15px;
    clear: both;
}
    
    .pageFooter p{
    text-align: center;
    font-size: 10px;
    color:black;
    font-family: MyOpensansLight;
}
/*-------------------END footer----------------*/


    /*------------------END Project TWO----------------*/   


}