
@font-face{
 font-family: font; src: url(font/fonts/Aaargh.ttf);
 }
body{
 max-width: 1900px;margin:auto;  position:relative;
 background-color: #ffffff; 
 font-family: font; 
 color: rgb(5,116,182); 
 text-align: center;
 }
 h2{  margin-top:2.2em;font-size:1.5em;
 color:rgb(242,135,55)}
#c{
 color:black;
 }
 #fc,#fd,#fg{
 font-family:calibir;
 }
 h1{color:rgb(242,135,55);margin-right:1em;
 }
 #pl
 {width: 80%;
 height: auto; 
 max-width: 250px;
float:left; 
 margin: auto; padding: 1em; 
 background: white;
 
 }
  #pj
 {width: 60%;
 height: auto; 
 max-width: 180px;
float:left; 
 margin: auto; padding: 1em; 
 background: white;
 
 }
 input{
 background-color:white;
 border: 2px solid lightblue; 
 max-width: 300px; 
 font-family: font; 
 height: 48px; 
 text-align: center; 
 margin-top: 1em; 
 margin-bottom: 1em;
 color:rgb(5,116,182);
 font-weight:bold;
 }
 input::-webkit-input-placeholder{
 color:rgb(242,135,55) !important;
 font-weight:bold !important;font-size:1.6em !important;}
 input[type=submit]{
 background: rgb(242,135,55); 
 color: White;
 font-weight:bold;
 border:none;
 }h3{
top:0px; color:rgb(5,116,182);font-size:1.5em;
 }
 p{ margin-right:12em;margin-top:1em;color:rgb(242,135,55);}
 
 input[type=submit]:hover{
 background: white; 
 color: rgb(242,135,55);
 font-weight: bold;
 }
 a{text-decoration: none; 
 color: rgb(5,116,182);
 font-size:1.6em;
 }
 #movetxt {
    -webkit-animation: moving 20s infinite;
    animation: moving 20s infinite;
}
		
@-webkit-keyframes moving {
    from {-webkit-transform: translateX(0px);}
    to {-webkit-transform: translateX(1900px);}
	
}

@keyframes moving {
    from {transform: translateX(0px);}
    to {transform: translateX(1900px);}
}


@media screen and (max-width: 1200px) {
#movetxt {
    -webkit-animation: moving 20s infinite;
    animation: moving 20s infinite;
}
		
@-webkit-keyframes moving {
    from {-webkit-transform: translateX(0px);}
    to {-webkit-transform: translateX(1200px);}
	
}

@keyframes moving {
    from {transform: translateX(0px);}
    to {transform: translateX(1200px);}
}
h3{margin:1.6em;color:rgb(5,116,182);}	
h2 { font-size: 2em;}
input{margin-top: 1em; }
p{margin-right:6em;margin-top:3em;font-size:1.2em;}
h1{margin-top:1.5em;}
a{margin-top:1em;}
 input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
}

@media screen and (max-width: 1000px) {
 #movetxt {
    -webkit-animation: moving 20s infinite;
    animation: moving 20s infinite;
}
		
@-webkit-keyframes moving {
    from {-webkit-transform: translateX(0px);}
    to {-webkit-transform: translateX(1200px);}
	
}

@keyframes moving {
    from {transform: translateX(0px);}
    to {transform: translateX(1200px);}
}
h2{ top:0px;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.8em;max-width: 300px; }
p{margin-top:2em; margin-right:5em;font-size:0.7em;}
h1{margin-top:1.1em;}
a{margin-top:1em;font-size:0.8em;}
input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
#pl
 {max-width: 600px;padding: 2em; }
 #pj
 {max-width: 300px;padding: 2em; }
}

@media screen and (max-width: 825px) {
 
h2{top:0px;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.8em; }
p{margin-top:2em;margin-right:6em;}
h1{margin-top:1.1em;}
#pl
 {max-width: 350px;padding: 0.8em; }
#pj
 {max-width: 150px;padding: 0.5em; }
a{margin-top:1em; }
input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
 }
 
 @media screen and (max-width: 720px) {

h2{top:0px;font-size:0.5em;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.8em; }
p{margin-top:2em;margin-right:6em;}
h1{margin-top:1.1em;}
#pl
 {max-width: 350px;padding: 0.8em; }
#pj
 {max-width: 150px;padding: 0.5em; }
a{margin-top:1em; }
 }
 
 
@media screen and (max-width: 625px) {
 
h2{margin-top:1em;font-size:1em;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.8em; }
p{margin-top:2em;margin-right:2.6em;font-size:1em;}
h1{margin-top:1.1em;font-size:1.4em;}
a{margin-top:1em; }
input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
 }
  
@media screen and (max-width: 525px) {

h2{margin-top:2em;font-size:1.2em;right:3em;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.5em;max-width: 150px;}
input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
p{margin-top:2em;margin-left:1.2em;font-size:1em;}
h1{margin-top:1.1em;font-size:1.5em;}
a{margin-top:1em;font-size:1.2em;}
#pl
 {max-width: 250px;padding: 0.8em; }
#pj
 {max-width: 150px;padding: 0.5em; }
 }
 
 @media screen and (max-width: 465px) {

 h2{margin-top:2em;font-size:1.2em;right:3em;}
#pj
 {max-width: 120px;padding: 0.5em;top:0em; }
 }
 
@media screen and (max-width: 485px) {
h2{margin-top:2em;font-size:1.2em;right:3em;}
#pj
 {max-width: 105px;padding: 0.5em; }
 
 } 
 
 @media screen and (max-width: 425px) {
 
h2{margin-top:2em;font-size:1.2em;right:3em;}
h3{margin:1.4em;color:rgb(5,116,182);font-size:1em;}	
input{margin-top: 0.5em;max-width: 150px;}
input::-webkit-input-placeholder{color:rgb(242,135,55) !important;font-weight:bold;font-size:1.2em;}
p{margin-top:2em;margin-left:1.2em;font-size:1em;}
h1{margin-top:1.1em;font-size:1.5em;}
a{margin-top:1em;font-size:1.2em;}
#pl
 {max-width: 200px;padding: 0.8em; }
#pj
 {max-width: 120px;padding: 0.5em;top:0em; }
 
 }
 