@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,400i,700,700i&subset=cyrillic,cyrillic-ext,latin-ext');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400i,600,600i&subset=cyrillic,cyrillic-ext,latin-ext');

header, footer, section {
  display:block;  
}

body {
  background:#eff1e3;
  font-family:"Open Sans", sans-serif;
  font-weight:400;
  padding:0px;
  margin:0 auto;  
}

.center {
 width:100%;
 margin:0px auto; 
 padding:0px;
 text-align:center;  
}

#header {
  background-color:#d53b6d;
  background-image:url(../images/white-pattern.png),url(../images/header-bgr.jpg);
  background-position:bottom left, center center;
  background-repeat:repeat-x, no-repeat;
  background-size:auto,cover;
  color:#ffffff;
  padding:120px 0px 0px 0px;
  text-align:center;  
}

#header h1 {  
  color:#ffffff;
  font-family:"Roboto Condensed", sans-serif;
  text-transform:uppercase;
  font-weight:700;
  font-size:75px;
  line-height:75px;
  margin:0px 0px 40px 0px;
  padding:0px;
}

#header p {  
  color:#ffffff;
  font-family:"Open Sans", sans-serif;
  font-weight:400;
  font-size:25px;
  margin:0px 0px 70px 0px;
  padding:0px;
}

#imgin {
  width:730px;
  clear:both;
  display:inline-block;
  margin-bottom:70px;  
}

#imgin a.img_1 {
  float:left;
  display:inline-block;
  width:214px; height:214px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  -ms-border-radius:50%;
  margin-right:40px;
  background-image:url(../images/img-1-normal.jpg);
  background-repeat:no-repeat;  
}

#imgin a.img_1:hover {
  background-image:url(../images/img-1.jpg);  
}

#imgin a.img_2 {
  float:left;
  display:inline-block;
  width:214px; height:214px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  -ms-border-radius:50%;
  margin-right:40px;
  background-image:url(../images/img-2-normal.jpg);
  background-repeat:no-repeat;  
}

#imgin a.img_2:hover {
  background-image:url(../images/img-2.jpg);  
}

#imgin a.img_3 {
  float:left;
  display:inline-block;
  width:214px; height:214px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  -ms-border-radius:50%;
  background-image:url(../images/img-3-normal.jpg);
  background-repeat:no-repeat;  
}

#imgin a.img_3:hover {
  background-image:url(../images/img-3.jpg);  
}

/* section intro*/
#main {
  padding:0px;
  color:#666666;  
}

#intro {
  background:#ffffff;
  margin:0px;
  padding:70px 20px 10px 20px;
  color:#666666;
  text-align:center;  
}

#intro h2{
  font-family:"Roboto Condensed", sans-serif;
  text-transform:uppercase;
  font-weight:700;
  font-size:28px;
  line-height:28px;
  margin:0px 0px 26px 0px;
  color:#aa3c79;  
}

#intro p {
  font-size:18px;
  line-height:auto;
  text-transform:none;
  margin:0px 0px 46px 0px;
   
}

a.button:link, a.button:visited,
a.button:active {
  border-radius:2px;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  border:0px;
  color:#ffffff;
  cursor:pointer;
  display:inline-block;
  font-weight:400;
  height:60px;
  line-height:60px;
  font-size:18px;text-align:center;
  padding:0px 42px;
  text-decoration: none;
  background:#df4664;
  background: -moz-linear-gradient(top, rgba(223,70,101,1) 0%, rgba(194,70,105,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(223,70,101,1)), color-stop(100%, rgba(194,70,105,1)));
background: -webkit-linear-gradient(top, rgba(223,70,101,1) 0%, rgba(194,70,105,1) 100%);
background: -o-linear-gradient(top, rgba(223,70,101,1) 0%, rgba(194,70,105,1) 100%);
background: -ms-linear-gradient(top, rgba(223,70,101,1) 0%, rgba(194,70,105,1) 100%);
background: linear-gradient(to bottom, rgba(223,70,101,1) 0%, rgba(194,70,105,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#df4665', endColorstr='#c24669', GradientType=0 );
  
}

a.button:hover {
 background:#c24669;
 background: -moz-linear-gradient(top, rgba(194,70,105,1) 0%, rgba(223,70,101,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(194,70,105,1)), color-stop(100%, rgba(223,70,101,1)));
background: -webkit-linear-gradient(top, rgba(194,70,105,1) 0%, rgba(223,70,101,1) 100%);
background: -o-linear-gradient(top, rgba(194,70,105,1) 0%, rgba(223,70,101,1) 100%);
background: -ms-linear-gradient(top, rgba(194,70,105,1) 0%, rgba(223,70,101,1) 100%);
background: linear-gradient(to bottom, rgba(194,70,105,1) 0%, rgba(223,70,101,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c24669', endColorstr='#df4665', GradientType=0 );
}

/* principles */

#principles {
  background-color:#f4f4f4;
  color:#666666;
  padding:90px 0px 0px 0px;
  text-align:center;
  
}

#principles  h2 {
  color:#2f2f2f;
  font-family:"Roboto Condensed", sans-serif;
  text-transform:uppercase;
  font-weight:700;
  font-size:32px;
  line-height:80px;
  margin:0px 0px 40px 0px;
  padding:0px;
  
}

#imgin2 {
  width:770px; clear:both;
  display:inline-block; margin-bottom:70px;  
}

#imgin2  a.img_1 {
  float:left;
  display:inline-block;
  height:230px; width:230px;
  margin-right:40px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  background:url(../images/img-2-1.jpg);
  background-repeat:no-repeat;
  
}

#imgin2  a.img_1:hover {
  opacity:0.5;  
}

#imgin2  a.img_2 {
  float:left;
  display:inline-block;
  height:230px; width:230px;
  margin-right:40px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  background:url(../images/img-2-2.jpg);
  background-repeat:no-repeat;
  
}

#imgin2  a.img_2:hover {
  opacity:0.5;  
}

#imgin2  a.img_3 {
  float:left;
  display:inline-block;
  height:230px; width:230px;
  border-radius:50%;
  -webkit-border-radius:50%;
  -moz-border-radius:50%;
  background:url(../images/img-2-3.jpg);
  background-repeat:no-repeat;
  
}

#imgin2  a.img_3:hover {
  opacity:0.5;  
}

/* sign up*/

#signup {
  background:#2f2f2f;
  color:#ffffff;
  padding:70px 0px;
  text-align:center;  
 }
#signup  h2 {
  font-family:"Roboto Condensed", sans-serif;
  text-transform:uppercase;
  font-weight:700;
  font-size:32px;
  color:#feeac7;
  margin:0px;
  padding:0px
  
}

#signup  p {
  font-family:"Open Sans", sans-serif;
  font-size:22px;
  line-height:22px;
  text-transform:none;
  color:#ffffff; font-style:italic;
  font-weight:400;
  margin:24px 0px;
  padding:0px;  
}

#signup  form {
  margin:0 auto;
  max-width:100%;
  color:#ffffff;  
}

#signup input {
  padding:5px 10px;
  font-size:24px;
  font-weight:400;
  font-family:"Open Sans", sans-serif;
  width:320px; color:#feeac7; 
  border-radius:2px;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;  
}

#signup input[type="submit"],
#signup input[type="reset"],
#signup input[type="button"],
#signup .button {
  box-shadow:none;
  border:0;
  background:#fc9b61;
  color:#2f2f2f;
  font-weight:400;
   border-radius:2px;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;  
  font-family:"Open Sans", sans-serif;
  width:200px; padding:4px 10px; height:50px;
}

#signup input[type="submit"]:hover,
#signup input[type="reset"]:hover,
#signup input[type="button"]:hover,
#signup .button:hover {
  background:#ee6d74;
  
}

#signup input[type="text"],
#signup input[type="password"],
#signup input[type="email"],
#signup select, #signup textarea {
  color:#feeac7;
  background:rgba(255,255,255,0.15);
  border:0px;  height:40px;width:320px;outline:none;
  
}

#signup input[type="text"]:focus,
#signup input[type="password"]:focus,
#signup input[type="email"]:focus,
#signup select:focus, #signup textarea:focus {
  box-shadow:inset 0 0 0 1px #ffffff;
  
}
