@charset "UTF-8";
/* CSS Document */

* {
	margin:0;
	padding:0;
	box-sizing:border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
}

body {
	background-color:rgb(229,226,219);
	font-size:110%;
	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
	color:#4d4d4f;
}

#container {
	max-width:900px;
	margin:40px auto;
	padding:40px 30px 1px 30px;
	background-color:rgb(255,255,255);
}

#header {
	margin-bottom:80px;
	position:relative;
}

#header #logo {
	width:100%;
	max-width:564px;
}

h1 {
	font-size:130%;
	color:#fcb540;
	font-family:Arial, Helvetica, sans-serif;
	margin-bottom:4px;
}

h2, strong {
	font-family:Arial, Helvetica, sans-serif;
	font-size:120%;
	color:#fcb540;
}

strong {
	font-size:100%;
}

strong a {
	color:#fcb540;
}

p {
	line-height:150%;
	margin-bottom:40px;
}

a {
	color:#777;
}

a:hover {
	text-decoration:none;
}

ul {
	margin-left:2.5em;
	margin-bottom:40px;
}

li {
	margin-bottom:10px;
}

.mobile_img {
	width:100%;
	border: 15px rgb(229,226,219) solid;
}

.socialbtn {
	padding:5px;
	background-color: rgb(192,185,169);
	width:35px;
}

.socialbtn:hover {
	background-color:rgb(64,62,57);
	cursor:pointer;
}

#socialbox {
	position:absolute;
	bottom:0;
	right:0;
}

.continue img,
.back img {
	float:right;
	padding:10px 20px;
	background-color:rgb(252,181,64);
}

.continue img:hover,
.back img:hover {
	background-color:rgb(221,154,44);
	cursor:pointer;
}

.back img {
	float:left;
}

.half_L {
	float:left;
	width:49%
}

.half_R {
	float:right;
	width:49%
}

.block {
	overflow:auto;
	margin-bottom:40px;
}

.block ul {
	margin:0;
	list-style:none;
}

.block ul li, .connection a  {
	margin-top:10px;
	margin-bottom:0px;
	font-size:88%;
	color:#777;
	padding: 20px;
}

.block ul li {
	border: rgb(242,239,231) 4px solid;
	line-height:140%;
}

.connection a {
	background-color:rgb(229,226,219);
}

.connection a {
	display:block;
	color:#4d4d4f;
	font-size:100%;
	text-decoration:none;
}

.connection a:hover {
	background-color: rgb(192,185,169);
}

.connection .items a {
	margin:0;
	padding:10px 20px;
	font-size:85%;
}

.list_space strong {
	display:block;
	font-size:120%;
	margin-bottom:5px;
}

.responsive-iframe-container {
  /*  overflow: hidden; */
}


@media all and (min-width:900px) {
	
	body {
		background-color:background-color:rgb(229,226,219);
		background-image:url(../images/blur_bg.jpg);
		background-attachment:fixed;
	}
	
	#logo {
		width:564px;
	}
    
    .responsive-iframe-container iframe {
        width:840px;
        height:650px;
    }
}

@media all and (max-width:900px) and (orientation: portrait) {
    .responsive-iframe-container iframe {
        width:710px;
        height:700px;
    }
}

@media all and (max-width:900px) {
	
	#container {
		margin:0;
	}
}

@media all and (max-width:750px) {
	
	#socialbox {
		top:-40px;
	}
    .responsive-iframe-container iframe {
        width:540px;
        height:540px;
    }
}

@media all and (max-width:750px) and (orientation: landscape) {
    
    .responsive-iframe-container iframe {
        width:540px;
        height:540px;
    }

}

@media all and (max-width:550px) {
	
	#header {
		margin-bottom:40px;
	}
	
	.half_L {
		clear:both;
		width:100%
	}
	
	.half_R {
		clear:both;
		width:100%;
	}
	
	.mobile_space {
		margin-top:20px;
	}
	
	.back img, .continue img {
		width:120px;
	}
    .responsive-iframe-container iframe {
        width:300px;
        height:300px;
    }
}
