/*Developed By Jessfer Limbo (J.L) @2017 */
body{ font-size:12px; font-weight: 400; font-family: 'Noto Sans', sans-serif; color:#1e3267;  padding:0px; margin:0px; background: url(../images/background2.jpg) no-repeat center center fixed; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}

.flags img{@margin-left: 38%; border-radius: 50%;margin-top: 20px;}
.flags img:hover{z-index:0; @margin-top:15px;  -webkit-animation: bounce 1s infinite; -moz-animation: bounce 1s infinite; -ms-animation: bounce 1s infinite; animation: bounce 1s infinite;}
.flags{margin-top: 30px;position: absolute; bottom: 14%; right: 0; left: 0; text-align: center;width:100%;}
.flags div{letter-spacing: 3px; text-transform: uppercase; font-family: myriad pro; @background-color:rgba(0, 0, 0, 0.5); width: 100%; margin: 0 auto; border-radius: 5px; }
.flags .active img{  -webkit-animation: bounce 2s infinite; -moz-animation: bounce 2s infinite; -ms-animation: bounce 2s infinite; -o-animation: bounce 2s infinite; animation: bounce 2s infinite;}
#tagline{font-family: myriad pro;  letter-spacing: 3px; font-size: 75px; color: #fff; text-align: center; margin-top: 460px !important; background-color:rgba(0, 0, 0, 0.5); margin: 0 auto; width:52%; border-radius: 15px;}
#circleFlag{width: 200px; display: inline-block;}
#circleFlag img{width: 84px; }
#circleFlag label{color: #fff; font-size: 20px;}

@-webkit-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-webkit-transform: translateY(1);}
40% { -webkit-transform: translateY(-10px); }
60% { -webkit-transform: translateY(-10px); } }

@-moz-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-moz-transform: translateY(0); }
40% {-moz-transform: translateY(-10px); }
60% {-moz-transform: translateY(-10px); } }

@-o-keyframes bounce {
0%, 20%, 50%, 80%, 100% {-o-transform: translateY(0); }
40% {-o-transform: translateY(-10px); }
60% {-o-transform: translateY(-10px); } }

@keyframes bounce {
0%, 20%, 50%, 80%, 100% {transform: translateY(0); }
40% {transform: translateY(-10px); }
60% {transform: translateY(-10px); } }

#mobile{display: none ;}

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1440px) {

}

@media only screen and (max-width : 1280px) {
/*    #desktop{display: block;}
    #mobile{display: none ;}
}*/


/* Medium Devices, Desktops */

@media only screen and (max-width : 991px) {
/*    #mobile{display: block ;}
    #desktop{display: none;}*/
}

@media only screen and (max-width : 800px) {
    /*Mobile Styles*/
/*    #mobile{display: block;}
    #desktop{display: none;}*/
}

@media only screen and (max-width : 768px) {
/*    #mobile{display: block;}
    #desktop{display: none;}*/
    .flags div{width: 100%; }
    #tagline{width: 100%; border-radius: 0px;}
    body{background: url(../images/768bg.jpg) no-repeat center center fixed; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
}

@media only screen and (max-width : 480px) {
   #circleFlag{width: 103px;}
   #circleFlag label{font-size: 17px;}
   .flags{margin: 0 auto; bottom: 17%;}
    #tagline{font-size: 35px; margin-top: 158px !important;}
    #circleFlag img {width: 75px;}
    body{background: url(../images/440bg.jpg) no-repeat center center fixed; -webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;background-size: cover;}
}

@media only screen and (max-width : 320px) {
    
}