/* CSS Document */
/* ---------------------- Base64 CSS --------------------- */
/* ------------------- TWFtYSdzIFdvcmxk ------------------ */



.mobilebutton, .showmenu, .showsidebar {
	display: none !important;
}

/* ------------  Header -------------- */
@media all and (max-width: 1100px) {
	header .centerbox {
		width: 350px;
	}
	header .logo {
		width: 28%;
	}
	header .logo.kidscom {
		width: 10%;
	}
	header .basket {
		padding: 20px 5px 0px 0px;
	}
}
@media all and (max-width: 900px) {
	header .centerbox {
		width: 250px;
		padding-left: 40px;
	}
	header .centerbox form input[type="text"], header .centerbox form input[type="search"] {
		width: 85%;
		font-size: 11px;
	}
	header .centerbox form input[type="button"], header .centerbox form input[type="submit"] {
		width: 15%;
	}
	header .basket .texts {
		display: none;
	}
}
@media all and (max-width: 850px) { 
	header .logo span {
		display: none;
	}
}
@media all and (max-width: 750px) {
	header {
		margin: 0px 0px 2%;
	}
	header .topmenu {
		font-size: 10px;
	}
	header .topmenu p > span {
		display: none;
	}
	header .topmenu p a + a, header .topmenu p span + a { 
		margin-left: 5px;
	}
	header .basket { 
		padding: 20px 0px 0px 0px;
	}
	header .basket > a::before {
		width: 30px;
	}
	header .logo {
		max-width: 100px;
	}	
	header .logo a {
		background-image: url(../images/logo_kidscom_small.svg);				
	}	
	header .logo.coolclub {
		max-width: 60px;
	}
	header .logo.coolclub a {
		padding: 50px 0px 0px;
		background-size: auto 45px;
		background-position: 50% 10px;
		font-size: 10px;
		line-height: 9px;
	}
	header .logo span {
		display: none;
	}
	header .logo a.coolclub {
    	background-image: url(../images/logo_coolclub.svg);		
	}
}
@media all and (max-width: 550px) {
	header .topmenu p a.facebooklogin, header .topmenu p a.location, header .topmenu p a > span {
		display: none;
	}
	header .logo.kidscom {
		display: none;
	}
	header .basket {
		padding: 0px;
		position: absolute;
		top: 2px;
		right: 0px;
	}
	header .basket > a::before {
		height: 25px;
		width: 25px;
	}
	header .topmenu p a.delivery {
		display: none;
	}
	header .centerbox {
		padding: 0px 0px 10px;
		clear: both;
		width: 100%;
		max-width: 280px;
		position: static;
	}
	header .centerbox p.phone {
		position: absolute;
		top: 0px;
		left: 10px;
		font-size: 14px;
	}
	header .topmenu {
		padding-right: 30px;
	}
	header .logo { 
		width: 80%;
		float: none;
		margin: 0px auto;
		height: 55px;
	}
	header .logo a {
		height: 55px;
	}
	header .centerbox form {
		height: 30px;
		padding: 2px;
	}
	header .centerbox form input[type="text"], header .centerbox form input[type="search"],
	header .centerbox form input[type="button"], header .centerbox form input[type="submit"] {
		height: 24px;
		line-height: 24px;
	}
	header .logo.coolclub {
		display: none;
	}
}

/* ------------  Navigation -------------- */
@media all and (max-width: 1400px) {
	nav > ul > li > a.home {
		display: none;
	}
	nav > ul > li + li > a::before {
		display: none;
	}
	nav > ul > li + li  + li > a::before {
		display: block;
	}
	nav > ul > li > a { 
		font-size: 11px;
	}	
	/*
	nav > ul > li > a.coolclub { 
		font-size: 9px;
		/*text-indent: -9999px;*//*
	}
	nav > ul > li > a.coolclub::after {
		float: right;
		margin: -5px -7px -10px 5px;
	}*/
}
@media all and (max-width: 1170px) {	
	nav > ul > li > a.coolclub { 
		font-size: 9px;
		/*text-indent: -9999px;*/
	}
}
/*
@media all and (max-width: 1000px) {
	nav > ul > li > a.home {
		width: 30px;
	}
	nav > ul > li > a {
		font-size: 14px;
		padding: 0px 15px;
	}
	nav > ul > li > .submenu > ul > li > a {
		font-size: 12px;
	}
}
@media all and (max-width: 900px) {
	nav > ul > li > a.home {
		display: none;
	}
	nav > ul > li > a {
		font-size: 13px;
		padding: 0px 12px;
	}
}
*/
@media all and (max-width: 1100px) {
	nav > ul > li > a.coolclub { 
		font-size: 13px;
		text-indent: 0px;
		position: static;
	}	
	nav > ul > li > a.coolclub br {
		display: none;
	}
	nav > ul > li > a.coolclub::after {
		float: none;
		margin: -10px 0px -10px 5px;
	}	
	nav > ul > li + li  + li > a::before {
		display: none;
	}	
	.showmenu {
		display: block !important;
		width: 100%;
		height: 30px;
		background-color: #71a3d6;
		text-align: center;
		letter-spacing: 0.1em;
		line-height: 30px;
		font-size: 15px;
		font-weight: 600;
		color: #fff;
	}
	.showmenu::after {
		display: inline-block;
		width: 20px;
		height: 20px;
		background-image: url(../images/arrow_next_white.svg);
		background-repeat: no-repeat;
		background-position: 50% 50%;
		content: "";
		vertical-align: middle;
		transform: rotate(90deg);
	}
	.showmenu:hover {
		text-decoration: none;
	}
	nav > ul > li {
		float: none;
		width: 100%;
		border-bottom: 1px solid #415dae;
	}
	nav > ul > li + li > a::before, nav > ul > li.more:hover > a::after {
		display: none;
	}
	nav > ul > li > a {
		text-align: center;
		font-size: 15px;
		padding: 0px;
	}
	nav > ul > li > .submenu, nav > ul > li:hover > .submenu {
		display: none;
	}
}

/* ------------  Main -------------- */
@media all and (max-width: 1200px) {
	.box {
		padding: 0px 10px;
	}
}
@media all and (max-width: 1000px) {
	main .tabs ul.titles > li > a {
		font-size: 12px;
	}
	main .coolclub h2 {
		margin: 15px 0px 4%;
	}
	.sidebar section ul.menu li a , .sidebar section p {
		font-size: 12px;
	}
	.sidebar section ul.menu li a {
		line-height: 14px;	
	}
	main .paging p {
		font-size: 12px;
	}
	main .paging p select {
		width: 120px;
		font-size: 12px;
		padding: 0px 30px 0px 10px;
	}
	ul.products li h3 {
		font-size: 14px;
		line-height: 18px;
	}
	ul.products li .texts p {
		font-size: 12px;
		line-height: 14px;
	}
}
@media all and (max-width: 850px) {
	main .coolclub h2 {
		font-size: 18px;
	}
	main ul.categories li h3 {
		font-size: 12px;
		line-height: 20px;
	}
	.textbox h1 {
		font-size: 20px;
		margin: 0px 0px 3%;
	}
	main h2, .textbox h2 {
		font-size: 18px;
		margin: 0px 0px 2%;
	}
	.textbox h3 {
		font-size: 16px;
	}
	.textbox p , .textbox ul, .textbox ol {
		font-size: 14px;
		line-height: 18px;	
		margin: 0px 0px 2%;
	}
	.textbox table tr td, .textbox table tr th {
		font-size: 14px;
	}
	main .promobanner { 
		margin: 0px 0px 3%;
	}	
	.page404 h3 {
		font-size: 7.5vw !important;
		line-height: 166% !important;
	}
}
@media all and (max-width: 750px) {
	.showsidebar {
		display: block !important;
		width: 100%;
		height: 30px;
		background-color: #aac846;
		text-align: center;
		letter-spacing: 0.1em;
		line-height: 30px;
		font-size: 15px;
		font-weight: 600;
		color: #fff;
		margin-bottom: 20px;
	}
	.showsidebar:hover {
		text-decoration: none;
	}
	
	main .box > .sidebar {
		width: 250px;
		margin-left: -280px;
		transition: all 200ms;
	}
	main .box > .sidebar + .content {
		width: 100%;
		transition: all 200ms;
	}
	main .box > .sidebar.active {
		margin-left: 0px;
	}
	main .box > .sidebar.active + .content {
		margin-right: -280px;
	}
	
	main .tabs ul.titles > li > a {
		font-size: 11px;
		line-height: 15px;
		padding: 10px 0px;
		letter-spacing: 0px;
	}
	main .mainbanner button {
		width: 30px;
		height: 30px;
		left: 0px;
		margin: -15px 0px 0px;
	}
	main .mainbanner div + button {
		left: auto;
		right: 0px;
	}
	main .path {
		margin: 0px 0px 2%;
	}
	main .path p {
		font-size: 10px;
		line-height: 15px;
	}
}
@media all and (max-width: 650px) {
	main .coolclub h2 { 
		font-size: 14px;
		line-height: 20px;
	}
	main .coolclub h2 img {
		width: 40px;
		margin: -10px 5px;
	}
	main ul.categories li, main ul.categories li:nth-child(4n+1) {
		width: 49%;
		clear: none;
		margin-left: 2%;
	}
	main ul.categories li:nth-child(2n+1) {
		clear: left;
		margin-left: 0px;
	}
	.sidebar + .content ul.products li, .sidebar + .content ul.products li:nth-child(3n+1), .sidebar + .content ul.products li:nth-child(4n+1) {
		width: 49%;
		clear: none;
		margin-left: 2%;
	}
	.sidebar + .content ul.products li:nth-child(2n+1) {
		clear: left;
		margin-left: 0px;
	}
	ul.products li, ul.products li:nth-child(4n+1) {
		width: 49%;
		clear: none;
		margin-left: 2%;
	}
	ul.products li:nth-child(2n+1) {
		clear: left;
		margin-left: 0px;
	}
	main .banners .banner {
		width: 100% ;
		clear: both ;
		margin: 0px 0px 10px 0px ;
	}
	main .banners .banner + .banner + .banner {
		clear: none;
	}
	main .banners.clothes .banner,
	main .banners.clothes .banner + .banner,
	main .banners.clothes .banner + .banner + .banner,
	main .banners.clothes .banner + .banner + .banner + .banner {
		width: 100% ;
		clear: both ;
		margin: 0px 0px 10px 0px  ;
	}
}
@media all and (max-width: 450px) {
	main .coolclub h2 { 
		background-image: none;
	}
	main .coolclub h2 { 
		font-size: 12px;
		line-height: 15px;
	}
	main .coolclub h2 img {
		display: none;
	}
	main .tabs ul.titles > li, main .tabs ul.titles > li + li {
		margin: 0px;
		width: 100%;
	}
	.textbox h1 {
		font-size: 16px;
	}
	main h2, .textbox h2 {
		font-size: 15px;
	}
	.textbox h3 {
		font-size: 14px;
	}
	.textbox p , .textbox ul, .textbox ol {
		font-size: 13px;
		line-height: 16px;		
	}
	.textbox table tr td, .textbox table tr th {
		font-size: 13px;
	}
	.sidebar + .content ul.products li, .sidebar + .content ul.products li:nth-child(3n+1), 
	.sidebar + .content ul.products li:nth-child(4n+1), .sidebar + .content ul.products li:nth-child(2n+1) {
		margin-left: 0px;
		float: none;
		width: 100%;
		clear: both;
	}
	ul.products li, ul.products li:nth-child(4n+1), ul.products li:nth-child(2n+1) {
		margin-left: 0px;
		float: none;
		width: 100%;
		clear: both;
	}
	ul.products.carousel li {
		clear: none;
		width: auto;
		float: left;
	}
	main .banners .banner + .banner + .banner {
		width: 100% ;
		clear: both ;
		margin: 0px 0px 10px 0px ;
	}
	
	.page404 a {
		font-size: 14px;
		font-size: 4vw !important;
		line-height: 150% !important;
	}	
}



/* ------------  Product -------------- */
@media all and (max-width: 1100px) {
	.product .data section.options {
		margin: 2.5% 0px 0px;
		padding: 5% 0px 2%;
	}
	.product .data .info {
		width: 55%;
	}
}
@media all and (max-width: 1000px) {
	.product .data h1 {
		font-size: 20px;
		line-height: 25px;
	}
	.product .data .pricebox {
		float: none;
		clear: both;
		overflow: hidden;
		margin: 0px;
	}
	.product .data .pricebox p {
		float: left;
		width: 48%;
	}
	.product .data .pricebox p + p {
		float: right;
	}
	.product .data .pricebox p span, .product .data .pricebox p strong, .product .data .pricebox p em {
		float: none;
	}
	.product .data .info { 
		width: 100%;
	}	
	.product .data .buttons a.collect,
	.product .data .buttons a.addtobasket {
		font-size: 12px;
		letter-spacing: 0px;
	}
	.product .data .buttons a.availability, .product .data .buttons a.addtowishlist {
		font-size: 11px;
		letter-spacing: 0px;
	}
	.product .data section.options select {
		font-size: 11px;
	}
}
@media all and (max-width: 950px) {
	.product .data .pricebox p {
		line-height: 25px;
	}
	.product .data .pricebox p strong, .product .data .pricebox p em {
		clear: both;
		display: block;
	}
	.product .photos ul.thumbs img {
		max-height: 60px;
	}
}
@media all and (max-width: 750px) {
	.product .photos, .product .data {
		float: none;
		clear: both;
		width: 100%;
	}
}


/*
@media all and (max-width: 900px) { 
	.product .photos .bigphoto {
		width: 100%;
	}
	.product .photos ul.thumbs {
		width: 100%;
		clear: both;
		margin-bottom: 20px;
	}
	.product .photos ul.thumbs li {
		width: 15%;
		clear: none;
		float: left;
	}
	.product .photos ul.thumbs li + li { 
		margin: 0px 0px 0px 1%;
	}	
}
@media all and (max-width: 750px) {
	.product .photos, .product .data {
		float: none;
		width: 100%;
	}
	.product .data section.color, .product .data section.size  { 
		max-width: 100%;
	}
	.product .data p.code, .product .data p.prices,.product .data section.color, .product .data section.size {
		margin-bottom: 10px;
	}
}
@media all and (max-width: 650px) {
	.product .tabs ul.titles li a {
		font-size: 12px;
		padding: 0px 10px;
		letter-spacing: 0px;
	}
}
@media all and (max-width: 400px) {
	.product .tabs ul.titles li a { 
		font-size: 10px;
		padding: 0px 7px;
	}
}
*/

/* ------------  Footer -------------- */
@media all and (max-width: 1100px) {
	footer .lists ul {
		width: 21%;
	}
	footer form.newsletter p input[type="email"], footer form.newsletter p input[type="text"] {
		padding: 0px 0px 0px 10px;
	}
}
@media all and (max-width: 850px) {
	footer form.newsletter, footer .orario {
		float: none;
		width: 100%;
		clear: both;
	}
	footer .lists ul { 
		width: 32%;
		margin-bottom: 20px;
	}
	footer .bottom p.banks img {
		margin-top: 0px;
	}
}
@media all and (max-width: 600px) {
	footer .bottom p, footer .bottom p + p {
		float: none;
		clear: both;
		text-align: center;
	}
}
@media all and (max-width: 400px) {
	footer .lists ul, footer .lists ul + ul {
		float: none;
		width: 100%;
		margin: 0px auto 20px;
	}
}