@charset "utf-8";
/* CSS Document */

#sp-logo { margin-top: 35px;}

#sp-header {    background-color: #1E4598;    color: #FFFFFF;    padding: 0px 10px 0px 35px;}

.secondary-menu>li, .sp-megamenu-parent>li {    padding-right: 20px!important;}
.secondary-menu>li.active>a, .secondary-menu>li:hover>a, .sp-megamenu-parent>li.active>a, .sp-megamenu-parent>li:hover>a {    color: #FFF !important;}

#sp-header {  height: 70px;  left: 0;  position: relative;  top: 0;  width: 100%;  z-index: 99;  box-shadow: 0 0 0px 0 rgba(0, 0, 0, 0.10);  border-top: 0px solid rgba(0, 0, 0, 0.10);}

.view-article #sp-main-body .container { width: 80%;  max-width: 80%; padding: 0; margin-top: 100px;   /*margin: 0 auto;*/}
.view-article .article-details .blog-details-img-wrapper .article-header h1, .view-article .article-details .blog-details-img-wrapper .article-header h2 { font-size: 22px; /*max-width: 50%;*/ margin: 0 auto;}
.view-article .article-details .blog-details-img-wrapper .article-header { padding: 0 30px;   text-align: left;    color: #000;}

#sp-main-body {padding: 25px 25px 0px 20px!important;}

/*this is styling on mobile phone and tablets with this display*/
@media (min-width: 320px) and (max-width: 480px) { 
.view-article #sp-main-body .container { width: 90%;  max-width: 90%; padding: 0; margin-top: 20px;   /*margin: 0 auto;*/}}

@media (min-width: 768px) and (max-width: 979px) {
.view-article #sp-main-body .container { width: 90%;  max-width: 90%; padding: 0; margin-top: 20px;   /*margin: 0 auto;*/}}


#sp-bottom .sp-module .sp-module-title {font-weight: 700; font-size: 18px; margin: 0 0 10px; }
#sp-bottom .sp-module .menu { padding-top: 0px; text-align: left; font-size: 14px; font-weight: 400; line-height: 16px;    text-transform: uppercase;}