php class Color private color public function __construct color this-

<?php

class Color
{
    private $color;

    public function __construct($color = "")
    {
    $this->color_ = $color;
    }
    public function getColor()
    {
        return $this->color_;
    }

    public function random()
    {
        $url_position = 0;
        $array_color = 'A,B,C,D,E,F';
        $array_color_length = trim($array_color);
        $array_color_length = strlen($array_color_length) - 2;
        $array_color_length /= 2;
        $array_color = explode(',', $array_color);
        while($url_position < $array_color_length + 1)
        {
        $templory[$url_position] = rand(0, 1);
        $url_position++;
        }

        $url_position = 0;
        foreach($templory as $val)
        {
        if($val== 1)
        {
        $val = $array_color[rand(0, $array_color_length)];
        }
        else
        {
        $val = rand(0, 9);
        }
        $templory[$url_position] = $val;
        $url_position++;
        }
        $templory = '#'.implode($templory);
        return $templory;
    }
}

$color = new Color();
$color_block = $color->random();
if(isset($_POST['download']) && !empty($_POST['download']))
{
$_SESSION['color'] = $_POST['download'];
}
?>
<div id="header" style="background-color: <?= $_SESSION['color'] ?>;">
    <a href="index.php" id="logo">Объединенный сервисный центр</a>
</div>
<script type="text/javascript">
    function rand(mi, ma) { return Math.random() * (ma - mi + 1) + mi; }
    function gebi(id) { return window.document.getElementById(id); }
    var Color = {
        cur_hex: null,
        generate: function(block) {
            var dec = [parseInt(rand(0, 255)), parseInt(rand(0, 255)), parseInt(rand(0, 255))], hex = [];
            for (var el in dec) {
                dec.hasOwnProperty(el) && (hex.push(dec[el].toString(16).length > 1 ? dec[el].toString(16) : '0' + dec[el].toString(16)));
            }
            hex = '#' + hex.join('');
            this.cur_hex = hex;
            gebi('color_block').style.backgroundColor = hex;
            gebi('info_block').innerHTML = hex;
        },
        change: function() {
            gebi('header').style.backgroundColor = Color.cur_hex;
        }
    };
</script>
<div id="body_info"><h2 style="font-family:Roboto Bold, Arial, sans-serif; text-shadow:0 -1px 1px #000;">Генератор цвета для фона</h2></div>
<a href="test.php" onclick="Color.generate(this); return !1;" id="click"><div id="color_block"></div></a><br />
<div id="info_block"><?= $color->random() ?></div>
<div id="body_info"><form method="post" action=""><button name="download" onclick="Color.change(); return !1;" value="<?= $color_block ?>" id="next" style="width:15%;">Загрузить оформление</button></form></div>




<style>
    #color_block{
        border:5px solid #FFF;
        box-shadow:0 0 10px 0 #222;
        text-align:center;
        margin:30px auto;
        width:100px;
        height:100px;
        border-radius:60px;
        background-color:<?= $color_block ?>;
    }
    #info_block{
        border-radius:2px;
        box-shadow:0 0 10px 0 #222;
        background-color:#FFF;
        padding:20px;
        width:80px;
        margin:auto;
        text-align:center;
        font-size:18px;
    }
    @charset "utf-8";
    /* CSS Document */
    body{
        background: url(http://koostydy.bget.ru/test/img/bg.png);
    }

    #header{
        margin:-8px -8px;
        padding:8px;
        width:100%;
        background-color:#232323;
        border-bottom:1px solid #707070;
        height: 50px;
    }

    #regg form input{
        width: 74%;
        padding-left: 10px;
        height: 35px;
        border: 1px solid #E9EAEB;
        margin-bottom: 10px;
    }

    #regg form button{
        outline:none;
        width: 50%;
        padding-left: 10px;
        height: 35px;
        border:0;
        color:#FFF;
        font-weight:900;
        border-radius:4px;
        border-top: 1px solid #FB8385;
        box-shadow:0 0 0 1px #CD2020;
        text-shadow:0 1px 0 #CD2020;
        background:linear-gradient(to top, #FF2828, #FB5B5E);
    }

    #brands{
        padding-top:10px;
        font-family: Arial, Helvetica, sans-serif;
        text-align:center;
        color:#333;
        font-size:14px;
        width:99.8%;
        height:100px;
        margin-left:1px;
        background-color:#FFF;
        margin-top:1px;
    }

    #counter_n{
        float:left;
        width:50%;
        color:#FFF;
        font-family:"Roboto Bold", Arial, sans-serif;
        font-size:20px;
        text-shadow:0 1px 0 #3181AA;
    }

    #counter{
        width:100%;
        height:70px;
        box-shadow:0 0 0 1px #3795C8;
        background: linear-gradient(to top, #3795C8, #49B4EC);
    }

    #num_count{
        color:#FFF;
        text-shadow:0 1px 0 #101010;
        margin-right:-6px;
        padding:10px;
        border-radius:4px;
        margin-left:10px;
        box-shadow:0 0 0 1px #101010;
        background: linear-gradient(to top, #242424, #3F3F3F);
    }

    #count_text{
        margin-right:10px;
        margin-top:8px;
        border-radius:4px;
        width:48%;
        float:right;
        height:50px;
        border:1px dashed #FFF;
    }

    #contant_keys{
        width:100%;
        height:145px;
        background-color:#F2F2F2;
        margin-left:1px;
        margin-top:1px;
    }

    #keys{
        font-family: Arial, Helvetica, sans-serif;
        font-size:14px;
        text-shadow:0 1px 0 #FFF;
        color:#333;
        width:24%;
        float:left;
        height:115px;
        border-right:1px solid #A9A9A9;
        margin-left:0.5%;
        margin-top:1%;
    }

    #keys ul li{
        float:left;
        list-style:none;
    }

    #lenta{
        text-shadow:0 1px 0 #2E78A0;
        padding-top:15px;
        position:relative;
        width:101.9%;
        margin-left:-1.9%;
        height:35px;
        box-shadow:0 0 0 1px #3795C8;
        background: linear-gradient(to top, #3795C8, #49B4EC);
    }

    #lenta:after{
        content: ' ';
        position: absolute;
        width: 0;
        height: 0;
        left: 0px;
        top: 100%;
        border-width: 5px 10px;
        border-style: solid;
        border-color: #276A8E #276A8E transparent transparent;
    }

    #contact_form{
        margin:0 auto;
        text-align:center;
    }

    #lenta_num{
        border-bottom:1px solid #266485;
        text-shadow:0 0 0 #FFF;
        padding:4px 9px 4px 10px;
        background-color:#FFF;
        color:#3FA4D9;
        font-weight:900;
        border-radius:20px;
        margin-right:10px;
        margin-left:10px;
    }

    #info{
        font-family: Arial, Helvetica, sans-serif;
        text-shadow:0 1px 0 #FFF;
        color:#333;
        width:100%;
        background-color:#F2F2F2;
        margin-top:1px;
        height:150px;
    }

    #sr_price{
        padding:20px 0 10px 0;
        width:100%;
        margin-left:-1px;
        background-color:#252525;
        color:#FFF;
        height:200px;
        text-align:center;
    }

    #block_price{
        margin-left:3%;
        text-shadow:0 1px #2E78A5;
        font-family: Arial, Helvetica, sans-serif;
        font-size:20px;
        border-radius:12px;
        padding:5px;
        width:30%;
        float:left;
        background-color:#3FA2D8;
        color:#FFF;
    }

    #scs{
        padding:5px;
        border-radius:8px;
        margin:0 auto;
        border:1px dashed #FFF;

    }

    @media screen and (max-width: 830px)
    {
        #counter_n{
            margin-top:12px;
            font-size:12px;
        }
        #count_text{
            width:45%;
        }
        #keys{
            font-size:11px;
        }
        #lenta{
            font-size:12px;
            width:103.6%;
            margin-left:-3.5%;
        }
        #info h2{
            font-size:18px;
        }
        #sr_price{
            padding:20px 0 55px 0;
        }
        #scs{
            width:93%;
        }
    }

    #screen{
        width:100%;
        background-color:#F2F2F2;
        height:200px;
    }

    #scren_block{
        margin-top:20px;
        width:22%;
        height:150px;
        float:left;
        border:1px dashed #666;
        border-radius:8px;
        margin-left:2.3%;
    }

    #scs button{
        font-size:12px;
        font-family: Arial;
        width: 50%;
        padding-left: 10px;
        height: 35px;
        border: 0;
        color: #FFF;
        font-weight: 900;
        border-radius: 4px;
        border-top: 1px solid #FB8385;
        box-shadow: 0 0 0 1px #CD2020;
        text-shadow: 0 1px 0 #CD2020;
        background: linear-gradient(to top, #FF2828, #FB5B5E);
    }

    #blue_fon{
        width:100%;
        height:310px;
        border-top:1px solid #8CD1FA;
        box-shadow:0 0 0 1px #3795C8;
        border-radius:8px 8px 0 0;
        background: linear-gradient(to top, #3795C8, #49B4EC);
    }

    #send_comments{
        outline:none;
        text-align:center;
        margin:0 auto;
        width:70%;
    }

    #send_comments textarea{
        outline:none;
        border:1px solid #CCC;
        width:60%;
        padding:10px 10px;
        font-family:"Roboto Bold", Arial, sans-serif;
        min-width:60%;
        max-width:60%;
        max-height:80px;
        min-height:50px;
        height:50px;
    }

    #logo{
        float:left;
        text-decoration:none;
        font-size:16px;
        margin-top:15px;
        margin-left:30px; /* very important for screen media */
        font-family:"Roboto Bold", Arial, sans-serif;
        color: #E5E5E5;
    }

    #logo:hover{
        color:#FFF;
    }

    #log_in{
        float:right;
        margin-top:18px;
        margin-right:20px;
        text-decoration: none;
        font-family:"Roboto Bold", Arial, sans-serif;
        font-size:12px;
        color:#E5E5E5;
    }
    #log_in:hover{
        color:#FFF;
        text-decoration:underline;
    }

    #body_info{
        color:#FFF;
        text-align:center;
        padding-top:40px;
        width:70%;
        padding-bottom:30px;
        margin:8px auto;
    }

    #log_in_block{
        padding-bottom:35px;
        padding-top:15px;
        text-align:center;
        border-radius:6px;
        margin:0 auto;
        color:#FFF;
        max-width:35%;
        min-width:250px;
    }

    #close_log_in_block{
        width:20px;
        padding-right:1px;
        padding-bottom:1px;
        height:20px;
        float:right;
        color:#E5E5E5;
        margin-top:-13px;
        margin-right:3px;
        border-radius:20px;
        border:1px solid #E5E5E5;
        font-family:"Roboto Bold", Arial, sans-serif;
    }

    #close_log_in_block:hover{
        color:#FFF;
        border:1px solid #FFF;
    }

    #close_log_in_block a{
        text-decoration:none;
    }


    #log_in_block span{
        margin-bottom:10px;
        font-family:"Roboto Bold", Arial, sans-serif;
        font-size:20px;
        color: #A6A6A6;
        letter-spacing:3px;
    }

    #log_in_block form input{
        outline:none;
        width:74%;
        padding-left:10px;
        height:35px;
        border:1px solid #E9EAEB;
        margin-bottom:10px;
    }

    #form_reg_area{
        padding-top:10px;
        font-family:"Roboto Bold", Arial, sans-serif;
        width:74%;
        max-width:74%;
        min-width:74%;
        max-height:100px;
        min-height:35px;
        padding-left:10px;
        height:25px;
        border:1px solid #E9EAEB;
        margin-bottom:10px;
    }

    #form_reg{
        width:74%;
        padding-left:10px;
        height:35px;
        border:1px solid #E9EAEB;
        margin-bottom:10px;
    }

    .form_reg{
        font-weight:100;
        font-family:"Roboto Bold", Arial, sans-serif;
        margin:0 auto;
        width:74%;
        padding-left:10px;
        height:35px;
        border:1px solid #E9EAEB;
        margin-bottom:10px;
    }

    #next2{
        margin-top:10px;
    }

    #next2 a{
        color: #444;
    }

    #next2 a:hover{
        text-decoration:none;
    }

    #next{
        outline: none;
        font-size: 12px;
        font-family:"Roboto Bold", Arial, sans-serif;
        width: 60%;
        padding-left: 10px;
        height: 40px;
        border: 0;
        color: #FFF;
        font-weight: 900;
        border-radius: 4px;
        border-top: 1px solid #FB8385;
        box-shadow: 0 0 0 1px #CD2020;
        text-shadow: 0 1px 0 #CD2020;
        background: linear-gradient(to top, #FF2828, #FB5B5E);
    }

    #log_in_block form button{
        outline:none;
        width: 50%;
        padding-left: 10px;
        height: 35px;
        border: 0;
        color: #FFF;
        font-weight: 900;
        border-radius: 4px;
        border-top: 1px solid #FB8385;
        box-shadow: 0 0 0 1px #CD2020;
        text-shadow: 0 1px 0 #CD2020;
        background: linear-gradient(to top, #FF2828, #FB5B5E);
        font-family:"Roboto Bold", Arial, sans-serif;

    }

    #reg_in{
        margin-right:10px;
        font-family:"Roboto Bold", Arial, sans-serif;
        font-size:12px;
        color:#555;
        text-decoration:none;
    }

    #reg_in:hover{
        text-decoration: underline;
    }

    #comments{
        background-color:#FFF;
        width:90%;
        max-width:90%;
        min-width: 90%;
        padding:20px;
        margin-top:20px;
        color:#333;
    }

    #name{
        font-weight:800;
        float:left;
    }

    #name1{
        text-shadow:0 1px 1px #FFF;
        float:left;
    }

    #dialog{
        width:60%;
        margin:10px auto;
    }

    #time{
        float:left;
        color:#999;
        margin-top:10px;
        font-size:10px;
    }

    #order_block{
        width:80%;
        padding:20px;
        background-color:#FFF;
        margin:0 auto;
    }

    #url{
        margin-right:20px;
        text-decoration:none;
        color:#555;
    }

    #url:hover{
        text-decoration:underline;
    }

    #preim1{
        font-family: Arial, Helvetica, sans-serif;
        float:left;
        width:30%;
        height:300px;
        color:#FFF;
    }

    #preim1 h3{
        text-shadow:0 1px 0 #000;
    }

    #preim1 ol li{
        text-shadow:0 1px 0 #000;
    }

    #preim2{
        font-family: Arial, Helvetica, sans-serif;
        float:right;
        width:35.1%;
        height:300px;
        color:#FFF;
    }

    #preim2 h3{
        text-shadow:0 1px 0 #000;
    }

    #preim2 ol li{
        text-shadow:0 1px 0 #000;
    }

    #screen_s{
        padding:5px 0 30px 0;
        font-family: Arial, Helvetica, sans-serif;
        color:#FFF;
        text-shadow:0 1px 0 #3181AA;
        width:99.9%;
        box-shadow:0 0 0 1px #3795C8;
        background: linear-gradient(to top, #3795C8, #49B4EC);
    }

    #shuter{
        border-top:1px solid #000;
        height:150px;
        width:100%;
        background-color:#232323;
        border-radius:0 0 8px 8px;
    }

    #table_form{
        box-shadow:0 0 10px 0 #222;
        font-family:Arial;
        background-color:#FFF;
        width:30%;
        padding:60px 20px 60px 20px;
        margin:0 auto;
        text-align:center;
        color:#000;
    }

    #table_form table{
        font-size:10px;
        font-weight:800;
        border-collapse:collapse;
        border:1px solid #000;
    }
</style>