@-ms-viewport{
    width: device-width;
    }
        
    body {

        background-color: white;
        
       
    }

    #first {


        border: 3px solid black;
        border-radius:20px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 120px;
        height:2700px; 
        align-items: center;
        justify-content: center;
        width: 95vw;
    }


    #titulos {

        background-image: url("FLAG4.jpg");
        background-size: contain;
        width: 90vw;
        height: 190px;
        border-radius: 20px;
        box-shadow: 0px 0px 15px lightgrey;
        margin: 0 auto;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        margin-top: -131px;

    }


    h1 {

        position: relative;
        font-weight: bold;
        color: black;
        -webkit-text-stroke: 0.7px black;
        margin-left: auto;
        margin-left: auto;
        text-align: center;
        font-size: 50px;
        padding-top: 18px;


    }

    h2 {
         
        position: relative;
        font-weight: bold;
        color: white;
        -webkit-text-stroke: 1px white;
        margin-left: auto;
        margin-right: auto;
        text-align: center;
        font-size: 34px;
        margin-top: -6px;

    }

    
    #CheckMark1 {

    position: absolute;
    height: 5vw;
    width: 5vw;
    /*margin-top: -99px;
    margin-left: 420px;*/

    
    }

    #p1 {

        font-size: 50px;
        width: 80vw;
        margin-top: 50px;
        margin-left: auto;
        margin-right: auto;
        text-align: center;    
       
    }

    #p2 {

        font-size: 45px;
        width: 80vw;
        text-align: center; 
        margin-left: auto;
        margin-right: auto;  
    }

    #notaimportante {

        color: red;
        text-decoration: underline;
        font-size: 45px;
            
        }

        #colon{

            color:red;
        }
    
        #importante {
    
            font-size: 14px;
            margin: 0 auto;
            text-align: center;
            width:700px;
            font-size: 45px;
            width: 80vw;
        }
    


    #svg {

        
        margin-left: auto;
        margin-right: auto;
        width:100vw;
        
        
    }

    

    #Departamento {

        font-weight: bolder;
    }


    #COL1318,
    #COL1416,
    #COL1414,
    #COL1412,
    #COL1413,
    #COL1417,
    #COL1421,
    #COL1316,
    #COL1314,
    #COL1317,
    #COL1415,
    #COL1397,
    #COL1401,
    #COL1315,
    #COL1420,
    #COL1422,
    #COL1427,
    #COL1424,
    #COL1426,
    #COL1423,
    #COL1425,
    #COL1403,
    #COL1407,
    #COL1406,
    #COL1404,
    #COL1408,
    #COL1400,
    #COL1402,
    #COL1405,
    #COL1399,
    #COL1283,
    #COL1415,
    #COL1398,
    #SanAndres {

        fill: grey;
    }

    #COL1318:hover,
    #COL1412:hover,
    #COL1421:hover,
    #COL1316:hover,
    #COL1420:hover,
    #COL1425:hover,
    #COL1283:hover,
    #COL1424:hover,
    #COL1283:hover,
    #COL1398:hover,
    #COL1401:hover,
    #COL1404:hover {
        
        
        cursor: pointer;
        fill: rgb(250, 218, 38);
    }


    #COL1416:hover,
    #COL1413:hover,
    #COL1317:hover,
    #COL1314:hover,
    #COL1422:hover,
    #COL1423:hover,
    #COL1407:hover,
    #COL1402:hover,
    #COL1408:hover,
    #SanAndres:hover {
        
        
        cursor: pointer;
        fill: blue;
    }

    #COL1414:hover,
    #COL1417:hover,
    #COL1315:hover,
    #COL1415:hover,
    #COL1426:hover,
    #COL1427:hover,
    #COL1403:hover,
    #COL1397:hover,
    #COL1400:hover,
    #COL1405:hover,
    #COL1406:hover {
        
        
        cursor: pointer;
        fill: red;

    }

    #COL1399 {

        fill: purple;
    }



    #tspan1444:hover,
    #tspan1478:hover {
        
        
        stroke: greenyellow;
        font-size: 25px;
        text-decoration: underline;


    }

    #tspan1445:hover {

        stroke: greenyellow;
        font-size: 25px;
        text-decoration: underline;



    }

    #tspan1446:hover,
    #tspan1454:hover,
    #tspan1456:hover,
    #tspan1462:hover,
    #tspan1464:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 20px;
        text-decoration: underline;


    }


    #tspan1447:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 25px;
        text-decoration: underline;


    }

    #tspan1448:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 30px;
        text-decoration: underline;


    }

    #tspan1449:hover,
    #tspan1455:hover,
    #tspan1460:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 25px;
        text-decoration: underline;


    }


    #tspan1450:hover,
    #tspan1451:hover,
    #tspan1461:hover,
    #tspan1463:hover,
    #tspan1465:hover,
    #tspan1476:hover,
    #tspan1476:hover,
    #tspan1477:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 16px;
        text-decoration: underline;

    }

    #tspan1452:hover,
    #tspan1453:hover,
    #tspan1457:hover,
    #tspan1458:hover,
    #tspan1459:hover,
    #tspan1466:hover,
    #tspan1467:hover,
    #tspan1468:hover,
    #tspan1469:hover,
    #tspan1470:hover,
    #tspan1471:hover,
    #tspan1472:hover,
    #tspan1473:hover,
    #tspan1474:hover,
    #tspan1475:hover {

        stroke: greenyellow;
        fill: greenyellow;
        font-size: 20px;
        text-decoration: underline;

    }


    /*STYLE FOR dropdowns*/

    #linea {

        border-top: 3px dotted black;
        width: 80vw;
        margin-left: auto;
        margin-right: auto;
    }


    .dropbtn, .dropbtn1, .dropbtn2 {
        
        color: white;
        padding: 16px;
        font-size: 16px;
        border: none;
        cursor: pointer;
        width: 30vw;
        
    }

    #alldropdowns {
    
        width: 100vw;
        margin-top: 60px;
        margin-left: auto;
        margin-right: auto;

        
        
    }

    
    
    .dropbtn {

    
    background-image: url("FLAG8.jpg");
    background-size: contain;
    color:black;
    font-weight: bolder;
    box-shadow: 0px 0px 15px lightgrey; 
    font-size:35px;
    border-radius: 20px 20px 20px 20px;
    width: 30vw;
    margin-left: 2.5vw;
    min-height: 30px;
    border: 1px solid black;
    
    
    

    }

    
    
    .dropbtn1{
    
    
    background-image: url("FLAG9.jpg");
    background-size: contain;
    color: white;
    font-size:35px;
    font-weight: bolder;
    box-shadow: 0px 0px 15px lightgrey;
    border-radius: 20px 20px 20px 20px;
    width: 30vw;
    min-height: 30px;
    border: 1px solid black;
    



    }

    
    .dropbtn2 {

    
    background-image: url("FLAG10.jpg");
    background-size: contain;
    color:white;
    font-weight: bolder;
    box-shadow: 0px 0px 15px lightgrey;
    font-size:35px;
    border-radius: 20px 20px 20px 20px;
    width: 30vw;
    margin-right: 2.5vw;
    min-height: 30px;
    border: 1px solid black;
    


    }

      
    .dropdown {
        position: relative;
        display: inline-block;
        color:black;
        

    }


    .dropdown1 {
        position: relative;
        display: inline-block;
        /*margin-left: 600px;
        margin-right: auto;*/
        color:white;
       

    }

    .dropdown2 {
        position: relative;
        display: inline-block;
        /*margin-left: 600px;
        margin-right: auto;*/
        color:white;
        

    }

    /* Dropdown Content (Hidden by Default) */
    
    
    .dropdown-content

    {
        display: none;
        /*margin-left: 120px;*/
        position: absolute;
        background-color: #f9f9f9;
        min-width: 29.75vw;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        text-align: center;
        background-image: url("FLAG8.jpg");
        background-size: contain;
        color:black;
        font-weight: bolder;
        font-size: 40px;
        border-radius: 10px;
        margin-left: 2.5vw;
        border: 1px solid black;
    }

    .dropdown-content1 {

        display: none;
        position: absolute;
        max-width: 29.75vw;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        z-index: 1;
        text-align: center;
        background-image: url("FLAG9.jpg");
        background-size: contain;
        color:white;
        font-weight: bolder;
        font-size: 40px; 
        border-radius: 10px;
        border: 1px solid black;

    }

    .dropdown-content2 {

    
        display: none;
        position: absolute;
        max-width: 29.75vw;
        box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
        z-index: 1;
        text-align: center; 
        background-image: url("FLAG10.jpg");
        background-size: contain;
        font-weight: bolder;
        color:white;
        font-size: 40px;
        border-radius: 10px;
        border: 1px solid black;

    }


    /* Links inside the dropdown */
    
    .dropdown-content a
    {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }
    
    

    .dropdown-content1 a,
    .dropdown-content2 a
    {
        color: white;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

    /* Change color of dropdown links on hover */
    .dropdown-content a:hover,
    .dropdown-content1 a:hover,
    .dropdown-content2 a:hover,
    .bogotadc:hover
    
    {
        background-color: #f1f1f1;
        color: black;
        font-size: 40px;
        border-bottom: 3px solid black;
        border-top: 3px solid black;
    }

    /* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
    .show,
    .show1,
    .show2
    
    {
        display: block;
    }

    .dropbtn:hover, .dropbtn1:hover, .dropbtn2:hover {

        font-size: 37px;


    }

    .yellow:hover {

        color:black;
    }

    

    .yellow {

        color: yellow;

    }

    #botonregresar {

    position: absolute;
    margin-left: 1px;
    margin-top: 590px;
    text-decoration: none;
    color:black;
    
    }

    #regresar {

    height: 95px;
    width: 95px;
    margin-left: 2px;
    margin-top: 45px;

}

.little {

    font-size:35px;
}

#palobandera {

    display: block;
    float: center;
    height: 2vw;
    width: 82.5vw;
    margin-right: auto;
    border-bottom: 4.5px solid black;
    background-color:white;
    margin-bottom: 0px;
    margin-left: 7vw;   

}

a {

text-decoration: none;
color: black;

}


#spearhead1 {

    height: 20px;
    width: 40px;
    float: left;
    margin-top: -8px; 
    
    /*margin-left: 78px;
    margin-bottom: -27.69px;*/
    /*margin-left:
    margin-bottom:*/ 
}


#spearhead2 {

    height: 20px;
    width: 40px;
    float: right;
    margin-top: -8px;
       
}

.cundinamarca {

    font-size: 36px;
}

#bold {

    font-weight: bold;
}

.digital {
    
    margin-top: 50px;
    text-align: center;
    font-weight: bold;
    font-size: 25px;

}