/* Background pattern from Subtle Patterns: https://www.toptal.com/designers/subtlepatterns */

body{
margin: 0;
padding: 0;
width: 100%;
font-family: 'Barlow', sans-serif !important;
}

a {
    color: #FFFFFF !important;
    text-decoration: underline !important;
}

h1 {
font-size: 55px;
text-align: center;
color: #fff;
margin: 0;
padding: 0;
font: arial;
}

h2 {
font-size: 70px !important;
text-align: center;
color: #fff;
margin: 0;
padding: 0;
font-family: 'Barlow', sans-serif !important;
font-weight: bold;
}

h3 {
text-align: center;
margin: 5px 0;
padding: 0;
position: relative;
font-family: 'Barlow', sans-serif !important;
font-size: 30px;
color: #fff;
}

h4 {
text-align: center;
margin: 5px 0;
padding: 0;
position: relative;
font-family: 'Barlow', sans-serif !important;
font-size: 24px;
color: #fff;
}

small-text {
position: relative;
font-family: 'Barlow', sans-serif !important;
font-size: 12px;
color: #fff;
}

.center { margin: 0 auto; }
.content{ margin: 0 auto; width: 960px; }
.clear { clear: both; }

card {
color: #000000;
}

card-title {
color: #000000;
}

card-text {
color: #000000;
}

.card-url {
color:#808080;
font-size:12px;
font-style: oblique;
}

#header {
z-index: 1;
width: 100%;
background-color: #21455b;
background-image: url("../img/grey.jpg");
position: fixed;
font-family: 'Barlow', sans-serif;
}
#nav { width: 410px; float: right; padding-top: 0px;padding-bottom: 10px;background-color: #21455b; background-image: url("../img/grey.jpg"); width:100%;}
#logo a { color: #fff; font-family: 'Barlow', sans-serif; text-decoration: none; float: left; font-size: 30px; margin-top: 5px; margin-left: 60px; color: #fff; }
#nav ul{
list-style: none;
display: block;
margin: 0 auto;
list-style: none;
}
#nav li{
margin-top: 5px;
float: left;
margin-left: 21px;
font-family: 'Barlow', sans-serif;
}
#nav li a { color: #fff; opacity:0.6; font-size: 16px; text-decoration: none; }
#nav li a.active { color: #fff; opacity:1; border-bottom: 2px solid #fff; }
#nav li a:hover { color: #fff; opacity:1; }

#nav-info {
color: #ffffff;
}

#nav-producers {
color: #ffffff;
background:#17303A;
padding-left:5px;
padding-right:5px;
border-radius: 5px;
}

#nav-distributors {
color: #ffffff;
background:#A76E29;
padding-left:5px;
padding-right:5px;
border-radius: 5px;
}

#nav-strategy {
color: #ffffff;
background:#EF3B39;
padding-left:5px;
padding-right:5px;
border-radius: 5px;
}

#nav-users {
color: #ffffff;
background:#006838;
padding-left:5px;
padding-right:5px;
border-radius: 5px;
}

#slide1, #slide2{ width: 100%; }
#slide1{
/* 
background:linear-gradient(0deg, rgba(17, 23, 145, 0.0), rgba(17, 23, 145, 0.9)), url('../img/670109main_yukon_delta.jpg') 50% 0 no-repeat fixed;
 */
background-color: #000000;
color: #fff;
height: 100%;
margin: 0;
padding: 75px 0 100px 0;
background-size: cover;
text-align: center;
}

#slide2{
background-color: #fff;
color: #333333;
margin: 0 auto;
overflow: hidden;
padding-top: 90px;
padding-bottom:50px;
}

#slide3{
background:url('../img/slide6.jpg') 50% 0 no-repeat fixed;
color: #fff;
height: 100%;
margin: 0;
padding: 200px 0 260px 0;
background-size: cover;
}
#slide4{
background-color: #fff;
color: #333333;
padding: 25px 0;
}
#slide5{
background-color: #464646;
margin: 0 auto;
padding: 25px 0;
color: #fff;
}

#resources{
background:url('../img/resources.jpg') 50% 0 no-repeat fixed;
height: 100%;
margin: 0;
padding: 150px 0 200px 0;
background-size: cover;
}

#interoperability{
background:url('../img/australia_viirs_2019091_lrg.jpg') 50% 0 no-repeat fixed;
height: 100%;
margin: 0;
padding: 150px 0 200px 0;
background-size: cover;
}

#registerpage{
background-color: #fff;
background-image: url("../img/grey/grey.png");
color: #333333;
margin: 0 auto;
overflow: hidden;
padding-top: 200px;
padding-bottom:50px;
}

#producers-page {
background:url('../img/producers-bg.jpg') 50% 0 no-repeat fixed;
height: 100%;
margin: 0;
padding: 150px 0 200px 0;
background-size: cover;
}

#users-page {
background:url('../img/users-bg.jpg') 50% 0 no-repeat fixed;
height: 100%;
margin: 0;
padding: 150px 0 200px 0;
background-size: cover;
}

#distributors-page {
background:url('../img/distributors-bg.jpg') 50% 0 no-repeat fixed;
height: 100%;
margin: 0;
padding: 150px 0 200px 0;
background-size: cover;
}

.btn-resources {
background-color: #21455b;
color: #fff;
border-color: #21455b;
}

#producers {
    background: linear-gradient(110deg, #22465B 50%, #315D72 50%);
    border-radius: 30px;
    padding: 20px;
    margin: 30px;
    width: 300px;
    display: inline-block
}

#distributors {
    background: linear-gradient(110deg, #A76E29 60%, #BC803F 40%);
    border-radius: 30px;
    padding: 20px;
    margin: 30px;
    width: 300px;
    display: inline-block
}

#users {
    background: linear-gradient(110deg, #006838 70%, #0E7A44 30%);
    border-radius: 30px;
    padding: 20px;
    margin: 30px;
    width: 300px;
    display: inline-block
}

.icon {
  width: 70px;
  height: 70px;
  padding-right: 30px;
}

.cover {
  width: 100px;
}

.centerimg {
    display: block;
    margin: auto;
    width:70%;
}

#nav-bottom ul{
list-style: none;
display: block;
list-style: none;
}

#nav-bottom li{
margin-top: 5px;
font-family: 'Barlow', sans-serif;
width:50%;
}
#nav-bottom li a { color: #fff; opacity:0.6; font-size: 16px; text-decoration: none; }
#nav-bottom li a.active { color: #fff; opacity:1; border-bottom: 2px solid #fff; }
#nav-bottom li a:hover { color: #fff; opacity:1; }

    /* fix for the ipad */
@media (min-device-width : 768px) and (max-device-width : 1024px)  { 
    #slide1,#slide3 {
        background-attachment: scroll;
        height: 100%;
    }

    .ipadfix{
        height: 300px !important;
    }
    img.ipadfix{
        width:100% !important; 
        height:auto !important;
    }
    
    #producers {
    background: linear-gradient(110deg, #22465B 50%, #315D72 50%);
    border-radius: 20px;
    padding: 10px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}

	#distributors {
    background: linear-gradient(110deg, #A76E29 60%, #BC803F 40%);
    border-radius: 20px;
    padding: 10px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}

	#users {
    background: linear-gradient(110deg, #006838 70%, #0E7A44 30%);
    border-radius: 20px;
    padding: 10px 20px 10px 20px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}
	
	.icon {
  	width: 50px;
  	height: 50px;
  	padding-right: 10px;
	}
    
}
/* fix for the ipad */
@media (min-device-width : 768px) and (max-device-width : 1024px) and (orientation: portrait) {
    #slide1,#slide3 {
        height: 100%;
    }
    
    #producers {
    background: linear-gradient(110deg, #22465B 50%, #315D72 50%);
    border-radius: 20px;
    padding: 10px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}

	#distributors {
    background: linear-gradient(110deg, #A76E29 60%, #BC803F 40%);
    border-radius: 20px;
    padding: 10px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}

	#users {
    background: linear-gradient(110deg, #006838 70%, #0E7A44 30%);
    border-radius: 20px;
    padding: 10px 20px 10px 20px;
    margin: 10px;
    width: 200px;
    display: inline-block
	}
	
	.icon {
  	width: 50px;
  	height: 50px;
  	padding-right: 10px;
	}
    
} 


/* fix for the iphone */

@media (min-device-width : 320px) and (max-device-width : 568px)  { 
    #slide1,#slide3 {
        background-attachment: scroll;
        height: 100%;
    }

    .ipadfix{
        height: 150px !important;
    }
    img.ipadfix{
        width:100% !important; 
        height:auto !important;
    }
    
    h2 {
		font-size: 50px !important;
		text-align: center;
		color: #fff;
		margin: 0;
		padding: 0;
		font-family: 'Barlow', sans-serif !important;
		font-weight: bold;
	}
    
}

@media (min-device-width : 320px) and (max-device-width : 568px) and (orientation: portrait) {
    #slide1,#slide3 {

        height: 100%;
    }
    
    h2 {
		font-size: 50px !important;
		text-align: center;
		color: #fff;
		margin: 0;
		padding: 0;
		font-family: 'Barlow', sans-serif !important;
		font-weight: bold;
	}
}