
@font-face {
  font-family: GeomanistLight;
  src: url(hinted-Geomanist-Light.ttf);
}
@font-face {
  font-family: GeomanistBold;
  src: url(hinted-Geomanist-Bold.ttf);
}
* {font-size: 18px; color: #26282d; box-sizing: border-box;padding: 0; margin: 0; list-style: none; font-family: GeomanistLight;}
.container {width: 1200px; max-width: 100%;}

h1 {font-size: 36px; line-height: 36px;}
h2 {font-size: 30px; line-height: 30px;}
h3 {font-size: 24px; line-height: 24px;}
h4,h5,h6 {font-size: 20px; line-height: 20px;}
img {max-width: 100%;}

.alignright {float: right;margin-left: 10px; margin-bottom: 10px;}
.alignleft {float: left;margin-right: 10px; margin-bottom: 10px;}
.aligncenter {clear: both;margin: 10px auto;display: block;}

.button, .btn {padding:10px 20px; border:1px solid #3475d3; margin: 10px 0; color: #3475d3; font-size: 20px; line-height: 20px; text-decoration: none; border-radius: 5px;  background-color: transparent;}
.button:hover, .btn:hover {color: #fff; background-color: #3475d3;} 
/*Header Style*/
header {float: left; width: 100%; background-color:#3475d3; color: #fff;margin-bottom: 40px; padding: 10px 0;}
header a {color: #fff;}
header .logo {font-size: 24px; text-transform: uppercase;font-family: GeomanistBold;}
header .logo:hover {color: #fff;}
header .navbar {padding: 0;}
header .navbar-toggler-icon {color: #fff;}
header .navbar-expand-lg .navbar-nav .nav-link {font-size: 15px; padding:10px 0; }
header .navbar-expand-lg .navbar-nav .active a{border-bottom: 1px solid #fff;}
header .navbar-expand-lg .navbar-nav .nav-item:hover a{border-bottom: 1px solid #fff; color:#fff;}
header .navbar-expand-lg .navbar-nav .nav-item {padding:0 20px;}
header .navbar-expand-lg .navbar-nav .nav-item:last-child {padding-right:20px;}
header .navbar-expand-lg .navbar-nav .nav-item:first-child {padding-left:20px;}
header .navbar-expand-lg .navbar-nav .dropdown-menu a {color: #000;} 
header .navbar-expand-lg .navbar-nav .nav-item:hover  .dropdown-menu a {color: #000; border:none;}
header .navbar-expand-lg .navbar-nav .nav-item .dropdown-menu a:hover {color: #3475d3;}
header .navbar-expand-lg .navbar-nav .nav-item .dropdown-menu {	background-color: #fff;border-radius: 2px;-webkit-box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5);box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5);
 min-width: 145px;}
 header .navbar-expand-lg .navbar-nav .nav-item .dropdown-menu li {padding: 0;}
 header .navbar-expand-lg .navbar-nav .nav-item .dropdown-menu li a{padding: 5px 20px;font-size: 14px;}
 .navbar-toggler i {color: #fff;}

 /* Main content body */
.maincontentbody {float: left;width: 100%; margin-bottom: 40px;}
.maincontentbody h1.title {margin-bottom: 40px; font-family: GeomanistBold; padding-top: 40px; position: relative;} 
.maincontentbody h1.title::before, .mysidebar .widget .title::before, .mysidebar .widget .widget-title::before {content: "";width: 70px; height: 2px; position: absolute; background-color: #3475d3; top: 0; left: 0;}
.feature-img {float: left; width: 100%; margin-bottom: 40px;}
.feature-img img {width: 100%;}
.mypost ul {padding-left: 20px;}
.mypost p {font-size: 18px; line-height: 28px; margin-bottom: 20px;}
.mypost li {margin-bottom: 20px;}
.mypost li:before {content: ""; width: 8px;height: 8px;background: #3475d3;float: left;margin-top: 8px; margin-right: 20px;}
.mypost a {color: #3475d3;}

.postlist {float: left;width: 100%;}
.postlist a {text-decoration: none;}
.postlist .postitem{float: left; width: 100%; padding: 10px; border:1px solid #eee; margin-bottom: 10px;}
.postlist .postitem h3 {font-family: GeomanistBold; font-size: 20px; color: }
.postlist .postitem button {float: left;width: 100%; padding:5px 10px; text-align: center;}
.postlist .postitem span {font-size: 13px;float: left;width: 100%; text-align: center;;}
.postlist .postitem p {font-size: 13px;line-height: 20px; margin-bottom: 0;}
.postlist .postitem button {padding: 10px 20px;border: 1px solid #3475d3;color: #3475d3;font-size: 14px;text-decoration: none;border-radius: 5px;background-color: transparent;margin: 20px 0;}
.postlist .postitem:hover button {background-color: #3475d3;color: #fff;}
.postlist .postitem .price {float: left;width: 100%; margin: 10px 0; text-align: center;font-family: GeomanistBold;}

.mypost iframe {width: 100%;top: 5px;margin-bottom: -5px;height: calc(100vw*(180/560));}

.amazonsearch {float: left;width: 100%;}

.paging-navigation {float: left;width: 100%; margin: 10px 0;}
.paging-navigation span, .paging-navigation a {float: left;padding: 10px; border:1px solid #3475d3; color:#3475d3; border-radius: 5px;  margin: 5px; min-height: 40px; min-width: 40px; text-align: center;line-height: 20px;}

.paging-navigation .current, .paging-navigation a:hover {background-color: #3475d3; color:#ffff;}

/*Content Egg*/
.cegg-gridbox {position: relative; background-color: #fff; border:1px solid #fff;}
.cegg-gridbox:hover {border:1px solid #eee;}
.egg-container a {text-decoration: none; }
.cegg-gridbox .cegg-promotion {position: absolute; left: 10px; top: 10px;}
.cegg-gridbox .cegg-promotion .cegg-discount {width: 50px; height: 50px; border-radius: 50%; border:1px solid #6ace26; text-align: center; color: #6ace26; line-height: 50px; float: left;}
.cegg-gridbox .title-case, .egg-item .title-case, .egg-list .title-case {color: #ffa724; font-size: 12px;}
.cegg-gridbox .producttitle {line-height: 20px;font-weight: bold; font-size: 15px;margin-bottom: 10px;}
.cegg-gridbox .stock-status{float: left; width: 100%; margin: 10px; font-size: 14px;}
.egg-container .cegg-price, .egg-container .cegg-currency {font-family: GeomanistBold; color: #3475d3;}

.egg-container .btn {font-size: 14px;  border:1px solid #3475d3; margin: 10px 0; color: #3475d3;line-height: 20px; text-decoration: none; border-radius: 5px;  background-color: transparent;}

.egg-container .btn:hover {color: #fff; background-color:#3475d3;}

.egg-item {float: left;width: 100%; margin: 10px;}
.egg-item h2 {font-size: 18px;font-family: GeomanistBold;color: #3475d3; line-height: 22px;}
.egg-item .cegg-price , .egg-item .cegg-currency {font-size: 20px;}
.egg-item .text-success {font-family: GeomanistBold;}
.egg-list .cegg-lineheight15  {font-size: 14px;}

.row-products {display: -ms-flexbox;display: flex;-ms-flex-wrap: wrap;flex-wrap: wrap;margin-right: -15px;margin-left: -15px; border: 1px solid #f2f2f2; padding: 10px; margin: 10px 0;}
.egg-list .row-products:hover {transition: all 0.3s linear;  -webkit-box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5);box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5);}

/*breadcrumb*/
nav.breadcrumb {background-color: transparent;	padding: 0;	margin-bottom: 40px;}
.breadcrumb a, .breadcrumb span{color: #26282d; font-size:12px; }

/*Sidebar*/
.mysidebar {position: relative;}
.mysidebar .widget {float: left;width: 100%; margin-bottom: 40px; border: 1px solid #f2f2f2;background: #fbfcfd;padding: 30px 20px;}
.mysidebar .widget .title , .mysidebar  .widget-title {font-family: GeomanistLight; float: left;width: 100%; font-size: 36px; margin-bottom: 20px; position: relative; padding-top: 20px;line-height: 38px;}
.mysidebar .widget .title strong {font-family: GeomanistBold;    font-size: 36px;line-height: 38px;}
.mysidebar .text-center .title::before  {left: 40%; width: 50px;}
.mysidebar .widget p {font-size: 14px;}
.mysidebar .widget ul {float: left; width: 100%;}
.mysidebar .widget ul li{float: left; width: 100%; text-align: left;}
.mysidebar .widget ul li:before {content: ""; width: 8px;height: 8px;background: #eee;float: left;margin-top: 8px; margin-right: 20px;}
.mysidebar .widget ul li a {color: #3475d3; font-size: 14px;}
.mysidebar .declaration .widget_text{margin-bottom: 0;}
.mysidebar .widget_search {background-color: #3475d3;}
.mysidebar .widget_search .searchform {position: relative;}
.mysidebar .widget_search input[type=text]  {float: left;width: 100%; height: 45px; padding: 10px; border:none;height: 45px; float: left;width: 100%;}
.mysidebar .widget_search input[type=submit] {height: 45px; width: 45px; float: right;border:none; text-indent: -9999em; background: url(../img/search.png) no-repeat center center #01b952;  position: absolute; top: 0; right: 0; z-index: 9;}
.mysidebar .widget_search:hover input[type=submit] {background-color: #000;}
.mysidebar .widget_search label {width: 100%; margin: 0;}
.mysidebar .widget_search .screen-reader-text {display: none;}
.mysidebar .widget_media_image {padding: 0; border: none;}
.mysidebar .widget_media_image img {width: 100%; float: left;}
.mysidebar .egg-container .cegg-gridbox{width: 100% !important; min-width: 100% !important; max-width: 100%; flex: none; margin-bottom: 0;}
.mysidebar .egg-container .row, .mysidebar .egg-item, .mysidebar .egg-list, .egg-grid {margin-bottom: 0 !important;}
.stickybar {position: sticky;top: 40px; z-index: 99; }

/*footer*/
footer {float: left;width: 100%; background-color:#3475d3; color: #fff; padding: 40px 0;}
footer .logo {float: left;width: 100%; margin-bottom: 20px;}
footer .logo a{color: #fff;font-size: 30px; font-family: GeomanistBold;}
footer .copyright {font-size: 14px; color: #fff;}
footer ul {float: right;}
footer ul li {float: left; padding:10px 15px;}
footer ul li:hover a {color: #fff;}
footer ul li:last-child { border: 1px solid #fff; border-radius: 5px; padding:10px 30px;}
footer ul li:last-child a {font-family: GeomanistBold;}
footer ul li:last-child:hover {background-color: #000; }
footer ul li a {color: #fff; padding:10px 0; font-size: 14px; }
footer .social {float: left; width: 100%; text-align: right;}
footer .social label {font-size: 14px; color: #eee;}
footer .social label:after {content: ""; width: 30px;height: 1px;background: #eee; float: right; margin:10px 20px; }
footer .social a {padding: 0 10px;}
footer .social  i {color: #eee;	}


/*Porduct style*/
.mypost .carousel {float: left;width: 100%; margin-bottom: 40px; text-align: center;}
.mypost .carousel .carousel-item img {margin: auto;}
.carousel-control-next-icon, .carousel-control-prev-icon {transition: all 0.3s linear;  -webkit-box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5);box-shadow: 0 20px 29px 0 rgba(52, 117, 211, .5); width: 30px; height: 30px; border-radius: 50%; }
.carousel-control-next-icon {background:url(../img/next.png) no-repeat center center !important;}
.carousel-control-prev-icon {background:url(../img/prev.png) no-repeat center center !important;}
.proprice {float: left;width: 100%; margin-bottom: 40px;border: 1px solid #f2f2f2;background: #fbfcfd; padding: 30px;}
.proprice label {float: left;width: 100%; font-size: 14px;}
.proprice span {font-size: 40px;font-family: GeomanistBold; color: #3475d3;}

.mypost ul.nav-tabs {padding-left: 0; margin-bottom: 20px;float: left; width: 100%;}
.nav-tabs .nav-item  {width: auto; float: left; shape-margin: 0;  margin:5px; }
.nav-tabs .nav-item a {padding: 10px 20px; border:1px solid #3475d3;}
.nav-tabs .nav-item a.active {background-color: #3475d3; color: #fff;}
.nav-tabs .nav-item::before {display: none;} 


/*Responsive*/
@media screen and (min-width : 20px) and (max-width : 990px) {
	header .navbar-expand-lg .navbar-nav .nav-item:first-child {padding-left:20px;}
	header .navbar-expand-lg .navbar-nav .nav-item:last-child {padding-right:20px;}
	.mypost iframe { width: 100%; top: 5px; margin-bottom: -5px; height: calc(100vw*(315/560));}
  .mypost .card {max-height: 350px;}

  .postitem {text-align: center;}
  .postitem img {margin-bottom: 20px;}

  }
@media screen and (min-width : 20px) and (max-width : 600px) {
  .mypost .card .card-title {font-size: 24px;}
  .mypost .card p {font-size: 14px; line-height: 20px;}
  .stickybar {position: relative;}
  footer .social {text-align: left;}
  footer .social label {float: left;width: 100%;}
  }
