body {width:100%; height:100%; margin:0 auto; padding:0; color:#666; font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif; line-height:1.8; font-size:18px; font-size-adjust: none; background:#f2f4f7;}
html, body {overflow-x: hidden;}
a {color:#3388cc; text-decoration:none; outline:none;}
a:hover {color:#3388cc; text-decoration:underline; border:none; outline:none;}
a img, a img:hover {outline:none; border:none;}
table {border:0; border-collapse:collapse;}
table td {padding:0px;} 
img {max-width:100%; height:auto;}
p.center {text-align:center;}
.clear {clear:both; overflow:hidden; height:0;}
.promo {margin:15px 0;}
 /*header*/
.header {width:100%; background:#3388cc; border-radius:0 0 50px 50px;}
.header_line {display:block; width:880px; overflow: hidden; margin:0 auto; padding:10px;}
.header_line a {outline:none; text-decoration:none; color:#fff;}
.header_line a:hover {outline:none; color:#fff;}
.header_left_mob {display:none; float:left; width:30px; height:30px; padding:8px; margin:8px 0 0; border-radius:50%; border:0; background:#fff; cursor:pointer; z-index:2;}
.header_left {float:left; padding:5px 0 0 0;}
.header_right {width:auto; margin-left:160px; padding:20px 0;}
.header span {font-size:38px; font-weight:600;}
 /*headermenu*/
.headermenu {width:100%; text-align:center;}
.header_menu {width:880px; margin:0 auto; padding:20px 0;}
.header_menu a {display:inline-block; text-decoration:none; padding:3px 16px; margin:6px 0.8%; color:#fff; background:#3388cc; border-radius:12px;}
.header_menu a:hover, .header_menu a:focus {color:#fff; background:#4fa3d9;}
/*search*/
.search {width:auto; height:40px; position:relative; padding:3px; border:1px solid #cccccc; background:#fff; border-radius:12px;}
.search input[type="text"] {width:100%; padding:0 85px 0 10px; border:none; outline:none; -webkit-appearance:none; -moz-box-sizing:border-box; box-sizing: border-box; font:17px roboto, arial; border-radius:12px;}
.search input[type="submit"] {position:absolute; top:0; right:0; width:75px; height:100%; cursor:pointer; outline:none; -webkit-appearance:none; border:0; background:#fff; border-radius:0 9px 9px 0;}
.search input[type='submit']:hover, .search input[type='submit']:active {color:#0066b3; background:#f2f4f7; border-radius:0 12px 12px 0;}
/*page*/
.page {width:100%; padding:0 0 30px 0;}
.page_center {width:800px; margin:0 auto; padding:10px 39px; background:#ffffff; border:1px solid #cccccc; border-radius:25px;}
/*navigation*/
.navigation {width:100%; font-size:16px;}
/*content*/
.content {width:100%; margin:0 auto;}
.content span {font-weight: bold;}
.content_slim {width:100%; padding:0 0 18px 0;}
/*footer*/
.footer {float:left; width:100%; padding:15px 0; text-align:center; line-height:1.8;}
.footer a {display:inline-block; padding:5px 10px;}
.footer span {font-weight:bold;}
/*link*/
.link {padding:0; margin:10px 0 0 0;}
.link a, .link a:hover {display:inline-block; margin:0 15px 0 0;}
.link_sm {text-align:center; background:#0066b3; background:#3388cc; font-size:16px; margin:10px 0 0 0; border-radius:12px;}
.link_sm a, .link_sm a:hover {display:inline-block; margin:6px; color:#fff;}
.link_block a {display:inline-block; color:#0066b3; text-align:center; text-decoration:none; padding:5px 10px; margin:10px 5px; background:#c8f1e0; border:2px solid #c8f1e0; border-radius:12px;}
.link_block a:hover {display:inline-block; background:#a0dcc4; text-decoration:none; border:2px solid #a0dcc4;}

/*button*/
input[type="submit"]:hover {display:inline-block; padding:8px 16px; color:#fff; text-decoration:none; font-size:18px; background:#4fa3d9; border:0; cursor:pointer;}
.button_line {width:100%; text-align:center; padding:10px 0;}
.button {display:inline-block; margin:10px; padding:8px 16px; color:#fff; background:#3388cc; font-size:18px; border:0; border-radius:12px;}
a.button {color:#fff; padding:3px 16px; text-decoration:none; background:#3388cc; border-radius:12px;}
a.button:hover {cursor:pointer; color:#fff; padding:3px 16px; text-decoration:none; background:#4fa3d9; border-radius:12px;}
a.button_grey {color:#fff; padding:8px 13px; text-decoration:none; background:#bababa; border:2px solid #999999; border-radius:12px;}
a.button_grey:hover {color:#fff; padding:8px 13px; text-decoration:none; background:#ababab; border:2px solid #999999; border-radius:12px;}

h1 {text-align:center; font-size:175%;}
h2 {font-size:150%;}
h3 {font-size:125%;}
/*new */
.new {float:left; width:100%;}
.new_block {float:left; width:42%; padding:2%; margin:2%;}
.new .new_block img {float:left; margin:0 0 10px 0; width:100%;}
.new .new_block h3 {text-align:center; font-size:110%;}
.new_sidebar {float:left; width:100%; padding:0 0 18px 0;}
.new_sidebar a {float:left; margin:7px 14px 7px 0;}
.new_sidebar_block {float:left;}
.new_sidebar .new_sidebar_block img {float:left; margin:10px 10px 10px 0; width:100%}
.new_sidebar .new_sidebar_block h3 {text-align:left; margin:0 0 0 10%; font-size:125%;}
/*popular */
.popular {float:left; width:280px; margin:0 0 18px 0; padding:20px 10px 0 10px;}
.popular_block {float:left; width:280px; padding:10px 0 0 0;}
.popular .popular_block img {float:left; margin:18px 10px 0 0; width:90px}
.popular .popular_block h3{text-align:left; margin:0 0 0 18px; font-size:125%;}
.popular_sidebar {float:left; width:100%; margin:0 0 18px 0; padding:5px 0 10px 0;}
.popular_sidebar a {float:left; margin:5px 18px 0 0;}
.popular_sidebar_block {float:left;}
.popular_sidebar .popular_sidebar_block img {float:left; margin:0 10px 0 0; width:90px}
.popular_sidebar .popular_sidebar_block h3{margin:0 0 0 10%; font-size:125%;}
/*tab*/
.tab {float:left; width:100%; margin:20px 0; border-top:1px solid #b2b8bf;}
.tab_line{float:left; width:100%; border-bottom:1px solid #b2b8bf;}
.tab_left{float:left; width:50%; padding:10px 0;}
.tab_right{float:left; width:50%; padding:10px 0; text-align:right;}
.tab_line_field {display:block; width:96%; font:normal 17px roboto, arial; padding:5px 2%; border:1px solid #cccccc; border-radius:12px; outline:none; -webkit-appearance:none;}

/*calendar*/
.cld {float:left; width:182px; text-align:center; margin:9px;}
.cld_tit {float:left; width:182px; text-align:center;}
.cld_bl {float:left; width:26px; text-align:center; padding:5px 0;}
.cld_fr {float:left; width:26px; text-align:center; padding:5px 0;}
.cld_fr a {color:#f56939; text-decoration:none;}
.cld_fr a:hover {color:#f56939; text-decoration:none; border:0; outline:none;}
.year{width:40px; text-align:center; color:#0066b3; border:1px solid #dedede;}

/*player*/
.player {width:100%; text-align:center;}
.button_but {float:left; display:block; border:none; outline:none; background:url(/img/off/button.jpg); width:130px; height:50px; text-align:center; color:#f8f8f8; text-decoration:none; cursor: pointer;}
/*orphus*/
#mistake {position:absolute; width:100%; margin:auto; top:0; left:0; z-index:100; background-image: url(/orphus/overlay.png);}
#m_window {position:absolute; width:500px; height:515px; overflow:auto; z-index:150;}
#m_frame {width:440px; height:495px; overflow:auto; border:0; background-image: url(/orphus/overlay.png);}
.orphus{width:390px; text-align:left; padding:0 20px;}
.orphus .field {width:390px; margin:10px 0 18px 0; font-size:16px;}

/*all test */
.test_question {float:left; width:100%; margin:10px 0;}
.test_answer {float:left; margin:10px 0 10px 18px;}

/*test all table */
table.test {width:100%; margin:0 0 10px 0;}
table.test  tr {border-bottom:#b2b8bf 1px solid;}
table.test  td {width:46%; padding:14px 0; padding:2%;}
.test_field {width:268px; padding:5px; margin:10px 0 0 0; border:1px solid #f5f5f5;}

table.calendar {width:598px; text-align:center;}
table.calendar  td {border:1px solid #f5f5f5;}
.cal_l_top {width:228px; padding:5px 0;}
.cal_l {width:218px; padding:5px 0 5px 10px; text-align:left;}
.cal_r {width:98px; padding:5px 0; border-left:1px solid #f5f5f5;}
.cal_dark {width:598px; border-top:1px solid #f5f5f5; border-bottom:1px solid #f5f5f5; background:#fdfdfd; margin:10px 0;}
.cal_dark_top {width:598px; color:#0066b3; border-top:1px solid #f5f5f5; border-bottom:1px solid #f5f5f5; background:#fdfdfd; margin:10px 0;}

/*test-iq*/
a.sel_sm {background-position:0px -40px; float:left; color:#f8f8f8; text-align:center; text-decoration:none; outline:none}
.content_iq {width:940px; margin:0 auto;}
.con_iq_left  {float:left; width:80px; height:35px; padding:0 0 0 30px; text-align:left; font-size:16px; color:#555555;}
.con_iq_right  {float:left; width:500px; height:35px;}
.con_iq_right_long  {float:left; width:100%; text-align:center; padding:30px 0;}

.block_iq_question_botton {float:left; width:100%; text-align:center;}
.block_iq_question_botton a {display:inline-block; background:#f5f5f5; width:56px; padding:5px 0; margin:5px; text-align:center; font:bold; text-decoration:none; border:2px solid #b2b8bf; border-radius:12px;}
.block_iq_question_botton a:hover {display:inline-block;}
.block_iq_question {float:left; width:100%; text-align:center;} 
.block_iq_answer {float:left; width:100%; text-align:center;}
.block_iq_answer a {display:inline-block; width:120px; height:120px;}
.block_iq_answer a:hover {display:inline-block; background-position:0 -120px;}

.clock {width:auto; padding:5px 10px; margin:20px 10px; background:#f5f5f5; border:1px solid #cccccc; border-radius:12px;}

.rating_iq {border-bottom:#b2b8bf 1px solid; padding:10px 0;}
.rating_iq_left {float:left; width:50px; }
.rating_iq_right {float:right; width:50px; text-align:right;}
.rating_iq_line {margin:0 50px;}
.inputname {width:193px;}
.selregion {width:200px;}

/*comments*/
.com {border-bottom:#b2b8bf 1px solid; padding:10px 0;}
.com_left {margin-right:100px}
.com_right {float:right; width:100px; text-align:center;}

/*sex-child-test*/
.determination {float:left; width:100%; text-align:center; margin:20px 0;}
.determination a {display:inline-block; outline:none; width:120px; padding:120px 0 0 0; margin:0 5%;}
.determination a:hover {text-decoration:none; outline:none; margin:0 5%;}

a#mather {background:url(/img/off/mother.png) no-repeat;}
a#father {background:url(/img/off/father.png) no-repeat;}
a#other {background:url(/img/off/other.png) no-repeat;}
a#mather:hover, a#other:hover, a#father:hover {background-position:-120px 0;}
a#matherselect {background:url(/img/off/mother.png) no-repeat; background-position:-120px 0;}
a#fatherselect {background:url(/img/off/father.png) no-repeat; background-position:-120px 0;}
a#otherselect {background:url(/img/off/other.png) no-repeat; background-position:-120px 0;}

.result{float:left; margin:18px 0; border:1px solid #dedede; background:#fdfdfd;}
.ovulation-month{float:left; text-align:center; height:220px; margin:10px 4px; padding:0 0 20px 0;border:1px solid #dedede;}
.ovulation-month .noinput{float:left; width:24px; height:18px;}
.ovulation-month .newcyrcl{float:left; color:#ff5550; width:24px; height:18px;}
.ovulation-month .normal{float:left; width:24px; height:18px; }
.ovulation-month .ovulation{float:left; color:#006600; width:24px; height:18px;}
.ovulation-month .niceday{float:left; color:#006600; width:24px; height:18px;}
.ovulation-month .month-title{border-bottom:1px solid #dedede; margin-bottom:5px; padding:5px 0;}


@media screen and (max-width:919px) {
.header {border-radius:0 0 25px 25px;}
.header_line {width:auto; padding:5px 20px; border-radius:0 0 25px 25px}
.headermenu {text-align:left;}
.header_menu {width:auto; padding:10px 20px;}
.page_center {width:auto; padding:20px; border:0; border-radius:0;}
.content {width:auto;}
.footer_center {width:auto; padding:10px 20px;}
}

@media (max-width:799px) {
.page {padding:0;}
.page_center {width:auto; padding:20px; border:0; border-bottom:1px solid #dedede; border-radius:0;}
a.block, a.block:hover {display:block;}
.footer_center {width:auto; padding:20px;}
}


@media (max-width:449px) {
.header_left {float:none; padding:5px 0 0 0;}
.header_right {margin:0; padding:0 0 20px 0;}
table.test  td {width:100%; padding:4% 0; display:block;}
.determination a, .determination a:hover {margin:0;}
}

@media screen and (max-width:279px) {
.header, .page {width:279px;}
}