/* Based STYLING of the site */

html,
header,
footer,
article {
margin: 0px;
}

div.space > article, div.space > p, div.col-md-6 > p, div.col-md-8 > article { outline: 0px solid #000; text-align: justify; width: 100%; padding: 0em; }
 

div.col-md-4 > img
{
	margin-bottom: 1.8em;
}

p
{
	   padding: 0.4em;
	    background-color: rgba(255, 255, 255, 0.31);
}
/* Specialised STYLING of the social media links located in the site footer. */

a.btn-large
{
    width: 40px;
    height: 40px;
    outline: 0px solid #000;
   background: rgb(0, 0, 0);
   background: rgba(0, 0, 0, 0.1);
}


h2.postUpdated
{
	max-width: 600px;
	outline: 1px solid #58f03a;
	margin: 1em 0em 1em 0em;
}

h2.errorNotice
{
	max-width: 600px;
	outline: 1px solid #ff0000;
	margin: 1em 0em 1em 0em;
}



#contact
{
	height: 500px;
	margin-bottom: 14.6em;
}

.hero
{
    height: 560px;
    background:
            linear-gradient(
             rgba(35, 70, 105, 0.6),
             rgba(3, 119, 252, 0.6)
            ),
            url("../images/breather-mini.jpg") no-repeat 0% 100% fixed;
    background-size: cover;
    text-align: center;
}

div.container > ul > li > a
{
    color: #ddd;
    text-decoration: none;
}

div.container > ul > li > a:hover,
div.container > ul > li > a:focus
{
    color: #dc9f09;
}

div.container > ul > li > a.btn-large:hover
{
	
   background: rgba(0, 0, 0, 0.1);
   color: #dc9f09;
	
}


div.container > div.row > div.col-md-8 > h1
{
	font-size: 2.4em;
    line-height: 2em;
    font-weight: lighter;
    color: rgba(138, 194, 251, 1);
    margin-top: 0.2em;
    padding-left: 15px;
    padding-right: 15px;
}


div.row > div.container > h1,
div.container > div.row > h1
{
    font-size: 4em;
    line-height: 2em;
    font-weight: lighter;
    color: rgba(138, 194, 251, 1);
    margin-top: 0.2em;
    padding-left: 15px;
    padding-right: 15px;
}



div.row > div.container > h1.banner-notice
{
            font-size: 3.8em;
            line-height: 1.2em;
            margin-top: 0.4em;
            margin-bottom: 0.4em;
      		color: #ddd;	
          /*  padding-left: 0px; */
            padding-right: 15px;
   }

/* Style designed to give content on the page space to breathe.... */
.space
{
    margin-top: 4em;
}

/* Specialised STYLING of the Affiliate companies HEADER section. */
 h1.affiliate
{
        font-size: 6em;
        color: #dc9f09;
        text-align: center;
}

/* Styles needed to maintain GRID structure for the
	IMAGES within the Affiliate Partners 
	SECTION.  */
div.affiliates > div.img-grid-1,
div.affiliates > div.img-grid-2
{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}


/* Styles needed to showcase the toggleable content behind each image within the GRID of IMAGES within the Affiliate Partners.  */
div.container > div.row > div.col-md-4 > div#blurb-1,
div.container > div.row > div.col-md-4 > div#blurb-2,
div.container > div.row > div.col-md-4 > div#blurb-3,
div.container > div.row > div.col-md-4 > div#blurb-4,
div.container > div.row > div.col-md-4 > div#blurb-5,
div.container > div.row > div.col-md-4 > div#blurb-6,
div.container > div.row > div.col-md-4 > div#blurb-7,
div.container > div.row > div.col-md-4 > div#blurb-8,
div.container > div.row > div.col-md-4 > div#blurb-9
{
	flex-direction: row;
	width: 284px;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	outline: 1px solid #e3e3e3;
	margin: 2em 16%;
    padding: 0.8em;
}


 div.col-md-4 > ul > li > a.btn-large > i.fa
        {
            outline: 0px solid #fff;
            margin-left: 0.8em;   
        }


div.col-md-4 > ul > li > h2,
div.col-md-4 > ul > li > h1,
div.col-md-3 > ul > li > h1
{
    color: #808080;
    width: 100%;
}

div.row > div.container > h2.heading
{
	outline: 0px solid #000;
	color: rgb(3, 119, 252);
	font-weight: bold;
	font-size: 2.6em;
}

div.row > div.col-md-8 > p
{
	font-weight: thin;
	font-size: 2.2em;
	padding: 1.2em 0em;
}


div.row > div.col-md-8 > p.msg,
div.row > div.col-md-8 > p.profile
{
	font-weight: thin;
	font-size: 14pt;
	padding: 0.2em 0em;
	text-align: justify; 
	width: 100%; 
}

div.row > div.col-md-8 > p.m
{
	font-weight: thin;
	font-size: 2.2em;
	padding: 0.2em 0em;
}


div.row > div.col-md-5 > p
{
	font-weight: thin;
	font-size: 2.2em;
	margin: 0em;
}

 div.container > div.row > div#myTabContent
{
	margin-top: 2em;
}


/* Large desktops and laptops */
@media (min-width: 1200px) {
    
    
     div.col-md-4 > ul > li > a.btn-large > i.fa
        {
            outline: 0px solid #fff;
            margin-left: 0.8em;   
        }
    
     div.container > div.row > div#myTabContent
        {
          outline: 0px solid #000;
            width: 100%;
        }
           	
    
   
   .navbar-expand-lg .navbar-nav .nav-link 
   {
    padding-right: 1.5rem;
    padding-left: 1.5rem;
   }
      
	.content-2
    {
        height: 776px;
        background:
                linear-gradient(
                 rgba(220, 159, 9, 0.6),
                 rgba(220, 159, 9, 0.6)
                ),
                url("../images/aaron-burden.jpg") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: center;
        padding: 20px;
    }
    
    
    .content-3
    {
        height: 464px;
        background:
                linear-gradient(
                 rgba(0, 0, 0, 1),
                 rgba(0, 0, 0, 1)
                ),
                url("") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: left;
        padding: 20px;
    }
    
     div.content-3 > div.container > div.row > div.col-md-4 > ul
    {
    width: 330px;
    list-style: none;
    margin-top: 40px;
    margin-right: 0px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    padding: 4px;
    }
    
     div.content-3 > div.container > div.row > div.col-md-3 > ul
    {
    width: 244px;
    list-style: none;
    margin-top: 40px;
    margin-right: 80px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    }


    div.content-3 > div.container > div.row > div.col-md-3 > ul > li,
    div.content-3 > div.container > div.row > div.col-md-4 > ul > li
    {
        line-height: 2em;
        font-size: 16px;
    }

        div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a.f_links,
    div.content-3 > div.container > div.row > div.col-md-4 > ul > li > div
        {
            color: #fff;
        }

            div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a:hover,
            div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a:hover
            {
                color: #A5801B;
                text-decoration: none;
            }
    
    
    .content-2 h4
    {
        font-size: 4em;
        color: #ddd;
    }
    
      div.content-2 > div.container > div.row > div.col-lg-4 > h4 > a
		{
			
			color: #ddd;
			text-decoration: none;
		
		}  
    
    div.container > div.row > h1.banner-notice
    {
        font-size: 2rem;
        font-weight: lighter;
        line-height: 2.5rem;
        color: #ddd;
        margin-top: 1.0em;
    
    }

     div.container > div.row > h1.banner
    {
        font-size: 6em;
        line-height: 1.4em;
        color: #ddd;
        margin-top: 1.0em;
    
    }
    
      div.container > div.row > h2.banner
    {
        font-size: 3em;
        line-height: 1.4em;
        color: #565656;
        margin-top: 1.0em;
    }
    
    
    }
    
    /* Landscape tablets and medium desktops */
    @media (min-width: 992px) and (max-width: 1199px) {
    
         div.col-md-4 > ul > li > a.btn-large > i.fa
        {
            outline: 0px solid #fff;
            margin-left: 0.8em;   
            
        }
        
         div.container > div.row > div#myTabContent
        {
          outline: 0px solid #000;
            width: 100%;
        }
        
   	 .navbar-expand-lg .navbar-nav .nav-link 
  	 {
   		 padding-right: 1.5rem;
  		  padding-left: 1.5rem;
  	
  		 }
    
    
        h1.affiliate
        {   
             color: #dc9f09;
            text-align: center;
            margin: 0em;
            font-size: 5.8em;
        }    


        div.container > div.row > h1.banner
        {
            font-size: 4.6em;
            font-weight: lighter;
            line-height: 1.4em;
            color: #ddd;	
            margin-top: 1.0em;
            padding-left: 15px;
            padding-right: 15px;
        }

		
		div.container > div.row > h2.banner
    {
        font-size: 3em;
        line-height: 1.4em;
        color: #565656;
        margin-top: 1.0em;
    }
    
	
        
         div.container > div.row > div.col-md-8 > h2.banner
        {
                font-size: 3em;
                line-height: 1.4em;
                color: #565656;
                margin-top: 1.0em;
        }
        
        .content-2
        {
            height: 746px;
            background:
                    linear-gradient(
                     rgba(220, 159, 9, 0.6),
                     rgba(220, 159, 9, 0.6)
                    ),
                    url("../images/aaron-burden.jpg") no-repeat 0% 100% fixed;
            background-size: cover;
            text-align: center;
            padding: 20px;
        }
        
        
        .content-2 h4
        {
            font-size: 4em;
            color: #ddd;
        }
        
        
         div.content-2 > div.container > div.row > div.col-lg-4 > h4 > a
		{
			
			color: #ddd;
			text-decoration: none;
		
		}  
    
      

        
         .content-3
    {
        height: 546px;
        background:
                linear-gradient(
                 rgba(0, 0, 0, 1),
                 rgba(0, 0, 0, 1)
                ),
                url("") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: left;
        padding: 20px;
    }
    
    div.content-3 > div.container > div.row > div.col-md-4 > ul
    {
    width: 300px;
    list-style: none;
    margin-top: 40px;
    margin-right: 0px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    padding: 4px;
    }
    
     div.content-3 > div.container > div.row > div.col-md-3 > ul
    {
    width: 224px;
    list-style: none;
    margin-top: 40px;
    margin-right: 0px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    }



    div.content-3 > div.container > div.row > div.col-md-3 > ul > li 
    {
        line-height: 2em;
        font-size: 16px;
    }

        div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > div
        {
            color: #ccc;
        }

            div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a:hover,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a:hover
            {
                color: #A5801B;
                text-decoration: none;
            }
    
    
   

    }
    
    /* Portrait tablets and small desktops */
    @media (min-width: 768px) and (max-width: 991px) {
    
   
         div.container > div.row > div#myTabContent
        {
          outline: 0px solid #000;
            width: 100%;
        }
          
          		       	      
div.row > div.col-md-8 > p
{
	font-weight: thin;
	font-size: 2.2em;
	padding: 0em 0em;
}
        
/* Styles needed to maintain GRID structure for the
	IMAGES within the Affiliate Partners 
	SECTION of the landing page; during mobile device viewing.  */
div.space > div.img-grid-1
{
	outline: 0px solid #000;
	margin-top: 2em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

div.space > div.img-grid-2
{
	outline: 0px solid #000;
	margin-top: 3em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
		
        
        div.container > div.row > h1.banner,
        div.container > div.row > h2.banner
        {
            font-size: 4.6em;
            font-weight: lighter;
            line-height: 1.4em;
            color: #ddd;
            margin-top: 0em;
            padding-left: 15px;
            padding-right: 15px;
        }

        h1.affiliate
        {   
             color: #dc9f09;
            text-align: center;
            margin: 0em;
            font-size: 4.2em;
        }    

        .content-2
        {
            height: 2040px;
            background:
                    linear-gradient(
                     rgba(220, 159, 9, 0.6),
                     rgba(220, 159, 9, 0.6)
                    ),
                    url("../images/aaron-burden.jpg") no-repeat 0% 100%;
            background-size: cover;
            text-align: center;
            padding: 20px;
        }


        .content-2 h4
        {
            font-size: 4em;
            color: #ccc;
        }
        
         div.content-2 > div.container > div.row > div.col-lg-4 > h4 > a
		{
		
			color: #ddd;
			text-decoration: none;
		
		}  
    

        div.row > div.col-sm-12 > img.img-responsive
        {
            margin-left: 34%;
        }
        
    .content-3
    {
        height: 464px;
        background:
                linear-gradient(
                 rgba(0, 0, 0, 1),
                 rgba(0, 0, 0, 1)
                ),
                url("") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: left;
        padding: 20px;
    }
    
 div.content-3 > div.container > div.row > div.col-md-4 > ul
    {
    width: 220px;
    list-style: none;
    margin-top: 40px;
    margin-right: 0px;
    margin-left: 20px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    padding: 4px;
    }
    
     div.content-3 > div.container > div.row > div.col-md-3 > ul
    {
    width: 182px;
    list-style: none;
    margin-top: 40px;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    border-right: 1px solid #fff;
    padding: 0px;
    }


    div.content-3 > div.container > div.row > div.col-md-3 > ul > li,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li
    {
        line-height: 2em;
        font-size: 16px;
    }

        div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > div
        {
            color: #ccc;
        }

            div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a:hover,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a:hover
            {
                color: #A5801B;
                text-decoration: none;
            }
        
        div.container > div.row > div.col-md-8 > h2.banner
        {
                font-size: 3em;
                line-height: 1.4em;
                color: #565656;
                margin-top: 1.0em;
        }
        

    }
    
    /* Landscape phones and portrait tablets */
    @media (max-width: 767px) {
        
        div.container > div.row > div#myTabContent
        {
          outline: 0px solid #000;
            width: 100%;
        }
        
        div.col-md-4 > ul > li > a.btn-large > i.fa
        {
            outline: 0px solid #fff;
            margin-left: 0.8em;   
        }
		       	
		       	      
div.row > div.col-md-8 > p
{
	font-weight: thin;
	font-size: 2.2em;
	padding: 0.2em 0em;
}
      
/* Styles needed to maintain GRID structure for the
	IMAGES within the Affiliate Partners 
	SECTION of the landing page; during mobile device viewing.  */
div.space > div.img-grid-1
{
	outline: 0px solid #000;
	margin-top: 2em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

div.space > div.img-grid-2
{
	outline: 0px solid #000;
	margin-top: 3em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
		

div.container > div.row > div.col-md-4 > div#blurb-1,
div.container > div.row > div.col-md-4 > div#blurb-2,
div.container > div.row > div.col-md-4 > div#blurb-3,
div.container > div.row > div.col-md-4 > div#blurb-4,
div.container > div.row > div.col-md-4 > div#blurb-5,
div.container > div.row > div.col-md-4 > div#blurb-6
{
	flex-direction: row;
	width: 100%;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	outline: 1px solid #000;
	margin: 2em 16%;
}
		
	
	
        .content-2
        {
            height: 2000px;
            background:
                    linear-gradient(
                     rgba(220, 159, 9, 0.6),
                     rgba(220, 159, 9, 0.6)
                    ),
                    url("../images/aaron-burden.jpg") no-repeat 0% 100%;
            background-size: cover;
            text-align: center;
            padding: 20px;
        }

        .content-2 h4
        {
            font-size: 4em;
            color: #ccc;
        }
        
        
         div.content-2 > div.container > div.row > div.col-lg-4 > h4 > a
		{
	
			color: #ddd;
			text-decoration: none;
		
		}  
    
        
    
        div.row > div.col-sm-12 > img.img-responsive
        {
            margin-left: 34%;
        }

        div.row > div.col-sm-12
        {
            margin-bottom: 2.8em;
        }

        div.container > div.row > h1.banner,
        div.container > div.row > h2.banner
        {
             font-size: 4.6em;
            font-weight: lighter;
            line-height: 1.4em;
         	color: #ddd;
            margin-top: 0em;
            padding-left: 15px;
            padding-right: 15px;
        }
        
        
        .content-3
    {
        height: 896px;
        background:
                linear-gradient(
                 rgba(0, 0, 0, 1),
                 rgba(0, 0, 0, 1)
                ),
                url("") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: left;
        padding: 20px;
    }
    
    div.content-3 > div.container > div.row > div.col-md-4 > ul
    {
        list-style: none;
        margin-top: 40px;
        margin-right: 10px;
    }
        
     div.content-3 > div.container > div.row > div.col-md-3 > ul    
    {
        list-style: none;
        margin-top: 40px;
        margin-right: 80px;
    }


    div.content-3 > div.container > div.row > div.col-md-3 > ul > li,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li
    {
        line-height: 2em;
        font-size: 16px;
    }

        div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > div
        {
            color: #fff;
        }

            div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a:hover,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a:hover
            {
                color: #A5801B;
                text-decoration: none;
            }
        
div.col-md-4 > ul > li > h2,
div.col-md-4 > ul > li > h1,
div.col-md-3 > ul > li > h1
{
    color: #808080;
    width: 100%;
}
        
        div.container > div.row > div.col-md-8 > h2.banner
        {
                font-size: 3em;
                line-height: 1.4em;
                color: #565656;
                margin-top: 1.0em;
        }
        

        
    }
    
    /* Portrait phones and smaller */
    @media (max-width: 480px) {
        
        h1.affiliate
        {
            margin: 0em;    
            font-size: 3.3em;
            color: #dc9f09;
            margin-left: 0.2em;
        }

        
        /* Styles needed to showcase the toggleable content behind each image within the GRID of IMAGES within the Affiliate Partners.  */
div.container > div.row > div.col-md-4 > div#blurb-1,
div.container > div.row > div.col-md-4 > div#blurb-2,
div.container > div.row > div.col-md-4 > div#blurb-3,
div.container > div.row > div.col-md-4 > div#blurb-4,
div.container > div.row > div.col-md-4 > div#blurb-5,
div.container > div.row > div.col-md-4 > div#blurb-6,
div.container > div.row > div.col-md-4 > div#blurb-7,
div.container > div.row > div.col-md-4 > div#blurb-8,
div.container > div.row > div.col-md-4 > div#blurb-9
{
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	outline: 1px solid #e3e3e3;
	margin: 2em 16%;
    padding: 0.8em;
}
        
        img
        {
            display: block;
            max-width: 100%;
            height: auto;
        }

        div.row > div.col-sm-12 > img.img-responsive
        {
            margin-top: 16%;
            margin-left: 18%;
        }

        div.row > div.col-sm-12
        {
            margin-bottom: 2.8em;
        }

        .hero
        {
            height: 520px;
            background:
                    linear-gradient(
                     rgba(35, 70, 105, 0.6),
                     rgba(3, 119, 252, 0.6)
                    ),
                    url("../images/breather-mini.jpg") no-repeat 0% 100%;
            background-size: cover;
            text-align: center;
        }

		div.container > h1.banner,
        div.container > div.row > h1.banner
        {
            font-size: 3.8em;
            line-height: 1.2em;
            margin-top: 1em;
      		color: #ddd;	
            padding-left: 15px;
            padding-right: 15px;
           
        
        }

        .content-2
        {
            height: 1600px;
            background:
                    linear-gradient(
                     rgba(220, 159, 9, 0.6),
                     rgba(220, 159, 9, 0.6)
                    ),
                    url("../images/aaron-burden.jpg") no-repeat 0% 100%;
            background-size: cover;
            text-align: center;
            padding: 20px;
        }


        .content-2 h4
        {
            font-size: 4em;
            color: #ddd;
        }
        
         div.content-2 > div.container > div.row > div.col-lg-4 > h4 > a
		{
			
			color: #ddd;
			text-decoration: none;
		
		}  
    
        
        .content-3
    {
        height: 868px;
        background:
                linear-gradient(
                 rgba(0, 0, 0, 1),
                 rgba(0, 0, 0, 1)
                ),
                url("") no-repeat 0% 100% fixed;
        background-size: cover;
        text-align: left;
        padding: 20px;
    }
    
    div.content-3 > div.container > div.row > div.col-md-4 > ul
    {
        list-style: none;
        margin-top: 40px;
        margin-right: 10px;
    }
        
     div.content-3 > div.container > div.row > div.col-md-3 > ul    
    {
        list-style: none;
        margin-top: 40px;
        margin-right: 80px;
    }


    div.content-3 > div.container > div.row > div.col-md-3 > ul > li,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li
    {
        line-height: 2em;
        font-size: 16px;
    }

        div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a.f_links,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > div
        {
            color: #fff;
        }

            div.content-3 > div.container > div.row > div.col-md-3 > ul > li > a:hover,
        div.content-3 > div.container > div.row > div.col-md-4 > ul > li > a:hover
            {
                color: #A5801B;
                text-decoration: none;
            }
    
    
div.col-md-4 > ul > li > h2,
div.col-md-4 > ul > li > h1,
div.col-md-3 > ul > li > h1
{
    color: #808080;
    width: 100%;
}

        
        div.container > div.row > div.col-md-8 > h2.banner
        {
                font-size: 3em;
                line-height: 1.4em;
                color: #565656;
                margin-top: 1.0em;
        }
        
        

    }