
body {
    background: #fff;
}
.disp-n, .breadcrumb {
    display: none;
}
div#scroll.container {
    max-width: none;
}
.comBnrTxt{
	background: none;
}
.container.sec-pTB{
	padding: 0px;
}
.whitebg {
    background: #fff;
}
.blackbg {
    background: #000;
}
.aboutus-main-sec .abt-left, .aboutus-main-sec .abt-right {
    padding: 0;
}
.p10 {
    padding: 10px;
}
.p30 {
    padding: 30px;
}
.pt80 {
    padding-top: 80px;
}
.pb10{
	padding-bottom: 10px !important;
}
.pb40{
	padding-bottom: 40px;
}
.m0{
	margin: 0;
}
.logo-guide .container.pt0{
	padding-top: 0px;
}
.logo-guide .container.pb0{
	padding-bottom: 0px;
}
.logo-guide h2.pl0{
	padding-left: 0px;
}
.tc {
    text-align: center;
}
.disp-flx {
    display: flex;
}
.bg-color{
	background: #052A64;
	color: #fff;
}
.box-sep {
    width: 32%;
    padding: 10px 10px 0 0;
    vertical-align: top;
}
.box-dont {
    background: #FFEEED;
}
.logo-do {
    background: #f7f7f7;
    border-radius: 4px;
}
.fire-red, .spanish-green, .spanish-blue, .cyber-yellow, .simpsons-yellow, .mondrian-blue {
    width: 100%;
    height: 115px;
    display: inline-block;
}
.fire-red {
    background: #C82332;
}
.spanish-green {
    background: #00A05A;
}
.spanish-blue {
    background: #0078C8;
}
.cyber-yellow {
    background: #FAAA1E;
}
.simpsons-yellow {
	background: #FFD70F;
}
.mondrian-blue {
	background: #144B87;
}
.backcol-title {
	
}
.color-box {
    padding: 20px 20px 0 0;
}
.logo-guide h1 {
    font-size: 48px;
	font-family: 'Zoho_Puvi_SemiBold';
}
.logo-guide h2 {
    font-size: 28px;
	font-family: 'Zoho_Puvi_SemiBold';
	margin: 0px;
	padding-left: 7px;
	    color: #000;
}
.logo-guide p {
    font-size: 14px;
    line-height: 24px;
}
.toplogo, .botmlogo {
    width: 358px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.toplogo img, .botmlogo img {
    width: 70%;
}
.logo-guide .abt-left, .logo-guide .abt-right {
    width: 50%;
}
.logo-guide .abt-right {
    display: grid;
    justify-content: center;
}
.logo-guide .aboutus-main-sec {
    padding: 2% 0;
}
.logo-guide .container {
    padding:6% 0;
}
.logo-guide-spr {
    background-image: url(/images/logo-guide-sprite.svg);
    background-repeat: no-repeat;
    display: inline-block;
}
.w-logo1 {
    background-position: -9px -3px;
    width: 230px;
    height: 43px;
}
.b-logo1 {
    background-position: -270px -2px;
    width: 230px;
    height: 43px;
}
.b-logo2, .w-logo2, .b-logo3, .proprotion-logo, .outline-logo, .space-logo, .bg-logo, .font-logo {
    width: 157px;
    height: 40px;
}
.b-logo2 {
    background-position: -527px -9px;
}
.w-logo2 {
    background-position: -705px -9px;
}
.b-logo3 {
    background-position: -9px -65px;
}
.proprotion-logo {
    background-position: -200px -60px;
    width: 170px;
}
.outline-logo {
    background-position: -396px -70px;
}
.space-logo {
    background-position: -579px -67px;
    width: 170px;
}
.bg-logo {
    background: url('/images/bg-logo.png');
    background-repeat: no-repeat;
    width: 310px;
    height: 152px;
}
.typespace-logo {
    width: 460px;
    height: auto;
}
.endpoint-logo {
    background-position: -4px -212px;
    width: 247px;
    height: 65px;
}
.firewall-logo {
    background-position: -285px -212px;
    width: 247px;
    height: 65px;
}
.asset-logo {
    background-position: -4px -283px;
    width: 247px;
    height: 65px;
}
.ad3-logo {
    background-position: -233px -283px;
    width: 247px;
    height: 65px;
}
.divi-w-logo {
    width: 100%;
	height: 111px;
	display: contents;
}
.light-logo {
    width: 100%;
    height: 111px;
	display:contents;
}
.waring-icon {
    background-position: -966px -13px;
    width: 23px;
    height: 20px;
}
.dwn-arrow {
    background-position: -937px -13px;
    width: 20px;
    height: 20px;
    vertical-align: sub;
}
.shadow-logo {
    background-position: -575px -67px;
    width: 175px;
    height: 40px;
}
.logo-guide-spr.shadow-logo:after {
    box-shadow: 1px 6px 5px -3px #e6e3e3;
    content: '';
    display: block;
    position: relative;
    top: -15px;
    left: 0px;
    width: 93%;
    height: 100%;
}
.theme-w-logo {
    width: 100%;
	height: 111px;
	display: contents;
}
.dark-logo {
    width: 100%;
	display: contents;
	height: 111px;
}
.swrils{
    background-position: -785px -60px;
    width: 55px;
    height: 40px;
}
.font-logo{
background-position: -423px -134px;
}

.logo-center {
    display: flex;
    justify-content: center;
    align-items: center;
}
.logo-height {
    padding: 55px;
    border: 1px solid #e9e9e9;
}
.logo-height img {
    height: 40px;
}
.logo-height.full-img {
    padding: 0;
    height: 152px;
}
.logo-height.para-img {
    padding: 10px;
    height: 130px;
}
.logo-height.para-img img {
    height: auto;
    width: 70%;
}
.logo-height.full-img img {
    height: auto;
    width: 100%;
    object-fit: cover;
}
#sample-logo .logo-centers img {
    height:56px;
}
#sample-logo .list-box li {
    padding: 60px;
}
.clr-code {
    vertical-align: top;
    display: inline-block;
    color: #000;
    width: 100%;
}
.clr-code h5 {
    font-size: 18px;
    font-weight: 600;
    color: #000;
	padding:0px 0px 30px;
	font-family:'Zoho_Puvi_SemiBold';
	padding-top: 10px;
}
.clr-code div{
	padding: 10px 0px;
	    border-bottom: 1px solid #e0e0e0;
}
.clr-code div:last-child{
	border: none;
}
.clr-code div span:nth-child(1){
	display: inline-block;
}
.logo-guide hr {
	border:0;
    border-bottom: 1px solid #d5d5d5;
}
.copyhex {
    float: right;
    color: #0066AA;
    cursor: pointer;
}
.pr-logo li {
    padding: 70px;
    background: #fff;
    width: 35%;
	box-shadow: 0 0 10px rgb(0 0 0 / 18%);
}
.theme-select #ThemeSelect {
  position: relative;
}
.theme-select .select-arw::after {
  content: "▼";
  font-size: 9px;
  top: -1px;
  right: 22px;
  position:relative;
}
/* Tab Style */
.logo-stage {
    padding: 20px 0;
}
.logo-stage .logo-nav {
    background: #E7E8E9;
    text-align: center;
    border-radius: 4px 4px 0 0;
}
.logo-stage .logo-nav a {
    display: inline-block;
}
.logo-stage .logo-nav a {
    padding: 10px 15px;
    color: #444 !important;
}
.logo-stage .logo-nav a.logo-active {
    background: #fff;
    border-top: 2px solid #0E78B9;
    padding: 10px 15px;
    color: #444 !important;
    text-decoration: none;
}
#scroll a.logo-btn {
    background: #0E78B9;
    padding: 10px 15px;
    border: 1px solid transparent;
    border-radius: 2px;
    color: #fff;
    text-decoration: none
}
.logo-btn:hover {
    background: #1a6da0;
}
.theme-cont-sec {
    border-radius: 0px 0px 4px 4px;
}
.theme-select {
    text-align: right;
    padding: 10px;
}
.themecolor-dark {
    color: #000;
}
.themecolor-light {
    color: #fff;
}
.theme-border {
    border: 1px solid #e0e0e0;
}
.theme-select select {
    padding: 5px 28px 5px 10px;
    background: #ccc;
    margin-left: 10px;
  -webkit-appearance: none;
  appearance: none;
}
.logo-guide .sec-pTB {
    padding-bottom: 0px;
}
.copyright {
    color: #fff;
}
#scroll .logo-stage .logo-nav a {
    text-decoration: none;
}
#scroll ul.list-box {
    width: 100%;
    padding: 0;
    margin: 0;
}
.list-box li {
    list-style: none;
    width: 31.33%;
    display: inline-block;
    margin: 25px 10px 0;
    vertical-align: top;
}
.bgccc {
    background: #edeff0;
	font-weight: bold;
}
.bgf1 {
    background: #fff1f1;
    position: relative;
    min-height: 48px;
    display: flex;
}
.list-box li.color-box {
        width: calc(50% - 40px);
    background: #fff;
    display: inline-block;
    float: none;
    padding:15px;
	margin: 10px 4px;
	box-sizing: border-box;
}
.list-box li.color-box *
{
	box-sizing: border-box;
}
.color-box > span {
    display: inline-block;
       width: 22%;
    height: 185px;
}
.color-box .clr-code {
    width: 77%;
    display: inline-block;
    padding-left: 15px;
}
.sub-text {
    left: 7px;
    position: relative;
    text-align: left;
	font-weight: bold;
}
.lgo-fix{
	padding-bottom: 50px;
}
.theme-cont-sec img {
    width: 400px;
}
/* ------  Resposive style ------  */
@media only screen and (max-width: 1200px) {
.container {
    width: 100%;
    padding: 0;
}
/*
.logo-guide .abt-left, .logo-guide .abt-right, .list-box li.color-box {
    width: 45%;
}
*/
.list-box li {
    width: 48%;
    margin: 25px 5px 0;
}
.pr-logo li {
    width: 35%;
    padding: 38px;
}
.p2 {
    padding: 0 5%;
}
}

@media only screen and (max-width: 1025px) {.container{width:100%;}}
@media only screen and (max-width: 1000px) {
.list-box li.color-box {
    width: 45%;
}
.list-box li {
    width: 48%;
}
.pr-logo li {
    width: 32%;
}
.toplogo, .botmlogo {
    width: 280px;
}
.list-box li.color-box {
    padding: 20px 5px;
}
#btmscroll {
    padding: 10px;
}
	.logo-guide h1{font-size: 32px;}
	.lgo-fix {
    padding-bottom: 20px;
}
	.color-box > span {
    width: 100%;
    height: 100px;
}
	#sample-logo .list-box li {
    padding: 32px;
}
}

@media only screen and (max-width: 650px) {
.logo-guide .abt-left, .logo-guide .abt-right, .list-box li.color-box {
    width: 100%;
}
.disp-flx {
    display: block;
}
.list-box li {
    width: 100%;
}
.pr-logo li {
    width: 75%;
    padding: 38px;
}
.p2 {
    padding: 0 5%;
}
	.logo-guide h1 {
		font-size:26px;
	}
	div#scroll {
    width: 100%;
}
}

@media only screen and (max-width: 430px) {
.disp-flx {
    display: block;
}
.list-box li {
    width: 95%;
}
.pr-logo li {
    width: 75%;
    padding: 38px;
}
.fire-red, .spanish-green, .spanish-blue, .cyber-yellow {
    width: 100%;
}
#scroll a.logo-btn {
    padding: 8px;
    font-size: 12px;
}
.theme-w-logo, .dark-logo{
    height: 75px;
    background-size: 280%;
}
	.divi-w-logo, .light-logo {
		height: 92px;
    	background-size: 255%;
	}
	.dark-logo{
		background-position: -31px -461px;
	}
	.light-logo {
    background-position: -435px -333px;
	}
	.divi-w-logo{
		background-position:-447px -231px;
	}
.bgf1 {
    min-height: auto;
}
	.logo-guide h1 {
    font-size: 24px;
}
}

@media only screen and (max-width: 395px) {
	.logo-stage .logo-nav a.logo-active{
		padding: 3px 9px;
		font-size: 12px;
	}
	.logo-stage .logo-nav a{
		padding: 4px 6px;
    	font-size: 12px;
	}
	#scroll a.logo-btn{
		font-size: 10px;
	}
	.logo-guide h1 {
    	font-size: 24px;
	}
}
	@media only screen and (max-width: 380px) {
		#scroll a.logo-btn{
			padding: 4px;
		}
		.divi-w-logo{
			background-position:-399px -204px;
		}
		.theme-w-logo{
			background-position: 0px -63px;
		}
		.logo-guide h1 {
    		font-size: 24px;
		}
	}
	@media only screen and (max-width: 365px) {
		.divi-w-logo, .light-logo {
    		height: 80px;
    		background-size: 240%;
		}
		.divi-w-logo{
			background-position:-357px -186px;
		}
		.theme-w-logo{
			background-position: 0px -65px;
		}
		.logo-guide h1 {
    		font-size: 24px;
		}
	}