/*
	--------------------------
	Countries Styles
	--------------------------
*/

/*#region  General Content
--------------------------  */

    main > div > h1
        { padding-bottom: 1.25em; margin-bottom: 1.25em; border-bottom: dotted 2px #d1d1d3; }
    main > div > h1 span
        { font-weight: 100; }
    main > div > h1 span:before
        { content: "("; }
    main > div > h1 span:after
        { content: ")"; }
    main > div > h1 span.member
        { color: #3aaadc; }
    main > div > h1 span.observer
        { color: #f4785a; }
    main > div > h1 img
        { vertical-align: middle; margin-right: 0.5em; float: none; }

    main > div > aside
        { text-align: center; padding-bottom: 2.2em; margin-bottom: 2.2em; border-bottom: dotted 2px #d1d1d3; float: left; width: 100%; }
    main > div > aside ul
        { margin: 0; padding: 0; list-style-type: none; text-align: center; }
    main > div > aside ul li
        { float: left; width: 24%; margin-left: 1.33%; font-family: "museo-slab", arial, sans-serif; font-size: 1em; vertical-align: top; }
    main > div > aside ul li:first-child
        { margin-left: 0; }
    main > div > aside ul li img
        { max-height: 9.375em; margin-bottom: 1em; }
    main > div > aside ul li span
        { display: block; font-weight: 700; font-size: 1.375em; }

	main > div > figure
		{ padding: 0; margin: 0; }
    main > div > figure figcaption      
        { font-size: 1rem; color: #808285; }

    main > div > section.mi, main > div > section.mp, main > div > nav.clist
        { padding-top: 2.2em; margin-top: 2.2em; border-top: dotted 2px #d1d1d3;  }
    main > div > section.mi h1, main > div > section.mp h1, main > div > nav.clist h1
        { color: #3aaadc; margin-bottom: 0.9em; }
    main > div > section.mi table
        { width: 100%; margin: 0; padding: 0; }
    main > div > section.mi table td
        { padding: 0.25em 1em; }
    main > div > section.mi table td:first-child
        { width: 60%; padding-right: 2em; }
    main > div > section.mi table tr:nth-child(2n+1) td
        { background-color: #e6e7e8; }
    main > div > nav.clist ul
        { list-style-type: none; padding: 0; margin: 0; }

    /*#region  General Content Responsive */
        @media screen and (max-width: 1025px) {
            main > div > h1
                { line-height: 1.5em; }
        }
        @media screen and (max-width: 880px) {
            main > div > aside ul li
                { width: 49%; margin-left: 1%; }
            main > div > aside ul li:nth-child(2n+1)
                { margin-left: 0; clear: left; }
            main > div > aside ul li span
                { font-size: 1.25em; }
        }
        @media screen and (max-width: 795px) {
            main > div > h1
                { line-height: 1.75em; }
        }
        @media screen and (max-width: 580px) {
            main > div > h1
                { margin-bottom: 1em; padding-bottom: 1em; }
            main > div > aside
                { margin-bottom: 1.5em; padding-bottom: 1.5em; }
        }
        @media screen and (max-width: 500px) {
            main > div > h1
                { text-align: center; }
            main > div > h1 img
                { float: none; }
            main > div > aside ul li
                { display: block; width: 100%; }
            main > div > aside ul li:not(:last-child)
                { margin-bottom: 1.5em; }
        }
    /*#endregion */


/*#endregion */

/*#region  Links
--------------------------  */

    main nav.clist section
        { float: left; width: 100%; margin-bottom: 2.2em; padding-bottom: 2.2em; border-bottom: dotted 2px #d1d1d3; }
    main nav.clist section:last-child
        { border-bottom: none; margin-bottom: 0; padding-bottom: 0; }

    main nav.clist section img
        { float: left; margin-right: 2.2em; width: 4.7em; }

    main nav.clist section ul
        { list-style-type: none; margin: 0 0 0 7em; padding: 0; }

    main nav.clist ul li a
        { display: inline-block; padding-right: 2em; }
    main nav.clist ul li a[target="_blank"]
        {  background: transparent url(/_resources/files/icons/link-icon-black.png) no-repeat right center; }

    /*#region Links Responsive */
        @media screen and (max-width: 830px) {
			main nav.clist section ul
				{ margin-left: 4.8em; }
            main nav.clist section img
                { width: 2.5em; }

            main nav.clist section h2
                { margin: 0 0.5em 0.5em 0.5em 0; }

            main nav.clist ul
                { clear: left; margin-left: 4.7em }
        }
    /*#endregion */

/*#endregion */

/*#region  Filters
--------------------------  */

     div.fsp
        { padding-top: 2.2em; border-top: dotted 2px #d1d1d3; float: left; width: 100%; }

    nav.fltr
        { clear: both; float: left; width: 100%; }
    nav.fltr > ul
        { list-style-type: none; margin: 0; padding: 0; position: relative; float: left; width: 100%; }
    nav.fltr > ul > li
        { float: left; margin-right: 2%; width: 20%; font-family: "museo-slab", arial, sans-serif; color: #4b91b1; }
    nav.fltr > ul > li:first-child
        { font-weight: 700; padding: 0.25em 0; width: 30%; }
    nav.fltr > ul > li > a
        { background-color: #4b91b1; color:#fff; padding: 0.25em 0.5em; position: relative; font-weight: 100; display: block; text-align: center;
          -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
    nav.fltr > ul > li:hover > a, nav.fltr > ul > li.o > a
        { background-color: #ffa01d; color: #fff; z-index: 2; }
    nav.fltr > ul > li.o > a:after
        { content: " "; display: block; width: 1em; height:1em; background-color: #ffa01d; position: absolute; left: 50%; bottom: -0.5em; margin-left: -0.5em; opacity: 0.95; z-index: -1;
            -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }

    nav.fltr > div
        { float: left; width: 100%; height: 0; overflow: hidden; position: relative;
            -moz-transition: all ease-in-out 0.3s; -o-transition: all ease-in-out 0.3s; -webkit-transition: all ease-in-out 0.3s; transition: all ease-in-out 0.3s; }
    nav.fltr.o > div
        { height: 9em; margin-top: 1em; background-color: #fff; padding: 1em;
          -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
    nav.fltr > div ul
        { visibility: hidden; opacity: 0; float: left; width: 100%; list-style-type: none; margin: 0; padding: 0; position: absolute;
            -moz-transition: all linear 0.3s; -o-transition: all linear 0.3s; -webkit-transition: all linear 0.3s; transition: all linear 0.3s; }
    nav.fltr > div ul.o
        { visibility: visible; opacity: 1; position: static; }
    nav.fltr > div ul li
        { float: left; width: 25%; margin: 0; }
    nav.fltr > div ul li a
        { background-color: #e6e7e8; color: #4b91b1; padding: 0.25em 0.5em; display: block; text-align: center; font-weight: 100; margin-left: 0.5em; margin-bottom: 0.5em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
          -moz-transition: all 0.3s ease 0s; -o-transition: all 0.3s ease 0s; -webkit-transition: all 0.3s ease 0s; transition: all 0.3s ease 0s; }
    nav.fltr > div ul li:nth-child(4n+1) a
        { margin-left: 0; }
    nav.fltr > div ul li a:hover, nav.fltr > div ul li a.o
        { background-color: #ffa01d; color: #fff; }

   /*#region Links Responsive */
        @media screen and (max-width: 940px) {
            nav.fltr > div ul li a
                { font-size: 0.9em; }
        }
        @media screen and (max-width: 520px) {
            nav.fltr > ul > li
                { width: 30%; }
            nav.fltr > ul > li:first-child
                { width: 35%; }
            nav.fltr > ul > li:last-child
                { margin-right: 0; }

            nav.fltr.o > div
                { height: 15em; }

            nav.fltr > div ul li
                { width: 50%; }
            nav.fltr > div ul li:nth-child(4n+1) a
                { margin-left: 0.5em; }
            nav.fltr > div ul li:nth-child(2n+1) a
                { margin-left: 0; }
        }

        @media screen and (max-width: 450px) {
            nav.fltr > ul > li
                { width: 40%; }
            nav.fltr > ul > li:first-child
                { width: 100%; }
        }
    /*#endregion */

/*#endregion */