@media (min-width: 786px) and (max-width : 5300px) {
	.normal-icon img.inactive {
		-webkit-filter: drop-shadow(0px 0px 0px rgba(255,255,255,0.0));
		-webkit-backface-visibility: hidden;
	}
	.normal-icon:hover img.inactive {
		-webkit-filter: drop-shadow(0px 0px 8px rgba(255, 255, 255, 0.8));
	}
	.normal-icon img.active, a.btn-sla:hover img {
		-webkit-filter: drop-shadow(0px 0px 8px rgba(255, 255, 255, 0.8));
	}
}
@media (min-width: 1200px) and (max-width : 1600px) {
	.uvod {
		height: 500px;
	}
	.poklon .puzzla {
		width: 350px;
	}
	.poklon-img {
		width: 540px;
	}
	.puzzla-home {
		width: 300px;
	}
}

@media only screen and (max-height : 800px) {
	.home-logo {
		/*width: 250px;*/
		margin-left: 75px;
	}
	.illustration-home h3 {
		font-size: 46px;
		line-height: 49px;
	}
	.illustration-home h2 {
		font-size: 36px;
		line-height: 45px;
		margin-bottom: 0;
	}
}

@media only screen and (max-width : 1199px) and (min-width : 992px) {
	.illustration-home h3 {
		font-size: 55px;
		line-height: 55px;
	}
	.illustration-home h2 {
		font-size: 45px;
		line-height: 45px;
		margin-bottom: 20px;
	}
	.uvod {
		height: 450px;
	}
	.poklon .puzzla {
		width: 350px;
		left: 100px;
	}
	.poklon-img {
		width: 540px;
	}
	.prenesi-broj .uvod .style-text h2 {
		font-size: 60px;
		line-height: 65px;
		margin: 0 0 10px;
	}
	.puzzla-home {
		width: 250px;
		right: 75px;
	}
	.mnstr-ovrl h4 strong {
		font-size: 25px;
	}
	.mnstr-ovrl h4 {
		font-size: 22px;
	}
	.mnstr-ovrl img {
		width: 240px;
	}
	.mnstr-ovrl {
		top: -83px;
    	right: -75px;
	}
	.slozi-svoju-slatku-hej-slagalicu {
		margin: 215px auto 0;
	}
	.top-section-inside {
		background-position: 35% 100%;
	}
}

@media only screen and (max-width : 991px) and (min-width : 768px) {
	.top-section-inside .logo-img {
	    width: 240px;
	}
	.home-logo {
	    margin-top: -30px;
	}
	.illustration-home h1 {
	    margin: -65px auto 25px;
	    padding-top: 60px;
	}
	/*.mnstr-img {
		width: 200px;
	}*/
	/*body {
		background: #703c89 url(/custom/hej-slagalica/assets/images/bg-slatki.jpg) no-repeat center 75px;
	}*/
	/*.mnstr-img.mnstr-size {
		width: 200px;
	}*/
	.snow-mob {
		top: -8px;
	}
	.slozi-svoju-slatku-hej-slagalicu {
		margin: 90px 0 0;
	}
	.jigsaw .wrapper {
		padding: 20px 20px 90px;
	}
	.puzzla-home {
		width: 300px;
	}
	.poklon h2 {
		font-size: 50px;
		line-height: 50px;
	}
	.uvod, .poklon {
		height: 450px;
	}
	.poklon .puzzla {
		width: 300px;
		left: 50px;
	}
	.poklon-img {
		width: 540px;
	}
	.prenesi-broj .uvod .style-text h2 {
		font-size: 50px;
		line-height: 55px;
		margin: 0 0 10px;
	}
	.prenesi-broj .style-text p {
		font-size: 19px;
	}
	.home-logo {
		width: 192px;
	}
	.illustration-home h3 {
		font-size: 55px;
		line-height: 55px;
	}
	.illustration-home h2 {
		font-size: 45px;
		line-height: 45px;
		margin-bottom: 20px;
	}
	.home-text h2 {
		font-size: 50px;
		line-height: 50px;
	}
	.home-text p {
		padding: 0 130px;
	}
	.normal-icon img.inactive {
		/*width: 110px;*/
	}
	.third-one.normal-icon img.inactive {
		/*width: 115px;*/
	}
	.second-one {
		left: 108px;
	}
	.third-one {
		left: 212px;
	}
	.fourth-one {
		left: 333px;
	}
	.koliko-megabajta .normal-icon {
	    top: -12px;
	}
	.koliko-poruka .normal-icon {
	    top: 3px;
	}
	.koliko-razgovora .normal-icon {
	    top: 20px;
	}
	.normal-icon img.active {
		/*width: 110px;*/
	}
	.normal-icon.active img.active {
		/*width: 110px;*/
	}
	.normal-icon.fourth-one img.inactive {
		/*width: 115px;*/
	}
	.illustration-home {
		margin-top: 76px;
	}
	.logo a {
		padding: 13px 0;
	}
	.home-logo {
		margin-bottom: 0;
	}
	.mnstr-box {
		margin: 0 auto 60px auto;
		width: 250px;
	}
	.mnstr-ovrl {
		/*top: -115px;
		right: -140px;*/
		top: -100px;
		right: -120px;
	}
	.illustration-top-box h2 {
	    margin: 32px 0 -28px 0;
	}
	.option-ovrl {
		width: 100%;
		left: 0;
	}
	.klikni-slozi-img {
		margin-left: 60px;
	}
	.top-section .illustration-top-box {
		padding-top: 40px;
	}
	.mb-200-jesen {
	    margin-left: -4px;
	}
	.mb-600-jesen {
		margin-left: -65px;
	}
	.gb-3-jesen {
		margin-left: -50px;
	}
	.gb-7-jesen {
		margin-left: -95px;
	}
	.min-30-jesen {
		margin-left: -60px;
	}
	.min-80-jesen {
		margin-left: 0px;
	}
	.middle-section .content {
		padding-top: 0;
	}
	
}

@media only screen and (max-width : 991px) {
	.mini-img {
		margin-right: 0
	}

	.gigo-img {
		margin-left: 0;
	}

	.zuba-img {
	 margin-right: 0
	}

	.faca-img {
		margin-left: 0;
	}
	.top-section-inside {
		background-position: 40% 100%;
	}
	.bottom-section-inside  {
		background-size: cover!important;
	}
	.top-section-inside {
		background-size: cover!important;
	}
	.home, .aktiviraj-tarifu {
		/*background: url('/custom/hej-slagalica/assets/images/hej-slagalica-background-ljeto-mobile.jpg') top center / cover no-repeat;*/
	}
	.mini-title-img {
		margin: 0;
	}
	.top-section-inside {
		position: relative;
		margin-top: 75px;
	}
	.snow-mob {
		position: absolute;
		width: 100%;
	}
	.options-wrapper {
		padding-top: 0;
	}
	.tarifa-wrapper .koliko-razgovora .mejn {
		width: 680px;
	}
	.tarifa-wrapper .koliko-poruka .mejn {
		width: 680px;
	}
	.tarifa-wrapper .koliko-megabajta .mejn {
		width: 815px;
	}
	.wrapper-icons {
		left: 285px;
	}
	.send-it span {
		font-size: 22px;
		line-height: 29px;
	}
	.send-it span.size-wrapper {
		margin: 4px 0;
	}
	.send-it {
		font-size: 16px;
		line-height: 20px;
		padding-top: 5px;
	}
	.final-text {
		font-size: 18px;
		line-height: 18px;
	}
	.final-text .kockica {
	    margin: 0 13px 0 0;
	    padding: 3px 3px 1px;
	    font-size: 10px;
	    line-height: 10px;
	}
	.final-text img {
		width: 18px;
	}
	.final-price span {
		font-size: 74px;
		line-height: 52px;
	}
	.final-price strong {
		font-size: 18px;
		line-height: 22px;
	}
	.push-right {
		padding-left: 0;
	}
	.content.inner {
	    padding-top: 70px;
	}
	.illustration-home {
		background: none;
	}
	.illustration-top-box.second {
		padding-top: 0;
	}
	.option-ovrl {
		top: 0;
		height: 100%;
	}
	.elk-and-snowman-img {
		margin-top: 30px;
		position: unset;
		transform: unset;
	}
	.content-top .col-xs-12:last-child .mnstr-box  {
		margin-bottom: 0;
	}
}

@media only screen and (max-width : 767px) {
	.head-paper {
		background-size: 100%;
		width: 100%;
		background-repeat: no-repeat;
		padding: 21px 0 0;
		height: 130px;
	}
	.head-paper-blue {
	    width: 100%;
	    height: 137px;
	    padding: 35px 0 0;
	    background-size: 100%;
	    background-repeat: no-repeat;
	}
	.head-paper-purple {
	    width: 100%;
	    height: 134px;
	    padding: 38px 0 0;
	    background-size: 100%;
	    background-repeat: no-repeat;
	}
	.top-section-inside {
		height: 55vh;
	}
	.top-section-inside .logo-img {
	    width: 140px;
	}
	.home {
		background-attachment: fixed!important;
	    background: #240604 url(/custom/hej-slagalica/assets/images/rodendan/background.jpg) no-repeat center 60px / 235%;
	}
	.illustration-home h1 {
		width: 100%;
		background-size: 100%;
	    padding-top: 24px;
	    height: 134px;
	}
	.illustration-top-box h2.first-one {
		width: 100%;
		background-size: 100%;
		padding-top: 20px;
		left: 0;
	}
	.lisce-top {
		width: 465px;
	}
	.lisce-bottom {
		top: 85px;
    	width: 600px;
	}
	.snow-mob {
		top: -3px;
	}
	.mb-200-jesen  {
		margin-left: 5px;
	}
	.bag-img.mb-600-jesen {
		margin-left: -48px;
	}
	.bag-img.gb-3-jesen {
		height: 200px;
	}
	.top-section, .middle-section, .bottom-section, .bottom-section-inside {
		background-size: contain;
	}
	.illustration-home {
		min-height: 100%;
	}
	.top-section .illustration-top-box {
		padding-top: 25px;
	}
	.superman-pic.active {
		right: 0;
		left: 0;
		margin: auto;
	}
	.logo a {
		padding: 6px 0 3px 0;
	}
	.puzzla-home {
		width: 200px;
		bottom: -35px;
		right: -94px;
	}
	.illustration-home {
		padding: 30px 0 0 0;
	}
	.home-logo {
		width: 170px;
		margin-top: 0;
	}
	.illustration-home h1 {
		font-size: 17px;
		margin: -25px 0 0 0;
	}
	.illustration-home h1 span {
		font-size: 28px;
	}
	.illustration-top-box {
		width: 100%;
    	margin: 0 auto 0 auto;
	}
	.illustration-home h3 {
		font-size: 43px;
		line-height: 43px;
		margin: 40px 0 0 5px;

	}
	.illustration-home h2 {
		font-size: 30px;
		line-height: 30px;
		margin-bottom: 10px;
		margin-top: 10px;
	}
	.home-text h2 {
		font-size: 25px;
		line-height: 25px;
	}
	.home-text p {
		padding: 0;
	}
	.content {
		padding: 10px 0 35px;
	}
	.home-icons {
		margin: 25px auto 0;
		width: 55%;
	}
	.babls .custom-row {
		margin-left: -5px;
		margin-right: -5px;
	}
	.babls .custom-col {
		padding-left: 5px;
		padding-right: 5px;
	}
	a.babl h2 {
		font-size: 20px;
		line-height: 20px;
	}
	a.babl h2 span {
		font-size: 13px;
		line-height: 15px;
	}
	a.babl strong {
		font-size: 9px;
		margin: 10px 0 0;
	}
	a.babl .pos-abs {
		padding: 0 30px;
	}
	.share-it {
	    padding: 40px 0;
	    margin-top: 0;
	}
	.prenesi-broj .share-it {
		padding: 40px 0 40px;
	}
	.share-it .wrapper img {
		width: 60px;
	}
	.share-it .wrapper  a {
		padding: 0 1px;
	}
	.share-it h3 {
		font-size: 16px;
		line-height: 16px;
		margin: 0 0 10px;
	}
	.banner-footer {
		margin-bottom: 40px;
	}
	.babls {
		margin-top: 55px;
	}
	a.arrow, a.arrow:active, a.arrow:focus, a.arrow:visited {
		padding-bottom: 0px;
	}
	.home-btn {
		font-size: 26px;
		line-height: 29px;
		padding: 15px 15px 15px 15px;
	}
	.home-btn em {
		font-size: 17px;
	}
	.custom-icon {
		margin: 75px auto 0px;
   		width: 20%;
	}
	.tarifa-wrapper .mejn {
		display: none;
		height: 90px;
	}
	.wrapper-icons {
		left: 0;
		position: relative;
		height: 80px;
		padding: 0 8px 0;
	}
	.koliko-razgovora, .koliko-poruka, .koliko-megabajta {
		height: 100%;
		position: relative;
	}
	.headline-tarife {
		padding: 0px 8px 2px;
		margin: 0;
	}
	.koliko-razgovora {
		margin: 10px 0;
	}
	.slozi-svoju-slatku-hej-slagalicu {
	    margin: 0;
	    max-width: 45%;
	}
	.headline-tarife img {
		float: left;
		width: 16px;
		margin: 0 4px 0 0;
	}
	.koliko-poruka .headline-tarife img {
		margin-top: 1px;
	}
	.koliko-megabajta .headline-tarife span {
		margin-top: 5px;
	}
	.headline-tarife span {
		display: block;
		font-size: 14px;
		line-height: 1;
		margin-top: 0;
	}
	.headline-tarife {
		font-size: 22px;
		line-height: 1;
	}
	.normal-icon img {
		width: 80px;
	}
	.normal-icon img.inactive {
		width: 80px;
	}
	.aktiviraj-tarifu .style-text h4 {
		font-size: 15px;
		line-height: 17px;
		padding: 0 20px;
	}
	.aktiviraj-tarifu .style-text h2 {
		font-size: 12px;
		line-height: 12px;
		font-weight: 400;
		margin: 3px 0 10px;
	}
	.aktiviraj-tarifu .style-text h3 {
		font-size: 13px;
	}
	.nr {
	    width: 40px;
		height: 40px;
		border-radius: 20px;
		font-size: 65px;
		line-height: 65px;
		margin: 0 9px 20px 0;
		padding: 2px 0 0;
		border: none;
	}
	h1.logo {
		top: 9px;
	}
	
	#main-header {
		height: auto;
		position: fixed;
		width: 100%;
		z-index: 50;
	}
	.content.inner {
	    padding-top: 80px;
	}
	.second-nap {
	    margin: 15px 20px 0;
	    padding: 17px 15px 6px;
	}
	.first-one {
		left: 27px;
	}
	.second-one {
		left: 95px;
	}
	.third-one {
		left: 162px;
	}
	.fourth-one {
		left: 237px;
	}
	.koliko-megabajta .normal-icon, .koliko-poruka .normal-icon, .koliko-razgovora .normal-icon {
	    top: 0px;
	}
	.koliko-poruka {
		margin: 3px 0;
	}
	.koliko-megabajta .normal-icon, .koliko-razgovora .normal-icon, .koliko-poruka .normal-icon {
		width: 80px;
		height: 80px;
	}
	.koliko-megabajta .normal-icon.fourth-one {
		top: 2px;
	}
	.send-it {
		font-size: 11px;
		line-height: 11px;
		padding: 0;
		color: #fff;
	}
	.send-it span {
		font-size: 24px;
		line-height: 15px;
		margin-top: 6px;
	}
	.jigsaw .wrapper {
		padding: 15px 10px 85px;
	}
	.final-text {
		font-size: 12px;
		line-height: 12px;
		font-stretch: normal;
		width: 100%;
	}
	.final-text .kockica {
	    margin: -4px 7px 0 0;
	    padding: 3px 4px 0px;
	    font-size: 7px;
	    line-height: 7px;
	}
	.final-text img {
		width: 13px;
	}
	.final-text img {
		margin: -1px 10px 0 5px;
	}
	.poruke-final.final-text img {
		width: 12px;
		margin: 0 10px 0 5px;
	}
	.internet-final.final-text img {
		margin-top: -2px;
	}
	.final-price {
		line-height: 10px;
		padding-left: 10px;
		width: 60px;
	}
	.final-price span {
		font-size: 35px;
		line-height: 35px;
		margin: 0;
	}
	.final-price strong {
		font-size: 12px;
		line-height: 10px;
	}
	.final-text.razgovori-final {
		margin-top: 7px;
		padding-top: 15px;
		border-top: 1px solid #fff;
	}
	.send-it span.size-wrapper {
	    margin: 10px 0 7px;
	}
	a[href^=tel] {
		color: #fff;
	}
	.hej-ba {
		float: none;
		font-size: 13px;
		line-height: 13px;
		padding: 10px 0 10px 15px;
	}
	.uvod {
		height: 205px;
		margin-top: 40px;
	}
	.prenesi-broj .uvod .style-text h2 {
		font-size: 25px;
		line-height: 25px;
		margin: 0 0 5px;
	}
	.prenesi-broj .style-text p {
		font-size: 12px;
		line-height: 14px;
		padding-right: 40px;
		margin: 0 0 15px;
	}
	.poklon .puzzla {
	    left: 25px;
	    top: -40px;
	    width: 110px;
	}
	.poklon h2 {
		font-size: 23px;
		line-height: 25px;
	}
	.poklon {
		height: 220px;
	}
	.prenesi-broj .content.inner {
		padding-top: 20px;
	}
	.prenesi-broj .style-text h2 {
		font-size: 22px;
		line-height: 25px;
		margin: 0 0 5px;
		padding-right: 30px;
	}
	.prenesi-broj .style-text p {
	    font-size: 13px;
	    line-height: 20px;
	    padding-right: 0;
	}
	.poklon-img {
		width: 250px;
		margin-left: 30px;
	}
	.tarifa-wrapper {
		margin-bottom: 20px;
	}
	.nap {
		font-size: 12px;
	}
	a.arrow span {
		font-size: 40px;
		line-height: 40px;
		margin: 5px 0 0;
	}
	.cool {
	    font-size: 15px;
	    line-height: 18px;
	    margin: 20px 0 10px;
	    padding: 11px 20px 9px;
	    border-radius: 6px;
	}
	.home-logo { 
		margin: 0;
	}
	.prenesi-broj .style-text h3 {
		font-size: 15px;
		line-height: 19px;
	}
	.prenesi-broj .style-text ul {
		margin-bottom: 10px;
	}
	.prenesi-broj .style-text ul li {
	    font-size: 13px;
	    line-height: 20px;
	    margin: 0 0 5px;
	}
	.fix-width {
		max-width: 380px;
		margin: 0 auto;
	}
	.nr {
		color: #fff;
	}
	.illustration-home {
		margin-top: 60px;
	}
	.share-mob {
		padding:  15px 15px 0;
	}
	.share-mob a {
		display: inline-block;
		padding: 0 2px 0 0;
	}
	.share-mob a img {
		width: 30px;
	}
	.mejn {
		display: none;
	}
	@keyframes jump { 0% { bottom: -15px; } 50% { bottom: 10px; } 100% { bottom: -15px; } } 
	.superman-pic {
		display: block;
		width: 240px;
		margin: 20px auto 0 auto;
	}
	.cloud-mob-box {
		max-width: 320px;
    	margin: 0 auto;
	}
	.cloud-1 {
		width: 110px;
	}
	.cloud-2 {
		width: 170px;
	}
	/* --------- Slagalica 07-2020  ----------*/
	.mnstr-ovrl img {
		width: 195px;
	}
	.mnstr-ovrl h4 {
		top: 26px;
		font-size: 16px;
	}
	.mnstr-ovrl h4 strong {
		font-size: 16px;
		margin-bottom: 4px;
	}
	.mnstr-img.mnstr-size{
		width: 170px;
	}
	.mini-title-img {
		width: 190px;
	}
	.mnstr-ovrl {
		top: -80px;
		right: -30px;
	}
	.mnstr-box {
		width: 300px;
		margin: 0 auto 45px auto;
	}
	.bags-box {
		width: 300px;
		margin: 0 auto 30px auto;
	}
	.bags-box.bag-mob-mb-0 {
		margin: 0 auto;
	}
	.illustration-top-box h2 {
		font-size: 16px;
		margin: 0;
	}
	.illustration-top-box h2 strong {
		font-size: 20px;
	}
	.illustration-top-box h2 span {
		font-size: 25px;
    	margin: 43px 0 40px 0;
	} 
	.illustration-top-box h2.first-one span {
		color: #fff;
	}
	.footer-section {
	    margin: 40px auto 0;
	    height: 578px;
	    background: url(/custom/hej-slagalica/assets/images/rodendan/bg-text3.png) no-repeat top center / cover;
	}
	.illustration-top-box.top-box-bottom h2 span {
		margin: 10px 0 0 0;
	}
	.bag-img {
		/*width: 240px;*/
		height: 194px;
	}
	.bag-img.mb-600-jesen {
		height: 250px;
	}
	.fleka-img {
		width: 175px;
	}
	.bag-ovrl {
		position: absolute;
		bottom: -50px;
		left: auto;
		right: 0;
	}
	.bag-ovrl h4 {
		bottom: 75px;
		font-size: 15px;
	}
	.bag-ovrl h4 strong {
		font-size: 20px;
	}
	.option-ovrl h4 strong {
		font-size: 35px;
	}
	.klikni-slozi-img {
		width: 115%;
	}
	a.btn-sla {
		padding: 40px 0 0px;
	}
	.top-section-inside {
		margin-top:60px;
		padding: 50px 0 25px 0;
	}
	.tarifa-wrapper-custom.aktiviraj-tarifu-wrapper {
		padding-top: 0px;
	}
	.nap {
		padding: 0 15px 30px 15px;
	}
	.bottom-section {
		padding: 0 15px;
	}
	.illustration-top-box .text-mb-100 {
		margin-bottom: 50px;
	}
	
}

@media only screen and (max-width : 340px) {
	.illustration-home h1 span, .illustration-top-box h2 span {
		font-size: 26px;
	}
	.superman-pic {
		display: block;
		width: 180px;
		margin: 20px auto 0 auto;
	}
	.cloud-mob-box {
		max-width: 250px;
		margin: 0 auto;
	}
	.cloud-1 {
		width: 80px;
	}
	
	.cloud-2 {
		width: 140px;
	}
	.koliko-megabajta .normal-icon, .koliko-razgovora .normal-icon, .koliko-poruka .normal-icon {
		width: 70px;
		height: 80px;
	}
	.normal-icon img {
		width: 70px;
	}
	.normal-icon img.inactive {
		width: 70px;
	}
	/* --------- Slagalica 07-2020 ----------- */
	.mnstr-ovrl img {
		width: 170px;
	}
	.mnstr-box, .bags-box {
		width: 250px;
	}
	.bag-ovrl {
		right: -30px;
	}
	.mnstr-ovrl {
		top: -65px;
		right: -40px;
	}
	.mnstr-ovrl h4 {
		top: 20px;
	}
	.mini-title-img {
		width: 160px;
	}
}
