/* 
    Created on : 28-Jan-2015, 7:59:32 PM
    Author     : Samantha
*/

@import url(http://fonts.googleapis.com/css?family=Coda);
@import url("font-awesome.min.css");
html {
       overflow-y: scroll;
}     

body{
    font-family: 'Coda', cursive;
    background: -webkit-linear-gradient(#181818, #913ED1); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(#181818, #913ED1); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(#181818, #913ED1); /* For Firefox 3.6 to 15 */
    background: linear-gradient(#181818, #913ED1); /* Standard syntax */
    background-attachment: fixed;
    overflow-x: hidden; /*for horizontal scroll bar */
}
p{
    text-align: justify;
}
h2, h3{
    color: #481F68;
}

a{
    color: #00CCDB;
    text-decoration: none;
}

a:hover{
    color:#913ED1;
}

.wrapper{
    min-width: 200px;
    margin-top: 72px;
    margin-bottom: 24px;
    padding: 50px; 
    background-color: #ffffff;  
    border: 3px solid #4169b0;
    -webkit-border-radius: 10px;
    border-radius: 10px;  
} 

.header{
    padding-left: 20px;
    padding-right: 20px;
}
.full-width-div {
    position: absolute;
    width: 100%;
    left: 0;
}

.content{
    margin-top: 100px;
}

.subnav{
    min-width: 200px;
    position: absolute;  
    z-index: 1;  
    height: 50px;
    border-top: 3px solid #4169b0;
    border-bottom: 3px solid #4169b0;
    background-color: #181818;  
    color: #bbbbbb;
    text-align: center;
    line-height: 50px;
    -webkit-box-shadow: 0 5px 9px 3px rgba(24,24,24,0.4);
    box-shadow: 0 5px 9px 3px rgba(24,24,24,0.4);
}
.subnav  li{
    display: inline-block; 
    margin: 0 25px;
}
.navbar{
    border-bottom: 3px solid #4169b0;
}

.projectList{
    text-align: center; 
}

.project{
    width: 225px;
    height: 200px;
    color: #ffffff;
    display: inline-block;
    padding: 15px;
    margin: 0px 24px 58px 24px;
    background-color: #4169b0;
    -webkit-border-radius: 10px;
    border-radius: 10px;  
}
.project:hover{
    background-color: #913ED1;
}

.project img{
    -webkit-border-radius: 10px;
    border-radius: 10px;  
    width: 200px;
    border: 3px solid #FFFFFF;
    margin-bottom: 20px;
}

.project h3{
    color: #FFFFFF;
    font-size: 2em;
    margin: 0px;
}
.picblock{
    background-color: #4169b0;
    -webkit-border-radius: 10px;
    border-radius: 10px;  
    padding: 6px;
    color: #ffffff;
    text-align: center;
}
.picblock a{
    display: inline-block;
}

#sidebar{
    background-color: #4169b0;
    -webkit-border-radius: 10px;
    border-radius: 10px;  
    padding: 24px;
    color: #ffffff;
}
#sidebar h3, #sidebar h4, .picblock h3, .social-huge, .social-under, .social-huge-under{
    color: #ffffff;
    text-align: center;
}
#sidebar a:hover{
    color: #ffffff;
}
.social{
    text-align: center;
}
.social a{
    color: #bbbbbb;
}
.social2 a{
    color: #ffffff;
}
.social-huge, .social-huge-under{
    font-size: 9em;
}
.social-huge:hover,.social-huge-under:hover, .fa-stack:hover .social-huge-under,
.fa-stack.hover .social-huge-under{
    color: #00CCDB;
}
.social-over, .social-huge-over{
    color:  #4169B0;
}
.social a:hover{
    color: #ffffff;
}
.social-huge-over{
    font-size: 7em;
    line-height: 1.35em;
    left: -50%;
}
.social-huge-under{
    left: -140%;
}

#copy{
    text-align:center; 
    margin-right:auto; 
    margin-left:auto;
    color: #322140;
    font-weight: bold;
}
#logo{
    width:150px;
    margin-top: -25px;
    display: inline-block;
}
.mainpic{
    -webkit-border-radius: 10px;
    border-radius: 10px; 
    border: 3px solid #4169b0;
}
.row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  flex-wrap: wrap;
}
.row > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

/* CUSTOMIZE THE CAROUSEL
-------------------------------------------------- */

/* Carousel base class */
.carousel {
 -webkit-border-radius: 10px;
  border-radius: 10px; 
  max-height: 525px;
  margin-bottom: 60px;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  z-index: 10;
}

/* Declare heights because of positioning of img element */
.carousel .item {
 -webkit-border-radius: 10px;
  border-radius: 10px; 
  height: 525px;
}
.carousel-control.left, .carousel-control.right {
    background-image: none
}
.carousel-inner > .item > img{
  position: absolute;
 -webkit-border-radius: 10px;
  border-radius: 10px; 
  top: 0;
  left: 0;
  min-width: 100%;
  min-height: 320px;
  max-height: 525px;
}
.static-head{
 -webkit-border-radius: 10px;
  border-radius: 10px; 
  min-width: 90%;
  min-height: 320px;
  max-height: 525px;
}