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

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

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

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

.container { max-width: 970px }

#header {
  background-color:#1c3f53;
  height:90px;
}

@media (max-width:767px) {
  #header {
    height:90px;
  }
}

body {
  background-color:#EEF0EF;
}

@media (min-width:768px) {
  body {
	padding-top: 60px;
  }
}

#main-container {
  background-color:#ffffff;
}

#studymate-logo-div {
  font-family: 'museo_sans700', sans-serif;
  margin-top:14px;
  padding:14px 30px 0px 30px;
  background-color:#FA7D0F;
  color:#ffffff;
  font-size:18px;
  width:150px;
  float:right;
  position:relative;
  right:-15px;
}

#studymate-logo-div a {
	color: #ffffff;
	text-decoration: none;
}

#folder-name {
  font-family: 'museo_sans500', sans-serif;
  color:#ffffff;
  font-size:24px;
  padding-left:30px;  
}

@media (max-width:767px) {
  #folder-name {
    font-size:18px;
    text-align:center;
  }
}

@media (min-width:768px) {
  #folder-name {
    position: relative;
  	top: -24px;
  }
}

#studymate-link {
  margin-top:16px;
}

#studymate-link a {
  font-family: 'museo_sans500', sans-serif;
  color:#fa7d0f;
  font-size:14px;
  text-decoration: none;
}

#studymate-link a i {
  font-size:18px;
  position: relative;
  top: 1px;
  margin-right: 10px;
}


@media (max-width:767px) {
  .template-div {
    height:32px;
    width:32px;
  }
   .template-div img {
  	height: 16px;
  	width: 16px;
  	margin-top: 25%;
  	margin-left: 25%;
  }
  .template-1 {
    background-image:url(../../images/nsm/Template1_40-1.png);
  }
  .template-2 {
    background-image:url(../../images/nsm/Template2_40-1.png);
  }
  .template-3 {
    background-image:url(../../images/nsm/Template3_40-1.png);
  }
  .template-4 {
    background-image:url(../../images/nsm/Template4_40-1.png);
  }
  .template-5 {
    background-image:url(../../images/nsm/Template5_40-1.png);
  }
  .template-6 {
    background-image:url(../../images/nsm/Template6_40-1.png);
  }
  .template-7 {
    background-image:url(../../images/nsm/Template7_40-1.png);
  }
  .template-external {
    background-image:url(../../images/nsm/TemplateExternal_40.png);
  }
}

@media (min-width:768px) and (max-width:991px) {
  .template-div {
    height:64px;
    width:64px;
    background-size: 90px 90px;
    background-repeat: no-repeat;
    background-position: 5px 5px; 
    border-radius: 50%;
    background-color: #efefef;
  }
   .template-div img {
  	height: 32px;
  	width: 32px;
  	margin-top: 25%;
  	margin-left: 25%;
  }
  .template-div:hover {
  	cursor: pointer;
  }
  .template-1 {
    background-image:url(../../images/nsm/Template1_90.png);
  }
  .template-2 {
    background-image:url(../../images/nsm/Template2_90.png);
  }
  .template-3 {
    background-image:url(../../images/nsm/Template3_90.png);
  }
  .template-4 {
    background-image:url(../../images/nsm/Template4_90.png);
  }
  .template-5 {
    background-image:url(../../images/nsm/Template5_90.png);
  }
  .template-6 {
    background-image:url(../../images/nsm/Template6_90.png);
  }
  .template-7 {
    background-image:url(../../images/nsm/Template7_90.png);
  }
  .template-external {
    background-image:url(../../images/nsm/TemplateExternal_90.png);
  }
}

@media (min-width:992px) {
  .template-div {
    height:64px;
    width:64px;
    background-size: 120px 120px;
    background-repeat: no-repeat;
    background-position: 5px 5px;
	border-radius: 50%;
	background-color: #efefef;
  }
  .template-div img {
  	height: 32px;
  	width: 32px;
  	margin-top: 25%;
  	margin-left: 25%;
  }
  
  
  .template-div:hover {
  	cursor: pointer;
  }
  .template-1 {
    background-image:url(../../images/nsm/Template1_120.png);
  }
  .template-2 {
    background-image:url(../../images/nsm/Template2_120.png);
  }
  .template-3 {
    background-image:url(../../images/nsm/Template3_120.png);
  }
  .template-4 {
    background-image:url(../../images/nsm/Template4_120.png);
  }
  .template-5 {
    background-image:url(../../images/nsm/Template5_120.png);
  }
  .template-6 {
    background-image:url(../../images/nsm/Template6_120.png);
  }
  .template-7 {
    background-image:url(../../images/nsm/Template7_120.png);
  }
  .template-external {
    background-image:url(../../images/nsm/TemplateExternal_120.png);
  }
}


@media (max-width:767px) {
  .project-row-col1 {
    padding:16px 0px 16px 16px;
  }
}

@media (min-width:768px) {
  .project-row-col1 {
    padding:40px 0px 60px 40px;
  }
}

.project-row-col2 {
  padding:24px 0px;
}

@media (min-width:320px) {
	.project-row-col2 {
  		padding: 24px 0px 24px 16px;
	}	
}

@media (min-width:768px) and (max-width: 991px) {
  .project-row-col2 {
    padding:56px 30px 40px 48px;
  }
}

@media (min-width:992px) {
  .project-row-col2 {
    padding:56px 30px 40px 40px;
  }
}

.project-name {
  font-family: 'museo_sans500', sans-serif;
  font-size:18px;
  color:#1C3F53;
}

@media (min-width:768px) {
  .project-name {
    font-size:20px;
    color:#1C3F53;
  }
  .project-name:hover {
  	cursor: pointer;
  }
}

.project-row-col3 {
  padding:20px 0px;
  font-size: 24px;
  color: #666666;
}

.project-description {
  font-family: 'Open Sans', sans-serif;
  color:#333333;
  font-size:14px;
  margin-right: 8%;
}

.project-row {
  border-bottom:1px solid #dadada;
  position: relative;
  top: -10px;
}

.project-row:last-of-type {
  border: 0px;
}

@media (max-width:767px) {
  .project-row:hover {
    cursor: pointer;
  }
}

.project-launch-link a {
  font-family: 'museo_sans700', sans-serif;
  color:#c15317;
  font-size:16px;
  text-decoration: none;
}

.project-launch-link a i {
  font-size: 18px;
  margin-left: 10px;
  position: relative;
  top: 1px;
}

#footer {
	background-color: #efefef;
	padding-right: -30px;
	font-family: 'museo_sans300', sans-serif;
	color: #333333;
	font-size: 14px;
	text-align: right;
}

#footer > div {
	padding-top: 20px;
	padding-right: 0px;
}

#footer a {
	color: #387da6;
	text-decoration: underline;
}