﻿.ponudeItem
{
    float:left;
    width:42%;
    padding:0px 4% 80px 4%;
	min-height: 780px;
}

.ponudeItem a
{
	text-decoration:none;
}

.ponudeImage img
{
    width:100%;

}

.ponudeTitle
{
    font-family:Kaushan;
    font-size:40px;
    font-weight:bold;
}

.ponudeAbstract
{
    float:left;
    width:65%;
    margin-right:5%;
	padding-left:4px;
}

.ponudeDetail
{
    float:right;
    background-color:#003837;
    text-align:center;
    padding:4px 16px;
    font-size:20px;
    font-weight:bold;
    position:relative;
    max-width:80px;
    line-height:1.2;
}

.ponudeDetail img
{
    position:absolute;
    top:40px;
    left:8px;
}

.ponudaTitle
{
    font-family:Kaushan;
    font-size:48px;
    font-weight:bold;
    margin-bottom:24px;
}

#ponudaReservationContent
{
	text-align:center;
}

.ponudaReservationBoxTitle
{
    text-align:center;
    padding:48px 16px 16px 16px;
    font-family:Kaushan;
    font-size:20px;
}

.ponudaReservationBoxContent
{
    position:absolute;
    top:2px;
    left:2px;
    right:2px;
    bottom:2px;
    background:#fff;
}

.ponudaReservationBox
{
    float:left;
    background:linear-gradient(45deg, #ab6d22 0%, #fcca8d 20%, #cc8d29 50%, #ffe3c2 90%, #ab6e24 100%);
    width:23%;
    margin:0 1%;
    position:relative;
    height:320px;
}

.ponudaReservationBoxCalendar
{
    background-color:#003837;
    padding:24px 0;
    text-align:center;
    margin:0 -2px;
}

.ponudaReservationBoxCalendar img
{
    height:32px;
}

.ponudaCal
{
    position:absolute;
    top:0px;
    left:-2px;
	right:-2px;
}

.ponudaReservationLine
{
    background: linear-gradient(45deg, #ab6d22 0%, #fcca8d 20%, #cc8d29 50%, #ffe3c2 90%, #ab6e24 100%);
    height:1px;
    bottom:48px;
    position:absolute;
    width:40px;
    z-index:100;
    left:50%;
    transform:translateX(-50%);
}

.arrowPonudaCalendarUp 
{
    bottom: 96px;
}

.arrowPonudaCalendarDown
{
    bottom:16px;
}

.ponudaReservationOsobe input
{
    color:#003837;
    background-color:transparent;
    border:none;
    width:100%;
    text-align:center;
    font-size:32px;
    font-weight:bold;
    margin-top:48px;
    user-select:none;
    cursor:pointer;
}

.bottomImage
{
	text-align:right;
}

.ponudaReservationMonth
{
    position:relative;
}

.ponudaReservationMonth input
{
    color:#003837;
    background-color:transparent;
    border:none;
    text-transform:uppercase;
    width:100%;
    text-align:center;
    font-size:16px;
    margin-top:24px;
    user-select:none;
    cursor:pointer;
}

.ponudaReservationDay
{
    position:relative;
}

.ponudaReservationDay input
{
    color:#003837;
    background-color:transparent;
    border:none;
    width:100%;
    text-align:center;
    font-size:32px;
    font-weight:bold;
    user-select:none;
    cursor:pointer;
}

@media only screen and (max-width: 1200px)
{
	#ponudaReservationContent
	{
		padding-top:48px;
	}
	
	.reservationTitle
	{
		margin-bottom:32px;
	}
	
	.ponudaReservationBox
	{
		
	}
}

@media only screen and (max-width: 1024px)
{
	.ponudeTitle
	{
		font-size:32px;
	}
	
	.ponudeAbstract
	{
		float:none;
		width:90%;
		margin-right:0;
	}
	
	.ponudeDetail
	{
		margin-top:16px;
	}
}

@media only screen and (max-width: 800px)
{
	.ponudeItem
	{
		float:none;
		width:100%;
		padding:0px 0 80px 0;
	}
	
	.ponudeAbstract
	{
		float:left;
		width:65%;
		margin-right:5%;
	}
	
	.ponudeDetail
	{
		margin-top:0;
	}
	
	.ponudaReservationBox
	{
		width:46%;
		margin:16px 2%;
		position:relative;
	}
	
	.ponudaTitle 
	{
		font-size:40px;
	}
}

@media only screen and (max-width: 640px)
{
	.reservationTitle
	{
		font-size:28px;
	}
}

@media only screen and (max-width: 480px)
{
	.ponudeAbstract
	{
		float:none;
		width:90%;
		margin-right:0;
	}
	
	.ponudeDetail
	{
		margin-top:16px;
	}
	
	.reservationTitle .middleGoldenLine 
	{
		display:none;
	}
	
	.ponudaReservationBox
	{
		float:none;
		width:96%;
		max-width:280px;
		margin:32px auto;
	}
}