@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500,700');

html
{
        min-width: 320px !important;
}

body
{
	min-width:320px !important;
	background-color:#eee;
	text-align:center;
}

.BitterCheck
{
        width:100%; max-width:92px; height:auto;
}

.BitterTitle
{
        font-size:48px;
	color:#ffffff;
}

.BitterItem
{
        font-size:32px;
	color:#553015;
}

.PageWrapper
{
	width:100%;
	height:auto;
	max-width:1000px;
	background-color:#fff;
	margin:0 auto;
}

.HeaderWrapper
{
	width:100%;
	display:inline-block;
	position:relative;
	z-index:2;
	background-color:#fff;
}

.MainWrapper
{
	width:100%;
	height:auto;
	display:inline-block;
	position:relative;
	margin-top:-80px;
	z-index:3;
}

.MainLeft
{
	width:50%;
	float:left;
	position:absolute;
	bottom:0;
	z-index:1;
}

img.MainLeft
{
	position:absolute;
	left:0;
	bottom:0;	
}

.MainRight
{
	width:50%;
	float:right;
	text-align:center;
	position:relative;
}

.FormContainer
{
	margin:0 auto;
	width:90%;
	border-radius:8px;
}

.FormWrapper
{
	width:100%;
	text-align:center;
}

.FormInner
{
	background-color:#67a921;
	margin:0 auto;
	padding:20px 20px 0 20px;
	border-top-right-radius:8px;
	border-top-left-radius:8px;
}

.FormButtonHolder
{
	width:100%;
	height:80px;
	background-color:#fff;
}

.ButtonLeft
{
        width:50%;
        float:left;
	text-align:center;
	vertical-align:middle;
	display:inline-block;
	height:100%;
	background-color:#fff;
}

.ButtonRight
{
        width:50%;
        float:right;
}

.ButtonContainer
{
	margin:0 auto;
        width:90%;
	background-color:#67a921;
	height:100%;
	border-bottom-right-radius:8px;
        border-bottom-left-radius:8px;
	text-align:center;
	padding-bottom:30px;
}

.ButtonWrapper
{
        width:100%;
        text-align:center;
}

.ButtonInner
{
        margin:0 auto;
        padding:10px 20px 20px; 20px;
}

input[type=button], input[type=submit]
{
	display:flex;
        align-items:center;
        justify-content:center;
	margin:0 auto;
	width:100%;
	height:60px;
	background-color:#f9c742;
	border-radius:8px;
	border:0;
	cursor:pointer;
	outline:none;
	-webkit-appearance:none;
	font-size:24px;
	font-weight:bold;
	color:#fff;
	text-transform:uppercase;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.3);
	font-family:'Roboto';
	text-align:center;
        display:inline-block;

}

input[type=button]:hover, input[type=submit]:hover
{
	background-color:#f6971f;
        -moz-transition:color .2s ease-in;
        -o-transition:color .2s ease-in;
        -webkit-transition:color .2s ease-in;
        transition: all .2s ease-in;
}

input.Main
{
	padding:10px;
	font-size:18px;
	height:40px;
	width:100%;
	margin-top:10px;
	border:1px solid #b7b7b7;
	outline:none;
	-webkit-appearance:none;
	color:#666;
	font-family:'Roboto';
}

textarea
{
	padding:10px;
	font-size:18px;
	height:100px;
	width:100%;
	margin-top:10px;
	border:1px solid #b7b7b7;
	outline:none;
	-webkit-appearance:none;
	font-family:'Roboto';
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
	color: #a8a8a8;
	opacity: 1; /* Firefox */
	font-family:'Roboto';
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
	color: #a8a8a8;
	font-family:'Roboto';
}

::-ms-input-placeholder { /* Microsoft Edge */
	color: #a8a8a8;
	font-family:'Roboto';
}

.MobileWrapper, .MobileForm, .MobileHeader
{
	display:none;
}


@media screen and (max-width: 900px)
{

	.MainWrapper, .FormButtonHolder, .HeaderWrapper
	{ 
		display:none;
	}

	.MobileWrapper, .MobileForm, .MobileHeader
	{
		display:inline-block;
	}

        .BitterCheck
        {
                width:100%; max-width:52px; height:auto;
        }

        .BitterTitle
        {
                font-size:24px;
        }

        .BitterItem
        {
                font-size:20px;
        }

}