/*--------------------------------------------
    DRAGON STYLE
---------------------------------------------*/

/*
# replace bootstrap default colors

.btn-primary, .bg-primary, .text-primary {
    background-color: #FFA500; # For backgrounds
    border-color: #FFA500; # For borders
    color: #fff; # For text on primary background
}

.btn-primary:hover {
    background-color: #db7516; # For backgrounds
    border-color: #db7516; # For borders
}
*/

/*---------------------------------
	IMAGES
-----------------------------------*/

img {
	margin:0;
	padding:0;
	position:relative;
	zoom:1;
	vertical-align: bottom;
}

#logo-left, #logo-right {
    display: block; /* Makes sure the img behaves as a block-level element */
    height: 100vh;
    width: auto;
    max-height: 150px; /* Prevents the logo from becoming too large on wider screens */
    max-width: 100%; /* Prevents the logo from becoming too large on narrower screens */
    margin: 3%; /* Ensures no extra space around the logo */
}

#logo-right {
    margin-left: auto; /* Pushes the image to the right edge of its container */
}

#logo-left {
    margin-right: auto; /* Pushes the image to the left edge of its container */
}

/*---------------------------------
	UTILITY
-----------------------------------*/

.draco {
    line-height: 120%;
    font-family: david;
    font-size: 1.7em;
    color: orange;
    font-weight: bold; /* or use 700 */
}

.draco .draco-title {
    font-size: 1.7em;
    color: DeepSkyBlue;
}

h1 { line-height:160%; font-size:1.9em;color:darkblue; text-align:center; margin: 0}
h2.reg { line-height:130%; font-size:1.7em; color:black; margin: 0}
h2.draco { line-height:120%; font-family:david; font-size:1.7em; color:orange; padding-top:10px;}
h3 {
    line-height: 120%;
    font-size: 1.4em;
    color: darkblue;
    text-align: center;
    margin: 0
    }
h3.blk {
    font-size: 1.3em;
    color: black;
    text-align: right
    font-weight: bold;
    }
h3.orng {
    font-size: 1.3em;
    color: orange;
    text-align: right
    }

/*---------------------------------
	Index Buttons
-----------------------------------*/

.front_button {
	margin: 10px;
	width: 90%;
	float: center;
	text-align: center;
	background-color: orange;
	border: 4px orange double;
	padding: 5px;
	display:block;
	border-radius:10px
}

.front_button:hover {
	background-color:DeepSkyBlue;
	border: 4px #fff double;
	color:#fff;
}

.front_button span.title{
	font-family: tahoma;
	font-size: 1.6em;
	padding: 5px;
	margin: 0;
	display: block;
	width: 100%;
	color: black;
}

.front_button span.extend {
	font-family: arial;
	line-height: 1.3em;
	font-size: 1em;
	margin: 0;
	display: block;
	width: 100%;
	color: #484848	;
}

/*---------------------------------
	UTILITY
-----------------------------------*/

main {
	background-color: #fff;
	margin-top: 0%;
	margin-bottom: 1%;
	padding-top: 1%;
	padding-bottom: 1%;
	padding-right: 0%;
	border: 0px solid #000000;
}

.header-top-bar {
	text-align:center;
	background-color: black;
	border: 0px solid #000000;
}

body {
	background-color: #BFBFBF;
	margin: 0px;
	padding: 0px;
	font-size: 1.0em;
	font-family:Arial, Helvetica, sans-serif;
	color:#4f4f4f;
	line-height: 1.3em;
}

a {
	color: #0000FF;
	text-decoration: none;
	font-weight: bold;
	border: 0px;
}

a:link {
    text-decoration:none;
    color:Blue;
}

a:hover {
    color: #FF310D;
    text-decoration: none;
}

a.title {
	color: #5E5E5E;
	font-family: arial;
	font-size: 11pt;
	text-decoration: none;
	font-weight: bold;
}


.footer {
	color: black;
    line-height:150%;
	font-family: arial;
    text-align: center;
    font-size:0.8em;
}

.navbar {
	background-color: #E3B75B;
	border: 0px solid #000000;
	text-shadow: 0px 1px 0px white; /* Text shadow */
	position: sticky;
    top: 0;  /* Top position when in sticky mode */
    font-weight: bold;
	text-align: right;
    border: 0px solid #ccc;
    background: orange;
    background: linear-gradient(top,  #E6E025,  #FCA103);
    background: -ms-linear-gradient(top,  #E6E025,  #FCA103);
    background: -webkit-gradient(linear, left top, left bottom, from(#E6E025), to(#FCA103));
    background: -moz-linear-gradient(top,  #E6E025,  #FCA103);
    z-index: 1000;
    padding: 0;

    .navbar-nav {
        border: 0px solid #000000;
        text-align: center;

        a {
            color: black;
            font-weight: bold;
        }

        .nav-item {
            list-style-type: none;
            transition: background 0.5s ease; /* Transition effect */
            display: inline-block;
            top: 0;
            left: 0;
            zoom: 1;
            }

        .nav-item:hover {
            background:#f5f5f5;
            transition: background 0.5s ease; /* Transition effect */
            }

        .nav-item.active, .nav-item.active:hover .dropdown-item.active {
            background: rgb(122,188,255); /* Old browsers */
            background: -moz-linear-gradient(top, rgba(122,188,255,1) 0%, rgba(96,171,248,1) 44%, rgba(64,150,238,1) 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(122,188,255,1)), color-stop(44%,rgba(96,171,248,1)), color-stop(100%,rgba(64,150,238,1))); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top, rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top, rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* Opera11.10+ */
            background: -moz-linear-gradient(top, rgba(122,188,255,1) 0%,rgba(96,171,248,1) 44%,rgba(64,150,238,1) 100%); /* W3C */
            text-shadow: 0px -1px 0px rgba(0,0,0,0.2);

            a {
                color: white;
            }
            .dropdown-item {
                color: black;
            }
            .dropdown-item.nav-item.active {
                color: white;
            }
            }

        .dropdown-menu {
            border:1px solid #e5e5e5;
            text-align: right;
            background: #f5f5f5;
            color: #666;
            clear: both;
            margin: 0 0 40px 0;
            }
    }
