Untitled

<!DOCTYPE html>
<html>
<head>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>


        <style>
                #map {
                        width: 1440px;
                        height: 1024px;
                        position: absolute;
                        bottom: 0;
                }
                body { margin: 0; padding: 0; }
        </style>

    <!-- marker -->

<!-- map -->

        <script>

                window.onload = function () {
                        var latlng = new google.maps.LatLng(26.2867, 50.2086);


                        var styles = [
        {
                "featureType": "landscape",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 31.450980392156822
                        },
                        {
                                "gamma": 1
                        }
                ]
        },
        {
                "featureType": "road.highway",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 48.850980392156856
                        },
                        {
                                "gamma": 1
                        }
                ]
        },
        {
                "featureType": "road.arterial",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 38.65098039215684
                        },
                        {
                                "gamma": 1
                        }
                ]
        },
        {
                "featureType": "road.local",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 39.45098039215685
                        },
                        {
                                "gamma": 1
                        }
                ]
        },
        {
                "featureType": "water",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 39.45098039215685
                        },
                        {
                                "gamma": 1
                        }
                ]
        },
        {
                "featureType": "poi",
                "stylers": [
                        {
                                "hue": "#FF0300"
                        },
                        {
                                "saturation": -100
                        },
                        {
                                "lightness": 39.45098039215685
                        },
                        {
                                "gamma": 1
                        }
                ]
        }
];


    var myOptions = {
            zoom: 14,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: true,
            styles: styles
    };

    map = new google.maps.Map(document.getElementById('map'), myOptions);


    var myCenter = new google.maps.LatLng(26.2867, 50.2086);
    var myIcon = new google.maps.MarkerImage(
    "http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=%E2%80%A2|dE7222",
    new google.maps.Size(24,23),
    new google.maps.Point(0,0),
    new google.maps.Point(12,23)
    );


    var marker = new google.maps.Marker({position: myCenter, icon: myIcon, map: map});

}
        </script>
</head>

<body>
        <div id="map"></div>


</body>
</html>