#p1 {
    left: 36%;
    top: 43.5%;
    transform: rotate(269deg);
}
#p2 {
    left: 51%;
    top: 44%;
    transform: rotate(89deg);
}
#p3 {
    left: 17%;
    top: 39%;
    transform: rotate(269deg);

}
#p4 {
    left: 33.5%;
    top: 43.5%;
    transform: rotate(89deg);
}
#p5 {
    left: 4%;
    top: 18%;
    transform: rotate(136deg);
}
#p6 {
    left: 15%;
    top: 7%;
    transform: rotate(264deg);
}
#p7 {
    left: 12.5%;
    top: 8%;
    transform: rotate(78deg);
}
#p8 {
    left: 6%;
    top: 20.5%;
    transform: rotate(321deg);
}
#p9 {
    left: 29%;
    top: 87%;
    transform: rotate(259deg);
}
#p10 {
    left: 30%;
    top: 6%;
    transform: rotate(90deg);
}
#p11 {
    left: 34.8%;
    top: 46%;
    transform: rotate(2deg);
}
#p12 {
    left: 32.5%;
    top: 6%;
    transform: rotate(276deg);
}
#p13 {
    left: 14.5%;
    top: 39%;
    transform: rotate(94deg);
}
#p14 {
    left: 15.4%;
    top: 36.4%;
    transform: rotate(160deg);
}
#p15 {
    left: 83%;
    top: 68%;
    transform: rotate(255deg);
}
#p16 {
    left: 26.5%;
    top: 87%;
    transform: rotate(115deg);
}
#p17 {
    left: 80.5%;
    top: 68.5%;
    transform: rotate(90deg);
}
#p18 {
    left: 52.8%;
    top: 46%;
    transform: rotate(339deg);
}
#p19 {
    left: 34.5%;
    top: 41%;
    transform: rotate(147deg);
}
#p20 {
    left: 53.5%;
    top: 43.4%;
    transform: rotate(272deg);
}

/*@media screen and (orientation: portrait) {
    #p1 {
        left: 50%;
        top: 35.5%;
        transform: rotate(4deg);
    }
    #p2 {
        left: 49.5%;
        top: 48%;
        transform: rotate(179deg);
    }
    #p3 {
        left: 55.5%;
        top: 17%;
        transform: rotate(3deg);
    
    }
    #p4 {
        left: 50.5%;
        top: 32%;
        transform: rotate(188deg);
    }
    #p5 {
        left: 77%;
        top: 5.5%;
        transform: rotate(210deg);
    }
    #p6 {
        left: 86.5%;
        top: 16%;
        transform: rotate(352deg);
    }
    #p7 {
        left: 85%;
        top: 12.5%;
        transform: rotate(154deg);
    }
    #p8 {
        left: 74%;
        top: 8.5%;
        transform: rotate(37deg);
    }
    #p9 {
        left: 6.5%;
        top: 30%;
        transform: rotate(358deg);
    }
    #p10 {
        left: 88%;
        top: 27%;
        transform: rotate(178deg);
    }
    #p11 {
        left: 46%;
        top: 33%;
        transform: rotate(114deg);
    }
    #p12 {
        left: 88%;
        top: 31%;
        transform: rotate(4deg);
    }
    #p13 {
        left: 55.5%;
        top: 13.5%;
        transform: rotate(179deg);
    }
    #p14 {
        left: 60%;
        top: 14.8%;
        transform: rotate(247deg);
    }
    #p15 {
        left: 26%;
        top: 79%;
        transform: rotate(354deg);
    }
    #p16 {
        left: 7%;
        top: 26%;
        transform: rotate(191deg);
    }
    #p17 {
        left: 25.5%;
        top: 75%;
        transform: rotate(178deg);
    }
    #p18 {
        left: 46%;
        top: 50.5%;
        transform: rotate(77deg);
    }
    #p19 {
        left: 54.5%;
        top: 33.2%;
        transform: rotate(234deg);
    }
    #p20 {
        left: 50%;
        top: 51.5%;
        transform: rotate(5deg);

    }
}*/