@charset "UTF-8";
body{
background: #FDFDFE;
margin-bottom: 5px;
font-size: 100%;
}
#mainwrapper h1, h2, h3, h4 {
color: #336699;
}

#mainwrapper {
    /* Container of all content */
    width: 94%;
    max-width: 1000px;
    overflow: auto;
    margin: 0 auto;
    padding-left: 1%;
    background: #FDFDFE;
    color: #222222;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1em;
    }
#mainwrapper header {
	/*Header */
	background-color: #FDFDFE;
	overflow: auto;
	font-family: montserrat, sans-serif;
	font-style: normal;
	font-weight: 400;
    border-top: solid 2px #336699;
    border-bottom: solid 2px #336699;
}
#mainwrapper header #logo {
	/* Company Logo text */
	width: 30%;
	float: left;
	padding-left: 0%;
	padding-top: 0px;
	padding-bottom: 0px;
	color: #FDFDFE;  /*hide in background for now*/
}
#mainwrapper header #image-header {
	/* header logo image */
    max-width: 100%;
    height: auto;
    padding-right: 0%;
    padding-bottom: 1%;
    padding-top:1%;
    margin-right:0%;
	float: left;
	padding-left: 0%;
	}
    
.img-responsive {
    width: 100%;
    max-width:100%;
    height: auto;
    }

#mainwrapper header nav {
	/*Nav bar containing links in header */
	text-align: right;
	padding-top: 12px;
	padding-bottom: 12px;
	padding-right: 1%;
	width: 70%;
	float: left;
	color: #336699;
}
header nav a {
	/* Links in header */
	padding-right: 2%;
}
.image.left, .image.right {
        max-width: 45%;
        width: 100%;
        caption: bottom;
        }
.image-right200 {
        float: right;
        max-width: 200px;
        width: 100%;
        padding: 0 0 1em 1.5em;
        top: 0.25em;
        caption: bottom;
        }    

.image.left img, .image.right img {
        width: 100%;
        max-width: 100%;
        height: auto;
        }

.image.round img {
        border-radius: 100%;
		}

.image.left {
        float: left;
        padding: 0 1.5em 1em 0;
        top: 0.25em;
		}

.image.right {
        float: right;
        padding: 0 0 1em 1.5em;
        top: 0.25em;
		}

.image.fit {
    display: block;
    margin: 0 0 0 0;
    width: 100%;
    max-width: 100%;
    height: auto;
    }

.image.fit img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%;
    }
    
.image.center450 {
    display: block;
    max-width: 450px;
    margin-left: auto;
    margin-right: auto;
   }
        
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  height: auto;
  width: 95%;
    }

.image.fit img {
    max-width: 98%;
	}

.caption {
    color: #336699;
    font-size: 0.90em;
    font-style: italic;
    }

.caption-cntr{
color: #336699;
text-align: center;
font-size: 0.85em;
font-style: italic;
}

p.caption {
color:#336699;
}

.promotional {
color: #336699;
font-size: 1.0em;
font-weight: 500;
}

#content p{
    color: #2A2A2A;
    font-weight: 400;
    font-family: arial, helvetica, sans-serif;
    font-style: normal;
    font-size: 1.0em;
    }
#content #mainContent h1, #content #mainContent h2 {
    /* Styling for main headings */
    color: #336699;
    font-family: Arial, Helvetica, sans-serif;
    font-style: normal;
    font-weight: 600;
}
#mainContent {
	/* Container for the blog post in individal blog view */
	padding-left: 0%;
	width: 60%;
    float: left;
	padding-right: 2%;
	padding-top: 10px;
}
#content #mainContent h3 {
    /*Captions ot Taglines */
    font-family: arial, helvetica, sans-serif;
    font-style: normal;
    font-weight: 600;
    color: #336699;
    font-size: 1.5em;
}
#content #mainContent h4 {
    /*Captions ot Taglines */
    font-family: arial, helvetica, sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 1.0em;
    }
#content #mainContent #bannerImage {
	/*Container for main banner image */
	width: 100%;
	background-color: #FDFDFE;
}
#content #mainContent p {
    /* All paragraphs under maincontent */
    color: #2A2A2A;
    font-family: arial, helvetica, sans-serif;
    font-style: normal;
    font-weight: 400;
}
#content #mainContent #insert {
	/* inserted comment - could be about author */
	background-color: #E9FFE9;
}
#content #mainContent #insert h2 {
	color: #336699;
	padding-left: 2%;
	padding-top: 2%;
}
#content #mainContent #insert p {
    color: #2A2A2A;
    padding-left: 2%;
    padding-top: 0%;
    padding-bottom: 2%;
    padding-right: 2%;
    font-weight: 400;
    font-family: arial, helvetica, sans-serif;
}
footer article {
	/* Footer articles */
	width: 46%;
	float: left;
	padding-left: 2%;
	padding-right: 2%;
	text-align: justify;
	font-family: arial, helvetica, sans-serif;
	font-style: normal;
	font-weight: 400;
	color: #2A2A2A;
}
footer article h3 {
	/* Footer article titles */
	text-align: center;
	font-family: montserrat, sans-serif;
    color: #336699;
	font-style: normal;
	font-weight: 500;
}
#mainwrapper #content #sidebar {
	/* Sidebar*/
	width: 30%;
	padding-left: 2%;
	padding-right: 2%;
	float: left;
	background-color: #FDFDFE;
	margin-top: 10px;
	padding-top: 20px;
}

#content #sidebar input {
	/* Search box in sidebar */
	width: 98%;
	height: 32px;
}
#mainwrapper #content #othersidebar {
/* Additional Sidebars*/
width: 30%;
padding-left: 2%;
padding-right: 2%;
float: left;
background-color: #FDFDFE;
margin-top: 0px;
padding-top: 0px;
padding-bottom: 5px;
}

#content #sidebar #adimage {
	/* Container for Image in sidebar */
	width: 90%;
	background-color: #FDFDFE;
	margin-top: 0px;
	float: none;
	overflow: auto;
    }

#adimage{
    display: block;
    width: 100%;
    max-width: 200px;
    height: auto;
    }  
    
#content #sidebar #adimage2 {
	/* Container for other Images in sidebar */
	width:  100%;
	background-color: #FDFDFE;
	padding-bottom: 5px;
    padding-top: 5px;
	float: none;
	overflow: auto;
}

#adimage2 {
/* container for other images in other sidebars */
    max-width: 100%;
    background-color: #C0BEBE;
    margin-top: 5px;
    float: none;
    overflow: auto;
    }   

nav ul li {
	list-style-type: none;
	padding-top: 5px;
	padding-bottom: 5px;
}
nav ul {
    padding-left: 0%;
    color: #336699;
    font-weight: 400;
    line-height: 2em;
}
nav ul li a {
	color: #333399;
	text-decoration: none;
}
footer {
	/* Container for footer artices */
	width: 71%;
	padding-left: 2%;
	padding-right: 2%;
}

.notOnDesktop {
	/*element to be displayed only in mobile view and tabet view */
	display: none;
}
#mainContent #bannerImage img {
	/* Actual banner image */
	width: 100%;
}
#sidebar #adimage img {
	/* Image in sidebar */
	width: 100%;
	float: none;
}
#othersidebar #adimage img {
	/* Image in sidebar */
	width: 100%;
	float: none;
}
#mainwrapper header nav a {
	/* Links in header */
	color: #336699;
	text-decoration: none;
}
#footerbar {
	/* Footer bar at the bottom of the page */
	clear: both;
	background-color: #FFFFCC;
    max-width: 71%;
	width: 100%;
    color: #1A344F;
    padding: 0.1% 1% .2% 1%;
     border-top: solid 2px #336699;
    border-bottom: solid 2px #336699;
}



/*  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* IN BETWEEN 950px  VIEW IN BETWEEN VIEW  950px IN BETWEEN VIEW 950px IN BETWEEN  VIEW   */

@media screen and (max-width: 950px) {

.image.left, .image.right {
			max-width: 50%;
            caption: bottom;
            }    

.image.left img, .image.right img {
        width: 100%;
}

.image.fit {
        display: block;
        margin: 0 0 0 0;
        width: 100%;
		}

.image.fit img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 95%;
        }
#adimage{
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 200px;
    height: auto;
    }
        
}

/*  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/*  END IN BETWEEN  VIEW    END IN BETWEEN VIEW       END IN BETWEEN VIEW       END IN BETWEEN  VIEW   */





/*  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */
/*  769px           769px     769px      769px            769px        */
/*  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++  */
/* TABLET VIEW  TABLET VIEW  TABLET VIEW */

@media screen and (max-width:769px) {
.notOnDesktop {
	/* Search box shown only in mobile view and Tablet view */
	display: none;
	text-align: right;
	padding-right: 8px;
	padding-top: 8px;
	padding-bottom: 8px;
	width: 96%;
}  
#content .notOnDesktop input {
	height: 28px;
} 
#mainContent {
	/* Container for the blog post */
	padding-top: 0px;
	float: none;
	width: 96%;
}
#sidebar input {
	/* Search box in sidebar */
	display: none;
}
#mainwrapper #content #sidebar {
	/* Sidebar*/
	float: none;
	width: 90%;
	padding-top: 3%;
	overflow: auto;
    margin: 0 auto;
	/*margin-top: 3px;
	margin-left: 2%;*/
	padding-bottom: 2%;
    align-content: center;
}
#mainwrapper #content #othersidebar {
	/* Othersidebar*/
    float: none;
	width: 90%;
	padding-top: 3%;
	overflow: auto;
    margin: 0 auto:
	/*margin-top: 3px;
	margin-left: 2%;*/
	align-content: center;
	padding-bottom: 2%;
}
.image-right200 {
        float: right;
        max-width: 100%;
        width: 100%;
        padding: 0 0 1em 1.5em;
        top: 0.25em;
        caption: bottom;
        }    
.image.left, .image.right {
            width: auto;
			max-width: 250px;
            height: auto;
            caption: bottom;
            }    

.image.left img, .image.right img {
        width: 100%;
        max-width: 250px;
        height: auto;
}
.image.fit {
        display: block;
        margin: 0 0 0 0;
        width: 100%;
        max-width: 100%;
        height: auto;
		}

.image.fit img {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
		}

#content #sidebar #adimage {
	/* Image in sidebar */
    width: 50%;
    margin: auto}
    
#adimage{
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    max-width: 200px;
    height: auto;
    }
    
#content #othersidebar #adimage {
	/* Image in sidebar */
	width: 100%;
    margin: auto;
    }
#content #sidebar nav {
	/* Navigation links in sidebar */
	width: 100%;
	float: none;
	padding-left: 0%;
    align-content: center;
}
#content #othersidebar nav {
	/* Navigation links in sidebar */
	width: 100%;
	float: none;
	padding-left: 0%;
    align-content: center;
}
#sidebar nav ul {
	margin-top: 0px;
}
#othersidebar nav ul {
	margin-top: 0px;
}
#sidebar nav ul li {
	display: inline-block;
	width: 100%;
	text-align: center;
}

#othersidebar nav ul li {
	display: inline-block;
	width: 100%;
	text-align: center;
}
footer {
	/* Footer region */
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;
}
#content footer article {
	/*Each footer article */
	width: 46%;
}
#mainwrapper header {
	/* Header */
	width: 100%;
}
#mainwrapper #footerbar {
max-width: 98%;
}
#mainwrapper #footerbar p {
font-size: .9em;
}
}


/*  ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* END TABLET VIEW    END TABLET VIEW    END TABLET  VIEW   */
/*  480px            480px          480px           480px      480px  */
/*  +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* MOBILE  VIEW    MOBILE   VIEW       MOBILE VIEW   MOBILE  VIEW   */

@media screen and (max-width:480px) {
#mainwrapper header #logo {
	/* Company Logo text in header */
	width: 96%;
	margin-left: 2%;
}
#mainwrapper header nav {
	/*navigation links in header */
	text-align: center;
	background-color: #FDFDFE;
	width: 98%;
}
.image-right200 {
        float: right;
        max-width: 100%;
       /* width: 100%; */
        padding: 0 0 1em 1.5em;
        top: 0.25em;
        caption: bottom;
        }    
.image.left, .image.right {
            display: block;
			max-width: 85%;
            caption: bottom;
            float: none;
            margin: auto;
            } 
/*.image.right {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    }*/

.center {
        width:auto;
        }
.center {
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 70%;
    width: 100%;
    }


.image.left img, .image.right img {
        width: 100%;
} 

#content #sidebar #adimage {
	/* Container for image in sidebar */
	width: 100%;
}

#content #othersidebar #adimage {
	/* Container for image in sidebar */
	width: 100%;
}

#content #othersidebar #adimage2 {
	/* Container for image in sidebar */
	width: 100%;
}

#content #sidebar nav {
	/* Navigation bar for links in sidebar */
	width: 96%;
	padding-top: 7px;
}

#content #othersidebar nav {
	/* Navigation bar for links in sidebar */
	width: 96%;
	padding-top: 7px;
}

#sidebar nav ul li {
	display: inline-block;
	width: 100%;
	text-align: center;
}

#othersidebar nav ul li {
	display: inline-block;
	width: 100%;
	text-align: center;
}
#mainwrapper #content #sidebar {
	/* sidebar */
	padding-bottom: 0px;
}

#mainwrapper #content #othersidebar {
	/* sidebar */
	padding-bottom: 0px;
}
#content .notOnDesktop {
	/* Search box shown only in mobile and tablet view */
	width: 100%;
	text-align: center;
	padding-left: 0px;
	padding-right: 0px;
}
#content .notOnDesktop input {
	width: 80%;
	text-align: center;
}
/*  added by dew  */
#content #mainContent h1, h2 {
	/* Title under maincontent, if any */
	font-size: 1.1em;
}

#content #mainContent h3 {
	/* Title under maincontent, if any */
	font-size: 1.0em;
}
#content footer article {
	/* Each foter article */
	width: 96%;
}
#mainwrapper #footerbar {
max-width: 98%;
}
#mainwrapper #footerbar p {
font-size: .9em;
}

}
