@font-face {
font-family: alef;
src: url('Alef-bold.ttf');
font-weight: bold;
}

@font-face {
font-family: alef;
src: url('Alef-regular.ttf');
font-weight: normal;
}

div {
display: block;
float: right;
}

#port {
height: inherit;
float: left;
margin: 0 0 0 50px;
}

.submit-button {
-webkit-appearance: none;
width: 50%;
display: block;
margin: 0 auto;
background: #012f63;
font-size: 18px;
color: white;
height: 25px;
}

header {
width: 950px;
height: 126px;
margin: 0 auto;
}

input, textarea {
border: 1px solid #999;
/*border-radius*/
-webkit-border-radius:3px;
   -moz-border-radius:3px;
        border-radius:3px;
padding-right: 8px;
margin: 15px 25px;
width: 200px;
font-size: 16px;
}

textarea {
height: 60px;
resize: none;
}

form {
text-align: right;
margin-top: 5px;
font-weight: normal;
}

div.main {
width: 100%;
float: right;
}

a {
text-decoration: none;
color: white;
}

body {
background:#fff url('bg.jpg') no-repeat fixed top;
/*background-size*/
-webkit-background-size:100%;
   -moz-background-size:100%;
     -o-background-size:100%;
        background-size:100%;
}

* {
margin: 0px auto; 
padding: 0px;
font-family: alef;
}

h1, .header {
font-size: 26px;
font-weight: bold;
}

#logo {
width: 400px;
float: right;
margin: 15px 5px;
display: block;
}

#tele {
float: left;
width: 50px;
height: 50px;
margin-top: 40px;
display: none;
}

#teleicon {
float: right;
margin-top: 45px;
margin-right: 150px;
font-size: 30px;
font-weight: bold;
}

section {
width: 950px;
background: none;
text-align: center;
color: white;
font-family: "Century Gothic";
font-size: 16px;
padding: 0;
}

article.box {
padding: 20px;
margin-top: 30px;
border: 1px solid #d6d6d6;
border-radius: 16px 0 16px 0;
color: black;
}

.box p {
color: black;
}

#R {
width: 575px;
float: right;
}

#L {
width: 275px;
float: left;
height: 387px;
}

h2 {
color: white;
text-align: right;
font-size: 20px;
}

div.text {
margin: 0 auto;
border-top: 1px solid rgba(199, 0, 0, 0.5);
padding: 10px;
box-sizing: border-box;
}

p {
color: white;
font-size: 1em;
font-weight: normal;
text-align: right;
}

#banner {
width: 950px;
}

#divider {
height: 23px;
margin: 0 0 5px 0;
background: #012f63;
width: 100%;
border-radius: 16px 0 0 0;
}

#banner img {
border-radius: 0 0 16px 0;
width: 950px;

border-bottom: 5px solid white;
border-left: 5px solid white;
}

.effect3
{
  -webkit-box-shadow: -10px 10px 10px -10px rgba(0, 0, 0, 0.4);  /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */
  -moz-box-shadow:    -10px 10px 10px -10px rgba(0, 0, 0, 0.4);  /* Firefox 3.5 - 3.6 */
  box-shadow:         -10px 10px 10px -10px rgba(0, 0, 0, 0.4); 
}

footer {
padding: 10px;
margin: 30px auto 0 auto;
background: #012f63;
width: 945px;
border-radius: 0 0 16px 16px;
float: right;
}

footer p {
	color: white;
text-align: center;
font-size: 24px;
}

/* clearfix */
.group:before,
.group:after {
  content: "";
  display: table;
}
.group:after {
  clear: both;
}

@media all and (max-width: 1300px) {
	p {font-size: 36px}
	h1, .header {font-size: 48px}
	header, section, #banner, #banner img, #R, footer {
		width: 100%;
	}
	#logo {	width: 80%; margin: 20px auto 0 auto; float: right; display: block;}
	#tele, #L {display: none;}
	#teleicon {display: none;}
	#divider {display: none;}
	#banner img {
	border-radius: 0;
	min-width: 100%;
	width: 950px;
	border: 0;
	}
	#banner {		overflow: hidden;}
	.effect3
	{
	  -webkit-box-shadow: none; 
	  -moz-box-shadow:    none;  
	  box-shadow:         none; 
	}
	article.box {
	width: 100%;
	padding: 0;
	margin-top: 30px;
	color: black;
	}
	footer, #port {-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box}
	article.box p {padding: 20px}
	footer {margin: 10px auto}
	#port {width: 20%; margin: 0 0 0 0; height: auto;}
}