/* Created by: Matt Kitson */
/* September 2020 */
/* style.css */

/* START OF General Page settings */
         body {
            font-family:Arial, Helvetica, sans-serif;
            font-size:1em;
            width: 97%;
            background: url(http://ev.xtrastep.co.uk/img/euorbackground.jpg);
            background-repeat: no-repeat;
            background-size: cover;
         }
         /* unvisited link */
         a:link {
           color: #000000;
           text-decoration: none;
         }

         /* visited link */
         a:visited {
           color: #454645;
           text-decoration: none;
         }

         /* mouse over link */
         a:hover {
           color: #454645;
           text-decoration: none;
         }

         /* selected link */
         a:active {
           color: #454645;
           text-decoration: none;
         }
        .error-message {
        font-size:11px;
        color:#cc0000;
        margin-top:10px
        }
/* END OF General Page settings */

/* START OF TITLE settings */
         .header-row {
            background-color:#333333;
            color:#FFFFFF;
            padding:3px;
            width: 99%;
            text-align: center;
         }
/* END OF TITLE settings */

/* START OF MENU settings */
         .menu-row {
            background-color:#ffffff;
            color:#000000;
            padding:3px;
            width: 99%;
            text-align: center;
            display: block;
            border: none;
         }
         .menu-item {
            background-color:#06ef27;
            color:#000000;
            padding:3px;
            margin-left: 2px;
            margin-right: 2px;
            margin-bottom: 5px;
            width: 150px;
            text-align: center;
             box-shadow: 10px 10px 8px #888888;
            display: inline-block;
         }
         .menu-item-admin {
            background-color:#06ef8a;
            color:#000000;
            padding:3px;
            margin-left: 2px;
            margin-right: 2px;
            width: 250px;
            margin-bottom: 5px;
            text-align: center;
            box-shadow: 10px 10px 8px #888888;
            display: inline-block;
         }
        .menu-items {
        align: center;
        width: 98%;
        display: block;
        border: none;
        }
        .menu-button {
        align: center;
        width: 100%;
        }
        .mobile-menu-top {
            background-color:#ffffff;
            color:#000000;
            padding:3px;
            width: 99%;
            text-align: center;
            display: none;
            border: none;
        }
        .mobile-menu-inner {
            background-color:#ffffff;
            color:#000000;
            padding:3px;
            width: 99%;
            text-align: center;
            display: block;
            border: none;
        }
/* END OF MENU settings */


/* START OF LAYOUT settings */
         .sub-header-row {
            background-color:#ffffff;
            color:#000000;
            padding:3px;
            width: 99%;
            text-align: center;
            border: none;
         }
         .entry-row {
            background-color:#FFFFFF;
            display: block;
            color:#000000;
            padding:2px;
            width: 99%;
            text-align: center;
            border: none;
		font-size: 1.2em;
         }
         .vote-row {
            background-color:#FFFFFF;
            display: block;
            color:#000000;
            padding:2px;
            width: 99%;
            text-align: center;
            border: none;
         }
        .content {
            width: 90%;
            margin-left: auto;
            margin-right: auto;
            overflow-x:hidden;
            border: none;
        }
/* END OF LAYOUT settings */

/* START OF FORMS settings */
        label {
            font-weight:bold;
            width:100px;
            font-size:1em;
        }
        input {
            font-size:1.2em;
        }
        select {
            font-size:1.2em;
        }


/* END OF FORMS settings */

/* START OF VOTE settings */

        .country-order {
            width: 20px;
            text-align: left;
            display: inline-block;
        }

        .country-name {
            width: 200px;
            text-align: left;
            display: inline-block;
        }

        .country-song {
            width: 200px;
            text-align: left;
            display: inline-block;
        }

        .country-singer {
            width: 200px;
            text-align: left;
            display: inline-block;
        }

        .my-vote {
            width: 100px;
            text-align: center;
            display: inline-block;
        }

        .allcountry-order {
            width: 50px;
            text-align: left;
            display: inline-block;
        }

        .allcountry-name {
            width: 250px;
            text-align: left;
            display: inline-block;
        }

        .allcountry-song {
            width: 400px;
            text-align: left;
            display: inline-block;
        }

        .allcountry-singer {
            width: 400px;
            text-align: left;
            display: inline-block;
        }

        .allmy-vote {
            width: 150px;
            text-align: center;
            display: inline-block;
        }

/* END OF VOTE settings */

/* START OF SCREEN RESOLUTION CHANGES */

/* desktop view start */
@media only screen and (min-width:992px) 
{
        .mobile-menu-top {
            display: none;
        }
        .mobile-menu-inner {
            display: block;
        }

}
/* desktop view end */

/* tablet view start */
@media only screen
and (min-width : 768px)
and (max-width : 991px) 
{


}
/* tablet view end */

/* mobile view start */
@media only screen
and (max-width : 767px)
{

         .entry-row {
            text-align: left;
            border: none;
         }
         .vote-row {
            text-align: center;
            border: none;
         }
        .country-order {
            width: 20px;
        }

        .country-name {
            width: 100px;
        }

        .country-song {
            width: 100px;
        }

        .country-singer {
            width: 120px;
        }

        .my-vote {
            width: 50px;
        }
 
}
/* mobile view end */

/* END OF SCREEN RESOLUTION CHANGES */



