body { height: 100%; }

body { margin: 0; font-family: Helvetica; font-size: 14px; box-sizing: border-box; }
body #qzad { margin: 0 auto; width: 100%; max-width: 640px; max-height: 520px; position: relative; box-sizing: border-box; margin-top: 40px; }
body #qzad .background { height: 100%; width: 100%; top: 0; left: 0; position: absolute; z-index: 0; background-image: url("../images/background_pc.jpg"); background-size: 100% auto; background-repeat: no-repeat; box-sizing: border-box; }
body #qzad .inner-border { border: 1px solid #969696; height: 0; width: 100%; position: absolute; padding-bottom: 81%; /* PADDING BOTTOM */ box-sizing: border-box; background-color: white; }
body #qzad .main-container { top: 1px; height: 0; padding-bottom: 79%; /* PADDING BOTTOM */ width: 94%; margin: 0 0 0 1px; position: relative; box-sizing: border-box; }
body #qzad .goa-background { height: 100%; width: 100%; top: 0; left: 0; position: absolute; z-index: 1; background-image: url("../images/goa.png"); background-size: 100% auto; background-repeat: no-repeat; box-sizing: border-box; }
body #qzad .map-container { width: 70%; height: auto; margin-top: 6.5%; left: 27%; position: absolute; display: inline-block; z-index: 2; }
body #qzad .map-container svg { height: 100%; width: 100%; }
body #qzad .map-container svg path { stroke: #FFFFFF; stroke-width: 2px; }
body #qzad .map-container svg .grey { fill: #E8E8E8; }
body #qzad .map-container svg .key-region:hover { cursor: pointer; }
body #qzad .map-container svg .south-coastal { fill: #d1573f; }
body #qzad .map-container svg .goa { fill: #3db7d3; }
body #qzad .map-container svg .madhya-pradesh { fill: #ddbc1b; }
body #qzad .map-container svg .uttar-bihar { fill: #6fd899; }
body #qzad .map-container svg .gujarat-rajasthan { fill: #53a1bc; }
body #qzad .map-container svg .west-bengal { fill: #f79469; }
body #qzad .map-container svg .north-east { fill: #3dc1c4; }
body #qzad .map-container svg .punjab { fill: #7f58b7; }
body #qzad .map-container .info { position: absolute; display: none; text-align: left; background-color: #E4E4E4; width: 200px; margin-left: -100px; margin-top: -75px; -webkit-box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -moz-box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -ms-border-radius: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -o-border-radius: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); }
body #qzad .map-container .info p { margin: 0; }
body #qzad .map-container .info .header { padding: 5px; color: white; }
body #qzad .map-container .info .header i { float: right; margin-top: 1px; }
body #qzad .map-container .info .header i:hover { cursor: pointer; }
body #qzad .map-container .info .body { padding: 10px; }
body #qzad .map-container .visible { display: block; }
body #qzad .map-container #south-coastal { top: 50%; left: 32%; }
body #qzad .map-container #south-coastal .header { background-color: #d1573f; }
body #qzad .map-container #north-east { top: 8%; left: 72%; }
body #qzad .map-container #north-east .header { background-color: #3dc1c4; }
body #qzad .map-container #punjab { top: 22%; left: 53%; }
body #qzad .map-container #punjab .header { background-color: #7f58b7; }
body #qzad .map-container #gujarat-rajasthan { top: 18%; left: 21%; }
body #qzad .map-container #gujarat-rajasthan .header { background-color: #53a1bc; }
body #qzad .map-container #uttar-bihar { top: 11%; left: 45%; }
body #qzad .map-container #uttar-bihar .header { background-color: #6fd899; }
body #qzad .map-container #madhya-pradesh { top: 27%; left: 35%; }
body #qzad .map-container #madhya-pradesh .header { background-color: #ddbc1b; }
body #qzad .map-container #west-bengal { top: 21%; left: 63%; }
body #qzad .map-container #west-bengal .header { background-color: #f79469; }
body #qzad .map-container #goa { top: 45%; left: 10%; }
body #qzad .map-container #goa .header { background-color: #3db7d3; }
body #qzad .map-container .triangle:after { content: ""; position: absolute; left: 75px; border-width: 30px 30px 0; border-style: solid; border-color: #E4E4E4 transparent; display: block; width: 0; }
body #qzad .map-container .triangle.left:after { top: 60px; left: -20px; bottom: auto; border-width: 20px 20px 20px 0; border-color: transparent #E4E4E4; }
body #qzad .map-container .ne-triangle:after { content: ""; position: absolute; left: 100px; border-width: 30px 30px 0; border-style: solid; border-color: #E4E4E4 transparent; display: block; width: 0; }
body #qzad .map-container #circle { height: 10%; width: 10%; border-radius: 50%; top: 69%; left: 6%; position: absolute; }
body #qzad .map-container #circle:hover { cursor: pointer; }

@media (max-width: 600px) { body { font-size: 12px; }
  body #qzad svg path { -webkit-tap-highlight-color: transparent; -moz-tap-highlight-color: transparent; -ms-tap-highlight-color: transparent; -o-tap-highlight-color: transparent; tap-highlight-color: transparent; }
  body #qzad .map-container #south-coastal, body #qzad .map-container #north-east, body #qzad .map-container #punjab, body #qzad .map-container #gujarat-rajasthan, body #qzad .map-container #uttar-bihar, body #qzad .map-container #madhya-pradesh, body #qzad .map-container #west-bengal, body #qzad .map-container #goa { top: 50%; left: 35%; }
  body #qzad .map-container .info { display: none; margin-left: -100px; margin-top: -75px; -webkit-box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -moz-box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -ms-border-radius: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); -o-border-radius: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); box-shadow: 7px 7px 5px 0px rgba(50, 50, 49, 0.25); }
  body #qzad .map-container .visible { display: inline-block; } }