Subversion Repositories oidinfo_new_design

Rev

Rev 16 | View as "text/css" | Blame | Compare with Previous | Last modification | View Log | RSS feed

  1.  
  2. /** Style for all pages **/
  3. #standards {
  4.     width: 100%;
  5.     margin-left: auto;
  6.     margin-right: auto;
  7.     /*background: #eee;*/
  8.     padding: auto;
  9.     display: block;
  10.     display: block;
  11.     height: auto;
  12. }
  13.  
  14. #what_is_an_OID, #table_faq, #table_search_in_basic_search, #management, #management_mobile, #reg_in_regexp, #oid_validate_mobile {
  15.     width: 100%;
  16.     margin-left: auto;
  17.     margin-right: auto;
  18.     /*background: #eee;*/
  19.     float: left;
  20.     padding: auto;
  21.     display: block;
  22.     height: auto;
  23. }
  24.  
  25. #allocated_in_index, #repository_in_index, #explanations_in_index {
  26.     width: 100%;
  27.     margin-left: auto;
  28.     margin-right: auto;
  29.     /*background: #eee;*/
  30.     float: left;
  31.     padding: auto;
  32.     display: none;
  33.     height: auto;
  34. }
  35.  
  36. #table_display_in_index, #extraction {
  37.     width: 100%;
  38.     margin-left: auto;
  39.     margin-right: auto;
  40.     /*background: #eee;*/
  41.     float: left;
  42.     /*padding: 0.5%;*/
  43.     display: block;
  44.     height: auto;
  45. }
  46.  
  47. #table_draw_in_index, #table_add_in_index, #warning_in_index, #number_oid_in_index, #table_answers_in_faq, #name-forms {
  48.     width: 100%;
  49.     margin-left: auto;
  50.     margin-right: auto;
  51.     margin-top: 2%;
  52.     /*background: #eee;*/
  53.     float: left;
  54.     /*padding: 0.5%;*/
  55.     display: block;
  56. }
  57.  
  58. #introduction {
  59.     width: 98%;
  60.     margin-left: auto;
  61.     margin-right: auto;
  62.     /*background: #eee;*/
  63.     float: left;
  64.     padding-left: 2%;
  65.     display: block;
  66. }
  67.  
  68. #manage_in_management {
  69.     width: 99%;
  70.     margin-left: auto;
  71.     margin-right: auto;
  72.     margin-top: 2%;
  73.     /*background: #eee;*/
  74.     float: left;
  75.     /*padding: 0.5%;*/
  76.     display: block;
  77. }
  78.  
  79. #errors, #errors_mobile {
  80.     width: 100%;
  81.     margin-left: auto;
  82.     margin-right: auto;
  83.     margin-top: 2%;
  84.     margin-bottom: 2%;
  85.     /*background: #eee;*/
  86.     float: left;
  87.     padding: auto;
  88.     display: block;
  89.     height: auto;
  90. }
  91.  
  92. #count_in_management, #country_in_management, #search_replace_in_management, #admin_in_management, #execute_in_management, #accounts_in_management,
  93. #display_example_in_management, #explanations_in_management, #registrant_chart_in_management {
  94.     width: 98%;
  95.     margin-left: auto;
  96.     margin-right: auto;
  97.     margin-top: 2%;
  98.     /*background: #eee;*/
  99.     float: left;
  100.     /*padding: 1%;*/
  101.     display: none;
  102. }
  103.  
  104. #main_actions_in_index {
  105.     width: 100%;
  106.     margin-left: auto;
  107.     margin-right: auto;
  108.     height: auto;
  109.     max-width: 750px;
  110.     min-width: 300px;
  111. }
  112.  
  113. .rounded {
  114.     -webkit-border-radius: 20px;
  115.     -moz-border-radius: 20px;
  116.     border-radius: 20px;
  117. }
  118.  
  119. #menu {
  120.     width: 98%;
  121.     margin-right: 2%;
  122.     margin-top: 2%;
  123. }
  124.  
  125.     #menu ul {
  126.         float: right;
  127.         padding: 0;
  128.         margin: 0;
  129.         list-style: none;
  130.         line-height: 35px;
  131.         text-align: left;
  132.     }
  133.  
  134.     #menu li {
  135.         margin: auto;
  136.         padding: 0;
  137.         background-color: black;
  138.         position: relative;
  139.     }
  140.  
  141.         #menu li a {
  142.             display: block;
  143.             background: #E28923 /*#6e6e6e*/;
  144.             color: #fff;
  145.             text-decoration: none;
  146.             width: 150px;
  147.             padding: 0px 15px 0px;
  148.             font-family: Arial, Helvetica, sans-serif;
  149.             font-size: 11px;
  150.             font-weight: bold;
  151.             line-height: 20px;
  152.         }
  153.  
  154.         #menu li img {
  155.             display: block;
  156.             background: #E28923 /*#6e6e6e*/;
  157.             width: 20px;
  158.             padding: 0px 15px 0px;
  159.         }
  160.  
  161.         #menu li a:hover {
  162.             background: #E23923;
  163.         }
  164.  
  165.     #menu ul li ul {
  166.         display: none;
  167.     }
  168.  
  169.     #menu ul li:hover ul {
  170.         display: block;
  171.     }
  172.  
  173.     #menu li:hover ul li {
  174.         float: none;
  175.     }
  176.  
  177.     #menu li ul {
  178.         position: absolute;
  179.     }
  180.  
  181. #header img {
  182.     display: inline;
  183.     float: left;
  184. }
  185.  
  186. #header_url_and_menu {
  187.     width: 100%;
  188. }
  189.  
  190. #header_menu_right {
  191.     float: inline;
  192.     margin-left: 32%;
  193.     position: absolute;
  194. }
  195.  
  196. #country-oid-general, #country-oid-title {
  197.     width: 100%;
  198.     margin-left: auto;
  199.     margin-right: auto;
  200.     margin-top: 2%;
  201.     /*background: #eee;*/
  202.     float: left;
  203.     /*padding: 0.5%;*/
  204.     display: block;
  205. }
  206.  
  207. #country-oid-check-list, #country-oid-template, #country-oid-RAS {
  208.     width: 100%;
  209.     margin-left: auto;
  210.     margin-right: auto;
  211.     margin-top: 2%;
  212.     /*background: #eee;*/
  213.     float: left;
  214.     /*padding: 0.5%;*/
  215.     display: none;
  216. }
  217. /** end style for all pages **/
  218.  
  219. .question {
  220.     font-weight: bold;
  221. }
  222.  
  223. /**Screen version**/
  224. @media (min-width: 768px) {
  225.  
  226.     #header_h1 {
  227.         color: rgb(226, 137, 34);
  228.         font-size: 35px;
  229.         font-weight: bold;
  230.         text-decoration: none !important;
  231.         float: none !important;
  232.     }
  233.  
  234.     #header_url {
  235.         float: left;
  236.         color: rgb(226, 137, 34);
  237.         font-size: 15px;
  238.         font-weight: bold;
  239.         margin-left: 10px;
  240.         display: inline-block;
  241.     }
  242.  
  243.     #header_mobile, #remote_button, #navigation {
  244.         display: none;
  245.     }
  246.  
  247.     #global_container {
  248.         display: block;
  249.     }
  250.  
  251.     #footer {
  252.         display: block;
  253.         clear: both; /* remove left-float */
  254.         position: relative;
  255.     }
  256.  
  257.     #main_actions_in_index {
  258.         display: block;
  259.     }
  260.  
  261.     #section_menu_in_management {
  262.         display: block;
  263.     }
  264.  
  265.     #manage_in_management {
  266.         display: block;
  267.     }
  268.  
  269.     #errors_mobile, #management_mobile {
  270.         display: none;
  271.     }
  272.  
  273.     #errors, #management {
  274.         display: block;
  275.     }
  276.  
  277.     #oid_validate_mobile {
  278.         display: none;
  279.     }
  280.  
  281.     #country-oid-title {
  282.         display: block;
  283.     }
  284.  
  285.     #country-oid-general {
  286.         display: block;
  287.     }
  288.  
  289.     body {
  290.         font-family: arial,sans-serif;
  291.     }
  292.     /***Page header***/
  293.     #global_container {
  294.         width: 800px;
  295.         max-width: calc( 100% - 20px );
  296.         height: auto;
  297.         margin: 0px auto 0px;
  298.         padding: 0px;
  299.         position: relative;
  300.     }
  301.  
  302.     #header {
  303.         width: 760px;
  304.         max-width: calc( 100% - 20px );
  305.         height: 110px;
  306.         background-color: #E9E9E9;
  307.         margin-top: 22px;
  308.         padding: 20px;
  309.         position: relative;
  310.         margin: 0px auto 0px;
  311.     }
  312.  
  313.         #header h1 {
  314.             position: relative;
  315.             font-weight: bold;
  316.             /*color: #fff;*/
  317.             font-size: 20px;
  318.             display: inline;
  319.             float: left;
  320.             margin: -10px 0px 0px 10px;
  321.         }
  322.  
  323.     #bg_menu {
  324.         width: 779px;
  325.         max-width: calc( 100% - 20px );
  326.         height: 41px;
  327.         background-color: #5f5f5f;
  328.         padding: 0px 21px 0px 0px;
  329.         margin-bottom: 14px;
  330.         position: relative;
  331.         z-index: 1200;
  332.     }
  333.  
  334.     #header_menu {
  335.         font-weight: bold;
  336.         font-family: Arial;
  337.     }
  338.  
  339.         #header_menu, #header_menu ul {
  340.             float: right;
  341.             padding: 0;
  342.             margin: 0;
  343.             list-style: none;
  344.             line-height: 35px;
  345.             text-align: left;
  346.         }
  347.  
  348.             html > body #header_menu li {
  349.                 border-right: 1px solid transparent;
  350.             }
  351.  
  352.             #header_menu li {
  353.                 float: left;
  354.                 border-right: 1px solid #fff;
  355.             }
  356.  
  357.             #header_menu a {
  358.                 display: block;
  359.                 background: #E28923;
  360.                 color: #fff;
  361.                 text-decoration: none;
  362.                 width: auto;
  363.                 padding: 0px 15px 0px;
  364.                 text-transform: uppercase;
  365.                 font-family: Arial, Helvetica, sans-serif;
  366.                 font-size: 14px;
  367.                 font-weight: bold;
  368.             }
  369.  
  370.             #header_menu img {
  371.                 display: block;
  372.                 background: #E28923 /*#6e6e6e*/;
  373.                 color: #fff;
  374.                 margin-left: 0px;
  375.             }
  376.  
  377.             #header_menu a:hover {
  378.                 background: #E23923;
  379.             }
  380.  
  381.             #header_menu img:hover {
  382.                 background: #E23923;
  383.             }
  384.     /*** Vertical menu ***/
  385.     .vertical_menu {
  386.         width: 190px;
  387.         margin-left: 73.5%;
  388.         height: 297px;
  389.         background-color: #E28923;
  390.         text-align: left;
  391.         border: 3px solid #E28923;
  392.     }
  393.  
  394.         .vertical_menu ul {
  395.             margin: 0;
  396.             padding: 0;
  397.             width: 100%;
  398.             list-style-type: none;
  399.         }
  400.  
  401.             .vertical_menu ul li a {
  402.                 text-decoration: none;
  403.                 color: #fff;
  404.                 padding: 10.5px 11px;
  405.                 background-color: #E28923;
  406.                 display: block;
  407.                 font-size: 17px;
  408.             }
  409.  
  410.                 .vertical_menu ul li a:hover, .vertical_menu ul li .current {
  411.                     background-color: #E23923;
  412.                 }
  413.     /*** banner ***/
  414.     #wrapper_carousel {
  415.         position: relative;
  416.         width: 60%;
  417.         height: 300px;
  418.         margin-bottom: 15px;
  419.         float: left;
  420.         margin-left: 7px;
  421.     }
  422.     /***************************/
  423.     a img {
  424.         border: none;
  425.     }
  426.  
  427.     #content h1 {
  428.         font-weight: bold;
  429.         font-size: 20px;
  430.     }
  431.  
  432.     #search {
  433.         position: absolute;
  434.         left: 700px;
  435.     }
  436.  
  437.     #google_translate {
  438.         display: inline;
  439.         float: right;
  440.     }
  441.  
  442.     #global_content {
  443.         width: 800px; /* 760 + 2*20 */
  444.         max-width: calc( 100% - 20px );
  445.         height: auto;
  446.         background-color: white;
  447.         padding: 20px;
  448.         position: relative;
  449.         margin: 0px auto 0px;
  450.         margin-top: 20px;
  451.     }
  452.  
  453.     #error400, #error403-404, #error500 {
  454.         width: 750px;
  455.         max-width: calc( 100% - 20px );
  456.         border: 3px solid #7f7f7f;
  457.         margin-left: auto;
  458.         margin-right: auto;
  459.         /*background: #eee;*/
  460.         float: center;
  461.         padding: 3px;
  462.         display: block;
  463.         height: auto;
  464.     }
  465.  
  466.     div.clear {
  467.         clear: both;
  468.     }
  469.  
  470.     .page_title {
  471.         font-weight: bold;
  472.         /*font-size: 18px;*/
  473.         font-size: 25px;
  474.         /*color: #FF5500;*/ color: #E28923;
  475.     }
  476.  
  477.     .page_subtitle {
  478.         font-weight: bold;
  479.         font-size: 20px;
  480.         /*color: #FF5500;*/ color: #E28923;
  481.     }
  482.  
  483.     .section_title {
  484.         font-size: 16px;
  485.         /*color: #FF5500;*/ color: #E28923;
  486.         font-weight: bold;
  487.     }
  488.  
  489.     .action_title {
  490.         font-size: 16px;
  491.         color: black;
  492.     }
  493.  
  494.     #global_in_index {
  495.         width: 101%;
  496.     }
  497.     /*** FAQ ***/
  498.     .question, .answer {
  499.         /*
  500.         margin-left: 30px;
  501.         padding: 10px;
  502.         display: block;
  503.         width: 95%;
  504.      */
  505.     }
  506.  
  507.     .answer {
  508.         display: block;
  509.         width: auto;
  510.         height: auto;
  511.     }
  512.     /*** Management page menu ***/
  513.     #menu_manage {
  514.         font-weight: bold;
  515.         font-family: Arial;
  516.     }
  517.  
  518.         #menu_manage, #menu_manage ul {
  519.             padding: 0;
  520.             margin: 0;
  521.             list-style: none;
  522.             line-height: 35px;
  523.             text-align: left;
  524.         }
  525.  
  526.             html > body #menu_manage li {
  527.                 border-right: 1px solid transparent;
  528.             }
  529.  
  530.             #menu_manage li {
  531.                 float: left;
  532.                 border-right: 1px solid #fff;
  533.             }
  534.  
  535.             #menu_manage a {
  536.                 display: block;
  537.                 background: #E28923 /*#6e6e6e*/;
  538.                 color: #fff;
  539.                 text-decoration: none;
  540.                 width: auto;
  541.                 padding: 0px 8px 0px;
  542.                 text-transform: uppercase;
  543.                 font-family: Arial, Helvetica, sans-serif;
  544.                 font-size: 14px;
  545.                 font-weight: bold;
  546.             }
  547.  
  548.                 #menu_manage a:hover {
  549.                     background: #E23923;
  550.                 }
  551.  
  552.     #section_menu_in_management {
  553.         width: 100%;
  554.         max-width: calc( 100% - 20px );
  555.         height: 41px;
  556.         /*background-color: #5f5f5f;*/
  557.         padding: 0px 21px 0px 0px;
  558.         margin-top: 20px;
  559.         margin-bottom: 14px;
  560.         position: relative;
  561.         z-index: 1200;
  562.     }
  563. }
  564. /* end of Screen media query */
  565.  
  566. /* mobile styles */
  567. @media (max-width: 767px) {
  568.  
  569.     #header_h1 {
  570.         color: rgb(226, 137, 34);
  571.         font-size: 18px;
  572.         font-weight: bold;
  573.         text-align: left;
  574.         text-decoration: none !important;
  575.         float: none !important;
  576.         text-indent: 0px !important;
  577.         margin-left: 0px !important;
  578.         margin-bottom: 5px !important;
  579.         margin-top: 5px !important;
  580.     }
  581.  
  582.     #header_url {
  583.         float: left;
  584.         color: rgb(226, 137, 34);
  585.         font-size: 15px;
  586.         font-weight: bold;
  587.         display: inline-block;
  588.         text-align: left;
  589.     }
  590.  
  591.     #mobile_version {
  592.         display: block;
  593.     }
  594.  
  595.     #global_container {
  596.         display: none;
  597.     }
  598.  
  599.     #footer {
  600.         display: none;
  601.     }
  602.  
  603.     #global_in_index {
  604.         display: none;
  605.     }
  606.  
  607.     #header_mobile {
  608.         background-color: #E9E9E9;
  609.     }
  610.  
  611.     #header_mobile {
  612.         /*Daniel: If it is "block", then the header will not be stretched on 540px width (Surface Duo) */
  613.         /*display: block;*/
  614.     }
  615.  
  616.     #remote_button {
  617.         display: block;
  618.     }
  619.  
  620.     #navigation {
  621.         display: block;
  622.     }
  623.  
  624.     #main_actions_in_index {
  625.         display: none;
  626.     }
  627.  
  628.     #section_menu_in_management {
  629.         display: none;
  630.     }
  631.  
  632.     #manage_in_management {
  633.         display: none;
  634.     }
  635.  
  636.     #errors_mobile, #management_mobile {
  637.         display: block;
  638.     }
  639.  
  640.     #errors, #management {
  641.         display: none;
  642.     }
  643.  
  644.     #oid_validate_mobile {
  645.         display: block;
  646.     }
  647.  
  648.     #country-oid-title {
  649.         display: none;
  650.     }
  651.  
  652.     #country-oid-general {
  653.         display: none;
  654.     }
  655.  
  656.     input[type=text] {
  657.         /* DM 02.04.2023 */
  658.         /*width: 50%;*/
  659.         max-width: 90vw; /* 90% viewport width */
  660.     }
  661.     /* wrapper styles */
  662.     .wrapper {
  663.         position: absolute;
  664.         min-height: 100vh;
  665.     }
  666.  
  667.     .wrapper_in_management {
  668.         position: absolute;
  669.         min-height: 150vh;
  670.     }
  671.  
  672.     .sidebar {
  673.         position: absolute;
  674.         top: 0;
  675.         width: 50vw;
  676.         min-height: 100vh;
  677.     }
  678.  
  679.     .wrapper {
  680.         transform: translateX(0) translateZ(0);
  681.         transition: transform .2s;
  682.         will-change: transform;
  683.     }
  684.  
  685.     .wrapper_in_management {
  686.         transform: translateX(0) translateZ(0);
  687.         transition: transform .2s;
  688.         will-change: transform;
  689.     }
  690.     /* Button deco */
  691.     [class^="nav-button"] {
  692.         display: block;
  693.         z-index: 1;
  694.         height: 3rem;
  695.         width: 3.5rem;
  696.         background-color: transparent;
  697.         background-image: linear-gradient(to right, #d38922, #d38922), linear-gradient(to right, #d38922, #d38922), linear-gradient(to right, #d38922, #d38922);
  698.         background-position: center top, center, center bottom;
  699.         background-repeat: no-repeat;
  700.         background-size: 3.5rem .6rem;
  701.         padding: 0;
  702.         outline: 0;
  703.         border: 0;
  704.         cursor: pointer;
  705.     }
  706.     /* here's goes the push left effect */
  707.     body:target .wrapper {
  708.         transform: translateX(50vw);
  709.     }
  710.  
  711.     body:target .wrapper_in_management {
  712.         transform: translateX(50vw);
  713.     }
  714.  
  715.     .nav-button-close,
  716.     body:target .nav-button-open {
  717.         display: none;
  718.     }
  719.  
  720.     .nav-button-open,
  721.     body:target .nav-button-close {
  722.         display: block;
  723.     }
  724.  
  725.     * {
  726.         box-sizing: border-box;
  727.     }
  728.  
  729.     html {
  730.         font-size: 62.5%;
  731.     }
  732.  
  733.     body {
  734.         margin: 0;
  735.         padding: 0;
  736.         color: #fff;
  737.         font-size: 1.3em;
  738.         font-family: arial, sans-serif;
  739.     }
  740.  
  741.     #navigation a {
  742.         color: #fff;
  743.         text-decoration: none !important;
  744.     }
  745.  
  746.     .wrapper {
  747.         background-color: white;
  748.         color: #333;
  749.         width: 100%;
  750.     }
  751.  
  752.     .wrapper_in_management {
  753.         background-color: white;
  754.         color: #333;
  755.         width: 100%;
  756.     }
  757.  
  758.     .sidebar {
  759.         padding-top: 1em;
  760.         background: #333;
  761.         color: #ddd;
  762.     }
  763.  
  764.     nav a {
  765.         display: block;
  766.         padding: .7em;
  767.         margin-bottom: 2px;
  768.         text-decoration: none;
  769.         background: rgba(255,255,255, 0.1);
  770.     }
  771.  
  772.     aside nav a:hover {
  773.         background-color: #d38922;
  774.     }
  775.  
  776.     .vertical_menu {
  777.         width: 30%;
  778.         height: 300px;
  779.         background-color: #E28923 /*#6e6e6e*/;
  780.         text-align: left;
  781.     }
  782.  
  783.         .vertical_menu ul {
  784.             margin: 0;
  785.             padding: 0;
  786.             width: 28;
  787.             list-style-type: none;
  788.         }
  789.  
  790.             .vertical_menu ul li a {
  791.                 text-decoration: none;
  792.                 color: #fff;
  793.                 padding: 10.5px 11px;
  794.                 background-color: #E28923 /*#6e6e6e*/;
  795.                 display: block;
  796.                 font-size: 17px;
  797.             }
  798.  
  799.                 .vertical_menu ul li a:hover, .vertical_menu ul li .current {
  800.                     background-color: #E23923;
  801.                 }
  802.  
  803.     #header_mobile {
  804.         width: 100%;
  805.     }
  806.  
  807.     #left_bouton {
  808.         margin-left: 0px;
  809.         width: 50%;
  810.     }
  811.  
  812.     #right_title {
  813.         width: 50%;
  814.         margin-left: 60%;
  815.         margin-top: 0px;
  816.     }
  817.  
  818.     .myButton {
  819.         -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
  820.         -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
  821.         box-shadow: inset 0px 1px 0px 0px #ffffff;
  822.         background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f9f9f9), color-stop(1, #e9e9e9));
  823.         background: -moz-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  824.         background: -webkit-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  825.         background: -o-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  826.         background: -ms-linear-gradient(top, #f9f9f9 5%, #e9e9e9 100%);
  827.         background: linear-gradient(to bottom, #f9f9f9 5%, #e9e9e9 100%);
  828.         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f9f9f9', endColorstr='#e9e9e9',GradientType=0);
  829.         background-color: #f9f9f9;
  830.         -moz-border-radius: 15px;
  831.         -webkit-border-radius: 15px;
  832.         border-radius: 15px;
  833.         border: 1px solid #dcdcdc;
  834.         display: inline-block;
  835.         cursor: pointer;
  836.         color: #666666;
  837.         font-family: Arial;
  838.         font-size: 13px;
  839.         font-weight: bold;
  840.         text-decoration: none;
  841.         text-shadow: 0px 1px 0px #ffffff;
  842.         width: 100%;
  843.         height: 100px;
  844.         text-align: center;
  845.         vertical-align: center;
  846.         padding-top: 10px;
  847.     }
  848.  
  849.         .myButton img {
  850.             height: 60px;
  851.             width: auto;
  852.         }
  853.  
  854.         .myButton:hover {
  855.             background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e9e9e9), color-stop(1, #f9f9f9));
  856.             background: -moz-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  857.             background: -webkit-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  858.             background: -o-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  859.             background: -ms-linear-gradient(top, #e9e9e9 5%, #f9f9f9 100%);
  860.             background: linear-gradient(to bottom, #e9e9e9 5%, #f9f9f9 100%);
  861.             filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e9e9e9', endColorstr='#f9f9f9',GradientType=0);
  862.             background-color: #e9e9e9;
  863.         }
  864.  
  865.         .myButton:active {
  866.             position: relative;
  867.             top: 1px;
  868.         }
  869.  
  870.     .section_title {
  871.         font-size: 12px;
  872.         /*color: #FF5500;*/ color: #E28923;
  873.         font-weight: bold;
  874.     }
  875.  
  876.     .action_title {
  877.         font-size: 12px;
  878.         color: black;
  879.     }
  880.  
  881.     html, body {
  882.         overflow-x: hidden;
  883.     }
  884.  
  885.     #question {
  886.         display: block;
  887.         width: 95%%;
  888.     }
  889.  
  890.     .page_title {
  891.         font-weight: bold;
  892.         font-size: 16px;
  893.         /*color: #FF5500;*/ color: #E28923;
  894.     }
  895.  
  896.     .page_subtitle {
  897.         font-weight: bold;
  898.         font-size: 12px;
  899.         /*color: #FF5500;*/ color: #E28923;
  900.     }
  901. }
  902. /* end of mobile media query */
  903. /*Dynamic web page*/
  904.  
  905. .note {
  906.     font-size: 11px;
  907. }
  908.  
  909. span.background_orange {
  910.     background-color: orange;
  911. }
  912.  
  913. .color_orange {
  914.     /*color: #FF5500;*/ color: #E28923;
  915. }
  916.  
  917. .color_red {
  918.     color: #ff0000;
  919. }
  920. /* End dynamic web page*/
  921.  
  922. #content_replace_in_search_replace {
  923.     width: 760px;
  924.     max-width: calc( 100% - 20px );
  925.     height: auto;
  926.     /*background-color: #5f5f5f;*/
  927.     padding: 20px;
  928.     position: relative;
  929.     margin: 0px auto 0px;
  930.     margin-top: 20px;
  931. }
  932.  
  933. #content_code_in_country_code {
  934.     width: 930px;
  935.     max-width: calc( 100% - 20px );
  936.     height: auto;
  937.     background-color: #5f5f5f;
  938.     padding: 20px;
  939.     position: relative;
  940.     margin: 0px auto 0px;
  941.     margin-top: 20px;
  942. }
  943.  
  944. #country-code {
  945.     width: 920px;
  946.     max-width: calc( 100% - 20px );
  947.     margin-left: auto;
  948.     margin-right: auto;
  949.     background: #eee;
  950.     padding: 3px;
  951.     display: block;
  952.     height: auto;
  953. }
  954.  
  955. #replace {
  956.     width: 98%;
  957.     margin-left: auto;
  958.     margin-right: auto;
  959.     /*background: #eee;*/
  960.     /*padding: 1%;*/
  961.     display: block;
  962.     height: auto;
  963. }
  964.  
  965. #advanced_search {
  966.     width: 98%;
  967.     margin-left: auto;
  968.     margin-right: auto;
  969.     /*background: #eee;*/
  970.     float: left;
  971.     /*padding: 1.2%;*/
  972.     display: block;
  973.     height: auto;
  974. }
  975.  
  976. /* Taken from the old design */
  977.  
  978. a:link {
  979.     text-decoration: underline;
  980.     /*font-family:Helvetica Neue Light 45;*/
  981.     /*color:#000000;*/
  982.     color: #803000;
  983. }
  984.  
  985. a:visited {
  986.     text-decoration: underline;
  987.     /*color:#000000;*/
  988.     color: #803000;
  989. }
  990.  
  991. a:hover {
  992.     text-decoration: underline;
  993.     background-color: #FFCC00;
  994. }
  995.  
  996. a:active :not(.nav-button-open) :not(.nav-button-close) {
  997.     text-decoration: underline;
  998.     background-color: #FFCC00;
  999. }
  1000.  
  1001. body {
  1002.     font-family: "Helvetica Neue Light 45",sans-serif;
  1003.     color: black;
  1004.     background-color: white;
  1005. }
  1006.  
  1007. /* Misc additions by Daniel */
  1008.  
  1009. a img:hover {
  1010.     /* TODO: when you hover over an image, you still can see yellow below the image?! */
  1011.     /* But the image has no background anymore (can be seen on the transparent OCaml logo */
  1012.     text-decoration: none !important;
  1013.     background-color: none !important;
  1014. }
  1015.  
  1016. .withborder {
  1017.     padding: 10px;
  1018.     border-style: solid;
  1019.     border-width: 1px;
  1020.     border-color: orange;
  1021. }
  1022.  
  1023. .myButton {
  1024.     text-decoration: none !important;
  1025.     color: #444444 !important;
  1026. }
  1027.  
  1028. #disclaimer_wrapper {
  1029.     width: 100%;
  1030.     text-align: center;
  1031. }
  1032.  
  1033. #disclaimer {
  1034.     /*padding-left: 10px;
  1035.     padding-right: 10px;
  1036.     width: 800px;
  1037.     max-width: calc( 100% - 20px );*/
  1038.     text-align: left;
  1039.     /*margin-left: auto;
  1040.     margin-right: auto;*/
  1041. }
  1042.  
  1043. #searchbox_mobile {
  1044.     width: 100%;
  1045. }
  1046.