LOADING...

Preview

Pen ID
Unlock Campus Themeforest adv

 

Code

  
















 

    
  
  


Official_Logo_Completelywhite- best
X
Apply for BETA


Fill an email address and we will send for you the BETA version as soon as possible.


YOUR OPINION COUNTS.

Oview

In an overview

Freedom of expression is the primary right for a proper democracy, but we are so many, how do we listen to everyone? With Oview, we mean to encourage Civil participation, engagement and development of informed, unbiased public opinion on current and evolving events. Decision-making is to be based on the consideration of a wider scope of opinions. Oview can gather and display the aggregated wisdom of the crowd. Are you ready to voice your opinion? Come with us, let us show you how it works.

NEWS & CATEGORIES

VOTE

STATISTICS

ETHICS & VALUES

We act with integrity and show respect, we act with fairness. We are passionate about democracy and empowering people. We are accountable for what we do, and what we say. We are always open to discussions and suggestions. We like to keep things simple as much as possible. We are result oriented and goal driven. We care about the environment.

MISSION

A global online platform where opinions are created, acknowledged and transformed into universally accessible visualised data.

VISION

A civilisation that is inspired by the freely created opinions of the majority, which are backed up by unbiased information.

X
Apply for BETA


Fill an email address and we will send for you the BETA version as soon as possible.


YOUR OPINION COUNTS.

CSS
body {
  /* background-color: rgba(14, 127, 235, 0); blue */
  background-color: #F6F6F6;  /* shade of white */
  color: rgba(14,127,235,1); 
  font-family: 'Roboto';
  line-height: 26px;
}
.h2, .h3, h2, h3 {
    text-transform: uppercase;
    letter-spacing: 1px;
}

.h2, .h3, h2, h3 {
    font-weight: 600;
}

h3 {
    display: block;
    font-size: 1.17em;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;
}


p{
  color: #818181; /* grey */
  font-family: 'Roboto';
  
    display: block;
    -webkit-margin-before: 1em;
    -webkit-margin-after: 1em;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
  
  line-height: 26px;
  font-weight: 400;
  
}
.backgroundColorBlue {
  background-color: rgba(14,127,235,1) !important; /* color: blue */ 
}


.paddingLeftRightBlue {
  padding-left: 107px;
  padding-right: 107px;
}

.margins{
  margin-left: 110px;
  margin-right: 110px; 
}

.marginColorAlmostWhite{
  background-color: #F6F6F6 !important; 
}

#whiteMarginBottomOview{
  margin-bottom: 80px;
}

#paddingTopBottomBeta{
  padding-top: 300px;
  padding-bottom: 300px;
}

.backgroundColorGrey {
  background-color: rgb(95, 95, 95) !important; /* color: grey */ 
}

#paddingTopBottomPreFooter{
  padding-top: 30px;
  padding-bottom: 30px;
}



a.button{
    text-decoration: none;
}
#buttonBeta{color: rgba(14,127,235,1)}



/***********************************
 * Resoponsive images in pre-Footer *
***********************************/
.img-Sponsor {
max-width:100%;
height: auto;
}
/* For small devices (e.g. smartphones) */
@media (min-width: 220px) {
  .img-Sponsor {
    width: 64%;
  }
}
/* For medium devices (e.g. tablets) */
@media (min-width: 420px) {
  .img-Sponsor {
    width: 48%;
  }
}
/* For large devices (e.g. desktops) */
@media (min-width: 760px) {
  .img-Sponsor {
    width: 16%; /* 6 columns */
  }
}


/************************************************************
 * Slider-code for "News & categories", "Vote" and "Static" *
 ************************************************************/


/* News & Categories */
#slideshow1 {
  margin: 40px auto;
  position: relative;
  width: 190px;
  height: 400px;
  /* To see my box that includes the images 
  I can uncomment the next line */
  /*
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
  */
}
#slideshow1 > div { position: absolute; }


/* Vote */
#slideshow2 {
  margin: 40px auto;
  position: relative;
  width: 190px;
  height: 400px;
}
#slideshow2 > div { position: absolute; }


/* Statics */
#slideshow3 {
  margin: 40px auto;
  position: relative;
  width: 190px;
  height: 400px;
}
#slideshow3 > div { position: absolute; }


/* Main Slider - header */
#slideshowMain {
  margin: 40px auto;
  margin-bottom: 120px;
  position: relative;
  width: 287px;
  height: 575px;
  /*
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
  */
}
#slideshowMain > div { position: absolute; }


/* new for sliders
http://responsiveslides.com/

*/



/*************************** 
 * code for arrow, page-up *
****************************/
#return-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    /* I can add here some background-color */
    border: 1px solid white;

    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    -webkit-border-radius: 35px;
    -moz-border-radius: 35px;
    border-radius: 35px;
    display: none;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top i { /* inside arrow */
    color: #fff;
    margin: 0;
    position: relative;
    left: 16px;
    top: 13px;
    font-size: 19px;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
#return-to-top:hover {
    background:  white /*rgba(0, 0, 0, 0.9)*/;
}
#return-to-top:hover i { /* inside arrow */
    color: rgb(95, 95, 95); /* grey */
    top: 5px;
}

/* end of code for arrow, page-up*/




/************************** 
*                         *
* Apply for Beta - Button *
*                         *
**************************/

#abc {
width:100%;
height:100%;
opacity:.98;
top:0;
left:0;
display:none;
position:fixed;
background-color:#f6f6f6;
overflow:auto;
  
  z-index: 20; 
}

img#close {
position:absolute;
right:50px;
top:50px;
cursor:pointer;
}

div#popupContact {
    margin: auto;
    width: 50%;
    padding-top: 10%;
}

form {
max-width:700px;
min-width:50px;
padding:10px 50px;
border-radius:5px;
background-color:rgba( 14, 127, 235, 0.98 );
}

input[type=text] { }
#name { }
#email { }

textarea {
width:82%;
height:95px;
padding:10px;
resize:none;
margin-top:30px;
border:1px solid #ccc;
padding-left:40px;
font-size:16px;
margin-bottom:30px
}
#submit { }

span {
color:red;
font-weight:700
}

.buttonApply { /* style the button "Apply for BETA" */
    cursor:pointer;
    background-color: rgb(255, 255, 255);
    border: 3px solid rgb(255, 255, 255);
    border-radius: 48px;
    color: rgb(14, 127, 235);
    font-family: Roboto;
    font-size: 34px;
    font-weight: bold;
    padding: 26px 41px;
    text-decoration: none;
    cursor: pointer;
  
  margin-top: 40px;
}

.styleTitle{
  color: rgb(255, 255, 255);
  font-size: 2.2em;
}


JS
/* Slider-code for "News & categories", "Vote" and "Static" */

/* Source: 
https://css-tricks.com/snippets/jquery/simple-auto-playing-slideshow/
*/

$("#slideshow1 > div:gt(0)").hide();
setInterval(function() {
  $('#slideshow1 > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshow1');
}, 1500); //seconds


$("#slideshow2 > div:gt(0)").hide();
setInterval(function() {
  $('#slideshow2 > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshow2');
}, 1500); //seconds



$("#slideshow3 > div:gt(0)").hide();
setInterval(function() {
  $('#slideshow3 > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshow3');
}, 1500); //seconds


$("#slideshowMain > div:gt(0)").hide();
setInterval(function() {
  $('#slideshowMain > div:first')
    .fadeOut(1000)
    .next()
    .fadeIn(1000)
    .end()
    .appendTo('#slideshowMain');
}, 1500); //seconds


/* If we want slider to hover 
| we should follow this tutorial:
| http://responsiveslides.com/
| with this code: https://github.com/viljamis/ResponsiveSlides.js
| or see this example: http://everwebcodebox.com/sliders/responsive-slides.html
*/
 

/* js code for the arrow */
// ===== Scroll to Top ==== 
$(window).scroll(function() {
    if ($(this).scrollTop() >= 50) {        // If page is scrolled more than 50px
        $('#return-to-top').fadeIn(200);    // Fade in the arrow
    } else {
        $('#return-to-top').fadeOut(200);   // Else fade out the arrow
    }
});
$('#return-to-top').click(function() {      // When arrow is clicked
    $('body,html').animate({
        scrollTop : 0                       // Scroll to top of body
    }, 500);
});




/******************************************** 
*                                           *
* Apply for beta - functionality for button *
*                                           *
*********************************************/

// Validating Empty Field
function check_empty() {
if (document.getElementById('name').value == "" || document.getElementById('email').value == "" || document.getElementById('msg').value == "") {
alert("Fill All Fields !");
} else {
document.getElementById('form').submit();
alert("Form Submitted Successfully...");
}
}
//Function To Display Popup
function div_show() {
document.getElementById('abc').style.display = "block";
}
//Function to Hide Popup
function div_hide(){
document.getElementById('abc').style.display = "none";
}

Description

Replicate wordpress theme by this page: https://oviewapp.com/
Term
Wed, 12/27/2017 - 07:01

Related Codes

Pen ID
Pen ID
Pen ID
Square Adv