﻿/*--- right hand column code january 2019 change --*/
.home header {background:#329cd2;}
.demos header {background:#e23b2d;}
.menus header {background:#ea851d;}
.opacity header {background:#9e6ba9;}
.explorer header {background:#8b37aa;}
.mozilla header {background:#1672bb;}
.layouts header {background:#ffc20f;}
.boxes header {background:#7cb447;}


.opacity header h1 span {color:#9e6ba9;}
.explorer header h1 span {color:#8b37aa;}
.mozilla header h1 span {color:#1672bb;}
.layouts header h1 span {color:#ffc20f;}
.demos header h1 span {color:#e23b2d;}
.boxes header h1 span {color:#7cb447;}
.menus header h1 span {color:#ea851d;}

#wrapper {text-align:center; }
#tutorial {padding-top:160px; padding-bottom:30px; border:1px solid #000;}

/*--- January 2019 changes ---*/
#info {max-width:55%; width:100%; padding:0 10px 20px 10px; display:inline-block; vertical-align:top; text-align:left; border:2px solid #ff0000;}

/*--- End January ---*/

#info .list_left ul { list-style:none; max-width:350px; width:99%; padding:0; margin:0 5px 0 10px ;text-align:left; float:left; }
#info .list_left ul li {padding:0; margin:2px 0 0 10px; font:normal 14px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; }
#info .list_left p {font:normal 14px/16px 'allerregular', arial, sans-serif; padding:20px 0 4px 20px; margin:0; text-align:left;}


.input {max-width:90%; width:100%; padding:5px; margin:2px 0 2px 0; border-radius:5px; background:#ccc; font:1.1em 'allerbold', arial, sans-serif; color:#000;}
.input p {padding:5px; margin:0; text-align:left;}

.selects {max-width:95%; width:100%; padding:5px; margin:2px 0 2px 0; border-radius:5px; background:#ccc; font:1.1em 'allerbold', arial, sans-serif; color:#000;}
.selects p {padding:5px; margin:0; text-align:left;}

.price_low {max-width:42.2%; width:100%; padding:5px; margin:2px 3px 2px 0; border-radius:5px; background:#ccc; font:1.1em 'allerbold', arial, sans-serif; color:#000; float:left;}
.price_low p {padding:5px; margin:0; text-align:left; font:1.1em 'allerbold', arial, sans-serif; color:#000;}

.bed_bath {max-width:46.8%; width:100%; padding:5px; margin:2px 0 2px 0; border-radius:5px; background:#ccc; font:1.1em 'allerbold', arial, sans-serif; color:#000;}
.bed_bath p {padding:5px; margin:0; text-align:left; }

.propsubmit{max-width:95.4%; width:100%; height:34px; padding:5px; margin:2px 0 2px 0; border-radius:5px; background:#ccc; font:1.1em 'allerbold', arial, sans-serif; color:#000;}
.propsubmit p {padding:5px; margin:0; text-align:left; font:1.1em 'allerbold', arial, sans-serif; color:#000;}

.footer {text-align:center;}
.footer p {padding:5px 0; margin:0; font:1em 'allerregular', arial, sans-serif; color:#333; line-height:2em;}

ul.main {padding:0; margin:0; list-style:none; position:absolute; top:80px; left:0; width:100%; min-height:30px; background:#000; text-align:center; z-index:100002; box-shadow:0 3px 6px rgba(0,0,0,0.3); backface-visibility: hidden;}
ul.main li {display:inline-block;}
ul.main li {*display:inline;}
ul.main li.break {display:block; display:none;}
ul.main li a {display:block; font:normal 15px/26px 'allerregular', arial, sans-serif; color:#fff; text-decoration:none; padding:0 6px; border-bottom:4px solid #000;}
.home ul.main li#home a {border-color:#09c;}
.demos ul.main li#demos a {border-color:#e23b2d;}
.menus ul.main li#menus a {border-color:#ea851d;}
.layouts ul.main li#layouts a {border-color:#ffc20f;}
.boxes ul.main li#boxes a {border-color:#7cb447;}
.mozilla ul.main li#mozilla a {border-color:#1672bb;}
.explorer ul.main li#explorer a {border-color:#8b37aa;}
.opacity ul.main li#opacity a {border-color:#9e6ba9;}

ul.main li a:hover {border-color:#888;}
ul.sub {padding:0; margin:0 0 30px 0; list-style:none; width:100%; min-height:1em; background:#000; text-align:center;}
ul.sub li {display:inline-block;}
/*ul.sub li {*display:inline;}*/
ul.sub li a {font:0.9em 'allerregular', arial, sans-serif; color:#fff; text-decoration:none; padding:0 8px; line-height:3em;}
ul.sub li a:hover {color:#c00; text-decoration:none;}
.design .sub li#design a,
.faqs .sub li#faqs a,
.contact .sub li#contact a,
.privacy .sub li#privacy a,
.support .sub li#support a {color:#6cf;}

#cse-search-box input.search {padding:10px; height:19px; border:0; border-radius:5px 0 0 5px; width:150px; float:left; font:normal 15px/18px 'allerregular', arial, sans-serif;}
.cse-branding-right {text-align:center;}

.cse-search {width:50px; height:39px; border:0; background:#9cb928 url(/new-images/search-icon.png) no-repeat center center; border-radius:0 5px 5px 0; float:left; cursor:pointer;}
.cse-search:hover {background-color:#c00;}
.cse-branding-logo {clear:left; padding-top:10px;}

.demoNav {height:40px; margin:20px auto; text-align:center;}
.prevDemo {font:normal 16px/40px 'allerregular', arial, sans-serif; color:#c00; text-decoration:none; display:inline-block; padding:0 0 0 20px; width:120px; text-align:left; background:url(/new-images/previous.gif) no-repeat left center;}
.prevDemo {*display:inline;}
.nextDemo {font:normal 16px/40px 'allerregular', arial, sans-serif; color:#c00; text-decoration:none; display:inline-block; padding:0 20px 0 0; width:120px; text-align:right; background:url(/new-images/next.gif) no-repeat right center;}
.nextDemo {*display:inline;}

#info h3.smartphone {padding:0; margin:30px 0; font:normal 20px/25px 'allerregular', arial, sans-serif; color:#c00; display:none;}
.numberlist li {padding:2px 0; margin:0; font:normal 15px/18px 'allerregular', arial, sans-serif; color:#333;}

/* ._fancybar {margin-top:110px !important;} */
._fancybar {backface-visibility: hidden;}

pre {
font:normal 14px/18px 'allerregular', arial, sans-serif; color:#000;
border:0;
max-height: 400px;
overflow: auto;
padding: 5px;
width:100%;
width:calc(100% - 22px);
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
}

code {border:0; font:normal 14px/18px 'allerregular', arial, sans-serif; letter-spacing:1px;}
.adslot_1 {display:block; width: 728px; height: 90px; margin:0;}
.g-plusone {padding:10px; margin:0 auto; max-width:300px; width:100%}


#info .list_left::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: right;
}

#info .list_right::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

#info .list_right ul { list-style:none; max-width:100%; width:99%; padding:0; margin:0 5px 0 10px ;text-align:left;}
#info .list_right ul li {padding:0; margin:0; font:normal 14px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; }

#info .details_list ul { list-style:none; max-width:740px; width:99%; padding:0 8px 0 0; margin:0 5px 0 5px ;text-align:left;}
#info .details_list ul li {padding:0; margin:0; font:normal 14px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; }
#info .details_list ul li img{padding-bottom:1px; margin:0;}
#info .details_list ul a:hover{ text-decoration:none; color:#9A1D23;}
#info .details_list ul a:link{ text-decoration:none; color:#000066;}

#info h2 {padding:0; margin:0; font:bold 20px/35px 'allerbold', arial, sans-serif; color:#000; text-align:center;}
#info h2 a {color:#c00; text-decoration:none;}

#info .head{max-width:750px; height:30px; padding:7px; margin:8px 0 0 0;/*display:inline-block; vertical-align:top;*/ text-align:center; background:#9A1D23; border-radius:8px;}

#info .head h2 {padding:2px; margin:0; font:normal 22px/30px 'allerbold', arial, sans-serif; color:#fff;}
#info .head h2 a {color:#c00; text-decoration:none;}

#info .box700{max-width:700px; width:99%; margin:0; padding:0; background:#CC9900; border:3px solid #000;}
#info .box700 img {max-width:700px; border:2px solid #ddd; border-radius:8px;}

/*--------------- PAYPAL -----------*/

#info .easy_border {max-width:95%; width:740px; border-radius:8px; margin:4px 20px 10px 0; padding:10px; border:3px solid #ccc;}
#info .easy_border .img {max-width:80%; width:200px; padding:0; margin:0 auto;}

#info .easy_border h3 {padding:0; margin:0 auto; font:bold 23px/35px 'allerbold', arial, sans-serif; color:#000; text-align:center;}
#info .easy_border h3 a {color:#c00; text-decoration:none;}
#info .easy_border p {padding:0 5px 0 6px; margin:0; font:normal 18px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; line-height:175%; }
#info .easy_select {padding:4px; margin:0; font:normal 16px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; border-radius:8px; background:#199EDB; }


#info .paypal_box {width:110px; height:auto; padding:40px; background:#ccc; border-radius:8px; margin:0 auto; border:1px solid #199EDB;}
#info .paypal_box td {padding:0 5px 0 6px; margin:0; font:normal 18px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; line-height:175%; }
#info .paypal_box td img { padding:0; margin:0 auto; width:120px; height:53px;}
#info .p_simple {padding:0 5px 0 6px; margin:0; font:normal 18px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none; line-height:175%; }

.box700::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

.bigpic::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

#info .bigpic {max-width:450px; width:99%; display:inline; padding:0; margin:0; border:2px solid #000; background:#fff;border-radius:8px;}
#info .bigpic img {max-width:450px; border:2px solid #ddd; border-radius:8px; margin:0; padding:10px;}

#info .bigpic ul {display:inline-block; list-style:none; padding:4px 0 0 8px;;margin:0; background:#fff;float:left;}
#info .bigpic ul {*display:inline;}
#info .bigpic li {width:90%; font:normal 18px/20px 'allerregular',arial, sans-serif;color:#666; padding:10px 5px 0 5px; padding:0; text-align:center; background:#fff;border-radius:5px 5px 5px 5px;}

.gallerypic {
	max-width:750px;
	width:100%; 
	display:block; 
	border-radius:8px; 	
}

.gallerypic h3 {
	padding:0; 
	margin:-20px -11px 10px -11px; 
	font:normal 18px/20px 'allerregular',arial, sans-serif; 
	color:#fff; 
	background:#666; 
	padding:5px 5px; 
	border-radius:5px 5px 0 0; 
	text-align:left; 
}

.gallerypic img {
	max-width:170px;
	width:100%; 
	margin:0 1px 5px 1px; 
	padding:3px 3px; 
	border-radius:5px; 
	/*border:3px solid #9A1D23; */
	background:#666; 
	/*float:left;*/
	
}

.gallerypic.p1 {
	background:#afcb93;
}
.gallerypic.p2 {
	background:#fbddbd;
}
.gallerypic.p3 {
	background:#fff;
}
.gallerypic.p4 {
	background:#9e6ba9;
}
.gallerypic.p5 {
	background:#d1edfb;
}


.smallpic::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

#info .smallpic {max-width:150px; width:99%; display:inline; padding:0; margin:0; border:2px solid #000; background:#fff;}
#info .smallpic img {max-width:150px; border:2px solid #ddd; border-radius:8px; margin:0; padding:10px;}

#info .smallpic ul {display:inline-block; list-style:none; padding:4px 0 0 8px;;margin:0; background:#fff;float:left;}
#info .smallpic ul {*display:inline;}
#info .smallpic li {width:90%; font:normal 18px/20px 'allerregular',arial, sans-serif;color:#666; padding:10px 5px 0 5px; padding:0; text-align:center; background:#fff;border-radius:5px 5px 5px 5px;}



#info .box150 {max-width:405px; width:99%; display:inline; padding:0; margin:0;}
#info .box150 img {max-width:380px; border-radius:8px; margin:0; padding:2px; }

#info .box150 ul {display:inline-block; list-style:none; padding:0; margin:0; background:#fff; float:left; border-radius:8px;}
#info .box150 ul {*display:inline;}

#info .box150 li {width:100%; font:normal 12px/20px 'allerregular',arial, sans-serif;color:#666; padding:0; margin:0; text-align:left; }
#info .box150 li a { text-decoration:none; color:#040707;}
#info .box150 li a:hover { text-decoration:none; color:#9a1d23;}

#info .box150_right{max-width:310px; width:99%; display:inline; padding:0; margin:0; border:2px solid #000; float:right; background:#fff; border-radius:8px;}
#info .box150_right p{padding:0 0 5px 5px; margin:2px 0 0 0; font:normal 12px/16px 'allerregular', arial, sans-serif; color:#040707; text-align:left;}
#info .box150_right p a { text-decoration:none; color:#040707;}
#info .box150_right p a:hover { text-decoration:underline; color:#9a1d23;}


#info .bigbox::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
#info .bigbox {max-width:730px; width:99%; height:90%; padding:5px; display:inline-block; vertical-align:top; text-align:left; background:#fff; border:2px solid #000; border-radius:8px; margin-top:5px; margin-right:3px; }
#info .bigbox .img { border-radius:8px; padding:0; margin:0 auto; max-width:100%; width:740px;}
#info .bigbox h2 {max-width:750px; width:100%; padding:0; margin:0; font:normal 14px/20px 'allerregular', arial, sans-serif; color:#fff; text-align:center; background:#9A1D23; border-radius:8px 8px 0 0;}
#info .bigbox h4 {padding:0; margin:2px 0 0 0; font:normal 12px/30px 'allerregular', arial, sans-serif; color:#2F4F4F; text-align:left;}
#info .bigbox h4 a{ text-decoration:none; color:#040707;}
#info .bigbox h4 a:hover{ text-decoration:none; color:#9a1d23;}

#info .bigbox3::after{ 
  content: "";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}
#info .bigbox3 {max-width:740px; width:99%; padding:5px; display:inline-block; vertical-align:top; text-align:left; background:#fff; border-radius:8px; margin-top:7px; margin-right:3px;}
#info .bigbox3 .img { border-radius:8px; padding:0; margin:0 auto; max-width:100%; width:740px;}
#info .bigbox3 h2 {padding:0; margin:2px 0 0 0; font:normal 22px/30px 'allerregular', arial, sans-serif; color:#000; text-align:center;}
#info .bigbox3 h4 {padding:0; margin:2px 0 0 0; font:normal 12px/30px 'allerregular', arial, sans-serif; color:#2F4F4F; text-align:left;}
#info .bigbox3 h4 a:hover{ text-decoration:none; color:#3E0C0E;}


#info .bigbox2 {width:750px; width:99%; height:580px; padding:5px; display:inline-block; vertical-align:top; background:#fff; border-radius:8px; border:2px solid #ccc; margin-top:7px;}
#info .bigbox2 .img { border-radius:8px; padding:0; margin:0 auto; max-width:100%; width:740px;}
#info .bigbox2 h2 {padding:0; margin:10px 0 0 0; font:normal 22px/30px 'allerregular', arial, sans-serif; color:#000; text-align:center;}
#info .bigbox2 h4 {padding:0; margin:10px 0 0 0; font:normal 22px/30px 'allerregular', arial, sans-serif; color:#2F4F4F; text-align:center;}
#info .bigbox2 p {padding:0; margin:10px 0 0 0; font:normal 18px/20px 'allerregular', arial, sans-serif; color:#040707; text-align:center;}


#info .box450{max-width:450px; display:inline; padding:15px 5px 5px 0; margin:0; border:2px solid #ccc;}
#info .box450 img {max-width:250px; border:2px solid #ddd; border-radius:8px;}

.demos #info h2 a {color:#e23b2d;}
.menus #info h2 a {color:#ea851d;}
.opacity #info h2 a {color:#9e6ba9;}
.explorer #info h2 a {color:#8b37aa;}
.mozilla #info h2 a {color:#1672bb;}
.layouts #info h2 a {color:#ffc20f;}
.boxes #info h2 a {color:#7cb447;}

#info h3 {padding:0 0 0 12px; margin:20px 0 0 0; font:bold 18px/30px 'allerregular', arial, sans-serif; color:#000;}
#info h3.information {color:#069;}
#info h3.code {color:#c66;}
#info h3.stylesheet {color:#399;}
#info h3.copyright {color:#375;}
#info h3.javascript {color:#069;}
#info h3.tandc {color:#c66;}

#info h4 {padding:0; margin:0; font:normal 20px/25px 'allerregular', arial, sans-serif; color:#000;}
#info h5 {padding:0; margin:0; font:normal 16px/20px 'allerregular', arial, sans-serif; color:#000;}
#info h5.date {color:#069;}

#info p {padding:5px 0 0 12px; margin:0; font:normal 14px/24px 'allerregular', arial, sans-serif; color:#333;}

#info p a.link,
#info p a.link:visited {color:#c00;}

#rightCol {width:310px; display:inline-block; vertical-align:top; text-align:center; padding:10px 10px 0 10px; border-radius:8px; border:1px solid #ddd; background:#eee; margin:0 auto; margin-top:7px;}
#rightCol {*display:inline;}
#rightCol h3 {padding:0; margin:0 -20px 10px -20px; font:normal 20px/25px 'allerregular', arial, sans-serif; color:#fff; background:#000; background:rgba(0,0,0,0.6); padding:10px 10px; border-radius:5px 5px 0 0; text-align:center;}
#rightCol h3 span {display:inline-block; background:#fff; color:#000; width:23px; text-align:center; margin:0 2px; font:normal 22px/25px 'allerbold', arial, sans-serif;}

#rightCol p { max-width:230px; width:99%; padding:5px 0; margin:0; font:normal 15px/18px 'allerregular', arial, sans-serif; color:#fff;}
#rightCol .box300 {max-width:270px; width:100%; /*width change here*/padding:0 20px 20px 20px; margin:10px 0; text-align:justify; border-radius:5px; display:inline-block;}
#rightCol .box300.col1 {background:#9A1D23;}
#rightCol .box300.col2 {background:#ea851d;}
#rightCol .box300.col3 {background:#babbbf;}
#rightCol .box300.col4 {background:#9e6ba9;}
#rightCol .box300.col5 {background:#329cd2;}

#rightCol .box300 {*display:inline;}
#rightCol .box300 ul {padding:0; margin:0; list-style:none;}
#rightCol .box300 ul li a {padding:0; margin:0; font:normal 14px/25px 'allerregular', arial, sans-serif; color:#000; text-decoration:none;}
#rightCol .box300.col5 ul li a,
#rightCol .box300.col5 ul li a:visited {color:#fff;} 

#rightCol .cse-branding-logo {max-width:300px; width:100%; padding:0; margin:0;}
#rightCol .cse-branding-logo p {padding:5px; margin:5px; font:normal 16px/21px 'allerregular',arial,sans-serif; color:#333; text-align:justify;line-height:145%;}
#rightCol .cse-branding-logo a {text-decoration:none; color:#fff;}
#rightCol .cse-branding-logo a:link{text-decoration:none; color:#666;}
#rightCol .cse-branding-logo a:hover{text-decoration:none; color:#9A1D23;}

