/* 
    Document   : about_awards
    Created on : Jun 14, 2013, 5:08:38 PM
    Author     : Ping
    Description:
        Purpose of the stylesheet follows.
*/

root { 
    display: block;
}

.sidemenu {
    background: url(../img/sidemenu/network.png) no-repeat;
}

.content ul {margin-bottom: 16px;}

.content ul li {
    margin-left: 20px;
    margin-bottom: 5px;
}

.networkmap {
    position: relative;
    width: 1103px;
    height: 677px;
    margin-left: -436px;
    margin-top: -133px;
    background: url(../img/content/network.png) no-repeat;
}

.networkmap ul {
    list-style: none;
    margin-top: 207px;
}

.networkmap ul li img {
    position: relative;
    border: 4px #ffffff solid;
    vertical-align: top;
    margin: 0 1px;
}

.imagewallleft {
    float: left;
    margin-left: -294px;
}

.imagewallleft li #indonesia {margin-left: 60px;}

#malaysia, #uae, #indonesia, #turkey, #unknow1, #unknow2, #china, #iPadunknow1, #iPadunknow2, #iPadchina {height: 127px;}

#malaysiaL {
    position: absolute;
    display: block;
}

#uae {z-index: 2;}

#uaeL {
    position: absolute;
    display: block;
    margin-top: -199px;
    z-index: 1;
}

#indonesiaL {
    position: absolute;
    display: block;
}

#turkeyL {
    position: absolute;
    display: block;
    margin-top: -64px;
}

.imagewallright {
    float: right;
    margin-right: 17px;
    text-align: right;
}

.imagewallright li #china {margin-right: 57px;}
#iPadchina {margin-left: 57px;}

#unknow1L {
    position: absolute;
    display: block;
    margin-top: -64px;
}

#chinaL {
    position: absolute;
    display: block;
}

#unknow2L {
    position: absolute;
    display: block;
    margin-top: -64px;
}

.iPadimagewallright {display: none;}

#iPadunknow1L {
    position: absolute;
    display: block;
    margin-top: -64px;

    margin-top: -204px;
}

#iPadchinaL {
    position: absolute;
    display: block;
    margin-top: -64px;
    margin-left: 57px;

    margin-left: 240px;
}

#iPadunknow2L {
    position: absolute;
    display: block;
    margin-top: -64px;

    margin-left: 184px;
}

#next, #prev {
    display: inline-block;
    padding-top: 50px;
}

#next {padding-left: 18px;}
#prev {padding-left: 128px;}

#next img, #prev img {border: none; display: none;}

.networkmap ul li div {display: inline-block; vertical-align: top; position: relative;}

.networkmap ul li b {
    position: absolute;
    bottom: 0;
    padding: 5px 9px;
    background: rgba(255, 255, 255, 0.6);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99ffffff, endColorstr=#99ffffff)";
}

.networkmap ul.imagewallleft li b#uae_label {z-index: 2;}

.networkmap ul.imagewallleft li b {left: 1px; right: 1px;}
.networkmap ul.imagewallleft li b#indonesia_label {left: 60px; right: 1px;}
.networkmap ul.imagewallright li b#china_label {left: 1px; right: 58px;}
.networkmap ul.iPadimagewallright li b#iPadchina_label {left: 57px; right: 1px;}

@media only screen and (max-width : 768px) {
    .sidemenu {background-position: right;}
    .networkmap {width: 768px; margin-left: -315px; background-position: -122px;}
    .imagewallleft {margin-left: 0; display: block;}
    .imagewallright {display: none;}
    .iPadimagewallright {display: none; float: left;}
    #next img, #prev img {display: block;}
}

@media only screen and (max-width : 568px) {
    .networkmap {width: 100%; margin-left: 0; background-position: -300px center;}
    #malaysia, #uae, #indonesia, #turkey, #iPadunknow1, #iPadunknow2, #iPadchina {opacity: 0.2;}
    .content ul {margin-left: 10px; margin-right: 10px;}
}

@media only screen and (max-width : 480px) {
    .networkmap {background-position: -380px center;}
}

@media only screen and (max-width : 320px) {
    .networkmap {margin-top: 0; background-position: -122px -29px;}
    .networkmap ul {margin-top: 50px; margin-bottom: -5px; margin-left: 0;}
    .networkmap ul li img {display: none !important;}
    .networkmap ul li div img {display: block !important;}
    .iPadimagewallright {margin-top: 0 !important;}
    .imagewallleft li {display: inline-block;}
    .iPadimagewallright {display: block;}
    #next, #prev {display: none;}
    #malaysia, #uae, #indonesia, #turkey, #iPadunknow1, #iPadunknow2, #iPadchina {opacity: 1;}
}