/*  >> Swatches << */
.dark-blue {color:#045186} /*header dark blue*/
.white {color:#ffffff} /*white*/
.bg-blue {color:#0ebcee} /*body background light blue*/
.light-blue {color:#6ed7f5} /*border light blue*/

/*  >> Global Elements << */

html {-webkit-text-stroke: 1px rgba(0,0,0,0.1);}
body {font-family:Roboto, Helvetica, Arial, sans-serif; font-weight:300;}
a {text-decoration:none; font-weight:600; color:#;}
a:hover, a:active {color:#333; border-bottom:2px solid #fff;}
a img {text-decoration:none; font-weight:400; color:blue;}
a:hover img {color:blue;}

#main, #header > div {width:960px; margin:0 auto; }

/*  >> Header << */

#header {margin:0; padding:20px 0; height:90px; background:#0ebcee;}
#header h1 {float:left; position:relative; margin:0 0 0 10px; padding-bottom:7px; line-height:48px; font-size:48px; font-weight:600; color:#fff; border-bottom:5px solid #6ed7f5;}
#header h1 span {background:; display:block; float:left; position:absolute; width:254px; top:67px; text-align:right; line-height:20px; font-size:20px; font-weight:300; font-style:italic;}

#nav {float:right; background:;}
#nav a {color:white; border:none; line-height:26px;}
#nav ul {margin:7px 0; padding:0;}
#nav li {display:block; height:32px; width:32px; margin:0 10px 11px 20px; list-style-type:none; background:#045186; overflow:hidden; }
#nav li a {display:block; height:32px; width:32px; background:url(../img/nav-sprite.png) no-repeat left center; transition:all 0.5s ease;}
#nav li a:hover {background-color:#6ed7f5;}
#nav .linkedin {background-position:-28px 5px;}
#nav .email {background-position:6px 10px;}

/*  >> Content Area << */

#main {overflow:hidden; padding:40px 0;}

#main h1, #main h2, #main h3, #main h4, #main h5, #main h6, #main p {margin-left:10px;}
.tile, .wide-tile  {float:left; width:300px; margin:0 10px 20px; line-height:200px;}
.tile img {display:block; width:300px; overflow:hidden; text-align:center; background:#eee;}
.wide-tile {width:620px;height:340px;}

.details {float:left; padding-bottom:20px; width:940px;}
.details h2 {margin:0 0 8px 0; padding:0 0 8px 0; font-weight:400; font-size:28px; color:#0ebcee;}
.details p {margin:0 0 3px 0; padding:0; background:;}
.details span {padding-right:5px; font-size:19px; font-weight:400; text-transform:uppercase; letter-spacing:-1px; color:#045186; border-right:0px solid #0ebcee; }

.featured {float:left; margin:5px 10px 40px; background-color:#eee;}
.featured span {font-weight:500;}
.outline img {border:1px solid #ddd;}
.w940, .w940 img {width:940px;}
.w620, .w620 img {width:620px;}
.w600, .w600 img {width:600px;}
.w590, .w590 img {width:590px;}
.w540, .w540 img {width:540px;}
.w500, .w500 img {width:500px;}
.w460, .w460 img {width:460px;}
.w450, .w450 img {width:450px;}
.w440, .w440 img {width:440px;}
.w430, .w430 img {width:430px;}
.w420, .w420 img {width:420px;}
.w390, .w390 img {width:390px;}
.w350, .w350 img {width:350px;}
.w300, .w300 img {width:300px;}



/* other stuff >>
#nav {float:right; margin:0; height:90px; background:;}
#nav ul {margin:10px 0; padding:0;}
#nav ul {display:block; text-decoration:none; font-weight:400; color:#045186; border:none;}
#nav ul li, #nav ul li a {display:block; list-style-type:none; margin:0 10px 10px 0; height:30px; width:30px; overflow:; letter-spacing:1px; background:#045186; color:#045186; position:relative;}
 #nav ul li a {margin:0;}
#nav ul li a:hover {background-color:#6ed7f5; color:#6ed7f5;}
#nav li a span {background-image:url(img/nav-sprite.png); background:url(file:///C|/Users/Sara/Desktop/snh/snh/img/nav-sprite.png) no-repeat;}
#nav li a span {width:30px; height:30px; positon:absolute;}
#nav a.linkedin span {0; background-position:0 0;}
#nav a:link.email span {background-position:-21px 0;}


.tile:nth-of-type(1), .tile:nth-of-type(4), {margin-left:0;}
.tile:nth-of-type(3), .tile:nth-of-type(6), {margin-right:0;}



#logo {float:left; position:relative; margin:5px 10px 5px 5px; height:70px; width:70px; background:#26ADE4; border-radius:100%;}
#logo div {position:absolute; margin:10px 8px; height:50px; width:50px; background:#; border:1px dashed #00BCD1; border-radius:100%;}
#logo h2 {position:absolute; left:13px; top:14.5px; margin:0 auto; font-size:32px; color:#eeeeee;
/*  -webkit-transform: value;
  -moz-transform:    value;
  -ms-transform:     value;
  -o-transform:      value;
  transform:         rotate(-15deg);
  } 
  
*/