/* RESET ====================================*/
*,
*::before,
*::after {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  background-color: #000;
  font-family: sans-serif;
  font-size:75%;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  overflow-x: hidden;
  font-family: 'Montserrat', sans-serif;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block;
}

body {
  margin: 0;
  font-size:16px;
  line-height:21px;
  font-weight: 400;
  color: #cccccc;
  text-align: left;
}

@media (min-width:992px) {
    body {
      font-size:14px;
      line-height:20px;
    }
}

[tabindex="-1"]:focus {
  outline: 0 !important;
}

a {
  cursor:pointer;
  color: #7D30C9;
  text-decoration: none;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 25px;
}

p {
  margin-top: 0;
  margin-bottom: 25px;
}

abbr[title], abbr[data-original-title] {
  text-decoration: underline;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
  text-decoration-skip-ink: none;
}

address {
  margin-bottom: 1rem;
  font-style: normal;
  line-height: inherit;
}

ol, ul, dl {
  margin: 0 0 25px;
}

p:last-child,
ol:last-child, 
ul:last-child, 
dl:last-child { margin-bottom:0; }

ol ol, ul ul, ol ul, ul ol {
  margin-bottom: 0;
}

dt {
  font-weight: normal;
}

dd {
  margin-bottom: .5rem;
  margin-left: 0;
}

blockquote {
  margin: 0 0 3rem;
}

b,
strong {
  font-weight: 400;
}

small {
  font-size: 80%;
}

sub,
sup {
  position: relative;
  font-size: 75%;
  line-height: 0;
  vertical-align: baseline;
}

sub { bottom: -.25em; }
sup { top: -.5em; }

pre, code, kbd, samp {
  font-size: 1rem;
}

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
}

figure {
  margin: 0 0 1rem;
}

img {
  vertical-align: middle;
  border-style: none;
}

svg {
  overflow: hidden;
  vertical-align: middle;
}

table {
  border-collapse: collapse;
}

caption {
  text-align: left;
  caption-side: bottom;
}

th {
  text-align: inherit;
}

label {
  display: inline-block;
  margin-bottom: .5rem;
}

button {
  border-radius: 0;
}

button:focus {
  outline: none;
}

input, button, select, optgroup, textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button, input {
  overflow: visible;
}

button, select {
  text-transform: none;
}

button, [type="button"], [type="reset"], [type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
}

input[type="radio"], input[type="checkbox"] {
  box-sizing: border-box;
  padding: 0;
}


input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"] {
  -webkit-appearance: listbox;
}

textarea {
  overflow: auto;
  resize: vertical;
}

fieldset {
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

legend {
  display: block;
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin-bottom: .5rem;
  font-size: 14px;
  line-height: inherit;
  color: inherit;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  outline-offset: -2px;
  -webkit-appearance: none;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button;
}

output {
  display: inline-block;
}

summary {
  display: list-item;
  cursor: pointer;
}

template {
  display: none;
}

[hidden] {
  display: none !important;
}

/* GRID */
.row [class^=col-],
.row [class*=" col-"] {
    width:100%;
    margin-bottom:3rem
}
.row [class^=col-]:last-child,
.row [class*=" col-"]:last-child {
    margin-bottom:0
}
@media(min-width: 576px){
    .row{
        display:flex;
        flex-wrap:wrap;
        margin-left:-1.5rem;
        margin-right:-1.5rem
    }
    .row [class^=col-],
    .row [class*=" col-"]{
        margin-bottom:0;
        padding-left:1.5rem;
        padding-right:1.5rem
    }
}
@media(min-width: 576px){
    .row .col-sm-1{width:8.3333%}
    .row .col-sm-2{width:16.6666%}
    .row .col-sm-3{width:25%}
    .row .col-sm-4{width:33.3333%}
    .row .col-sm-5{width:41.6665%}
    .row .col-sm-6{width:50%}
    .row .col-sm-7{width:58.3333%}
    .row .col-sm-8{width:66.6666%}
    .row .col-sm-9{width:75%}
    .row .col-sm-10{width:83.3334%}
    .row .col-sm-11{width:91.6667%}
    .row .col-sm-12{width:100%}
}
@media(min-width: 768px){
    .row .col-md-1{width:8.3333%}
    .row .col-md-2{width:16.6666%}
    .row .col-md-3{width:25%}
    .row .col-md-4{width:33.3333%}
    .row .col-md-5{width:41.6665%}
    .row .col-md-6{width:50%}
    .row .col-md-7{width:58.3333%}
    .row .col-md-8{width:66.6666%}
    .row .col-md-9{width:75%}
    .row .col-md-10{width:83.3334%}
    .row .col-md-11{width:91.6667%}
    .row .col-md-12{width:100%}
}
@media(min-width: 992px){
    .row .col-lg-1{width:8.3333%}
    .row .col-lg-2{width:16.6666%}
    .row .col-lg-3{width:25%}
    .row .col-lg-4{width:33.3333%}
    .row .col-lg-5{width:41.6665%}
    .row .col-lg-6{width:50%}
    .row .col-lg-7{width:58.3333%}
    .row .col-lg-8{width:66.6666%}
    .row .col-lg-9{width:75%}
    .row .col-lg-10{width:83.3334%}
    .row .col-lg-11{width:91.6667%}
    .row .col-lg-12{width:100%}
}

.row.no-gutter{margin:0}
.row.no-gutter [class^=col-],
.row.no-gutter [class*=" col-"]{padding:0}

/* CONTAINER */
.container {
    margin-left:auto;
    margin-right:auto;
    padding-left:15px;
    padding-right:15px;
    width:100%;
}
@media (min-width: 576px) { .container { max-width:576px } }
@media (min-width: 768px) { .container { max-width:768px } }
@media (min-width: 992px) { .container { max-width:992px } }
@media (min-width: 1200px) { .container { max-width:1200px } }
@media (min-width: 1320px) { .container { max-width:1320px } }

/* STYLES */
/*html, body { height: 100% }*/

body {

}

h2 { 
    color:#000;
    font-size:3.6rem;
    line-height: 4rem;
    font-weight: 300;
}

.btn {
    background: transparent;
    text-decoration: none;
    letter-spacing: .05rem;
    font-weight: 900;
    transition:all 0.5s ease;
    color:#fff;
    font-size:1.4rem;
    line-height: 1rem;
    padding:1.5rem;
    border-radius: .5rem;
    min-width:18rem;
    text-align: center;
    display: inline-block;
}

.btn-solid {  border:0; }

.btn.btn-solid-primary { background: #29B2FE; }
.btn.btn-solid-primary:hover { background: #2399da; }
.btn.btn-solid-secondary { background:#F52068 }
.btn.btn-solid-secondary:hover { background:#d11b59; }

.btn-outlined { 
    border:.1rem solid transparent;
}

.btn.btn-outlined-primary { border-color:#fff }
.btn.btn-outlined-primary:hover { background:#fff; color:#29B2FE; }

#siteheader {
	background: #000;
	border-bottom:.5rem solid #7D30C9;
	position: relative;
}

	#siteheader:before,
	#siteheader:after {
		content:'';
		height:.5rem;
		position:absolute;
		bottom:-.5rem;
	}

	#siteheader:before {
		width:50%;
		right:0;
		background: #1EB5BD
	}
	#siteheader:after {
		left:50%;
		width:25rem;
		margin-left:-12.5rem;
		background: #F52068;
	}

	#siteheader a {
		color:#fff;
		text-decoration: none;
        transition:all 0.3s ease;
	}

    #siteheader a:hover { color:#F52068; }

	#siteheader .container {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding-top:2rem;
		padding-bottom:2rem;
	}

	#siteheader svg {
        width:16.2rem;
	}

    .mainnavigation { font-size:2rem; }

	.mainnavigation ul {
		list-style: none;
		margin:0;
		padding:0;
	}

		.mainnavigation li {
			margin:0 1rem;
		}

	.available-in {
		display: flex;
		justify-content: flex-end;
	}

		.available-in a:last-child { margin-left:1rem; }

    #siteheader .menu-trigger {
        font-weight: bold;
        color:#fff;
    }

    .mainnavigation .close-element-trigger {
        display: block;
        width: 32px;
        height: 32px;
        position: absolute;
        top:10px;
        right:10px;
    }

    .mainnavigation .close-element-trigger:before,
    .mainnavigation .close-element-trigger:after {
        content:'';
        display: block;
        width:32px;
        height:2px;
        background: #fff;
        position: absolute;
        top:15px;
    }

    .mainnavigation .close-element-trigger:before { transform: rotate(45deg) }
    .mainnavigation .close-element-trigger:after { transform: rotate(-45deg) }

@media (max-width:991px) {
    .mainnavigation {
        position: fixed;
        right:0;
        top:0;
        height: 100%;
        width:100%;
        background: rgba(0,0,0,.95);
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        z-index: 3;
        display: none;
    }
    .menu-active .mainnavigation { display: flex }
    #siteheader ul a { 
        display: block; 
        padding:10px; 
    }
    .available-in { display: none }
}

@media (min-width:768px) {
    #siteheader:after {
        width:50rem;
        margin-left:-25rem;
    }
}

@media (min-width:992px) {
    .mainnavigation { font-size:13px; }
    .mainnavigation ul { display: flex; }
    /*#siteheader nav ul { display: flex; }
    #siteheader li { margin-left:30px; }
    #siteheader li:first-child { margin-left:0; }*/
    #siteheader nav .close-element-trigger,
    #siteheader .menu-trigger { display: none }
}

@media (min-width: 1200px) {
    #siteheader svg { width:22.2rem; }
}

#heroshot {
	height:100vh;
	position: relative;
}


	#heroshot .item {
		background-size:cover;
		-moz-background-size:cover;
		-webkit-background-size:cover;
		background-position: center center;
		padding:10rem 0;
	}

	#heroshot h2 {
		text-align: center;
		color:#fff;
		font-weight: 300;
		font-size:4.8rem;
		line-height: 5rem;
		margin:0;
	}

@media (min-width:992px) {
    #heroshot h2 {
        font-size:6.4rem;
        line-height: 7.2rem;
    }
}

.features {
    padding:10rem 0 14rem;
    text-align: center;
}

    .features h2 { margin-bottom:6rem; }
    .features h3 { 
        font-size:2.4rem; 
        margin:3rem 0;
        color: #000;
        font-weight: 300
    }

    .features svg {
        height: 3.8rem
    }

.writeup { color: #fff; text-align:center; }

.writeup.pink { background:#F52068; }
.writeup.purple { background:#673AB7; }
    
    .writeup .wrapper { padding-top:5rem; }

    .writeup.pink .wrapper {
        max-width:96rem;
        margin:0 auto;
    }

    .writeup h2 { color:#fff }
    .writeup .content { margin-bottom:3rem; }
    .writeup .content div { width:100%; }

    .writeup.pink img { width:24rem; }
    .writeup.purple img { width:29rem; }

@media (min-width:768px) {

    .writeup { text-align:left; }

    .writeup .wrapper { 
        padding-top:0;
        display: flex;
        justify-content: space-between;
    }

    .writeup .content {
        margin-bottom:0;
        display: flex;
        align-items: center;
    }

    .writeup.pink .content {
        order:2;
        padding-left:3rem;
        width:calc(100% - 30rem);
    }

    .writeup.purple .content {  
        padding-right:3rem; 
        width:calc(100% - 37.5rem); 
    }

    .writeup.pink img { order:1; width:30rem; margin-top:-6rem; }
    .writeup.purple img { width:37.5rem; margin-top:-3rem; }
}

@media (min-width:992px) {
    .writeup.pink .content { padding-left:6rem; width:calc(100% - 34.5rem) }
    .writeup.pink img { width:34.5rem; }
    .writeup.purple .content { padding-right:6rem;  width:calc(100% - 57.5rem); }
    .writeup.purple img { width:57.5rem; margin-top:-6rem; }
}

.categories .cat-item {
    color:#fff;
    text-decoration: none;
    display: block;
    background-size: cover;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    font-size:4.2rem;
    height:35rem;
    font-weight: 300;
    background-position:center center;
}

    .categories .cat-item.cities { background-image:url(/National_Library/oe_/https://www.photoanywhere.com/assets/images/cities.jpg); }
    .categories .cat-item.nature { background-image:url(/National_Library/oe_/https://www.photoanywhere.com/assets/images/nature.jpg); }
    .categories .cat-item.people { background-image:url(/National_Library/oe_/https://www.photoanywhere.com/assets/images/people.jpg); }

.categories span.container {
    display: flex;
    align-items: flex-end;
    padding-top:5rem;
    padding-bottom:5rem;
    height: 100%;
    transition:all 0.5s ease;
}

.categories .cat-item:hover span.container { padding-bottom:7.5rem; }

.case-studies {
    padding-top:7.5rem;
    padding-bottom:7.5rem;
    position: relative;
}

    .case-studies .image {
        overflow: hidden;
        background: gray;
        border-radius:.5rem;
        overflow: hidden;
        background-size:cover;
        background-position:center center;
    }

    .case-studies .image:before {
        content: "";
        display: block;
        padding-top: 60%;
    }

    .case-studies span {
        text-transform: uppercase;
        color:#7D30C9;
        margin-bottom:1.5rem;
        display: block;
        font-weight: 500
    }

@media (min-width:768px) {

    .case-studies .item {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .case-studies .item .image,
    .case-studies .item .wrap {
        width:calc(50% - 25px);
    }
}

.gallery {
    text-align:center;
    padding-bottom:15rem;
}

    .gallery p {
        max-width:64rem;
        margin:0 auto;
    }

    .gallery .grid { margin:3rem -.75rem -.75rem; }

        .gallery .grid-item { 
            width:50%; 
            padding:.75rem;
        }

            .gallery .grid-item img { 
                width:100%;
                border-radius:.5rem;
            }

@media (min-width:992px) {
    .gallery .grid-item { 
        width:33.3333%; 
    }
}

.download-us-at { text-align:center; padding-top:4rem; padding-bottom:10rem; }
.download-us-at span { 
    text-transform: uppercase; 
    color:#F52068;
    font-weight: 700;
    display: block; 
    margin-bottom:1.5rem; 
    font-size: 1.6rem;
    flex: 1 1 auto;
}
.download-us-at .wrap { max-width:50rem; margin:0 auto; }

.download-us-at a {
  color:#6666ff;
  font-size: 1.5rem;
}

.use-cases tr {
  border-bottom: 1px solid #333333;
}
.use-cases tr:last-child {
  border-bottom: none;
}
.use-cases td {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
}
.use-cases td:last-child {
  color: #888888;
  font-size: 0.9em;
  padding-left: 24px;
}

#sitefooter {
    width: 100%;
    position:static;
    bottom:0;
    /*background-image: linear-gradient(to top, #007FED, #29B2FE);
    background-image: -moz-linear-gradient(to top, #007FED, #29B2FE);
    background-image: -webkit-linear-gradient(to top, #007FED, #29B2FE);*/
    color:#fff;
    text-align:center;
    margin-top: auto;
}

    #sitefooter .container {
        padding-top:20px;
        padding-bottom:20px;
    }

    #sitefooter .row [class^=col-],
    #sitefooter .row [class*=" col-"] { margin:1.5rem 0; }

    #sitefooter svg { width:6rem; margin-bottom:3rem; }

    #sitefooter h3 {
        text-transform: uppercase;
        font-size:1.4rem;
        font-weight: 700;
        margin-bottom:2rem;
    }

    #sitefooter ul {
        list-style: none;
        margin:0;
        padding:0;
    }

    #sitefooter li {
        padding:.25rem 0;
    }

    .platforms li { padding-bottom:0 ;}
    .platforms li:first-child { margin-bottom:1rem;}

    #sitefooter li a {
        color:#fff;
        text-decoration: none;
    }

    #sitefooter h2 { color:#fff; }

@media (min-width:768px) {
#sitefooter { text-align:center; }

    #sitefooter .row [class^=col-],
    #sitefooter .row [class*=" col-"] { margin:0; }

    #sitefooter .wrap {
        position: relative;
        padding-left:0rem;
    }

    #sitefooter svg {
        margin-bottom:0;
        width:6rem;
        position: absolute;
        left:0;
        top:0;
    }

    #sitefooter .questions { margin-top:30px; }
}

@media (min-width:992px) {
    #sitefooter .wrap {
        /* padding-left:15rem; */
    }

    #sitefooter svg {
        width:9rem;
    }
    #sitefooter .questions { margin-top:0; }
}